/* ============================================================
   EL LAMBERT — identity & interface
   Type: Archivo (variable wdth/wght) + Fraunces (variable opsz/SOFT/WONK)
   ============================================================ */

:root{
  --ink:      #0B0B0C;
  --ink-2:    #121214;
  --ink-3:    #191A1C;
  --bone:     #F4F1EA;
  --bone-2:   rgba(244,241,234,.68);
  --bone-3:   rgba(244,241,234,.44);
  --brass:    #D9883A;
  --brass-lt: #F2B274;
  --line:     rgba(244,241,234,.13);
  --line-2:   rgba(244,241,234,.26);

  --sans:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  --serif:'Fraunces',Georgia,'Times New Roman',serif;

  --pad: clamp(1.25rem, 5vw, 6rem);
  --maxw: 1600px;
  --ease: cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  margin:0; background:var(--ink); color:var(--bone);
  font-family:var(--sans);
  font-variation-settings:'wdth' 100,'wght' 400;
  font-size:clamp(.95rem,.9rem + .2vw,1.0625rem);
  line-height:1.62; letter-spacing:.005em;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
ul,ol{margin:0; padding:0; list-style:none}
h1,h2,h3{margin:0; font-weight:400}
p{margin:0}
::selection{background:var(--brass); color:var(--ink)}

.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--brass);color:var(--ink);padding:.75rem 1.25rem;font-weight:700}
.skip:focus{left:1rem;top:1rem}
:focus-visible{outline:2px solid var(--brass); outline-offset:3px}

/* ---------- film grain ---------- */
.grain{
  position:fixed; inset:-50%; z-index:60; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 700ms steps(2,end) infinite;
}
@keyframes grain{0%{transform:translate(0,0)}50%{transform:translate(-2%,1.5%)}100%{transform:translate(1.5%,-1%)}}
@media (prefers-reduced-motion:reduce){.grain{animation:none}}

/* ---------- shared type ---------- */
.eyebrow{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.24em;
  font-variation-settings:'wdth' 88,'wght' 600;
  color:var(--bone-3); display:flex; align-items:center; gap:.6rem; margin-bottom:1.5rem;
}
.dot{width:5px;height:5px;border-radius:50%;background:var(--brass);flex:none;
  box-shadow:0 0 0 4px rgba(199,154,75,.18)}
.dot--brass{background:var(--brass)}

.display{
  font-family:var(--serif);
  font-variation-settings:'opsz' 144,'wght' 330,'SOFT' 20,'WONK' 1;
  font-size:clamp(2.1rem,1.3rem + 3.4vw,4.35rem);
  line-height:1.02; letter-spacing:-.022em;
}
.display em{
  font-style:italic; color:var(--brass);
  font-variation-settings:'opsz' 144,'wght' 300,'SOFT' 40,'WONK' 1;
}
.outline{
  font-family:var(--sans);
  font-variation-settings:'wdth' 118,'wght' 800;
  font-size:clamp(3rem,1rem + 11vw,10.5rem);
  line-height:.86; letter-spacing:-.035em; text-transform:uppercase;
  color:transparent; -webkit-text-stroke:1.4px var(--line-2);
}
.lede{
  font-size:clamp(1.0625rem,1rem + .45vw,1.32rem); line-height:1.55;
  color:var(--bone-2); max-width:46ch; letter-spacing:-.004em;
}
.lede--center{margin-inline:auto; text-align:center; max-width:62ch}

