@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/font-1.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/font-2.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/font-3.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/font-4.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/font-5.ttf) format('truetype');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/font-6.ttf) format('truetype');
}


/* ---------- Tokens ---------- */
:root {
  --night:#0d241b; --night-2:#123126; --night-line:#24463a; --night-text:#e9f1ea; --night-muted:#a3b9ad;
  --paper:#f5f3ec; --paper-2:#ebe8de; --card:#fbfaf6; --ink:#13241c; --muted:#56635c; --line:#d9d6ca;
  --lime:#cef77c; --lime-2:#b9ec52; --green:#16372c; --leaf:#4f7f2a; --sky:#dfe9ee; --sand:#ecf0c9;
  --mono:'IBM Plex Mono',ui-monospace,monospace; --sans:'DM Sans',system-ui,Arial,sans-serif;
  --wrap:1240px; --radius:14px; --header:72px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(var(--header) + 16px); }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--leaf); outline-offset:4px; border-radius:4px; }
.hero :focus-visible,.header :focus-visible,.about :focus-visible,.footer :focus-visible { outline-color:var(--lime); }
::selection { color:var(--ink); background:var(--lime); }
h1,h2,h3 { font-weight:500; margin:0; }
em { font-style:normal; }
.wrap { width:min(var(--wrap),calc(100% - 96px)); margin-inline:auto; }
.mono { font-family:var(--mono); font-size:12px; letter-spacing:.4px; }
.eyebrow { display:flex; align-items:center; gap:10px; font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:1.4px; line-height:1.6; margin:0 0 24px; color:var(--leaf); }
.skip-link { position:absolute; z-index:30; top:10px; left:10px; transform:translateY(-200%); padding:10px 16px; background:var(--lime); color:var(--ink); border-radius:6px; }
.skip-link:focus { transform:translateY(0); }

