/* =========================================================
   Amsterdam Sushi Club - ADE 2026
   Editorial scrolling microsite
   ========================================================= */

:root {
  /* Palette */
  --paper:      #FBFAF6;
  --paper-2:    #F7F5EF;
  --canvas:     #F3F0E8;
  --stone:      #B8B3AA;
  --rule:       #C9C3B6;
  --ink:        #111111;
  --charcoal:   #2C2B29;
  --soot:       #1B1A18;
  --warm-white: #FAF8F3;
  --champagne:  #C7A86B;
  --champagne-d:#9F8345;
  --ade-yellow: #FFE500;

  /* Type */
  --serif: "Cormorant Garamond", "Libre Baskerville", Georgia, serif;
  --sans:  "Inter", "Helvetica Neue", Arial, sans-serif;

  /* Scale (compact, editorial) */
  --fs-mini:   .68rem;   /* small caps labels */
  --fs-cap:    .78rem;   /* captions */
  --fs-body:   1.02rem;  /* body */
  --fs-lede:   1.18rem;
  --fs-h3:     1.65rem;
  --fs-h2:     clamp(2.4rem, 4.6vw, 4.2rem);
  --fs-hero:   clamp(2.8rem, 6.4vw, 6.4rem);

  /* Spacing */
  --pad-x:    clamp(1.4rem, 4vw, 4.5rem);
  --pad-y:    clamp(4.5rem, 8vw, 9rem);
  --maxw:     1280px;

  /* Motion */
  --ease:     cubic-bezier(.22,.61,.36,1);
  --dur:      .9s;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
html:focus-within{ scroll-padding-top:96px; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:var(--fs-body);
  line-height:1.6;
  font-weight:400;
  letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.is-locked{
  overflow:hidden;
}

/* =========================================================
   Password gate
   ========================================================= */
.gate{
  position:fixed;
  inset:0;
  z-index:1000;
  display:grid;
  place-items:center;
  padding:1.5rem;
  background:
    radial-gradient(ellipse at 50% 30%, #FFFFFF 0%, var(--paper) 56%, var(--paper-2) 100%);
  color:var(--ink);
  transition:opacity .6s var(--ease), visibility .6s var(--ease);
}
.gate::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.20;
  background-image:
    radial-gradient(circle at 17% 22%, rgba(120,108,86,.10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 63% 71%, rgba(120,108,86,.08) 0 1px, transparent 1.5px);
  background-size: 140px 140px, 220px 220px;
}
.gate::after{
  display:none;
}
.gate.is-open{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.gate__panel{
  position:relative;
  z-index:2;
  width:min(520px, 100%);
  text-align:center;
}
.logo--gate{
  width:min(360px, 78vw);
  margin:0 auto 1rem;
}
.gate__eyebrow,
.gate__label{
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--charcoal);
}
.gate__title{
  margin:.2rem 0 1.4rem;
  font-family:var(--serif);
  font-size:clamp(2.6rem, 8vw, 5.8rem);
  font-weight:400;
  line-height:.95;
}
.gate__form{
  display:grid;
  grid-template-columns:1fr auto;
  gap:.75rem;
  align-items:end;
  max-width:390px;
  margin:0 auto;
  text-align:left;
}
.gate__label{
  grid-column:1 / -1;
  margin-left:.1rem;
}
.gate__input{
  min-height:48px;
  border:1px solid color-mix(in srgb, var(--ink) 62%, transparent);
  background:rgba(255,255,255,.55);
  color:var(--ink);
  padding:.8rem 1rem;
  font:inherit;
  outline:none;
}
.gate__input:focus{
  border-color:var(--ink);
}
.gate__button{
  min-height:48px;
  border:1px solid var(--ink);
  background:var(--ink);
  color:var(--warm-white);
  padding:.8rem 1.2rem;
  font-size:var(--fs-mini);
  letter-spacing:.22em;
  text-transform:uppercase;
  cursor:pointer;
}
.gate__error{
  grid-column:1 / -1;
  min-height:1.2em;
  margin:.1rem 0 0;
  color:#7c2d2d;
  font-size:var(--fs-cap);
}
@media (max-width:520px){
  .gate__form{ grid-template-columns:1fr; }
}

/* Subtle paper grain on body */
body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  z-index:1;
  opacity:.35;
  mix-blend-mode:multiply;
  background-image:
    radial-gradient(circle at 17% 22%, rgba(120,108,86,.06) 0 1px, transparent 1.5px),
    radial-gradient(circle at 63% 71%, rgba(120,108,86,.05) 0 1px, transparent 1.5px),
    radial-gradient(circle at 81% 13%, rgba(120,108,86,.05) 0 1px, transparent 1.5px),
    radial-gradient(circle at 42% 88%, rgba(120,108,86,.05) 0 1px, transparent 1.5px);
  background-size: 140px 140px, 180px 180px, 220px 220px, 260px 260px;
}

a{ color:inherit; text-decoration:none; }
figure{ margin:0; }
img{ max-width:100%; display:block; }

::selection{ background:var(--ink); color:var(--warm-white); }

/* =========================================================
   Progress bar
   ========================================================= */
.progress{
  position:fixed; top:0; left:0; right:0;
  height:1.5px;
  background:transparent;
  z-index:60;
}
.progress span{
  display:block; height:100%;
  width:0;
  background:linear-gradient(90deg, var(--ink), var(--champagne));
  transition:width .12s linear;
}

/* =========================================================
   Nav
   ========================================================= */
.nav{
  display:none;
}
.nav.is-scrolled{
  border-bottom-color: color-mix(in srgb, var(--ink) 8%, transparent);
}
.nav.on-dark{
  background: color-mix(in srgb, var(--soot) 78%, transparent);
  color:var(--warm-white);
}
.nav__mark{ display:flex; align-items:center; }
.nav__links{
  display:none; gap:1.6rem;
  font-size:var(--fs-mini);
  letter-spacing:.16em;
  text-transform:uppercase;
}
.nav__links a{
  position:relative;
  padding:.3rem 0;
  opacity:.72;
  transition: opacity .25s var(--ease);
}
.nav__links a::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s var(--ease);
}
.nav__links a:hover{ opacity:1; }
.nav__links a:hover::after,
.nav__links a.is-active::after{ transform:scaleX(1); }
.nav__links a.is-active{ opacity:1; }
.nav__meta{
  font-size:var(--fs-mini);
  letter-spacing:.22em;
  text-transform:uppercase;
  opacity:.65;
}
@media (max-width:900px){
  .nav__links{ display:none; }
}

/* =========================================================
   Logo (SVG)
   ========================================================= */
.logo{ display:block; }
.logo--sm{ width:200px; height:auto; color:currentColor; }
.official-logo{
  display:block;
  height:auto;
  object-fit:contain;
}
.official-logo--nav{
  width:122px;
  max-height:54px;
  object-fit:contain;
}
.official-logo--gate{
  width:min(320px, 72vw);
  margin:0 auto 1.2rem;
}
.nav.nav--dark .official-logo--nav{
  filter:none;
  opacity:.84;
}
.official-logo--record{
  width:58%;
  max-height:42%;
  margin:-1.15rem auto .95rem;
  position:relative;
  z-index:2;
}
.official-logo--closing{
  width:min(48vw, 360px);
  margin:0 auto;
}
.closing-logo-card{
  width:min(64vw, 440px);
  margin:2rem auto .6rem;
  background:transparent;
  padding:0;
  box-shadow:none;
}
.logo--hero{
  width:min(72vw, 560px);
  margin: 0 auto 2.2rem;
  color:var(--ink);
}
.logo--closing{
  width:min(72vw, 520px);
  margin: 3rem auto 1.4rem;
  color:var(--warm-white);
}
.logo__arch{
  font-family:var(--serif);
  font-size:11px;
  letter-spacing:.55em;
  font-weight:500;
}
.logo__arch--lg{ font-size:16px; letter-spacing:.55em; }
.logo__base{
  font-family:var(--serif);
  font-size:22px;
  letter-spacing:.18em;
  font-weight:500;
  font-variant:small-caps;
}
.logo__base--lg{ font-size:54px; letter-spacing:.14em; }
.logo__nav-city{
  font-family:var(--sans);
  font-size:9px;
  letter-spacing:.36em;
  font-weight:500;
}
.logo__nav-base{
  font-family:var(--serif);
  font-size:20px;
  letter-spacing:.12em;
  font-weight:500;
}

/* draw-in for hero logo */
.reveal-line{
  stroke-dasharray: 220;
  stroke-dashoffset: 220;
  animation: drawIn 1.4s var(--ease) .35s forwards;
}
@keyframes drawIn{ to{ stroke-dashoffset:0; } }

/* =========================================================
   Hero
   ========================================================= */
.hero{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex; flex-direction:column;
  padding: 3rem var(--pad-x) 2.4rem;
  overflow:hidden;
  isolation:isolate;
}
.hero__paper{
  position:absolute; inset:0;
  z-index:-2;
  background:
    radial-gradient(ellipse at 50% 30%, #FFFFFF 0%, var(--paper) 55%, var(--paper-2) 100%);
}
.hero__ink{
  display:none;
}
.hero__inner{
  position:relative;
  flex:1;
  display:flex; flex-direction:column;
  justify-content:space-between;
  max-width:var(--maxw);
  width:100%;
  margin:0 auto;
}
.hero__top, .hero__bottom{
  display:flex; justify-content:space-between; align-items:flex-end;
  gap:1rem;
}
.eyebrow{
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--charcoal);
  opacity:.7;
}
.eyebrow--right{ text-align:right; }

.hero__center{
  flex:1;
  display:flex; flex-direction:column;
  justify-content:center; align-items:center;
  text-align:center;
  padding: 3rem 0;
}
.hero-logo-card{
  width:min(520px, 78vw);
  margin:0 auto 1.8rem;
  background:transparent;
  padding:0;
  box-shadow:none;
}
.hero-logo-card img{
  display:block;
  width:100%;
  height:auto;
}
.hero__title--static{
  margin-top:0;
  font-size:clamp(3.4rem, 8vw, 7.2rem);
  line-height:.94;
}
.hero-record{
  width:min(58vh, 560px, 82vw);
  aspect-ratio:1;
  position:relative;
  margin:0 auto 1.5rem;
  filter: drop-shadow(0 28px 42px rgba(17,17,17,.18));
}
.hero-record__disc{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 8.5%, rgba(0,0,0,.08) 8.7% 9.2%, transparent 9.4%),
    repeating-radial-gradient(circle at 50% 50%,
      #161511 0 2px,
      #1f1e1a 2px 3px,
      #11100e 3px 5px,
      #24221e 5px 6px),
    radial-gradient(circle at 38% 30%, rgba(255,255,255,.16), transparent 18%),
    radial-gradient(circle at center, #191814, #080807 72%);
  animation: recordSpin 12s linear infinite;
}
.hero-record__disc::before{
  content:"";
  position:absolute;
  inset:3.2%;
  border-radius:50%;
  border:1px solid rgba(250,248,243,.10);
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.38),
    inset 0 0 42px rgba(255,255,255,.05);
}
.hero-record__disc::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:
    linear-gradient(112deg, transparent 0 42%, rgba(255,255,255,.14) 48%, transparent 54%),
    radial-gradient(circle at 28% 20%, rgba(255,255,255,.12), transparent 22%);
  mix-blend-mode:screen;
  pointer-events:none;
}
.hero-record__label{
  position:absolute;
  inset:24%;
  border-radius:50%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.2rem;
  padding:2rem;
  color:var(--ink);
  background:
    radial-gradient(circle at 50% 50%, #FFFFFF 0%, #FBFAF6 58%, #F2EFE7 100%);
  border:1px solid rgba(17,17,17,.22);
  box-shadow:
    inset 0 0 0 8px rgba(244,241,234,.34),
    inset 0 0 0 9px rgba(17,17,17,.08),
    0 0 20px rgba(0,0,0,.24);
  text-align:center;
}
.hero-record__label::after{
  content:"";
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--soot);
  opacity:.82;
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
.logo--record{
  width:58%;
  margin:0 auto .25rem;
}
.logo--record .logo__arch--lg{ font-size:24px; letter-spacing:.38em; }
.logo--record .logo__base--lg{ font-size:58px; letter-spacing:.12em; }
.hero-record__title{
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(1.35rem, 3.1vw, 2.35rem);
  line-height:.98;
  margin:.1rem 0 0;
}
.hero-record__title span{
  display:block;
}
.hero-record__title span:first-child{
  font-style:italic;
}
@keyframes recordSpin{
  to{ transform:rotate(360deg); }
}
.hero__title{
  font-family:var(--serif);
  font-weight:400;
  font-size:var(--fs-hero);
  line-height:1.02;
  letter-spacing:-.005em;
  margin: 0 auto;
  max-width:18ch;
}
.hero__title .italic{ font-style:italic; }
.hero__title .serif{ font-family:var(--serif); }

.hero__sub{
  max-width: 56ch;
  margin: 1.6rem auto 0;
  color:var(--charcoal);
  font-size:var(--fs-lede);
  line-height:1.55;
  font-weight:300;
}
@media (max-width:700px){
  .hero-record{ width:min(72vw, 420px); }
  .hero-record__label{ inset:22%; padding:1.2rem; }
  .hero__sub{ font-size:1rem; }
}

.lockup{
  display:flex; flex-direction:column; gap:.5rem;
  font-size:var(--fs-mini);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--charcoal);
}
.lockup > span:first-child{ opacity:.6; }
.lockup__row{
  display:flex; gap:.7rem; align-items:center;
  font-family:var(--serif);
  font-size:1.05rem;
  letter-spacing:.16em;
  text-transform:none;
}
.lockup__name{ font-variant:small-caps; letter-spacing:.2em; }
.lockup__logo{
  width:104px;
  height:30px;
  display:flex;
  align-items:center;
  opacity:.82;
  transform:translateY(-1px);
}
.lockup__logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:none;
}
.lockup__name--ade{
  color:var(--ink);
  background:transparent;
  border:1px solid color-mix(in srgb, var(--ink) 30%, transparent);
  padding: .05em .55em;
  letter-spacing:.22em;
}
.lockup__dot{
  width:4px; height:4px; border-radius:50%;
  background:var(--charcoal);
  opacity:.55;
}

