:root{
      --ink-950:#111728;
      --ink-800:#252d40;
      --ink-600:#5d6679;
      --ink-500:#747d8d;
      --ink-400:#959cab;

      --violet-700:#5634da;
      --violet-600:#6541ed;
      --violet-500:#7658f4;
      --violet-400:#927cf7;
      --violet-100:#eeeaff;
      --violet-050:#f8f6ff;

      --aqua-600:#149ba5;
      --aqua-500:#28b3bb;
      --aqua-100:#dff5f6;
      --aqua-050:#f3fbfb;

      --surface:#ffffff;
      --surface-soft:#f8f9fc;
      --surface-violet:#faf9ff;
      --line:#e6e9f0;
      --line-strong:#d8dce6;
      --dark:#151b2c;
      --dark-2:#202641;

      --r-sm:12px;
      --r-md:18px;
      --r-lg:26px;
      --r-xl:34px;

      --shadow-sm:0 8px 24px rgba(26,31,50,.05);
      --shadow-md:0 18px 50px rgba(29,33,58,.08);

      --container:1240px;
      --section:88px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:Manrope,Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
      color:var(--ink-950);
      background:#fff;
      -webkit-font-smoothing:antialiased;
      line-height:1.55;
    }
    body.nav-open{overflow:hidden}
    a{color:inherit}
    button,input{font:inherit}
    img,svg{display:block;max-width:100%}
    .container{width:min(calc(100% - 48px),var(--container));margin:0 auto}
    .section{padding:var(--section) 0}
    .section-soft{background:var(--surface-soft)}
    .section-violet{background:linear-gradient(180deg,#fff 0%,var(--surface-violet) 100%)}
    .section-head{
      display:flex;
      align-items:flex-end;
      justify-content:space-between;
      gap:28px;
      margin-bottom:34px;
    }
    .section-head-copy{max-width:760px}
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:8px;
      color:var(--aqua-600);
      font-size:12px;
      font-weight:800;
      letter-spacing:.075em;
      text-transform:uppercase;
      margin-bottom:12px;
    }
    .eyebrow::before{
      content:"";
      width:18px;
      height:1px;
      background:currentColor;
    }
    h1,h2,h3,p{margin-top:0}
    h1,h2,h3{letter-spacing:-.035em;line-height:1.08}
    h1{
      font-size:clamp(44px,5.4vw,76px);
      margin-bottom:24px;
      max-width:760px;
    }
    h2{
      font-size:clamp(32px,3.3vw,48px);
      margin-bottom:14px;
    }
    h3{font-size:22px;margin-bottom:12px}
    .lead{
      font-size:clamp(18px,1.55vw,21px);
      line-height:1.65;
      color:var(--ink-600);
      max-width:720px;
    }
    .muted{color:var(--ink-600)}
    .section-copy{
      font-size:17px;
      color:var(--ink-600);
      max-width:720px;
      margin-bottom:0;
    }

    /* header */
    .site-header{
      position:sticky;
      top:0;
      z-index:100;
      background:rgba(255,255,255,.9);
      border-bottom:1px solid rgba(230,233,240,.8);
      backdrop-filter:saturate(160%) blur(18px);
    }
    .header-row{
      min-height:76px;
      display:grid;
      grid-template-columns:auto 1fr auto;
      align-items:center;
      gap:28px;
    }
    .brand{
      display:flex;
      align-items:center;
      gap:11px;
      text-decoration:none;
      min-width:max-content;
      font-size:17px;
      font-weight:800;
      color:var(--violet-600);
      letter-spacing:-.025em;
    }
    .brand-mark{
      width:31px;
      height:31px;
      position:relative;
      border-radius:50%;
      border:1px solid #ded9ff;
      background:#fff;
      box-shadow:inset 0 0 0 5px rgba(116,86,244,.04);
    }
    .brand-mark::before,
    .brand-mark::after{
      content:"";
      position:absolute;
      border-radius:50%;
      inset:5px;
      border:1.8px solid var(--violet-500);
      border-left-color:var(--aqua-500);
      transform:rotate(31deg);
    }
    .brand-mark::after{
      inset:9px;
      opacity:.55;
      transform:rotate(-25deg);
    }
    .main-nav{
      display:flex;
      justify-content:center;
      align-items:center;
      gap:28px;
    }
    .main-nav a{
      font-size:14px;
      font-weight:650;
      color:#454d5f;
      text-decoration:none;
      white-space:nowrap;
      transition:.2s ease;
    }
    .main-nav a:hover{color:var(--violet-600)}
    .header-actions{display:flex;align-items:center;gap:9px}
    .icon-btn{
      width:42px;height:42px;
      border:0;background:transparent;
      border-radius:12px;
      display:grid;place-items:center;
      color:#3c4558;
      cursor:pointer;
    }
    .icon-btn:hover{background:#f4f5f8}
    .menu-toggle{display:none}
    .btn{
      min-height:48px;
      padding:0 20px;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:9px;
      border-radius:12px;
      border:1px solid transparent;
      font-weight:760;
      font-size:14px;
      line-height:1;
      text-decoration:none;
      cursor:pointer;
      transition:.18s ease;
    }
    .btn svg{width:16px;height:16px}
    .btn-primary{
      color:#fff;
      background:linear-gradient(135deg,var(--violet-600),var(--violet-500));
      box-shadow:0 10px 24px rgba(101,65,237,.18);
    }
    .btn-primary:hover{transform:translateY(-1px);box-shadow:0 13px 30px rgba(101,65,237,.26)}
    .btn-secondary{
      color:var(--ink-950);
      background:#fff;
      border-color:var(--line-strong);
    }
    .btn-secondary:hover{border-color:#c9cde0;background:#fbfbfd}
    .btn-link{
      min-height:auto;
      padding:0;
      color:var(--violet-600);
      background:transparent;
      font-weight:750;
    }

    /* hero */
    .hero{
      position:relative;
      overflow:hidden;
      padding:76px 0 40px;
      background:
        radial-gradient(circle at 82% 23%,rgba(118,88,244,.08),transparent 25%),
        radial-gradient(circle at 76% 62%,rgba(40,179,187,.06),transparent 26%),
        #fff;
    }
    .hero-grid{
      display:grid;
      grid-template-columns:minmax(0,.95fr) minmax(520px,1.05fr);
      align-items:center;
      gap:36px;
      min-height:530px;
    }
    .hero-copy{padding:28px 0 44px}
    .hero .lead{max-width:620px}
    .hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
    .hero-art{
      position:relative;
      height:500px;
      min-width:0;
    }
    .hero-visual{
      position:absolute;
      inset:-18px -40px -20px -20px;
    }
    .hero-badge{
      position:absolute;
      right:20px;
      bottom:22px;
      width:112px;height:112px;
      border-radius:50%;
      border:1px solid rgba(86,52,218,.18);
      display:grid;place-items:center;
      color:var(--violet-600);
      font-size:10px;
      font-weight:800;
      letter-spacing:.09em;
      text-transform:uppercase;
      text-align:center;
      background:rgba(255,255,255,.66);
      backdrop-filter:blur(12px);
      transform:rotate(-7deg);
      box-shadow:var(--shadow-sm);
    }
    .benefit-strip{
      border-top:1px solid var(--line);
      border-bottom:1px solid var(--line);
      background:rgba(255,255,255,.72);
    }
    .benefits{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      min-height:116px;
    }
    .benefit{
      display:grid;
      grid-template-columns:52px 1fr;
      align-items:center;
      gap:16px;
      padding:25px 34px;
      position:relative;
    }
    .benefit:not(:last-child)::after{
      content:"";
      position:absolute;
      right:0;top:24px;bottom:24px;width:1px;background:var(--line);
    }
    .benefit-icon{
      width:46px;height:46px;
      border-radius:16px;
      border:1px solid var(--line);
      display:grid;place-items:center;
      color:var(--violet-600);
      background:#fff;
    }
    .benefit-icon svg{width:23px;height:23px}
    .benefit strong{display:block;font-size:14px;margin-bottom:3px}
    .benefit span{font-size:12px;color:var(--ink-500);line-height:1.45}

    /* product cards */
    .product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
    .product-card{
      border:1px solid var(--line);
      border-radius:var(--r-lg);
      padding:28px;
      background:#fff;
      display:grid;
      grid-template-columns:138px 1fr;
      gap:26px;
      min-height:340px;
      transition:.2s ease;
      position:relative;
      overflow:hidden;
    }
    .product-card:hover{
      transform:translateY(-3px);
      box-shadow:var(--shadow-md);
      border-color:#dddff0;
    }
    .product-card.featured::before{
      content:"";
      position:absolute;inset:0 auto 0 0;width:3px;
      background:linear-gradient(var(--violet-500),var(--aqua-500));
    }
    .product-image{
      position:relative;
      display:flex;
      align-items:flex-end;
      justify-content:center;
      min-height:270px;
      border-radius:18px;
      background:linear-gradient(160deg,#fafbfe,#f1f3f8);
      overflow:hidden;
    }
    .product-image::after{
      content:"";
      position:absolute;
      width:115px;height:20px;
      bottom:19px;left:50%;transform:translateX(-50%);
      border-radius:50%;
      background:rgba(32,36,55,.12);
      filter:blur(9px);
    }
    .bottle{
      position:relative;
      z-index:2;
      width:82px;
      height:212px;
      margin-bottom:28px;
      border-radius:17px 17px 14px 14px;
      background:linear-gradient(90deg,#edf0f4 0%,#fff 38%,#f2f4f7 70%,#dfe3e9 100%);
      border:1px solid #d7dbe2;
      box-shadow:0 16px 32px rgba(40,44,62,.14);
    }
    .bottle::before{
      content:"";
      position:absolute;
      width:49px;height:31px;
      left:50%;top:-28px;transform:translateX(-50%);
      border-radius:7px 7px 4px 4px;
      background:repeating-linear-gradient(90deg,#1d2026 0 3px,#2a2d34 3px 5px);
      box-shadow:inset 0 -5px 0 rgba(0,0,0,.16);
    }
    .bottle-label{
      position:absolute;
      top:72px;left:8px;right:8px;
      text-align:center;
      font-weight:850;
      letter-spacing:-.035em;
      color:var(--violet-600);
      font-size:17px;
      line-height:1.06;
    }
    .bottle-label small{
      display:block;
      margin-top:9px;
      color:#6a7283;
      font-size:7px;
      font-weight:650;
      letter-spacing:0;
    }
    .bottle.hifloat{height:199px;border-radius:14px}
    .bottle.hifloat::before{background:#f6f8f9;border:1px solid #d8dde1;width:38px;height:37px}
    .bottle.hifloat .bottle-label{color:var(--aqua-600);font-size:15px}
    .bottle.alt{height:176px;width:67px;transform:translateX(12px)}
    .bottle.alt::before{width:35px;height:29px}
    .bottle.alt.second{position:absolute;left:30px;bottom:35px;height:135px;width:54px;transform:none}
    .product-copy{display:flex;flex-direction:column;padding:6px 0}
    .product-copy .tag{
      align-self:flex-start;
      display:inline-flex;
      padding:6px 10px;
      border-radius:999px;
      font-size:10px;font-weight:800;
      color:var(--violet-600);
      background:var(--violet-050);
      margin-bottom:16px;
    }
    .product-copy h3{font-size:27px;margin-bottom:10px}
    .product-copy p{font-size:14px;color:var(--ink-600);line-height:1.55}
    .check-list{list-style:none;padding:0;margin:9px 0 22px}
    .check-list li{
      position:relative;
      padding-left:22px;
      font-size:13px;
      color:#50596b;
      margin:8px 0;
    }
    .check-list li::before{
      content:"✓";
      position:absolute;left:0;top:0;
      color:var(--violet-600);
      font-weight:900;
    }
    .product-copy .btn{margin-top:auto;align-self:flex-start}

    /* diagrams */
    .explain-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
    .explain-card{
      border:1px solid var(--line);
      border-radius:var(--r-lg);
      background:#fff;
      overflow:hidden;
      min-height:390px;
      display:grid;
      grid-template-rows:auto 1fr;
    }
    .explain-copy{padding:28px 30px 0}
    .explain-copy p{font-size:14px;color:var(--ink-600);max-width:410px}
    .diagram{
      min-height:250px;
      position:relative;
      overflow:hidden;
    }

    /* steps */
    .steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
    .step-card{
      border:1px solid var(--line);
      border-radius:var(--r-md);
      overflow:hidden;
      background:#fff;
      min-height:350px;
      display:flex;
      flex-direction:column;
      position:relative;
    }
    .step-card + .step-card::before{
      content:"→";
      position:absolute;
      left:-25px;
      top:118px;
      width:34px;height:34px;
      background:#fff;
      border:1px solid var(--line);
      border-radius:50%;
      display:grid;place-items:center;
      z-index:4;
      color:var(--violet-600);
      font-size:18px;
    }
    .step-media{
      height:190px;
      background:linear-gradient(145deg,#f6f7fa,#edeef5);
      position:relative;
      overflow:hidden;
    }
    .step-number{
      position:absolute;
      z-index:5;
      left:14px;top:14px;
      width:34px;height:34px;
      display:grid;place-items:center;
      border-radius:50%;
      background:var(--violet-600);
      color:#fff;
      font-weight:800;
      font-size:12px;
    }
    .step-copy{padding:20px 20px 22px}
    .step-copy h3{font-size:17px;line-height:1.25;margin-bottom:8px}
    .step-copy p{font-size:13px;color:var(--ink-600);margin-bottom:0}

    /* article grid */
    .knowledge-grid{
      display:grid;
      grid-template-columns:1.15fr .85fr;
      gap:20px;
    }
    .featured-article{
      min-height:420px;
      border:1px solid var(--line);
      border-radius:var(--r-lg);
      background:
        radial-gradient(circle at 77% 50%,rgba(118,88,244,.08),transparent 27%),
        linear-gradient(145deg,#fff,#f9f8ff);
      padding:34px;
      position:relative;
      overflow:hidden;
      display:flex;
      align-items:flex-end;
    }
    .featured-article-copy{max-width:56%;position:relative;z-index:3}
    .article-tag{
      display:inline-flex;
      padding:6px 9px;
      border-radius:999px;
      background:var(--violet-050);
      color:var(--violet-600);
      font-size:9px;
      font-weight:850;
      letter-spacing:.06em;
      text-transform:uppercase;
      margin-bottom:15px;
    }
    .featured-article h3{font-size:30px}
    .featured-article p{color:var(--ink-600);font-size:14px}
    .mini-articles{display:grid;gap:14px}
    .mini-article{
      min-height:124px;
      border:1px solid var(--line);
      border-radius:var(--r-md);
      background:#fff;
      padding:18px;
      display:grid;
      grid-template-columns:142px 1fr;
      gap:18px;
      text-decoration:none;
      transition:.2s ease;
    }
    .mini-article:hover{box-shadow:var(--shadow-sm);border-color:#d9dcea}
    .mini-media{
      border-radius:13px;
      overflow:hidden;
      background:#eef0f5;
      position:relative;
      min-height:88px;
    }
    .mini-copy .article-tag{margin-bottom:7px}
    .mini-copy h3{font-size:16px;line-height:1.25;margin-bottom:7px}
    .mini-copy span{font-size:11px;color:var(--violet-600);font-weight:750}

    /* faq */
    .faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
    details{
      border:1px solid var(--line);
      border-radius:14px;
      background:#fff;
      overflow:hidden;
    }
    summary{
      cursor:pointer;
      list-style:none;
      padding:18px 48px 18px 18px;
      font-size:14px;
      font-weight:680;
      position:relative;
    }
    summary::-webkit-details-marker{display:none}
    summary::after{
      content:"+";
      position:absolute;
      right:18px;top:50%;transform:translateY(-50%);
      width:24px;height:24px;border-radius:50%;
      display:grid;place-items:center;
      background:#f4f5f8;color:#5c6475;
      font-size:16px;
    }
    details[open] summary::after{content:"−"}
    details p{
      margin:0;
      padding:0 18px 18px;
      font-size:13px;
      color:var(--ink-600);
    }

    /* CTA */
    .cta-section{padding:0}
    .cta{
      min-height:280px;
      position:relative;
      overflow:hidden;
      background:
        radial-gradient(circle at 72% 20%,rgba(118,88,244,.24),transparent 25%),
        linear-gradient(120deg,#111827 0%,#1d2240 60%,#2b235f 100%);
      color:#fff;
    }
    .cta-grid{
      display:grid;
      grid-template-columns:.8fr 1.2fr;
      align-items:center;
      min-height:280px;
      position:relative;
      z-index:3;
    }
    .cta h2{font-size:40px;max-width:500px;margin-bottom:14px}
    .cta p{color:#bdc4d3;max-width:510px}
    .cta-art{height:100%;position:relative}
    .cta .btn-primary{background:#6d4bf3}

    /* footer */
    footer{
      padding:52px 0 42px;
      border-top:1px solid var(--line);
      background:#fff;
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1.4fr repeat(3,1fr);
      gap:50px;
    }
    .footer-about p{font-size:13px;color:var(--ink-500);max-width:270px;margin-top:17px}
    .footer-col strong{display:block;margin-bottom:14px;font-size:13px}
    .footer-col a,.footer-col span{
      display:block;
      text-decoration:none;
      color:var(--ink-500);
      font-size:12px;
      margin:8px 0;
    }
    .footer-bottom{
      display:flex;
      justify-content:space-between;
      gap:20px;
      padding-top:28px;
      margin-top:36px;
      border-top:1px solid var(--line);
      color:var(--ink-400);
      font-size:11px;
    }

    /* decorative SVG helper */
    .full-svg{width:100%;height:100%}

    /* mobile */
    .mobile-nav{display:none}
    @media(max-width:1100px){
      .main-nav{gap:16px}
      .main-nav a:nth-child(4){display:none}
      .hero-grid{grid-template-columns:1fr .95fr}
      .product-card{grid-template-columns:110px 1fr;padding:22px;gap:18px}
      .product-image{min-height:250px}
    }

    @media(max-width:860px){
      :root{--section:62px}
      .container{width:min(calc(100% - 28px),var(--container))}
      .header-row{grid-template-columns:auto 1fr auto;min-height:64px}
      .main-nav,.header-actions .icon-btn,.header-actions .btn{display:none}
      .menu-toggle{display:grid}
      .brand{font-size:15px}
      .brand-mark{width:28px;height:28px}
      .mobile-nav{
        display:block;
        position:fixed;
        z-index:90;
        left:0;right:0;
        top:64px;
        background:#fff;
        border-bottom:1px solid var(--line);
        padding:18px 14px 24px;
        transform:translateY(-130%);
        opacity:0;
        visibility:hidden;
        transition:.22s ease;
        box-shadow:0 18px 35px rgba(25,30,47,.08);
      }
      .mobile-nav.open{transform:translateY(0);opacity:1;visibility:visible}
      .mobile-nav a{
        display:block;
        text-decoration:none;
        padding:13px 10px;
        border-bottom:1px solid #f1f2f6;
        font-weight:700;
        font-size:15px;
      }
      .mobile-nav .btn{margin-top:16px;width:100%}

      .hero{padding:34px 0 0}
      .hero-grid{grid-template-columns:1fr;gap:6px;min-height:0}
      .hero-copy{padding:18px 0 12px}
      h1{font-size:clamp(40px,11vw,58px);margin-bottom:18px}
      .lead{font-size:16px;line-height:1.6}
      .hero-actions{display:grid;grid-template-columns:1fr;margin-top:24px}
      .hero-actions .btn{width:100%}
      .hero-art{height:340px;margin:0 -14px}
      .hero-visual{inset:-5px -24px 0 -24px}
      .hero-badge{display:none}
      .benefits{grid-template-columns:1fr 1fr 1fr;min-height:0}
      .benefit{grid-template-columns:1fr;text-align:center;justify-items:center;padding:18px 8px;gap:8px}
      .benefit:not(:last-child)::after{top:16px;bottom:16px}
      .benefit-icon{width:39px;height:39px;border-radius:13px}
      .benefit strong{font-size:11px;line-height:1.25}
      .benefit span{display:none}

      .section-head{align-items:center}
      .section-head .btn-link{font-size:12px}
      h2{font-size:30px}
      .product-grid{
        display:flex;
        gap:12px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        margin-right:-14px;
        padding-right:14px;
        scrollbar-width:none;
      }
      .product-grid::-webkit-scrollbar{display:none}
      .product-card{
        flex:0 0 78vw;
        grid-template-columns:95px 1fr;
        min-height:300px;
        scroll-snap-align:start;
      }
      .product-image{min-height:240px}
      .product-copy h3{font-size:23px}
      .explain-grid{grid-template-columns:1fr}
      .explain-card{min-height:330px}
      .steps{grid-template-columns:1fr}
      .step-card{min-height:auto;display:grid;grid-template-columns:112px 1fr}
      .step-media{height:116px}
      .step-copy{padding:17px}
      .step-card + .step-card::before{display:none}
      .step-number{width:28px;height:28px;left:10px;top:10px}
      .knowledge-grid{grid-template-columns:1fr}
      .featured-article{min-height:340px}
      .featured-article-copy{max-width:68%}
      .mini-article{grid-template-columns:100px 1fr}
      .faq-grid{grid-template-columns:1fr}
      .cta-grid{grid-template-columns:1fr}
      .cta{padding:44px 0}
      .cta h2{font-size:32px}
      .cta-art{height:160px}
      .footer-grid{grid-template-columns:1fr 1fr;gap:34px 24px}
      .footer-about{grid-column:1/-1}
    }

    @media(max-width:520px){
      .section-head{margin-bottom:24px}
      .section-head .btn-link span{display:none}
      .product-card{flex-basis:88vw}
      .product-card{grid-template-columns:88px 1fr;padding:18px}
      .product-image{min-height:222px}
      .featured-article{padding:24px;min-height:320px}
      .featured-article-copy{max-width:70%}
      .featured-article h3{font-size:25px}
      .footer-grid{grid-template-columns:1fr}
      .footer-about{grid-column:auto}
      .footer-bottom{flex-direction:column}
    }


/* single product / Magic Max */
.single-product{
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:38px;
  border:1px solid var(--line);
  border-radius:32px;
  background:#fff;
  overflow:hidden;
  box-shadow:var(--shadow-sm);
}
.single-product-visual{
  position:relative;
  min-height:520px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at 45% 30%,rgba(118,88,244,.12),transparent 28%),
    linear-gradient(145deg,#fafbfe 0%,#f4f5fa 62%,#f7f5ff 100%);
  overflow:hidden;
}
.single-product-glow{
  position:absolute;
  width:330px;height:330px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,255,255,0));
  top:30px;left:50%;transform:translateX(-50%);
}
.bottle.single-magic{
  width:142px;
  height:354px;
  border-radius:27px 27px 22px 22px;
  z-index:4;
  margin:0;
}
.bottle.single-magic::before{
  width:76px;height:43px;
  top:-38px;
  border-radius:10px 10px 5px 5px;
}
.bottle.single-magic .bottle-label{
  top:122px;
  font-size:28px;
}
.bottle.single-magic .bottle-label small{
  font-size:9px;
  margin-top:15px;
}
.single-product-wave{
  position:absolute;
  left:-8%;
  bottom:25px;
  width:116%;
  height:55%;
  z-index:2;
}
.single-product-content{
  padding:48px 48px 44px 0;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.single-product-content .tag{
  align-self:flex-start;
  display:inline-flex;
  padding:7px 11px;
  border-radius:999px;
  background:var(--violet-050);
  color:var(--violet-600);
  font-size:10px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:16px;
}
.single-product-content h3{
  font-size:38px;
  margin-bottom:13px;
}
.single-product-lead{
  font-size:16px;
  color:var(--ink-600);
  max-width:610px;
}
.single-features{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:24px 0 28px;
}
.single-features div{
  padding:15px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfcfe;
}
.single-features strong{
  display:block;
  font-size:12px;
  margin-bottom:5px;
}
.single-features span{
  display:block;
  color:var(--ink-500);
  font-size:10px;
  line-height:1.45;
}
.pack-title{
  font-size:12px;
  font-weight:800;
  margin-bottom:10px;
}
.pack-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:9px;
}
.pack{
  appearance:none;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:12px 13px;
  text-align:left;
  cursor:pointer;
  color:var(--ink-950);
  transition:.17s ease;
}
.pack:hover{border-color:#cbc5f7;background:#fbfaff}
.pack.active{
  border-color:var(--violet-500);
  box-shadow:0 0 0 2px rgba(118,88,244,.08);
  background:var(--violet-050);
}
.pack b{display:block;font-size:13px}
.pack span{display:block;font-size:9px;color:var(--ink-500);margin-top:2px}
.single-product-actions{
  display:flex;
  gap:10px;
  margin-top:24px;
}
.single-product-note{
  font-size:10px;
  color:var(--ink-400);
  margin:15px 0 0;
  max-width:580px;
}

@media(max-width:860px){
  .single-product{grid-template-columns:1fr;gap:0}
  .single-product-visual{min-height:370px}
  .bottle.single-magic{width:110px;height:275px}
  .bottle.single-magic::before{width:60px;height:36px;top:-31px}
  .bottle.single-magic .bottle-label{top:92px;font-size:23px}
  .single-product-content{padding:30px 22px 26px}
  .single-product-content h3{font-size:29px}
  .single-features{grid-template-columns:1fr}
  .pack-grid{grid-template-columns:repeat(2,1fr)}
  .single-product-actions{display:grid;grid-template-columns:1fr}
}


/* v1.2 real template images */
.hero-image-shell{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-template-image{
  width:min(100%, 620px);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 26px 38px rgba(22,28,44,.08));
  border-radius:24px;
}
.single-product-photo-shell{
  width:min(90%, 520px);
  border-radius:28px;
  overflow:hidden;
  box-shadow:0 22px 60px rgba(25,30,47,.10);
  background:#fff;
}
.single-product-photo{
  width:100%;
  height:auto;
  display:block;
}
.single-product-logo{
  position:absolute;
  right:18px;
  top:18px;
  width:160px;
  height:auto;
  z-index:5;
  filter:drop-shadow(0 8px 16px rgba(255,255,255,.3));
}
.step-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.step-media{
  background:#f5f6f9;
}
@media(max-width:860px){
  .hero-template-image{width:100%;max-width:420px}
  .single-product-photo-shell{width:calc(100% - 32px)}
  .single-product-logo{width:122px;right:18px;top:14px}
}


/* v1.3 SEO/trust additions */
.manufacturer-note{
  margin:12px 0 0;
  padding:13px 15px;
  border-left:3px solid var(--aqua-500);
  background:var(--aqua-050);
  border-radius:0 12px 12px 0;
  color:var(--ink-600);
  font-size:12px;
  line-height:1.55;
}
.single-product-logo.official-logo{
  width:170px;
  max-height:72px;
  object-fit:contain;
}
.factor-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.factor-card{
  border:1px solid var(--line);
  border-radius:var(--r-md);
  padding:24px;
  background:#fff;
}
.factor-num{
  display:inline-grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:50%;
  background:var(--violet-050);
  color:var(--violet-600);
  font-weight:850;
  font-size:11px;
  margin-bottom:22px;
}
.factor-card h3{font-size:18px}
.factor-card p{
  margin:0;
  color:var(--ink-600);
  font-size:13px;
  line-height:1.6;
}
.seo-note{
  display:flex;
  gap:12px;
  margin-top:18px;
  border:1px solid #dedaf8;
  border-radius:15px;
  padding:18px 20px;
  background:var(--violet-050);
  font-size:13px;
}
.seo-note strong{color:var(--violet-700)}
.seo-note span{color:var(--ink-600)}
.certification-section{
  background:#f7f8fb;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.certification-grid{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:52px;
  align-items:center;
}
.cert-points{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:24px;
}
.cert-points span{
  padding:8px 11px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  font-size:11px;
  font-weight:700;
}
.cert-gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.cert-thumb{
  text-decoration:none;
  color:var(--ink-950);
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  transition:.18s ease;
}
.cert-thumb:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.cert-thumb img{
  width:100%;
  height:210px;
  object-fit:cover;
  object-position:top;
  background:#fff;
}
.cert-thumb span{
  display:block;
  padding:12px 14px;
  font-size:11px;
  font-weight:750;
}
.featured-real-photo{
  position:absolute;
  right:0;
  top:0;
  width:48%;
  height:100%;
  object-fit:cover;
  object-position:center;
  opacity:.92;
  mask-image:linear-gradient(to right,transparent 0%,#000 32%);
  -webkit-mask-image:linear-gradient(to right,transparent 0%,#000 32%);
}
@media(max-width:860px){
  .factor-grid{grid-template-columns:1fr 1fr}
  .certification-grid{grid-template-columns:1fr}
  .cert-gallery{grid-template-columns:repeat(3,1fr)}
  .cert-thumb img{height:160px}
}
@media(max-width:520px){
  .factor-grid{grid-template-columns:1fr}
  .cert-gallery{grid-template-columns:1fr}
  .cert-thumb{display:grid;grid-template-columns:110px 1fr;align-items:center}
  .cert-thumb img{height:120px}
  .featured-real-photo{width:52%;opacity:.72}
}


/* v1.4 real pack gallery */
.single-product-photo-stage{
  width:min(92%, 560px);
  min-height:420px;
  display:grid;
  place-items:center;
  background:#fff;
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(25,30,47,.08);
}
.single-product-photo.real-pack{
  width:100%;
  height:100%;
  max-height:420px;
  object-fit:contain;
  background:#fff;
}
.home-pack-thumbs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  width:min(92%,560px);
  margin-top:16px;
}
.pack-thumb{
  border:1px solid var(--line);
  background:#fff;
  border-radius:16px;
  padding:10px 10px 8px;
  cursor:pointer;
  transition:.18s ease;
}
.pack-thumb:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.pack-thumb.is-active{border-color:var(--violet-500);box-shadow:0 0 0 2px rgba(118,88,244,.10)}
.pack-thumb img{
  width:100%;
  height:88px;
  object-fit:contain;
}
.pack-thumb span{
  display:block;
  margin-top:6px;
  text-align:center;
  font-size:11px;
  font-weight:750;
}
.pack-grid-rich .pack{ text-decoration:none; }
.pack-rich{min-height:72px; display:flex; flex-direction:column; justify-content:center;}

/* product page */
.breadcrumbs{
  display:flex; flex-wrap:wrap; gap:8px;
  font-size:12px; color:var(--ink-500);
  margin:20px 0 18px;
}
.breadcrumbs a{color:var(--ink-500); text-decoration:none}
.breadcrumbs span{color:var(--ink-400)}
.product-hero{
  padding:26px 0 44px;
  background:
    radial-gradient(circle at 85% 18%,rgba(118,88,244,.08),transparent 22%),
    radial-gradient(circle at 72% 58%,rgba(40,179,187,.05),transparent 20%),
    #fff;
}
.product-hero-grid{
  display:grid; grid-template-columns:.9fr 1.1fr; gap:34px; align-items:start;
}
.product-gallery{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  padding:22px;
  box-shadow:var(--shadow-sm);
}
.gallery-main{
  border-radius:20px;
  background:#fff;
  min-height:520px;
  display:grid; place-items:center;
}
.gallery-main img{
  width:100%; max-height:520px; object-fit:contain;
}
.gallery-thumbs{
  display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:14px;
}
.gallery-thumbs button{
  border:1px solid var(--line);
  background:#fff; border-radius:14px; padding:8px; cursor:pointer;
}
.gallery-thumbs button.is-active{border-color:var(--violet-500); box-shadow:0 0 0 2px rgba(118,88,244,.10)}
.gallery-thumbs img{width:100%; height:74px; object-fit:contain}
.product-summary h1{font-size:56px; max-width:none; margin-bottom:18px}
.summary-lead{font-size:18px; color:var(--ink-600); line-height:1.65; max-width:720px}
.key-points{
  display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:26px 0;
}
.key-point{
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  background:#fff;
}
.key-point strong{display:block; font-size:13px; margin-bottom:5px}
.key-point span{display:block; font-size:12px; color:var(--ink-600)}
.product-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px}
.doc-chip-row{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px}
.doc-chip-row a{
  display:inline-flex; align-items:center; gap:8px;
  text-decoration:none; font-size:12px; font-weight:700;
  padding:10px 12px; border-radius:999px; background:#fff; border:1px solid var(--line);
}
.page-section{padding:78px 0}
.pack-cards{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.pack-card{
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-sm);
}
.pack-card-media{
  background:linear-gradient(180deg,#fff,#f7f8fb);
  padding:20px;
  min-height:280px;
  display:grid;
  place-items:center;
}
.pack-card-media img{
  width:100%; max-width:210px; height:220px; object-fit:contain;
}
.pack-card-body{padding:22px}
.pack-card h3{font-size:24px; margin-bottom:8px}
.pack-card p{font-size:13px; color:var(--ink-600)}
.pack-card ul{list-style:none; padding:0; margin:16px 0 0}
.pack-card li{font-size:12px; color:#525b6c; margin:7px 0; padding-left:18px; position:relative}
.pack-card li::before{content:"•"; position:absolute; left:0; top:0; color:var(--violet-600); font-weight:900}
.two-col{
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
}
.info-card{
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  padding:28px;
}
.info-card h2, .info-card h3{margin-bottom:12px}
.info-card p, .info-card li{color:var(--ink-600); font-size:14px; line-height:1.65}
.info-card ol, .info-card ul{padding-left:20px; margin-bottom:0}
.doc-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px;
}
.doc-card{
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  text-decoration:none;
  color:var(--ink-950);
  background:#fff;
}
.doc-card img{width:100%; height:240px; object-fit:cover; object-position:top; display:block}
.doc-card span{display:block; padding:12px 14px; font-size:12px; font-weight:750}
.seo-copy{
  display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:start;
}
.note-card{
  border:1px solid var(--line);
  border-radius:20px; background:#fff; padding:22px;
}
.note-card h3{font-size:20px}
.note-card p, .note-card li{font-size:13px; color:var(--ink-600); line-height:1.65}
.table-wrap{overflow:auto}
.char-table{
  width:100%; border-collapse:collapse; font-size:13px; background:#fff;
}
.char-table th, .char-table td{
  padding:14px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top;
}
.char-table th{font-size:12px; color:var(--ink-500); font-weight:750}
@media(max-width:980px){
  .product-hero-grid,.two-col,.seo-copy{grid-template-columns:1fr}
  .pack-cards{grid-template-columns:repeat(2,1fr)}
  .gallery-thumbs{grid-template-columns:repeat(3,1fr)}
  .doc-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .home-pack-thumbs{grid-template-columns:repeat(3,1fr); width:calc(100% - 32px)}
  .single-product-photo-stage{width:calc(100% - 32px); min-height:320px}
  .gallery-main{min-height:360px}
  .gallery-main img{max-height:360px}
  .product-summary h1{font-size:42px}
  .key-points{grid-template-columns:1fr}
}
@media(max-width:620px){
  .pack-cards,.doc-grid{grid-template-columns:1fr}
  .home-pack-thumbs{grid-template-columns:repeat(2,1fr)}
  .gallery-thumbs{grid-template-columns:repeat(2,1fr)}
  .gallery-thumbs img{height:64px}
}


/* v1.5 SEO article template */
.article-hero{
  padding:28px 0 58px;
  background:
    radial-gradient(circle at 85% 16%,rgba(118,88,244,.075),transparent 23%),
    radial-gradient(circle at 74% 58%,rgba(40,179,187,.055),transparent 20%),
    linear-gradient(180deg,#fff 0%,#fbfbfe 100%);
}
.article-hero-grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:42px;
  align-items:center;
}
.article-hero h1{
  font-size:clamp(44px,5vw,68px);
  max-width:820px;
}
.article-hero-visual{
  position:relative;
  min-height:440px;
  display:grid;
  place-items:center;
}
.article-hero-card{
  width:min(100%,540px);
  border:1px solid var(--line);
  background:#fff;
  border-radius:30px;
  padding:24px;
  box-shadow:var(--shadow-md);
}
.article-hero-card img{
  width:100%;
  height:360px;
  object-fit:cover;
  object-position:center;
  border-radius:20px;
}
.quick-answer{
  margin-top:28px;
  border:1px solid #ddd9fb;
  border-radius:18px;
  background:var(--violet-050);
  padding:20px 22px;
  max-width:760px;
}
.quick-answer strong{
  display:block;
  font-size:13px;
  color:var(--violet-700);
  margin-bottom:7px;
}
.quick-answer p{margin:0;color:var(--ink-600);font-size:14px;line-height:1.65}

.article-layout{
  display:grid;
  grid-template-columns:minmax(0,820px) 290px;
  gap:56px;
  align-items:start;
}
.article-main h2{
  font-size:36px;
  margin:54px 0 18px;
}
.article-main h2:first-child{margin-top:0}
.article-main h3{
  font-size:23px;
  margin:34px 0 12px;
}
.article-main p,
.article-main li{
  font-size:16px;
  line-height:1.75;
  color:var(--ink-600);
}
.article-main strong{color:var(--ink-950)}
.article-main ul,
.article-main ol{padding-left:23px}
.article-main a{color:var(--violet-600);font-weight:700}

.article-aside{
  position:sticky;
  top:102px;
}
.toc{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:18px;
  box-shadow:var(--shadow-sm);
}
.toc strong{
  display:block;
  font-size:12px;
  margin-bottom:10px;
}
.toc a{
  display:block;
  text-decoration:none;
  color:var(--ink-600);
  font-size:12px;
  padding:8px 0;
  border-bottom:1px solid #f1f2f6;
}
.toc a:last-child{border-bottom:0}
.toc a:hover{color:var(--violet-600)}
.aside-product{
  margin-top:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:linear-gradient(145deg,#fff,#f8f6ff);
  padding:18px;
  text-align:center;
}
.aside-product img{
  width:120px;height:150px;object-fit:contain;margin:0 auto 12px;
}
.aside-product strong{display:block;font-size:14px;margin-bottom:5px}
.aside-product p{font-size:11px;color:var(--ink-500);margin-bottom:12px}
.aside-product .btn{width:100%}

.article-step-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:24px 0 34px;
}
.article-step{
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:#fff;
}
.article-step img{
  width:100%;
  height:210px;
  object-fit:cover;
}
.article-step-copy{padding:20px}
.article-step-num{
  display:inline-grid;
  place-items:center;
  width:31px;height:31px;
  border-radius:50%;
  background:var(--violet-600);
  color:#fff;
  font-size:11px;
  font-weight:850;
  margin-bottom:11px;
}
.article-step h3{
  margin:0 0 8px;
  font-size:20px;
}
.article-step p{font-size:13px;margin:0}

.info-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:24px 0 34px;
}
.info-strip > div{
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:17px;
}
.info-strip b{
  display:block;
  font-size:13px;
  margin-bottom:4px;
}
.info-strip span{
  display:block;
  color:var(--ink-500);
  font-size:11px;
}
.warning-box,
.tip-box{
  border-radius:17px;
  padding:19px 21px;
  margin:24px 0;
  font-size:14px;
  line-height:1.65;
}
.warning-box{
  background:#fff8f4;
  border:1px solid #f4ddd0;
}
.tip-box{
  background:var(--aqua-050);
  border:1px solid #d4eff0;
}
.warning-box strong,.tip-box strong{display:block;margin-bottom:6px}

.mistake-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:22px 0 34px;
}
.mistake-card{
  border:1px solid var(--line);
  border-radius:17px;
  padding:20px;
  background:#fff;
}
.mistake-card span{
  display:inline-grid;
  place-items:center;
  width:30px;height:30px;border-radius:50%;
  background:#fff3f2;color:#c4473d;
  font-weight:900;font-size:12px;margin-bottom:12px;
}
.mistake-card h3{font-size:18px;margin:0 0 7px}
.mistake-card p{font-size:13px;margin:0}

.article-table-wrap{
  overflow:auto;
  margin:20px 0 34px;
  border:1px solid var(--line);
  border-radius:18px;
}
.article-table{
  width:100%;
  border-collapse:collapse;
  min-width:620px;
  background:#fff;
}
.article-table th,.article-table td{
  padding:14px 16px;
  text-align:left;
  border-bottom:1px solid var(--line);
  font-size:13px;
  vertical-align:top;
}
.article-table th{
  color:var(--ink-500);
  background:#fafbfc;
  font-weight:800;
}
.article-table tr:last-child td{border-bottom:0}

.related-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:26px;
}
.related-card{
  text-decoration:none;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:20px;
  transition:.18s ease;
}
.related-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.related-card span{
  color:var(--aqua-600);
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.related-card h3{font-size:18px;margin:9px 0 7px}
.related-card p{font-size:12px;color:var(--ink-500);margin:0}

.article-product-cta{
  margin-top:48px;
  border-radius:28px;
  background:
    radial-gradient(circle at 80% 30%,rgba(118,88,244,.28),transparent 25%),
    linear-gradient(125deg,#151b2c,#242044);
  color:#fff;
  padding:34px;
  display:grid;
  grid-template-columns:1fr 180px;
  gap:24px;
  align-items:center;
  overflow:hidden;
}
.article-product-cta h2{
  color:#fff;
  margin:0 0 10px;
  font-size:30px;
}
.article-product-cta p{color:#c0c6d3;font-size:14px}
.article-product-cta img{
  width:100%;height:190px;object-fit:contain;
  filter:drop-shadow(0 22px 30px rgba(0,0,0,.20));
}

@media(max-width:1000px){
  .article-layout{grid-template-columns:1fr}
  .article-aside{position:static;display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .aside-product{margin-top:0}
}
@media(max-width:860px){
  .article-hero-grid{grid-template-columns:1fr}
  .article-hero-visual{min-height:auto}
  .article-hero-card img{height:300px}
  .info-strip{grid-template-columns:1fr}
  .related-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .article-step-grid,.mistake-grid{grid-template-columns:1fr}
  .article-aside{grid-template-columns:1fr}
  .article-product-cta{grid-template-columns:1fr}
  .article-product-cta img{height:160px}
  .article-main h2{font-size:30px}
}


/* v1.6 gel consumption calculator */
.calc-hero{
  padding:28px 0 62px;
  background:
    radial-gradient(circle at 84% 18%,rgba(118,88,244,.08),transparent 24%),
    radial-gradient(circle at 73% 58%,rgba(40,179,187,.055),transparent 22%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.calc-hero-grid{
  display:grid;
  grid-template-columns:1fr .92fr;
  gap:46px;
  align-items:center;
}
.calc-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:820px;
}
.calc-preview{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  padding:24px;
  box-shadow:var(--shadow-md);
}
.calc-preview-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.calc-preview-top strong{font-size:14px}
.calc-preview-top span{
  font-size:10px;
  font-weight:800;
  color:var(--aqua-600);
  background:var(--aqua-050);
  border-radius:999px;
  padding:6px 9px;
}
.calc-preview-art{
  height:340px;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#fff,#f7f6ff);
  border-radius:22px;
  overflow:hidden;
}
.calc-preview-art img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:18px;
}

.calculator-shell{
  display:grid;
  grid-template-columns:.88fr 1.12fr;
  gap:22px;
  align-items:stretch;
}
.calc-panel,
.calc-result{
  border:1px solid var(--line);
  border-radius:26px;
  background:#fff;
  padding:28px;
  box-shadow:var(--shadow-sm);
}
.calc-panel h2,
.calc-result h2{
  font-size:30px;
  margin-bottom:10px;
}
.calc-label{
  display:block;
  font-size:12px;
  font-weight:800;
  margin:22px 0 8px;
}
.calc-input-wrap{
  display:flex;
  align-items:center;
  border:1px solid var(--line-strong);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.calc-input-wrap input{
  width:100%;
  border:0;
  outline:0;
  padding:15px 16px;
  font-size:18px;
  font-weight:750;
  color:var(--ink-950);
}
.calc-input-wrap span{
  padding:0 16px;
  color:var(--ink-500);
  font-size:12px;
  border-left:1px solid var(--line);
}
.preset-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.preset-row button,
.reserve-option{
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:8px 12px;
  font-size:11px;
  font-weight:750;
  color:var(--ink-600);
  cursor:pointer;
}
.preset-row button:hover,
.reserve-option:hover{border-color:#cbc5f7;background:var(--violet-050)}
.reserve-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:20px;
  padding:15px 16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfcfe;
}
.reserve-copy strong{display:block;font-size:12px;margin-bottom:3px}
.reserve-copy span{display:block;font-size:10px;color:var(--ink-500)}
.toggle{
  position:relative;
  width:46px;
  height:26px;
  border-radius:999px;
  background:#dfe2e9;
  cursor:pointer;
  flex:0 0 auto;
}
.toggle input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.toggle i{
  position:absolute;
  width:20px;height:20px;
  border-radius:50%;
  top:3px;left:3px;
  background:#fff;
  box-shadow:0 2px 6px rgba(0,0,0,.16);
  transition:.18s ease;
}
.toggle:has(input:checked){background:var(--violet-600)}
.toggle input:checked + i{transform:translateX(20px)}

.calc-result{
  background:
    radial-gradient(circle at 78% 18%,rgba(118,88,244,.12),transparent 25%),
    linear-gradient(145deg,#fff,#faf9ff);
  position:relative;
  overflow:hidden;
}
.result-kicker{
  color:var(--aqua-600);
  font-size:10px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.075em;
  margin-bottom:10px;
}
.result-main{
  display:grid;
  grid-template-columns:1fr 180px;
  gap:18px;
  align-items:center;
}
.result-pack{
  font-size:42px;
  line-height:1;
  font-weight:850;
  letter-spacing:-.045em;
  color:var(--violet-700);
  margin:8px 0 10px;
}
.result-sub{
  color:var(--ink-600);
  font-size:14px;
  max-width:520px;
}
.result-image{
  width:100%;
  height:220px;
  object-fit:contain;
  filter:drop-shadow(0 18px 28px rgba(31,34,49,.10));
}
.result-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:20px;
}
.result-stat{
  border:1px solid var(--line);
  background:rgba(255,255,255,.84);
  border-radius:14px;
  padding:14px;
}
.result-stat b{
  display:block;
  font-size:16px;
  margin-bottom:3px;
}
.result-stat span{
  display:block;
  font-size:10px;
  color:var(--ink-500);
  line-height:1.4;
}
.calc-disclaimer{
  margin-top:16px;
  font-size:10px;
  line-height:1.55;
  color:var(--ink-400);
}
.calc-result .btn{margin-top:18px}

.capacity-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:12px;
}
.capacity-card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px 14px;
  text-align:center;
  background:#fff;
}
.capacity-card img{
  width:100%;
  height:145px;
  object-fit:contain;
  margin-bottom:10px;
}
.capacity-card b{
  display:block;
  font-size:16px;
}
.capacity-card span{
  display:block;
  font-size:10px;
  color:var(--ink-500);
  margin-top:3px;
}
.formula-box{
  border:1px solid #d9d5fb;
  background:var(--violet-050);
  border-radius:20px;
  padding:22px;
  margin:24px 0 34px;
}
.formula-box code{
  display:block;
  margin-top:10px;
  padding:13px 15px;
  border-radius:12px;
  background:#fff;
  color:var(--violet-700);
  font-size:14px;
  white-space:normal;
}
.calc-examples{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:24px 0;
}
.calc-example{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:20px;
}
.calc-example b{display:block;font-size:23px;margin-bottom:6px}
.calc-example strong{display:block;font-size:13px;color:var(--violet-700);margin-bottom:6px}
.calc-example p{font-size:12px;color:var(--ink-500);margin:0;line-height:1.55}
@media(max-width:1040px){
  .capacity-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .calc-hero-grid,.calculator-shell{grid-template-columns:1fr}
  .calc-preview-art{height:300px}
  .result-main{grid-template-columns:1fr 145px}
  .calc-examples{grid-template-columns:1fr}
}
@media(max-width:620px){
  .result-main{grid-template-columns:1fr}
  .result-image{height:180px}
  .result-stats{grid-template-columns:1fr}
  .capacity-grid{grid-template-columns:repeat(2,1fr)}
  .calc-panel,.calc-result{padding:22px}
}


/* v1.7 float-time SEO page */
.float-hero{
  padding:28px 0 62px;
  background:
    radial-gradient(circle at 84% 16%,rgba(118,88,244,.08),transparent 23%),
    radial-gradient(circle at 72% 60%,rgba(40,179,187,.055),transparent 22%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.float-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:44px;
  align-items:center;
}
.float-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:850px;
}
.float-visual{
  position:relative;
  min-height:460px;
  border:1px solid var(--line);
  border-radius:30px;
  background:linear-gradient(145deg,#fff,#f7f6ff);
  overflow:hidden;
  box-shadow:var(--shadow-md);
}
.float-balloon{
  position:absolute;
  width:230px;
  height:280px;
  border-radius:50% 50% 48% 52%;
  right:100px;
  top:58px;
  background:
    radial-gradient(circle at 34% 24%,rgba(255,255,255,.95) 0 11%,rgba(255,255,255,.28) 12% 21%,transparent 22%),
    radial-gradient(circle at 42% 34%,#fff 0%,#f7f8fb 42%,rgba(220,223,232,.58) 100%);
  border:1px solid #d9dde6;
  box-shadow:0 28px 55px rgba(33,38,59,.12);
}
.float-balloon::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-19px;
  transform:translateX(-50%);
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-top:19px solid #d2d6df;
}
.float-string{
  position:absolute;
  width:1px;
  height:150px;
  background:#aeb5c0;
  right:214px;
  top:356px;
  transform:rotate(-4deg);
  transform-origin:top;
}
.float-wave{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.float-chip{
  position:absolute;
  left:26px;
  bottom:26px;
  right:26px;
  border:1px solid rgba(118,88,244,.16);
  border-radius:16px;
  background:rgba(255,255,255,.86);
  backdrop-filter:blur(10px);
  padding:15px 17px;
}
.float-chip strong{display:block;font-size:13px;margin-bottom:4px}
.float-chip span{display:block;font-size:11px;color:var(--ink-500);line-height:1.5}

.claim-box{
  border:1px solid #dcd8fb;
  border-radius:22px;
  background:var(--violet-050);
  padding:24px;
  margin:24px 0 34px;
}
.claim-box .claim-label{
  color:var(--violet-700);
  font-size:10px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.07em;
  margin-bottom:8px;
}
.claim-box strong{
  display:block;
  font-size:26px;
  line-height:1.2;
  margin-bottom:10px;
}
.claim-box p{
  margin:0;
  color:var(--ink-600);
  font-size:13px;
  line-height:1.65;
}
.factor-impact-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin:22px 0 34px;
}
.impact-card{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:20px;
}
.impact-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}
.impact-head h3{margin:0;font-size:18px}
.impact-level{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.impact-dot{
  width:7px;height:7px;border-radius:50%;background:var(--violet-500);
}
.impact-level.high .impact-dot:nth-child(1),
.impact-level.high .impact-dot:nth-child(2),
.impact-level.high .impact-dot:nth-child(3){opacity:1}
.impact-level.medium .impact-dot:nth-child(3){opacity:.2}
.impact-level.low .impact-dot:nth-child(2),
.impact-level.low .impact-dot:nth-child(3){opacity:.2}
.impact-card p{font-size:13px;color:var(--ink-600);margin:0;line-height:1.6}

.timeline{
  position:relative;
  margin:28px 0 38px;
  padding-left:28px;
}
.timeline::before{
  content:"";
  position:absolute;
  left:8px;top:8px;bottom:8px;
  width:1px;background:linear-gradient(var(--aqua-500),var(--violet-500));
}
.timeline-item{
  position:relative;
  padding:0 0 26px 20px;
}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{
  content:"";
  position:absolute;
  left:-25px;top:5px;
  width:12px;height:12px;
  border-radius:50%;
  background:#fff;
  border:3px solid var(--violet-500);
}
.timeline-item b{display:block;font-size:14px;margin-bottom:4px}
.timeline-item p{font-size:13px;color:var(--ink-600);margin:0}

.test-protocol{
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  padding:26px;
  margin:26px 0 38px;
}
.test-protocol-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:18px;
}
.protocol-item{
  border:1px solid var(--line);
  border-radius:15px;
  padding:15px;
  background:#fafbfc;
}
.protocol-item b{display:block;font-size:12px;margin-bottom:4px}
.protocol-item span{display:block;font-size:10px;color:var(--ink-500)}
.test-status{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:18px;
  padding:13px 14px;
  border-radius:13px;
  background:var(--aqua-050);
  color:var(--aqua-600);
  font-size:11px;
  font-weight:750;
}
.test-status::before{
  content:"";
  width:8px;height:8px;border-radius:50%;
  background:var(--aqua-500);
  box-shadow:0 0 0 5px rgba(40,179,187,.12);
}
.comparison-note{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.comparison-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.comparison-card .label{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:13px;
}
.comparison-card.no .label{background:var(--aqua-050);color:var(--aqua-600)}
.comparison-card.yes .label{background:var(--violet-050);color:var(--violet-700)}
.comparison-card h3{font-size:20px;margin-bottom:8px}
.comparison-card p{font-size:13px;color:var(--ink-600);margin:0;line-height:1.6}

.weather-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:22px 0 34px;
}
.weather-card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
  background:#fff;
}
.weather-card .weather-icon{
  width:40px;height:40px;
  border-radius:14px;
  display:grid;place-items:center;
  margin-bottom:14px;
  background:var(--surface-soft);
  font-size:18px;
}
.weather-card h3{font-size:18px;margin-bottom:7px}
.weather-card p{font-size:12px;color:var(--ink-500);margin:0;line-height:1.6}

@media(max-width:860px){
  .float-hero-grid{grid-template-columns:1fr}
  .float-visual{min-height:400px}
  .float-balloon{right:50%;transform:translateX(50%);top:40px;width:190px;height:230px}
  .float-string{right:50%;top:286px}
  .test-protocol-grid,.weather-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .factor-impact-grid,.comparison-note{grid-template-columns:1fr}
  .float-visual{min-height:370px}
}


/* v1.8 troubleshooting page */
.trouble-hero{
  padding:28px 0 62px;
  background:
    radial-gradient(circle at 84% 15%,rgba(118,88,244,.08),transparent 23%),
    radial-gradient(circle at 72% 60%,rgba(40,179,187,.055),transparent 22%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.trouble-hero-grid{
  display:grid;
  grid-template-columns:1.04fr .96fr;
  gap:44px;
  align-items:center;
}
.trouble-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:850px;
}
.trouble-visual{
  min-height:450px;
  border:1px solid var(--line);
  border-radius:30px;
  background:linear-gradient(145deg,#fff,#f7f6ff);
  box-shadow:var(--shadow-md);
  position:relative;
  overflow:hidden;
}
.trouble-balloon{
  position:absolute;
  width:205px;height:248px;
  border-radius:50% 50% 48% 52%;
  right:118px;top:52px;
  background:
    radial-gradient(circle at 34% 24%,rgba(255,255,255,.95) 0 12%,rgba(255,255,255,.28) 13% 22%,transparent 23%),
    radial-gradient(circle at 42% 34%,#fff 0%,#f6f7fa 42%,rgba(218,222,230,.65) 100%);
  border:1px solid #d7dbe4;
  box-shadow:0 26px 48px rgba(33,38,59,.12);
}
.trouble-balloon::after{
  content:"";
  position:absolute;left:50%;bottom:-17px;transform:translateX(-50%);
  border-left:9px solid transparent;border-right:9px solid transparent;border-top:17px solid #d0d5de;
}
.trouble-balloon.low{
  top:148px;
  transform:scale(.88);
  opacity:.86;
}
.trouble-arrow{
  position:absolute;
  right:205px;
  top:66px;
  width:2px;height:86px;
  background:linear-gradient(var(--aqua-500),var(--violet-500));
}
.trouble-arrow::after{
  content:"";
  position:absolute;
  left:-5px;bottom:-1px;
  border-left:6px solid transparent;
  border-right:6px solid transparent;
  border-top:8px solid var(--violet-500);
}
.trouble-chip{
  position:absolute;
  left:28px;bottom:28px;
  width:260px;
  border:1px solid rgba(118,88,244,.17);
  border-radius:17px;
  background:rgba(255,255,255,.9);
  padding:16px;
}
.trouble-chip strong{display:block;font-size:13px;margin-bottom:4px}
.trouble-chip span{display:block;font-size:11px;color:var(--ink-500);line-height:1.5}

.diagnostic-shell{
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.diagnostic-tabs{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid var(--line);
}
.diag-tab{
  appearance:none;
  border:0;
  border-right:1px solid var(--line);
  background:#fff;
  padding:18px 14px;
  cursor:pointer;
  text-align:left;
  min-height:86px;
  transition:.18s ease;
}
.diag-tab:last-child{border-right:0}
.diag-tab:hover{background:#faf9ff}
.diag-tab.is-active{
  background:var(--violet-050);
  box-shadow:inset 0 -3px 0 var(--violet-600);
}
.diag-tab small{
  display:block;
  color:var(--aqua-600);
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:5px;
}
.diag-tab b{display:block;font-size:13px;line-height:1.35}
.diagnostic-body{
  padding:30px;
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:30px;
  align-items:start;
}
.diag-result h3{
  font-size:27px;
  margin-bottom:10px;
}
.diag-result > p{
  color:var(--ink-600);
  font-size:14px;
  line-height:1.65;
}
.diag-causes{
  display:grid;
  gap:10px;
}
.diag-cause{
  border:1px solid var(--line);
  border-radius:15px;
  padding:15px;
  background:#fbfcfe;
}
.diag-cause b{display:block;font-size:12px;margin-bottom:4px}
.diag-cause span{display:block;font-size:11px;color:var(--ink-500);line-height:1.5}
.diag-checklist{
  display:grid;
  gap:10px;
}
.diag-check{
  display:flex;
  gap:12px;
  align-items:flex-start;
  border:1px solid var(--line);
  border-radius:15px;
  padding:15px;
  background:#fff;
}
.diag-check i{
  flex:0 0 auto;
  width:26px;height:26px;
  border-radius:50%;
  display:grid;place-items:center;
  background:var(--violet-050);
  color:var(--violet-700);
  font-style:normal;
  font-size:11px;
  font-weight:900;
}
.diag-check b{display:block;font-size:12px;margin-bottom:3px}
.diag-check span{display:block;font-size:10px;color:var(--ink-500);line-height:1.5}

.cause-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:24px 0 36px;
}
.cause-card{
  border:1px solid var(--line);
  border-radius:19px;
  background:#fff;
  padding:21px;
  position:relative;
}
.cause-card .cause-icon{
  width:38px;height:38px;
  display:grid;place-items:center;
  border-radius:13px;
  background:var(--surface-soft);
  margin-bottom:15px;
  font-size:17px;
}
.cause-card h3{font-size:18px;margin-bottom:7px}
.cause-card p{font-size:12px;color:var(--ink-500);line-height:1.6;margin:0}
.cause-card .priority{
  position:absolute;
  right:15px;top:15px;
  font-size:8px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.05em;
  padding:5px 7px;
  border-radius:999px;
}
.priority.high{background:#fff0ef;color:#c7463d}
.priority.medium{background:#fff8e9;color:#a16c18}
.priority.check{background:var(--aqua-050);color:var(--aqua-600)}

.symptom-table{
  width:100%;
  min-width:720px;
  border-collapse:collapse;
}
.symptom-table th,.symptom-table td{
  padding:15px 14px;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--line);
  font-size:12px;
}
.symptom-table th{
  background:#fafbfc;
  color:var(--ink-500);
  font-weight:800;
}
.symptom-table td:first-child{
  font-weight:750;
  color:var(--ink-950);
}
.first-aid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:22px 0 34px;
}
.first-aid-card{
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  padding:18px;
}
.first-aid-card span{
  display:grid;
  place-items:center;
  width:30px;height:30px;
  border-radius:50%;
  background:var(--aqua-050);
  color:var(--aqua-600);
  font-size:11px;font-weight:850;
  margin-bottom:12px;
}
.first-aid-card h3{font-size:16px;margin-bottom:6px}
.first-aid-card p{font-size:11px;color:var(--ink-500);line-height:1.55;margin:0}

.no-fix-box{
  border:1px solid #f1d8d4;
  border-radius:19px;
  background:#fff7f5;
  padding:21px;
  margin:22px 0 34px;
}
.no-fix-box strong{display:block;font-size:15px;margin-bottom:7px}
.no-fix-box p{margin:0;color:var(--ink-600);font-size:13px;line-height:1.65}

@media(max-width:980px){
  .diagnostic-tabs{grid-template-columns:1fr 1fr}
  .diag-tab:nth-child(2){border-right:0}
  .diag-tab:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .diagnostic-body{grid-template-columns:1fr}
  .cause-grid{grid-template-columns:1fr 1fr}
  .first-aid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
  .trouble-hero-grid{grid-template-columns:1fr}
  .trouble-visual{min-height:390px}
}
@media(max-width:620px){
  .diagnostic-tabs{grid-template-columns:1fr}
  .diag-tab{border-right:0;border-bottom:1px solid var(--line)!important}
  .cause-grid,.first-aid{grid-template-columns:1fr}
  .trouble-balloon{right:50%;transform:translateX(50%) scale(.85)}
  .trouble-balloon.low{top:138px}
  .trouble-arrow{right:50%}
  .trouble-chip{left:18px;right:18px;width:auto}
}


/* v1.9 humidity & temperature page */
.climate-hero{
  padding:28px 0 62px;
  background:
    radial-gradient(circle at 84% 15%,rgba(118,88,244,.08),transparent 23%),
    radial-gradient(circle at 70% 62%,rgba(40,179,187,.055),transparent 22%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.climate-hero-grid{
  display:grid;
  grid-template-columns:1.03fr .97fr;
  gap:44px;
  align-items:center;
}
.climate-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:880px;
}
.climate-visual{
  min-height:450px;
  border:1px solid var(--line);
  border-radius:30px;
  background:linear-gradient(145deg,#fff,#f7f6ff);
  box-shadow:var(--shadow-md);
  position:relative;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.climate-rings{
  position:absolute;
  width:330px;height:330px;
  border-radius:50%;
  border:1px solid rgba(118,88,244,.14);
}
.climate-rings::before,
.climate-rings::after{
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px solid rgba(40,179,187,.14);
}
.climate-rings::before{inset:42px}
.climate-rings::after{inset:88px;border-color:rgba(118,88,244,.18)}
.climate-values{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.climate-value{
  min-width:140px;
  border:1px solid var(--line);
  border-radius:18px;
  padding:18px;
  background:rgba(255,255,255,.9);
  text-align:center;
  backdrop-filter:blur(8px);
}
.climate-value b{
  display:block;
  font-size:32px;
  color:var(--violet-700);
  line-height:1;
  margin-bottom:6px;
}
.climate-value span{
  display:block;
  font-size:10px;
  color:var(--ink-500);
}
.climate-caption{
  position:absolute;
  left:28px;right:28px;bottom:25px;
  border:1px solid rgba(118,88,244,.16);
  border-radius:16px;
  padding:14px 16px;
  background:rgba(255,255,255,.9);
  font-size:11px;
  color:var(--ink-500);
  text-align:center;
}

.climate-checker{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:22px;
}
.climate-form,
.climate-result{
  border:1px solid var(--line);
  border-radius:26px;
  background:#fff;
  padding:28px;
  box-shadow:var(--shadow-sm);
}
.climate-form h2,
.climate-result h2{font-size:30px;margin-bottom:10px}
.climate-field-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:20px;
}
.climate-field label{
  display:block;
  font-size:11px;
  font-weight:800;
  margin-bottom:7px;
}
.climate-input{
  display:flex;
  align-items:center;
  border:1px solid var(--line-strong);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}
.climate-input input{
  width:100%;
  border:0;
  outline:0;
  padding:15px 14px;
  font-size:20px;
  font-weight:800;
  color:var(--ink-950);
}
.climate-input span{
  padding:0 14px;
  border-left:1px solid var(--line);
  color:var(--ink-500);
  font-size:12px;
}
.climate-presets{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}
.climate-presets button{
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:8px 11px;
  color:var(--ink-600);
  font-size:10px;
  font-weight:750;
  cursor:pointer;
}
.climate-presets button:hover{background:var(--violet-050);border-color:#cbc5f7}

.climate-result{
  background:
    radial-gradient(circle at 80% 20%,rgba(118,88,244,.11),transparent 25%),
    linear-gradient(145deg,#fff,#faf9ff);
}
.climate-status{
  display:flex;
  align-items:center;
  gap:12px;
  margin:16px 0 20px;
}
.status-dot{
  width:16px;height:16px;
  border-radius:50%;
  background:var(--aqua-500);
  box-shadow:0 0 0 7px rgba(40,179,187,.12);
  flex:0 0 auto;
}
.climate-status.warn .status-dot{
  background:#e1a53b;
  box-shadow:0 0 0 7px rgba(225,165,59,.13);
}
.climate-status.bad .status-dot{
  background:#d5574b;
  box-shadow:0 0 0 7px rgba(213,87,75,.12);
}
.climate-status strong{
  display:block;
  font-size:22px;
  line-height:1.15;
}
.climate-status span{
  display:block;
  color:var(--ink-500);
  font-size:11px;
  margin-top:4px;
}
.climate-advice{
  display:grid;
  gap:10px;
}
.climate-advice-item{
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  background:rgba(255,255,255,.82);
}
.climate-advice-item b{display:block;font-size:12px;margin-bottom:4px}
.climate-advice-item span{display:block;font-size:10px;color:var(--ink-500);line-height:1.5}

.range-visual{
  margin:22px 0 34px;
  display:grid;
  gap:16px;
}
.range-row{
  display:grid;
  grid-template-columns:130px 1fr 100px;
  gap:14px;
  align-items:center;
}
.range-row b{font-size:12px}
.range-bar{
  height:12px;
  border-radius:999px;
  background:linear-gradient(90deg,#f2d3d0 0 24%,#dff5f6 24% 70%,#f4dfc0 70% 100%);
  position:relative;
  overflow:hidden;
}
.range-bar.temp{
  background:linear-gradient(90deg,#d9e5f4 0 38%,#dff5f6 38% 62%,#f3d5ca 62% 100%);
}
.range-mark{
  position:absolute;
  top:-4px;bottom:-4px;
  width:2px;
  background:var(--ink-950);
}
.range-row small{
  font-size:10px;
  color:var(--ink-500);
  text-align:right;
}

.season-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.season-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.season-card .season-icon{
  width:42px;height:42px;
  display:grid;place-items:center;
  border-radius:14px;
  background:var(--surface-soft);
  margin-bottom:14px;
  font-size:19px;
}
.season-card h3{font-size:21px;margin-bottom:8px}
.season-card p{font-size:13px;color:var(--ink-600);line-height:1.65;margin:0}

.climate-action-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:22px 0 34px;
}
.climate-action{
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
  background:#fff;
}
.climate-action span{
  display:grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:50%;
  background:var(--violet-050);
  color:var(--violet-700);
  font-size:11px;
  font-weight:850;
  margin-bottom:13px;
}
.climate-action h3{font-size:17px;margin-bottom:6px}
.climate-action p{font-size:12px;color:var(--ink-500);line-height:1.6;margin:0}

.brand-evidence{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.evidence-card{
  border:1px solid var(--line);
  border-radius:20px;
  padding:22px;
  background:#fff;
}
.evidence-card .brand-name{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  letter-spacing:.05em;
  text-transform:uppercase;
  margin-bottom:13px;
}
.evidence-card.magic .brand-name{background:var(--violet-050);color:var(--violet-700)}
.evidence-card.hifloat .brand-name{background:var(--aqua-050);color:var(--aqua-600)}
.evidence-card h3{font-size:19px;margin-bottom:8px}
.evidence-card p{font-size:12px;color:var(--ink-600);line-height:1.65;margin:0}

@media(max-width:900px){
  .climate-hero-grid,.climate-checker{grid-template-columns:1fr}
}
@media(max-width:700px){
  .climate-field-grid,.season-grid,.brand-evidence{grid-template-columns:1fr}
  .climate-action-grid{grid-template-columns:1fr}
  .range-row{grid-template-columns:1fr}
  .range-row small{text-align:left}
}


/* v2.0 real lifestyle imagery */
.diagram img,
.mini-media img,
.cta-art img,
.storage-hero-card img,
.storage-inline-visual img,
.storage-graph-card img,
.storage-related-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.diagram img{object-fit:cover}
.mini-media img{object-position:center}
.cta-art img{object-fit:cover;object-position:center;opacity:.98}
.hero-badge{backdrop-filter:blur(10px)}
.article-hero-card img{width:100%;height:100%;object-fit:cover;display:block}

/* storage page */
.storage-hero{
  padding:30px 0 64px;
  background:radial-gradient(circle at 85% 20%,rgba(118,88,244,.08),transparent 24%),linear-gradient(180deg,#fff,#fbfbfe);
}
.storage-hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center}
.storage-hero-card{min-height:420px;border:1px solid var(--line);border-radius:30px;background:#fff;overflow:hidden;box-shadow:var(--shadow-md)}
.storage-points{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}
.storage-point{border:1px solid var(--line);border-radius:16px;background:#fff;padding:16px}
.storage-point b{display:block;font-size:12px;margin-bottom:6px}
.storage-point span{display:block;color:var(--ink-500);font-size:11px;line-height:1.45}
.storage-rule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0 32px}
.storage-rule{border:1px solid var(--line);border-radius:20px;background:#fff;padding:22px}
.storage-rule .num{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--violet-050);color:var(--violet-600);font-size:11px;font-weight:850;margin-bottom:14px}
.storage-rule h3{font-size:18px;margin-bottom:8px}
.storage-rule p{font-size:12px;color:var(--ink-600);line-height:1.6;margin:0}
.storage-inline-visual{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:#fff;box-shadow:var(--shadow-sm);margin:22px 0 32px}
.storage-checklist{display:grid;gap:10px;margin:20px 0 32px}
.storage-check{border:1px solid var(--line);border-radius:16px;background:#fff;padding:14px 16px}
.storage-check b{display:block;font-size:12px;margin-bottom:4px}
.storage-check span{display:block;font-size:11px;color:var(--ink-500);line-height:1.55}
.storage-steps{display:grid;gap:12px;margin:22px 0 32px}
.storage-step{display:grid;grid-template-columns:46px 1fr;gap:14px;border:1px solid var(--line);border-radius:18px;background:#fff;padding:16px}
.storage-step .bubble{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--aqua-050);color:var(--aqua-600);font-weight:850;font-size:12px}
.storage-step h3{font-size:17px;margin:0 0 5px}
.storage-step p{font-size:12px;color:var(--ink-600);line-height:1.6;margin:0}
.storage-graph-card{border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden;box-shadow:var(--shadow-sm);margin:22px 0 32px}
.storage-related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.storage-related-card{text-decoration:none;color:var(--ink-950);border:1px solid var(--line);border-radius:18px;background:#fff;overflow:hidden;display:flex;flex-direction:column}
.storage-related-card img{height:180px}
.storage-related-card div{padding:16px}
.storage-related-card span{font-size:10px;color:var(--violet-600);font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.storage-related-card h3{font-size:17px;margin:6px 0}
.storage-related-card p{font-size:12px;color:var(--ink-500);margin:0}
@media(max-width:900px){
  .storage-hero-grid{grid-template-columns:1fr}
  .storage-rule-grid,.storage-points,.storage-related-grid{grid-template-columns:1fr}
}

.featured-article{color:var(--ink-950);text-decoration:none}


/* v2.1 Magic Max vs HI-FLOAT comparison */
.compare-hero{
  padding:30px 0 64px;
  background:
    radial-gradient(circle at 86% 18%,rgba(118,88,244,.08),transparent 24%),
    radial-gradient(circle at 72% 66%,rgba(40,179,187,.05),transparent 20%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.compare-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:42px;
  align-items:center;
}
.compare-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:900px;
}
.compare-stage{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  padding:22px;
  box-shadow:var(--shadow-md);
}
.compare-stage-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.compare-stage-card{
  min-height:330px;
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
  position:relative;
  background:#fafbfc;
  display:flex;
  flex-direction:column;
}
.compare-stage-card.magic{
  background:linear-gradient(145deg,#fff,#f7f4ff);
}
.compare-stage-card.hifloat{
  background:linear-gradient(145deg,#fff,#f2fbfb);
}
.compare-stage-card img{
  width:100%;
  height:230px;
  object-fit:contain;
  display:block;
  padding:18px;
}
.compare-stage-card.hifloat img{
  object-fit:cover;
  padding:0;
  opacity:.88;
}
.compare-stage-label{
  padding:16px 16px 18px;
  margin-top:auto;
}
.compare-stage-label small{
  display:block;
  color:var(--ink-500);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.07em;
  font-weight:850;
  margin-bottom:5px;
}
.compare-stage-label strong{
  display:block;
  font-size:17px;
}
.compare-stage-note{
  margin-top:12px;
  font-size:10px;
  line-height:1.5;
  color:var(--ink-400);
}

.compare-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin:24px 0 34px;
}
.compare-summary-card{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:19px;
}
.compare-summary-card b{
  display:block;
  font-size:13px;
  margin-bottom:5px;
}
.compare-summary-card span{
  display:block;
  font-size:11px;
  line-height:1.5;
  color:var(--ink-500);
}

.compare-table-wrap{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:22px;
  margin:22px 0 38px;
  background:#fff;
}
.compare-table{
  width:100%;
  border-collapse:collapse;
  min-width:780px;
}
.compare-table th,
.compare-table td{
  padding:16px 17px;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--line);
  font-size:12px;
  line-height:1.55;
}
.compare-table th{
  background:#fafbfc;
  color:var(--ink-500);
  font-weight:850;
}
.compare-table th:first-child,
.compare-table td:first-child{
  width:180px;
  color:var(--ink-950);
  font-weight:780;
}
.compare-table th.magic,
.compare-table td.magic{
  background:rgba(118,88,244,.025);
}
.compare-table th.hifloat,
.compare-table td.hifloat{
  background:rgba(40,179,187,.025);
}
.compare-table tr:last-child td{border-bottom:0}

.brand-compare-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.brand-compare-card{
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  padding:24px;
}
.brand-compare-card.magic{
  border-color:#ded8fb;
  background:linear-gradient(145deg,#fff,#faf8ff);
}
.brand-compare-card.hifloat{
  border-color:#d5eeee;
  background:linear-gradient(145deg,#fff,#f7fcfc);
}
.brand-compare-card .compare-brand-pill{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.07em;
  margin-bottom:14px;
}
.brand-compare-card.magic .compare-brand-pill{
  background:var(--violet-050);
  color:var(--violet-700);
}
.brand-compare-card.hifloat .compare-brand-pill{
  background:var(--aqua-050);
  color:var(--aqua-600);
}
.brand-compare-card h3{font-size:24px;margin-bottom:10px}
.brand-compare-card p{
  color:var(--ink-600);
  font-size:13px;
  line-height:1.65;
}
.brand-compare-card ul{
  padding-left:19px;
  color:var(--ink-600);
}
.brand-compare-card li{
  margin:8px 0;
  font-size:12px;
  line-height:1.55;
}

.verdict-box{
  border:1px solid #dedaf8;
  border-radius:24px;
  background:
    radial-gradient(circle at 85% 22%,rgba(118,88,244,.10),transparent 22%),
    linear-gradient(145deg,#fff,#faf9ff);
  padding:26px;
  margin:24px 0 36px;
}
.verdict-box h3{
  font-size:27px;
  margin-bottom:10px;
}
.verdict-box p{
  font-size:13px;
  color:var(--ink-600);
  line-height:1.65;
}
.verdict-points{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:18px;
}
.verdict-point{
  border:1px solid var(--line);
  border-radius:15px;
  background:rgba(255,255,255,.88);
  padding:15px;
}
.verdict-point b{
  display:block;
  font-size:12px;
  margin-bottom:4px;
}
.verdict-point span{
  display:block;
  font-size:10px;
  line-height:1.5;
  color:var(--ink-500);
}

.source-box{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
  margin:24px 0 34px;
}
.source-box strong{
  display:block;
  font-size:14px;
  margin-bottom:12px;
}
.source-links{
  display:grid;
  gap:8px;
}
.source-links a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  text-decoration:none;
  color:var(--ink-600);
  border:1px solid var(--line);
  border-radius:13px;
  padding:12px 14px;
  font-size:11px;
  background:#fafbfc;
}
.source-links a:hover{
  color:var(--violet-600);
  border-color:#d8d3fb;
}

.compare-cta{
  border-radius:28px;
  overflow:hidden;
  margin-top:46px;
  background:
    radial-gradient(circle at 82% 32%,rgba(118,88,244,.30),transparent 24%),
    linear-gradient(125deg,#141a2b,#282052);
  color:#fff;
  display:grid;
  grid-template-columns:1fr 260px;
  align-items:center;
  gap:20px;
  padding:34px;
}
.compare-cta h2{
  color:#fff;
  font-size:31px;
  margin-bottom:10px;
}
.compare-cta p{
  color:#c0c6d3;
  font-size:13px;
  max-width:620px;
}
.compare-cta img{
  width:100%;
  height:220px;
  object-fit:contain;
  filter:drop-shadow(0 18px 28px rgba(0,0,0,.2));
}

@media(max-width:900px){
  .compare-hero-grid{grid-template-columns:1fr}
  .compare-summary{grid-template-columns:1fr}
}
@media(max-width:720px){
  .compare-stage-grid,
  .brand-compare-grid,
  .verdict-points,
  .compare-cta{grid-template-columns:1fr}
  .compare-stage-card{min-height:280px}
  .compare-stage-card img{height:190px}
  .compare-cta img{height:180px}
}


/* v2.2 12-inch dosage page */
.inch12-hero{
  padding:30px 0 64px;
  background:
    radial-gradient(circle at 85% 18%,rgba(118,88,244,.08),transparent 24%),
    radial-gradient(circle at 73% 62%,rgba(40,179,187,.05),transparent 20%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.inch12-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:42px;
  align-items:center;
}
.inch12-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:900px;
}
.inch12-visual{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  overflow:hidden;
  box-shadow:var(--shadow-md);
}
.inch12-visual img{
  width:100%;
  height:430px;
  object-fit:cover;
  display:block;
}
.dose-highlight{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:24px 0 34px;
}
.dose-highlight-card{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:20px;
}
.dose-highlight-card.primary{
  border-color:#dcd7fb;
  background:linear-gradient(145deg,#fff,#faf8ff);
}
.dose-highlight-card b{
  display:block;
  font-size:30px;
  line-height:1;
  color:var(--violet-700);
  margin-bottom:8px;
}
.dose-highlight-card span{
  display:block;
  color:var(--ink-500);
  font-size:11px;
  line-height:1.5;
}
.inch12-calc{
  display:grid;
  grid-template-columns:.84fr 1.16fr;
  gap:22px;
  margin:22px 0 36px;
}
.inch12-calc-panel,
.inch12-result{
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  padding:26px;
  box-shadow:var(--shadow-sm);
}
.inch12-calc-panel h3,
.inch12-result h3{
  font-size:26px;
  margin-bottom:8px;
}
.inch12-input{
  display:flex;
  align-items:center;
  border:1px solid var(--line-strong);
  border-radius:14px;
  overflow:hidden;
  margin-top:18px;
}
.inch12-input input{
  width:100%;
  border:0;
  outline:0;
  padding:15px 16px;
  font-size:20px;
  font-weight:800;
  color:var(--ink-950);
}
.inch12-input span{
  padding:0 15px;
  border-left:1px solid var(--line);
  color:var(--ink-500);
  font-size:11px;
}
.inch12-presets{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:11px;
}
.inch12-presets button{
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink-600);
  border-radius:999px;
  padding:8px 11px;
  font-size:10px;
  font-weight:750;
  cursor:pointer;
}
.inch12-presets button:hover{
  background:var(--violet-050);
  border-color:#cbc5f7;
}
.inch12-result{
  background:
    radial-gradient(circle at 80% 20%,rgba(118,88,244,.11),transparent 25%),
    linear-gradient(145deg,#fff,#faf9ff);
}
.inch12-result-main{
  display:grid;
  grid-template-columns:1fr 160px;
  gap:18px;
  align-items:center;
}
.inch12-pack{
  display:block;
  font-size:42px;
  font-weight:850;
  line-height:1;
  letter-spacing:-.045em;
  color:var(--violet-700);
  margin:8px 0 10px;
}
.inch12-result p{
  color:var(--ink-600);
  font-size:13px;
  line-height:1.6;
}
.inch12-result img{
  width:100%;
  height:190px;
  object-fit:contain;
  filter:drop-shadow(0 18px 28px rgba(31,34,49,.12));
}
.inch12-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:18px;
}
.inch12-stat{
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.85);
  padding:13px;
}
.inch12-stat b{
  display:block;
  font-size:15px;
  margin-bottom:3px;
}
.inch12-stat span{
  display:block;
  color:var(--ink-500);
  font-size:9px;
  line-height:1.4;
}
.pea-demo{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.pea-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.pea-card h3{
  font-size:20px;
  margin-bottom:8px;
}
.pea-card p{
  font-size:12px;
  line-height:1.6;
  color:var(--ink-600);
}
.pea-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:18px;
}
.pea{
  width:18px;
  height:18px;
  border-radius:50%;
  background:linear-gradient(145deg,#a895ff,#6650df);
  box-shadow:0 3px 7px rgba(71,53,160,.18);
}
.pea.x2{
  margin-left:-4px;
}
.inch12-step-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:22px 0 34px;
}
.inch12-step{
  border:1px solid var(--line);
  border-radius:19px;
  background:#fff;
  overflow:hidden;
}
.inch12-step img{
  width:100%;
  height:190px;
  object-fit:cover;
  display:block;
}
.inch12-step div{
  padding:17px;
}
.inch12-step small{
  color:var(--violet-600);
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.inch12-step h3{
  font-size:17px;
  margin:6px 0;
}
.inch12-step p{
  font-size:11px;
  line-height:1.55;
  color:var(--ink-500);
  margin:0;
}
.overdose-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.overdose-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.overdose-card.too-little{
  border-color:#d5eeee;
}
.overdose-card.too-much{
  border-color:#eed9d5;
}
.overdose-card .label{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:12px;
}
.overdose-card.too-little .label{
  background:var(--aqua-050);
  color:var(--aqua-600);
}
.overdose-card.too-much .label{
  background:#fff2f0;
  color:#c44b42;
}
.overdose-card h3{
  font-size:20px;
  margin-bottom:8px;
}
.overdose-card p{
  color:var(--ink-600);
  font-size:12px;
  line-height:1.6;
}
.inch12-example-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:22px 0 34px;
}
.inch12-example{
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  padding:18px;
}
.inch12-example b{
  display:block;
  font-size:22px;
  margin-bottom:5px;
}
.inch12-example strong{
  display:block;
  color:var(--violet-700);
  font-size:13px;
  margin-bottom:5px;
}
.inch12-example span{
  display:block;
  font-size:10px;
  line-height:1.5;
  color:var(--ink-500);
}
@media(max-width:900px){
  .inch12-hero-grid,
  .inch12-calc{grid-template-columns:1fr}
  .inch12-step-grid{grid-template-columns:1fr 1fr}
  .inch12-example-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .dose-highlight,
  .pea-demo,
  .overdose-grid,
  .inch12-step-grid,
  .inch12-example-grid{grid-template-columns:1fr}
  .inch12-result-main{grid-template-columns:1fr}
  .inch12-result img{height:160px}
  .inch12-stats{grid-template-columns:1fr}
  .inch12-visual img{height:330px}
}


/* v2.3 which balloons float longer */
.longfloat-hero{
  padding:30px 0 64px;
  background:
    radial-gradient(circle at 84% 16%,rgba(118,88,244,.08),transparent 24%),
    radial-gradient(circle at 72% 62%,rgba(40,179,187,.05),transparent 20%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.longfloat-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:42px;
  align-items:center;
}
.longfloat-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:900px;
}
.longfloat-visual{
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-md);
  min-height:430px;
}
.longfloat-visual img{
  width:100%;
  height:430px;
  object-fit:cover;
  display:block;
}
.best-choice{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:24px 0 36px;
}
.best-card{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:19px;
}
.best-card .icon{
  width:38px;
  height:38px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:var(--violet-050);
  color:var(--violet-700);
  margin-bottom:13px;
  font-size:16px;
  font-weight:850;
}
.best-card h3{
  font-size:17px;
  margin-bottom:7px;
}
.best-card p{
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
  margin:0;
}
.float-size-table-wrap{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  margin:22px 0 36px;
}
.float-size-table{
  width:100%;
  border-collapse:collapse;
  min-width:760px;
}
.float-size-table th,
.float-size-table td{
  padding:15px 16px;
  border-bottom:1px solid var(--line);
  text-align:left;
  vertical-align:top;
  font-size:12px;
  line-height:1.55;
}
.float-size-table th{
  background:#fafbfc;
  color:var(--ink-500);
  font-weight:850;
}
.float-size-table td:first-child{
  font-weight:800;
  color:var(--ink-950);
}
.float-size-table tr:last-child td{border-bottom:0}
.float-size-table .accent{
  color:var(--violet-700);
  font-weight:800;
}
.color-type-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.color-type-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.color-type-card.standard{
  border-color:#dad5fb;
  background:linear-gradient(145deg,#fff,#faf8ff);
}
.color-type-card.pearl{
  border-color:#d9e9eb;
  background:linear-gradient(145deg,#fff,#f8fcfc);
}
.color-type-card .pill{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:12px;
}
.color-type-card.standard .pill{
  background:var(--violet-050);
  color:var(--violet-700);
}
.color-type-card.pearl .pill{
  background:var(--aqua-050);
  color:var(--aqua-600);
}
.color-type-card h3{
  font-size:22px;
  margin-bottom:8px;
}
.color-type-card p{
  color:var(--ink-600);
  font-size:12px;
  line-height:1.65;
}
.shape-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:22px 0 34px;
}
.shape-card{
  border:1px solid var(--line);
  border-radius:19px;
  background:#fff;
  padding:20px;
}
.shape-card .shape-mark{
  width:40px;
  height:40px;
  border-radius:14px;
  background:var(--surface-soft);
  display:grid;
  place-items:center;
  margin-bottom:13px;
  font-size:17px;
}
.shape-card h3{
  font-size:17px;
  margin-bottom:6px;
}
.shape-card p{
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
  margin:0;
}
.choose-checklist{
  display:grid;
  gap:10px;
  margin:22px 0 34px;
}
.choose-row{
  display:grid;
  grid-template-columns:36px 1fr;
  gap:13px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  padding:15px;
}
.choose-row span{
  width:36px;height:36px;
  border-radius:50%;
  display:grid;place-items:center;
  background:var(--aqua-050);
  color:var(--aqua-600);
  font-size:11px;
  font-weight:850;
}
.choose-row h3{
  font-size:16px;
  margin:0 0 5px;
}
.choose-row p{
  margin:0;
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
}
.longfloat-verdict{
  border:1px solid #ddd8fb;
  border-radius:24px;
  background:
    radial-gradient(circle at 85% 22%,rgba(118,88,244,.10),transparent 24%),
    linear-gradient(145deg,#fff,#faf9ff);
  padding:26px;
  margin:24px 0 36px;
}
.longfloat-verdict h3{
  font-size:27px;
  margin-bottom:10px;
}
.longfloat-verdict p{
  color:var(--ink-600);
  font-size:13px;
  line-height:1.65;
}
.longfloat-verdict ul{
  padding-left:19px;
  color:var(--ink-600);
}
.longfloat-verdict li{
  margin:8px 0;
  font-size:12px;
  line-height:1.55;
}
.longfloat-visual-note{
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  margin:22px 0 34px;
  background:#fff;
}
.longfloat-visual-note img{
  width:100%;
  height:340px;
  object-fit:cover;
  display:block;
}
.longfloat-visual-note figcaption{
  padding:12px 15px;
  font-size:10px;
  color:var(--ink-500);
}
@media(max-width:980px){
  .best-choice{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .longfloat-hero-grid{grid-template-columns:1fr}
  .shape-grid{grid-template-columns:1fr}
}
@media(max-width:650px){
  .best-choice,
  .color-type-grid{grid-template-columns:1fr}
  .longfloat-visual img{height:330px}
}


/* v2.4 seasonal balloon-treatment page */
.season-hero{
  padding:30px 0 64px;
  background:
    radial-gradient(circle at 83% 17%,rgba(118,88,244,.08),transparent 24%),
    radial-gradient(circle at 72% 62%,rgba(40,179,187,.05),transparent 20%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.season-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:42px;
  align-items:center;
}
.season-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:920px;
}
.season-visual{
  border:1px solid var(--line);
  border-radius:30px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-md);
  min-height:430px;
  position:relative;
}
.season-visual img{
  width:100%;
  height:430px;
  object-fit:cover;
  display:block;
}
.season-visual-label{
  position:absolute;
  left:20px;right:20px;bottom:20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.season-visual-label div{
  border:1px solid rgba(255,255,255,.38);
  border-radius:15px;
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(10px);
  padding:12px 14px;
}
.season-visual-label b{
  display:block;
  font-size:12px;
  margin-bottom:4px;
}
.season-visual-label span{
  display:block;
  color:var(--ink-500);
  font-size:10px;
  line-height:1.45;
}

.season-compare{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:24px 0 36px;
}
.season-panel{
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  padding:24px;
}
.season-panel.summer{
  border-color:#efdcc7;
  background:linear-gradient(145deg,#fff,#fffaf4);
}
.season-panel.winter{
  border-color:#d7e5f3;
  background:linear-gradient(145deg,#fff,#f7fbff);
}
.season-panel .season-pill{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:13px;
}
.season-panel.summer .season-pill{
  background:#fff0dc;
  color:#9a641c;
}
.season-panel.winter .season-pill{
  background:#eaf4fd;
  color:#3d6f9f;
}
.season-panel h3{
  font-size:25px;
  margin-bottom:10px;
}
.season-panel p{
  color:var(--ink-600);
  font-size:13px;
  line-height:1.65;
}
.season-panel ul{
  padding-left:19px;
  color:var(--ink-600);
}
.season-panel li{
  margin:8px 0;
  font-size:12px;
  line-height:1.55;
}

.season-factor-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:22px 0 36px;
}
.season-factor{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:19px;
}
.season-factor .factor-icon{
  width:38px;height:38px;
  border-radius:13px;
  display:grid;place-items:center;
  background:var(--surface-soft);
  margin-bottom:13px;
  font-size:17px;
}
.season-factor h3{
  font-size:16px;
  margin-bottom:6px;
}
.season-factor p{
  margin:0;
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
}

.season-ratio{
  border:1px solid #ded9fb;
  border-radius:24px;
  background:
    radial-gradient(circle at 85% 25%,rgba(118,88,244,.10),transparent 24%),
    linear-gradient(145deg,#fff,#faf9ff);
  padding:26px;
  margin:24px 0 36px;
}
.season-ratio strong{
  display:block;
  font-size:31px;
  line-height:1.1;
  color:var(--violet-700);
  margin-bottom:10px;
}
.season-ratio p{
  margin:0;
  color:var(--ink-600);
  font-size:13px;
  line-height:1.65;
}
.season-ratio .ratio-note{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid #e3e0f7;
  color:var(--ink-400);
  font-size:10px;
}

.season-action-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:22px 0 34px;
}
.season-action{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:20px;
}
.season-action span{
  display:grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:50%;
  background:var(--violet-050);
  color:var(--violet-700);
  font-size:11px;
  font-weight:850;
  margin-bottom:13px;
}
.season-action h3{
  font-size:17px;
  margin-bottom:6px;
}
.season-action p{
  margin:0;
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
}

.transport-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin:22px 0 34px;
}
.transport-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.transport-card.bad{
  border-color:#efd6d1;
  background:linear-gradient(145deg,#fff,#fff8f6);
}
.transport-card.good{
  border-color:#d4ebec;
  background:linear-gradient(145deg,#fff,#f8fcfc);
}
.transport-card .transport-pill{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  font-size:9px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
  margin-bottom:12px;
}
.transport-card.bad .transport-pill{
  background:#fff0ed;color:#c24f45;
}
.transport-card.good .transport-pill{
  background:var(--aqua-050);color:var(--aqua-600);
}
.transport-card h3{
  font-size:21px;
  margin-bottom:8px;
}
.transport-card p{
  color:var(--ink-600);
  font-size:12px;
  line-height:1.65;
}

.season-timeline{
  position:relative;
  display:grid;
  gap:12px;
  margin:22px 0 34px;
}
.season-timeline::before{
  content:"";
  position:absolute;
  left:22px;
  top:16px;
  bottom:16px;
  width:1px;
  background:linear-gradient(var(--aqua-500),var(--violet-500));
}
.season-timeline-item{
  display:grid;
  grid-template-columns:46px 1fr;
  gap:14px;
  position:relative;
}
.season-timeline-num{
  width:46px;height:46px;
  border-radius:50%;
  display:grid;place-items:center;
  background:#fff;
  border:1px solid var(--line);
  color:var(--violet-700);
  font-size:11px;
  font-weight:850;
  z-index:1;
}
.season-timeline-copy{
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
  padding:15px 17px;
}
.season-timeline-copy h3{
  font-size:16px;
  margin:0 0 5px;
}
.season-timeline-copy p{
  margin:0;
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
}

.season-photo{
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-sm);
  margin:22px 0 34px;
}
.season-photo img{
  width:100%;
  height:350px;
  object-fit:cover;
  display:block;
}
.season-photo figcaption{
  padding:12px 15px;
  font-size:10px;
  color:var(--ink-500);
}

@media(max-width:1000px){
  .season-factor-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .season-hero-grid{grid-template-columns:1fr}
  .season-action-grid{grid-template-columns:1fr}
}
@media(max-width:680px){
  .season-compare,
  .transport-grid,
  .season-factor-grid,
  .season-visual-label{grid-template-columns:1fr}
  .season-visual img{height:330px}
}


/* v2.5 commercial gel category */
.catalog-hero{
  padding:30px 0 64px;
  background:
    radial-gradient(circle at 86% 18%,rgba(118,88,244,.085),transparent 24%),
    radial-gradient(circle at 73% 64%,rgba(40,179,187,.05),transparent 20%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.catalog-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:42px;
  align-items:center;
}
.catalog-hero h1{
  font-size:clamp(44px,5vw,70px);
  max-width:900px;
}
.catalog-visual{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  box-shadow:var(--shadow-md);
  padding:22px;
}
.catalog-visual-main{
  height:360px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(145deg,#fff,#f7f5ff);
  overflow:hidden;
}
.catalog-visual-main img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:18px;
}
.catalog-visual-row{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
  margin-top:12px;
}
.catalog-visual-row div{
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:7px;
  text-align:center;
}
.catalog-visual-row img{
  width:100%;
  height:64px;
  object-fit:contain;
}
.catalog-visual-row span{
  display:block;
  margin-top:4px;
  color:var(--ink-500);
  font-size:8px;
  font-weight:750;
}
.catalog-hero-points{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:22px;
}
.catalog-hero-points span{
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  padding:8px 11px;
  color:var(--ink-600);
  font-size:10px;
  font-weight:750;
}

.catalog-current{
  border:1px solid var(--line);
  border-radius:30px;
  background:#fff;
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.catalog-current-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  align-items:stretch;
}
.catalog-current-media{
  background:
    radial-gradient(circle at 50% 45%,rgba(118,88,244,.10),transparent 35%),
    linear-gradient(145deg,#fff,#f7f6ff);
  min-height:520px;
  padding:26px;
  display:grid;
  grid-template-rows:1fr auto;
  gap:16px;
}
.catalog-current-media > img{
  width:100%;
  height:100%;
  max-height:390px;
  object-fit:contain;
}
.catalog-pack-strip{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
}
.catalog-pack-strip a{
  text-decoration:none;
  color:var(--ink-950);
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  padding:8px 5px;
  text-align:center;
  font-size:8px;
  font-weight:800;
}
.catalog-pack-strip a:hover{
  border-color:#cfc8fb;
  background:var(--violet-050);
}
.catalog-current-copy{
  padding:34px;
}
.catalog-current-copy h2{
  font-size:38px;
  margin-bottom:12px;
}
.catalog-product-lead{
  font-size:16px;
  line-height:1.65;
  color:var(--ink-600);
  max-width:680px;
}
.catalog-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:24px 0;
}
.catalog-fact{
  border:1px solid var(--line);
  border-radius:15px;
  background:#fbfcfe;
  padding:14px;
}
.catalog-fact b{
  display:block;
  font-size:12px;
  margin-bottom:4px;
}
.catalog-fact span{
  display:block;
  color:var(--ink-500);
  font-size:10px;
  line-height:1.45;
}
.catalog-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}

.catalog-packs{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:24px;
}
.catalog-pack{
  text-decoration:none;
  color:var(--ink-950);
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  overflow:hidden;
  transition:.18s ease;
}
.catalog-pack:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-sm);
}
.catalog-pack-media{
  height:210px;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg,#fff,#f8f8fb);
  padding:14px;
}
.catalog-pack-media img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.catalog-pack-copy{
  padding:18px;
}
.catalog-pack-copy b{
  display:block;
  font-size:20px;
  margin-bottom:5px;
}
.catalog-pack-copy span{
  display:block;
  color:var(--ink-500);
  font-size:10px;
  line-height:1.45;
}
.catalog-pack-copy strong{
  display:block;
  margin-top:10px;
  color:var(--violet-700);
  font-size:10px;
}

.buying-guide-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
  margin:24px 0 36px;
}
.buying-guide-card{
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  padding:19px;
}
.buying-guide-card .num{
  display:grid;
  place-items:center;
  width:34px;height:34px;
  border-radius:50%;
  background:var(--violet-050);
  color:var(--violet-700);
  font-size:10px;
  font-weight:850;
  margin-bottom:12px;
}
.buying-guide-card h3{
  font-size:16px;
  margin-bottom:6px;
}
.buying-guide-card p{
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
  margin:0;
}

.catalog-seo-table-wrap{
  overflow:auto;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  margin:22px 0 34px;
}
.catalog-seo-table{
  width:100%;
  min-width:720px;
  border-collapse:collapse;
}
.catalog-seo-table th,
.catalog-seo-table td{
  padding:14px 15px;
  text-align:left;
  border-bottom:1px solid var(--line);
  vertical-align:top;
  font-size:12px;
  line-height:1.5;
}
.catalog-seo-table th{
  background:#fafbfc;
  color:var(--ink-500);
  font-weight:850;
}
.catalog-seo-table td:first-child{
  font-weight:800;
  color:var(--ink-950);
}
.catalog-seo-table tr:last-child td{border-bottom:0}

.catalog-link-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:24px;
}
.catalog-link-card{
  text-decoration:none;
  color:var(--ink-950);
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  overflow:hidden;
}
.catalog-link-card img{
  width:100%;
  height:150px;
  object-fit:cover;
  display:block;
}
.catalog-link-card div{
  padding:15px;
}
.catalog-link-card span{
  color:var(--aqua-600);
  font-size:8px;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.catalog-link-card h3{
  font-size:16px;
  margin:6px 0 5px;
}
.catalog-link-card p{
  color:var(--ink-500);
  font-size:10px;
  line-height:1.45;
  margin:0;
}

.catalog-future{
  border:1px dashed #ccc6f3;
  border-radius:20px;
  background:linear-gradient(145deg,#fff,#fbfaff);
  padding:22px;
  margin-top:18px;
}
.catalog-future strong{
  display:block;
  font-size:14px;
  margin-bottom:6px;
}
.catalog-future p{
  margin:0;
  color:var(--ink-500);
  font-size:11px;
  line-height:1.55;
}

@media(max-width:1050px){
  .buying-guide-grid,
  .catalog-link-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .catalog-hero-grid,
  .catalog-current-grid{grid-template-columns:1fr}
  .catalog-visual-row,
  .catalog-pack-strip{grid-template-columns:repeat(3,1fr)}
  .catalog-packs{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .catalog-facts,
  .buying-guide-grid,
  .catalog-link-grid,
  .catalog-packs{grid-template-columns:1fr}
  .catalog-visual-row,
  .catalog-pack-strip{grid-template-columns:repeat(2,1fr)}
  .catalog-current-copy{padding:24px}
  .catalog-current-copy h2{font-size:31px}
}


/* v2.6 commerce-ready storefront */
.buy-panel{
  margin-top:24px;
  border:1px solid #dcd7fb;
  border-radius:24px;
  background:
    radial-gradient(circle at 88% 18%,rgba(118,88,244,.10),transparent 24%),
    linear-gradient(145deg,#fff,#faf9ff);
  padding:22px;
}
.buy-panel-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:15px;
}
.buy-panel-head strong{
  display:block;
  font-size:17px;
}
.buy-panel-head span{
  display:block;
  color:var(--ink-500);
  font-size:10px;
  margin-top:3px;
}
.store-variants{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:8px;
}
.store-variant{
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  padding:10px 6px;
  cursor:pointer;
  text-align:center;
  transition:.15s ease;
}
.store-variant:hover{
  border-color:#cfc8fb;
  background:var(--violet-050);
}
.store-variant.is-selected{
  border-color:var(--violet-500);
  background:var(--violet-050);
  box-shadow:0 0 0 2px rgba(118,88,244,.08);
}
.store-variant img{
  width:100%;
  height:62px;
  object-fit:contain;
  display:block;
}
.store-variant b{
  display:block;
  font-size:10px;
  margin-top:5px;
}
.store-variant span{
  display:block;
  font-size:8px;
  color:var(--ink-500);
  margin-top:2px;
}
.buy-price-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-top:1px solid var(--line);
  margin-top:16px;
  padding-top:17px;
}
.buy-price-block{
  display:flex;
  align-items:baseline;
  gap:9px;
  flex-wrap:wrap;
}
.buy-price{
  font-size:28px;
  font-weight:850;
  letter-spacing:-.035em;
}
.buy-old-price{
  color:var(--ink-400);
  text-decoration:line-through;
  font-size:13px;
}
.store-stock{
  display:inline-flex;
  align-items:center;
  gap:7px;
  border-radius:999px;
  padding:7px 10px;
  background:#f2f4f7;
  color:var(--ink-500);
  font-size:9px;
  font-weight:800;
}
.store-stock::before{
  content:"";
  width:7px;height:7px;
  border-radius:50%;
  background:#a6adba;
}
.store-stock[data-stock-state="in_stock"]{
  background:#eff9f5;
  color:#39805f;
}
.store-stock[data-stock-state="in_stock"]::before{background:#45a877}
.store-stock[data-stock-state="preorder"]{
  background:#fff8e9;
  color:#9a691c;
}
.store-stock[data-stock-state="preorder"]::before{background:#d9a33d}
.store-stock[data-stock-state="out_of_stock"]{
  background:#fff1ef;
  color:#bf4b42;
}
.store-stock[data-stock-state="out_of_stock"]::before{background:#d85a50}
.buy-order-row{
  display:grid;
  grid-template-columns:116px 1fr;
  gap:10px;
  margin-top:14px;
}
.qty-control{
  display:grid;
  grid-template-columns:34px 1fr 34px;
  align-items:center;
  border:1px solid var(--line-strong);
  border-radius:13px;
  overflow:hidden;
  background:#fff;
}
.qty-control button{
  border:0;
  background:#fff;
  cursor:pointer;
  height:44px;
  font-size:16px;
}
.qty-control button:hover{background:#f6f6fa}
.qty-control input{
  width:100%;
  border:0;
  outline:0;
  text-align:center;
  font-size:13px;
  font-weight:800;
  -moz-appearance:textfield;
}
.qty-control input::-webkit-inner-spin-button,
.qty-control input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.store-order-btn{
  border:0;
  border-radius:13px;
  min-height:44px;
  padding:0 18px;
  background:var(--violet-600);
  color:#fff;
  font-weight:800;
  cursor:pointer;
}
.store-order-btn:hover:not(:disabled){background:var(--violet-700)}
.store-order-btn:disabled,
.store-order-btn.is-disabled{
  cursor:not-allowed;
  background:#dedfe6;
  color:#898f9b;
}
.buy-note{
  margin:10px 0 0;
  color:var(--ink-400);
  font-size:9px;
  line-height:1.5;
}
.buy-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.buy-links a{
  color:var(--violet-600);
  font-size:10px;
  font-weight:750;
  text-decoration:none;
}
.pack-card{
  transition:.18s ease;
}
.pack-card.is-selected{
  border-color:var(--violet-500);
  box-shadow:0 0 0 3px rgba(118,88,244,.08),var(--shadow-sm);
}
.pack-card-footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.pack-card-price{
  display:block;
  font-size:13px;
  font-weight:800;
}
.pack-select-btn{
  border:1px solid var(--line);
  border-radius:10px;
  background:#fff;
  padding:8px 11px;
  color:var(--violet-600);
  font-size:9px;
  font-weight:800;
  cursor:pointer;
}
.pack-select-btn:hover{
  background:var(--violet-050);
  border-color:#cbc5f7;
}
.mobile-buy-bar{
  display:none;
}
.catalog-commerce-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-top:1px solid var(--line);
  margin-top:13px;
  padding-top:12px;
}
.catalog-commerce-meta b{
  font-size:12px;
}
.catalog-commerce-meta span{
  color:var(--ink-500);
  font-size:9px;
}

/* Delivery/payment staging page */
.delivery-hero{
  padding:30px 0 62px;
  background:
    radial-gradient(circle at 84% 17%,rgba(118,88,244,.08),transparent 24%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.delivery-hero h1{
  font-size:clamp(42px,5vw,66px);
  max-width:850px;
}
.delivery-status{
  margin-top:24px;
  border:1px solid #dedaf8;
  border-radius:18px;
  background:var(--violet-050);
  padding:18px 20px;
}
.delivery-status strong{
  display:block;
  font-size:14px;
  margin-bottom:5px;
}
.delivery-status p{
  margin:0;
  color:var(--ink-600);
  font-size:12px;
  line-height:1.6;
}
.delivery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin:24px 0 38px;
}
.delivery-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.delivery-card .num{
  display:grid;
  place-items:center;
  width:36px;height:36px;
  border-radius:50%;
  background:var(--aqua-050);
  color:var(--aqua-600);
  font-size:10px;
  font-weight:850;
  margin-bottom:13px;
}
.delivery-card h2,
.delivery-card h3{
  font-size:19px;
  margin-bottom:8px;
}
.delivery-card p{
  color:var(--ink-500);
  font-size:11px;
  line-height:1.6;
}
.delivery-required{
  border:1px dashed #cfc9f0;
  border-radius:20px;
  background:#fbfaff;
  padding:22px;
  margin:24px 0 36px;
}
.delivery-required strong{
  display:block;
  font-size:14px;
  margin-bottom:8px;
}
.delivery-required ul{
  margin:0;
  padding-left:18px;
}
.delivery-required li{
  color:var(--ink-600);
  font-size:11px;
  line-height:1.6;
  margin:5px 0;
}
@media(max-width:900px){
  .store-variants{grid-template-columns:repeat(3,1fr)}
  .delivery-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .buy-price-row{align-items:flex-start;flex-direction:column}
  .buy-order-row{grid-template-columns:1fr}
  .store-variants{grid-template-columns:repeat(2,1fr)}
  .mobile-buy-bar{
    display:flex;
    position:fixed;
    left:10px;right:10px;bottom:10px;
    z-index:50;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    border:1px solid rgba(255,255,255,.22);
    border-radius:16px;
    padding:10px 11px;
    background:rgba(20,24,38,.94);
    box-shadow:0 18px 45px rgba(0,0,0,.26);
    backdrop-filter:blur(14px);
    color:#fff;
  }
  .mobile-buy-bar small{
    display:block;
    color:#aaaec0;
    font-size:8px;
  }
  .mobile-buy-bar strong{
    display:block;
    font-size:12px;
    margin-top:2px;
  }
  .mobile-buy-bar button{
    border:0;
    border-radius:11px;
    background:var(--violet-600);
    color:#fff;
    padding:10px 12px;
    font-size:10px;
    font-weight:800;
  }
  body{padding-bottom:76px}
}


/* v2.7 contacts & launch polish */
.header-contact{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:1px;
  text-decoration:none;
  color:var(--ink-950);
  margin-right:4px;
}
.header-contact strong{
  font-size:11px;
  line-height:1.2;
}
.header-contact span{
  color:var(--ink-400);
  font-size:8px;
}
.footer-contact-list{
  display:grid;
  gap:9px;
}
.footer-contact-list a{
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--ink-600);
  text-decoration:none;
  font-size:12px;
}
.footer-contact-list a:hover{color:var(--violet-600)}
.footer-contact-list i{
  width:29px;height:29px;
  display:grid;place-items:center;
  border:1px solid var(--line);
  border-radius:10px;
  font-style:normal;
  background:#fafbfc;
  font-size:11px;
}
.contact-hero{
  padding:30px 0 62px;
  background:
    radial-gradient(circle at 84% 18%,rgba(118,88,244,.08),transparent 24%),
    radial-gradient(circle at 72% 65%,rgba(40,179,187,.05),transparent 20%),
    linear-gradient(180deg,#fff,#fbfbfe);
}
.contact-hero-grid{
  display:grid;
  grid-template-columns:1.02fr .98fr;
  gap:42px;
  align-items:center;
}
.contact-hero h1{
  font-size:clamp(44px,5vw,68px);
  max-width:800px;
}
.contact-card{
  border:1px solid var(--line);
  border-radius:28px;
  background:#fff;
  box-shadow:var(--shadow-md);
  padding:28px;
}
.contact-card .eyebrow{margin-bottom:14px}
.contact-method{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:14px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:17px;
  padding:15px;
  text-decoration:none;
  color:var(--ink-950);
  background:#fff;
  margin-top:10px;
  transition:.16s ease;
}
.contact-method:hover{
  border-color:#cec8f7;
  background:var(--violet-050);
}
.contact-method .icon{
  width:48px;height:48px;
  border-radius:15px;
  display:grid;place-items:center;
  background:var(--surface-soft);
  font-size:19px;
}
.contact-method small{
  display:block;
  color:var(--ink-400);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:800;
  margin-bottom:4px;
}
.contact-method strong{
  display:block;
  font-size:17px;
}
.contact-note{
  margin-top:16px;
  padding:14px 15px;
  border-radius:14px;
  background:var(--aqua-050);
  color:var(--ink-600);
  font-size:11px;
  line-height:1.55;
}
.contact-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin:24px 0 36px;
}
.contact-info-card{
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  padding:22px;
}
.contact-info-card span{
  display:grid;
  place-items:center;
  width:36px;height:36px;
  border-radius:50%;
  background:var(--violet-050);
  color:var(--violet-700);
  font-size:10px;
  font-weight:850;
  margin-bottom:13px;
}
.contact-info-card h2,
.contact-info-card h3{
  font-size:18px;
  margin-bottom:7px;
}
.contact-info-card p{
  color:var(--ink-500);
  font-size:11px;
  line-height:1.6;
  margin:0;
}
.contact-cta{
  border:1px solid #ddd8fb;
  border-radius:24px;
  background:
    radial-gradient(circle at 84% 22%,rgba(118,88,244,.10),transparent 23%),
    linear-gradient(145deg,#fff,#faf9ff);
  padding:26px;
  margin:24px 0 36px;
}
.contact-cta h2{
  font-size:29px;
  margin-bottom:10px;
}
.contact-cta p{
  color:var(--ink-600);
  font-size:13px;
  line-height:1.6;
}
.contact-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
@media(max-width:900px){
  .header-contact{display:none}
  .contact-hero-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
}

/* v3.0 homepage redesign */
.home-page{
  background:#fff;
}
.home-page .section{
  padding:96px 0;
}
.home-header{
  border-bottom:1px solid rgba(227,231,241,.9);
  backdrop-filter:saturate(160%) blur(16px);
}
.home-main-nav{
  gap:22px;
}
.home-main-nav a{
  font-size:14px;
  font-weight:700;
}
.home-header-actions{
  gap:14px;
}
.home-header-contact{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  text-decoration:none;
  min-width:max-content;
  color:var(--ink-950);
}
.home-header-contact strong{
  font-size:14px;
  line-height:1.1;
}
.home-header-contact span{
  font-size:12px;
  color:var(--ink-500);
}

.home-hero{
  padding:54px 0 24px;
  background:
    radial-gradient(circle at 82% 18%,rgba(118,88,244,.10),transparent 24%),
    radial-gradient(circle at 74% 68%,rgba(40,179,187,.07),transparent 22%),
    linear-gradient(180deg,#fff 0%,#fcfcff 100%);
}
.home-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(460px,560px);
  gap:48px;
  align-items:center;
}
.home-hero-copy{
  padding:24px 0 20px;
}
.home-hero-copy h1{
  max-width:700px;
  margin-bottom:20px;
  font-size:clamp(46px,5vw,68px);
}
.home-hero-copy .lead{
  max-width:640px;
  font-size:18px;
  line-height:1.7;
}
.home-hero-features{
  margin-top:34px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.home-hero-features div{
  padding:18px 18px 16px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  min-height:128px;
}
.home-hero-features strong{
  display:block;
  font-size:14px;
  margin-bottom:8px;
  line-height:1.35;
}
.home-hero-features span{
  display:block;
  color:var(--ink-500);
  font-size:13px;
  line-height:1.55;
}
.home-hero-media{
  position:relative;
}
.home-hero-card{
  border-radius:32px;
  background:#fff;
  border:1px solid rgba(228,232,240,.9);
  box-shadow:0 24px 60px rgba(26,31,50,.08);
  padding:18px;
  overflow:hidden;
}
.home-hero-card img{
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:cover;
  border-radius:22px;
}

.home-strip{
  padding:0 0 18px;
}
.home-strip-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.home-strip-item{
  border:1px solid var(--line);
  border-radius:24px;
  padding:24px;
  background:#fff;
  display:grid;
  grid-template-columns:54px 1fr;
  gap:16px;
  align-items:start;
}
.home-strip-icon{
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  color:var(--violet-600);
  background:var(--violet-050);
  font-weight:850;
  font-size:14px;
}
.home-strip-item strong{
  display:block;
  margin-bottom:8px;
  font-size:16px;
}
.home-strip-item p{
  margin:0;
  font-size:14px;
  color:var(--ink-600);
  line-height:1.6;
}

.home-section-head{
  margin-bottom:32px;
}
.home-showcase{
  padding-top:70px;
}
.home-showcase-card{
  display:grid;
  grid-template-columns:minmax(0,520px) minmax(0,1fr);
  gap:34px;
  padding:28px;
  border:1px solid var(--line);
  border-radius:32px;
  background:#fff;
  box-shadow:0 14px 40px rgba(26,31,50,.05);
}
.home-showcase-visual{
  min-width:0;
}
.home-product-stage{
  width:100%;
  min-height:500px;
  background:linear-gradient(145deg,#fbfcff 0%,#f6f7fb 60%,#fbf9ff 100%);
}
.home-packs-row{
  width:100%;
  grid-template-columns:repeat(6,1fr);
  gap:10px;
}
.home-packs-row .pack-thumb img{
  height:72px;
}
.home-showcase-content{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:12px 4px 8px;
}
.home-tag{
  text-decoration:none;
}
.home-showcase-content h3{
  font-size:42px;
  margin-bottom:14px;
}
.home-feature-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
  margin:28px 0;
}
.home-feature-grid div{
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--surface-soft);
  padding:18px;
}
.home-feature-grid strong{
  display:block;
  margin-bottom:6px;
  font-size:13px;
}
.home-feature-grid span{
  display:block;
  font-size:12px;
  color:var(--ink-600);
  line-height:1.55;
}
.home-volume-box{
  margin-top:4px;
  padding:20px;
  border-radius:22px;
  background:var(--surface-soft);
  border:1px solid var(--line);
}
.home-volume-box-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.home-volume-box-head strong{
  font-size:15px;
}
.home-volume-box-head span{
  color:var(--ink-500);
  font-size:12px;
}
.home-volume-list{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}
.home-showcase-actions{
  margin-top:24px;
}
.home-note{
  font-size:12px;
  color:var(--ink-500);
}

.home-tech{
  background:#f7f8fb;
}
.home-tech-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}
.home-tech-card{
  border:1px solid var(--line);
  border-radius:28px;
  overflow:hidden;
  background:#fff;
}
.home-tech-copy{
  padding:28px 28px 12px;
}
.home-tech-copy h3{
  font-size:26px;
  margin-bottom:10px;
}
.home-tech-copy p{
  margin:0;
  font-size:15px;
  color:var(--ink-600);
  line-height:1.65;
}
.home-tech-media{
  padding:8px 8px 8px;
}
.home-tech-media img{
  width:100%;
  display:block;
  border-radius:22px;
}

.home-steps-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
}
.home-step-card{
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  background:#fff;
}
.home-step-media{
  position:relative;
  height:232px;
  background:#f4f6fa;
}
.home-step-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.home-step-number{
  position:absolute;
  top:14px;
  left:14px;
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--violet-600);
  color:#fff;
  font-size:14px;
  font-weight:850;
}
.home-step-copy{
  padding:22px;
}
.home-step-copy h3{
  font-size:20px;
  margin-bottom:8px;
}
.home-step-copy p{
  margin:0;
  font-size:14px;
  color:var(--ink-600);
  line-height:1.6;
}

.home-reasons{
  padding-top:74px;
}
.home-reasons-panel{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:26px;
  padding:34px;
  border-radius:32px;
  background:linear-gradient(180deg,#f7f8fb 0%,#f9fafe 100%);
  border:1px solid var(--line);
  overflow:hidden;
  position:relative;
}
.home-reasons-panel::after{
  content:"";
  position:absolute;
  width:340px;
  height:340px;
  right:-80px;
  bottom:-110px;
  background:url('/assets/img/site/polymer-macro.webp') center/cover no-repeat;
  opacity:.10;
  border-radius:50%;
  pointer-events:none;
}
.home-reasons-lead{position:relative;z-index:2}
.home-reasons-lead h2{
  margin-bottom:14px;
}
.home-reasons-lead p{
  margin:0 0 22px;
  font-size:16px;
  color:var(--ink-600);
  line-height:1.7;
  max-width:500px;
}
.home-reasons-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.home-reason-card{
  border:1px solid #e2e6ef;
  border-radius:22px;
  background:rgba(255,255,255,.85);
  padding:22px;
  backdrop-filter:blur(10px);
}
.home-reason-card strong{
  display:block;
  margin-bottom:8px;
  font-size:16px;
}
.home-reason-card p{
  margin:0;
  font-size:14px;
  color:var(--ink-600);
  line-height:1.6;
}

.home-docs{
  background:#fff;
}
.home-docs-grid{
  display:grid;
  grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:30px;
  align-items:center;
}
.home-docs-copy .section-copy{
  max-width:520px;
}
.home-doc-tags{
  gap:10px;
}
.home-docs-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.home-doc-card{
  display:block;
  text-decoration:none;
  color:var(--ink-950);
  border:1px solid var(--line);
  border-radius:22px;
  overflow:hidden;
  background:#fff;
  transition:.18s ease;
}
.home-doc-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-sm);
}
.home-doc-card img{
  width:100%;
  height:250px;
  object-fit:cover;
  object-position:top;
}
.home-doc-card span{
  display:block;
  padding:14px 16px;
  font-size:13px;
  font-weight:750;
}

.home-library{
  background:linear-gradient(180deg,#fff 0%,#faf9ff 100%);
}
.home-library-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:22px;
}
.home-library-feature{
  text-decoration:none;
  color:var(--ink-950);
  border:1px solid var(--line);
  border-radius:30px;
  padding:30px;
  background:#fff;
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(240px,.9fr);
  gap:24px;
  align-items:center;
  box-shadow:0 14px 40px rgba(26,31,50,.04);
}
.home-library-feature-copy h3{
  font-size:34px;
  line-height:1.1;
  margin-bottom:14px;
}
.home-library-feature-copy p{
  font-size:15px;
  color:var(--ink-600);
  line-height:1.7;
  margin-bottom:18px;
}
.home-library-link{
  display:inline-block;
  font-size:14px;
  font-weight:800;
  color:var(--violet-600);
}
.home-library-feature img{
  width:100%;
  height:100%;
  min-height:280px;
  object-fit:cover;
  border-radius:22px;
  background:#f6f8fb;
}
.home-library-mini-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.home-library-mini{
  text-decoration:none;
  color:var(--ink-950);
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  padding:22px;
  min-height:204px;
  display:flex;
  flex-direction:column;
}
.home-library-mini h3{
  font-size:21px;
  line-height:1.25;
  margin-bottom:10px;
}
.home-library-mini p{
  margin:0;
  font-size:14px;
  line-height:1.6;
  color:var(--ink-600);
}

.home-faq{
  background:#fff;
}
.home-faq-grid{
  gap:14px 18px;
}
.home-faq-grid details{
  border-radius:18px;
}
.home-faq-grid summary{
  padding:22px 56px 22px 22px;
  font-size:15px;
}
.home-faq-grid details p{
  padding:0 22px 22px;
  font-size:14px;
}

.home-cta-wrap{
  padding:0 0 76px;
}
.home-cta{
  background:linear-gradient(120deg,#151b33 0%,#1d2043 54%,#32216d 100%);
  border-radius:34px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  align-items:stretch;
}
.home-cta-copy{
  padding:54px 48px;
  color:#fff;
}
.home-cta-copy h2{
  font-size:42px;
  margin-bottom:14px;
  max-width:480px;
}
.home-cta-copy p{
  color:#c5cadd;
  font-size:16px;
  line-height:1.7;
  max-width:460px;
}
.home-cta-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:28px;
}
.home-cta-eyebrow{color:#9c8cff}
.home-cta-media{
  min-height:100%;
  overflow:hidden;
}
.home-cta-media img{
  width:100%;
  height:100%;
  min-height:100%;
  object-fit:cover;
}
.home-footer{
  padding-top:34px;
}
.home-footer-grid{
  grid-template-columns:1.3fr .9fr .9fr 1fr;
}
.home-footer-about p{
  max-width:340px;
}

@media(max-width:1180px){
  .home-main-nav{gap:16px}
  .home-main-nav a{font-size:13px}
  .home-header-contact{display:none}
  .home-hero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,480px)}
  .home-hero-features{grid-template-columns:1fr 1fr 1fr}
  .home-showcase-card{grid-template-columns:1fr}
  .home-product-stage{min-height:420px}
  .home-docs-grid,.home-library-grid,.home-cta{grid-template-columns:1fr}
  .home-docs-copy .section-copy{max-width:none}
  .home-doc-card img{height:220px}
  .home-library-feature{grid-template-columns:1fr}
  .home-library-feature img{min-height:240px}
  .home-footer-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:860px){
  .home-page .section{padding:64px 0}
  .home-main-nav,.home-header-actions .btn{display:none}
  .menu-toggle{display:grid}
  .home-hero{padding:32px 0 14px}
  .home-hero-grid{grid-template-columns:1fr;gap:26px}
  .home-hero-copy{padding:10px 0 0}
  .home-hero-copy h1{font-size:clamp(38px,11vw,54px)}
  .home-hero-copy .lead{font-size:16px}
  .home-hero-features{grid-template-columns:1fr;gap:12px;margin-top:26px}
  .home-hero-features div{min-height:auto}
  .home-hero-card{padding:14px;border-radius:24px}
  .home-hero-card img{border-radius:16px}
  .home-strip-grid{grid-template-columns:1fr;gap:12px}
  .home-strip-item{grid-template-columns:44px 1fr;padding:18px 18px 18px 16px;border-radius:20px}
  .home-strip-icon{width:44px;height:44px;border-radius:14px;font-size:13px}
  .home-showcase-card{padding:18px;gap:22px;border-radius:24px}
  .home-product-stage{min-height:320px}
  .home-packs-row{grid-template-columns:repeat(3,1fr)}
  .home-showcase-content h3{font-size:30px}
  .home-feature-grid,.home-tech-grid,.home-docs-cards,.home-library-mini-grid{grid-template-columns:1fr}
  .home-volume-box-head{display:block}
  .home-volume-box-head span{display:block;margin-top:4px}
  .home-volume-list{grid-template-columns:1fr 1fr}
  .home-showcase-actions{display:grid;grid-template-columns:1fr}
  .home-tech-card{border-radius:24px}
  .home-tech-copy{padding:22px 22px 10px}
  .home-tech-copy h3{font-size:22px}
  .home-steps-grid{grid-template-columns:1fr;gap:14px}
  .home-step-card{display:grid;grid-template-columns:118px 1fr}
  .home-step-media{height:118px}
  .home-step-copy{padding:16px}
  .home-step-copy h3{font-size:18px}
  .home-reasons-panel{grid-template-columns:1fr;padding:24px;border-radius:24px}
  .home-reasons-grid{grid-template-columns:1fr}
  .home-doc-card{display:grid;grid-template-columns:120px 1fr;align-items:center}
  .home-doc-card img{height:124px}
  .home-doc-card span{padding:16px}
  .home-library-feature{padding:22px;border-radius:24px}
  .home-library-feature-copy h3{font-size:28px}
  .home-library-mini{min-height:auto}
  .home-faq-grid{grid-template-columns:1fr}
  .home-cta-wrap{padding-bottom:56px}
  .home-cta{border-radius:26px}
  .home-cta-copy{padding:34px 24px}
  .home-cta-copy h2{font-size:32px}
  .home-cta-actions{display:grid;grid-template-columns:1fr}
  .home-cta-media img{min-height:220px}
  .home-footer-grid{grid-template-columns:1fr;gap:28px}
}

@media(max-width:520px){
  .home-hero-features strong{font-size:13px}
  .home-packs-row{grid-template-columns:repeat(2,1fr)}
  .home-volume-list{grid-template-columns:1fr}
  .home-library-feature-copy h3{font-size:24px}
  .home-library-mini-grid{grid-template-columns:1fr}
  .home-step-card{grid-template-columns:1fr}
  .home-step-media{height:210px}
  .home-doc-card{grid-template-columns:100px 1fr}
  .home-doc-card img{height:110px}
}

/* v3.1 homepage final polish */
.home-page{
  --home-section-space:104px;
}
.home-page .section{
  padding:var(--home-section-space) 0;
}
.home-page .container{
  width:min(1240px,calc(100% - 48px));
}
.home-page h2{
  font-size:clamp(36px,3.6vw,46px);
  line-height:1.08;
  letter-spacing:-.045em;
}
.home-page .section-copy{
  font-size:16px;
  line-height:1.7;
  max-width:720px;
}
.home-header .header-row{
  min-height:74px;
}
.home-main-nav{
  gap:20px;
}
.home-main-nav a{
  color:var(--ink-700);
  font-size:13px;
  font-weight:720;
}
.home-main-nav a:hover{
  color:var(--violet-600);
}
.home-header-actions .btn{
  min-height:46px;
  padding:0 18px;
  border-radius:13px;
}

/* Hero: less boxed, stronger photography and more deliberate proportions */
.home-hero{
  padding:62px 0 34px;
  min-height:700px;
  display:flex;
  align-items:center;
}
.home-hero-grid{
  grid-template-columns:minmax(0,1.02fr) minmax(500px,.98fr);
  gap:58px;
}
.home-hero-copy{
  padding:0;
}
.home-hero-copy .eyebrow{
  margin-bottom:17px;
}
.home-hero-copy h1{
  max-width:710px;
  margin-bottom:22px;
  font-size:clamp(52px,5.25vw,70px);
  line-height:.98;
}
.home-hero-copy .lead{
  font-size:17px;
  line-height:1.72;
  max-width:620px;
}
.home-hero-copy .hero-actions{
  margin-top:31px;
}
.home-hero-copy .hero-actions .btn{
  min-height:52px;
  padding:0 22px;
  border-radius:14px;
}
.home-hero-features{
  margin-top:38px;
  gap:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.home-hero-features div{
  padding:19px 20px 19px 0;
  border:0;
  border-radius:0;
  background:transparent;
  min-height:auto;
}
.home-hero-features div+div{
  padding-left:20px;
  border-left:1px solid var(--line);
}
.home-hero-features strong{
  font-size:13px;
  margin-bottom:5px;
}
.home-hero-features span{
  font-size:12px;
  line-height:1.5;
}
.home-hero-card{
  padding:0;
  border-radius:30px;
  overflow:hidden;
  box-shadow:0 28px 70px rgba(34,30,67,.10);
}
.home-hero-card img{
  aspect-ratio:1.2 / 1;
  border-radius:0;
  object-position:center center;
}

/* Benefits become a single visual strip instead of three floating cards */
.home-strip{
  padding:0;
  background:#fff;
}
.home-strip-grid{
  gap:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.home-strip-item{
  border:0;
  border-radius:0;
  padding:27px 30px;
  background:transparent;
  grid-template-columns:46px 1fr;
  gap:15px;
}
.home-strip-item+.home-strip-item{
  border-left:1px solid var(--line);
}
.home-strip-icon{
  width:46px;
  height:46px;
  border-radius:15px;
  font-size:12px;
}
.home-strip-item strong{
  font-size:15px;
  margin-bottom:5px;
}
.home-strip-item p{
  font-size:12px;
  line-height:1.55;
}

/* Magic Max becomes the main conversion composition */
.home-showcase{
  padding-top:92px;
}
.home-showcase .home-section-head{
  margin-bottom:34px;
}
.home-showcase-card{
  grid-template-columns:minmax(0,500px) minmax(0,1fr);
  gap:44px;
  padding:34px;
  border-radius:32px;
  box-shadow:none;
}
.home-product-stage{
  min-height:480px;
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 45%,rgba(118,88,244,.09),transparent 32%),
    linear-gradient(145deg,#fbfcff,#f5f6fb);
}
.home-product-stage .real-pack{
  max-width:78%;
  max-height:440px;
}
.home-packs-row{
  margin-top:12px;
  gap:9px;
}
.home-packs-row .pack-thumb{
  min-height:98px;
  border-radius:14px;
  padding:8px;
}
.home-packs-row .pack-thumb img{
  height:58px;
}
.home-packs-row .pack-thumb span{
  font-size:9px;
}
.home-showcase-content{
  padding:6px 0;
}
.home-showcase-content h3{
  font-size:clamp(34px,3.25vw,44px);
  line-height:1.05;
  letter-spacing:-.04em;
  margin:14px 0 14px;
}
.home-showcase-content .single-product-lead{
  font-size:15px;
  line-height:1.72;
  max-width:660px;
}
.home-feature-grid{
  margin:26px 0 22px;
  gap:10px;
}
.home-feature-grid div{
  padding:16px 17px;
  border-radius:16px;
  background:#fff;
}
.home-feature-grid strong{
  font-size:12px;
}
.home-feature-grid span{
  font-size:11px;
}
.home-volume-box{
  padding:18px;
  border-radius:20px;
  background:#f8f9fc;
}
.home-volume-list{
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.home-volume-list .pack-rich{
  min-height:64px;
  padding:11px 12px;
  border-radius:13px;
  background:#fff;
}
.home-volume-list .pack-rich b{
  font-size:12px;
}
.home-volume-list .pack-rich span{
  font-size:9px;
}
.home-showcase-actions .btn{
  min-height:50px;
}

/* Technology cards: stronger image-to-copy ratio */
.home-tech{
  background:#f7f8fb;
}
.home-tech-grid{
  gap:24px;
}
.home-tech-card{
  border-radius:26px;
}
.home-tech-copy{
  padding:28px 30px 14px;
}
.home-tech-copy h3{
  font-size:25px;
}
.home-tech-copy p{
  font-size:14px;
  max-width:500px;
}
.home-tech-media{
  padding:8px 10px 10px;
}
.home-tech-media img{
  aspect-ratio:1.42/1;
  object-fit:cover;
}

/* Steps: make photos dominant, keep descriptions concise */
.home-steps-grid{
  gap:16px;
}
.home-step-card{
  border-radius:22px;
}
.home-step-media{
  height:250px;
}
.home-step-copy{
  padding:19px 20px 22px;
}
.home-step-copy h3{
  font-size:19px;
}
.home-step-copy p{
  font-size:12px;
  line-height:1.58;
}
.home-step-number{
  width:36px;
  height:36px;
  top:13px;
  left:13px;
  font-size:12px;
}

/* Reason panel: strong editorial block instead of another row of cards */
.home-reasons{
  padding-top:84px;
  padding-bottom:84px;
}
.home-reasons-panel{
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:40px;
  padding:42px;
  border-radius:30px;
}
.home-reasons-lead p{
  font-size:15px;
  max-width:470px;
}
.home-reasons-grid{
  gap:12px;
}
.home-reason-card{
  padding:20px;
  border-radius:18px;
  box-shadow:none;
}
.home-reason-card strong{
  font-size:14px;
}
.home-reason-card p{
  font-size:12px;
}

/* Documents: quieter background, cleaner preview cards */
.home-docs{
  background:#f8f9fc;
}
.home-docs-grid{
  gap:42px;
}
.home-docs-cards{
  gap:12px;
}
.home-doc-card{
  border-radius:18px;
  box-shadow:none;
}
.home-doc-card img{
  height:230px;
  object-fit:contain;
  background:#fff;
  padding:12px;
}
.home-doc-card span{
  padding:13px 15px 15px;
  font-size:12px;
}

/* Knowledge: editorial feature + four compact supporting articles */
.home-library{
  background:#fff;
}
.home-library-grid{
  grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:20px;
}
.home-library-feature{
  grid-template-columns:1fr;
  padding:0;
  overflow:hidden;
  border-radius:26px;
  box-shadow:none;
  align-content:start;
}
.home-library-feature img{
  order:-1;
  min-height:330px;
  height:330px;
  border-radius:0;
  object-fit:cover;
}
.home-library-feature-copy{
  padding:28px 30px 31px;
}
.home-library-feature-copy h3{
  font-size:31px;
  line-height:1.08;
  margin:10px 0 12px;
}
.home-library-feature-copy p{
  font-size:13px;
  line-height:1.65;
  margin-bottom:15px;
}
.home-library-mini-grid{
  gap:12px;
}
.home-library-mini{
  min-height:0;
  padding:20px;
  border-radius:18px;
}
.home-library-mini h3{
  font-size:18px;
  line-height:1.25;
  margin:8px 0 7px;
}
.home-library-mini p{
  font-size:11px;
  line-height:1.52;
}

/* FAQ and final CTA */
.home-faq{
  background:#f8f9fc;
}
.home-faq-grid{
  max-width:100%;
}
.home-faq-grid details{
  background:#fff;
  border-radius:16px;
}
.home-faq-grid summary{
  min-height:64px;
  display:flex;
  align-items:center;
  padding:18px 54px 18px 20px;
  font-size:14px;
}
.home-faq-grid details p{
  font-size:12px;
  line-height:1.65;
}
.home-cta-wrap{
  padding:76px 0;
  background:#fff;
}
.home-cta{
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  border-radius:30px;
  min-height:390px;
}
.home-cta-copy{
  padding:50px 46px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.home-cta-copy h2{
  font-size:clamp(34px,3.4vw,44px);
  line-height:1.06;
}
.home-cta-copy p{
  font-size:14px;
}
.home-cta-actions .btn-secondary{
  border-color:rgba(255,255,255,.28);
  color:#fff;
  background:rgba(255,255,255,.05);
}
.home-cta-actions .btn-secondary:hover{
  background:rgba(255,255,255,.10);
}
.home-cta-media img{
  object-position:center;
}
.home-footer{
  border-top:1px solid var(--line);
}
.home-footer-grid{
  gap:28px;
}
.home-footer .footer-col strong{
  margin-bottom:13px;
}
.home-footer .footer-col>a,
.home-footer .footer-contact-list a{
  font-size:12px;
}

@media(max-width:1180px){
  .home-page{--home-section-space:88px}
  .home-page .container{width:min(1240px,calc(100% - 40px))}
  .home-hero{min-height:0;padding-top:48px}
  .home-hero-grid{grid-template-columns:minmax(0,1fr) minmax(410px,.9fr);gap:38px}
  .home-hero-copy h1{font-size:clamp(48px,5vw,62px)}
  .home-showcase-card{grid-template-columns:minmax(0,450px) minmax(0,1fr);gap:30px}
  .home-product-stage{min-height:420px}
  .home-step-media{height:220px}
  .home-docs-grid{grid-template-columns:.8fr 1.2fr;gap:28px}
}

@media(max-width:960px){
  .home-page{--home-section-space:76px}
  .home-hero-grid{grid-template-columns:1fr;gap:30px}
  .home-hero-copy{max-width:760px}
  .home-hero-card img{aspect-ratio:1.55/1}
  .home-strip-grid{grid-template-columns:1fr}
  .home-strip-item{padding:20px 0}
  .home-strip-item+.home-strip-item{border-left:0;border-top:1px solid var(--line)}
  .home-showcase-card{grid-template-columns:1fr;padding:26px}
  .home-product-stage{min-height:420px}
  .home-tech-grid{grid-template-columns:1fr}
  .home-steps-grid{grid-template-columns:1fr 1fr}
  .home-reasons-panel,.home-docs-grid,.home-library-grid,.home-cta{grid-template-columns:1fr}
  .home-docs-cards{grid-template-columns:repeat(3,1fr)}
  .home-cta-media{min-height:270px}
}

@media(max-width:680px){
  .home-page{--home-section-space:64px}
  .home-page .container{width:min(100%,calc(100% - 28px))}
  .home-header .header-row{min-height:68px}
  .home-hero{padding:28px 0 18px}
  .home-hero-copy h1{font-size:clamp(40px,13vw,52px);line-height:1}
  .home-hero-copy .lead{font-size:15px;line-height:1.65}
  .home-hero-copy .hero-actions{display:grid;grid-template-columns:1fr;margin-top:24px}
  .home-hero-copy .hero-actions .btn{width:100%}
  .home-hero-features{grid-template-columns:1fr}
  .home-hero-features div{padding:15px 0}
  .home-hero-features div+div{padding-left:0;border-left:0;border-top:1px solid var(--line)}
  .home-hero-card{border-radius:22px}
  .home-hero-card img{aspect-ratio:1.2/1}
  .home-strip-item{grid-template-columns:40px 1fr;gap:12px}
  .home-strip-icon{width:40px;height:40px;border-radius:13px}
  .home-showcase{padding-top:64px}
  .home-showcase-card{padding:16px;border-radius:22px}
  .home-product-stage{min-height:300px;border-radius:18px}
  .home-product-stage .real-pack{max-width:76%;max-height:280px}
  .home-packs-row{grid-template-columns:repeat(3,1fr);gap:7px}
  .home-packs-row .pack-thumb{min-height:84px}
  .home-packs-row .pack-thumb img{height:49px}
  .home-showcase-content h3{font-size:30px}
  .home-feature-grid{grid-template-columns:1fr}
  .home-volume-list{grid-template-columns:1fr 1fr}
  .home-tech-copy{padding:22px 20px 10px}
  .home-steps-grid{grid-template-columns:1fr}
  .home-step-card{display:grid;grid-template-columns:122px 1fr}
  .home-step-media{height:132px}
  .home-step-copy{padding:16px}
  .home-reasons{padding-top:64px;padding-bottom:64px}
  .home-reasons-panel{padding:22px;gap:26px;border-radius:22px}
  .home-reasons-grid{grid-template-columns:1fr}
  .home-docs-cards{grid-template-columns:1fr}
  .home-doc-card{display:grid;grid-template-columns:116px 1fr;align-items:center}
  .home-doc-card img{height:116px;padding:8px}
  .home-library-feature img{height:240px;min-height:240px}
  .home-library-feature-copy{padding:22px}
  .home-library-feature-copy h3{font-size:25px}
  .home-library-mini-grid{grid-template-columns:1fr}
  .home-cta-wrap{padding:54px 0}
  .home-cta{border-radius:22px;min-height:0}
  .home-cta-copy{padding:30px 22px}
  .home-cta-actions{display:grid;grid-template-columns:1fr}
  .home-cta-media{min-height:210px}
}

@media(max-width:430px){
  .home-volume-list{grid-template-columns:1fr}
  .home-step-card{grid-template-columns:1fr}
  .home-step-media{height:210px}
  .home-doc-card{grid-template-columns:98px 1fr}
  .home-doc-card img{height:104px}
}

/* =========================================================
   v3.2 — Homepage final polishing pass
   Scale, rhythm, commerce hierarchy and mobile refinement.
   ========================================================= */

/* Global home-page reading scale */
.home-page .section-copy{
  font-size:15px;
  line-height:1.7;
}
.home-page .eyebrow{
  font-size:11px;
  letter-spacing:.075em;
}
.home-page .btn{
  font-size:14px;
  font-weight:780;
}
.home-main-nav a{
  font-size:14px;
}
.home-header .brand{
  font-size:16px;
}

/* HERO — give copy more authority, image a little less visual weight */
.home-hero{
  min-height:650px;
  padding:54px 0 32px;
}
.home-hero-grid{
  grid-template-columns:minmax(0,1.10fr) minmax(410px,.90fr);
  gap:72px;
}
.home-hero-copy h1{
  max-width:760px;
  font-size:clamp(56px,5.5vw,74px);
  line-height:.96;
  letter-spacing:-.055em;
  margin-bottom:24px;
}
.home-hero-copy .lead{
  max-width:680px;
  font-size:18px;
  line-height:1.72;
}
.home-hero-media{
  width:100%;
  max-width:500px;
  justify-self:end;
}
.home-hero-card{
  border-radius:28px;
  box-shadow:0 26px 66px rgba(38,30,74,.09);
}
.home-hero-card img{
  aspect-ratio:1.08/1;
  object-fit:cover;
  object-position:center 48%;
}
.home-hero-features{
  margin-top:42px;
}
.home-hero-features div{
  padding-top:21px;
  padding-bottom:21px;
}
.home-hero-features strong{
  font-size:14px;
  line-height:1.35;
}
.home-hero-features span{
  font-size:13px;
  line-height:1.5;
}

/* Supporting strip — calm, not another group of cards */
.home-strip-item{
  padding:24px 34px;
  grid-template-columns:42px 1fr;
  gap:16px;
}
.home-strip-icon{
  width:42px;
  height:42px;
  border-radius:13px;
  font-size:11px;
  background:#f4f1ff;
}
.home-strip-item strong{
  font-size:15px;
  margin-bottom:6px;
}
.home-strip-item p{
  font-size:13px;
  line-height:1.55;
}

/* Consistent section headers */
.home-page .home-section-head{
  margin-bottom:38px;
}
.home-page .home-section-head h2,
.home-docs-copy h2,
.home-reasons-lead h2{
  font-size:clamp(36px,3.6vw,46px);
  line-height:1.04;
  letter-spacing:-.045em;
}

/* MAGIC MAX — stronger product photograph, quieter information matrix */
.home-showcase{
  padding-top:96px;
  padding-bottom:100px;
}
.home-showcase-card{
  grid-template-columns:minmax(0,520px) minmax(0,1fr);
  gap:52px;
  padding:38px;
  border-radius:30px;
  border-color:#e1e4ed;
}
.home-product-stage{
  min-height:530px;
  border-radius:24px;
  background:
    radial-gradient(circle at 50% 47%,rgba(118,88,244,.12),transparent 34%),
    linear-gradient(145deg,#fcfdff 0%,#f4f5fa 100%);
}
.home-product-stage .real-pack{
  max-width:92%;
  max-height:490px;
}
.home-packs-row{
  margin-top:14px;
}
.home-packs-row .pack-thumb{
  min-height:104px;
  padding:9px;
  border-color:#e0e3ec;
}
.home-packs-row .pack-thumb img{
  height:62px;
}
.home-packs-row .pack-thumb span{
  font-size:10px;
  font-weight:740;
}
.home-showcase-content h3{
  font-size:clamp(38px,3.45vw,48px);
  margin:14px 0 16px;
}
.home-showcase-content .single-product-lead{
  max-width:620px;
  font-size:16px;
  line-height:1.72;
}
.home-feature-grid{
  margin:28px 0 24px;
  gap:0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.home-feature-grid div{
  padding:18px 20px 18px 0;
  border:0;
  border-radius:0;
  background:transparent;
}
.home-feature-grid div:nth-child(even){
  padding-left:20px;
  border-left:1px solid var(--line);
}
.home-feature-grid div:nth-child(n+3){
  border-top:1px solid var(--line);
}
.home-feature-grid strong{
  font-size:13px;
  margin-bottom:7px;
}
.home-feature-grid span{
  font-size:12.5px;
  line-height:1.55;
}
.home-volume-box{
  padding:20px;
  border-radius:18px;
  background:#f6f7fb;
}
.home-volume-box-head strong{
  font-size:15px;
}
.home-volume-box-head span{
  font-size:12px;
}
.home-volume-list .pack-rich{
  min-height:68px;
  padding:12px 13px;
}
.home-volume-list .pack-rich b{
  font-size:13px;
}
.home-volume-list .pack-rich span{
  font-size:10px;
}
.home-showcase-actions{
  margin-top:26px;
}
.home-showcase-actions .btn{
  min-height:52px;
}
.home-note{
  margin-top:15px;
  font-size:12.5px;
}

/* TECHNOLOGY — still visual, but no longer overwhelms following sections */
.home-tech{
  padding-top:90px !important;
  padding-bottom:90px !important;
}
.home-tech-card{
  border-radius:24px;
}
.home-tech-copy{
  padding:26px 28px 12px;
}
.home-tech-copy h3{
  font-size:24px;
}
.home-tech-copy p{
  font-size:14px;
  line-height:1.6;
}
.home-tech-media img{
  aspect-ratio:1.62/1;
  object-fit:cover;
  object-position:center top;
}

/* STEPS — larger, more legible cards to match the technology section */
.home-steps{
  padding-top:96px !important;
  padding-bottom:96px !important;
}
.home-steps-grid{
  gap:20px;
}
.home-step-card{
  border-radius:22px;
}
.home-step-media{
  height:286px;
}
.home-step-copy{
  padding:22px 22px 24px;
}
.home-step-copy h3{
  font-size:20px;
  margin-bottom:9px;
}
.home-step-copy p{
  font-size:13.5px;
  line-height:1.6;
}
.home-step-number{
  width:38px;
  height:38px;
  font-size:13px;
}

/* FACTORS — scale it up so it does not feel like a tiny interstitial */
.home-reasons{
  padding-top:88px !important;
  padding-bottom:88px !important;
}
.home-reasons-panel{
  grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);
  gap:46px;
  padding:46px;
}
.home-reasons-lead p{
  font-size:16px;
  line-height:1.7;
}
.home-reason-card{
  padding:23px;
  border-radius:19px;
}
.home-reason-card strong{
  font-size:15px;
  margin-bottom:9px;
}
.home-reason-card p{
  font-size:13px;
  line-height:1.58;
}

/* DOCUMENTS — turn into a visible trust block, not tiny thumbnails */
.home-docs{
  padding-top:84px !important;
  padding-bottom:84px !important;
}
.home-docs-grid{
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
  gap:54px;
}
.home-docs-copy .section-copy{
  font-size:15px;
  line-height:1.7;
}
.home-doc-tags span{
  font-size:12px;
  padding:8px 10px;
}
.home-docs-cards{
  gap:16px;
}
.home-doc-card{
  border-radius:19px;
}
.home-doc-card img{
  height:310px;
  padding:10px;
}
.home-doc-card span{
  padding:14px 16px 16px;
  font-size:13px;
}

/* KNOWLEDGE — clearer editorial hierarchy */
.home-library{
  padding-top:96px !important;
  padding-bottom:96px !important;
}
.home-library-grid{
  grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:24px;
}
.home-library-feature{
  border-radius:26px;
  background:#fff;
}
.home-library-feature img{
  height:390px;
  min-height:390px;
}
.home-library-feature-copy{
  padding:30px 32px 34px;
}
.home-library-feature-copy h3{
  font-size:36px;
  line-height:1.08;
  margin:10px 0 14px;
}
.home-library-feature-copy p{
  font-size:14px;
  line-height:1.67;
}
.home-library-link{
  font-size:14px;
}
.home-library-mini-grid{
  gap:14px;
}
.home-library-mini{
  padding:24px;
  border-radius:19px;
  min-height:228px;
}
.home-library-mini h3{
  font-size:20px;
  line-height:1.28;
  margin:10px 0 9px;
}
.home-library-mini p{
  font-size:13px;
  line-height:1.58;
}
.home-library-mini:hover,
.home-library-feature:hover{
  border-color:#d3cdf8;
  box-shadow:0 12px 30px rgba(52,43,103,.06);
}

/* FAQ + CTA */
.home-faq{
  padding-top:88px !important;
  padding-bottom:88px !important;
}
.home-faq-grid summary{
  min-height:68px;
  font-size:15px;
  padding-left:22px;
}
.home-faq-grid details p{
  font-size:13.5px;
  line-height:1.65;
}
.home-cta-wrap{
  padding:80px 0;
}
.home-cta{
  min-height:410px;
}
.home-cta-copy{
  padding:54px 50px;
}
.home-cta-copy p{
  font-size:15px;
}

/* Footer and service typography should not collapse into unreadable microcopy */
.home-footer{
  padding-top:48px;
}
.home-footer .footer-about p{
  font-size:13px;
  line-height:1.65;
}
.home-footer .footer-col strong{
  font-size:13px;
}
.home-footer .footer-col>a,
.home-footer .footer-contact-list a{
  font-size:13px;
  line-height:1.45;
}
.home-footer .footer-bottom{
  font-size:12px;
}

@media(max-width:1180px){
  .home-hero-grid{
    grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);
    gap:44px;
  }
  .home-hero-media{max-width:460px}
  .home-hero-copy h1{font-size:clamp(50px,5vw,64px)}
  .home-showcase-card{
    grid-template-columns:minmax(0,470px) minmax(0,1fr);
    gap:34px;
    padding:30px;
  }
  .home-product-stage{min-height:470px}
  .home-step-media{height:250px}
  .home-docs-grid{grid-template-columns:.8fr 1.2fr;gap:34px}
  .home-doc-card img{height:270px}
  .home-library-feature img{height:340px;min-height:340px}
}

@media(max-width:960px){
  .home-page .section-copy{font-size:14px}
  .home-hero{
    min-height:0;
    padding-top:44px;
  }
  .home-hero-grid{grid-template-columns:1fr;gap:34px}
  .home-hero-media{max-width:680px;justify-self:stretch}
  .home-hero-card img{aspect-ratio:1.45/1}
  .home-showcase-card{grid-template-columns:1fr}
  .home-product-stage{min-height:450px}
  .home-product-stage .real-pack{max-width:86%;max-height:420px}
  .home-tech-media img{aspect-ratio:1.75/1}
  .home-steps-grid{grid-template-columns:1fr 1fr}
  .home-step-media{height:280px}
  .home-reasons-panel{grid-template-columns:1fr;padding:34px}
  .home-docs-grid{grid-template-columns:1fr;gap:30px}
  .home-docs-cards{grid-template-columns:repeat(3,1fr)}
  .home-doc-card img{height:260px}
  .home-library-grid{grid-template-columns:1fr}
  .home-library-feature{display:grid;grid-template-columns:.95fr 1.05fr}
  .home-library-feature img{
    order:0;
    height:100%;
    min-height:360px;
  }
  .home-library-mini-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:680px){
  .home-page .eyebrow{font-size:10px}
  .home-page .btn{font-size:13px}
  .home-hero{
    padding:28px 0 14px;
  }
  .home-hero-copy h1{
    font-size:clamp(40px,13vw,52px);
    letter-spacing:-.05em;
  }
  .home-hero-copy .lead{font-size:15px}
  .home-hero-media{max-width:none}
  .home-hero-card img{aspect-ratio:1.1/1}
  .home-hero-features strong{font-size:13.5px}
  .home-hero-features span{font-size:12.5px}
  .home-strip-item strong{font-size:14px}
  .home-strip-item p{font-size:12.5px}
  .home-showcase{padding-top:68px !important;padding-bottom:68px !important}
  .home-showcase-card{padding:17px;gap:24px}
  .home-product-stage{min-height:330px}
  .home-product-stage .real-pack{max-width:86%;max-height:310px}
  .home-showcase-content h3{font-size:31px}
  .home-showcase-content .single-product-lead{font-size:14px}
  .home-feature-grid div:nth-child(even){padding-left:0;border-left:0}
  .home-feature-grid div:nth-child(n+2){border-top:1px solid var(--line)}
  .home-feature-grid div{padding:15px 0}
  .home-feature-grid{grid-template-columns:1fr}
  .home-volume-list{grid-template-columns:1fr 1fr}
  .home-tech{padding-top:64px !important;padding-bottom:64px !important}
  .home-tech-media img{aspect-ratio:1.35/1}
  .home-steps{padding-top:68px !important;padding-bottom:68px !important}
  .home-steps-grid{grid-template-columns:1fr}
  .home-step-card{display:grid;grid-template-columns:132px 1fr}
  .home-step-media{height:150px}
  .home-step-copy{padding:17px}
  .home-step-copy p{font-size:13px}
  .home-reasons{padding-top:64px !important;padding-bottom:64px !important}
  .home-reasons-panel{padding:24px;gap:28px}
  .home-reason-card p{font-size:12.5px}
  .home-docs{padding-top:64px !important;padding-bottom:64px !important}
  .home-docs-cards{grid-template-columns:1fr}
  .home-doc-card{grid-template-columns:126px 1fr}
  .home-doc-card img{height:128px}
  .home-library{padding-top:68px !important;padding-bottom:68px !important}
  .home-library-feature{grid-template-columns:1fr}
  .home-library-feature img{order:-1;height:245px;min-height:245px}
  .home-library-feature-copy{padding:22px}
  .home-library-feature-copy h3{font-size:26px}
  .home-library-mini-grid{grid-template-columns:1fr}
  .home-library-mini{min-height:auto;padding:20px}
  .home-library-mini h3{font-size:19px}
  .home-library-mini p{font-size:12.5px}
  .home-faq{padding-top:64px !important;padding-bottom:64px !important}
  .home-cta-wrap{padding:54px 0}
  .home-cta{min-height:0}
  .home-cta-copy{padding:32px 24px}
  .home-footer .footer-col>a,
  .home-footer .footer-contact-list a{font-size:13px}
}

@media(max-width:430px){
  .home-volume-list{grid-template-columns:1fr}
  .home-step-card{grid-template-columns:1fr}
  .home-step-media{height:220px}
  .home-doc-card{grid-template-columns:108px 1fr}
  .home-doc-card img{height:112px}
}


/* v3.5 approved-style commercial category */
.gel-category-page .section{padding:90px 0}
.gelcat-hero{padding:40px 0 72px;background:radial-gradient(circle at 84% 16%,rgba(118,88,244,.08),transparent 24%),linear-gradient(180deg,#fff,#fbfbfe)}
.gelcat-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);gap:44px;align-items:center}
.gelcat-hero-copy h1{font-size:clamp(46px,5vw,66px);max-width:760px;margin-bottom:18px}.gelcat-hero-copy .lead{max-width:650px;font-size:17px;line-height:1.7}
.gelcat-hero-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}.gelcat-hero-facts span{display:inline-flex;align-items:center;gap:7px;padding:10px 13px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink-600);font-size:12px}.gelcat-hero-facts b{color:var(--violet-700);font-size:14px}
.gelcat-hero-media{border:1px solid var(--line);border-radius:30px;padding:16px;background:#fff;box-shadow:0 24px 60px rgba(26,31,50,.07)}.gelcat-hero-media img{display:block;width:100%;aspect-ratio:1.05/1;object-fit:cover;border-radius:20px}
.gelcat-product-card{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:32px;border:1px solid var(--line);border-radius:30px;background:#fff;padding:28px;box-shadow:0 14px 40px rgba(26,31,50,.045)}
.gelcat-product-media{min-width:0}.gelcat-product-stage{min-height:440px;display:grid;place-items:center;border-radius:24px;background:linear-gradient(145deg,#fbfcff,#f5f5fb);padding:24px}.gelcat-product-stage img{width:100%;height:390px;object-fit:contain}
.gelcat-mini-packs{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:12px}.gelcat-mini-packs span{border:1px solid var(--line);border-radius:13px;background:#fff;padding:8px 5px;text-align:center}.gelcat-mini-packs span.is-active{border-color:var(--violet-500);background:var(--violet-050)}.gelcat-mini-packs img{width:100%;height:52px;object-fit:contain;display:block}.gelcat-mini-packs b{display:block;margin-top:4px;font-size:9px}
.gelcat-product-copy{display:flex;flex-direction:column;justify-content:center;padding:8px}.gelcat-product-copy h3{font-size:36px;line-height:1.08;margin:16px 0 14px}.gelcat-product-copy>p{font-size:15px;color:var(--ink-600);line-height:1.65}
.gelcat-product-facts{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:24px 0}.gelcat-product-facts div{padding:17px;border:1px solid var(--line);border-radius:17px;background:var(--surface-soft)}.gelcat-product-facts b{display:block;font-size:17px;margin-bottom:4px}.gelcat-product-facts span{display:block;font-size:11px;color:var(--ink-500);line-height:1.45}
.gelcat-product-actions,.gelcat-tech-actions{display:flex;flex-wrap:wrap;gap:10px}.gelcat-product-note{margin-top:13px!important;font-size:11px!important;color:var(--ink-400)!important}
.gelcat-pack-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.gelcat-pack-card{text-decoration:none;color:var(--ink-950);border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden;transition:.18s ease}.gelcat-pack-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.gelcat-pack-card.is-featured{border-color:#cfc6fb;box-shadow:0 0 0 3px rgba(118,88,244,.06)}
.gelcat-pack-image{height:230px;display:grid;place-items:center;background:linear-gradient(180deg,#fff,#f8f8fb);padding:18px}.gelcat-pack-image img{width:100%;height:100%;object-fit:contain}.gelcat-pack-body{padding:20px}.gelcat-pack-type{display:inline-flex;padding:6px 9px;border-radius:999px;background:var(--violet-050);color:var(--violet-700);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.05em}.gelcat-pack-body h3{font-size:24px;margin:10px 0 7px}.gelcat-pack-body p{min-height:44px;margin:0;color:var(--ink-500);font-size:12px;line-height:1.55}.gelcat-pack-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.gelcat-pack-bottom b{font-size:12px}.gelcat-pack-bottom span{font-size:10px;color:var(--ink-500)}
.gelcat-guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.gelcat-guide-grid article{border:1px solid var(--line);border-radius:20px;background:#fff;padding:22px}.gelcat-guide-grid article>span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--violet-050);color:var(--violet-700);font-size:10px;font-weight:850;margin-bottom:14px}.gelcat-guide-grid h3{font-size:18px;margin-bottom:7px}.gelcat-guide-grid p{margin:0;color:var(--ink-500);font-size:12px;line-height:1.6}
.gelcat-tech-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:30px;align-items:center}.gelcat-tech-copy h2{margin-bottom:14px}.gelcat-tech-copy p{color:var(--ink-600);font-size:15px;line-height:1.7}.gelcat-tech-media{border:1px solid var(--line);border-radius:26px;background:#fff;padding:12px}.gelcat-tech-media img{display:block;width:100%;border-radius:18px}
.gelcat-trust-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:30px;align-items:center}.gelcat-trust-copy p{max-width:520px;color:var(--ink-600);font-size:15px;line-height:1.7}.gelcat-docs{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.gelcat-docs a{text-decoration:none;color:var(--ink-950);border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff}.gelcat-docs img{width:100%;height:230px;object-fit:cover;object-position:top;display:block}.gelcat-docs span{display:block;padding:13px 14px;font-size:12px;font-weight:750}
.gelcat-library-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.gelcat-library-grid a{text-decoration:none;color:var(--ink-950);border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden}.gelcat-library-grid img{width:100%;height:160px;object-fit:cover;display:block}.gelcat-library-grid a>span{display:block;padding:15px 16px 0;color:var(--violet-600);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.gelcat-library-grid h3{font-size:18px;margin:6px 16px 6px}.gelcat-library-grid p{margin:0;padding:0 16px 18px;color:var(--ink-500);font-size:11px;line-height:1.55}.gelcat-cta-wrap{padding-top:0}
@media(max-width:1050px){.gelcat-hero-grid,.gelcat-product-card,.gelcat-tech-grid,.gelcat-trust-grid{grid-template-columns:1fr}.gelcat-pack-grid{grid-template-columns:1fr 1fr}.gelcat-guide-grid,.gelcat-library-grid{grid-template-columns:1fr 1fr}.gelcat-hero-media{max-width:620px}.gelcat-product-stage{min-height:360px}.gelcat-docs img{height:200px}}
@media(max-width:700px){.gel-category-page .section{padding:62px 0}.gelcat-hero{padding:28px 0 50px}.gelcat-hero-copy h1{font-size:clamp(38px,11vw,52px)}.gelcat-hero-facts{display:grid}.gelcat-product-card{padding:17px;border-radius:24px}.gelcat-product-stage{min-height:290px}.gelcat-product-stage img{height:270px}.gelcat-mini-packs{grid-template-columns:repeat(3,1fr)}.gelcat-product-copy h3{font-size:29px}.gelcat-product-facts,.gelcat-pack-grid,.gelcat-guide-grid,.gelcat-library-grid,.gelcat-docs{grid-template-columns:1fr}.gelcat-pack-image{height:210px}.gelcat-pack-body p{min-height:0}.gelcat-docs a{display:grid;grid-template-columns:110px 1fr;align-items:center}.gelcat-docs img{height:110px}.gelcat-product-actions,.gelcat-tech-actions{display:grid;grid-template-columns:1fr}}


/* v3.6 Magic Max e-commerce product page */
.magic-product-page .section{padding:88px 0}
.magic-hero{padding:26px 0 74px;background:radial-gradient(circle at 86% 16%,rgba(118,88,244,.085),transparent 23%),radial-gradient(circle at 70% 62%,rgba(40,179,187,.04),transparent 20%),linear-gradient(180deg,#fff,#fbfbfe)}
.magic-hero-grid{display:grid;grid-template-columns:minmax(430px,.92fr) minmax(0,1.08fr);gap:42px;align-items:start}
.magic-gallery{position:sticky;top:96px;min-width:0}.magic-gallery-main{position:relative;min-height:590px;display:grid;place-items:center;padding:34px;border:1px solid var(--line);border-radius:30px;background:linear-gradient(145deg,#fff,#f7f8fc);box-shadow:0 18px 50px rgba(27,31,53,.055)}
.magic-gallery-main>img{width:100%;height:520px;object-fit:contain;filter:drop-shadow(0 24px 35px rgba(34,31,76,.08))}.magic-gallery-badge{position:absolute;left:18px;top:18px;z-index:2;display:inline-flex;padding:8px 11px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:10px;font-weight:850;letter-spacing:.05em;text-transform:uppercase;color:var(--violet-700)}
.magic-gallery-thumbs{grid-template-columns:repeat(6,1fr);gap:8px;margin-top:12px}.magic-gallery-thumbs button{padding:7px 5px;border-radius:13px}.magic-gallery-thumbs img{height:66px}.magic-gallery-thumbs span{display:block;margin-top:3px;font-size:9px;font-weight:800;color:var(--ink-600)}
.magic-summary{padding:10px 0}.magic-product-tag{margin-bottom:16px}.magic-summary h1{font-size:clamp(54px,5vw,72px);line-height:.98;letter-spacing:-.055em;margin:0 0 18px}.magic-summary-lead{font-size:17px;line-height:1.72;color:var(--ink-600);max-width:680px;margin:0}
.magic-proof-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:26px 0}.magic-proof-row>div{padding:16px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.8)}.magic-proof-row b{display:block;font-size:20px;line-height:1;margin-bottom:6px}.magic-proof-row span{display:block;font-size:11px;line-height:1.45;color:var(--ink-500)}
.magic-buy-card{padding:24px;border:1px solid #d8d2fb;border-radius:26px;background:radial-gradient(circle at 91% 11%,rgba(118,88,244,.10),transparent 24%),#fff;box-shadow:0 16px 45px rgba(67,55,135,.07)}.magic-buy-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px}.magic-buy-label{display:block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-400);margin-bottom:5px}.magic-buy-head strong{display:block;font-size:28px;letter-spacing:-.035em}.magic-buy-head small{display:block;margin-top:4px;color:var(--ink-500);font-size:11px}.magic-buy-card .store-stock{font-size:10px;padding:8px 11px}
.magic-store-variants{grid-template-columns:repeat(6,1fr);gap:8px}.magic-store-variants .store-variant{padding:9px 5px;border-radius:14px}.magic-store-variants .store-variant img{height:58px}.magic-store-variants .store-variant b{font-size:10px}.magic-store-variants .store-variant span{font-size:8px}.magic-store-variants .store-variant.is-selected{border-color:var(--violet-600);background:linear-gradient(180deg,#f4f0ff,#fbfaff);box-shadow:0 0 0 2px rgba(118,88,244,.10),0 8px 20px rgba(78,61,160,.08)}
.magic-buy-price-row{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid var(--line);margin-top:17px;padding-top:17px}.magic-buy-price-row>div{display:flex;align-items:baseline;gap:9px}.magic-buy-price-row>a{font-size:11px;font-weight:750;color:var(--violet-700);text-decoration:none}.magic-order-row{grid-template-columns:122px 1fr}.magic-buy-note{font-size:10px;line-height:1.5;margin:10px 0 0;color:var(--ink-400)}
.magic-helper-links{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.magic-helper-links a{text-decoration:none;color:var(--ink-950);padding:15px 16px;border:1px solid var(--line);border-radius:16px;background:#fff}.magic-helper-links b{display:block;font-size:12px;margin-bottom:4px}.magic-helper-links span{display:block;font-size:10px;color:var(--violet-700);font-weight:700}
.magic-volume-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.magic-volume-card{border:1px solid var(--line);border-radius:23px;background:#fff;overflow:hidden;transition:.18s ease}.magic-volume-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-sm)}.magic-volume-card.is-selected,.magic-volume-card.is-primary{border-color:#cfc5fb;box-shadow:0 0 0 3px rgba(118,88,244,.055)}.magic-volume-image{position:relative;height:260px;display:grid;place-items:center;padding:20px;background:linear-gradient(180deg,#fff,#f7f8fb)}.magic-volume-image img{width:100%;height:100%;object-fit:contain}.magic-volume-ribbon{position:absolute;left:14px;top:14px;padding:7px 9px;border-radius:999px;background:var(--violet-600);color:#fff;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.05em}.magic-volume-copy{padding:20px}.magic-volume-copy>span{font-size:9px;font-weight:850;color:var(--violet-700);text-transform:uppercase;letter-spacing:.06em}.magic-volume-copy h3{font-size:27px;margin:7px 0 8px}.magic-volume-copy p{min-height:42px;color:var(--ink-500);font-size:12px;line-height:1.55;margin:0}.magic-volume-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.magic-volume-bottom b{font-size:12px}.magic-volume-bottom span{font-size:10px;color:var(--ink-500)}.magic-volume-copy button{width:100%;margin-top:13px;min-height:40px;border:1px solid var(--line-strong);border-radius:12px;background:#fff;color:var(--ink-900);font-size:11px;font-weight:800;cursor:pointer}.magic-volume-card.is-selected .magic-volume-copy button,.magic-volume-copy button:hover{border-color:var(--violet-600);background:var(--violet-600);color:#fff}
.magic-use-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.magic-use-grid article{border:1px solid var(--line);border-radius:21px;background:#fff;overflow:hidden}.magic-use-media{height:210px;position:relative;overflow:hidden}.magic-use-media img{width:100%;height:100%;object-fit:cover}.magic-use-media span{position:absolute;left:13px;top:13px;z-index:2;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.93);font-size:11px;font-weight:850}.magic-use-grid h3{font-size:18px;margin:17px 18px 7px}.magic-use-grid p{font-size:11px;line-height:1.55;color:var(--ink-500);margin:0;padding:0 18px 19px}
.magic-details-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:start}.magic-characteristics h2{margin-bottom:22px}.magic-char-list{border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden}.magic-char-list>div{display:grid;grid-template-columns:210px 1fr;gap:24px;padding:15px 18px;border-bottom:1px solid var(--line);align-items:start}.magic-char-list>div:last-child{border-bottom:0}.magic-char-list span{font-size:11px;color:var(--ink-500)}.magic-char-list b{font-size:12px;line-height:1.5}.magic-practice-card{position:sticky;top:104px;border:1px solid #ded9f7;border-radius:24px;padding:26px;background:radial-gradient(circle at 90% 10%,rgba(118,88,244,.08),transparent 24%),#fbfbff}.magic-practice-card h3{font-size:26px;line-height:1.12;margin:12px 0}.magic-practice-card p{font-size:13px;line-height:1.7;color:var(--ink-600);margin-bottom:18px}.magic-practice-card .btn{width:100%;justify-content:center}.magic-text-link{display:block;margin-top:13px;text-align:center;color:var(--violet-700);font-size:11px;font-weight:750;text-decoration:none}
.magic-docs-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:30px;align-items:center}.magic-docs-copy p{color:var(--ink-600);font-size:14px;line-height:1.7;max-width:500px}.magic-doc-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.magic-doc-points span{padding:8px 10px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:10px;font-weight:700}.magic-doc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.magic-doc-cards a{overflow:hidden;border:1px solid var(--line);border-radius:19px;background:#fff;text-decoration:none;color:var(--ink-950)}.magic-doc-cards img{width:100%;height:240px;object-fit:cover;object-position:top;display:block}.magic-doc-cards span{display:block;padding:12px 13px;font-size:11px;font-weight:750}
.magic-related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.magic-related-grid a{min-height:160px;padding:21px;border:1px solid var(--line);border-radius:20px;background:#fff;text-decoration:none;color:var(--ink-950)}.magic-related-grid a>span{font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;color:var(--violet-700)}.magic-related-grid h3{font-size:18px;margin:8px 0}.magic-related-grid p{font-size:11px;line-height:1.55;color:var(--ink-500);margin:0}.magic-final-cta{padding-top:0}.magic-final-cta .home-cta-media img{object-fit:contain;padding:18px;filter:drop-shadow(0 24px 40px rgba(0,0,0,.16))}
@media(max-width:1100px){.magic-hero-grid{grid-template-columns:1fr}.magic-gallery{position:static;max-width:680px}.magic-volume-grid{grid-template-columns:repeat(2,1fr)}.magic-use-grid,.magic-related-grid{grid-template-columns:repeat(2,1fr)}.magic-details-grid,.magic-docs-grid{grid-template-columns:1fr}.magic-practice-card{position:static;max-width:none}}
@media(max-width:760px){.magic-product-page .section{padding:62px 0}.magic-hero{padding:20px 0 50px}.magic-gallery-main{min-height:390px;padding:20px}.magic-gallery-main>img{height:350px}.magic-gallery-thumbs{grid-template-columns:repeat(3,1fr)}.magic-gallery-thumbs img{height:62px}.magic-summary h1{font-size:52px}.magic-summary-lead{font-size:15px}.magic-proof-row{grid-template-columns:1fr}.magic-buy-card{padding:18px;border-radius:22px}.magic-buy-head{align-items:flex-start}.magic-store-variants{grid-template-columns:repeat(3,1fr)}.magic-store-variants .store-variant img{height:66px}.magic-helper-links,.magic-volume-grid,.magic-use-grid,.magic-related-grid,.magic-doc-cards{grid-template-columns:1fr}.magic-volume-image{height:230px}.magic-volume-copy p{min-height:0}.magic-use-media{height:245px}.magic-char-list>div{grid-template-columns:1fr;gap:5px}.magic-doc-cards a{display:grid;grid-template-columns:120px 1fr;align-items:center}.magic-doc-cards img{height:120px}.magic-order-row{grid-template-columns:1fr}}
@media(max-width:420px){.magic-gallery-main{min-height:330px}.magic-gallery-main>img{height:300px}.magic-summary h1{font-size:46px}.magic-store-variants{grid-template-columns:repeat(2,1fr)}}

/* v3.7 SEO architecture blocks */
.home-categories .card-grid,.home-audience .card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.home-categories .card,.home-audience .card{display:block;padding:28px;border-radius:24px;background:var(--surface-soft);text-decoration:none}
@media(max-width:760px){.home-categories .card-grid,.home-audience .card-grid{grid-template-columns:1fr}}