/* =====================================================================
   Luxomella — Ozalyn  |  wellness identity stylesheet
   Palette: light + saturated + silver + chrome + mint + green + deep green
   All class names are project-specific (lx- prefix).
   ===================================================================== */

/* ----------  design tokens  ---------- */
:root{
  /* colour */
  --lx-deep:#11332a;         /* deep green   */
  --lx-forest:#1b4f3f;       /* green        */
  --lx-green:#2e7a5c;        /* saturated    */
  --lx-green-soft:#4a9c78;
  --lx-mint:#a8e0c7;         /* mint         */
  --lx-mint-hi:#d6f4e4;      /* light mint   */
  --lx-cloud:#eef8f3;        /* light        */
  --lx-white:#f7fbf9;
  --lx-silver:#ced6d8;       /* silver       */
  --lx-chrome:#e8eeef;       /* chrome       */
  --lx-steel:#8aa2a2;
  --lx-ink:#0f2620;
  --lx-ink-soft:#3a534b;

  /* chrome / metal gradients */
  --lx-metal:linear-gradient(135deg,#f4f8f9 0%,#ced6d8 38%,#eef2f3 62%,#aebcbc 100%);
  --lx-metal-line:linear-gradient(90deg,transparent,#ced6d8,#f4f8f9,#ced6d8,transparent);
  --lx-verdant:linear-gradient(135deg,var(--lx-forest),var(--lx-green) 55%,var(--lx-green-soft));
  --lx-glass:linear-gradient(160deg,rgba(247,251,249,.9),rgba(214,244,228,.5));

  /* spacing scale (unique 7-step, ratio ~1.5 rooted at 7px) */
  --sp-1:7px;
  --sp-2:12px;
  --sp-3:20px;
  --sp-4:33px;
  --sp-5:54px;
  --sp-6:88px;
  --sp-7:132px;

  /* radius */
  --r-xs:9px;
  --r-sm:16px;
  --r-md:26px;
  --r-lg:40px;
  --r-pill:999px;

  /* typography scale (unique, root 17px, ratio 1.28) */
  --t-cap:.74rem;
  --t-sm:.86rem;
  --t-base:1.06rem;
  --t-lg:1.36rem;
  --t-xl:1.92rem;
  --t-2xl:2.7rem;
  --t-3xl:3.7rem;
  --t-4xl:5rem;

  --lx-shadow-s:0 4px 14px rgba(17,51,42,.08);
  --lx-shadow-m:0 14px 40px rgba(17,51,42,.12);
  --lx-shadow-l:0 30px 70px rgba(17,51,42,.18);
  --lx-ring:0 0 0 3px rgba(46,122,92,.35);

  --lx-ease:cubic-bezier(.22,.61,.36,1);
  --lx-maxw:1200px;
}

/* ----------  reset  ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
body{
  font-family:"Segoe UI",Candara,"Trebuchet MS",Verdana,system-ui,-apple-system,sans-serif;
  font-size:var(--t-base);
  line-height:1.68;
  color:var(--lx-ink);
  background:var(--lx-white);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
:focus-visible{outline:3px solid var(--lx-green);outline-offset:3px;border-radius:4px}

/* headings — unique display treatment (tight tracking, layered weight) */
h1,h2,h3,h4{
  font-family:"Gill Sans","Gill Sans MT",Corbel,Candara,"Segoe UI",sans-serif;
  line-height:1.1;
  letter-spacing:-.02em;
  color:var(--lx-deep);
  font-weight:600;
}

/* ----------  utility layout  ---------- */
.lx-shell{width:100%;max-width:var(--lx-maxw);margin-inline:auto;padding-inline:var(--sp-4)}
.lx-band{padding-block:var(--sp-7)}
.lx-eyebrow{
  display:inline-flex;align-items:center;gap:var(--sp-1);
  font-size:var(--t-cap);font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--lx-green);
}
.lx-eyebrow::before{
  content:"";width:26px;height:2px;border-radius:2px;
  background:var(--lx-verdant);
}
.lx-section-head{max-width:660px;margin-bottom:var(--sp-5)}
.lx-section-head h2{
  font-size:var(--t-2xl);margin-top:var(--sp-2);
}
.lx-section-head p{color:var(--lx-ink-soft);margin-top:var(--sp-3);font-size:var(--t-lg)}
.lx-center{margin-inline:auto;text-align:center}
.lx-center .lx-eyebrow{justify-content:center}

/* ----------  buttons (unique metallic-mint style)  ---------- */
.lx-btn{
  --pad-y:15px;--pad-x:32px;
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  padding:var(--pad-y) var(--pad-x);
  font-size:var(--t-base);font-weight:700;letter-spacing:.01em;
  border-radius:var(--r-pill);
  transition:transform .35s var(--lx-ease),box-shadow .35s var(--lx-ease),filter .35s var(--lx-ease);
  will-change:transform;
}
.lx-btn--solid{
  color:var(--lx-white);
  background:var(--lx-verdant);
  box-shadow:0 12px 26px rgba(27,79,63,.32),inset 0 1px 0 rgba(255,255,255,.28);
}
.lx-btn--solid:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgba(27,79,63,.4),inset 0 1px 0 rgba(255,255,255,.32)}
.lx-btn--solid:active{transform:translateY(-1px)}
.lx-btn--ghost{
  color:var(--lx-forest);
  background:var(--lx-glass);
  border:1.5px solid var(--lx-mint);
  box-shadow:var(--lx-shadow-s);
}
.lx-btn--ghost:hover{transform:translateY(-3px);border-color:var(--lx-green);box-shadow:var(--lx-shadow-m)}
.lx-btn--chrome{
  color:var(--lx-deep);
  background:var(--lx-metal);
  box-shadow:var(--lx-shadow-s),inset 0 1px 0 rgba(255,255,255,.7);
}
.lx-btn--chrome:hover{transform:translateY(-3px);box-shadow:var(--lx-shadow-m),inset 0 1px 0 rgba(255,255,255,.8)}
.lx-btn--wide{width:100%}

