/*
Theme Name: Snow Blowers Canada
Theme URI: https://snowblowerscanada.com/
Template: astra
Author: Snow Blowers Canada
Description: Arctic Machine design system and motion layer for Snow Blowers Canada. Child of Astra. Astra handles the WooCommerce plumbing, this layer carries the identity.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: sbc
*/

/* ARCTIC MACHINE. Astra supplies layout, header, footer and Woo plumbing.
   Everything below is identity: tokens, components, motion.
   Motion budget: transform and opacity only, all of it honours reduced motion. */

:root {
  --ink-000:#04070d; --ink-050:#070b14; --ink-100:#0b111d; --ink-200:#111a2a;
  --ink-300:#1a2637; --ink-400:#263449; --ink-500:#3a4c66; --ink-600:#52678a;
  --slate-400:#6b819e; --slate-300:#8fa3bd; --slate-200:#b7c6da; --slate-100:#dbe5f1;
  --snow:#f4f8ff;
  --ice-300:#7fd4ff; --ice-400:#4da3ff; --ice-500:#2b7fe6;
  --amber-300:#ffc857; --amber-400:#ffb020; --amber-500:#e8930a;
  --success:#3ddc97; --danger:#ff5c5c;
  --surface:rgba(255,255,255,.028); --surface-2:rgba(255,255,255,.048);
  --hairline:rgba(183,198,218,.14); --hairline-bright:rgba(183,198,218,.28);
  --font-display:'Archivo',-apple-system,'Helvetica Neue',Arial,sans-serif;
  --font-body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:ui-monospace,'SF Mono','JetBrains Mono',Menlo,monospace;
  --t-xs:clamp(.72rem,.69rem + .13vw,.80rem);
  --t-sm:clamp(.82rem,.78rem + .18vw,.92rem);
  --t-base:clamp(.95rem,.90rem + .24vw,1.08rem);
  --t-lg:clamp(1.10rem,1.00rem + .44vw,1.35rem);
  --t-xl:clamp(1.35rem,1.15rem + .85vw,1.85rem);
  --t-2xl:clamp(1.75rem,1.35rem + 1.7vw,2.75rem);
  --t-3xl:clamp(2.30rem,1.55rem + 3.2vw,4.25rem);
  --t-4xl:clamp(2.90rem,1.60rem + 5.5vw,6.50rem);
  --t-mega:clamp(3.40rem,1.20rem + 9.2vw,10.5rem);
  --sp-3:.75rem; --sp-4:1rem; --sp-5:1.5rem; --sp-6:2rem; --sp-7:3rem; --sp-8:4rem; --sp-9:6rem;
  --radius:14px; --radius-lg:22px; --radius-xl:34px;
  --ease-spring:linear(0,.0039 1.6%,.0157 3.2%,.0625 6.5%,.1407 9.9%,.25 13.4%,
    .3908 17%,.5625 20.8%,.7657 24.8%,1 29.1%,1.0507 30.9%,1.0879 32.8%,
    1.1113 34.9%,1.1211 37.3%,1.1172 40%,1.0996 43.2%,1.0684 47.1%,
    1.0234 52.1%,.998 55.2%,.9863 58.9%,.9902 64.2%,1.002 73.4%,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --dur-fast:180ms; --dur:420ms; --dur-slow:900ms;
}

html{color-scheme:dark;scroll-behavior:smooth;scroll-padding-top:6rem}
body,body.ast-separate-container,body.ast-plain-container{background:var(--ink-050) !important;
  color:var(--slate-100);font-family:var(--font-body);font-size:var(--t-base);line-height:1.65;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
#page,#content,.site-content,.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,.ast-separate-container #primary{background:transparent !important;box-shadow:none !important}
h1,h2,h3,h4,h5,h6,.entry-title,.entry-title a{font-family:var(--font-display);font-weight:700;line-height:1.05;
  letter-spacing:-.035em;color:var(--snow);text-wrap:balance}
h1,.entry-title{font-size:var(--t-4xl);font-stretch:108%}
h2{font-size:var(--t-3xl);font-stretch:105%}
h3{font-size:var(--t-xl);font-stretch:102%;letter-spacing:-.025em}
h4{font-size:var(--t-lg);letter-spacing:-.02em}
p{text-wrap:pretty}
a{color:var(--ice-300)}
a:hover,a:focus{color:var(--snow)}
::selection{background:var(--ice-400);color:var(--ink-000)}
:focus-visible{outline:2px solid var(--ice-400);outline-offset:3px;border-radius:4px}
hr{border:0;height:1px;background:linear-gradient(90deg,transparent,var(--hairline-bright) 18%,var(--hairline-bright) 82%,transparent)}

.site-header,.ast-primary-header-bar,.ast-above-header-bar,.main-header-bar{
  background:color-mix(in srgb,var(--ink-050) 78%,transparent) !important;
  backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--hairline) !important}
.ast-primary-header-bar{view-transition-name:site-header}
.main-header-menu > .menu-item > .menu-link,
.ast-header-break-point .main-header-menu .menu-link{color:var(--slate-200) !important}
.main-header-menu > .menu-item > .menu-link:hover,
.main-header-menu > .current-menu-item > .menu-link{color:var(--snow) !important}
.main-header-menu .sub-menu{background:var(--ink-100) !important;border:1px solid var(--hairline);border-radius:12px;overflow:hidden}
.site-title a,.site-title{font-family:var(--font-display) !important;font-weight:800;font-stretch:112%;
  letter-spacing:-.03em;color:var(--snow) !important}
.site-description{color:var(--slate-400) !important;font-family:var(--font-mono);font-size:var(--t-xs);
  letter-spacing:.12em;text-transform:uppercase}
.site-footer,.ast-small-footer,.footer-adv,.site-primary-footer-wrap,.site-below-footer-wrap{
  background:linear-gradient(180deg,var(--ink-050),color-mix(in srgb,var(--ice-500) 5%,var(--ink-050))) !important;
  border-top:1px solid var(--hairline);color:var(--slate-300)}
.site-footer a{color:var(--slate-300)}
.site-footer a:hover{color:var(--snow)}

.sbc-grain{position:fixed;inset:-120%;z-index:9998;pointer-events:none;opacity:.032;mix-blend-mode:overlay;
  will-change:transform;animation:sbc-grain 7s steps(6) infinite;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes sbc-grain{0%,100%{transform:translate3d(0,0,0)}17%{transform:translate3d(-3%,2%,0)}
  34%{transform:translate3d(2%,-3%,0)}51%{transform:translate3d(-2%,-2%,0)}
  68%{transform:translate3d(3%,1%,0)}85%{transform:translate3d(-1%,3%,0)}}
.sbc-lightfield{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.sbc-lightfield::before,.sbc-lightfield::after{content:'';position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;will-change:transform}
.sbc-lightfield::before{width:52vw;height:52vw;top:-18%;left:-8%;
  background:radial-gradient(circle,rgba(77,163,255,.55),transparent 68%);
  transform:translate3d(calc(var(--px,0)*34px),calc(var(--py,0)*26px),0);transition:transform .9s var(--ease-out)}
.sbc-lightfield::after{width:44vw;height:44vw;bottom:-22%;right:-10%;
  background:radial-gradient(circle,rgba(255,176,32,.22),transparent 66%);
  transform:translate3d(calc(var(--px,0)*-28px),calc(var(--py,0)*-20px),0);transition:transform 1.2s var(--ease-out)}
.sbc-snowfield{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.65}

.sbc-shell{width:min(100% - 2.5rem,1360px);margin-inline:auto}
.sbc-narrow{width:min(100% - 2.5rem,780px);margin-inline:auto}
.sbc-section{padding-block:clamp(4rem,9vw,10rem);position:relative}
.sbc-defer{content-visibility:auto;contain-intrinsic-size:auto 720px}
.sbc-grid{display:grid;gap:var(--sp-5)}
.sbc-cols-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr))}
.sbc-cols-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.sbc-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:var(--sp-5);margin-bottom:var(--sp-7)}
.sbc-head p{max-width:56ch}
.sbc-eyebrow{font-family:var(--font-mono);font-size:var(--t-xs);font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ice-300);display:inline-flex;align-items:center;gap:.6em}
.sbc-eyebrow::before{content:'';width:26px;height:1px;background:linear-gradient(90deg,transparent,var(--ice-400))}
.sbc-display{font-family:var(--font-display);font-size:var(--t-mega);font-weight:800;font-stretch:118%;
  line-height:.86;letter-spacing:-.05em;color:var(--snow);margin-left:-.06em}
