/* Shared visual theme: monochrome, bold type, soft panels and compact controls. */
:root { --ink:#000; --ink-raised:#050505; --ink-2:#0c0c0d; --paper:#fafafa; --paper-ink:#111; --accent:#ddd; --accent-deep:#aaa; --fg:#fafafa; --fg-dim:#c5c5c8; --fg-mute:#aaaab0; --fg-faint:#94949b; --rule:rgba(255,255,255,.14); --rule-soft:rgba(255,255,255,.08); --font-display:var(--font-body); --maxw:1200px; }
body { font-size:16px; }
section { padding-top:90px; padding-bottom:90px; }
.on-paper,.on-accent { background:#050505; color:var(--fg); --fg:#fafafa; --fg-dim:#c5c5c8; --fg-mute:#aaaab0; --fg-faint:#94949b; --rule:rgba(255,255,255,.14); --rule-soft:rgba(255,255,255,.08); --mat:#101011; }
.on-accent ::selection { background:#fafafa; color:#111; }
.display { font-weight:650; line-height:1.1; letter-spacing:-.045em; }
.display .ser { font-style:normal; color:#adadb2; }
.eyebrow { font-size:12px; line-height:1.4; font-weight:400; text-transform:none; letter-spacing:0; padding:6px 12px; border:1px solid var(--rule); border-radius:100px; background:linear-gradient(180deg,#202021,#0b0b0c); box-shadow:inset 0 1px 5px #ffffff0d; }
.eyebrow::before { width:4px; height:4px; background:#b6b6bb; }
.btn,.nav-cta { border-radius:100px; font-size:14px; }
.btn-primary,.on-paper .btn-primary { background:#fafafa; color:#101010; }
.btn-primary:hover { background:#dcdcdf; color:#000; }
.btn-ghost { background:linear-gradient(#202022,#0a0a0b); border-color:#333337; color:#fafafa; box-shadow:inset 0 1px 6px #ffffff08; }
.round-arrow { display:inline-flex; justify-content:center; align-items:center; width:27px; height:27px; background:#111; color:#fff; border-radius:50%; margin-left:8px; }
nav { top:20px; left:max(20px,calc((100% - 1200px)/2)); right:max(20px,calc((100% - 1200px)/2)); height:72px; padding:0 24px; border:1px solid #ffffff12; border-radius:100px; background:rgba(20,20,21,.9); backdrop-filter:blur(18px); }
nav.scrolled { background:rgba(17,17,18,.95); }
.brand-logo { height:21px; }
.nav-links,.nav-right { gap:24px; }
.nav-links a { font-size:13px; }
.nav-cta { padding:11px 19px; background:linear-gradient(#333,#181818); border:1px solid #ffffff17; color:#fff!important; }
.nav-cta:hover { background:#343436; }
.nav-toggle { border-radius:50%; flex:none; width:40px; height:40px; }
.hero { min-height:auto; padding:166px var(--gutter) 70px; display:block; position:relative; isolation:isolate; }
.hero::before { content:''; position:absolute; inset:0; pointer-events:none; z-index:-1; background-image:linear-gradient(#ffffff05 1px,transparent 1px),linear-gradient(90deg,#ffffff05 1px,transparent 1px),radial-gradient(ellipse at 20% 0,#24242670,transparent 55%); background-size:110px 110px,110px 110px,100% 100%; mask-image:linear-gradient(#000,transparent 90%); }
.hero-inner { max-width:var(--maxw); text-align:center; }
.hero-label { display:inline-flex; align-items:center; justify-content:center; gap:10px; font-size:13px; font-weight:500; line-height:1.5; color:#e9e9ec; letter-spacing:.03em; }
.hero-label::before { content:""; width:5px; height:5px; flex:none; border-radius:50%; background:#c5e478; }
.hero-headline { font-family:var(--font-body); font-size:clamp(38px,4.2vw,62px); line-height:1.14; letter-spacing:-.045em; font-weight:650; margin:30px auto 0; animation:none; }
.hero-headline span { color:#fafafa; }
.hero-lead { font-size:17px; line-height:1.75; max-width:62ch; margin:30px auto 0; color:var(--fg-mute); animation:none; }
.hero-actions { margin-top:34px; gap:28px; align-items:center; animation:none; }
.hero-work-link { display:inline-flex; align-items:center; gap:10px; font-size:14px; min-height:48px; padding:10px 0; color:var(--fg-dim); text-decoration:none; }
.hero-work-link:hover { color:var(--fg); text-decoration:underline; text-underline-offset:5px; }
.hero-actions .btn { padding:10px 19px; min-height:48px; }
.hero-gallery { display:grid; grid-template-columns:.85fr 1.15fr .85fr; gap:14px; margin-top:76px; align-items:stretch; text-align:left; }
.hero-project { display:flex; flex-direction:column; min-width:0; border:1px solid #29292c; border-radius:22px; padding:16px; background:radial-gradient(ellipse at top,#1e1e21,#080809 80%); text-decoration:none; transition:border-color .25s,transform .25s; }
.hero-project:nth-child(2) { background:#101111; }
.hero-project:hover { border-color:#64646a; transform:translateY(-4px); }
.hero-project-art { height:310px; display:flex; align-items:center; justify-content:center; }
.hero-project-art img { max-width:100%; max-height:100%; width:auto; height:auto; border-radius:8px; }
.hero-project-caption { margin-top:20px; display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:13px; }
.hero-project-caption small { display:block; font-size:11px; color:var(--fg-mute); margin-top:4px; }
.compare-headline { font-size:clamp(32px,4vw,56px); max-width:30ch; }
.compare-support { font-size:17px; }
.compare-col,.compare-col.is-kalvano { border:1px solid var(--rule); border-radius:22px; padding:32px; background:linear-gradient(145deg,#151516,#060607); box-shadow:inset 0 0 30px #ffffff03; }
.compare-col.is-kalvano { border-color:#505055; }
.compare-col h3 { font-size:28px; font-weight:600; letter-spacing:-.035em; }
.compare-tag,.service-tag,.model-type,.model-when { font-size:11px; letter-spacing:.06em; }
.manifesto { padding-top:65px; padding-bottom:65px; border-top:1px solid var(--rule-soft); border-bottom:1px solid var(--rule-soft); background:radial-gradient(ellipse at center,#141416,#000 75%); }
.manifesto-headline { font-size:clamp(30px,3.8vw,52px); max-width:32ch; }
.manifesto-note { font-size:14px; }
.services { background:#000; border:0; }
.services > .wrap { text-align:center; }
.services-head { display:block; text-align:center; }
.services-headline { font-size:clamp(32px,4vw,54px); }
.services-intro { margin:18px auto 0; max-width:55ch; font-size:16px; }
.services-grid { gap:18px; }
.service-card { padding:28px; border:1px solid var(--rule); border-radius:22px; background:linear-gradient(150deg,#151516,#050506); }
.service-num { font-size:35px; font-weight:600; letter-spacing:-.05em; }
.service-card h3 { font-size:24px; font-weight:600; margin-top:24px; letter-spacing:-.035em; }
.service-card p { font-size:16px; }
.work-headline { font-size:clamp(32px,4vw,54px); max-width:22ch; }
.work-lede { font-size:17px; }.work-note { font-size:14px; }
.wproj.is-summary { grid-template-columns:minmax(0,.4fr) minmax(0,.6fr); gap:50px; padding:60px 0; }
.is-summary .wproj-cat { font-size:25px; letter-spacing:-.025em; text-transform:none; font-weight:600; }
.is-summary .wproj-concept em { font-style:normal; font-size:1em; font-weight:500; }
.wproj-block p { font-size:16px; }
.wproj-label,.wc-kicker,.wproj-bet-label,.wf-label { font-size:11px; letter-spacing:.06em; color:#bdbdc3; }
.work-frame { border-radius:14px; border-color:#29292d; background:#0b0b0c; }
.work-frame img { filter:none; border-radius:6px; }
.wproj-grid-summary { align-items:stretch; }
.wproj-grid-summary .work-figure { align-items:stretch; }
.wproj-grid-summary > .is-hero .work-frame { height:clamp(330px,40vw,540px); width:100%; }
.wproj-grid-summary .work-frame img { width:100%; object-fit:contain; }
.wproj-pair > .work-figure { flex:1; min-width:0; }
.wproj-pair .work-frame { width:100%; height:clamp(160px,19vw,240px); }
.wc-sub { font-size:13px; }
.model-link { font-size:14px; }
.offer-headline,.icp-headline { font-size:clamp(32px,3.8vw,52px); }
.model-card,.model-card.is-lead { border:1px solid #2b2b2f; border-radius:24px; background:linear-gradient(140deg,#161618,#060607); padding:32px; }
.model-card.is-lead { border-color:#55555a; }
.model-name,.model-card.is-lead .model-name { font-size:30px; font-weight:600; letter-spacing:-.035em; }
.model-price,.model-card.is-lead .model-price { font-size:clamp(38px,4.6vw,64px); font-weight:600; letter-spacing:-.05em; }
.model-card.is-lead .model-feats li,.model-feats li { font-size:15px; }
.model-desc,.model-card.is-lead .model-desc { font-size:16px; }
.model-cta .btn { font-size:14px; padding:15px 24px; }
.offer-note { font-size:13px; line-height:1.65; }
.icp { background:#050505; }.icp-tags li { font-size:13px; background:#111113; border-color:#303034; }
.sprint-headline { font-size:clamp(30px,3.5vw,46px); }.sprint-stage { font-size:23px; font-weight:600; letter-spacing:-.025em; }.sprint-what { font-size:15px; }
.faq-headline { font-size:clamp(32px,4vw,52px); }.faq-list summary { font-size:18px; }.faq-list details p { font-size:16px; }
.faq-list summary::after { font-family:var(--font-body); font-size:22px; }
.cta { background:radial-gradient(ellipse at 50% 100%,#242427,#050505 70%); border-bottom:1px solid var(--rule); }
.cta-headline { font-size:clamp(40px,6vw,80px); max-width:20ch; }
.cta-sub { font-size:18px; }.cta-actions .btn { font-size:15px; padding:16px 25px; }.cta-note { font-size:14px; }
footer { background:#000; }.footer-col h5 { font-size:11px; letter-spacing:.08em; }.footer-tagline { font-size:14px; }
.proj-head { padding-top:150px; }.wproj-title { font-size:clamp(36px,4.2vw,58px); font-weight:650; line-height:1.08; letter-spacing:-.045em; }
.wproj-bar .wproj-num { font-weight:600; }.wproj-meta,.wproj-foot { padding:26px; border:1px solid var(--rule); border-radius:20px; background:#0a0a0b; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:2px solid #e5e5e9; outline-offset:5px; }
[id] { scroll-margin-top:115px; }
@media (max-width:980px) { .wproj.is-summary { grid-template-columns:1fr; gap:28px; }.wproj-grid-summary > .is-hero .work-frame { height:480px; }.wproj-pair .work-frame { height:250px; } }
@media (max-width:920px) {
 nav { padding:0 18px; }.nav-right { gap:12px; }.nav-links { top:calc(100% + 10px); left:0; right:0; border:1px solid #303034; border-radius:22px; background:#111113; padding:12px 22px; }
 .hero-gallery { gap:10px; }.hero-project { padding:10px; }.hero-project-art { height:230px; }.hero-project-caption { font-size:11px; }
 .services-grid { grid-template-columns:1fr; }.service-card { padding:28px; }.hero { padding-top:150px; }
}
@media (max-width:620px) {
 section { padding-top:58px; padding-bottom:58px; }nav { top:12px; height:64px; left:12px; right:12px; padding:0 14px; }.brand-logo { height:18px; }.nav-cta { font-size:12px; padding:10px 12px; }
 .hero { padding-top:122px; padding-bottom:46px; }.hero-headline { font-size:clamp(33px,8.6vw,48px); }.hero-lead { font-size:16px; }.hero-headline { margin-top:24px; }.hero-lead { margin-top:24px; }.hero-actions { margin-top:28px; gap:22px; }.hero-work-link { font-size:13px; }
 .hero-actions .btn { font-size:12px; padding:9px 14px; }.round-arrow { margin-left:0; }
 .hero-gallery { grid-template-columns:1fr 1fr; gap:12px; margin-top:48px; }.hero-project:nth-child(2) { grid-column:1/-1; grid-row:1; }.hero-project-art { height:155px; }.hero-project:nth-child(2) .hero-project-art { height:300px; }.hero-project-caption { gap:6px; line-height:1.4; }.hero-project-caption small { font-size:10px; }.hero-project { border-radius:16px; }
 .compare-col,.compare-col.is-kalvano,.model-card,.model-card.is-lead { padding:24px; }.compare-grid { gap:16px; }.compare-col h3 { font-size:25px; }.compare-support { font-size:16px; }
 .wproj.is-summary { padding:38px 0; }.wproj-grid-summary > .is-hero .work-frame { height:360px; }.wproj-pair .work-frame { height:180px; }.wproj-pair { gap:10px; }.wproj-block p { font-size:16px; }
 .faq-list summary { font-size:16px; }.cta-sub { font-size:16px; }.proj-head { padding-top:115px; }.wproj-meta,.wproj-foot { padding:20px; }
}
@media(prefers-reduced-motion:reduce) { .hero-project { transition:none; }.hero-project:hover { transform:none; } }

/* Mini case studies: a concise problem-to-execution story. */
.case-category { display:block; font-size:14px; font-weight:400; letter-spacing:0; color:var(--fg-mute); margin-top:7px; }
.case-disclosure { display:block; margin-top:12px; color:var(--fg-mute); font-size:11px; }
.case-summary { margin-top:24px; }
.case-summary > div { margin-top:18px; }
.case-summary dt,.case-context dt { font-size:11px; font-weight:600; letter-spacing:.06em; color:var(--fg-mute); text-transform:uppercase; margin-bottom:7px; }
.case-summary dd { font-size:15px; line-height:1.6; color:var(--fg-dim); }
.case-summary .case-summary-angle { padding:18px 0; border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }
.case-summary-angle dd { font-size:22px; font-weight:600; line-height:1.25; letter-spacing:-.025em; color:var(--fg); }
.mini-case .wproj-strategy { position:static; }
.case-head { padding-bottom:32px; border:0; }
.case-title { font-size:clamp(38px,4.5vw,64px); font-weight:650; line-height:1.1; letter-spacing:-.045em; margin-top:24px; }
.case-subtitle { color:var(--fg-dim); font-size:17px; margin-top:10px; }
.case-value { max-width:48ch; font-size:clamp(19px,2vw,25px); font-weight:500; line-height:1.4; letter-spacing:-.02em; margin-top:24px; }
.case-head .work-note { max-width:75ch; font-size:13px; }
.case-body { padding-top:0; }
.case-context { display:grid; grid-template-columns:1fr 1fr; gap:40px; padding:28px; border:1px solid var(--rule); border-radius:20px; background:#0a0a0b; }
.case-context dd { font-size:16px; line-height:1.6; color:var(--fg-dim); max-width:55ch; }
.case-angle { padding:40px 0; }
.case-angle h2 { font-size:clamp(28px,3.3vw,46px); font-weight:600; line-height:1.12; letter-spacing:-.035em; margin-top:12px; max-width:30ch; }
.case-executions-head { margin-bottom:24px; }
.case-executions-head h2,.case-rationale h2 { font-size:20px; font-weight:600; letter-spacing:-.02em; }
.case-executions-head p { font-size:15px; color:var(--fg-dim); line-height:1.6; max-width:80ch; margin-top:10px; }
.case-executions-head .case-execution-note { font-size:12px; color:var(--fg-mute); }
.case-rationale { display:grid; grid-template-columns:.6fr 1.4fr; gap:32px; margin-top:36px; padding:28px; background:#0a0a0b; border:1px solid var(--rule); border-radius:20px; }
.case-rationale p { max-width:65ch; font-size:16px; color:var(--fg-dim); line-height:1.65; }
@media(max-width:620px) {
 .case-context { grid-template-columns:1fr; gap:24px; padding:22px; }
 .case-rationale { grid-template-columns:1fr; gap:12px; padding:22px; }
 .case-body .wproj-grid { grid-template-columns:1fr; }
 .case-body .work-frame { aspect-ratio:auto; height:auto; max-height:none; padding:12px; }
 .case-body .work-frame img { width:100%; height:auto; }
 .case-head { padding-bottom:28px; }
 .case-summary dd { font-size:15px; }.case-summary-angle dd { font-size:22px; }
}

/* Case-study opening: identity, output and strategy each get their own space. */
.case-head { padding-top:160px; padding-bottom:64px; }
.case-head .proj-back { margin-bottom:48px; }
.case-masthead { display:grid; grid-template-columns:1.2fr .8fr; gap:80px; align-items:center; }
.case-title { font-size:clamp(44px,5.5vw,78px); margin-top:28px; }
.case-subtitle { margin-top:16px; font-size:18px; }
.case-identity .work-note { margin-top:24px; max-width:48ch; line-height:1.7; }
.case-overview { display:flex; gap:26px; align-items:center; padding:36px; border:1px solid #303034; border-radius:28px; background:linear-gradient(135deg,#1b1c1c,#0a0a0b); }
.case-overview-number { display:flex; align-items:center; justify-content:center; width:106px; height:106px; flex:none; border-radius:50%; background:#c5e478; color:#11140d; font-size:44px; font-weight:600; letter-spacing:-.06em; }
.case-overview-title { font-size:23px; line-height:1.3; letter-spacing:-.03em; font-weight:500; }
.case-jump { display:inline-flex; align-items:center; gap:18px; min-height:44px; margin-top:16px; font-size:13px; color:var(--fg-mute); text-decoration:none; }
.case-jump:hover { color:var(--fg); }
.case-story { display:grid; grid-template-columns:2fr 1fr; gap:20px; align-items:stretch; margin-bottom:72px; }
.case-context { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:0; border:0; background:none; }
.case-context-card { padding:30px; border:1px solid #303034; border-radius:24px; background:#111113; }
.case-context dt,.case-angle .wproj-label { display:flex; flex-direction:column; align-items:start; gap:24px; margin:0; font-size:11px; font-weight:500; letter-spacing:.07em; }
.case-step { display:flex; align-items:center; justify-content:center; width:38px; height:38px; border:1px solid #48484c; border-radius:50%; font-size:12px; letter-spacing:0; }
.case-context dd { margin-top:18px; font-size:16px; line-height:1.65; }
.case-context .is-insight { background:#efefed; border-color:#efefed; }
.case-context .is-insight dt { color:#50504d; }.case-context .is-insight dd { color:#282825; }.is-insight .case-step { color:#efefed; background:#171715; border-color:#171715; }
.case-story .case-angle { border-radius:24px; padding:30px; background:#c5e478; color:#11140d; }
.case-angle .wproj-label { color:#39432a; }
.case-angle .case-step { background:#14190f; color:#e8f6cf; border-color:#14190f; }
.case-story .case-angle h2 { margin-top:22px; color:#11140d; font-size:clamp(25px,2.6vw,36px); line-height:1.2; max-width:18ch; }
.case-executions-head { display:grid; grid-template-columns:.7fr 1.3fr; gap:10px 48px; padding-top:0; margin-bottom:36px; }
.case-executions-head h2 { grid-row:1/3; font-size:30px; }
.case-executions-head p { margin:0; }.case-executions-head .case-execution-note { grid-column:2; }
@media(max-width:1000px) {
 .case-masthead { gap:32px; grid-template-columns:1fr 1fr; }
 .case-overview { padding:26px; gap:18px; }.case-overview-number { width:76px; height:76px; font-size:34px; }.case-overview-title { font-size:20px; }
 .case-story { grid-template-columns:1fr; }.case-story .case-angle { display:grid; grid-template-columns:.5fr 1.5fr; gap:24px; align-items:center; }.case-story .case-angle h2 { margin:0; max-width:30ch; }
}
@media(max-width:620px) {
 .case-head { padding-top:124px; padding-bottom:36px; }.case-head .proj-back { margin-bottom:32px; }
 .case-masthead { grid-template-columns:1fr; gap:32px; }.case-title { margin-top:24px; }
 .case-overview { padding:24px; border-radius:22px; gap:24px; }.case-overview-number { width:82px; height:82px; font-size:36px; }
 .case-context { grid-template-columns:1fr; gap:16px; }.case-context-card,.case-story .case-angle { padding:26px; }
 .case-context dt,.case-angle .wproj-label { flex-direction:row; align-items:center; gap:16px; }
 .case-story { gap:16px; margin-bottom:48px; }.case-story .case-angle { display:block; }.case-story .case-angle h2 { margin-top:24px; font-size:30px; }
 .case-executions-head { grid-template-columns:1fr; gap:16px; margin-bottom:28px; }.case-executions-head h2 { grid-row:auto; font-size:26px; }.case-executions-head .case-execution-note { grid-column:1; }
}

/* Homepage work: a short premise, a clear angle, and useful testing options. */
.mini-case .case-summary { margin-top:28px; }
.mini-case .case-summary > div + div { margin-top:24px; }
.mini-case .case-summary .case-summary-angle { padding:24px; border:0; border-radius:20px; background:#c5e478; }
.mini-case .case-summary-angle dt { color:#414c2c; margin-bottom:12px; }
.mini-case .case-summary-angle dd { color:#11140d; font-size:clamp(22px,2vw,28px); line-height:1.2; }
.mini-case .case-angle-context { display:block; margin-top:12px; color:#354021; font-size:14px; font-weight:400; line-height:1.6; letter-spacing:0; }