:root{
  --bg:#FBF6EF; --surface:#fff; --alt:#F5EBDD; --text:#2E1A0F; --muted:#6E5546;
  --head:#3B1F10; --primary:#A65A22; --on-primary:#fff; --line:#E6D5C0;
  --amber:#E8A66A; --deep:#B5682B;
  --serif:"Cormorant Garamond",Georgia,serif; --read:"Literata",Georgia,serif;
  --ui:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --pad:clamp(1.25rem,5vw,3rem); --max:72rem;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#1A100A; --surface:#2A1B12; --alt:#33221A; --text:#EBDCCB; --muted:#BFA48E;
  --head:#F3E6D8; --primary:#E8A66A; --on-primary:#2A1408; --line:#4A3426;
}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text);font:400 1.0625rem/1.65 var(--ui)}
img,video{display:block;max-width:100%;height:auto}
a{color:var(--primary);text-underline-offset:.2em}
::selection{background:var(--amber);color:#2A1408}
:focus-visible{outline:3px solid var(--primary);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:1rem;top:-4rem;background:var(--primary);color:var(--on-primary);padding:.6rem 1rem;border-radius:8px;z-index:10}
.skip:focus{top:1rem}
h1,h2,h3{font-family:var(--serif);color:var(--head);font-weight:600;margin:0;text-wrap:balance}
h2{font-size:clamp(1.9rem,4.5vw,3rem);line-height:1.1;letter-spacing:-.01em}
p{margin:0;text-wrap:pretty}

.top{display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:var(--max);margin:0 auto;padding:1rem var(--pad)}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--head);font:600 1.5rem var(--serif)}
.brand img{border-radius:10px}
.top nav{display:flex;gap:1.5rem}
.top nav a{color:var(--text);text-decoration:none;font-weight:500;font-size:.95rem;padding:.5rem 0}
.top nav a:hover{color:var(--primary);text-decoration:underline}
@media (max-width:560px){.top nav{display:none}}

.hero{max-width:var(--max);margin:0 auto;padding:clamp(1.5rem,5vw,4rem) var(--pad) clamp(3rem,8vw,6rem);display:grid;gap:2.5rem;align-items:center}
.sub{font:500 .95rem var(--ui);color:var(--muted);margin-bottom:1rem}
h1{font-size:clamp(2.8rem,9vw,5.5rem);line-height:.98;letter-spacing:-.02em}
.lead{font:400 clamp(1.1rem,2.4vw,1.35rem)/1.6 var(--read);margin-top:1.5rem;max-width:34rem}
.stores{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
.store{display:inline-flex;align-items:center;gap:.75rem;min-height:3.5rem;padding:.6rem 1.4rem .6rem 1.1rem;border-radius:14px;background:var(--primary);color:var(--on-primary);text-decoration:none;font:600 1.1rem/1.1 var(--ui);transition:transform .2s cubic-bezier(.16,1,.3,1),filter .2s}
.store small{display:block;font-weight:400;font-size:.72rem;opacity:.85;margin-bottom:.15rem}
.store:hover{transform:translateY(-2px);filter:brightness(1.08)}
.store:active{transform:none}
.hero-media{display:flex;justify-content:center}
.phone{width:min(260px,62vw);aspect-ratio:540/1174;border-radius:2.4rem;padding:.55rem;background:linear-gradient(160deg,var(--amber),var(--deep));box-shadow:0 30px 50px -20px rgba(0,0,0,.4),0 8px 16px -8px rgba(0,0,0,.25)}
.phone video{width:100%;height:100%;object-fit:cover;border-radius:1.9rem;background:var(--alt)}
@media (min-width:860px){
  .hero{grid-template-columns:1.15fr .85fr;gap:4rem}
  .phone{width:min(300px,100%)}
}

.features{background:var(--alt);padding:clamp(3rem,8vw,6rem) var(--pad)}
.features>*{max-width:var(--max);margin-inline:auto}
.fn-list{margin-top:clamp(2rem,5vw,3.5rem);border-top:1px solid var(--line)}
.fn-list article{display:grid;gap:.6rem 3rem;padding:1.75rem 0;border-bottom:1px solid var(--line)}
.fn-list h3{font-size:clamp(1.5rem,3vw,2rem);line-height:1.15}
.fn-list p{font-family:var(--read);max-width:42rem}
.tag{display:inline-block;vertical-align:middle;font:600 .72rem var(--ui);letter-spacing:.02em;border:1px solid var(--primary);color:var(--primary);border-radius:999px;padding:.1rem .6rem;margin-left:.4rem}
.fn-list strong{font-family:var(--ui);color:var(--primary)}
@media (min-width:860px){.fn-list article{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:baseline;padding:2.25rem 0}}

.gallery{padding:clamp(3rem,8vw,6rem) 0}
.gallery h2{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.strip{list-style:none;margin:2rem 0 0;padding:.5rem var(--pad) 1.5rem;display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);scrollbar-color:var(--primary) transparent}
.strip li{flex:0 0 min(70vw,300px);scroll-snap-align:start}
.strip img{width:100%;border-radius:22px;box-shadow:0 14px 24px -14px rgba(0,0,0,.45);background:var(--alt)}
@media (min-width:1100px){.strip{justify-content:center}.strip li{flex:0 0 min(15vw,210px)}}

.notes{max-width:var(--max);margin:0 auto;padding:0 var(--pad) clamp(3rem,8vw,6rem);display:grid;gap:2.5rem}
.notes h2{font-size:clamp(1.7rem,3.5vw,2.3rem);margin-bottom:.75rem}
.notes p{font-family:var(--read);max-width:34rem}
@media (min-width:760px){.notes{grid-template-columns:1fr 1fr;gap:4rem}}

.cta{text-align:center;padding:clamp(3rem,8vw,5.5rem) var(--pad);background:linear-gradient(160deg,var(--peach,#F3C9A0),var(--amber));color:#2A1408}
.cta h2{color:#2A1408}
.cta .stores{justify-content:center}
.cta .store{background:#2A1408;color:#FBF6EF}

footer{max-width:var(--max);margin:0 auto;padding:2rem var(--pad) 3rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.9rem}
footer nav{display:flex;flex-wrap:wrap;gap:1.25rem}
footer a{color:var(--muted);padding:.4rem 0}
footer a:hover{color:var(--primary)}
