/* Styles for projects/aeon/index.html */

*{margin:0;padding:0;box-sizing:border-box;}
:root{
  --bg:#06060e;
  --text:#e0e0e8;
  --text-dim:#7a7a8e;
  --accent:#00e5a0;
  --accent2:#00b4d8;
  --accent3:#7b61ff;
  --panel-bg:rgba(8,8,20,0.85);
  --panel-border:rgba(255,255,255,0.06);
  --glow-color:rgba(0,229,160,0.15);
}
html{scroll-behavior:smooth;}
body{background-color:var(--bg);color:var(--text);font-family:'Space Grotesk',sans-serif;line-height:1.6;overflow-x:hidden;}

.container{max-width:1200px;margin:0 auto;padding:0 2rem;}

h1,h2,h3,h4{font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-0.01em;}
h1{font-size:3.5rem;margin-bottom:0.5rem;background:linear-gradient(135deg,var(--accent) 0%,var(--accent2) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
h2{font-size:2rem;margin-bottom:2rem;color:var(--text);}
h3{font-size:1.25rem;margin-bottom:1rem;}
p{color:var(--text-dim);margin-bottom:1rem;font-weight:400;}

code,pre{font-family:'JetBrains Mono',monospace;background:rgba(0,0,0,0.3);padding:0.25rem 0.5rem;border-radius:0.25rem;font-size:0.9rem;}
pre{padding:1.5rem;margin:1.5rem 0;overflow-x:auto;border:1px solid var(--panel-border);border-radius:0.5rem;}

a{color:var(--accent);text-decoration:none;transition:color 0.2s;}
a:hover{color:var(--accent2);}

.panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:0.75rem;padding:2rem;backdrop-filter:blur(8px);transition:all 0.3s ease;}
.panel:hover{border-color:rgba(255,255,255,0.12);background:rgba(8,8,20,0.95);box-shadow:0 0 20px var(--glow-color);}

.badge{display:inline-block;padding:0.4rem 0.8rem;background:rgba(123,97,255,0.15);border:1px solid var(--accent3);border-radius:0.25rem;color:var(--accent3);font-size:0.75rem;font-weight:600;letter-spacing:0.05em;text-transform:uppercase;}
.badge.status{background:rgba(0,229,160,0.1);border-color:var(--accent);color:var(--accent);}

.hero{padding:6rem 0;text-align:center;}
.hero-title{font-size:4.5rem;font-weight:700;margin-bottom:0.5rem;background:linear-gradient(135deg,var(--accent) 0%,var(--accent2) 50%,var(--accent3) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-0.02em;}
.hero-subtitle{font-size:1.5rem;color:var(--text-dim);margin-bottom:1.5rem;font-weight:400;}
.hero-badges{display:flex;gap:1rem;justify-content:center;margin-bottom:3rem;flex-wrap:wrap;}
.hero-description{font-size:1.1rem;color:var(--text);max-width:700px;margin:0 auto 3rem;line-height:1.8;}

.section{margin-bottom:6rem;animation:fade-in 0.6s ease-out;}

.grid{display:grid;gap:2rem;margin-top:2rem;}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));}

.card{padding:1.5rem;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:0.5rem;backdrop-filter:blur(8px);transition:all 0.3s ease;position:relative;}
.card:hover{border-color:rgba(255,255,255,0.12);background:rgba(8,8,20,0.95);transform:translateY(-4px);box-shadow:0 8px 24px var(--glow-color);}
.card-number{position:absolute;top:1rem;right:1.5rem;font-size:2.5rem;font-weight:700;color:var(--accent3);opacity:0.3;}
.card h3{color:var(--text);margin-bottom:0.75rem;margin-top:0;}
.card p{margin-bottom:0;font-size:0.95rem;}

.core-loop{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:0.75rem;padding:3rem;backdrop-filter:blur(8px);margin:2rem 0;text-align:center;}
.core-loop-text{font-family:'JetBrains Mono',monospace;font-size:1.1rem;color:var(--accent);line-height:2.5;letter-spacing:0.05em;animation:pulse-glow 3s ease-in-out infinite;}
@keyframes pulse-glow{0%,100%{text-shadow:0 0 10px rgba(0,229,160,0.3);}50%{text-shadow:0 0 20px rgba(0,229,160,0.6);}}

