/* =========================================================
   ADAAYE — Artistically Indian
   One stylesheet for all three pages.

   The idea: the page is a pat (a Bengal scroll painting).
   A painted border runs down the left edge, and painted
   bands divide one panel of the story from the next.
   Colours and paper texture are Adaaye's original ones:
   ivory, charcoal, sindoor, indigo, turmeric and clay.
   ========================================================= */

/* ---------- fonts (bundled, no outside requests) ---------- */
@font-face{
  font-family:'Eczar';
  src:url('../fonts/eczar-latin-wght-normal.woff2') format('woff2');
  font-weight:400 800; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Anek Latin';
  src:url('../fonts/anek-latin-latin-wght-normal.woff2') format('woff2');
  font-weight:100 800; font-style:normal; font-display:swap;
}

/* ---------- tokens ---------- */
:root{
  /* Adaaye palette */
  --ivory:#F4EEE0;        /* paper */
  --ivory-light:#FBF7EC;  /* mounts, cards */
  --sand:#E3D8BE;
  --sand-soft:#EEE5D1;    /* second paper tone */
  --sand-wash:rgba(232,220,194,.5); /* the same tone, letting the paper texture show */
  --jute:#B9A88C;
  --charcoal:#2E2A26;     /* text, headings */
  --charcoal-2:#211E1B;
  --sindoor:#A4312A;      /* the red: buttons, accents */
  --sindoor-deep:#832620;
  --indigo:#26364C;       /* deep panels */
  --turmeric:#C1892F;
  --clay:#8A6142;         /* fine lines */
  --walnut:#75523A;       /* small labels */
  --ink:#2E2A26;

  --display:'Eczar', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --text:'Anek Latin', 'Segoe UI', system-ui, sans-serif;

  --band:44px;            /* width of the painted side border */
  --gutter:clamp(20px, 5vw, 64px);
  --measure:62ch;

  /* the painted border, as repeating tiles */
  --border-v:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='88' viewBox='0 0 44 88'%3E%3Crect width='44' height='88' fill='%23EEE5D1'/%3E%3Cpath d='M5.5 0v88M8.5 0v88M35.5 0v88M38.5 0v88' stroke='%238A6142' stroke-width='1'/%3E%3Cpath d='M13 0 31 22 13 44 31 66 13 88' fill='none' stroke='%232E2A26' stroke-opacity='.55' stroke-width='1.3' stroke-linejoin='round'/%3E%3Cg fill='%23A4312A'%3E%3Ccircle cx='18' cy='22' r='2.3'/%3E%3Ccircle cx='18' cy='66' r='2.3'/%3E%3Ccircle cx='26' cy='0' r='2.3'/%3E%3Ccircle cx='26' cy='44' r='2.3'/%3E%3Ccircle cx='26' cy='88' r='2.3'/%3E%3C/g%3E%3C/svg%3E");
  --border-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='28' viewBox='0 0 44 28'%3E%3Crect width='44' height='28' fill='%23EEE5D1'/%3E%3Cpath d='M0 4.5h44M0 7.5h44M0 20.5h44M0 23.5h44' stroke='%238A6142' stroke-width='1'/%3E%3Cpath d='M0 17 11 11 22 17 33 11 44 17' fill='none' stroke='%232E2A26' stroke-opacity='.55' stroke-width='1.2' stroke-linejoin='round'/%3E%3Cg fill='%23A4312A'%3E%3Ccircle cx='11' cy='15.5' r='1.5'/%3E%3Ccircle cx='33' cy='15.5' r='1.5'/%3E%3C/g%3E%3C/svg%3E");
}

