@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{color-scheme:light;--canvas:#f7f8f5;--surface:#fff;--raised:#fff;--surface-2:#f0f2ee;--wash:#f1f3f0;--wash-2:#eef0ed;--ink:#101418;--ink-soft:#39444a;--ink-muted:#55616a;--muted:#5e666d;--faint:#758085;--ghost:#8b969b;--faintest:#93a0a5;--line:#dce1e0;--line-soft:#eef1ee;--line-strong:#cbd2d3;--line-hover:#929d9f;--track:#e9ede9;--indigo:#4353e8;--indigo-strong:#3040c5;--indigo-solid:#4353e8;--indigo-solid-hover:#3040c5;--indigo-soft:#eaedff;--indigo-soft-line:#d8dcff;--indigo-tint:#eef0ff;--indigo-wash:#f4f6ff;--on-indigo-soft:#3444c9;--indigo-ring:#dfe3ff;--focus-ring:0 0 0 4px rgba(67,83,232,.12);--selection:#dce2ff;--lime:#c6f36a;--lime-ink:#22300a;--lime-soft:#ebf8d3;--lime-halo:#e1f4c3;--success:#365a11;--success-soft:#edf7dc;--success-soft-line:#cce8a0;--warn:#995200;--warn-soft:#fff2df;--warn-soft-line:#f7d8aa;--danger-text:#b3372a;--score:#2cab7e;--score-text:#1b8b65;--dark:#12171b;--dark-2:#1d252b;--radius:14px;--shadow:0 22px 70px rgba(15,21,31,.09);--container:1240px;--ease:cubic-bezier(.2,.75,.2,1);--header-bg:rgba(247,248,245,.97);--glow:#e8edff;--backplate:#e6e8df;--backplate-line:#cfd7fb;--grid-line:#d4dce0;--topic-bg:rgba(255,255,255,.55);--code-bg:#12171b;--code-ink:#d7e0e4;--select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' stroke='%235e666d' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--canvas);color:var(--ink);font:400 16px/1.6 Manrope,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased}body.menu-open{overflow:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}::selection{background:var(--selection);color:var(--ink)}:focus-visible{outline:3px solid var(--indigo);outline-offset:3px}h1,h2,h3,h4,p,figure{margin:0}h1,h2,h3{letter-spacing:-.052em;line-height:1.1}h1{font-size:clamp(3.3rem,6.25vw,6.3rem);font-weight:800}h2{font-size:clamp(2.4rem,4.4vw,4.55rem);font-weight:800}h3{font-size:1.4rem;font-weight:800}p{color:var(--muted)}.mono,.eyebrow,.badge,.micro,.code,.nav-link,.footer-label{font-family:'DM Mono',monospace}.container{width:min(calc(100% - 48px),var(--container));margin-inline:auto}.section{padding:112px 0}.section-sm{padding:80px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:38px}.section-heading h2{max-width:800px}.section-heading p{max-width:410px}.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--indigo);margin-bottom:22px}.eyebrow:before{content:'';display:block;width:19px;height:2px;background:currentColor}.eyebrow.light{color:var(--lime)}.lead{font-size:1.12rem;line-height:1.75;max-width:660px}.micro{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.text-light{color:#d1d8da}.muted{color:var(--muted)}.center{text-align:center}.hide-mobile{display:block}
.skip-link{position:absolute;left:16px;top:-80px;background:var(--ink);color:var(--canvas);padding:12px 18px;z-index:200}.skip-link:focus{top:12px}.site-header{position:sticky;top:0;z-index:100;background:var(--header-bg);border-bottom:1px solid var(--line)}.header-inner{min-height:78px;display:flex;align-items:center;gap:34px}.logo{display:inline-flex;align-items:center;gap:11px;white-space:nowrap;font-weight:800;font-size:1.35rem;letter-spacing:-.065em}.logo img{width:auto;height:36px}.logo-dark{display:none}[data-theme="dark"] .logo-light{display:none}[data-theme="dark"] .logo-dark{display:inline}.desktop-nav{display:flex;align-items:center;justify-content:center;gap:22px;margin-left:auto}.nav-link{font-size:.77rem;font-weight:500;color:var(--ink-muted);white-space:nowrap;transition:color .2s}.nav-link:hover,.nav-link[aria-current=page]{color:var(--indigo)}.header-actions{display:flex;align-items:center;gap:12px}.menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--line);background:var(--surface);border-radius:9px;align-items:center;justify-content:center;flex-direction:column;gap:5px}.menu-toggle span{width:19px;height:2px;background:var(--ink);transition:transform .2s,opacity .2s}.mobile-nav{display:none}
.btn{min-height:47px;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:0 19px;border-radius:9px;border:1px solid transparent;font-size:.86rem;font-weight:800;line-height:1.2;transition:transform .22s var(--ease),background .22s,color .22s,box-shadow .22s;white-space:nowrap}.btn:hover{transform:translateY(-2px)}.btn:active{transform:translateY(0)}.btn svg,.text-link svg{width:16px;height:16px;flex:none}.btn-primary{background:var(--indigo-solid);color:#fff;box-shadow:0 7px 18px rgba(67,83,232,.15)}.btn-primary:hover{background:var(--indigo-solid-hover);box-shadow:0 10px 24px rgba(67,83,232,.24)}.btn-dark{background:var(--dark);color:#fff}.btn-dark:hover{background:#26313a}.btn-outline{border-color:var(--line-strong);background:transparent;color:var(--ink)}.btn-outline:hover{border-color:var(--ink);background:var(--surface)}.btn-light{background:var(--surface);color:var(--ink)}.btn-lime{background:var(--lime);color:var(--lime-ink)}.text-link{display:inline-flex;align-items:center;gap:9px;font-size:.9rem;font-weight:800;color:var(--indigo);transition:gap .2s}.text-link:hover{gap:14px}.button-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.badge{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;padding:6px 9px;border:1px solid var(--line);border-radius:5px;font-size:.63rem;font-weight:500;line-height:1.2;letter-spacing:.025em;text-transform:uppercase;background:var(--surface);color:var(--ink-muted)}.badge.indigo{background:var(--indigo-soft);border-color:var(--indigo-soft-line);color:var(--on-indigo-soft)}.badge.green{background:var(--success-soft);border-color:var(--success-soft-line);color:var(--success)}.badge.orange{background:var(--warn-soft);border-color:var(--warn-soft-line);color:var(--warn)}.badge.dark{background:#283138;border-color:#3e4b53;color:#e1e7e8}.badge-row{display:flex;flex-wrap:wrap;gap:6px}
.hero{padding:74px 0 54px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:43% 57%;align-items:center;gap:34px}.hero-copy{padding:30px 0 50px}.hero h1{max-width:660px;margin-bottom:28px}.hero h1 em,.page-hero h1 em{font-style:normal;color:var(--indigo)}.hero .lead{max-width:520px;margin-bottom:31px}.hero-proof{margin-top:43px;display:flex;align-items:center;gap:12px;color:var(--faint);font-size:.74rem;font-weight:700}.hero-proof .proof-dash{height:1px;width:26px;background:var(--ghost)}.hero-visual{position:relative;padding:8px 0 42px 12px}.visual-backplate{position:absolute;inset:50px -90px 5px 58px;background:var(--backplate);border-radius:20px;transform:rotate(5deg)}.browser{position:relative;background:#fff;border:1px solid #dce1e4;border-radius:13px;overflow:hidden;box-shadow:0 33px 80px rgba(21,28,36,.18)}.browser-bar{height:38px;display:flex;align-items:center;gap:5px;padding:0 14px;background:#f4f5f4;border-bottom:1px solid #dde1e2}.browser-bar i{width:7px;height:7px;background:#c5cacc;border-radius:50%}.browser-url{margin:auto;max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#929b9d;font:400 .58rem 'DM Mono',monospace}.preview-site{background:#e8e8e2;min-height:380px}.preview-head{height:52px;background:#f6f6f0;display:flex;align-items:center;justify-content:space-between;padding:0 24px;color:#2c2c27;font-size:.65rem}.preview-word{font-weight:800;font-size:1.06rem;letter-spacing:-.08em}.preview-menu{display:flex;gap:15px;color:#666}.preview-image{position:relative;min-height:322px;display:flex;align-items:end;background-size:cover;background-position:center}.preview-image:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,rgba(20,24,24,.7))}.preview-overlay{position:relative;color:white;padding:27px 30px 30px}.preview-overlay small{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase}.preview-overlay strong{display:block;font-size:clamp(1.6rem,2.8vw,3rem);line-height:1.05;letter-spacing:-.06em;margin:8px 0 16px;max-width:480px}.preview-overlay span{display:inline-block;border:1px solid rgba(255,255,255,.75);padding:7px 10px;font-size:.65rem}.floating-spec{position:absolute;right:-24px;bottom:5px;background:var(--dark);color:white;border:1px solid #354048;border-radius:10px;padding:17px 19px;box-shadow:var(--shadow);min-width:216px}.floating-spec .micro{color:#a9b9c1;margin-bottom:7px}.floating-spec strong{display:block;font:500 .81rem 'DM Mono',monospace}.floating-spec .spec-dots{display:flex;gap:10px;margin-top:13px;font:.63rem 'DM Mono',monospace;color:var(--lime)}
.trust-strip{border-block:1px solid var(--line);background:var(--surface-2)}.trust-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:19px 0}.trust-inner span{font:.66rem 'DM Mono',monospace;letter-spacing:.055em;text-transform:uppercase;color:var(--faint);white-space:nowrap}.trust-inner span:first-child{color:var(--ink);font-weight:500}.trust-inner b{font-weight:500;color:var(--ink-muted)}.trust-inner .tiny-dot{width:3px;height:3px;background:var(--ghost);border-radius:50%}
.product-grid{display:grid;grid-template-columns:1.18fr .91fr .91fr;gap:16px}.product-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s}.product-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line-strong)}.product-visual{position:relative;aspect-ratio:1.3;overflow:hidden;background:var(--wash-2)}.product-card:first-child .product-visual{aspect-ratio:1.18}.product-visual img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}.product-card:hover .product-visual img{transform:scale(1.025)}.product-visual .visual-label{position:absolute;top:17px;left:17px;background:rgba(255,255,255,.95);border:1px solid rgba(255,255,255,.7);padding:6px 9px;border-radius:5px;color:#353c3e;font:.63rem 'DM Mono',monospace}.product-body{padding:23px 24px 20px;display:flex;flex-direction:column;flex:1}.product-kicker{font:.63rem 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--indigo);margin-bottom:8px}.product-body h3{font-size:1.65rem;margin-bottom:8px}.product-body p{font-size:.83rem;line-height:1.65;min-height:58px}.product-body .badge-row{margin:19px 0}.product-bottom{margin-top:auto;padding-top:18px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}.product-price{font-size:1.1rem;font-weight:800;letter-spacing:-.04em}.product-price small{display:block;font:.59rem 'DM Mono',monospace;letter-spacing:.03em;color:var(--muted)}.product-card .text-link{font-size:.79rem}.product-card .text-link svg{width:14px}
.dark-section{background:var(--dark);color:white;overflow:hidden}.dark-section p{color:#adb9bd}.dark-section .eyebrow{color:var(--lime)}.dark-section h2{max-width:710px}.proof-intro{display:grid;grid-template-columns:1fr .8fr;gap:80px;align-items:end;margin-bottom:40px}.proof-intro p{max-width:410px}.proof-grid{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:auto auto;gap:14px}.proof-panel{background:var(--dark-2);border:1px solid #39444b;border-radius:var(--radius);overflow:hidden;min-height:230px;padding:28px}.proof-panel.large{grid-row:span 2;min-height:485px;padding:0}.proof-panel h3{font-size:1.25rem;letter-spacing:-.035em;margin-bottom:7px}.proof-panel p{font-size:.82rem;line-height:1.65}.panel-top{padding:27px 30px;border-bottom:1px solid #39444b;display:flex;align-items:center;justify-content:space-between;gap:15px}.code-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #39444b;padding:11px 29px;color:#9caeb6;font:.68rem 'DM Mono',monospace}.code{color:#d5e4e4;font:400 .84rem/2 'DM Mono',monospace;white-space:pre-wrap;overflow-wrap:anywhere}.code b{color:var(--lime);font-weight:500}.code .blue{color:#a6b1ff}.proof-panel pre{padding:28px 30px;margin:0}.file-tree{margin-top:23px;padding:17px 20px;border-radius:8px;border:1px solid #425059;background:#161c20;font:.67rem/1.8 'DM Mono',monospace;color:#bdc9cd}.file-tree b{color:var(--lime);font-weight:400}.proof-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.proof-pills span{font:.62rem 'DM Mono',monospace;border:1px solid #4c5a61;color:#d6e2e2;border-radius:5px;padding:7px 9px}.copy-btn{border:1px solid #55636a;background:transparent;color:#dfe9e8;border-radius:5px;padding:5px 8px;font:.62rem 'DM Mono',monospace}.copy-btn:hover{background:#354149}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.statement-list{border-top:1px solid var(--line)}.statement{display:grid;grid-template-columns:34px 1fr;gap:16px;padding:23px 0;border-bottom:1px solid var(--line)}.statement .index{display:grid;place-items:center;width:30px;height:30px;margin-top:2px;border:1px solid var(--indigo-soft-line);border-radius:9px;background:var(--indigo-wash);font:.68rem 'DM Mono',monospace;color:var(--indigo)}.statement h3{font-size:1.12rem;letter-spacing:-.025em;margin-bottom:6px}.statement p{font-size:.85rem;line-height:1.65}.audit-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:29px 29px 25px;box-shadow:0 26px 64px rgba(15,21,31,.1),0 4px 14px rgba(15,21,31,.05)}.audit-card:before{content:'';position:absolute;top:-1px;left:26px;right:26px;height:3px;border-radius:0 0 3px 3px;background:linear-gradient(90deg,var(--lime),#2cab7e 70%,transparent)}.audit-head{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:22px}.audit-hero{display:flex;align-items:center;gap:20px}.score-ring{--p:88;position:relative;display:grid;place-items:center;flex:none;width:112px;height:112px;border-radius:50%;background:conic-gradient(var(--score) calc(var(--p)*1%),var(--track) 0)}.score-ring:before{content:'';position:absolute;inset:8px;border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-soft)}.score-ring b{position:relative;font-size:2.05rem;font-weight:800;letter-spacing:-.06em;color:var(--score-text)}.audit-hero-copy h3{font-size:1.32rem;letter-spacing:-.035em;margin-bottom:7px}.audit-hero-copy p{font-size:.82rem;line-height:1.65}.audit-bars{display:grid;gap:15px;margin-top:26px}.audit-bar-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:.78rem;font-weight:800;color:var(--ink);margin-bottom:7px}.audit-bar-head b{font:500 .68rem 'DM Mono',monospace;color:var(--success)}.track{height:9px;border-radius:99px;background:var(--track);overflow:hidden}.fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#33b786,#1b8b65)}.audit-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.audit-chips span{font:.63rem 'DM Mono',monospace;letter-spacing:.04em;border:1px solid var(--line);border-radius:99px;padding:7px 11px;background:var(--surface);color:var(--ink-muted)}.audit-note{font-size:.7rem;margin-top:22px;border-top:1px solid var(--line);padding-top:15px}.js .audit-card .fill{transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}.js .audit-card.is-visible .fill{transform:scaleX(1)}.js .audit-card.is-visible .audit-bar:nth-child(2) .fill{transition-delay:.12s}.js .audit-card.is-visible .audit-bar:nth-child(3) .fill{transition-delay:.24s}@media(prefers-reduced-motion:reduce){.js .audit-card .fill{transform:none;transition:none}}
.callout{background:var(--indigo-solid);color:#fff;border-radius:18px;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;min-height:270px;overflow:hidden}.callout-copy{padding:44px 50px}.callout h2{font-size:clamp(2rem,3.6vw,3.7rem);max-width:650px}.callout p{color:#dce0ff;max-width:530px;margin:16px 0 23px;font-size:.88rem}.callout-art{position:relative;height:100%;min-height:270px;background:radial-gradient(circle at 45% 50%,#7985ff 0,transparent 56%)}.callout-art:before,.callout-art:after{content:'';position:absolute;width:240px;height:280px;border:1px solid #a5aeff;border-radius:14px;transform:rotate(-16deg);top:31px;left:17%}.callout-art:after{background:#f2f4ef;box-shadow:0 15px 35px #2832a350;transform:rotate(9deg);top:58px;left:27%;width:240px;height:270px}.callout-mini{position:absolute;z-index:2;top:86px;left:35%;width:208px;height:195px;border-radius:8px;overflow:hidden;background:#fff;transform:rotate(9deg)}.callout-mini img{width:100%;height:100%;object-fit:cover}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.article-card{display:flex;flex-direction:column;min-height:275px;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);padding:26px;transition:transform .2s var(--ease),box-shadow .2s}.article-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.article-card .micro{color:var(--indigo)}.article-card h3{font-size:1.38rem;line-height:1.2;margin:25px 0 12px}.article-card p{font-size:.82rem}.article-card .text-link{margin-top:auto;padding-top:25px;font-size:.78rem}
.page-hero{padding:76px 0 66px;border-bottom:1px solid var(--line)}.page-hero h1{font-size:clamp(3.1rem,5.7vw,5.8rem);max-width:880px;margin-bottom:21px}.page-hero p{max-width:670px;font-size:1.08rem}.hero-sub{margin-bottom:32px}.page-hero .button-row{margin-top:29px}.page-hero.compact{padding:67px 0 50px}.page-hero.compact h1{font-size:clamp(2.9rem,4.6vw,4.6rem)}.crumbs{display:flex;flex-wrap:wrap;gap:8px;font:.66rem 'DM Mono',monospace;color:var(--faint);margin-bottom:22px}.crumbs a:hover{color:var(--indigo)}.crumbs span:last-child{color:var(--ink)}
.filter-bar{display:grid;grid-template-columns:1fr repeat(3,minmax(155px,.5fr));gap:9px;margin-bottom:22px}.filter-bar input,.filter-bar select,.field input,.field textarea{min-height:47px;width:100%;border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:11px 13px;color:var(--ink);font-size:.84rem;outline:none}.filter-bar input:focus,.filter-bar select:focus,.field input:focus,.field textarea:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-ring)}.filter-count{font:.72rem 'DM Mono',monospace;color:var(--muted);margin-bottom:13px}.empty-state{display:none;border:1px dashed var(--line-strong);padding:40px;border-radius:10px;text-align:center}.empty-state.show{display:block}
.detail-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,.7fr);gap:28px;align-items:start}.detail-main{min-width:0}.detail-browser .preview-site{min-height:510px}.detail-browser .preview-image{min-height:450px}.detail-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}.detail-gallery img{aspect-ratio:1.4;width:100%;height:100%;object-fit:cover;border-radius:7px}.detail-section{padding:50px 0;border-bottom:1px solid var(--line)}.detail-section h2{font-size:2rem;margin-bottom:15px}.detail-section p{max-width:780px}.detail-section ul,.content-article ul,.content-article ol{padding-left:21px;color:var(--ink-muted)}.detail-section li{margin:9px 0}.buy-panel{position:sticky;top:101px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:25px;box-shadow:var(--shadow)}.buy-panel h1{font-size:2.35rem;margin:15px 0 9px}.buy-panel p{font-size:.86rem}.buy-panel .badge-row{margin:20px 0}.buy-price{font-size:2.8rem;font-weight:800;line-height:1.1;letter-spacing:-.07em;margin:22px 0}.buy-price small{display:block;font:.68rem 'DM Mono',monospace;color:var(--muted);letter-spacing:0;margin-bottom:6px}.buy-panel select{width:100%;height:46px;margin:9px 0 15px;border:1px solid var(--line-strong);border-radius:8px;padding:0 12px;background:var(--surface)}.buy-panel .btn{width:100%;margin-top:8px}.buy-includes{border-top:1px solid var(--line);padding-top:19px;margin-top:22px;display:grid;gap:10px;font-size:.77rem;color:var(--ink-muted)}.buy-includes span:before{content:'✓';color:var(--success);font-weight:800;margin-right:8px}.notice{background:var(--indigo-tint);border-left:3px solid var(--indigo);padding:16px 18px;font-size:.8rem;color:var(--ink-muted);border-radius:0 6px 6px 0}.notice a{text-decoration:underline;font-weight:800}
.compare-table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:.82rem}.compare-table th,.compare-table td{text-align:left;border-bottom:1px solid var(--line);padding:16px}.compare-table th{background:var(--surface-2);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}.compare-table tr:last-child td{border-bottom:0}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.price-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:30px;display:flex;flex-direction:column}.price-card.featured{border:2px solid var(--indigo);box-shadow:var(--shadow)}.price-card h3{font-size:1.5rem;margin:18px 0 10px}.price-card p{font-size:.84rem}.price-card .price{font-size:2.6rem;font-weight:800;letter-spacing:-.07em;margin:20px 0}.price-card .price small{font-size:.76rem;color:var(--muted);font-weight:600;letter-spacing:0}.price-card ul{padding-left:18px;font-size:.82rem;line-height:2;color:var(--ink-muted);margin:0 0 26px}.price-card .btn{margin-top:auto}
.faq{max-width:880px;margin:auto}.faq details{border-bottom:1px solid var(--line);padding:0}.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:21px 0;font-weight:800;font-size:.94rem}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';font:400 1.7rem Manrope;line-height:1;color:var(--indigo)}.faq details[open] summary:after{content:'−'}.faq details p{padding:0 42px 22px 0;font-size:.86rem}
.docs-layout{display:grid;grid-template-columns:220px minmax(0,1fr) 178px;gap:42px;padding-top:56px}.docs-side,.docs-toc{position:sticky;top:110px;align-self:start}.docs-side a,.docs-toc a{display:block;padding:9px 11px;color:var(--faint);font-size:.8rem;border-left:2px solid transparent}.docs-side a:hover,.docs-toc a:hover,.docs-side a.active{color:var(--indigo);background:var(--indigo-tint);border-color:var(--indigo)}.docs-side .footer-label,.docs-toc .footer-label{margin:0 0 8px 11px}.docs-content{min-width:0}.docs-content h2{font-size:2rem;margin:46px 0 16px;scroll-margin-top:110px}.docs-content h2:first-child{margin-top:0}.docs-content h3{font-size:1.15rem;margin:30px 0 9px}.docs-content p,.docs-content li{font-size:.88rem;line-height:1.8}.docs-content ul{padding-left:20px}.docs-code{background:var(--dark);border-radius:9px;color:white;overflow:hidden;margin:23px 0}.docs-code .code-head{padding-inline:18px}.docs-code pre{padding:18px;margin:0;overflow:auto}
.blog-feature{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius);overflow:hidden;margin-bottom:18px;min-height:360px}.blog-feature img{height:100%;width:100%;object-fit:cover}.blog-feature .feature-copy{padding:36px;display:flex;flex-direction:column;justify-content:center}.blog-feature h2{font-size:2.4rem;margin:14px 0}.blog-feature p{font-size:.9rem}.blog-feature .text-link{margin-top:23px}.content-article{max-width:770px;margin:auto;padding:65px 0 110px}.content-article h1{font-size:clamp(2.7rem,5vw,4.7rem);margin:13px 0 18px}.content-article h2{font-size:2rem;margin:46px 0 17px}.content-article h3{font-size:1.25rem;margin:29px 0 12px}.content-article p{font-size:1rem;line-height:1.9;margin:17px 0}.content-article .intro{font-size:1.24rem;color:var(--ink-soft)}.content-article figure{margin:38px 0}.content-article figure img{border-radius:10px;width:100%;aspect-ratio:1.6;object-fit:cover}.content-article figcaption{font:.68rem 'DM Mono',monospace;color:var(--faint);margin-top:9px}.article-meta{font:.69rem 'DM Mono',monospace;color:var(--faint)}.article-callout{margin:35px 0;padding:24px;border-left:3px solid var(--indigo);background:var(--indigo-tint);font-weight:700;color:var(--ink-soft)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px}.contact-card{background:var(--surface);border:1px solid var(--line);padding:36px;border-radius:var(--radius)}.contact-card h2{font-size:2rem;margin-bottom:12px}.contact-card p{font-size:.86rem;margin-bottom:20px}.contact-option{display:block;padding:17px 0;border-top:1px solid var(--line);font-size:.88rem;font-weight:800;color:var(--indigo)}.contact-option span{display:block;color:var(--muted);font-size:.73rem;font-weight:500;margin-top:3px}.legal-card{max-width:820px;margin:0 auto 100px}.legal-card .notice{margin-bottom:26px}.legal-card h2{font-size:1.7rem;margin:35px 0 14px}.legal-card p,.legal-card li{font-size:.9rem;line-height:1.85;margin:12px 0}.legal-card ul{padding-left:20px}.placeholder{background:var(--warn-soft);color:var(--warn);border:1px dashed var(--warn-soft-line);padding:2px 6px;border-radius:4px;font-family:'DM Mono',monospace;font-size:.78em}
.site-footer{background:#11171b;color:white;padding:70px 0 25px}.footer-top{display:grid;grid-template-columns:1.6fr repeat(3,.7fr);gap:44px;padding-bottom:65px}.site-footer .logo{font-size:1.5rem}.footer-brand p{color:#a4b0b5;max-width:340px;font-size:.83rem;margin-top:22px}.footer-label{font-size:.62rem;color:#9aa9ad;text-transform:uppercase;letter-spacing:.12em;margin-bottom:16px}.footer-col a{display:block;color:#d2dadd;font-size:.8rem;padding:6px 0}.footer-col a:hover{color:var(--lime)}.footer-bottom{border-top:1px solid #334047;padding-top:22px;display:flex;justify-content:space-between;gap:25px;color:#91a0a5;font-size:.68rem}.footer-bottom p{color:inherit;max-width:600px}
.newsletter-section{padding-bottom:96px}
.newsletter-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:52px;align-items:center;padding:55px 52px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.newsletter-copy h2{font-size:clamp(1.9rem,3vw,2.6rem);margin:0 0 15px}
.newsletter-copy p{font-size:.9rem;line-height:1.75;max-width:430px}
.newsletter-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.newsletter-fields input{width:100%;min-height:52px;padding:13px 16px;border:1px solid var(--line-strong);border-radius:9px;background:var(--surface);color:var(--ink);font-size:.88rem;outline:none;transition:border-color .2s,box-shadow .2s}
.newsletter-fields input::placeholder{color:var(--faintest)}
.newsletter-fields input:focus{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-ring)}
.newsletter-fields .newsletter-email,.newsletter-fields .btn{grid-column:span 2}
.newsletter-fields .btn{min-height:52px}
.newsletter-status{min-height:1.35em;color:var(--success);font-size:.8rem;font-weight:700;margin-top:12px}
.newsletter-status:empty{margin-top:0}
.newsletter-status.is-error{color:var(--danger-text)}
.newsletter-note{color:var(--ghost);font-size:.68rem;margin-top:2px}
.newsletter-note a{text-decoration:underline;text-underline-offset:3px}
.newsletter-note a:hover{color:var(--indigo)}
@media(max-width:900px){.newsletter-card{grid-template-columns:1fr;gap:30px;padding:37px 27px}.newsletter-section{padding-bottom:74px}}
@media(max-width:620px){.newsletter-fields{grid-template-columns:1fr}.newsletter-fields .newsletter-email,.newsletter-fields .btn{grid-column:auto}}
.js [data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .65s var(--ease),transform .65s var(--ease)}.js [data-reveal].is-visible{opacity:1;transform:none}[data-reveal="delay"]{transition-delay:.1s}.product-card[hidden]{display:none}.btn-primary img,.btn-dark img{filter:brightness(0) invert(1)}
@media(max-width:1100px){.desktop-nav{gap:16px}.nav-link{font-size:.78rem}.header-inner{gap:17px}.header-actions .btn{padding-inline:12px}.product-grid{grid-template-columns:repeat(3,1fr)}.product-body{padding:20px}.product-body h3{font-size:1.4rem}.hero-grid{grid-template-columns:46% 54%}.floating-spec{right:0}.docs-layout{grid-template-columns:180px minmax(0,1fr)}.docs-toc{display:none}}
@media(max-width:900px){.desktop-nav,.header-actions>.btn{display:none}.header-inner{min-height:78px}.header-actions{margin-left:auto}.menu-toggle{display:flex}.mobile-nav{display:none;position:fixed;z-index:99;top:78px;left:0;right:0;bottom:0;background:var(--canvas);padding:25px 24px;overflow:auto}.mobile-nav.open{display:block}.mobile-nav a{display:block;padding:17px 0;border-bottom:1px solid var(--line);font-size:1.35rem;font-weight:800}.mobile-nav .btn{margin-top:22px;color:white;text-align:center}.hero-grid{grid-template-columns:1fr}.hero{padding-top:45px}.hero-copy{padding:0}.hero h1{max-width:740px}.hero-visual{max-width:680px;margin:15px auto 0;width:100%}.trust-inner{overflow:auto;justify-content:start}.product-grid,.article-grid,.price-grid{grid-template-columns:repeat(2,1fr)}.product-card:first-child{grid-column:span 2;display:grid;grid-template-columns:1.1fr .9fr}.product-card:first-child .product-visual{aspect-ratio:auto;height:100%}.product-card:first-child .product-body{padding:28px}.two-col{gap:35px}.proof-intro{gap:30px}.footer-top{grid-template-columns:1.4fr repeat(2,.7fr)}.footer-brand{grid-column:span 3}.detail-layout{grid-template-columns:1fr}.buy-panel{position:static;grid-row:1}.docs-layout{gap:20px}.contact-grid{gap:20px}}
@media(max-width:620px){.container{width:min(calc(100% - 36px),var(--container))}.section{padding:74px 0}.section-sm{padding:58px 0}.section-heading{display:block;margin-bottom:28px}.section-heading p{margin-top:16px}.hero{padding:34px 0 42px}.hero h1{font-size:clamp(2.85rem,12vw,4rem);margin-bottom:20px}.hero .lead{font-size:.99rem}.hero-proof{margin-top:27px;flex-wrap:wrap}.hero-visual{padding:0 5px 30px 0}.visual-backplate{inset:35px -30px 0 32px}.preview-site{min-height:290px}.preview-image{min-height:242px}.preview-head{padding-inline:14px}.preview-menu{gap:7px;font-size:.55rem}.preview-overlay{padding:18px}.preview-overlay strong{font-size:1.85rem}.floating-spec{right:0;bottom:0;min-width:170px;padding:10px 12px}.floating-spec strong{font-size:.68rem}.floating-spec .spec-dots{font-size:.53rem;gap:5px}.trust-inner{padding:13px 0}.trust-inner span{font-size:.59rem}.product-grid,.article-grid,.price-grid{grid-template-columns:1fr}.product-card:first-child{grid-column:auto;display:flex}.product-card:first-child .product-visual,.product-visual{aspect-ratio:1.35;height:auto}.product-body p{min-height:0}.proof-intro,.proof-grid,.two-col,.callout,.blog-feature,.contact-grid{grid-template-columns:1fr}.proof-grid{grid-template-rows:auto}.proof-panel.large{grid-row:auto;min-height:0}.proof-panel{min-height:0}.proof-panel pre{padding:20px}.panel-top{padding:20px}.callout-copy{padding:30px}.callout-art{min-height:210px}.callout-mini{top:18px}.page-hero,.page-hero.compact{padding:47px 0}.page-hero h1,.page-hero.compact h1{font-size:clamp(2.65rem,11vw,4rem)}.filter-bar{grid-template-columns:1fr 1fr}.filter-bar input{grid-column:span 2}.filter-bar select:last-child{grid-column:span 2}.detail-browser .preview-site{min-height:320px}.detail-browser .preview-image{min-height:270px}.detail-gallery{gap:5px}.detail-section{padding:35px 0}.buy-panel h1{font-size:2rem}.compare-table{display:block;overflow:auto;white-space:nowrap}.price-card{padding:25px}.docs-layout{display:block}.docs-side{position:static;display:flex;overflow:auto;margin-bottom:35px;gap:5px}.docs-side .footer-label{display:none}.docs-side a{white-space:nowrap;border-left:0;border-bottom:2px solid transparent}.blog-feature img{aspect-ratio:1.5}.blog-feature .feature-copy{padding:24px}.blog-feature h2{font-size:1.8rem}.content-article{padding:45px 0 70px}.content-article h1{font-size:2.6rem}.contact-card{padding:24px}.footer-top{grid-template-columns:1fr 1fr;gap:30px}.footer-brand{grid-column:span 2}.footer-bottom{display:block}.footer-bottom p+p{margin-top:10px}.hide-mobile{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}[data-reveal]{opacity:1;transform:none}}
.hero-grid{grid-template-columns:minmax(0,43fr) minmax(0,57fr)}
.buy-panel h2{font-size:2.35rem;margin:15px 0 9px}
.demo-intro{padding:80px 0 55px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.55fr);gap:30px;align-items:end}
@media(max-width:1100px){.hero-grid{grid-template-columns:minmax(0,46fr) minmax(0,54fr)}}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
@media(max-width:620px){.demo-intro{grid-template-columns:1fr;padding:60px 0 38px}.buy-panel h2{font-size:2rem}}
.logo,.nav-link,.text-link{min-height:44px;align-items:center}
.nav-link{display:inline-flex}
.footer-col a{min-height:44px;display:flex;align-items:center}
.copy-btn{min-height:44px;min-width:74px}
.demo-nav{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;border-bottom:1px solid #d6d3cb}
.demo-outro{padding:65px 0 100px;display:grid;grid-template-columns:1fr 1fr;gap:30px}
@media(max-width:620px){.demo-nav{align-items:start;flex-direction:column;gap:8px}.demo-nav .mono{font-size:.58rem!important;line-height:1.8}.demo-outro{grid-template-columns:1fr;padding:50px 0 70px}}

/* Motive UI — controls */
.logo img{width:auto;height:40px}
.btn{min-height:52px;padding:5px 5px 5px 18px;gap:18px;border-radius:10px;justify-content:space-between;box-shadow:0 5px 15px rgba(22,29,54,.07)}
.btn-label{display:block;letter-spacing:-.015em}
.btn-icon{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:7px;background:rgba(255,255,255,.15);transition:transform .22s var(--ease),background .22s var(--ease)}
.btn-icon img{width:17px;height:17px}
.btn:hover .btn-icon{transform:translate(2px,-1px)}
.btn-primary{border-color:#3949d7;box-shadow:0 8px 20px rgba(67,83,232,.18)}
.btn-primary .btn-icon{background:rgba(255,255,255,.18)}
.btn-outline{background:var(--surface);border-color:var(--line-strong);box-shadow:0 4px 12px rgba(17,28,35,.04)}
.btn-outline .btn-icon{background:var(--indigo-tint)}
.btn-light .btn-icon{background:var(--wash)}
.btn-lime{border-color:#a7d348;box-shadow:0 8px 23px rgba(198,243,106,.14)}
.btn-lime .btn-icon{background:#b3e653}
.btn-cta-outline{background:transparent;color:#fff;border-color:#7781a5;box-shadow:none}
.btn-cta-outline:hover{background:#263052;border-color:#aeb8e4}
.btn-cta-outline .btn-icon{background:rgba(255,255,255,.1)}
.btn-cta-outline img{filter:brightness(0) invert(1)}
.menu-toggle{background:var(--indigo-tint);border-color:var(--indigo-soft-line);transition:background .2s,border-color .2s}
.menu-toggle:hover{background:var(--indigo-wash);border-color:#a8b3ff}
.menu-toggle span{background:var(--indigo)}
.mobile-nav .btn{display:inline-flex;padding:5px 5px 5px 18px;border-bottom:1px solid #3949d7;font-size:.86rem}
@media(max-width:900px){
  .mobile-nav.open{display:flex;flex-direction:column}
  .mobile-nav .btn{display:flex;width:100%;min-height:56px;flex:none;justify-content:space-between;margin-top:auto}
}
.copy-btn{border-radius:7px;padding:7px 13px;transition:background .2s,border-color .2s}

/* Product search and licence selection */
.filter-bar{grid-template-columns:minmax(0,1.25fr) repeat(3,minmax(0,1fr));gap:12px;align-items:end;padding:15px;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;margin-bottom:0}
.filter-control{display:block;min-width:0}
.control-caption{display:block;margin:0 0 8px 3px;color:var(--ink-muted);font:500 .64rem 'DM Mono',monospace;letter-spacing:.075em;text-transform:uppercase}
.control-field,.purchase-select{position:relative;display:flex;align-items:center;min-height:52px;background:var(--surface);border:1px solid var(--line-strong);border-radius:9px;box-shadow:0 2px 5px rgba(24,31,35,.025);transition:border-color .18s,box-shadow .18s}
.control-field:hover,.purchase-select:hover{border-color:var(--line-hover)}
.control-field:focus-within,.purchase-select:focus-within{border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-ring)}
.control-field svg{width:19px;height:19px;flex:none;margin-left:15px;color:var(--faint)}
.filter-bar .control-field input,.filter-bar .control-field select{width:100%;height:50px;min-height:50px;padding:0 14px;border:0;outline:0;background:transparent;box-shadow:none!important;color:var(--ink);font-size:.83rem;font-weight:700}
.filter-bar .control-field input{padding-left:11px}
.filter-bar .control-field input::placeholder{color:var(--ghost);font-weight:500}
.filter-bar .control-field input::-webkit-search-cancel-button{-webkit-appearance:none}
.select-wrap:after{content:'';position:absolute;right:18px;top:50%;width:8px;height:8px;border-right:2px solid var(--indigo);border-bottom:2px solid var(--indigo);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.select-wrap select,.buy-panel .purchase-select select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:39px!important}
.select-wrap select::-ms-expand{display:none}
.filter-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:15px 0 18px}
.filter-count{margin:0}
.filter-reset{min-height:44px;padding:6px 10px;border:0;border-radius:7px;background:transparent;color:var(--indigo);font:500 .68rem 'DM Mono',monospace;transition:background .2s}
.filter-reset:hover{background:var(--indigo-wash)}
.filter-reset span{font-size:.85rem}
.buy-panel .control-caption{margin-top:3px}
.buy-panel .purchase-select{margin:0 0 13px}
.buy-panel .purchase-select select{width:100%;height:50px;min-height:50px;margin:0;padding:0 38px 0 14px;border:0;outline:0;background:transparent;box-shadow:none;color:var(--ink);font-size:.85rem;font-weight:700}
.buy-panel .btn{width:100%}

/* FAQ: a guidance panel paired with native disclosure controls */
.faq-layout{display:grid;grid-template-columns:minmax(300px,.79fr) minmax(0,1.21fr);align-items:stretch;gap:18px}
.faq-info-card{position:relative;display:flex;flex-direction:column;min-height:500px;overflow:hidden;padding:30px;border-radius:16px;background:#172033;color:#fff}
.faq-info-card:after{content:'';position:absolute;width:270px;height:270px;right:-145px;top:60px;border:1px solid rgba(160,178,220,.14);border-radius:50%;box-shadow:0 0 0 48px rgba(160,178,220,.035),0 0 0 97px rgba(160,178,220,.025);pointer-events:none}
.faq-info-card>*{position:relative;z-index:1}
.faq-info-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:47px}
.faq-info-top img{width:auto;height:32px;filter:brightness(0) invert(1)}
.faq-info-top .mono{color:#9aaacc;font-size:.6rem;letter-spacing:.08em}
.faq-info-card .eyebrow{margin-bottom:15px}
.faq-info-card h3{max-width:375px;color:#fff;font-size:clamp(2.05rem,2.8vw,3.05rem);line-height:1.12;letter-spacing:-.055em}
.faq-info-card p{max-width:390px;margin-top:18px;color:#c5cee0;font-size:.85rem;line-height:1.75}
.faq-info-bottom{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto;padding-top:30px}
.faq-info-bottom span{padding:7px 8px;border:1px solid #475575;border-radius:5px;color:#bac6de;font:400 .6rem 'DM Mono',monospace}
.faq-info-card .btn{align-self:flex-start;margin-top:24px}
.faq-list{display:grid;align-content:start;gap:10px}
.faq-item{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:var(--surface);transition:border-color .22s,box-shadow .22s}
.faq-item:hover{border-color:var(--line-strong)}
.faq-item[open]{border-color:var(--indigo-soft-line);box-shadow:0 10px 30px rgba(30,43,93,.06)}
.faq-item summary{display:grid;grid-template-columns:28px minmax(0,1fr) 39px;align-items:center;gap:14px;min-height:83px;padding:15px 18px;list-style:none;cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}
.faq-number{color:var(--indigo);font:500 .68rem 'DM Mono',monospace}
.faq-question{color:var(--ink);font-size:.91rem;font-weight:800;letter-spacing:-.02em;line-height:1.4}
.faq-toggle{position:relative;width:38px;height:38px;border:1px solid var(--line-strong);border-radius:50%;background:var(--wash);transition:background .2s,border-color .2s}
.faq-toggle:before,.faq-toggle:after{content:'';position:absolute;left:12px;right:12px;top:18px;height:2px;background:var(--indigo);border-radius:2px;transition:transform .2s}
.faq-toggle:after{transform:rotate(90deg)}
.faq-item[open] .faq-toggle{background:var(--indigo-soft);border-color:var(--indigo-soft-line)}
.faq-item[open] .faq-toggle:after{transform:rotate(0deg)}
.faq-answer{margin:0 20px 0 60px;padding:0 0 23px}
.faq-answer:before{content:'';display:block;width:36px;height:2px;margin-bottom:14px;background:var(--indigo-soft-line)}
.faq-answer p{color:var(--muted);font-size:.84rem;line-height:1.75}

/* Dedicated close-of-page CTA */
.final-cta-section{padding-top:0}
.final-cta{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-height:420px;overflow:hidden;border:1px solid #263657;border-radius:18px;background:#111b33;color:#fff}
.final-cta-copy{position:relative;z-index:1;padding:55px 52px}
.final-cta h2{max-width:650px;color:#fff;font-size:clamp(2.5rem,4vw,4.3rem)}
.final-cta p{max-width:515px;margin-top:18px;color:#c0cbe1;font-size:.9rem;line-height:1.75}
.final-cta .button-row{margin-top:26px}
.cta-proof{display:flex;flex-wrap:wrap;gap:11px 22px;margin-top:43px;padding-top:20px;border-top:1px solid #3b4967}
.cta-proof span{color:#aab8d4;font:400 .63rem 'DM Mono',monospace}
.cta-proof span:before{content:'↗';margin-right:7px;color:var(--lime)}
.final-cta-art{position:relative;display:grid;place-items:center;min-height:520px;overflow:hidden;background:radial-gradient(circle at 53% 45%,#263b7d 0,#101a32 65%)}
.cta-grid{position:absolute;inset:0;background-image:linear-gradient(#9fb0e516 1px,transparent 1px),linear-gradient(90deg,#9fb0e516 1px,transparent 1px);background-size:35px 35px;mask-image:linear-gradient(to right,transparent,#000 30%)}
.final-cta-art img{position:relative;z-index:1;height:clamp(180px,26vw,380px);width:auto;max-width:none;object-fit:contain;mix-blend-mode:screen;opacity:.87}
.cta-art-label{position:absolute;z-index:2;right:25px;bottom:22px;color:#a5b5d5;font:400 .58rem/1.5 'DM Mono',monospace;letter-spacing:.1em;text-align:right}
@media(max-width:1100px){.filter-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-search{grid-column:auto}}
@media(max-width:900px){.faq-layout,.final-cta{grid-template-columns:1fr}.faq-info-card{min-height:370px}.final-cta-art{min-height:330px}}
@media(max-width:620px){.filter-bar{grid-template-columns:repeat(2,minmax(0,1fr));padding:11px;gap:10px}.filter-search{grid-column:1/-1}.filter-control:last-child{grid-column:1/-1}.control-caption{font-size:.58rem}.faq-info-card{min-height:0;padding:25px}.faq-info-top{margin-bottom:36px}.faq-info-bottom{margin-top:30px}.faq-item summary{grid-template-columns:23px minmax(0,1fr) 34px;gap:9px;padding:12px;min-height:72px}.faq-toggle{width:34px;height:34px}.faq-toggle:before,.faq-toggle:after{left:10px;right:10px;top:16px}.faq-answer{margin-left:44px;margin-right:15px}.final-cta-copy{padding:37px 27px}.final-cta-art{min-height:250px}.cta-proof{margin-top:32px}.btn{min-height:49px}.btn-icon{height:37px;width:37px}}
@media(max-width:420px){.filter-bar{grid-template-columns:1fr}.filter-search,.filter-control:last-child{grid-column:auto}.final-cta .button-row .btn{width:100%}}

/* Refined storefront hero and clearer desktop navigation */
.desktop-nav{gap:32px}
.desktop-nav .nav-link{font-size:1rem;font-weight:600;letter-spacing:-.02em;color:var(--ink-soft)}
.desktop-nav .nav-link:hover,.desktop-nav .nav-link[aria-current=page]{color:var(--indigo)}
.hero{padding:86px 0 66px;position:relative}
.hero-grid{grid-template-columns:minmax(0,46fr) minmax(0,54fr);gap:41px}
.hero-copy{padding:21px 0 43px}
.hero-kicker{display:inline-flex;align-items:center;gap:10px;min-height:34px;margin-bottom:28px;padding:6px 11px;border:1px solid var(--indigo-soft-line);border-radius:999px;background:var(--indigo-tint);color:var(--on-indigo-soft);font:500 .64rem 'DM Mono',monospace;letter-spacing:.025em;text-transform:uppercase}
.hero-kicker-dot{width:8px;height:8px;flex:none;border-radius:50%;background:#92cf36;box-shadow:0 0 0 3px #dff4b9}
.hero-kicker-year{color:#8790ba}
.hero h1{max-width:620px;margin-bottom:27px;font-size:clamp(2.9rem,4.6vw,4.6rem);line-height:1.045;letter-spacing:-.07em}
.hero h1 em{background:linear-gradient(transparent 82%,#c6f36a 82%);box-decoration-break:clone;-webkit-box-decoration-break:clone}
.hero .lead{max-width:525px;margin-bottom:31px;font-size:1.07rem;line-height:1.75}
.hero-buttons{gap:11px}
.hero-proof{flex-wrap:wrap;gap:8px 17px;max-width:560px;margin-top:44px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font:500 .64rem 'DM Mono',monospace;letter-spacing:.02em}
.hero-proof .hero-proof-label{color:var(--indigo);font-size:.6rem;letter-spacing:.1em}
.hero-proof span:not(:first-child):before{content:'◆';margin-right:7px;color:#8fb642;font-size:.45rem;vertical-align:2px}
.hero-visual{padding:18px 5px 31px 13px}
.hero-visual-grid{position:absolute;inset:-25px -70px 5px 40px;background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:32px 32px;mask-image:radial-gradient(circle at 60% 48%,#000 0,transparent 72%);opacity:.7}
.hero-visual .visual-backplate{inset:53px -23px 17px 44px;border:1px solid var(--backplate-line);background:var(--backplate);transform:rotate(3.4deg)}
.hero-visual .browser{transform:rotate(-.8deg);border-color:#c9d1d4;box-shadow:0 35px 75px rgba(16,26,47,.2),0 4px 12px rgba(16,26,47,.08);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.hero-visual:hover .browser{transform:rotate(0deg) translateY(-2px);box-shadow:0 40px 90px rgba(16,26,47,.23),0 4px 12px rgba(16,26,47,.08)}
.hero-preview-tag{position:absolute;z-index:3;top:-1px;left:37px;display:flex;align-items:center;gap:8px;min-height:31px;padding:0 11px;border:1px solid #d5dfdf;border-radius:6px;background:rgba(255,255,255,.97);box-shadow:0 7px 20px rgba(21,29,39,.08);color:#29383e;font:500 .58rem 'DM Mono',monospace;letter-spacing:.06em}
.hero-preview-dot{width:6px;height:6px;border-radius:50%;background:#64b24a}
.hero-visual-caption{position:relative;display:flex;justify-content:space-between;gap:12px;margin:16px 18px 0;color:var(--faint);font:500 .59rem 'DM Mono',monospace;letter-spacing:.06em}
.hero-visual .floating-spec{right:-18px;bottom:61px;border-color:#344152;background:#172033;box-shadow:0 17px 34px rgba(14,22,38,.22)}
@media(max-width:1100px){.desktop-nav{gap:22px}.desktop-nav .nav-link{font-size:.9rem}.hero-grid{grid-template-columns:minmax(0,47fr) minmax(0,53fr);gap:28px}.hero h1{font-size:clamp(2.9rem,4.6vw,4.5rem)}}
@media(max-width:900px){.hero{padding:49px 0 48px}.hero-grid{grid-template-columns:1fr}.hero-copy{padding:0}.hero h1{font-size:clamp(3.25rem,6.2vw,4.8rem)}.hero-visual{max-width:720px;margin:30px auto 0}}
@media(max-width:620px){.hero{padding:38px 0 40px}.hero-kicker{max-width:100%;margin-bottom:23px;font-size:.56rem}.hero-kicker-year{display:none}.hero h1{font-size:clamp(2.7rem,9vw,3.6rem);line-height:1.08}.hero .lead{font-size:1rem}.hero-proof{margin-top:30px;gap:9px 12px;font-size:.56rem}.hero-visual{margin-top:32px;padding:14px 6px 23px 2px}.hero-visual .visual-backplate{inset:47px -22px 10px 30px}.hero-preview-tag{left:12px;top:0;font-size:.5rem}.hero-visual .browser,.hero-visual:hover .browser{transform:none}.hero-visual-caption{margin:13px 5px 0;font-size:.48rem}.hero-visual-caption span:last-child{display:none}.hero-visual .floating-spec{right:0;bottom:39px}}
@media(prefers-reduced-motion:reduce){.hero-visual .browser,.hero-visual:hover .browser{transform:none}}

/* Full-screen product stage */
.hero{min-height:calc(100vh - 78px);min-height:calc(100svh - 78px);display:flex;flex-direction:column;justify-content:center;padding:42px 0 20px;overflow:hidden}
.hero-grid{flex:1;align-items:center}
.hero-copy{padding:0 0 18px}
.hero-visual{isolation:isolate;padding:25px 5px 35px 24px}
.hero-visual .preview-image{min-height:clamp(340px,32vw,440px);background-position:60% center}
.hero-browser-motion{position:relative;z-index:2;animation:hero-float 8s ease-in-out infinite}
.hero-preview-tag{top:8px;left:18px}
.hero-visual .visual-backplate{z-index:0}
.hero-visual-grid{z-index:-1}
.hero-mobile-preview{position:absolute;z-index:4;left:-27px;bottom:10px;width:150px;height:232px;overflow:hidden;border:5px solid #fff;border-radius:13px;background:#edece7;box-shadow:0 20px 48px rgba(17,29,43,.23);transform:rotate(-7deg);animation:hero-mobile-float 9s ease-in-out infinite}
.hero-mobile-head{height:32px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:#f7f6f1;color:#292925}
.hero-mobile-head strong{font-size:1.02rem;line-height:1;letter-spacing:-.09em}
.hero-mobile-head span{display:flex;align-items:center;gap:5px;font:600 .4rem 'DM Mono',monospace;letter-spacing:.08em}
.hero-mobile-head i{width:8px;height:1px;background:currentColor;box-shadow:0 3px 0 currentColor}
.hero-mobile-preview img{width:100%;height:calc(100% - 32px);object-fit:cover;object-position:50% center}
.hero-mobile-label{position:absolute;right:8px;bottom:9px;left:8px;padding:7px 5px;border:1px solid rgba(255,255,255,.45);background:rgba(17,23,24,.7);color:white;text-align:center;font:500 .43rem 'DM Mono',monospace;letter-spacing:.09em}
.hero-visual .floating-spec{z-index:5;right:-15px;bottom:46px;animation:hero-spec-float 7s ease-in-out infinite}
.hero-scroll-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:12px;color:var(--faint);font:500 .6rem 'DM Mono',monospace;letter-spacing:.12em}
.hero-scroll-cue{display:inline-flex;align-items:center;gap:12px;text-transform:uppercase;transition:color .2s}
.hero-scroll-cue:hover{color:var(--indigo)}
#themes{scroll-margin-top:86px}
.hero-scroll-stem{position:relative;display:block;width:1px;height:35px;overflow:hidden;background:var(--line-strong)}
.hero-scroll-stem:after{content:'';position:absolute;top:-11px;left:0;width:1px;height:11px;background:var(--indigo);animation:hero-scroll-line 2.4s ease-in-out infinite}
@keyframes hero-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes hero-mobile-float{0%,100%{transform:translateY(0) rotate(-7deg)}50%{transform:translateY(9px) rotate(-5deg)}}
@keyframes hero-spec-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes hero-scroll-line{0%{transform:translateY(0)}80%,100%{transform:translateY(48px)}}
@media(max-width:1100px){.hero-mobile-preview{left:-15px;width:125px;height:195px}.hero-visual .floating-spec{right:-5px}}
@media(max-width:900px){.hero{min-height:calc(100vh - 68px);min-height:calc(100svh - 68px);padding:40px 0 22px}.hero-grid{align-content:center;gap:0}.hero-visual{max-width:680px;margin:24px auto 0}.hero-visual .preview-image{min-height:360px}.hero-mobile-preview{left:-18px;bottom:7px;width:130px;height:202px}.hero-scroll-row{padding-top:5px}}
@media(max-width:620px){.hero{padding:35px 0 19px}.hero-grid{align-content:start}.hero-copy{padding:0}.hero-visual{margin:25px auto 0;padding:17px 5px 26px 3px}.hero-visual .preview-image{min-height:242px;background-position:60% center}.hero-preview-tag{top:0;left:12px}.hero-mobile-preview{display:none}.hero-visual .floating-spec{right:0;bottom:37px}.hero-scroll-row{padding-top:4px;font-size:.52rem}.hero-scroll-stem{height:27px}}
@media(max-width:380px){.hero-scroll-row>span{display:none}}
@media(prefers-reduced-motion:reduce){.hero-browser-motion,.hero-mobile-preview,.hero-visual .floating-spec,.hero-scroll-stem:after{animation:none!important}}

/* Header and footer logo lockup */
.header-inner{gap:25px}
.logo{gap:8px;line-height:1;letter-spacing:-.075em}
.logo img{width:auto;height:64px;flex:none}
.logo-footer img{width:auto;height:108px}
@media(max-width:1100px){.logo-header img{width:auto;height:56px}.logo-footer img{width:auto;height:72px}}
@media(max-width:620px){.logo-header img{width:auto;height:60px}.logo-footer img{width:auto;height:64px}}

/* Branded dropdown surfaces; native selects remain the no-script fallback */
.filter-bar{position:relative;z-index:2}
.custom-select-ready:after{display:none}
.custom-select-ready select[data-custom-select]{display:none!important}
.select-wrap.is-open{z-index:20;border-color:var(--indigo);box-shadow:0 0 0 3px var(--indigo-ring)}
.custom-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-width:0;min-height:50px;padding:0 15px;border:0;border-radius:8px;background:transparent;color:var(--ink);text-align:left;font-size:.84rem;font-weight:700;line-height:1.3}
.custom-select-trigger:hover{background:var(--wash)}
.custom-select-trigger:focus-visible{outline:2px solid var(--indigo);outline-offset:-3px}
.custom-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.custom-select-chevron{width:9px;height:9px;flex:none;margin:-5px 3px 0 0;border-right:2px solid var(--indigo);border-bottom:2px solid var(--indigo);transform:rotate(45deg);transition:transform .2s}
.is-open .custom-select-chevron{margin:4px 3px 0 0;transform:rotate(225deg)}
.custom-select-menu{position:absolute;top:calc(100% + 8px);left:-1px;right:-1px;z-index:25;display:grid;gap:4px;max-height:min(300px,55vh);overflow-y:auto;padding:7px;border:1px solid var(--line-strong);border-radius:12px;background:var(--raised);box-shadow:var(--shadow-pop);animation:select-arrive .18s ease-out}
.custom-select-menu[hidden]{display:none}
.select-wrap.opens-up .custom-select-menu{top:auto;bottom:calc(100% + 8px);animation-name:select-arrive-up}
.custom-select-option{position:relative;display:flex;align-items:center;min-height:42px;padding:9px 34px 9px 12px;border-radius:7px;color:var(--ink-soft);cursor:pointer;font-size:.8rem;font-weight:600;line-height:1.35;outline:none}
.custom-select-option:hover,.custom-select-option.is-active{background:var(--surface-2);color:var(--ink)}
.custom-select-option[aria-selected="true"]{background:var(--indigo-tint);color:var(--on-indigo-soft);font-weight:800}
.custom-select-option[aria-selected="true"].is-active{background:var(--indigo-soft)}
.custom-select-option[aria-selected="true"]:after{content:'';position:absolute;right:17px;top:50%;width:6px;height:10px;border-right:2px solid var(--indigo);border-bottom:2px solid var(--indigo);transform:translateY(-65%) rotate(45deg)}
.custom-select-option:focus-visible{outline:2px solid var(--indigo);outline-offset:-2px}
.purchase-select .custom-select-trigger{font-size:.85rem}
@keyframes select-arrive{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
@keyframes select-arrive-up{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.custom-select-menu{animation:none}.custom-select-chevron{transition:none}}

/* Journal detail: wide editorial column, related reading, and discussion */
.text-link img{width:16px;height:16px;flex:none;object-fit:contain}
.blog-feature .text-link{align-self:flex-start}
.blog-feature .text-link img{width:16px;height:16px;aspect-ratio:1;object-fit:contain}
.blog-detail-shell{padding:60px 0 100px}
.blog-detail-shell>.crumbs{margin-bottom:39px}
.blog-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 302px;gap:clamp(38px,5vw,72px);align-items:start}
.blog-detail-main{min-width:0}
.blog-detail-main .content-article{max-width:none;margin:0;padding:0}
.article-header{max-width:830px}
.blog-detail-main .content-article h1{font-size:clamp(3rem,5vw,5rem);margin:3px 0 22px}
.blog-detail-main .content-article .intro{max-width:740px;font-size:clamp(1.14rem,1.7vw,1.42rem);line-height:1.6;margin:0 0 21px}
.blog-detail-main .content-article figure{margin:43px 0 48px}
.blog-detail-main .content-article figure img{aspect-ratio:1.58;border-radius:13px}
.article-copy{max-width:760px}
.article-copy h2:first-child{margin-top:0}
.article-copy p{color:var(--ink-muted)}
/* editor-written post bodies (tiptap output) inside .article-copy */
.article-copy h2{font-size:clamp(1.7rem,2.6vw,2.3rem);margin:46px 0 14px}
.article-copy h3{font-size:1.35rem;margin:32px 0 10px}
.article-copy p{margin:0 0 16px;line-height:1.75;font-size:1.02rem}
.article-copy ul,.article-copy ol{margin:0 0 18px;padding-left:24px;color:var(--ink-muted);display:grid;gap:8px}
.article-copy a{color:var(--indigo);text-decoration:underline;text-underline-offset:3px}
.article-copy blockquote{margin:26px 0;padding:8px 0 8px 22px;border-left:3px solid var(--indigo);color:var(--ink-muted);font-style:italic}
.article-copy pre{margin:22px 0;padding:18px 20px;border-radius:10px;background:var(--code-bg);color:var(--code-ink);font:400 .9rem/1.7 'DM Mono',monospace;overflow-x:auto}
.article-copy code{font-family:'DM Mono',monospace;font-size:.9em}
.article-copy img{border-radius:12px;margin:10px 0}
.article-copy hr{border:0;border-top:1px solid var(--line);margin:34px 0}
.blog-detail-aside{position:sticky;top:105px}
.popular-panel{border:1px solid var(--line);border-radius:14px;background:var(--surface);padding:25px 23px 10px;box-shadow:0 14px 45px rgba(15,21,31,.045)}
.popular-panel .eyebrow{margin-bottom:13px}
.popular-panel h2{font-size:1.55rem;letter-spacing:-.05em;margin-bottom:17px}
.popular-list{border-top:1px solid var(--line)}
.popular-item{display:grid;grid-template-columns:76px minmax(0,1fr);gap:13px;padding:17px 0;border-bottom:1px solid var(--line);align-items:start}
.popular-item img{width:76px;height:76px;object-fit:cover;border-radius:7px}
.popular-item>span{display:flex;flex-direction:column;min-width:0}
.popular-item small{font:.59rem/1.5 'DM Mono',monospace;color:var(--indigo);text-transform:uppercase;letter-spacing:.035em}
.popular-item strong{font-size:.82rem;line-height:1.35;letter-spacing:-.025em;margin-top:5px;transition:color .2s}
.popular-item:hover strong{color:var(--indigo)}
.popular-arrow{color:var(--indigo);font-size:1rem;line-height:1;margin-top:8px}
.popular-all{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:17px 0;color:var(--indigo);font-size:.77rem;font-weight:800}
.popular-all:hover{text-decoration:underline;text-underline-offset:3px}
.comments-section{max-width:760px;border-top:1px solid var(--line);margin-top:68px;padding-top:48px}
.comments-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:28px}
.comments-heading .eyebrow{margin-bottom:12px}
.comments-heading h2{font-size:clamp(2rem,3vw,2.75rem)}
.comments-heading h2 span{display:inline-flex;vertical-align:middle;align-items:center;justify-content:center;min-width:30px;height:30px;padding:0 7px;border-radius:50%;background:var(--indigo-soft);color:var(--indigo);font:.72rem 'DM Mono',monospace;letter-spacing:0}
.comments-heading>p{max-width:180px;font-size:.78rem;text-align:right;line-height:1.5}
.comment-list{border-top:1px solid var(--line)}
.comment-empty{padding:28px 0;color:var(--muted);font-size:.86rem}
.comment-thread{border-bottom:1px solid var(--line);padding:26px 0}
.comment-top{display:flex;gap:13px;align-items:flex-start}
.comment-avatar{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:var(--indigo-soft);color:var(--on-indigo-soft);font-weight:800;font-size:.84rem}
.comment-content{min-width:0;flex:1}
.comment-byline{display:flex;flex-wrap:wrap;align-items:baseline;gap:7px 12px}
.comment-byline strong{font-size:.83rem}
.comment-byline time,.comment-example{font:.62rem 'DM Mono',monospace;color:var(--faint)}
.comment-content>p{margin:8px 0 10px;color:var(--ink-muted);font-size:.88rem;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere}
.comment-reply-button,.comment-cancel{padding:0;border:0;background:none;color:var(--indigo);font-size:.73rem;font-weight:800}
.comment-reply-button:hover,.comment-cancel:hover{text-decoration:underline;text-underline-offset:3px}
.comment-remove-button{margin-left:17px;padding:0;border:0;background:none;color:var(--faint);font-size:.71rem}
.comment-remove-button:hover{text-decoration:underline;text-underline-offset:3px;color:var(--danger-text)}
.comment-replies{margin:20px 0 0 53px;padding-left:21px;border-left:2px solid var(--line)}
.comment-replies .comment-top+.comment-top{margin-top:24px}
.comment-replies .comment-avatar{width:32px;height:32px;font-size:.7rem}
.comment-replies .comment-content>p{margin-bottom:0}
.comment-composer{margin-top:35px;padding:28px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.comment-composer h3{font-size:1.35rem}
.comment-composer>p{font-size:.76rem;margin:5px 0 21px}
.comment-form{display:grid;gap:17px}
.comment-field label{display:block;margin-bottom:7px;color:var(--ink-soft);font-size:.76rem;font-weight:800}
.comment-field input,.comment-field textarea{display:block;width:100%;padding:12px 13px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;font-size:.84rem;line-height:1.5}
.comment-field textarea{min-height:115px;resize:vertical}
.comment-field input:focus,.comment-field textarea:focus{outline:2px solid var(--indigo);outline-offset:1px;border-color:var(--indigo)}
.comment-form-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px}
.comment-form-bottom>span{font-size:.71rem;color:var(--muted)}
.comment-form-bottom .btn{border:0}
.comment-status{min-height:1.3em;margin:0;color:var(--success);font-size:.75rem}
.reply-composer{margin:17px 0 0 53px;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:10px}
.reply-composer h4{margin:0 0 14px;font-size:.88rem}
.reply-composer .comment-field textarea{min-height:86px}
.reply-composer .comment-form-bottom{flex-wrap:wrap}
.reply-composer .comment-form-bottom .btn{padding:9px 13px;min-height:38px;font-size:.71rem}
.blog-detail-back{margin-top:55px}
@media(max-width:900px){.blog-detail-grid{grid-template-columns:minmax(0,1fr) 250px;gap:28px}.popular-panel{padding:20px 17px 6px}.popular-item{grid-template-columns:61px minmax(0,1fr);gap:10px}.popular-item img{width:61px;height:64px}}
@media(max-width:720px){.blog-detail-shell{padding:44px 0 74px}.blog-detail-shell>.crumbs{margin-bottom:26px}.blog-detail-grid{grid-template-columns:1fr;gap:52px}.blog-detail-aside{position:static}.blog-detail-main .content-article h1{font-size:clamp(2.55rem,9vw,3.8rem)}.blog-detail-main .content-article figure{margin:31px 0 37px}.popular-list{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}.comments-section{margin-top:55px;padding-top:38px}}
@media(max-width:520px){.popular-list{grid-template-columns:1fr}.comments-heading{display:block}.comments-heading>p{text-align:left;margin-top:9px;max-width:none}.comment-composer{padding:21px}.comment-form-bottom{align-items:stretch;flex-direction:column}.comment-form-bottom .btn{align-self:flex-start}.comment-replies{margin-left:24px;padding-left:13px}.reply-composer{margin-left:0}}

/* Journal index: an editorial cover, featured story and two distinct article cards. */
.journal-hero{position:relative;overflow:hidden;padding:36px 0 78px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 82% 76%,var(--glow) 0,transparent 32%),var(--canvas)}
.journal-hero:after{content:'';position:absolute;right:-125px;bottom:-260px;width:500px;height:500px;border:1px solid var(--indigo-soft-line);border-radius:50%;pointer-events:none}
.journal-hero .container{position:relative;z-index:1}
.journal-hero .crumbs{margin-bottom:54px}
.journal-hero-meta,.journal-section-line{display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--faint);font:500 .62rem 'DM Mono',monospace;letter-spacing:.12em}
.journal-hero-meta{padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.journal-hero-meta span:first-child{display:inline-flex;align-items:center;gap:9px;color:var(--on-indigo-soft)}
.journal-hero-meta i{width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px var(--lime-halo)}
.journal-hero-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:clamp(45px,8vw,125px);align-items:end;padding-top:69px}
.journal-hero .eyebrow{margin-bottom:25px}
.journal-hero h1{font-size:clamp(4.4rem,8.2vw,8.1rem);line-height:.96;letter-spacing:-.085em}
.journal-hero h1 em{font-style:normal;color:var(--indigo)}
.journal-hero-aside{padding-bottom:7px}
.journal-aside-index{display:block;margin-bottom:18px;color:var(--indigo);font:500 .67rem 'DM Mono',monospace;letter-spacing:.09em}
.journal-hero-aside p{max-width:430px;color:var(--ink-muted);font-size:1.02rem;line-height:1.75}
.journal-topics{display:flex;flex-wrap:wrap;gap:7px;margin-top:27px}
.journal-topics span{padding:7px 10px;border:1px solid var(--line-strong);border-radius:999px;background:var(--topic-bg);color:var(--ink-muted);font:500 .59rem 'DM Mono',monospace}
.journal-stories{padding:57px 0 105px}
.journal-section-line{margin-bottom:19px;color:var(--indigo)}
.journal-section-line span:last-child{color:var(--faint)}
.journal-feature{overflow:hidden;border-radius:17px;background:#182132;box-shadow:0 25px 65px rgba(16,24,42,.14)}
.journal-feature-link{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);min-height:500px}
.journal-feature-copy{display:flex;flex-direction:column;justify-content:space-between;gap:30px;padding:35px clamp(30px,4vw,58px) 34px;color:white}
.journal-story-meta{display:flex;justify-content:space-between;gap:14px;color:#8da0b3;font:500 .59rem 'DM Mono',monospace;letter-spacing:.11em}
.journal-feature-copy .journal-story-meta span:first-child{color:var(--lime)}
.journal-feature-number,.journal-feature-bottom{display:block;color:#a8b4c4;font:500 .6rem 'DM Mono',monospace;letter-spacing:.11em}
.journal-feature h2{max-width:580px;margin:18px 0 18px;color:#fff;font-size:clamp(2.5rem,3.5vw,4rem);line-height:1.06}
.journal-feature p{max-width:480px;color:#c6cedb;font-size:.92rem;line-height:1.75}
.journal-read-link{display:inline-flex;align-items:center;gap:18px;margin-top:30px;color:#fff;font-size:.82rem;font-weight:800}
.journal-read-link span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--lime);color:#172033;font-size:1.1rem;transition:transform .25s var(--ease)}
.journal-feature-link:hover .journal-read-link span,.journal-feature-link:focus-visible .journal-read-link span{transform:translate(3px,-3px)}
.journal-feature-image{position:relative;min-height:100%;overflow:hidden;background:var(--wash-2)}
.journal-feature-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s var(--ease)}
.journal-feature-link:hover .journal-feature-image img{transform:scale(1.045)}
.journal-feature-image:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,rgba(10,18,27,.35));pointer-events:none}
.journal-feature-image span{position:absolute;z-index:1;right:25px;bottom:23px;color:#fff;font:500 .57rem 'DM Mono',monospace;letter-spacing:.12em}
.journal-latest-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin:91px 0 28px}
.journal-latest-heading .eyebrow{margin-bottom:14px}
.journal-latest-heading h2{font-size:clamp(2.5rem,4vw,4.15rem)}
.journal-latest-heading p{max-width:330px;font-size:.88rem;line-height:1.7}
.journal-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.journal-card{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--surface);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.journal-card:hover{transform:translateY(-5px);box-shadow:0 20px 45px rgba(19,30,41,.09)}
.journal-card>a{display:flex;flex-direction:column;height:100%}
.journal-card-image{position:relative;aspect-ratio:1.82;overflow:hidden;background:var(--wash-2)}
.journal-card-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.journal-card:hover .journal-card-image img{transform:scale(1.055)}
.journal-card-image span{position:absolute;left:18px;bottom:18px;padding:8px 10px;border-radius:5px;background:#fff;color:#253144;font:500 .59rem 'DM Mono',monospace;letter-spacing:.08em}
.journal-card-copy{display:flex;flex:1;flex-direction:column;padding:27px 30px 25px}
.journal-card-copy .journal-story-meta{color:var(--muted)}
.journal-card-copy h3{max-width:530px;margin:21px 0 12px;font-size:clamp(1.55rem,2.3vw,2.25rem);line-height:1.15}
.journal-card-copy p{max-width:520px;font-size:.85rem;line-height:1.7}
.journal-card-foot{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:auto;padding-top:30px;color:var(--faint);font:500 .61rem 'DM Mono',monospace;letter-spacing:.09em}
.journal-card-foot span:last-child{display:grid;place-items:center;width:35px;height:35px;border:1px solid var(--line-strong);border-radius:50%;color:var(--indigo);font-size:1.15rem;transition:background .25s,color .25s,transform .25s}
.journal-card:hover .journal-card-foot span:last-child{transform:translate(2px,-2px);background:var(--indigo-solid);color:#fff}
.journal-outro{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-top:70px;padding:39px 44px;border-radius:14px;background:#222c3d;color:#fff}
.journal-outro .eyebrow{margin-bottom:13px;color:var(--lime)}
.journal-outro h2{max-width:620px;font-size:clamp(1.8rem,3vw,2.65rem)}
.journal-outro p{margin-top:10px;color:#c0cad3;font-size:.85rem}
.journal-outro-actions{display:flex;align-items:center;flex-wrap:wrap;gap:19px;flex:none}
.journal-outro-actions .text-link{color:#fff;font-size:.8rem}
.journal-outro-actions .text-link img{filter:brightness(0) invert(1)}
@media(max-width:900px){.journal-hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(250px,.9fr);gap:35px}.journal-hero h1{font-size:clamp(4.2rem,9vw,6.8rem)}.journal-feature-link{min-height:440px}.journal-feature-copy{padding:28px}.journal-feature h2{font-size:clamp(2.15rem,4vw,3.1rem)}.journal-outro{align-items:flex-start;flex-direction:column}}
@media(max-width:680px){.journal-hero{padding:26px 0 49px}.journal-hero .crumbs{margin-bottom:29px}.journal-hero-meta{font-size:.51rem}.journal-hero-meta span:last-child{display:none}.journal-hero-grid{grid-template-columns:1fr;gap:25px;padding-top:42px}.journal-hero h1{font-size:clamp(3.75rem,13vw,5.7rem)}.journal-hero-aside p{font-size:.94rem}.journal-topics{margin-top:19px}.journal-stories{padding:39px 0 72px}.journal-feature-link{grid-template-columns:1fr}.journal-feature-copy{min-height:390px;padding:26px}.journal-feature-image{min-height:270px;max-height:340px}.journal-latest-heading{display:block;margin:69px 0 25px}.journal-latest-heading p{margin-top:13px}.journal-card-grid{grid-template-columns:1fr;gap:16px}.journal-card-image{aspect-ratio:1.55}.journal-outro{margin-top:52px;padding:29px 25px}.journal-outro-actions{gap:12px}}
@media(max-width:380px){.journal-feature-copy{min-height:420px}.journal-story-meta{font-size:.52rem}.journal-feature-image{min-height:220px}.journal-card-copy{padding:23px}.journal-outro-actions{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.journal-card,.journal-card-image img,.journal-feature-image img,.journal-read-link span,.journal-card-foot span:last-child{transition:none!important;transform:none!important}}

/* Spacing utilities */
.micro-footer-note{margin-top:40px}
.lead-mt-20{margin-top:20px}
.lead-mt-24{margin:24px 0 25px}
.statement-list-mt-30{margin-top:30px}
.statement-list-mt-39{margin-top:39px}
.button-row-mt-30{margin-top:30px}
.section-sm-flush{padding-top:0}
.contact-card-title{margin-top:22px}
.contact-methods{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.contact-method{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:26px 28px}
a.contact-method{transition:border-color .2s,box-shadow .2s,transform .2s}
a.contact-method:hover{border-color:var(--indigo);box-shadow:var(--shadow);transform:translateY(-3px)}
.contact-method-label{display:block;font:.66rem 'DM Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--indigo)}
.contact-method-value{display:block;margin-top:14px;font-size:1.22rem;font-weight:800;letter-spacing:-.03em;color:var(--ink);overflow-wrap:anywhere}
.contact-method-note{display:block;margin-top:9px;font-size:.78rem;line-height:1.6;color:var(--muted)}
.contact-form-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:40px}
.contact-form-card h2{font-size:clamp(1.8rem,3vw,2.3rem);margin:14px 0 12px}
.contact-form-card>p{font-size:.9rem;max-width:520px}
.contact-form{display:grid;gap:18px;margin-top:28px}
.contact-form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-field label{display:block;margin-bottom:8px;color:var(--ink-soft);font-size:.78rem;font-weight:800}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;min-height:52px;padding:13px 16px;border:1px solid var(--line-strong);border-radius:9px;background:var(--surface);color:var(--ink);font-size:.88rem;outline:none;transition:border-color .2s,box-shadow .2s;font-family:inherit}
.contact-form select{appearance:none;-webkit-appearance:none;background-image:var(--select-arrow);background-repeat:no-repeat;background-position:right 17px center;padding-right:42px;cursor:pointer}
.contact-select{position:relative;display:block;background:var(--surface);border:1px solid var(--line-strong);border-radius:9px;transition:border-color .2s,box-shadow .2s}
.contact-select:hover{border-color:var(--line-hover)}
.contact-select:focus-within,.contact-select.is-open{border-color:var(--indigo);box-shadow:0 0 0 4px rgba(67,83,232,.12)}
.contact-select select{width:100%;height:50px;min-height:50px;border:0;background:transparent;box-shadow:none;outline:0;background-image:none;padding-right:42px}
.contact-select .custom-select-trigger{font-size:.88rem;font-weight:400;min-height:50px}
.contact-form textarea{min-height:150px;resize:vertical;line-height:1.65}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--ghost)}
.contact-form input:hover,.contact-form select:hover,.contact-form textarea:hover{border-color:var(--line-hover)}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--indigo);box-shadow:0 0 0 4px rgba(67,83,232,.12)}
.contact-form-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}
.contact-form-status{margin:0;padding:12px 14px;border:1px solid var(--indigo-soft-line);border-radius:8px;background:var(--indigo-tint);color:var(--on-indigo-soft);font-size:.76rem;line-height:1.6}
.contact-form-status[hidden]{display:none}
.contact-aside{display:grid;gap:18px;align-content:start}
.tips-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.tips-grid .statement{border-bottom:0;padding:0}
.contact-office{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
.contact-office-copy h2{font-size:clamp(2rem,3.6vw,3rem);margin-bottom:16px}
.contact-office-copy p{font-size:.92rem;line-height:1.8;max-width:470px}
.contact-office-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:34px}
.contact-office-card h3{margin:18px 0 6px;font-size:1.35rem}
.contact-details{margin:14px 0 22px}
.contact-detail{display:flex;justify-content:space-between;gap:22px;padding:15px 0;border-top:1px solid var(--line);font-size:.85rem}
.contact-detail dt{color:var(--muted);font-weight:600}
.contact-detail dd{margin:0;font-weight:800;text-align:right;color:var(--ink);overflow-wrap:anywhere}
.contact-detail dd a{color:var(--indigo)}
@media(max-width:900px){.contact-methods{gap:14px}.contact-form-card{padding:30px}.contact-office{gap:36px}.tips-grid{gap:26px}}
@media(max-width:620px){.contact-methods{grid-template-columns:1fr}.contact-form-row{grid-template-columns:1fr}.contact-form-card{padding:24px}.contact-form-bottom{align-items:stretch;flex-direction:column}.contact-form-bottom .btn{width:100%}.tips-grid{grid-template-columns:1fr;gap:24px}.contact-office{grid-template-columns:1fr}.contact-office-card{padding:24px}.contact-detail{display:block}.contact-detail dd{text-align:left;margin-top:4px}}
.docs-spacer{height:100px}
.about-lead{margin-top:21px}
.about-cta{margin-top:25px}
.pricing-notice{margin-top:25px}
.extensions-cta{margin-top:24px}
.proof-grid-mt-35{margin-top:35px}
.proof-panel-title-sm{margin-top:18px}
.themes-note{margin-top:18px}
.index-note{margin-top:16px}
.code-comment{color:#88a096}
.proof-panel-title{margin-top:22px}
.audit-fill-88{width:88%}
.audit-fill-94{width:94%}
.audit-fill-82{width:82%}

/* Preview word dot */
.preview-word-dot{color:#a3a59e}

/* Preview image backgrounds */
.preview-image-nordform{background-image:url("../images/nordform-architecture.webp")}
.preview-image-index{background-image:url("../images/hero-typo3-template-v1.webp")}
.hero-visual .preview-image{background-position:center center}
.hero-visual .preview-image:before{background:linear-gradient(90deg,rgba(7,13,22,.72) 0%,rgba(7,13,22,.5) 44%,transparent 72%),linear-gradient(0deg,rgba(7,13,22,.18),transparent 45%)}
.hero-visual .preview-overlay{z-index:1;width:43%;min-width:245px;padding:28px 25px 30px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.7)}
.hero-visual .preview-overlay small{display:block;color:#edf1f2;font-size:.59rem;line-height:1.6;letter-spacing:.11em}
.hero-visual .preview-overlay strong{max-width:100%;font-size:clamp(1.85rem,2.65vw,2.65rem);line-height:1.06;margin:13px 0 18px}
.hero-visual .preview-overlay span{border-color:#fff;background:rgba(4,10,19,.5);font-weight:700;text-shadow:none}
.hero-visual .hero-mobile-preview{left:auto;right:-20px;top:100px;bottom:auto;transform:rotate(6deg);animation:none}
.hero-visual .hero-mobile-preview img{object-position:78% center}
@media(max-width:620px){.hero-visual .preview-image{background-position:center center}.hero-visual .preview-overlay{width:52%;min-width:0;padding:14px 10px 17px 16px}.hero-visual .preview-overlay small{font-size:.46rem}.hero-visual .preview-overlay strong{font-size:clamp(1.2rem,5vw,1.65rem);margin:8px 0 10px}.hero-visual .preview-overlay span{padding:5px 7px;font-size:.53rem}}

/* Demo page */
.demo-topbar{background:#e9e8e1;padding:13px 0}
.demo-topbar-inner{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}
.demo-hero-section{background:#f3f1eb;color:#242521}
.demo-container-wide{max-width:1350px}
.demo-nav-title{font-size:1.5rem;letter-spacing:-.08em}
.mono-sm{font-size:.7rem}
.demo-h1{font-size:clamp(3.2rem,7vw,7rem);max-width:900px}
.demo-intro-text{color:#4f514e;max-width:350px}
.demo-hero-img{width:100%;max-height:700px;object-fit:cover}
.demo-outro-title{font-size:clamp(2rem,4vw,4rem)}
.demo-outro-text{margin-top:20px;max-width:500px;color:#545650}
.theme-detail-img{width:100%;border-radius:14px;box-shadow:var(--shadow)}

/* Headless page */
.headless-hero{position:relative;overflow:hidden;padding:39px 0 90px;background:radial-gradient(circle at 86% 14%,var(--glow) 0,transparent 33%),var(--canvas)}
.headless-hero:after{content:"";position:absolute;right:-150px;bottom:-310px;width:640px;height:640px;border:1px solid var(--line);border-radius:50%;pointer-events:none}
.headless-crumbs{margin-bottom:58px}
.headless-hero-grid{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:62px;align-items:center}
.headless-hero-copy{position:relative;z-index:1}
.headless-hero-copy .eyebrow{margin-bottom:25px}
.headless-hero h1{max-width:690px;font-size:clamp(3.8rem,5.8vw,6.7rem);line-height:1.02;letter-spacing:-.075em}
.headless-hero h1 em,.headless-section-heading h2 em{font-style:normal;color:var(--indigo)}
.headless-hero-copy>p{max-width:520px;margin-top:29px;color:var(--muted);font-size:1.02rem;line-height:1.82}
.headless-hero-actions{gap:25px;margin-top:32px}
.headless-inline-link{display:inline-flex;align-items:center;gap:9px;min-height:48px;color:var(--ink-muted);font-size:.81rem;font-weight:800;border-bottom:1px solid var(--line-strong);transition:gap .2s,color .2s}
.headless-inline-link:hover{gap:15px;color:var(--indigo)}
.headless-inline-link span{font-size:1.2rem;font-weight:400}
.headless-hero-foot{display:flex;flex-wrap:wrap;gap:12px 19px;margin-top:55px;padding-top:19px;border-top:1px solid var(--line);color:var(--faint);font:500 .59rem 'DM Mono',monospace;letter-spacing:.09em}
.headless-hero-foot span+span:before{content:"◆";margin-right:17px;color:#92b84d;font-size:.42rem;vertical-align:2px}
.headless-board{position:relative;isolation:isolate;min-width:0;padding:22px;border:1px solid #2d3d55;border-radius:20px;background:#151f31;color:#fff;box-shadow:0 30px 80px rgba(17,31,56,.19),0 4px 14px rgba(17,31,56,.07)}
.headless-board:before{content:"";position:absolute;z-index:-1;right:-28px;top:33px;width:160px;height:160px;border-radius:50%;background:#5667eb;filter:blur(90px);opacity:.65}
.headless-board-grid{position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:.15;background-image:linear-gradient(#7790ae 1px,transparent 1px),linear-gradient(90deg,#7790ae 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(135deg,transparent 5%,#000 90%)}
.headless-board-top,.headless-board-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;color:#aebdd0;font:500 .58rem/1.5 'DM Mono',monospace;letter-spacing:.11em}
.headless-board-top{padding:3px 3px 19px;border-bottom:1px solid #314158}
.headless-board-top span:last-child{display:inline-flex;align-items:center;gap:8px;color:#c8f17f}
.headless-board-top i{width:6px;height:6px;border-radius:50%;background:#c6f36a;box-shadow:0 0 0 5px rgba(198,243,106,.1)}
.headless-board-flow{display:grid;grid-template-columns:minmax(0,.9fr) 70px minmax(0,1.1fr);gap:0;align-items:center;min-height:423px}
.headless-source-card{min-width:0;padding:24px 20px;border:1px solid #65738e;border-radius:13px;background:linear-gradient(145deg,#263750,#1c2941);box-shadow:0 20px 40px rgba(4,10,21,.2)}
.headless-card-index{color:#c2d0e2;font:500 .55rem 'DM Mono',monospace;letter-spacing:.09em}
.headless-source-brand{display:flex;align-items:center;gap:9px;margin:29px 0 5px}
.headless-source-brand strong{font-size:1.5rem;letter-spacing:-.06em}
.headless-source-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:#c6f36a;color:#12232f;font:800 .92rem Manrope,sans-serif;letter-spacing:-.09em}
.headless-source-mark span{font-size:.65em;align-self:end;margin-top:-13px;margin-left:13px}
.headless-source-card p{color:#bfccda;font-size:.7rem;line-height:1.6}
.headless-field-list{display:grid;gap:7px;margin-top:26px}
.headless-field-list span{display:flex;align-items:center;gap:11px;padding:9px 10px;border:1px solid #455570;border-radius:6px;background:#243550;color:#edf3f7;font-size:.68rem;font-weight:700}
.headless-field-list b{color:#91a6be;font:500 .55rem 'DM Mono',monospace}
.headless-flow-link{position:relative;display:grid;place-items:center;align-self:stretch;color:#c6f36a;text-align:center;font:500 .47rem/1.6 'DM Mono',monospace;letter-spacing:.04em}
.headless-flow-link:before,.headless-flow-link:after{content:"";position:absolute;top:50%;width:22px;border-top:1px dashed #a6c769}
.headless-flow-link:before{left:0}.headless-flow-link:after{right:0}
.headless-flow-link span{position:relative;z-index:1;padding:9px 2px;border-radius:5px;background:#151f31}
.headless-flow-link i{position:absolute;right:0;top:calc(50% - 4px);width:7px;height:7px;border-top:1px solid #c6f36a;border-right:1px solid #c6f36a;transform:rotate(45deg)}
.headless-front-card{min-width:0;overflow:hidden;border:1px solid #cad2d5;border-radius:12px;background:#fff;color:#162129;box-shadow:0 22px 46px rgba(4,9,18,.25)}
.headless-front-bar{height:34px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 11px;border-bottom:1px solid #e2e5e5;background:#f4f6f5;color:#7a8589;font:400 .5rem 'DM Mono',monospace}
.headless-front-dots{display:flex;gap:4px}.headless-front-dots i{width:6px;height:6px;border-radius:50%;background:#c3ccce}
.headless-front-image{position:relative;height:276px;overflow:hidden;background:#d9d9d3}
.headless-front-image:after{content:"";position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(9,16,23,.78))}
.headless-front-image img{width:100%;height:100%;object-fit:cover}
.headless-front-image span{position:absolute;z-index:1;left:18px;bottom:21px;color:#fff;font-size:clamp(1.25rem,2.1vw,2rem);font-weight:800;line-height:1.08;letter-spacing:-.055em}
.headless-front-bottom{display:flex;justify-content:space-between;gap:8px;padding:12px;color:#58666a;font:500 .5rem 'DM Mono',monospace;letter-spacing:.05em}
.headless-board-bottom{padding:18px 3px 2px;border-top:1px solid #314158;color:#91a4b8}
.headless-section-heading{display:flex;align-items:end;justify-content:space-between;gap:55px;margin-bottom:40px}
.headless-section-heading h2{font-size:clamp(2.5rem,4.45vw,4.75rem)}
.headless-section-heading p{max-width:405px;padding-bottom:4px;font-size:.95rem;line-height:1.8}
.headless-approach{padding-top:112px;padding-bottom:120px}
.headless-step-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.headless-step{position:relative;min-height:355px;display:flex;flex-direction:column;padding:27px 29px 25px;border:1px solid var(--line);border-radius:13px;background:var(--surface);box-shadow:0 6px 22px rgba(19,29,39,.035);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.headless-step:hover{transform:translateY(-5px);box-shadow:0 20px 42px rgba(17,30,50,.1)}
.headless-step-number{display:flex;align-items:center;justify-content:space-between;color:var(--indigo);font:500 .66rem 'DM Mono',monospace;letter-spacing:.1em}
.headless-step-number i{width:28px;height:1px;background:var(--line-strong)}
.headless-step-icon{width:59px;height:59px;display:grid;align-content:center;gap:5px;margin:32px 0 29px;padding:12px;border-radius:13px;background:var(--indigo-soft);transform:rotate(-8deg)}
.headless-step-icon span{height:5px;border-radius:4px;background:#586af0}.headless-step-icon span:nth-child(2){width:75%;background:#95a1f2}.headless-step-icon span:nth-child(3){width:55%;background:#c6f36a}
.headless-step-icon-contract{place-items:center;grid-template-columns:repeat(3,8px);gap:3px;transform:rotate(0deg);background:#eaf4de}.headless-step-icon-contract span{width:8px;height:25px;border-radius:3px;background:#80b74e}.headless-step-icon-contract span:nth-child(2){width:8px;height:34px;background:#c6f36a}.headless-step-icon-contract span:nth-child(3){width:8px;height:19px;background:#4d9545}
.headless-step-icon-screen{display:block;position:relative;transform:rotate(6deg);background:#e9ecf5}.headless-step-icon-screen span:first-child{display:block;width:34px;height:25px;border:2px solid #596ae9;border-radius:3px;background:#fff}.headless-step-icon-screen span:nth-child(2){position:absolute;left:17px;bottom:8px;width:23px;height:2px;background:#596ae9}.headless-step-icon-screen span:nth-child(3){position:absolute;right:7px;bottom:12px;width:10px;height:10px;border-radius:50%;background:#c6f36a}
.headless-step h3{font-size:1.52rem}.headless-step p{margin:12px 0 26px;font-size:.83rem;line-height:1.75}.headless-step-tag{margin-top:auto;padding-top:15px;border-top:1px solid var(--line-soft);color:var(--faint);font:500 .57rem 'DM Mono',monospace;letter-spacing:.11em}
.headless-contract-section{position:relative;overflow:hidden;padding:116px 0;background:#121a25;color:#fff}
.headless-contract-section:before{content:"";position:absolute;right:-200px;top:-170px;width:650px;height:650px;border:1px solid rgba(198,243,106,.13);border-radius:50%;box-shadow:0 0 0 140px rgba(198,243,106,.025)}
.headless-contract-grid{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:90px;align-items:center}
.headless-contract-copy h2{font-size:clamp(2.8rem,4.6vw,5rem)}
.headless-contract-copy>p{max-width:505px;margin-top:25px;color:#b9c5cd;font-size:.95rem;line-height:1.8}
.headless-contract-copy ul{display:grid;gap:12px;margin:28px 0 34px;padding:0;list-style:none;color:#e4ebed;font-size:.8rem}
.headless-contract-copy li{display:flex;align-items:baseline;gap:12px}.headless-contract-copy li:before{content:"↗";color:var(--lime);font-size:1rem}
.headless-contract-visual{overflow:hidden;border:1px solid #44556a;border-radius:14px;background:#1c293a;box-shadow:0 28px 80px rgba(0,0,0,.2);transform:rotate(1.2deg)}
.headless-code-top,.headless-code-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:16px 21px;color:#adbfcd;font:500 .58rem 'DM Mono',monospace;letter-spacing:.06em}
.headless-code-top{border-bottom:1px solid #405065}.headless-code-top span:first-child{display:flex;align-items:center;gap:6px}.headless-code-top i{display:block;width:6px;height:6px;border-radius:50%;background:#8192a2}.headless-code-top i:last-of-type{margin-right:10px}
.headless-code{margin:0;padding:32px 34px 36px;color:#e3eaf1;font:400 clamp(.78rem,1.2vw,.98rem)/2 'DM Mono',monospace;white-space:pre-wrap;tab-size:2}
.headless-code b{color:#c6f36a;font-weight:500}.headless-code em{color:#9daeff;font-style:normal}.headless-code strong{color:#f2cb95;font-weight:500}
.headless-code-bottom{border-top:1px solid #405065;color:#92a3b2}
.headless-fit{padding-top:115px;padding-bottom:120px}
.headless-fit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.headless-fit-card{min-height:364px;display:flex;flex-direction:column;overflow:hidden;padding:27px 29px 0;border:1px solid var(--line);border-radius:13px;background:var(--surface)}
.headless-fit-card>span{color:var(--indigo);font:500 .62rem 'DM Mono',monospace;letter-spacing:.1em}
.headless-fit-card h3{max-width:320px;margin-top:28px;font-size:1.68rem}.headless-fit-card p{max-width:330px;margin-top:13px;font-size:.8rem;line-height:1.7}
.headless-fit-art{position:relative;height:93px;margin:auto -29px 0;background:#eef0fc;overflow:hidden}
.headless-fit-art i{position:absolute;display:block;border-radius:5px;background:#4455d9}
.art-web i:first-child{left:12%;top:28px;width:66%;height:80px;border:6px solid #4455d9;background:var(--surface)}.art-web i:nth-child(2){left:18%;top:39px;width:24%;height:8px;background:#c6f36a}.art-web i:nth-child(3){right:16%;top:39px;width:26%;height:44px;background:#c8d0f8}
.art-channel{background:#e9f0e5}.art-channel i:first-child{left:15%;top:23px;width:27%;height:75px;background:#4353e8}.art-channel i:nth-child(2){left:49%;top:33px;width:19%;height:65px;background:#c6f36a}.art-channel i:nth-child(3){right:10%;top:16px;width:12%;height:82px;background:#192438}
.art-product{background:#e9edf0}.art-product i:first-child{left:11%;top:20px;width:72%;height:80px;background:#1d293b}.art-product i:nth-child(2){left:18%;top:36px;width:39%;height:7px;background:#c6f36a}.art-product i:nth-child(3){left:18%;top:52px;width:56%;height:33px;background:#6878e9}
.headless-cta-section{padding-top:0;padding-bottom:110px}
.headless-cta{display:flex;align-items:center;justify-content:space-between;gap:35px;padding:55px 60px;border-radius:17px;background:#4353e8;color:#fff;box-shadow:0 23px 54px rgba(67,83,232,.17)}
.headless-cta .eyebrow{color:#d5f59c}.headless-cta h2{font-size:clamp(2.3rem,3.9vw,4rem)}.headless-cta p{max-width:560px;margin-top:17px;color:#e1e5ff;font-size:.88rem;line-height:1.75}.headless-cta .btn{flex:none}
@media(max-width:1100px){.headless-hero-grid{gap:35px}.headless-hero h1{font-size:clamp(3.4rem,5.5vw,5.5rem)}.headless-board{padding:16px}.headless-board-flow{grid-template-columns:minmax(0,.9fr) 55px minmax(0,1.1fr)}.headless-source-card{padding:18px 14px}.headless-front-image{height:245px}.headless-contract-grid{gap:45px}}
@media(max-width:900px){.headless-hero{padding-top:29px}.headless-crumbs{margin-bottom:38px}.headless-hero-grid{grid-template-columns:1fr;gap:46px}.headless-hero h1{max-width:750px;font-size:clamp(3.4rem,7.4vw,5.5rem)}.headless-board{max-width:750px;width:100%;margin:auto}.headless-board-flow{grid-template-columns:minmax(0,.9fr) 70px minmax(0,1.1fr)}.headless-source-card{padding:24px 20px}.headless-section-heading{align-items:start;gap:30px}.headless-step-grid,.headless-fit-grid{gap:10px}.headless-step,.headless-fit-card{padding-left:21px;padding-right:21px}.headless-fit-art{margin-left:-21px;margin-right:-21px}.headless-contract-grid{grid-template-columns:1fr;gap:55px}.headless-contract-visual{max-width:690px;width:100%}}
@media(max-width:700px){.headless-hero{padding-bottom:72px}.headless-hero h1{font-size:clamp(2.8rem,10vw,4.5rem)}.headless-hero-copy>p{font-size:.95rem}.headless-hero-foot{margin-top:38px}.headless-board-flow{grid-template-columns:1fr;gap:0;min-height:0;padding:22px 0}.headless-source-card,.headless-front-card{width:min(100%,380px);margin:auto}.headless-flow-link{min-height:68px}.headless-flow-link:before,.headless-flow-link:after{top:auto;left:50%;right:auto;width:0;height:15px;border-top:0;border-left:1px dashed #a6c769}.headless-flow-link:before{top:0}.headless-flow-link:after{bottom:0}.headless-flow-link span{padding:4px 10px}.headless-flow-link span br{display:none}.headless-flow-link i{right:calc(50% - 3px);top:auto;bottom:1px;transform:rotate(135deg)}.headless-front-image{height:250px}.headless-board-top,.headless-board-bottom{font-size:.5rem}.headless-section-heading{display:block}.headless-section-heading p{margin-top:23px}.headless-step-grid,.headless-fit-grid{grid-template-columns:1fr}.headless-step{min-height:0;padding:24px}.headless-step-icon{margin:25px 0 24px}.headless-step p{margin-bottom:22px}.headless-fit-card{min-height:310px}.headless-contract-section{padding:80px 0}.headless-fit,.headless-approach{padding-top:80px;padding-bottom:80px}.headless-cta{align-items:flex-start;flex-direction:column;padding:42px 35px}.headless-cta-section{padding-bottom:80px}}
@media(max-width:420px){.headless-hero-actions{align-items:stretch;flex-direction:column;gap:10px}.headless-hero-actions .btn{width:100%}.headless-inline-link{width:max-content}.headless-hero-foot{gap:9px;font-size:.48rem}.headless-hero-foot span+span:before{margin-right:7px}.headless-board{padding:13px}.headless-board-top span:last-child{display:none}.headless-front-image{height:205px}.headless-code{padding:25px 20px;font-size:.7rem}.headless-code-top,.headless-code-bottom{padding:14px;font-size:.47rem}.headless-code-top span:last-child{display:none}.headless-cta{padding:34px 25px}.headless-cta .btn{width:100%}}
@media(prefers-reduced-motion:reduce){.headless-step{transition:none}.headless-step:hover{transform:none}}

/* Mobile navigation transition */
@media(max-width:900px){
  .mobile-nav{display:flex;flex-direction:column;visibility:hidden;opacity:0;pointer-events:none;transform:translateY(-15px);overflow-y:auto;overscroll-behavior:contain;padding-bottom:calc(25px + env(safe-area-inset-bottom));transition:opacity .26s ease,transform .34s var(--ease),visibility 0s .34s}
  .mobile-nav.open{visibility:visible;opacity:1;pointer-events:auto;transform:translateY(0);transition:opacity .26s ease,transform .34s var(--ease),visibility 0s}
  .mobile-nav>a{opacity:0;transform:translateY(-9px);transition:opacity .28s ease,transform .32s var(--ease)}
  .mobile-nav.open>a{opacity:1;transform:translateY(0)}
  .mobile-nav.open>a:nth-child(1){transition-delay:.04s}
  .mobile-nav.open>a:nth-child(2){transition-delay:.065s}
  .mobile-nav.open>a:nth-child(3){transition-delay:.09s}
  .mobile-nav.open>a:nth-child(4){transition-delay:.115s}
  .mobile-nav.open>a:nth-child(5){transition-delay:.14s}
  .mobile-nav.open>a:nth-child(6){transition-delay:.165s}
  .mobile-nav.open>a:nth-child(7){transition-delay:.19s}
  .mobile-nav.open>a:nth-child(8){transition-delay:.215s}
  .menu-toggle[aria-expanded="true"]{background:var(--indigo-soft);border-color:var(--indigo-soft-line)}
  .menu-toggle[aria-expanded="true"] span:first-child{transform:translateY(7px) rotate(45deg)}
  .menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;transform:scaleX(.5)}
  .menu-toggle[aria-expanded="true"] span:last-child{transform:translateY(-7px) rotate(-45deg)}
}
@media(prefers-reduced-motion:reduce){.mobile-nav,.mobile-nav>a,.menu-toggle span{transition:none!important}}

@media(max-width:700px){
  .headless-hero-actions{align-items:stretch;flex-direction:column;gap:10px}
  .headless-hero-actions .btn,.headless-hero-actions .headless-inline-link{width:100%;min-height:56px}
  .headless-hero-actions .headless-inline-link{justify-content:space-between;padding:5px 5px 5px 18px;border:1px solid var(--line-strong);border-radius:10px;background:var(--surface);box-shadow:0 4px 12px rgba(17,28,35,.04);text-decoration:none}
  .headless-hero-actions .headless-inline-link span{display:grid;place-items:center;width:40px;height:40px;flex:none;border-radius:7px;background:var(--indigo-tint);color:var(--indigo)}
}
.back-to-top{position:fixed;right:26px;bottom:26px;z-index:90;width:62px;height:56px;padding:0;border:0;background:transparent;color:#fff;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(18px) scale(.85);transition:opacity .3s var(--ease),transform .4s var(--ease),visibility 0s linear .4s}
.back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0) scale(1);transition-delay:0s}
.back-to-top-shape{display:block;width:100%;height:100%;filter:drop-shadow(0 12px 20px rgba(16,20,24,.28));transition:transform .3s var(--ease)}
.back-to-top-bg{fill:var(--indigo-solid);transition:fill .2s}
.back-to-top-arrow{animation:back-to-top-bob 2.8s var(--ease) infinite}
.back-to-top:hover .back-to-top-shape{transform:translateY(-5px)}
.back-to-top:hover .back-to-top-bg{fill:var(--indigo-solid-hover)}
.back-to-top:active .back-to-top-shape{transform:translateY(-1px)}
@keyframes back-to-top-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:620px){.back-to-top{right:16px;bottom:16px;width:54px;height:49px}}
@media(prefers-reduced-motion:reduce){.back-to-top,.back-to-top-shape,.back-to-top-bg,.back-to-top-arrow{transition:none!important;animation:none!important}}

/* Mobile/tablet (single-column hero): the hero CTAs span the full row, and
   the floating spec card flows under the preview instead of covering it. */
@media(max-width:900px){
  .hero-buttons{flex-direction:column;align-items:stretch}
  .hero-buttons .btn{width:100%}
  .hero-visual{margin-top:30px}
  .hero-preview-tag{top:-24px}
  .hero-visual .floating-spec{position:static;width:fit-content;margin:14px 4px 0 auto}
}

/* ---------------------------------------------------------------- dark theme
   Same token names, tonal dark values derived from the brand ink family
   (#12171b) — never a plain inversion. Self-contained art panels (browser
   mockups, navy boards, proof sections) stay literal on purpose. */
[data-theme="dark"]{color-scheme:dark;--canvas:#0f1418;--surface:#151c22;--raised:#1a2229;--surface-2:#1a232a;--wash:#202a32;--wash-2:#26313a;--ink:#e7ecee;--ink-soft:#c6d0d5;--ink-muted:#9fabb2;--muted:#93a0a7;--faint:#84919a;--ghost:#6f7d85;--faintest:#5b6870;--line:#28323a;--line-soft:#1f2930;--line-strong:#3d4a53;--line-hover:#55646e;--track:#232e36;--indigo:#93a0ff;--indigo-strong:#adb7ff;--indigo-solid:#4d5cf0;--indigo-solid-hover:#5d6bf3;--indigo-soft:#273056;--indigo-soft-line:#3e4a80;--indigo-tint:#1f2a3c;--indigo-wash:#263145;--on-indigo-soft:#b9c2ff;--indigo-ring:rgba(147,160,255,.3);--focus-ring:0 0 0 4px rgba(147,160,255,.2);--selection:#2b3559;--lime:#c6f36a;--lime-ink:#17220c;--lime-soft:#2a3618;--lime-halo:#33421f;--success:#a9d98b;--success-soft:#1f2b18;--success-soft-line:#3c5430;--warn:#efc07c;--warn-soft:#2f2616;--warn-soft-line:#554327;--danger-text:#f0948a;--score:#3ecf9a;--score-text:#4ad39e;--dark:#12171b;--dark-2:#1d252b;--shadow:0 22px 70px rgba(0,0,0,.5);--header-bg:rgba(15,20,24,.88);--glow:#161e38;--backplate:#171f2c;--backplate-line:#2a3550;--grid-line:#232d37;--topic-bg:rgba(255,255,255,.06);--code-bg:#0d1317;--code-ink:#cfe0e0;--select-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' stroke='%2393a0a7' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
/* Dark-only structural tweaks */
[data-theme="dark"] .dark-section{border-block:1px solid var(--line)}
[data-theme="dark"] .site-footer{background:#0b1013}
[data-theme="dark"] .browser,[data-theme="dark"] .hero-mobile-preview,[data-theme="dark"] .headless-front-card,[data-theme="dark"] .callout-mini{box-shadow:0 33px 80px rgba(0,0,0,.55)}
/* Arrow assets load via <img>, so their currentColor stroke resolves to black —
   recolor to white wherever they sit on dark surfaces (same treatment as
   .btn-primary in light mode). */
[data-theme="dark"] .btn-outline .btn-icon img,
[data-theme="dark"] .btn-light .btn-icon img,
[data-theme="dark"] .text-link img{filter:brightness(0) invert(1)}

/* Theme toggle (header actions; site.js binds [data-theme-toggle]) */
.theme-toggle{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--indigo);cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.theme-toggle:hover{border-color:var(--indigo)}
.theme-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .theme-icon-sun{display:none}
[data-theme="dark"] .theme-toggle .theme-icon-sun{display:block}
[data-theme="dark"] .theme-toggle .theme-icon-moon{display:none}