/* ---------- Buttons ---------- */
.button { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:14px 24px; min-height:52px; border-radius:999px; font-size:15px; font-weight:600; transition:background .2s,transform .2s,box-shadow .2s; }
.button span { transition:transform .2s; }
.button:hover { transform:translateY(-2px); }
.button:hover span { transform:translateX(3px); }
.button-lime { color:var(--night); background:var(--lime); box-shadow:0 0 0 0 #cef77c55; }
.button-lime:hover { background:#dcfb9c; box-shadow:0 10px 30px -10px #cef77c99; }
.button-dark { color:var(--night-text); background:var(--night); }
.button-dark:hover { background:var(--green); }
.text-link { font-size:15px; font-weight:550; padding-block:6px; background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat; transition:background-size .25s; }
.text-link:hover { background-size:40% 1px; }

/* ---------- Header ---------- */
.header { position:sticky; top:0; z-index:20; color:var(--night-text); background:#0d241bd9; backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid #ffffff14; }
.header-inner { width:min(1344px,calc(100% - 64px)); margin:auto; min-height:var(--header); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:25px; line-height:1; letter-spacing:-1.1px; }
.brand-period { color:var(--lime); margin-left:-9px; }
.brand-mark { width:30px; height:30px; flex:none; }
.brand-mark rect { fill:var(--lime); }
.brand-mark path { fill:none; stroke:var(--night); stroke-width:3; }
nav { display:flex; align-items:center; gap:30px; font-size:14px; font-weight:500; }
nav a { padding-block:8px; color:var(--night-muted); transition:color .2s; }
nav a:hover { color:var(--night-text); }
nav .nav-contact { color:var(--night); background:var(--lime); border-radius:999px; padding:9px 18px; font-weight:600; }
nav .nav-contact:hover { color:var(--night); background:#dcfb9c; }
.menu-toggle { display:none; }

/* ---------- Hero ---------- */
.hero { position:relative; overflow:hidden; color:var(--night-text); background:var(--night); padding:96px 0 0; isolation:isolate; }
.hero::before { content:''; position:absolute; inset:0; z-index:-1; background-image:linear-gradient(#ffffff0b 1px,transparent 1px),linear-gradient(90deg,#ffffff0b 1px,transparent 1px); background-size:56px 56px; mask-image:radial-gradient(ellipse 80% 70% at 70% 30%,#000 30%,transparent 80%); -webkit-mask-image:radial-gradient(ellipse 80% 70% at 70% 30%,#000 30%,transparent 80%); }
.hero::after { content:''; position:absolute; z-index:-1; width:720px; height:720px; right:-180px; top:-260px; border-radius:50%; background:radial-gradient(circle,#cef77c2e,transparent 65%); }
.hero-grid { display:grid; grid-template-columns:1.25fr 1fr; gap:72px; align-items:center; }
.hero .eyebrow { color:var(--lime); }
.pulse { width:8px; height:8px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 0 #cef77c88; animation:pulse 2.4s infinite; }
@keyframes pulse { 70% { box-shadow:0 0 0 10px #cef77c00; } 100% { box-shadow:0 0 0 0 #cef77c00; } }
h1 { font-size:clamp(48px,6.4vw,92px); line-height:1.01; letter-spacing:-.055em; margin:0 0 30px; }
h1 em { color:var(--lime); }
.hero-description { color:var(--night-muted); max-width:500px; font-size:19px; line-height:1.65; margin:0; }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:28px; margin-top:38px; }
.console { border:1px solid var(--night-line); border-radius:var(--radius); background:linear-gradient(180deg,#163a2dcc,#0f2a20e6); box-shadow:0 40px 80px -40px #000a, inset 0 1px 0 #ffffff12; overflow:hidden; }
.console-bar { display:flex; align-items:center; gap:14px; padding:14px 18px; border-bottom:1px solid var(--night-line); color:var(--night-muted); }
.console-bar .mono:nth-child(2) { margin-right:auto; }
.dots { display:flex; gap:6px; }
.dots i { width:10px; height:10px; border-radius:50%; background:#2f5547; }
.dots i:first-child { background:var(--lime); }
.console-body { padding:28px 28px 8px; }
.console h2 { font-size:28px; line-height:1.2; letter-spacing:-.8px; margin:0 0 26px; max-width:15ch; }
.delivery-flow { list-style:none; margin:0; padding:0; counter-reset:step; }
.delivery-flow li { display:flex; gap:18px; position:relative; padding:14px 0; border-top:1px dashed var(--night-line); }
.flow-number { flex:none; width:30px; color:var(--lime); font:500 12px/1.9 var(--mono); }
.delivery-flow strong { display:block; font-size:16px; font-weight:500; line-height:1.5; }
.delivery-flow li div > span { display:block; color:var(--night-muted); font-size:13px; }
.console-foot { display:flex; align-items:center; gap:6px; padding:16px 28px; border-top:1px solid var(--night-line); color:var(--lime); background:#0b1f17; }
.cursor { width:8px; height:15px; background:var(--lime); animation:blink 1.1s steps(1) infinite; }
@keyframes blink { 50% { opacity:0; } }
.hero-facts { display:flex; align-items:center; justify-content:space-between; gap:24px 40px; flex-wrap:wrap; margin-top:88px; padding:26px 0; border-top:1px solid var(--night-line); }
.hero-note { margin:0; font-size:13px; color:var(--night-muted); }
.expertise { display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.expertise li { padding:6px 14px; border:1px solid var(--night-line); border-radius:999px; font-size:13px; color:var(--night-text); }

/* ---------- Sections ---------- */
.section { padding-block:120px; }
.section-heading { display:grid; grid-template-columns:1fr minmax(0,380px); grid-template-areas:'eyebrow eyebrow' 'title text'; align-items:end; gap:0 48px; margin-bottom:56px; }
.section-heading .eyebrow { grid-area:eyebrow; }
.section-heading h2 { grid-area:title; }
.section-heading > p { grid-area:text; margin:0 0 6px; color:var(--muted); font-size:16px; line-height:1.75; }
.section h2,.contact h2 { font-size:clamp(36px,4.2vw,56px); line-height:1.08; letter-spacing:-.04em; }

/* Services: editorial rows */
.service-list { border-top:1px solid var(--ink); }
.service { display:grid; grid-template-columns:80px minmax(0,1fr) minmax(0,1.15fr); grid-template-areas:'index main text' 'index main chips'; gap:16px 40px; padding:40px 0; border-bottom:1px solid var(--line); transition:background .25s,padding .25s; }
.service:hover { background:linear-gradient(90deg,transparent,#cef77c33 40%,transparent); }
.service-index { grid-area:index; font:500 14px var(--mono); color:var(--leaf); padding-top:8px; }
.service-main { grid-area:main; }
.service-icon { display:block; color:var(--leaf); font:500 20px var(--mono); letter-spacing:-1px; margin-bottom:14px; }
.service h3 { font-size:clamp(26px,2.6vw,34px); line-height:1.15; letter-spacing:-.03em; max-width:14ch; }
.service > p { grid-area:text; margin:0; color:var(--muted); font-size:17px; }
.chips { grid-area:chips; display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.chips li { padding:5px 12px; border:1px solid var(--line); border-radius:999px; font-size:13px; background:var(--card); }
.services-note { display:flex; align-items:center; gap:24px; margin-top:36px; padding:22px 26px; border-radius:var(--radius); background:var(--night); color:var(--night-text); }
.services-note .mono { color:var(--lime); flex:none; }
.services-note p { margin:0; font-size:15px; }

/* Work */
.work { background:var(--paper-2); }
.project-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; }
.project { display:flex; flex-direction:column; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .25s,box-shadow .25s; }
.project:hover { transform:translateY(-4px); box-shadow:0 24px 50px -30px #13241c66; }
.project-cover { position:relative; display:flex; align-items:flex-end; justify-content:space-between; height:170px; padding:22px; background:var(--night); background-image:radial-gradient(circle at 85% 0%,#cef77c40,transparent 55%); }
.project-data .project-cover { background-color:var(--sand); background-image:radial-gradient(circle at 85% 0%,#ffffffaa,transparent 55%); }
.project-trace .project-cover { background-color:var(--sky); background-image:radial-gradient(circle at 85% 0%,#ffffffaa,transparent 55%); }
.project-monogram { font-weight:600; font-size:72px; line-height:.8; letter-spacing:-.08em; color:var(--lime); }
.project-monogram span { color:var(--night-text); }
.project-data .project-monogram { color:#32521c; }
.project-data .project-monogram span { color:#7d944f; }
.project-trace .project-monogram { color:#264b60; }
.project-trace .project-monogram span { color:#6e8995; }
.project-status { position:absolute; top:18px; right:18px; font:500 11px var(--mono); letter-spacing:.6px; text-transform:uppercase; padding:4px 10px; border-radius:999px; color:var(--night); background:var(--lime); }
.project-data .project-status,.project-trace .project-status { background:var(--card); }
.project-body { padding:24px 24px 0; }
.project-kicker { display:block; color:var(--muted); margin-bottom:8px; }
.project h3 { font-size:28px; margin:0 0 10px; font-weight:600; letter-spacing:-.03em; }
.project-body p { margin:0; color:var(--muted); font-size:16px; }
.project-tags { display:flex; gap:6px; flex-wrap:wrap; list-style:none; margin:0; padding:20px 24px 24px; }
.project-tags li { padding:3px 10px; color:var(--ink); background:var(--paper-2); border-radius:999px; font-size:12px; }
.project details { margin-top:auto; padding:16px 24px; border-top:1px solid var(--line); }
summary { cursor:pointer; list-style:none; }
summary::-webkit-details-marker { display:none; }
.project summary { display:flex; align-items:center; justify-content:space-between; font-size:14px; font-weight:600; }
.project summary span { display:grid; place-items:center; width:26px; height:26px; border-radius:50%; background:var(--paper-2); font-size:18px; line-height:1; color:var(--leaf); transition:transform .2s,background .2s; }
.project summary:hover span { background:var(--lime); }
.project details[open] summary span { transform:rotate(45deg); }
.project details p { margin:14px 0 4px; font-size:14px; color:var(--muted); }

/* Approach */
.approach-grid { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; position:relative; }
.approach-grid li { position:relative; padding:32px 28px 30px; border:1px solid var(--line); border-radius:var(--radius); background:var(--card); }
.approach-grid li:not(:last-child)::after { content:'→'; position:absolute; top:28px; right:-19px; z-index:1; display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:var(--lime); color:var(--night); font-size:15px; }
.step-number { display:inline-block; font:500 13px var(--mono); color:var(--leaf); padding:3px 10px; border:1px solid var(--line); border-radius:999px; }
.approach-grid h3 { font-size:22px; letter-spacing:-.02em; line-height:1.3; font-weight:550; margin:22px 0 12px; }
.approach-grid p { color:var(--muted); font-size:16px; margin:0; }

/* About */
.about { color:var(--night-text); background:var(--night); position:relative; overflow:hidden; }
.about::before { content:'g'; position:absolute; right:-40px; bottom:-200px; font:500 620px/1 var(--mono); color:#ffffff06; pointer-events:none; }
.about-grid { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:96px; align-items:center; }
.about .eyebrow { color:var(--lime); }
.about h2 em { color:var(--lime); }
.about-intro { color:var(--night-muted); max-width:420px; font-size:19px; margin:28px 0 0; }
.about-card { padding:36px; border:1px solid var(--night-line); border-radius:var(--radius); background:var(--night-2); }
.founder { display:flex; align-items:center; gap:16px; margin-bottom:24px; }
.founder-initials { flex:none; width:56px; height:56px; border-radius:50%; display:grid; place-items:center; color:var(--night); background:var(--lime); font:500 20px var(--mono); letter-spacing:-1px; }
.founder h3 { font-weight:600; font-size:20px; letter-spacing:-.4px; }
.founder p { margin:0; font-size:13px; color:var(--night-muted); }
.about-card > p { color:#c9d8cd; margin:0 0 16px; font-size:16px; }
.company-facts { display:grid; grid-template-columns:repeat(3,auto); justify-content:start; gap:32px; border-top:1px solid var(--night-line); padding-top:22px; margin:26px 0 0; }
.company-facts dt { font:12px var(--mono); letter-spacing:1px; color:var(--night-muted); }
.company-facts dd { margin:6px 0 0; font-size:15px; }

/* Contact */
.contact { padding-block:120px; background:var(--lime); color:var(--night); }
.contact-grid { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:64px; }
.contact .eyebrow { color:var(--night); }
.contact h2 { font-size:clamp(48px,7vw,104px); line-height:.98; letter-spacing:-.055em; max-width:9ch; }
.contact-lead { margin:28px 0 0; font-size:18px; max-width:30ch; color:#24402f; }
.contact-panel { padding:38px; border-radius:var(--radius); background:var(--card); box-shadow:0 30px 60px -40px #0d241b80; }
.contact-panel > p { margin:0 0 24px; font-size:20px; letter-spacing:-.01em; }
.contact-email { display:block; width:fit-content; font-size:16px; margin-top:24px; border-bottom:1px solid var(--leaf); overflow-wrap:anywhere; }
.contact-email:hover { color:var(--leaf); }
.contact-caption { display:block; margin-top:10px; font-size:13px; color:var(--muted); }

/* Footer */
.footer { color:var(--night-muted); background:var(--night); padding-block:44px 36px; }
.footer .brand { color:var(--night-text); font-size:24px; }
.footer-top,.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.footer-top { padding-bottom:28px; margin-bottom:24px; border-bottom:1px solid var(--night-line); }
.footer-tagline { font-size:14px; }
.footer-tagline:hover { color:var(--lime); }
.footer-bottom { position:relative; justify-content:flex-start; font-size:13px; gap:24px; }
.footer-bottom > p { margin:0 auto 0 0; }
.footer-bottom > a { white-space:nowrap; }
.footer-bottom > a:hover,.privacy summary:hover { color:var(--night-text); text-decoration:underline; }
.privacy > p { position:absolute; right:0; bottom:34px; margin:0; border:1px solid var(--line); border-radius:10px; box-shadow:0 20px 40px #0006; background:var(--card); color:var(--ink); padding:22px; width:min(420px,100%); font-size:14px; z-index:2; }

/* ---------- Responsive ---------- */
@media (max-width:1100px) {
  .wrap { width:calc(100% - 64px); }
  .hero-grid { grid-template-columns:1fr; gap:56px; }
  .console { max-width:620px; }
  .service { grid-template-columns:56px 1fr; grid-template-areas:'index main' 'index text' 'index chips'; gap:14px 24px; }
  .service h3 { max-width:none; }
  .project-grid { grid-template-columns:1fr 1fr; }
  .about-grid { gap:56px; }
}
@media (max-width:860px) {
  .project-grid,.approach-grid { grid-template-columns:1fr; }
  .approach-grid li:not(:last-child)::after { content:'↓'; top:auto; bottom:-19px; right:auto; left:28px; }
  .about-grid,.contact-grid { grid-template-columns:1fr; }
  .section-heading { grid-template-columns:1fr; grid-template-areas:'eyebrow' 'title' 'text'; gap:20px; }
  .section-heading > p { max-width:520px; }
}
@media (max-width:760px) {
  :root { --header:64px; }
  .header-inner { width:calc(100% - 40px); flex-wrap:wrap; gap:0; }
  .brand { font-size:23px; }
  .menu-toggle { display:flex; align-items:center; gap:14px; padding:10px 0 10px 16px; border:0; background:transparent; color:var(--night-text); font-size:14px; cursor:pointer; }
  .menu-toggle span { font-size:24px; line-height:1; color:var(--lime); }
  nav { display:none; flex-basis:100%; padding:8px 0 22px; gap:4px; flex-direction:column; align-items:stretch; font-size:16px; }
  nav.open { display:flex; }
  nav a { padding:12px 4px; border-bottom:1px solid #ffffff12; color:var(--night-text); }
  nav .nav-contact { margin-top:12px; text-align:center; padding:13px; border:0; }
  .wrap { width:calc(100% - 40px); }
  .hero { padding-top:56px; }
  .hero-description { font-size:17px; }
  .hero-actions { gap:22px; }
  .console-body { padding:22px 22px 4px; }
  .console h2 { font-size:24px; }
  .console-foot { padding:14px 22px; }
  .hero-facts { margin-top:56px; }
  .section,.contact { padding-block:72px; }
  .section-heading { margin-bottom:36px; }
  .service { grid-template-columns:1fr; grid-template-areas:'index' 'main' 'text' 'chips'; padding:32px 0; gap:12px; }
  .service-index { padding-top:0; }
  .service:hover { background:none; }
  .services-note { flex-direction:column; align-items:flex-start; gap:8px; }
  .project-cover { height:140px; }
  .project-monogram { font-size:60px; }
  .about-card,.contact-panel { padding:26px; }
  .about::before { font-size:400px; bottom:-120px; }
  .company-facts { grid-template-columns:1fr 1fr; gap:20px; }
  .contact-lead { font-size:17px; }
  .footer-top,.footer-bottom { flex-wrap:wrap; gap:14px 22px; }
  .footer-bottom > p { flex-basis:100%; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; animation:none!important; }
}

/* VoxGuard product focus; retain the established Genework palette. */
.hero-stage { margin:24px 0 0; color:var(--night-muted); font-size:14px; line-height:1.7; }
.hero-grid > *, .about-grid > *, .contact-grid > * { min-width:0; }
.product-showcase { min-width:0; padding:24px; border:1px solid var(--night-line); border-radius:var(--radius); background:var(--night-2); box-shadow:0 40px 80px -40px #000a; }
.showcase-top { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:24px; }
.showcase-top img { display:block; width:170px; max-width:100%; height:auto; }
.stage-label { font:500 12px var(--mono); padding:6px 10px; color:var(--lime); border:1px solid var(--night-line); border-radius:999px; }
.showcase-body { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:24px; align-items:center; }
.hero-phone { display:block; width:100%; height:auto; border-radius:18px; }
.showcase-features { margin:0; }
.showcase-features div + div { margin-top:24px; padding-top:24px; border-top:1px solid var(--night-line); }
.showcase-features dt { margin-bottom:8px; color:var(--lime); font:500 12px var(--mono); letter-spacing:1px; }
.showcase-features dd { margin:0; font-size:16px; line-height:1.55; overflow-wrap:anywhere; }
.showcase-caption { margin:20px 0 0; font-size:12px; color:var(--night-muted); }
.product-proof { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.4fr); gap:32px; align-items:center; margin-top:64px; }
.product-proof figure { margin:0; min-width:0; }
.product-proof img { display:block; width:100%; height:auto; max-width:260px; margin-inline:auto; border-radius:18px; box-shadow:0 24px 50px -30px #13241c66; }
.product-proof figcaption { display:block; margin-top:20px; font-size:14px; line-height:1.6; }
.product-proof figcaption strong,.product-proof figcaption span { display:block; }
.product-proof figcaption span { color:var(--muted); }
.proof-copy h3 { font-size:clamp(26px,2.6vw,34px); line-height:1.2; letter-spacing:-.03em; }
.proof-copy > p:not(.eyebrow) { color:var(--muted); }
.proof-copy .proof-note { font-size:12px; }
.proof-note a { text-decoration:underline; text-underline-offset:3px; }
.claude-roadmap { border-top:1px solid var(--line); }
.roadmap-status { margin:-12px 0 32px; padding:18px 22px; border:1px solid var(--line); border-left:4px solid var(--leaf); border-radius:8px; color:var(--muted); font-size:15px; background:var(--card); }
.roadmap-status strong { display:block; color:var(--ink); margin-bottom:4px; font-weight:600; }
.claude-roadmap .approach-grid li::after { display:none; }
.datakids-roadmap .roadmap-status { font-size:16px; }
.datakids-roadmap .step-number { font-size:14px; letter-spacing:.1px; }
.project-body .product-current { margin-top:18px; font-size:16px; }
.project-body .product-current strong { color:var(--ink); }
.project-body > .text-link { display:inline-block; margin-top:16px; }
.datakids-conditions { margin-top:36px; padding-top:28px; border-top:1px solid var(--line); max-width:850px; }
.datakids-conditions h3 { font-size:24px; line-height:1.35; letter-spacing:-.02em; }
.datakids-conditions p { margin:14px 0 0; color:var(--muted); }
.datakids-conditions a { text-decoration:underline; text-underline-offset:3px; }
.claude-role { margin-top:32px; padding:32px; display:grid; grid-template-columns:1.35fr 1fr; gap:48px; align-items:center; border:1px solid var(--line); border-radius:var(--radius); background:var(--card); }
.claude-role .mono { color:var(--leaf); }
.claude-role h3 { margin-top:14px; font-size:24px; line-height:1.3; letter-spacing:-.02em; }
.claude-role p { margin:14px 0 0; color:var(--muted); }
.integration-flow { display:grid; gap:12px; }
.integration-flow span { padding:14px 18px; border:1px solid var(--line); border-radius:8px; background:var(--paper); font-size:14px; }
.integration-flow span:nth-child(2) { color:var(--night-text); background:var(--night); border-color:var(--night); }
.secondary-products { grid-template-columns:repeat(2,minmax(0,1fr)); }
.secondary-products .project-cover { height:120px; }
.company-register-link { display:inline-block; margin-top:28px; color:var(--lime); font-size:14px; text-decoration:underline; text-underline-offset:5px; }
.company-facts { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 28px; }
.company-facts dd { overflow-wrap:anywhere; }
.project-status { font-size:12px; }
.project-tags li,.chips li,.expertise li { font-size:14px; }
.hero-note { font-size:14px; }
.contact h2 { max-width:13ch; }
@media (max-width:1100px) {
  .product-showcase { max-width:620px; }
  .showcase-body { grid-template-columns:minmax(0,220px) minmax(0,1fr); }
  .product-proof { gap:24px; }
}
@media (max-width:860px) {
  .product-proof { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .proof-copy { grid-column:1 / -1; max-width:600px; margin-top:8px; }
  .claude-role { grid-template-columns:1fr; gap:28px; }
  .secondary-products { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .product-showcase { padding:20px; }
  .showcase-body { grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:18px; }
  .showcase-features dd { font-size:14px; }
  .showcase-features div + div { margin-top:16px; padding-top:16px; }
  .hero .eyebrow { font-size:12px; letter-spacing:1px; }
  .product-proof { margin-top:40px; gap:20px; }
  .claude-role { padding:24px; }
  .roadmap-status { margin-top:0; }
  .services-note p { font-size:16px; }
}
@media (max-width:380px) {
  .showcase-top { gap:12px; }
  .showcase-top img { width:145px; }
  .showcase-body { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
  .showcase-features dd { font-size:14px; line-height:1.45; }
  .showcase-features div + div { margin-top:10px; padding-top:10px; }
  .product-proof { grid-template-columns:1fr; gap:32px; }
  .product-proof img { max-width:230px; }
}