/* arrow glyph via CSS */
.lx-arrow{width:18px;height:18px;position:relative;flex:none}
.lx-arrow::before{content:"";position:absolute;top:50%;left:1px;width:13px;height:2px;background:currentColor;transform:translateY(-50%);border-radius:2px}
.lx-arrow::after{content:"";position:absolute;top:50%;right:2px;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:translateY(-50%) rotate(45deg);border-radius:1px}

/* =====================================================================
   HEADER / NAV
   ===================================================================== */
.lx-topbar{
  position:sticky;top:0;z-index:60;
  background:rgba(247,251,249,.72);
  backdrop-filter:saturate(160%) blur(16px);
  -webkit-backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid rgba(206,214,216,.6);
  transition:box-shadow .3s var(--lx-ease),background .3s var(--lx-ease);
}
.lx-topbar.lx-scrolled{box-shadow:var(--lx-shadow-s);background:rgba(247,251,249,.92)}
.lx-nav{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);min-height:74px}
.lx-brand{display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:800;font-size:var(--t-lg);letter-spacing:-.01em;color:var(--lx-deep)}
.lx-brand__mark{
  width:38px;height:38px;flex:none;border-radius:12px;position:relative;
  background:var(--lx-verdant);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 6px 14px rgba(27,79,63,.28);
}
.lx-brand__mark::before{ /* leaf */
  content:"";position:absolute;inset:9px;border-radius:0 60% 0 60%;
  background:linear-gradient(140deg,var(--lx-mint-hi),var(--lx-mint));
  transform:rotate(-8deg);
}
.lx-brand span small{display:block;font-size:var(--t-cap);font-weight:600;letter-spacing:.24em;color:var(--lx-steel);text-transform:uppercase}

.lx-menu{display:flex;align-items:center;gap:var(--sp-4)}
.lx-menu a{font-size:var(--t-sm);font-weight:600;color:var(--lx-ink-soft);position:relative;padding-block:6px;transition:color .25s}
.lx-menu a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;border-radius:2px;background:var(--lx-verdant);transition:width .3s var(--lx-ease)}
.lx-menu a:hover{color:var(--lx-forest)}
.lx-menu a:hover::after{width:100%}

.lx-nav__cta{display:flex;align-items:center;gap:var(--sp-2)}
.lx-burger{display:none;width:46px;height:46px;border-radius:12px;background:var(--lx-glass);border:1px solid var(--lx-mint);position:relative}
.lx-burger span,.lx-burger span::before,.lx-burger span::after{
  content:"";position:absolute;left:50%;top:50%;width:20px;height:2px;border-radius:2px;background:var(--lx-forest);transform:translate(-50%,-50%);transition:.3s var(--lx-ease)
}
.lx-burger span::before{transform:translate(-50%,-8px)}
.lx-burger span::after{transform:translate(-50%,6px)}
.lx-burger.lx-open span{background:transparent}
.lx-burger.lx-open span::before{transform:translate(-50%,-50%) rotate(45deg)}
.lx-burger.lx-open span::after{transform:translate(-50%,-50%) rotate(-45deg)}

/* =====================================================================
   HERO
   ===================================================================== */
.lx-hero{position:relative;overflow:hidden;padding-block:var(--sp-7) var(--sp-6)}
.lx-hero__bg{position:absolute;inset:0;z-index:-2}
.lx-hero__bg img{width:100%;height:100%;object-fit:cover}
.lx-hero__wash{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(105deg,rgba(247,251,249,.96) 0%,rgba(238,248,243,.8) 42%,rgba(168,224,199,.25) 100%);
}
.lx-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:var(--sp-6);align-items:center}
.lx-hero h1{font-size:var(--t-4xl);letter-spacing:-.03em}
.lx-hero h1 em{font-style:normal;color:var(--lx-green);position:relative;white-space:nowrap}
.lx-hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.06em;height:.14em;border-radius:4px;background:var(--lx-mint);z-index:-1}
.lx-hero__lede{font-size:var(--t-lg);color:var(--lx-ink-soft);margin-top:var(--sp-4);max-width:34ch}
.lx-hero__actions{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-5)}
.lx-hero__meta{display:flex;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-5)}
.lx-hero__meta div{display:flex;flex-direction:column}
.lx-hero__meta b{font-size:var(--t-xl);color:var(--lx-forest);font-weight:800}
.lx-hero__meta small{font-size:var(--t-cap);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-steel)}

