/* ==========================================================================
   FORGE — home page
   ========================================================================== */
.sec { padding-block: var(--section); }
.sec-head .h-1 em { color: var(--ink); background: linear-gradient(transparent 58%, var(--safety) 58% 88%, transparent 88%); padding: 0 .04em; }
.platform .sec-head .h-1 em, .trade .h-1 em { background: none; padding: 0; }

/* ---------- SEC 01 · HERO ---------- */
.hero { position: relative; background: var(--surface-shell); color: var(--text-on-shell); overflow: hidden; isolation: isolate; }
.hero__bg { position: absolute; inset: 0; z-index: -2; -webkit-mask-image: radial-gradient(120% 90% at 68% 45%, #000 30%, transparent 85%); mask-image: radial-gradient(120% 90% at 68% 45%, #000 30%, transparent 85%); }
.hero__gear { position: absolute; z-index: -1; right: -14vw; top: 50%; width: min(1100px, 82vw); aspect-ratio: 1; translate: 0 -50%; color: rgba(237, 238, 240, .07); animation: spin 140s linear infinite; pointer-events: none; }
@keyframes spin { to { rotate: 360deg; } }
.hero__slides { display: grid; }
.slide { grid-area: 1 / 1; position: relative; visibility: hidden; opacity: 0; transition: opacity .6s var(--ease-standard), visibility 0s .6s; }
.slide.is-active { visibility: visible; opacity: 1; transition: opacity .6s var(--ease-standard); z-index: 1; }
.slide__in { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); align-items: center; gap: clamp(24px, 4vw, 64px); min-height: clamp(580px, calc(100svh - var(--bar-h) - var(--head-h) - var(--nav-h)), 820px); padding-block: clamp(32px, 4vw, 56px) 116px; }
.slide__title.h-display { font-size: clamp(3.4rem, 7.2vw, 7.6rem); }
.slide__copy { position: relative; z-index: 2; display: grid; justify-items: start; gap: 22px; }
.slide__title { margin-top: 2px; }
.slide__title .ln { display: block; overflow: hidden; padding-bottom: .04em; }
.slide__title .ln > span { display: inline-block; transform: translateY(108%); transition: transform 1s var(--ease-out); }
.slide__title .ln:nth-child(2) > span { transition-delay: .08s; }
.slide.is-active .slide__title .ln > span { transform: none; transition-delay: .18s; }
.slide.is-active .slide__title .ln:nth-child(2) > span { transition-delay: .28s; }
.slide .lede { color: var(--shell-10); }
.slide__copy > .sec-tag, .slide__copy > .lede, .slide__cta, .slide__facts { opacity: 0; transform: translateY(14px); transition: opacity .6s var(--ease-out), transform .8s var(--ease-out); }
.slide.is-active .slide__copy > .sec-tag { opacity: 1; transform: none; transition-delay: .1s; }
.slide.is-active .slide__copy > .lede { opacity: 1; transform: none; transition-delay: .42s; }
.slide.is-active .slide__cta { opacity: 1; transform: none; transition-delay: .52s; }
.slide.is-active .slide__facts { opacity: 1; transform: none; transition-delay: .62s; }
.slide__cta { display: flex; gap: 10px; flex-wrap: wrap; }
.slide__facts { display: flex; gap: 0; margin-top: 4px; border-top: 1px solid var(--border-on-shell); padding-top: 16px; }
.slide__facts li { padding-right: 22px; margin-right: 22px; border-right: 1px solid var(--border-on-shell); font: 500 var(--text-2xs)/1.3 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--shell-10); }
.slide__facts li:last-child { border-right: 0; margin-right: 0; }
.slide__facts b { display: block; margin-bottom: 4px; font: 800 1.45rem/1 var(--font-display); letter-spacing: .01em; color: var(--shell-12); }
.slide__photo { position: absolute; inset: 0; z-index: -1; }
.slide__photo img { width: 100%; height: 100%; object-fit: cover; opacity: .5; transform: scale(1.08); transition: transform 8s linear; }
.slide.is-active .slide__photo img { transform: scale(1); }
.slide__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--shell-2) 22%, rgba(20, 21, 23, .55) 60%, rgba(20, 21, 23, .3)), linear-gradient(0deg, var(--shell-2), transparent 40%); }

/* stage */
.stage { position: relative; align-self: stretch; display: grid; place-items: center; min-height: 420px; clip-path: inset(0 100% 0 0); transition: clip-path 1.05s var(--ease-snap) .1s; }
.slide.is-active .stage { clip-path: inset(-20% -20% -20% -20%); }
.stage__svg { width: 100%; height: auto; max-height: 640px; overflow: visible; color: var(--safety); }
.stage__svg .tool { animation: bob 7s var(--ease-standard) infinite; }
@keyframes bob { 50% { transform: translateY(-6px); } }
.stage__rings { fill: none; stroke: rgba(237, 238, 240, .1); stroke-width: 1; vector-effect: non-scaling-stroke; }
.stage__reg path, .stage__reg circle { fill: none; stroke: rgba(237, 238, 240, .35); stroke-width: 1; }
.stage .dim text { font-size: 9.5px; fill: var(--shell-12); letter-spacing: .12em; }
.stage__plate { position: absolute; right: 0; bottom: 4%; width: min(300px, 46%); opacity: 0; transform: translateY(20px); transition: opacity .6s var(--ease-out) .9s, transform .8s var(--ease-out) .9s; }
.slide.is-active .stage__plate { opacity: 1; transform: none; }
.stage__plate .plate__foot b { font: 800 1.15rem/1 var(--font-display); color: var(--safety); letter-spacing: .02em; }
.stage__plate .plate__foot small { font: inherit; }

