/*
Theme Name: Sanctuary Dark
Theme URI: https://example.com/sanctuaries
Author: Built for Jacek Sułek
Description: A mood-book theme for a short film. Cream paper objects — taped stills, screenplay pages, polaroids — lit against a ground that runs from ink-and-milk navy to dark burgundy. Built from the SANCTUARIES pitch deck.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sanctuaries
Tags: one-page, film, dark-theme, custom-colors, custom-logo, portfolio
*/

/* ---------------------------------------------------------------
   1. TOKENS
   Palette lifted from the deck's own VISUAL LANGUAGE page:
   cold moonlight blue / amber tungsten / dashboard green / candlelight
----------------------------------------------------------------*/
:root{
  --paper:        #F0EADD;
  --paper-warm:   #F4EDDC;
  --paper-mid:    #ECE6D8;
  --paper-cool:   #E2E5E5;
  --paper-card:   #F6F1E6;
  --paper-edge:   #D9D0BC;

  --ink:          #16130E;
  --ink-2:        #443D32;
  --ink-3:        #6F6757;
  --ink-faint:    #9A9182;

  --ochre:        #C0975B;   /* the deck's hairline rules, lifted for dark */
  --moonlight:    #4C6880;   /* present day */
  --candle:       #DFC078;   /* memory */
  --dashboard:    #6C7345;
  --red-note:     #8B2E20;   /* the red margin scribbles */

  --tape:         rgba(219,205,175,.93);
  --tape-line:    rgba(150,133,101,.34);

  /* the dark ground: ink-and-milk navy at the top, burgundy at the foot */
  --field-top:    #1C2534;
  --field-mid:    #272337;
  --field-bottom: #3D1822;
  --field-ink:    #EDE5D8;
  --field-ink-2:  #BCB1A1;
  --field-ink-3:  #91887A;
  --rose:         #C97A68;

  --shadow-lift:  0 30px 52px -26px rgba(0,0,0,.78);
  --shadow-flat:  0 16px 30px -18px rgba(0,0,0,.68);

  --font-display: "Playfair Display", "Times New Roman", serif;
  --font-body:    "EB Garamond", Georgia, serif;
  --font-script:  "Courier Prime", "Courier New", monospace;
  --font-hand:    "Caveat", "Segoe Script", cursive;

  --wrap: 1140px;
  --gutter: clamp(1.15rem, 4vw, 2.6rem);
  --rule: 1px solid var(--ochre);
}

/* ---------------------------------------------------------------
   2. BASE
----------------------------------------------------------------*/
*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:clip; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  font-family:var(--font-body);
  font-size:clamp(1.02rem,.55vw + .92rem,1.16rem);
  line-height:1.62;
  color:var(--field-ink);
  /* ink-and-milk navy holds most of the page, then turns slowly to
     burgundy at the foot — moonlight giving way to the anomaly */
  background-color:var(--field-bottom);
  background-image:
    linear-gradient(180deg,
      var(--field-top) 0%,
      #1F2A3B 35%,
      var(--field-mid) 60%,
      #341C26 82%,
      var(--field-bottom) 100%);
  background-repeat:no-repeat;
  overflow-x:hidden;
}

/* paper grain over everything */
body::after{
  content:"";
  position:fixed; inset:0; z-index:9999;
  pointer-events:none;
  opacity:.30;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-underline-offset:.22em; text-decoration-thickness:1px; }
a:hover{ color:var(--rose); }

:focus-visible{
  outline:2px solid var(--rose);
  outline-offset:3px;
}

.wrap{ width:min(var(--wrap),100% - (var(--gutter) * 2)); margin-inline:auto; }
.wrap--narrow{ width:min(760px,100% - (var(--gutter) * 2)); margin-inline:auto; }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:10000;
  background:var(--field-ink); color:var(--field-top); padding:.7rem 1.1rem;
  font-family:var(--font-script); font-size:.8rem;
}
.skip-link:focus{ left:1rem; top:1rem; }

.screen-reader-text{
  position:absolute!important; width:1px; height:1px;
  overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap;
}

/* ---------------------------------------------------------------
   3. TYPE
----------------------------------------------------------------*/
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:900;
  line-height:.92;
  letter-spacing:-.012em;
  margin:0 0 .5em;
  text-transform:uppercase;
}
h1{ font-size:clamp(2.7rem,11vw,8.4rem); }
h2{ font-size:clamp(2.1rem,6vw,4rem); }
h3{ font-size:clamp(1.3rem,2.6vw,1.85rem); }
h4{ font-size:1.05rem; letter-spacing:.02em; }