.scroll-hint{
  display:none; flex-direction:column; align-items:center;
  gap:.6rem;
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--charcoal);
  opacity:.7;
  animation: floaty 2.6s ease-in-out infinite;
}
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(4px);} }

@media (max-width:600px){
  .hero{ padding-top:5.5rem; }
  .hero__bottom{ flex-direction:column; align-items:flex-start; gap:2rem; }
}

/* =========================================================
   Sections
   ========================================================= */
.section{
  position:relative;
  padding: var(--pad-y) var(--pad-x);
  max-width:100%;
  overflow:hidden;
}
.section > *{ max-width:var(--maxw); margin-left:auto; margin-right:auto; }

.section--ivory{
  background:var(--canvas);
}
.section--dark{
  background:var(--soot);
  color:var(--warm-white);
}
.section--dark .section__deck,
.section--dark .copycol p,
.section--dark .lede{
  color: color-mix(in srgb, var(--warm-white) 82%, transparent);
}
.section--dark a{ color:var(--warm-white); }
.section--dark .folio{ color:var(--stone); }

.section__head{
  display:grid;
  grid-template-columns: 1fr;
  gap:.9rem;
  margin-bottom: 3rem;
}
.folio{
  font-family:var(--sans);
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--charcoal);
  opacity:.7;
  display:inline-flex; align-items:center; gap:.8rem;
}
.folio::before{
  content:"";
  width:32px; height:1px;
  background:currentColor;
  opacity:.6;
}
.section__title{
  font-family:var(--serif);
  font-weight:400;
  font-size:var(--fs-h2);
  line-height:1.04;
  letter-spacing:-.005em;
  margin:0;
  max-width:24ch;
}
.section__title em{ font-style:italic; font-weight:400; }
.section__deck{
  font-size:var(--fs-lede);
  max-width:60ch;
  color: color-mix(in srgb, currentColor 75%, transparent);
  margin:.4rem 0 0;
  font-weight:300;
}

