@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Instrument+Serif:ital@0;1&display=swap');
:root{font-family:'DM Mono',monospace;color:#f3ead8;background:#11100e;--bg:#11100e;--paper:#e8ddc7;--ink:#11100e;--red:#8f1518;--rust:#5b2b25;--olive:#42473c;--muted:#9f9687;--line:rgba(232,221,199,.2)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:#f3ead8}body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.08;z-index:100;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.container{width:min(1220px,calc(100% - 52px));margin:auto}.site-header{height:72px;position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 max(26px,calc((100vw - 1220px)/2));background:rgba(17,16,14,.82);backdrop-filter:blur(13px);border-bottom:1px solid var(--line)}.brand{font-size:1rem;letter-spacing:.08em;font-weight:500}.brand i{font-family:'Instrument Serif',serif;font-size:1.35rem;font-weight:400;color:#d98f83}.nav{display:flex;gap:23px;text-transform:uppercase;font-size:.7rem;letter-spacing:.12em}.nav a{color:#b8ad9c}.nav a:hover,.nav a.active{color:#fff}.hero{min-height:calc(100vh - 72px);position:relative;display:flex;align-items:flex-end;overflow:hidden}.hero-image{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,7,.9) 0%,rgba(9,8,7,.62) 48%,rgba(9,8,7,.18) 100%),url('/assets/motel-exterior.png') center/cover;filter:saturate(.65) contrast(1.07)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(to top,#11100e 0%,transparent 38%)}.hero-content{position:relative;z-index:3;padding-bottom:10vh}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:.68rem;color:#c77f75}.hero h1,.page-intro h1,.section h2,.cast-card h2,.modal h2{font-family:'Instrument Serif',serif;font-weight:400}.hero h1{margin:10px 0 18px;line-height:.78;font-size:clamp(5.3rem,12vw,12rem);max-width:1020px;letter-spacing:-.045em}.hero h1 span,.hero h1 em{display:block}.hero h1 em{font-weight:400;color:#d28e83;margin-left:8vw}.tagline{font-family:'Instrument Serif',serif;font-size:clamp(1.4rem,2.4vw,2.2rem);font-style:italic;margin:0 0 14px}.hero-copy,.lede{max-width:720px;line-height:1.75;color:#d7cdbc;font-size:.95rem}.button-row{display:flex;gap:12px;margin-top:28px}.button{border:1px solid var(--paper);background:var(--paper);color:var(--ink);padding:13px 18px;text-transform:uppercase;letter-spacing:.11em;font-size:.72rem;cursor:pointer}.button.ghost{background:transparent;color:var(--paper)}.hero-stamp{position:absolute;right:6vw;bottom:12vh;z-index:5;border:1px solid rgba(232,221,199,.55);padding:12px 16px;transform:rotate(5deg);font-size:.72rem;letter-spacing:.14em;color:#d9cebb}.section{padding:105px 0}.split-section{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;align-items:center}.section h2{font-size:clamp(3rem,5.5vw,5.6rem);line-height:.92;margin:12px 0 24px}.section-copy p:last-child,.prose-grid p,.cast-card p,.modal p,.contact-grid p{color:#bdb2a2;line-height:1.75}.trailer-card{position:relative;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--line)}.trailer-card img{width:100%;height:100%;object-fit:cover;filter:saturate(.65) contrast(1.08)}.trailer-card:after{content:'';position:absolute;inset:0;background:rgba(37,8,6,.22)}.play{position:absolute;z-index:3;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:78px;height:78px;border-radius:50%;border:1px solid #fff;background:rgba(0,0,0,.24);color:#fff;font-size:1.5rem}.trailer-card span{position:absolute;z-index:3;left:18px;bottom:16px;text-transform:uppercase;font-size:.67rem;letter-spacing:.14em}.quote-band{background:var(--paper);color:#261b17;padding:70px 26px}.quote-band p{font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(2.5rem,5.6vw,6rem);line-height:.95;max-width:1200px;margin:auto}.section-heading{margin-bottom:34px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.stat-card{padding:24px 20px 32px;border-right:1px solid var(--line)}.stat-card:last-child{border-right:0}.stat-card span{display:block;color:#8e8578;text-transform:uppercase;font-size:.66rem;letter-spacing:.12em;margin-bottom:50px}.stat-card strong{font-family:'Instrument Serif',serif;font-size:1.7rem;font-weight:400}.image-break{height:76vh;position:relative;overflow:hidden}.image-break img{width:100%;height:100%;object-fit:cover;filter:saturate(.42) contrast(1.2) brightness(.68)}.image-break:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(77,14,14,.4),transparent)}.image-break div{position:absolute;z-index:2;left:5vw;bottom:8vh}.image-break span{display:block;font-size:.72rem;letter-spacing:.24em}.image-break strong{display:block;font-family:'Instrument Serif',serif;font-size:clamp(3rem,8vw,8rem);font-weight:400;line-height:.86;max-width:850px}.home-links{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);padding-top:0;padding-bottom:105px}.home-links a{background:#11100e;padding:28px 24px;display:grid;grid-template-columns:1fr auto;min-height:180px;align-content:space-between}.home-links span{grid-column:1/-1;color:#8f8679;text-transform:uppercase;font-size:.68rem}.home-links strong{font-family:'Instrument Serif',serif;font-size:2.1rem;font-weight:400}.home-links i{font-style:normal;font-size:1.5rem}.page-intro{padding:120px 0 65px;border-bottom:1px solid var(--line)}.page-intro h1{font-size:clamp(5rem,11vw,11rem);line-height:.78;margin:15px 0 25px;letter-spacing:-.04em}.prose-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:80px}.prose-grid h2{margin-top:8px}.prose-grid p{font-size:1rem}.two-up-mood{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.two-up-mood img{width:100%;max-height:620px;object-fit:cover;filter:saturate(.6)}blockquote{font-family:'Instrument Serif',serif;font-size:2rem;font-style:italic;margin:30px 0 0;color:#e2d3bd}.cast-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:70px 20px}.cast-card{border-top:1px solid var(--line);padding-top:15px}.cast-photo{aspect-ratio:4/3;background:#221d19;display:flex;align-items:center;justify-content:center;margin-bottom:18px;position:relative;overflow:hidden}.cast-photo:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 60% 35%,rgba(143,21,24,.28),transparent 30%)}.cast-photo span{color:#71695f;text-transform:uppercase;font-size:.65rem;letter-spacing:.14em;text-align:center}.cast-card h2{font-size:3rem;margin:6px 0}.crew-list{padding-top:65px}.crew-dept{display:grid;grid-template-columns:260px 1fr;border-top:1px solid var(--line);padding:26px 0}.crew-dept h2{font-size:2rem;margin:0}.crew-dept button{width:100%;display:grid;grid-template-columns:1fr 1fr auto;gap:20px;text-align:left;background:none;color:inherit;border:0;border-bottom:1px solid rgba(232,221,199,.12);padding:15px 4px;cursor:pointer}.crew-dept button:hover{color:#d98f83}.crew-dept button em{font-style:normal;color:#92887a}.crew-dept button i{font-style:normal}.modal-backdrop{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.78);display:grid;place-items:center;padding:20px}.modal{width:min(620px,100%);background:#e7dbc3;color:#17110f;padding:45px;position:relative}.modal .eyebrow{color:#8f1518}.modal h2{font-size:4rem;margin:8px 0 18px}.modal p:last-child{color:#40362e}.modal-close{position:absolute;top:16px;right:18px;border:0;background:none;font-size:2rem;cursor:pointer}.awards-empty{text-align:center;padding-block:130px}.laurel{font-size:5rem;color:#a83031}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.gallery-grid figure{margin:0}.gallery-grid figure.wide{grid-column:span 2}.gallery-grid img{width:100%;height:390px;object-fit:cover;filter:saturate(.55) contrast(1.04);display:block}.gallery-grid figcaption{padding:8px 0;color:#81796e;font-size:.63rem;text-transform:uppercase;letter-spacing:.12em}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.contact-form{display:grid;gap:16px}.contact-form label{display:grid;gap:8px;color:#93897b;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}input,textarea{border:0;border-bottom:1px solid var(--line);background:transparent;color:#fff;padding:13px 2px;outline:none}textarea{resize:vertical}.contact-form .button{justify-self:start;margin-top:12px}.site-footer{border-top:1px solid var(--line);padding:30px max(26px,calc((100vw - 1220px)/2));display:flex;justify-content:space-between;color:#887f73;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}.site-footer div{display:grid;gap:6px}.site-footer strong{color:#cfc2ae}.footer-right{text-align:right}
@media(max-width:900px){.nav{display:none}.hero h1 em{margin-left:0}.hero-stamp{display:none}.split-section,.prose-grid,.two-up-mood,.contact-grid{grid-template-columns:1fr}.stats-grid{grid-template-columns:1fr 1fr}.stat-card:nth-child(2){border-right:0}.stat-card:nth-child(-n+2){border-bottom:1px solid var(--line)}.home-links{grid-template-columns:1fr}.cast-grid{grid-template-columns:1fr}.crew-dept{grid-template-columns:1fr;gap:14px}.gallery-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.container{width:calc(100% - 28px)}.site-header{padding-inline:14px}.hero-content{padding-bottom:8vh}.hero h1{font-size:clamp(4.5rem,23vw,7rem)}.section{padding:75px 0}.stats-grid{grid-template-columns:1fr}.stat-card{border-right:0!important;border-bottom:1px solid var(--line)}.home-links{padding-bottom:75px}.page-intro{padding-top:90px}.page-intro h1{font-size:5rem}.crew-dept button{grid-template-columns:1fr auto}.crew-dept button em{grid-row:2;grid-column:1}.gallery-grid{grid-template-columns:1fr}.gallery-grid figure.wide{grid-column:span 1}.gallery-grid img{height:330px}.site-footer{flex-direction:column;gap:20px}.footer-right{text-align:left}}


/* Static Netlify build additions */
.nav-toggle{display:none;border:0;background:none;color:#f3ead8;font-size:1.4rem;cursor:pointer}
@media(max-width:900px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:72px;left:0;right:0;background:#11100e;border-bottom:1px solid var(--line);padding:24px 26px;flex-direction:column}
  .nav.open{display:flex}
}
.contact-success{display:none;margin-top:20px;color:#d98f83}
.grain{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(120% 90% at 70% 30%,transparent 35%,rgba(9,7,6,.55) 100%)}
.cast-card .eyebrow{color:#8e8578}
.awards-empty a:not(.button){border-bottom:1px solid var(--line)}

/* Crew credits list */
.crew-credits{display:grid;align-content:start}
.credit-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:baseline;padding:13px 4px;border-bottom:1px solid rgba(232,221,199,.12)}
.credit-row:last-child{border-bottom:0}
.credit-row span{color:#f3ead8}
.credit-row em{font-style:normal;color:#92887a;text-transform:uppercase;font-size:.68rem;letter-spacing:.1em}
@media(max-width:560px){
  .credit-row{grid-template-columns:1fr;gap:4px;padding:11px 4px}
  .credit-row em{font-size:.64rem}
}

/* Crew bio expander */
.credit-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 22px}
.credit-row i{font-style:normal;color:#6f675c;justify-self:end}
button.credit-row{width:100%;text-align:left;background:none;color:inherit;border:0;border-bottom:1px solid rgba(232,221,199,.12);font:inherit;cursor:pointer}
button.credit-row:hover span,button.credit-row:focus-visible span,button.credit-row:hover i,button.credit-row:focus-visible i{color:#d98f83}
.crew-modal-grid{display:grid;grid-template-columns:minmax(180px,300px) 1fr;gap:2rem;align-items:start}
.crew-modal-photo{width:100%;height:auto;display:block;filter:contrast(1.05)}
.modal{max-height:88vh;overflow-y:auto}
#modalBio p{margin:0 0 1em}
#modalBio p:last-child{margin-bottom:0}
@media(max-width:700px){
  .crew-modal-grid{grid-template-columns:1fr;gap:1.4rem}
  .crew-modal-photo{max-height:45vh;object-fit:cover;object-position:top}
  .modal{padding:34px 24px}
}
@media(max-width:560px){
  .credit-row{grid-template-columns:minmax(0,1fr) 22px}
  .credit-row em{grid-column:1}
  .credit-row i{grid-column:2;grid-row:1/span 2;align-self:center}
}

/* crew credit avatars — circular thumbnail beside the name on rows that open a bio */
.credit-row span{display:flex;align-items:center;gap:12px;min-width:0}
button.credit-row{align-items:center}
.credit-avatar{width:44px;height:44px;flex:0 0 44px;border-radius:50%;object-fit:cover;object-position:center top;filter:saturate(.55) contrast(1.06);border:1px solid rgba(232,221,199,.24);background:#221d19;transition:border-color .2s,filter .2s}
button.credit-row:hover .credit-avatar,button.credit-row:focus-visible .credit-avatar{border-color:#d98f83;filter:saturate(.8) contrast(1.06)}
@media(max-width:560px){
  .credit-row span{gap:10px}
  .credit-avatar{width:38px;height:38px;flex:0 0 38px}
  button.credit-row em{padding-left:48px}
}

/* behind-the-scenes gallery — category cards, the category window, and the
   single-photo viewer (/gallery/) */
.gal-status{padding:20px 0;color:#8f8679;text-transform:uppercase;font-size:.68rem;letter-spacing:.12em}
.gal-notice{padding:22px 24px;border:1px solid var(--line);color:#c9bda9;line-height:1.7;font-size:.85rem;max-width:720px}
.gal-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gal-cat{display:block;width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer}
.gal-cat-cover{display:block;aspect-ratio:4/3;overflow:hidden;background:#221d19;position:relative}
.gal-cat-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(17,16,14,.75),transparent 55%)}
.gal-cat-cover img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.5) contrast(1.06);transition:transform .55s ease,filter .55s ease}
.gal-cat:hover .gal-cat-cover img,.gal-cat:focus-visible .gal-cat-cover img{transform:scale(1.04);filter:saturate(.85) contrast(1.08)}
.gal-cat-body{display:grid;gap:6px;padding:14px 2px 0}
.gal-cat-body strong{font-family:'Instrument Serif',serif;font-weight:400;font-size:1.9rem;line-height:1.05}
.gal-cat-body em{font-style:normal;color:#bdb2a2;font-size:.85rem;line-height:1.6}
.gal-cat-body span{color:#8f8679;text-transform:uppercase;font-size:.66rem;letter-spacing:.12em}
.gal-cat:hover .gal-cat-body strong,.gal-cat:focus-visible .gal-cat-body strong{color:#d98f83}
.gal-cat:focus-visible{outline:1px solid #d98f83;outline-offset:6px}

.gal-overlay{position:fixed;inset:0;z-index:70;background:rgba(9,8,7,.97)}
.gal-overlay[hidden]{display:none}
.gal-sheet{display:flex;flex-direction:column;overflow:hidden}
.gal-sheet-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-top:34px;padding-bottom:20px;border-bottom:1px solid var(--line);flex:0 0 auto}
.gal-sheet-head h2{font-family:'Instrument Serif',serif;font-weight:400;font-size:clamp(2.4rem,5vw,4rem);line-height:.95;margin:6px 0 0}
.gal-sheet-head>span{color:#8f8679;text-transform:uppercase;font-size:.66rem;letter-spacing:.12em;white-space:nowrap;margin-bottom:10px;margin-left:auto}
.gal-sheet-grid{flex:1 1 auto;overflow-y:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-top:26px;padding-bottom:60px;align-content:start}
.gal-tile{padding:0;border:0;background:#221d19;aspect-ratio:4/3;overflow:hidden;cursor:pointer}
.gal-tile img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.55) contrast(1.04);transition:transform .4s ease,filter .4s ease}
.gal-tile:hover img,.gal-tile:focus-visible img{transform:scale(1.04);filter:saturate(.85) contrast(1.06)}
.gal-tile:focus-visible{outline:1px solid #d98f83;outline-offset:2px}

.gal-photo{z-index:80;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:70px 20px 60px}
.gal-photo img{grid-column:2;justify-self:center;max-width:100%;max-height:80vh;object-fit:contain}
.gal-caption{position:absolute;left:0;right:0;bottom:22px;margin:0;text-align:center;color:#8f8679;text-transform:uppercase;font-size:.66rem;letter-spacing:.12em}
.gal-close{position:absolute;top:14px;right:18px;z-index:5;border:0;background:none;color:#e8ddc7;font-size:2rem;line-height:1;cursor:pointer}
.gal-sheet .gal-close{position:static;margin-bottom:4px}
.gal-arrow{border:0;background:none;color:#e8ddc7;font-size:3rem;line-height:1;padding:0 6px;cursor:pointer;opacity:.6}
.gal-arrow:hover,.gal-arrow:focus-visible{opacity:1;color:#d98f83}
.gal-photo.single .gal-arrow{visibility:hidden}

@media(max-width:900px){
  .gal-cats{grid-template-columns:1fr 1fr;gap:18px}
  .gal-sheet-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:560px){
  .gal-cats{grid-template-columns:1fr}
  .gal-cat-body strong{font-size:1.7rem}
  .gal-sheet-head{padding-top:24px;gap:14px;flex-wrap:wrap}
  .gal-sheet-grid{grid-template-columns:1fr 1fr;padding-bottom:40px}
  .gal-photo{padding:60px 8px 56px}
  .gal-arrow{font-size:2.2rem}
}

/* footer — one centred credit line in place of the original two-column split */
.site-footer{justify-content:center;text-align:center}
.site-footer p{margin:0;max-width:1220px}
.site-footer strong{margin-right:.35em}
@media(max-width:560px){.site-footer{flex-direction:row}}

/* header brand — the full title in place of the PYBIMB monogram. Much wider, and
   the header is a fixed 72px with the mobile nav hung off top:72px, so it must
   never wrap; it steps down instead on the narrowest phones. */
.brand{white-space:nowrap}
@media(max-width:420px){
  .brand{font-size:.82rem;letter-spacing:.04em}
  .brand i{font-size:1.1rem}
}
@media(max-width:340px){
  .brand{font-size:.72rem}
  .brand i{font-size:.98rem}
}

/* Gallery department headings. The categories are small and specific — one
   setup or one run of frames each — so the cards are stacked under the
   department they belong to instead of running as one long grid. The card grid
   defined for .gal-cats above moves down onto each group. */
.gal-cats{display:block}
.gal-group+.gal-group{margin-top:56px}
.gal-group-title{font-family:'Instrument Serif',serif;font-weight:400;font-size:1.05rem;letter-spacing:.2em;text-transform:uppercase;color:#8f8679;margin:0 0 22px;padding-bottom:12px;border-bottom:1px solid rgba(143,134,121,.24)}
.gal-group-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){
  .gal-group-grid{grid-template-columns:1fr 1fr;gap:18px}
}
@media(max-width:560px){
  .gal-group+.gal-group{margin-top:44px}
  .gal-group-grid{grid-template-columns:1fr}
}

/* Gallery overlay grid: pin each row to the height of its tiles. The grid is a
   flex item inside the fixed-height .gal-sheet column, so it has a definite
   block size — and its implicit `auto` rows were dividing that height between
   themselves instead of sizing to their contents. Rows came out 157px tall while
   every tile is 4:3 of a 296px column, i.e. 222px, so each tile hung 53px over
   the one in the row below. min-content makes the rows hug their tiles again. */
.gal-sheet-grid{grid-auto-rows:min-content}

/* Category cards: line the text rows up across each row of the grid. Each card
   was running its own vertical rhythm — a title long enough to wrap to two
   lines ("Last Looks by the White House") pushed that card's blurb and photo
   count below the ones either side of it, so cards in the same row sat at
   slightly different heights. Every card now spans four rows of the group grid
   and takes its tracks from it with subgrid, so cover, title, blurb, and count
   each share a track across the whole row and stay level however any one of
   them wraps.

   The tracks carry the within-card spacing, which is why the gap between rows
   of cards comes from the card's own margin rather than row-gap: 6px + 16px
   reproduces the 22px the grid used to set (18px at the smaller breakpoints),
   and the group spacing drops by the same amount to absorb the trailing margin
   under the last row. All of it is behind @supports because the arithmetic only
   balances when subgrid actually applies — without it the rules would space the
   cards without aligning them, so a browser that lacks subgrid is better off
   keeping the plain stacked layout above. */
@supports (grid-template-rows:subgrid){
  .gal-group-grid{row-gap:6px}
  .gal-cat{display:grid;grid-row:span 4;grid-template-rows:subgrid;margin-bottom:16px}
  .gal-cat-cover{grid-row:1;margin-bottom:8px}
  /* display:contents lifts the three text nodes into the card's subgrid. Their
     rows are pinned explicitly because a category with no blurb renders no <em>
     at all, and auto-placement would pull its count into the blurb's track. */
  .gal-cat-body{display:contents}
  .gal-cat-body strong{grid-row:2;padding-inline:2px}
  .gal-cat-body em{grid-row:3;padding-inline:2px}
  .gal-cat-body span{grid-row:4;padding-inline:2px}
  .gal-group+.gal-group{margin-top:40px}
  @media(max-width:900px){
    .gal-cat{margin-bottom:12px}
    .gal-group+.gal-group{margin-top:44px}
  }
  @media(max-width:560px){
    .gal-group+.gal-group{margin-top:32px}
  }
}