p{ margin:0 0 1.05em; }
p:last-child{ margin-bottom:0; }

/* the compressed wood-type feel of the deck's headlines */
.compress{ display:inline-block; transform:scaleX(.93); transform-origin:center; }

.eyebrow{
  font-family:var(--font-body);
  font-size:.78rem; letter-spacing:.34em; text-transform:uppercase;
  color:var(--field-ink-3); margin:0 0 .9rem;
}

.hand{
  font-family:var(--font-hand);
  font-size:1.32rem; line-height:1.32;
  color:var(--field-ink-2); transform:rotate(-1.6deg);
}
.hand--red{ color:var(--rose); }

.typed{ font-family:var(--font-script); font-size:.98rem; line-height:1.72; }

.marker{
  background-image:linear-gradient(transparent 62%, rgba(176,136,80,.42) 62%);
  padding-bottom:.05em;
}

/* ---------------------------------------------------------------
   4. PAPER PARTS — tape, torn notes, photo frames, clips
----------------------------------------------------------------*/

/* torn-edge paper. The filter sits on a background layer only,
   so text stays crisp. */
.note{ position:relative; padding:1.65rem 1.75rem; color:var(--ink); }
.note::before{
  content:""; position:absolute; inset:-6px; z-index:-1;
  background:var(--paper-card);
  box-shadow:var(--shadow-flat);
  filter:url(#sanct-torn);
}
.note--plain::before{ filter:none; box-shadow:var(--shadow-flat); }
.note--ruled::before{
  background:
    repeating-linear-gradient(180deg, transparent 0 27px, rgba(76,104,128,.16) 27px 28px),
    var(--paper-card);
}
.note--grid::before{
  background:
    repeating-linear-gradient(90deg, transparent 0 18px, rgba(76,104,128,.12) 18px 19px),
    repeating-linear-gradient(180deg, transparent 0 18px, rgba(76,104,128,.12) 18px 19px),
    var(--paper-card);
}

/* masking tape */
.tape{
  position:absolute; z-index:3;
  width:104px; height:29px;
  background:
    linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,0) 30%),
    repeating-linear-gradient(90deg, var(--tape) 0 3px, rgba(203,188,156,.88) 3px 6px);
  border-left:1px dotted var(--tape-line);
  border-right:1px dotted var(--tape-line);
  opacity:.94;
  box-shadow:0 3px 7px -5px rgba(30,24,14,.8);
}
.tape--top{ top:-13px; left:50%; margin-left:-52px; transform:rotate(-1.6deg); }
.tape--tl{ top:-14px; left:8%; transform:rotate(-8deg); }
.tape--tr{ top:-14px; right:7%; transform:rotate(6deg); }
.tape--bl{ bottom:-13px; left:12%; transform:rotate(5deg); }

/* paperclip */
.clip{
  position:absolute; top:-22px; right:26px; z-index:4;
  width:26px; height:64px;
  transform:rotate(7deg);
  opacity:.75;
}

/* photo frames */
.photo{
  position:relative;
  background:var(--paper-card);
  color:var(--ink);
  padding:9px 9px 11px;
  box-shadow:var(--shadow-lift);
  transform:rotate(var(--rot,0deg));
  transition:transform .5s cubic-bezier(.2,.7,.2,1), box-shadow .5s;
}
.photo > img,
.photo > .photo__inner > img{ display:block; width:100%; }
.photo .frame{ width:100%; }
.photo:hover{ transform:rotate(0deg) translateY(-4px); box-shadow:0 30px 46px -28px rgba(28,22,12,.7); }

.photo--polaroid{ padding:11px 11px 1.4rem; }
.photo--polaroid .photo__caption{
  margin:1rem .4rem 0;
  text-align:center; font-family:var(--font-hand); font-size:1.18rem;
  line-height:1.2; min-height:2.4em; color:var(--ink-2); overflow-wrap:break-word;
}

/* the deck's little taped caption slips */
.slip{
  display:inline-block;
  position:relative;
  background:var(--paper-card);
  padding:.34rem .8rem;
  font-family:var(--font-script);
  font-size:.78rem; letter-spacing:.03em;
  color:var(--ink-2);
  box-shadow:var(--shadow-flat);
  transform:rotate(var(--rot,-1deg));
}