/* trade card */
.stage--card { perspective: 1200px; }
.tcard { position: relative; width: min(440px, 78%); aspect-ratio: 85.6 / 53.98; transform-style: preserve-3d; transition: transform .5s var(--ease-out); }
.tcard__face { --c: 22px; position: absolute; inset: 0; display: grid; grid-template-rows: auto 1fr auto auto; padding: 22px 24px 18px; color: var(--shell-12); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c));
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .025) 0 1px, transparent 1px 3px), linear-gradient(125deg, #4a4f57 0%, #26292d 38%, #141517 62%, #353940 100%);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .16); }
.tcard__face::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .14) 45%, transparent 60%); pointer-events: none; }
.tcard__top { display: flex; justify-content: space-between; align-items: flex-start; }
.tcard__top .wm--bakal i { color: var(--safety); border-color: var(--safety); }
.tcard__chip { width: 46px; height: 34px; background: linear-gradient(135deg, #ffd57a, #ffb000 50%, #c88600); clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .2); }
.tcard__no { align-self: center; font-size: clamp(12px, 1.3vw, 16px); letter-spacing: .14em; color: var(--shell-11); }
.tcard__rows { display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; gap: 10px; font-size: 10px; letter-spacing: .1em; }
.tcard__rows dt { color: var(--shell-9); }
.tcard__rows dd { margin-top: 4px; color: var(--shell-12); font-weight: 600; }
.tcard__foot { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; font-size: 9px; letter-spacing: .2em; color: var(--shell-9); }
.tcard__haz { width: 60px; height: 8px; }
.tcard__dim { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; color: var(--safety); pointer-events: none; }
.tcard__dim text { font-size: 10px; fill: var(--shell-12); letter-spacing: .12em; }
.chipstat { --c: 10px; position: absolute; display: grid; gap: 4px; padding: 14px 18px; clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease-out), transform .8s var(--ease-out); }
.chipstat b { font: 800 1.7rem/1 var(--font-display); color: var(--safety); }
.chipstat span { font: 500 10px/1.2 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--shell-11); }
.cs-1 { left: 2%; top: 8%; } .cs-2 { right: -1%; top: 64%; } .cs-3 { left: 6%; bottom: 6%; }
.slide.is-active .chipstat { opacity: 1; transform: none; }
.slide.is-active .cs-1 { transition-delay: .7s; } .slide.is-active .cs-2 { transition-delay: .85s; } .slide.is-active .cs-3 { transition-delay: 1s; }

/* exploded kit */
.stage--kit { padding-bottom: 30px; }
.kitx { position: relative; width: 100%; aspect-ratio: 1.3; }
.kx { position: absolute; aspect-ratio: 1; }
.kx .tool { width: 100%; height: 100%; }
.kx__no { --c: 5px; position: absolute; left: 12%; top: 12%; width: 26px; height: 26px; display: grid; place-items: center; background: var(--safety); color: var(--ink); font: 600 11px/1 var(--font-mono); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.stage--kit .kx { opacity: 0; transform: translate(calc((var(--i) - 2.5) * -14px), 14px) scale(.94); transition: opacity .6s var(--ease-out), transform .9s var(--ease-out); }
.slide.is-active .stage--kit .kx { opacity: 1; transform: none; transition-delay: calc(.35s + var(--i) * .08s); }
.bom { --c: 12px; position: absolute; right: 0; bottom: 0; width: min(300px, 42%); padding: 14px 16px 12px; clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); }
.bom__head { display: flex; justify-content: space-between; padding-bottom: 8px; border-bottom: 1px solid var(--border-on-shell); font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--safety); }
.bom ol li { display: grid; grid-template-columns: 22px 1fr auto; gap: 8px; padding: 6px 0; border-bottom: 1px dashed var(--border-on-shell); font-size: var(--text-xs); }
.bom ol li .mono { color: var(--shell-9); font-size: 10px; }
.bom ol li b { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bom__foot { display: flex; justify-content: space-between; align-items: baseline; padding-top: 10px; }
.bom__foot .mono { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--shell-9); }
.bom__foot b { font: 800 1.5rem/1 var(--font-display); color: var(--safety); }

