@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=IBM+Plex+Mono:wght@500;700;800;900&family=Space+Grotesk:wght@400;500;600;700;800&display=swap');

/* P1 polish system */
.site-footer{
  display:grid!important;
  grid-template-columns:auto auto;
  justify-content:space-between;
  align-items:center;
  gap:12px 28px;
  padding:22px 24px 20px!important;
  border-top:1px solid var(--line);
  font:700 12px/1 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}
.site-footer nav{display:flex;gap:18px;justify-self:end;flex-wrap:wrap}
.site-footer .footer-legal{
  grid-column:1/-1;
  margin:0;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.07);
  font:700 10px/1.55 var(--mono);
  letter-spacing:.045em;
  text-transform:none;
  color:rgba(255,255,255,.48);
}
.brand-mini{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mini strong{font:900 12px/1 var(--mono);letter-spacing:.08em;color:rgba(255,255,255,.72);text-transform:uppercase}
.brand-mini span{margin-right:0!important}

/* Dynamic hero panel */
.hero-panel{min-height:300px;display:flex;flex-direction:column;transition:border-color .35s ease,box-shadow .35s ease,background .35s ease}
.hero-panel .case-card{min-height:96px;display:flex;flex-direction:column;justify-content:center}
.hero-panel .case-card strong{min-height:39px;display:flex;align-items:center}
.hero-panel .metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.hero-panel .metrics-grid div{min-height:78px;display:flex;flex-direction:column;justify-content:center}
.hero-panel .metrics-grid strong{min-height:22px;white-space:nowrap}
.hero-panel[data-tone="red"]{border-color:rgba(255,26,26,.54);box-shadow:0 0 90px rgba(255,26,26,.16)}
.hero-panel[data-tone="orange"]{border-color:rgba(255,159,26,.58);box-shadow:0 0 90px rgba(255,159,26,.14)}
.hero-panel[data-tone="green"]{border-color:rgba(33,255,116,.52);box-shadow:0 0 90px rgba(33,255,116,.13)}
.hero-panel[data-tone="red"] .panel-status{color:var(--p1-red)}
.hero-panel[data-tone="orange"] .panel-status{color:#ff9f1a}
.hero-panel[data-tone="green"] .panel-status{color:#21ff74}
.hero-panel[data-tone="red"] .pulse{background:var(--p1-red);box-shadow:0 0 0 8px rgba(255,26,26,.12),0 0 28px rgba(255,26,26,.55)}
.hero-panel[data-tone="orange"] .pulse{background:#ff9f1a;box-shadow:0 0 0 8px rgba(255,159,26,.12),0 0 28px rgba(255,159,26,.55)}
.hero-panel[data-tone="green"] .pulse{background:#21ff74;box-shadow:0 0 0 8px rgba(33,255,116,.12),0 0 28px rgba(33,255,116,.45)}
.pulse{animation:p1Pulse 1.1s ease-in-out infinite}
.panel-status span:last-child,.case-card strong,.metrics-grid strong{transition:opacity .18s ease,transform .18s ease}
.hero-panel.is-changing .panel-status span:last-child,.hero-panel.is-changing .case-card strong,.hero-panel.is-changing .metrics-grid strong{opacity:.18;transform:translateY(3px)}
@keyframes p1Pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.45)}}

@media(max-width:760px){
  body{background:radial-gradient(circle at 70% 0%,rgba(255,26,26,.16),transparent 22rem),linear-gradient(180deg,#020202 0%,#070707 54%,#000 100%)}
  .site-shell{width:100%;margin:0;border-left:0;border-right:0;border-radius:0;background:rgba(0,0,0,.72)}
  .site-header{align-items:center!important;padding:14px 20px 12px!important;gap:12px 14px;background:rgba(0,0,0,.94);border-bottom:1px solid rgba(255,255,255,.1)}
  .brand-lockup{width:184px!important;max-width:54vw!important;filter:drop-shadow(0 0 14px rgba(255,26,26,.34))}
  .nav-cta{min-height:40px;padding:0 13px;border-radius:7px;font-size:11px;display:inline-flex;align-items:center}
  .site-nav{order:3;width:calc(100% + 40px);margin:8px -20px -2px;padding:12px 20px 0;gap:22px;overflow-x:auto;white-space:nowrap;font-size:11px;scrollbar-width:none;border-top:1px solid rgba(255,255,255,.08)}
  .site-nav::-webkit-scrollbar{display:none}
  .hero{grid-template-columns:1fr;min-height:auto;padding:46px 26px 56px;gap:30px;align-items:start}
  .hero h1{font-size:clamp(54px,15vw,66px);line-height:.86;letter-spacing:-.01em}
  .eyebrow{font-size:10px;letter-spacing:.14em;margin-bottom:14px}
  .hero-lede{font-size:18px;line-height:1.45;margin:22px 0 28px;max-width:32rem}
  .hero-actions{gap:12px;display:grid}
  .button{min-height:48px;border-radius:8px;width:100%}
  .hero-panel{padding:18px!important;border-radius:16px;min-height:0!important;margin-top:4px}
  .panel-status{font-size:11px;padding-bottom:14px;margin-bottom:16px;letter-spacing:.1em}
  .pulse{width:9px;height:9px}
  .case-card{padding:18px!important;border-radius:10px}
  .hero-panel .case-card{min-height:86px!important}
  .case-card strong{font-size:24px;line-height:1.05}
  .hero-panel .case-card strong{min-height:0!important}
  .metrics-grid{gap:8px!important;margin:10px 0 0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .metrics-grid div{padding:12px 10px!important;min-height:70px!important;border-radius:9px}
  .metrics-grid span{font-size:8px;letter-spacing:.1em}
  .metrics-grid strong{font-size:13px;white-space:normal!important;line-height:1.1;min-height:0!important}
  .flow-section,.pricing-band,.page-hero,.page-section{padding:44px 24px!important}
  .flow-list{grid-template-columns:1fr!important}
  .pricing-grid{grid-template-columns:1fr!important}
  .price-card h3{font-size:44px}
  .final-cta{padding:66px 24px!important}
  .site-footer{grid-template-columns:1fr!important;align-items:start;gap:14px;padding:22px 20px!important}
  .site-footer nav{justify-self:start;gap:16px}
  .site-footer .footer-legal{font-size:9px;line-height:1.6;padding-top:12px}
}

@media(max-width:380px){
  .brand-lockup{width:168px!important;max-width:52vw!important}
  .nav-cta{font-size:10px;padding:0 11px}
  .hero{padding-left:22px;padding-right:22px}
  .hero h1{font-size:52px}
  .metrics-grid{grid-template-columns:1fr!important}
}
