:root{--cream:#fcf3eb;--white:#fff;--coral:#fc8786;--deep:#9c5353;--pale:#fce8e4;--ink:#4a3b38;--soft:#7a655f;--max:1120px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:300 16px/1.7 Jost,sans-serif}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--deep);outline-offset:3px}
.site{position:sticky;top:0;z-index:10;background:rgba(252,243,235,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--pale)}
.nav{max-width:var(--max);margin:auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:10px;font:italic 1.1rem 'Cormorant Garamond',serif}
.brand img{height:62px}
.nav-tools{display:flex;align-items:center;gap:22px}
.home-link,.menu>button{font:500 .95rem Jost,sans-serif;letter-spacing:.05em;color:var(--soft);border:0;background:none;cursor:pointer;padding:.6em 0}
.home-link:hover{color:var(--deep)}
.menu{position:relative}
.menu>button::after{content:'⌄';font-size:1rem;margin-left:.35em}
.menu ul{display:none;position:absolute;right:0;top:100%;margin:0;padding:8px;min-width:260px;max-height:calc(100vh - 96px);overflow-y:auto;list-style:none;background:#fff;border:1px solid var(--pale);border-radius:12px;box-shadow:0 12px 28px -16px rgba(74,59,56,.5)}
.menu.open ul,.menu:focus-within ul{display:block}
.menu li a{display:block;padding:.6em .75em;border-radius:8px;font-size:.95rem;color:var(--soft)}
.menu li a:hover,.menu li a[aria-current]{background:var(--pale);color:var(--deep)}
.hero{text-align:center;padding:70px 24px 46px;background:linear-gradient(180deg,var(--cream),var(--pale))}
.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-weight:500;font-size:.72rem;color:var(--deep)}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500;margin:.2em 0 .45em}
h1{font-style:italic;font-size:clamp(2.5rem,5vw,3.7rem)}
h2{font-size:clamp(1.9rem,3.6vw,2.5rem);font-style:italic}
h3{font-size:1.35rem;font-style:italic}
.script{font:400 1.3em 'Alex Brush',cursive;color:var(--coral)}
.intro{max-width:720px;margin:0 auto;color:var(--soft);font-size:1.08rem}
.content{max-width:var(--max);margin:auto;padding:65px 24px 90px}
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:50px;align-items:start}
.copy,.panel{background:var(--white);padding:34px;border-radius:22px;box-shadow:0 14px 34px -22px rgba(74,59,56,.35)}
.copy p,.panel p{margin:0 0 1.1em}
.copy p:last-child,.panel p:last-child{margin-bottom:0}
.copy ul,.panel ul{padding-left:1.2em;margin:.4em 0 1.1em}
.copy li,.panel li{margin:.35em 0}
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.gallery figure{margin:0;background:var(--white);border-radius:18px;overflow:hidden;box-shadow:0 14px 34px -22px rgba(74,59,56,.35)}
.gallery figure:first-child{grid-column:1/-1}
.gallery img{width:100%;height:280px;object-fit:cover}
.gallery figure:first-child img{height:380px}
.gallery img{cursor:zoom-in}
.lightbox{display:none;position:fixed;inset:0;z-index:1000;padding:clamp(18px,4vw,48px);place-items:center;background:rgba(42,28,26,.86)}
.lightbox.open{display:grid}
.lightbox>img{max-width:100%;max-height:90vh;width:auto;height:auto;object-fit:contain;border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.lightbox-close{position:absolute;top:18px;right:22px;width:44px;height:44px;border:0;border-radius:50%;background:#fff;color:var(--deep);font-size:2rem;line-height:1;cursor:pointer}
.gallery--single{display:block}
.gallery--single figure:first-child img{height:min(520px,60vw);object-fit:contain;background:#fff}
.sections{display:grid;gap:24px}
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:24px}
.cta{text-align:center;margin-top:58px}
.btn{display:inline-block;border-radius:999px;background:var(--coral);color:white;padding:.9em 1.8em;font-weight:500;box-shadow:0 8px 20px -8px rgba(156,83,83,.55)}
.btn:hover{background:#f2716f}
footer{text-align:center;background:var(--deep);color:var(--cream);padding:32px 24px;font-size:.86rem}
.site-footer{display:grid;gap:14px;justify-items:center}
.site-footer p{margin:0}
.social-links{display:flex;align-items:center;justify-content:center;gap:12px}
.social-link{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(252,243,235,.48);border-radius:50%;color:var(--cream);transition:background .2s,color .2s,transform .2s}
.social-link:hover{transform:translateY(-2px)}
.social-link--facebook:hover{background:#1877f2;border-color:#1877f2;color:#fff}
.social-link--tiktok:hover{background:#111;border-color:#111;color:#fff;filter:drop-shadow(2px 0 #25f4ee) drop-shadow(-2px 0 #fe2c55)}
.social-link--instagram:hover{background:radial-gradient(circle at 30% 110%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%);border-color:#d6249f;color:#fff}
.social-link svg{width:20px;height:20px;fill:currentColor}
.stockist-modal{position:fixed;inset:0;z-index:1100;display:none;place-items:center;padding:20px;background:rgba(42,28,26,.64)}
.stockist-modal.open{display:grid}
.stockist-dialog{position:relative;width:min(100%,480px);padding:42px 34px 34px;border-radius:24px;background:var(--cream);text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.28)}
.stockist-dialog h2{color:var(--deep);font-style:italic;font-size:clamp(1.9rem,6vw,2.5rem);line-height:1.15}
.stockist-dialog p{margin:14px 0 24px;color:var(--soft)}
.stockist-close{position:absolute;top:12px;right:14px;width:40px;height:40px;border:0;border-radius:50%;background:transparent;color:var(--deep);font-size:1.8rem;line-height:1;cursor:pointer}
.stockist-cancel{display:inline-block;margin-top:14px;color:var(--soft);text-decoration:underline;text-underline-offset:3px;font:400 .95rem Jost,sans-serif}
body.modal-open{overflow:hidden}
.fab{position:fixed;right:22px;bottom:22px;border-radius:50%;width:56px;height:56px;display:grid;place-items:center;background:#25d366;color:#fff;font-size:1.45rem;box-shadow:0 10px 26px -8px rgba(37,211,102,.55)}
@media(max-width:760px){.story,.feature-grid{grid-template-columns:1fr;gap:28px}
.gallery{order:-1}
.gallery figure:first-child img{height:320px}
}
@media(max-width:600px){.brand span{display:none}
.nav-tools{gap:16px}
.home-link,.menu>button,.menu li a{font-size:.85rem}
.hero{padding:52px 20px 35px}
.content{padding:48px 20px 70px}
.copy,.panel{padding:26px}
.gallery{gap:12px}
.gallery img{height:190px}
.gallery figure:first-child img{height:280px}
.stockist-dialog{padding:40px 24px 28px}
}
