
  /* ============ Base ============ */
  *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

  :root{
    --bg:#f6f8fc;
    --surface:#ffffff;
    --surface-soft:#eef3fa;
    --line:#e2e9f3;
    --line-strong:#cfdae9;
    --text:#12233d;
    --muted:#5f7289;
    --accent:#e8620d;
    --accent-soft:#fff2e8;
    --accent-line:#ffd9bd;
    --radius:16px;
    --shadow-sm:0 2px 10px -4px rgba(18,35,61,.08);
    --shadow:0 18px 44px -22px rgba(18,35,61,.22);
  }

  body{
    background:var(--bg);
    color:var(--text);
    font-family:"Inter","Segoe UI","Helvetica Neue",system-ui,-apple-system,sans-serif;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  /* soft top glow */
  body::before{
    content:"";
    position:fixed;top:-240px;left:50%;transform:translateX(-50%);
    width:880px;height:500px;z-index:0;pointer-events:none;
    background:radial-gradient(ellipse at center,rgba(232,98,13,.08),rgba(232,98,13,.02) 45%,transparent 70%);
  }

  .container{width:min(1080px,100% - 48px);margin-inline:auto;position:relative;z-index:1}

  h1,h2,h3{line-height:1.2;letter-spacing:-.02em;font-weight:700}

  /* ============ Hero ============ */
  .hero{
    padding:88px 0 24px;
    text-align:center;
  }
  .eyebrow{
    display:inline-block;font-size:.72rem;font-weight:700;
    letter-spacing:.16em;text-transform:uppercase;
    color:var(--accent);background:var(--accent-soft);
    border:1px solid var(--accent-line);
    padding:6px 14px;border-radius:999px;
  }
  .hero h1{
    font-size:clamp(1.9rem,4.4vw,2.9rem);
    margin:22px 0 18px;
  }
  .hero h1 span{color:var(--accent)}
  .hero p{
    color:var(--muted);
    font-size:1.02rem;
    max-width:620px;
    margin-inline:auto;
  }

  /* ============ Audience ============ */
  .audience{padding:56px 0 84px}

  .audience-label{
    text-align:center;
    font-size:.74rem;
    font-weight:700;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:#8a9bb2;
    margin-bottom:28px;
  }

  .aud-grid{
    display:grid;
    gap:16px;
    grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  }

  .aud-card{
    position:relative;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px 26px 26px;
    box-shadow:var(--shadow-sm);
    overflow:hidden;
    transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  }
  .aud-card::before{
    content:"";
    position:absolute;top:0;left:0;right:0;height:3px;
    background:linear-gradient(90deg,#ffa259,var(--accent));
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .35s ease;
  }
  .aud-card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow);
    border-color:var(--accent-line);
  }
  .aud-card:hover::before{transform:scaleX(1)}

  .aud-num{
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.12em;
    color:var(--accent);
    background:var(--accent-soft);
    border:1px solid var(--accent-line);
    width:34px;height:34px;
    border-radius:10px;
    display:grid;place-items:center;
    margin-bottom:18px;
  }

  .aud-card h3{
    font-size:1.06rem;
    margin-bottom:8px;
  }
  .aud-card p{
    font-size:.9rem;
    color:var(--muted);
  }

  /* ============ Closing line ============ */
  .closing{
    padding:0 0 96px;
    text-align:center;
  }
  .closing p{
    font-size:.94rem;
    color:var(--muted);
    max-width:560px;
    margin-inline:auto;
  }
  .closing strong{
    color:var(--text);
    font-weight:600;
  }

  /* ============ Responsive ============ */
  @media (max-width:620px){
    .container{width:min(1080px,100% - 36px)}
    .hero{padding:64px 0 18px}
    .audience{padding:44px 0 64px}
    .aud-card{padding:24px 22px}
  }
