/* VelmoFX — Grid Liner product page.
   Layout: the page opens on a live 2 x 2 grid; quiet light sections, one black-and-green playground.
   Colors come from the moss picture: a fresh green for marks and buttons, a deep green for text accents. */
:root{
  --g:#4f9a24;            /* points, buttons */
  --g-deep:#3a7d18;       /* green text on light */
  --g-lime:#8fd14f;       /* green on black */
  --g-soft:#eef6e6;       /* pale green fill */
  --gl-line:rgba(29,29,31,.26);
  --gl-dash:repeating-linear-gradient(90deg,var(--gl-line) 0 8px,transparent 8px 15px);
  --gl-edge:max(24px,calc(50% - 566px));
  --d-bg:#0a0d09;
  --d-card:#141912;
  --d-card-2:#1b2118;
  --d-line:rgba(255,255,255,.09);
  --d-ink:#f1f5ed;
  --d-muted:#99a592;
}
.gl{position:relative;overflow:hidden}
.gl > section{position:relative;z-index:1}
.gl-green{color:var(--g-deep)}
.gl-lime{color:var(--g-lime)}
.gl .kicker{color:var(--g-deep)}

/* green buttons on this page */
.btn--primary{background:linear-gradient(180deg,#3d7e1b,#2f6614);color:#fff;box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 8px 22px -8px rgba(63,138,31,.75)}
.btn--primary:hover{box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 12px 28px -8px rgba(63,138,31,.85)}
:focus-visible{outline-color:rgba(79,154,36,.55)}

/* full-width grid line between two parts of the page */
.gl-rule{position:relative;height:0;z-index:2}
.gl-rule::before{content:"";position:absolute;left:0;right:0;top:-.75px;height:1.5px;background:var(--gl-dash)}
.gl-rule i{position:absolute;top:0;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;background:#fff;border:3.2px solid var(--g);box-sizing:border-box;transform:scale(0);transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.gl-rule i:nth-child(1){left:var(--gl-edge)}
.gl-rule i:nth-child(2){left:calc(100% - var(--gl-edge))}
.gl-rule.is-in i{transform:none}
.gl-rule.is-in i:nth-child(2){transition-delay:.08s}

/* ---------------- grid engine pieces ---------------- */
.glg__svg{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:3}
.glg__cells{position:absolute;inset:0;pointer-events:none;z-index:0}
.glg__cells i{position:absolute;left:0;top:0;border-radius:8px;background:#eef0ec}
.glg__item{position:absolute;left:0;top:0;overflow:hidden;z-index:1}
.glg__item img{position:absolute;left:0;top:0;max-width:none;user-select:none;-webkit-user-drag:none;pointer-events:none}
.glg__cursor{position:absolute;left:0;top:0;width:26px;height:26px;margin:-3px 0 0 -5px;z-index:6;pointer-events:none;opacity:0;transition:opacity .2s ease}
.glg__cursor.is-on{opacity:1}
.glg__cursor svg,.st__cur svg{width:100%;height:100%;fill:#111;stroke:#fff;stroke-width:1.5;stroke-linejoin:round;filter:drop-shadow(0 2px 3px rgba(0,0,0,.3))}
.gl-img{background:#e4e4e4}
.gl-txt{display:flex;align-items:center;justify-content:center}
.gl-txt span{font-weight:800;letter-spacing:-.045em;color:#1d1d1f;white-space:nowrap;line-height:1}

/* ---------------- HERO ---------------- */
.glh{position:relative;height:clamp(620px,calc(100vh - 70px),800px);margin-top:-6px;user-select:none;-webkit-user-select:none;touch-action:pan-y}
.glh .glg__svg{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%)}
.glh:not(.is-ready) .glh__cell{position:absolute;opacity:0}
.glh__cell--moss{background:#e4e4e4}
.glh__in{position:absolute;left:0;top:0;display:flex;flex-direction:column}
.glh__cell--title .glh__in{padding:34px 38px;justify-content:center}
.glh__cell--buy .glh__in{padding:32px 38px;justify-content:center}
.glh__eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:18px}
.glh__mark{width:26px;height:26px;border-radius:7px;background:linear-gradient(180deg,#62b334,#3f8a1f);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 3px 8px -3px rgba(63,138,31,.7);display:grid;place-items:center}
.glh__mark svg{width:17px;height:17px}
.glh__title{font-size:clamp(58px,7.6vw,100px);font-weight:800;letter-spacing:-.05em;line-height:.92}
.glh__tag{margin-top:18px;font-size:clamp(18px,1.6vw,22px);font-weight:600;color:var(--ink-2);letter-spacing:-.01em;line-height:1.3;max-width:420px}
.glh__price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.glh__now{font-size:46px;font-weight:800;letter-spacing:-.035em;line-height:1}
.glh__was{font-size:21px}
.glh__save{font-size:13px;font-weight:800;color:var(--lime-ink);background:var(--lime);padding:5px 11px;border-radius:999px;align-self:center;box-shadow:var(--lime-glow)}
.glh__btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.glh__facts{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,max-content);gap:8px 26px;font-size:14px;font-weight:600;color:var(--ink-2)}
.glh__facts li{display:flex;align-items:center;gap:9px}
.glh__facts li::before{content:"";width:9px;height:9px;border:2.6px solid var(--g);background:#fff;flex:none}
.glh__hint{position:absolute;right:calc(var(--gl-edge) + 20px);bottom:16px;font-size:12.5px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:7px;opacity:0;transition:opacity .6s ease .2s;z-index:4;pointer-events:none}
.glh.is-open .glh__hint{opacity:1}
.glh__hint svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glh__below{display:none}

/* ---------------- section heads ---------------- */
.gl-head{max-width:760px;margin:0 auto 54px;text-align:center}
.gl-head h2{font-size:clamp(34px,4.4vw,56px);text-wrap:balance}
.gl-head .sub{margin-top:16px}

/* ---------------- 3 step cards ---------------- */
.sts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.st{position:relative;background:#fff;border-radius:26px;box-shadow:0 0 0 1px rgba(0,0,0,.05),0 26px 60px -36px rgba(20,40,10,.35);overflow:hidden;display:flex;flex-direction:column}
.st__canvas{position:relative;margin:14px 14px 0;height:230px;border-radius:16px;background:#f4f5f2;overflow:hidden}
.st__photo{position:absolute;left:22%;right:22%;top:17%;bottom:17%;border-radius:4px;overflow:hidden;box-shadow:0 10px 24px -14px rgba(0,0,0,.45)}
.st__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 80%}
.st__grid{position:absolute;inset:0;opacity:0;transition:opacity .35s ease}
.st__grid.is-on{opacity:1}
.st__target{position:absolute;left:0;top:0;border-radius:4px;box-shadow:inset 0 0 0 2px var(--g);background:rgba(79,154,36,.1);opacity:0;transition:opacity .25s ease;z-index:2;pointer-events:none}
.st__target.is-on{opacity:1}
.st__drop{opacity:0;transition:opacity .35s ease}
.st__drop.is-in{opacity:1}
.st__bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 14px 0;padding:8px 8px 8px 14px;border-radius:14px;background:#f4f5f2;height:52px;box-sizing:border-box}
.st__sel{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:650;color:var(--ink-2);min-width:0;white-space:nowrap}
.st__dot{width:8px;height:8px;border-radius:2px;border:2px solid var(--g);background:#fff;flex:none}
.st__btn{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;border-radius:10px;background:#1d1d1f;color:#fff;font-size:13.5px;font-weight:700;white-space:nowrap;transition:transform .15s ease,background .25s ease;user-select:none}
.st__btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.st__btn.is-press{transform:scale(.93)}
.st__btn.is-done,.st__btn.is-on{background:var(--g)}
.st__btn--go{background:var(--g)}
.st__btn--go.is-on{background:#2f6a14}
.st__lib{display:flex;align-items:center;gap:10px;min-width:0}
.st__thumb{width:52px;height:34px;border-radius:6px;overflow:hidden;background:#e4e4e4;box-shadow:0 0 0 1px rgba(0,0,0,.06);flex:none;transition:transform .15s ease,opacity .25s ease}
.st__thumb img{width:100%;height:100%;object-fit:cover}
.st__thumb.is-press{transform:scale(.92)}
.st__thumb.is-taken{opacity:.25}
.st__libname{font-size:13.5px;font-weight:650;color:var(--ink-2);white-space:nowrap}
.st__mode{font-size:12px;font-weight:700;color:var(--g-deep);background:var(--g-soft);padding:5px 10px;border-radius:999px}
.st__ghost{position:absolute;left:0;top:0;width:78px;height:50px;border-radius:7px;overflow:hidden;background:#e4e4e4;box-shadow:0 14px 26px -10px rgba(0,0,0,.45),0 0 0 2px #fff;opacity:0;z-index:7;pointer-events:none;transition-property:transform;transition-timing-function:cubic-bezier(.45,0,.25,1)}
.st__ghost.is-on{opacity:1}
.st__ghost img{width:100%;height:100%;object-fit:cover}
.st__cur{position:absolute;left:0;top:0;width:26px;height:26px;margin:-3px 0 0 -5px;z-index:8;pointer-events:none;opacity:0;transition-property:transform,opacity;transition-timing-function:cubic-bezier(.45,0,.25,1),ease;transition-duration:0ms,.25s}
.st__cur.is-on{opacity:1}
.st__cur svg{transition:transform .12s ease;transform-origin:20% 15%}
.st__cur.is-down svg{transform:scale(.85)}
.st__copy{padding:22px 24px 26px}
.st__num{font-size:12.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--g-deep)}
.st__copy h3{font-size:24px;margin-top:8px;letter-spacing:-.02em}
.st__copy p:last-child{margin-top:8px;color:var(--ink-2);font-size:16px;line-height:1.5}

/* ---------------- playground: black + green ---------------- */
.gl-dark{background:var(--d-bg);color:var(--d-ink)}
.gl-dark .kicker{color:var(--g-lime)}
.gl-dark .sub{color:var(--d-muted)}
.glp{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:stretch}
.glp__stagewrap{position:relative;display:flex;flex-direction:column;border-radius:24px;background:#0e120c;box-shadow:0 0 0 1px var(--d-line),0 40px 90px -40px rgba(0,0,0,.8);overflow:hidden}
.glp__bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--d-line);font-size:13px;font-weight:600;color:var(--d-muted)}
.glp__bar i{width:10px;height:10px;border-radius:50%;background:#2a3226}
.glp__bar span{margin-left:8px}
.glp__live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;background:rgba(143,209,79,.12);color:var(--g-lime);font-size:11.5px;font-weight:700;padding:4px 10px;border-radius:999px}
.glp__live::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--g-lime)}
.is-playing .glp__live{background:var(--g-lime);color:#0a0d09}
.is-playing .glp__live::before{background:#0a0d09}
.glp__stage{position:relative;flex:1;min-height:440px;touch-action:none;user-select:none;-webkit-user-select:none;overflow:hidden;background:#0e120c}
.glp__stage .gl-txt span{color:#f4f7f0}
.glp__stage .glg__cells i{background:rgba(255,255,255,.05)}
.glp__stage .glg__cursor svg{fill:#fff;stroke:#0a0d09}
.glp__hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:7;background:rgba(143,209,79,.14);color:var(--g-lime);font-size:13px;font-weight:650;padding:8px 14px;border-radius:999px;display:flex;align-items:center;gap:8px;pointer-events:none;transition:opacity .4s ease,transform .4s ease;white-space:nowrap;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.glp__hint svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.glp__hint.is-gone{opacity:0;transform:translate(-50%,8px)}

.glc{background:var(--d-card);border-radius:24px;box-shadow:0 0 0 1px var(--d-line);padding:14px;display:flex;flex-direction:column;gap:10px;font-size:14px}
.glc__head{display:flex;align-items:center;gap:10px;padding:4px 4px 2px}
.glc__logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(180deg,#62b334,#3f8a1f);box-shadow:inset 0 1px 0 rgba(255,255,255,.25);display:grid;place-items:center;flex:none}
.glc__logo svg{width:22px;height:22px}
.glc__name{font-weight:800;font-size:17px;letter-spacing:-.02em;line-height:1.1;color:var(--d-ink)}
.glc__name b{font-weight:800;background:linear-gradient(180deg,#a3e062,#7cc13d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#8fd14f}
.glc__by{font-size:11.5px;font-weight:600;color:var(--d-muted)}
.glc__ver{margin-left:auto;font-size:11px;font-weight:700;color:var(--d-muted);background:var(--d-card-2);padding:3px 8px;border-radius:6px}
.glc__preview{background:#0e120c;border-radius:14px;padding:8px;box-shadow:inset 0 0 0 1px var(--d-line)}
.glc__mini{display:block;width:100%;height:auto}
.glc__card{background:var(--d-card-2);border-radius:16px;padding:12px 12px 13px;display:flex;flex-direction:column;gap:10px}
.glc__label{font-size:11.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--d-muted)}
.glc__row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.glc__k{font-weight:650;color:var(--d-ink);font-size:14px;flex:none;min-width:58px}
.glc__step{display:flex;align-items:center;gap:4px;background:#0e120c;border-radius:12px;padding:3px}
.glc__step button{width:34px;height:32px;border-radius:9px;border:0;background:var(--d-card-2);color:var(--d-ink);font-size:18px;font-weight:600;line-height:1;cursor:pointer;transition:background .15s ease,transform .12s ease}
.glc__step button:hover{background:#262e22}
.glc__step button:active{transform:scale(.92)}
.glc__step button:disabled{opacity:.3;cursor:default}
.glc__step output{min-width:30px;text-align:center;font-weight:800;font-size:16px;font-variant-numeric:tabular-nums;color:var(--d-ink)}
.glc__seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:#0e120c;border-radius:11px;padding:3px;gap:2px;flex:1;min-width:0}
.glc__seg button{border:0;background:transparent;border-radius:8px;padding:7px 4px;font-size:12.5px;font-weight:650;color:var(--d-muted);cursor:pointer;transition:background .15s ease,color .15s ease;white-space:nowrap}
.glc__seg button:hover{color:var(--d-ink)}
.glc__seg button[aria-pressed="true"]{background:var(--d-card-2);color:var(--g-lime);box-shadow:0 0 0 1px rgba(143,209,79,.25)}
.glc__mouse{display:flex;flex-direction:column;gap:8px}
.glc__tip{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.4;color:var(--d-muted)}
.glc__tip svg{width:16px;height:16px;flex:none;margin-top:1px;fill:var(--g-lime)}
.glc__marks{font-size:13.5px;font-weight:700;color:var(--g-lime)}
.glc__link{border:0;background:none;color:var(--d-muted);font:inherit;font-size:13px;font-weight:650;cursor:pointer;padding:4px 2px;text-decoration:underline;text-underline-offset:3px}
.glc__link:hover{color:var(--d-ink)}
.glc__link:disabled{opacity:.35;cursor:default;text-decoration:none}
.glc__input{flex:1;min-width:0;border:0;background:#0e120c;border-radius:10px;padding:9px 11px;font:inherit;font-size:14px;font-weight:600;color:var(--d-ink)}
.glc__input:focus{outline:2px solid rgba(143,209,79,.5);outline-offset:0}
.glc__go{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:auto}
.glc__animate{display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:13px;padding:14px 16px;font:inherit;font-size:15.5px;font-weight:800;color:#0a0d09;background:linear-gradient(180deg,#a3e062,#7cc13d);cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 24px -12px rgba(143,209,79,.8);transition:transform .15s ease,filter .2s ease}
.glc__animate:hover{filter:brightness(1.05)}
.glc__animate:active{transform:scale(.98)}
.glc__animate svg{width:15px;height:15px;fill:currentColor}
.glc__animate.is-on{background:#f1f5ed;box-shadow:none}
.glc__animate.is-on svg{display:none}
.glc__reset{border:0;border-radius:13px;padding:0 16px;font:inherit;font-size:14px;font-weight:700;background:var(--d-card-2);color:var(--d-ink);cursor:pointer;box-shadow:inset 0 0 0 1px var(--d-line)}
.glc__reset:hover{background:#262e22}

/* ---------------- result + features ---------------- */
.glr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;position:relative}
.glr__media{position:relative;aspect-ratio:1/1;background:#fff;overflow:hidden}
.glr__media video,.glr__media img{width:100%;height:100%;object-fit:cover}
.glr__feats{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;position:relative}
.glf{position:relative;padding:28px 26px;min-width:0}
.glf::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1.5px;background:repeating-linear-gradient(180deg,var(--gl-line) 0 8px,transparent 8px 15px)}
.glf::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--gl-dash)}
.glf:nth-last-child(-n+2)::after{display:none}
.glf__ic{width:38px;height:38px;border-radius:11px;background:var(--g-soft);display:grid;place-items:center;color:var(--g-deep)}
.glf__ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.glf h3{font-size:19px;margin-top:16px;letter-spacing:-.015em}
.glf p{margin-top:7px;font-size:15px;color:var(--ink-2);line-height:1.45}
.glr__frame{position:relative}
.glr__frame::before,.glr__frame::after{content:"";position:absolute;left:-100vw;right:-100vw;height:1.5px;background:var(--gl-dash);z-index:1}
.glr__frame::before{top:0}
.glr__frame::after{bottom:0}

/* ---------------- dark + light ---------------- */
.glm{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:760px;margin:0 auto}
.glm figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:16px}
.glm__shot{width:100%;max-width:340px;border-radius:26px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.07),0 34px 70px -36px rgba(16,40,10,.45)}
.glm__shot img{width:100%;height:auto}
.glm figcaption{display:flex;align-items:center;gap:8px;font-weight:700;font-size:15px;color:var(--ink-2)}
.glm figcaption svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------------- specs ---------------- */
.glt{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.glt__c{padding:22px 22px 20px;background:#fff;border-radius:18px;box-shadow:0 0 0 1px rgba(0,0,0,.05)}
.glt__k{font-size:12.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.glt__v{margin-top:8px;font-size:18px;font-weight:650;letter-spacing:-.01em}

/* ---------------- FAQ ---------------- */
.glq details{border-bottom:1px solid rgba(29,29,31,.1)}
.glq details:first-child{border-top:1px solid rgba(29,29,31,.1)}
.glq summary{list-style:none;cursor:pointer;padding:22px 44px 22px 0;font-weight:650;font-size:18px;position:relative}
.glq summary::-webkit-details-marker{display:none}
.glq summary::after{content:"";position:absolute;right:6px;top:50%;width:12px;height:12px;margin-top:-6px;border:3px solid var(--g);background:#fff;box-sizing:border-box;transition:transform .3s ease,background .3s ease}
.glq details[open] summary::after{transform:rotate(45deg);background:var(--g)}
.glq details p{padding:0 44px 22px 0;color:var(--ink-2)}
.glq a{color:var(--g-deep);text-decoration:underline;text-underline-offset:2px}

/* ---------------- final ---------------- */
.glx{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;background:#fff;border-radius:28px;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 40px 90px -40px rgba(16,40,10,.4)}
.glx__copy{padding:54px 50px;display:flex;flex-direction:column;justify-content:center}
.glx__copy h2{font-size:clamp(34px,4vw,52px);letter-spacing:-.035em}
.glx__copy .glh__price{margin-top:24px}
.glx__note{margin-top:18px;font-size:14px;color:var(--muted);font-weight:600}
.glx__img{position:relative;min-height:380px;background:#fff}
.glx__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* buy bar (small screens) */
.buybar{position:fixed;left:12px;right:12px;bottom:12px;z-index:60;display:none;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);border-radius:999px;box-shadow:0 10px 30px -8px rgba(0,0,0,.25),inset 0 0 0 1px var(--line);transform:translateY(160%);transition:transform .35s ease}
.buybar.is-visible{transform:none}
.buybar__price{font-size:15px;line-height:1.2;display:flex;flex-wrap:wrap;gap:0 8px;align-items:baseline}
.buybar__price strong{font-size:18px}
.buybar__price span{flex-basis:100%;font-size:12px;color:var(--muted)}

.gl-toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,140%);z-index:80;background:#1d1d1f;color:#fff;padding:12px 18px;border-radius:14px;font-size:14px;font-weight:600;box-shadow:0 14px 34px -10px rgba(0,0,0,.4);transition:transform .35s ease;max-width:calc(100% - 32px);text-align:center}
.gl-toast.is-on{transform:translate(-50%,0)}

/* ---------------- responsive ---------------- */
@media (max-width:1060px){
  .glp{grid-template-columns:1fr}
  .glp__stage{flex:none;min-height:0;aspect-ratio:16/10.5}
  .glc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .glc__head,.glc__go{grid-column:1/-1}
  .glc__preview{grid-row:span 2}
  .sts{grid-template-columns:1fr;max-width:520px;margin:0 auto}
  .glr{grid-template-columns:1fr}
  .glr__media{max-width:560px;width:100%;margin:0 auto}
}
@media (max-width:900px){
  .glh__cell--buy .glh__in,.glh__cell--title .glh__in{padding:26px 26px}
  .glh__facts{grid-template-columns:1fr}
  .glt{grid-template-columns:1fr 1fr}
  .glx{grid-template-columns:1fr}
  .glx__copy{padding:40px 28px}
  .glx__img{min-height:300px}
}
@media (max-width:759px){
  .glh{height:min(122vw,580px)}
  .glh__cell--title .glh__in{padding:16px 14px;justify-content:flex-end}
  .glh__eyebrow{display:none}
  .glh__title{font-size:clamp(36px,11.6vw,60px)}
  .glh__title span{display:block}
  .glh__tag{display:none}
  .glh__cell--buy .glh__in{padding:16px 14px;justify-content:flex-end}
  .glh__now{font-size:34px}
  .glh__was,.glh__save,.glh__facts,.glh__btns .btn--ghost{display:none}
  .glh__btns{margin-top:12px}
  .glh__btns .btn{padding:11px 18px;font-size:15px}
  .glh__hint{display:none}
  .glh__below{display:block;padding:18px 24px 6px}
  .glh__below .glh__tag{display:block;font-size:18px;margin:0}
  .glh__below .glh__facts{display:grid;grid-template-columns:repeat(2,max-content);margin-top:16px}
  .glh__below .btn{margin-top:18px}
  .glp__stage{aspect-ratio:4/5}
  .glc{grid-template-columns:1fr}
  .glc__preview{grid-row:auto}
  .glr__feats{grid-template-columns:1fr}
  .glf:nth-last-child(-n+2)::after{display:block}
  .glf:last-child::after{display:none}
  .glm{gap:14px}
  .glt{grid-template-columns:1fr}
  .buybar{display:flex}
}
@media (prefers-reduced-motion:reduce){
  .gl-rule i{transition:none;transform:none}
  .glp__hint,.glh__hint,.st__cur,.st__ghost{transition:none}
}

.gl-liner{background:linear-gradient(180deg,#62b334,#3f8a1f);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#4f9a24;padding-right:.04em}


/* small details under the price: quiet, Apple-style */
.glh__facts{gap:9px 26px;font-size:13.5px;font-weight:500;letter-spacing:-.005em;color:var(--muted)}
.glh__facts li{gap:9px}
.glh__facts li::before{width:4px;height:8.5px;border:solid var(--g);border-width:0 1.7px 1.7px 0;border-radius:0 0 1px 0;background:none;transform:translateY(-2px) rotate(45deg);margin:0 2px 0 3px}
.glx__note{font-size:13.5px;font-weight:500;letter-spacing:-.005em}