.sec__head{padding:0 var(--pad); margin-bottom:clamp(2.5rem,5vw,5rem)}
.sec__head--row{display:flex; flex-wrap:wrap; gap:2.5rem; justify-content:space-between; align-items:flex-end}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:1rem 1.9rem; border-radius:999px; border:1px solid transparent;
  font-size:.75rem; text-transform:uppercase; letter-spacing:.16em;
  font-variation-settings:'wdth' 92,'wght' 650;
  cursor:pointer; transition:.4s var(--ease); font-family:var(--sans);
}
.btn--solid{background:var(--brass); color:var(--ink)}
.btn--solid:hover{background:var(--brass-lt); transform:translateY(-2px)}
.btn--ghost{border-color:var(--line-2); color:var(--bone)}
.btn--ghost:hover{border-color:var(--bone); background:rgba(244,241,234,.05)}
.btn--spotify{background:var(--bone); color:var(--ink); margin-top:2rem}
.btn--spotify:hover{background:#fff; transform:translateY(-2px)}
.btn--full{width:100%; margin-top:.5rem}
.btn__icon{width:19px;height:19px;flex:none}
.btn__arrow{width:15px;height:15px;flex:none;transition:transform .4s var(--ease)}
.btn:hover .btn__arrow{transform:translate(2px,-2px)}

/* ============================================================ NAV */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:50;
  display:flex; align-items:center; justify-content:space-between; gap:1.5rem;
  padding:1.1rem var(--pad);
  transition:background .5s var(--ease),border-color .5s var(--ease),padding .5s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgba(11,11,12,.86); backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border-bottom-color:var(--line); padding-block:.8rem;
}
.brand{display:flex; align-items:center; gap:.75rem}
.brand__mark{width:38px;height:38px;flex:none;color:var(--bone);transition:transform .6s var(--ease)}
.brand:hover .brand__mark{transform:rotate(-14deg)}
.brand__type{display:flex;flex-direction:column;line-height:1.12}
.brand__name{
  font-variation-settings:'wdth' 108,'wght' 700;
  font-size:.8125rem; text-transform:uppercase; letter-spacing:.15em;
}
.brand__sub{
  font-size:.5625rem; letter-spacing:.26em; text-transform:uppercase;
  color:var(--bone-3); font-variation-settings:'wdth' 88,'wght' 500; margin-top:.18rem;
}
.nav__links{display:flex; gap:2.2rem}
.nav__links a{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.2em;
  font-variation-settings:'wdth' 90,'wght' 550;
  color:var(--bone-2); position:relative; padding-block:.4rem; transition:color .3s;
}
.nav__links a::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:0;
  background:var(--brass); transition:width .45s var(--ease);
}
.nav__links a:hover{color:var(--bone)}
.nav__links a:hover::after{width:100%}
.nav__cta{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.16em;
  font-variation-settings:'wdth' 90,'wght' 650;
  padding:.72rem 1.4rem; border:1px solid var(--line-2); border-radius:999px;
  transition:.4s var(--ease); white-space:nowrap;
}
.nav__cta:hover{background:var(--brass); border-color:var(--brass); color:var(--ink)}
.nav__toggle{display:none; background:none; border:0; cursor:pointer; padding:.5rem; width:42px}
.nav__toggle span{display:block; height:1.5px; background:var(--bone); margin:5px 0; transition:.35s var(--ease)}
.nav.is-open .nav__toggle span:nth-child(1){transform:translateY(3.2px) rotate(45deg)}
.nav.is-open .nav__toggle span:nth-child(2){transform:translateY(-3.2px) rotate(-45deg)}

/* ============================================================ HERO */
.hero{position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end;
  padding:7rem var(--pad) clamp(1.75rem,3.5vw,3rem); overflow:hidden}
.hero__media{position:absolute; inset:0; z-index:0}
.hero__media img{width:100%; height:100%; object-fit:cover; object-position:center 8%;
  animation:heroIn 2.4s var(--ease) both}
@keyframes heroIn{from{transform:scale(1.09); opacity:0}to{transform:scale(1); opacity:1}}
.hero::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg,rgba(11,11,12,.85) 0%,rgba(11,11,12,.15) 32%,rgba(11,11,12,.55) 62%,var(--ink) 97%),
    radial-gradient(120% 80% at 50% 35%,transparent 40%,rgba(11,11,12,.7) 100%);
}
.hero__inner{position:relative; z-index:2; width:100%; max-width:var(--maxw); margin-inline:auto}
.hero__eyebrow{margin-bottom:1.1rem}
.hero__title{
  font-family:var(--sans);
  font-variation-settings:'wdth' 122,'wght' 800;
  font-size:clamp(2.15rem,.35rem + 8.9vw,8.2rem);
  line-height:.88; letter-spacing:-.036em; text-transform:uppercase;
  display:flex; flex-direction:column;
}
.hero__title span{display:block; animation:riseIn 1.4s var(--ease) both}
.hero__title span:nth-child(2){animation-delay:.12s}
.hero__title em{
  font-family:var(--serif); font-style:italic; color:var(--brass);
  font-variation-settings:'opsz' 144,'wght' 300,'SOFT' 40,'WONK' 1;
  letter-spacing:-.01em; margin-left:.12em;
}
@keyframes riseIn{from{opacity:0; transform:translateY(.5em)}to{opacity:1; transform:none}}

.hero__foot{
  display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:2rem 3rem;
  align-items:end; margin-top:clamp(1.75rem,3.5vw,3rem);
  padding-top:clamp(1.5rem,3vw,2.25rem); border-top:1px solid var(--line);
  animation:riseIn 1.4s .28s var(--ease) both;
}
.hero__tag{
  font-family:var(--serif); font-style:italic;
  font-variation-settings:'opsz' 96,'wght' 330,'SOFT' 30,'WONK' 1;
  font-size:clamp(1.05rem,.9rem + .7vw,1.6rem); line-height:1.35;
  color:var(--bone); max-width:34ch; letter-spacing:-.012em;
}
.hero__roles{display:flex; flex-wrap:wrap; gap:.4rem .5rem; grid-column:1}
.hero__roles li{
  font-size:.625rem; text-transform:uppercase; letter-spacing:.18em;
  font-variation-settings:'wdth' 86,'wght' 550;
  color:var(--bone-3); border:1px solid var(--line); border-radius:999px; padding:.42rem .82rem;
}
.hero__actions{display:flex; flex-wrap:wrap; gap:.7rem; grid-column:2; grid-row:1/3; justify-content:flex-end}
.hero__badge{
  position:absolute; right:var(--pad); top:clamp(6rem,11vh,8.5rem); z-index:2;
  display:flex; align-items:center; gap:.7rem; text-align:left;
  font-size:.5625rem; text-transform:uppercase; letter-spacing:.2em; line-height:1.55;
  font-variation-settings:'wdth' 86,'wght' 500; color:var(--bone-3);
  animation:riseIn 1.4s .5s var(--ease) both;
}
.hero__badge b{color:var(--bone-2); font-variation-settings:'wdth' 86,'wght' 700}
.badge__mark{width:26px;height:19px;flex:none;color:var(--bone)}

