/* =========================================================
   FUTURE AI EDUCATION — futureaieducation.com
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600&display=swap');

:root {
  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.875rem);
  --text-sm:   clamp(0.875rem, 0.8rem  + 0.35vw, 1rem);
  --text-base: clamp(1rem,     0.95rem + 0.25vw, 1.125rem);
  --text-lg:   clamp(1.125rem, 1rem    + 0.75vw, 1.5rem);
  --text-xl:   clamp(1.5rem,   1.2rem  + 1.25vw, 2.25rem);
  --text-2xl:  clamp(2rem,     1.2rem  + 2.5vw,  3.5rem);
  --text-3xl:  clamp(2.5rem,   1rem    + 4vw,    5rem);

  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem;
  --space-4: 1rem;   --space-5: 1.25rem; --space-6: 1.5rem;
  --space-8: 2rem;   --space-10: 2.5rem; --space-12: 3rem;
  --space-16: 4rem;  --space-20: 5rem;   --space-24: 6rem;

  --font-display: 'Space Grotesk', 'Helvetica Neue', sans-serif;
  --font-body: 'Inter', 'Helvetica Neue', sans-serif;

  --radius-sm:.375rem; --radius-md:.5rem; --radius-lg:.75rem;
  --radius-xl:1rem; --radius-2xl:1.5rem; --radius-full:9999px;
  --transition: 180ms cubic-bezier(0.16,1,0.3,1);
  --content-narrow:640px; --content-default:960px; --content-wide:1200px;

  --color-bg:           #0a0a14;
  --color-surface:      #0f0f22;
  --color-surface-2:    #141428;
  --color-surface-off:  #1a1a32;
  --color-border:       #2a2a48;
  --color-text:         #e8e6f0;
  --color-text-muted:   #8b87a8;
  --color-text-faint:   #4a4868;
  --color-primary:      #7c3aed;
  --color-primary-hover:#6d28d9;
  --color-primary-light:#a78bfa;
  --color-primary-glow: rgba(124,58,237,.25);
  --color-accent:       #06b6d4;
  --color-gold:         #f59e0b;
  --shadow-glow: 0 0 40px rgba(124,58,237,.2);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:80px;}
body{min-height:100dvh;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg);overflow-x:hidden;}
img,svg{display:block;max-width:100%;height:auto;}
ul[role="list"],ol[role="list"]{list-style:none;}
input,button,textarea,select{font:inherit;color:inherit;}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);text-wrap:balance;line-height:1.15;}
p,li{text-wrap:pretty;}
button{cursor:pointer;background:none;border:none;}
a{color:inherit;text-decoration:none;}

.bg-grid{position:fixed;inset:0;z-index:-1;background-image:linear-gradient(rgba(124,58,237,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(124,58,237,.04) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,black 30%,transparent 100%);}
.bg-orb{position:fixed;border-radius:50%;filter:blur(80px);pointer-events:none;z-index:-1;}
.bg-orb-1{width:500px;height:500px;background:radial-gradient(circle,rgba(124,58,237,.15) 0%,transparent 70%);top:-150px;right:-80px;}
.bg-orb-2{width:350px;height:350px;background:radial-gradient(circle,rgba(6,182,212,.1) 0%,transparent 70%);bottom:25%;left:-80px;}

/* NAV */
.nav{position:sticky;top:0;z-index:100;padding:var(--space-4) var(--space-6);background:rgba(10,10,20,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);}
.nav-logo{display:flex;align-items:center;gap:var(--space-3);}
.nav-logo-text{font-family:var(--font-display);font-size:var(--text-base);font-weight:700;letter-spacing:-.02em;}
.nav-logo-text span{color:var(--color-primary-light);}
.nav-links{display:flex;align-items:center;gap:var(--space-6);list-style:none;}
.nav-links a{font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted);transition:color var(--transition);}
.nav-links a:hover{color:var(--color-text);}
.nav-cta{padding:var(--space-2) var(--space-5);background:var(--color-primary);color:white!important;border-radius:var(--radius-full);font-weight:600;font-size:var(--text-sm);transition:background var(--transition);}
.nav-cta:hover{background:var(--color-primary-hover)!important;}
.nav-hamburger{display:none;padding:var(--space-2);}