/* floating product card */
.lx-hero__stage{position:relative}
.lx-hero__card{
  position:relative;border-radius:var(--r-lg);padding:var(--sp-5);
  background:var(--lx-glass);
  border:1px solid rgba(255,255,255,.7);
  box-shadow:var(--lx-shadow-l);
  backdrop-filter:blur(6px);
  overflow:hidden;
}
.lx-hero__card::before{content:"";position:absolute;inset:0;background:var(--lx-metal-line);height:3px}
.lx-hero__prod{position:relative;z-index:1;margin-inline:auto;max-width:270px;filter:drop-shadow(0 24px 32px rgba(17,51,42,.28));animation:lx-float 6s var(--lx-ease) infinite}
@keyframes lx-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.lx-hero__price{position:absolute;top:var(--sp-4);right:var(--sp-4);z-index:2;
  background:var(--lx-verdant);color:#fff;border-radius:var(--r-pill);
  padding:10px 20px;font-weight:800;box-shadow:var(--lx-shadow-m)}
.lx-hero__glow{position:absolute;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(168,224,199,.7),transparent 68%);
  filter:blur(18px);z-index:0;left:50%;top:52%;transform:translate(-50%,-50%)}

/* =====================================================================
   MARQUEE / VALUES STRIP
   ===================================================================== */
.lx-strip{background:var(--lx-verdant);color:var(--lx-mint-hi);padding-block:var(--sp-3);overflow:hidden}
.lx-strip__track{display:flex;gap:var(--sp-6);white-space:nowrap;animation:lx-slide 26s linear infinite}
.lx-strip:hover .lx-strip__track{animation-play-state:paused}
.lx-strip__track span{display:inline-flex;align-items:center;gap:var(--sp-2);font-weight:600;letter-spacing:.06em;font-size:var(--t-sm)}
.lx-strip__track span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lx-mint);box-shadow:0 0 0 4px rgba(168,224,199,.25)}
@keyframes lx-slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* =====================================================================
   LIFESTYLE OVERVIEW (split)
   ===================================================================== */
.lx-split{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6);align-items:center}
.lx-split__media{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--lx-shadow-l);aspect-ratio:7/5}
.lx-split__media img{width:100%;height:100%;object-fit:cover}
.lx-split__media::after{content:"";position:absolute;inset:0;background:linear-gradient(200deg,transparent 55%,rgba(17,51,42,.28))}
.lx-split__badge{position:absolute;left:var(--sp-4);bottom:var(--sp-4);z-index:2;
  background:var(--lx-glass);border:1px solid rgba(255,255,255,.6);border-radius:var(--r-md);
  padding:var(--sp-3) var(--sp-4);box-shadow:var(--lx-shadow-m);backdrop-filter:blur(8px);max-width:70%}
.lx-split__badge b{display:block;color:var(--lx-forest);font-size:var(--t-lg)}
.lx-split__badge span{font-size:var(--t-sm);color:var(--lx-ink-soft)}
.lx-split h2{font-size:var(--t-2xl)}
.lx-split p{color:var(--lx-ink-soft);margin-top:var(--sp-3)}
.lx-ticks{margin-top:var(--sp-4);display:grid;gap:var(--sp-3)}
.lx-ticks li{display:flex;gap:var(--sp-3);align-items:flex-start;font-weight:500}
.lx-tick{flex:none;width:26px;height:26px;border-radius:50%;background:var(--lx-mint-hi);position:relative;margin-top:2px;box-shadow:inset 0 0 0 1.5px var(--lx-mint)}
.lx-tick::after{content:"";position:absolute;left:9px;top:5px;width:6px;height:11px;border-right:2.5px solid var(--lx-green);border-bottom:2.5px solid var(--lx-green);transform:rotate(42deg)}

/* =====================================================================
   PRINCIPLES — card cluster (unique staggered grid)
   ===================================================================== */
.lx-principles{background:linear-gradient(180deg,var(--lx-cloud),var(--lx-white))}
.lx-pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.lx-pcard{
  position:relative;background:var(--lx-white);border-radius:var(--r-md);
  padding:var(--sp-5) var(--sp-4);box-shadow:var(--lx-shadow-s);
  border:1px solid var(--lx-chrome);
  transition:transform .4s var(--lx-ease),box-shadow .4s var(--lx-ease);
  overflow:hidden;
}
.lx-pcard::before{content:"";position:absolute;left:0;top:0;height:100%;width:4px;background:var(--lx-verdant);transform:scaleY(0);transform-origin:top;transition:transform .4s var(--lx-ease)}
.lx-pcard:hover{transform:translateY(-8px);box-shadow:var(--lx-shadow-m)}
.lx-pcard:hover::before{transform:scaleY(1)}
.lx-pcard:nth-child(2){transform:translateY(20px)}
.lx-pcard:nth-child(2):hover{transform:translateY(12px)}
.lx-pico{width:56px;height:56px;border-radius:16px;background:var(--lx-mint-hi);position:relative;margin-bottom:var(--sp-3);box-shadow:inset 0 0 0 1px var(--lx-mint)}
.lx-pcard h3{font-size:var(--t-lg);margin-bottom:var(--sp-2)}
.lx-pcard p{color:var(--lx-ink-soft);font-size:var(--t-sm)}
/* CSS glyphs inside icons */
.lx-ico-leaf::after{content:"";position:absolute;inset:16px;border-radius:0 70% 0 70%;background:var(--lx-green);transform:rotate(-6deg)}
.lx-ico-drop::after{content:"";position:absolute;left:50%;top:14px;width:22px;height:26px;background:var(--lx-green);transform:translateX(-50%);border-radius:0 50% 50% 50%;rotate:45deg}
.lx-ico-moon::after{content:"";position:absolute;left:18px;top:14px;width:26px;height:26px;border-radius:50%;box-shadow:8px 3px 0 0 var(--lx-green)}
.lx-ico-move::after{content:"";position:absolute;left:50%;top:50%;width:24px;height:24px;border:3px solid var(--lx-green);border-top-color:transparent;border-radius:50%;transform:translate(-50%,-50%) rotate(20deg)}
.lx-ico-heart::after{content:"";position:absolute;left:16px;top:20px;width:12px;height:18px;background:var(--lx-green);border-radius:12px 12px 0 0;transform:rotate(-45deg);box-shadow:11px 0 0 var(--lx-green)}
.lx-ico-sun::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:22px;border-radius:50%;background:var(--lx-green);transform:translate(-50%,-50%);box-shadow:0 -17px 0 -8px var(--lx-green),0 17px 0 -8px var(--lx-green),-17px 0 0 -8px var(--lx-green),17px 0 0 -8px var(--lx-green)}