/* ============================================================ MARQUEE */
.marquee{
  border-block:1px solid var(--line); background:var(--ink-2);
  padding:1.15rem 0; overflow:hidden; position:relative;
}
.marquee::before,.marquee::after{
  content:''; position:absolute; top:0; bottom:0; width:14vw; z-index:2; pointer-events:none;
}
.marquee::before{left:0; background:linear-gradient(90deg,var(--ink-2),transparent)}
.marquee::after{right:0; background:linear-gradient(270deg,var(--ink-2),transparent)}
.marquee__track{display:flex; width:max-content; animation:slide 62s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.marquee__track{animation:none}}
@keyframes slide{to{transform:translateX(-50%)}}
.marquee__set{display:flex; align-items:center; gap:1.6rem; padding-right:1.6rem}
.marquee__set span{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.2em; white-space:nowrap;
  font-variation-settings:'wdth' 92,'wght' 600; color:var(--bone-2);
}
.marquee__set i{color:var(--brass); font-size:.4rem; font-style:normal}

/* ============================================================ STORY */
.story{padding:clamp(5rem,10vw,10rem) var(--pad)}
.story__grid{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2.5rem,5vw,6rem);
  align-items:start;
}
.story__figure{margin:0; position:sticky; top:7rem}
.story__figure img{width:100%; aspect-ratio:4/5; object-fit:cover; filter:grayscale(.25) contrast(1.06)}
.story__figure figcaption{
  margin-top:1rem; font-size:.6875rem; text-transform:uppercase; letter-spacing:.16em;
  color:var(--bone-3); font-variation-settings:'wdth' 88,'wght' 500;
}
.story__body .lede{margin:1.75rem 0 clamp(2.5rem,5vw,4rem)}
.pillars{display:grid; gap:clamp(1.75rem,3vw,2.75rem)}
.pillars li{display:grid; grid-template-columns:auto 1fr; gap:1.25rem 1.5rem;
  padding-top:1.75rem; border-top:1px solid var(--line)}
.pillars__num{
  font-family:var(--serif); font-style:italic; color:var(--brass);
  font-variation-settings:'opsz' 48,'wght' 300,'WONK' 1;
  font-size:1.5rem; line-height:1;
}
.pillars h3{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.2em;
  font-variation-settings:'wdth' 92,'wght' 700; align-self:center;
}
.pillars p{grid-column:2; color:var(--bone-2); max-width:56ch}
.pillars em{font-style:italic; color:var(--bone)}

/* ============================================================ QUOTE */
.quote{padding:clamp(4rem,9vw,9rem) var(--pad); background:var(--ink-2); border-block:1px solid var(--line)}
.quote blockquote{max-width:24ch; margin-inline:auto; text-align:center}
.quote p{
  font-family:var(--serif); font-style:italic;
  font-variation-settings:'opsz' 144,'wght' 300,'SOFT' 40,'WONK' 1;
  font-size:clamp(1.6rem,1rem + 3vw,3.5rem); line-height:1.15; letter-spacing:-.022em;
}
.quote em{color:var(--brass)}
.quote cite{
  display:block; margin-top:2rem; font-style:normal;
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.24em;
  color:var(--bone-3); font-variation-settings:'wdth' 88,'wght' 600;
}

/* ============================================================ MUSIC */
.music{padding:clamp(5rem,10vw,10rem) 0}
.music .sec__head{display:flex; flex-direction:column-reverse; gap:1rem}
.music .eyebrow{margin:0}
.music__grid{
  max-width:var(--maxw); margin-inline:auto; padding:0 var(--pad);
  display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:clamp(2rem,4vw,4.5rem);
  align-items:start;
}
.release__art{position:relative; overflow:hidden}
.release__art img{width:100%; aspect-ratio:1; object-fit:cover; transition:transform 1.1s var(--ease)}
.release--feature:hover .release__art img{transform:scale(1.04)}
.release__flag{
  position:absolute; left:1.25rem; top:1.25rem; z-index:2;
  background:var(--brass); color:var(--ink); padding:.5rem 1rem; border-radius:999px;
  font-size:.625rem; text-transform:uppercase; letter-spacing:.16em;
  font-variation-settings:'wdth' 88,'wght' 700;
}
.release__title{
  font-family:var(--serif);
  font-variation-settings:'opsz' 144,'wght' 340,'SOFT' 20,'WONK' 1;
  font-size:clamp(2rem,1.2rem + 2.6vw,3.6rem); line-height:1.03; letter-spacing:-.024em;
  margin:1.75rem 0 1rem;
}
.release__title--sm{font-size:clamp(1.7rem,1.2rem + 1.8vw,2.6rem); margin-top:.75rem}
.release__note{color:var(--bone-2); max-width:48ch}
.release__status{
  display:flex; align-items:center; gap:.6rem; margin-top:1.5rem;
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.2em;
  font-variation-settings:'wdth' 88,'wght' 600; color:var(--brass);
}
.tracks{margin-top:2.25rem; border-top:1px solid var(--line)}
.tracks li{
  display:flex; align-items:baseline; gap:1.25rem;
  padding:.95rem .25rem; border-bottom:1px solid var(--line); transition:.35s var(--ease);
}
.tracks li:hover{padding-left:.9rem; background:rgba(244,241,234,.03)}
.tracks__n{
  font-family:var(--serif); font-style:italic; color:var(--brass); font-size:.9rem;
  font-variation-settings:'opsz' 24,'wght' 300,'WONK' 1; min-width:1.5rem;
}
.tracks__t{
  font-size:.9375rem; letter-spacing:.005em;
  font-variation-settings:'wdth' 100,'wght' 480;
}

