/* HERO */
.hero{background:var(--night);padding:5.5rem 0 0;overflow:hidden}
.hero-inner{max-width:var(--max);margin:0 auto;padding:0 0 0 2.5rem;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(47,74,199,0.25);border:1px solid rgba(47,74,199,0.4);border-radius:999px;padding:5px 14px;font-size:0.72rem;font-weight:500;color:rgba(255,255,255,0.8);letter-spacing:0.04em;margin-bottom:1.5rem;opacity:0;animation:riseIn 0.5s ease 0.05s forwards}
.hero-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--blue-2)}
.hero h1{font-size:clamp(2.6rem,4vw,4.4rem);color:#ffffff;margin-bottom:1.5rem;opacity:0;animation:riseIn 0.6s ease 0.15s forwards}
.hero h1 em{font-style:italic;color:var(--blue-2)}
.hero-sub{font-size:1.05rem;color:rgba(255,255,255,0.65);line-height:1.8;max-width:460px;margin-bottom:2rem;opacity:0;animation:riseIn 0.6s ease 0.25s forwards}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;padding-bottom:4rem;opacity:0;animation:riseIn 0.6s ease 0.35s forwards}

/* Hero right — workflow visual */
.hero-visual{opacity:0;animation:riseIn 0.7s ease 0.2s forwards;align-self:end}
.workflow-card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.10);border-radius:var(--r-lg) var(--r-lg) 0 0;overflow:hidden}
.workflow-header{background:rgba(255,255,255,0.06);border-bottom:1px solid rgba(255,255,255,0.08);padding:1rem 1.5rem;display:flex;align-items:center;justify-content:space-between}
.workflow-title{font-size:0.78rem;font-weight:500;color:rgba(255,255,255,0.6);letter-spacing:0.04em}
.workflow-status{font-size:0.65rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:rgba(26,102,71,0.3);color:#6ee7b7;border:1px solid rgba(110,231,183,0.2)}
.workflow-steps{padding:1.25rem 1.5rem;display:flex;flex-direction:column;gap:2px}
.wf-step{display:flex;align-items:center;gap:0.85rem;padding:0.75rem 1rem;border-radius:var(--r);transition:background 0.15s}
.wf-step.done{background:rgba(255,255,255,0.03)}
.wf-step.active{background:rgba(47,74,199,0.2);border:1px solid rgba(47,74,199,0.3)}
.wf-step.pending{opacity:0.45}
.wf-icon{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.75rem;flex-shrink:0}
.wf-icon.done{background:rgba(26,102,71,0.4);color:#6ee7b7}
.wf-icon.active{background:rgba(47,74,199,0.5);color:#93b4ff}
.wf-icon.pending{background:rgba(255,255,255,0.06);color:rgba(255,255,255,0.3)}
.wf-label{font-size:0.82rem;color:rgba(255,255,255,0.75);font-weight:500}
.wf-sub{font-size:0.7rem;color:rgba(255,255,255,0.35);margin-top:1px}
.wf-badge{margin-left:auto;font-size:0.62rem;padding:2px 8px;border-radius:999px;font-weight:500;white-space:nowrap}
.wf-badge.done{background:rgba(26,102,71,0.3);color:#6ee7b7}
.wf-badge.active{background:rgba(47,74,199,0.4);color:#93b4ff}
.wf-badge.pending{background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.3)}

/* INDUSTRIES STRIP */
.industries-strip{background:var(--paper-2);border-bottom:1px solid var(--paper-3);padding:1.5rem 0}
.industries-strip-inner{max-width:var(--max);margin:0 auto;padding:0 2.5rem;display:flex;align-items:center;gap:0}
.industries-label{font-size:0.7rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap;margin-right:2rem}
.industries-list{display:flex;gap:0;flex-wrap:nowrap;flex:1;overflow:hidden}
.industry-tag{font-size:0.82rem;color:var(--ink-2);padding:0.3rem 1.25rem;border-left:1px solid var(--paper-3)}
.industry-tag:last-child{border-right:1px solid var(--paper-3)}

/* PROBLEM */

/* FEATURES */
.features{padding:6rem 0}
.features-header{text-align:center;max-width:680px;margin:0 auto 4rem}
.features-header h2{font-size:clamp(2rem,3vw,2.8rem);margin-bottom:1rem}
.features-header h2 em{font-style:italic;color:var(--blue)}
.features-header p{font-size:1rem;color:var(--ink-2);line-height:1.8}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.feature-card{border:1px solid var(--paper-3);border-radius:var(--r-lg);padding:2rem;background:var(--paper-2);transition:all 0.2s}
.feature-card:hover{background:var(--paper);box-shadow:0 8px 28px rgba(47,74,199,0.08);border-color:var(--blue)}
.feature-icon{width:44px;height:44px;border-radius:var(--r);background:var(--blue-pale);display:flex;align-items:center;justify-content:center;font-size:1.1rem;margin-bottom:1.25rem}
.feature-card h3{font-family:var(--serif);font-weight:700;font-size:1.05rem;color:var(--heading);margin-bottom:0.6rem}
.feature-card p{font-size:0.85rem;color:var(--ink-2);line-height:1.7}

/* WORKFLOW SECTION */
.workflow{background:var(--paper-2);padding:6rem 0}
.workflow-section-header{text-align:center;max-width:640px;margin:0 auto 4rem}
.workflow-section-header h2{font-size:clamp(2rem,3vw,2.8rem);margin-bottom:1rem}
.workflow-section-header h2 em{font-style:italic;color:var(--blue)}
.workflow-section-header p{font-size:1rem;color:var(--ink-2);line-height:1.8}
.workflow-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--paper-3);border-radius:var(--r-lg);overflow:hidden;margin-bottom:3rem}
.wt-step{background:var(--paper);padding:2rem 1.5rem}
.wt-num{font-family:var(--serif);font-size:2.5rem;font-weight:900;color:var(--blue-pale);line-height:1;margin-bottom:1.25rem}
.wt-title{font-size:0.88rem;font-weight:600;color:var(--heading);margin-bottom:0.5rem}

/* INDUSTRIES */
.industries{padding:6rem 0}
.industries-header{text-align:center;max-width:640px;margin:0 auto 3.5rem}
.industries-header h2{font-size:clamp(2rem,3vw,2.8rem);margin-bottom:1rem}
.industries-header h2 em{font-style:italic;color:var(--blue)}
.industries-header p{font-size:1rem;color:var(--ink-2);line-height:1.8}
.industry-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.industry-card{border:1px solid var(--paper-3);border-radius:var(--r-lg);padding:2rem 1.5rem;background:var(--paper);transition:all 0.2s}
.industry-card:hover{border-color:var(--blue);box-shadow:0 6px 20px rgba(47,74,199,0.07);transform:translateY(-2px)}
.industry-card-icon{font-size:1.75rem;margin-bottom:1rem}
.industry-card h3{font-family:var(--serif);font-weight:700;font-size:0.95rem;color:var(--heading);margin-bottom:0.4rem}
.industry-card p{font-size:0.78rem;color:var(--ink-3);line-height:1.6}
.industry-card-reqs{margin-top:0.85rem;display:flex;flex-wrap:wrap;gap:5px}
.req-chip{font-size:0.65rem;padding:2px 8px;border-radius:999px;background:var(--blue-pale);color:var(--blue);font-weight:500}

/* COMPLIANCE NOTE */
.compliance-note{background:var(--amber-pale);border:1px solid rgba(160,92,0,0.2);border-radius:var(--r-lg);padding:1.5rem 2rem;display:flex;gap:1rem;align-items:flex-start;margin-top:2rem}
.compliance-note-icon{font-size:1.25rem;flex-shrink:0;margin-top:2px}
.compliance-note-text{font-size:0.85rem;color:var(--amber);line-height:1.7}
.compliance-note-text strong{font-weight:600}

/* HOW WE ENGAGE */
.engage{background:var(--night);padding:6rem 0}

.engage-layout{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:start}
.engage-layout h2{font-size:clamp(2rem,3vw,2.8rem);color:#ffffff;margin-bottom:1.25rem}
.engage-layout h2 em{font-style:italic;color:var(--ink-2)}
.engage-intro{font-size:1rem;color:rgba(255,255,255,0.65);line-height:1.8;margin-bottom:2rem}
.engage-steps{display:flex;flex-direction:column;gap:12px}
.engage-step{border:1px solid rgba(255,255,255,0.10);border-radius:var(--r-lg);padding:1.75rem 2rem;background:rgba(255,255,255,0.04);display:grid;grid-template-columns:40px 1fr;gap:1rem;align-items:start}
.engage-num{font-family:var(--serif);font-size:2rem;font-weight:900;color:rgba(255,255,255,0.22);line-height:1}
.engage-title{font-size:0.9rem;font-weight:600;color:#fff;margin-bottom:0.4rem}
.engage-body{font-size:0.85rem;color:rgba(255,255,255,0.60);line-height:1.75}

/* ANIMATIONS */
to{opacity:1;transform:translateY(0)}}

/* RESPONSIVE */
@media(max-width:900px){

  .hero-inner{grid-template-columns:1fr;padding:0 1.5rem}.hero-visual{display:none}
  .problem-layout,.engage-layout{grid-template-columns:1fr;gap:2.5rem}
  .feature-grid{grid-template-columns:1fr 1fr}
  .workflow-timeline{grid-template-columns:1fr 1fr}
  .industry-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:600px){
  .feature-grid,.industry-grid,.workflow-timeline{grid-template-columns:1fr}
}