/* =====================================================================
   TIMELINE — daily balance
   ===================================================================== */
.lx-timeline{position:relative}
.lx-tl{position:relative;margin-top:var(--sp-5);display:grid;gap:var(--sp-5)}
.lx-tl::before{content:"";position:absolute;left:26px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--lx-mint),var(--lx-green),var(--lx-mint));border-radius:2px}
.lx-tl__row{position:relative;padding-left:var(--sp-6);display:grid;grid-template-columns:auto 1fr;gap:var(--sp-4);align-items:start}
.lx-tl__dot{position:absolute;left:16px;top:2px;width:22px;height:22px;border-radius:50%;background:var(--lx-white);border:3px solid var(--lx-green);box-shadow:0 0 0 5px rgba(168,224,199,.35);z-index:1}
.lx-tl__time{font-weight:800;color:var(--lx-forest);font-size:var(--t-lg);min-width:88px}
.lx-tl__body h3{font-size:var(--t-lg)}
.lx-tl__body p{color:var(--lx-ink-soft);font-size:var(--t-sm);margin-top:4px}

/* =====================================================================
   PRODUCT SPOTLIGHT
   ===================================================================== */
.lx-spot{background:var(--lx-verdant);color:var(--lx-mint-hi);position:relative;overflow:hidden}
.lx-spot::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(168,224,199,.3),transparent 70%);right:-120px;top:-120px}
.lx-spot::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--lx-metal-line)}
.lx-spot__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--sp-6);align-items:center;position:relative;z-index:1}
.lx-spot__frame{position:relative;display:flex;justify-content:center}
.lx-spot__disc{position:absolute;width:360px;height:360px;border-radius:50%;background:conic-gradient(from 210deg,var(--lx-chrome),var(--lx-silver),var(--lx-mint),var(--lx-chrome));filter:blur(2px);opacity:.55;top:50%;left:50%;transform:translate(-50%,-50%)}
.lx-spot__prod{position:relative;z-index:1;max-width:300px;filter:drop-shadow(0 30px 40px rgba(0,0,0,.35))}
.lx-spot h2{color:var(--lx-white);font-size:var(--t-2xl)}
.lx-spot__lede{margin-top:var(--sp-3);color:rgba(214,244,228,.9);font-size:var(--t-lg)}
.lx-spot__list{margin-top:var(--sp-4);display:grid;gap:var(--sp-3)}
.lx-spot__list li{display:flex;gap:var(--sp-3);align-items:flex-start}
.lx-spot__list .lx-tick{background:rgba(214,244,228,.18);box-shadow:inset 0 0 0 1.5px var(--lx-mint)}
.lx-spot__list .lx-tick::after{border-color:var(--lx-mint-hi)}
.lx-spot__buy{margin-top:var(--sp-5);display:flex;flex-wrap:wrap;gap:var(--sp-3);align-items:center}
.lx-spot__tag{display:inline-flex;flex-direction:column;background:rgba(247,251,249,.12);border:1px solid rgba(214,244,228,.3);border-radius:var(--r-md);padding:var(--sp-2) var(--sp-4)}
.lx-spot__tag b{font-size:var(--t-xl);color:#fff}
.lx-spot__tag small{font-size:var(--t-cap);letter-spacing:.14em;text-transform:uppercase;color:var(--lx-mint)}

/* =====================================================================
   INGREDIENTS
   ===================================================================== */
.lx-ingrid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-4)}
.lx-ing{background:var(--lx-white);border-radius:var(--r-md);padding:var(--sp-4);text-align:center;border:1px solid var(--lx-chrome);box-shadow:var(--lx-shadow-s);transition:transform .35s var(--lx-ease),box-shadow .35s var(--lx-ease)}
.lx-ing:hover{transform:translateY(-6px);box-shadow:var(--lx-shadow-m)}
.lx-ing__orb{width:74px;height:74px;margin:0 auto var(--sp-3);border-radius:50%;background:radial-gradient(circle at 34% 30%,var(--lx-mint-hi),var(--lx-mint) 60%,var(--lx-green));box-shadow:inset 0 2px 6px rgba(255,255,255,.6),0 8px 18px rgba(46,122,92,.25);position:relative}
.lx-ing__orb::after{content:"";position:absolute;left:22%;top:18%;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.6);filter:blur(2px)}
.lx-ing h3{font-size:var(--t-base);margin-bottom:6px}
.lx-ing p{font-size:var(--t-sm);color:var(--lx-ink-soft)}

