/* =============================
    Design Tokens & Base Styles
    ============================= */
* {margin:0;padding:0;box-sizing:border-box;}

:root {
  --bg:#1a1a1a;
  --bg-alt:#2a2a2a;
  --bg-accent:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);
  --text:#e5e5e5;
  --text-soft:#9ca3af;
  --border:#3a3a3a;
  --grad:linear-gradient(135deg,#3b82f6 0%,#1d4ed8 100%);
  --radius-xs:4px;
  --radius-sm:8px;
  --radius:12px;
  --radius-lg:16px;
  --shadow-sm:0 4px 14px -4px rgba(0,0,0,.75);
  --shadow:0 24px 48px -12px rgba(0,0,0,.85);
  --focus-ring:0 0 0 3px rgba(59,130,246,.45);
  color-scheme:dark;
}



html {scroll-behavior:smooth;}
body {font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}

/* Utility */
.visually-hidden {position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap;}

/* =============================
    Hero
    ============================= */
.hero {padding:80px 2rem 80px;min-height:100vh;display:flex;align-items:center;background:var(--bg-accent);}
.hero{position:relative;overflow:hidden;}
/* Aurora background and grid overlay */
.hero::before{content:"";position:absolute;inset:-20%;background:
  radial-gradient(60% 60% at 10% 10%, rgba(59,130,246,.25) 0%, rgba(59,130,246,0) 60%),
  radial-gradient(55% 55% at 90% 20%, rgba(29,78,216,.25) 0%, rgba(29,78,216,0) 60%),
  radial-gradient(50% 50% at 50% 110%, rgba(59,130,246,.18) 0%, rgba(59,130,246,0) 60%);
  filter: blur(40px) saturate(120%);
  z-index:0;pointer-events:none;}
.hero::after{content:"";position:absolute;inset:0;background:
  linear-gradient(to bottom, rgba(255,255,255,.08), rgba(255,255,255,0) 30%),
  repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, transparent 1px 80px),
  repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 80px);
  opacity:.35;mix-blend-mode:overlay;z-index:0;pointer-events:none;}
