/* Second Data site styles. Same tokens and type system as the original single page. */
:root{
  --paper:#F2F3EF;
  --paper-deep:#E8EAE3;
  --ink:#1A2523;
  --ink-soft:#4A5653;
  --ledger:#2F5D50;
  --rule:#C9CDC3;
  --card:#FAFAF6;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Public Sans',system-ui,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px;width:100%}
a{color:var(--ledger)}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--ledger);outline-offset:3px}

/* Header and nav */
header{border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:20;background:var(--paper)}
.mast{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 24px;flex-wrap:wrap}
.wordmark{
  font-family:'Spectral',serif;font-weight:600;font-size:1.1rem;
  color:var(--ink);text-decoration:none;
}
.wordmark span{color:var(--ledger)}
.nav{display:flex;gap:22px;flex-wrap:wrap;align-items:baseline}
.nav a{
  font-family:'IBM Plex Mono',monospace;font-size:.78rem;
  color:var(--ink-soft);text-decoration:none;border-bottom:1px solid transparent;padding-bottom:2px;
}
.nav a:hover,.nav a:focus-visible,.nav a[aria-current="page"]{color:var(--ledger);border-color:var(--ledger)}
.nav a.nav-cta{color:var(--ink);border-color:var(--rule)}
.nav a.nav-cta:hover,.nav a.nav-cta:focus-visible{color:var(--ledger);border-color:var(--ledger)}

main{flex:1}

/* Hero */
.hero{padding:110px 24px 80px;text-align:left}
.page-hero{padding:88px 24px 56px}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ledger);
  letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:18px;
}
h1{
  font-family:'Spectral',serif;font-weight:500;
  font-size:clamp(2.4rem,6vw,4rem);line-height:1.1;
  max-width:16ch;letter-spacing:-.01em;
}
.page-hero h1{font-size:clamp(2.1rem,5vw,3.2rem);max-width:20ch}
.lede{margin-top:26px;max-width:52ch;font-size:1.1rem;color:var(--ink-soft)}
.actions{margin-top:40px}

.btn{
  display:inline-block;background:var(--ledger);color:var(--paper);
  font-weight:600;font-size:1rem;font-family:inherit;
  padding:15px 32px;text-decoration:none;border:1px solid var(--ledger);cursor:pointer;
}
.btn:hover,.btn:focus-visible{background:var(--ink);border-color:var(--ink)}
.btn-quiet{
  display:inline-block;margin-left:24px;
  font-family:'IBM Plex Mono',monospace;font-size:.8rem;color:var(--ink-soft);
  text-decoration:none;border-bottom:1px solid var(--rule);padding-bottom:2px;
}
.btn-quiet:hover,.btn-quiet:focus-visible{color:var(--ledger);border-color:var(--ledger)}

/* Sections */
.strip{border-top:1px solid var(--rule);padding:56px 0}
.section{border-top:1px solid var(--rule);padding:72px 0}
.section-tint{background:var(--paper-deep)}
.section h2.title{
  font-family:'Spectral',serif;font-weight:500;font-size:clamp(1.6rem,3.4vw,2.1rem);
  line-height:1.2;max-width:24ch;margin-bottom:14px;
}
.section .intro{max-width:56ch;color:var(--ink-soft);margin-bottom:40px}
.more{
  display:inline-block;margin-top:36px;
  font-family:'IBM Plex Mono',monospace;font-size:.8rem;color:var(--ledger);text-decoration:none;
  border-bottom:1px solid var(--ledger);padding-bottom:2px;
}

/* Steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.steps.five{grid-template-columns:repeat(2,1fr);gap:40px 48px}
.step h2,.step h3{
  font-family:'Spectral',serif;font-weight:600;font-size:1.1rem;margin-bottom:8px;
}
.num{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ledger);
  display:block;margin-bottom:12px;letter-spacing:.1em;
}
.step p{font-size:.92rem;color:var(--ink-soft)}

/* Card grid */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--rule)}
.grid.three{grid-template-columns:repeat(3,1fr)}
.cell{padding:28px 28px 30px 0;border-bottom:1px solid var(--rule)}
.grid .cell:nth-child(2n){padding-left:28px;border-left:1px solid var(--rule)}
.grid.three .cell{padding:28px 24px 30px 24px;border-left:1px solid var(--rule)}
.grid.three .cell:nth-child(2n){padding-left:24px}
.grid.three .cell:nth-child(3n+1){padding-left:0;border-left:none}
.cell h3{font-family:'Spectral',serif;font-weight:600;font-size:1.1rem;margin-bottom:8px}
.cell p{font-size:.94rem;color:var(--ink-soft)}
.cell .ex{
  display:block;margin-top:12px;
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ink-soft);line-height:1.6;
}

/* Detail rows: label left, text right */
.rows{border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:220px 1fr;gap:32px;padding:30px 0;border-bottom:1px solid var(--rule)}
.row h3{font-family:'Spectral',serif;font-weight:600;font-size:1.15rem;line-height:1.3}
.row .tag{
  display:block;margin-top:8px;font-family:'IBM Plex Mono',monospace;font-size:.7rem;
  color:var(--ledger);letter-spacing:.08em;text-transform:uppercase;
}
.row p{color:var(--ink-soft);font-size:.96rem}
.row p + p{margin-top:12px}
.row ul{margin-top:12px;padding-left:18px;color:var(--ink-soft);font-size:.94rem}
.row li + li{margin-top:4px}

/* Plain lists */
.ticks{list-style:none;max-width:60ch}
.ticks li{padding:12px 0 12px 26px;border-bottom:1px solid var(--rule);position:relative;color:var(--ink-soft);font-size:.96rem}
.ticks li::before{
  content:"";position:absolute;left:2px;top:22px;width:10px;height:1px;background:var(--ledger);
}
.ticks li strong{color:var(--ink);font-weight:600}
.ticks.no li::before{background:var(--ink-soft);transform:rotate(45deg)}
.ticks.no li::after{
  content:"";position:absolute;left:2px;top:22px;width:10px;height:1px;background:var(--ink-soft);transform:rotate(-45deg);
}

.cols{display:grid;grid-template-columns:1fr 1fr;gap:48px}
.cols h3{font-family:'Spectral',serif;font-weight:600;font-size:1.15rem;margin-bottom:10px}

/* Prose (company, privacy) */
.prose{max-width:62ch}
.wrap.prose{max-width:1040px}
.wrap.prose > *{max-width:62ch}
.prose p{color:var(--ink-soft);margin-bottom:18px}
.prose p.big{font-family:'Spectral',serif;font-size:1.35rem;line-height:1.45;color:var(--ink)}
.prose h2{font-family:'Spectral',serif;font-weight:600;font-size:1.25rem;margin:40px 0 10px;color:var(--ink)}
.prose ul{margin:0 0 18px 20px;color:var(--ink-soft)}
.prose li + li{margin-top:6px}
.small{font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ink-soft)}

/* FAQ */
.faq{border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{
  list-style:none;cursor:pointer;padding:24px 40px 24px 0;position:relative;
  font-family:'Spectral',serif;font-weight:600;font-size:1.12rem;line-height:1.35;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";position:absolute;right:4px;top:20px;
  font-family:'IBM Plex Mono',monospace;font-weight:400;font-size:1.2rem;color:var(--ledger);
}
.faq details[open] summary::after{content:"\2212"}
.faq summary:focus-visible{outline:2px solid var(--ledger);outline-offset:3px}
.faq .answer{padding:0 40px 26px 0;color:var(--ink-soft);max-width:64ch}
.faq .answer p + p{margin-top:12px}
.faq-group{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ledger);
  letter-spacing:.1em;text-transform:uppercase;margin:48px 0 14px;
}
.faq-group:first-child{margin-top:0}