.sbc-lede{font-size:var(--t-lg);line-height:1.55;color:var(--slate-200);max-width:62ch}
.sbc-muted{color:var(--slate-400)}
.sbc-grad{background:linear-gradient(94deg,var(--snow) 8%,var(--ice-300) 52%,var(--ice-500) 96%);
  -webkit-background-clip:text;background-clip:text;color:transparent}

.sbc-btn,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.ast-button,.ast-custom-button{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6em;
  padding:.92rem 1.6rem;font-family:var(--font-display);font-size:var(--t-sm);font-weight:650;
  font-stretch:104%;letter-spacing:-.012em;color:var(--ink-000);background:var(--snow);border:0;
  border-radius:99px;isolation:isolate;overflow:hidden;white-space:nowrap;cursor:pointer;
  transition:transform var(--dur) var(--ease-spring),box-shadow var(--dur) var(--ease-out)}
.sbc-btn::before{content:'';position:absolute;inset:0;z-index:-1;
  background:linear-gradient(115deg,transparent 22%,rgba(255,255,255,.55) 47%,transparent 72%);
  transform:translateX(-115%);transition:transform .78s var(--ease-out)}
.sbc-btn:hover::before{transform:translateX(115%)}
.sbc-btn:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{box-shadow:0 14px 40px -14px rgba(0,0,0,.8);color:var(--ink-000)}
.sbc-btn:active{transform:scale(.975)}
.sbc-btn--primary,.woocommerce button.button.alt,.woocommerce a.button.alt,
.woocommerce #respond input#submit.alt,.woocommerce .single_add_to_cart_button{
  background:linear-gradient(140deg,var(--amber-300),var(--amber-500)) !important;color:#2a1a00 !important;
  box-shadow:0 0 0 1px rgba(255,200,87,.35),0 18px 44px -20px rgba(255,176,32,.3)}
