/* Marketing uses Obsidian Luxe brand palette, elevated glass surfaces, no external assets. */
:root{--bg:#07080d;--surface:#111522;--text:#f8fafc;--muted:#94a3b8;--border:#232a3e;--accent:#c4b5fd}
body.about-page{background:radial-gradient(circle at 18% 0%,rgba(139,92,246,.16),transparent 42%),radial-gradient(circle at 82% 12%,rgba(236,72,153,.12),transparent 38%),var(--bg);color:var(--text)}
a:focus-visible,summary:focus-visible{outline:2px solid #c4b5fd;outline-offset:4px}
.skip-link{position:fixed;top:-70px;left:15px;padding:12px;background:#fff;color:#07080d;z-index:99;border-radius:8px;font-weight:700}
.skip-link:focus{top:10px}
.site-header{height:80px;border-color:rgba(255,255,255,.08)}
.brand>span{display:none}
.site-header nav{font-size:13.5px}
.web-link{background:linear-gradient(135deg,#8b5cf6,#ec4899);color:#fff;font-size:12.5px;font-weight:800;padding:11px 18px;border-radius:999px}
.about-hero{min-height:650px;padding-top:64px;grid-template-columns:1.18fr .82fr;align-items:center;gap:28px}
.intro-label{color:#c4b5fd;font-size:10.5px;letter-spacing:.16em}
.about-hero h1{font-size:clamp(44px,5.2vw,76px);line-height:1.04;letter-spacing:-.055em}
.accent{background:linear-gradient(135deg,#38bdf8,#a78bfa 50%,#ff2e63);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-description{color:#cbd5e1;font-size:17px;max-width:42ch;line-height:1.75;margin:24px 0 32px}
.hero-buttons .btn{font-weight:800;padding:15px 22px;font-size:13.5px;gap:10px;border-radius:14px}
.btn.primary{background:linear-gradient(135deg,#7c3aed,#8b5cf6 50%,#ec4899);color:#fff;border:0;box-shadow:0 12px 30px -6px rgba(139,92,246,.5)}
.btn.outline{color:#f8fafc;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04)}
.btn:active{transform:scale(.98)}
.hero-visual{min-height:540px}
.phone-halo{position:absolute;width:390px;height:390px;max-width:100%;border-radius:50%;background:radial-gradient(circle,rgba(139,92,246,.28),rgba(236,72,153,.12) 55%,transparent 75%);filter:blur(18px)}
.phone{width:256px;flex:none;border-color:#3b4461;transform:rotate(6deg);box-shadow:0 30px 70px rgba(0,0,0,.65);animation:phone-enter .8s cubic-bezier(.16,1,.3,1) both}
.visual-caption{color:#94a3b8;bottom:-10px;font-size:10.5px;letter-spacing:.06em}
.statement{display:grid;grid-template-columns:.65fr 1.35fr;gap:7vw;border-top:1px solid var(--border);align-items:center}
.statement-mark{font-size:210px;font-weight:900;letter-spacing:-.1em;background:linear-gradient(135deg,#38bdf8,#8b5cf6,#ec4899);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.statement h2,.experience h2,.privacy-story h2,.start-section h2{font-size:clamp(34px,4.2vw,58px);line-height:1.1;letter-spacing:-.05em;margin:0 0 26px}
.statement p{font-size:16.5px;line-height:1.85;color:#cbd5e1;max-width:62ch}
.statement strong{color:#fff}
.section-description{color:#94a3b8;font-size:17px;line-height:1.8;margin-bottom:36px}
.experience-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:20px}
.experience-grid article{padding:36px;background:var(--surface);border:1px solid var(--border);border-radius:22px;box-shadow:0 16px 40px rgba(0,0,0,.28)}
.experience-grid .experience-lead{grid-row:span 2;overflow:hidden;background:linear-gradient(155deg,#6d28d9 0%,#4c1d95 55%,#1e1b4b 100%);border-color:rgba(167,139,250,.35);color:#fff}
.feature-kicker{font-size:10.5px;letter-spacing:.16em;font-weight:800;color:#a78bfa}
.experience-lead .feature-kicker{color:#bae6fd}
.experience-grid h3{font-size:30px;line-height:1.18;letter-spacing:-.035em;margin:20px 0 14px;color:#fff}
.experience-grid p{font-size:15px;line-height:1.8;color:#94a3b8;max-width:46ch}
.experience-lead p{color:#e2e8f0}
.experience-lead a{display:inline-flex;align-items:center;gap:6px;margin-top:14px;border-bottom:1.5px solid #fff;padding-bottom:4px;font-weight:800;color:#fff}
.word-art{font-size:clamp(38px,4.6vw,66px);font-weight:900;letter-spacing:-.06em;line-height:1.04;margin-top:56px;transform:rotate(-4deg);color:rgba(255,255,255,.92)}
.word-art span{color:#38bdf8}
.experience-grid .studio-feature{grid-column:1/-1;display:block;background:radial-gradient(120% 120% at 100% 0%,rgba(56,189,248,.14),var(--surface) 65%)}
.studio-feature small{display:block;color:#94a3b8;max-width:65ch;line-height:1.6;margin-top:8px}
.privacy-story{display:grid;grid-template-columns:1fr 1fr;gap:60px;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.privacy-story p{color:#cbd5e1;line-height:1.85;font-size:16px}
.text-links{display:flex;flex-wrap:wrap;gap:24px;color:#a78bfa;font-weight:750;margin-top:25px}
.start-section{max-width:960px;text-align:center;padding-block:100px}
.start-section>img{width:72px;height:72px;border-radius:20px;margin-bottom:28px;box-shadow:0 12px 32px rgba(139,92,246,.35)}
.start-section>p{max-width:49ch;margin:0 auto 30px;color:#cbd5e1;font-size:17px;line-height:1.8}
.start-section .hero-buttons{justify-content:center}
.start-section details{text-align:left;border:1px solid var(--border);background:var(--surface);border-radius:18px;padding:20px 24px;margin:48px auto 0;max-width:620px;color:#cbd5e1;line-height:1.85}
.start-section summary{cursor:pointer;color:#fff;font-weight:750}
.site-footer{border-top:1px solid var(--border);padding:50px max(5vw,24px);max-width:1440px;margin:auto}
.site-footer p{color:#94a3b8;margin:14px 0 26px}
.site-footer nav{display:flex;gap:22px;flex-wrap:wrap;font-size:13.5px;color:#cbd5e1}
.site-footer small{display:block;color:#64748b;margin-top:32px}
@keyframes phone-enter{from{opacity:0;transform:translateY(25px) rotate(2deg)}to{opacity:1;transform:translateY(0) rotate(6deg)}}
@media(max-width:800px){.site-header{height:74px;padding-inline:20px;gap:14px}.site-header nav{display:none}.brand{font-size:23px}.about-hero{grid-template-columns:1fr;padding:44px 24px;gap:10px}.about-hero h1{font-size:clamp(38px,8vw,60px);max-width:15ch}.hero-description{font-size:16px;margin-block:22px}.hero-visual{min-height:520px}.statement{grid-template-columns:1fr;gap:26px}.statement-mark{font-size:110px}.section{padding:64px 24px}.experience-grid{grid-template-columns:1fr}.experience-grid article{padding:26px}.experience-grid .studio-feature{grid-column:auto}.experience-grid h3{font-size:27px}.word-art{font-size:50px;margin-top:38px}.privacy-story{grid-template-columns:1fr;gap:12px}.hero-buttons{gap:12px}.hero-buttons .btn{font-size:12.5px;padding:14px 18px}.start-section{padding-inline:24px}.site-footer nav{gap:18px}.phone-halo{width:300px;height:300px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.phone{animation:none}}
.about-page .site-footer{background:transparent;color:var(--text)}