/* =========================================================
   Luxopira — style.css
   Nordic wellness identity
   Palette: light, saturated, silver, chrome, mint, deep green
   ========================================================= */

:root{
  /* core palette */
  --clr-light:      #f5faf7;
  --clr-mist:       #eaf3ef;
  --clr-mint-soft:  #d5efe4;
  --clr-mint:       #a6e0c9;
  --clr-mint-vivid: #43c79a;
  --clr-mint-deep:  #2f9e79;
  --clr-forest:     #1c5f4a;
  --clr-forest-ink: #123f32;
  --clr-ink:        #10241d;
  --clr-silver:     #d3d9db;
  --clr-chrome:     #aeb9bb;
  --clr-chrome-ink: #6f7d7e;
  --clr-white:      #ffffff;

  /* semantic */
  --bg:             var(--clr-light);
  --text:           #1a2c26;
  --text-soft:      #4a5b55;
  --accent:         var(--clr-mint-deep);
  --accent-strong:  var(--clr-forest);

  /* type */
  --font-display: "Georgia", "Times New Roman", serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  /* spacing scale */
  --sp-1: .5rem;
  --sp-2: 1rem;
  --sp-3: 1.5rem;
  --sp-4: 2.25rem;
  --sp-5: 3.5rem;
  --sp-6: 5.5rem;

  /* radius + shadow */
  --rad-s: 12px;
  --rad-m: 20px;
  --rad-l: 32px;
  --rad-pill: 999px;
  --shadow-soft: 0 18px 40px -24px rgba(18,63,50,.35);
  --shadow-lift: 0 30px 60px -30px rgba(18,63,50,.45);
  --ring: 0 0 0 3px rgba(67,199,154,.35);

  --wrap: 1180px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--font-body);
  color:var(--text);
  background:var(--bg);
  line-height:1.65;
  font-size:clamp(16px,1.05vw,17.5px);
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:0; background:none; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:600; line-height:1.12; letter-spacing:-.01em; color:var(--accent-strong); }
ul{ list-style:none; }

.lx-wrap{ width:min(100% - 2.5rem, var(--wrap)); margin-inline:auto; }
.eyebrow{
  display:inline-block; font-family:var(--font-body); font-weight:700;
  font-size:.74rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--clr-mint-deep); margin-bottom:var(--sp-2);
}
.eyebrow::before{ content:""; display:inline-block; width:26px; height:2px;
  background:var(--clr-mint-vivid); vertical-align:middle; margin-right:.6rem; border-radius:2px; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:.55rem;
  font-weight:700; font-size:.98rem; letter-spacing:.01em;
  padding:.95rem 1.7rem; border-radius:var(--rad-pill);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease), background .3s;
  will-change:transform;
}
.btn--primary{
  background:linear-gradient(120deg,var(--clr-mint-vivid),var(--clr-mint-deep));
  color:#04231a; box-shadow:0 14px 30px -12px rgba(47,158,121,.7);
}
.btn--primary:hover{ transform:translateY(-3px); box-shadow:0 22px 40px -14px rgba(47,158,121,.8); }
.btn--ghost{
  background:rgba(255,255,255,.08); color:var(--clr-light);
  border:1.5px solid rgba(213,239,228,.45); backdrop-filter:blur(4px);
}
.btn--ghost:hover{ background:rgba(255,255,255,.16); transform:translateY(-2px); }
.btn--dark{ background:var(--clr-forest); color:var(--clr-light); }
.btn--dark:hover{ background:var(--clr-forest-ink); transform:translateY(-3px); box-shadow:var(--shadow-lift); }
.btn:focus-visible{ outline:none; box-shadow:var(--ring); }

/* =========================================================
   HEADER
   ========================================================= */