/* =====================================================================
   QUALITY STANDARDS
   ===================================================================== */
.lx-quality{background:linear-gradient(180deg,var(--lx-white),var(--lx-cloud))}
.lx-qgrid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6);align-items:center}
.lx-qlist{display:grid;gap:var(--sp-4)}
.lx-qitem{display:flex;gap:var(--sp-4);align-items:flex-start;background:var(--lx-white);border-radius:var(--r-md);padding:var(--sp-4);box-shadow:var(--lx-shadow-s);border:1px solid var(--lx-chrome)}
.lx-qnum{flex:none;width:48px;height:48px;border-radius:14px;background:var(--lx-metal);display:grid;place-items:center;font-weight:800;color:var(--lx-deep);box-shadow:inset 0 1px 0 rgba(255,255,255,.7)}
.lx-qitem h3{font-size:var(--t-base)}
.lx-qitem p{font-size:var(--t-sm);color:var(--lx-ink-soft);margin-top:2px}
.lx-qmedia{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--lx-shadow-l);aspect-ratio:7/5;position:relative}
.lx-qmedia img{width:100%;height:100%;object-fit:cover}

/* =====================================================================
   INSPIRATION QUOTE
   ===================================================================== */
.lx-inspire{position:relative;text-align:center}
.lx-inspire__quote{max-width:820px;margin-inline:auto;font-family:"Gill Sans","Gill Sans MT",Corbel,Candara,sans-serif;font-size:var(--t-2xl);line-height:1.3;color:var(--lx-deep);font-weight:600}
.lx-inspire__quote::before{content:"“";display:block;font-size:5rem;line-height:.4;color:var(--lx-mint);margin-bottom:var(--sp-3)}
.lx-inspire__by{margin-top:var(--sp-4);font-size:var(--t-sm);letter-spacing:.16em;text-transform:uppercase;color:var(--lx-steel)}

/* =====================================================================
   FAQ
   ===================================================================== */
.lx-faq__wrap{max-width:820px;margin-inline:auto;display:grid;gap:var(--sp-3)}
.lx-acc{background:var(--lx-white);border:1px solid var(--lx-chrome);border-radius:var(--r-md);box-shadow:var(--lx-shadow-s);overflow:hidden;transition:box-shadow .3s var(--lx-ease)}
.lx-acc.lx-open{box-shadow:var(--lx-shadow-m)}
.lx-acc__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);text-align:left;padding:var(--sp-4);font-weight:700;color:var(--lx-deep);font-size:var(--t-base)}
.lx-acc__sign{flex:none;width:30px;height:30px;border-radius:50%;background:var(--lx-mint-hi);position:relative;transition:background .3s}
.lx-acc__sign::before,.lx-acc__sign::after{content:"";position:absolute;left:50%;top:50%;background:var(--lx-green);border-radius:2px;transition:transform .3s var(--lx-ease)}
.lx-acc__sign::before{width:12px;height:2px;transform:translate(-50%,-50%)}
.lx-acc__sign::after{width:2px;height:12px;transform:translate(-50%,-50%)}
.lx-acc.lx-open .lx-acc__sign::after{transform:translate(-50%,-50%) scaleY(0)}
.lx-acc.lx-open .lx-acc__sign{background:var(--lx-green)}
.lx-acc.lx-open .lx-acc__sign::before{background:#fff}
.lx-acc__a{max-height:0;overflow:hidden;transition:max-height .4s var(--lx-ease)}
.lx-acc__a p{padding:0 var(--sp-4) var(--sp-4);color:var(--lx-ink-soft);font-size:var(--t-sm)}

/* =====================================================================
   ORDER FORM
   ===================================================================== */
.lx-order{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--lx-cloud),var(--lx-mint-hi))}
.lx-order::before{content:"";position:absolute;width:460px;height:460px;border-radius:50%;background:radial-gradient(circle,rgba(46,122,92,.16),transparent 70%);left:-140px;bottom:-160px}
.lx-order__grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-6);align-items:center;position:relative;z-index:1}
.lx-order h2{font-size:var(--t-2xl)}
.lx-order__lede{color:var(--lx-ink-soft);margin-top:var(--sp-3);font-size:var(--t-lg)}
.lx-order__points{margin-top:var(--sp-4);display:grid;gap:var(--sp-2)}
.lx-order__points li{display:flex;gap:var(--sp-2);align-items:center;font-size:var(--t-sm);color:var(--lx-ink-soft)}
.lx-order__points .lx-tick{width:22px;height:22px}
.lx-order__points .lx-tick::after{left:7px;top:4px;width:5px;height:9px}