/* Reveal on scroll */
.reveal{
  opacity:1;
  transform:none;
  transition: opacity 1s var(--ease), transform 1s var(--ease);
}
.reveal.is-in{ opacity:1; transform:none; }

/* =========================================================
   Grids
   ========================================================= */
.grid{ display:grid; gap: clamp(2rem, 4vw, 4rem); }
.grid--intro{ grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items:start; }
.grid--two{ grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); align-items:start; }
.grid--invites{ grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); align-items:center; }
@media (max-width: 900px){
  .grid--intro, .grid--two, .grid--invites{ grid-template-columns:1fr; }
}

.copycol p{ margin: 0 0 1.1rem; max-width:60ch; }
.copycol a{
  border-bottom:1px solid color-mix(in srgb, currentColor 30%, transparent);
  transition: border-color .25s var(--ease);
}
.copycol a:hover{ border-bottom-color:currentColor; }

.lede{
  font-family:var(--serif);
  font-size:clamp(1.3rem, 2vw, 1.7rem);
  line-height:1.4;
  font-weight:400;
  margin-bottom:1.6rem !important;
  max-width:34ch !important;
  font-style:italic;
}
.muted{ color: color-mix(in srgb, currentColor 70%, transparent); }
.emph{ font-family:var(--serif); font-size:1.25rem; font-style:italic; max-width:46ch; }

/* =========================================================
   Cultural proof wall
   ========================================================= */
.section--proof{
  background:
    radial-gradient(ellipse at 74% 18%, rgba(199,168,107,.10), transparent 42%),
    linear-gradient(180deg, #11100E 0%, #171512 100%);
}
.section__head--proof{
  max-width:900px;
}
.proof-wall{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: minmax(190px, 19vw);
  grid-auto-flow:dense;
  gap:1px;
  background: color-mix(in srgb, var(--warm-white) 18%, transparent);
  border:1px solid color-mix(in srgb, var(--warm-white) 18%, transparent);
  box-shadow:0 36px 72px -56px rgba(0,0,0,.9);
}
.proof-tile{
  position:relative;
  overflow:hidden;
  background:var(--charcoal);
  min-height:0;
}
.proof-tile--large{
  grid-column:span 2;
  grid-row:span 2;
}
.proof-tile--wide{
  grid-column:span 2;
}
.proof-tile img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(.88) contrast(1.04) brightness(.76);
  transform:scale(1.01);
  transition: transform 1.2s var(--ease), filter .7s var(--ease);
}
.proof-tile--beach img{
  object-position:center center;
}
.proof-tile--erewhon{
  background:#E8E2D8;
  grid-column:span 2;
}
.proof-tile--erewhon img{
  object-fit:contain;
  object-position:center center;
  padding:5%;
  background:#E8E2D8;
}
.proof-tile--erewhon::after{
  display:none;
}
.proof-tile:hover img{
  transform:scale(1.045);
  filter:grayscale(.44) contrast(1.05) brightness(.9);
}
.proof-tile::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.72) 100%),
    radial-gradient(ellipse at 50% 10%, rgba(244,241,234,.12), transparent 46%);
  pointer-events:none;
}
.proof-tile figcaption{
  display:none;
}
.brand-proof{
  margin-top:2.4rem;
  border-top:1px solid color-mix(in srgb, var(--warm-white) 18%, transparent);
  padding-top:1.4rem;
}
.brand-proof__label{
  display:block;
  margin-bottom:1rem;
  color:var(--champagne);
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
}
.brand-strip{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:1px;
  background: color-mix(in srgb, var(--warm-white) 16%, transparent);
  border:1px solid color-mix(in srgb, var(--warm-white) 16%, transparent);
}
.brand-strip span{
  display:grid;
  place-items:center;
  min-height:82px;
  background:rgba(250,248,243,.055);
  color:var(--warm-white);
  font-family:var(--serif);
  font-size:clamp(1.25rem, 2vw, 1.75rem);
  letter-spacing:.08em;
  text-align:center;
}
@media (max-width:900px){
  .proof-wall{ grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows:220px; }
  .proof-tile--large,.proof-tile--wide{ grid-column:span 2; grid-row:span 1; }
  .brand-strip{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width:560px){
  .proof-wall{ grid-template-columns:1fr; }
  .proof-tile,.proof-tile--large,.proof-tile--wide{ grid-column:1; }
  .brand-strip{ grid-template-columns:1fr; }
}

/* =========================================================
   Soundtrack / Spotify integration
   ========================================================= */
.section--soundtrack{
  background:
    radial-gradient(ellipse at 14% 16%, rgba(199,168,107,.13), transparent 34%),
    linear-gradient(180deg, var(--paper) 0%, var(--canvas) 100%);
}
.sound-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(340px,.82fr);
  gap:clamp(2rem,5vw,5rem);
  align-items:start;
}
.sound-copy p{
  max-width:58ch;
}
.sound-points{
  list-style:none;
  padding:0;
  margin:2rem 0 0;
  border-top:1px solid var(--rule);
}
.sound-points li{
  position:relative;
  padding:1rem 0 1rem 2rem;
  border-bottom:1px solid var(--rule);
  color:var(--charcoal);
}
.sound-points li::before{
  content:"";
  position:absolute;
  left:.2rem;
  top:1.42rem;
  width:.52rem;
  height:.52rem;
  border-radius:50%;
  background:var(--champagne);
  box-shadow:0 0 0 6px color-mix(in srgb, var(--champagne) 14%, transparent);
}
.spotify-card{
  position:relative;
  padding:1rem;
  background:
    linear-gradient(180deg, rgba(250,248,243,.72), rgba(232,226,216,.72));
  border:1px solid var(--rule);
  box-shadow:0 30px 70px -56px rgba(17,17,17,.62);
}
.spotify-card::before{
  content:"";
  position:absolute;
  inset:-18px -18px auto auto;
  width:110px;
  height:110px;
  border-radius:50%;
  border:1px solid color-mix(in srgb, var(--ink) 16%, transparent);
  opacity:.34;
  pointer-events:none;
}
.spotify-card__label{
  margin:0 0 .85rem;
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--champagne-d);
}
.spotify-card iframe{
  display:block;
  border:0;
  background:var(--soot);
}
@media (max-width:900px){
  .sound-grid{ grid-template-columns:1fr; }
}

/* Cities sidebar */
.cities{
  border-left:1px solid var(--rule);
  padding-left: 1.6rem;
}
.cities__label{
  display:block;
  font-size:var(--fs-mini);
  letter-spacing:.28em;
  text-transform:uppercase;
  color:var(--charcoal);
  opacity:.65;
  margin-bottom: 1rem;
}
.cities__list{
  list-style:none;
  margin:0; padding:0;
  font-family:var(--serif);
  font-size:1.15rem;
  line-height:1.9;
  font-variant:small-caps;
  letter-spacing:.08em;
}
.cities__current{
  color:var(--ink);
  font-style:italic;
  font-variant:normal;
  letter-spacing:.02em;
}
.cities__current span{
  font-family:var(--sans);
  font-size:.75rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--champagne-d);
  margin-left:.4rem;
}

/* =========================================================
   Menu card
   ========================================================= */