/* hero controls */
.hero__ctrl { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3; background: rgba(11, 12, 13, .55); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); border-top: 1px solid var(--border-on-shell); }
.hero__ctrl-in { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: stretch; gap: 32px; height: 84px; }
.hero__count { display: flex; align-items: baseline; gap: 8px; align-self: center; }
.hero__count b { font: 900 2.6rem/1 var(--font-display); color: var(--safety); min-width: 1.4em; }
.hero__count span { font-size: var(--text-xs); color: var(--shell-9); letter-spacing: .1em; }
.hero__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.htab { position: relative; display: flex; align-items: center; gap: 12px; padding: 0 20px; color: var(--shell-9); text-align: left; font: 500 var(--text-sm)/1.2 var(--font-sans); border-left: 1px solid var(--border-on-shell); transition: color var(--dur-base); }
.htab .mono { font-size: 10px; letter-spacing: .1em; }
.htab:hover, .htab.is-active { color: var(--shell-12); }
.htab i { position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: transparent; }
.htab i b { display: block; height: 100%; width: 0; background: var(--safety); }
.htab.is-active i b { animation: fill var(--dur, 7000ms) linear forwards; }
.hero.is-paused .htab.is-active i b { animation-play-state: paused; }
.hero.is-static .htab.is-active i b { animation: none; width: 100%; }
@keyframes fill { to { width: 100%; } }
.hero__arrows { display: flex; align-items: center; gap: 6px; }

@media (max-width: 1023px) {
  .slide__in { grid-template-columns: 1fr; align-content: start; gap: 18px; min-height: 0; padding-block: 36px 112px; }
  .slide__copy { gap: 18px; }
  .stage { min-height: 0; width: 100%; max-width: 620px; justify-self: center; }
  .stage__svg { max-height: 420px; }
  .stage__plate { width: 210px; right: 0; bottom: 0; padding: 12px 12px 10px; }
  .stage__plate .plate__rows div { padding: 4px 0; font-size: 10px; }
  .hero__ctrl-in { grid-template-columns: auto 1fr auto; gap: 16px; height: 72px; }
  .htab { padding: 0 10px; font-size: 0; gap: 0; justify-content: center; }
  .htab .mono { font-size: 11px; }
}
@media (max-width: 559px) {
  .h-display.slide__title { font-size: clamp(3.3rem, 15.5vw, 4.4rem); }
  .slide .lede { font-size: var(--text-base); }
  .slide__cta .btn { min-height: 48px; padding: 0 18px; font-size: var(--text-xs); }
  .slide__facts li { padding-right: 12px; margin-right: 12px; font-size: 9.5px; }
  .slide__facts b { font-size: 1.2rem; }
  .stage__plate { position: relative; width: 100%; max-width: none; margin-top: -10px; }
  .stage--drill { display: block; }
  .stage__svg { margin-inline: auto; max-height: 300px; }
  .tcard { width: 88%; margin: 34px 0 20px; }
  .chipstat { padding: 10px 12px; } .chipstat b { font-size: 1.25rem; } .chipstat span { font-size: 9px; }
  .cs-1 { top: 0; left: 0; } .cs-2 { top: auto; bottom: 0; right: 0; } .cs-3 { display: none; }
  .stage--kit { padding-bottom: 0; }
  .bom { position: relative; width: 100%; margin-top: 8px; }
  .hero__count b { font-size: 2rem; }
  .sqbtn { width: 42px; height: 42px; }
}

/* ---------- PROMISE RAIL ---------- */
.rail { background: var(--surface-raised); border-bottom: 1px solid var(--border-subtle); }
.rail__in { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.rail__item { display: flex; align-items: center; gap: 14px; padding: 22px 20px; border-left: 1px solid var(--border-subtle); }
.rail__item:first-child { border-left: 0; padding-left: 0; }
.rail__item > .i { --c: 6px; width: 42px; height: 42px; padding: 10px; background: var(--ink); color: var(--safety); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.rail__item div { display: grid; gap: 4px; }
.rail__item b { font-size: var(--text-sm); font-weight: 600; }
.rail__item .mono { font-size: 10.5px; letter-spacing: .06em; color: var(--text-secondary); text-transform: uppercase; }
.rail__item .mono b { font-size: inherit; color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
@media (max-width: 1023px) { .rail__in { grid-template-columns: 1fr 1fr; } .rail__item:nth-child(3) { border-left: 0; padding-left: 0; } .rail__item:nth-child(n+3) { border-top: 1px solid var(--border-subtle); } }
@media (max-width: 559px) { .rail__item { padding: 16px 10px; gap: 10px; align-items: flex-start; } .rail__item:nth-child(even) { padding-right: 0; } .rail__item > .i { width: 34px; height: 34px; padding: 8px; } .rail__item b { font-size: var(--text-xs); } .rail__item .mono { font-size: 9px; } }

/* ---------- SEC 02 · CATEGORIES ---------- */
.cats__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.cat { --c: 18px; position: relative; display: grid; grid-template-rows: auto 1fr auto; min-height: 270px; padding: 14px 16px 16px; background: var(--surface-plate); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); transition: background .35s var(--ease-snap), color .35s; overflow: hidden; }
.cat::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(20, 21, 23, .07) 1px, transparent 1px), linear-gradient(90deg, rgba(20, 21, 23, .07) 1px, transparent 1px); background-size: 20px 20px; opacity: 0; transition: opacity .35s; }
.cat > * { position: relative; }
.cat__no { font-size: 10px; letter-spacing: .12em; color: var(--text-muted); }
.cat__count { position: absolute !important; top: 14px; right: 16px; font-size: 10px; letter-spacing: .06em; color: var(--text-secondary); }
.cat__art { display: block; width: 86%; max-width: 190px; justify-self: center; align-self: center; aspect-ratio: 1; transition: transform .6s var(--ease-out); }
.cat__art .tool { width: 100%; height: 100%; }
.cat__name { padding-right: 40px; font: 800 1.35rem/1 var(--font-display); text-transform: uppercase; letter-spacing: .01em; }
.cat__go { --c: 5px; position: absolute !important; right: 12px; bottom: 12px; width: 30px; height: 30px; display: grid; place-items: center; background: var(--ink); color: var(--shell-12); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); transition: background .35s, color .35s; }
.cat__go .i { width: 16px; height: 16px; }
@media (hover: hover) {
  .cat:hover { background: var(--ink); color: var(--shell-12); }
  .cat:hover::before { opacity: .0; }
  .cat:hover .cat__art { transform: scale(1.1) rotate(-4deg); }
  .cat:hover .cat__go { background: var(--safety); color: var(--ink); }
  .cat:hover .cat__no, .cat:hover .cat__count { color: var(--shell-10); }
}
.cat[data-reveal] { transition: opacity .7s var(--ease-out) calc(var(--i) * .04s), transform .9s var(--ease-out) calc(var(--i) * .04s), background .35s var(--ease-snap), color .35s; }
@media (max-width: 1279px) { .cats__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 767px) { .cats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .cat { min-height: 200px; padding: 12px; --c: 14px; } .cat__name { font-size: 1.1rem; padding-right: 30px; } .cat__count { top: 12px; right: 12px; font-size: 9px; } .cat__go { width: 26px; height: 26px; right: 10px; bottom: 10px; } }