.lx-card-form{
  background:var(--lx-white);border-radius:var(--r-lg);padding:var(--sp-5);
  box-shadow:var(--lx-shadow-l);border:1px solid var(--lx-chrome);position:relative;
}
.lx-card-form::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--lx-verdant);border-radius:var(--r-lg) var(--r-lg) 0 0}
.lx-card-form__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4);gap:var(--sp-3);flex-wrap:wrap}
.lx-card-form__head h3{font-size:var(--t-lg)}
.lx-price-pill{background:var(--lx-verdant);color:#fff;border-radius:var(--r-pill);padding:8px 18px;font-weight:800}
.lx-field{margin-bottom:var(--sp-3)}
.lx-field label{display:block;font-size:var(--t-sm);font-weight:700;color:var(--lx-forest);margin-bottom:6px}
.lx-field input{
  width:100%;padding:14px 16px;font-size:var(--t-base);color:var(--lx-ink);
  background:var(--lx-cloud);border:1.5px solid var(--lx-chrome);border-radius:var(--r-sm);
  transition:border-color .25s,box-shadow .25s,background .25s;
}
.lx-field input::placeholder{color:var(--lx-steel)}
.lx-field input:focus{outline:none;border-color:var(--lx-green);background:#fff;box-shadow:var(--lx-ring)}
.lx-field input.lx-invalid{border-color:#c0553e;background:#fdf3f0}
.lx-field__err{display:none;margin-top:5px;font-size:var(--t-cap);color:#c0553e;font-weight:600}
.lx-field.lx-has-err .lx-field__err{display:block}
.lx-form__note{margin-top:var(--sp-3);font-size:var(--t-cap);color:var(--lx-steel);line-height:1.5}

/* =====================================================================
   SERVICE / CONTACT
   ===================================================================== */
.lx-service__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
.lx-scard{background:var(--lx-white);border-radius:var(--r-md);padding:var(--sp-5) var(--sp-4);border:1px solid var(--lx-chrome);box-shadow:var(--lx-shadow-s);text-align:center;transition:transform .35s var(--lx-ease),box-shadow .35s var(--lx-ease)}
.lx-scard:hover{transform:translateY(-6px);box-shadow:var(--lx-shadow-m)}
.lx-scard__ico{width:60px;height:60px;margin:0 auto var(--sp-3);border-radius:18px;background:var(--lx-metal);display:grid;place-items:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.7);position:relative}
.lx-scard h3{font-size:var(--t-base);margin-bottom:6px}
.lx-scard p{font-size:var(--t-sm);color:var(--lx-ink-soft)}
.lx-scard a{color:var(--lx-forest);font-weight:700}
/* CSS icons for contact */
.lx-gl-phone::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%) rotate(8deg);border:3px solid var(--lx-forest);border-radius:8px 8px 10px 8px;border-top-color:transparent;border-right-color:transparent}
.lx-gl-mail::before{content:"";position:absolute;left:50%;top:50%;width:26px;height:18px;transform:translate(-50%,-50%);border:2.5px solid var(--lx-forest);border-radius:4px}
.lx-gl-mail::after{content:"";position:absolute;left:50%;top:44%;width:13px;height:8px;transform:translate(-50%,-50%) rotate(0);border-left:2.5px solid var(--lx-forest);border-right:2.5px solid var(--lx-forest);border-bottom:2.5px solid transparent;clip-path:polygon(0 0,50% 100%,100% 0)}
.lx-gl-pin::before{content:"";position:absolute;left:50%;top:42%;width:22px;height:22px;transform:translate(-50%,-50%) rotate(45deg);border:3px solid var(--lx-forest);border-radius:50% 50% 50% 0}
.lx-gl-pin::after{content:"";position:absolute;left:50%;top:38%;width:7px;height:7px;transform:translate(-50%,-50%);border-radius:50%;background:var(--lx-forest)}

/* =====================================================================
   DISCLAIMER BAND
   ===================================================================== */
.lx-legalband{background:var(--lx-deep);color:rgba(214,244,228,.86)}
.lx-legalband .lx-shell{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-4);align-items:start}
.lx-legalband__ico{width:52px;height:52px;flex:none;border-radius:14px;background:rgba(168,224,199,.14);position:relative}
.lx-legalband__ico::before{content:"i";position:absolute;inset:0;display:grid;place-items:center;font-family:Georgia,serif;font-style:italic;font-weight:700;font-size:1.5rem;color:var(--lx-mint)}
.lx-legalband h3{color:var(--lx-mint-hi);font-size:var(--t-lg);margin-bottom:var(--sp-2)}
.lx-legalband p{font-size:var(--t-sm);line-height:1.7}

/* =====================================================================
   FOOTER
   ===================================================================== */