.omakase-grid{
  display:grid;
  grid-template-columns: minmax(260px, .85fr) minmax(320px, 1.15fr);
  gap: clamp(1.8rem, 4vw, 4rem);
  align-items:center;
}
.omakase-grid--single{
  grid-template-columns:1fr;
}
.omakase-grid--single .menucard__paper{
  max-width:720px;
}
.official-menu-frame{
  display:flex;
  justify-content:center;
  margin:0 auto;
}
.official-menu-frame img{
  display:block;
  width:min(520px, 92vw);
  height:auto;
  background:#fff;
  box-shadow:0 34px 70px -42px rgba(0,0,0,.75);
}
.menu-note{
  max-width:720px;
  margin:1.2rem auto 0;
  color: color-mix(in srgb, var(--warm-white) 62%, transparent);
  font-size:var(--fs-cap);
  letter-spacing:.08em;
  text-align:center;
}
#gifting .menu-note{
  color: color-mix(in srgb, var(--charcoal) 82%, transparent);
}
.gifting-disclaimer{
  margin-top:.5rem;
}
.menucard{
  display:flex; justify-content:center;
  perspective: 1200px;
}
.menucard__paper{
  position:relative;
  width:min(560px, 100%);
  background: linear-gradient(180deg, #FBF7EC 0%, #F2EBDA 100%);
  color:var(--ink);
  padding: 4rem 3rem;
  border-radius: 2px;
  box-shadow:
    0 30px 60px -30px rgba(0,0,0,.55),
    0 4px 18px -8px rgba(0,0,0,.35);
  text-align:center;
  transform: rotate(-.4deg);
}
.menucard__paper::before{
  /* paper edge / deckle */
  content:"";
  position:absolute; inset: 12px;
  border:1px solid rgba(17,17,17,.18);
  pointer-events:none;
}
.menucard__crest{
  width:46px; height:46px;
  margin: 0 auto 1.2rem;
  color:var(--ink);
}
.menucard__title{
  font-family:var(--serif);
  font-size:1.7rem;
  letter-spacing:.04em;
  margin: 0 0 .3rem;
}
.menucard__sub{
  font-size:var(--fs-mini);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--charcoal);
  margin: 0 0 2.2rem;
}
.menucard__list{
  list-style:none;
  margin:0; padding:0;
  display:flex; flex-direction:column; gap:.7rem;
}
.menucard__list li{
  display:grid;
  grid-template-columns: 2rem 1fr;
  align-items:baseline;
  font-family:var(--serif);
  font-size:1.15rem;
  text-align:left;
  padding-bottom:.55rem;
  border-bottom:1px dotted rgba(17,17,17,.18);
}
.menucard__list .num{
  font-size:.7rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color: var(--champagne-d);
}
.menucard__footer{
  margin-top: 2rem;
  font-family:var(--serif);
  font-size:.95rem;
  color:var(--charcoal);
}
.italic{ font-style:italic; }

@media (max-width:600px){
  .menucard__paper{ padding: 2.6rem 1.4rem; }
  .menucard__list li{ font-size:1rem; }
}
@media (max-width:900px){
  .omakase-grid{ grid-template-columns:1fr; }
}

/* =========================================================
   Editorial photo panels
   ========================================================= */
.photo-panel{
  position:relative;
  overflow:hidden;
  border:1px solid color-mix(in srgb, currentColor 16%, transparent);
  background:var(--canvas);
  box-shadow: 0 28px 52px -42px rgba(0,0,0,.68);
}
.photo-panel img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter: grayscale(.92) contrast(1.04) brightness(.92);
  transform:scale(1.01);
}
.photo-panel::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(17,17,17,0) 45%, rgba(17,17,17,.36) 100%),
    radial-gradient(ellipse at 30% 15%, rgba(244,241,234,.14), transparent 45%);
  pointer-events:none;
}
.photo-panel figcaption,
.venue__visual figcaption,
.act__media figcaption{
  display:none;
}
.photo-panel--tall{
  aspect-ratio: 4 / 5.3;
  max-height: 690px;
}
.photo-panel--nobu{
  aspect-ratio: 4 / 5;
  max-width: 480px;
  justify-self:center;
}
.intro-founder-image{
  margin:1.4rem 0 1.6rem;
  overflow:hidden;
  border:1px solid var(--rule);
  aspect-ratio:16/9;
  background:var(--canvas);
}
.intro-founder-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(.88) contrast(1.05) brightness(.9);
}
.mh-logo-lockup{
  width:min(320px, 72vw);
  margin:0 0 2rem;
  padding:1rem 0 1.25rem;
  border-bottom:1px solid var(--rule);
}
.mh-logo-lockup img{
  width:100%;
  height:auto;
  display:block;
  opacity:.9;
}
.founder-inline{
  position:relative;
  margin-top:2rem;
  overflow:hidden;
  border:1px solid var(--rule);
  aspect-ratio: 16 / 9;
  background:var(--canvas);
}
.founder-inline img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(.88) contrast(1.04) brightness(.92);
}
.founder-inline::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(17,17,17,0) 38%, rgba(17,17,17,.58) 100%);
  pointer-events:none;
}
.founder-inline figcaption{
  display:none;
}

/* =========================================================
   Stats
   ========================================================= */
.statscol{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: color-mix(in srgb, currentColor 14%, transparent);
  border: 1px solid color-mix(in srgb, currentColor 14%, transparent);
}
.stat{
  background: var(--paper);
  padding: 1.6rem 1.4rem;
  display:flex; flex-direction:column; gap:.4rem;
}
.stat--accent{
  grid-column: 1 / -1;
  background: var(--soot);
  color: var(--warm-white);
}
.stat__num{
  font-family:var(--serif);
  font-size: clamp(2.2rem, 4vw, 3.4rem);
  line-height:1;
  letter-spacing:-.01em;
}
.stat__num small{ font-size:.5em; vertical-align:.6em; letter-spacing:0; }
.stat__label{
  font-size:var(--fs-mini);
  letter-spacing:.24em;
  text-transform:uppercase;
  opacity:.7;
}

/* Pullquote */
.pullquote{
  margin: 4rem auto 0;
  max-width: 28ch;
  font-family:var(--serif);
  font-style:italic;
  font-size: clamp(1.7rem, 3.5vw, 2.6rem);
  line-height:1.25;
  text-align:center;
  position:relative;
}
.quotemark{
  display:block;
  font-family:var(--serif);
  font-size:5rem;
  line-height:.6;
  color:var(--champagne);
  margin-bottom:.4rem;
}

/* =========================================================
   Pillars (Milk & Honey)
   ========================================================= */
.pillars{
  display:flex; flex-direction:column;
  border-top:1px solid var(--rule);
}
.pillar{
  display:grid;
  grid-template-columns: 6rem 1fr;
  gap:1rem;
  padding: 1.1rem 0;
  border-bottom:1px solid var(--rule);
}
.pillar__k{
  font-family:var(--serif);
  font-style:italic;
  font-size:1.05rem;
  color: var(--charcoal);
}
.pillar__v{ color: var(--charcoal); font-size:.98rem; }

/* =========================================================
   Nobu
   ========================================================= */
.nobu{
  display:grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr);
  gap: clamp(2rem, 5vw, 5rem);
  align-items:center;
}
.nobu__plate{
  position:relative;
  aspect-ratio: 1 / 1;
  width:100%;
  max-width: 460px;
  margin: 0 auto;
}
.plate{
  position:absolute; inset:0;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%, #FBF7EC 0%, #ECE5D2 55%, #D9CFB6 100%);
  box-shadow:
    inset 0 4px 24px rgba(0,0,0,.06),
    0 30px 50px -30px rgba(0,0,0,.35);
}
.plate__rings{
  position:absolute; inset:8%;
  border-radius:50%;
  border: 1px solid rgba(17,17,17,.10);
  box-shadow:
    inset 0 0 0 1px rgba(17,17,17,.04),
    inset 0 0 60px rgba(17,17,17,.05);
}
.plate__rings::after{
  content:"";
  position:absolute; inset: 14%;
  border-radius:50%;
  border:1px solid rgba(17,17,17,.08);
}
.plate__chops{
  position:absolute; inset:30%;
  color: var(--charcoal);
  opacity:.85;
}
@media (max-width:900px){
  .nobu{ grid-template-columns:1fr; }
  .nobu__plate{ max-width:320px; }
  .photo-panel--nobu{ max-width:100%; }
}

