/* Layout idea: light editorial page, narrow label rail on the left, one Deep Indigo section as the single dark moment. Burgundy only for the italic phrase in the hero and link hovers. */
:root{
  --cream:#F5EDE8;
  --indigo:#1A1525;
  --burgundy:#6B1E2E;
  --mauve:#9B6E7E;
  --lavender:#C9AECF;
  --rule:#DCCFC9;
  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --body:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--indigo);font-family:var(--body);font-weight:300;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--indigo);text-underline-offset:3px}
a:hover{color:var(--burgundy)}
a:focus-visible{outline:3px solid var(--burgundy);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px}
p{margin:0}
h1,h2{font-family:var(--display);margin:0;text-wrap:balance}
h1{font-weight:300;font-size:clamp(46px,8vw,80px);line-height:1.04;letter-spacing:-0.015em}
h1 em{font-style:italic;color:var(--burgundy)}
h2{font-weight:400;font-size:clamp(28px,4vw,32px);line-height:1.2}
h3{font-family:var(--body);font-weight:500;font-size:20px;line-height:1.3;margin:0 0 6px}
.label{font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}

nav{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:24px 0;border-bottom:1px solid var(--rule)}
.wordmark{font-family:var(--display);font-weight:400;font-size:20px;letter-spacing:.04em;text-decoration:none}
nav ul{display:flex;gap:24px;list-style:none;margin:0;padding:0;flex-wrap:wrap}
nav ul a{text-decoration:none;font-size:15px;font-weight:400}

.hero{padding:80px 0 64px;display:grid;gap:28px}
.role{font-size:20px;font-weight:400}
.hero .statement{max-width:640px;font-size:18px}
.facts{display:flex;flex-wrap:wrap;gap:16px 48px;margin-top:16px;padding-top:28px;border-top:1px solid var(--rule)}
.facts b{display:block;font-family:var(--display);font-weight:300;font-size:44px;line-height:1.1}
.facts span{font-size:14px}

section{padding:64px 0;border-top:1px solid var(--rule)}
.row{display:grid;grid-template-columns:200px 1fr;gap:32px}
.row + .row{margin-top:48px;padding-top:48px;border-top:1px solid var(--rule)}
.entry .meta{font-size:14px;margin-bottom:14px}
.entry .lead{font-size:18px;max-width:660px;margin-bottom:18px}
.entry ul{margin:0 0 0;padding-left:20px;max-width:660px}
.entry li{margin-bottom:8px}
.entry h4{font-family:var(--body);font-weight:500;font-size:16px;margin:28px 0 6px}
.entry p + p{margin-top:12px}
.entry p{max-width:660px}
.entry b{font-weight:500}
.numbers{display:flex;flex-wrap:wrap;gap:12px 40px;margin:20px 0 0}
.numbers b{display:block;font-family:var(--display);font-weight:300;font-size:36px;line-height:1.1}
.numbers span{font-size:14px;display:block;max-width:180px}

.dark{background:var(--indigo);color:var(--cream);border-top:0}
.dark .label{color:var(--lavender)}
.dark a{color:var(--cream)}
.principles{list-style:none;margin:0;padding:0;display:grid;gap:0;max-width:680px}
.principles li{font-family:var(--display);font-weight:300;font-size:clamp(22px,3vw,28px);line-height:1.3;padding:16px 0;border-bottom:1px solid rgba(245,237,232,.2)}
.principles li:last-child{border-bottom:0}

.about p{max-width:660px;margin-bottom:18px;font-size:18px}
.timeline{list-style:none;margin:0;padding:0;max-width:760px}
.timeline li{display:grid;grid-template-columns:170px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule)}
.timeline li:last-child{border-bottom:0}
.timeline .when{font-size:14px}
.timeline .what b{font-weight:500}
.contact h2{margin-bottom:16px}
.contact p{margin-bottom:10px;max-width:560px}

footer.site{padding:32px 0 56px;border-top:1px solid var(--rule);font-size:14px}

