/* ═══ block 01 · tri-type-system ═══ */
/* §5 Trinity type system — SeoulNamsan(display/hero) · NanumSquare(text) · Pretendard(functional) · Julius Sans One(wordmark). Bricolage/Outfit/Do Hyeon retired. Subset woff2, base64-inlined. */
@font-face{font-family:'SeoulNamsan';src:url(../fonts/SeoulNamsan-EB.subset.woff2) format('woff2');font-weight:1 900;font-style:normal;font-display:swap}
@font-face{font-family:'NanumSquare';src:url(../fonts/NanumSquare-Regular.subset.woff2) format('woff2');font-weight:1 900;font-style:normal;font-display:swap}
@font-face{font-family:'NanumSquareBold';src:url(../fonts/NanumSquare-Bold.subset.woff2) format('woff2');font-weight:1 900;font-style:normal;font-display:swap}
@font-face{font-family:'Pretendard';src:url(../fonts/Pretendard-Variable.subset.woff2) format('woff2');font-weight:1 900;font-style:normal;font-display:swap}

@font-face{font-family:'Julius Sans One';src:url(../fonts/JuliusSansOne-Regular.subset.woff2) format('woff2');font-weight:1 900;font-style:normal;font-display:swap}
@font-face{font-family:'SeoulNamsanM';src:url(../fonts/SeoulNamsan-M.subset.woff2) format('woff2');font-weight:1 900;font-style:normal;font-display:swap}
:root{--tri-hero-m:'SeoulNamsanM','SeoulNamsan',sans-serif;--tri-hero:'SeoulNamsan',sans-serif;--tri-title:'NanumSquareBold','NanumSquare','Pretendard',sans-serif;--tri-text:'NanumSquare','Pretendard',sans-serif;--tri-ui:'Pretendard',sans-serif;--tri-word:'Julius Sans One',sans-serif;}

/* ═══ block 02 · trinity-pretendard-embed ═══ */
/* Pretendard variable, subset to this file's character set and embedded.
   Replaces the jsdelivr CDN stylesheet; the Google Fonts Bricolage link was
   already redundant with the embedded Bricolage faces. */