/* ============================================================ EVENTS */
.events{position:relative; padding:clamp(5rem,10vw,10rem) 0; overflow:hidden; border-block:1px solid var(--line)}
.events__bg{position:absolute; inset:0; z-index:0}
.events__bg img{width:100%;height:100%;object-fit:cover; opacity:.22; filter:grayscale(.4)}
.events::after{content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,var(--ink) 0%,rgba(11,11,12,.72) 40%,rgba(11,11,12,.9) 100%)}
.events__inner{position:relative; z-index:2; max-width:var(--maxw); margin-inline:auto}
.events__blurb{color:var(--bone-2); max-width:34ch; font-size:.9375rem}
.events__blurb a{color:var(--brass); border-bottom:1px solid rgba(199,154,75,.4)}
.events__blurb a:hover{border-bottom-color:var(--brass)}

.ev-list{padding:0 var(--pad); border-top:1px solid var(--line-2)}
.ev-list li{border-bottom:1px solid var(--line)}
.ev{
  display:grid; grid-template-columns:4.5rem 8.5rem minmax(0,1.4fr) minmax(0,1fr) auto;
  gap:1rem 1.5rem; align-items:center; padding:1.65rem .5rem; transition:.45s var(--ease);
  position:relative;
}
.ev:hover{padding-left:1.4rem; background:rgba(244,241,234,.035)}
.ev__thumb{width:4.5rem; height:4.5rem; border-radius:6px; overflow:hidden; flex:none; background:var(--ink-2)}
.ev__thumb img{width:100%; height:100%; object-fit:cover; display:block}
.ev__date{
  font-variation-settings:'wdth' 100,'wght' 700; font-variant-numeric:tabular-nums;
  font-size:.8125rem; text-transform:uppercase; letter-spacing:.13em;
}
.ev__date b{display:block; color:var(--brass); font-size:1.9rem; letter-spacing:-.03em;
  font-variation-settings:'wdth' 112,'wght' 800; line-height:1; margin-bottom:.2rem}
.ev__title{
  font-family:var(--serif);
  font-variation-settings:'opsz' 72,'wght' 350,'SOFT' 20,'WONK' 1;
  font-size:clamp(1.15rem,1rem + .7vw,1.65rem); line-height:1.15; letter-spacing:-.018em;
}
.ev__venue{font-size:.8125rem; color:var(--bone-3); text-transform:uppercase; letter-spacing:.15em;
  font-variation-settings:'wdth' 88,'wght' 500}
.ev__cta{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.16em; white-space:nowrap;
  font-variation-settings:'wdth' 90,'wght' 650;
  border:1px solid var(--line-2); border-radius:999px; padding:.7rem 1.35rem;
  display:inline-flex; align-items:center; gap:.5rem; transition:.4s var(--ease);
}
.ev__cta:hover{background:var(--brass); border-color:var(--brass); color:var(--ink)}
.ev__cta--off{opacity:.4; pointer-events:none}
.ev-list--past .ev{padding-block:1.15rem; opacity:.55}
.ev-list--past .ev__date b{color:var(--bone-3); font-size:1.4rem}
.ev-past-wrap{margin-top:clamp(3rem,6vw,5rem); padding:0 var(--pad)}
.ev-past-wrap .ev-list{padding:0}
.ev-empty{padding:2.5rem var(--pad); color:var(--bone-3); font-size:.9375rem}
.ev-empty a{color:var(--brass)}

/* ============================================================ EXPERIENCE */
.exp{padding:clamp(5rem,10vw,10rem) 0}
.exp .sec__head{text-align:center; max-width:64rem; margin-inline:auto}
.exp .eyebrow{justify-content:center}
.exp .lede{margin-top:1.75rem}
.exp__grid{
  max-width:var(--maxw); margin-inline:auto; padding:0 var(--pad);
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line);
}
.card{background:var(--ink); padding:clamp(1.75rem,3vw,2.6rem); transition:.5s var(--ease)}
.card:hover{background:var(--ink-3)}
.card__n{
  font-family:var(--serif); font-style:italic; color:var(--brass); font-size:.9rem;
  font-variation-settings:'opsz' 24,'wght' 300,'WONK' 1; display:block; margin-bottom:1.75rem;
}
.card h3{
  font-size:.8125rem; text-transform:uppercase; letter-spacing:.17em; margin-bottom:.9rem;
  font-variation-settings:'wdth' 94,'wght' 700;
}
.card p{color:var(--bone-3); font-size:.9375rem; line-height:1.6}