/* ---------- SEC 03 · PLATFORM ---------- */
.platform { background-color: var(--surface-shell); color: var(--text-on-shell); }
.platform .lede { color: var(--shell-10); }
.platform .h-1 em { color: var(--safety); }
.platform__grid { display: grid; grid-template-columns: minmax(300px, 380px) minmax(0, 1fr); gap: clamp(20px, 3vw, 44px); align-items: start; }
.batts { display: grid; gap: 8px; }
.batt { --c: 12px; position: relative; display: grid; grid-template-columns: 82px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 14px 10px 8px; background: var(--shell-3); color: var(--shell-12); text-align: left; clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); box-shadow: inset 0 0 0 1px var(--border-on-shell); transition: background var(--dur-base), box-shadow var(--dur-base); }
.batt:hover { background: var(--shell-4); }
.batt.is-on { background: var(--shell-4); box-shadow: inset 0 0 0 1.5px var(--safety); }
.batt__art { width: 82px; height: 82px; }
.batt__art .tool { width: 100%; height: 100%; }
.batt__txt { display: grid; gap: 3px; }
.batt__txt .mono { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--shell-9); }
.batt__txt b { font: 900 2rem/.9 var(--font-display); }
.batt__txt small { font-size: 10px; color: var(--shell-10); }
.batt.is-on .batt__txt b { color: var(--safety); }
.batt__price .price b { font-size: 1.25rem; }
.batt__price .price small { color: var(--shell-9); }
.batt__cells { position: absolute; top: 12px; right: 14px; display: flex; gap: 2px; }
.batt__cells i { width: 6px; height: 10px; background: var(--shell-6); }
.batt__cells i.on { background: var(--shell-10); }
.batt.is-on .batt__cells i.on { background: var(--safety); }
.batts__all { justify-self: start; margin-top: 10px; color: var(--shell-12); }
.board { --c: 22px; position: relative; padding: 20px; background: rgba(237, 238, 240, .025); box-shadow: inset 0 0 0 1px var(--border-on-shell); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.board__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; padding: 0 4px 14px; }
.board__head .mono { font-size: var(--text-2xs); letter-spacing: .12em; text-transform: uppercase; color: var(--shell-9); }
.board__head .mono b { color: var(--shell-12); font-weight: 600; }
.gauge { display: flex; align-items: baseline; gap: 8px; }
.gauge b { font: 900 3.6rem/.8 var(--font-display); color: var(--safety); font-variant-numeric: tabular-nums; }
.gauge span { font: 500 var(--text-xs)/1 var(--font-mono); color: var(--shell-9); }
.board__rail { position: relative; height: 3px; margin: 0 4px 16px; background: var(--shell-5); }
.board__rail i { position: absolute; inset: 0; background: var(--safety); transform-origin: left; transform: scaleX(var(--p, 0)); transition: transform .8s var(--ease-snap); box-shadow: 0 0 14px rgba(255, 176, 0, .6); }
.board__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ptool { --c: 14px; position: relative; display: grid; gap: 4px; padding: 12px 14px 14px; background: var(--shell-3); color: var(--shell-9); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); box-shadow: inset 0 0 0 1px var(--border-on-shell); transition: background .5s var(--ease-snap), color .5s, box-shadow .5s; }
.ptool__plug { position: absolute; top: 0; left: 50%; width: 34px; height: 4px; translate: -50% 0; background: var(--shell-6); transition: background .4s, box-shadow .4s; }
.ptool__art { display: block; width: 58%; margin: 2px auto 0; aspect-ratio: 1.45; }
.ptool__art .tool { width: 100%; height: 100%; opacity: .28; filter: grayscale(1) brightness(.8); transition: opacity .6s var(--ease-out), filter .6s, transform .7s var(--ease-out); transform: scale(.94); }
.ptool__state { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; }
.ptool b { color: var(--shell-11); font-weight: 600; font-size: var(--text-sm); line-height: 1.25; }
.ptool__meta { font-size: 10px; color: var(--shell-8); line-height: 1.4; }
.ptool.is-lit { background: var(--shell-4); color: var(--shell-12); box-shadow: inset 0 0 0 1px rgba(255, 176, 0, .55); transition-delay: calc(var(--i) * .05s); }
.ptool.is-lit .ptool__plug { background: var(--safety); box-shadow: 0 0 12px rgba(255, 176, 0, .9); }
.ptool.is-lit .tool { opacity: 1; filter: none; transform: none; transition-delay: calc(var(--i) * .05s); }
.ptool.is-lit .ptool__state { color: var(--safety); }
.ptool.is-lit .ptool__state::before { content: "● "; }
.ptool.is-lit b { color: var(--shell-12); }
.ptool.is-lit .ptool__meta { color: var(--shell-10); }
@media (max-width: 1023px) { .platform__grid { grid-template-columns: 1fr; } .batts { grid-template-columns: 1fr 1fr; } .batts__all { grid-column: 1 / -1; } }
@media (max-width: 559px) {
  .batts { grid-template-columns: 1fr 1fr; gap: 6px; }
  .batt { grid-template-columns: 1fr; gap: 2px; padding: 8px 10px 12px; }
  .batt__art { width: 64px; height: 64px; }
  .batt__txt b { font-size: 1.6rem; }
  .batt__txt small { display: none; }
  .batt__price .price b { font-size: 1.05rem; }
  .board { padding: 12px; --c: 14px; }
  .board__grid { grid-template-columns: 1fr 1fr; gap: 6px; }
  .ptool { padding: 10px; }
  .ptool b { font-size: var(--text-xs); }
  .ptool__meta { font-size: 9px; }
  .ptool__state { font-size: 8.5px; }
  .gauge b { font-size: 2.6rem; }
}