.lx-foot{background:linear-gradient(180deg,var(--lx-deep),#0a2019);color:rgba(214,244,228,.8);padding-block:var(--sp-6) var(--sp-4)}
.lx-foot__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--sp-5)}
.lx-foot__brand .lx-brand{color:#fff}
.lx-foot__brand p{margin-top:var(--sp-3);font-size:var(--t-sm);max-width:34ch}
.lx-foot h4{color:var(--lx-mint-hi);font-size:var(--t-sm);letter-spacing:.14em;text-transform:uppercase;margin-bottom:var(--sp-3)}
.lx-foot ul{display:grid;gap:10px}
.lx-foot a{font-size:var(--t-sm);transition:color .25s}
.lx-foot a:hover{color:var(--lx-mint-hi)}
.lx-foot__contact li{font-size:var(--t-sm);margin-bottom:8px}
.lx-foot__bar{margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid rgba(168,224,199,.16);display:flex;flex-wrap:wrap;gap:var(--sp-3);justify-content:space-between;align-items:center;font-size:var(--t-cap);color:rgba(206,214,216,.6)}
.lx-foot__bar nav{display:flex;flex-wrap:wrap;gap:var(--sp-4)}

/* =====================================================================
   COOKIE BANNER
   ===================================================================== */
.lx-cookie{position:fixed;left:var(--sp-4);right:var(--sp-4);bottom:var(--sp-4);z-index:90;max-width:560px;margin-inline:auto;
  background:var(--lx-white);border:1px solid var(--lx-chrome);border-radius:var(--r-lg);box-shadow:var(--lx-shadow-l);
  padding:var(--sp-4);transform:translateY(140%);opacity:0;transition:transform .5s var(--lx-ease),opacity .5s var(--lx-ease)}
.lx-cookie.lx-show{transform:translateY(0);opacity:1}
.lx-cookie::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--lx-verdant)}
.lx-cookie h4{font-size:var(--t-base);margin-bottom:6px}
.lx-cookie p{font-size:var(--t-sm);color:var(--lx-ink-soft);margin-bottom:var(--sp-3)}
.lx-cookie p a{color:var(--lx-forest);font-weight:700;text-decoration:underline}
.lx-cookie__row{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.lx-cookie__row .lx-btn{--pad-y:11px;--pad-x:20px;font-size:var(--t-sm);flex:1;min-width:130px}

.lx-prefs{display:none;margin-top:var(--sp-3);border-top:1px dashed var(--lx-chrome);padding-top:var(--sp-3);gap:var(--sp-2);flex-direction:column}
.lx-prefs.lx-show{display:flex}
.lx-pref{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);font-size:var(--t-sm)}
.lx-pref span b{display:block;color:var(--lx-deep)}
.lx-pref span small{color:var(--lx-steel)}
.lx-toggle{position:relative;width:46px;height:26px;border-radius:var(--r-pill);background:var(--lx-silver);transition:background .3s;flex:none}
.lx-toggle::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:var(--lx-shadow-s);transition:transform .3s var(--lx-ease)}
.lx-toggle[aria-checked="true"]{background:var(--lx-green)}
.lx-toggle[aria-checked="true"]::after{transform:translateX(20px)}
.lx-toggle[disabled]{opacity:.6;cursor:not-allowed}

/* =====================================================================
   PAGE HEADER (interior pages)
   ===================================================================== */
.lx-pagehead{position:relative;padding-block:var(--sp-6);background:linear-gradient(135deg,var(--lx-cloud),var(--lx-mint-hi));overflow:hidden}
.lx-pagehead::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(46,122,92,.14),transparent 70%);right:-120px;top:-120px}
.lx-pagehead .lx-eyebrow{margin-bottom:var(--sp-2)}
.lx-pagehead h1{font-size:var(--t-3xl);position:relative;z-index:1}
.lx-pagehead p{margin-top:var(--sp-3);color:var(--lx-ink-soft);max-width:60ch;position:relative;z-index:1}
.lx-crumbs{display:flex;gap:var(--sp-2);align-items:center;font-size:var(--t-sm);color:var(--lx-steel);margin-bottom:var(--sp-3);position:relative;z-index:1}
.lx-crumbs a{color:var(--lx-forest);font-weight:600}
.lx-crumbs span{color:var(--lx-silver)}

/* legal / prose */
.lx-prose{max-width:820px;margin-inline:auto}
.lx-prose h2{font-size:var(--t-xl);margin-top:var(--sp-5);margin-bottom:var(--sp-3);padding-bottom:var(--sp-2);border-bottom:2px solid var(--lx-chrome)}
.lx-prose h3{font-size:var(--t-lg);margin-top:var(--sp-4);margin-bottom:var(--sp-2)}
.lx-prose p{color:var(--lx-ink-soft);margin-bottom:var(--sp-3)}
.lx-prose ul{display:grid;gap:10px;margin:0 0 var(--sp-3) 0;padding-left:0}
.lx-prose ul li{position:relative;padding-left:var(--sp-4);color:var(--lx-ink-soft)}
.lx-prose ul li::before{content:"";position:absolute;left:0;top:11px;width:9px;height:9px;border-radius:3px;background:var(--lx-green);transform:rotate(45deg)}
.lx-prose__meta{display:inline-block;background:var(--lx-mint-hi);color:var(--lx-forest);font-weight:700;font-size:var(--t-sm);padding:8px 16px;border-radius:var(--r-pill);margin-bottom:var(--sp-4)}
.lx-prose__card{background:var(--lx-cloud);border:1px solid var(--lx-chrome);border-radius:var(--r-md);padding:var(--sp-4);margin-block:var(--sp-4)}

/* =====================================================================
   HABITS PAGE
   ===================================================================== */