.sbc-btn--ice{background:linear-gradient(140deg,var(--ice-300),var(--ice-500));color:#001428}
.sbc-btn--ghost{background:transparent;color:var(--slate-100);box-shadow:inset 0 0 0 1px var(--hairline-bright)}
.sbc-btn--ghost:hover{color:var(--snow);box-shadow:inset 0 0 0 1px var(--ice-400)}
.sbc-btn--lg{padding:1.1rem 2rem;font-size:var(--t-base)}
.sbc-arrow{transition:transform var(--dur) var(--ease-spring)}
.sbc-btn:hover .sbc-arrow{transform:translateX(4px)}

.sbc-card{position:relative;display:block;padding:var(--sp-5);border-radius:var(--radius-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.012)),var(--ink-100);
  border:1px solid var(--hairline);overflow:hidden;text-decoration:none;
  transition:border-color var(--dur) var(--ease-out),transform var(--dur) var(--ease-spring)}
.sbc-card::before{content:'';position:absolute;inset:0;opacity:0;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(77,163,255,.14),transparent 62%);
  transition:opacity var(--dur) var(--ease-out)}
.sbc-card:hover::before{opacity:1}
.sbc-card:hover{border-color:var(--hairline-bright)}
.sbc-card > * + *{margin-top:var(--sp-4)}
.sbc-num{font-family:var(--font-mono);font-size:var(--t-xs);color:var(--ice-400);letter-spacing:.16em}

.woocommerce ul.products{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,285px),1fr));gap:var(--sp-5);margin:0}
.woocommerce ul.products::before,.woocommerce ul.products::after{display:none}
.woocommerce ul.products li.product{width:100% !important;margin:0 !important;float:none !important;padding:0;
  display:flex;flex-direction:column;border-radius:var(--radius-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015)),var(--ink-100);
  border:1px solid var(--hairline);overflow:hidden;transform-style:preserve-3d;
  transition:transform .52s var(--ease-spring),border-color var(--dur) var(--ease-out),box-shadow var(--dur) var(--ease-out)}
.woocommerce ul.products li.product:hover{border-color:var(--hairline-bright);
  box-shadow:0 30px 70px -34px rgba(0,0,0,.95),0 0 0 1px rgba(77,163,255,.14)}
.woocommerce ul.products li.product a img{aspect-ratio:4/3;object-fit:contain;padding:10%;margin:0;
  background:radial-gradient(circle at 50% 118%,rgba(77,163,255,.16),transparent 62%),var(--ink-200);
  transition:transform .7s var(--ease-spring);transform:translateZ(28px)}
.woocommerce ul.products li.product:hover a img{transform:translateZ(46px) scale(1.06)}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--font-display);
  font-size:1.02rem !important;font-weight:650;line-height:1.25;letter-spacing:-.02em;color:var(--snow);padding:0 var(--sp-5)}
.woocommerce ul.products li.product .price{font-family:var(--font-display);font-size:1.24rem !important;
  font-weight:700;letter-spacing:-.03em;color:var(--snow) !important;padding:0 var(--sp-5)}