/* COMING SOON RIBBON */
.coming-soon-ribbon{background:linear-gradient(90deg,var(--color-primary),#5b21b6,var(--color-accent),var(--color-primary));background-size:300% 100%;animation:ribbonShift 4s ease infinite;padding:var(--space-2) var(--space-6);text-align:center;}
@keyframes ribbonShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.ribbon-inner{font-size:var(--text-xs);font-weight:700;color:white;letter-spacing:.04em;display:flex;align-items:center;justify-content:center;gap:var(--space-4);}
.ribbon-dot{width:5px;height:5px;background:rgba(255,255,255,.6);border-radius:50%;flex-shrink:0;}

/* EDU HERO */
.edu-hero{padding:var(--space-16) var(--space-6) var(--space-12);}
.edu-hero-inner{max-width:800px;margin:0 auto;text-align:center;}
.edu-hero-badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-5);background:rgba(124,58,237,.12);border:1px solid rgba(124,58,237,.25);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;color:var(--color-primary-light);letter-spacing:.08em;text-transform:uppercase;margin-bottom:var(--space-6);}
.edu-hero-title{font-size:var(--text-3xl);font-weight:700;letter-spacing:-.03em;line-height:1.05;margin-bottom:var(--space-6);}
.grad{background:linear-gradient(135deg,var(--color-primary-light),var(--color-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.edu-hero-sub{font-size:var(--text-lg);color:var(--color-text-muted);line-height:1.7;max-width:640px;margin:0 auto var(--space-10);}
.edu-hero-actions{display:flex;gap:var(--space-4);justify-content:center;flex-wrap:wrap;margin-bottom:var(--space-12);}
.edu-hero-stats{display:flex;gap:var(--space-10);justify-content:center;flex-wrap:wrap;padding-top:var(--space-8);border-top:1px solid var(--color-border);}
.edu-stat{text-align:center;}
.edu-stat-num{font-family:var(--font-display);font-size:var(--text-xl);font-weight:700;color:var(--color-primary-light);letter-spacing:-.02em;line-height:1;}
.edu-stat-label{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1);text-transform:uppercase;letter-spacing:.06em;}

/* SECTIONS */
.section-inner{max-width:var(--content-wide);margin:0 auto;}
.section-header{margin-bottom:var(--space-12);}
.section-tag{display:inline-block;font-size:var(--text-xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-primary-light);margin-bottom:var(--space-4);}
.section-title{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-bottom:var(--space-4);}
.section-sub{font-size:var(--text-base);color:var(--color-text-muted);max-width:600px;line-height:1.7;}

/* FOR SECTION */
.for-section{padding:clamp(var(--space-12),6vw,var(--space-24)) var(--space-6);background:var(--color-surface);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);}
.for-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);}
.for-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-6);transition:transform var(--transition),border-color var(--transition);}
.for-card:hover{transform:translateY(-3px);border-color:rgba(124,58,237,.3);}
.for-icon{font-size:1.75rem;margin-bottom:var(--space-4);}
.for-card h3{font-size:var(--text-base);font-weight:600;margin-bottom:var(--space-2);}
.for-card p{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.6;max-width:100%;}

/* COURSES */
.courses-section{padding:clamp(var(--space-12),6vw,var(--space-24)) var(--space-6);}
.courses-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-12);}
.course-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:var(--space-8);position:relative;transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);}
.course-card:hover{transform:translateY(-4px);border-color:rgba(124,58,237,.3);box-shadow:var(--shadow-glow);}
.coming-soon-card{border-style:dashed;opacity:.8;}
.course-status{position:absolute;top:-12px;left:var(--space-6);padding:var(--space-1) var(--space-4);background:var(--color-gold);color:#0a0a14;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:800;letter-spacing:.04em;white-space:nowrap;}
.course-icon{font-size:2rem;margin-bottom:var(--space-4);}
.course-card h3{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-3);}
.course-card p{font-size:var(--text-sm);color:var(--color-text-muted);line-height:1.7;max-width:100%;margin-bottom:var(--space-5);}
.course-details{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-5);}
.course-detail{padding:2px var(--space-3);background:rgba(124,58,237,.1);border:1px solid rgba(124,58,237,.2);border-radius:var(--radius-full);font-size:var(--text-xs);color:var(--color-primary-light);font-weight:500;}
.course-price{display:flex;align-items:center;gap:var(--space-3);}
.price-was{font-size:var(--text-sm);color:var(--color-text-faint);text-decoration:line-through;}
.price-now{font-size:var(--text-sm);font-weight:700;color:var(--color-gold);}

/* ABOUT */
.about-section{padding:clamp(var(--space-12),6vw,var(--space-24)) var(--space-6);background:var(--color-surface);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);}
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16);align-items:center;}
.about-text p{font-size:var(--text-base);color:var(--color-text-muted);line-height:1.8;margin-bottom:var(--space-4);max-width:100%;}
.about-creds{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-6);}
.cred{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted);}
.cred-icon{font-size:1rem;}
.about-card-big{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:var(--space-8);text-align:center;}
.about-avatar-large{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,var(--color-primary),var(--color-accent));display:flex;align-items:center;justify-content:center;font-size:1.75rem;font-weight:700;font-family:var(--font-display);color:white;margin:0 auto var(--space-6);}
.about-quote{font-size:var(--text-base);color:var(--color-text-muted);line-height:1.8;font-style:italic;margin-bottom:var(--space-4);max-width:100%;}
.about-quote-attr{font-size:var(--text-xs);color:var(--color-primary-light);font-weight:700;}