/* ---------- SEC 04 · JOBS ---------- */
.jobs__row { display: flex; gap: 8px; height: clamp(480px, 42vw, 600px); }
.job { --c: 22px; position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; color: var(--shell-12); background: var(--ink); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); transition: flex-grow .8s var(--ease-snap); }
.job.is-on { flex-grow: 5.2; }
.job img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); transition: transform 1.2s var(--ease-out), filter .6s; filter: grayscale(1) contrast(1.1) brightness(.6); }
.job.is-on img { transform: scale(1); filter: grayscale(1) contrast(1.06) brightness(.82); }
.job__shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(11, 12, 13, .92), rgba(11, 12, 13, .15) 60%, rgba(11, 12, 13, .4)); }
.job__no { position: absolute; left: 18px; top: 18px; font-size: 10px; letter-spacing: .14em; color: var(--shell-11); }
.job.is-on .job__no { color: var(--safety); }
.job__v { position: absolute; left: 50%; bottom: 22px; writing-mode: vertical-rl; transform: translateX(-50%) rotate(180deg); font: 800 1.7rem/1 var(--font-display); text-transform: uppercase; white-space: nowrap; transition: opacity .3s; }
.job.is-on .job__v { opacity: 0; }
.job__body { position: absolute; left: 0; right: 0; bottom: 0; display: grid; justify-items: start; gap: 12px; width: min(560px, 100%); padding: 0 28px 28px; opacity: 0; transform: translateY(20px); transition: opacity .3s, transform .5s var(--ease-out); pointer-events: none; }
.job.is-on .job__body { opacity: 1; transform: none; transition: opacity .5s .3s, transform .7s var(--ease-out) .3s; pointer-events: auto; }
.job__count { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--safety); }
.job__name { font: 900 clamp(2.6rem, 4.4vw, 4.4rem)/.85 var(--font-display); text-transform: uppercase; }
.job__line { max-width: 44ch; color: var(--shell-11); font-size: var(--text-sm); }
.job__picks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; width: 100%; margin: 4px 0 6px; }
.job__picks > span { --c: 10px; display: grid; grid-template-columns: 44px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 8px; align-items: center; padding: 8px 10px 8px 6px; background: rgba(20, 21, 23, .5); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); box-shadow: inset 0 0 0 1px var(--glass-dark-edge); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.job__picks i { grid-row: span 2; width: 44px; height: 44px; background: var(--grey-6); }
.job__picks i .tool { width: 100%; height: 100%; }
.job__picks b { font-size: 11.5px; font-weight: 600; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.job__picks small { font-size: 9px; color: var(--shell-10); letter-spacing: .04em; }
.job .link-u { color: var(--shell-12); }
@media (max-width: 1023px) {
  .jobs__row { height: auto; overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scrollbar-width: none; }
  .jobs__row::-webkit-scrollbar { display: none; }
  .job, .job.is-on { flex: 0 0 min(82vw, 440px); height: 520px; scroll-snap-align: start; }
  .job img { transform: none; filter: grayscale(1) contrast(1.06) brightness(.82); }
  .job__v { display: none; }
  .job__body { opacity: 1; transform: none; pointer-events: auto; padding: 0 18px 20px; }
  .job__no { color: var(--safety); }
  .job__picks { grid-template-columns: 1fr; }
}

/* ---------- SEC 05 · BEST SELLERS ---------- */
.best__rail { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 4); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.best__rail::-webkit-scrollbar { display: none; }
.best__rail > .card { scroll-snap-align: start; animation: cardIn .7s var(--ease-out) both; animation-delay: calc(var(--i) * .05s); }
@keyframes cardIn { from { opacity: 0; transform: translateY(18px); } }
.best__foot { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 24px; margin-top: 26px; }
.best__prog { position: relative; height: 2px; background: var(--border-default); overflow: hidden; }
.best__prog i { position: absolute; top: 0; bottom: 0; left: 0; width: calc(var(--w, .3) * 100%); background: var(--ink); transform: translateX(calc(var(--x, 0) * (100% / var(--w, .3) - 100%))); transition: transform .2s linear; }
.best__foot .mono { font-size: var(--text-2xs); letter-spacing: .1em; color: var(--text-secondary); }
@media (max-width: 1279px) { .best__rail { grid-auto-columns: calc((100% - 32px) / 3); } }
@media (max-width: 1023px) { .best__rail { grid-auto-columns: calc((100% - 16px) / 2); } }
@media (max-width: 559px) { .best__rail { grid-auto-columns: 78%; gap: 10px; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); } .best__foot { grid-template-columns: 1fr auto; } .best__foot .link-u { grid-column: 1 / -1; justify-self: start; } .sec-head__r .hero__arrows { display: none; } }