/* ---------- base ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:5.5rem; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background-color:var(--ivory);
  background-image:
    radial-gradient(900px 520px at 12% -8%, rgba(164,49,42,.05), transparent 60%),
    radial-gradient(800px 460px at 100% 6%, rgba(38,54,76,.045), transparent 58%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cg fill='none' stroke='%238a6142' stroke-width='1' stroke-opacity='0.15'%3E%3Cpath d='M40 20c14 0 22 12 22 26 0 16-12 22-22 30-6 5-8 11-4 16 5 6 15 4 18-4' stroke-linecap='round'/%3E%3Ccircle cx='40' cy='20' r='2.2' fill='%23a4312a' stroke='none' fill-opacity='0.15'/%3E%3C/g%3E%3Cg fill='none' stroke='%2326364c' stroke-width='1' stroke-opacity='0.11' transform='translate(120,100) rotate(160)'%3E%3Cpath d='M0 0c14 0 22 12 22 26 0 16-12 22-22 30-6 5-8 11-4 16 5 6 15 4 18-4' stroke-linecap='round'/%3E%3C/g%3E%3C/svg%3E"),
    radial-gradient(rgba(46,42,38,.045) 1px, transparent 1px);
  background-size:auto, auto, 160px 160px, 3px 3px;
  background-repeat:no-repeat, no-repeat, repeat, repeat;
  color:var(--ink);
  font-family:var(--text);
  font-size:1.0625rem;
  line-height:1.6;
  font-weight:400;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; }
p{ margin:0 0 1em; }
p:last-child{ margin-bottom:0; }
h1,h2,h3,h4{ font-family:var(--display); font-weight:500; line-height:1.1; letter-spacing:-.012em; margin:0; color:var(--charcoal); text-wrap:balance; }
h1{ font-size:clamp(2.5rem, 5.4vw, 4.5rem); }
h2{ font-size:clamp(1.9rem, 3.4vw, 3rem); }
h3{ font-size:1.3125rem; line-height:1.2; }
button, input, select{ font:inherit; color:inherit; }
button{ cursor:pointer; }
:focus-visible{ outline:2px solid var(--sindoor); outline-offset:3px; border-radius:2px; }
[hidden]{ display:none !important; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

.wrap{ width:100%; max-width:1180px; margin-inline:auto; padding-inline:var(--gutter); }
.panel{ padding-block:clamp(4rem, 9vw, 7.5rem); }
.panel--sand{ background:var(--sand-wash); border-block:1px solid rgba(46,42,38,.16); }
.panel--dark{ background:var(--charcoal); color:var(--ivory); }
.panel--dark h2, .panel--dark h3{ color:var(--ivory); }

/* the painted side border (desktop) */
@media (min-width:1000px){
  body{ padding-left:var(--band); }
  body::before{
    content:""; position:fixed; z-index:60; left:0; top:0; bottom:0; width:var(--band);
    background:var(--border-v) repeat-y left top / var(--band) auto;
  }
}
/* painted band between panels */
.band{ height:28px; background:var(--border-h) repeat-x left center / auto 28px; }

/* ---------- buttons & links ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55em;
  font-family:var(--text); font-weight:600; font-size:1rem; line-height:1.2;
  padding:.85em 1.45em; border-radius:4px; border:1.5px solid var(--sindoor);
  background:var(--sindoor); color:var(--ivory); text-decoration:none;
  transition:background-color .18s ease, color .18s ease, border-color .18s ease;
}
.btn:hover{ background:var(--sindoor-deep); border-color:var(--sindoor-deep); }
.btn--line{ background:transparent; color:var(--charcoal); border-color:var(--charcoal); }
.btn--line:hover{ background:var(--charcoal); border-color:var(--charcoal); color:var(--ivory); }
.btn--paper{ background:var(--ivory); color:var(--charcoal); border-color:var(--ivory); }
.btn--paper:hover{ background:var(--sand); border-color:var(--sand); }
.btn--paper-line{ background:transparent; color:var(--ivory); border-color:rgba(244,238,224,.65); }
.btn--paper-line:hover{ background:var(--ivory); color:var(--charcoal); border-color:var(--ivory); }
.btn--small{ font-size:.9375rem; padding:.6em 1.05em; }
.btn[disabled]{ opacity:.45; cursor:not-allowed; }
.btn svg{ width:1.15em; height:1.15em; flex:none; }
.btn-row{ display:flex; flex-wrap:wrap; gap:.75rem; }
.link{ color:var(--sindoor); text-decoration:underline; text-underline-offset:.18em; text-decoration-thickness:1px; }
.link:hover{ color:var(--charcoal); }
.panel--dark .link{ color:var(--sand); }

/* ---------- section heads ---------- */
.head{ margin-bottom:clamp(2.2rem, 5vw, 3.4rem); max-width:46rem; }
.head > p, .head-main > p{ margin-top:1rem; max-width:var(--measure); color:#4a443d; }
.panel--dark .head > p, .panel--dark .head-main > p{ color:rgba(244,238,224,.86); }

/* ---------- announcement bar ---------- */
.announce{ background:var(--sindoor); color:var(--ivory); font-size:.875rem; overflow:hidden; white-space:nowrap; }
.announce-track{ display:inline-flex; gap:3.5rem; padding:.55rem 0 .55rem 3.5rem; animation:slide 46s linear infinite; }
.announce-track span::before{ content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--turmeric); margin-right:.8rem; vertical-align:.12em; }
.announce:hover .announce-track{ animation-play-state:paused; }
@keyframes slide{ to{ transform:translateX(-50%); } }