/* image placeholder frame — shown until a real still is uploaded */
.frame{
  position:relative;
  aspect-ratio:var(--ratio,16/9);
  background:
    repeating-linear-gradient(135deg, rgba(111,103,87,.035) 0 10px, transparent 10px 20px),
    #E9E3D6;
  border:1px dashed rgba(111,103,87,.42);
  display:grid; place-content:center; gap:.5rem; text-align:center;
  padding:1.2rem;
}
.frame::before,.frame::after{
  content:""; position:absolute; width:13px; height:13px;
  border:1px solid rgba(111,103,87,.5);
}
.frame::before{ top:7px; left:7px; border-right:0; border-bottom:0; }
.frame::after{ bottom:7px; right:7px; border-left:0; border-top:0; }
.frame__label{
  font-family:var(--font-script); font-size:.72rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--ink-3);
}
.frame__hint{ font-family:var(--font-body); font-size:.82rem; color:var(--ink-faint); font-style:italic; }

/* ---------------------------------------------------------------
   5. MASTHEAD
----------------------------------------------------------------*/
.masthead{
  position:sticky; top:0; z-index:60;
  background:rgba(28,37,52,.88);
  backdrop-filter:saturate(120%) blur(7px);
  border-bottom:var(--rule);
}
.admin-bar .masthead{ top:32px; }
@media (max-width:782px){ .admin-bar .masthead{ top:46px; } }

.masthead__inner{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.72rem 0;
}
.masthead__mark{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:1.02rem; letter-spacing:.06em; text-decoration:none;
}
.masthead__mark span{ display:inline-block; transform:scaleX(.9); }

.nav ul{ display:flex; gap:1.5rem; list-style:none; margin:0; padding:0; }
.nav a{
  font-family:var(--font-body); font-size:.8rem; letter-spacing:.2em;
  text-transform:uppercase; text-decoration:none; color:var(--field-ink-2);
  padding-bottom:2px; border-bottom:1px solid transparent;
}
.nav a:hover,.nav .current-menu-item > a{ color:var(--field-ink); border-bottom-color:var(--ochre); }

.nav-toggle{
  display:none; background:none; border:1px solid var(--ochre);
  font-family:var(--font-script); font-size:.74rem; letter-spacing:.16em;
  text-transform:uppercase; padding:.45rem .8rem; cursor:pointer; color:var(--field-ink);
}
@media (max-width:820px){
  .nav-toggle{ display:block; }
  .nav{
    position:absolute; left:0; right:0; top:100%;
    background:var(--field-top); border-bottom:var(--rule);
    display:none; padding:1rem var(--gutter) 1.4rem;
  }
  .nav[data-open="true"]{ display:block; }
  .nav ul{ flex-direction:column; gap:.9rem; }
}

/* ---------------------------------------------------------------
   6. SECTION FURNITURE
----------------------------------------------------------------*/
.section{ padding:clamp(4rem,8.5vw,7.5rem) 0; position:relative; scroll-margin-top:74px; }
.hero{ scroll-margin-top:74px; }
.section + .section{ border-top:1px solid rgba(176,136,80,.28); }

.section__head{ margin-bottom:clamp(2.2rem,4.5vw,3.4rem); }
.section__folio{
  display:flex; align-items:baseline; gap:.9rem;
  font-family:var(--font-script); font-size:.74rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--field-ink-3); margin-bottom:.7rem;
}
.section__folio::after{ content:""; flex:1; height:1px; background:rgba(176,136,80,.5); }
.section__title{ margin:0; }
.section__sub{
  font-style:italic; color:var(--field-ink-2); max-width:52ch; margin-top:.9rem;
}