.hero > .hero-container{position:relative;z-index:1;}
.hero-container {max-width:800px;margin:0 auto;text-align:center;}
.hero-title {font-size:clamp(2.25rem,5vw,3.6rem);font-weight:700;line-height:1.12;margin:0 0 1.4rem;background:linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-0.025em;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Roboto',sans-serif;}
.hero-subtitle {font-size:1.1rem;color:var(--text-soft);margin:0 0 2.25rem;max-width:none;line-height:1.6;}
.hero-subtitle strong {color:#3b82f6;font-weight:600;}
.hero-actions {display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;}
.primary-btn {background:var(--grad);color:#fff;border:none;padding:1rem 2rem;border-radius:var(--radius);font-size:1.05rem;font-weight:600;cursor:pointer;transition:transform .25s,box-shadow .25s;box-shadow:0 12px 24px -10px rgba(59,130,246,.55);} 
.primary-btn:hover {transform:translateY(-3px);} 
.primary-btn:focus-visible {outline:none;box-shadow:var(--focus-ring);} 
.secondary-btn {background:transparent;color:#3b82f6;border:2px solid #3b82f6;padding:1rem 2rem;border-radius:var(--radius);font-size:1.05rem;font-weight:600;cursor:pointer;transition:all .25s;} 
.secondary-btn:hover {background:#3b82f6;color:#fff;transform:translateY(-2px);} 

/* =============================
    Features
    ============================= */
.features {padding:80px 2rem;background:var(--bg);} 
.features-container {max-width:1200px;margin:0 auto;}
.section-title {font-size:2.35rem;font-weight:700;text-align:center;margin:0 0 2.75rem;color:var(--text);letter-spacing:-.5px;}
.features-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;}
.feature-card {background:var(--bg-alt);padding:2rem;border-radius:var(--radius-lg);text-align:center;transition:transform .35s,box-shadow .35s,border-color .35s;position:relative;border:1px solid var(--border);} 
.feature-card:hover {transform:translateY(-6px);box-shadow:0 18px 36px -12px rgba(0,0,0,.45);}
.feature-icon {width:60px;height:60px;background:var(--grad);border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem;color:#fff;box-shadow:0 8px 18px -8px rgba(102,126,234,.6);}
.feature-title {font-size:1.45rem;font-weight:600;margin:0 0 1rem;color:var(--text);} 
.feature-description {color:var(--text-soft);line-height:1.55;}

/* =============================
    Models
    ============================= */
.models {padding:80px 2rem;background:var(--bg-alt);}
.models-container {max-width:1200px;margin:0 auto;}
.models-grid {display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:2rem;}
.model-card {background:var(--bg);padding:2rem;border-radius:var(--radius-lg);border:1px solid var(--border);transition:transform .35s,box-shadow .35s;} 
.model-card:hover {transform:translateY(-6px);box-shadow:0 18px 36px -12px rgba(0,0,0,.48);}
.model-header {display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;}
.model-name {font-size:1.45rem;font-weight:600;color:var(--text);} 
.model-badge {padding:.28rem .75rem;border-radius:20px;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.75px;}
.model-badge.reasoning {background:#1e3a8a;color:#93c5fd;}
.model-badge.conversation {background:#581c87;color:#d8b4fe;}
.model-badge.latest {background:#166534;color:#86efac;}
.model-description {color:var(--text-soft);margin:0 0 1.5rem;line-height:1.55;}
.model-features {list-style:none;margin:0;padding:0;}
.model-features li {padding:.5rem 0;color:var(--text-soft);position:relative;padding-left:1.5rem;}
.model-features li:before {content:"✓";position:absolute;left:0;color:#4caf50;font-weight:700;}

/* =============================
    CTA Section
    ============================= */
.cta {padding:80px 2rem;background:var(--grad);text-align:center;}
.cta-container {max-width:800px;margin:0 auto;}
.cta-title {font-size:2.5rem;font-weight:700;color:#fff;margin:0 0 1rem;}
.cta-subtitle {font-size:1.22rem;color:rgba(255,255,255,.9);margin:0 0 2.1rem;}
.cta-btn {background:#fff;color:#667eea;border:none;padding:1rem 2rem;border-radius:var(--radius);font-size:1.05rem;font-weight:600;cursor:pointer;transition:transform .25s,box-shadow .25s;} 
.cta-btn:hover {transform:translateY(-3px);} 
.cta-btn:focus-visible {outline:none;box-shadow:var(--focus-ring);} 

/* =============================
    Footer
    ============================= */
.footer {background:#050505;color:#fff;padding:3rem 2rem 1rem;}
.footer-container {max-width:1200px;margin:0 auto;}
.footer-content {display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-bottom:2rem;}
.footer-logo .logo-text {font-size:1.5rem;font-weight:700;background:var(--grad);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.footer-description {color:#bbb;margin-top:1rem;max-width:48ch;}
.footer-links {display:grid;grid-template-columns:1fr 1fr;gap:2rem;}
.footer-title {font-size:1.05rem;font-weight:600;margin:0 0 1rem;color:#fff;}
.footer-link {display:block;color:#bbb;text-decoration:none;margin-bottom:.55rem;transition:color .2s;}
.footer-link:hover {color:#fff;}
.footer-bottom {border-top:1px solid #333;padding-top:2rem;text-align:center;}
.footer-bottom small {color:#888;}

/* =============================
    Responsive
    ============================= */
@media (max-width: 900px){
  .hero-container {grid-template-columns:1fr;gap:3rem;text-align:center;}
  .chat-window {margin:0 auto;}
}
@media (max-width: 768px){
  .nav-container {padding:0 1rem;}
  .nav-links {display:none;}
  .hero-title {font-size:2.55rem;}
  .features-grid,.models-grid {grid-template-columns:1fr;}
  .footer-content {grid-template-columns:1fr;}
  .footer-links {grid-template-columns:1fr;}
}

/* =============================
    Reduced Motion
    ============================= */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after {animation-duration:.01ms !important;animation-iteration-count:1 !important;transition:none !important;scroll-behavior:auto !important;}
}