/* ---------- SEC 06 · KITS ---------- */
.kits__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.kit { display: flex; flex-direction: column; background: var(--surface-raised); }
.kit__art { --c: 26px; position: relative; aspect-ratio: 1.22; background-color: var(--surface-shell); clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%); overflow: hidden; }
.kit__art .kx { transition: transform .7s var(--ease-out); }
.kit__art .kx .tool { filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .35)); }
@media (hover: hover) { .kit:hover .kx { transform: translate(calc((var(--i) - 2) * 6px), calc((var(--i) % 2 - .5) * 8px)); } }
.kit__code { position: absolute; left: 16px; bottom: 14px; font-size: 10px; letter-spacing: .14em; color: var(--shell-9); z-index: 1; }
.kit__save { position: absolute; right: 14px; top: 14px; z-index: 2; height: 26px; font-size: 11px; }
.kit__body { display: flex; flex-direction: column; gap: 12px; flex: 1; padding: 18px 18px 20px; }
.kit__kicker { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.kit__bom { display: grid; border-top: 1px solid var(--border-subtle); }
.kit__bom li { display: grid; grid-template-columns: 26px 1fr auto; gap: 8px; padding: 8px 0; border-bottom: 1px dashed var(--border-subtle); font-size: var(--text-sm); }
.kit__bom .mono { font-size: 10.5px; color: var(--text-muted); }
.kit__bom em { font-style: normal; font-size: var(--text-xs); color: var(--text-secondary); }
.kit__price { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 6px; }
.kit__price > div:first-child { display: grid; gap: 4px; }
.kit__was { font-size: 10.5px; color: var(--text-muted); }
.kit__price b { font: 900 2.3rem/.9 var(--font-display); }
.kit__price small { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.kit__acts { display: flex; gap: 6px; }
.kit__acts .btn--line { --fill: var(--surface-raised); }
@media (max-width: 1023px) { .kits__grid { grid-template-columns: 1fr; max-width: 620px; } }

/* ---------- SEC 07 · TRADE ---------- */
.trade { position: relative; background: var(--surface-shell); color: var(--text-on-shell); overflow: hidden; isolation: isolate; }
.trade__edge { height: 10px; }
.trade__bg { position: absolute; inset: 10px 0 0; z-index: -1; }
.trade__blade { position: absolute; right: -8%; top: 50%; width: min(820px, 70vw); aspect-ratio: 1; translate: 0 -50%; color: rgba(237, 238, 240, .06); animation: spin 90s linear infinite reverse; }
.trade__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.trade__copy { display: grid; justify-items: start; gap: 22px; }
.trade .lede { color: var(--shell-10); }
.perks { display: grid; width: 100%; margin-top: 6px; border-top: 1px solid var(--border-on-shell); }
.perks li { display: grid; grid-template-columns: 40px minmax(0, 1fr) 28px; gap: 14px; align-items: start; padding: 16px 0; border-bottom: 1px solid var(--border-on-shell); }
.perks .mono { font-size: var(--text-2xs); color: var(--safety); padding-top: 4px; }
.perks b { font: 800 1.35rem/1 var(--font-display); text-transform: uppercase; letter-spacing: .01em; }
.perks p { margin-top: 6px; font-size: var(--text-sm); color: var(--shell-10); }
.perks .i { color: var(--shell-8); width: 24px; height: 24px; }
.trade__cta { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 6px; }
.trade__cta .mono { font-size: var(--text-2xs); letter-spacing: .1em; text-transform: uppercase; color: var(--shell-9); }
.desk { --c: 24px; padding: 22px 22px 18px; clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); }
.desk__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.desk__head .mono { font-size: var(--text-2xs); letter-spacing: .14em; text-transform: uppercase; color: var(--safety); }
.desk__head .mode { margin: 0; }
.desk__prod { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--border-on-shell); }
.desk__art { --c: 10px; width: 96px; height: 96px; background: var(--grey-6); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.desk__art .tool { width: 100%; height: 100%; }
.desk__prod div { display: grid; gap: 4px; }
.desk__prod small { font-size: 9.5px; letter-spacing: .12em; color: var(--shell-9); }
.desk__prod b { font-weight: 600; }
.desk__prod .mono { font-size: 10.5px; color: var(--shell-10); }
.desk__tiers { width: 100%; border-collapse: collapse; margin-top: 6px; }
.desk__tiers th { padding: 10px 0 8px; text-align: left; font: 500 9.5px/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--shell-9); border-bottom: 1px solid var(--border-on-shell); }
.desk__tiers td { padding: 12px 0; border-bottom: 1px dashed var(--border-on-shell); font-size: var(--text-sm); }
.desk__tiers td b { font: 800 1.55rem/1 var(--font-display); font-variant-numeric: tabular-nums; }
.desk__tiers td.mono { font-size: 11px; color: var(--shell-10); }
.desk__tiers th:last-child, .desk__tiers td:last-child { text-align: right; }
.desk__sum { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 14px; }
.desk__sum .mono { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--shell-9); }
.desk__sum b { font-size: var(--text-sm); color: var(--safety); text-align: right; }
@media (max-width: 1023px) { .trade__in { grid-template-columns: 1fr; } .desk { max-width: 560px; } }
@media (max-width: 559px) { .desk { padding: 16px 14px 14px; } .desk__prod { grid-template-columns: 72px 1fr; } .desk__art { width: 72px; height: 72px; } }