/* ═══ block 03 · anonymous-2 ═══ */
:root{
    --cream-high:#FAFAF8;
    --ink:#211D1A;
    --ink-soft:rgba(33,29,26,.62);
    --sage:#5F7052;        /* text-grade sage — [inferred] reconcile with v15 --sage */
    --sage-pale:#D3DAC4;   /* pastel ground — v15 console pastel sage */
    --sage-soft:#D3DAC4;
    --accent:#DE654B;
    --vinyl:#232020;
    --hairline:rgba(33,29,26,.14);
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:auto}
  body{background:var(--cream-high);color:var(--ink);font-family:var(--tri-ui);overflow-x:hidden}

  /* ═══════════ Persistent global navigation ═══════════ */
  .bar{position:fixed;inset:0 0 auto 0;z-index:80;display:grid;
       grid-template-columns:max-content minmax(0,1fr) max-content;
       align-items:center;gap:clamp(18px,2.2vw,34px);padding:20px clamp(20px,3.4vw,48px);
       pointer-events:none;color:var(--ink)}
  .bar>*{pointer-events:auto}
  .bar__mark{justify-self:start;font-family:var(--tri-word);font-weight:600;font-size:14px;letter-spacing:.22em;
             text-decoration:none;color:currentColor;white-space:nowrap;
             transition:color .45s cubic-bezier(.22,1,.36,1)}
  .bar__nav{justify-self:end;display:flex;align-items:center;gap:clamp(16px,2.2vw,34px);
            opacity:0;transform:translateY(-7px);pointer-events:none;
            transition:opacity .38s ease,transform .55s cubic-bezier(.22,1,.36,1)}
  body.index-nav-ready .bar__nav,
  body.program-map-open .bar__nav,
  body.faq-open .bar__nav{opacity:1;transform:none;pointer-events:auto}
  .bar__link{appearance:none;-webkit-appearance:none;position:relative;border:0;background:transparent;
             padding:6px 0;cursor:pointer;color:currentColor;font-family:var(--tri-ui);
             font-weight:600;font-size:10.5px;line-height:1;letter-spacing:.14em;text-transform:uppercase;
             white-space:nowrap;transition:color .25s ease,opacity .25s ease}
  .bar__link::after{content:'';position:absolute;left:0;right:100%;bottom:0;height:1px;
                    background:currentColor;transition:right .32s cubic-bezier(.22,1,.36,1)}
  .bar__link:hover,.bar__link:focus-visible{color:var(--accent);outline:none}
  .bar__link.is-active::after{right:0}
  .bar__cta{justify-self:end;border:0;cursor:pointer;font-family:inherit;font-weight:600;
            font-size:13px;letter-spacing:.04em;text-decoration:none;color:var(--cream-high);
            background:var(--ink);border-radius:999px;padding:11px 20px;
            transition:background .3s ease,color .3s ease,transform .3s cubic-bezier(.22,1,.36,1)}
  .bar__cta:hover,.bar__cta:focus-visible{background:var(--accent);transform:translateY(-2px);outline:none}
  body.program-map-open .bar{color:var(--ink)}
  body.program-map-open .bar__cta{background:var(--ink);color:var(--cream-high)}

  /* ═══════════ Hero scrub frame ═══════════ */
  .hero{height:340vh;position:relative}
  .stage{position:sticky;top:0;height:100vh;min-height:640px;display:grid;place-items:center;overflow:hidden;background:var(--sage-pale)}
  .comp{position:relative;z-index:1}
  .cue{z-index:1}

  .comp{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
        gap:clamp(18px,3.2vw,56px);width:100%;max-width:1800px;padding:0 clamp(20px,3.4vw,48px)}

  /* ── Flanking headline ── */
  .hl{font-family:var(--tri-hero);font-weight:800;line-height:.94;letter-spacing:-.015em;color:var(--ink);
      font-size:clamp(48px,8vw,128px)}
  .hl--l{text-align:right;justify-self:end}
  .hl--r{text-align:left;justify-self:start}
  .hl .w{display:block;overflow:hidden}
  .hl .w>span{display:block;transform:translateY(112%);transition:transform .9s cubic-bezier(.19,1,.22,1)}
  .is-in .hl .w:nth-child(1)>span{transition-delay:.06s}
  .is-in .hl .w:nth-child(2)>span{transition-delay:.15s}
  .is-in .hl .w:nth-child(3)>span{transition-delay:.24s}
  .is-in .hl .w>span{transform:translateY(0)}
  .hl .tint{color:var(--accent)}

  /* ── Turntable ── */
  .deck{position:relative;width:min(24vh,15vw);aspect-ratio:1;justify-self:center}
  .disc-wrap{position:absolute;inset:0;border-radius:50%;z-index:1;
             filter:drop-shadow(0 16px 0 rgba(33,29,26,.16))}
  .disc{position:absolute;inset:0;will-change:transform;cursor:pointer;border-radius:50%}
  .disc svg{display:block;width:100%;height:100%}
  .deck:focus-visible{outline:none}
  .deck:focus-visible .disc-wrap{outline:2px solid var(--ink);outline-offset:10px;border-radius:50%}

  /* ── Tonearm ── */
  .arm{position:absolute;top:-10.5%;right:-18.5%;width:64%;aspect-ratio:1;pointer-events:none;z-index:5}
  .arm svg{display:block;width:100%;height:100%;overflow:visible}
  .arm__rot{transform-origin:78% 18%;transform:rotate(-14deg);
            transition:transform 1s cubic-bezier(.45,.02,.18,1)}
  .arm__head{transition:transform .45s ease}
  .is-lifted .arm__head{transform:translate(3px,-6px)}
  .arm__shadow{opacity:.35;transition:opacity .45s ease,transform .45s ease}
  .is-lifted .arm__shadow{opacity:.14;transform:translate(6px,10px)}

  /* ── Run-out state ── */
  .hero.runout .hl{opacity:0;transform:translateY(-8px)}
  .hl{transition:opacity .45s ease,transform .45s ease}
  .hero.runout .arm{opacity:0;transition:opacity .4s ease .25s}
  .arm{transition:opacity .4s ease}
  .hero.runout .deck{pointer-events:none}
  .hero.runout .cue{opacity:0}

  /* ── Live index — editorial split view: table + dedicated sage field ── */
  .index{position:absolute;inset:0;z-index:3;background:var(--cream-high);
         transform:translateX(-100%);will-change:transform;
         display:flex;align-items:center;justify-content:center;overflow-y:auto;
         padding:clamp(56px,7vh,84px) clamp(20px,4vw,64px) clamp(24px,3.5vh,40px)}
  .index__in{width:100%;max-width:1360px;display:flex;flex-direction:column;margin:auto 0}

  .index__label{font-family:var(--tri-ui);font-weight:600;font-size:11px;
                letter-spacing:.3em;color:var(--ink-soft);margin-bottom:8px}
  .index__head{font-family:var(--tri-ui);font-weight:500;color:var(--ink);
               font-size:clamp(17px,1.35vw,21px);line-height:1.25;letter-spacing:-.002em;
               margin-bottom:clamp(18px,2.5vh,26px)}

  .index__shell{width:100%;max-width:1360px;min-height:0;
                height:clamp(438px,calc(100vh - 200px),640px);
                height:clamp(438px,calc(100dvh - 200px),640px);
                display:grid;grid-template-columns:minmax(300px,34%) minmax(0,66%);
                align-items:stretch;gap:0;border-top:1px solid var(--hairline);
                border-bottom:1px solid var(--hairline)}

  /* left: a quiet, continuous table */
  .lxlist{position:relative;z-index:2;display:grid;grid-template-rows:repeat(5,1fr);background:var(--cream-high)}
  .irow{appearance:none;-webkit-appearance:none;position:relative;width:100%;min-width:0;
        border:0;border-bottom:1px solid var(--hairline);border-radius:0;
        background:transparent;color:var(--ink);cursor:pointer;text-align:left;
        padding:clamp(14px,1.7vw,24px) clamp(18px,2vw,30px);
        display:flex;flex-direction:column;justify-content:center;
        font-family:var(--tri-ui);
        transition:background-color .28s ease,color .28s ease}
  .irow:last-child{border-bottom:0}
  .irow__meta{display:flex;align-items:center;justify-content:flex-start;margin-bottom:7px}
  .irow .no{font-weight:500;font-size:9px;letter-spacing:.22em;color:rgba(33,29,26,.5);
            transition:color .25s ease}
  .nmwrap{display:flex;align-items:center;width:100%;min-width:0}
  .irow .nm{font-family:var(--tri-ui);font-weight:600;line-height:1;
            letter-spacing:-.012em;font-size:clamp(20px,1.95vw,30px);white-space:nowrap}
  .irow .arr{margin-left:auto;padding-left:16px;font-weight:500;line-height:1;
             font-size:clamp(14px,1.3vw,18px);opacity:0;transform:translateX(-4px);
             transition:opacity .22s ease,transform .22s ease}
  .irow:hover:not(.is-on){background:rgba(95,112,82,.035)}
  .irow.is-on{background:var(--sage-pale);color:var(--ink);z-index:3}
  /* The active row and the sage detail panel are one continuous table cell. */
  .irow.is-on::after{content:'';position:absolute;top:0;bottom:0;right:-2px;width:3px;
                     background:var(--sage-pale);pointer-events:none;z-index:4}
  .irow.is-on .no{color:rgba(33,29,26,.52)}
  .irow.is-on .arr{opacity:.72;transform:none}
  .irow:focus-visible{outline:1px solid rgba(33,29,26,.5);outline-offset:-1px;z-index:2}

  /* right: flat hero sage, attached as the same table */
  .index__detail-stage{position:relative;z-index:1;min-width:0;overflow:hidden;
                       border-left:1px solid var(--hairline);
                       background:var(--sage-pale);color:var(--ink);isolation:isolate}
  .index__detail-stage::before,.index__detail-stage::after{display:none}

  .index-detail{position:absolute;inset:0;z-index:1;padding:clamp(34px,4vw,58px);
                display:flex;flex-direction:column;opacity:0;visibility:hidden;
                transform:translateY(6px);pointer-events:none;
                transition:opacity .22s ease,transform .32s cubic-bezier(.22,1,.36,1),visibility 0s linear .32s}
  .index-detail.is-on{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}
  .detail__kicker{display:flex;align-items:center;gap:12px;margin-bottom:clamp(18px,2.2vh,24px);
                  font-weight:500;font-size:9px;letter-spacing:.2em;text-transform:uppercase;
                  color:rgba(33,29,26,.52)}
  .detail__kicker::after{content:'';display:block;width:38px;height:1px;background:rgba(33,29,26,.2)}
  .detail__title{font-family:var(--tri-title);font-weight:600;
                 font-size:clamp(16px,1.6vw,23px);line-height:1.18;letter-spacing:.01em;
                 color:var(--ink);max-width:20em;text-wrap:balance}
  .detail__bottom{margin-top:clamp(50px,7vh,78px);padding:0}
  .detail__label{font-weight:500;font-size:8px;letter-spacing:.18em;text-transform:uppercase;
                 color:rgba(33,29,26,.52);margin-bottom:10px}
  .detail__links{max-width:calc(100% - clamp(92px,10vw,142px));
                 border-top:1px solid rgba(33,29,26,.2)}
  .detail-link{min-height:clamp(58px,7.4vh,76px);display:grid;
               grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:12px;
               padding:10px 2px;border-bottom:1px solid rgba(33,29,26,.17);
               color:var(--ink);text-decoration:none;
               transition:background-color .2s ease,padding-left .2s ease}
  .detail-link:hover,.detail-link:focus-visible{background:rgba(250,250,248,.16);padding-left:7px;outline:none}
  .detail-link__no{font-weight:500;font-size:8px;letter-spacing:.14em;color:rgba(33,29,26,.46)}
  .detail-link__name{min-width:0;font-family:var(--tri-ui);font-weight:600;
                     font-size:clamp(19px,1.75vw,27px);line-height:1.08;letter-spacing:-.012em}
  .detail-link__arr{font-size:15px;opacity:0;transform:translateX(-4px);transition:transform .2s ease,opacity .2s ease}
  .detail-link:hover .detail-link__arr,.detail-link:focus-visible .detail-link__arr{transform:translateX(3px);opacity:.9}

  .detail-icon{position:absolute;right:clamp(22px,2.6vw,38px);bottom:clamp(18px,2.5vh,30px);
               z-index:2;width:clamp(72px,7.4vw,106px);aspect-ratio:1;pointer-events:none;
               opacity:1;filter:none}
  .detail-icon svg{display:block;width:100%;height:100%;overflow:visible}

  .index-detail[data-cat="services"] .detail__title{max-width:31em}
  .index-detail[data-cat="services"] .detail__bottom{margin-top:clamp(50px,7vh,78px)}
  .index-detail[data-cat="services"] .detail__links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
                                                    max-width:100%;border-left:0;border-right:0}
  .index-detail[data-cat="services"] .detail-link{min-height:clamp(104px,12.5vh,124px);
                                                   grid-template-columns:minmax(0,1fr) auto;
                                                   grid-template-rows:auto 1fr;align-content:start;align-items:start;
                                                   gap:12px 10px;padding:14px 16px 16px;
                                                   border-right:0;
                                                   border-bottom:1px solid rgba(33,29,26,.17)}
  .index-detail[data-cat="services"] .detail-link:nth-child(3n+2),
  .index-detail[data-cat="services"] .detail-link:nth-child(3n+3){
                                                   border-left:1px solid rgba(33,29,26,.17)}
  .index-detail[data-cat="services"] .detail-link__no{grid-column:1;grid-row:1}
  .index-detail[data-cat="services"] .detail-link__name{grid-column:1 / -1;grid-row:2;align-self:start;
                                                        font-size:clamp(15px,1.15vw,17px);line-height:1.15}
  .index-detail[data-cat="services"] .detail-link__arr{grid-column:2;grid-row:1}
  .index-detail[data-cat="services"] .detail-icon{bottom:clamp(12px,1.8vh,22px)}

  /* ── Scroll cue ── */

  .cue{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);
       font-weight:500;font-size:11px;letter-spacing:.3em;color:rgba(33,29,26,.6);
       display:flex;flex-direction:column;align-items:center;gap:10px;
       opacity:0;transition:opacity .8s ease .9s}
  .is-in .cue{opacity:1}
  .cue__line{width:1px;height:34px;background:rgba(33,29,26,.22);position:relative;overflow:hidden}
  .cue__line::after{content:'';position:absolute;left:0;top:-100%;width:1px;height:100%;
                    background:var(--ink);animation:cueDrop 2.1s cubic-bezier(.65,0,.35,1) infinite}
  @keyframes cueDrop{0%{top:-100%}55%{top:100%}100%{top:100%}}
  .hero.is-done .cue{opacity:0}

  /* ── Runway end marker (build scaffold — next sections mount here) ── */
  .after{min-height:52vh;display:grid;place-items:center;background:var(--cream-high)}
  .after p{font-weight:500;font-size:12px;letter-spacing:.28em;color:var(--ink-soft)}


  /* ── beat pulse (hover) ── */
  .hero.beat .hl{animation:thump .469s cubic-bezier(.22,.9,.34,1) infinite}

  .disc-wrap{animation:none}
  .deck:hover .disc-wrap,.deck:focus-visible .disc-wrap{animation:squash .469s cubic-bezier(.3,1.6,.4,1) infinite}
  .deck.pop .disc-wrap{animation:squash .469s cubic-bezier(.3,1.6,.4,1)}
  @keyframes thump{0%{transform:scale(1)}9%{transform:scale(1.026)}42%{transform:scale(1.004)}100%{transform:scale(1)}}
  @keyframes squash{0%{transform:scale(1,1)}18%{transform:scale(1.09,.9)}46%{transform:scale(.965,1.045)}
                    72%{transform:scale(1.018,.985)}100%{transform:scale(1,1)}}

  /* ── BOOM — comic impact burst behind the disc, fired on the beat ── */
  .boom{position:absolute;inset:-45%;pointer-events:none;z-index:0;opacity:0}
  .boom svg,.boom{overflow:visible}

  /* ═══════════ Wide — MacBook-and-up: EN reads one line per side, KO stays two ═══════════ */
  @media (min-width:1000px){
    /* English: the phrase sits on a single line, sized to fit a 16" MacBook column */
    html[lang="en"] .hl{white-space:nowrap;line-height:1;font-size:clamp(38px,3.7vw,60px)}
    html[lang="en"] .hl .w{display:inline-block;margin-right:.22em}
    html[lang="en"] .hl .w:last-child{margin-right:0}
    /* Korean: two words → two stacked lines, held a touch larger */
    html[lang="ko"] .hl{white-space:normal;line-height:1;font-size:clamp(40px,3.9vw,64px)}
    html[lang="ko"] .hl .w{display:block;margin-right:0}
  }

  /* ═══════════ Mobile ═══════════ */
  @media (max-width:820px){
    .bar{grid-template-columns:1fr auto;grid-template-areas:'mark cta' 'nav nav';
         gap:9px 14px;padding:12px 16px 10px}
    .bar__mark{grid-area:mark;font-size:11px;letter-spacing:.14em}
    .bar__nav{grid-area:nav;justify-self:stretch;justify-content:flex-end;gap:clamp(15px,5vw,28px);min-width:0}
    .bar__link{font-size:8.5px;letter-spacing:.09em}
    .bar__cta{grid-area:cta;font-size:10.5px;padding:9px 13px}
    .stage{min-height:560px}
    .comp{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:26px;padding:86px 20px 60px}
    .hl{font-size:clamp(44px,12.5vw,64px)}
    .hl--l{text-align:left;justify-self:start}
    .hl--r{text-align:right;justify-self:end}
    .hl .w{display:inline-block}
    .hl--l .w,.hl--r .w{display:block}
    .hl--l .w:nth-child(2),.hl--l .w:nth-child(3){display:inline-block;margin-right:.24em}
    .deck{width:min(38vh,64vw);justify-self:center}
    .arm{top:-9%;right:-11%;width:70%}
    .cue{bottom:18px}

    .index{align-items:flex-start;padding:92px 16px 28px}
    .index__in{margin:0}
    .index__label{font-size:9px;margin-bottom:6px}
    .index__head{font-size:15px;font-weight:500;margin-bottom:14px}
    .index__shell{grid-template-columns:1fr;min-height:0;height:auto;gap:0}
    .lxlist{grid-template-rows:repeat(5,60px)}
    .irow{min-height:60px;padding:9px 13px}
    .irow__meta{margin-bottom:4px}
    .irow .no{font-size:8px}
    .irow .nm{font-size:19px}
    .irow .arr{font-size:14px}
    .index__detail-stage{min-height:580px;border-left:0;border-top:1px solid var(--hairline)}
    .irow.is-on::after{display:none}
    .index-detail{padding:26px 20px}
    .detail__kicker{margin-bottom:15px;font-size:8.5px}
    .detail__title{font-size:17px;max-width:20em}
    .detail__bottom{margin-top:40px;padding-bottom:90px}
    .detail__links{max-width:100%}
    .detail-link{grid-template-columns:42px minmax(0,1fr) auto;min-height:54px;padding:8px 2px}
    .detail-link__name{font-size:clamp(19px,5.3vw,24px)}
    .detail-icon{width:68px;right:16px;bottom:16px}
    .index-detail[data-cat="services"] .detail__bottom{margin-top:40px}
    .index-detail[data-cat="services"] .detail__links{grid-template-columns:repeat(2,minmax(0,1fr));max-width:100%}
    .index-detail[data-cat="services"] .detail-link{min-height:112px;padding:12px 12px 14px}
    .index-detail[data-cat="services"] .detail-icon{width:64px}
  }
  @media (max-width:520px){
    .index__detail-stage{min-height:600px}
    .detail__title{font-size:16px}
    .detail-link__name{font-size:21px}
  }
  @media (prefers-reduced-motion:reduce){
    .hl .w>span{transform:none;transition:none}
    .arm__rot{transition:none}
    .cue{transition:none;opacity:1}
    .cue__line::after{animation:none}
    .hero.beat .hl{animation:none}
    .hl,.arm{transition:none}
    .deck:hover .disc-wrap,.deck.pop .disc-wrap{animation:none}
    .boom{display:none}
    .irow,.irow .arr,.index-detail,.detail-link,.detail-link__arr{transition:none}
  }


  /* ═══════════ PROGRAM MAP ═══════════ */
  /* ═══════════ PROGRAM MAP — two-track strip table, Services inverted ═══════════
     Same grammar as Services, fully inverted: sage ground, hairline strips,
     one open panel filled cream-high. The two program categories are two
     groups of three strips on one shared six-strip row; opening a strip
     shifts the seam, so the table's weight moves between Academy and
     Experience. The lit (cream) elements — the open strip and the active
     category name — always agree. */
  .promap{
    --pm-ink:#211D1A;
    --pm-cream:#FAFAF8;
    --pm-sage:#D8DDCF;
    --pm-coral:#DE654B;
    --pm-hair:rgba(33,29,26,.18);
    --pm-ease:cubic-bezier(.22,1,.36,1);
    position:fixed;inset:0;z-index:30;isolation:isolate;
    background:var(--pm-sage);color:var(--pm-ink);
    transform:translateY(100.5%);
    transition:transform 950ms var(--pm-ease);
    will-change:transform;
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  }
  .promap.is-open{transform:translateY(0)}
  /* Services and Programs share the same turntable in the same spot; switching
     between them is a hard cut so the record simply stays where it is. */
  body.svc-prog-cut .promap,
  body.svc-prog-cut .servicepage{transition:none!important}
  .promap:focus{outline:none}
  body.program-map-open .bar__link:hover,
  body.program-map-open .bar__link:focus-visible{color:var(--ink)}
  .promap__inner{
    width:min(100%,1560px);margin:0 auto;
    padding:clamp(70px,8.6vh,92px) clamp(20px,3.4vw,52px) clamp(10px,1.5vh,18px);
    display:flex;flex-direction:column;
  }
  .promap__head{flex:0 0 auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;margin-bottom:clamp(28px,4.6vh,52px)}
  .promap__faqbar{flex:0 0 auto;display:flex;justify-content:flex-end;margin-bottom:clamp(14px,2vh,22px)}
  .promap__intro{display:flex;align-items:center;gap:clamp(18px,2vw,28px);min-width:0}
  .promap__copyblock{min-width:0}
  .promap__title{margin:0;font-family:var(--tri-title);font-weight:700;font-size:clamp(26px,3.2vw,50px);line-height:1.04;letter-spacing:-.025em;max-width:24ch;text-wrap:balance}
  .promap__sub{margin:10px 0 0;max-width:58ch;font-family:var(--tri-text);font-size:clamp(13px,.35vw + 10px,15px);line-height:1.6;color:rgba(33,29,26,.8)}
  .promap__actions{display:flex;align-items:center;gap:10px;padding-bottom:2px}
  .promap__count{min-width:66px;text-align:center;font-family:var(--tri-ui);font-weight:600;font-size:11px;letter-spacing:.15em;color:rgba(33,29,26,.72)}
  .promap__arrow{appearance:none;-webkit-appearance:none;width:44px;height:44px;border-radius:999px;border:1px solid rgba(33,29,26,.3);background:transparent;color:var(--pm-ink);font-family:inherit;font-size:17px;cursor:pointer;transition:background .25s ease,color .25s ease,transform .3s var(--pm-ease)}
  .promap__arrow:hover,.promap__arrow:focus-visible{background:var(--pm-ink);color:var(--pm-cream);outline:none;transform:translateY(-2px)}
  .promap__arrow:active{transform:scale(.92)}

  /* The shared strip row. Both categories stay in view; only the seam between them moves. */
  .program-carousel{position:relative;display:flex;overflow:hidden;touch-action:pan-y;isolation:isolate}
  .program-group{position:relative;display:flex;flex-direction:column;min-width:0;flex:3 1 0%;border-top:1px solid var(--pm-hair);border-bottom:1px solid var(--pm-hair);transition:flex-grow 820ms var(--pm-ease)}
  .program-group.has-active{flex-grow:6.55}
  .program-group--b{margin-left:clamp(24px,2.8vw,44px)}

  .program-group__head{flex:0 0 auto;display:flex;align-items:center;gap:16px;min-height:0;padding:9px clamp(14px,1.4vw,22px);border-bottom:1px solid var(--pm-hair);background:transparent;transition:background-color .45s ease,border-color .45s ease}
  .program-group.has-active .program-group__head{background:var(--pm-cream);border-bottom-color:transparent}
  .program-group__name{margin:0;flex:0 0 auto;font-family:var(--tri-title);font-weight:600;font-size:clamp(13px,.55vw + 9px,17px);letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;color:rgba(33,29,26,.55);transition:color .35s ease}
  .program-group.has-active .program-group__name{color:var(--pm-ink)}
  .program-group__faq{flex:0 0 auto;margin-left:auto;display:inline-flex;align-items:center;gap:6px;border:0;border-bottom:1.5px solid currentColor;padding:3px 0 2px;background:transparent;color:var(--pm-ink);font-family:var(--tri-ui);font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .25s var(--pm-ease)}
  .program-group__faq:hover,.program-group__faq:focus-visible{transform:translateX(4px);outline:none}
  .program-group__desc{margin:0;flex:1 1 auto;min-width:0;font-family:var(--tri-text);font-size:clamp(11.5px,.28vw + 9px,13px);line-height:1.4;color:rgba(33,29,26,.78);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .45s ease}
  .program-group.has-active .program-group__desc{opacity:1}

  .program-group__strips{display:flex;flex:1 1 auto;min-height:0}
  .program-card{position:relative;min-width:0;flex:1 1 0%;border-left:1px solid var(--pm-hair);background:var(--pm-sage);overflow:hidden;isolation:isolate;transition:flex-grow 820ms var(--pm-ease),background-color .32s ease}
  .program-group .program-card:first-child{border-left:0}
  .program-card.is-active{flex-grow:4.55;background:var(--pm-cream)}
  .program-card:not(.is-active):hover{background:rgba(250,250,248,.55)}
  .program-card__tab{appearance:none;-webkit-appearance:none;position:absolute;inset:0;z-index:4;width:100%;height:100%;border:0;background:transparent;color:inherit;text-align:left;padding:clamp(18px,1.7vw,26px);cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%0A%3Cpath%20d%3D%22M18%205v17%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M18%207l9-2v6l-9%202z%22%20fill%3D%22%23D3DAC4%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22%20stroke-linejoin%3D%22round%22/%3E%0A%3Cellipse%20cx%3D%2213.5%22%20cy%3D%2224%22%20rx%3D%225.5%22%20ry%3D%224%22%20transform%3D%22rotate%28-18%2013.5%2024%29%22%20fill%3D%22%23F4F5F0%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22/%3E%0A%3Cpath%20d%3D%22M6%207L4%205M7%2012H4%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.7%22/%3E%0A%3C/svg%3E") 4 28, pointer;font-family:var(--tri-ui);display:flex;flex-direction:column;align-items:flex-start;transition:padding .65s var(--pm-ease)}
  .program-card.is-active .program-card__tab{height:auto;inset:0 0 auto;padding:clamp(20px,1.9vw,28px) clamp(24px,2.4vw,38px) 14px;pointer-events:none}
  .program-card__no{display:flex;align-items:center;gap:8px;font-weight:600;font-size:9px;letter-spacing:.2em;color:rgba(33,29,26,.62)}
  .program-card__no::after{content:'';width:22px;height:1px;background:currentColor;opacity:.6;transition:width .55s var(--pm-ease)}
  .program-card.is-active .program-card__no::after{width:48px}
  .program-card__name{display:block;margin-top:13px;font-weight:600;font-size:clamp(11.5px,.85vw,15px);line-height:1.14;letter-spacing:-.015em;overflow-wrap:break-word;word-break:normal;transition:font-size .65s var(--pm-ease),max-width .65s var(--pm-ease)}
  .program-card.is-active .program-card__name{font-size:clamp(21px,1.9vw,32px);max-width:20ch;letter-spacing:-.03em}
  .program-card__kind{margin-top:auto;font-size:8px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(33,29,26,.58);writing-mode:vertical-rl;transform:rotate(180deg);transition:opacity .2s ease}
  .program-card.is-active .program-card__kind{opacity:0}
  .program-card__hint{display:none}
  .program-card__tab:focus-visible{outline:1px solid rgba(33,29,26,.6);outline-offset:-2px}

  .program-card__body{position:absolute;z-index:2;left:clamp(24px,2.4vw,38px);right:clamp(24px,2.4vw,38px);top:clamp(130px,17vh,178px);bottom:clamp(18px,2.6vh,28px);opacity:0;visibility:hidden;transform:translateY(12px);pointer-events:none;transition:opacity .2s ease,transform .45s var(--pm-ease),visibility 0s linear .46s;display:flex;flex-direction:column;min-width:0}
  .program-card.is-active .program-card__body{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:.22s}
  .program-card__lead{display:flex;align-items:center;gap:11px;margin-bottom:6px;font-weight:600;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(33,29,26,.52)}
  .program-card__lead::before{content:'';width:7px;height:7px;border:2px solid var(--pm-coral);border-radius:50%;box-shadow:3px 2px 0 rgba(222,101,75,.22)}
  .program-card__rows{min-height:0;overflow:auto;padding:0 clamp(8px,.8vw,14px) 10px 0;scrollbar-width:thin;scrollbar-color:rgba(33,29,26,.28) transparent}
  .program-card__rows::-webkit-scrollbar{width:5px}
  .program-card__rows::-webkit-scrollbar-thumb{background:rgba(33,29,26,.24);border-radius:99px}
  .program-card__row{padding:11px 0;border-bottom:1px solid rgba(33,29,26,.14);font-family:var(--tri-text);font-size:clamp(13.5px,.3vw + 11px,15.5px);line-height:1.55;color:rgba(33,29,26,.82);word-break:keep-all}
  .program-card__row:last-child{border-bottom:0}
  .program-card__proof{margin-top:auto;padding-top:12px;border-top:1px solid rgba(33,29,26,.17);display:flex;align-items:center;justify-content:space-between;gap:18px;font-family:var(--tri-ui);font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(33,29,26,.48)}
  .program-card__mini-icon{flex:0 0 auto;width:44px;height:44px}
  .program-card__mini-icon svg{width:100%;height:100%;display:block}

  /* 1-Day Artist (B1) — full-bleed studio scene inside the open card, footer overlaid */
  .program-card--scene{--scene-h:clamp(176px,26vh,272px)}
  .program-card--scene.is-active .program-card__body{bottom:calc(var(--scene-h) + 16px)}
  .program-card__scene{position:absolute;z-index:3;left:0;right:0;bottom:0;height:var(--scene-h);margin:0;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(10px);pointer-events:none;transition:opacity .25s ease,transform .5s var(--pm-ease),visibility 0s linear .5s}
  .program-card--scene.is-active .program-card__scene{opacity:1;visibility:visible;transform:none;transition-delay:.28s;transition:opacity .3s ease,transform .55s var(--pm-ease)}
  .program-card__scene-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
  .program-card__scene::after{content:'';position:absolute;left:0;right:0;bottom:0;height:66%;background:linear-gradient(to top,rgba(20,17,15,.84) 0%,rgba(20,17,15,.46) 44%,rgba(20,17,15,0) 100%);pointer-events:none}
  .program-card__scene-footer{position:absolute;z-index:2;left:clamp(18px,1.9vw,26px);right:clamp(14px,1.5vw,20px);bottom:clamp(14px,2vh,20px);display:flex;align-items:flex-end;justify-content:space-between;gap:14px;font-family:var(--tri-ui)}
  .program-card__scene-tag{font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(250,250,248,.94);line-height:1.35}
  .program-card__scene-icon{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:rgba(250,250,248,.16);border:1px solid rgba(250,250,248,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
  .program-card__scene-icon svg{width:25px;height:25px;display:block}
  .program-card__scene-icon svg *{stroke:#FAFAF8}
  .program-card__scene-icon svg [fill="#FAFAF8"]{fill:none}

  .promap__rail{flex:0 0 auto;display:flex;justify-content:flex-end;align-items:center;gap:24px;padding:clamp(8px,1.2vh,14px) 0 0}
  .promap__track{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,2.8vw,44px)}
  .promap__segment{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-items:center}
  .promap__tick{height:2px;background:rgba(33,29,26,.2);position:relative;overflow:hidden}
  .promap__tick::after{content:'';position:absolute;inset:0;background:var(--pm-ink);transform:translateX(-102%);transition:transform .55s var(--pm-ease)}
  .promap__tick.is-past::after,.promap__tick.is-active::after{transform:translateX(0)}
  .promap__rail-note{font-family:var(--tri-text);font-size:11px;color:rgba(33,29,26,.74);white-space:nowrap}

  @media (min-width:821px){
    /* One turntable, one spot: both chapters pin the record with the same
       top offset so the Services↔Programs cut leaves it visually untouched. */
    .servicepage .servicepage__intro,.promap .promap__intro{align-items:flex-start!important}
    .servicepage__intro .title-record,.promap__intro .title-record{margin-top:calc((205px - clamp(90px,12.8vh,124px))/2)}
    .promap{height:100vh;height:100dvh;overflow:hidden;overscroll-behavior:none}
    /* The table is sized to its content, not to the viewport; the chapter
       stays one screen with the composition centered in it. */
    .promap__inner{height:100vh;height:100dvh;min-height:0}
    .program-carousel{flex:1 1 auto;min-height:0}
  }
  @media (min-width:821px) and (max-height:760px){
    .servicepage__intro .title-record,.promap__intro .title-record{margin-top:46px}
    .promap__inner{padding-top:64px;padding-bottom:8px}
    .promap__head{margin-bottom:clamp(18px,3.2vh,30px)}
    .promap__faqbar{margin-bottom:clamp(10px,1.6vh,16px)}
    .promap__title{font-size:clamp(24px,2.6vw,40px)}
    .promap__sub{margin-top:6px;font-size:12px;line-height:1.5}
    .program-group__head{padding-top:7px;padding-bottom:7px}
    .program-card__body{top:clamp(104px,14vh,134px)}
    .program-card__row{padding:8px 0;font-size:12.5px;line-height:1.45}
  }
  @media (max-width:1100px){
    .program-card.is-active{flex-grow:5.2}
    .program-group.has-active{flex-grow:7.2}
    .program-card__name{font-size:12px}
  }
  @media (max-width:820px){
    .promap{height:auto;min-height:100dvh;overflow-y:auto}
    .promap__inner{display:block;height:auto;min-height:100dvh;padding:104px 16px 40px}
    .promap__head{grid-template-columns:1fr;align-items:start;gap:16px;margin-bottom:20px}
    .promap__intro{align-items:flex-start;gap:14px}
    .promap__sub{font-size:13px}
    .promap__actions{justify-content:flex-start}
    .program-carousel{display:block;border-bottom:0;height:auto}
    .program-group{display:block;border:0!important}
    .program-group--b{margin-left:0;margin-top:34px}
    .program-group__head{flex-wrap:wrap;gap:4px 12px;min-height:0;padding:0 2px 10px;border-bottom:0;background:transparent!important}
    .program-group__desc{flex:1 1 100%;order:3;white-space:normal;overflow:visible;text-overflow:clip}
    .program-group__strips{display:block;border-top:1px solid var(--pm-hair)}
    .program-card{display:block;border-left:0}
    .program-card:not(.is-active):hover{background:var(--pm-sage)}
    .program-card__tab{position:relative;inset:auto;height:auto;min-height:58px;padding:11px 12px;border-bottom:1px solid var(--pm-hair);background:var(--pm-sage);pointer-events:auto;display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 10px;align-content:center;cursor:pointer;transition:background .25s ease}
    .program-card.is-active .program-card__tab{background:var(--pm-cream);height:auto;inset:auto;padding:11px 12px}
    .program-card__no{grid-column:1;grid-row:1 / -1;align-self:center;font-size:8px}
    .program-card__no::after,.program-card__kind,.program-card__hint{display:none}
    .program-card__name,.program-card.is-active .program-card__name{grid-column:2;grid-row:1 / -1;align-self:center;margin:0;max-width:none;font-size:12.5px;line-height:1.15;letter-spacing:-.01em}
    .program-card__body,.program-card.is-active .program-card__body{position:relative;inset:auto;display:none;opacity:1;visibility:visible;transform:none;padding:22px 16px 24px;background:var(--pm-cream);border-bottom:1px solid var(--pm-hair)}
    .program-card.is-active .program-card__body{display:flex}
    .program-card__rows{overflow:visible;padding-right:0}
    .program-card__proof{margin-top:22px}
    .program-card--scene.is-active .program-card__body{bottom:auto}
    .program-card--scene .program-card__scene{position:relative;height:auto;aspect-ratio:1.83/1;margin:0;opacity:1;visibility:visible;transform:none;transition:none;display:none;pointer-events:auto}
    .program-card--scene.is-active .program-card__scene{display:block}
    .program-card--scene.is-active .program-card__body{border-bottom:0}
    .promap__rail{justify-content:flex-start;padding-top:16px}
    .promap__rail-note{white-space:normal}
    .promap__faqbar{margin-bottom:12px}
  }
  @media (pointer:coarse){.program-card__tab{cursor:pointer}}
  @media (prefers-reduced-motion:reduce){
    .promap,.program-group,.program-card,.program-card__body,.program-card__tab,.program-card__name,.program-group__name,.promap__tick::after{transition-duration:1ms!important}
  }

  /* ═══════════ PROGRAM FAQ PAGES ═══════════ */
  .faqpage {
    --faq-ink: #1B231B;
    --faq-sage: #ADBBA3;
    --faq-sage-soft: #D3DAC4;
    --faq-sage-deep: #55654F;
    --faq-cream: #FAFAF8;
    --faq-coral: #DE654B;
    --faq-display: 'Pretendard',sans-serif;
    --faq-body: 'Pretendard',sans-serif;
    --faq-ease: cubic-bezier(0.22, 1, 0.36, 1);
    position: fixed;
    inset: 0;
    z-index: 35;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: var(--faq-cream);
    transform: translateX(100.5%);
    transition: transform 760ms var(--faq-ease);
    will-change: transform;
  }
  .faqpage.is-open { transform: translateX(0); }
  .faqpage__inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: clamp(104px, 13vh, 148px) clamp(22px, 5vw, 68px) clamp(56px, 8vh, 96px);
  }
  .faqpage__eyebrow {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 16px;
    font-family:var(--tri-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--faq-coral);
  }
  .faqpage__eyebrow::before { content:""; width:34px; height:1.5px; background:currentColor; }
  .faqpage__title {
    margin: 0;
    font-family:var(--tri-title);
    font-size: clamp(38px, 6vw, 82px);
    font-weight: 700;
    line-height: .98;
    letter-spacing: -.045em;
    color: var(--faq-ink);
  }
  .faqpage__intro {
    margin: 24px 0 clamp(42px, 7vh, 76px);
    max-width: 84ch;
    font-family:var(--tri-text);
    font-size: clamp(14px, .4vw + 11px, 17px);
    line-height: 1.7;
    color: #4A5446;
  }
  .faqlist__label { margin: clamp(38px,5vh,56px) 0 14px; font-family:var(--tri-ui); font-size:11px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--faq-sage-deep); }
  .faqlist__label:first-of-type { margin-top: 0; }
  .faqlist { border-top: 1.5px solid var(--faq-ink); }
  .faqitem { border-bottom: 1px solid rgba(27,35,27,.20); }
  .faqitem summary {
    list-style: none;
    display: grid;
    grid-template-columns: 54px minmax(0,1fr) auto;
    align-items: center;
    gap: 18px;
    min-height: 92px;
    padding: 18px 0;
    cursor: pointer;
    font-family:var(--tri-text);
    color: var(--faq-ink);
  }
  .faqitem summary::-webkit-details-marker { display:none; }
  .faqitem__no {
    font-family:var(--tri-ui);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .14em;
    color: var(--faq-coral);
  }
  .faqitem__q {
    font-size: clamp(18px, 1.4vw + 10px, 25px);
    font-weight: 600;
    letter-spacing: -.02em;
  }
  .faqitem__plus {
    position: relative;
    width: 30px;
    height: 30px;
    border: 1.5px solid var(--faq-ink);
    border-radius: 50%;
  }
  .faqitem__plus::before,
  .faqitem__plus::after {
    content:"";
    position:absolute;
    left:50%; top:50%;
    width:12px; height:1.5px;
    background:var(--faq-ink);
    transform:translate(-50%,-50%);
    transition:transform .3s var(--faq-ease);
  }
  .faqitem__plus::after { transform:translate(-50%,-50%) rotate(90deg); }
  .faqitem[open] .faqitem__plus::after { transform:translate(-50%,-50%) rotate(0); }
  .faqitem__answer {
    padding: 0 48px 30px 72px;
    max-width: 76ch;
    font-family:var(--tri-text);
    font-size: clamp(14px, .35vw + 11px, 16px);
    line-height: 1.75;
    color: #4A5446;
  }
  .faqitem__answer strong { color: var(--faq-ink); }
  .faqpage__booking {
    margin-top: clamp(44px, 7vh, 76px);
    padding: clamp(28px, 4vw, 48px);
    background: var(--faq-sage-soft);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    font-family:var(--tri-text);
  }
  .faqpage__booking p { margin:0; font-size:clamp(16px,1vw + 10px,22px); font-weight:600; color:var(--faq-ink); }
  .faqpage__booking button {
    flex:0 0 auto;
    border:1.5px solid var(--faq-ink);
    border-radius:999px;
    padding:12px 20px;
    background:var(--faq-ink);
    color:var(--faq-cream);
    font:600 13px var(--faq-display);
    cursor:pointer;
  }

  body.program-map-open,
  body.faq-open { overflow: hidden; }

  @media (max-width: 820px) {
    .faqpage__inner { padding-top: 116px; }
    .faqitem summary { grid-template-columns: 40px minmax(0,1fr) auto; gap:12px; min-height:80px; }
    .faqitem__answer { padding:0 0 26px 52px; }
    .faqpage__booking { align-items:flex-start; flex-direction:column; }
  }
  @media (max-width: 520px) {
    .faqitem__q { font-size:18px; }
    .faqitem__no { font-size:9px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .faqpage { transition-duration: 1ms !important; }
  }



/* ═══════════ DISCOGRAPHY (cream-hi, rises over the sage WHY) ═══════════ */
  .disco {
    position: fixed; inset: 0; z-index: 20;
    background: var(--cream-high);
    transform: translateY(100.5%);
    transition: transform var(--panel-dur) var(--ease-out);
    will-change: transform;
  }
  .disco.is-open { transform: translateY(0); }
  .disco__stage { position: absolute; inset: 0; cursor: grab; }
  .disco__stage.is-dragging { cursor: grabbing; }
  .disco__stage canvas { display: block; width: 100%; height: 100%; }
  .disco__head {
    position: absolute; z-index: 2;
    top: clamp(64px, 9vh, 110px); left: clamp(22px, 4vw, 56px);
    pointer-events: none;
  }
  .eyebrow {
    display: flex; align-items: center; gap: 12px;
    margin: 0 0 14px;
    font-family:var(--tri-ui);
    font-weight: 600;
    font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--coral);
  }
  .eyebrow::before { content: ""; width: 34px; height: 1.5px; background: var(--coral); }
  .disco__title {
    margin: 0;
    font-family:var(--tri-title);
    font-weight: 700;
    font-size: clamp(24px, 2.2vw + 10px, 46px);
    line-height: 1.12; letter-spacing: -0.018em;
    color: var(--ink);
    white-space: nowrap;
  }

  .disco__sub {
    margin: 10px 0 0;
    font-family:var(--tri-text);
    font-size: clamp(13px, 0.4vw + 10px, 15px);
    line-height: 1.6;
    color: #6E756B;
  }

  /* ── Archive Turntable caption + resilient fallback ── */
  .disco__caption {
    position: absolute; z-index: 3;
    left: 50%; bottom: clamp(24px, 4.2vh, 48px);
    width: min(520px, 42vw);
    transform: translateX(-50%);
    padding-top: 11px;
    border-top: 1.5px solid var(--ink);
    pointer-events: none;
  }
  .disco__caption-title {
    margin: 0;
    font-family:var(--tri-title);
    font-size: clamp(15px, 0.78vw + 10px, 19px);
    font-weight: 650; letter-spacing: -0.02em; line-height: 1.3;
    color: var(--ink);
    opacity: 1; transform: translateY(0);
    transition: opacity 170ms ease, transform 170ms var(--ease-out);
  }
  .disco__caption-title.is-changing { opacity: .65; transform: translateY(2px); }
  .disco__caption-meta {
    min-height: 1.4em; margin: 6px 0 0;
    font-family:var(--tri-ui);
    font-size: 10px; font-weight: 600; letter-spacing: .14em;
    text-transform: uppercase; color: var(--sage-deep);
  }
  .disco__caption-meta:empty { display: none; }

  /* v31 — comic cut-out tonearm.
     A flat SVG sticker sits above the WebGL deck: cream paper edge, ink keyline,
     sage body, and one coral stylus. No metallic lighting or pseudo-3D tube. */
  .disco__tonearm {
    --tonearm-swing: 0deg;
    --tonearm-lift: 0px;
    --tonearm-rest-tilt: 4deg;
    --tonearm-cue-tilt: 0deg;
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 6;
    display: block;
    width: clamp(390px, 35vw, 560px);
    aspect-ratio: 1;
    /* v31 — move the sticker 2 steps toward 2 o’clock: a bit more right and a bit more up. */
    transform: translate(23%, -69%);
    pointer-events: none;
    overflow: visible;
    opacity: 1;
  }
  .disco__tonearm svg {
    display: block;
    width: 100%;
    height: 100%;
    overflow: visible;
  }
  .disco-arm__motion {
    transform-box: view-box;
    transform-origin: 500px 125px;
    transform: translateY(var(--tonearm-lift)) rotate(calc(var(--tonearm-rest-tilt) + var(--tonearm-swing) + var(--tonearm-cue-tilt)));
    will-change: transform;
  }
  .disco-arm__paper-shadow {
    opacity: .16;
    transform: translate(13px, 15px);
  }
  .disco-arm__paper-edge,
  .disco-arm__ink-edge,
  .disco-arm__sage-body,
  .disco-arm__highlight {
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .disco-arm__paper-edge { stroke: var(--cream-high); stroke-width: 58; }
  .disco-arm__ink-edge { stroke: #211D1A; stroke-width: 42; }
  .disco-arm__sage-body { stroke: var(--sage); stroke-width: 25; }
  .disco-arm__highlight {
    stroke: rgba(250,250,248,.9);
    stroke-width: 5;
    stroke-dasharray: 136 520;
    stroke-dashoffset: 16;
  }
  .disco-arm__cutout-shape { stroke: var(--cream-high); stroke-width: 12; }
  .disco-arm__ink-shape { stroke: #211D1A; stroke-width: 8; }
  .disco-arm__pivot-face { fill: var(--sage); }
  .disco-arm__pivot-pin { fill: var(--cream-high); stroke: #211D1A; stroke-width: 7; }
  .disco-arm__head-face { fill: var(--cream-high); }
  .disco-arm__cartridge { fill: var(--coral); }
  .disco-arm__needle { stroke: #211D1A; stroke-width: 8; stroke-linecap: round; }
  .disco-arm__contact { fill: var(--coral); stroke: var(--cream-high); stroke-width: 7; }
  .disco__tonearm.is-cued .disco-arm__contact { opacity: .38; }

  .disco__fallback {
    position: absolute; inset: 0; z-index: 1;
    display: grid; place-items: center;
    padding: clamp(180px, 24vh, 230px) 22px 100px;
    pointer-events: none;
  }
  .disco__fallback[hidden] { display: none; }
  .disco__fallback-deck {
    position: relative;
    width: min(76vw, 680px); aspect-ratio: 1;
    border: 12px solid var(--ink-deep); border-radius: 50%;
    background: var(--sage);
    box-shadow: 16px 18px 0 rgba(124, 124, 120, 0.58);
  }
  .disco__fallback-deck::before,
  .disco__fallback-deck::after {
    content: ""; position: absolute; inset: 15%; border: 2px solid rgba(16,21,16,.25); border-radius: 50%;
  }
  .disco__fallback-deck::after { inset: 29%; }
  .disco__fallback-label {
    position: absolute; inset: 28%; z-index: 2; border-radius: 50%;
    display: grid; place-items: center;
    background: transparent;
  }
  .disco__fallback-label svg { display: block; width: 100%; height: 100%; overflow: visible; }
  .disco__fallback-arm { display: none; } /* v24: the shared cut-out SVG is the fallback arm too. */
  .disco__fallback-covers { position: absolute; inset: 0; }
  .disco__fallback-covers img {
    position: absolute; left: 50%; top: 50%;
    width: clamp(48px, 8vw, 84px); aspect-ratio: 1; object-fit: cover;
    border: 3px solid #211D1A;
    border-radius: 9%;
    transform: translate(-50%, -50%) rotate(var(--a)) translateY(-46%) translateY(calc(min(33vw, 285px) * -1)) rotate(var(--na));
    box-shadow: 0 8px 18px rgba(16,21,16,.14);
  }

@media (max-width: 820px) {
    .disco__title { white-space: normal; }
    /* Archive Turntable: bold crop, never a miniature desktop composition */
    .disco__head { top: 68px; left: 22px; right: 22px; }
    .disco__sub { max-width: 34ch; }
    .disco__caption {
      left: 22px; right: 22px; bottom: 22px;
      width: auto; transform: none;
      padding-top: 9px;
    }
    .disco__caption-title { font-size: 14px; }
    .disco__tonearm {
      left: 50%; right: auto;
      top: 46%;
      width: clamp(300px, 72vw, 430px);
      transform: translate(2%, -64%);
    }
    .disco__fallback { padding: 190px 0 80px; overflow: hidden; }
    .disco__fallback-deck { width: 138vw; transform: translate(18vw, 20%); }
    .disco__fallback-covers img { width: 58px; }
  }

@media (prefers-reduced-motion: reduce) {
    .disco__caption-title { transition: none; }
    .disco-arm__rot,.disco-arm__head,.disco-arm__shadow { transition:none; }
  }


  /* Discography integration shell — Archive Turntable with continuous rounded ink-frame covers. */
  .disco {
    --ink-deep: #101510;
    --ink: #1B231B;
    --sage: #B2B793;
    --sage-deep: #55654F;
    --cream-high: #FAFAF8;
    --coral: #DE654B;
    --font-display: 'Pretendard',sans-serif;
    --font-body: 'Pretendard',sans-serif;
    --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
    --panel-dur: 950ms;
    z-index: 25;
  }
  body.discography-open { overflow: hidden; }
  body.discography-open .bar__nav {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  body.discography-open .bar { color: #1B231B; }
  body.discography-open .bar__cta { background: #1B231B; color: #FAFAF8; }

/* ═══ block 04 · trinity-services-body-port ═══ */
/* Services body ported from Trinity_service_carousel_v3.html.
   Source navigation rules intentionally excluded; v5 remains authoritative. */
/* ═══════════ SERVICES — six-panel expanding carousel ═══════════ */
  .servicepage{
    --svc-ink:#211D1A;
    --svc-cream:#FAFAF8;
    --svc-sage:#D3DAC4;
    --svc-sage-deep:#5F7052;
    --svc-coral:#DE654B;
    --svc-hair:rgba(33,29,26,.16);
    --svc-ease:cubic-bezier(.22,1,.36,1);
    position:fixed;inset:0;z-index:46;overflow-y:auto;overscroll-behavior:contain;
    background:var(--svc-cream);color:var(--svc-ink);
    transform:translateX(100.5%);visibility:hidden;
    transition:transform 920ms var(--svc-ease),visibility 0s linear 920ms;
    will-change:transform;-webkit-overflow-scrolling:touch;
  }
  .servicepage.is-open{transform:translateX(0);visibility:visible;transition-delay:0s}
  body.services-open{overflow:hidden}
  .servicepage__inner{width:min(100%,1560px);min-height:100%;margin:0 auto;padding:clamp(94px,12vh,130px) clamp(20px,3.4vw,52px) 38px;display:flex;flex-direction:column}
  .servicepage__head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;margin-bottom:clamp(22px,3.5vh,38px)}
  .servicepage__eyebrow{margin:0 0 10px;font-weight:600;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:rgba(33,29,26,.52)}
  .servicepage__title{margin:0;font-family:var(--tri-title);font-weight:600;font-size:clamp(30px,4vw,64px);line-height:.98;letter-spacing:-.045em;max-width:18ch;text-wrap:balance}
  .servicepage__sub{margin:14px 0 0;max-width:61ch;font-family:var(--tri-text);font-size:clamp(13px,.35vw + 10px,15px);line-height:1.65;color:rgba(33,29,26,.66)}
  .servicepage__actions{display:flex;align-items:center;gap:9px;padding-bottom:2px}
  .servicepage__count{min-width:66px;text-align:center;font-weight:600;font-size:11px;letter-spacing:.15em;color:rgba(33,29,26,.55)}
  .servicepage__arrow,.servicepage__close{appearance:none;-webkit-appearance:none;border:1px solid var(--svc-hair);background:transparent;color:var(--svc-ink);font-family:inherit;cursor:pointer;transition:background .25s ease,color .25s ease,transform .3s var(--svc-ease)}
  .servicepage__arrow{width:42px;height:42px;border-radius:50%;font-size:17px}
  .servicepage__close{height:42px;border-radius:999px;padding:0 16px;margin-left:5px;font-weight:600;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
  .servicepage__arrow:hover,.servicepage__arrow:focus-visible,.servicepage__close:hover,.servicepage__close:focus-visible{background:var(--svc-ink);color:var(--svc-cream);outline:none;transform:translateY(-2px)}
  .servicepage__arrow:active{transform:scale(.92)}

  .service-carousel{position:relative;display:flex;min-height:clamp(650px,74vh,760px);border-top:1px solid var(--svc-hair);border-bottom:1px solid var(--svc-hair);overflow:hidden;touch-action:pan-y;isolation:isolate}
  .service-card{position:relative;min-width:0;flex:1 1 0;border-left:1px solid var(--svc-hair);background:var(--svc-cream);overflow:hidden;transition:flex-grow 820ms var(--svc-ease),background-color .42s ease;isolation:isolate}
  .service-card:first-child{border-left:0}
  .service-card.is-active{flex-grow:4.8;background:var(--svc-sage)}
  .service-card::after{content:'';position:absolute;inset:0 0 auto;height:3px;background:var(--svc-coral);transform:scaleX(0);transform-origin:left;transition:transform 650ms var(--svc-ease);z-index:5}
  .service-card.is-active::after{transform:scaleX(1)}
  .service-card__tab{appearance:none;-webkit-appearance:none;position:absolute;inset:0;z-index:4;width:100%;height:100%;border:0;background:transparent;color:inherit;text-align:left;padding:clamp(18px,1.7vw,26px);cursor:pointer;font-family:var(--tri-ui);display:flex;flex-direction:column;align-items:flex-start;transition:padding .65s var(--svc-ease)}
  .service-card.is-active .service-card__tab{height:auto;inset:0 0 auto;padding:clamp(24px,2.2vw,34px) clamp(24px,2.6vw,40px) 18px;pointer-events:none}
  .service-card__no{display:flex;align-items:center;gap:8px;font-weight:600;font-size:9px;letter-spacing:.2em;color:rgba(33,29,26,.46)}
  .service-card__no::after{content:'';width:22px;height:1px;background:currentColor;opacity:.6;transition:width .55s var(--svc-ease)}
  .service-card.is-active .service-card__no::after{width:48px}
  .service-card__name{display:block;margin-top:14px;font-weight:600;font-size:clamp(11.5px,.85vw,15px);line-height:1.12;letter-spacing:-.015em;overflow-wrap:break-word;word-break:normal;transition:font-size .65s var(--svc-ease),max-width .65s var(--svc-ease)}
  .service-card.is-active .service-card__name{font-size:clamp(24px,2.25vw,37px);max-width:18ch;letter-spacing:-.035em}
  .service-card__kind{margin-top:auto;font-size:8px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(33,29,26,.42);writing-mode:vertical-rl;transform:rotate(180deg);transition:opacity .2s ease}
  .service-card.is-active .service-card__kind{opacity:0}
  .service-card__hint{position:absolute;left:clamp(18px,1.7vw,26px);bottom:clamp(18px,2.4vh,28px);font-size:8px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(33,29,26,.38);opacity:0;transform:translateY(5px);transition:opacity .25s ease,transform .35s var(--svc-ease)}
  .service-card:not(.is-active):hover .service-card__hint{opacity:1;transform:none}
  .service-card__tab:focus-visible{outline:1px solid rgba(33,29,26,.6);outline-offset:-2px}

  .service-card__body{position:absolute;z-index:2;left:clamp(24px,2.6vw,40px);right:clamp(24px,2.6vw,40px);top:clamp(184px,22vh,216px);bottom:clamp(26px,3.4vh,40px);opacity:0;visibility:hidden;transform:translateY(12px);pointer-events:none;transition:opacity .2s ease,transform .45s var(--svc-ease),visibility 0s linear .46s;display:flex;flex-direction:column;min-width:0}
  .service-card.is-active .service-card__body{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:.22s}
  .service-card__lead{display:flex;align-items:center;gap:11px;margin-bottom:15px;font-weight:600;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgba(33,29,26,.52)}
  .service-card__lead::before{content:'';width:7px;height:7px;border:2px solid var(--svc-coral);border-radius:50%;box-shadow:3px 2px 0 rgba(222,101,75,.22)}
  .service-card__copy{min-height:0;overflow:auto;padding:0 clamp(10px,1vw,16px) 20px 0;scrollbar-width:thin;scrollbar-color:rgba(33,29,26,.28) transparent;font-family:var(--tri-text);font-size:clamp(13.5px,.3vw + 11px,15.5px);line-height:1.74;color:rgba(33,29,26,.82);word-break:keep-all}
  .service-card__copy::-webkit-scrollbar{width:5px}.service-card__copy::-webkit-scrollbar-thumb{background:rgba(33,29,26,.24);border-radius:99px}
  .service-card__copy p{margin:0 0 13px}.service-card__copy p:last-child{margin-bottom:0}
  .service-card[data-service="recording"] .service-card__copy{column-count:2;column-gap:clamp(22px,2.2vw,36px);column-rule:1px solid rgba(33,29,26,.12)}
  .service-card[data-service="recording"] .service-card__copy p{break-inside:avoid}
  .service-card__proof{margin-top:auto;padding-top:16px;border-top:1px solid rgba(33,29,26,.17);display:flex;align-items:center;justify-content:space-between;gap:18px;font-family:var(--tri-ui);font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(33,29,26,.48)}
  .service-card__spark{position:relative;width:54px;height:28px;flex:0 0 auto}
  .service-card__spark i{position:absolute;left:4px;top:13px;width:33px;height:2px;background:var(--svc-coral);border-radius:99px;transform-origin:left center}
  .service-card__spark i:nth-child(1){transform:rotate(-18deg)}
  .service-card__spark i:nth-child(2){left:12px;top:8px;width:30px;transform:rotate(7deg)}
  .service-card__spark i:nth-child(3){left:20px;top:18px;width:27px;transform:rotate(24deg)}
  .service-card.is-active .service-card__spark i{animation:svcSpark 1.9s var(--svc-ease) infinite}
  .service-card.is-active .service-card__spark i:nth-child(2){animation-delay:.16s}.service-card.is-active .service-card__spark i:nth-child(3){animation-delay:.32s}
  @keyframes svcSpark{0%,78%,100%{transform-origin:left center;opacity:.36}16%{opacity:1}38%{opacity:.64}}

  .servicepage__rail{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;padding:18px 0 0}
  .servicepage__track{display:grid;grid-template-columns:repeat(var(--svc-ticks,6),1fr);gap:10px;align-items:center}
  .servicepage__tick{height:2px;background:rgba(33,29,26,.12);position:relative;overflow:hidden}
  .servicepage__tick::after{content:'';position:absolute;inset:0;background:var(--svc-coral);transform:translateX(-102%);transition:transform .55s var(--svc-ease)}
  .servicepage__tick.is-past::after,.servicepage__tick.is-active::after{transform:translateX(0)}
  .servicepage__rail-note{font-family:var(--tri-text);font-size:11px;color:rgba(33,29,26,.5);white-space:nowrap}

  .servicepage__booking{margin-top:clamp(34px,6vh,66px);padding:clamp(24px,3vw,38px) 0 10px;border-top:1px solid var(--svc-hair);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center}
  .servicepage__booking h3{margin:0 0 7px;font-weight:600;font-size:clamp(20px,2vw,31px);letter-spacing:-.025em}
  .servicepage__booking p{margin:0;font-family:var(--tri-text);font-size:13px;line-height:1.65;color:rgba(33,29,26,.62)}
  .servicepage__channels{margin-top:11px;display:flex;flex-wrap:wrap;gap:7px 15px;font-size:10px;font-weight:600;letter-spacing:.07em;color:rgba(33,29,26,.55)}
  .servicepage__booking-btn{appearance:none;border:0;border-radius:999px;background:var(--svc-ink);color:var(--svc-cream);padding:13px 22px;font:600 12px var(--tri-ui);cursor:pointer;transition:background .25s ease,transform .3s var(--svc-ease)}
  .servicepage__booking-btn:hover,.servicepage__booking-btn:focus-visible{background:var(--svc-coral);transform:translateY(-2px);outline:none}

  @media (max-width:1100px){
    .service-card.is-active{flex-grow:5.7}
    .service-card__name{font-size:13px}
    .service-card[data-service="recording"] .service-card__copy{column-count:1}
  }
  @media (max-width:820px){
    .servicepage__inner{padding:104px 16px 26px}
    .servicepage__head{grid-template-columns:1fr;align-items:start;margin-bottom:20px}
    .servicepage__actions{justify-content:flex-start;flex-wrap:wrap}
    .servicepage__title{font-size:clamp(31px,10vw,46px);max-width:13ch}
    .servicepage__sub{font-size:13px}
    .service-carousel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(var(--svc-rows,3),64px) minmax(430px,auto);min-height:0;overflow:visible;border-bottom:0}
    .service-card{display:contents}
    .service-card::after{display:none}
    .service-card__tab{position:relative;inset:auto!important;height:64px!important;padding:10px 12px!important;border-left:1px solid var(--svc-hair);border-bottom:1px solid var(--svc-hair);background:var(--svc-cream);pointer-events:auto!important;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr;gap:3px 9px;align-content:center;transition:background .25s ease,color .25s ease}
    .service-card:nth-child(odd) .service-card__tab{border-left:0}
    .service-card.is-active .service-card__tab{background:var(--svc-sage)}
    .service-card__no{grid-column:1;grid-row:1 / -1;align-self:center;font-size:8px}
    .service-card__no::after,.service-card__kind,.service-card__hint{display:none}
    .service-card__name,.service-card.is-active .service-card__name{grid-column:2;grid-row:1 / -1;align-self:center;margin:0;max-width:none;font-size:12px;line-height:1.15;letter-spacing:-.01em}
    .service-card__body,.service-card.is-active .service-card__body{position:relative;inset:auto;grid-column:1 / -1;grid-row:var(--svc-body-row,4);display:none;opacity:1;visibility:visible;transform:none;padding:26px 20px 28px;min-height:430px;background:var(--svc-sage)}
    .service-card.is-active .service-card__body{display:flex}
    .service-card__copy{font-size:14px;line-height:1.72;overflow:visible;padding-right:0}
    .service-card__proof{margin-top:26px}
    .servicepage__rail{grid-template-columns:1fr;padding-top:14px}
    .servicepage__rail-note{white-space:normal}
    .servicepage__booking{grid-template-columns:1fr;align-items:start}
    .servicepage__booking-btn{justify-self:start}
  }
  @media (max-width:520px){
    .servicepage__actions{gap:7px}.servicepage__count{min-width:55px}
    .servicepage__arrow{width:38px;height:38px}.servicepage__close{height:38px;padding:0 13px}
    .service-carousel{grid-template-rows:repeat(var(--svc-rows,3),70px) minmax(470px,auto)}
    .service-card__tab{height:70px!important;padding:9px 9px!important}
    .service-card__name,.service-card.is-active .service-card__name{font-size:11px}
    .service-card__body,.service-card.is-active .service-card__body{min-height:470px;padding:24px 16px 26px}
  }
  @media (prefers-reduced-motion:reduce){
    .servicepage,.service-card,.service-card::after,.service-card__body,.service-card__tab,.service-card__name,.servicepage__tick::after{transition-duration:1ms!important}
    .service-card__spark i{animation:none!important}
  }



  .servicepage{--svc-sage:#D8DDCF;--svc-sage-deep:#5B6B4E;--svc-coral:#5B6B4E}
  .servicepage__inner{padding:clamp(82px,10vh,106px) clamp(20px,3.4vw,52px) 28px}
  .servicepage__head{align-items:center;margin-bottom:22px}
  .servicepage__intro{display:flex;align-items:center;gap:18px;min-width:0}
  .servicepage__copyblock{min-width:0}
  .servicepage__spin{position:relative;width:74px;height:74px;flex:0 0 74px}
  .servicepage__spin-disc{position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle at center, #fafaf8 0 11%, #adbba3 11% 18%, #211d1a 18% 26%, #38342f 26% 58%, #211d1a 58% 70%, #4a4640 70% 100%);box-shadow:inset 0 0 0 1px rgba(33,29,26,.16);animation:svcSpin 6.8s linear infinite}
  .servicepage__spin-disc::after{content:'LABEL';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:600 7px var(--tri-word);letter-spacing:.16em;color:#fafaf8}
  .servicepage__spin-arm{position:absolute;right:2px;top:4px;width:28px;height:28px;border-radius:999px;transform:rotate(-16deg)}
  .servicepage__spin-arm::before{content:'';position:absolute;right:9px;top:0;width:7px;height:7px;border-radius:50%;background:#211d1a}
  .servicepage__spin-arm::after{content:'';position:absolute;right:0;top:6px;width:20px;height:3px;border-radius:99px;background:#211d1a;box-shadow:-8px 10px 0 0 #211d1a, -2px 10px 0 2px #d8ddcf}
  @keyframes svcSpin{to{transform:rotate(360deg)}}
  .servicepage__title{max-width:14ch;font-size:clamp(28px,3.5vw,52px)}
  .servicepage__sub{margin-top:10px;max-width:54ch}
  .servicepage__actions{gap:10px}
  .servicepage__close{display:none!important}
  .servicepage__arrow{width:44px;height:44px;border-radius:999px}
  .service-carousel{min-height:clamp(540px,68vh,620px)}
  .service-card{transition:flex-grow 680ms var(--svc-ease),background-color .32s ease,transform .32s var(--svc-ease),box-shadow .32s var(--svc-ease)}
  .service-card.is-active{flex-grow:4.55;background:var(--svc-sage)}
  .service-card::after{display:none}
  .service-card__tab{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%0A%3Cpath%20d%3D%22M18%205v17%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M18%207l9-2v6l-9%202z%22%20fill%3D%22%23D3DAC4%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22%20stroke-linejoin%3D%22round%22/%3E%0A%3Cellipse%20cx%3D%2213.5%22%20cy%3D%2224%22%20rx%3D%225.5%22%20ry%3D%224%22%20transform%3D%22rotate%28-18%2013.5%2024%29%22%20fill%3D%22%23F4F5F0%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22/%3E%0A%3Cpath%20d%3D%22M6%207L4%205M7%2012H4%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.7%22/%3E%0A%3C/svg%3E") 4 28, pointer}
  .service-card:not(.is-active):hover{background:#f2f4ee;transform:translateY(-4px);box-shadow:0 16px 26px rgba(33,29,26,.08)}
  .service-card:not(.is-active):hover .service-card__hint{opacity:1;transform:none}
  .service-card__name{transition:font-size .65s var(--svc-ease),max-width .65s var(--svc-ease),transform .32s var(--svc-ease)}
  .service-card:not(.is-active):hover .service-card__name{transform:translateX(4px)}
  .service-card.is-active .service-card__name{font-size:clamp(22px,2.05vw,33px);max-width:16ch}
  .service-card__lead{margin-bottom:11px;color:rgba(33,29,26,.56)}
  .service-card__lead::before{display:none}
  .service-card__body{top:clamp(160px,20vh,188px);bottom:18px}
  .service-card__copy{font-size:clamp(13px,.22vw + 11px,14.5px);line-height:1.66}
  .service-card[data-service="recording"] .service-card__copy{column-gap:20px;column-rule:1px solid rgba(33,29,26,.10)}
  .service-card__proof{padding-top:12px;font-size:8.5px;color:rgba(33,29,26,.52)}
  .service-card__mini-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 auto;border-radius:50%;background:rgba(250,250,248,.46);border:1px solid rgba(33,29,26,.12)}
  .service-card__mini-icon svg{width:28px;height:28px;display:block}
  .service-card__mini-icon .svc-disc{transform-origin:20px 26px}
  .service-card.is-active .service-card__mini-icon .svc-disc{animation:svcMiniSpin 6s linear infinite}
  @keyframes svcMiniSpin{to{transform:rotate(360deg)}}
  .servicepage__tick::after{background:rgba(33,29,26,.56)}
  .servicepage__rail{padding-top:14px}
  .servicepage__rail-note{font-size:10.5px}
  .servicepage__booking{margin-top:24px;padding-top:20px}
  .servicepage__booking h3{font-size:clamp(18px,1.7vw,24px)}
  .servicepage__booking p{max-width:58ch}
  .servicepage__booking-btn{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%0A%3Cpath%20d%3D%22M18%205v17%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22/%3E%0A%3Cpath%20d%3D%22M18%207l9-2v6l-9%202z%22%20fill%3D%22%23D3DAC4%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22%20stroke-linejoin%3D%22round%22/%3E%0A%3Cellipse%20cx%3D%2213.5%22%20cy%3D%2224%22%20rx%3D%225.5%22%20ry%3D%224%22%20transform%3D%22rotate%28-18%2013.5%2024%29%22%20fill%3D%22%23F4F5F0%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22/%3E%0A%3Cpath%20d%3D%22M6%207L4%205M7%2012H4%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.7%22/%3E%0A%3C/svg%3E") 4 28, pointer}
  .servicepage__booking-btn:hover,.servicepage__booking-btn:focus-visible{background:#414a3b;transform:translateY(-2px)}
  @media (max-width:980px){
    .servicepage__head{grid-template-columns:1fr;gap:18px}
    .servicepage__actions{justify-content:flex-start}
    .servicepage__intro{gap:14px}
    .servicepage__spin{width:62px;height:62px;flex-basis:62px}
    .servicepage__spin-disc::after{font-size:6px}
  }
  @media (max-width:768px){
    .servicepage__inner{padding:86px 18px 22px}
    .servicepage__intro{align-items:flex-start}
    .servicepage__title{font-size:clamp(28px,8.6vw,42px)}
    .servicepage__sub{max-width:unset}
    .servicepage__booking{grid-template-columns:1fr;align-items:flex-start}
  }


  .servicepage__head{align-items:flex-start;gap:28px}
  .servicepage__intro{gap:26px;align-items:center}
  .servicepage__title{max-width:none;font-size:clamp(28px,3.85vw,60px);line-height:.94}
  .servicepage__line{display:block}
  .servicepage__line--one{white-space:normal}
  .servicepage__sub{max-width:46ch}
  .servicepage__spin{width:132px;height:132px;flex:0 0 132px}
  .servicepage__spin-disc{inset:5px;background:radial-gradient(circle at center, #FAFAF8 0 10%, #DE654B 10% 19%, #211D1A 19% 28%, #39342F 28% 58%, #211D1A 58% 70%, #4B4640 70% 100%);box-shadow:inset 0 0 0 1px rgba(33,29,26,.18), 0 10px 18px rgba(33,29,26,.08)}
  .servicepage__spin-disc::after{content:'LABEL';font:600 9px var(--tri-word);letter-spacing:.16em;color:#FAFAF8}
  .servicepage__spin-arm{right:8px;top:10px;width:48px;height:48px;transform:rotate(-14deg)}
  .servicepage__spin-arm::before{right:16px;top:0;width:10px;height:10px}
  .servicepage__spin-arm::after{right:0;top:10px;width:34px;height:4px;background:#211D1A;box-shadow:-13px 15px 0 0 #211D1A,-3px 15px 0 3px #E9E5DD}

  .service-card__hint{display:none!important}
  .service-card__kind{bottom:auto}
  .service-card:not(.is-active):hover{background:#F1F1EE;transform:translateY(-4px);box-shadow:0 14px 22px rgba(33,29,26,.08)}

  .service-card__proof{padding-top:12px;gap:14px;align-items:center}
  .service-card__proof > span:first-child{flex:1 1 auto;min-width:0}
  .service-card__mini-icon{display:flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px;border-radius:50%;background:#F7F7F3;border:1px solid rgba(33,29,26,.13)}
  .service-card__mini-icon svg{display:block;width:30px;height:30px}
  .service-card__mini-icon--recording svg .pulse{animation:svcPulse 1.8s ease-in-out infinite}
  @keyframes svcPulse{0%,100%{opacity:.7}50%{opacity:1}}

  .servicepage__rail{padding:14px 0 0}
  .servicepage__rail-note{font-size:10.5px}
  .servicepage__inner{padding-bottom:8px}
  .servicepage__booking{display:none!important}

  /* make the custom note cursor match Program Map colors exactly */
  .service-card__tab,
  .servicepage__arrow,
  .servicepage__count,
  .servicepage__rail-note,
  .service-card__copy,
  .service-card__proof,
  .service-card__lead{
    cursor:auto;
  }
  .service-card__tab{
    cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%0A%3Cpath%20d%3D%22M18%205v17%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M18%207l9-2v6l-9%202z%22%20fill%3D%22%23DE654B%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cellipse%20cx%3D%2213.5%22%20cy%3D%2224%22%20rx%3D%225.5%22%20ry%3D%224%22%20transform%3D%22rotate%28-18%2013.5%2024%29%22%20fill%3D%22%23D3DAC4%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222.5%22%2F%3E%0A%3Cpath%20d%3D%22M6%207l-2-2M7%2012H4%22%20fill%3D%22none%22%20stroke%3D%22%23211D1A%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20opacity%3D%22.7%22%2F%3E%0A%3C%2Fsvg%3E") 4 28, pointer;
  }

  @media (max-width: 1200px){
    .servicepage__title{font-size:clamp(30px,4.2vw,54px)}
    .servicepage__spin{width:114px;height:114px;flex-basis:114px}
  }
  @media (max-width: 980px){
    .servicepage__head{grid-template-columns:1fr;gap:18px}
    .servicepage__intro{gap:18px;align-items:center}
    .servicepage__title{font-size:clamp(30px,5.4vw,48px)}
    .servicepage__sub{max-width:54ch}
  }
  @media (max-width: 768px){
    .servicepage__intro{gap:14px;align-items:flex-start}
    .servicepage__spin{width:92px;height:92px;flex-basis:92px}
    .servicepage__spin-disc::after{font-size:7px}
    .servicepage__title{font-size:clamp(25px,7.6vw,38px);line-height:.96}
    .servicepage__line--one{white-space:normal}
    .servicepage__sub{font-size:13px;line-height:1.58}
  }
  @media (max-width: 430px){
    .servicepage__title{font-size:clamp(24px,7.3vw,34px)}
    .servicepage__spin{width:84px;height:84px;flex-basis:84px}
  }

/* ═══ block 05 · trinity-v5-navigation-flow-patch ═══ */
/* Keep the index physically stable at the end of the hero runway. */
  .after{min-height:0!important;height:0!important;overflow:hidden!important;display:block!important}

  /* Every page enters from below. Services and FAQ previously entered laterally. */
  .servicepage{z-index:28!important;transform:translateY(100.5%)!important;transition:transform 920ms var(--svc-ease),visibility 0s linear 920ms!important}
  .servicepage.is-open{transform:translateY(0)!important;transition-delay:0s!important}
  .promap{z-index:29!important}
  .faqpage{transform:translateY(100.5%)!important;transition:transform 760ms var(--faq-ease)!important}
  .faqpage.is-open{transform:translateY(0)!important}

  body.chapter-page-open,body.booking-page-open{overflow:hidden}
  body.services-open .bar__nav,
  body.chapter-page-open .bar__nav,
  body.booking-page-open .bar__nav{
    opacity:1;transform:none;pointer-events:auto
  }
  body.services-open .bar,
  body.chapter-page-open .bar{color:var(--ink)}
  body.services-open .bar__cta,
  body.chapter-page-open .bar__cta{background:var(--ink);color:var(--cream-high)}

  /* A stronger, structural current-chapter marker. */
  .bar__link{padding-bottom:7px}
  .bar__link.is-active{font-weight:700;opacity:1;letter-spacing:.155em}
  .bar__link.is-active::after{right:0;height:2px}
  .bar__link.is-active::before{
    content:'●  ON AIR';
    position:absolute;left:50%;top:calc(100% + 7px);transform:translateX(-50%);
    font-size:8px;line-height:1;letter-spacing:.12em;white-space:nowrap;
    color:var(--nav-on-air,var(--accent));font-weight:700;opacity:1
  }
  .bar__cta{position:relative}
  .bar__cta.is-active{box-shadow:0 0 0 2px var(--accent),0 8px 22px rgba(33,29,26,.16)}
  .bar__cta.is-active::after{
    content:'ON AIR';position:absolute;left:50%;top:calc(100% + 7px);transform:translateX(-50%);
    color:var(--accent);font-size:8px;line-height:1;letter-spacing:.13em;font-weight:700;white-space:nowrap
  }


  body.faq-open .bar{color:var(--ink)!important}
  body.faq-open .bar__cta{background:var(--ink)!important;color:var(--cream-high)!important}
  body.faq-open{--nav-on-air:var(--accent)}

  /* Temporary chapter vessels preserve the final sequence before full content lands. */
  .chapterpage{
    --chapter-ink:#211D1A;--chapter-cream:#FAFAF8;--chapter-sage:#D3DAC4;--chapter-coral:#DE654B;
    --chapter-ease:cubic-bezier(.22,1,.36,1);
    position:fixed;inset:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    background:var(--chapter-cream);color:var(--chapter-ink);
    transform:translateY(100.5%);visibility:hidden;
    transition:transform 950ms var(--chapter-ease),visibility 0s linear 950ms;
    will-change:transform
  }
  .chapterpage.is-open{transform:translateY(0);visibility:visible;transition-delay:0s}
  #people-page{z-index:26}
  #board-page{z-index:30}
  #booking-page{z-index:31}
  .chapterpage__inner{
    min-height:100%;width:min(100%,1440px);margin:0 auto;
    padding:clamp(104px,13vh,148px) clamp(22px,5vw,72px) clamp(46px,7vh,86px);
    display:flex;flex-direction:column
  }
  .chapterpage__eyebrow{
    display:flex;align-items:center;gap:12px;margin:0 0 18px;
    font:600 11px var(--tri-ui);letter-spacing:.2em;text-transform:uppercase;color:var(--chapter-coral)
  }
  .chapterpage__eyebrow::before{content:'';width:34px;height:1.5px;background:currentColor}
  .chapterpage__title{
    margin:0;font:600 clamp(52px,8vw,116px)/.9 var(--tri-title);
    letter-spacing:-.055em;text-transform:uppercase
  }
  .chapterpage__lead{
    margin:clamp(22px,3.5vh,38px) 0 0;max-width:58ch;
    font:400 clamp(15px,.5vw + 11px,18px)/1.72 var(--tri-text);color:rgba(33,29,26,.68)
  }
  .chapterpage__frame{
    margin-top:clamp(46px,8vh,92px);border-top:1px solid rgba(33,29,26,.22);border-bottom:1px solid rgba(33,29,26,.22);
    min-height:clamp(230px,34vh,390px);display:grid;grid-template-columns:minmax(120px,.35fr) minmax(0,1fr);align-items:stretch
  }
  .chapterpage__number{
    display:flex;align-items:flex-start;padding:26px 0;
    font:600 clamp(42px,6vw,86px)/1 var(--tri-title);color:rgba(33,29,26,.18)
  }
  .chapterpage__content{
    border-left:1px solid rgba(33,29,26,.22);padding:clamp(28px,4vw,56px);
    display:flex;flex-direction:column;justify-content:center
  }
  .chapterpage__content small{font:600 9px var(--tri-ui);letter-spacing:.2em;text-transform:uppercase;color:rgba(33,29,26,.46)}
  .chapterpage__content h3{margin:12px 0 12px;font:600 clamp(26px,3.2vw,52px)/1.04 var(--tri-title);letter-spacing:-.035em}
  .chapterpage__content p{margin:0;max-width:58ch;font:400 15px/1.72 var(--tri-text);color:rgba(33,29,26,.68)}
  .chapterpage__contacts{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px}
  .chapterpage__contacts a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;font:600 12px var(--tri-ui);letter-spacing:.04em}
  .chapterpage__next{
    margin-top:auto;padding-top:30px;display:flex;justify-content:space-between;gap:20px;
    font:600 9px var(--tri-ui);letter-spacing:.18em;text-transform:uppercase;color:rgba(33,29,26,.48)
  }
  .chapterpage__next strong{color:var(--chapter-ink);font-weight:600}
  #disco::after{
    content:'KEEP SCROLLING OUTSIDE THE TURNTABLE  ·  NEXT: PEOPLE ↓';
    position:absolute;right:clamp(22px,4vw,56px);bottom:clamp(24px,4.2vh,48px);z-index:4;
    font:600 8px var(--tri-ui);letter-spacing:.15em;color:rgba(33,29,26,.46);pointer-events:none
  }

  @media(max-width:820px){
    .bar__link.is-active::before{top:calc(100% + 4px);font-size:7px}
    .bar__cta.is-active::after{top:calc(100% + 4px);font-size:7px}
    .chapterpage__inner{padding:110px 18px 34px}
    .chapterpage__title{font-size:clamp(48px,17vw,76px)}
    .chapterpage__frame{grid-template-columns:1fr;min-height:360px}
    .chapterpage__number{padding:22px 0 12px}
    .chapterpage__content{border-left:0;border-top:1px solid rgba(33,29,26,.22);padding:26px 0}
    .chapterpage__next{align-items:flex-start;flex-direction:column;gap:8px}
    #disco::after{right:22px;bottom:80px;max-width:190px;text-align:right;line-height:1.5}
  }
  @media(prefers-reduced-motion:reduce){
    .chapterpage,.servicepage,.faqpage{transition-duration:1ms!important}
  }

/* ═══ block 06 · trinity-booking-hover-unified ═══ */
/* Unified Booking hover — one color change on every chapter. */
  .bar__cta:hover,
  .bar__cta:focus-visible{
    background:var(--accent)!important;
    color:var(--cream-high)!important;
    transform:translateY(-2px);
    outline:none;
  }

/* ═══ block 07 · trinity-people-equipment-integration ═══ */
/* People + Equipment v4, namespaced and mounted as one continuous v7 chapter. */
#people-page{
  z-index:26;
  background:#FAFAF8;
  scroll-behavior:smooth;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
#people-page:focus{outline:none}
#people-page #people-showcase,#people-page #equipment-list{scroll-margin-top:0}
#people-page{
    --cream-high:#FAFAF8;
    --ink:#211D1A;
    --ink-soft:rgba(33,29,26,.62);
    --sage:#5F7052;
    --sage-pale:#D3DAC4;
    --sage-mid:#B1B890;   /* measured from the NEVE cartoon ground — quad continuity token */
    --accent:#DE654B;
    --hairline:rgba(33,29,26,.14);
    --ease:cubic-bezier(.22,1,.36,1);
    --headw:clamp(150px,20vw,250px);
  }
#people-page *{margin:0;padding:0;box-sizing:border-box}
#people-page{scroll-behavior:smooth}
#people-page{background:var(--cream-high);color:var(--ink);font-family:var(--tri-ui);overflow-x:hidden}
#people-page img{display:block}
/* ═══════════ Persistent global navigation (chrome scaffold — wiring lands on assembly) ═══════════ */
/* ═══════════ QUAD — four drawn panels around one spinning record ═══════════ */
#people-page .quadsec{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;
           gap:clamp(14px,2.4vh,24px);padding:clamp(84px,11vh,110px) 16px clamp(26px,4vh,44px);background:var(--cream-high)}
#people-page .secband{font-weight:600;font-size:10px;letter-spacing:.3em;color:var(--ink-soft);text-align:center}
#people-page .quad{position:relative;width:min(94vw,calc(100svh - 220px),1000px);aspect-ratio:1;
        display:grid;grid-template-columns:var(--c1,1fr) var(--c2,1fr);grid-template-rows:var(--r1,1fr) var(--r2,1fr);
        gap:3px;background:var(--ink);border:3px solid var(--ink);border-radius:4px;
        box-shadow:0 14px 0 rgba(33,29,26,.12);
        container-type:size;
        transition:grid-template-columns .75s var(--ease),grid-template-rows .75s var(--ease)}
#people-page .quad.ex-tl{--c1:1.6fr;--c2:1fr;--r1:1.6fr;--r2:1fr;--dx:11.55cqw;--dy:11.55cqh}
#people-page .quad.ex-br{--c1:1fr;--c2:1.6fr;--r1:1fr;--r2:1.6fr;--dx:-11.55cqw;--dy:-11.55cqh}
#people-page .q{position:relative;overflow:hidden;outline:none;cursor:pointer}
#people-page .q:focus-visible::after{content:"";position:absolute;inset:5px;border:2px solid var(--accent);pointer-events:none}
#people-page .q--img{background:var(--sage-mid);cursor:default}
#people-page .q--img img{width:100%;height:100%;object-fit:cover}
#people-page .q--sichul img{object-position:100% 32%}
#people-page .q--neve img{object-position:50% 55%}
#people-page .q--copy{background:var(--cream-high);padding:clamp(13px,2.4vmin,30px)}
#people-page .q__in{width:calc(50cqw - 2*clamp(13px,2.4vmin,30px) - 2px);height:100%;min-height:0;display:flex;flex-direction:column}
#people-page .q--br .q__in{justify-content:flex-end}
#people-page .q--gear{background:var(--ink);color:var(--cream-high)}
#people-page .q__kicker{font-weight:600;font-size:clamp(8px,1.1vmin,11px);letter-spacing:.2em;text-transform:uppercase;
             color:var(--accent);display:flex;align-items:center;gap:9px;margin-bottom:clamp(8px,1.6vmin,16px);
             transition:margin-left .75s var(--ease)}
#people-page .quad.ex-br .q--br .q__kicker{margin-left:clamp(30px,9%,56px)}
#people-page .q__title{transition:padding-top .75s var(--ease)}
#people-page .quad.ex-br .q--br .q__title{padding-top:8px}
#people-page .q__kicker::before{content:"";width:24px;height:1.5px;background:currentColor}
/* — People quad — */
#people-page .q__hl{font-family:var(--tri-title);font-weight:800;line-height:.96;letter-spacing:-.01em;
         font-size:clamp(17px,3.5vmin,37px);margin-bottom:clamp(8px,1.8vmin,18px)}
#people-page .q__hl .tint{color:var(--accent)}
#people-page .q__name{font-weight:600;font-size:clamp(11px,1.7vmin,16px);letter-spacing:.06em;margin-bottom:3px}
#people-page .q__name .ko{font-family:var(--tri-ui);font-weight:500;color:var(--ink-soft);letter-spacing:0;margin-left:6px}
#people-page .q__line{font-family:var(--tri-text);font-size:clamp(9.5px,1.35vmin,12.5px);line-height:1.55;color:var(--ink-soft)}
#people-page .q__deep{margin-top:clamp(6px,1.3vmin,12px);display:flex;flex-direction:column;gap:2px}
#people-page .q__deep .q__line strong{font-weight:600;color:var(--ink)}
#people-page .q--tl .q__more{padding:0 clamp(44px,13%,72px) clamp(18px,4cqh,40px) 0}
#people-page .q__more{margin-top:clamp(8px,1.6vmin,16px);opacity:0;transform:translateY(10px);max-height:0;overflow:hidden;
           flex:0 1 auto;min-height:0;width:calc(61.5cqw - 2*clamp(13px,2.4vmin,30px) - 2px);
           transition:opacity .4s ease .28s,transform .55s var(--ease) .28s,max-height .75s var(--ease);
           display:flex;flex-direction:column;gap:clamp(6px,1.2vmin,11px)}
#people-page .quad.ex-tl .q--tl .q__more,#people-page .quad.ex-br .q--br .q__more{opacity:1;transform:none;max-height:44cqh;overflow-y:auto;
           scrollbar-width:none}
#people-page .q__more::-webkit-scrollbar{display:none}
#people-page .q__morelabel{font-weight:600;font-size:clamp(8px,1vmin,10px);letter-spacing:.18em;color:var(--ink);
                border-top:1.5px solid var(--ink);padding-top:clamp(6px,1.2vmin,10px)}
#people-page .credit{font-family:var(--tri-ui);font-size:clamp(9px,1.25vmin,11.5px);line-height:1.6;color:var(--ink-soft)}
#people-page .credit b{font-family:var(--tri-ui);font-weight:600;font-size:.88em;letter-spacing:.1em;color:var(--sage);display:block;margin-bottom:1px}
/* — Gear quad — */
#people-page .q--gear .q__kicker{color:var(--accent)}
#people-page .q__title{font-family:var(--tri-title);font-weight:700;line-height:1.16;letter-spacing:-.015em;
            font-size:clamp(13px,2.5vmin,26px);max-width:16ch;margin-bottom:clamp(7px,1.5vmin,14px)}
#people-page .q__body{font-family:var(--tri-text);font-size:clamp(9.5px,1.35vmin,13px);line-height:1.6;
           color:rgba(250,250,248,.78);max-width:34ch}
#people-page .q__stats{margin-top:clamp(8px,1.6vmin,14px);display:grid;grid-template-columns:repeat(3,auto);justify-content:start;
            gap:clamp(10px,2.4vmin,26px);padding-top:clamp(8px,1.6vmin,14px)}
#people-page .stat__n{font-family:var(--tri-title);font-weight:800;font-size:clamp(12px,2.2vmin,23px);color:var(--accent);line-height:1}
#people-page .stat__l{font-weight:600;font-size:clamp(7px,.95vmin,9.5px);letter-spacing:.16em;color:rgba(250,250,248,.6);margin-top:4px}
#people-page .q--gear .q__morelabel{border-color:rgba(250,250,248,.9);color:var(--cream-high)}
#people-page .q--br .q__more{padding-left:clamp(6px,2%,14px)}
#people-page .gidx{display:flex;flex-direction:column}
#people-page .gidx__row{display:flex;justify-content:space-between;gap:12px;font-size:clamp(9px,1.25vmin,12px);
             padding:clamp(3px,.7vmin,6px) 0;border-bottom:1px solid rgba(250,250,248,.14);color:rgba(250,250,248,.85)}
#people-page .gidx__row .no{font-weight:600;font-size:.82em;letter-spacing:.12em;color:var(--accent);margin-right:8px}
#people-page .gidx__row .ct{font-weight:600;color:rgba(250,250,248,.55)}
#people-page .gidx__cta{display:inline-block;text-decoration:none;margin-top:clamp(6px,1.2vmin,10px);font-weight:600;font-size:clamp(9px,1.2vmin,11px);letter-spacing:.14em;color:var(--cream-high)}
/* — the record — */
#people-page .spin{position:absolute;left:50%;top:50%;
        transform:translate(calc(-50% + var(--dx,0cqw)),calc(-50% + var(--dy,0cqh)));
        width:clamp(96px,17%,170px);aspect-ratio:1;z-index:6;border:0;background:none;padding:0;cursor:pointer;
        transition:transform .75s var(--ease),width .75s var(--ease);will-change:transform}
#people-page .quad.ex-tl .spin,#people-page .quad.ex-br .spin{width:clamp(80px,13.5%,136px)}
#people-page .spin:focus-visible{outline:none}
#people-page .spin:focus-visible .spin__disc{outline:2px solid var(--accent);outline-offset:8px;border-radius:50%}
#people-page .spin__disc{width:100%;height:100%;border-radius:50%;
              animation:peSpinRot 5.4s linear infinite;
              filter:drop-shadow(0 9px 0 rgba(33,29,26,.22))}
#people-page .quad.is-hot .spin__disc,#people-page .spin:hover .spin__disc{animation-duration:1.4s}
@keyframes peSpinRot{to{transform:rotate(360deg)}}
#people-page .spin svg{display:block;width:100%;height:100%}
/* — scroll cue → equipment list — */
#people-page .cue{font-weight:500;font-size:11px;letter-spacing:.3em;color:var(--ink-soft);
       display:flex;flex-direction:column;align-items:center;gap:10px;text-decoration:none}
#people-page .cue__line{width:1px;height:30px;background:rgba(33,29,26,.22);position:relative;overflow:hidden}
#people-page .cue__line::after{content:"";position:absolute;left:0;top:-100%;width:1px;height:100%;
                    background:var(--ink);animation:peCueDrop 2.1s cubic-bezier(.65,0,.35,1) infinite}
@keyframes peCueDrop{0%{top:-100%}55%{top:100%}100%{top:100%}}
/* ═══════════ EQUIPMENT LIST — marquee bands ═══════════ */
#people-page .gear{background:var(--cream-high);padding:clamp(64px,10vh,120px) clamp(18px,4vw,56px) clamp(70px,10vh,120px)}
#people-page .gear__in{max-width:1360px;margin:0 auto}
#people-page .gear__kicker{display:flex;align-items:center;gap:12px;font-weight:600;font-size:11px;letter-spacing:.2em;
                text-transform:uppercase;color:var(--accent);margin-bottom:14px}
#people-page .gear__kicker::before{content:"";width:34px;height:1.5px;background:currentColor}
#people-page .gear__title{font-family:var(--tri-title);font-weight:700;font-size:clamp(24px,2vw/**/+12px,42px);
               line-height:1.12;letter-spacing:-.02em;max-width:24ch;margin-bottom:10px}
#people-page .gear__note{font-family:var(--tri-text);font-size:clamp(12px,.4vw/**/+9px,14px);line-height:1.6;
              color:var(--ink-soft);max-width:60ch;margin-bottom:clamp(34px,5vh,54px)}
#people-page .bands{border-top:2.5px solid var(--ink)}
#people-page .band{border-bottom:1px solid var(--hairline);position:relative}
#people-page .band__bg{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;transition:opacity .55s var(--ease);pointer-events:none}
@media (hover:hover){#people-page .band:hover .band__bg{opacity:.12}}
#people-page .band.is-open .band__bg{opacity:.12}
#people-page .band__row{display:grid;grid-template-columns:var(--headw) minmax(0,1fr);align-items:start;position:relative;z-index:1;
             width:100%;text-align:left;cursor:pointer}
#people-page .band__row:focus-visible{outline:none}
#people-page .band:has(.band__row:focus-visible){background:rgba(33,29,26,.03)}
#people-page .band__head{padding:24px 14px 20px 2px}
#people-page .band__col2{display:block;position:relative;min-width:0}
#people-page .band__no{font-weight:600;font-size:10px;letter-spacing:.18em;color:var(--accent);display:block;margin-bottom:4px}
#people-page .band__nm{font-weight:600;font-size:clamp(13px,1vw/**/+7px,18px);letter-spacing:.05em;text-transform:uppercase;line-height:1.15}
#people-page .band__ct{font-weight:500;font-size:10px;letter-spacing:.12em;color:var(--ink-soft);display:block;margin-top:4px}
#people-page .band__rollwrap{display:block;overflow:hidden;max-height:96px;opacity:1;transition:max-height .5s var(--ease),opacity .25s ease;
                  -webkit-mask-image:linear-gradient(90deg,transparent,#000 34px,#000 calc(100% - 34px),transparent);
                  mask-image:linear-gradient(90deg,transparent,#000 34px,#000 calc(100% - 34px),transparent)}
#people-page .band__roll{display:flex;gap:10px;width:max-content;padding:26px 0;
              animation:peRollX var(--dur,60s) linear infinite}
@keyframes peRollX{to{transform:translateX(-50%)}}
#people-page .band.is-open .band__roll{animation-play-state:paused}
@media (hover:hover){#people-page .band:hover .band__roll{animation-play-state:paused}
#people-page .band:hover .band__rollwrap{max-height:0;opacity:0}
#people-page .band:hover .band__grid{height:var(--band-grid-h,240px);opacity:1;padding:24px 0 24px}}
#people-page .band.is-open .band__rollwrap{max-height:0;opacity:0}
#people-page .band__grid{display:flex;flex-wrap:wrap;align-content:flex-start;gap:10px;height:0;opacity:0;overflow:hidden;box-sizing:border-box;
              transition:height .55s var(--ease),opacity .4s ease,padding .55s var(--ease)}
#people-page .band.is-open .band__grid{height:var(--band-grid-h,240px);opacity:1;padding:24px 0 24px}
#people-page .chip{display:inline-flex;align-items:baseline;white-space:nowrap;border:1.5px solid var(--ink);
        background:#fff;padding:8px 12px;font-weight:500;font-size:clamp(11.5px,.3vw/**/+9px,13px);letter-spacing:.01em;
        box-shadow:0 3px 0 rgba(33,29,26,.13);border-radius:3px;
        transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
#people-page .chip:hover{transform:translateY(-3px);box-shadow:0 6px 0 rgba(33,29,26,.18)}
#people-page .chip .x{color:var(--accent);font-weight:600;margin-left:6px}
#people-page .chip .tag{font-family:var(--tri-ui);font-weight:500;font-size:9px;letter-spacing:.1em;text-transform:uppercase;
             color:var(--ink-soft);margin-left:8px}
#people-page .chip--hero{background:var(--ink);color:var(--cream-high)}
#people-page .chip--sum{border-color:var(--accent);color:var(--accent);background:transparent;font-weight:600}
/* ═══════════ scaffold end marker ═══════════ */
#people-page .after{min-height:44vh;display:grid;place-items:center;background:var(--cream-high);border-top:1px solid var(--hairline)}
#people-page .after p{font-weight:500;font-size:12px;letter-spacing:.28em;color:var(--ink-soft)}
/* ═══════════ Mobile ═══════════ */
@media (max-width:820px){#people-page .quadsec{padding-top:76px}
#people-page .quad{width:min(94vw,calc(100svh - 190px))}
#people-page .q--copy{padding:11px 12px}
#people-page .q__deep{display:none}
#people-page .quad.ex-tl .q--tl .q__deep{display:flex}
#people-page .q--gear .q__body{display:none}
#people-page .quad.ex-br .q--gear .q__body{display:block}
#people-page .spin{width:88px}
#people-page .q__stats{gap:12px}
#people-page .band__row{grid-template-columns:1fr}
#people-page .band__head{padding:14px 0 0}
#people-page .band__rollwrap{max-height:66px}
#people-page .band__roll{padding:12px 0 18px}
#people-page .band.is-open .band__grid,#people-page .band:hover .band__grid{height:auto;padding:6px 0 20px}}
@media (prefers-reduced-motion:reduce){#people-page{scroll-behavior:auto}
#people-page .quad,#people-page .spin,#people-page .q__more{transition:none}
#people-page .spin__disc{animation:none}
#people-page .cue__line::after{animation:none}
#people-page .band__rollwrap{display:none}
#people-page .band__grid{height:auto;opacity:1;padding:24px 0 24px}
#people-page .q__more{transition:none}
#people-page .chip,#people-page .chip:hover{transform:none;transition:none}}

/* ═══ block 08 · trinity-v9-program-services-fix ═══ */
/* Shared title turntable — same visual language as the hero/archive records. */
  .title-record{
    position:relative;flex:0 0 auto;width:clamp(90px,12.8vh,124px);aspect-ratio:1;
    isolation:isolate;overflow:visible
  }
  .title-record__shadow{
    position:absolute;inset:11% 4% 3% 15%;z-index:0;border-radius:50%;
    background:rgba(86,84,80,.34);transform:translate(7px,8px)
  }
  .title-record__vinyl{position:absolute;inset:4% 8% 8% 4%;z-index:1;width:88%;height:88%;overflow:visible;
    transform-origin:50% 50%;animation:titleRecordSpin 7.2s linear infinite}
  .title-record__arm{position:absolute;z-index:3;right:-8%;top:-5%;width:72%;height:72%;overflow:visible}
  .title-record__accent{position:absolute;z-index:4;left:-10%;top:9%;width:28%;height:28%;overflow:visible;opacity:.72}
  @keyframes titleRecordSpin{to{transform:rotate(360deg)}}

  /* Services: exactly one viewport; card copy is the only vertical scroller on desktop. */
  @media (min-width:821px){
    .servicepage{height:100vh;height:100dvh;overflow:hidden!important}
    .servicepage__inner{
      height:100vh;height:100dvh;min-height:0!important;
      padding:clamp(70px,8.6vh,92px) clamp(20px,3.4vw,52px) clamp(10px,1.5vh,18px)!important
    }
    .servicepage__head{flex:0 0 auto;align-items:center!important;margin-bottom:clamp(12px,1.8vh,20px)!important}
    .servicepage__intro{gap:clamp(18px,2vw,28px)!important}
    .service-carousel{flex:1 1 auto;min-height:0!important;height:auto!important}
    .servicepage__rail{flex:0 0 auto;padding-top:clamp(8px,1.2vh,13px)!important}
    .servicepage__title{font-size:clamp(28px,3.55vw,56px)!important}
  }

  @media (min-width:821px) and (max-height:760px){
    .title-record{width:86px}
    .servicepage__inner{padding-top:64px!important;padding-bottom:8px!important}
    .servicepage__head{margin-bottom:10px!important}
    .servicepage__title{font-size:clamp(27px,3.2vw,48px)!important}
    .servicepage__sub{font-size:12.5px!important;line-height:1.5!important}
  }

  @media (max-width:820px){
    .title-record{width:82px}
    .servicepage__intro{gap:14px!important}
  }

  @media (prefers-reduced-motion:reduce){.title-record__vinyl{animation:none}}

/* ═══ block 09 · trinity-v11-requested-refinements ═══ */
/* One eyebrow system across all chapter-level pages. */
  .page-eyebrow{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    margin:0 0 14px!important;
    font-family:var(--tri-ui) !important;
    font-weight:600!important;
    font-size:11px!important;
    line-height:1!important;
    letter-spacing:.20em!important;
    text-transform:uppercase!important;
  }
  .page-eyebrow::before{
    content:''!important;
    display:block!important;
    flex:0 0 34px!important;
    width:34px!important;
    height:1.5px!important;
    background:currentColor!important;
  }
  .disco .page-eyebrow,
  .servicepage .page-eyebrow,
  .chapterpage .page-eyebrow,
  .faqpage .page-eyebrow,
  #people-page .page-eyebrow{color:#DE654B!important}
  .promap .page-eyebrow{color:#DE654B!important}

  /* Services now uses the same body/display title family as the other chapter titles. */
  .servicepage__title{
    font-family:var(--tri-title) !important;
    font-weight:700!important;
    letter-spacing:-.025em!important;
  }

/* ═══ block 10 · trinity-board-page ═══ */
.boardpage{
  --board-ink:#211D1A;
  --board-cream:#FAFAF8;
  --board-sage:#D3DAC4;
  --board-selected-sage:#D3DAC4;
  --board-sage-main:#ADBBA3;
  --board-sage-deep:#5F7052;
  --board-coral:#DE654B;
  --board-pink:#FF9DB5;
  --board-amber:#FFA24B;
  --board-hair:rgba(33,29,26,.15);
  --board-ease:cubic-bezier(.22,1,.36,1);
  position:fixed;inset:0;z-index:44;overflow:hidden;overscroll-behavior:contain;
  background:var(--board-cream);color:var(--board-ink);
  transform:translateX(100.5%);visibility:hidden;
  transition:transform 900ms var(--board-ease),visibility 0s linear 900ms;
  will-change:transform;
}
.boardpage.is-open{transform:translateX(0);visibility:visible;transition-delay:0s}
body.board-open{overflow:hidden}
body.board-open .bar__nav{opacity:1;transform:none;pointer-events:auto}
body.board-open .bar{color:var(--board-ink)}
body.board-open .bar__cta{background:var(--board-ink);color:var(--board-cream)}
.boardpage__inner{width:min(100%,1480px);height:100vh;height:100dvh;margin:0 auto;padding:clamp(72px,8vh,94px) clamp(26px,4.2vw,68px) clamp(16px,2.2vh,26px);display:flex;flex-direction:column;overflow:hidden}

.boardpage__head{flex:0 0 auto;display:flex;align-items:flex-end;justify-content:space-between;gap:26px;margin-bottom:clamp(12px,1.8vh,22px)}
.boardpage__titlewrap{min-width:0}
.boardpage__eyebrow{display:flex;align-items:center;gap:11px;margin:0 0 7px;font-weight:600;font-size:10px;letter-spacing:.25em;text-transform:uppercase;color:rgba(33,29,26,.54)}
.boardpage__eyebrow::before{content:'';width:34px;height:1px;background:var(--board-coral)}
.boardpage__title{margin:0;font-family:var(--tri-title);font-size:clamp(26px,3.7vh,42px);font-weight:600;line-height:1;letter-spacing:-.037em}
.boardpage__title .board-coral{color:var(--board-coral)}
.boardpage__intro{margin:9px 0 0;max-width:56ch;font-family:var(--tri-text);font-size:clamp(12px,1.4vh,14px);line-height:1.55;color:rgba(33,29,26,.64)}
.boardpage__doodle{flex:0 0 auto;width:clamp(48px,7vh,68px);height:auto;transform-origin:50% 85%;animation:bobNote 2.2s ease-in-out infinite}
@keyframes bobNote{0%,100%{transform:rotate(0deg)}50%{transform:rotate(-5deg)}}

/* ═════ THREE BOXES — fill one viewport, no scroll ═════ */
.bgrid{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(16px,1.9vw,32px);align-items:stretch}
.bcol{display:flex;flex-direction:column;gap:clamp(16px,2vh,30px);min-width:0;min-height:0}
.bbox{position:relative;background:var(--board-cream);border:5px solid var(--board-ink);box-shadow:10px 11px 0 rgba(33,29,26,.12);padding:clamp(14px,1.9vh,22px) clamp(16px,1.5vw,26px);min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden}
/* the two left-column boxes share the column equally (Soyoung 2026-07-22) */
#box-notice{flex:1 1 0;min-height:0}
#box-air{flex:1 1 0;min-height:0}
#box-cal{flex:1 1 auto}
.bbox__head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:14px;padding-bottom:clamp(9px,1.2vh,14px);margin-bottom:clamp(4px,.8vh,9px);border-bottom:2px solid var(--board-ink)}
.bbox__eye{display:flex;align-items:center;gap:8px;margin:0 0 6px;font:600 9px var(--tri-ui);letter-spacing:.18em;text-transform:uppercase;color:rgba(33,29,26,.55)}
.bbox__eye::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--board-coral);flex:0 0 auto}
.bbox__title{margin:0;font-family:var(--tri-title);font-size:clamp(19px,2.4vh,27px);font-weight:600;line-height:1;letter-spacing:-.03em}
.bbox__ic{flex:0 0 auto;width:clamp(34px,4.6vh,44px);height:clamp(34px,4.6vh,44px)}
.bbox__ic svg{width:100%;height:100%;display:block}

/* rows */
.bbox__body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.brow{flex:1 1 auto;min-height:0;appearance:none;-webkit-appearance:none;width:100%;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;display:grid;grid-template-columns:auto 30px minmax(0,1fr) auto;align-items:center;column-gap:12px;padding:0 8px;border-bottom:1px solid var(--board-hair);font-family:var(--tri-ui);transition:background .2s var(--board-ease),padding-left .2s var(--board-ease)}
.brow:last-child{border-bottom:0}
/* §7 — hover shifts the row and shows the arrow; no background fill of any kind.
   #box-air already overrides padding-left below and is left as it is. */
.brow:hover,.brow:focus-visible{padding-left:14px;outline:none}
.brow__bub{grid-column:1;width:20px;height:20px;flex:0 0 auto}
.brow__bub svg{width:100%;height:100%;display:block}
.brow__no{grid-column:2;font:600 11px var(--tri-ui);letter-spacing:.08em;color:rgba(33,29,26,.4)}
.brow__main{grid-column:3;min-width:0;display:flex;flex-direction:column;gap:2px;padding:3px 0}
.brow__ch{display:inline-flex;align-items:center;gap:7px;font:600 8.5px var(--tri-ui);letter-spacing:.13em;text-transform:uppercase;color:rgba(33,29,26,.6)}
.brow__ch::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--board-coral);flex:0 0 auto}
.brow__ti{font-size:clamp(13px,1.55vh,15.5px);font-weight:600;line-height:1.2;letter-spacing:-.01em;color:var(--board-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brow__arr{grid-column:4;font-size:14px;color:rgba(33,29,26,.4);opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .2s,color .2s}
.brow:hover .brow__arr,.brow:focus-visible .brow__arr{opacity:1;transform:translateX(2px);color:var(--board-ink)}
.brow--notice .brow__no{display:none}
.brow--notice{grid-template-columns:auto minmax(0,1fr) auto}
.brow--notice .brow__bub{grid-column:1}
.brow--notice .brow__main{grid-column:2}
.brow--notice .brow__arr{grid-column:3}
#box-notice .brow{min-height:clamp(54px,7vh,72px)}
#box-notice .brow__main{padding:9px 0;gap:3px}
#box-air .brow__main{padding:2px 0}

/* calendar */
.board-cal__nav{display:flex;gap:6px;flex:0 0 auto}
.board-cal__nav button{appearance:none;width:clamp(30px,4vh,36px);height:clamp(30px,4vh,36px);border:2px solid var(--board-ink);border-radius:50%;background:transparent;color:var(--board-ink);font:600 13px var(--tri-ui);cursor:pointer;transition:background .2s,color .2s,transform .25s var(--board-ease)}
.board-cal__nav button:hover,.board-cal__nav button:focus-visible{background:var(--board-ink);color:var(--board-cream);transform:translateY(-2px);outline:none}
.board-cal__monthbar{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 clamp(6px,1vh,11px)}
.board-cal__monthbar h4{margin:0;font-family:var(--tri-ui);font-size:clamp(16px,2.1vh,21px);font-weight:600;letter-spacing:-.02em}
.board-cal__monthbar .board-cal__legend{margin:0}
.board-calendar__grid{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:auto repeat(6,minmax(0,1fr));border-top:1px solid var(--board-ink);border-left:1px solid var(--board-hair)}
.board-calendar__dow{display:flex;align-items:center;padding:5px 7px;border-right:1px solid var(--board-hair);border-bottom:1px solid var(--board-hair);font:600 10px var(--tri-ui);letter-spacing:.06em;text-transform:uppercase;color:rgba(33,29,26,.55)}
.board-calendar__day{position:relative;min-height:0;padding:4px 5px;border-right:1px solid var(--board-hair);border-bottom:1px solid var(--board-hair);background:var(--board-cream);overflow:hidden}
.board-calendar__day.is-outside{background:rgba(33,29,26,.02)}
.board-calendar__day.is-outside .board-calendar__num{color:rgba(33,29,26,.3)}
.board-calendar__day.is-today::after{content:'';position:absolute;inset:2px;border:2.5px solid var(--board-ink);pointer-events:none}
.board-calendar__num{font:600 12px var(--tri-ui);letter-spacing:.02em;color:var(--board-ink)}
.board-calendar__day.is-redday .board-calendar__num{color:var(--board-coral)}
.board-calendar__day.is-outside.is-redday .board-calendar__num{color:rgba(222,101,75,.42)}
.board-calendar__day.is-today .board-calendar__num{font-weight:800}
.board-calendar__holiday{display:block;margin-top:2px;font:600 8.5px/1.2 var(--tri-ui);letter-spacing:.02em;color:rgba(33,29,26,.62);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-calendar__day.is-outside .board-calendar__holiday{color:rgba(33,29,26,.3)}
.board-calendar__today{margin-left:5px;font:800 7.5px var(--tri-ui);letter-spacing:.08em;color:var(--board-ink)}
.board-calendar__entries{display:flex;flex-direction:column;gap:3px;margin-top:4px}
.board-cal-entry{display:block;min-width:0;padding:clamp(4px,.62vh,7px) 6px;font:600 clamp(8px,1.02vh,9.5px)/1.25 var(--tri-ui);letter-spacing:.04em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-cal-entry--closed{background:var(--board-ink);color:var(--board-cream)}
.board-cal-entry--event{background:var(--board-pink);color:var(--board-ink)}
.board-cal-entry--away{background:var(--board-amber);color:var(--board-ink)}
.board-cal__legend{display:flex;gap:14px;flex-wrap:wrap;flex:0 0 auto;margin-top:clamp(8px,1.2vh,13px)}
.board-cal__legend-row{display:flex;align-items:center;gap:7px;font:600 9px var(--tri-ui);letter-spacing:.08em;text-transform:uppercase;color:rgba(33,29,26,.55)}
.board-cal__sw{width:22px;height:8px;flex:0 0 auto}
.board-cal__sw--closed{background:var(--board-ink)}
.board-cal__sw--event{background:var(--board-pink)}
.board-cal__sw--away{background:var(--board-amber)}
/* a day carrying entries lifts on hover / focus and opens a panel by the cursor */
.board-calendar__day.has-entries{cursor:default;transition:background .14s ease}
.board-calendar__day.has-entries:focus-visible{outline:none}
/* the cell stays put — only a quiet ink tint marks which day the panel belongs to */
.board-calendar__day.is-peek{background:#EFEDE8}
.board-calendar__day.is-outside.is-peek{background:#EAE8E3}
.cal-pop{
  --cp-ink:#211D1A; --cp-cream:#FAFAF8; --cp-hair:rgba(33,29,26,.15);
  --cp-pink:#FF9DB5; --cp-amber:#FFA24B;
  position:fixed;z-index:120;max-width:300px;min-width:196px;display:none;
  background:var(--cp-cream);border:3px solid var(--cp-ink);
  box-shadow:8px 9px 0 rgba(33,29,26,.22);
  padding:13px 14px;font-family:var(--tri-text);color:var(--cp-ink);pointer-events:none}
.cal-pop.is-on{display:block}
.cal-pop__date{margin:0 0 9px;font:700 9px var(--tri-ui);letter-spacing:.14em;text-transform:uppercase;color:rgba(33,29,26,.55)}
.cal-pop__row{display:flex;gap:9px;align-items:flex-start}
.cal-pop__row + .cal-pop__row{margin-top:10px;padding-top:10px;border-top:1px solid var(--cp-hair)}
.cal-pop__sw{flex:0 0 auto;width:6px;align-self:stretch;min-height:20px}
.cal-pop__row--closed .cal-pop__sw{background:var(--cp-ink)}
.cal-pop__row--event .cal-pop__sw{background:var(--cp-pink)}
.cal-pop__row--away .cal-pop__sw{background:var(--cp-amber)}
.cal-pop__body{min-width:0}
.cal-pop__msg{margin:0;font-size:13.5px;line-height:1.45;font-weight:600;color:var(--cp-ink)}
.cal-pop__title{margin:0;font-size:13.5px;line-height:1.35;font-weight:700;color:var(--cp-ink)}
.cal-pop__detail{margin:5px 0 0;font-size:12px;line-height:1.5;color:rgba(33,29,26,.7)}
@media (prefers-reduced-motion:reduce){.board-calendar__day.has-entries{transition:none}}

.boardpage__foot{flex:0 0 auto;display:flex;justify-content:space-between;gap:24px;margin-top:clamp(10px,1.6vh,18px);font:600 8px var(--tri-ui);letter-spacing:.16em;text-transform:uppercase;color:rgba(33,29,26,.42)}
.boardpage__foot strong{color:var(--board-sage-deep);font-weight:600}

@media(max-width:960px){
  .boardpage{overflow-y:auto}
  .boardpage__inner{height:auto;min-height:100dvh;overflow:visible}
  .bgrid{grid-template-columns:1fr;flex:0 0 auto}
  #box-air,#box-cal{flex:0 0 auto}
  .board-calendar__grid{grid-template-rows:auto repeat(6,minmax(46px,1fr))}
  .brow{min-height:52px}
  .brow__ti{white-space:normal;overflow:visible;text-overflow:clip}
}
@media(max-width:640px){
  .boardpage__inner{padding:92px 16px 30px}
  .bbox{border-width:4px;box-shadow:7px 8px 0 rgba(33,29,26,.12)}
  .board-calendar__grid{grid-template-rows:auto repeat(6,minmax(42px,1fr))}
}
@media(prefers-reduced-motion:reduce){
  .boardpage,.brow,.brow__arr,.board-cal__nav button{transition-duration:1ms!important}
  .boardpage__doodle{animation:none!important}
}

/* ═══ block 11 · trinity-v12-board-integration ═══ */
/* Board inherits the site's vertical chapter flow rather than the source file's lateral demo entrance. */
  .boardpage{
    z-index:30!important;
    transform:translateY(100.5%)!important;
    transition:transform 900ms var(--board-ease),visibility 0s linear 900ms!important;
  }
  .boardpage.is-open{transform:translateY(0)!important;transition-delay:0s!important}
  .boardpage .page-eyebrow{color:#DE654B!important}
  #people-page .secband.page-eyebrow{
    color:#DE654B!important;
    text-align:left!important;
    width:auto;
  }
  @media(prefers-reduced-motion:reduce){.boardpage{transition-duration:1ms!important}}

/* ═══ block 12 · trinity-v13-product-record-board-overflow ═══ */
/* Product Map uses the Services title turntable at the same scale; only its point color is sage. */
  .promap__intro .title-record{width:clamp(90px,12.8vh,124px)!important}
  .promap__title-line{display:block;white-space:nowrap}

  /* Board has no horizontal browsing axis, so the browser's bottom scrollbar is suppressed structurally. */
  .boardpage{
    width:100%;max-width:100vw;
    overflow-x:hidden!important;
    overscroll-behavior-x:none;
  }
  .boardpage__inner,
  .bgrid,
  .bcol,
  .bbox,
  .board-calendar__grid{
    min-width:0;
    max-width:100%;
  }
  .boardpage__inner{overflow-x:hidden}
  .boardpage::-webkit-scrollbar:horizontal{height:0}

  @media (min-width:821px) and (max-height:760px){
    .promap__intro .title-record{width:86px!important}
  }
  @media (max-width:820px){
    .promap__intro .title-record{width:82px!important}
    .promap__title{font-size:clamp(17px,5.2vw,28px)!important;max-width:none!important}
    .promap__title-line{white-space:normal!important}
  }


/* v33 — footer is the Board chapter's final screen, not a clipped child. */
#board-page.boardpage{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior-y:contain;
  scroll-behavior:smooth;
  scrollbar-width:none;
}
#board-page.boardpage::-webkit-scrollbar{width:0;height:0}
#board-page .boardpage__inner{
  flex:0 0 auto;
  width:min(100%,1480px);
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
}
#board-page .trinity-footer{
  position:relative;
  z-index:1;
  flex:0 0 auto;
  min-height:auto;
  scroll-margin-top:0;
}
@media (max-width:1180px){
  #board-page .boardpage__inner{
    height:auto;
    min-height:100vh;
    min-height:100dvh;
  }
}
@media (prefers-reduced-motion:reduce){
  #board-page.boardpage{scroll-behavior:auto}
}

/* ═══ block 13 · trinity-v14-booking-integration ═══ */
/* v14 — approved Booking & Enquiry component integrated into the v13 state machine. */
.bar__cta{display:inline-grid;grid-template-areas:'label';place-items:center;line-height:1;white-space:nowrap}
.bar__cta::before{content:'Booking →';grid-area:label;visibility:hidden;white-space:nowrap;font:inherit;letter-spacing:inherit}
.bar__cta-label{grid-area:label;place-self:center;white-space:nowrap}
body.booking-page-open .bar{color:#FAFAF8!important;text-shadow:0 1px 12px rgba(0,0,0,.35)}
body.booking-page-open .bar__cta{background:#FAFAF8!important;color:#DE654B!important;font-weight:700;text-shadow:none;box-shadow:0 8px 26px rgba(0,0,0,.18),inset 0 0 0 1px #DE654B!important;transform:none}
body.booking-page-open .bar__cta:hover,body.booking-page-open .bar__cta:focus-visible{background:#FAFAF8!important;color:#DE654B!important;box-shadow:0 10px 30px rgba(0,0,0,.20),inset 0 0 0 1px #DE654B!important;transform:translateY(-2px)}
body.booking-page-open .bar__cta.is-active::after{display:none}
#booking-page.bookingpage{z-index:58}
/* ═══════════ BOOKING / ENQUIRY — self-contained component ═══════════ */
.bookingpage{
  --bk-ink:#211D1A;
  --bk-cream:#FAFAF8;
  --bk-accent:#DE654B;
  --bk-hair:rgba(33,29,26,.18);
  --bk-ease:cubic-bezier(.22,1,.36,1);
  position:fixed;inset:0;z-index:58;overflow:hidden;overscroll-behavior:contain;
  background:#151311;color:var(--bk-ink);
  transform:translateX(100.5%);visibility:hidden;
  transition:transform 920ms var(--bk-ease),visibility 0s linear 920ms;
  will-change:transform;-webkit-overflow-scrolling:touch;
}
.bookingpage.is-open{transform:translateX(0);visibility:visible;transition-delay:0s}
body.booking-page-open{overflow:hidden}

.booking-scene{position:absolute;left:50%;top:50%;width:max(100vw,calc(100vh * 1.333333));height:max(100vh,calc(100vw * .75));transform:translate(-50%,-50%);overflow:hidden;isolation:isolate}
.booking-scene__image{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;display:block;transform:scale(1.045);filter:blur(5px) saturate(.90) contrast(1.01) brightness(.90);transition:transform 1450ms var(--bk-ease),filter 1200ms ease}
.bookingpage.is-open .booking-scene__image{transform:scale(1.028);filter:blur(4px) saturate(.92) contrast(1.01) brightness(.92)}
.booking-scene::after{content:'';position:absolute;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at 50% 43%,transparent 25%,rgba(9,8,7,.04) 57%,rgba(9,8,7,.30) 100%),linear-gradient(180deg,rgba(7,6,5,.10),transparent 28%,transparent 68%,rgba(7,6,5,.16))}

.booking-glass{position:absolute;z-index:3;left:50%;top:44.5%;width:min(64%,1120px);height:min(60%,810px);min-height:570px;display:grid;grid-template-rows:auto minmax(0,1fr);padding:0;overflow:hidden;border-radius:clamp(20px,1.7vw,30px);border:1px solid rgba(255,255,255,.66);background:radial-gradient(140% 95% at 10% 0%,rgba(255,255,255,.58) 0%,rgba(255,255,255,.28) 32%,rgba(255,255,255,.06) 58%),radial-gradient(120% 110% at 100% 100%,rgba(250,250,248,.31) 0%,rgba(250,250,248,.17) 34%,rgba(250,250,248,.05) 65%),linear-gradient(135deg,rgba(255,255,255,.36) 0%,rgba(255,255,255,.23) 20%,rgba(250,250,248,.18) 44%,rgba(255,255,255,.25) 72%,rgba(250,250,248,.29) 100%),rgba(250,250,248,.25);-webkit-backdrop-filter:blur(38px) saturate(138%) brightness(1.07);backdrop-filter:blur(38px) saturate(138%) brightness(1.07);box-shadow:0 30px 86px rgba(8,7,6,.23),inset 0 1px 0 rgba(255,255,255,.86),inset 0 0 0 1px rgba(255,255,255,.18),inset 0 18px 28px rgba(255,255,255,.09),inset 0 -18px 26px rgba(255,255,255,.06);opacity:0;transform:translate(-50%,-47%) scale(.985);transform-origin:center;transition:opacity .48s ease .28s,transform .84s var(--bk-ease) .22s}
.bookingpage.is-open .booking-glass{opacity:1;transform:translate(-50%,-50%)}
.booking-glass::before{content:'';position:absolute;inset:-2px;pointer-events:none;z-index:0;background:linear-gradient(118deg,rgba(255,255,255,.58) 0 10%,rgba(255,255,255,.18) 21%,transparent 34% 63%,rgba(255,255,255,.09) 76%,rgba(255,255,255,.26) 100%),radial-gradient(circle at 17% 15%,rgba(255,255,255,.24),transparent 17%),radial-gradient(circle at 82% 10%,rgba(255,255,255,.14),transparent 15%);opacity:.92;mix-blend-mode:screen}
.booking-glass::after{content:'';position:absolute;left:4%;right:4%;top:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.98),transparent)}
.booking-glass>*{position:relative;z-index:1}

.booking-close{position:absolute;right:clamp(14px,1.2vw,22px);top:clamp(12px,1.05vw,20px);z-index:6;width:34px;height:34px;border:0;background:transparent;color:var(--bk-ink);cursor:pointer;font:500 25px/1 var(--tri-ui);transition:opacity .2s ease,transform .28s var(--bk-ease)}
.booking-close:hover,.booking-close:focus-visible{color:var(--bk-accent);opacity:1;transform:rotate(8deg);outline:none}

.booking-head{text-align:left;padding:clamp(21px,1.9vw,32px) clamp(30px,2.8vw,48px) clamp(18px,1.7vw,28px);border-bottom:1px solid var(--bk-hair);color:var(--bk-ink)}
.booking-head__eyebrow{display:flex;align-items:center;justify-content:flex-start;gap:11px;margin:0 0 clamp(8px,.75vw,12px);font-weight:700;font-size:clamp(8px,.54vw,10px);letter-spacing:.30em;text-transform:uppercase;color:var(--bk-accent)}
.booking-head__eyebrow::before,.booking-head__eyebrow::after{content:'';width:clamp(25px,2.5vw,42px);height:1px;background:var(--bk-accent)}
.booking-head__title{margin:0;font-family:var(--tri-title);font-weight:700;font-size:clamp(27px,2.45vw,44px);line-height:1;letter-spacing:-.045em;color:var(--bk-ink);white-space:nowrap;-webkit-text-stroke:.14px currentColor;text-shadow:0 0 .01px currentColor}
.booking-head__sub{margin:clamp(8px,.7vw,12px) 0 0;max-width:66ch;font-family:var(--tri-text);font-size:clamp(12px,.82vw,15px);line-height:1.5;color:var(--bk-ink)}

.booking-body{min-height:0;display:grid;grid-template-columns:minmax(190px,26%) minmax(0,74%)}
.booking-choices{min-width:0;display:grid;grid-template-rows:repeat(8,minmax(0,1fr));border-right:1px solid var(--bk-hair);background:rgba(250,250,248,.19)}
.booking-choice{position:relative;display:block;min-width:0;min-height:0;color:var(--bk-ink)}
.booking-choice input{position:absolute;opacity:0;pointer-events:none}
.booking-choice__surface{position:relative;width:100%;height:100%;min-height:43px;display:grid;grid-template-columns:21px minmax(0,1fr) 18px;align-items:center;gap:10px;border-bottom:1px solid rgba(33,29,26,.13);padding:0 clamp(15px,1.25vw,22px);background:rgba(250,250,248,.14);color:var(--bk-ink);cursor:pointer;font-family:var(--tri-ui);font-weight:600;font-size:clamp(10.5px,.74vw,13.5px);letter-spacing:-.014em;transition:background .24s ease,padding-left .32s var(--bk-ease)}
.booking-choice:last-child .booking-choice__surface{border-bottom:0}
.booking-choice__surface>svg{width:20px;height:20px;display:block;color:var(--bk-ink);transition:transform .32s var(--bk-ease)}
.booking-choice__label{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--bk-ink)}
.booking-choice__state{position:relative;width:17px;height:17px;color:var(--bk-ink);opacity:0;transform:scale(.7);transition:opacity .22s ease,transform .32s var(--bk-ease)}
.booking-choice__state::before,.booking-choice__state::after{content:'';position:absolute;inset:2px;border:2px dotted currentColor;border-radius:50%}
.booking-choice__state::after{inset:6px;border:0;background:currentColor}
.booking-choice:hover .booking-choice__surface{background:rgba(222,101,75,.14);padding-left:clamp(18px,1.5vw,27px)}
.booking-choice:hover .booking-choice__surface>svg{transform:scale(1.07)}
.booking-choice input:focus-visible+.booking-choice__surface{outline:2px solid var(--bk-accent);outline-offset:-2px}
.booking-choice input:checked+.booking-choice__surface{z-index:2;background:#FAFAF8;color:var(--bk-accent);font-weight:700;box-shadow:inset 0 0 0 1px var(--bk-accent)}
.booking-choice input:checked+.booking-choice__surface>svg,.booking-choice input:checked+.booking-choice__surface .booking-choice__label,.booking-choice input:checked+.booking-choice__surface .booking-choice__state{color:var(--bk-accent)}
.booking-choice input:checked+.booking-choice__surface .booking-choice__state{opacity:1;transform:scale(1)}

.booking-formpane{min-width:0;min-height:0;padding:clamp(22px,2.1vw,34px) clamp(28px,3.15vw,50px) clamp(19px,1.9vw,31px);display:flex;flex-direction:column;background:rgba(250,250,248,.12);color:var(--bk-ink)}
.booking-fields{display:grid;gap:clamp(15px,1.55vh,20px)}
.booking-grid{display:grid;grid-template-columns:1fr;gap:clamp(13px,1.25vh,17px)}
.booking-line{display:block;min-width:0;color:var(--bk-ink)}
.booking-line__label{display:block;margin:0 0 5px;font-family:var(--tri-ui);font-size:clamp(9px,.58vw,11px);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--bk-ink)}
.booking-line__optional{letter-spacing:.02em;font-family:var(--tri-ui);font-weight:500;color:var(--bk-ink)}
.booking-input,.booking-textarea{width:100%;border:0;border-bottom:1px solid rgba(33,29,26,.34);border-radius:0;background:transparent;color:var(--bk-ink);outline:none;font-family:var(--tri-ui);font-size:clamp(14.5px,1.05vw,18px);line-height:1.4;transition:border-color .22s ease,box-shadow .22s ease}
.booking-input{height:clamp(33px,2.75vw,43px);padding:0 0 7px}
.booking-textarea{height:clamp(47px,4.15vw,65px);resize:none;padding:4px 0 8px}
.booking-input::placeholder,.booking-textarea::placeholder{color:var(--bk-ink);opacity:1}
.booking-input:focus,.booking-textarea:focus{border-color:var(--bk-accent);box-shadow:0 1px 0 var(--bk-accent)}

.booking-actions{margin-top:auto;padding-top:clamp(16px,1.9vh,24px);display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:clamp(15px,1.6vw,24px)}
.booking-submit{appearance:none;border:0;border-radius:999px;min-height:clamp(50px,3.8vw,60px);background:#FAFAF8;color:var(--bk-accent);padding:0 clamp(19px,1.5vw,28px);cursor:pointer;display:flex;align-items:center;justify-content:center;white-space:nowrap;gap:12px;font:700 clamp(13px,.9vw,16px) var(--tri-ui);letter-spacing:-.005em;box-shadow:0 16px 34px rgba(33,29,26,.18),0 4px 12px rgba(33,29,26,.10),inset 0 1px 0 rgba(255,255,255,.96);transition:transform .3s var(--bk-ease),box-shadow .3s ease,opacity .2s ease,background .2s ease}
.booking-submit span:first-child{white-space:nowrap}
.booking-submit span:last-child{font-size:1.28em;line-height:1;transition:transform .3s var(--bk-ease)}
.booking-submit:hover,.booking-submit:focus-visible{background:#FFFDFC;color:var(--bk-accent);transform:translateY(-2px);box-shadow:0 22px 42px rgba(33,29,26,.22),0 7px 16px rgba(33,29,26,.12);outline:none}
.booking-submit:hover span:last-child,.booking-submit:focus-visible span:last-child{transform:translateX(5px)}
.booking-submit:disabled{cursor:wait;opacity:.62;transform:none;box-shadow:none}
.booking-direct{justify-self:end;display:flex;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:clamp(8px,.7vw,13px);min-width:0;font-family:var(--tri-text);font-size:clamp(11.5px,.72vw,14px);font-weight:500;color:var(--bk-ink)}
.booking-channel{display:inline-flex;align-items:center;gap:6px;padding:4px 0;border:0;border-bottom:1.5px solid var(--bk-ink);border-radius:0;background:transparent;color:var(--bk-ink);text-decoration:none;white-space:nowrap;font-family:var(--tri-ui);font-weight:600;transition:opacity .22s ease,transform .28s var(--bk-ease),border-color .22s ease}
.booking-channel svg{width:15px;height:15px;color:var(--bk-ink)}
.booking-channel:hover,.booking-channel:focus-visible{color:var(--bk-ink);border-bottom-color:var(--bk-accent);opacity:1;transform:translateY(-2px);outline:none}
.booking-feedback{min-height:15px;margin:8px 0 0;text-align:left;pointer-events:none;font-family:var(--tri-text);font-size:9.5px;line-height:1.35;color:var(--bk-ink);opacity:0;transform:translateY(3px);transition:opacity .2s ease,transform .25s var(--bk-ease)}
.booking-feedback.is-visible{opacity:1;transform:none}

.booking-marquee{position:relative;flex:none;margin-top:clamp(14px,1.7vh,22px);height:clamp(38px,4.4vh,48px);border-radius:clamp(11px,.85vw,15px);background:var(--bk-ink);overflow:hidden;display:flex;align-items:center;box-shadow:0 12px 26px rgba(33,29,26,.17),inset 0 1px 0 rgba(255,255,255,.09);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.booking-marquee__track{display:flex;flex:none;width:max-content;will-change:transform;animation:booking-marquee-roll 26s linear infinite}
.booking-marquee:hover .booking-marquee__track,.booking-marquee:focus-within .booking-marquee__track{animation-play-state:paused}
.booking-marquee__group{display:flex;align-items:center;flex:none}
.booking-marquee__item{flex:none;white-space:nowrap;padding:0 clamp(14px,1.3vw,22px);font-family:var(--tri-ui);font-weight:600;font-size:clamp(13px,.95vw,16.5px);letter-spacing:.005em;color:#FAFAF8}
.booking-marquee__sep{flex:none;font-size:clamp(10px,.7vw,13px);line-height:1;color:var(--bk-accent)}
@keyframes booking-marquee-roll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@media (max-width:1330px) and (min-width:1181px){
  .booking-actions{grid-template-columns:1fr;gap:clamp(12px,1.4vh,18px)}
  .booking-submit{justify-self:start;width:auto;min-width:172px}
  .booking-direct{justify-self:stretch;width:100%;justify-content:space-between;flex-wrap:nowrap;gap:10px}
}

@media (max-width:1180px) and (min-width:741px){
  .booking-glass{width:min(78%,900px);height:min(70%,730px);min-height:580px}
  .booking-head{padding-left:34px;padding-right:34px}
  .booking-head__title{font-size:clamp(27px,3.5vw,39px)}
  .booking-body{grid-template-columns:minmax(205px,31%) minmax(0,69%)}
  .booking-choice__surface{padding-left:16px;padding-right:16px;font-size:11.5px}
  .booking-formpane{padding-left:32px;padding-right:32px}
  .booking-actions{grid-template-columns:1fr;gap:14px}
  .booking-submit{justify-self:start;width:auto;min-width:168px}
  .booking-direct{justify-self:stretch;width:100%;justify-content:space-between;flex-wrap:nowrap;gap:10px}
  .booking-direct{font-size:12px}
}
@media (max-width:740px){
  .bar{grid-template-columns:1fr auto;padding:12px 16px 10px}
  .bar__spacer{display:none}
  .bar__mark{font-size:11px;letter-spacing:.14em}
  .bar__cta{font-size:10.5px;padding:9px 13px}
  .bookingpage{overflow-y:auto}
  .booking-scene{position:fixed;width:max(100vw,calc(100vh * 1.333333));height:max(100vh,calc(100vw * .75));top:50%}
  .booking-scene__image{filter:blur(4px) saturate(.84) contrast(1.01) brightness(.67)}
  .booking-scene::after{background:linear-gradient(180deg,rgba(10,9,8,.27),rgba(10,9,8,.06) 36%,rgba(10,9,8,.34))}
  .booking-glass{position:relative;left:auto;top:auto;width:calc(100% - 36px);height:auto;min-height:0;margin:92px auto 28px;display:block;border-radius:22px;overflow:hidden;transform:translateY(16px) scale(.985)}
  .bookingpage.is-open .booking-glass{transform:none}
  .booking-close{right:10px;top:10px}
  .booking-head{padding:24px 21px 20px}
  .booking-head__eyebrow{font-size:8px;margin-bottom:10px}
  .booking-head__title{font-size:clamp(28px,8vw,40px);white-space:normal;text-wrap:balance}
  .booking-head__sub{font-size:11.5px;max-width:37ch;margin-top:10px}
  .booking-body{display:block}
  .booking-choices{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,53px);border-right:0;border-bottom:1px solid var(--bk-hair)}
  .booking-choice__surface{min-height:53px;grid-template-columns:19px minmax(0,1fr) 15px;gap:7px;padding:0 10px;border-right:1px solid rgba(33,29,26,.13);font-size:10px}
  .booking-choice:nth-child(even) .booking-choice__surface{border-right:0}
  .booking-choice__surface>svg{width:18px;height:18px}
  .booking-choice__label{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.12}
  .booking-choice__state{width:15px;height:15px}
  .booking-formpane{padding:24px 18px 21px;min-height:410px}
  .booking-fields{gap:20px}
  .booking-grid{gap:20px}
  .booking-line__label{font-size:8px}
  .booking-input,.booking-textarea{font-size:14px}
  .booking-input{height:41px}
  .booking-textarea{height:62px}
  .booking-actions{margin-top:28px;padding-top:0;grid-template-columns:1fr;gap:16px}
  .booking-submit{min-height:52px;font-size:14px}
  .booking-direct{justify-self:start;justify-content:flex-start;flex-wrap:wrap;font-size:13px;gap:14px 20px}
  .booking-marquee{height:46px;margin-top:22px;border-radius:12px}
  .booking-feedback{font-size:10px}
}
@media (max-height:950px) and (min-width:741px){
  .booking-fields{gap:clamp(11px,1.2vh,15px)}
  .booking-input{height:clamp(33px,3.6vh,40px)}
  .booking-textarea{height:clamp(44px,5vh,58px)}
  .booking-actions{padding-top:clamp(11px,1.3vh,17px)}
  .booking-marquee{height:clamp(34px,3.7vh,42px);margin-top:clamp(9px,1vh,15px)}
}
@media (max-height:720px) and (min-width:741px){
  .booking-glass{height:min(78%,680px);min-height:570px}
  .booking-head{padding-top:17px;padding-bottom:15px}
  .booking-head__eyebrow{margin-bottom:6px}
  .booking-head__title{font-size:clamp(25px,2.9vw,37px)}
  .booking-head__sub{margin-top:6px}
  .booking-choice__surface{min-height:39px}
  .booking-formpane{padding-top:19px;padding-bottom:16px}
  .booking-fields{gap:12px}
  .booking-grid{gap:12px}
  .booking-input{height:34px}
  .booking-textarea{height:43px}
  .booking-actions{padding-top:14px}
  .booking-submit{min-height:50px}
  .booking-marquee{height:clamp(32px,3.6vh,40px);margin-top:10px}
}
@media (prefers-reduced-motion:reduce){
  .bookingpage,.booking-scene__image,.booking-glass,.booking-close,.booking-choice__surface,.booking-choice__surface>svg,.booking-choice__state,.booking-submit,.booking-submit span,.booking-channel,.booking-feedback{transition-duration:1ms!important}
  .booking-marquee__track{animation:none;transform:none}
  .booking-marquee__group:nth-child(2){display:none}
}

@media (max-width:740px){
  #booking-page .booking-scene{inset:0;left:0;top:0;width:100%;height:100%;transform:none}
  #booking-page .booking-scene__image{object-fit:cover}
}

/* ═══ block 14 · trinity-v15-hardcut-footer ═══ */
/* v15 — Booking is a direct hard-cut overlay, never a scroll chapter. */
#booking-page.bookingpage{
  transform:none!important;
  visibility:hidden;
  transition:none!important;
  will-change:auto;
}
#booking-page.bookingpage.is-open{
  transform:none!important;
  visibility:visible;
  transition:none!important;
}
#booking-page .booking-scene__image,
#booking-page .booking-glass{
  transition:none!important;
}
#booking-page .booking-glass{opacity:1!important;}
@media (min-width:741px){
  #booking-page .booking-glass{transform:translate(-50%,-50%)!important;}
}
@media (max-width:740px){
  #booking-page .booking-glass{transform:none!important;}
}

/* Footer integrated after Board. Source: Trinity_footer_standalone_v1. */

.trinity-footer {
      --tf-cream:#FAFAF8;
      --tf-ink:#211D1A;
      --tf-sage:#D3DAC4;
      --tf-coral:#DE654B;
      --tf-ease:cubic-bezier(.22,1,.36,1);
      width: 100%;
      overflow: hidden;
      background: var(--tf-cream);
      color: var(--tf-ink);
    }

    /* Cream closing panel — intentionally compact. */
    .trinity-footer__stage {
      position: relative;
      min-height: clamp(300px, 38svh, 380px);
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: clamp(34px, 4.5vh, 48px) clamp(20px, 3.4vw, 48px) clamp(24px, 3vh, 34px);
      background: var(--tf-cream);
    }

    .trinity-footer__eyebrow {
      position: absolute;
      top: 18px;
      left: 50%;
      transform: translateX(-50%);
      margin: 0;
      color: rgba(33, 29, 26, .58);
      font-size: 8px;
      font-weight: 600;
      letter-spacing: .28em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .trinity-footer__lockup {
      width: 100%;
      max-width: 1800px;
      margin: auto;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      align-items: center;
      gap: clamp(18px, 3vw, 52px);
    }

    .trinity-footer__headline {
      margin: 0;
      font-size: clamp(46px, 4.25vw, 82px);
      font-weight: 800;
      line-height: .94;
      letter-spacing: -.035em;
      text-transform: uppercase;
      white-space: nowrap;
    }

    .trinity-footer__headline span { display: inline-block; margin-right: .16em; }
    .trinity-footer__headline span:last-child { margin-right: 0; }
    .trinity-footer__headline--left { justify-self: end; text-align: right; }
    .trinity-footer__headline--right { justify-self: start; text-align: left; }
    .trinity-footer__headline .is-accent { color: var(--tf-coral); }

    .trinity-footer__record {
      position: relative;
      width: clamp(124px, 13vw, 190px);
      aspect-ratio: 1;
      isolation: isolate;
      filter: drop-shadow(0 13px 0 rgba(33, 29, 26, .15));
    }

    .trinity-footer__record::before {
      content: "";
      position: absolute;
      z-index: -1;
      inset: 7% -2% -3% 8%;
      border-radius: 50%;
      background: rgba(33, 29, 26, .17);
      transform: translate(7px, 8px);
    }

    .trinity-footer__vinyl {
      display: block;
      width: 100%;
      height: 100%;
      transform-origin: 50% 50%;
      animation: footerVinylSpin 10s linear infinite;
    }

    .trinity-footer__arm {
      position: absolute;
      top: -11%;
      right: -19%;
      z-index: 3;
      width: 67%;
      height: 67%;
      overflow: visible;
    }

    .trinity-footer__arm-shadow { opacity: .25; }
    .trinity-footer__spark {
      position: absolute;
      top: 9%;
      left: -13%;
      width: 25%;
      height: 25%;
      overflow: visible;
      opacity: .68;
    }

    @keyframes footerVinylSpin { to { transform: rotate(360deg); } }
    .trinity-footer__record:hover .trinity-footer__vinyl { animation-duration: 3.8s; }

    .trinity-footer__caption {
      max-width: 48ch;
      margin: clamp(14px, 2vh, 20px) auto 0;
      color: rgba(33, 29, 26, .62);
      font-family:var(--tri-ui);
      font-size: clamp(11px, .35vw + 9px, 13px);
      font-weight: 500;
      line-height: 1.6;
      text-align: center;
      text-wrap: balance;
    }

    /* Open sage band — no frame, no table rules, ink-only typography. */
    .trinity-footer__rail {
      background: var(--tf-sage);
      color: var(--tf-ink);
      padding: clamp(30px, 4vw, 52px) clamp(20px, 3.4vw, 48px) 22px;
    }

    .trinity-footer__grid {
      width: 100%;
      max-width: 1800px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(230px, 1.35fr) repeat(3, minmax(150px, 1fr));
      gap: clamp(34px, 4vw, 72px);
    }

    .trinity-footer__cell {
      min-width: 0;
      padding: 0;
      border: 0;
    }

    .trinity-footer__wordmark { font-family:var(--tri-word);
      margin: 0 0 13px;
      color: var(--tf-ink);
      font-size: clamp(18px, 1.7vw, 26px);
      font-weight: 700;
      line-height: 1;
      letter-spacing: .17em;
    }

    .trinity-footer__descriptor,
    .trinity-footer__copy,
    .trinity-footer__links,
    .trinity-footer__label,
    .trinity-footer__bottom,
    .trinity-footer__home {
      color: var(--tf-ink);
    }

    .trinity-footer__descriptor {
      max-width: 30ch;
      margin: 0;
      font-family:var(--tri-text);
      font-size: 13px;
      font-weight: 400;
      line-height: 1.7;
    }

    .trinity-footer__label {
      margin: 0 0 13px;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .2em;
      text-transform: uppercase;
    }

    .trinity-footer__copy,
    .trinity-footer__links {
      margin: 0;
      font-family:var(--tri-text);
      font-size: 12.5px;
      font-weight: 400;
      line-height: 1.75;
    }

    .trinity-footer__links {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 5px;
    }

    .trinity-footer a {
      color: var(--tf-ink);
      text-decoration: none;
      background-image: linear-gradient(currentColor, currentColor);
      background-position: 0 100%;
      background-repeat: no-repeat;
      background-size: 0 1px;
      transition: background-size .3s var(--tf-ease), transform .3s var(--tf-ease);
    }

    .trinity-footer a:hover,
    .trinity-footer a:focus-visible {
      background-size: 100% 1px;
      outline: none;
    }

    .trinity-footer__bottom {
      width: 100%;
      max-width: 1800px;
      margin: 0 auto;
      padding-top: clamp(26px, 3vw, 40px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      font-size: 9px;
      font-weight: 600;
      letter-spacing: .13em;
      text-transform: uppercase;
    }

    .trinity-footer__home {
      border-bottom: 1px solid currentColor;
      padding: 4px 0;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
    }

    .trinity-footer__home:hover,
    .trinity-footer__home:focus-visible { transform: translateY(-2px); }

    @media (max-width: 980px) {
      .trinity-footer__headline { font-size: clamp(38px, 5.6vw, 56px); }
      .trinity-footer__record { width: clamp(112px, 16vw, 160px); }
      .trinity-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 720px) {
      .trinity-footer__stage {
        min-height: 500px;
        padding: 62px 18px 28px;
      }

      .trinity-footer__eyebrow { top: 22px; font-size: 7.5px; letter-spacing: .22em; }
      .trinity-footer__lockup {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        gap: 22px;
      }

      .trinity-footer__headline {
        font-size: clamp(42px, 13vw, 64px);
        line-height: .88;
        white-space: normal;
      }

      .trinity-footer__headline span { display: block; margin: 0; }
      .trinity-footer__headline--left { justify-self: start; text-align: left; }
      .trinity-footer__headline--right { justify-self: end; text-align: right; }
      .trinity-footer__record { width: min(42vw, 176px); justify-self: center; }
      .trinity-footer__rail { padding: 30px 18px 18px; }
      .trinity-footer__grid { gap: 30px 24px; }
      .trinity-footer__bottom { align-items: flex-start; flex-direction: column; gap: 12px; }
    }

    @media (max-width: 520px) {
      .trinity-footer__grid { grid-template-columns: 1fr; gap: 30px; }
    }

    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      .trinity-footer__vinyl { animation: none; }
      .trinity-footer a { transition: none; }
    }

/* ═══ block 15 · trinity-v16-transition-underlay ═══ */
/*
    Chapter panels all enter from below. While an outgoing panel also moves down,
    their moving edges can briefly expose the live index beneath them. This fixed
    underlay occupies only that gap and inherits the incoming chapter's background,
    so no unrelated third page can appear during a chapter-to-chapter transition.
  */
  body{--chapter-transition-bg:#FAFAF8}
  body::before{
    content:"";position:fixed;inset:0;z-index:24;pointer-events:none;
    background:var(--chapter-transition-bg);visibility:hidden;
  }
  body.chapter-transitioning::before{visibility:visible}

/* ═══ block 16 · ts-v39-edits ═══ */
/* #2 equipment-table headline matches .q__hl (People headline) */
#people-page .q--br .q__title{font-weight:800;line-height:.96;letter-spacing:-.01em;font-size:clamp(17px,3.5vmin,37px);max-width:none;}
/* #7 footer lockup headline was inheriting Pretendard(UI) at capped weight -> title face */
.trinity-footer__headline{font-family:var(--tri-title);}
/* #3 gear title one line */
#people-page .gear__title{max-width:none;white-space:nowrap;}
/* #4 gear note one line */
#people-page .gear__note{max-width:none;white-space:nowrap;}
@media (max-width:600px){#people-page .gear__title,#people-page .gear__note{white-space:normal;}}

/* ═══ block 17 · ts-v40-hero ═══ */
/* #1 a touch thicker (EB is the family max; hairline stroke nudges weight) */
.hl{-webkit-text-stroke:.014em currentColor;}
/* #2 open tracking, tighten inter-word gap for a hero catchphrase */
.hl{letter-spacing:.01em;word-spacing:-.16em;}
@media (min-width:1340px){
  .hl .w{margin-right:.1em;}
  .hl--l .w:nth-child(2),.hl--l .w:nth-child(3),.hl--r .w:nth-child(2),.hl--r .w:nth-child(3){margin-right:.12em;}
}
@media (max-width:820px){
  .hl--l .w:nth-child(2),.hl--l .w:nth-child(3),.hl--r .w:nth-child(2),.hl--r .w:nth-child(3){margin-right:.12em;}
}
/* #3 cap-top no longer clipped by the reveal mask (extend mask up, keep position + stacked rhythm) */
.hl .w{padding-top:.22em;margin-top:-.22em;}

/* ═══ block 18 · tri-ko-fixes ═══ */
/* KO hero: prevent stacked-line overlap (ExtraBold Hangul is taller than Latin) */
html[lang="ko"] .hl{line-height:1.06}
html[lang="ko"] .hl .w{padding-top:.16em;margin-top:-.10em}
/* KO booking title: slightly smaller so the one-line title fits the glass */
html[lang="ko"] .booking-head__title{font-size:clamp(20px,1.95vw,35px)}
/* eyebrow removed from markup; keep the head spacing intact */
.booking-head__eyebrow{display:none}

/* ═══ block 19 · tri-layout-fixes ═══ */
/* ═══ Header plate — content stops at the nav edge instead of travelling through it ═══ */
.bar::before{content:'';position:absolute;inset:0 0 auto 0;height:100%;z-index:-1;background:var(--bar-plate,var(--cream-high));
  opacity:0;pointer-events:none;transition:opacity .34s ease}
body.index-nav-ready .bar::before,
body.discography-open .bar::before,
body.chapter-page-open .bar::before,
body.services-open .bar::before,
body.faq-open .bar::before,
body.program-map-open .bar::before,
body.board-open .bar::before{opacity:1}
body.booking-page-open .bar::before{opacity:0}

/* ═══ 01-A — head clears the header band; tonearm steps left ═══ */
@media (min-width:821px){
  .disco__head{top:clamp(118px,15vh,168px)}
  .disco__tonearm{transform:translate(16%,-69%)}
}

/* ═══ 01-B — default state is the poster, expanded state is the dossier ═══ */
#people-page .q__deep{display:none}
#people-page .quad.ex-tl .q--tl .q__deep{display:flex}
#people-page .q__dossier{display:flex;flex-direction:column;flex:0 1 auto;min-height:0;overflow:hidden}
#people-page .quad.ex-tl .q--tl .q__dossier{overflow-y:auto;scrollbar-width:none;overscroll-behavior:contain}
#people-page .q__dossier::-webkit-scrollbar{display:none}
#people-page .quad.ex-tl .q--tl .q__more{max-height:none;overflow:visible}
#people-page .quad.ex-tl .q--tl .q__hl{font-size:clamp(17px,2.7vmin,28px);margin-bottom:clamp(6px,1.2vmin,12px)}

/* readable type floor — nothing below ~9.5px label / 11.5px body */
#people-page .q__kicker{font-size:clamp(9.5px,1.1vmin,11px)}
#people-page .q__hl{font-size:clamp(20px,3.5vmin,37px)}
#people-page .q__name{font-size:clamp(12.5px,1.7vmin,16px)}
#people-page .q__line{font-size:clamp(11.5px,1.35vmin,12.5px)}
#people-page .q__title{font-size:clamp(16px,2.5vmin,26px)}
#people-page .q__body{font-size:clamp(11.5px,1.35vmin,13px)}
#people-page .credit{font-size:clamp(11px,1.25vmin,11.5px)}
#people-page .q__morelabel{font-size:clamp(9.5px,1vmin,10px)}
#people-page .gidx__row{font-size:clamp(11px,1.25vmin,12px)}
#people-page .gidx__cta{font-size:clamp(10.5px,1.2vmin,11px)}
#people-page .stat__n{font-size:clamp(15px,2.2vmin,23px)}
#people-page .stat__l{font-size:clamp(8.5px,.95vmin,9.5px)}

/* ═══ block 20 · tri-layout-fixes-2 ═══ */
/* Both copy panels read the same way: poster by default, dossier when opened. */
#people-page .q__body{display:none}
#people-page .quad.ex-br .q--br .q__body{display:block}
#people-page .quad.ex-br .q--br .q__dossier{overflow-y:auto;scrollbar-width:none;overscroll-behavior:contain}
#people-page .quad.ex-br .q--br .q__more{max-height:none;overflow:visible}
#people-page .quad.ex-br .q--br .q__title{font-size:clamp(14px,2.1vmin,22px)}
/* the reveal padding belongs to the opened state only — it was holding dead space when closed */
#people-page .q--tl .q__more{padding-bottom:0}
#people-page .quad.ex-tl .q--tl .q__more{padding-bottom:clamp(18px,4cqh,40px)}

/* ═══ block 21 · tri-booking-onerow ═══ */
/* Send + the four channels hold one row wherever they actually fit (~1210px and up). */
@media (min-width:1210px) and (max-width:1330px){
  .booking-actions{grid-template-columns:auto minmax(0,1fr);gap:clamp(12px,1.2vw,20px)}
  .booking-submit{justify-self:start;width:auto;min-width:0}
  .booking-direct{justify-self:end;width:auto;justify-content:flex-end;flex-wrap:nowrap;gap:clamp(8px,.7vw,13px)}
}

/* ═══ block 22 · tri-header-band ═══ */
/* The band stops at the wordmark's glyph line; every page title rises by what the band lost
   (−33px), floored so no title can tuck under the shortened band. */
@media (min-width:821px){
  .bar::before{height:42px}

  .disco__head{top:max(64px,calc(clamp(118px,15vh,168px) - 33px))}
  #people-page .quadsec{padding-top:max(64px,calc(clamp(84px,11vh,110px) - 33px))}
  .chapterpage__inner{padding-top:max(64px,calc(clamp(104px,13vh,148px) - 33px))}
  .faqpage__inner{padding-top:max(64px,calc(clamp(104px,13vh,148px) - 33px))}
  .boardpage__inner{padding-top:max(64px,calc(clamp(72px,8vh,94px) - 33px))}
  .promap__inner{padding-top:max(64px,calc(clamp(70px,8.6vh,92px) - 33px))}
  .servicepage__inner{padding-top:max(64px,calc(clamp(70px,8.6vh,92px) - 33px))!important}
}

/* ═══ block 23 · tri-01b-ko-titles ═══ */
/* Korean 01-B panel titles run shorter than the English ones — step the type down a notch. */
html[lang="ko"] #people-page .q__hl{font-size:clamp(18px,3vmin,32px)}
html[lang="ko"] #people-page .q--br .q__title{font-size:clamp(14.5px,3vmin,32px)}
html[lang="ko"] #people-page .quad.ex-tl .q--tl .q__hl{font-size:clamp(15.5px,2.35vmin,24px)}
html[lang="ko"] #people-page .quad.ex-br .q--br .q__title{font-size:clamp(13px,1.85vmin,19px)}

/* ═══ block 24 · tri-01c-pin ═══ */
/* Korean 01-B titles carry two lines of Hangul — give them more leading than the Latin setting. */
html[lang="ko"] #people-page .q__hl{line-height:1.16}
html[lang="ko"] #people-page .q--br .q__title{line-height:1.32}

/* 01-C — the title holds the 01-A position while the equipment table travels under it. */
@media (min-width:821px){
  #people-page .gear{padding-top:42px}
  #people-page .gear__head{
    position:sticky;top:42px;z-index:5;background:var(--cream-high);
    padding-top:calc(max(64px,calc(clamp(118px,15vh,168px) - 33px)) - 42px);
    padding-bottom:clamp(13px,1.8vh,22px)
  }
}

/* ═══ block 25 · tri-services-head ═══ */
@media (min-width:821px){
  /* Services title matches the Programs title exactly, at both height regimes. */
  .servicepage__title{font-size:clamp(26px,3.2vw,50px)!important}
  /* more air between the title block and the table below it */
  .servicepage__head{margin-bottom:clamp(44px,6vh,70px)!important}
  /* the standfirst reads in two lines instead of three */
  .servicepage__sub{max-width:62ch!important}
}
@media (min-width:821px) and (max-height:760px){
  .servicepage__title{font-size:clamp(24px,2.6vw,40px)!important}
  .servicepage__head{margin-bottom:44px!important}
}

/* ═══ block 26 · tri-bar-plate-tone ═══ */
/* Programs runs on a sage ground, so no band there at all — an opaque plate can only ever
   be the wrong colour while the surfaces cross over. Everything above it keeps its own. */
body.program-map-open .bar::before{opacity:0;transition:opacity 0s}
body.faq-open .bar::before{opacity:1}
body.booking-page-open .bar::before{opacity:0}

/* Services and Programs titles — a touch more leading on the two-line setting. */
.servicepage__title{line-height:1.12!important}
.promap__title{line-height:1.12!important}

/* ═══ block 27 · tri-qa-v38 ═══ */
/* ═══ 01-B — the eyebrow takes the 01-A / 01-C position and the square card
         opens to the full band between that line and a bottom margin.
         The card sits in the centre track of a three-track grid whose left track
         has a floor: it stays page-centred wherever there is room, and slides
         right by exactly as much as the eyebrow column needs when there isn't. ═══ */
  @media (min-width:821px){
    #people-page{
      --pe-top:max(64px,calc(clamp(118px,15vh,168px) - 33px));
      --pe-bot:clamp(54px,6vh,64px);
      --pe-side:clamp(22px,4vw,56px);
      --pe-reserve:calc(250px + clamp(20px,2.2vw,40px));
      --pe-scrollbar:16px;
    }
    #people-page .quadsec{
      position:relative;
      display:grid;
      grid-template-columns:minmax(var(--pe-reserve),1fr) auto minmax(0,1fr);
      grid-template-rows:auto;
      align-content:start;
      align-items:start;
      justify-items:start;
      gap:0;
      padding:var(--pe-top) var(--pe-side) var(--pe-bot);
    }
    #people-page .secband.page-eyebrow{
      position:absolute;
      top:var(--pe-top);
      left:var(--pe-side);
      margin:0!important;
      width:auto;
      text-align:left!important;
    }
    #people-page .quad{
      grid-column:2;grid-row:1;
      width:min(
        94vw,
        calc(100vw - var(--pe-scrollbar) - 2*var(--pe-side) - var(--pe-reserve)),
        calc(100svh - var(--pe-top) - var(--pe-bot)),
        1180px
      );
    }
    /* the equipment cue moves into the bottom margin instead of onto the card */
    #people-page .cue{bottom:clamp(8px,1.3vh,14px);gap:6px;font-size:10px}
    #people-page .cue__line{height:16px}
  }

  /* ═══ 01-C — shorter rows in the equipment table ═══ */
  @media (min-width:821px){
    #people-page .band__head{padding:18px 14px 15px 2px}
    #people-page .band__roll{padding:20px 0}
    #people-page .band__rollwrap{max-height:84px}
  }

  /* ═══ 02 — the first card's two columns sit in an auto-height wrapper, so the
         copy box overflows downward and scrolls like every other card. ═══ */
  .service-card[data-service="recording"] .service-card__copy{
    column-count:initial;column-gap:normal;column-rule:none;
    overflow-x:hidden;overflow-y:auto;
  }
  .service-card__cols{
    column-count:2;
    column-gap:clamp(22px,2.2vw,36px);
    column-rule:1px solid rgba(33,29,26,.12);
  }
  .service-card__cols p{break-inside:avoid}
  @media (max-width:1100px){
    .service-card__cols{column-count:1;column-rule:none}
  }

  /* ═══ 04 · On Air — the rows were crushable, so at short viewport heights the
         flex split drove each row below the height of the line it carries and the
         text collided. Three coordinated changes remove the failure mode itself:
         (a) a row can never be shorter than its own content — min-height:auto
             restores the flex automatic minimum that min-height:0 had disabled;
         (b) Notices stops over-claiming the shared column — its row floor now
             scales with viewport height instead of holding a flat 54px;
         (c) the feature row's photo scales on the same curve as everything else. ═══ */
  .brow{min-height:auto}
  /* every remaining figure below is a vh-clamped floor: it binds only when the
     window is genuinely short, and is inert at 900px and above. */
  #box-notice .brow{min-height:clamp(40px,7vh,72px)}
  #box-notice .brow__main{padding:clamp(5px,.95vh,9px) 0}
  #box-air .brow--feature .brow__shot{height:clamp(38px,6.6vh,92px)}
  .bbox__ic{width:clamp(28px,4.6vh,44px);height:clamp(28px,4.6vh,44px)}
  .bcol{gap:clamp(12px,2vh,30px)}
  /* The board already releases its one-viewport lock below 1180px wide
     (#board-page .boardpage__inner → height:auto). The lock was never released on
     the other axis, so above 1180px a short window had to force this much content
     into a fixed height — which is what drove the rows past their own line height.
     This is the missing twin of that rule. Verified fit boundary: 640px. */
  @media (min-width:1181px) and (max-height:639px){
    #board-page .boardpage__inner{height:auto;min-height:100vh;min-height:100dvh;overflow:visible}
    #board-page .bgrid{flex:0 0 auto}
    #board-page #box-air,#board-page #box-cal{flex:0 0 auto}
    #board-page #box-air .brow,#board-page #box-air .brow--feature{flex:0 0 auto}
    #board-page .board-calendar__grid{grid-template-rows:auto repeat(6,minmax(38px,1fr))}
  }

  /* ═══ 04 · On Air rows 02–05 — category and title read side by side across two
         typographic columns divided by a hairline, instead of stacking. Each row's
         content height becomes max(label, title) rather than their sum, so the same
         box holds the same five entries with room to breathe. Row 01 keeps the
         feature treatment untouched. ═══ */
  /* Gated at 1040px: below it the box is too narrow to carry a label column
     without truncating the longest title, so that range keeps the stacked form. */
  @media (min-width:1040px){
    #box-air .brow:not(.brow--feature) .brow__main{
      display:grid;
      grid-template-columns:clamp(72px,5.6vw,92px) minmax(0,1fr);
      column-gap:clamp(12px,1.1vw,18px);
      row-gap:0;
      align-items:center;
      padding:clamp(3px,.55vh,7px) 0;
    }
    #box-air .brow:not(.brow--feature) .brow__ch{
      align-self:stretch;
      display:flex;
      align-items:center;
      letter-spacing:.1em;
      padding-right:clamp(9px,.8vw,14px);
      border-right:1px solid var(--board-hair);
    }
    /* the hairline is the separator now — the dot would be a second one */
    #box-air .brow:not(.brow--feature) .brow__ch::before{display:none}

    /* Notices adopt the same eyebrow treatment: label and title read side by
       side across two columns divided by a hairline instead of stacking, so a
       row's height is max(label, title) rather than their sum. */
    #box-notice .brow__main{
      display:grid;
      grid-template-columns:clamp(72px,5.6vw,92px) minmax(0,1fr);
      column-gap:clamp(12px,1.1vw,18px);
      row-gap:0;
      align-items:center;
      padding:clamp(3px,.55vh,7px) 0;
    }
    #box-notice .brow__ch{
      align-self:stretch;
      display:flex;
      align-items:center;
      letter-spacing:.1em;
      padding-right:clamp(9px,.8vw,14px);
      border-right:1px solid var(--board-hair);
    }
    #box-notice .brow__ch::before{display:none}
  }

  /* ═══ Booking — the panel's width was a share of the viewport width while its
         height was effectively a fixed 570px floor, so the two dimensions moved on
         unrelated axes and the proportion drifted with every window shape. It was
         also centred on the whole viewport rather than the band below the fixed
         header, which is why a short window put the title under the navigation.
         Both dimensions now derive from one governed band and one ratio. ═══ */
  @media (min-width:741px){
    .bookingpage{
      --bk-topband:clamp(82px,10vh,104px);
      --bk-gutter:clamp(15px,3vh,40px);
      --bk-band:calc(100svh - var(--bk-topband) - var(--bk-gutter));
      /* the panel grows with the window instead of stopping at a fixed cap —
         a 900px sheet is right on a 13" laptop and lost on a 27" display. */
      --bk-cap:min(calc(var(--bk-band) * .93),clamp(560px,66vh,840px));
      /* 1.36 could not hold the submit and four channels on one line at any
         legible type size; 1.50 is the narrowest ratio that does. */
      /* height comes from the band; width is then whatever the two columns need —
         the left track's longest label plus the action row — rather than a ratio.
         A fixed ratio cannot be right at both ends, because the content widens far
         more slowly than the panel heightens. */
      --bk-h:max(min(var(--bk-cap),840px),520px);
      --bk-w:min(76vw,clamp(820px,calc(var(--bk-h) * .58 + 570px),1120px));
    }
    .booking-glass{
      width:var(--bk-w);
      height:var(--bk-h);
      min-height:0;
      top:clamp(
        calc(var(--bk-topband) + var(--bk-h) / 2),
        calc(var(--bk-topband) + var(--bk-band) * .47),
        calc(100svh - var(--bk-gutter) - var(--bk-h) / 2)
      );
    }
    /* form controls were sized on vw while their pane is sized on vh — the same
       axis mismatch, one level down. They now derive from the panel's own height,
       so the contents of the panel and the panel itself can never diverge. */
    .booking-input{height:clamp(32px,calc(var(--bk-h) * .058),43px)}
    .booking-textarea{height:clamp(44px,calc(var(--bk-h) * .082),65px)}
    .booking-submit{min-height:clamp(46px,calc(var(--bk-h) * .080),60px)}
    .booking-fields{gap:clamp(14px,calc(var(--bk-h) * .027),20px)}
    .booking-actions{padding-top:clamp(13px,calc(var(--bk-h) * .025),22px)}
    /* the head and pane paddings carried the same vw/vh mismatch */
    .booking-head{
      padding-top:clamp(16px,calc(var(--bk-h) * .034),30px);
      padding-bottom:clamp(13px,calc(var(--bk-h) * .028),26px);
    }
    .booking-formpane{
      padding-top:clamp(16px,calc(var(--bk-h) * .036),32px);
      padding-bottom:clamp(14px,calc(var(--bk-h) * .030),29px);
    }
    .booking-feedback{min-height:9px;margin-top:5px}

    /* the choice list carries the first decision on this page — it reads at the
       weight of a menu, not a caption. */
    /* the two columns are sized by what they hold, not by a percentage: the left
       track takes the width of its longest label, the right takes the rest and the
       panel is sized so that "rest" is exactly the action row. */
    .booking-body{grid-template-columns:max-content minmax(0,1fr)}
    .booking-choice__label{white-space:nowrap}
    .booking-formpane{padding-left:clamp(20px,2vw,34px);padding-right:clamp(20px,2vw,34px)}
    .booking-head__title{font-size:clamp(23px,calc(var(--bk-h) * .052),38px)}
    .booking-choice__surface{
      font-size:clamp(13.5px,calc(var(--bk-h) * .030),18px);
      grid-template-columns:clamp(22px,calc(var(--bk-h) * .042),26px) minmax(0,1fr) 16px;
      gap:clamp(10px,calc(var(--bk-h) * .020),14px);
      padding-left:clamp(12px,1vw,20px);
      padding-right:clamp(12px,1vw,20px);
      min-height:38px;
    }
    .booking-choice:hover .booking-choice__surface{padding-left:clamp(16px,1.4vw,25px)}
    .booking-choice__surface>svg{
      width:clamp(22px,calc(var(--bk-h) * .042),26px);
      height:clamp(22px,calc(var(--bk-h) * .042),26px);
    }

    /* the ribbon: shorter band, larger type filling it, coral ground. Ink on coral
       measures 4.87:1 — cream would have been 3.18 and failed AA. */
    /* the button is the primary action, so its label now outsizes the ribbon.
       The ribbon cannot go below 19px while it is cream on coral — that pairing
       is 3.18:1 and only clears AA as large text (bold ≥18.66px). */
    /* button and channels read as one family — 1.15:1, not 2:1 */
    .booking-submit{
      font-size:clamp(15.5px,calc(var(--bk-h) * .030),19px);
      padding:0 clamp(15px,1.2vw,22px);
      font-weight:700;
    }
    .booking-channel{gap:5px;font-size:clamp(13px,calc(var(--bk-h) * .026),16px)}
    .booking-channel svg{width:16px;height:16px}
    .booking-direct{gap:clamp(9px,.8vw,16px)}
    .booking-marquee{
      height:clamp(19px,calc(var(--bk-h) * .034),24px);
      margin-top:clamp(8px,calc(var(--bk-h) * .017),15px);
      border-radius:999px;
      background:var(--bk-accent);
    }
    /* cream on coral is 3.18:1 — it clears AA only as large text, so the type is
       held at 19px/700 and above, which is the large-text threshold. */
    /* Ink ground, cream type — 15.48:1, the highest-contrast pairing in the palette
       and the one with no chroma to vibrate. */
    .booking-marquee{background:var(--bk-ink)}
    .booking-marquee__item{
      font-size:clamp(12px,calc(var(--bk-h) * .023),15px);
      font-weight:700;
      line-height:1;
      color:#FAFAF8;
      padding:0 clamp(11px,1vw,17px);
    }
    .booking-marquee__sep{color:rgba(250,250,248,.55)}
    /* the Korean booking surface is set in SeoulNamsan Medium throughout */
    html[lang="ko"] .bookingpage,
    html[lang="ko"] .booking-head__title,
    html[lang="ko"] .booking-head__sub,
    html[lang="ko"] .booking-choice__surface,
    html[lang="ko"] .booking-line__label,
    html[lang="ko"] .booking-input,
    html[lang="ko"] .booking-textarea,
    html[lang="ko"] .booking-input::placeholder,
    html[lang="ko"] .booking-textarea::placeholder,
    html[lang="ko"] .booking-submit,
    html[lang="ko"] .booking-channel,
    html[lang="ko"] .booking-feedback,
    html[lang="ko"] .booking-marquee__item{font-family:var(--tri-hero-m);letter-spacing:-.01em}
    /* the primary action carries the display weight, not the text weight */
    html[lang="ko"] .booking-submit{font-family:var(--tri-hero)}

    /* The action row's stacking rule was keyed to the viewport while the row lives
       in the form pane — on a 27" display the viewport is wide, the pane is not,
       and the submit ran into the channel links. It now answers to its container. */
    .booking-formpane{container-type:inline-size}
    /* the two legacy viewport branches also stacked this row; they are the same
       mistake and are superseded here. One rule, keyed to the pane. */
    .booking-actions{grid-template-columns:auto minmax(0,1fr)}
    .booking-submit{justify-self:start;width:auto;min-width:0}
    .booking-direct{justify-self:end;width:auto;justify-content:flex-end;flex-wrap:nowrap}
    @container (max-width:490px){
      .booking-actions{grid-template-columns:minmax(0,1fr);gap:clamp(11px,1.4vh,17px)}
      .booking-direct{justify-self:stretch;width:100%;justify-content:space-between}
    }
  }

  /* ═══ The Close control is the Booking control in another state — same ink
         pill, same cream label, not an inverted one. ═══ */
  body.booking-page-open .bar__cta,
  body.booking-page-open .bar__cta:hover,
  body.booking-page-open .bar__cta:focus-visible{
    background:var(--ink)!important;
    color:var(--cream-high)!important;
    font-weight:600!important;
    box-shadow:none!important;
    text-shadow:none;
  }
  body.booking-page-open .bar__cta:hover,
  body.booking-page-open .bar__cta:focus-visible{background:var(--accent)!important}

  /* Below the height at which the band can supply the panel's content minimum
     (measured 554px, worst case 1024px wide in English), the panel stops being a
     fixed centred sheet and lays out in flow — the same release the phone layout
     already uses. Above it, the governed panel holds. */
  @media (min-width:741px) and (max-height:669px){
    .bookingpage{overflow-y:auto}
    .booking-scene{position:fixed;top:50%}
    .booking-glass{
      position:relative;left:auto;top:auto;
      width:min(80vw,1000px);height:auto;min-height:0;
      margin:clamp(88px,13vh,110px) auto clamp(26px,4vh,44px);
      transform:none;
    }
    /* line 1983 pins the centring transform with an ID-level !important on every
       desktop width; the flow layout has to answer at the same weight. */
    #booking-page .booking-glass,
    .bookingpage.is-open .booking-glass{transform:none!important}
    .booking-choices{grid-template-rows:repeat(8,minmax(44px,auto))}
    .booking-formpane{min-height:0}
  }

  /* ═══ Footer — the closing eyebrow clears the record, the panel breathes,
         and the two headlines take the hero face. ═══ */
  .trinity-footer__stage{
    min-height:clamp(368px,42svh,424px);
    padding-top:clamp(82px,7.4vh,92px);
    padding-bottom:clamp(34px,4.2vh,50px);
  }
  .trinity-footer__headline{font-family:var(--tri-hero)}
  @media (max-width:820px){
    .trinity-footer__stage{
      min-height:clamp(300px,54svh,420px);
      padding-top:clamp(52px,7vh,72px);
      padding-bottom:clamp(26px,3.6vh,40px);
    }
  }