/* CTA band */
.cta-band{border-top:1px solid var(--rule);background:var(--ink);color:var(--paper);padding:64px 0}
.cta-band h2{font-family:'Spectral',serif;font-weight:500;font-size:clamp(1.6rem,3.4vw,2.1rem);line-height:1.2;max-width:22ch}
.cta-band p{color:#C9D0CC;margin-top:14px;max-width:52ch}
.cta-band .btn{margin-top:30px;background:var(--paper);color:var(--ink);border-color:var(--paper)}
.cta-band .btn:hover,.cta-band .btn:focus-visible{background:var(--ledger);color:var(--paper);border-color:var(--ledger)}
.cta-band .btn:focus-visible{outline-color:var(--paper)}

/* Contact form */
.contact-form{max-width:48ch;display:flex;flex-direction:column;gap:20px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft);
}
.field .opt{text-transform:none;letter-spacing:0}
.field input,.field textarea,.field select{
  font:inherit;font-size:1rem;color:var(--ink);background:transparent;
  border:1px solid var(--rule);border-radius:0;padding:11px 12px;width:100%;
}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.field textarea{min-height:128px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--ledger)}
.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:2px solid var(--ledger);outline-offset:2px}
.contact-form .btn{align-self:flex-start}
.contact-form .btn[disabled]{opacity:.6;cursor:default}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-status{font-size:.92rem;color:var(--ink-soft)}
.form-status a{color:var(--ledger)}
.form-done{font-size:1.1rem;color:var(--ink);max-width:48ch}
.form-note{font-size:.85rem;color:var(--ink-soft);max-width:48ch}

/* Tool picker in the home form */
.tools{border:0;display:flex;flex-direction:column;gap:14px;min-width:0}
.tools legend{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink);margin-bottom:12px;padding:0;
}
.tool-group{display:flex;flex-direction:column;gap:8px}
.tool-group-title{font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--ink-soft)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  display:inline-flex;align-items:center;gap:8px;cursor:pointer;
  border:1px solid var(--rule);padding:7px 12px;font-size:.92rem;color:var(--ink);
}
.chip input{accent-color:var(--ledger);margin:0;width:15px;height:15px}
.chip:hover{border-color:var(--ink-soft)}
.chip:has(input:checked){border-color:var(--ledger);background:var(--paper-deep)}
.chip:has(input:focus-visible){outline:2px solid var(--ledger);outline-offset:2px}

/* Fact row in the hero */
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:36px;border-top:1px solid var(--rule);max-width:460px}
.fact{padding-top:18px}
.fact + .fact{border-left:1px solid var(--rule);padding-left:22px}
.stat-big{display:block;font-family:'Spectral',serif;font-weight:500;font-size:clamp(1.6rem,3.4vw,2.1rem);line-height:1.2}
.stat-label{display:block;margin-top:6px;font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ink-soft)}

/* Two-column hero with the form card */
.hero-grid{padding-top:72px}
.hero-art{display:none;margin-top:44px;width:100%;max-width:420px;height:auto;fill:none;stroke-width:1.4;stroke-linecap:round}
.art-src{stroke:var(--ink-soft)}
.art-src .art-soft{stroke:var(--rule)}
.art-src .art-acc{stroke:var(--ledger)}
.art-code{font-family:'IBM Plex Mono',monospace;font-size:13px;fill:var(--ledger);stroke:none}
.art-flow{stroke:var(--rule);stroke-dasharray:3 4}
.art-set{stroke:var(--ledger)}
.form-card{margin-top:44px;background:var(--card);border:1px solid var(--rule);padding:28px 28px 30px;scroll-margin-top:100px}
.form-card-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:20px}
.form-card-title{font-family:'Spectral',serif;font-weight:500;font-size:1.45rem;line-height:1.2}
.form-step-label{font-family:'IBM Plex Mono',monospace;font-size:.7rem;color:var(--ink-soft);white-space:nowrap}
.form-card .contact-form{max-width:none}
.form-step{display:flex;flex-direction:column;gap:20px}
.form-step .btn{align-self:flex-start}
.js [data-steps] .form-step[data-step="2"]{display:none}
.js [data-steps].on-step-2 .form-step[data-step="1"]{display:none}
.js [data-steps].on-step-2 .form-step[data-step="2"]{display:flex}
.link-back{
  align-self:flex-start;background:none;border:0;border-bottom:1px solid var(--rule);padding:0 0 2px;cursor:pointer;
  font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:var(--ink-soft);
}
.link-back:hover,.link-back:focus-visible{color:var(--ledger);border-color:var(--ledger)}
@media (min-width:900px){
  .hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:56px;align-items:start}
  .hero-copy{position:sticky;top:120px}
  .hero-art{display:block}
  .form-card{margin-top:0}
}

