/* Construction data page (/data) and the homepage data banner. Builds on landing.css tokens. */
.data-hero .intro{max-width:780px}
.data-why{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.data-why li{position:relative;padding:22px 22px 22px 52px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;font-size:15px;color:#33475b}
.data-why li:before{content:'';position:absolute;left:22px;top:29px;width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px #e2f5ec}
.data-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.data-panel{padding:32px;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.data-panel h2{font-size:clamp(24px,2.6vw,32px)}.data-panel p{margin-top:14px}
.data-audience{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.data-audience span{padding:7px 12px;border:1px solid var(--line-strong);border-radius:999px;background:var(--wash);font-size:13px;font-weight:600;color:var(--ink)}
.data-contact-card{padding:32px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);box-shadow:var(--shadow)}
.data-contact-card dl{display:grid;gap:18px;margin:0}
.data-contact-card dt{color:var(--muted);font:600 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.data-contact-card dd{margin:4px 0 0;font-size:17px;font-weight:650;color:var(--ink)}
.data-contact-card dd a{color:var(--blue);text-decoration:underline;text-underline-offset:4px}

/* Homepage banner: a quiet light strip below the dark final CTA. */
.data-strip{padding:28px 0;border-top:1px solid var(--line);background:var(--wash)}
.data-strip .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.data-strip h2{font-size:clamp(19px,2vw,22px);letter-spacing:-.01em}
.data-strip p{margin-top:4px;font-size:15px}
.data-strip a{flex:none;font-weight:650;color:var(--blue);text-decoration:underline;text-underline-offset:4px}

@media(max-width:820px){.data-why,.data-split{grid-template-columns:1fr}}
@media(max-width:600px){
  .data-panel,.data-contact-card{padding:22px}
  .data-why li{padding:18px 18px 18px 46px}.data-why li:before{left:18px;top:25px}
  .data-strip .wrap{flex-direction:column;align-items:flex-start;gap:10px}
}