/* =========================================================
   The Evening - Act I / Act II
   ========================================================= */
.acts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: 1px;
  background: color-mix(in srgb, var(--warm-white) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--warm-white) 12%, transparent);
  margin-bottom: 4rem;
}
@media (max-width:900px){ .acts{ grid-template-columns:1fr; } }
.act{
  background: var(--soot);
  padding: 2.6rem 2rem;
  display:flex; flex-direction:column;
  position:relative;
  overflow:hidden;
  min-height: 520px;
}
.act__head{
  display:grid;
  grid-template-columns: auto 1fr auto;
  align-items:baseline;
  gap:1rem;
  margin-bottom: 1.5rem;
  padding-bottom: 1.2rem;
  border-bottom: 1px solid color-mix(in srgb, var(--warm-white) 14%, transparent);
}
.act__roman{
  font-family:var(--serif);
  font-size:2.4rem;
  line-height:1;
  color:var(--champagne);
}
.act__title{
  font-family:var(--serif);
  font-weight:400;
  font-size:1.65rem;
  letter-spacing:.005em;
  margin:0;
}
.act__cap{
  font-size:var(--fs-mini);
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--stone);
}
.act p{ color: color-mix(in srgb, var(--warm-white) 78%, transparent); max-width:48ch; }
.act__media{
  position:relative;
  margin-top:auto;
  aspect-ratio: 16 / 9;
  overflow:hidden;
  border:1px solid color-mix(in srgb, var(--warm-white) 14%, transparent);
  background:var(--charcoal);
  box-shadow: 0 26px 45px -34px rgba(0,0,0,.9);
}
.act__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter: grayscale(.55) contrast(1.02) brightness(.82);
}
.act__media::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 42%, rgba(0,0,0,.72) 100%);
  pointer-events:none;
}

/* Visual: dinner table top-down */
.act__art{
  margin-top:auto;
  position:relative;
  height:240px;
  overflow:hidden;
  border-top:1px solid color-mix(in srgb, var(--warm-white) 14%, transparent);
}
.act__art img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 46%;
  filter:grayscale(.72) contrast(1.04) brightness(.8);
}
.act__art::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 34%, rgba(0,0,0,.64) 100%);
  pointer-events:none;
}
.act__art--dinner .table{
  position:absolute; left:0; right:0; bottom: 20px;
  height: 6px;
  background: linear-gradient(180deg, #c4b58a 0%, #8a7a4f 100%);
  border-radius: 2px;
  opacity:.5;
}
.act__art--dinner .candles{
  position:absolute; left:0; right:0; bottom: 26px;
  display:flex; justify-content:space-around;
}
.act__art--dinner .candles span{
  display:block;
  width:6px; height:50px;
  background: linear-gradient(180deg, rgba(255,229,180,.9), rgba(199,168,107,.2));
  border-radius:3px;
  position:relative;
  filter: blur(.2px);
  animation: flicker 3.4s ease-in-out infinite;
}
.act__art--dinner .candles span::before{
  content:"";
  position:absolute; top:-8px; left:50%; transform:translateX(-50%);
  width:8px; height:10px;
  background: radial-gradient(circle, #FFE5A0 0%, rgba(255,229,160,.0) 70%);
  border-radius:50%;
}
.act__art--dinner .candles span:nth-child(2){ animation-delay:.4s; height:40px; }
.act__art--dinner .candles span:nth-child(3){ animation-delay:.9s; height:56px; }
.act__art--dinner .candles span:nth-child(4){ animation-delay:.2s; height:44px; }
.act__art--dinner .candles span:nth-child(5){ animation-delay:.7s; height:50px; }
@keyframes flicker{
  0%,100%{ opacity:.85; }
  40%{ opacity:.65; }
  70%{ opacity:.95; }
}

/* Visual: vinyl + waveform */
.act__art--hifi{ height: 180px; display:flex; align-items:center; gap:1.5rem; }
.vinyl{
  position:relative;
  width:140px; height:140px;
  border-radius:50%;
  background:
    repeating-radial-gradient(circle at center,
      #161512 0 2px,
      #1f1d1a 2px 3px),
    radial-gradient(circle at center, #161512, #0d0c0a);
  flex:0 0 auto;
  animation: spin 14s linear infinite;
  box-shadow: 0 10px 30px -10px rgba(0,0,0,.7);
}
.vinyl__core{
  position:absolute; top:50%; left:50%;
  width:42px; height:42px;
  border-radius:50%;
  background: var(--champagne);
  transform: translate(-50%,-50%);
}
.vinyl__core::after{
  content:""; position:absolute; top:50%; left:50%;
  width:4px; height:4px; background:var(--soot);
  border-radius:50%;
  transform: translate(-50%,-50%);
}
@keyframes spin{ to{ transform: rotate(360deg);} }
.bars{
  flex:1;
  display:flex; align-items:center; gap:6px;
  height:80px;
}
.bars span{
  flex:1;
  background: linear-gradient(180deg, var(--champagne), color-mix(in srgb, var(--champagne) 40%, transparent));
  border-radius:1px;
  animation: bar 1.6s ease-in-out infinite;
  transform-origin:center;
}
.bars span:nth-child(1){ height:30%; animation-delay:.0s; }
.bars span:nth-child(2){ height:70%; animation-delay:.1s; }
.bars span:nth-child(3){ height:45%; animation-delay:.25s; }
.bars span:nth-child(4){ height:90%; animation-delay:.05s; }
.bars span:nth-child(5){ height:55%; animation-delay:.35s; }
.bars span:nth-child(6){ height:75%; animation-delay:.15s; }
.bars span:nth-child(7){ height:40%; animation-delay:.45s; }
@keyframes bar{
  0%,100%{ transform: scaleY(.7); }
  50%{ transform: scaleY(1); }
}

/* Schedule */
.schedule{
  display:grid;
  grid-template-columns: 12rem 1fr;
  gap: clamp(1rem, 3vw, 3rem);
  padding-top: 2rem;
  border-top:1px solid color-mix(in srgb, var(--warm-white) 14%, transparent);
}
.schedule__label{
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--stone);
}
.schedule__list{
  list-style:none; margin:0; padding:0;
}
.schedule__list li{
  display:grid;
  grid-template-columns: 7rem 1fr;
  gap:1.5rem;
  align-items:baseline;
  padding: .7rem 0;
  border-bottom:1px dotted color-mix(in srgb, var(--warm-white) 18%, transparent);
}
.schedule__list time{
  font-family:var(--serif);
  font-size:1.15rem;
  color:var(--champagne);
  letter-spacing:.04em;
}
@media (max-width: 700px){ .schedule{ grid-template-columns:1fr; } .schedule__list li{ grid-template-columns: 6rem 1fr; gap:1rem; } }

/* =========================================================
   Venues
   ========================================================= */
.venues{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: clamp(1.4rem, 2.4vw, 2.4rem);
}
.venue{
  display:flex; flex-direction:column; gap:1rem;
}
.venue__visual{
  aspect-ratio: 4 / 5;
  background: var(--canvas);
  position:relative;
  overflow:hidden;
  border:1px solid var(--rule);
  transition: transform .9s var(--ease);
}
.venue:hover .venue__visual{ transform: translateY(-4px); }
.venue__visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter: grayscale(.82) contrast(1.04) brightness(.9);
  transition: transform 1.2s var(--ease), filter .8s var(--ease);
}
.venue:hover .venue__visual img{
  transform:scale(1.045);
  filter: grayscale(.55) contrast(1.04) brightness(.96);
}
.venue__visual::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(17,17,17,0) 30%, rgba(17,17,17,.42) 100%),
    radial-gradient(ellipse at 50% 10%, rgba(244,241,234,.12), transparent 48%);
  pointer-events:none;
}

