/* SCOPE CARDS */
.scope-card{background:rgba(255,255,255,0.03);padding:36px 30px;transition:background .22s}
.scope-card:hover{background:rgba(255,255,255,0.07)}
.scope-card-icon{width:40px;height:40px;border-radius:10px;background:rgba(0,146,224,0.1);border:1px solid rgba(0,146,224,0.18);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.scope-card h3{font-size:15px;font-weight:700;color:#fff;margin-bottom:10px;line-height:1.3}
.scope-card p{font-size:13.5px;color:rgba(255,255,255,0.72);line-height:1.68}
.scope-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,0.07);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:1px}
.scope-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(255,255,255,0.07);border-radius:var(--radius-lg);overflow:hidden;max-width:760px;margin:0 auto}
@media(max-width:900px){.scope-grid-3{grid-template-columns:1fr 1fr}.scope-card{padding:28px 22px}}
@media(max-width:742px){.scope-grid-3,.scope-grid-2{grid-template-columns:1fr}}
/* ── CREAM HERO OVERRIDE ── */
.hero {
  background: var(--bg);
}
.hero::before {
  background: radial-gradient(ellipse 70% 60% at 80% 50%, rgba(0,146,224,0.10) 0%, transparent 68%),
              radial-gradient(ellipse 40% 35% at 10% 80%, rgba(0,146,224,0.04) 0%, transparent 60%);
}
.hero-l h1 { color: var(--text); }
.hero-l h1 em { color: var(--highlight-dim); }
.hero-lede { color: #555; }
.badge {
  color: var(--highlight-dim);
  border-color: rgba(0,146,224,0.25);
  background: rgba(0,146,224,0.07);
}
.pulse { background: var(--highlight); }
.hero-actions .btn-outline-w {
  background: rgba(0,0,0,0.05);
  color: var(--text);
  border-color: rgba(0,0,0,0.12);
}
.hero-actions .btn-outline-w:hover {
  background: rgba(0,0,0,0.09);
}
.stat-card {
  background: rgba(255,255,255,0.7);
  border-color: rgba(0,0,0,0.08);
}
.stat-card:first-child { border-color: rgba(0,0,0,0.08); }
.stat-num { color: var(--text); }
.stat-num em { color: var(--highlight-dim); }
.stat-lbl { color: var(--muted); }

/* STAGE SCENES — compact card grid for the 5-stage section */
.stage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.stage-card{background:#fff;border:1px solid var(--divider);border-radius:16px;padding:28px 26px;transition:box-shadow .22s,transform .22s}
.stage-card:hover{box-shadow:0 8px 24px rgba(10,31,61,0.08);transform:translateY(-2px)}
.stage-n{font-family:var(--font-d);font-size:13px;font-weight:800;color:rgba(2,176,245,0.45);letter-spacing:0.06em;margin:0 0 4px}
.stage-card h3{margin:0 0 8px}
.stage-card p:not(.stage-n){font-size:13.5px;line-height:1.6;color:var(--muted)}
.stage-scene{margin-bottom:10px}
@media(max-width:900px){.stage-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.stage-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion: no-preference) {
  .scene-ring {
    animation: sceneRing 2.4s ease-out infinite;
  }
  @keyframes sceneRing {
    0% { r: 3; opacity: 0.6; }
    70% { r: 14; opacity: 0; }
    100% { r: 14; opacity: 0; }
  }
  .scene-bubble {
    animation: sceneBubble 2.4s ease-in-out infinite;
  }
  @keyframes sceneBubble {
    0%, 20% { opacity: 0; transform: translateX(-6px); }
    40%, 85% { opacity: 1; transform: translateX(0); }
    100% { opacity: 0; transform: translateX(0); }
  }
  .scene-flow {
    animation: sceneFlow 1.4s linear infinite;
  }
  .scene-flow-2 { animation-delay: .2s; }
  .scene-flow-3 { animation-delay: .4s; }
  @keyframes sceneFlow {
    to { stroke-dashoffset: -18; }
  }
  .scene-check {
    animation: sceneCheck 2.6s ease-in-out infinite;
  }
  @keyframes sceneCheck {
    0%, 15% { stroke-dashoffset: 30; }
    40%, 100% { stroke-dashoffset: 0; }
  }
  .scene-ripple {
    animation: sceneRipple 2.2s ease-out infinite;
  }
  .scene-ripple-2 { animation-delay: 1.1s; }
  @keyframes sceneRipple {
    0% { r: 9; opacity: 0.7; }
    100% { r: 26; opacity: 0; }
  }
  .scene-star {
    opacity: 0.15;
    animation: sceneStar 2s ease-in-out infinite;
  }
  @keyframes sceneStar {
    0%, 40% { opacity: 0.15; }
    55%, 85% { opacity: 1; }
    100% { opacity: 0.15; }
  }
  .scene-pulse {
    animation: scenePulse 2.4s ease-in-out infinite;
    transform-origin: 118px 45px;
  }
  @keyframes scenePulse {
    0%, 100% { opacity: 0.35; transform: scale(0.85); }
    50% { opacity: 1; transform: scale(1); }
  }
}
@media (prefers-reduced-motion: reduce) {
  .scene-bubble, .scene-check { opacity: 1; }
  .scene-check { stroke-dashoffset: 0; }
}

/* HERO VIDEO — bankability score animation */
.phone-section-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center}
.hero-video-wrap{border-radius:16px;overflow:hidden;background:var(--soft);
  box-shadow:0 18px 44px rgba(10,31,61,0.12),0 2px 8px rgba(10,31,61,0.06)}
.hero-video{display:block;width:100%;height:auto}
@media(max-width:900px){
  .phone-section-grid{grid-template-columns:1fr}
  .hero-video-wrap{margin-top:28px}
}

/* FEATURE CATEGORIES */
.feat-cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.feat-cat{background:#fff;border:1px solid var(--divider);border-radius:14px;padding:22px 20px}
.feat-cat-label{font-family:var(--font-d);font-size:14px;font-weight:700;color:var(--text);margin-bottom:12px}
.feat-chips{display:flex;flex-wrap:wrap;gap:8px}
.feat-chips span{display:inline-block;background:rgba(2,176,245,0.08);color:var(--primary);border:1px solid rgba(2,176,245,0.2);border-radius:100px;padding:6px 12px;font-size:12px;font-weight:500}

.phone-feed{margin-top:auto;display:flex;flex-direction:column;gap:6px}
.phone-feed-row{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--divider);border-radius:9px;padding:8px 9px;box-shadow:0 1px 3px rgba(10,31,61,0.04)}
.phone-feed-dot{width:7px;height:7px;border-radius:50%;background:var(--highlight);flex-shrink:0}
.phone-feed-dot.is-navy{background:var(--primary);opacity:.45}
.phone-feed-text{font-size:8.5px;color:var(--text);line-height:1.3}
.phone-feed-text b{font-weight:700}
.phone-feed-time{margin-left:auto;font-size:7.5px;color:var(--muted);flex-shrink:0}

/* AI STAFF — persona cards on dark band */
.light-lead{color:rgba(255,255,255,0.72);max-width:640px;margin:12px auto 0}
.ai-staff-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:rgba(255,255,255,0.07);border-radius:var(--radius-lg);overflow:hidden;margin-top:32px}
.ai-staff{grid-column:span 2}
.ai-staff:nth-child(4){grid-column:2 / span 2}
.ai-staff:nth-child(5){grid-column:4 / span 2}
.ai-staff{background:rgba(255,255,255,0.03);padding:32px 28px;transition:background .22s}
.ai-staff:hover{background:rgba(255,255,255,0.07)}
.ai-staff-icon{width:40px;height:40px;border-radius:10px;background:rgba(2,176,245,0.1);border:1px solid rgba(2,176,245,0.2);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.ai-staff-role{font-family:var(--font-d);font-size:10px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--highlight);margin-bottom:6px}
.ai-staff h3{font-size:17px;font-weight:700;color:#fff;margin-bottom:10px;line-height:1.3}
.ai-staff p{font-size:13.5px;color:rgba(255,255,255,0.72);line-height:1.7}
@media(max-width:900px){
  .ai-staff-grid{grid-template-columns:repeat(2,1fr)}
  .ai-staff,.ai-staff:nth-child(4){grid-column:auto}
  .ai-staff:nth-child(5){grid-column:1 / -1}
  .ai-staff{padding:26px 22px}
}
@media(max-width:640px){
  .ai-staff-grid{grid-template-columns:1fr}
  .ai-staff,.ai-staff:nth-child(4),.ai-staff:nth-child(5){grid-column:auto}
}

/* NUM FEATS — restored for the value-prop section */
.num-feat{display:grid;grid-template-columns:72px 1fr;gap:24px;align-items:start;padding:32px 0;border-bottom:1px solid var(--divider)}
.num-feat:last-child{border-bottom:none}
.num-feat-n{font-family:var(--font-d);font-size:42px;font-weight:900;color:rgba(2,176,245,0.18);letter-spacing:-0.05em;line-height:1;transition:color .3s cubic-bezier(0.4,0,0.2,1)}
.num-feat:hover .num-feat-n{color:rgba(2,176,245,0.75)}
.num-feat-body h3{font-size:19px;margin-bottom:8px}
.num-feat-body p{color:var(--muted);line-height:1.7}
@media(max-width:640px){.num-feat{grid-template-columns:1fr;gap:8px}.num-feat-n{font-size:32px}}

/* HERO ILLUSTRATION — original brand collage */
.os-illo{width:100%;max-width:520px}
.os-illo svg{display:block;width:100%;height:auto;overflow:visible}
@media (prefers-reduced-motion: no-preference){
  .illo-chip{animation:illoFloat 4s ease-in-out infinite}
  @keyframes illoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
  .illo-link path{animation:illoFlow 1.6s linear infinite}
  @keyframes illoFlow{to{stroke-dashoffset:-18}}
  .illo-trend{stroke-dasharray:420;stroke-dashoffset:420;animation:illoDraw 3s ease-out infinite}
  @keyframes illoDraw{0%{stroke-dashoffset:420}45%,100%{stroke-dashoffset:0}}
  .illo-dot{animation:illoPulse 3s ease-out infinite}
  @keyframes illoPulse{0%,40%{opacity:0;r:5}55%{opacity:1;r:5}70%{opacity:.5;r:9}100%{opacity:1;r:5}}
  .illo-msg{animation:illoMsg 3.6s ease-in-out infinite}
  @keyframes illoMsg{0%,10%{opacity:0;transform:translateX(-4px)}25%,90%{opacity:1;transform:translateX(0)}100%{opacity:1}}
  .illo-bars rect{transform-origin:center bottom;animation:illoGrow 3.2s ease-out infinite}
  .illo-bars rect:nth-child(2){animation-delay:.15s}
  .illo-bars rect:nth-child(3){animation-delay:.3s}
  .illo-bars rect:nth-child(4){animation-delay:.45s}
  @keyframes illoGrow{0%,15%{transform:scaleY(.2)}45%,100%{transform:scaleY(1)}}
}
@media(max-width:900px){.os-illo{max-width:440px;margin:24px auto 0}}

.ai-staff-grid{gap:16px;background:transparent;overflow:visible}
.ai-staff{background:var(--soft);border:1px solid var(--divider);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}
.ai-staff:hover{background:var(--white)}
.ai-staff h3{color:var(--primary)}
.ai-staff p{color:var(--body-text)}
.ai-staff .ai-staff-role{color:#1A69B4}
.ai-staff-icon{background:#e6f2fa;border-color:#b6d5eb}.ai-staff-icon svg{stroke:#1A69B4}