.masthead{
  position:fixed; inset:0 0 auto 0; z-index:60;
  padding:1.1rem 0; transition:background .35s var(--ease), box-shadow .35s, padding .35s;
}
.masthead.is-stuck{
  background:rgba(245,250,247,.86); backdrop-filter:blur(14px);
  box-shadow:0 8px 30px -20px rgba(18,63,50,.5); padding:.7rem 0;
}
.masthead__inner{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); }
.brand{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-display);
  font-size:1.35rem; font-weight:700; color:var(--accent-strong); letter-spacing:-.02em; }
.brand__dot{ width:14px; height:14px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%,var(--clr-mint-vivid),var(--clr-forest));
  box-shadow:0 0 0 4px rgba(67,199,154,.18); }
.mainnav{ display:flex; align-items:center; gap:var(--sp-4); }
.mainnav a{ font-weight:600; font-size:.96rem; color:var(--text-soft); position:relative; padding:.2rem 0; }
.mainnav a::after{ content:""; position:absolute; left:0; bottom:-3px; width:0; height:2px;
  background:var(--clr-mint-vivid); border-radius:2px; transition:width .3s var(--ease); }
.mainnav a:hover{ color:var(--accent-strong); }
.mainnav a:hover::after{ width:100%; }
.nav-cta{ padding:.6rem 1.3rem; font-size:.9rem; }
.burger{ display:none; width:44px; height:44px; border-radius:var(--rad-s);
  background:var(--clr-mist); position:relative; }
.burger span{ position:absolute; left:11px; right:11px; height:2.2px; background:var(--accent-strong);
  border-radius:2px; transition:transform .3s var(--ease), opacity .2s; }
.burger span:nth-child(1){ top:15px; } .burger span:nth-child(2){ top:21px; } .burger span:nth-child(3){ top:27px; }
.burger.is-open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger.is-open span:nth-child(2){ opacity:0; }
.burger.is-open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

/* =========================================================
   1. HERO
   ========================================================= */
.hero{ position:relative; padding:9.5rem 0 5.5rem; overflow:hidden; }
.hero__bg{ position:absolute; inset:0; z-index:-2; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; }
.hero__bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(115deg,rgba(18,63,50,.92) 0%,rgba(28,95,74,.78) 45%,rgba(47,158,121,.35) 100%); }
.hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:var(--sp-5); align-items:center; }
.hero__copy{ color:var(--clr-light); max-width:34rem; }
.hero__copy .eyebrow{ color:var(--clr-mint); }
.hero__copy .eyebrow::before{ background:var(--clr-mint); }
.hero h1{ color:var(--clr-white); font-size:clamp(2.5rem,5vw,3.75rem); margin-bottom:var(--sp-3); }
.hero h1 em{ font-style:italic; color:var(--clr-mint); }
.hero__lead{ font-size:1.12rem; color:rgba(234,243,239,.9); margin-bottom:var(--sp-4); }
.hero__actions{ display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; margin-bottom:var(--sp-4); }
.hero__price{ display:flex; flex-direction:column; line-height:1.1; }
.hero__price b{ font-family:var(--font-display); font-size:1.9rem; color:var(--clr-white); }
.hero__price span{ font-size:.82rem; letter-spacing:.06em; color:var(--clr-mint); text-transform:uppercase; }
.hero__badges{ display:flex; gap:1.4rem; flex-wrap:wrap; }
.hero__badges li{ display:flex; align-items:center; gap:.5rem; font-size:.88rem; color:rgba(234,243,239,.88); }
.hero__badges b{ color:var(--clr-mint); font-size:1.05rem; }

.hero__visual{ position:relative; display:flex; justify-content:center; }
.hero__product{ width:min(340px,80%); filter:drop-shadow(0 40px 50px rgba(6,30,22,.55));
  animation:floaty 6s ease-in-out infinite; }
.hero__disc{ position:absolute; inset:auto; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle at 40% 35%,rgba(213,239,228,.35),rgba(47,158,121,0) 65%);
  z-index:-1; top:50%; left:50%; transform:translate(-50%,-50%); }
@keyframes floaty{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-16px); } }

/* =========================================================
   2. LIFESTYLE
   ========================================================= */
