:root{
    --accent: #22d3ee;
    --accent-2: #38bdf8;
    --glow: rgba(34,211,238,0.35);
  }
  *{ scroll-behavior: smooth; }
  body{
    background-color:#090d16;
    color:#e7edf5;
    font-family:'Inter',sans-serif;
    overflow-x:hidden;
  }
  h1,h2,h3,h4,.font-display{ font-family:'Space Grotesk',sans-serif; }
  .font-mono{ font-family:'JetBrains Mono',monospace; }

  /* subtle dot grid background */
  .bg-dots{
    background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px);
    background-size: 26px 26px;
  }

  .glass{
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.09);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .glow-text{
    text-shadow: 0 0 24px rgba(34,211,238,0.35);
  }

  .btn-glow{
    box-shadow: 0 0 0 1px rgba(34,211,238,0.4), 0 8px 30px -8px rgba(34,211,238,0.55);
  }
  .btn-glow:hover{
    box-shadow: 0 0 0 1px rgba(34,211,238,0.7), 0 8px 36px -6px rgba(34,211,238,0.75);
  }

  ::selection{ background: rgba(34,211,238,0.3); color:#fff; }

  /* scrollbar */
  ::-webkit-scrollbar{ width:10px; }
  ::-webkit-scrollbar-track{ background:#090d16; }
  ::-webkit-scrollbar-thumb{ background:#1c2536; border-radius:8px; }

  /* focus visibility for a11y */
  a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
    outline: 2px solid #22d3ee;
    outline-offset: 2px;
    border-radius: 4px;
  }

  @media (prefers-reduced-motion: reduce){
    *{ animation: none !important; transition: none !important; }
  }

  /* terminal caret */
  .caret{
    display:inline-block;
    width:8px;
    height:1.1em;
    background:#22d3ee;
    margin-left:2px;
    vertical-align:text-bottom;
    animation: blink 1s steps(1) infinite;
  }
  @keyframes blink{ 50%{ opacity:0; } }

  /* mesh glow blobs */
  .blob{
    position:absolute;
    border-radius:9999px;
    filter: blur(90px);
    opacity:0.35;
    pointer-events:none;
  }

  /* type-card radio style */
  .type-card{ transition: border-color .15s ease, background .15s ease, transform .15s ease; }
  .type-card[data-active="true"]{
    border-color: rgba(34,211,238,0.65);
    background: rgba(34,211,238,0.08);
  }
  .type-card:active{ transform: scale(0.99); }

  .addon-row[data-checked="true"]{
    border-color: rgba(34,211,238,0.5);
    background: rgba(34,211,238,0.06);
  }

  /* accordion */
  .faq-panel{
    max-height:0;
    overflow:hidden;
    transition: max-height .35s ease;
  }
  .faq-item[data-open="true"] .faq-chevron{ transform: rotate(180deg); }
  .faq-chevron{ transition: transform .25s ease; }

  /* portfolio modal */
  #portfolio-modal{
    transition: opacity .2s ease;
  }
  #portfolio-modal .modal-card{
    transition: transform .2s ease, opacity .2s ease;
  }

  .nav-link{ position:relative; }
  .nav-link::after{
    content:'';
    position:absolute; left:0; right:0; bottom:-4px;
    height:1px; background: var(--accent);
    transform: scaleX(0); transform-origin:left;
    transition: transform .2s ease;
  }
  .nav-link:hover::after{ transform: scaleX(1); }

  .mono-price{ font-variant-numeric: tabular-nums; }