:root{
    --bg:#FFFFFF;
    --line:#E7E5DF;
    --line-strong:#D6D3C9;
    --ink:#171C24;
    --ink-muted:#565C68;
    --ink-dim:#8B8F98;
    --flame:#E15A2A;
    --flame-dim:#C1481F;
    --blue:#1C5D8C;
    --font-display:'Space Grotesk', sans-serif;
    --font-body:'IBM Plex Sans', sans-serif;
    --font-mono:'IBM Plex Mono', monospace;
  }
  *{box-sizing:border-box;}
  html,body{ height:100%; }
  body{
    margin:0; background:var(--bg); color:var(--ink);
    font-family:var(--font-body); line-height:1.6;
    -webkit-font-smoothing:antialiased;
    display:flex; align-items:center; justify-content:center;
    padding:32px;
  }
  a{ color:inherit; text-decoration:none; }
  ::selection{ background:var(--flame); color:#fff; }

  .card{ max-width:520px; text-align:center; }

  .logo{
    display:inline-flex; align-items:center; gap:9px; justify-content:center;
    font-family:var(--font-display); font-weight:600; font-size:19px; margin-bottom:48px;
  }
  .logo-mark{ width:11px; height:11px; background:var(--flame); transform:rotate(45deg); flex:none; }
  .logo-text b{ font-weight:700; }

  .eyebrow{
    font-family:var(--font-mono); font-size:12px; letter-spacing:0.13em; text-transform:uppercase;
    color:var(--blue); display:inline-flex; align-items:center; gap:8px; margin-bottom:18px;
  }
  .eyebrow::before{ content:""; width:6px; height:6px; background:var(--flame); flex:none; border-radius:50%; animation:pulse 1.8s ease-in-out infinite; }
  @keyframes pulse{ 0%,100%{ opacity:1; } 50%{ opacity:0.25; } }
  @media (prefers-reduced-motion: reduce){ .eyebrow::before{ animation:none; } }

  h1{
    font-family:var(--font-display); font-weight:600; letter-spacing:-0.01em;
    font-size:clamp(28px,5vw,40px); line-height:1.15; margin:0 0 18px;
  }
  h1 .accent{ color:var(--flame); }

  p{ color:var(--ink-muted); font-size:16px; margin:0 0 36px; }

  .btn{
    display:inline-flex; align-items:center; gap:8px;
    font-family:var(--font-body); font-weight:600; font-size:14.5px;
    padding:12px 22px; border-radius:7px; background:var(--flame); color:#fff;
    transition:background .15s ease, transform .15s ease;
  }
  .btn:hover{ background:var(--flame-dim); transform:translateY(-1px); }

  footer{
    margin-top:56px; font-family:var(--font-mono); font-size:12px; color:var(--ink-dim);
  }

  .btn-trigger{ cursor:pointer; border:none; }

  .modal-overlay{
    position:fixed; inset:0; background:rgba(23,28,36,0.5);
    display:none; align-items:center; justify-content:center; padding:20px; z-index:100;
  }
  .modal-overlay.open{ display:flex; }
  .modal{
    background:#fff; border-radius:14px; max-width:440px; width:100%;
    padding:32px; position:relative; box-shadow:0 12px 40px rgba(0,0,0,0.18);
    text-align:left;
  }
  .modal h2{
    font-family:var(--font-display); font-weight:600; font-size:20px; margin:0 0 6px;
  }
  .modal p.modal-sub{ font-size:14px; color:var(--ink-muted); margin:0 0 22px; }
  .modal-close{
    position:absolute; top:18px; right:18px; background:none; border:none; cursor:pointer;
    font-size:20px; line-height:1; color:var(--ink-dim); padding:4px;
  }
  .modal-close:hover{ color:var(--ink); }
  .field{ margin-bottom:16px; }
  .field label{
    display:block; font-family:var(--font-mono); font-size:11.5px; color:var(--ink-muted);
    text-transform:uppercase; letter-spacing:0.06em; margin-bottom:6px;
  }
  .field input, .field textarea{
    width:100%; border:1px solid var(--line-strong); border-radius:7px; padding:10px 12px;
    font-family:var(--font-body); font-size:14.5px; color:var(--ink); resize:vertical;
  }
  .field input:focus, .field textarea:focus{ outline:2px solid var(--flame); outline-offset:1px; }
  .modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
  .btn-ghost{
    background:none; border:1px solid var(--line-strong); color:var(--ink);
    font-family:var(--font-body); font-weight:600; font-size:14px; padding:11px 18px;
    border-radius:7px; cursor:pointer;
  }
  .form-status{
    font-family:var(--font-mono); font-size:13px; margin-top:14px; display:none;
  }
  .form-status.show{ display:block; }
  .form-status.ok{ color:#27500A; }
  .form-status.err{ color:#B3261E; }
  .btn[disabled]{ opacity:0.6; cursor:not-allowed; }
  .hp-field{ position:absolute; left:-9999px; top:-9999px; }

  .success-banner{
    position:fixed; top:0; left:0; right:0; z-index:200;
    background:#EAF7E4; color:#27500A;
    font-family:var(--font-mono); font-size:13px; text-align:center;
    padding:12px 20px;
    transform:translateY(-100%); opacity:0;
    transition:transform .3s ease, opacity .3s ease;
  }
  .success-banner.show{ transform:translateY(0); opacity:1; }