.lifestyle{ padding:var(--sp-6) 0; }
.lifestyle__grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-5); align-items:center; }
.lifestyle__media{ position:relative; border-radius:var(--rad-l); overflow:hidden;
  box-shadow:var(--shadow-soft); aspect-ratio:4/3; }
.lifestyle__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.lifestyle__media:hover img{ transform:scale(1.05); }
.lifestyle__tag{ position:absolute; left:1.2rem; bottom:1.2rem; background:rgba(245,250,247,.92);
  padding:.7rem 1.1rem; border-radius:var(--rad-pill); font-weight:700; font-size:.86rem;
  color:var(--accent-strong); backdrop-filter:blur(6px); box-shadow:var(--shadow-soft); }
.lifestyle h2{ font-size:clamp(2rem,3.4vw,2.7rem); margin-bottom:var(--sp-3); }
.lifestyle p{ color:var(--text-soft); margin-bottom:var(--sp-3); }
.pillars{ display:grid; gap:var(--sp-2); margin-top:var(--sp-3); }
.pillars li{ display:flex; gap:.9rem; align-items:flex-start; }
.pillars .pill-mark{ flex:0 0 auto; width:34px; height:34px; border-radius:var(--rad-s);
  display:grid; place-items:center; font-family:var(--font-display); font-weight:700; color:#04231a;
  background:linear-gradient(135deg,var(--clr-mint),var(--clr-mint-vivid)); }
.pillars b{ display:block; color:var(--accent-strong); }
.pillars span{ font-size:.94rem; color:var(--text-soft); }

/* =========================================================
   3. PRODUCT PRESENTATION
   ========================================================= */
.product{ padding:var(--sp-6) 0; background:
  linear-gradient(180deg,var(--clr-mist),var(--clr-light)); }
.product__panel{ display:grid; grid-template-columns:.85fr 1.15fr; gap:var(--sp-5);
  background:var(--clr-white); border-radius:var(--rad-l); padding:clamp(1.5rem,3vw,3rem);
  box-shadow:var(--shadow-soft); align-items:center; }
.product__shot{ position:relative; display:grid; place-items:center;
  background:radial-gradient(circle at 50% 40%,var(--clr-mint-soft),var(--clr-mist));
  border-radius:var(--rad-m); padding:var(--sp-4); aspect-ratio:3/4; overflow:hidden; }
.product__shot img{ width:min(240px,75%); object-fit:contain;
  filter:drop-shadow(0 26px 30px rgba(18,63,50,.28)); }
.product h2{ font-size:clamp(1.9rem,3.2vw,2.5rem); margin-bottom:var(--sp-2); }
.product__intro{ color:var(--text-soft); margin-bottom:var(--sp-3); }
.ingredients{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-2) var(--sp-3); margin-bottom:var(--sp-3); }
.ingredients li{ padding:.9rem 1rem; border-radius:var(--rad-s);
  background:var(--clr-mist); border:1px solid rgba(174,185,187,.35); }
.ingredients b{ display:block; color:var(--accent-strong); font-size:.98rem; }
.ingredients span{ font-size:.85rem; color:var(--text-soft); }
.product__note{ font-size:.85rem; color:var(--clr-chrome-ink); border-left:3px solid var(--clr-mint);
  padding-left:.9rem; }

/* =========================================================
   4. ADVANTAGES — horizontal feature cards
   ========================================================= */
.advantages{ padding:var(--sp-6) 0; }
.advantages__head{ max-width:44rem; margin-bottom:var(--sp-5); }
.advantages__head h2{ font-size:clamp(2rem,3.4vw,2.7rem); margin-bottom:var(--sp-2); }
.advantages__head p{ color:var(--text-soft); }
.feature-row{ display:grid; gap:var(--sp-3); }
.feature{ display:grid; grid-template-columns:auto 1fr; gap:var(--sp-3); align-items:center;
  background:var(--clr-white); border:1px solid rgba(174,185,187,.3); border-radius:var(--rad-m);
  padding:1.5rem 1.8rem; box-shadow:var(--shadow-soft);
  transition:transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.feature:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lift); border-color:var(--clr-mint); }