.weapons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;margin-top:2rem;}
.weapon-card{position:relative;padding:2rem;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:0.5rem;backdrop-filter:blur(8px);transition:all 0.3s ease;display:flex;flex-direction:column;}
.weapon-card:hover{border-color:rgba(255,255,255,0.12);background:rgba(8,8,20,0.95);transform:translateY(-4px);box-shadow:0 12px 32px var(--glow-color);}
.weapon-badge{position:absolute;top:1rem;right:1rem;width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--accent) 0%,var(--accent2) 100%);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.25rem;color:var(--bg);}
.weapon-card h3{margin-top:0;padding-right:60px;}

.architecture{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:0.75rem;padding:2rem;backdrop-filter:blur(8px);margin:2rem 0;}
.arch-tree{font-family:'JetBrains Mono',monospace;font-size:0.9rem;line-height:1.8;color:var(--accent);white-space:pre;overflow-x:auto;padding:1.5rem;background:rgba(0,0,0,0.2);border-radius:0.5rem;border:1px solid var(--panel-border);}

.platforms{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-top:2rem;}
.platform-card{padding:2rem;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:0.5rem;backdrop-filter:blur(8px);transition:all 0.3s ease;}
.platform-card:hover{border-color:rgba(255,255,255,0.12);background:rgba(8,8,20,0.95);box-shadow:0 8px 24px var(--glow-color);}
.platform-card h3{color:var(--accent2);margin-bottom:1rem;}
.platform-card ul{list-style:none;}
.platform-card li{padding:0.5rem 0;color:var(--text-dim);padding-left:1.5rem;position:relative;}
.platform-card li:before{content:"▸";position:absolute;left:0;color:var(--accent);}

.tech-stack{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem;}
.chip{display:inline-block;padding:0.6rem 1.2rem;background:rgba(123,97,255,0.1);border:1px solid var(--accent3);border-radius:2rem;color:var(--accent3);font-size:0.85rem;font-weight:500;transition:all 0.3s ease;}
.chip:hover{background:rgba(123,97,255,0.2);border-color:var(--accent3);transform:translateY(-2px);}

.principles{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;margin-top:2rem;}
.principle{padding:1.5rem;background:linear-gradient(135deg,rgba(0,229,160,0.05) 0%,rgba(0,180,216,0.05) 100%);border:1px solid rgba(0,229,160,0.2);border-radius:0.5rem;text-align:center;}
.principle h4{color:var(--accent);margin-bottom:0.75rem;}
.principle p{margin:0;font-size:0.95rem;}

.footer{padding:3rem 0;border-top:1px solid var(--panel-border);text-align:center;margin-top:6rem;}

.back-link{display:inline-block;padding:0.6rem 1.2rem;background:rgba(0,229,160,0.1);border:1px solid var(--accent);border-radius:0.25rem;color:var(--accent);font-weight:500;transition:all 0.3s ease;margin-bottom:2rem;}
.back-link:hover{background:rgba(0,229,160,0.2);transform:translateX(-4px);}

/* Back link wrapper */
.back-link-wrapper{padding-top:2rem;}

/* Cycle caption below core-loop */
.cycle-caption{text-align:center;margin-top:1.5rem;color:var(--text);}

/* Multimodal core content inside core-loop */
.multimodal-content{color:var(--text);line-height:2;}
.multimodal-content strong{color:var(--accent);}
.multimodal-plus{font-size:1.1rem;color:var(--accent3);}

/* Current status */
.status-h3{margin-top:0;}
.status-list{color:var(--text-dim);margin-left:1.5rem;}

/* Footer note */
.footer-note{margin-top:2rem;color:var(--text-dim);}
.footer-note a{color:var(--accent);}

.skip-link{position:absolute;top:-40px;left:0;background:var(--accent,#64ffda);color:var(--bg,#0a0a0f);padding:10px 18px;z-index:1000;font-size:13px;font-weight:600;text-decoration:none;border-radius:0 0 6px 0;transition:top .2s}
.skip-link:focus{top:0;outline:2px solid var(--accent,#64ffda);outline-offset:2px}

@keyframes fade-in{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
@keyframes evolution-ring{0%{box-shadow:0 0 0 0 rgba(0,229,160,0.7);}70%{box-shadow:0 0 0 30px rgba(0,229,160,0);}100%{box-shadow:0 0 0 30px rgba(0,229,160,0);}}
.evolving{animation:evolution-ring 2s infinite;}

@media(max-width:768px){
  h1{font-size:2.5rem;}
  .hero-title{font-size:3rem;}
  .hero-subtitle{font-size:1.1rem;}
  h2{font-size:1.5rem;}
  .container{padding:0 1rem;}
  .hero{padding:3rem 0;}
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .weapons-grid{grid-template-columns:1fr;}
  .platforms{grid-template-columns:1fr;}
  .arch-tree{font-size:0.8rem;line-height:1.6;}
}