/* ---------- SEC 08 · BRANDS ---------- */
.brands { padding-block: clamp(48px, 5vw, 72px); background: var(--surface-page); border-bottom: 1px solid var(--border-subtle); overflow: hidden; }
.brands__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 26px; }
.marquee { overflow: hidden; border-top: 1px solid var(--border-subtle); border-bottom: 1px solid var(--border-subtle); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__track { display: flex; width: max-content; animation: marquee 46s linear infinite; }
.marquee:hover .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
.mq { display: grid; justify-items: start; align-content: center; gap: 10px; height: 128px; padding: 0 48px; border-right: 1px solid var(--border-subtle); color: var(--ink); transition: background var(--dur-base), color var(--dur-base); }
.mq small { font-size: 9.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); }
.mq:hover { background: var(--ink); color: var(--shell-12); }
.mq:hover .wm { color: var(--safety); }
@media (max-width: 559px) { .mq { height: 104px; padding: 0 30px; } .brands__head { flex-direction: column; align-items: flex-start; gap: 14px; } }

/* ---------- SEC 09 · SUPPLY ---------- */
.supply__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.who { display: grid; gap: 12px; align-content: start; }
.who__img { --c: 22px; position: relative; aspect-ratio: 4 / 4.6; overflow: hidden; background: var(--ink); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.who__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out); }
.who:hover .who__img img { transform: scale(1.05); }
.who__no { position: absolute; left: 14px; bottom: 12px; padding: 5px 7px; background: var(--ink); color: var(--safety); font-size: 10px; letter-spacing: .12em; }
.who > p { font-size: var(--text-sm); color: var(--text-secondary); max-width: 34ch; }
.who__stat { display: flex; align-items: baseline; gap: 10px; padding-top: 10px; border-top: 1px solid var(--border-default); }
.who__stat b { font: 900 2rem/1 var(--font-display); }
.who__stat .mono { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
.tally { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: clamp(48px, 6vw, 88px); border-top: 2px solid var(--ink); }
.tally__item { position: relative; display: grid; gap: 10px; padding: 22px 18px 26px 0; }
.tally__item + .tally__item { padding-left: 18px; border-left: 1px solid var(--border-default); }
.tally__n { font: 900 clamp(3rem, 5.2vw, 5.2rem)/.85 var(--font-display); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.tally__item .mono { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-secondary); line-height: 1.5; }
.tally__scale { display: block; height: 10px; margin-top: 6px; background: repeating-linear-gradient(90deg, var(--ink) 0 1px, transparent 1px 8px) 0 100% / 100% 6px no-repeat, repeating-linear-gradient(90deg, var(--ink) 0 1px, transparent 1px 40px) 0 100% / 100% 10px no-repeat; opacity: .35; position: relative; }
.tally__scale::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: var(--safety); transition: width 1.4s var(--ease-snap); }
.tally__item:has(.is-in) .tally__scale { opacity: 1; }
.tally__item:has(.is-in) .tally__scale::after { width: 100%; }
@media (max-width: 1023px) { .supply__grid { grid-template-columns: 1fr 1fr; } .tally { grid-template-columns: repeat(3, 1fr); } .tally__item:nth-child(4) { padding-left: 0; border-left: 0; } .tally__item:nth-child(n+4) { border-top: 1px solid var(--border-default); } }
@media (max-width: 559px) { .supply__grid { gap: 22px 10px; } .who > p { font-size: var(--text-xs); } .who__stat b { font-size: 1.5rem; } .tally { grid-template-columns: 1fr 1fr; } .tally__item, .tally__item + .tally__item { padding: 18px 10px 20px 0; border-left: 0; } .tally__item:nth-child(even) { padding-left: 12px; border-left: 1px solid var(--border-default); } .tally__item:nth-child(n+3) { border-top: 1px solid var(--border-default); } .tally__item:last-child { grid-column: 1 / -1; } }