.feature__no{ font-family:var(--font-display); font-size:2.2rem; font-weight:700;
  width:76px; height:76px; border-radius:var(--rad-m); display:grid; place-items:center;
  color:#04231a; background:linear-gradient(135deg,var(--clr-mint-soft),var(--clr-mint));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.6); }
.feature__body h3{ font-size:1.2rem; margin-bottom:.3rem; }
.feature__body p{ color:var(--text-soft); font-size:.95rem; }

/* =========================================================
   5. ROUTINE
   ========================================================= */
.routine{ padding:var(--sp-6) 0; position:relative; color:var(--clr-light);
  background:linear-gradient(150deg,var(--clr-forest-ink),var(--clr-forest)); overflow:hidden; }
.routine::before{ content:""; position:absolute; width:420px; height:420px; right:-120px; top:-120px;
  border-radius:50%; background:radial-gradient(circle,rgba(67,199,154,.28),transparent 70%); }
.routine__head{ text-align:center; max-width:40rem; margin:0 auto var(--sp-5); position:relative; }
.routine__head .eyebrow{ color:var(--clr-mint); }
.routine__head .eyebrow::before{ background:var(--clr-mint); }
.routine__head h2{ color:var(--clr-white); font-size:clamp(2rem,3.4vw,2.7rem); margin-bottom:var(--sp-2); }
.routine__head p{ color:rgba(234,243,239,.85); }
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-3); position:relative; }
.step{ background:rgba(245,250,247,.06); border:1px solid rgba(213,239,228,.18);
  border-radius:var(--rad-m); padding:1.8rem; backdrop-filter:blur(6px);
  transition:transform .35s var(--ease), background .35s; }
.step:hover{ transform:translateY(-5px); background:rgba(245,250,247,.11); }
.step__time{ display:inline-block; font-family:var(--font-display); font-size:1.05rem; font-weight:700;
  color:var(--clr-mint); margin-bottom:.6rem; }
.step h3{ color:var(--clr-white); font-size:1.25rem; margin-bottom:.4rem; }
.step p{ color:rgba(234,243,239,.82); font-size:.93rem; }

/* =========================================================
   6. TRUST & QUALITY
   ========================================================= */
.trust{ padding:var(--sp-6) 0; }
.trust__grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:var(--sp-5); align-items:center; }
.trust__media{ border-radius:var(--rad-l); overflow:hidden; box-shadow:var(--shadow-soft);
  aspect-ratio:5/6; }
.trust__media img{ width:100%; height:100%; object-fit:cover; }
.trust h2{ font-size:clamp(2rem,3.4vw,2.7rem); margin-bottom:var(--sp-2); }
.trust > .trust__grid > div > p{ color:var(--text-soft); margin-bottom:var(--sp-3); }
.quality-cards{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-2); }
.qcard{ background:var(--clr-white); border-radius:var(--rad-m); padding:1.3rem;
  border:1px solid rgba(174,185,187,.3); box-shadow:var(--shadow-soft); }
.qcard__chip{ display:inline-grid; place-items:center; width:44px; height:44px; border-radius:12px;
  margin-bottom:.7rem; font-family:var(--font-display); font-weight:700; color:var(--clr-white);
  background:linear-gradient(135deg,var(--clr-chrome),var(--clr-chrome-ink)); }
.qcard h4{ font-size:1.05rem; margin-bottom:.25rem; }
.qcard p{ font-size:.88rem; color:var(--text-soft); }

/* =========================================================
   7. FAQ
   ========================================================= */