.partners{max-width:var(--maxw); margin:clamp(3.5rem,7vw,6rem) auto 0; padding:0 var(--pad)}
.partners .eyebrow{justify-content:center; margin-bottom:2rem}
.partners ul{display:flex; flex-wrap:wrap; justify-content:center; gap:.6rem .5rem}
.partners li{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.15em;
  font-variation-settings:'wdth' 88,'wght' 550; color:var(--bone-3);
  border:1px solid var(--line); border-radius:999px; padding:.6rem 1.1rem; transition:.4s var(--ease);
}
.partners li:hover{color:var(--bone); border-color:var(--line-2)}

/* ============================================================ EDUCATION */
.edu{padding:clamp(5rem,10vw,10rem) var(--pad); background:var(--ink-2); border-block:1px solid var(--line)}
.edu__grid{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(2.5rem,5vw,6rem);
  align-items:center;
}
.edu .lede{margin:1.75rem 0 clamp(2.25rem,4vw,3.25rem)}
.edu__list{display:grid; gap:1.5rem}
.edu__list li{display:grid; gap:.4rem; padding-top:1.5rem; border-top:1px solid var(--line)}
.edu__list b{
  font-size:.75rem; text-transform:uppercase; letter-spacing:.18em;
  font-variation-settings:'wdth' 92,'wght' 700;
}
.edu__list span{color:var(--bone-3); font-size:.9375rem}
.edu__figure{margin:0}
.edu__figure img{width:100%; aspect-ratio:3/2; object-fit:cover; filter:grayscale(.2) contrast(1.05)}

/* ============================================================ BOOKING */
.booking{padding:clamp(5rem,10vw,10rem) var(--pad)}
.booking__grid{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(2.5rem,5vw,6rem);
  align-items:start;
}
.booking .lede{margin-top:1.75rem}
.booking__facts{margin:clamp(2.5rem,5vw,3.5rem) 0 2.5rem; display:grid; gap:1.25rem}
.booking__facts>div{display:grid; grid-template-columns:7rem 1fr; gap:1rem;
  padding-top:1.25rem; border-top:1px solid var(--line)}
.booking__facts dt{
  font-size:.625rem; text-transform:uppercase; letter-spacing:.2em; color:var(--bone-3);
  font-variation-settings:'wdth' 88,'wght' 600; padding-top:.15rem;
}
.booking__facts dd{margin:0; font-size:.9375rem}
.booking__facts a{color:var(--brass); border-bottom:1px solid rgba(199,154,75,.35)}
.booking__facts a:hover{border-bottom-color:var(--brass)}
.socials{display:flex; flex-wrap:wrap; gap:.6rem}
.socials a{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.16em;
  font-variation-settings:'wdth' 90,'wght' 600;
  border:1px solid var(--line-2); border-radius:999px; padding:.7rem 1.2rem; transition:.4s var(--ease);
}
.socials a:hover{background:var(--bone); color:var(--ink); border-color:var(--bone)}

.form{border:1px solid var(--line); padding:clamp(1.5rem,3vw,2.75rem); background:var(--ink-2)}
.form__row{display:grid; grid-template-columns:1fr 1fr; gap:1rem}
.field{display:grid; gap:.5rem; margin-bottom:1.15rem}
.field>span{
  font-size:.625rem; text-transform:uppercase; letter-spacing:.2em; color:var(--bone-3);
  font-variation-settings:'wdth' 88,'wght' 600;
}
.field input,.field select,.field textarea{
  background:var(--ink); border:1px solid var(--line); color:var(--bone);
  padding:.9rem 1rem; font-family:var(--sans); font-size:.9375rem;
  border-radius:0; transition:.35s var(--ease); width:100%;
}
.field select{appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23C79A4B' stroke-width='1.6'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem}
.field textarea{resize:vertical; min-height:7rem}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--brass); background:var(--ink-3)}
.field input::placeholder,.field textarea::placeholder{color:var(--bone-3)}
.form__note{margin-top:1.25rem; font-size:.75rem; color:var(--bone-3); text-align:center}
.form__note a{color:var(--brass)}

/* ============================================================ FOOTER */
.foot{border-top:1px solid var(--line); padding:clamp(3rem,6vw,5rem) var(--pad) 2rem}
.foot__top{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:auto 1fr auto; gap:2.5rem 3rem; align-items:center;
}
.brand--foot .brand__mark{width:46px;height:46px}
.foot__credo{
  font-family:var(--serif); font-style:italic; text-align:center;
  font-variation-settings:'opsz' 72,'wght' 320,'SOFT' 30,'WONK' 1;
  font-size:clamp(.95rem,.85rem + .5vw,1.3rem); line-height:1.4; color:var(--bone-2);
  letter-spacing:-.01em;
}
.foot__credo em{color:var(--brass)}
.foot__nav{display:flex; flex-wrap:wrap; gap:1.25rem; justify-content:flex-end}
.foot__nav a{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.17em; color:var(--bone-3);
  font-variation-settings:'wdth' 88,'wght' 550; transition:color .3s;
}
.foot__nav a:hover{color:var(--brass)}
.foot__bar{
  max-width:var(--maxw); margin:clamp(2.5rem,5vw,4rem) auto 0; padding-top:1.5rem;
  border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:center;
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.15em; color:var(--bone-3);
  font-variation-settings:'wdth' 88,'wght' 500;
}
.foot__3p{display:inline-flex; align-items:center; gap:.6rem}

