@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('/assets/fonts/outfit-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('/assets/fonts/outfit-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* ===== Leonessa Luxury Candles — warm cream, Outfit throughout ===== */
:root{
  --cream:#F4F7F0;       /* clean, bright, barely-green white */
  --cream-2:#E7F0E3;     /* soft sage panel */
  --paper:#FFFFFF;       /* crisp white cards */
  --ink:#1F2A20;         /* deep green-charcoal */
  --ink-2:#51604E;
  --ink-3:#879585;
  --accent:#0C3B26;      /* racing green — brand + buttons + links */
  --accent-2:#3B7A56;    /* mid leaf green for sprigs/hairlines */
  --accent-ink:#0C3B26;  /* racing green for small text AA */
  --green-mist:#E3EFE4;  /* light green wash for category strip */
  --blush:#D8A79A;       /* pink leopard swatch */
  --blush-ink:#B87363;
  --cocoa:#7E5A41;       /* brown leopard swatch */
  --gold:#B0894F;        /* sparing premium hairline */
  /* Antique-gold ramp for the wordmark. Every stop clears AA-large on the cream
     nav and sage footer; the mid tone (bulk of the letterform) clears full AA. */
  --gold-lo:#7A5C18;
  --gold-mid:#8A6A21;
  --gold-hi:#A9832F;
  --gold-grad:linear-gradient(180deg,var(--gold-hi) 0%,var(--gold-mid) 52%,var(--gold-lo) 100%);
  --green-deep:#08311F;  /* deep racing-green feature bands */
  --line:rgba(31,42,32,.11);
  --line-2:rgba(31,42,32,.06);
  --shadow:0 1px 3px rgba(24,48,30,.05), 0 12px 30px -20px rgba(24,48,30,.16);
  --shadow-lg:0 26px 60px -34px rgba(24,48,30,.30);
  --r:16px; --r-sm:11px;
  --wrap:1200px;
  --wash:linear-gradient(180deg,rgba(255,255,255,.02),rgba(46,125,79,.04) 60%,rgba(21,58,40,.09));
  --ease:cubic-bezier(.22,.61,.36,1);
  font-synthesis:none;
}
*{box-sizing:border-box}
/* A class like .btn{display:inline-flex} or .pay-form{display:flex} outranks the
   browser's built-in [hidden] rule, so hidden elements would still render.
   This makes the hidden attribute reliable everywhere. */
[hidden]{display:none!important}
html{scroll-behavior:smooth;overflow-x:clip;background:var(--cream)}
html,body{margin:0}
body{
  font-family:'Outfit',system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:var(--cream);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
  letter-spacing:.005em;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:300;line-height:1.08;letter-spacing:-.015em}
p{margin:0}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 clamp(20px,5vw,44px)}
.eyebrow{
  font-size:.72rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--accent-ink);display:inline-flex;align-items:center;gap:.7em;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--accent);opacity:.7}
.muted{color:var(--ink-2)}

/* ===== Announcement ===== */
.topbar{
  background:var(--ink);color:#F3E9DA;text-align:center;
  font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500;
  padding:8px 16px;
}
.topbar b{color:var(--accent-2);font-weight:600}

