:root{
    --font-heading: 'Josefin Sans', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-body: 'Montserrat', system-ui, -apple-system, Segoe UI, Roboto, 'Helvetica Neue', Arial, sans-serif;
    --bg: #0b0b12;
    --bg-2: #12121b;
    --text: #f2f5f8;
    --muted: #b8c0cc;
    /* Accent palette aligned with the logo */
    /* Logo-aligned palette (soft periwinkle → lavender → pink-lavender) */
    --purple:   #9aa5ff;      /* periwinkle / bluish lavender */
    --lavender: #c7b9ff;      /* light lavender (body of the logo) */
    --pink:     #e6c6ff;      /* pink-leaning lavender */
    --accent-start: var(--purple);
    --accent-mid:   var(--lavender);
    --accent-end:   var(--pink);
    /* Neon glow fallback colors */
    --glow-1: rgba(199,185,255,.45);  /* lavender glow */
    --glow-2: rgba(154,165,255,.35);  /* periwinkle glow */
    --focus: #ff8bd1;
    --maxw: 1280px;
    --radius: 16px;
    --shadow-lg: 0 20px 50px rgba(0,0,0,.5);
    --shadow-md: 0 10px 30px rgba(0,0,0,.35);
  }
  
  /* Reset-ish */
  *,*::before,*::after{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    margin:0; font-family: var(--font-body);
    background: var(--bg);
    color:var(--text);
    line-height:1.6;
  }
  
  img{ max-width:100%; display:block; height:auto; }
  a{ color:inherit; text-decoration:none; }
  :focus-visible{ outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 6px; }
  
  /* Layout helpers */
  .container{ max-width: var(--maxw); margin-inline:auto; padding: clamp(16px, 2vw, 24px); }
  .center{ text-align:center; }
  .stack{ display:grid; gap: clamp(14px, 2vw, 18px); }
  .section{ padding: clamp(48px, 7vw, 96px) 0; }
  
  /* Neon gradient utilities */
  .neon-text, .h2{
    background: linear-gradient(90deg, var(--accent-start) 0%, var(--accent-mid) 45%, var(--accent-end) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
    text-shadow: 0 0 10px rgba(154,165,255,.28), 0 0 14px rgba(199,185,255,.28), 0 0 18px rgba(230,198,255,.24);
  }
  
  .btn{
    --padx: clamp(18px, 3vw, 28px);
    --pady: clamp(10px, 1.8vw, 14px);
    display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
    padding: var(--pady) var(--padx);
    font-weight: 700; letter-spacing: .3px; border: 0; border-radius: 999px; cursor:pointer;
    background: linear-gradient(135deg, var(--accent-start), var(--accent-end));
    color: #0b0b12; /* dark text for light gradient */
    box-shadow: 0 10px 30px rgba(154,165,255,.28), 0 6px 18px rgba(199,185,255,.25);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
  }
  .btn:hover{ transform: translateY(-2px); filter: brightness(1.03); background: linear-gradient(135deg, var(--accent-end), var(--accent-start)); box-shadow: 0 16px 40px rgba(154,165,255,.36), 0 8px 24px rgba(199,185,255,.32); }
  .btn:active{ transform: translateY(0); }
  
  /* Typography */
  h1, h2, h3, h4, h5, h6{ font-family: var(--font-heading); }
  h1{
    /* Larger headline scale */
    font-size: clamp(48px, 8.5vw, 92px);
    line-height: .95; margin: 0 0 .6rem 0; font-weight: 900; letter-spacing: .3px;
  }
  .subtitle{ font-size: clamp(18px, 2.4vw, 24px); color: var(--muted); margin: 0 0 1.2rem 0; }
  .eyebrow{ color: var(--muted); text-transform: uppercase; font-size: .9rem; letter-spacing: .18em; }
  .h2{ font-size: clamp(32px, 4.8vw, 52px); line-height:1.1; margin:.2rem 0 1rem; font-weight:800; }
  .lead{ font-size: clamp(20px, 2.4vw, 22px); color: var(--muted); }
  
  /* Generic card */
  .card{
    background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.02));
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
    padding: clamp(18px, 2.5vw, 26px);
  }
  
  /* Steps component */
  .steps{ display:grid; gap:16px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin-top: 12px; }
  .step{ position:relative; padding:20px; border-radius: 14px; background: rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.07); overflow:hidden; isolation:isolate; }
  .step b{ display:block; font-size:1.22rem; margin-bottom:.35rem; position:relative; z-index:1; }
  .step .step-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.24; filter:saturate(1.1) contrast(1.05); z-index:0; pointer-events:none; }
  .step::after{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.6)); z-index:0; }
  .step b, .step p{ position:relative; z-index:1; }
  
  /* Footer */
  footer{
    padding: 28px 0 48px; color: var(--muted); border-top: 1px solid rgba(255,255,255,.08);
    background: transparent;
  }
  .footer-inner{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
  
  /* Appear animations */
  @keyframes floatIn {
    from { opacity:0; transform: translateY(16px) scale(.98); }
    to   { opacity:1; transform: translateY(0) scale(1); }
  }
  .reveal{ opacity:0; transform: translateY(16px); }
  .reveal.in{ animation: floatIn .8s cubic-bezier(.2,.8,.2,1) forwards; }
  .delay-1{ animation-delay: .08s; } .delay-2{ animation-delay: .16s; } .delay-3{ animation-delay: .24s; }
  
  /* Reduced motion */
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior: auto; }
    .btn, .gallery img{ transition: none; }
    .reveal{ opacity:1; transform:none; animation:none; }
  }