/* ============================================================ REVEAL */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .95s var(--ease),transform .95s var(--ease)}
.reveal.is-in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* ============================================================ RESPONSIVE */
@media (max-width:1100px){
  .nav__links{display:none}
  .nav__toggle{display:block; order:3}
  .nav__cta{order:2}
  .nav.is-open .nav__links{
    display:flex; flex-direction:column; gap:.25rem; order:4; width:100%;
    padding:1.5rem 0 .5rem; border-top:1px solid var(--line); margin-top:1rem;
  }
  .nav.is-open{background:rgba(11,11,12,.97); backdrop-filter:blur(18px); flex-wrap:wrap}
  .nav.is-open .nav__links a{font-size:1rem; letter-spacing:.14em; padding-block:.75rem}
  .story__grid,.edu__grid,.booking__grid,.music__grid{grid-template-columns:1fr}
  .story__figure{position:static; max-width:30rem}
  .edu__figure{order:-1}
  .ev{grid-template-columns:6.5rem 1fr; gap:.5rem 1.5rem}
  .ev__thumb{display:none}
  .ev__venue{grid-column:2}
  .ev__cta{grid-column:2; justify-self:start; margin-top:.5rem}
  .ev__date b{font-size:1.6rem}
  .exp__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .hero{min-height:92svh; padding-top:7rem}
  .hero__foot{grid-template-columns:1fr; gap:1.5rem}
  .hero__actions{grid-column:1; grid-row:auto; justify-content:flex-start}
  .hero__badge{display:none}
  .hero__media img{object-position:center 5%}
  .form__row{grid-template-columns:1fr; gap:0}
  .foot__top{grid-template-columns:1fr; text-align:center; justify-items:center}
  .foot__nav{justify-content:center}
  .foot__bar{justify-content:center; text-align:center}
  .quote blockquote{max-width:100%}
  .btn{padding:.9rem 1.5rem}
  .exp__grid{grid-template-columns:1fr}
}

/* ---------- experience banner ---------- */
.exp__banner{
  margin:0 0 clamp(2.5rem,5vw,4.5rem); padding:0 var(--pad);
  max-width:var(--maxw); margin-inline:auto;
}
.exp__banner img{
  width:100%; aspect-ratio:21/9; object-fit:cover;
  filter:grayscale(.3) contrast(1.05);
}
.exp__banner figcaption{
  margin-top:1rem; text-align:center;
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.18em;
  color:var(--bone-3); font-variation-settings:'wdth' 88,'wght' 500;
}
@media (max-width:760px){ .exp__banner img{aspect-ratio:16/9} }

/* ---------- mobile nav fit ---------- */
@media (max-width:760px){
  .brand__mark{width:32px;height:32px}
  .brand__name{font-size:.75rem; white-space:nowrap; letter-spacing:.12em}
  .brand__sub{white-space:nowrap}
  .nav{gap:.75rem}
}
@media (max-width:560px){
  .nav__cta{display:none}
}

/* ---------- mobile hero legibility ---------- */
@media (max-width:760px){
  .hero::after{
    background:linear-gradient(180deg,
      rgba(11,11,12,.82) 0%,
      rgba(11,11,12,.22) 20%,
      rgba(11,11,12,.72) 46%,
      rgba(11,11,12,.94) 74%,
      var(--ink) 97%);
  }
}

/* ============================================================
   EL LAMBERT — site components
   ============================================================ */

/* ---------- interior page header ---------- */
.page-head{padding:clamp(8rem,14vw,10.5rem) var(--pad) 0}

/* ---------- gallery grid ---------- */
.gallery{padding:clamp(3rem,6vw,5rem) var(--pad) clamp(5rem,10vw,9rem)}
.gallery__grid{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:.6rem;
}
.gallery__item{position:relative; display:block; overflow:hidden; aspect-ratio:4/5; background:var(--ink-2)}
.gallery__item img{width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease), filter .8s var(--ease); filter:grayscale(.15) contrast(1.04)}
.gallery__item:hover img{transform:scale(1.06); filter:none}
.gallery__item::after{
  content:attr(data-cap); position:absolute; left:0; right:0; bottom:0; padding:.9rem 1rem .8rem;
  background:linear-gradient(0deg,rgba(11,11,12,.88),transparent);
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.14em; color:var(--bone-2);
  font-variation-settings:'wdth' 88,'wght' 550;
  opacity:0; transform:translateY(6px); transition:.4s var(--ease);
}
.gallery__item:hover::after{opacity:1; transform:none}