/* Each venue gets a distinct CSS illustration */
/* RIJKSMUSEUM - twin tower silhouette */
.venue__visual--rijks{
  background:
    linear-gradient(180deg, #E4DED1 0%, #D6CFBE 100%);
}
.venue__visual--rijks::before{
  content:"";
  position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:80%; height:75%;
  background:
    /* central archway */
    radial-gradient(ellipse at 50% 100%, rgba(17,17,17,.35) 0 12%, transparent 13%),
    /* roof line */
    linear-gradient(180deg, transparent 0 18%, rgba(17,17,17,.65) 18% 22%, transparent 22%),
    /* body */
    linear-gradient(180deg, rgba(17,17,17,.55) 22%, rgba(17,17,17,.7) 100%);
  clip-path: polygon(
    0% 100%,
    0% 35%,
    8% 30%, 8% 12%, 18% 12%, 18% 30%,
    35% 30%, 35% 20%, 50% 14%, 65% 20%, 65% 30%,
    82% 30%, 82% 12%, 92% 12%, 92% 30%,
    100% 35%, 100% 100%
  );
}
.venue__visual--rijks::after{
  content:""; position:absolute; left:50%; top:64%; transform:translateX(-50%);
  width:14%; height:30%;
  background: rgba(17,17,17,.55);
  border-radius: 50% 50% 0 0 / 90% 90% 0 0;
}

/* A'DAM TOWER - tall slab + skyline */
.venue__visual--adam{
  background:
    linear-gradient(180deg, #2b2a27 0%, #3b3833 60%, #5a544b 100%);
}
.venue__visual--adam::before{
  content:"";
  position:absolute; left:50%; bottom:8%; transform:translateX(-50%);
  width: 22%; height:78%;
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.4));
  box-shadow:
    -90px 100px 0 -10px rgba(255,255,255,.15),
    90px 80px 0 -10px rgba(255,255,255,.18);
}
.venue__visual--adam::after{
  content:"";
  position:absolute; left:0; right:0; bottom:0;
  height: 8%;
  background: linear-gradient(180deg, rgba(0,0,0,.4), rgba(0,0,0,.7));
}

/* CONSERVATORIUM HOTEL - arched portico */
.venue__visual--conserv{
  background: linear-gradient(180deg, #EFE9DA 0%, #DCD3BD 100%);
}
.venue__visual--conserv::before{
  content:"";
  position:absolute; inset: 14% 18%;
  background:
    radial-gradient(ellipse at 16% 100%, rgba(17,17,17,.55) 0 22%, transparent 23%),
    radial-gradient(ellipse at 50% 100%, rgba(17,17,17,.55) 0 22%, transparent 23%),
    radial-gradient(ellipse at 84% 100%, rgba(17,17,17,.55) 0 22%, transparent 23%),
    linear-gradient(180deg, transparent 70%, rgba(17,17,17,.25) 100%);
  border-top: 1px solid rgba(17,17,17,.3);
}
.venue__visual--conserv::after{
  content:"";
  position:absolute; left:10%; right:10%; top:12%;
  height: 4px;
  background: rgba(17,17,17,.4);
}

/* VAN GOGH - single sweep brushstroke */
.venue__visual--vangogh{
  background:
    radial-gradient(circle at 30% 20%, #f1d97f 0 8%, transparent 12%),
    linear-gradient(180deg, #2d2b6e 0%, #143055 50%, #0e2440 100%);
}
.venue__visual--vangogh::before{
  content:"";
  position:absolute; inset: 0;
  background:
    repeating-linear-gradient(115deg,
      rgba(255,255,255,.05) 0 6px,
      transparent 6px 12px),
    repeating-linear-gradient(80deg,
      rgba(255,200,80,.06) 0 5px,
      transparent 5px 14px);
  mix-blend-mode: screen;
}
.venue__visual--vangogh::after{
  content:""; position:absolute; left:15%; right:15%; bottom:18%;
  height: 10%;
  background: linear-gradient(180deg, rgba(255,255,255,.25), rgba(255,255,255,.05));
  filter: blur(8px);
  border-radius: 50%;
}

/* NXT - light grid / digital */
.venue__visual--nxt{
  background: #0e0d0c;
}
.venue__visual--nxt::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, transparent 0 40%, rgba(199,168,107,.18) 60%, transparent 100%),
    repeating-linear-gradient(0deg,
      rgba(255,255,255,.08) 0 1px,
      transparent 1px 14px),
    repeating-linear-gradient(90deg,
      rgba(255,255,255,.06) 0 1px,
      transparent 1px 18px);
  transform: perspective(400px) rotateX(60deg) translateY(20%);
  transform-origin: 50% 80%;
}
.venue__visual--nxt::after{
  content:"";
  position:absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 30%, rgba(255,229,0,.06), transparent 60%);
}

.venue__name{
  font-family:var(--serif);
  font-size:var(--fs-h3);
  font-weight:400;
  margin: 0;
  letter-spacing:.005em;
}
.venue__why{
  font-size:.95rem;
  color: var(--charcoal);
  margin: 0;
}

/* =========================================================
   Invites
   ========================================================= */
.invitecard{
  display:flex; justify-content:center;
}
.invitecard--official{
  flex-direction:column;
  align-items:center;
  gap:1rem;
}
.official-invite-frame{
  margin:0;
  width:min(470px,100%);
}
.official-invite-frame img{
  display:block;
  width:100%;
  height:auto;
  box-shadow:0 28px 55px -38px rgba(0,0,0,.55);
}
.invite-disclaimer{
  max-width:34ch;
  margin:0 auto;
  text-align:center;
  color: color-mix(in srgb, var(--charcoal) 62%, transparent);
  font-size:var(--fs-cap);
  letter-spacing:.05em;
}
.invitecard__paper{
  position:relative;
  width: min(380px, 100%);
  aspect-ratio: 5 / 7;
  background:
    linear-gradient(180deg, #FBF6E7 0%, #ECE3CC 100%);
  padding: 2.2rem 1.8rem;
  text-align:center;
  display:flex; flex-direction:column; align-items:center; justify-content:space-between;
  box-shadow:
    0 26px 40px -28px rgba(0,0,0,.55),
    0 2px 8px -4px rgba(0,0,0,.3);
  transform: rotate(-1deg);
  color: var(--ink);
}
.invitecard__paper::before{
  content:"";
  position:absolute; inset:10px;
  border:1px solid rgba(17,17,17,.18);
}
.invitecard__seal{
  width:74px; height:74px;
  color:var(--ink);
  opacity:.85;
}
.invitecard__from{
  font-family:var(--serif);
  font-size:.7rem;
  letter-spacing:.35em;
  margin: 0;
  color: var(--charcoal);
}
.invitecard__line{
  font-family:var(--serif);
  font-style:italic;
  font-size:1.4rem;
  line-height:1.3;
  margin:.4rem 0 0;
}
.invitecard__line--small{ font-size:.95rem; color:var(--charcoal); }
.invitecard__date{
  font-family:var(--serif);
  font-size:1.7rem;
  letter-spacing:.18em;
  margin:.6rem 0 0;
}
.invitecard__rsvp{
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--charcoal);
  margin:0;
}