.faq{ padding:var(--sp-6) 0; background:linear-gradient(180deg,var(--clr-light),var(--clr-mist)); }
.faq__head{ text-align:center; max-width:38rem; margin:0 auto var(--sp-5); }
.faq__head h2{ font-size:clamp(2rem,3.4vw,2.7rem); margin-bottom:var(--sp-2); }
.faq__head p{ color:var(--text-soft); }
.accordion{ max-width:820px; margin:0 auto; display:grid; gap:var(--sp-2); }
.acc-item{ background:var(--clr-white); border:1px solid rgba(174,185,187,.3);
  border-radius:var(--rad-m); overflow:hidden; transition:box-shadow .3s, border-color .3s; }
.acc-item.is-open{ box-shadow:var(--shadow-soft); border-color:var(--clr-mint); }
.acc-q{ width:100%; text-align:left; display:flex; justify-content:space-between; align-items:center;
  gap:var(--sp-2); padding:1.25rem 1.5rem; font-weight:700; font-size:1.03rem; color:var(--accent-strong); }
.acc-q .ic{ flex:0 0 auto; width:30px; height:30px; border-radius:50%; display:grid; place-items:center;
  background:var(--clr-mist); color:var(--clr-mint-deep); font-size:1.3rem; line-height:1;
  transition:transform .35s var(--ease), background .3s; }
