:root { --paper:#11100f; --ink:#f3efe6; --light:#f3efe6; --muted:#bcb4aa; --accent:#e52a12; --line:rgba(243,239,230,.22); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans", sans-serif; font-size:15px; line-height:1.45; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--accent); }
:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.shell { width:min(100% - 48px, 1240px); margin-inline:auto; }
.site-header { display:flex; justify-content:space-between; align-items:center; padding-top:26px; font-size:12px; letter-spacing:.04em; }
.wordmark { font-weight:500; letter-spacing:.12em; }
nav { display:flex; gap:28px; }
.hero { min-height:auto; padding-top:0; padding-bottom:clamp(110px, 15vw, 210px); display:flex; flex-direction:column; justify-content:flex-start; }
.eyebrow { margin:0; color:var(--muted); font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.wordmark-large { margin:clamp(42px, 8vw, 94px) 0 0; width:min(78vw, 930px); line-height:0; }
.wordmark-large img { display:block; width:100%; height:auto; }
.hero-foot { display:flex; justify-content:space-between; align-items:end; gap:24px; max-width:850px; margin-top:80px; }
.hero-foot p { max-width:300px; margin:0; color:var(--muted); }
.text-link { display:inline-flex; gap:10px; align-items:center; border-bottom:1px solid currentColor; padding-bottom:5px; font-size:13px; }
.text-link span { color:var(--accent); }
.portrait { position:relative; padding-bottom:clamp(120px, 17vw, 240px); }
.portrait-intro { display:none; }
.portrait-frame { width:min(78%, 960px); margin-left:auto; }
.portrait-frame img { display:block; width:100%; aspect-ratio:1; object-fit:cover; object-position:center; }
.portrait-caption { position:absolute; left:0; bottom:clamp(150px, 19vw, 280px); margin:0; color:var(--accent); font-family:"Barlow Condensed", Impact, sans-serif; font-size:clamp(25px, 3vw, 44px); font-weight:700; line-height:.9; letter-spacing:.02em; }
.video-section { padding-bottom:clamp(110px, 13vw, 170px); }
.video-frame { width:min(100%, 780px); aspect-ratio:16 / 9; }
.video-frame iframe { display:block; width:100%; height:100%; border:0; }
.section-grid { display:grid; grid-template-columns:1fr 2fr; gap:24px; border-top:1px solid var(--line); padding-top:22px; }
.about { padding-bottom:clamp(130px, 17vw, 250px); }
.statement { max-width:650px; margin:0; font-family:"Playfair Display", Georgia, serif; font-size:clamp(26px, 3.2vw, 44px); line-height:1.1; letter-spacing:-.035em; }
.names { color:var(--muted); margin:48px 0 0; }
.concert { padding-bottom:clamp(100px, 13vw, 180px); }
.concert-detail p { margin:0 0 5px; }
.concert-date { color:var(--accent); font-family:"Barlow Condensed", Impact, sans-serif; font-size:clamp(32px, 4vw, 58px); font-weight:700; line-height:.9; letter-spacing:.01em; }
.concert-time { font-family:"Barlow Condensed", Impact, sans-serif; font-size:clamp(28px, 3vw, 42px); font-weight:700; margin-top:12px !important; }
.venue { margin-top:30px !important; font-family:"Barlow Condensed", Impact, sans-serif; font-size:clamp(22px, 2.6vw, 38px); font-weight:700; line-height:.95; }
.ticket-price { color:var(--muted); margin-top:28px !important; }
.ticket-link { display:inline-flex; gap:14px; align-items:center; margin-top:28px; padding:15px 18px 13px; background:var(--accent); color:var(--light); font-family:"Barlow Condensed", Impact, sans-serif; font-size:20px; font-weight:700; letter-spacing:.04em; }
.ticket-link span { font-family:"DM Sans",sans-serif; }
.contact { padding-bottom:130px; }
.contact-links { display:flex; flex-direction:column; align-items:flex-start; gap:12px; font-family:"Playfair Display", Georgia, serif; font-size:clamp(24px, 3vw, 40px); line-height:1.05; overflow-wrap:anywhere; }
.contact-links span { font-family:"DM Sans", sans-serif; color:var(--accent); font-size:.55em; }
.site-footer { border-top:1px solid var(--line); padding-block:22px 30px; color:var(--muted); font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.site-footer p { margin:0; }
@media (min-width:601px) {
  .shell { width:min(calc(100% - 112px), 1280px); }
  .portrait { padding-bottom:120px; display:grid; grid-template-columns:30% 70%; align-items:center; }
  .portrait-intro { display:flex; flex-direction:column; align-items:flex-start; gap:24px; align-self:start; margin-top:clamp(150px, 12vw, 190px); padding-right:48px; }
  .portrait-lead { margin:0; max-width:250px; color:var(--muted); font-family:"Playfair Display", Georgia, serif; font-size:clamp(22px, 2vw, 30px); line-height:1.08; letter-spacing:-.025em; }
  .portrait-intro .text-link { font-size:14px; border-bottom-width:2px; }
  .portrait-frame { grid-column:2; grid-row:1; width:88%; max-width:760px; margin-left:0; }
  .portrait-caption { position:static; grid-column:2; grid-row:2; margin:16px 0 0; }
  .hero { padding-bottom:128px; }
  .section-grid { grid-template-columns:30% 70%; gap:0; }
  .about { padding-bottom:128px; }
  .statement { max-width:620px; }
  .names { margin-top:38px; }
  .concert { padding-bottom:128px; }
  .concert-detail { max-width:620px; }
  .concert-time { margin-top:8px !important; }
  .venue { margin-top:22px !important; }
  .ticket-price { margin-top:20px !important; }
  .ticket-link { margin-top:22px; }
  .contact { padding-bottom:112px; }
}
@media (max-width:600px) { .shell { width:min(100% - 36px, 1240px); } .site-header { padding-top:20px; } nav { gap:16px; } .hero { min-height:auto; padding-top:0; padding-bottom:110px; } .portrait { padding-bottom:125px; display:flex; flex-direction:column; } .portrait-intro { display:flex; flex-direction:column; align-items:flex-start; gap:24px; margin-top:24px; order:2; } .portrait-lead { margin:0; max-width:270px; color:var(--muted); font-family:"Playfair Display", Georgia, serif; font-size:27px; line-height:1.08; } .portrait-frame { width:100%; order:1; } .portrait-caption { position:static; margin-top:18px; font-size:30px; order:3; } .video-section { padding-bottom:110px; } .section-grid { grid-template-columns:1fr; gap:30px; } .about { padding-bottom:120px; } .statement { font-size:31px; } .names { margin-top:36px; } .concert { padding-bottom:110px; } .concert-date { font-size:43px; } .ticket-link { margin-top:24px; } .contact { padding-bottom:100px; } .contact-links { font-size:30px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
@media (max-width:340px) { .shell { width:calc(100% - 28px); } }