/* ---------- song list ---------- */
.songs{padding:clamp(3rem,6vw,5rem) var(--pad) clamp(5rem,10vw,9rem)}
.songs__group{max-width:var(--maxw); margin:0 auto clamp(3rem,6vw,4.5rem)}
.songs__group h2{
  font-family:var(--serif); font-variation-settings:'opsz' 96,'wght' 340,'SOFT' 20,'WONK' 1;
  font-size:clamp(1.5rem,1.1rem + 1.6vw,2.2rem); letter-spacing:-.02em; margin-bottom:.5rem;
}
.songs__group h3{
  margin:2rem 0 1rem; font-size:.75rem; text-transform:uppercase; letter-spacing:.2em; color:var(--brass);
  font-variation-settings:'wdth' 90,'wght' 700;
}
.songs__cols{columns:3 220px; column-gap:2.5rem}
.songs__cols li{
  break-inside:avoid; padding:.55rem 0; border-bottom:1px solid var(--line);
  font-size:.875rem; color:var(--bone-2); line-height:1.5;
}
.songs__cols li b{color:var(--bone); font-variation-settings:'wdth' 100,'wght' 550}
@media (max-width:760px){ .songs__cols{columns:1} }

/* ---------- paired news/support cards ---------- */
.news-pair__grid{
  max-width:56rem; margin-inline:auto;
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(1.25rem,3vw,2rem);
}
.news-pair__grid .news__inner{margin-inline:0; max-width:none; height:100%}
.news-pair__grid .news__title{font-size:clamp(1.6rem,1rem + 2.2vw,2.5rem)}
.news-pair__grid .news__form button{white-space:nowrap}
@media (max-width:820px){
  .news-pair__grid{grid-template-columns:1fr; gap:1.5rem}
}

/* ---------- performance footage ---------- */
.videos{padding:clamp(3rem,6vw,5rem) var(--pad) clamp(5rem,10vw,8rem)}
.videos__grid{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5rem;
}
.videos__grid iframe{width:100%; aspect-ratio:16/9; border:0; display:block; background:var(--ink-2)}

/* ---------- info page (funerals / overview text) ---------- */
.info{padding:clamp(3rem,6vw,5rem) var(--pad)}
.info__inner{max-width:52rem; margin-inline:auto}
.info__inner h2{
  font-family:var(--serif); font-variation-settings:'opsz' 96,'wght' 340,'SOFT' 20,'WONK' 1;
  font-size:clamp(1.4rem,1.1rem + 1.2vw,2rem); letter-spacing:-.02em; margin:2.5rem 0 1rem;
}
.info__inner h2:first-child{margin-top:0}
.info__inner p{color:var(--bone-2); max-width:66ch}
.info__inner p + p{margin-top:1rem}
.info__inner b{color:var(--bone); font-variation-settings:'wdth' 100,'wght' 600}

/* ---------- brand lockup ---------- */
.brand__name--el b{font-variation-settings:'wdth' 108,'wght' 700; color:var(--bone)}
.brand__name--el i{font-style:normal; color:var(--brass); font-variation-settings:'wdth' 108,'wght' 700}

/* ---------- hero wordmark ---------- */
.hero__wordmark{
  display:flex; flex-direction:column; line-height:.86;
  animation:riseIn 1.4s var(--ease) both;
}
.hero__wordmark span{
  font-family:var(--sans);
  font-variation-settings:'wdth' 122,'wght' 800;
  font-size:clamp(2.3rem,.4rem + 9.4vw,8.6rem);
  letter-spacing:-.036em; text-transform:uppercase;
}
.hero__wordmark em{
  font-family:var(--serif); font-style:italic; color:var(--brass);
  font-variation-settings:'opsz' 144,'wght' 300,'SOFT' 40,'WONK' 1;
  font-size:clamp(1.9rem,.3rem + 7.6vw,7rem);
  letter-spacing:-.02em; margin-top:.04em;
}
.hero__rule{
  display:flex; align-items:center; gap:1.1rem; margin-top:1.6rem;
  animation:riseIn 1.4s .16s var(--ease) both;
}
.hero__rule::before,.hero__rule::after{content:''; height:1px; background:var(--line-2); flex:1; max-width:7rem}
.hero__rule span{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.24em; white-space:nowrap;
  font-variation-settings:'wdth' 88,'wght' 600; color:var(--bone-3);
}

/* ---------- script-style section eyebrow ---------- */
.script{
  font-family:var(--serif); font-style:italic; text-transform:none;
  font-variation-settings:'opsz' 48,'wght' 350,'SOFT' 50,'WONK' 1;
  font-size:1.35rem; letter-spacing:-.01em; color:var(--brass);
  display:block; margin-bottom:.5rem;
}
.sec__head .script + .display,.sec__head .script + .outline{margin-top:0}

/* ---------- founder teaser ---------- */
.founder{
  padding:clamp(5rem,10vw,10rem) var(--pad);
  background:var(--ink-2); border-block:1px solid var(--line);
}
.founder__grid{
  max-width:var(--maxw); margin-inline:auto;
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(2.5rem,5vw,6rem); align-items:center;
}
.founder__figure{margin:0; position:relative}
.founder__figure img{width:100%; aspect-ratio:4/5; object-fit:cover; filter:grayscale(.15) contrast(1.05)}
.founder__tag{
  position:absolute; left:0; bottom:0; background:var(--brass); color:var(--ink);
  padding:.65rem 1.15rem; font-size:.625rem; text-transform:uppercase; letter-spacing:.18em;
  font-variation-settings:'wdth' 88,'wght' 700;
}
.founder__quote{
  font-family:var(--serif); font-style:italic;
  font-variation-settings:'opsz' 96,'wght' 320,'SOFT' 40,'WONK' 1;
  font-size:clamp(1.1rem,.95rem + .8vw,1.7rem); line-height:1.35;
  color:var(--bone-2); margin:2rem 0; letter-spacing:-.012em; max-width:38ch;
}
.founder__cred{display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:2.25rem}
.founder__cred li{
  font-size:.625rem; text-transform:uppercase; letter-spacing:.16em;
  font-variation-settings:'wdth' 86,'wght' 550; color:var(--bone-3);
  border:1px solid var(--line); border-radius:999px; padding:.42rem .85rem;
}