/* ---------- header ---------- */
.masthead{ background:var(--ivory); }
.masthead .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-block:1.1rem; }
.brand{ display:flex; align-items:center; gap:.85rem; text-decoration:none; }
.brand img{ height:54px; width:auto; }
.brand-name{ font-family:var(--display); font-weight:500; font-size:1.75rem; line-height:1; color:var(--charcoal); letter-spacing:-.01em; }
.brand-name small{ display:block; font-family:var(--text); font-weight:400; font-size:.8125rem; letter-spacing:.02em; color:var(--walnut); margin-top:.35rem; }
.masthead-actions{ display:flex; align-items:center; gap:.6rem; }

.navbar{ position:sticky; top:0; z-index:50; background:var(--ivory); border-block:1px solid rgba(138,97,66,.5); }
.navbar .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:3.25rem; }
.nav-links{ display:flex; flex-wrap:wrap; gap:.2rem clamp(.8rem, 1.7vw, 1.6rem); list-style:none; margin:0; padding:0; }
.nav-links a{ display:block; padding:.85rem 0; font-size:.9688rem; font-weight:500; text-decoration:none; color:var(--charcoal); border-bottom:2px solid transparent; }
.nav-links a:hover, .nav-links a[aria-current="page"]{ border-bottom-color:var(--sindoor); }
.cart-btn{ position:relative; display:inline-flex; align-items:center; gap:.5rem; background:none; border:0; padding:.5rem .2rem; font-weight:600; color:var(--charcoal); }
.cart-btn svg{ width:22px; height:22px; }
.cart-count{ min-width:1.35rem; height:1.35rem; padding:0 .3rem; border-radius:99px; background:var(--sindoor); color:#fff; font-size:.78rem; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.menu-btn{ display:none; background:none; border:1.5px solid var(--charcoal); border-radius:4px; padding:.45rem .8rem; font-weight:600; color:var(--charcoal); }
.nav-ig{ display:none; }

@media (max-width:999px){
  .masthead .wrap{ padding-block:.7rem; }
  .brand img{ height:42px; }
  .brand-name{ font-size:1.4rem; }
  .brand-name small{ font-size:.75rem; margin-top:.25rem; }
  .masthead-actions{ display:none; }
  .menu-btn{ display:inline-block; }
  .navbar .wrap{ flex-wrap:wrap; }
  .nav-links{ display:none; order:3; flex-direction:column; flex-wrap:nowrap; width:100%; gap:0; padding-bottom:.8rem; }
  .navbar.is-open .nav-links{ display:flex; }
  .nav-links a{ padding:.7rem 0; border-bottom:1px solid rgba(138,97,66,.3); font-size:1.0625rem; }
  .nav-ig{ display:block; }
}

/* ---------- hero ---------- */
.hero{ color:var(--charcoal); padding-block:clamp(3rem, 7vw, 6rem); }
.hero .wrap{ display:grid; gap:clamp(2.2rem, 5vw, 4.5rem); align-items:center; }
.hero h1{ color:var(--charcoal); }
.hero h1 em{ font-style:normal; color:var(--sindoor); }
.hero-lede{ font-size:1.1875rem; line-height:1.6; max-width:34rem; margin:1.5rem 0 2rem; color:#4a443d; }
.hero-credit{ margin-top:1.8rem; font-size:.9375rem; color:var(--walnut); }
.hero-credit::before{ content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--sindoor); margin-right:.7rem; }
.mount{ margin:0; background:var(--ivory-light); padding:clamp(10px, 1.4vw, 18px); box-shadow:0 0 0 1px rgba(138,97,66,.7), 0 22px 36px -20px rgba(46,42,38,.45); }
.mount img{ width:100%; }
.hero-art{ max-width:30rem; width:100%; justify-self:center; }
.hero-art .mount{ transform:rotate(1.2deg); animation:unroll 1s cubic-bezier(.2,.7,.2,1) .15s both; }
.hero-art figcaption{ margin-top:1.3rem; font-size:.9375rem; color:var(--walnut); display:flex; flex-wrap:wrap; gap:.3rem 1rem; justify-content:space-between; }
.hero-art figcaption a{ color:var(--sindoor); }
@keyframes unroll{ from{ clip-path:inset(0 0 100% 0); } to{ clip-path:inset(-40px); } }
@media (min-width:900px){ .hero .wrap{ grid-template-columns:1.15fr .85fr; } }

/* ---------- story ---------- */
.story-grid{ display:grid; gap:clamp(2rem, 5vw, 4.5rem); align-items:start; }
.story-photo{ max-width:24rem; }
.story-photo .mount{ box-shadow:0 0 0 1px var(--clay); }
.story-photo img{ aspect-ratio:4/5; object-fit:cover; object-position:50% 20%; }
.story-photo figcaption{ margin-top:.8rem; font-size:.9375rem; color:var(--walnut); }
.story-text p{ max-width:var(--measure); font-size:1.125rem; }
.signature{ margin-top:2rem; font-family:var(--display); font-size:1.3125rem; line-height:1.35; color:var(--charcoal); padding-left:1.4rem; border-left:3px solid var(--sindoor); }
@media (min-width:860px){ .story-grid{ grid-template-columns:minmax(0,22rem) 1fr; } }

/* ---------- journey (timeline, stitched like kantha) ---------- */
.timeline{ list-style:none; margin:0; padding:0; max-width:52rem; }
.timeline li{ position:relative; display:grid; gap:.4rem 2rem; padding:0 0 2.6rem 2.2rem; }
.timeline li::before{ content:""; position:absolute; left:5px; top:.55rem; bottom:-.55rem; border-left:2px dashed var(--clay); }
.timeline li:last-child{ padding-bottom:0; }
.timeline li:last-child::before{ display:none; }
.timeline li::after{ content:""; position:absolute; left:0; top:.45rem; width:12px; height:12px; border-radius:50%; background:var(--sindoor); box-shadow:0 0 0 4px var(--sand-soft); }
.timeline .when{ font-weight:600; color:var(--sindoor); font-size:.9688rem; }
.timeline p{ margin-top:.55rem; color:#4a443d; }
@media (min-width:760px){
  .timeline li{ grid-template-columns:10.5rem 1fr; padding-left:0; }
  .timeline li::before{ left:calc(10.5rem + 1rem - 1px); }
  .timeline li::after{ left:calc(10.5rem + 1rem - 6px); }
  .timeline .when{ text-align:right; padding-right:.6rem; }
  .timeline .what{ padding-left:1.6rem; }
}

/* ---------- village picture ---------- */
.village{ position:relative; color:var(--charcoal); }
.village img{ width:100%; aspect-ratio:21/9; object-fit:cover; }
.village-caption{ position:absolute; inset:auto 0 0 0; padding:5rem 0 clamp(1.4rem, 3vw, 2.6rem); background:linear-gradient(to top, var(--ivory) 8%, rgba(244,238,224,.82) 55%, rgba(244,238,224,0)); }
.village-caption p{ font-family:var(--display); font-size:clamp(1.15rem, 2.1vw, 1.7rem); line-height:1.35; max-width:46rem; }
@media (max-width:700px){
  .village img{ aspect-ratio:4/3; }
  .village-caption{ position:static; background:none; padding:1.4rem 0 .4rem; }
}

/* ---------- craft: four stages ---------- */
.stages{ list-style:none; margin:0; padding:0; display:grid; gap:2rem 2.2rem; counter-reset:stage; }
.stages li{ counter-increment:stage; border-top:1px solid var(--clay); padding-top:1.1rem; }
.stages li::before{ content:counter(stage); display:block; font-family:var(--display); font-weight:500; font-size:2.75rem; line-height:1; color:var(--sindoor); margin-bottom:.7rem; }
.stages p{ margin-top:.6rem; color:#4a443d; }
@media (min-width:640px){ .stages{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .stages{ grid-template-columns:repeat(4,1fr); } }

/* ---------- collection ---------- */
.kinds{ list-style:none; margin:0; padding:0; display:grid; gap:2.4rem 1.8rem; grid-template-columns:repeat(2,1fr); }
.kinds a{ display:block; text-decoration:none; color:inherit; }
.kinds img{ width:100%; aspect-ratio:4/5; object-fit:cover; background:var(--sand); box-shadow:0 0 0 1px var(--clay); padding:8px; background-clip:content-box; background-color:var(--ivory-light); }
.kinds h3{ margin-top:1.1rem; }
.kinds a:hover h3{ color:var(--sindoor); }
.kinds p{ margin-top:.45rem; color:#4a443d; font-size:1rem; }
@media (min-width:900px){ .kinds{ grid-template-columns:repeat(4,1fr); } }

/* ---------- favourites: a hand of cards ---------- */
.fan-stage{ display:flex; justify-content:center; padding:2rem 0 4.5rem; overflow:hidden; margin-inline:calc(var(--gutter) * -1); }
.fan-deck{ position:relative; width:min(14rem, 44vw); aspect-ratio:3/4; }
.fan-card{ position:absolute; inset:0; margin:0; padding:7px; background:var(--ivory-light); border:0; box-shadow:0 0 0 1px rgba(138,97,66,.7), 0 14px 26px -14px rgba(46,42,38,.45); transition:transform .45s cubic-bezier(.2,.7,.2,1); cursor:pointer; }
.fan-card img{ width:100%; height:100%; object-fit:cover; pointer-events:none; }
.fan-name{ min-height:1.6em; text-align:center; font-family:var(--display); font-size:1.25rem; color:var(--charcoal); }

/* ---------- shop ---------- */
.shop-tools{ display:flex; flex-wrap:wrap; gap:1rem 1.5rem; align-items:center; justify-content:space-between; margin-bottom:2.8rem; }
.pills{ display:flex; flex-wrap:wrap; gap:.5rem; }
.pill{ background:transparent; border:1.5px solid rgba(46,42,38,.35); border-radius:99px; padding:.42rem .95rem; font-size:.9375rem; font-weight:500; color:var(--charcoal); white-space:nowrap; }
.pill:hover{ border-color:var(--charcoal); }
.pill[aria-pressed="true"]{ background:var(--sindoor); border-color:var(--sindoor); color:var(--ivory); }
.pill b{ font-weight:400; opacity:.7; margin-left:.3rem; }
.currency{ display:flex; align-items:center; gap:.5rem; font-size:.9375rem; color:var(--walnut); }
.currency select{ background:var(--ivory-light); border:1.5px solid rgba(46,42,38,.35); border-radius:4px; padding:.4rem .6rem; color:var(--charcoal); font-weight:600; }
@media (max-width:700px){
  .pills{ flex-wrap:nowrap; overflow-x:auto; margin-inline:calc(var(--gutter) * -1); padding-inline:var(--gutter); padding-bottom:.4rem; scrollbar-width:none; }
  .pills::-webkit-scrollbar{ display:none; }
}

.shelf{ margin-bottom:clamp(3rem, 6vw, 4.5rem); }
.shelf:last-child{ margin-bottom:0; }
.shelf-head{ display:grid; grid-template-columns:1fr auto; align-items:baseline; gap:.3rem 1.5rem; margin-bottom:1.5rem; padding-bottom:.9rem; border-bottom:1px solid rgba(138,97,66,.45); }
.shelf-head h3{ font-size:clamp(1.5rem, 2.4vw, 1.9rem); }
.shelf-head p{ grid-column:1 / -1; color:#4a443d; max-width:var(--measure); }
.shelf-count{ font-size:.9375rem; color:var(--walnut); }
.grid{ display:grid; gap:2.2rem 1.5rem; grid-template-columns:repeat(2,1fr); }
@media (min-width:760px){ .grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:1080px){ .grid{ grid-template-columns:repeat(4,1fr); gap:2.6rem 1.8rem; } }

.piece{ display:flex; flex-direction:column; }
.piece-photo{ background:var(--ivory-light); padding:8px; box-shadow:0 0 0 1px rgba(138,97,66,.8); overflow:hidden; }
.piece-photo img{ width:100%; aspect-ratio:1/1; object-fit:cover; transition:transform .5s ease; }
.piece:hover .piece-photo img{ transform:scale(1.035); }
.piece h4{ font-size:1.1875rem; line-height:1.25; margin-top:1rem; }
.piece-style{ font-size:.9375rem; color:var(--walnut); margin:.25rem 0 .7rem; }
.piece-foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:.6rem; flex-wrap:wrap; }
.price{ font-weight:600; font-size:1.125rem; color:var(--sindoor); font-variant-numeric:tabular-nums; }
.add{ background:transparent; border:1.5px solid var(--charcoal); border-radius:4px; padding:.45rem .85rem; font-size:.9375rem; font-weight:600; color:var(--charcoal); transition:background-color .18s ease, color .18s ease; }
.add:hover{ background:var(--charcoal); color:var(--ivory); }
.add.is-added{ background:var(--sindoor); border-color:var(--sindoor); color:#fff; }
.soon{ border:1.5px dashed var(--clay); padding:1.4rem 1.6rem; color:#4a443d; background:rgba(251,247,236,.7); }
.soon strong{ font-family:var(--display); font-weight:500; font-size:1.1875rem; color:var(--charcoal); display:block; margin-bottom:.2rem; }
.shop-note{ margin-top:2.6rem; font-size:.9375rem; color:var(--walnut); max-width:var(--measure); }

/* ---------- how to order ---------- */
.order-steps{ list-style:none; margin:0 0 2.4rem; padding:0; display:grid; gap:1.8rem 2.2rem; counter-reset:step; }
.order-steps li{ counter-increment:step; display:grid; grid-template-columns:auto 1fr; align-content:start; gap:.3rem 1rem; }
.order-steps li::before{ content:counter(step); grid-row:span 2; font-family:var(--display); font-size:2.4rem; line-height:1; color:var(--sindoor); min-width:1.6rem; }
.order-steps p{ color:#4a443d; }
@media (min-width:860px){ .order-steps{ grid-template-columns:repeat(3,1fr); } }

/* ---------- testimonials ---------- */
.quotes{ display:grid; gap:2.4rem 3.5rem; }
.quote{ margin:0; padding-top:1.3rem; border-top:1px solid var(--clay); }
.quote blockquote{ margin:0; font-family:var(--display); font-size:1.25rem; line-height:1.45; color:var(--charcoal); }
.quote figcaption{ margin-top:1rem; font-size:.9688rem; color:var(--walnut); }
.quote figcaption b{ color:var(--ink); font-weight:600; }
@media (min-width:800px){ .quotes{ grid-template-columns:repeat(2,1fr); } }

/* ---------- hampers ---------- */
.hampers{ position:relative; isolation:isolate; background:var(--indigo); }
.hampers::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(rgba(38,54,76,.90), rgba(38,54,76,.93)), url('../img/workshop.webp') center/cover; }
.hampers h2{ max-width:20ch; }
.hampers .head-main > p{ font-size:1.125rem; }
.hampers .btn-row{ margin-top:2rem; }

/* ---------- closing statement ---------- */
.statement{ text-align:center; padding-block:clamp(3.5rem, 8vw, 6rem); }
.statement p{ font-family:var(--display); font-size:clamp(1.5rem, 3vw, 2.4rem); line-height:1.3; color:var(--charcoal); max-width:24ch; margin-inline:auto; text-wrap:balance; }
.statement p span{ color:var(--sindoor); }

/* ---------- drop list ---------- */
.droplist form{ display:flex; flex-wrap:wrap; gap:.6rem; max-width:32rem; margin-top:1.6rem; }
.droplist input{ flex:1 1 14rem; min-width:0; padding:.8rem 1rem; border:1.5px solid rgba(46,42,38,.45); border-radius:4px; background:var(--ivory-light); }
.form-msg{ margin-top:.9rem; font-size:.9688rem; color:var(--charcoal); font-weight:500; min-height:1.5em; }

/* ---------- footer ---------- */
.foot{ padding-block:clamp(3rem, 6vw, 4.5rem) 1.6rem; }
.foot-top{ display:grid; gap:2.5rem; }
.foot-brand img{ width:150px; }
.foot-brand p{ margin-top:1.1rem; max-width:22rem; color:#4a443d; }
.foot-cols{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:2rem; }
.foot h3{ font-family:var(--text); font-weight:600; font-size:.9688rem; letter-spacing:0; color:var(--walnut); margin-bottom:.7rem; }
.foot ul{ list-style:none; margin:0; padding:0; }
.foot li{ margin-bottom:.4rem; }
.foot a{ text-decoration:none; color:var(--charcoal); }
.foot a:hover{ text-decoration:underline; text-underline-offset:.18em; }
.foot-bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:.5rem 2rem; margin-top:2.8rem; padding-top:1.3rem; border-top:1px solid rgba(138,97,66,.55); font-size:.9375rem; color:var(--walnut); }
@media (min-width:800px){ .foot-top{ grid-template-columns:1.1fr 1fr; } }

/* ---------- cart drawer ---------- */
.veil{ position:fixed; inset:0; z-index:90; background:rgba(46,42,38,.55); opacity:0; visibility:hidden; transition:opacity .25s ease, visibility .25s; }
.veil.is-open{ opacity:1; visibility:visible; }
.drawer{ position:fixed; z-index:100; top:0; right:0; bottom:0; width:min(27rem, 100vw); background:var(--ivory); display:flex; flex-direction:column; transform:translateX(100%); visibility:hidden; transition:transform .3s cubic-bezier(.2,.7,.2,1), visibility .3s; box-shadow:-18px 0 40px -20px rgba(0,0,0,.5); }
.drawer.is-open{ transform:none; visibility:visible; }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:1.1rem 1.4rem; border-bottom:1px solid rgba(138,97,66,.55); }
.drawer-head h2{ font-size:1.5rem; }
.drawer-close{ background:none; border:0; font-size:1.9rem; line-height:1; padding:.1rem .5rem; color:var(--charcoal); }
.drawer-body{ flex:1; overflow-y:auto; padding:1.3rem 1.4rem 2rem; }
.drawer-body h3{ margin-bottom:1rem; }
.back{ background:none; border:0; padding:0; margin-bottom:1.1rem; color:var(--sindoor); font-weight:600; font-size:.9688rem; text-decoration:underline; text-underline-offset:.18em; }
.cart-empty{ color:#4a443d; }
.line{ display:grid; grid-template-columns:64px 1fr; gap:.9rem; padding:.9rem 0; border-bottom:1px solid rgba(138,97,66,.35); }
.line img{ width:64px; height:64px; object-fit:cover; box-shadow:0 0 0 1px var(--clay); }
.line-name{ font-family:var(--display); font-size:1.0625rem; line-height:1.25; color:var(--charcoal); margin:0; }
.line-price{ font-size:.9688rem; color:var(--walnut); margin:.1rem 0 .45rem; }
.qty{ display:flex; align-items:center; gap:.5rem; font-size:.9688rem; }
.qty button{ background:none; border:1.5px solid rgba(46,42,38,.4); border-radius:4px; min-width:1.9rem; height:1.9rem; color:var(--charcoal); font-weight:600; }
.qty .remove{ border:0; margin-left:auto; text-decoration:underline; text-underline-offset:.18em; font-weight:500; color:var(--walnut); }
.total{ display:flex; justify-content:space-between; align-items:baseline; margin:1.3rem 0 1rem; font-weight:600; font-size:1.125rem; color:var(--charcoal); }
.drawer .btn{ width:100%; }
.drawer .btn + .btn{ margin-top:.6rem; }
.fine{ font-size:.9063rem; color:var(--walnut); margin-top:.8rem; }
.field{ display:block; margin-bottom:.85rem; font-size:.9375rem; font-weight:500; color:var(--charcoal); }
.field input{ display:block; width:100%; margin-top:.3rem; padding:.7rem .8rem; border:1.5px solid rgba(46,42,38,.4); border-radius:4px; background:var(--ivory-light); font-weight:400; color:var(--ink); }
.field input[aria-invalid="true"]{ border-color:var(--sindoor); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
.check{ display:flex; gap:.6rem; align-items:flex-start; font-size:.9375rem; margin:.3rem 0 1.2rem; }
.check input{ margin-top:.3rem; accent-color:var(--charcoal); }
.form-error{ color:var(--sindoor); font-weight:500; font-size:.9375rem; margin-bottom:.8rem; }
.pay{ border:1px solid rgba(138,97,66,.7); background:var(--ivory-light); padding:1.2rem; margin-bottom:1.2rem; text-align:center; }
.pay h4{ font-family:var(--text); font-weight:600; font-size:1rem; letter-spacing:0; margin-bottom:.9rem; }
.pay-qr{ width:190px; margin:0 auto .9rem; background:#fff; padding:10px; }
.pay-qr img, .pay-qr svg{ width:100%; height:auto; display:block; }
.upi-line{ font-size:.9688rem; display:flex; flex-wrap:wrap; gap:.4rem .6rem; align-items:center; justify-content:center; }
.upi-line code{ font-family:var(--text); font-weight:600; background:var(--sand-soft); padding:.15rem .5rem; border-radius:3px; }
.copy{ background:none; border:0; padding:0; color:var(--sindoor); font-weight:600; text-decoration:underline; text-underline-offset:.18em; font-size:.9375rem; }
.summary{ font-size:.9688rem; margin:0 0 1.2rem; padding:0; list-style:none; }
.summary li{ display:flex; justify-content:space-between; gap:1rem; padding:.3rem 0; border-bottom:1px dotted rgba(138,97,66,.6); }
.summary li:last-child{ border-bottom:0; font-weight:600; color:var(--charcoal); }

/* ---------- inner pages (Meet Us, Support an Artisan) ---------- */
.page-top{ color:var(--charcoal); padding-block:clamp(3rem, 7vw, 5.5rem); }
.page-top h1{ color:var(--charcoal); max-width:18ch; }
.page-top .lede{ margin-top:1.4rem; font-size:1.1875rem; max-width:40rem; color:#4a443d; }

.trio{ display:grid; gap:3rem 2.2rem; }
.trio figure{ margin:0; }
.trio .mount{ box-shadow:0 0 0 1px var(--clay); }
.trio .mount img{ aspect-ratio:1/1; object-fit:cover; }
.trio .mount--logo img{ object-fit:contain; padding:12%; background:var(--ivory-light); }
.trio .role{ margin-top:1.2rem; font-size:.9688rem; font-weight:600; color:var(--sindoor); }
.trio h2{ font-size:1.75rem; margin-top:.15rem; }
.trio p{ margin-top:.6rem; color:#4a443d; }
@media (min-width:800px){ .trio{ grid-template-columns:repeat(3,1fr); } }

.mission{ display:grid; gap:2.5rem 4rem; }
.mission p{ font-size:1.125rem; max-width:var(--measure); }
.facts{ list-style:none; margin:0; padding:0; display:grid; gap:1.2rem; align-content:start; }
.facts li{ border-top:1px solid var(--clay); padding-top:.8rem; }
.facts b{ display:block; font-family:var(--display); font-weight:500; font-size:2.4rem; line-height:1; color:var(--sindoor); }
.facts span{ color:var(--walnut); font-size:.9688rem; }
@media (min-width:900px){ .mission{ grid-template-columns:1.6fr 1fr; } }

.district-nav{ position:sticky; top:3.25rem; z-index:40; background:var(--sand-soft); border-bottom:1px solid rgba(138,97,66,.55); }
.district-nav ul{ list-style:none; margin:0; padding:.6rem 0; display:flex; gap:.5rem; overflow-x:auto; scrollbar-width:none; }
.district-nav ul::-webkit-scrollbar{ display:none; }
.district-nav a{ display:block; white-space:nowrap; text-decoration:none; font-size:.9375rem; font-weight:500; color:var(--charcoal); border:1.5px solid rgba(46,42,38,.3); border-radius:99px; padding:.35rem .9rem; }
.district-nav a:hover{ background:var(--charcoal); color:var(--ivory); border-color:var(--charcoal); }

.district{ scroll-margin-top:7rem; }
.district:nth-of-type(even){ background:var(--sand-wash); }
.district-place{ font-weight:600; color:var(--sindoor); font-size:.9688rem; }
.district h2{ margin-top:.2rem; }
.district-craft{ font-family:var(--display); font-size:1.3125rem; color:var(--walnut); margin-top:.4rem; }
.district-body{ display:grid; gap:2rem 3.5rem; margin-top:2rem; align-items:start; }
.district-copy h3{ font-family:var(--text); font-weight:600; font-size:1rem; letter-spacing:0; color:var(--charcoal); margin:1.4rem 0 .4rem; }
.district-copy h3:first-child{ margin-top:0; }
.district-copy p{ max-width:var(--measure); }
.motif{ margin:0; max-width:15rem; }
.motif svg{ width:100%; height:auto; background:var(--ivory-light); box-shadow:0 0 0 1px var(--clay); padding:12%; }
.motif figcaption{ margin-top:.6rem; font-size:.9063rem; color:var(--walnut); }
@media (min-width:860px){ .district-body{ grid-template-columns:1fr 15rem; } }
.wares{ margin-top:2.6rem; }
.wares > h3{ font-family:var(--text); font-weight:600; font-size:1rem; letter-spacing:0; color:var(--charcoal); margin-bottom:1rem; }
.wares ul{ list-style:none; margin:0 0 1.8rem; padding:0; display:grid; gap:1.4rem 2rem; }
.wares li{ border-top:1px solid var(--clay); padding-top:.9rem; }
.wares h4{ font-size:1.1875rem; }
.wares p{ margin:.4rem 0 .7rem; color:#4a443d; font-size:1rem; }
.wares .meta{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.9375rem; color:var(--walnut); }
.wares .meta b{ color:var(--charcoal); font-weight:600; }
@media (min-width:800px){ .wares ul{ grid-template-columns:repeat(3,1fr); } }
.closing{ text-align:center; }
.closing p{ font-family:var(--display); font-size:clamp(1.35rem, 2.6vw, 2rem); line-height:1.35; color:var(--charcoal); max-width:32ch; margin-inline:auto; text-wrap:balance; }
.closing h2{ max-width:22ch; margin-inline:auto; }
.closing .lede{ font-family:var(--text); font-size:1.0625rem; line-height:1.6; color:#4a443d; max-width:38rem; margin:1.2rem auto 2rem; }
.closing .btn-row{ justify-content:center; }
.disclaimer{ font-size:.9375rem; color:var(--walnut); max-width:50rem; margin:0 auto; padding:0 var(--gutter) 3rem; text-align:center; }

/* ---------- motion preferences ---------- */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .announce-track{ animation:none; white-space:normal; flex-wrap:wrap; gap:.3rem 2rem; padding-inline:var(--gutter); }
  .announce-track span[aria-hidden="true"]{ display:none; }
  .hero-art .mount{ animation:none; }
  .fan-card, .piece-photo img, .drawer, .veil{ transition:none; }
}

/* heads that carry their own content need no gap below */
.hampers .head, .droplist .head{ margin-bottom:0; }