@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,700&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink: #fbf7ff; --violet: #d3b8ff; --mist: #2a2340; --line: rgba(251, 247, 255, .26); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--mist); color: var(--ink); font-family: "DM Sans", sans-serif; }
main, footer { max-width: 1240px; margin: auto; padding-left: clamp(1rem, 5vw, 5rem); padding-right: clamp(1rem, 5vw, 5rem); }
nav { display: flex; align-items: center; gap: 28px; padding: 26px 0 20px; border-bottom: 1px solid var(--line); font-size: .86rem; font-weight: 700; }
nav a:not(.wordmark) { color: var(--ink); text-decoration: none; }
.wordmark { color: var(--ink); font: 500 1.05rem "DM Mono", monospace; letter-spacing: -.08em; text-decoration: none; margin-right: auto; }
.wordmark span, h1 em { color: #d3b8ff; }
.hero { min-height: 680px; padding: 18vh 0 120px; position: relative; }
.eyebrow, .number, .label, .services { font: 500 .73rem "DM Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.eyebrow { color: #e0cdff; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 900px; margin: 18px 0 30px; font: 700 clamp(3.6rem, 8vw, 7.8rem)/.91 "Playfair Display", Georgia, serif; letter-spacing: -.065em; }
.intro { max-width: 465px; font-size: 1.12rem; line-height: 1.55; }
.jump { display: inline-block; margin-top: 20px; color: var(--ink); border-bottom: 1px solid var(--ink); padding-bottom: 5px; text-decoration: none; font-weight: 700; }
.jump span { padding-left: 9px; color: #d3b8ff; }
.work, .approach, .fans { padding: 105px 0; border-top: 1px solid var(--line); }
h2 { max-width: 720px; margin: 15px 0 52px; font: 700 clamp(2.6rem, 5vw, 5rem)/.96 "Playfair Display", Georgia, serif; letter-spacing: -.05em; }
.project-grid { display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid var(--line); }
.project { min-height: 360px; padding: 28px; display: flex; flex-direction: column; }
.project + .project { border-left: 1px solid var(--line); }
.project.anvil { background: #4d3a64; color: var(--ink); }
.project.anvil .label { color: #eadbff; }
.project .label { margin: auto 0 18px; color: #e0cdff; }
.project h3 { max-width: 410px; margin-bottom: 18px; font: 700 clamp(2.05rem, 3.6vw, 3.7rem)/.9 "Playfair Display", Georgia, serif; letter-spacing: -.055em; }
.project > p:last-child { max-width: 360px; line-height: 1.55; margin-bottom: 0; }
.approach { display: grid; grid-template-columns: 1.1fr .9fr; gap: 8vw; }
.approach h2 { margin-bottom: 0; }
.approach-copy { padding-top: 38px; }
.approach-copy > p { font-size: 1.15rem; line-height: 1.6; }
.services { margin-top: 32px; color: #e0cdff; line-height: 1.8; }
.fans { display: grid; grid-template-columns: 1.1fr .9fr; gap: 8vw; }
.fans h2 { margin-bottom: 28px; }
.fans > div > p:last-child { max-width: 460px; font-size: 1.12rem; line-height: 1.6; }
.fan-form { display: grid; gap: 13px; padding: 30px; border: 1px solid var(--line); align-self: start; }
.fan-form > label:first-child { font-size: .9rem; font-weight: 700; }
.fan-form input[type="email"] { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid var(--ink); border-radius: 0; background: transparent; color: var(--ink); font: 1rem "DM Sans", sans-serif; }
.fan-form input[type="email"]:focus-visible, .elected-option:has(input:focus-visible) { outline: 3px solid var(--violet); outline-offset: 3px; }
.elected-option { display: flex; align-items: flex-start; gap: 11px; margin: 8px 0 6px; cursor: pointer; font-size: .92rem; line-height: 1.45; }
.elected-option input { width: 19px; height: 19px; margin: 1px 0 0; accent-color: #7041c5; flex: 0 0 auto; }
.elected-option strong { font: 500 .78rem "DM Mono", monospace; letter-spacing: .08em; text-transform: uppercase; }
.fan-form button { min-height: 48px; border: 1px solid var(--ink); border-radius: 0; background: #4d3a64; color: var(--ink); cursor: pointer; font: 700 .95rem "DM Sans", sans-serif; text-align: left; padding: 0 15px; }
.fan-form button:hover { background: #7654ae; border-color: #7654ae; }
.fan-form button span { float: right; }
.form-note { margin: 1px 0 0; color: #e0cdff; font: .76rem/1.45 "DM Mono", monospace; }
.form-note.success { color: #8ee3a7; }
footer { display: flex; justify-content: space-between; align-items: center; min-height: 100px; border-top: 1px solid var(--line); font: .72rem "DM Mono", monospace; }
footer .wordmark { margin: 0; }
footer a:not(.wordmark) { color: inherit; }
@media (max-width: 680px) { .hero { min-height: 580px; padding-top: 16vh; } .project-grid, .approach, .fans { grid-template-columns: 1fr; } .project + .project { border-left: 0; border-top: 1px solid var(--line); } .approach, .fans { gap: 0; } .approach-copy { padding-top: 0; } }

/* Return-to-parent button (GoGo Mojo Co.) */
.gmc-backlink-wrap { padding: 48px 0 28px; border-top: 1px solid rgba(251,247,255,.26); }
.gmc-backlink { display: inline-flex; align-items: center; gap: 10px; color: #fbf7ff !important; background: transparent; text-decoration: none; font: 700 .95rem "DM Sans", sans-serif; border: 1px solid #d3b8ff; border-radius: 999px; padding: 12px 20px; transition: background .2s, color .2s; }
.gmc-backlink:hover, .gmc-backlink:focus-visible { background: #d3b8ff; color: #2a2340 !important; }