@media (max-width:760px){
  .row{grid-template-columns:1fr;gap:12px}
  .timeline li{grid-template-columns:1fr;gap:2px}
  .hero{padding-top:48px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.clock{font-size:14px;font-weight:400}
.hero{padding:72px 0 56px}
.hero h1{font-size:clamp(56px,11vw,120px);line-height:1}
.hero .sub{font-family:var(--display);font-weight:300;font-size:clamp(24px,3.6vw,36px);line-height:1.25;max-width:760px}
.hero .sub em{font-style:italic;color:var(--burgundy)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-top:40px}
.card{border:1px solid var(--rule);padding:28px;display:flex;flex-direction:column;gap:14px;background:var(--cream)}
.card.wide{grid-column:1/-1}
.card h3{font-family:var(--display);font-weight:400;font-size:32px;line-height:1.1;margin:0}
.card .what{font-size:16px}
.card ul{margin:0;padding-left:20px}
.card li{margin-bottom:6px}
.card .stats{display:flex;flex-wrap:wrap;gap:12px 32px;padding-top:14px;border-top:1px solid var(--rule);margin-top:auto}
.card .stats b{display:block;font-family:var(--display);font-weight:300;font-size:34px;line-height:1.1}
.card .stats span{font-size:14px;display:block;max-width:150px}
.skills{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;border-top:1px solid var(--rule);margin-top:32px}
.skills p{padding:16px 16px 16px 0;border-bottom:1px solid var(--rule);font-size:17px;font-weight:400}
.tools{margin-top:24px;max-width:760px;font-size:15px}
.journey-wrap{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:start}
.journey-wrap h2{color:var(--cream);font-size:clamp(30px,4vw,44px);font-weight:300;position:sticky;top:24px}
.journey-wrap .intro{margin-top:16px;max-width:380px;color:var(--cream)}
.path{display:grid;grid-template-columns:110px 1fr;align-items:stretch}
.path svg{display:block;width:110px;height:784px}
.stops{display:grid;grid-template-rows:repeat(7,112px)}
.stop{display:flex;flex-direction:column;justify-content:center}
.stop b{font-weight:500;font-size:20px;line-height:1.3}
.stop span{font-size:16px;color:var(--cream)}
.portrait{aspect-ratio:4/5;background:var(--lavender);display:flex;align-items:center;justify-content:center;max-width:320px;width:100%}
.ring{width:140px;height:140px;border:2px solid var(--burgundy);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:56px;font-weight:400;color:var(--burgundy)}
.about-grid{display:grid;grid-template-columns:320px 1fr;gap:48px;align-items:start}
.facts-list{list-style:none;margin:28px 0 0;padding:0;max-width:560px}
.facts-list li{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:12px 0;border-top:1px solid var(--rule);font-size:16px}
.facts-list .k{font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;padding-top:4px}
@media (max-width:860px){
  .journey-wrap,.about-grid{grid-template-columns:1fr;gap:32px}
  .journey-wrap h2{position:static}
}

nav a[aria-current="page"]{color:var(--burgundy);text-decoration:underline;text-underline-offset:6px}
.listen{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.player{border:1px solid var(--rule);padding:0;min-height:380px;display:flex;align-items:center;justify-content:center;background:var(--lavender)}
.player iframe{width:100%;height:380px;border:0}
.player .soon{padding:32px;text-align:center;max-width:340px}
.player .soon p{margin-bottom:12px}
@media (max-width:860px){.listen{grid-template-columns:1fr}}

.portrait-img{display:block;width:100%;max-width:320px;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:top}
.np{display:grid;grid-template-columns:140px 1fr;gap:20px;align-items:center;padding:20px;border:1px solid var(--rule);background:var(--lavender)}
.np img,.np .art{width:140px;height:140px;object-fit:cover;background:var(--cream)}
.np .t{font-family:var(--display);font-weight:400;font-size:26px;line-height:1.15;margin:6px 0 4px}
.tracks{list-style:none;margin:0;padding:0}
.tracks li{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.tracks img,.tracks .art{width:52px;height:52px;object-fit:cover;background:var(--lavender)}
.tracks b{font-weight:500;display:block;line-height:1.3}
.tracks span{font-size:14px}

.arch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin:24px 0}
.arch-fig{margin:0}
.arch-fig .shot{max-height:560px;overflow:auto;border:1px solid var(--rule);background:#fff}
.arch-fig img{display:block;width:100%;height:auto}
.arch-fig figcaption{font-size:14px;margin-top:8px}
.arch h3{font-family:var(--display);font-weight:400;font-size:28px;margin:48px 0 8px}
.arch h4{font-family:var(--body);font-weight:500;font-size:16px;margin:24px 0 6px}
.arch p,.arch li{max-width:700px}
.arch ul{padding-left:20px}
.quote{border-left:2px solid var(--burgundy);padding:4px 0 4px 16px;margin:16px 0;max-width:640px}
.note{background:var(--lavender);padding:16px 20px;max-width:700px;font-size:15px}

.jam{background:var(--indigo);color:var(--cream);border-top:0;padding:72px 0}
.jam .label{color:var(--lavender)}
.jam-grid{display:grid;grid-template-columns:340px 1fr;gap:56px;align-items:center}
.jam-art{width:340px;height:340px;background:var(--lavender);overflow:hidden}
.jam-art img{display:block;width:100%;height:100%;object-fit:cover}
.jam h1{font-family:var(--display);font-weight:300;font-size:clamp(40px,6.5vw,76px);line-height:1.04;margin:14px 0 12px;color:var(--cream)}
.jam .by{font-size:20px;color:var(--cream)}
.jam a{color:var(--cream)}
.eq{display:inline-flex;gap:3px;align-items:flex-end;height:14px;margin-right:10px;vertical-align:middle}
.eq i{display:block;width:3px;background:var(--lavender);height:4px}
.eq.on i{animation:eq 900ms ease-in-out infinite}
.eq.on i:nth-child(2){animation-delay:150ms}
.eq.on i:nth-child(3){animation-delay:300ms}
.eq.on i:nth-child(4){animation-delay:450ms}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}
.recent{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:20px;list-style:none;margin:28px 0 0;padding:0}
.recent li b{font-weight:500;display:block;line-height:1.3;margin-top:10px}
.recent li span{font-size:14px}
.recent .rart{aspect-ratio:1/1;background:var(--lavender);overflow:hidden}
.recent img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.jam-grid{grid-template-columns:1fr;gap:32px}.jam-art{width:100%;max-width:340px;height:auto;aspect-ratio:1/1}}
@media (prefers-reduced-motion:reduce){.eq.on i{animation:none;height:10px}}

.cta-row{display:flex;gap:28px;flex-wrap:wrap;margin-top:8px;font-size:17px;font-weight:400}
.trio{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0;border-top:1px solid var(--rule);margin-top:32px}
.trio div{padding:24px 24px 24px 0;border-bottom:1px solid var(--rule)}
.trio h3{font-family:var(--display);font-weight:400;font-size:28px;margin:0 0 8px}
.proof{list-style:none;margin:32px 0 0;padding:0}
.proof li{display:grid;grid-template-columns:200px 1fr;gap:24px;padding:20px 0;border-top:1px solid var(--rule)}
.proof li:last-child{border-bottom:1px solid var(--rule)}
.proof b{font-family:var(--display);font-weight:400;font-size:24px}
.playbtn{margin-top:24px;font:inherit;font-size:16px;font-weight:500;background:var(--cream);color:var(--indigo);border:0;padding:14px 28px;cursor:pointer}
.playbtn:hover{background:var(--lavender)}
.playbtn:focus-visible{outline:3px solid var(--lavender);outline-offset:3px}
.jam-art iframe{width:100%;height:100%;border:0;display:block}
@media (max-width:760px){.proof li{grid-template-columns:1fr;gap:4px}}