.lx-habit-feature{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--lx-shadow-l);border:1px solid var(--lx-chrome);background:var(--lx-white)}
.lx-habit-feature__media{position:relative;min-height:340px}
.lx-habit-feature__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lx-habit-feature__body{padding:var(--sp-5)}
.lx-habit-feature__body h2{font-size:var(--t-xl)}
.lx-habit-feature__body p{color:var(--lx-ink-soft);margin-top:var(--sp-3)}
.lx-hgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4);margin-top:var(--sp-6)}
.lx-hcard{background:var(--lx-white);border:1px solid var(--lx-chrome);border-radius:var(--r-md);padding:var(--sp-5) var(--sp-4);box-shadow:var(--lx-shadow-s);transition:transform .35s var(--lx-ease),box-shadow .35s var(--lx-ease)}
.lx-hcard:hover{transform:translateY(-6px);box-shadow:var(--lx-shadow-m)}
.lx-hcard__n{font-family:"Gill Sans","Gill Sans MT",Corbel,sans-serif;font-size:var(--t-2xl);font-weight:700;color:var(--lx-mint);line-height:1}
.lx-hcard h3{font-size:var(--t-lg);margin:var(--sp-2) 0}
.lx-hcard p{font-size:var(--t-sm);color:var(--lx-ink-soft)}

/* =====================================================================
   SUCCESS PAGE
   ===================================================================== */
.lx-success{min-height:74vh;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden;background:linear-gradient(160deg,var(--lx-cloud),var(--lx-mint-hi))}
.lx-success::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(46,122,92,.16),transparent 70%);top:-160px;right:-160px}
.lx-success__inner{position:relative;z-index:1;max-width:600px;padding:var(--sp-5)}
.lx-success__check{width:104px;height:104px;margin:0 auto var(--sp-4);border-radius:50%;background:var(--lx-verdant);position:relative;box-shadow:0 20px 44px rgba(27,79,63,.4);animation:lx-pop .6s var(--lx-ease)}
.lx-success__check::after{content:"";position:absolute;left:37px;top:28px;width:22px;height:42px;border-right:5px solid #fff;border-bottom:5px solid #fff;transform:rotate(42deg)}
@keyframes lx-pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
.lx-success h1{font-size:var(--t-3xl)}
.lx-success p{color:var(--lx-ink-soft);margin-top:var(--sp-3);font-size:var(--t-lg)}
.lx-success__actions{margin-top:var(--sp-5);display:flex;gap:var(--sp-3);justify-content:center;flex-wrap:wrap}

/* =====================================================================
   REVEAL ANIMATION
   ===================================================================== */
.lx-reveal{opacity:0;transform:translateY(28px);transition:opacity .7s var(--lx-ease),transform .7s var(--lx-ease)}
.lx-reveal.lx-in{opacity:1;transform:none}
.lx-reveal[data-d="1"]{transition-delay:.08s}
.lx-reveal[data-d="2"]{transition-delay:.16s}
.lx-reveal[data-d="3"]{transition-delay:.24s}
.lx-reveal[data-d="4"]{transition-delay:.32s}

/* skip link */
.lx-skip{position:absolute;left:-999px;top:0;z-index:120;background:var(--lx-forest);color:#fff;padding:12px 20px;border-radius:0 0 var(--r-sm) 0;font-weight:700}
.lx-skip:focus{left:0}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1024px){
  :root{--sp-7:96px;--sp-6:66px}
  .lx-hero h1{font-size:var(--t-3xl)}
  .lx-ingrid{grid-template-columns:repeat(2,1fr)}
  .lx-foot__grid{grid-template-columns:1fr 1fr}
  .lx-foot__brand{grid-column:1/-1}
}
@media (max-width:860px){
  .lx-menu{
    position:fixed;inset:74px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--lx-white);border-bottom:1px solid var(--lx-chrome);
    padding:var(--sp-3) var(--sp-4) var(--sp-4);box-shadow:var(--lx-shadow-m);
    transform:translateY(-130%);transition:transform .4s var(--lx-ease);z-index:55}
  .lx-menu.lx-open{transform:translateY(0)}
  .lx-menu a{padding:14px 4px;border-bottom:1px solid var(--lx-cloud)}
  .lx-menu a::after{display:none}
  .lx-burger{display:block}
  .lx-nav__cta .lx-btn--ghost{display:none}
  .lx-hero__grid,.lx-split,.lx-spot__grid,.lx-qgrid,.lx-order__grid,.lx-habit-feature{grid-template-columns:1fr}
  .lx-pgrid,.lx-service__grid,.lx-hgrid{grid-template-columns:1fr 1fr}
  .lx-pcard:nth-child(2){transform:none}
  .lx-pcard:nth-child(2):hover{transform:translateY(-8px)}
  .lx-spot__grid{gap:var(--sp-5)}
  .lx-spot__frame{order:-1}
  .lx-habit-feature__media{min-height:280px}
  .lx-legalband .lx-shell{grid-template-columns:1fr}
}
@media (max-width:560px){
  :root{--sp-7:72px;--sp-6:52px;--t-4xl:3rem;--t-3xl:2.5rem;--t-2xl:2rem}
  .lx-shell{padding-inline:var(--sp-3)}
  .lx-hero__meta{gap:var(--sp-3)}
  .lx-pgrid,.lx-service__grid,.lx-hgrid,.lx-ingrid{grid-template-columns:1fr}
  .lx-tl__row{grid-template-columns:1fr;padding-left:var(--sp-5);gap:var(--sp-2)}
  .lx-foot__grid{grid-template-columns:1fr}
  .lx-foot__bar{flex-direction:column;align-items:flex-start}
  .lx-cookie__row .lx-btn{flex:1 1 100%}
  .lx-hero__actions .lx-btn{width:100%}
}