/* ═══ block 28 · trinity-v48-onair-notice ═══ */
#box-air .brow{flex:1 1 0;cursor:default}
#box-air .brow:hover,#box-air .brow:focus-visible{background:transparent;padding-left:8px}
#box-air .brow--feature{grid-template-columns:auto minmax(0,1fr) clamp(92px,13vh,150px) auto;flex:2 1 0;column-gap:clamp(12px,1.4vw,20px)}
#box-air .brow--feature .brow__no{grid-column:1;align-self:start;padding-top:clamp(6px,1vh,12px);font:600 clamp(22px,3.4vh,34px)/1 var(--tri-title);letter-spacing:0;color:var(--board-ink)}
#box-air .brow--feature .brow__main{grid-column:2;gap:5px}
#box-air .brow--feature .brow__ch{font-size:clamp(9px,1.1vh,10.5px)}
#box-air .brow--feature .brow__ti{white-space:normal;overflow:visible;text-overflow:clip;font-size:clamp(15px,2vh,20px);line-height:1.16}
#box-air .brow--feature .brow__shot{grid-column:3;align-self:center;width:100%;height:clamp(54px,8.4vh,92px);border:3px solid var(--board-ink);box-shadow:5px 5px 0 rgba(33,29,26,.14);overflow:hidden;background:var(--board-ink)}
#box-air .brow--feature .brow__shot img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:960px){ #box-air .brow--feature{min-height:118px} #box-air .brow--feature .brow__shot{height:clamp(70px,17vw,104px)} }