.universelabel{
  margin-top: 2rem !important;
  font-size:var(--fs-mini);
  letter-spacing:.3em;
  text-transform:uppercase;
  color:var(--charcoal);
  border-top:1px solid var(--rule);
  padding-top:1.4rem;
}
.universe{
  font-family:var(--serif);
  font-size: clamp(1.35rem, 2.3vw, 1.85rem);
  line-height:1.7;
  color:var(--charcoal);
  max-width:100% !important;
}
.universe-intro{
  margin:.6rem 0 .3rem !important;
  color: color-mix(in srgb, var(--charcoal) 78%, transparent);
  font-size:.95rem;
  letter-spacing:.04em;
}
.universe--secondary{
  font-size:.98rem;
  color: color-mix(in srgb, var(--charcoal) 75%, transparent);
}
.universe--note{
  font-size:.78rem;
  line-height:1.45;
  max-width:58ch;
  color: color-mix(in srgb, var(--charcoal) 64%, transparent);
}
.talent-strip{
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap:1px;
  margin-top: clamp(2rem, 5vw, 4rem);
  background:var(--rule);
  border:1px solid var(--rule);
}
.talent-card{
  position:relative;
  min-height: clamp(260px, 32vw, 430px);
  overflow:hidden;
  background:var(--soot);
}
.talent-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter: grayscale(.88) contrast(1.05) brightness(.78);
  transition: transform 1.1s var(--ease), filter .8s var(--ease);
}
.talent-card:hover img{
  transform:scale(1.035);
  filter: grayscale(.58) contrast(1.08) brightness(.88);
}
.talent-card::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,0) 28%, rgba(0,0,0,.76) 100%);
  pointer-events:none;
}
.talent-card span{
  position:absolute;
  left:.85rem;
  right:.85rem;
  bottom:.85rem;
  z-index:3;
  display:block;
  color:var(--warm-white);
  font-family:var(--serif);
  font-size:clamp(1.05rem, 1.45vw, 1.45rem);
  letter-spacing:.02em;
  text-shadow:0 1px 10px rgba(0,0,0,.75);
}
@media (max-width:800px){
  .talent-strip{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .talent-card{ min-height:280px; }
}

/* =========================================================
   Gifts
   ========================================================= */
.gifts{
  list-style:none; padding:0; margin:0 0 3rem;
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0;
  border-top:1px solid var(--rule);
  border-left:1px solid var(--rule);
}
.gift{
  display:grid;
  grid-template-columns: 3rem 1fr;
  align-items:center;
  gap:.6rem;
  padding: 1.2rem 1.2rem;
  border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  min-height: 84px;
  background: var(--paper);
  transition: background .25s var(--ease);
}
.gift:hover{ background: var(--paper-2); }
.gift__num{
  font-family:var(--serif);
  font-style:italic;
  font-size:1.05rem;
  color: var(--champagne-d);
}
.gift__name{
  font-family:var(--serif);
  font-size:1.1rem;
  letter-spacing:.005em;
}

.principle{
  font-family:var(--serif);
  font-size:1.05rem;
  max-width:62ch;
  font-style:italic;
  color:var(--charcoal);
  margin:0 0 2rem;
}
.principle__label{
  font-style:normal;
  font-family:var(--sans);
  font-size:.72rem;
  letter-spacing:.3em;
  text-transform:uppercase;
  margin-right:.6rem;
  color:var(--champagne-d);
}
.product-strip{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  margin-top:2.2rem;
  background:var(--rule);
  border:1px solid var(--rule);
}
.product-strip figure{
  position:relative;
  overflow:hidden;
  aspect-ratio:4/5;
  background:var(--canvas);
}
.product-strip img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(.76) contrast(1.04) brightness(.94);
  transition:transform 1s var(--ease), filter .7s var(--ease);
}
.product-strip__wide{
  grid-column:span 1;
}
.product-strip__erewhon{
  background:#E8E2D8;
}
.product-strip__erewhon img{
  object-fit:contain;
  object-position:center center;
  padding:4%;
  background:#E8E2D8;
}
.product-strip__erewhon::after{
  display:none;
}
.product-strip figure:hover img{
  transform:scale(1.04);
  filter:grayscale(.32) contrast(1.04) brightness(.98);
}
.product-strip figure::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(17,17,17,0) 48%, rgba(17,17,17,.58) 100%);
  pointer-events:none;
}
.product-strip figcaption{
  display:none;
}
@media (max-width:760px){
  .product-strip{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .product-strip__wide{ grid-column:span 2; }
}

/* =========================================================
   Presenting partner - checklist & categories
   ========================================================= */
.checklist{
  list-style:none; padding:0; margin: 0;
}
.checklist li{
  position:relative;
  padding: .9rem 0 .9rem 2rem;
  border-bottom:1px solid color-mix(in srgb, var(--warm-white) 14%, transparent);
  font-size: 1.05rem;
}
.checklist li::before{
  content:"";
  position:absolute; left:0; top: 1.15rem;
  width: 18px; height:1px;
  background: var(--champagne);
}

.categories{
  border-left:1px solid color-mix(in srgb, var(--warm-white) 18%, transparent);
  padding-left: 1.6rem;
}
.categories__label{
  display:block;
  font-size:var(--fs-mini);
  letter-spacing:.3em;
  text-transform:uppercase;
  color: var(--stone);
  margin-bottom:1.2rem;
}
.categories ul{
  list-style:none; margin:0; padding:0;
  font-family:var(--serif);
  font-size: 1.15rem;
  line-height:2;
  font-style:italic;
  color: color-mix(in srgb, var(--warm-white) 88%, transparent);
}

/* =========================================================
   Tiers
   ========================================================= */
.tiers{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0;
  border-top:1px solid var(--rule);
  border-left:1px solid var(--rule);
}
.tiers--single{
  grid-template-columns:minmax(0, 1fr);
}
.tier{
  border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  padding: 1.8rem;
  display:flex; flex-direction:column; gap:.8rem;
  background: var(--paper);
}
.tier--top{
  background: var(--soot);
  color: var(--warm-white);
}
.tier--top .tier__role{ color: color-mix(in srgb, var(--warm-white) 75%, transparent); }
.tier--top .tier__label{ color: var(--champagne); }
.tier__label{
  font-family:var(--serif);
  font-size: 1.4rem;
  letter-spacing:.005em;
}
.tier__role{
  font-size:.95rem; color: var(--charcoal);
  font-style:italic; font-family:var(--serif);
}
.tier ul{
  list-style:none; padding:0; margin: 0;
  display:flex; flex-direction:column; gap:.4rem;
  font-size:.92rem;
}
.tier ul li{
  padding-left:1rem;
  position:relative;
}
.tier ul li::before{
  content:"";
  position:absolute; left:0; top:.7em;
  width:6px; height:1px;
  background: var(--champagne);
}
.architecture-note{
  max-width:72ch;
  margin:1.5rem auto 0;
  color: color-mix(in srgb, var(--charcoal) 72%, transparent);
  text-align:center;
  font-size:.95rem;
}

/* =========================================================
   Rules
   ========================================================= */
.rules{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border:1px solid var(--rule);
}
@media (max-width: 800px){ .rules{ grid-template-columns:1fr; } }
.rules__col{
  padding: 2rem;
  background: var(--paper);
}
.rules__col + .rules__col{ border-left: 1px solid var(--rule); }
@media (max-width: 800px){ .rules__col + .rules__col{ border-left:0; border-top:1px solid var(--rule); } }
.rules__col h3{
  font-family:var(--serif);
  font-size: 1.6rem;
  margin: 0 0 1.2rem;
  font-weight:400;
  letter-spacing:.005em;
  color: var(--ink);
}
.rules__col--do h3::after{
  content:" -";
  color: var(--champagne-d);
}
.rules__col--dont h3{ color: var(--charcoal); font-style:italic; }
.rules__col ul{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:.7rem;
  font-size: .98rem;
}
.rules__col li{ padding-left: 1.2rem; position:relative; color: var(--charcoal); }
.rules__col--do li::before{
  content:"+"; position:absolute; left:0; color: var(--champagne-d);
  font-family:var(--serif); font-size:1.1rem; top: -.05em;
}
.rules__col--dont li::before{
  content:"-"; position:absolute; left:0; color: var(--stone);
  font-family:var(--serif); font-size:1rem; top: 0;
}

/* =========================================================
   Timeline
   ========================================================= */
.timeline{
  list-style:none; padding:0; margin:0;
  position:relative;
}
.timeline::before{
  content:"";
  position:absolute;
  left: 13rem;
  top: 1rem; bottom: 1rem;
  width:1px;
  background: color-mix(in srgb, var(--warm-white) 46%, transparent);
}
.timeline li{
  display:grid;
  grid-template-columns: 12rem 1.6rem 1fr;
  align-items:baseline;
  gap: 1rem;
  padding: 1.1rem 0;
  position:relative;
}
.timeline li::before{
  content:"";
  grid-column: 2 / 3;
  width: 8px; height:8px;
  border-radius:50%;
  background: var(--warm-white);
  border: 1px solid color-mix(in srgb, var(--warm-white) 70%, transparent);
  margin-top:.5rem;
  justify-self:center;
}
.timeline__when{
  font-family:var(--serif);
  font-size:1.05rem;
  color:var(--champagne);
  letter-spacing:.01em;
  font-style:italic;
}
.timeline__what{
  font-size:1rem;
  color: color-mix(in srgb, var(--warm-white) 82%, transparent);
}
.timeline__final .timeline__when{
  color: var(--warm-white);
  font-style:normal;
  font-weight:500;
}
.timeline__final::before{ background: var(--champagne); }
.timeline__final .timeline__what{ color: var(--warm-white); font-weight:500; }
@media (max-width: 700px){
  .timeline::before{ left: .5rem; }
  .timeline li{ grid-template-columns: 1.5rem 1fr; }
  .timeline li::before{ grid-column:1; }
  .timeline__when{ grid-column: 2; }
  .timeline__what{ grid-column: 2; }
}

/* =========================================================
   Key date / investment
   ========================================================= */
.investment-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:color-mix(in srgb, var(--warm-white) 18%, transparent);
  border:1px solid color-mix(in srgb, var(--warm-white) 18%, transparent);
}
.investment-card{
  background:rgba(250,248,243,.06);
  padding:clamp(2rem,4vw,3rem);
  color:var(--warm-white);
  min-height:260px;
}
.investment-card__label{
  display:block;
  margin-bottom:1.4rem;
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--champagne);
}
.investment-card strong{
  display:block;
  font-family:var(--serif);
  font-size:clamp(2.6rem,6vw,5.4rem);
  line-height:.92;
  font-weight:400;
  margin-bottom:1.4rem;
}
.investment-card p{
  color:color-mix(in srgb, var(--warm-white) 78%, transparent);
  max-width:48ch;
}
.investment-card--accent{
  background:color-mix(in srgb, var(--warm-white) 12%, transparent);
}
@media (max-width:760px){
  .investment-grid{ grid-template-columns:1fr; }
}