/* ===== Nav ===== */
.nav{
  position:sticky;top:0;z-index:60;
  background:rgba(247,241,230,.82);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-in{display:flex;align-items:center;gap:22px;height:74px}
.brand{display:flex;flex-direction:column;line-height:1;margin-right:auto;padding:4px 0}
.brand .mark{
  font-size:1.34rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-lo); /* fallback for non-clip browsers */
  background:var(--gold-grad);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.brand .mark b{font-weight:600}
.brand .sub{
  font-size:.56rem;font-weight:600;letter-spacing:.42em;text-transform:uppercase;
  color:var(--ink-3);margin-top:5px;padding-left:.16em;
}
.xmas-btn{
  display:inline-flex;align-items:center;gap:8px;padding:9px 17px;border-radius:100px;
  font-size:.85rem;font-weight:600;letter-spacing:.02em;color:#fff;
  background:linear-gradient(135deg,#C43E2C,#A32E22);border:1px solid rgba(255,255,255,.16);
  box-shadow:0 6px 16px -8px rgba(163,46,34,.75);transition:transform .25s var(--ease),box-shadow .3s;
}
.xmas-btn:hover{transform:translateY(-1px);box-shadow:0 11px 22px -8px rgba(163,46,34,.85)}
.xmas-btn svg{width:16px;height:16px;color:#F2C64B}
/* desktop: the festive button replaces the plain Christmas text link */
.nav-links a[href$="#christmas"]{display:none}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{font-size:.9rem;font-weight:500;color:var(--ink-2);position:relative;padding:4px 0}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1.5px;background:var(--accent);transition:right .3s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{right:0}
.bag-btn{
  display:inline-flex;align-items:center;gap:9px;padding:11px 18px;border-radius:100px;
  background:var(--ink);color:var(--cream);font-size:.82rem;font-weight:600;letter-spacing:.04em;
  transition:transform .25s var(--ease),background .25s;
}
.bag-btn:hover{transform:translateY(-1px);background:#3a3025}
.bag-btn .count{
  min-width:20px;height:20px;padding:0 5px;border-radius:100px;background:var(--accent);
  color:#fff;font-size:.7rem;display:grid;place-items:center;font-weight:700;
}
.bag-btn .count[data-empty="1"]{opacity:.35}
.nav-burger{display:none;width:44px;height:44px;border-radius:11px;border:1px solid var(--line);align-items:center;justify-content:center;background:var(--paper)}
.nav-burger span,.nav-burger span::before,.nav-burger span::after{content:"";display:block;width:19px;height:1.6px;background:var(--ink);transition:.3s}
.nav-burger span::before{transform:translateY(-6px)}.nav-burger span::after{transform:translateY(4.4px)}

/* ===== Hero ===== */
.hero{position:relative;padding:clamp(40px,7vw,88px) 0 clamp(48px,7vw,84px)}
.hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(26px,4.5vw,64px);align-items:center}
.hero h1{font-size:clamp(2.6rem,6.4vw,5rem);letter-spacing:-.03em}
.hero h1 em{font-style:italic;color:var(--accent)}
.hero .lede{font-size:clamp(1.02rem,1.5vw,1.16rem);color:var(--ink-2);max-width:44ch;margin-top:22px}
.hero .eyebrow{margin-bottom:26px}
.cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.btn{
  display:inline-flex;align-items:center;gap:10px;padding:15px 27px;border-radius:100px;
  font-weight:600;font-size:.92rem;letter-spacing:.02em;transition:transform .25s var(--ease),box-shadow .3s,background .25s;
}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 12px 26px -12px rgba(12,59,38,.55)}
.btn-primary:hover{transform:translateY(-2px);background:#08311F}
.btn-ghost{border:1px solid var(--ink);color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--cream)}
.btn-cream{background:#F4F7F0;color:var(--green-deep);box-shadow:0 12px 26px -14px rgba(0,0,0,.4)}
.btn-cream:hover{transform:translateY(-2px);background:#fff}
.btn-outline-cream{border:1px solid rgba(255,255,255,.6);color:#F4F7F0}
.btn-outline-cream:hover{background:rgba(255,255,255,.12)}
.btn-arrow{transition:transform .3s}.btn:hover .btn-arrow{transform:translateX(4px)}
.hero-mini{display:flex;gap:26px;margin-top:38px;flex-wrap:wrap}
.hero-mini div{display:flex;flex-direction:column}
.hero-mini b{font-size:1.5rem;font-weight:400;color:var(--ink)}
.hero-mini span{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-top:3px}

.hero-visual{position:relative}
.hero-photo{
  position:relative;aspect-ratio:4/5;border-radius:200px 200px 22px 22px;overflow:hidden;
  box-shadow:var(--shadow-lg);
  background-image:var(--wash),url('/assets/botanical-autumn.jpg');
  background-size:cover;background-position:center;
}
.hero-badge{
  position:absolute;left:-14px;bottom:34px;background:var(--paper);border:1px solid var(--line);
  border-radius:100px;padding:12px 20px 12px 14px;display:flex;align-items:center;gap:12px;
  box-shadow:var(--shadow);
}
.hero-badge .dot{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;color:#fff}
.hero-badge .dot svg{width:21px;height:21px}
.hero-badge b{font-size:.9rem;font-weight:600}
.hero-badge span{font-size:.72rem;color:var(--ink-3);display:block}
.sprig{position:absolute;color:var(--accent-2);opacity:.55;pointer-events:none;z-index:1}
.sprig-tl{width:clamp(88px,11vw,142px);top:-20px;right:-8px;transform:rotate(6deg)}

/* ===== Trust strip ===== */
.trust{border-block:1px solid var(--line);background:var(--cream-2)}
.trust-in{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-block:22px}
.trust-i{display:flex;align-items:center;gap:12px;justify-content:center;text-align:left}
.trust-i .ti{width:36px;height:36px;flex:none;border-radius:10px;background:var(--cream-2);border:1px solid var(--line);display:grid;place-items:center;color:var(--accent)}
.trust-i .ti svg{width:20px;height:20px}
.trust-i b{font-size:.9rem;font-weight:600;display:block;line-height:1.2}
.trust-i span{font-size:.74rem;color:var(--ink-3)}

/* ===== Section frame ===== */
.sec{padding:clamp(52px,8vw,104px) 0}
.sec-head{max-width:640px;margin-bottom:clamp(28px,4vw,48px)}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head h2{font-size:clamp(2rem,4.4vw,3.3rem);margin-top:16px}
.sec-head p{color:var(--ink-2);margin-top:16px;font-size:1.04rem}

/* ===== Shop / filters ===== */
.shop{background:var(--paper)}
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}
.chip{
  padding:9px 17px;border-radius:100px;border:1px solid var(--line);background:var(--cream);
  font-size:.84rem;font-weight:600;color:var(--ink-2);transition:.22s;white-space:nowrap;
}
.chip:hover{border-color:var(--accent-2);color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--cream);border-color:var(--ink)}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.2vw,26px)}
.card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s;
}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.card-media{position:relative;aspect-ratio:4/5;overflow:hidden;background:#fdfbf7}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.card:hover .card-media img{transform:scale(1.05)}
.card-tag{
  position:absolute;top:12px;left:12px;background:rgba(252,248,240,.92);backdrop-filter:blur(4px);
  border-radius:100px;padding:5px 12px;font-size:.68rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--accent-ink);
}
.card-tag.xmas{color:#fff;background:var(--green-deep)}
.card-swatches{position:absolute;bottom:12px;left:12px;display:flex;gap:6px}
.sw{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.card-body{padding:18px 18px 20px;display:flex;flex-direction:column;gap:12px;flex:1}
.card-body h3{font-size:1.24rem;font-weight:500;letter-spacing:-.01em}
.card-desc{font-size:.86rem;color:var(--ink-2);line-height:1.5;margin-top:-4px}
.opts{display:flex;flex-direction:column;gap:9px;margin-top:auto}
.field label{font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);display:block;margin-bottom:4px}
.select-wrap{position:relative}
.select-wrap::after{content:"";position:absolute;right:14px;top:50%;width:7px;height:7px;border-right:1.6px solid var(--ink-2);border-bottom:1.6px solid var(--ink-2);transform:translateY(-70%) rotate(45deg);pointer-events:none}
select.sel{
  width:100%;appearance:none;-webkit-appearance:none;font-family:inherit;font-size:.86rem;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:10px 34px 10px 13px;font-weight:500;cursor:pointer;
}
select.sel:hover{border-color:var(--accent-2)}
.toggle{display:flex;gap:6px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:4px}
.toggle button{flex:1;padding:7px 6px;border-radius:6px;font-size:.8rem;font-weight:600;color:var(--ink-2);transition:.2s}
.toggle button[aria-pressed="true"]{background:var(--ink);color:var(--cream)}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px}
.price{font-size:1.18rem;font-weight:500}
.price small{font-size:.74rem;color:var(--ink-3);font-weight:500}
.add{
  display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;
  padding:11px 16px;border-radius:100px;font-size:.82rem;font-weight:600;transition:.24s;
}
.add:hover{background:#08311F;transform:translateY(-1px)}
.add.added{background:#5e7d54}
.empty-note{grid-column:1/-1;text-align:center;color:var(--ink-3);padding:40px 0;font-size:.95rem}

/* ===== Scents ===== */
.scents{background:var(--cream-2)}
.scent-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.scent{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);padding:22px;
  display:flex;flex-direction:column;gap:6px;position:relative;overflow:hidden;transition:.3s;
}
.scent:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.scent::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:linear-gradient(var(--accent),var(--accent-2))}
.scent .n{font-size:.7rem;font-weight:700;color:var(--accent);letter-spacing:.14em}
.scent h4{font-size:1.22rem;font-weight:500}
.scent p{font-size:.85rem;color:var(--ink-2)}
.scent .note{font-size:.72rem;color:var(--accent-ink);font-weight:600;margin-top:4px}
/* Christmas banner + stock */
.xmas-sec{background:var(--cream)}
.xmas-banner{position:relative;overflow:hidden;text-align:center;color:#EAF3EA;
  background:linear-gradient(125deg,var(--green-deep),#2C6440);padding:clamp(46px,7vw,84px) 0}
.xmas-banner-in{max-width:700px;margin:0 auto;display:flex;flex-direction:column;align-items:center;position:relative;z-index:2}
.xmas-banner .eyebrow{color:var(--accent-2)}
.xmas-banner .eyebrow::before{background:var(--accent-2)}
.xmas-banner h2{color:#fff;font-size:clamp(2.1rem,5vw,3.5rem);margin-top:16px}
.xmas-banner h2 em,.xmas-banner p em{font-style:italic;color:#F1E4C4}
.xmas-banner p{color:#CFE0CF;margin:18px 0 26px;font-size:1.03rem;max-width:52ch}
.xmas-banner .btn-primary{background:#F4F7F0;color:var(--green-deep)}
.xmas-banner .btn-primary:hover{background:#fff}
.xmas-sprig{color:#6FBB88;opacity:.35;width:clamp(120px,18vw,230px);z-index:1}
.xmas-sprig-l{left:-14px;bottom:-24px;top:auto;right:auto;transform:rotate(-4deg)}
.xmas-sprig-r{right:-14px;top:-20px;transform:rotate(8deg)}
.xmas-cans{padding-block:clamp(34px,5vw,58px)}
.xmas-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,22px)}
.xmas-grid figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden;box-shadow:var(--shadow);transition:transform .35s var(--ease),box-shadow .35s}
.xmas-grid figure:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.xmas-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.xmas-grid figure:hover img{transform:scale(1.05)}
.xmas-grid figcaption{padding:13px;font-size:.9rem;font-weight:600;color:var(--ink);text-align:center;background:#fff;border-top:1px solid var(--line)}
/* Each keepsake is a link into the Christmas range in the shop */
.xmas-can{display:block;color:inherit}
.xmas-can:focus-visible{outline-offset:5px}
.xc-go{display:block;margin-top:4px;font-size:.72rem;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--accent-ink);opacity:.62;transition:opacity .3s}
.xmas-can:hover .xc-go{opacity:1}
/* Brief highlight on the card you arrived from */
.card-focus{outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--r);
  animation:cardPulse 2.2s var(--ease)}
@keyframes cardPulse{0%{box-shadow:0 0 0 0 rgba(12,59,38,.30)}70%{box-shadow:0 0 0 16px rgba(12,59,38,0)}100%{box-shadow:0 0 0 0 rgba(12,59,38,0)}}

/* Gallery */
.gallery{background:var(--cream-2)}
/* Real grid (not CSS columns) so source order maps to on-screen position —
   this is what lets pairs sit genuinely side by side. All photos are 3:4, so
   aspect-ratio + cover crops nothing. */
.gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gal-grid figure{margin:0;border-radius:var(--r-sm);overflow:hidden;box-shadow:var(--shadow);background:#fdfbf7}
.gal-grid img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.gal-grid figure:hover img{transform:scale(1.04)}

/* ===== About ===== */
.about-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,4.5vw,60px);align-items:center}
.about-photo{aspect-ratio:5/6;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg);
  background-size:cover;background-position:center;position:relative}
.about-sign{position:absolute;left:22px;bottom:22px;color:#fff;font-style:italic;font-size:1.5rem;font-weight:300;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.about h2{font-size:clamp(2rem,4vw,3rem)}
.about .lede{font-size:1.12rem;color:var(--ink);margin:20px 0}
.about p+p{margin-top:14px;color:var(--ink-2)}
.about-facts{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.about-facts span{background:var(--cream);border:1px solid var(--line);border-radius:100px;padding:9px 16px;font-size:.82rem;font-weight:600;color:var(--ink-2)}

/* ===== Duo / gifting ===== */
.duo{background:var(--paper)}
.duo-card{
  display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--cream);box-shadow:var(--shadow);
}
.duo-photo{background-color:#fbfaf6;background-size:contain;background-position:center;background-repeat:no-repeat;min-height:420px}
.duo-body{padding:clamp(26px,4vw,48px);display:flex;flex-direction:column;justify-content:center}
.duo-body h3{font-size:clamp(1.7rem,3vw,2.4rem)}
.duo-body p{color:var(--ink-2);margin:16px 0 22px;max-width:42ch}
.duo-body .btn{align-self:flex-start}

/* ===== Wholesale CTA ===== */
.wholesale-cta{background:linear-gradient(125deg,var(--green-deep),#245237);color:var(--cream)}
.wc-in{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;align-items:center;padding-block:clamp(40px,6vw,72px)}
.wc-in h2{color:#fff;font-size:clamp(1.9rem,3.6vw,2.8rem)}
.wc-in .eyebrow{color:var(--accent-2)}.wc-in .eyebrow::before{background:var(--accent-2)}
.wc-in p{color:#CFE0CF;margin-top:16px;max-width:46ch}
.wc-in .btn-primary{background:#F4F7F0;color:var(--green-deep)}
.wc-in .btn-primary:hover{background:#fff}
.wc-actions{display:flex;justify-content:flex-end}

/* ===== Footer ===== */
.footer{background:var(--cream-2);border-top:1px solid var(--line);padding:clamp(46px,6vw,72px) 0 0}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:36px;padding-bottom:44px}
.foot-brand .mark{font-size:1.4rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-lo);
  background:var(--gold-grad);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.foot-brand .mark b{font-weight:600}
.foot-brand p{color:var(--ink-2);margin-top:14px;max-width:36ch;font-size:.92rem}
.foot-social{display:flex;gap:10px;margin-top:20px}
.foot-social a{width:40px;height:40px;border-radius:11px;border:1px solid var(--line);background:var(--paper);display:grid;place-items:center;color:var(--ink);transition:.24s}
.foot-social a:hover{background:var(--ink);color:var(--cream);transform:translateY(-2px)}
.foot-col h5{font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:0 0 14px}
.foot-col a,.foot-col p{display:block;color:var(--ink-2);font-size:.9rem;padding:5px 0}
.foot-col a:hover{color:var(--accent-ink)}
.foot-flag{font-size:.74rem;color:var(--ink-3);font-style:italic}
.foot-bottom{border-top:1px solid var(--line);padding:22px 0 78px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center}
.foot-bottom small{color:var(--ink-3);font-size:.82rem}
.digisurf{color:var(--accent);font-weight:600;font-size:.86rem}
.digisurf:hover{text-decoration:underline}

/* ===== Bag drawer ===== */
.overlay{position:fixed;inset:0;background:rgba(43,36,28,.42);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:.35s;z-index:90}
.overlay.open{opacity:1;visibility:visible}
.drawer{
  position:fixed;top:0;right:0;height:100%;width:min(420px,92vw);background:var(--paper);z-index:95;
  display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;
  transition:transform .42s var(--ease),visibility .42s;box-shadow:var(--shadow-lg);
}
.drawer.open{transform:translateX(0);visibility:visible}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:22px 22px 16px;border-bottom:1px solid var(--line)}
.drawer-head h3{font-size:1.3rem;font-weight:500}
.drawer-close{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);font-size:1.1rem;color:var(--ink-2)}
.drawer-close:hover{background:var(--cream-2)}
/* min-height:0 is required or a flex child refuses to shrink below its content
   and overflow-y:auto never actually scrolls. */
.drawer-items{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 22px;display:flex;flex-direction:column;gap:12px}
.d-item{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line-2)}
.d-item .thumb{width:56px;height:56px;border-radius:9px;background:var(--cream-2);background-size:cover;background-position:center}
.d-item b{font-size:.92rem;font-weight:600;display:block}
.d-item span{font-size:.76rem;color:var(--ink-3)}
.d-item .rm{font-size:.72rem;color:var(--blush-ink);margin-top:3px}
.d-item .p{font-weight:600;font-size:.92rem}
.drawer-empty{color:var(--ink-3);text-align:center;padding:60px 20px;font-size:.95rem}
.drawer-foot{flex:0 0 auto;padding:18px 22px 24px;border-top:1px solid var(--line);background:var(--cream)}
/* While the checkout form is open the footer holds a full form, which is far
   taller than the drawer. Hand the space to the footer and let IT scroll, or the
   Pay button ends up below the fold and the order can never be completed. */
.drawer.checkout .drawer-items{flex:0 1 auto;max-height:22vh}
.drawer.checkout .drawer-foot{flex:1 1 auto;min-height:0;overflow-y:auto}
.drawer-foot .row{display:flex;justify-content:space-between;margin-bottom:10px;font-size:.94rem;color:var(--ink-2)}
.drawer-foot .row b{font-weight:600;color:var(--ink)}
.drawer-foot .row-total{margin-top:6px;padding-top:12px;border-top:1px solid var(--line);font-size:1.08rem;color:var(--ink)}
.gift-opt{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.gift-check{display:flex;align-items:flex-start;gap:9px;font-size:.86rem;font-weight:600;color:var(--ink);cursor:pointer;line-height:1.35}
.gift-check input{margin-top:2px;width:16px;height:16px;accent-color:var(--accent);flex:none;cursor:pointer}
.gift-msg{position:relative;margin-top:11px}
.gift-msg textarea{
  width:100%;font-family:inherit;font-size:.88rem;color:var(--ink);background:var(--cream);
  border:1px solid var(--line);border-radius:10px;padding:11px 13px 22px;resize:vertical;transition:.2s;
}
.gift-msg textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(12,59,38,.12)}
.gift-count{position:absolute;right:11px;bottom:8px;font-size:.68rem;color:var(--ink-3)}
.drawer-foot .btn{width:100%;justify-content:center}
.drawer-note{font-size:.72rem;color:var(--ink-3);text-align:center;margin-top:12px}

/* ===== Checkout form in the bag drawer ===== */
.pay-form{margin-top:14px;display:flex;flex-direction:column;gap:10px}
.pay-step{font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-3);margin:6px 0 0;padding-top:10px;border-top:1px solid var(--line)}
.pay-form .pf{display:flex;flex-direction:column;gap:5px}
.pay-form .pf-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pay-form label{font-size:.72rem;font-weight:600;letter-spacing:.06em;color:var(--ink-2)}
.pay-form label small{font-weight:400;color:var(--ink-3);letter-spacing:0}
.pay-form input{
  width:100%;font-family:inherit;font-size:.92rem;color:var(--ink);background:var(--paper);
  border:1px solid var(--line);border-radius:9px;padding:11px 13px;transition:border-color .2s;
}
.pay-form input:focus{outline:none;border-color:var(--accent)}
.pay-form input.bad{border-color:#a02b21;background:#fdf6f5}
.pf-err{display:none;font-size:.76rem;color:#a02b21;line-height:1.4}
.pf-err.show{display:block}
/* Square mounts its card iframe in here */
#card-container{min-height:52px}
.pay-alert{
  background:#fdf3f2;border:1px solid #e7c3bf;color:#8f2318;border-radius:9px;
  padding:11px 13px;font-size:.84rem;line-height:1.5;
}
.btn-pay{width:100%;justify-content:center;margin-top:4px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}
.f-error{display:none;margin-top:12px;background:#fdf3f2;border:1px solid #e7c3bf;color:#8f2318;
  border-radius:9px;padding:11px 13px;font-size:.86rem;line-height:1.5}
.f-error.show{display:block}

/* Paid confirmation */
.pay-done{text-align:center;padding:22px 6px 8px}
.pd-tick{width:52px;height:52px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center;
  background:var(--accent);color:#fff;font-size:1.5rem;font-weight:700}
.pay-done h4{font-size:1.25rem;font-weight:400;margin-bottom:8px}
.pay-done p{font-size:.88rem;color:var(--ink-2);line-height:1.6}
.pd-ref{margin-top:10px;font-size:.8rem;color:var(--ink-3)}
.pd-ref b{color:var(--ink);letter-spacing:.08em}
.pay-done .btn{margin-top:18px}

/* ===== Thank-you page ===== */
.ty-wrap{padding:clamp(48px,8vw,96px) 0 clamp(60px,9vw,110px);background:var(--cream)}
.ty-in{max-width:760px;text-align:center}
.ty-mark{width:76px;height:76px;margin:0 auto 26px;border-radius:50%;display:grid;place-items:center;
  background:var(--accent);color:#fff;box-shadow:0 18px 40px -20px rgba(12,59,38,.7)}
.ty-mark svg{width:34px;height:34px}
.ty-in .eyebrow{justify-content:center}
.ty-in h1{font-size:clamp(1.9rem,4.6vw,3rem);margin:16px 0 0;letter-spacing:-.025em}
.ty-lede{font-size:1.06rem;color:var(--ink-2);margin-top:18px;line-height:1.7}
.ty-ref{display:inline-flex;flex-direction:column;gap:4px;margin-top:28px;padding:16px 34px;
  background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.ty-ref span{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.ty-ref b{font-size:1.3rem;font-weight:600;letter-spacing:.1em;color:var(--accent-ink)}
.ty-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:44px;text-align:left}
.ty-step{display:flex;gap:13px;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:18px 16px;box-shadow:var(--shadow)}
.ty-step .n{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--cream-2);color:var(--accent-ink);font-size:.78rem;font-weight:700}
.ty-step b{font-size:.92rem;font-weight:600}
.ty-step p{font-size:.82rem;color:var(--ink-2);margin-top:5px;line-height:1.55}
.ty-help{font-size:.88rem;color:var(--ink-2);margin-top:36px;line-height:1.65}
.ty-help a{color:var(--accent-ink);font-weight:600}
.ty-cta{justify-content:center;margin-top:30px}
@media(max-width:760px){ .ty-steps{grid-template-columns:1fr} }
@media(max-width:420px){ .pay-form .pf-row{grid-template-columns:1fr} }

/* toast */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:var(--cream);padding:13px 22px;border-radius:100px;font-size:.88rem;font-weight:500;z-index:120;opacity:0;visibility:hidden;transition:.3s;box-shadow:var(--shadow-lg)}
.toast.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}

/* ===== Reveal ===== */
html.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
html.js .reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){html.js .reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* ===== Wholesale page ===== */
.page-hero{padding:clamp(48px,7vw,96px) 0 clamp(30px,4vw,50px);background:var(--cream-2);border-bottom:1px solid var(--line)}
.page-hero h1{font-size:clamp(2.4rem,5.4vw,4rem)}
.page-hero .lede{color:var(--ink-2);font-size:1.1rem;max-width:52ch;margin-top:20px}
.page-hero .crumb{font-size:.8rem;color:var(--ink-3);margin-bottom:20px;letter-spacing:.06em}
.page-hero .crumb a:hover{color:var(--accent-ink)}
.ws-feats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ws-feat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.ws-feat .ic{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;color:#fff;font-size:1.2rem;margin-bottom:16px}
.ws-feat h3{font-size:1.24rem;font-weight:500;margin-bottom:8px}
.ws-feat p{color:var(--ink-2);font-size:.9rem}
.ws-split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,4.5vw,56px);align-items:start}
.ws-photo{aspect-ratio:4/5;border-radius:22px;overflow:hidden;box-shadow:var(--shadow-lg);background-size:cover;background-position:center;position:sticky;top:96px}
.form{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(24px,3.5vw,38px);box-shadow:var(--shadow)}
.form h2{font-size:1.8rem;margin-bottom:6px}
.form>p{color:var(--ink-2);font-size:.92rem;margin-bottom:22px}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f-field{margin-bottom:15px;display:flex;flex-direction:column}
.f-field label{font-size:.74rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:7px}
.f-field input,.f-field textarea,.f-field select{
  font-family:inherit;font-size:.95rem;color:var(--ink);background:var(--cream);border:1px solid var(--line);
  border-radius:10px;padding:13px 15px;width:100%;transition:.2s;
}
.f-field input:focus,.f-field textarea:focus,.f-field select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(12,59,38,.13)}
.f-field textarea{min-height:110px;resize:vertical}
.form .btn{width:100%;justify-content:center;margin-top:6px}
.form-done{display:none;text-align:center;padding:34px 10px}
.form-done.show{display:block}
.form-done .ok{width:56px;height:56px;border-radius:50%;background:#5e7d54;color:#fff;display:grid;place-items:center;font-size:1.6rem;margin:0 auto 16px}
.form.sent .f-live{display:none}

/* ===== Brand banner (racing green hero) ===== */
.brand-band{
  position:relative;overflow:hidden;text-align:center;color:#EAF3EA;
  background:radial-gradient(120% 130% at 50% -10%,#155338 0%,var(--green-deep) 60%);
  padding:clamp(52px,8vw,104px) 0 clamp(48px,7vw,92px);
}
.brand-band-in{position:relative;z-index:2;max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.brand-word{
  font-size:clamp(2.7rem,10vw,7rem);font-weight:700;letter-spacing:.06em;
  line-height:.98;text-transform:uppercase;
  color:#F6D46E; /* fallback for non-clip browsers */
  background:linear-gradient(180deg,#FFF3C0 0%,#F8D46E 48%,#E7B84C 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.brand-word-sub{
  margin-top:14px;font-size:clamp(.66rem,1.5vw,.82rem);font-weight:600;letter-spacing:.34em;
  text-transform:uppercase;color:#A9CBB4;
}
.brand-band-copy{margin:26px auto 0;max-width:60ch;font-size:clamp(1rem,1.5vw,1.16rem);color:#D6E6D8}
.brand-band-copy em{font-style:italic;color:#EBD9A6}
.brand-band .cta-row{justify-content:center;margin-top:34px}
.brand-band .leaf{position:absolute;top:0;bottom:0;height:100%;width:auto;color:#5FA37B;opacity:.28;z-index:1;pointer-events:none}
.leaf-l{left:max(-30px,-3vw)}
.leaf-r{right:max(-30px,-3vw)}

/* ===== Category strip ===== */
.cat-strip{background:var(--green-mist);border-bottom:1px solid var(--line)}
.cat-strip-in{
  display:flex;flex-wrap:wrap;justify-content:center;gap:6px clamp(14px,3vw,40px);
  padding:15px clamp(20px,5vw,44px);
}
.cat-strip a{
  font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);
  padding:6px 2px;position:relative;transition:.2s;white-space:nowrap;
}
.cat-strip a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1.5px;background:var(--accent);transition:right .3s var(--ease)}
.cat-strip a:hover{color:var(--green-deep)}
.cat-strip a:hover::after{right:0}

/* ===== Scent best-seller badge ===== */
.scent{padding-top:26px}
.best-badge{
  position:absolute;top:0;right:0;background:var(--gold);color:#fff;
  font-size:.62rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  padding:5px 12px;border-bottom-left-radius:10px;
}

/* ===== Reviews ===== */
.reviews{background:var(--paper)}
.review-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.4vw,26px)}
.review{
  margin:0;background:var(--cream);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(24px,3vw,34px);display:flex;flex-direction:column;gap:14px;position:relative;box-shadow:var(--shadow);
}
.review-lead{background:linear-gradient(160deg,#12492F,var(--green-deep));color:#E7F1E8;border-color:transparent}
.review-kind{
  font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);
  display:inline-flex;align-self:flex-start;background:var(--green-mist);padding:5px 12px;border-radius:100px;
}
.review-lead .review-kind{color:#0C3B26;background:#D9E7C6}
.review blockquote{margin:0;display:flex;flex-direction:column;gap:12px}
.review blockquote p{font-size:.98rem;line-height:1.62;color:var(--ink-2)}
.review-lead blockquote p{color:#D6E6D8}
.review figcaption{margin-top:auto;padding-top:6px}
.review figcaption b{display:block;font-size:1rem;font-weight:600;color:var(--ink)}
.review figcaption span{font-size:.82rem;color:var(--ink-3)}
.review-lead figcaption b{color:#fff}.review-lead figcaption span{color:#A9CBB4}

/* ===== Delivery & packaging ===== */
.info-band{background:var(--cream-2);padding-block:clamp(40px,6vw,72px)}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2.4vw,26px)}
.info-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(24px,3vw,34px);box-shadow:var(--shadow)}
.info-card .info-ic{font-size:1.6rem}
.info-card h3{font-size:1.3rem;font-weight:500;margin:10px 0 8px}
.info-card p{color:var(--ink-2);font-size:.96rem}
.info-card a{color:var(--accent-ink);font-weight:600}
.info-card a:hover{text-decoration:underline}

/* ===== Responsive ===== */
@media(max-width:1000px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-copy{order:0}.hero-visual{order:1;max-width:460px}
  .about-grid{grid-template-columns:1fr}
  .about-photo{max-width:420px;order:1}
  .grid,.scent-grid{grid-template-columns:repeat(2,1fr)}
  .wc-in,.xmas-band,.duo-card,.ws-split{grid-template-columns:1fr}
  .wc-actions{justify-content:flex-start}
  .ws-photo{position:static;aspect-ratio:16/10}
  .ws-feats{grid-template-columns:1fr}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .nav-links,.hero-mini{display:none}
  .nav-burger{display:flex}
  .xmas-btn{display:none}
  .nav-in{height:64px;gap:14px}
  .bag-btn span.lbl{display:none}
  .bag-btn{padding:11px 13px}
  .trust-in{grid-template-columns:1fr 1fr;gap:16px 8px}
  .trust-i{justify-content:flex-start}
  .gal-grid{grid-template-columns:repeat(2,1fr)}
  .xmas-grid{grid-template-columns:1fr 1fr}
  .review-grid,.info-grid{grid-template-columns:1fr}
  .brand-band .leaf{opacity:.16;width:auto}
  .foot-grid{grid-template-columns:1fr;gap:26px}
  .foot-bottom{padding-bottom:70px}
  .duo-photo{min-height:340px}
  /* mobile menu */
  .nav-links.open{
    display:flex;position:absolute;top:64px;left:0;right:0;flex-direction:column;gap:0;
    background:var(--paper);border-bottom:1px solid var(--line);padding:8px 0;box-shadow:var(--shadow);
  }
  .nav-links.open a{padding:14px clamp(20px,5vw,44px);font-size:1rem;border-bottom:1px solid var(--line-2)}
  .nav-links.open a::after{display:none}
  .nav-links.open a[href$="#christmas"]{display:block;color:var(--accent)}
}
@media(max-width:480px){
  .grid,.scent-grid{grid-template-columns:1fr}
  .hero-photo{border-radius:140px 140px 20px 20px}
  .f-row{grid-template-columns:1fr}
  .hero-badge{left:0}
}

/* Screen-reader-only text. Used to give the display H1 ("LEONESSA") a full,
   descriptive reading for assistive tech and search engines without changing
   the visual design. Never use this to hide anything not on the page. */
.seo-h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}