/* WAITLIST */
.waitlist-section{padding:clamp(var(--space-12),6vw,var(--space-24)) var(--space-6);}
.waitlist-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:var(--space-12);display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16);align-items:start;box-shadow:var(--shadow-glow);}
.waitlist-icon{font-size:2.5rem;margin-bottom:var(--space-4);}
.waitlist-left h2{font-size:var(--text-2xl);font-weight:700;letter-spacing:-.03em;margin-bottom:var(--space-4);}
.waitlist-left p{font-size:var(--text-base);color:var(--color-text-muted);line-height:1.7;margin-bottom:var(--space-6);max-width:100%;}
.waitlist-perks{list-style:none;display:flex;flex-direction:column;gap:var(--space-3);}
.waitlist-perks li{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm);color:var(--color-text-muted);}
.waitlist-perks li::before{content:'✓';color:var(--color-primary-light);font-weight:700;min-width:16px;}
.waitlist-right{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-8);}
.waitlist-form h3{font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-6);}
.wf-group{display:flex;flex-direction:column;gap:var(--space-2);margin-bottom:var(--space-4);}
.wf-group label{font-size:var(--text-xs);font-weight:700;color:var(--color-text-muted);letter-spacing:.04em;text-transform:uppercase;}
.wf-group input,.wf-group select,.wf-group textarea{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--color-text);outline:none;transition:border-color var(--transition);width:100%;}
.wf-group select option{background:var(--color-bg);}
.wf-group input:focus,.wf-group select:focus,.wf-group textarea:focus{border-color:var(--color-primary);}
.wf-group textarea{resize:vertical;}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:600;font-family:var(--font-display);transition:all var(--transition);cursor:pointer;border:none;white-space:nowrap;}
.btn-primary{background:var(--color-primary);color:white;box-shadow:0 0 20px var(--color-primary-glow);}
.btn-primary:hover{background:var(--color-primary-hover);transform:translateY(-2px);}
.btn-outline{background:transparent;color:var(--color-text);border:1px solid var(--color-border);}
.btn-outline:hover{border-color:var(--color-primary-light);color:var(--color-primary-light);transform:translateY(-2px);}
.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-base);}

/* FOOTER */
.footer{border-top:1px solid var(--color-border);padding:var(--space-10) var(--space-6);background:var(--color-surface);}
.footer-inner{max-width:var(--content-wide);margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-6);}
.footer-brand h3{font-size:var(--text-base);font-weight:700;margin-bottom:var(--space-1);}
.footer-brand p{font-size:var(--text-xs);color:var(--color-text-faint);max-width:320px;}
.footer-links{display:flex;gap:var(--space-6);flex-wrap:wrap;}
.footer-links a{font-size:var(--text-sm);color:var(--color-text-muted);transition:color var(--transition);}
.footer-links a:hover{color:var(--color-primary-light);}
.footer-bottom{max-width:var(--content-wide);margin:var(--space-6) auto 0;padding-top:var(--space-6);border-top:1px solid var(--color-border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4);}
.footer-bottom p{font-size:var(--text-xs);color:var(--color-text-faint);max-width:100%;}
.footer-bottom a{color:var(--color-primary-light);}

.fade-in{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease;}
.fade-in.visible{opacity:1;transform:translateY(0);}
.fade-in-delay-1{transition-delay:.1s;} .fade-in-delay-2{transition-delay:.2s;}

@media(max-width:1024px){
  .for-grid,.courses-grid{grid-template-columns:repeat(2,1fr);}
  .about-grid{grid-template-columns:1fr;gap:var(--space-10);}
  .waitlist-card{grid-template-columns:1fr;gap:var(--space-8);}
}
@media(max-width:768px){
  .nav-links{display:none;}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(10,10,20,.98);border-bottom:1px solid var(--color-border);padding:var(--space-6);gap:var(--space-4);}
  .nav-hamburger{display:flex;}
  .for-grid,.courses-grid{grid-template-columns:1fr;}
  .edu-hero-stats{gap:var(--space-6);}
  .footer-inner{flex-direction:column;}
  .footer-bottom{flex-direction:column;}
  .ribbon-inner{font-size:.65rem;}
}