/* =========================================================
   Needs (dark)
   ========================================================= */
.needs{
  list-style:none; padding:0; margin:0;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: color-mix(in srgb, var(--warm-white) 12%, transparent);
  border: 1px solid color-mix(in srgb, var(--warm-white) 12%, transparent);
}
@media (max-width: 700px){ .needs{ grid-template-columns:1fr; } }
.needs li{
  background: var(--soot);
  padding: 1.4rem 1.6rem;
  display:flex; align-items:center; gap:1rem;
  font-size:1.02rem;
}
.needs__check{
  width: 18px; height: 18px;
  border: 1px solid var(--champagne);
  display:inline-block;
  flex:0 0 auto;
  position:relative;
}
.needs__check::after{
  content:"";
  position:absolute;
  left: 3px; top: 6px;
  width: 4px; height: 8px;
  border-right: 1.5px solid var(--champagne);
  border-bottom: 1.5px solid var(--champagne);
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity .3s var(--ease);
}
.needs li:hover .needs__check::after{ opacity:1; }

/* =========================================================
   Closing
   ========================================================= */
.section--closing{
  background:
    radial-gradient(ellipse at 50% 80%, #221f1b 0%, #0e0d0b 70%, #050505 100%);
  color: var(--warm-white);
  text-align:center;
  padding-top: clamp(6rem, 12vw, 12rem);
  padding-bottom: clamp(6rem, 10vw, 10rem);
}
.section--closing .folio{ color: var(--stone); }
.section--closing .folio::before{ background:var(--stone); }
.closing{
  max-width: 760px;
  margin: 0 auto;
}
.closing__title{
  font-family:var(--serif);
  font-weight:400;
  font-size: clamp(2.6rem, 5.6vw, 4.6rem);
  line-height:1.05;
  margin: 1.4rem 0 2rem;
}
.closing__body{
  font-family:var(--serif);
  font-size: 1.2rem;
  line-height:1.6;
  color: color-mix(in srgb, var(--warm-white) 84%, transparent);
  max-width: 56ch;
  margin: 0 auto 1.2rem;
}
.closing__contacts{
  margin: 2.6rem auto 0;
  padding-top: 1.6rem;
  border-top: 1px solid color-mix(in srgb, var(--warm-white) 18%, transparent);
  max-width: 680px;
}
.closing__cta{
  margin:0 0 1.2rem;
  font-size:var(--fs-mini);
  letter-spacing:.32em;
  text-transform:uppercase;
  color:var(--champagne);
}
.contact-list{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:1px;
  background: color-mix(in srgb, var(--warm-white) 18%, transparent);
  border:1px solid color-mix(in srgb, var(--warm-white) 18%, transparent);
}
.contact-card{
  display:flex;
  flex-direction:column;
  gap:.35rem;
  padding:1rem .85rem;
  background: color-mix(in srgb, var(--soot) 88%, transparent);
  color:var(--warm-white);
  text-align:left;
  transition: background .25s var(--ease), color .25s var(--ease);
}
.contact-card:hover{
  background: color-mix(in srgb, var(--warm-white) 10%, var(--soot));
}
.contact-card__name{
  font-family:var(--serif);
  font-size:1.15rem;
  letter-spacing:.02em;
}
.contact-card__email{
  font-size:var(--fs-mini);
  letter-spacing:.1em;
  color: color-mix(in srgb, var(--warm-white) 72%, transparent);
  text-transform:lowercase;
  overflow-wrap:anywhere;
}
.closing__sig{
  font-size:var(--fs-mini);
  letter-spacing:.45em;
  text-transform:uppercase;
  color: var(--stone);
  margin-top: 2rem;
}
@media (max-width: 760px){
  .contact-list{ grid-template-columns:1fr; }
  .contact-card{ text-align:center; }
}

/* =========================================================
   Footer
   ========================================================= */
.footer{
  background: var(--soot);
  color: var(--warm-white);
  padding: 1.4rem var(--pad-x);
  font-size: var(--fs-mini);
  letter-spacing: .18em;
  text-transform: uppercase;
}
.footer__row{
  max-width:var(--maxw);
  margin: 0 auto;
  display:flex; justify-content:space-between; gap:1rem;
  opacity:.7;
}
@media (max-width: 700px){ .footer__row{ flex-direction:column; } }

/* =========================================================
   Reduce motion
   ========================================================= */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation:none !important; transition:none !important; }
  .reveal{ opacity:1; transform:none; }
}

/* =========================================================
   Revised brand-partner deck additions
   ========================================================= */

/* Hero secondary meta line (date / seats) */
.hero__sub--meta{
  margin-top: .9rem;
  font-size: 1rem;
  letter-spacing: .02em;
  color: color-mix(in srgb, var(--charcoal) 80%, transparent);
  max-width: 48ch;
}
@media (max-width:700px){
  .hero__sub--meta{ font-size:.92rem; }
}

/* Why this matters intro spacing */
.why-matters__intro{ margin-bottom: 3rem; }

/* Why ADE: add breathing room under the pull quote */
.grid--why-ade{ margin-top: 2.4rem; }

/* Universe disclaimer note */
.universe--note{
  margin-top: 1.4rem;
  font-size: .95rem;
  line-height: 1.6;
  font-style: italic;
}

/* Discreet internal review note inside a section */
.review-note{
  margin-top: 1.6rem;
  padding: 1rem 1.2rem;
  border: 1px dashed color-mix(in srgb, currentColor 28%, transparent);
  border-radius: 4px;
  font-size: .9rem;
  line-height: 1.6;
  color: color-mix(in srgb, currentColor 70%, transparent);
  background: color-mix(in srgb, var(--champagne) 6%, transparent);
}
.review-note__tag{
  display:block;
  font-family: var(--sans);
  font-size: var(--fs-mini);
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--champagne-d);
  margin-bottom: .4rem;
}
