@font-face{font-family:Inter;src:url('/assets/fonts/Inter.woff2') format('woff2');font-weight:100 900;font-display:swap;font-style:normal}
:root{
  --bg:#07080B;--bg-elev:#0E1016;--bg-soft:#141822;--line:rgba(255,255,255,.09);
  --text:#F5F6F8;--muted:#9AA3B2;--amber:#E6A800;--amber-2:#FFC107;--focus:#7DD3FC;
  --radius:18px;--wrap:1160px;--font:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --glow:radial-gradient(60% 50% at 70% 30%, rgba(230,168,0,.18), transparent 60%);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}a{color:var(--amber-2);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:#fff}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;z-index:100;background:#000;color:#fff;padding:8px 12px}
.wrap{width:min(var(--wrap),calc(100% - 48px));margin-inline:auto}
.site-header{position:sticky;top:0;z-index:50;backdrop-filter:blur(16px) saturate(1.2);background:rgba(7,8,11,.78);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:20px;min-height:72px}
.logo img{height:34px;width:auto}
.nav-desktop{display:none;gap:20px;margin-left:auto}
.nav-link{color:var(--muted);text-decoration:none;font-size:14px;font-weight:500}
.nav-link:hover,.nav-link.is-active{color:var(--text)}
.header-cta{margin-left:8px;display:none}
.nav-toggle{margin-left:auto;background:0;border:0;width:40px;height:40px;display:grid;place-content:center;gap:6px;cursor:pointer}
.nav-toggle span{display:block;width:18px;height:2px;background:var(--text)}
.nav-mobile{display:grid;gap:8px;padding:12px 20px 20px;border-bottom:1px solid var(--line);background:var(--bg-elev)}
.nav-mobile[hidden]{display:none}.nav-mobile .nav-link{padding:10px 0;color:var(--text);text-decoration:none}
@media(min-width:960px){.nav-desktop{display:flex}.nav-toggle{display:none}.header-cta{display:inline-flex}.nav-mobile{display:none!important}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(180deg,#FFD54F,#E6A800);color:#111;font-weight:650;border:0;border-radius:999px;padding:12px 20px;text-decoration:none;cursor:pointer;box-shadow:0 0 0 1px rgba(255,193,7,.25),0 10px 30px rgba(230,168,0,.18);transition:transform .2s ease,box-shadow .2s ease}
.btn:hover{transform:translateY(-1px);color:#111;box-shadow:0 0 0 1px rgba(255,193,7,.4),0 14px 36px rgba(230,168,0,.28)}
.btn-ghost{background:rgba(255,255,255,.03);color:var(--text);border:1px solid var(--line);box-shadow:none}
.btn-ghost:hover{border-color:rgba(230,168,0,.5);background:rgba(230,168,0,.06);color:var(--text)}
.btn-sm{padding:8px 14px;font-size:13px}
.eyebrow{color:var(--amber);text-transform:uppercase;letter-spacing:.1em;font-size:12px;font-weight:650;margin:0 0 14px}
h1,h2,h3{line-height:1.12;letter-spacing:-.03em;font-weight:650;margin:0 0 14px}
h1{font-size:clamp(2.35rem,5vw,4rem)}h2{font-size:clamp(1.6rem,2.6vw,2.2rem)}
.lede{font-size:1.125rem;color:var(--muted);max-width:38rem}
.muted{color:var(--muted)}.fine{font-size:13px;color:var(--muted)}.center{text-align:center}
.hero{position:relative;padding:88px 0 64px;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(80% 60% at 15% 0%, rgba(230,168,0,.12), transparent 50%), var(--bg)}
.hero-grid{display:grid;gap:48px;align-items:center}
@media(min-width:980px){.hero-grid{grid-template-columns:1.05fr .95fr}}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-stats{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px}
.stat{min-width:110px}.stat strong{display:block;font-size:1.4rem;letter-spacing:-.03em}.stat span{color:var(--muted);font-size:13px}
.hero-stage{position:relative;min-height:460px;border-radius:28px;border:1px solid var(--line);background:
  radial-gradient(50% 45% at 50% 40%, rgba(230,168,0,.16), transparent 65%),
  linear-gradient(160deg, #12151d 0%, #0a0c11 100%);
  overflow:hidden;isolation:isolate}
.mesh{position:absolute;inset:-20%;background:
  radial-gradient(circle at 20% 20%, rgba(255,193,7,.2), transparent 28%),
  radial-gradient(circle at 80% 30%, rgba(125,211,252,.12), transparent 26%),
  radial-gradient(circle at 50% 80%, rgba(230,168,0,.1), transparent 30%);
  filter:blur(8px);animation:meshShift 18s ease-in-out infinite alternate}
.grid-overlay{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);background-size:42px 42px;mask-image:radial-gradient(circle at 50% 45%, #000 20%, transparent 72%);opacity:.55}
.orbits{position:absolute;left:50%;top:48%;width:min(420px,90%);transform:translate(-50%,-50%);opacity:.9}
.phone{position:absolute;border-radius:28px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(10px);box-shadow:0 30px 80px rgba(0,0,0,.55);overflow:hidden}
.phone-bezel{padding:10px;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent)}
.phone img{width:100%;height:auto;border-radius:20px;display:block}
.phone-a{width:42%;left:18%;top:12%;transform:rotate(-8deg);z-index:3;animation:floatY 7s ease-in-out infinite}
.phone-b{width:36%;right:10%;top:22%;transform:rotate(7deg);z-index:2;animation:floatY 8s ease-in-out infinite .6s}
.phone-c{width:30%;left:42%;bottom:8%;transform:rotate(-2deg);z-index:4;animation:floatY 6.5s ease-in-out infinite 1s}
.orbit-icons{position:absolute;inset:0}
.orbit-icon{position:absolute;left:var(--x);top:var(--y);width:64px;height:64px;border-radius:16px;border:1px solid rgba(255,255,255,.14);box-shadow:0 12px 40px rgba(0,0,0,.45);animation:floatY 5.5s ease-in-out infinite}
.orbit-icon.i2{animation-delay:.4s}.orbit-icon.i3{animation-delay:.8s}.orbit-icon.i4{animation-delay:1.1s}.orbit-icon.i5{animation-delay:.2s}.orbit-icon.i6{animation-delay:1.4s}
.glass-chip{position:absolute;left:18px;bottom:18px;z-index:5;padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(10,12,18,.55);backdrop-filter:blur(12px);font-size:13px;font-weight:600;color:#fff}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes meshShift{from{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(2%,2%,0) scale(1.05)}}
.section{padding:88px 0}.section-alt{background:linear-gradient(180deg,var(--bg-elev),#0b0d13);border-block:1px solid var(--line)}
.section-head{margin-bottom:32px;max-width:46rem}
.cap-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.cap-card{display:grid;gap:12px;padding:22px;border-radius:var(--radius);background:rgba(255,255,255,.02);border:1px solid var(--line);text-decoration:none;color:inherit;transition:transform .25s ease,border-color .25s ease,background .25s ease;min-height:168px}
.cap-card:hover{transform:translateY(-4px);border-color:rgba(230,168,0,.45);background:rgba(230,168,0,.04);color:inherit}
.cap-ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(230,168,0,.1);color:var(--amber-2);border:1px solid rgba(230,168,0,.25)}
.cap-ico svg{width:22px;height:22px}
.cap-card p{color:var(--muted);margin:0;font-size:14px}
.feature-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.feature-card{border:1px solid var(--line);border-radius:22px;overflow:hidden;background:rgba(255,255,255,.02);transition:transform .25s ease,border-color .25s ease}
.feature-card:hover{transform:translateY(-5px);border-color:rgba(230,168,0,.4)}
.feature-card-link{display:block;text-decoration:none;color:inherit}
.feature-shot{background:radial-gradient(circle at 50% 20%, rgba(230,168,0,.15), transparent 55%), #090b10;padding:22px 22px 0;display:flex;justify-content:center;min-height:260px}
.feature-shot img{width:min(180px,70%);border-radius:22px;border:1px solid rgba(255,255,255,.12);box-shadow:0 20px 50px rgba(0,0,0,.45)}
.feature-meta{display:flex;gap:12px;align-items:center;padding:16px 18px 18px}
.feature-meta h3{font-size:1rem;margin:0 0 2px}.feature-meta p{margin:0;color:var(--muted);font-size:13px}
.app-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.app-card{position:relative;border:1px solid var(--line);background:rgba(255,255,255,.02);border-radius:var(--radius);padding:16px;transition:transform .25s ease,border-color .25s ease}
.app-card:hover{transform:translateY(-4px);border-color:rgba(230,168,0,.4)}
.app-card-link{display:flex;align-items:flex-start;gap:14px;text-decoration:none;color:inherit}
.app-icon{border-radius:16px;flex:0 0 64px;width:64px;height:64px;object-fit:cover}
.app-card-title{font-size:1rem;margin:0 0 4px}.app-card-sub{margin:0;color:var(--muted);font-size:13px}
.app-card-meta{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;font-size:12px;color:var(--muted)}
.app-card-meta span{border:1px solid var(--line);border-radius:999px;padding:2px 8px}
.app-store-btn{display:inline-block;margin-top:12px;font-size:13px;font-weight:600;text-decoration:none;color:var(--amber-2)}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:8px 12px;font:inherit;font-size:13px;cursor:pointer}
.chip.is-on,.chip:hover{color:var(--text);border-color:var(--amber);background:rgba(230,168,0,.08)}
.filter-sep{width:1px;background:var(--line);margin:0 4px}
.about-band{display:grid;gap:36px}@media(min-width:900px){.about-band{grid-template-columns:1.05fr .95fr;align-items:center}}
.about-visual{position:relative}
.about-visual .photo{border-radius:24px;border:1px solid var(--line);overflow:hidden}
.about-visual .photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.about-badge{position:absolute;right:16px;bottom:16px;padding:12px 14px;border-radius:14px;background:rgba(10,12,18,.7);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(12px);font-size:13px}
.sub-grid{display:grid;gap:18px}@media(min-width:860px){.sub-grid{grid-template-columns:1.35fr .65fr}}
.sub-card{border:1px solid var(--line);border-radius:var(--radius);padding:22px;background:rgba(255,255,255,.02)}
.music-row{display:flex;gap:10px;overflow:auto;padding:10px 0 14px;scroll-snap-type:x mandatory}
.music-card{flex:none;width:100px;text-decoration:none;color:var(--text);font-size:12px;scroll-snap-align:start}
.music-card img{border-radius:12px;margin-bottom:6px;aspect-ratio:1;object-fit:cover;border:1px solid var(--line)}
.music-card.large{width:160px;font-size:14px}.music-grid{display:flex;flex-wrap:wrap;gap:16px}
.cta-band{padding:96px 0;background:
  radial-gradient(50% 80% at 50% 0%, rgba(230,168,0,.16), transparent 60%),
  var(--bg)}
.text-link{font-weight:600;text-decoration:none;color:var(--amber-2)}
.site-footer{border-top:1px solid var(--line);padding:56px 0 24px;background:#05060a}
.footer-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.footer-logo{margin-bottom:12px}.footer-h{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:12px}
.footer-list{list-style:none;padding:0;margin:0;display:grid;gap:8px}.footer-list a{color:var(--text);text-decoration:none}
.footer-bottom{margin-top:36px;padding-top:16px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.social{display:flex;flex-wrap:wrap;gap:12px;margin-top:12px}.social a{color:var(--muted);text-decoration:none;font-size:13px}
.page{padding:56px 0 80px}.narrow-hero{margin-bottom:40px}.prose{max-width:42rem}.prose p{color:var(--muted)}
.split{display:grid;gap:28px}@media(min-width:900px){.split{grid-template-columns:1fr 1fr;align-items:start}}
.check-list{padding-left:1.1rem;color:var(--muted)}.check-list li{margin:8px 0}
.contact-grid{display:grid;gap:28px}@media(min-width:800px){.contact-grid{grid-template-columns:1.2fr .8fr}}
.contact-form{display:grid;gap:12px;padding:22px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.02)}
.contact-form label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
.contact-form input,.contact-form textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);padding:12px 14px;font:inherit}
.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--focus);outline-offset:1px}
.hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.form-message{padding:12px;border-radius:10px}.form-message.ok{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4)}
.form-message.err{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.4)}
.app-hero{display:grid;gap:20px;margin:20px 0 40px}@media(min-width:700px){.app-hero{grid-template-columns:128px 1fr;gap:28px}}
.app-hero-icon{border-radius:28px;border:1px solid var(--line)}
.crumbs{font-size:13px;color:var(--muted);margin-bottom:18px}.crumbs a{color:var(--muted);text-decoration:none}
.shots-rail{display:flex;gap:14px;overflow:auto;list-style:none;padding:8px 0 16px;margin:0;scroll-snap-type:x mandatory}
.shot{flex:none;scroll-snap-align:start}.shot img{width:220px;border-radius:28px;border:1px solid var(--line);background:#000}
.faq{border:1px solid var(--line);border-radius:12px;padding:12px 16px;margin:10px 0;background:rgba(255,255,255,.02)}
.faq summary{cursor:pointer;font-weight:600}.faq p{color:var(--muted)}
.gallery{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-top:28px}
.rounded{border-radius:20px;overflow:hidden;border:1px solid var(--line)}.rounded img{width:100%;object-fit:cover}
/* Progressive enhancement reveals: visible by default */
.reveal{transition:opacity .65s ease, transform .65s ease;transition-delay:var(--d,0ms)}
.js-ready .reveal-pending{opacity:0;transform:translateY(18px)}
.js-ready .reveal-pending.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .mesh,.phone,.orbit-icon{animation:none!important}
  .js-ready .reveal-pending{opacity:1;transform:none;transition:none}
  .btn,.app-card,.cap-card,.feature-card{transition:none}
  .btn:hover,.app-card:hover,.cap-card:hover,.feature-card:hover{transform:none}
}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
@media(max-width:979px){
  .phone-c{display:none}
  .hero-stage{min-height:380px}
}