:root{
    --navy:#0E1526;
    --navy-deep:#0A0F1E;
    --navy-soft:#1B2648;
    --blue:#3457FF;
    --blue-bright:#5C7BFF;
    --blue-dim:rgba(52,87,255,0.10);
    --warm-white:#FAF8F4;
    --warm-white-2:#F3F1EA;
    --warm-gray:#6E6A63;
    --hairline:#E6E2D8;
    --hairline-dark:rgba(255,255,255,0.10);

    --serif:'Fraunces', serif;
    --sans:'Inter', sans-serif;
    --mono:'JetBrains Mono', monospace;

    --ease:cubic-bezier(.4,0,.2,1);
    --container:1280px;
    --content:1200px;
    --pad-desktop:80px;
    --pad-tablet:48px;
    --pad-mobile:24px;

    --r-sm:8px;
    --r-md:14px;
    --r-lg:20px;
    --r-pill:100px;
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--warm-white);
    color:var(--navy);
    font-family:var(--sans);
    -webkit-font-smoothing:antialiased;
    line-height:1.5;
    position:relative;
  }
  img,svg{display:block;max-width:100%;}
  a{color:inherit;text-decoration:none;}
  button{font-family:inherit;cursor:pointer;border:none;background:none;}
  ul{margin:0;padding:0;list-style:none;}

  ::selection{background:var(--blue);color:#fff;}

  :focus-visible{
    outline:2px solid var(--blue);
    outline-offset:3px;
    border-radius:3px;
  }

  /* Grain overlay */
  .grain{
    position:fixed;
    inset:0;
    z-index:9999;
    pointer-events:none;
    opacity:0.035;
    mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  .container{
    max-width:var(--container);
    margin:0 auto;
    padding:0 var(--pad-desktop);
  }
  .inner{max-width:var(--content);margin:0 auto;}

  section{padding:130px 0;}

  .eyebrow{
    font-family:var(--mono);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.06em;
    color:var(--blue);
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:18px;
  }
  .eyebrow::before{
    content:'';
    width:14px;height:1px;
    background:var(--blue);
    display:inline-block;
  }
  .dark .eyebrow{color:var(--blue-bright);}

  h1,h2,h3{
    font-family:var(--serif);
    font-weight:600;
    margin:0;
    color:var(--navy);
  }
  .dark h1,.dark h2,.dark h3{color:var(--warm-white);}
  em{font-style:italic;color:var(--blue);}
  .dark em{color:var(--blue-bright);}

  h1{
    font-size:clamp(38px,4.6vw,62px);
    line-height:1.08;
    letter-spacing:-0.015em;
  }
  h2{
    font-size:clamp(30px,3.4vw,44px);
    line-height:1.15;
  }
  h3{font-size:20px;line-height:1.3;}

  p{margin:0;color:var(--warm-gray);}
  .dark p{color:rgba(250,248,244,0.68);}
  .lede{font-size:18px;line-height:1.65;}
  .card-copy{font-size:14.5px;line-height:1.65;}

  /* reveal animation */
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease), transform .7s var(--ease);}
  .reveal.in{opacity:1;transform:translateY(0);}

  @media (prefers-reduced-motion: reduce){
    .reveal{opacity:1!important;transform:none!important;transition:none!important;}
    *{animation:none!important;}
  }

  /* Buttons */
  .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:14px 26px;
    border-radius:var(--r-sm);
    font-size:15px;
    font-weight:600;
    transition:transform .25s var(--ease), background .25s var(--ease), box-shadow .25s var(--ease);
  }
  .btn-primary{
    background:var(--navy);
    color:var(--warm-white);
  }
  .btn-primary:hover{
    background:var(--blue);
    transform:translateY(-2px);
    box-shadow:0 12px 24px -8px rgba(52,87,255,0.45);
  }
  .btn-primary svg{transition:transform .25s var(--ease);}
  .btn-primary:hover svg{transform:translateX(3px);}
  .dark .btn-primary{background:var(--blue);color:#fff;}
  .dark .btn-primary:hover{background:var(--blue-bright);}

  .link-underline{
    position:relative;
    font-weight:600;
    font-size:15px;
    padding-bottom:2px;
  }
  .link-underline::after{
    content:'';
    position:absolute;
    left:0;bottom:0;
    width:100%;height:1px;
    background:currentColor;
    transform:scaleX(1);
    transform-origin:left;
  }
  .link-underline{border-bottom:1px solid transparent;}
  .link-underline::after{
    width:0%;
    transition:width .3s var(--ease);
  }
  .link-underline:hover::after{width:100%;}