* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: #15231f; background: #fffbf2; font-family: Inter, system-ui, sans-serif; line-height: 1.6; overflow-x: hidden; }
body::before { content: ""; position: fixed; inset: 0; z-index: 100; pointer-events: none; opacity: .15; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 260 260' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E"); }
a { color: inherit; text-decoration: none; }
.shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.topbar { background: #0f2d26; color: rgba(255,255,255,.86); font-size: 13px; }
.topbar .shell { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.navbar { position: sticky; top: 0; z-index: 20; background: rgba(255,251,242,.86); border-bottom: 1px solid rgba(21,35,31,.12); backdrop-filter: blur(18px); box-shadow: 0 14px 36px rgba(21,35,31,.06); }
.nav-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; letter-spacing: .04em; }
.brand-mark { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 8px; background: linear-gradient(135deg, #0f2d26, #2f6c55); color: #fff; font-family: "Playfair Display", serif; font-size: 25px; box-shadow: 0 14px 28px rgba(15,45,38,.22); }
.brand small { display: block; color: #60716a; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.nav-links { display: flex; align-items: center; gap: 18px; color: #354943; font-size: 14px; font-weight: 800; }
.nav-links a { position: relative; padding: 8px 0; }
.nav-links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: #d7962c; transform: scaleX(0); transform-origin: left; transition: transform .22s ease; }
.nav-links a:hover::after, .nav-links a[aria-current="page"]::after { transform: scaleX(1); }
.nav-links a[aria-current="page"] { color: #a9392f; }
.nav-tools { display: flex; align-items: center; gap: 10px; }
.mini-select { min-height: 44px; border: 1px solid rgba(21,35,31,.14); border-radius: 8px; padding: 10px 12px; background: #fbf7ee; color: #173d34; font-weight: 800; }
.btn { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; padding: 13px 20px; border-radius: 8px; border: 1px solid transparent; font-weight: 900; transition: transform .22s ease, box-shadow .22s ease; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 18px 36px rgba(21,35,31,.18); }
.btn-dark { background: #173d34; color: #fff; }
.btn-gold { background: linear-gradient(135deg, #d7962c, #f0c76a); color: #1f1608; }
.hero-mini { position: relative; min-height: 72vh; display: grid; align-items: center; padding: 92px 0; color: #fff; overflow: hidden; background: linear-gradient(100deg, rgba(11,31,26,.96) 0%, rgba(21,35,31,.78) 48%, rgba(21,35,31,.3) 100%), url("../images/prikaa-product-collage.png") center/cover; }
.hero-mini::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 130px; background: linear-gradient(0deg, #fffbf2, rgba(255,251,242,0)); }
.hero-mini .shell { position: relative; z-index: 1; }
.eyebrow { color: #f3c45f; font-size: 13px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { font-family: "Playfair Display", Georgia, serif; line-height: 1.04; letter-spacing: 0; }
h1 { max-width: 920px; margin-bottom: 20px; font-size: clamp(44px, 7vw, 96px); text-shadow: 0 18px 48px rgba(0,0,0,.28); }
h2 { margin-bottom: 18px; font-size: clamp(34px, 4.4vw, 56px); }
.lead { max-width: 760px; color: rgba(255,255,255,.88); font-size: clamp(18px, 2vw, 23px); }
section { padding: 88px 0; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: center; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.card { border: 1px solid rgba(21,35,31,.12); border-radius: 8px; background: rgba(255,255,255,.9); padding: 26px; box-shadow: 0 18px 46px rgba(21,35,31,.08); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
.card:hover { transform: translateY(-5px); border-color: rgba(215,150,44,.38); box-shadow: 0 28px 70px rgba(21,35,31,.14); }
.card p, .muted { color: #60716a; }
.product-card { overflow: hidden; padding: 0; background: #fffaf0; }
.product-card img { width: 100%; height: 260px; object-fit: cover; display: block; transition: transform .35s ease; }
.product-card:hover img { transform: scale(1.055); }
.product-body { padding: 22px; }
.tag { display: inline-block; margin-bottom: 12px; padding: 7px 10px; border-radius: 8px; background: rgba(215,150,44,.14); color: #8d5510; font-size: 12px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.price { display: flex; justify-content: space-between; gap: 10px; margin: 0 0 14px; padding: 10px 12px; border: 1px solid rgba(47,108,85,.18); border-radius: 8px; color: #173d34; font-size: 13px; font-weight: 900; }
.price span { color: #a9392f; text-transform: uppercase; letter-spacing: .08em; }
ul.clean { list-style: none; padding: 0; margin: 0; color: #60716a; }
ul.clean li { padding: 5px 0; }
.gallery { display: grid; grid-template-columns: 1.2fr .8fr 1fr; grid-auto-rows: 230px; gap: 14px; }
.gallery img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; box-shadow: 0 18px 48px rgba(21,35,31,.12); transition: transform .24s ease; }
.gallery img:hover { transform: scale(1.02); }
.gallery img:first-child { grid-row: span 2; }
.gallery img:nth-child(4) { grid-column: span 2; }
.contact-panel { display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; border-radius: 8px; background: #fff; box-shadow: 0 28px 80px rgba(21,35,31,.16); }
.contact-info { padding: 38px; color: #fff; background: linear-gradient(145deg, rgba(15,45,38,.96), rgba(23,61,52,.88)), url("../images/traditional-spices.jpg") center/cover; }
.form-wrap { padding: 34px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
label { display: grid; gap: 7px; color: #173d34; font-size: 13px; font-weight: 800; }
input, textarea, select { width: 100%; min-height: 48px; border: 1px solid rgba(21,35,31,.14); border-radius: 8px; padding: 12px 14px; font: inherit; background: #fbf7ee; }
textarea { min-height: 128px; resize: vertical; }
.full { grid-column: 1 / -1; }
footer { padding: 28px 0; color: rgba(255,255,255,.72); background: #101c18; font-size: 13px; }
footer .shell { display: flex; justify-content: space-between; gap: 18px; }
.floating-whatsapp { position: fixed; right: 18px; bottom: 18px; z-index: 30; width: 62px; height: 62px; display: grid; place-items: center; border-radius: 50%; background: #1fa855; color: #fff; box-shadow: 0 18px 42px rgba(21,35,31,.3); font-size: 24px; font-weight: 900; }
@media (max-width: 980px) { .nav-links { display: none; } .grid-2, .grid-3, .contact-panel { grid-template-columns: 1fr; } .gallery { grid-template-columns: 1fr 1fr; } .gallery img:first-child, .gallery img:nth-child(4) { grid-column: auto; grid-row: auto; } }
@media (max-width: 640px) { .shell { width: min(100% - 28px, 1180px); } .topbar .shell { justify-content: center; text-align: center; } .topbar span:last-child { display: none; } .nav-tools { gap: 6px; } .nav-tools .btn { display: none; } .hero-mini { min-height: 68vh; padding: 68px 0; } .grid-3, .gallery, .form-grid { grid-template-columns: 1fr; } footer .shell { display: grid; text-align: center; } }