.acc-item.is-open .ic{ transform:rotate(45deg); background:var(--clr-mint); color:#04231a; }
.acc-a{ max-height:0; overflow:hidden; transition:max-height .4s var(--ease); }
.acc-a p{ padding:0 1.5rem 1.35rem; color:var(--text-soft); font-size:.96rem; }

/* =========================================================
   8. ORDER
   ========================================================= */
.order{ padding:var(--sp-6) 0; }
.order__panel{ display:grid; grid-template-columns:1.05fr .95fr; gap:0;
  border-radius:var(--rad-l); overflow:hidden; box-shadow:var(--shadow-lift); }
.order__aside{ position:relative; padding:clamp(2rem,4vw,3.5rem); color:var(--clr-light);
  background:linear-gradient(150deg,var(--clr-forest),var(--clr-mint-deep)); }
.order__aside .eyebrow{ color:var(--clr-mint); } .order__aside .eyebrow::before{ background:var(--clr-mint); }
.order__aside h2{ color:var(--clr-white); font-size:clamp(1.8rem,3vw,2.4rem); margin-bottom:var(--sp-2); }
.order__aside p{ color:rgba(234,243,239,.88); margin-bottom:var(--sp-3); }
.order__list li{ display:flex; gap:.7rem; align-items:center; margin-bottom:.7rem; font-size:.95rem; }
.order__list .tick{ width:26px; height:26px; border-radius:50%; display:grid; place-items:center;
  background:rgba(213,239,228,.2); color:var(--clr-mint); font-weight:700; }
.order__priceline{ margin-top:var(--sp-3); font-family:var(--font-display); }
.order__priceline b{ font-size:2.2rem; color:var(--clr-white); } .order__priceline span{ opacity:.8; }
.order__form{ background:var(--clr-white); padding:clamp(2rem,4vw,3.5rem); }
.order__form h3{ font-size:1.4rem; margin-bottom:var(--sp-3); }
.field{ margin-bottom:var(--sp-3); }
.field label{ display:block; font-weight:600; font-size:.9rem; color:var(--accent-strong); margin-bottom:.4rem; }
.field input{ width:100%; padding:.95rem 1.1rem; border-radius:var(--rad-s);
  border:1.5px solid var(--clr-silver); background:var(--clr-light); font-size:1rem; color:var(--text);
  transition:border-color .25s, box-shadow .25s, background .25s; }
.field input:focus{ outline:none; border-color:var(--clr-mint-vivid); background:var(--clr-white); box-shadow:var(--ring); }
.field.has-error input{ border-color:#d9534f; background:#fdf3f2; }
.field__err{ display:none; color:#c0392b; font-size:.82rem; margin-top:.35rem; }
.field.has-error .field__err{ display:block; }
.order__submit{ width:100%; justify-content:center; margin-top:.4rem; }
.order__legal{ font-size:.8rem; color:var(--clr-chrome-ink); margin-top:var(--sp-2); }

/* =========================================================
   9. FOOTER
   ========================================================= */
.site-foot{ background:var(--clr-forest-ink); color:rgba(234,243,239,.8); padding:var(--sp-6) 0 var(--sp-3); }
.foot__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:var(--sp-4); margin-bottom:var(--sp-5); }
.foot__brand{ display:flex; align-items:center; gap:.6rem; font-family:var(--font-display);
  font-size:1.3rem; font-weight:700; color:var(--clr-white); margin-bottom:var(--sp-2); }
.foot__brand .brand__dot{ box-shadow:0 0 0 4px rgba(67,199,154,.22); }
.foot__col h4{ color:var(--clr-mint); font-family:var(--font-body); font-size:.82rem;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:var(--sp-2); }
.foot__col a, .foot__col p{ display:block; font-size:.92rem; margin-bottom:.55rem; color:rgba(234,243,239,.8); }
.foot__col a:hover{ color:var(--clr-mint); }
.foot__bar{ border-top:1px solid rgba(213,239,228,.15); padding-top:var(--sp-3);
  display:flex; justify-content:space-between; gap:var(--sp-2); flex-wrap:wrap; font-size:.85rem; }
.foot__bar a:hover{ color:var(--clr-mint); }

/* =========================================================
   COOKIE BANNER
   ========================================================= */
.cookie{ position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:80; max-width:520px;
  background:var(--clr-white); border-radius:var(--rad-m); box-shadow:var(--shadow-lift);
  padding:1.4rem 1.5rem; border:1px solid rgba(174,185,187,.35);
  transform:translateY(140%); transition:transform .5s var(--ease); }
.cookie.is-shown{ transform:translateY(0); }
.cookie h4{ font-size:1.1rem; margin-bottom:.4rem; }
.cookie p{ font-size:.88rem; color:var(--text-soft); margin-bottom:var(--sp-2); }
.cookie__actions{ display:flex; gap:.6rem; flex-wrap:wrap; }
.cookie__actions .btn{ padding:.7rem 1.2rem; font-size:.88rem; }
.btn--line{ background:transparent; border:1.5px solid var(--clr-silver); color:var(--accent-strong); }
.btn--line:hover{ border-color:var(--clr-mint); color:var(--clr-mint-deep); }
.cookie__custom{ margin-top:var(--sp-2); display:none; border-top:1px solid var(--clr-mist); padding-top:var(--sp-2); }
.cookie__custom.is-open{ display:block; }
.cookie__row{ display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.6rem; }
.cookie__row span{ font-size:.9rem; }
.cookie__row small{ display:block; color:var(--clr-chrome-ink); font-size:.78rem; }
.switch{ position:relative; width:46px; height:26px; flex:0 0 auto; }
.switch input{ opacity:0; width:0; height:0; }
.switch .track{ position:absolute; inset:0; background:var(--clr-silver); border-radius:var(--rad-pill);
  transition:background .25s; }
.switch .track::before{ content:""; position:absolute; left:3px; top:3px; width:20px; height:20px;
  background:var(--clr-white); border-radius:50%; transition:transform .25s; box-shadow:0 1px 3px rgba(0,0,0,.2); }
.switch input:checked + .track{ background:var(--clr-mint-vivid); }
.switch input:checked + .track::before{ transform:translateX(20px); }
.switch input:disabled + .track{ background:var(--clr-mint-deep); opacity:.6; }

/* =========================================================
   SUB PAGES (legal / success)
   ========================================================= */
.subhero{ padding:9rem 0 3.5rem; background:linear-gradient(150deg,var(--clr-forest-ink),var(--clr-forest));
  color:var(--clr-light); }
.subhero .eyebrow{ color:var(--clr-mint); } .subhero .eyebrow::before{ background:var(--clr-mint); }
.subhero h1{ color:var(--clr-white); font-size:clamp(2.2rem,4vw,3.2rem); }
.subhero p{ color:rgba(234,243,239,.85); max-width:40rem; margin-top:var(--sp-2); }
.doc{ padding:var(--sp-6) 0; }
.doc__wrap{ max-width:820px; margin:0 auto; }
.doc h2{ font-size:1.5rem; margin:var(--sp-4) 0 var(--sp-2); }
.doc h3{ font-size:1.15rem; margin:var(--sp-3) 0 .5rem; color:var(--clr-mint-deep); }
.doc p{ color:var(--text-soft); margin-bottom:var(--sp-2); }
.doc ul.doc-list{ list-style:disc; padding-left:1.3rem; margin-bottom:var(--sp-2); color:var(--text-soft); }
.doc ul.doc-list li{ margin-bottom:.4rem; }
.doc__meta{ background:var(--clr-mist); border-radius:var(--rad-m); padding:var(--sp-3);
  margin-bottom:var(--sp-4); font-size:.92rem; }
.doc__meta b{ color:var(--accent-strong); }
.back-link{ display:inline-flex; align-items:center; gap:.4rem; font-weight:700; color:var(--clr-mint-deep);
  margin-top:var(--sp-3); }
.back-link:hover{ gap:.7rem; }

.success{ min-height:70vh; display:grid; place-items:center; padding:9rem 0 var(--sp-6);
  text-align:center; }
.success__card{ max-width:560px; background:var(--clr-white); border-radius:var(--rad-l);
  padding:clamp(2rem,4vw,3.5rem); box-shadow:var(--shadow-lift); border:1px solid rgba(174,185,187,.3); }
.success__mark{ width:84px; height:84px; margin:0 auto var(--sp-3); border-radius:50%;
  display:grid; place-items:center; font-size:2.6rem; color:#04231a;
  background:linear-gradient(135deg,var(--clr-mint),var(--clr-mint-vivid));
  box-shadow:0 16px 30px -12px rgba(47,158,121,.6); }
.success h1{ font-size:clamp(1.9rem,3.5vw,2.6rem); margin-bottom:var(--sp-2); }
.success p{ color:var(--text-soft); margin-bottom:var(--sp-2); }
.success__actions{ display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; margin-top:var(--sp-3); }

/* =========================================================
   Scroll reveal
   ========================================================= */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
  .hero__grid,.lifestyle__grid,.product__panel,.trust__grid,.order__panel{ grid-template-columns:1fr; }
  .hero{ padding-top:8rem; }
  .hero__visual{ order:-1; }
  .steps{ grid-template-columns:1fr; }
  .foot__grid{ grid-template-columns:1fr 1fr; }
  .trust__media{ max-width:460px; }
}
@media (max-width:760px){
  :root{ --sp-6:4rem; --sp-5:2.75rem; }
  .mainnav{ position:fixed; inset:0 0 0 auto; width:min(80%,320px); flex-direction:column;
    align-items:flex-start; justify-content:flex-start; gap:var(--sp-3); padding:6rem 1.8rem 2rem;
    background:var(--clr-white); box-shadow:-20px 0 50px -30px rgba(18,63,50,.5);
    transform:translateX(100%); transition:transform .4s var(--ease); z-index:55; }
  .mainnav.is-open{ transform:translateX(0); }
  .mainnav a{ font-size:1.1rem; }
  .nav-cta{ width:100%; justify-content:center; }
  .burger{ display:block; z-index:60; }
  .ingredients,.quality-cards{ grid-template-columns:1fr; }
  .feature{ grid-template-columns:1fr; text-align:left; }
  .feature__no{ width:60px; height:60px; font-size:1.7rem; }
  .foot__grid{ grid-template-columns:1fr; }
  .cookie{ left:.75rem; right:.75rem; bottom:.75rem; }
  .cookie__actions .btn{ flex:1 1 auto; justify-content:center; }
}
@media (max-width:420px){
  .hero__actions{ flex-direction:column; align-items:stretch; }
  .hero__actions .btn{ justify-content:center; }
}
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}