.about-hero { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(3rem, 7vw, 7rem); align-items: center; min-height: 100vh; }
.about-hero .text-massive { font-size: clamp(3rem, 6.6vw, 6.4rem); }
.about-hero .hero-tagline, .lead, .section-intro { max-width: 46rem; margin-top: 1.5rem; color: var(--text-muted); font-size: clamp(1rem, 1.5vw, 1.2rem); }
.status-row, .about-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.status-pill, .status-tag { border: 1px solid var(--hairline); border-radius: 999px; padding: .45rem .8rem; color: #bcecf5; background: rgba(49,209,237,.07); font: 600 .7rem/1 var(--font-sans); }
.status-live i { display: inline-block; width: .45rem; height: .45rem; margin-right: .4rem; border-radius: 50%; background: #4ade80; box-shadow: 0 0 12px #4ade80; }
.hero-shot { transform: rotate(1.5deg); box-shadow: 0 30px 90px rgba(0,0,0,.4); }
.hero-shot .doppel-core { padding: .7rem; }
.hero-shot img { width: 100%; min-height: 22rem; border-radius: 1.2rem; object-fit: cover; }
.purpose-grid, .today-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(3rem, 8vw, 8rem); align-items: center; }
.system-stack { padding: 2rem; }
.system-stack div { position: relative; display: flex; align-items: center; min-height: 4.25rem; padding: 1.25rem 1.5rem; margin-top: .75rem; border: 1px solid rgba(49,209,237,.28); border-radius: .65rem; background: linear-gradient(120deg, rgba(9,29,44,.95), rgba(16,43,61,.8)); color: #dffbff; font-weight: 700; box-shadow: 0 14px 30px rgba(0,0,0,.24); }
.principles-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; margin-top: 3rem; }
.principles-grid .doppel-core { min-height: 18rem; }
.principles-grid span { color: var(--accent-slate); font: 600 .72rem monospace; }
.principles-grid h3 { margin: auto 0 1rem; font-size: 1.25rem; }
.principles-grid p, .timeline p, .timeline li { color: var(--text-muted); }
.timeline { position: relative; margin-top: 4rem; }
.timeline::before { content: ''; position: absolute; left: 9.5rem; top: 0; bottom: 0; width: 1px; background: linear-gradient(var(--accent-slate), rgba(49,209,237,.05)); }
.timeline-item { display: grid; grid-template-columns: 8rem 1fr; gap: 3rem; position: relative; padding-bottom: 4rem; }
.timeline-item::before { content: ''; position: absolute; left: calc(9.5rem - 5px); top: .25rem; width: 11px; height: 11px; border: 2px solid var(--accent-slate); border-radius: 50%; background: var(--bg-oled); box-shadow: 0 0 14px var(--accent-slate); }
.phase { color: var(--accent-slate); text-align: right; font: 700 .7rem monospace; letter-spacing: .12em; }
.timeline-item h3 { font-size: clamp(1.5rem, 3vw, 2.3rem); }
.timeline-item p { max-width: 48rem; margin: .8rem 0 1rem; }
.timeline-item ul { margin-left: 1.2rem; columns: 2; }
.timeline-item img { width: min(100%, 42rem); margin: .7rem 0 1.2rem; border: 1px solid var(--hairline); border-radius: 1.5rem; }
.focus-list { display: grid; gap: .7rem; }
.focus-list > div { display: grid; grid-template-columns: 8.5rem 1fr; gap: 1rem; align-items: center; min-height: 4.5rem; padding: .8rem; border-bottom: 1px solid var(--hairline); }
.status-tag { text-align: center; padding: .45rem .55rem; }
.testing { color: #ffe8a6; border-color: rgba(255,210,77,.25); background: rgba(255,210,77,.07); }
.planned { color: #c7bedc; border-color: rgba(199,190,220,.2); background: rgba(199,190,220,.06); }
.yuros-card .doppel-core { align-items: flex-start; padding: clamp(2rem, 6vw, 5rem); }
.yuros-card p { max-width: 58rem; margin: 1.5rem 0; color: var(--text-muted); font-size: 1.1rem; }
.yuros-card a { color: var(--accent-slate); }
.closing-cta { padding: clamp(2.5rem, 7vw, 6rem); text-align: center; border: 1px solid var(--hairline); border-radius: 2.5rem; background: radial-gradient(circle at 50% 0, rgba(49,209,237,.15), transparent 60%), var(--bg-card-inner); }
.closing-cta p { max-width: 46rem; margin: 1.5rem auto 0; color: var(--text-muted); }
.closing-cta .about-actions { justify-content: center; }
.footer-note { margin-top: .4rem; font-size: .75rem !important; }
@media (max-width: 1050px) { .principles-grid { grid-template-columns: repeat(2, 1fr); } .about-hero { grid-template-columns: 1fr; padding-top: 11rem !important; } .hero-shot img { min-height: 0; } }
@media (max-width: 768px) { .purpose-grid, .today-grid { grid-template-columns: 1fr; } .principles-grid { grid-template-columns: 1fr; } .principles-grid .doppel-core { min-height: 13rem; } .timeline::before { left: .35rem; } .timeline-item { grid-template-columns: 1fr; gap: .7rem; padding-left: 2rem; } .timeline-item::before { left: 0; } .phase { text-align: left; } .timeline-item ul { columns: 1; } .system-stack { padding: .5rem; } .focus-list > div { grid-template-columns: 7.5rem 1fr; } .closing-cta { border-radius: 1.5rem; } }