/* ---------------------------------------------------------------
   7. HERO
----------------------------------------------------------------*/
.hero{
  position:relative; overflow:hidden;
  min-height:clamp(560px,92svh,980px);
  display:grid; place-items:center; text-align:center;
  padding:clamp(3rem,9vw,6rem) 0 clamp(2.5rem,6vw,4rem);
}
.hero__inner{ position:relative; z-index:2; width:min(900px,100% - (var(--gutter)*2)); }
.hero__title{ margin:0 0 .35em; }
.hero__sub{
  font-size:clamp(1.05rem,2vw,1.45rem); color:var(--field-ink-2); margin:0 0 .35em;
}
.hero__credit{ font-size:clamp(1rem,1.7vw,1.28rem); margin:0 0 2.4rem; }
.hero__meta{
  font-family:var(--font-script); font-size:.8rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--field-ink-3);
}
.hero__rule{
  width:210px; height:1px; background:var(--ochre); border:0; margin:1.8rem auto;
}
.hero__ghost{
  position:absolute; z-index:1; left:50%; top:56%;
  transform:translate(-50%,-50%);
  width:min(720px,86vw); opacity:.13; pointer-events:none;
  filter:grayscale(1);
}
.hero__hint{
  display:inline-block; margin-top:2.6rem;
  font-family:var(--font-script); font-size:.72rem; letter-spacing:.08em;
  color:var(--field-ink-3); border:1px dashed rgba(192,151,91,.6);
  padding:.5rem .9rem; max-width:46ch; line-height:1.5;
}
.hero__scroll{
  position:absolute; bottom:1.6rem; left:50%; transform:translateX(-50%);
  font-family:var(--font-hand); font-size:1.15rem; color:var(--field-ink-3);
  text-decoration:none; z-index:2;
}

/* ---------------------------------------------------------------
   8. LOGLINE
----------------------------------------------------------------*/
.logline{
  display:grid; gap:clamp(2rem,5vw,3.6rem);
  grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  align-items:start;
}
@media (max-width:880px){ .logline{ grid-template-columns:1fr; } }

.logline__text{
  font-family:var(--font-script);
  font-size:clamp(1.02rem,1.4vw,1.2rem); line-height:1.78;
}
.logline__note{ position:relative; }
.logline__aside{ margin-top:2rem; max-width:22ch; }

.checklist{
  list-style:none; margin:0; padding:0;
  font-family:var(--font-hand); font-size:1.3rem; line-height:1.85; color:var(--ink-2);
}
.checklist li::before{ content:"— "; color:var(--ochre); }
.checklist li:last-child{ text-decoration:underline; text-decoration-color:var(--red-note); }

.logline__list{ margin-top:2.6rem; max-width:15rem; transform:rotate(-1.1deg); }

.keywords{
  display:flex; flex-wrap:wrap; gap:.65rem; margin-top:2.4rem; padding:0; list-style:none;
}
.keywords li{ --rot:-1.2deg; }
.keywords li:nth-child(2n){ --rot:1.4deg; }
.keywords li:nth-child(3n){ --rot:-.6deg; }

.logline__stack{ display:grid; gap:1.9rem; }
.logline__stack .photo:nth-child(1){ --rot:-2.2deg; }
.logline__stack .photo:nth-child(2){ --rot:1.7deg; margin-left:clamp(0px,4vw,3rem); }