/* ---------- newsletter ---------- */
.news{padding:clamp(5rem,10vw,10rem) var(--pad); position:relative; overflow:hidden}
.news__inner{
  max-width:56rem; margin-inline:auto; text-align:center; position:relative; z-index:2;
  border:1px solid var(--line-2); padding:clamp(2rem,5vw,4.5rem) clamp(1.25rem,4vw,3.5rem);
  background:var(--ink-2);
}
.news__mark{width:44px;height:32px;color:var(--bone); margin:0 auto 1.5rem}
.news__title{
  font-family:var(--sans); font-variation-settings:'wdth' 118,'wght' 800;
  font-size:clamp(1.9rem,1rem + 3.4vw,4rem); line-height:.95;
  letter-spacing:-.03em; text-transform:uppercase;
}
.news__sub{
  margin-top:.9rem; font-size:.6875rem; text-transform:uppercase; letter-spacing:.34em;
  font-variation-settings:'wdth' 88,'wght' 600; color:var(--brass);
}
.news__copy{margin:1.75rem auto 2.25rem; color:var(--bone-2); max-width:48ch; font-size:.9375rem}
.news__form{display:flex; gap:.6rem; max-width:30rem; margin-inline:auto}
.news__form input{
  flex:1; background:var(--ink); border:1px solid var(--line); color:var(--bone);
  padding:.95rem 1.1rem; font-family:var(--sans); font-size:.9375rem; transition:.35s var(--ease);
}
.news__form input:focus{outline:none; border-color:var(--brass); background:var(--ink-3)}
.news__form input::placeholder{color:var(--bone-3)}
.news__note{margin-top:1.1rem; font-size:.6875rem; color:var(--bone-3)}

/* ---------- now playing ---------- */
.nowplaying{
  position:fixed; right:1.25rem; bottom:1.25rem; z-index:55;
  display:flex; align-items:center; gap:.85rem;
  background:rgba(11,11,12,.92); backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid var(--line-2); border-radius:999px; padding:.55rem .65rem .55rem 1rem;
  box-shadow:0 12px 40px rgba(0,0,0,.5);
  transform:translateY(150%); transition:transform .8s var(--ease);
}
.nowplaying.is-in{transform:none}
.nowplaying__eq{display:flex; align-items:flex-end; gap:2px; height:15px; width:16px; flex:none}
.nowplaying__eq i{display:block; width:3px; background:var(--brass); height:30%; border-radius:1px}
.nowplaying.is-playing .nowplaying__eq i{animation:eq .9s ease-in-out infinite}
.nowplaying.is-playing .nowplaying__eq i:nth-child(2){animation-delay:.18s}
.nowplaying.is-playing .nowplaying__eq i:nth-child(3){animation-delay:.36s}
.nowplaying.is-playing .nowplaying__eq i:nth-child(4){animation-delay:.09s}
@keyframes eq{0%,100%{height:25%}50%{height:100%}}
.nowplaying__meta{display:flex; flex-direction:column; line-height:1.25}
.nowplaying__meta small{
  font-size:.5rem; text-transform:uppercase; letter-spacing:.22em; color:var(--bone-3);
  font-variation-settings:'wdth' 86,'wght' 500;
}
.nowplaying__meta b{
  font-size:.6875rem; text-transform:uppercase; letter-spacing:.13em;
  font-variation-settings:'wdth' 92,'wght' 700;
}
.nowplaying__btn{
  width:34px;height:34px;border-radius:50%;border:0;cursor:pointer;flex:none;
  background:var(--brass); color:var(--ink);
  display:grid; place-items:center; transition:.35s var(--ease);
}
.nowplaying__btn:hover{background:var(--brass-lt)}
.nowplaying__btn svg{width:13px;height:13px}
@media (max-width:760px){ .nowplaying{right:.75rem; bottom:.75rem; padding:.5rem .55rem .5rem .85rem} }
@media (prefers-reduced-motion:reduce){.nowplaying.is-playing .nowplaying__eq i{animation:none}}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .founder__grid{grid-template-columns:1fr}
  .founder__figure{max-width:26rem}
}
@media (max-width:760px){
  .news__form{flex-direction:column}
  .hero__rule::before{display:none}
}

/* ---------- wider pull quote for longer lines ---------- */
.quote--wide blockquote{max-width:42ch}
@media (max-width:760px){ .quote--wide blockquote{max-width:100%} }

/* [hidden] must beat class-based display rules (.gate, .pbar, .nowplaying, .pstate) */
[hidden]{display:none !important}