.woocommerce ul.products li.product .price del{font-size:.82rem;color:var(--slate-400);opacity:1}
.woocommerce ul.products li.product .price ins{text-decoration:none;color:var(--amber-300)}
.woocommerce ul.products li.product .button{margin:var(--sp-4) var(--sp-5) var(--sp-5)}
.woocommerce span.onsale{background:var(--amber-400) !important;color:var(--ink-000) !important;
  font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  border-radius:99px;padding:.3rem .7rem;min-height:0;min-width:0;line-height:1.4}
.woocommerce .star-rating,.woocommerce .star-rating span{color:var(--amber-400)}
.sbc-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:auto var(--sp-5) 0;
  background:var(--hairline);border:1px solid var(--hairline);border-radius:10px;overflow:hidden}
.sbc-specs div{background:var(--ink-100);padding:.5rem .4rem;text-align:center}
.sbc-specs dt{font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-400)}
.sbc-specs dd{font-family:var(--font-display);font-size:.9rem;font-weight:650;color:var(--snow);margin:0}
.woocommerce-message,.woocommerce-info,.woocommerce-error{background:var(--surface) !important;
  border:1px solid var(--hairline-bright);border-radius:var(--radius);color:var(--slate-100);padding:1rem 1.25rem}
.woocommerce-message{border-color:rgba(61,220,151,.4)}
.woocommerce-error{border-color:rgba(255,92,92,.4)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row select,
.woocommerce form .form-row textarea,.woocommerce .quantity input[type=number],
input[type=text],input[type=email],input[type=search],input[type=tel],input[type=number],select,textarea{
  background:var(--ink-200) !important;border:1px solid var(--hairline) !important;
  border-radius:10px !important;color:var(--snow) !important;padding:.8rem 1rem}
input:focus,select:focus,textarea:focus{border-color:var(--ice-400) !important;
  box-shadow:0 0 0 3px rgba(77,163,255,.16) !important;outline:none}
.woocommerce table.shop_table,.woocommerce table.shop_attributes{border:1px solid var(--hairline);border-radius:var(--radius);overflow:hidden}
.woocommerce table.shop_table th{background:var(--surface);color:var(--ice-300);font-family:var(--font-mono);
  font-size:var(--t-xs);letter-spacing:.12em;text-transform:uppercase}
.woocommerce table.shop_table td,.woocommerce table.shop_attributes td,
.woocommerce table.shop_attributes th{border-color:var(--hairline) !important}

.sbc-hero{position:relative;min-height:min(100svh,940px);display:flex;align-items:center;
  padding-block:var(--sp-9) var(--sp-8);overflow:hidden;border-bottom:1px solid var(--hairline)}
.sbc-hero-inner{position:relative;z-index:3;width:min(100% - 2.5rem,1360px);margin-inline:auto}
.sbc-hero-copy{max-width:20ch}
.sbc-cta{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-6)}
.sbc-trust{display:flex;flex-wrap:wrap;gap:var(--sp-5);margin-top:var(--sp-7);padding-top:var(--sp-5);border-top:1px solid var(--hairline)}
.sbc-trust-item{display:flex;align-items:center;gap:.55rem;font-family:var(--font-mono);font-size:var(--t-xs);
  letter-spacing:.08em;text-transform:uppercase;color:var(--slate-300)}
.sbc-trust-item svg{width:15px;height:15px;color:var(--ice-400);flex-shrink:0}

@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){
  .sbc-reveal{animation:sbc-in linear both;animation-timeline:view();animation-range:entry 5% cover 26%}}}
@supports not (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){
  .sbc-reveal{opacity:0;transform:translate3d(0,26px,0);transition:opacity .76s var(--ease-out),transform .76s var(--ease-out)}
  .sbc-reveal.is-in{opacity:1;transform:none}}}
