/* Home hero — canvas particle backdrop, gradient headline, collage / mobile pathway strip */

.hero-wrap{height:auto;display:flex;flex-direction:column;overflow:hidden}
@media (min-width:1024px){ .hero-wrap{height:calc(100vh - 76px)} }

.hero-grid{position:relative;max-width:1320px;margin:0 auto;padding:36px 48px 28px;width:100%;box-sizing:border-box;flex:1 1 auto;min-height:0;overflow:hidden;display:grid;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr);gap:32px}
@media (min-width:1024px){ .hero-grid{grid-template-columns:1.02fr 1fr;padding-top:0;padding-bottom:0} }
@media (max-width:900px){ .hero-grid{padding-left:20px;padding-right:20px} }

.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}

.hero-text{position:relative;z-index:1;align-self:center;width:100%;max-width:100%}

.hero-kicker{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.hero-kicker .bars{display:flex;align-items:flex-end;gap:3px;height:16px}
.hero-kicker .bars i{display:block;width:3px;border-radius:2px}
/* Muted grey label, NOT the orange eyebrow style used elsewhere — this specific hero
   line is intentionally soft/low-contrast in the approved design (its own size/tracking
   too: 11.5px/.16em, not the shared eyebrow's 11px/.14em). */
.hero-kicker-label{font-family:var(--dd-font-ui);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(21,18,15,.5)}

.hero-h1{position:relative;font-family:var(--dd-font-display);font-weight:600;font-size:var(--dd-h1-hero);line-height:1.02;letter-spacing:-.032em;margin:0 0 16px;text-wrap:balance}
.hero-glow{position:absolute;left:38%;top:52%;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(255,138,0,.4),transparent 70%);filter:blur(30px);animation:ddglow 5.5s ease-in-out infinite;pointer-events:none;z-index:-1}
@media (max-width:560px){ .hero-glow{display:none} }

.hero-lede{font-size:clamp(15px,2.1vh,19px);line-height:1.5;color:var(--dd-ink-soft);max-width:560px;margin:0 0 16px;text-wrap:pretty}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:22px}

.hero-stats{display:grid;grid-template-columns:repeat(3,auto);gap:18px;justify-content:start;border-top:1px solid rgba(21,18,15,.13);padding-top:14px}
@media (min-width:561px){ .hero-stats{grid-template-columns:repeat(3,auto)} }
@media (min-width:901px){ .hero-stats{grid-template-columns:repeat(5,auto)} }
.hero-stats .n{font-family:var(--dd-font-display);font-weight:600;font-size:clamp(18px,2.4vh,24px);letter-spacing:-.03em;line-height:1}
.hero-stats .l{font-family:var(--dd-font-ui);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:rgba(21,18,15,.45);margin-top:5px;white-space:nowrap}

.hero-mobile-strip{display:flex;flex-wrap:wrap;gap:8px;overflow-x:visible;width:100%;margin-top:22px;padding-bottom:4px}
@media (min-width:1024px){ .hero-mobile-strip{display:none} }
.hero-mobile-strip a{flex:none;font-family:var(--dd-font-ui);font-size:12px;color:#fff;background:var(--dd-gradient);padding:9px 16px;border-radius:999px;white-space:nowrap;text-decoration:none;display:inline-block}
.hero-mobile-strip a:hover{color:#fff;opacity:.88}

/* Collage — desktop only */
.hero-collage{display:none;position:relative;z-index:1;height:100%;min-height:0;overflow:hidden;padding-bottom:8px;box-sizing:border-box}
@media (min-width:1024px){ .hero-collage{display:block} }
.hero-collage-glow{position:absolute;inset:0;background:radial-gradient(58% 52% at 62% 38%,rgba(255,138,0,.22),transparent 70%);filter:blur(18px);animation:ddbreathe 11s ease-in-out infinite}
.hero-collage-grid{position:relative;height:100%;min-height:0;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(6,minmax(0,1fr));gap:12px}
.hero-collage-grid > div{overflow:hidden;display:flex;padding:14px}
.hero-collage-grid span{font-family:var(--dd-font-ui);font-size:10px;letter-spacing:.08em}

/* Trusted-by strip */
.trusted-strip{flex:none;border-top:1px solid rgba(21,18,15,.1);background:rgba(243,236,226,.5)}
.trusted-strip-inner{max-width:1320px;margin:0 auto;padding:20px 48px;display:flex;align-items:center;gap:38px;flex-wrap:wrap}
@media (max-width:900px){ .trusted-strip-inner{padding-left:20px;padding-right:20px} }
.trusted-strip-label{font-family:var(--dd-font-ui);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(21,18,15,.42)}
.trusted-strip-name{font-family:var(--dd-font-display);font-weight:500;font-size:16px;letter-spacing:-.01em;color:rgba(21,18,15,.44)}