/* ---------------------------------------------------------------
   9. SCRIPT EXCERPTS
----------------------------------------------------------------*/
.excerpts{ display:grid; gap:clamp(1.8rem,4vw,2.8rem); }
@media (min-width:900px){ .excerpts{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

.excerpt{ position:relative; }
.excerpt__page{
  position:relative;
  background:var(--paper-card);
  padding:clamp(1.9rem,3.5vw,2.9rem) clamp(1.5rem,3vw,2.6rem);
  box-shadow:var(--shadow-lift);
  transform:rotate(var(--rot,0deg));
  font-family:var(--font-script);
  font-size:.95rem; line-height:1.68;
  color:var(--ink);
}
.excerpt:nth-child(2n) .excerpt__page{ --rot:.7deg; }
.excerpt:nth-child(2n+1) .excerpt__page{ --rot:-.8deg; }

/* punched holes down the left edge, like a bound script */
.excerpt__page::before{
  content:""; position:absolute; left:11px; top:14%; bottom:14%; width:9px;
  background:radial-gradient(circle at 50% 12%, rgba(0,0,0,.16) 0 4.5px, transparent 5px),
             radial-gradient(circle at 50% 50%, rgba(0,0,0,.16) 0 4.5px, transparent 5px),
             radial-gradient(circle at 50% 88%, rgba(0,0,0,.16) 0 4.5px, transparent 5px);
}
.excerpt__slug{
  font-family:var(--font-script);
  text-transform:uppercase; letter-spacing:.06em; font-weight:700;
  border-bottom:1px solid rgba(22,19,14,.35); padding-bottom:.35rem;
  margin:0 0 1.4rem; font-size:.86rem;
}
.excerpt__body{ margin:0; }
.excerpt__body .cue{
  display:block; text-transform:uppercase; letter-spacing:.08em;
  margin:1.15rem 0 .1rem; padding-left:34%;
}
.excerpt__body .cue:first-child{ margin-top:0; }
.excerpt__body .paren{
  display:block; padding-left:26%; font-style:italic; color:var(--ink-2); font-size:.9em;
}
.excerpt__body .line{ display:block; padding-left:18%; max-width:44ch; }
.excerpt__body .action{ display:block; margin:1.2rem 0 0; color:var(--ink-2); }
@media (max-width:600px){
  .excerpt__body .cue{ padding-left:22%; }
  .excerpt__body .paren{ padding-left:16%; }
  .excerpt__body .line{ padding-left:8%; }
}
.excerpt__foot{
  display:flex; justify-content:space-between; gap:1rem; align-items:baseline;
  margin-top:1.6rem; padding-top:.7rem;
  border-top:1px solid rgba(176,136,80,.45);
  font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3);
}

/* ---------------------------------------------------------------
   10. CHARACTERS
----------------------------------------------------------------*/
.characters{ display:grid; gap:clamp(2.4rem,5vw,3.8rem); }
.character{
  display:grid; gap:clamp(1.4rem,3vw,2.6rem); align-items:center;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
}
.character:nth-child(2n) .character__media{ order:2; }
@media (max-width:820px){
  .character{ grid-template-columns:1fr; }
  .character:nth-child(2n) .character__media{ order:0; }
}
.character__media .photo{ --rot:-1.8deg; }
.character:nth-child(2n) .character__media .photo{ --rot:2.1deg; }
.character__name{ margin:0 0 .55rem; }
.character__note{ margin-top:1.3rem; }

/* ---------------------------------------------------------------
   11. CAST
----------------------------------------------------------------*/
.cast{
  display:grid; gap:clamp(1.6rem,3.4vw,2.6rem);
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  list-style:none; margin:0; padding:0;
}
.cast .photo{ --rot:-1.6deg; }
.cast li:nth-child(2n) .photo{ --rot:1.9deg; }
.cast li:nth-child(3n) .photo{ --rot:-.7deg; }
.cast__role{
  margin:.9rem 0 .15rem; font-family:var(--font-script);
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--field-ink-3);
}
.cast__name{ margin-top:1rem; font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:1.12rem; letter-spacing:.01em; margin:0; line-height:1.05; }
.cast__bio{ font-size:.94rem; color:var(--field-ink-2); margin-top:.5rem; }

.crew-portraits{ margin-top:clamp(2.8rem,5vw,4.2rem); }
.crew-portraits .eyebrow{ margin-bottom:1.6rem; }
.crew-portraits .cast__name{ font-size:1.02rem; }

/* ---------------------------------------------------------------
   12. BTS PINBOARD
----------------------------------------------------------------*/
.pinboard{
  columns:3 260px; column-gap:clamp(1.2rem,2.6vw,2.2rem);
  margin:0; padding:0; list-style:none;
}
.pinboard > li{
  break-inside:avoid;
  margin:0 0 clamp(1.6rem,3vw,2.4rem);
}
.pinboard li:nth-child(4n+1) .photo{ --rot:-2.1deg; }
.pinboard li:nth-child(4n+2) .photo{ --rot:1.6deg; }
.pinboard li:nth-child(4n+3) .photo{ --rot:-1.1deg; }
.pinboard li:nth-child(4n+4) .photo{ --rot:2.4deg; }
.pinboard .photo{ width:100%; padding:0; background:none; box-shadow:none; }
.pinboard .photo__inner{
  background:var(--paper-card); padding:9px 9px 11px; display:block;
  box-shadow:var(--shadow-lift);
}
.pinboard button.photo{ border:0; cursor:zoom-in; font:inherit; color:inherit; text-align:left; }
.pinboard .photo__caption{
  display:block; margin-top:.6rem; font-family:var(--font-hand);
  font-size:1.18rem; color:var(--field-ink-2);
}

@media (max-width:620px){
  .pinboard li:nth-child(4n+1) .photo,
  .pinboard li:nth-child(4n+2) .photo,
  .pinboard li:nth-child(4n+3) .photo,
  .pinboard li:nth-child(4n+4) .photo{ --rot:0deg; }
}

/* lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200; display:none;
  align-items:center; justify-content:center; padding:clamp(1rem,4vw,3rem);
  background:rgba(18,15,10,.9);
}
.lightbox[data-open="true"]{ display:flex; }
.lightbox figure{ margin:0; max-width:min(1100px,100%); }
.lightbox img{ max-height:78svh; width:auto; margin-inline:auto; background:var(--paper-card); padding:10px; }
.lightbox figcaption{
  color:var(--paper); font-family:var(--font-script); font-size:.84rem;
  letter-spacing:.1em; text-align:center; margin-top:1rem;
}
.lightbox__close{
  position:absolute; top:1.1rem; right:1.2rem;
  background:none; border:1px solid rgba(240,234,221,.5); color:var(--paper);
  font-family:var(--font-script); font-size:.78rem; letter-spacing:.16em;
  padding:.5rem .85rem; cursor:pointer;
}

/* ---------------------------------------------------------------
   13. CREW — call sheet
----------------------------------------------------------------*/
.crew{ list-style:none; margin:0; padding:0; max-width:840px; }
.crew li{
  display:flex; align-items:baseline; gap:.65rem;
  padding:.62rem 0; border-bottom:1px dotted rgba(237,229,216,.22);
  font-family:var(--font-script); font-size:.94rem;
}
.crew__role{
  text-transform:uppercase; letter-spacing:.13em; font-size:.76rem; color:var(--field-ink-3);
  flex:0 0 auto;
}
.crew__dots{ flex:1; border-bottom:1px dotted rgba(237,229,216,.3); transform:translateY(-.28em); }
.crew__name{ flex:0 0 auto; font-family:var(--font-body); font-size:1.05rem; }

/* ---------------------------------------------------------------
   14. CONTACT + FOOTER
----------------------------------------------------------------*/
.contact{ display:grid; gap:clamp(1.8rem,4vw,3rem); grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
@media (max-width:760px){ .contact{ grid-template-columns:1fr; } }
.contact__line{ font-family:var(--font-script); font-size:.98rem; margin:0 0 .5rem; }
.contact__line a{ text-decoration-color:var(--ochre); }

.site-footer{
  border-top:var(--rule);
  padding:2.6rem 0 3.4rem;
  text-align:center;
  color:var(--field-ink-3);
}
.site-footer__title{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  letter-spacing:.24em; font-size:.94rem; color:var(--field-ink-2); margin:0 0 .6rem;
}
.site-footer__meta{ font-family:var(--font-script); font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; }

/* ---------------------------------------------------------------
   15. INTERIOR PAGES / POSTS
----------------------------------------------------------------*/
.entry{ padding:clamp(3rem,7vw,5.5rem) 0; }
.entry__title{ margin-bottom:1.2rem; }
.entry__meta{ font-family:var(--font-script); font-size:.76rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--field-ink-3); margin-bottom:2rem; }
.entry__content{ max-width:68ch; }
.entry__content h2,.entry__content h3{ margin-top:2em; }
.entry__content blockquote{
  margin:2rem 0; padding-left:1.4rem; border-left:2px solid var(--ochre);
  font-style:italic; color:var(--field-ink-2);
}
.entry__content img{ margin:2rem 0; box-shadow:var(--shadow-lift); }
.entry__content ul,.entry__content ol{ padding-left:1.3rem; }

.pagination{ display:flex; gap:1.2rem; justify-content:space-between; margin-top:3rem;
  font-family:var(--font-script); font-size:.8rem; letter-spacing:.12em; text-transform:uppercase; }

.button{
  display:inline-block; text-decoration:none;
  font-family:var(--font-script); font-size:.78rem; letter-spacing:.18em; text-transform:uppercase;
  padding:.75rem 1.4rem; border:1px solid var(--field-ink);
  background:transparent; color:var(--field-ink); cursor:pointer;
  transition:background .35s, color .35s;
}
.button:hover{ background:var(--field-ink); color:var(--field-top); }

/* ---------------------------------------------------------------
   16. REVEAL
----------------------------------------------------------------*/
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.is-in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .photo{ transition:none; }
  .photo:hover{ transform:rotate(var(--rot,0deg)); }
}

/* editor-supplied WP classes */
.alignleft{ float:left; margin:0 1.6rem 1.2rem 0; }
.alignright{ float:right; margin:0 0 1.2rem 1.6rem; }
.aligncenter{ margin-inline:auto; }
.wp-caption-text{ font-family:var(--font-hand); font-size:1.1rem; color:var(--field-ink-2); }

@media print{
  .masthead,.hero__scroll,.lightbox{ display:none!important; }
  body::after{ display:none; }
  body{ background:#fff; color:#111; }
}