@keyframes sbc-in{from{opacity:0;transform:translate3d(0,34px,0)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
  .sbc-stagger.is-in > *{animation:sbc-in .7s var(--ease-out) both;animation-delay:calc(var(--i,0)*65ms)}
  .sbc-stagger:not(.is-in) > *{opacity:0}
  .sbc-split.is-in .sbc-line > span{animation:sbc-line .94s var(--ease-out) both;animation-delay:calc(var(--l,0)*85ms)}
  .sbc-split:not(.is-in) .sbc-line > span{transform:translate3d(0,105%,0)}}
.sbc-line{display:block;overflow:hidden}
.sbc-line > span{display:block}
@keyframes sbc-line{from{transform:translate3d(0,105%,0)}to{transform:none}}

.sbc-marquee{position:relative;overflow:hidden;padding-block:var(--sp-5);border-block:1px solid var(--hairline);
  mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.sbc-track{display:flex;gap:var(--sp-7);width:max-content}
@media (prefers-reduced-motion:no-preference){
  .sbc-track{animation:sbc-marquee 42s linear infinite}
  .sbc-marquee:hover .sbc-track{animation-play-state:paused}}
@keyframes sbc-marquee{to{transform:translateX(-50%)}}
.sbc-track span{font-family:var(--font-display);font-size:clamp(1.1rem,2vw,1.6rem);font-weight:700;
  font-stretch:112%;letter-spacing:-.03em;color:var(--ink-600);white-space:nowrap;transition:color var(--dur) var(--ease-out)}
.sbc-track span:hover{color:var(--snow)}

.sbc-explainer{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-8);align-items:start}
.sbc-sticky{position:sticky;top:7rem}
.sbc-visual{aspect-ratio:1;border-radius:var(--radius-xl);border:1px solid var(--hairline);
  background:radial-gradient(circle at 50% 40%,rgba(77,163,255,.15),transparent 62%),var(--ink-100);
  display:grid;place-items:center;overflow:hidden;position:relative}
.sbc-visual svg{width:38%;height:38%;color:var(--ice-400);opacity:.85;transition:transform .9s var(--ease-spring)}
.sbc-visual[data-step="2"] svg{transform:rotate(90deg) scale(1.1)}
.sbc-visual[data-step="3"] svg{transform:rotate(180deg) scale(1.2)}
.sbc-visual[data-step="4"] svg{transform:rotate(270deg) scale(1.1)}
.sbc-step{min-height:62svh;display:flex;flex-direction:column;justify-content:center;gap:var(--sp-4);
  opacity:.28;transition:opacity .56s var(--ease-out)}
.sbc-step.is-active{opacity:1}
.sbc-step h3{font-size:var(--t-2xl)}
.sbc-step-i{font-family:var(--font-mono);font-size:var(--t-xs);letter-spacing:.2em;color:var(--ice-400)}
@media (max-width:900px){.sbc-explainer{grid-template-columns:1fr;gap:var(--sp-6)}
  .sbc-sticky{position:static}.sbc-step{min-height:0;opacity:1}}

.sbc-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:1px;
  background:var(--hairline);border:1px solid var(--hairline);border-radius:var(--radius-lg);overflow:hidden}
.sbc-stat{background:var(--ink-100);padding:var(--sp-5);display:grid;gap:.35rem}
.sbc-stat-v{font-family:var(--font-display);font-size:var(--t-2xl);font-weight:800;font-stretch:110%;
  letter-spacing:-.045em;color:var(--snow);font-variant-numeric:tabular-nums}
.sbc-stat-l{font-family:var(--font-mono);font-size:var(--t-xs);letter-spacing:.13em;text-transform:uppercase;color:var(--slate-400)}

.sbc-prose{max-width:74ch;color:var(--slate-200)}
.sbc-prose > * + *{margin-top:1.15em}
.sbc-prose h2{margin-top:2.4em;font-size:var(--t-2xl)}
.sbc-prose h3{margin-top:1.9em}
.sbc-prose h2 + p,.sbc-prose h3 + p{margin-top:.75em}
.sbc-prose a{color:var(--ice-300);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:rgba(127,212,255,.4)}
.sbc-prose a:hover{text-decoration-color:var(--ice-300)}
.sbc-prose strong{color:var(--snow);font-weight:620}
.sbc-prose ul{padding-left:1.3em;list-style:none}
.sbc-prose ul li{position:relative}
.sbc-prose ul li::before{content:'';position:absolute;left:-1em;top:.72em;width:5px;height:5px;border-radius:50%;background:var(--ice-400)}
.sbc-prose ol{padding-left:1.3em}
.sbc-prose ol li::marker{color:var(--ice-400);font-family:var(--font-mono);font-size:.85em}
.sbc-prose li + li{margin-top:.5em}
.sbc-prose blockquote{border-left:2px solid var(--ice-400);padding:.3em 0 .3em 1.3em;color:var(--slate-100);font-size:var(--t-lg);line-height:1.5}
.sbc-prose img{border-radius:var(--radius);border:1px solid var(--hairline)}
.sbc-prose figcaption{margin-top:.7em;font-family:var(--font-mono);font-size:var(--t-xs);color:var(--slate-400)}
.sbc-prose table{margin-block:2em;font-size:var(--t-sm);width:100%}
.sbc-prose :is(th,td){padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--hairline)}
.sbc-prose th{font-family:var(--font-mono);font-size:var(--t-xs);letter-spacing:.12em;text-transform:uppercase;
  color:var(--ice-300);background:var(--surface)}
