@font-face { font-family: "Space Grotesk"; src: url("/fonts/SpaceGrotesk-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Space Grotesk"; src: url("/fonts/SpaceGrotesk-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("/fonts/JetBrainsMono-Regular.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("/fonts/JetBrainsMono-Medium.ttf") format("truetype"); font-weight: 500; font-display: swap; }

:root { --ink:#1A1A1A; --paper:#F5F5F5; --white:#FFFFFF; --muted:#666666; --mid:#888888; --line:#E3E3DF; --red:#C8102E; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--paper); }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Space Grotesk", Arial, sans-serif; font-size:16px; line-height:1.5; }
img { display:block; max-width:100%; }
a { color:inherit; }
button, select { font:inherit; }
.skip-link { position:fixed; top:-80px; left:16px; z-index:100; background:var(--ink); color:var(--white); padding:10px 14px; }
.skip-link:focus { top:16px; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }

.site-nav { position:fixed; inset:0 0 auto; z-index:30; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:28px; padding:12px 28px; border-bottom:1px solid rgba(26,26,26,.14); background:rgba(245,245,245,.92); backdrop-filter:blur(14px); }
.brand { display:flex; align-items:center; gap:13px; text-decoration:none; min-width:0; }
.brand img { width:68px; height:auto; }
.brand span { font-size:11px; white-space:nowrap; }
.site-nav nav { display:flex; align-items:center; gap:20px; }
.site-nav nav a { font-family:"JetBrains Mono", monospace; font-size:11px; text-decoration:none; border-bottom:1px solid transparent; }
.site-nav nav a:hover, .site-nav nav a:focus-visible { border-bottom-color:var(--red); }
.language-control select { min-width:62px; border:1px solid var(--ink); border-radius:0; background:var(--paper); color:var(--ink); padding:7px 8px; font-family:"JetBrains Mono", monospace; font-size:11px; }

.hero { position:relative; height:88svh; min-height:680px; overflow:hidden; border-bottom:1px solid var(--ink); background:var(--paper); }
#spatial-scene { position:absolute; inset:0; width:100%; height:100%; touch-action:none; }
.hero-copy { position:relative; z-index:2; width:48%; max-width:680px; padding:154px 0 76px 7vw; pointer-events:none; }
.eyebrow { margin:0 0 14px; color:var(--red); font-family:"JetBrains Mono", monospace; font-size:11px; font-weight:500; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:22px; font-size:92px; line-height:.94; font-weight:700; }
.hero-lead { max-width:580px; margin-bottom:30px; color:#3E3E3E; font-size:24px; line-height:1.3; }
.hero-actions { display:flex; gap:10px; flex-wrap:wrap; pointer-events:auto; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 17px; border:1px solid var(--ink); background:rgba(245,245,245,.9); text-decoration:none; font-size:13px; }
.button.primary { background:var(--ink); color:var(--white); }
.button:hover, .button:focus-visible { border-color:var(--red); }
.hero-readouts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); max-width:580px; margin:42px 0 0; border-top:1px solid var(--ink); pointer-events:none; }
.hero-readouts div { padding:13px 14px 12px 0; border-right:1px solid var(--line); }
.hero-readouts dt { font-family:"JetBrains Mono", monospace; font-size:14px; font-weight:500; }
.hero-readouts dd { margin:3px 0 0; color:var(--muted); font-size:11px; }
.scene-hint { position:absolute; right:26px; bottom:22px; z-index:2; font-family:"JetBrains Mono", monospace; font-size:9px; color:var(--muted); }

.proof-band { min-height:90px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:22px 7vw; background:var(--ink); color:var(--white); }
.proof-band p { max-width:900px; margin:0; font-size:19px; }
.proof-band span { flex:none; font-family:"JetBrains Mono", monospace; font-size:10px; color:#BABABA; }
.section-pad { padding:100px 7vw; }
.section-heading { display:grid; grid-template-columns:1fr 1.35fr; column-gap:7vw; align-items:start; margin-bottom:44px; }
.section-heading .eyebrow { grid-column:1; }
.section-heading h2 { grid-column:1; max-width:680px; font-size:48px; line-height:1.05; }
.section-heading > p:not(.eyebrow) { grid-column:2; grid-row:1 / span 2; max-width:660px; color:var(--muted); font-size:19px; padding-top:30px; }
.section-heading.compact { display:block; max-width:900px; }

.campaign-gallery { padding:82px 7vw 34px; background:#000; color:var(--white); }
.campaign-heading { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:30px; }
.campaign-heading .eyebrow { margin:0; }
.campaign-heading h2 { max-width:820px; margin:0; font-size:48px; line-height:1.02; text-align:right; }
.campaign-stage { position:relative; height:clamp(600px,70vw,790px); overflow:hidden; border:1px solid #444; background:#080808; }
.campaign-slide { position:absolute; inset:0; display:block; color:var(--white); text-decoration:none; opacity:0; visibility:hidden; transform:scale(1.012); transition:opacity .65s ease,transform 5.4s ease,visibility .65s; }
.campaign-slide.is-active { opacity:1; visibility:visible; transform:scale(1); z-index:1; }
.campaign-slide img { width:100%; height:100%; object-fit:cover; }
.campaign-slide.plan-slide img { object-fit:contain; object-position:right center; background:var(--paper); }
.campaign-slide::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.76) 0%,rgba(0,0,0,.18) 58%,rgba(0,0,0,.42) 100%); pointer-events:none; }
.campaign-copy { position:absolute; z-index:2; left:clamp(22px,4vw,66px); bottom:116px; max-width:680px; }
.campaign-copy .eyebrow { color:#fff; opacity:.72; }
.campaign-copy h3 { max-width:660px; margin-bottom:14px; font-size:clamp(36px,4.5vw,70px); line-height:.98; }
.campaign-copy > p:last-child { max-width:610px; margin:0; color:#E1E1E1; font-size:18px; }
.campaign-readout { position:absolute; z-index:2; top:28px; right:28px; display:grid; gap:4px; padding:12px 14px; border:1px solid rgba(255,255,255,.55); background:rgba(0,0,0,.48); font-family:"JetBrains Mono",monospace; font-size:9px; }
.campaign-readout span { color:#BDBDBD; }
.quantity-readout { position:absolute; z-index:2; right:28px; bottom:116px; display:grid; grid-template-columns:repeat(3,minmax(118px,1fr)); margin:0; border:1px solid rgba(255,255,255,.62); background:rgba(0,0,0,.72); }
.quantity-readout div { padding:13px 16px; }
.quantity-readout div + div { border-left:1px solid rgba(255,255,255,.3); }
.quantity-readout dt { color:#BDBDBD; font-family:"JetBrains Mono",monospace; font-size:8px; }
.quantity-readout dd { margin:4px 0 0; font-family:"JetBrains Mono",monospace; font-size:15px; }
.campaign-controls { position:absolute; z-index:4; inset:auto 0 0; min-height:72px; display:grid; grid-template-columns:72px 1fr auto 72px; align-items:center; border-top:1px solid #555; background:rgba(0,0,0,.92); }
.campaign-controls button { align-self:stretch; border:0; border-radius:0; background:transparent; color:#fff; font-size:24px; cursor:pointer; }
.campaign-controls button:hover,.campaign-controls button:focus-visible { background:#fff; color:#000; }
.campaign-progress { height:1px; margin:0 18px; background:linear-gradient(90deg,var(--red) var(--campaign-progress,16.66%),#4B4B4B var(--campaign-progress,16.66%)); }
.campaign-controls span { min-width:58px; font-family:"JetBrains Mono",monospace; font-size:10px; text-align:center; }
.workflow-ribbon { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); margin:0; padding:0; list-style:none; border-left:1px solid #444; }
.workflow-ribbon li { min-height:92px; display:flex; flex-direction:column; justify-content:space-between; padding:14px; border-right:1px solid #444; border-bottom:1px solid #444; }
.workflow-ribbon span { color:#777; font-family:"JetBrains Mono",monospace; font-size:9px; }
.workflow-ribbon strong { font-size:14px; font-weight:500; }
.campaign-footnote { max-width:980px; margin:16px 0 0; color:#8F8F8F; font-family:"JetBrains Mono",monospace; font-size:9px; }

.results { background:var(--white); }
.result-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--ink); border:1px solid var(--ink); }
.result-grid figure { position:relative; margin:0; background:var(--white); overflow:hidden; }
.result-grid img { width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .5s ease; }
.result-grid figure:hover img { transform:scale(1.015); }
.result-grid figcaption { padding:13px 14px; border-top:1px solid var(--ink); font-family:"JetBrains Mono", monospace; font-size:10px; }

.capabilities { background:var(--paper); }
.capability-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.capability-grid article { min-height:250px; padding:22px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.capability-grid span { display:block; margin-bottom:46px; color:var(--red); font-family:"JetBrains Mono", monospace; font-size:11px; }
.capability-grid h3 { font-size:20px; line-height:1.2; }
.capability-grid p { color:var(--muted); font-size:14px; }

.manual { background:var(--white); }
.process { margin:0; padding:0; list-style:none; border-top:1px solid var(--ink); }
.process li { display:grid; grid-template-columns:90px 1fr; padding:22px 0; border-bottom:1px solid var(--line); }
.process li > span { color:var(--red); font-family:"JetBrains Mono", monospace; font-size:12px; }
.process li div { display:grid; grid-template-columns:minmax(200px,.65fr) 1fr; gap:5vw; }
.process h3 { margin:0; font-size:20px; }
.process p { max-width:720px; margin:0; color:var(--muted); }
.capture-compare { display:grid; grid-template-columns:1fr 1fr; margin-top:64px; border:1px solid var(--ink); }
.capture-compare > div { min-height:210px; padding:26px; }
.capture-compare > div + div { border-left:1px solid var(--ink); }
.capture-compare h3 { font-size:25px; }
.capture-compare p:last-child { color:var(--muted); }

.vibes { background:var(--paper); }
.vibe-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; border:1px solid var(--ink); background:var(--ink); }
.vibe-grid figure { margin:0; overflow:hidden; background:var(--paper); }
.vibe-grid img { width:100%; aspect-ratio:16/11; object-fit:cover; transition:transform .45s ease; }
.vibe-grid figure:hover img { transform:scale(1.018); }
.vibe-grid figcaption { min-height:82px; display:flex; flex-direction:column; gap:5px; padding:14px 15px; border-top:1px solid var(--ink); }
.vibe-grid strong { font-size:15px; }
.vibe-grid span { color:var(--muted); font-size:11px; }
.own-vibe { display:grid; grid-template-columns:90px minmax(220px,.7fr) 1fr; gap:30px; align-items:center; padding:28px 0; border-bottom:1px solid var(--ink); }
.own-vibe > span { color:var(--red); font-family:"JetBrains Mono",monospace; font-size:13px; }
.own-vibe h3,.own-vibe p { margin:0; }
.own-vibe h3 { font-size:24px; }
.own-vibe p { color:var(--muted); }

.decorator { display:grid; grid-template-columns:minmax(0,.86fr) minmax(520px,1.14fr); gap:7vw; align-items:center; background:var(--ink); color:var(--white); overflow:hidden; }
.decorator h2 { max-width:680px; font-size:48px; line-height:1.05; }
.decorator-copy > p:not(.eyebrow):not(.note) { max-width:650px; color:#C8C8C8; font-size:18px; }
.brief-index { margin:38px 0 0; border-top:1px solid #555; }
.brief-index div { display:grid; grid-template-columns:130px 1fr; gap:18px; padding:13px 0; border-bottom:1px solid #444; }
.brief-index dt { font-family:"JetBrains Mono", monospace; font-size:10px; color:#AFAFAF; }
.brief-index dd { margin:0; font-size:13px; }
.note { margin-top:22px; color:#AFAFAF; font-family:"JetBrains Mono", monospace; font-size:10px; }
.screen-stack { min-height:720px; position:relative; }
.screen-stack figure { position:absolute; width:48%; margin:0; border:1px solid #666; background:var(--white); overflow:hidden; }
.screen-stack figure:first-child { top:0; left:0; }
.screen-stack figure:last-child { right:0; bottom:0; }
.screen-stack img { width:100%; height:auto; }

.standards { background:var(--paper); }
.standards-strip { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.standards-strip div { min-height:128px; padding:18px 14px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.standards-strip strong { display:block; margin-bottom:26px; font-family:"JetBrains Mono", monospace; font-size:13px; }
.standards-strip span { color:var(--muted); font-size:11px; }
.expert-line { display:grid; grid-template-columns:1fr 1.4fr; gap:7vw; margin-top:70px; padding-top:26px; border-top:3px solid var(--red); }
.expert-line h3 { font-size:31px; }
.expert-line p { color:var(--muted); font-size:18px; }
.accuracy-note { display:grid; grid-template-columns:.55fr 1.5fr auto; gap:28px; align-items:start; margin-top:48px; padding:22px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.accuracy-note p { margin:0; }
.accuracy-note > p:nth-child(2) { color:var(--muted); font-size:13px; }
.accuracy-note div { display:flex; flex-direction:column; gap:6px; font-family:"JetBrains Mono",monospace; font-size:9px; }

.pricing { background:var(--white); }
.price-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--ink); }
.price-grid article { min-height:390px; padding:28px; }
.price-grid article + article { border-left:1px solid var(--ink); }
.price-grid article.featured { background:var(--ink); color:var(--white); }
.price-grid h3 { min-height:64px; font-size:28px; line-height:1.1; }
.price-grid small { color:#C8C8C8; font-size:13px; font-weight:500; }
.price-grid ul { margin:30px 0 0; padding:0; list-style:none; }
.price-grid li { padding:10px 0; border-top:1px solid var(--line); font-size:14px; }
.price-grid .featured li { border-color:#444; }
.annual { margin-top:26px; color:#B7B7B7; font-family:"JetBrains Mono", monospace; font-size:10px; }

.faq { background:var(--paper); }
.faq details { border-top:1px solid var(--ink); padding:20px 0; }
.faq details:last-child { border-bottom:1px solid var(--ink); }
.faq summary { cursor:pointer; font-size:19px; font-weight:700; }
.faq details p { max-width:850px; margin:14px 0 0; color:var(--muted); }

footer { display:grid; grid-template-columns:1fr auto; align-items:start; gap:30px; padding:38px 7vw; border-top:1px solid var(--ink); background:var(--white); }
.footer-brand { display:flex; align-items:center; gap:14px; }
.footer-brand img { width:64px; }
.footer-brand span { font-size:11px; }
.footer-links { display:flex; gap:18px; font-family:"JetBrains Mono", monospace; font-size:10px; }
footer > p { grid-column:1/-1; margin:0; color:var(--muted); font-family:"JetBrains Mono", monospace; font-size:9px; }

.legal-page { background:var(--paper); }
.legal-shell { min-height:70vh; padding:132px 7vw 100px; }
.legal-hero { max-width:960px; padding-bottom:54px; border-bottom:1px solid var(--ink); }
.legal-hero h1 { margin-bottom:18px; font-size:72px; }
.legal-hero > p:last-child { color:var(--muted); font-family:"JetBrains Mono", monospace; font-size:11px; }
.legal-index { display:flex; gap:20px; margin:20px 0 70px; font-family:"JetBrains Mono", monospace; font-size:11px; }
.legal-copy { max-width:920px; margin:0 auto 90px; }
.legal-copy h2 { margin:0 0 38px; padding-bottom:14px; border-bottom:3px solid var(--red); font-size:40px; }
.legal-copy h3 { margin:42px 0 10px; font-size:22px; }
.legal-copy p { color:#444; font-size:16px; line-height:1.72; }
.legal-copy a { text-underline-offset:3px; }
.support-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.support-grid article { min-height:300px; padding:26px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.support-grid article > span { display:block; margin-bottom:52px; color:var(--red); font-family:"JetBrains Mono", monospace; font-size:11px; }
.support-grid h2 { font-size:23px; line-height:1.12; }
.support-grid p { color:var(--muted); font-size:14px; }
.support-grid a { font-family:"JetBrains Mono", monospace; font-size:11px; }
.contact-band { margin-top:80px; padding:52px; background:var(--ink); color:var(--white); }
.contact-band h2 { max-width:900px; font-size:38px; line-height:1.12; }
.contact-band > p:last-child { max-width:800px; margin:24px 0 0; color:#BBBBBB; font-size:13px; }

[dir="rtl"] .hero-copy { padding-left:0; padding-right:7vw; }
[dir="rtl"] .scene-hint { right:auto; left:26px; }

@media (max-width:1050px) {
  .site-nav nav a { display:none; }
  .hero-copy { width:62%; }
  h1 { font-size:78px; }
  .capability-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .standards-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .decorator { grid-template-columns:1fr; }
  .screen-stack { min-height:680px; max-width:760px; width:100%; margin:0 auto; }
  .campaign-heading { display:block; }
  .campaign-heading h2 { margin-top:10px; text-align:left; }
  .vibe-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:700px) {
  .site-nav { min-height:64px; padding:10px 16px; }
  .brand img { width:55px; }
  .brand span { display:none; }
  .site-nav nav { gap:8px; }
  .hero { height:86svh; min-height:670px; }
  .hero-copy { width:100%; padding:118px 18px 36px; }
  h1 { font-size:58px; }
  .hero-lead { max-width:330px; font-size:18px; }
  .hero-readouts { max-width:360px; margin-top:32px; }
  .scene-hint { bottom:12px; right:16px; }
  .proof-band { align-items:flex-start; flex-direction:column; padding:22px 18px; }
  .proof-band p { font-size:16px; }
  .campaign-gallery { padding:60px 18px 24px; }
  .campaign-heading h2 { font-size:36px; }
  .campaign-stage { height:620px; }
  .campaign-slide::after { background:linear-gradient(0deg,rgba(0,0,0,.84) 0%,rgba(0,0,0,.08) 72%); }
  .campaign-copy { left:18px; right:18px; bottom:104px; }
  .campaign-copy h3 { font-size:38px; }
  .campaign-copy > p:last-child { font-size:15px; }
  .campaign-readout { top:14px; right:14px; }
  .quantity-readout { left:14px; right:14px; bottom:218px; grid-template-columns:repeat(3,1fr); }
  .quantity-readout div { padding:9px; }
  .quantity-readout dd { font-size:12px; }
  .campaign-controls { grid-template-columns:56px 1fr auto 56px; }
  .workflow-ribbon { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .workflow-ribbon li { min-height:76px; }
  .section-pad { padding:72px 18px; }
  .section-heading { display:block; margin-bottom:30px; }
  .section-heading h2, .decorator h2 { font-size:36px; }
  .section-heading > p:not(.eyebrow) { padding-top:0; font-size:16px; }
  .result-grid { grid-template-columns:1fr; }
  .capability-grid { grid-template-columns:1fr; }
  .capability-grid article { min-height:210px; }
  .process li { grid-template-columns:45px 1fr; }
  .process li div { display:block; }
  .process h3 { margin-bottom:7px; }
  .capture-compare { grid-template-columns:1fr; }
  .capture-compare > div + div { border-left:0; border-top:1px solid var(--ink); }
  .vibe-grid { grid-template-columns:1fr; }
  .own-vibe { grid-template-columns:48px 1fr; gap:18px; }
  .own-vibe p { grid-column:2; }
  .decorator { padding-bottom:50px; }
  .screen-stack { min-height:480px; }
  .screen-stack figure { width:55%; }
  .standards-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .expert-line { display:block; }
  .accuracy-note { grid-template-columns:1fr; gap:12px; }
  .price-grid { grid-template-columns:1fr; }
  .price-grid article + article { border-left:0; border-top:1px solid var(--ink); }
  footer { grid-template-columns:1fr; padding:30px 18px; }
  .footer-links { flex-wrap:wrap; }
  .legal-shell { padding:110px 18px 70px; }
  .legal-hero h1 { font-size:48px; }
  .legal-index { margin-bottom:50px; }
  .legal-copy { margin-bottom:70px; }
  .legal-copy h2 { font-size:32px; }
  .support-grid { grid-template-columns:1fr; }
  .support-grid article { min-height:240px; }
  .contact-band { margin-top:56px; padding:30px 22px; }
  .contact-band h2 { font-size:30px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .result-grid img,.vibe-grid img,.campaign-slide { transition:none; }
}
