/* Homepage refresh: editorial layout and restrained crest motion. */
:root { --primary-red: #f06e61; --secondary-purple: #ac91ef; --bg-dark: #0b0b10; --bg-darker: #07070a; --text-secondary: #b8b6c3; --text-muted: #9895a5; --border-color: rgba(255,255,255,.11); }
body { background-image: radial-gradient(ellipse at 75% 8%, rgba(99,71,146,.13), transparent 40%); }
.logo-link { background: none; -webkit-text-fill-color: initial; color: #f7f4f5; }
.logo-link img { flex: none; }
.nav-links { gap: clamp(12px, 2vw, 28px); }
.nav-links a { font-size: 13px; }
.home-hero { min-height: min(780px, calc(100svh - 80px)); padding: 80px 0 100px; }
.home-hero-grid { grid-template-columns: minmax(0,1.1fr) minmax(300px,.9fr); gap: clamp(20px,5vw,90px); }
.hero-content { position: relative; z-index: 2; animation: enter-hero .8s both; }
.hero-badge { background: transparent; border: 0; padding: 0 0 0 22px; box-shadow: none; color: #f6a99f; letter-spacing: .2em; font-size: 11px; position: relative; }
.hero-badge::before { content: ''; position: absolute; left: 0; top: 50%; width: 8px; height: 8px; border-radius: 50%; background: #f06e61; box-shadow: 0 0 14px #f06e61; transform: translateY(-50%); animation: beacon 3s ease-in-out infinite; }
.home-hero-title { font-size: clamp(3.5rem,7vw,6.7rem); line-height: 1.01; letter-spacing: -.065em; background: none; -webkit-text-fill-color: initial; color: #f7f4f5; max-width: 720px; }
.home-hero-title span { background: none; -webkit-text-fill-color: initial; color: #f38d80; }
.home-hero-description { max-width: 550px; font-size: clamp(1rem,1.7vw,1.25rem); line-height: 1.75; }
.home-hero-actions .btn { min-height: 48px; }
.hero-visual { aspect-ratio: 1; max-width: 540px; isolation: isolate; animation: enter-crest 1s .15s both; }
.hero-visual::before { content: ''; position: absolute; width: 90%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(78,133,192,.17), transparent 65%); filter: blur(25px); }
.crest-orbit { position: absolute; border: 1px solid rgba(188,173,211,.26); border-radius: 50%; pointer-events: none; }
.crest-orbit-outer { width: 96%; aspect-ratio: 1; border-style: dashed; animation: rotateClockwise 72s linear infinite; }
.crest-orbit-inner { width: 78%; aspect-ratio: 1; border-color: rgba(240,110,97,.2); animation: rotateCounter 58s linear infinite; }
.crest-orbit-inner::before, .crest-orbit-outer::before { content: ''; position: absolute; top: 50%; left: -4px; width: 8px; height: 8px; background: #f38d80; border-radius: 50%; box-shadow: 0 0 18px #f38d80; }
.crest-orbit-outer::before { background: #7ac9f6; box-shadow: 0 0 18px #7ac9f6; }
.crest-frame { width: 65%; aspect-ratio: 1; border-radius: 50%; overflow: hidden; position: relative; border: 1px solid rgba(140,184,224,.35); box-shadow: 0 0 60px rgba(60,116,177,.15), 0 30px 80px #030308; }
.crest-frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.orbit-caption { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap; font-size: 10px; letter-spacing: .22em; color: #aaa6ba; font-weight: 600; }
.orbit-caption-top { top: -20px; } .orbit-caption-bottom { bottom: -20px; }
.section-padding { padding-block: clamp(70px, 9vw, 120px); }
.section-title { letter-spacing: -.045em; }
.card-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.card { transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.card:hover { transform: translateY(-5px); border-color: rgba(240,110,97,.3); box-shadow: 0 20px 45px rgba(0,0,0,.2); }
.btn:focus-visible, .logo-link:focus-visible, .nav-links a:focus-visible, .burger-menu:focus-visible { outline: 2px solid #f7ac9f; outline-offset: 4px; }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .65s ease, transform .65s cubic-bezier(.2,.7,.2,1); }
.reveal.in-view { opacity: 1; transform: none; }
@keyframes enter-hero { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes enter-crest { from { opacity: 0; transform: scale(.93); } to { opacity: 1; transform: none; } }
@keyframes beacon { 50% { opacity: .5; box-shadow: 0 0 4px #f06e61; } }
@media (max-width: 1100px) { .nav-links { position: fixed; top: 80px; left: -100%; width: 100%; height: calc(100svh - 80px); overflow-y: auto; background: #0b0b10; flex-direction: column; align-items: flex-start; gap: 14px; padding: 32px 24px; transition: left .3s ease; border-top: 1px solid var(--border-color); } .nav-links.open { left: 0; } .nav-links a { display: block; padding: 8px 0; font-size: 16px; } .burger-menu { display: flex; padding: 10px; } }
@media (max-width: 992px) { .home-hero { min-height: 0; } .home-hero-grid { grid-template-columns: 1fr; } .hero-visual { width: min(70vw,400px); margin: 55px auto 0; } }
@media (max-width: 600px) { .home-hero { padding: 70px 0 85px; } .home-hero-title { font-size: clamp(3rem,12vw,4.5rem); } .home-hero-description { font-size: 16px; } .hero-visual { width: min(75vw,340px); } .card-grid { grid-template-columns: 1fr; } .orbit-caption { font-size: 8px; } }
/* Creator lineup and companion: varied section rhythm, not a grid of feature cards. */
.creator-section { border-top: 1px solid var(--border-color); background: #0e0d13; }
.creator-intro { max-width: 680px; margin-bottom: 42px; }
.creator-intro .section-title { font-size: clamp(2.25rem,4vw,3.8rem); }
.creator-intro p { font-size: 17px; line-height: 1.7; }
.creator-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.creator-tile { display: flex; align-items: center; min-width: 0; min-height: 155px; gap: 22px; padding: 26px; background: #15131d; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; transition: transform .35s cubic-bezier(.2,.7,.2,1), border-color .35s, background .35s; }
.creator-tile:hover, .creator-tile:focus-visible { transform: translateY(-5px); border-color: rgba(129,205,238,.48); background: #1b1925; }
.creator-tile:focus-visible { outline: 2px solid #f7ac9f; outline-offset: 3px; }
.creator-avatar { flex: none; width: 80px; height: 80px; border-radius: 16px; display: grid; place-items: center; overflow: hidden; background: #090a11; }
.creator-avatar img { width: 100%; height: 100%; object-fit: cover; }
.creator-avatar-type { color: #f7e7d9; font: 700 1.25rem var(--font-headings); letter-spacing: -.08em; background: linear-gradient(145deg,#503c58,#856c64); }
.creator-detail { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.creator-kicker { text-transform: uppercase; color: #b6a9c6; font-size: 10px; font-weight: 700; letter-spacing: .17em; }
.creator-detail strong { font: 700 clamp(1.1rem,2vw,1.5rem) var(--font-headings); color: #fff; overflow-wrap: anywhere; }
.creator-detail > span:last-child { font-size: 13px; color: var(--text-secondary); }
.creator-arrow { margin-left: auto; align-self: flex-start; color: #f3a096; font-size: 22px; line-height: 1; transition: transform .3s ease; }
.creator-tile:hover .creator-arrow { transform: translate(3px,-3px); }
.geo-section { overflow: hidden; background: radial-gradient(ellipse at 25% 55%,rgba(38,115,146,.13),transparent 58%),#090a0e; }
.geo-layout { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); align-items: center; gap: clamp(30px,6vw,100px); }
.geo-art { position: relative; min-height: 380px; display: grid; place-items: center; isolation: isolate; }
.geo-art::before { content: ''; position: absolute; width: 70%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle,rgba(29,149,175,.2),transparent 70%); filter: blur(25px); }
.geo-art img { position: relative; z-index: 1; display: block; width: min(100%,620px); height: auto; object-fit: contain; filter: drop-shadow(0 20px 30px rgba(2,9,20,.45)); animation: geo-drift 7s ease-in-out infinite; }
.geo-orbit { position: absolute; width: 64%; aspect-ratio: 1; border: 1px solid rgba(77,193,217,.23); border-radius: 50%; transform: rotateX(62deg) rotate(-24deg); }
.geo-copy .section-title { font-size: clamp(2.3rem,4vw,4rem); max-width: 520px; }
.geo-copy p { max-width: 520px; font-size: 17px; line-height: 1.75; margin-bottom: 28px; }
@keyframes geo-drift { 50% { transform: translateY(-12px) rotate(1deg); } }
@media(max-width:900px) { .geo-layout { grid-template-columns: 1fr; } .geo-art { min-height: 280px; max-width: 570px; margin: auto; } .geo-copy { max-width: 620px; } }
@media(max-width:700px) { .creator-list { grid-template-columns: 1fr; } .creator-tile { min-height: 120px; padding: 18px; gap: 16px; } .creator-avatar { width: 64px; height: 64px; } .geo-art { min-height: 230px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .hero-content, .hero-visual, .hero-badge::before, .crest-orbit { animation: none !important; } .reveal { opacity: 1; transform: none; transition: none; } .card, .btn { transition: none; } }
@media(prefers-reduced-motion:reduce) { .geo-art img { animation: none; } .creator-tile, .creator-arrow { transition: none; } .creator-tile:hover { transform: none; } }