.sbc-prose tbody tr:hover{background:var(--surface)}
.sbc-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius);border:1px solid var(--hairline)}
.sbc-scroll table{margin:0}
.sbc-toc{padding:var(--sp-5);border-radius:var(--radius-lg);border:1px solid var(--hairline);background:var(--surface);margin-block:var(--sp-6)}
.sbc-toc h2{font-size:var(--t-lg);margin:0 0 var(--sp-3)}
.sbc-toc ol{counter-reset:toc;list-style:none;padding:0}
.sbc-toc li{counter-increment:toc;margin-top:.45em}
.sbc-toc a{display:flex;gap:.7em;font-size:var(--t-sm);color:var(--slate-300);text-decoration:none}
.sbc-toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--font-mono);font-size:.78em;color:var(--ice-400)}
.sbc-toc a:hover{color:var(--snow)}

.sbc-faq{display:grid;gap:var(--sp-3)}
.sbc-faq details{border:1px solid var(--hairline);border-radius:var(--radius);background:var(--surface);
  overflow:hidden;transition:border-color var(--dur) var(--ease-out)}
.sbc-faq details[open]{border-color:var(--hairline-bright)}
.sbc-faq summary{list-style:none;cursor:pointer;padding:1.1rem 1.3rem;display:flex;align-items:center;
  justify-content:space-between;gap:var(--sp-4);font-family:var(--font-display);font-weight:600;
  font-size:var(--t-base);letter-spacing:-.015em;color:var(--snow)}
.sbc-faq summary::-webkit-details-marker{display:none}
.sbc-faq summary::after{content:'';width:11px;height:11px;flex-shrink:0;
  border-right:1.5px solid var(--ice-400);border-bottom:1.5px solid var(--ice-400);
  rotate:45deg;transition:rotate var(--dur) var(--ease-spring)}
.sbc-faq details[open] summary::after{rotate:-135deg}
.sbc-faq .sbc-faq-body{padding:0 1.3rem 1.2rem;color:var(--slate-300)}
@media (prefers-reduced-motion:no-preference){.sbc-faq details[open] .sbc-faq-body{animation:sbc-faq .42s var(--ease-out)}}
@keyframes sbc-faq{from{opacity:0;transform:translateY(-6px)}}

.sbc-cursor{display:none}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .sbc-cursor{display:block;position:fixed;top:0;left:0;width:26px;height:26px;border-radius:50%;
    border:1px solid var(--ice-400);pointer-events:none;z-index:9999;translate:-50% -50%;will-change:transform;
    transition:width .34s var(--ease-spring),height .34s var(--ease-spring),background .34s var(--ease-out)}
  .sbc-cursor[data-active=true]{width:52px;height:52px;background:rgba(77,163,255,.14);border-color:var(--ice-300)}}

@view-transition{navigation:auto}
@media (prefers-reduced-motion:no-preference){
  ::view-transition-old(root){animation:sbc-vt-out .26s cubic-bezier(.65,0,.35,1) both}
  ::view-transition-new(root){animation:sbc-vt-in .42s var(--ease-out) both}
  ::view-transition-group(site-header){animation-duration:0ms}}
@keyframes sbc-vt-out{to{opacity:0;transform:translateY(-8px) scale(.995)}}
@keyframes sbc-vt-in{from{opacity:0;transform:translateY(12px) scale(.995)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important}
  .sbc-grain,.sbc-snowfield,.sbc-cursor{display:none !important}
  .sbc-reveal,.sbc-line > span,.sbc-stagger > *{opacity:1 !important;transform:none !important}}
@media (forced-colors:active){
  .sbc-grain,.sbc-snowfield,.sbc-lightfield,.sbc-cursor{display:none}
  .sbc-btn,.sbc-card{border:1px solid CanvasText}}
@media print{
  .sbc-grain,.sbc-snowfield,.sbc-lightfield,.sbc-cursor,.site-header,.site-footer{display:none !important}
  body{background:#fff !important;color:#000}}
@media (max-width:640px){
  .sbc-hero{min-height:auto;padding-block:var(--sp-8) var(--sp-7)}
  .sbc-hero-copy{max-width:none}}