.brow--notice{position:relative;--accent:#DE654B}
.brow--notice .brow__ch::before{background:var(--accent)}
.brow--notice::after{content:'';position:absolute;left:0;top:50%;height:66%;width:3px;background:var(--accent);transform:translateY(-50%) scaleY(0);transform-origin:center;transition:transform .24s var(--board-ease)}
.brow--notice:hover,.brow--notice:focus-visible{background:transparent;padding-left:16px}
.brow--notice:hover::after,.brow--notice:focus-visible::after{transform:translateY(-50%) scaleY(1)}
.brow--notice .brow__bub{transition:transform .24s var(--board-ease)}
.brow--notice:hover .brow__bub,.brow--notice:focus-visible .brow__bub{transform:rotate(-7deg) scale(1.14)}
@media(prefers-reduced-motion:reduce){.brow--notice::after,.brow--notice .brow__bub{transition-duration:1ms}}

.npop{position:fixed;inset:0;z-index:120;display:none;--ink:#211D1A;--cream:#FAFAF8;--coral:#DE654B;--pop-accent:#DE654B}
.npop.is-open{display:block}
body.npop-open{overflow:hidden}
.npop__scrim{position:absolute;inset:0;background:rgba(33,29,26,.34);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.npop__card{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(93vw,520px);max-height:86vh;overflow:auto;background:var(--cream);border:5px solid var(--ink);box-shadow:12px 13px 0 rgba(33,29,26,.16);padding:clamp(28px,5vw,44px) clamp(24px,4.6vw,42px) clamp(26px,4vw,38px)}
.npop__close{position:absolute;top:12px;right:12px;z-index:6;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border:2.5px solid var(--ink);border-radius:50%;background:var(--cream);color:var(--ink);font:600 15px/1 var(--tri-ui);cursor:pointer;transition:background .18s,color .18s}
.npop__close:hover,.npop__close:focus-visible{background:var(--ink);color:var(--cream);outline:none}
.npop__eye{display:flex;align-items:center;gap:9px;margin:0 0 13px;font:600 10px var(--tri-ui);letter-spacing:.18em;text-transform:uppercase;color:rgba(33,29,26,.62)}
.npop__eye::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--coral);flex:0 0 auto}
.npop__title{margin:0 0 15px;font-family:var(--tri-title);font-size:clamp(21px,4.8vw,29px);font-weight:600;line-height:1.1;letter-spacing:-.02em;color:var(--ink)}
.npop__lead{margin:0 0 18px;max-width:60ch;font-family:var(--tri-title);font-size:clamp(15px,2.05vh,18px);line-height:1.44;color:var(--coral);font-weight:600;letter-spacing:-.01em}
.npop__divider{height:1px;background:rgba(33,29,26,.15);margin:0 0 18px}
.npop__body{margin:0 0 24px;max-width:60ch;font-family:var(--tri-text);font-size:clamp(13.5px,1.75vh,15.5px);line-height:1.65;color:#3A3633}
.npop__body p{margin:0 0 13px}
.npop__body p:last-child{margin-bottom:0}
.npop__list{list-style:none;margin:2px 0 15px;padding:0}
.npop__list li{position:relative;padding:0 0 8px 20px;line-height:1.55}
.npop__list li:last-child{padding-bottom:0}
.npop__list li::before{content:'';position:absolute;left:2px;top:.62em;width:8px;height:2px;background:var(--coral)}
.npop__closing{margin:22px 0 24px;max-width:60ch;font-family:var(--tri-title);font-size:clamp(15px,2.15vh,18.5px);line-height:1.4;color:var(--ink);letter-spacing:-.01em}
.npop__closing::before{content:'';display:block;width:32px;height:3px;background:var(--pop-accent);margin:0 0 13px}
.npop__act{display:inline-flex;align-items:center;gap:8px;padding:12px 19px;border:2.5px solid var(--ink);background:var(--ink);color:var(--cream);font:600 11px var(--tri-ui);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .18s cubic-bezier(.22,1,.36,1)}
.npop__act:hover,.npop__act:focus-visible{transform:translate(-2px,-2px);box-shadow:4px 4px 0 rgba(33,29,26,.16);outline:none}

/* now_open — bright pop confetti */
.npop__confetti{position:fixed;inset:0;pointer-events:none;overflow:visible;z-index:130}
.npop__confetti i{position:fixed;width:9px;height:13px;will-change:transform,opacity}
/* offer — borderless bold-pink SPECIAL OFFER % ticker, slow */
.npop__ticker{margin:2px 0 17px;height:28px;overflow:hidden;background:#FF4D8D;display:flex;align-items:center}
.npop__ticker-track{display:flex;flex:0 0 auto;white-space:nowrap;font:700 10.5px var(--tri-ui);letter-spacing:.26em;color:#FFFFFF;animation:npop-roll 20s linear infinite}
.npop__ticker-track span{padding:0 16px}
.npop__ticker-track b{color:#FFD23F}
@keyframes npop-roll{to{transform:translateX(-50%)}}
/* open_call — musical notes image bouncing just outside, left of the title */
.npop__notes{position:fixed;z-index:128;pointer-events:none;width:clamp(46px,6vw,64px);height:auto;transform-origin:center;opacity:0;animation:npop-fadein .4s ease forwards, npop-bounce 1.3s ease-in-out .25s infinite}
@keyframes npop-fadein{to{opacity:1}}
@keyframes npop-bounce{0%,100%{transform:translateY(0) rotate(-5deg)}50%{transform:translateY(-13px) rotate(5deg)}}
.npop__notes.no-anim{opacity:1;animation:npop-fadein .4s ease forwards}
/* event — smaller envelope image inside bottom-right + cartoon sparkle emphasis */
.npop__evwrap{position:fixed;z-index:124;pointer-events:none;width:clamp(44px,5.6vw,58px);height:clamp(44px,5.6vw,58px);opacity:0;animation:npop-fadein .4s ease forwards}
.npop__evwrap .npop__envelope{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;animation:npop-evbob 2.6s ease-in-out infinite}
@keyframes npop-evbob{0%,100%{transform:translateY(0) rotate(-2.5deg)}50%{transform:translateY(-4px) rotate(2.5deg)}}
.npop__spark{position:absolute;inset:-16px;width:calc(100% + 32px);height:calc(100% + 32px);overflow:visible}
.npop__spark .spk{transform-box:fill-box;transform-origin:center;animation:npop-twinkle 1.5s ease-in-out infinite}
@keyframes npop-twinkle{0%,100%{opacity:.2;transform:scale(.45)}50%{opacity:1;transform:scale(1)}}
.npop__evwrap.no-anim{opacity:1}
.npop__evwrap.no-anim .npop__envelope,.npop__evwrap.no-anim .spk{animation:none}

@media(prefers-reduced-motion:reduce){
  .npop__act{transition-duration:1ms}
  .npop__confetti{display:none}
  .npop__ticker-track{animation:none;transform:none}
  .npop__notes{animation:npop-fadein .4s ease forwards}
  .npop__evwrap .npop__envelope,.npop__spark .spk{animation:none}
}

/* ═══ block 29 · tri-lang-css ═══ */
.bar__right{display:flex;align-items:center;gap:clamp(12px,1.4vw,18px);pointer-events:auto}
.bar__lang{display:inline-flex;align-items:center;gap:6px;font-family:var(--tri-ui);font-weight:500;font-size:12px;letter-spacing:.06em;color:var(--ink);line-height:1;-webkit-user-select:none;user-select:none;white-space:nowrap}
.bar__lang-b{appearance:none;-webkit-appearance:none;border:0;background:transparent;padding:3px 1px;margin:0;cursor:pointer;color:currentColor;opacity:.48;font:inherit;letter-spacing:inherit;line-height:1;transition:opacity .25s ease}
.bar__lang-b.is-on{opacity:1;font-weight:700}
.bar__lang-b:hover{opacity:.82}
.bar__lang-b:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
.bar__lang-sep{opacity:.34;pointer-events:none}
@media (max-width:520px){.bar__lang{font-size:11px;gap:5px}.bar__right{gap:10px}}

/* ═══ block 30 · tri-svc-dynamic ═══ */
/* Odd card counts would leave an empty cell in the 2-column stack;
     the trailing tab spans instead. */
  @media (max-width:820px){
    .service-carousel.is-odd .service-card:last-child .service-card__tab{grid-column:1 / -1}
  }
  /* overflow-wrap:break-word cannot reduce a word's min-content width, so a
     long Latin word in a collapsed tab was being clipped rather than wrapped
     (measured: 3 of 5 tabs clipped at 1024px in English at the current six
     cards). `anywhere` reduces min-content, so the word wraps. Korean is
     unaffected; English words that already fit are unaffected. */
  .service-card:not(.is-active) .service-card__name{overflow-wrap:anywhere}

/* ═══ block 31 · tri-booking-consent-css ═══ */
/* ── booking consent notice — sits BELOW the glass box, on the dark scene ──
   Geometry is measured at runtime (the glass has several breakpoint layouts),
   so this rule only owns type + colour. The two flow-layout breakpoints below
   drop it back into normal document flow.                                   */
.booking-consent{
  position:absolute;z-index:3;left:50%;transform:translateX(-50%);
  width:min(64%,1120px);margin:0;text-align:center;
  color:rgba(255,255,255,.72);
  font-size:clamp(10.5px,.78vw,12.5px);line-height:1.5;letter-spacing:.01em;
  text-shadow:0 1px 10px rgba(0,0,0,.45);
  opacity:0;transition:opacity .5s ease .34s;pointer-events:none;
}
.bookingpage.is-open .booking-consent{opacity:1}
@media (max-width:740px){
  .booking-consent{position:static;transform:none;width:calc(100% - 36px);
    margin:-12px auto 30px;font-size:11px}
}
@media (min-width:741px) and (max-height:669px){
  .booking-consent{position:static;transform:none;width:min(80vw,1000px);
    margin:calc(clamp(26px,4vh,44px) * -1 + 10px) auto clamp(26px,4vh,44px)}
}
@media (prefers-reduced-motion:reduce){
  .booking-consent{transition-duration:1ms!important}
}