/* ---------- SEC 10 · SPECIALIST ---------- */
.spec__panel { --c: var(--cham-xl); display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); background: var(--surface-shell); color: var(--text-on-shell); clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); overflow: hidden; }
.spec__photo { position: relative; min-height: 520px; }
.spec__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.spec__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 50%, rgba(20, 21, 23, .7)); }
.spec__live { --c: 10px; position: absolute; left: 22px; bottom: 22px; z-index: 1; display: grid; gap: 8px; padding: 14px 16px; clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); }
.spec__live .status { color: var(--shell-12); }
.spec__live > .mono { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--shell-10); }
.spec__body { display: grid; justify-items: start; align-content: center; gap: 22px; padding: clamp(32px, 5vw, 72px); }
.spec__body .lede { color: var(--shell-10); }
.spec__body .h-1 em { color: var(--safety); }
.crew { width: 100%; border-top: 1px solid var(--border-on-shell); }
.crew li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border-on-shell); }
.crew__av { --c: 7px; width: 44px; height: 44px; display: grid; place-items: center; background: var(--shell-4); color: var(--safety); font: 800 1.05rem/1 var(--font-display); letter-spacing: .04em; clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.crew div { display: grid; gap: 3px; }
.crew b { font-weight: 600; }
.crew .mono { font-size: 10px; letter-spacing: .06em; color: var(--shell-9); text-transform: uppercase; }
.crew .status { color: var(--shell-11); font-size: 10px; }
.spec__cta { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 1023px) { .spec__panel { grid-template-columns: 1fr; --c: 24px; } .spec__photo { min-height: 300px; } .spec__photo::after { background: linear-gradient(0deg, rgba(20, 21, 23, .7), transparent 50%); } }
@media (max-width: 559px) { .spec__body { padding: 28px 18px 30px; } .spec__cta .btn { flex: 1 1 100%; } .crew .status { display: none; } }

/* ---------- SEC 11 · NEWSLETTER ---------- */
.news { position: relative; background: var(--safety); color: var(--ink); padding-block: clamp(56px, 6vw, 96px); --bp-major: rgba(20, 21, 23, .12); --bp-minor: rgba(20, 21, 23, .05); background-image: linear-gradient(var(--bp-major) 1px, transparent 1px), linear-gradient(90deg, var(--bp-major) 1px, transparent 1px), linear-gradient(var(--bp-minor) 1px, transparent 1px), linear-gradient(90deg, var(--bp-minor) 1px, transparent 1px); background-size: 80px 80px, 80px 80px, 16px 16px, 16px 16px; }
.news__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
.news__in > div { display: grid; justify-items: start; gap: 22px; }
.news .sec-tag b { color: var(--safety); }
.news__form { display: grid; gap: 14px; }
.news__form > p:first-child { max-width: 46ch; font-size: var(--text-md); }
.news__row { display: flex; }
.news__row input { flex: 1; min-width: 0; height: 58px; padding: 0 18px; background: var(--grey-1); border: 2px solid var(--ink); border-right: 0; font-size: var(--text-md); border-radius: 0; }
.news__row input:focus { outline: 0; background: var(--white); }
.news__row input[aria-invalid="true"] { border-color: var(--signal); }
.news__row .btn { --c: 0px; min-height: 58px; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%); }
.news__err { min-height: 1em; font-size: 11px; color: var(--red-11); }
.news__opts { display: flex; gap: 22px; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.news__opts label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; }
.news__opts input { accent-color: var(--ink); width: 16px; height: 16px; }
@media (max-width: 767px) { .news__in { grid-template-columns: 1fr; } }
@media (max-width: 559px) { .news__row { flex-direction: column; } .news__row input { flex: none; border-right: 2px solid var(--ink); border-bottom: 0; } .news__opts { flex-direction: column; gap: 10px; } }