/* Privacy note in the data types sections */
.privacy-note{
  max-width:64ch;margin:0 0 36px;padding:18px 22px;
  background:var(--card);border:1px solid var(--rule);border-left:3px solid var(--ledger);
}
.page-hero .privacy-note{margin:32px 0 0}
.privacy-note-title{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ledger);margin-bottom:8px;
}
.privacy-note p:last-child{font-size:.95rem;color:var(--ink-soft)}

/* Dark section */
.section-dark{background:var(--ink);color:var(--paper);border-top-color:var(--ink)}
.section-dark .eyebrow{color:#A9C8BC}
.section-dark .ticks li{color:#C9D0CC;border-color:#3A4744}
.section-dark .ticks li strong{color:var(--paper)}
.section-dark .ticks li::before{background:#A9C8BC}
.section-dark + .section{border-top:none}

/* Small motion */
.cell{transition:background-color .2s ease}
.grid .cell:hover{background:rgba(255,255,255,.45)}
:root{interpolate-size:allow-keywords}
.faq details::details-content{block-size:0;overflow:clip;transition:block-size .25s ease,content-visibility .25s allow-discrete}
.faq details[open]::details-content{block-size:auto}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .cell,.faq details::details-content{transition:none}
}

/* Mobile menu */
.menu-btn{
  display:none;background:none;border:1px solid var(--rule);padding:6px 12px;cursor:pointer;
  font-family:'IBM Plex Mono',monospace;font-size:.75rem;color:var(--ink);
}
.menu-btn:focus-visible{outline:2px solid var(--ledger);outline-offset:3px}

.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}

/* Footer */
footer{
  border-top:1px solid var(--rule);padding:28px 0 40px;
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:var(--ink-soft);
}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
footer nav{display:flex;gap:18px;flex-wrap:wrap}
footer a{color:var(--ink-soft);text-decoration:none}
footer a:hover,footer a:focus-visible{color:var(--ledger)}

@media (max-width:760px){
  .hero{padding:64px 24px 56px}
  .page-hero{padding:56px 24px 40px}
  .section{padding:56px 0}
  .steps,.steps.five{grid-template-columns:1fr;gap:32px}
  .grid,.grid.three{grid-template-columns:1fr}
  .grid .cell,.grid .cell:nth-child(2n),.grid.three .cell,.grid.three .cell:nth-child(2n),.grid.three .cell:nth-child(3n+1){padding:24px 0;border-left:none}
  .row{grid-template-columns:1fr;gap:10px}
  .cols,.split{grid-template-columns:1fr;gap:36px}
  .btn-quiet{margin:20px 0 0;display:table}
  .nav{gap:14px 18px}
  .form-card{padding:22px 18px 24px}
  .js .mast{align-items:center}
  .js .menu-btn{display:inline-block}
  .js .nav{display:none;width:100%;flex-direction:column;gap:0}
  .js .nav.open{display:flex}
  .js .nav a{display:block;width:100%;padding:13px 0;border-bottom:1px solid var(--rule);font-size:.85rem}
  .js .nav a[aria-current="page"]{border-color:var(--rule)}
  .stat-big{font-size:1.4rem}
  .fact + .fact{padding-left:16px}
  .js .nav a:last-child{border-bottom:none}
}
