/* ============================================================
   FANOUS V2 — fanous.css  (WordPress build)
   One stylesheet for the whole site. Mirrors Website-HTML-V2/
   assets/css/v2.css, adapted to Gutenberg block markup.

   CLIENT-FACING CLASSES (add in "Additional CSS class(es)"):
     has-parallax    → Cover background drifts on scroll
     lantern-reveal  → hero effect: cursor = lantern, clears the shade
     glow-zone       → ambient warm cursor glow (dark sections)
     ignite          → element lights up when scrolled into view
     fns-btn         → wick button (Button block) · variants: quiet, on-light
   ============================================================ */


/* ══════════════════ 1. TOKENS & RESET ══════════════════ */
:root {
  --ink:      #070606;
  --charcoal: #151211;
  --coal-2:   #1E1917;
  --paper:    #FFFFFF;
  --sand:     #FAF8F5;
  --stone:    #EDE7DD;
  --clay:     #B9AC99;
  --red:      #E11B22;
  --red-deep: #B3151B;

  --lantern:      #F5A83C;
  --lantern-deep: #D97E24;
  --lantern-dim:  rgba(245,168,60,.14);
  --flame: linear-gradient(115deg, #E11B22 0%, #F5A83C 90%);

  --display: "Playfair Display", Georgia, serif;
  --serif:   "Source Serif 4", Georgia, serif;
  --ui:      "Inter", system-ui, sans-serif;
  --arabic:  "Amiri", "Playfair Display", serif;

  --maxw:   1240px;
  --radius: 4px;
}

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html  { scroll-behavior: smooth; }
body  { font-family: var(--serif); background: var(--sand); color: var(--ink);
        line-height: 1.65; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a     { color: inherit; text-decoration: none; }
img, video { max-width: 100%; display: block; }
h1, h2, h3 { font-family: var(--display); font-weight: 500;
             line-height: 1.08; letter-spacing: -.01em; }
button { font: inherit; cursor: pointer; }


/* ══════════════════ 2. PRIMITIVES ══════════════════ */
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 32px; }
.wp-block-columns.wrap, .wp-block-group.wrap { max-width: var(--maxw); padding-left: 32px; padding-right: 32px; }

.eyebrow { font-family: var(--ui); font-size: .72rem; letter-spacing: .24em;
           text-transform: uppercase; color: var(--clay); font-weight: 600;
           display: inline-flex; align-items: center; gap: .7em; }
.eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%;
                   background: var(--lantern); flex-shrink: 0;
                   box-shadow: 0 0 0 0 rgba(245,168,60,.7);
                   animation: lantern-pulse 2.4s ease-in-out infinite; }
.eyebrow.red::before { background: var(--red); }
.eyebrow.centered { justify-content: center; width: 100%; }

.sec { padding: 130px 0; position: relative; }
.sec-head    { max-width: 760px; margin-bottom: 64px; }
.sec-head h2, .sec-head .wp-block-heading { font-size: clamp(2.1rem, 3.8vw, 3.2rem); margin: 18px 0 0; }
.sec-head h2 em, h2 em, .page-cta h2 em { font-style: italic; background: var(--flame);
                  -webkit-background-clip: text; background-clip: text; color: transparent; }

/* section divider — a thin "wick" of light */
.light-line { width: 1px; height: 90px; margin: 0 auto; position: relative;
              background: linear-gradient(var(--stone), transparent); }
.dark .light-line, .light-line.on-dark { background: linear-gradient(rgba(245,168,60,.5), transparent); }
.light-line::after { content: ""; position: absolute; top: 0; left: 50%;
                     width: 5px; height: 5px; border-radius: 50%;
                     transform: translateX(-50%); background: var(--lantern);
                     box-shadow: 0 0 12px 2px rgba(245,168,60,.55);
                     animation: wick-travel 3.2s ease-in-out infinite; }


/* ══════════════════ 3. BUTTONS — "lighting the wick" ══════════════════
   Plain markup: <a class="btn">   ·   Block editor: Button block with
   class "fns-btn" (variants: "fns-btn quiet", "fns-btn on-light"). */
.btn,
.fns-btn .wp-block-button__link {
       font-family: var(--ui); font-size: .78rem; font-weight: 600;
       letter-spacing: .16em; text-transform: uppercase;
       padding: 18px 34px 18px 54px; position: relative; isolation: isolate;
       display: inline-flex; align-items: center; gap: .7em;
       color: #fff; border: 1px solid rgba(255,255,255,.28);
       background: transparent; border-radius: 0;
       overflow: hidden; cursor: pointer; text-decoration: none;
       transition: border-color .5s, letter-spacing .5s, color .5s; }
.btn::before,
.fns-btn .wp-block-button__link::before {
       content: ""; position: absolute; left: 27px; top: 50%;
       width: 6px; height: 6px; margin-top: -3px; border-radius: 50%;
       background: var(--lantern); opacity: .55;
       transition: opacity .4s, box-shadow .5s; }
.btn::after,
.fns-btn .wp-block-button__link::after {
       content: ""; position: absolute; z-index: -1; left: 30px; top: 50%;
       width: 0; height: 0; border-radius: 50%;
       transform: translate(-50%,-50%);
       background: radial-gradient(circle,
         rgba(245,168,60,.38), rgba(225,27,34,.14) 45%, transparent 72%);
       transition: width .65s ease, height .65s ease; }
.btn:hover,
.fns-btn .wp-block-button__link:hover { border-color: rgba(245,168,60,.75);
       letter-spacing: .22em; color: #fff; }
.btn:hover::before,
.fns-btn .wp-block-button__link:hover::before { opacity: 1;
       box-shadow: 0 0 16px 4px rgba(245,168,60,.85); }
.btn:hover::after,
.fns-btn .wp-block-button__link:hover::after { width: 380px; height: 380px; }

/* quiet secondary — no wick */
.btn.no-dot,
.fns-btn.quiet .wp-block-button__link { padding-left: 34px; border-color: rgba(255,255,255,.14); }
.btn.no-dot::before, .btn.no-dot::after,
.fns-btn.quiet .wp-block-button__link::before,
.fns-btn.quiet .wp-block-button__link::after { display: none; }
.btn.no-dot:hover,
.fns-btn.quiet .wp-block-button__link:hover { border-color: rgba(245,168,60,.5); color: var(--lantern); }

/* on light backgrounds */
.btn-light, .fns-btn.on-light .wp-block-button__link { color: var(--ink); border-color: rgba(10,10,10,.35); }
.btn-light:hover, .fns-btn.on-light .wp-block-button__link:hover { color: var(--ink); }

.arrow { transition: transform .4s; }
.btn:hover .arrow { transform: translateX(5px); }


/* ══════════════════ 4. FANOUS EFFECTS ══════════════════ */

/* 4a · ambient lantern glow follows the cursor (glow-zone / data-glow) */
#lantern-glow { position: fixed; top: 0; left: 0; width: 560px; height: 560px;
                border-radius: 50%; pointer-events: none; z-index: 4;
                mix-blend-mode: screen;
                background: radial-gradient(circle,
                  rgba(245,168,60,.16) 0%, rgba(225,27,34,.06) 42%, transparent 68%);
                opacity: 0; transition: opacity .7s ease;
                animation: flicker 4s infinite; }
body.glow-on #lantern-glow { opacity: 1; }
@media (hover: none) { #lantern-glow { display: none; } }

/* 4b · ignite on scroll */
.ignite { opacity: 0; transform: translateY(34px); filter: brightness(.55);
          transition: opacity 1s ease, transform 1s ease, filter 1.4s ease; }
.ignite.lit { opacity: 1; transform: none; filter: brightness(1); }
.ignite.d2 { transition-delay: .15s; }
.ignite.d3 { transition-delay: .3s; }

/* 4c · parallax — add "has-parallax" to any Cover block */
.has-parallax { position: relative; overflow: hidden; }
.has-parallax .bg-media,
.has-parallax .wp-block-cover__image-background,
.has-parallax .wp-block-cover__video-background {
  position: absolute; inset: -12% 0 !important; width: 100%; height: 124% !important;
  object-fit: cover; will-change: transform; max-width: none; }

/* 4d · فانوس living calligraphy */
.fns-word { font-family: var(--arabic); font-weight: 700; line-height: .9;
            pointer-events: none; user-select: none;
            background: linear-gradient(160deg,
              rgba(245,168,60,.55), rgba(225,27,34,.25) 55%, rgba(245,168,60,.08));
            -webkit-background-clip: text; background-clip: text; color: transparent;
            filter: drop-shadow(0 0 34px rgba(245,168,60,.22));
            animation: flicker 5.5s infinite; }

/* 4e · mashrabiya star pattern layer */
.pattern-layer { position: absolute; inset: -60px; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23F5A83C' stroke-width='1'%3E%3Cpath d='M48 8 58 38 88 48 58 58 48 88 38 58 8 48 38 38Z'/%3E%3Ccircle cx='48' cy='48' r='10'/%3E%3C/g%3E%3C/svg%3E");
  animation: drift 60s linear infinite; }

/* 4f · film grain */
.grain::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
  mix-blend-mode: screen; }

/* 4g · LANTERN REVEAL — add "lantern-reveal" to a Cover block.
   JS injects .lr-glow + .lr-shade layers and drives --lr-x/y/r.
   Layer order: image(0) → glow(1) → shade(2) → WP overlay as veil(3)
   → inner content(4). */
.lantern-reveal { position: relative; overflow: hidden; background: var(--ink); }
.lantern-reveal > .bg-media { position: absolute; inset: 0; width: 100%; height: 100%;
                              object-fit: cover; z-index: 0; }
.lantern-reveal .wp-block-cover__image-background,
.lantern-reveal .wp-block-cover__video-background { opacity: 1 !important;
                              filter: grayscale(.15) contrast(1.05); z-index: 0; }
.lantern-reveal.has-parallax .wp-block-cover__image-background,
.lantern-reveal.has-parallax .wp-block-cover__video-background { z-index: 0; }
.lr-shade { position: absolute; inset: -12% 0; z-index: 2; pointer-events: none;
  background: rgba(7,6,6,.88);
  -webkit-mask-image: radial-gradient(circle var(--lr-r,0px) at var(--lr-x,50%) var(--lr-y,50%),
      transparent 0, rgba(0,0,0,.4) 55%, #000 82%);
          mask-image: radial-gradient(circle var(--lr-r,0px) at var(--lr-x,50%) var(--lr-y,50%),
      transparent 0, rgba(0,0,0,.4) 55%, #000 82%); }
.lr-glow { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  mix-blend-mode: screen; opacity: .9;
  background: radial-gradient(circle calc(var(--lr-r,0px) * 1.25) at var(--lr-x,50%) var(--lr-y,50%),
      rgba(245,168,60,.2), rgba(225,27,34,.06) 55%, transparent 75%); }
/* the Cover's own overlay becomes the text-legibility veil, above the shade */
.lantern-reveal .wp-block-cover__background { z-index: 3 !important;
  background: linear-gradient(0deg, rgba(7,6,6,.94), rgba(7,6,6,.2) 55%, rgba(7,6,6,.4)) !important;
  opacity: 1 !important; }
.hero.lantern-reveal .wp-block-cover__background {
  background: linear-gradient(90deg, rgba(7,6,6,.9) 16%, rgba(7,6,6,.25) 52%, transparent 78%),
              linear-gradient(0deg, rgba(7,6,6,.85), transparent 30%) !important; }
.lantern-reveal .wp-block-cover__inner-container { position: static; z-index: 4; }
/* touch / reduced-motion fallback */
.lantern-reveal.lr-static .lr-shade { background: rgba(7,6,6,.55);
  -webkit-mask-image: none; mask-image: none; }
.lantern-reveal.lr-static .lr-glow { display: none; }

/* keyframes */
@keyframes lantern-pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(245,168,60,.7); }
  50%     { box-shadow: 0 0 0 9px rgba(245,168,60,0); } }
@keyframes flicker {
  0%,100% { opacity: 1; } 88% { opacity: 1; } 90% { opacity: .82; }
  92% { opacity: .95; } 94% { opacity: .78; } 96% { opacity: .92; } }
@keyframes wick-travel {
  0%,100% { top: 4px; opacity: 1; } 50% { top: 72px; opacity: .35; } }
@keyframes drift { to { background-position: 96px 96px; } }
@keyframes rise { to { opacity: 1; transform: none; } }
@keyframes cue { 0%,100% { transform: scaleX(.4); opacity: .4; }
                 50% { transform: scaleX(1); opacity: 1; } }
@keyframes lantern-ring { 0% { transform: scale(.8); opacity: 1; }
                          100% { transform: scale(1.35); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  .fns-word, #lantern-glow, .light-line::after, .eyebrow::before { animation: none !important; }
  .ignite { opacity: 1; transform: none; filter: none; transition: none; }
}


/* ══════════════════ 5. FIXED HEADER (fns-header part) ══════════════════ */
header.wp-block-template-part { display: contents; }

.fns-header { position: fixed; top: 0; left: 0; right: 0; width: 100%;
              z-index: 9999; background: transparent;
              transition: background .35s ease, box-shadow .35s ease, transform .35s ease;
              transform: translateY(0); }
.fns-header .header-row { display: flex; align-items: center;
              justify-content: space-between; gap: 24px;
              padding-top: 14px; padding-bottom: 14px; }
/* .fns-header .fns-logo img { height: 44px; width: auto; } */
.fns-header .fns-logo figure { margin: 0; }
.fns-header.solid .header-row { padding-top: 10px; padding-bottom: 10px; }
.fns-header.solid { background: rgba(250,248,245,.97); backdrop-filter: blur(12px);
                    box-shadow: 0 2px 10px rgba(0,0,0,.08); }
.fns-header.hide { transform: translateY(-100%); }

.fns-header .wp-block-navigation .wp-block-navigation-item__content {
  color: #fff; transition: color .35s ease; position: relative;
  font-family: var(--ui); font-size: .85rem; font-weight: 500; }
.fns-header.solid .wp-block-navigation .wp-block-navigation-item__content { color: var(--ink); }
.fns-header .wp-block-navigation .wp-block-navigation-item__content::after {
  content: ""; position: absolute; left: 0; bottom: -3px; height: 2px; width: 0;
  background: var(--flame); transition: width .3s; border-radius: 2px; }
.fns-header .wp-block-navigation .wp-block-navigation-item__content:hover::after,
.fns-header .wp-block-navigation .current-menu-item .wp-block-navigation-item__content::after { width: 100%; }
.fns-header .wp-block-navigation .current-menu-item .wp-block-navigation-item__content { color: var(--lantern); }
.fns-header.solid .wp-block-navigation .current-menu-item .wp-block-navigation-item__content { color: var(--red); }

/* mobile: WP navigation overlay, tinted ink with فانوس ghost */
.fns-header .wp-block-navigation__responsive-container.is-menu-open {
  background: var(--ink); }
.fns-header .wp-block-navigation__responsive-container.is-menu-open
  .wp-block-navigation-item__content { color: #fff !important; font-size: 1.4rem; }
.fns-header .wp-block-navigation__responsive-container.is-menu-open::after {
  content: "فانوس"; position: fixed; bottom: -40px; right: -10px;
  font-family: var(--arabic); font-size: 9rem; font-weight: 700; color: transparent;
  -webkit-text-stroke: 1px rgba(245,168,60,.25); pointer-events: none; }
.fns-header .wp-block-navigation__responsive-container-open,
.fns-header .wp-block-navigation__responsive-container-close { color: #fff; }
.fns-header.solid .wp-block-navigation__responsive-container-open { color: var(--ink); }


/* ══════════════════ 6. HOME HERO ══════════════════ */
.hero { min-height: 100vh; position: relative; overflow: hidden;
        background: var(--ink); color: var(--paper);
        display: flex; align-items: center; }
.wp-block-cover.hero { display: flex; align-items: center; padding: 0; }
.hero .wp-block-cover__inner-container,
.page-hero .wp-block-cover__inner-container { max-width: none; width: 100%; }

.hero .wrap { position: relative; z-index: 4; width: 100%; padding-top: 90px; }
.hero-kicker { font-family: var(--ui); font-size: .72rem; letter-spacing: .3em;
               text-transform: uppercase; color: var(--lantern);
               display: inline-flex; align-items: center; gap: 12px;
               opacity: 0; animation: rise .9s .15s ease forwards; transform: translateY(20px); }
.hero-kicker::before, .hero-kicker::after { content: ""; height: 1px; width: 44px;
               background: linear-gradient(90deg, transparent, var(--lantern)); }
.hero-kicker::after { background: linear-gradient(90deg, var(--lantern), transparent); }
.hero h1, .hero .wp-block-heading { font-family: var(--display); color: #fff;
           font-size: clamp(2.8rem, 6vw, 5.2rem); line-height: 1.08; margin: 26px 0;
           max-width: 15ch; opacity: 0; transform: translateY(24px);
           animation: rise .9s .35s ease forwards; }
.hero h1 em { font-style: italic; background: var(--flame);
              -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero p:not(.hero-kicker) { font-size: 1.16rem; max-width: 34ch; color: rgba(255,255,255,.75);
          margin-bottom: 40px; opacity: 0; transform: translateY(24px);
          animation: rise .9s .5s ease forwards; }
.hero-cta { display: flex; gap: 18px; flex-wrap: wrap; opacity: 0;
            transform: translateY(24px); animation: rise .9s .65s ease forwards; }

.hero-slate { position: absolute; bottom: 0; left: 0; right: 0; z-index: 4;
              border-top: 1px solid rgba(255,255,255,.14); }
.hero-slate .wrap { display: flex; justify-content: space-between; align-items: center;
                    padding-top: 18px; padding-bottom: 18px; gap: 24px; }
.hero-slate span { font-family: var(--ui); font-size: .68rem; letter-spacing: .2em;
                   text-transform: uppercase; color: rgba(255,255,255,.55); }
.hero-slate .scroll-cue { display: inline-flex; align-items: center; gap: 10px; color: var(--lantern); }
.hero-slate .scroll-cue i { width: 26px; height: 1px; background: var(--lantern);
                            animation: cue 1.8s ease-in-out infinite; }

@media (max-width: 920px) {
  .hero h1, .hero .wp-block-heading { font-size: clamp(2.4rem, 9vw, 3.2rem); }
  .hero-slate span:nth-child(2) { display: none; }
}


/* ══════════════════ 7. STATEMENT INTRO ══════════════════ */
.statement-intro { text-align: center; max-width: 900px; margin: 0 auto; }
.statement-intro .eyebrow { justify-content: center; }
.statement-intro h2, .statement-intro .wp-block-heading {
                      font-size: clamp(2.1rem, 4.4vw, 3.6rem); line-height: 1.15;
                      margin: 26px auto; max-width: 26ch; }
.statement-intro p:not(.eyebrow) { color: #4a4742; font-size: 1.12rem; max-width: 62ch; margin: 0 auto; }


/* ══════════════════ 8. FEATURED FILM (home) ══════════════════ */
.feat-film { background: var(--ink); color: #fff; }
.ff-media { border-radius: 6px; aspect-ratio: 16/8.5;
            position: relative; overflow: hidden; min-height: 0 !important; }
.ff-media .bg-media,
.ff-media .wp-block-cover__image-background { filter: brightness(.82); }
.ff-media .wp-block-cover__inner-container { position: absolute; inset: 0; z-index: 3; }
.ff-info { position: absolute; left: 0; right: 0; bottom: 0; z-index: 3;
           padding: 46px 46px 40px;
           background: linear-gradient(0deg, rgba(7,6,6,.94) 20%, transparent);
           display: flex; justify-content: space-between;
           align-items: flex-end; gap: 28px; flex-wrap: wrap; }
.ff-info h3, .ff-info .wp-block-heading { font-size: clamp(1.8rem, 3.4vw, 3rem);
           margin: 14px 0 8px; color: #fff; }
.ff-info .logline { font-family: var(--display); font-style: italic;
                    color: rgba(255,255,255,.8); max-width: 46ch;
                    font-size: clamp(1rem, 1.6vw, 1.2rem); }
@media (max-width: 920px) {
  .ff-media { aspect-ratio: 4/5; }
  .ff-info { padding: 26px 22px 24px; }
}


/* ══════════════════ 9. SHOWREEL (scroll-driven) ══════════════════ */
.reel-scroll { height: 260vh; position: relative; background: var(--ink); color: #fff; }
.reel-stick { position: sticky; top: 0; height: 100vh; overflow: hidden;
              display: flex; flex-direction: column;
              align-items: center; justify-content: center; gap: 26px; }
.reel-stage { width: min(1500px, 94vw); transform: scale(var(--reel-s, 1));
              will-change: transform; }
.reel-cap { font-family: var(--ui); font-size: .7rem; letter-spacing: .26em;
            text-transform: uppercase; color: rgba(255,255,255,.55);
            opacity: calc(1.4 - var(--reel-p, 0) * 2); }
@media (max-width: 920px) { .reel-scroll { height: 190vh; } }

.reel-frame { position: relative; aspect-ratio: 21/9; overflow: hidden;
              border-radius: 6px; background: #000; cursor: pointer;
              box-shadow: 0 40px 120px rgba(0,0,0,.55); }
.reel-frame video, .reel-frame img { position: absolute; inset: 0; width: 100%;
              height: 100%; object-fit: cover; }
.reel-frame video { filter: brightness(.8); transition: filter .5s; }
.reel-frame:hover video { filter: brightness(.95); }
.reel-frame .reel-ui { position: absolute; inset: 0; z-index: 2; display: flex;
              align-items: center; justify-content: center; flex-direction: column; gap: 18px;
              background: rgba(7,6,6,.25); transition: .45s; }
.reel-frame.playing .reel-ui { opacity: 0; pointer-events: none; }
.playbtn { width: 92px; height: 92px; border-radius: 50%; position: relative;
           display: flex; align-items: center; justify-content: center;
           background: rgba(245,168,60,.14); border: 1px solid rgba(245,168,60,.6);
           color: var(--lantern); font-size: 1.4rem; padding-left: 5px; transition: .35s; }
.playbtn::before { content: ""; position: absolute; inset: -14px; border-radius: 50%;
           border: 1px solid rgba(245,168,60,.28); animation: lantern-ring 2.6s ease-out infinite; }
.reel-frame:hover .playbtn { background: var(--flame); color: #fff; border-color: transparent;
                             box-shadow: 0 0 60px rgba(245,168,60,.5); }
.reel-ui .lbl { font-family: var(--ui); font-size: .72rem; letter-spacing: .3em;
                text-transform: uppercase; color: rgba(255,255,255,.85); }
@media (max-width: 920px) { .reel-frame { aspect-ratio: 16/9; }
                            .playbtn { width: 68px; height: 68px; } }


/* ══════════════════ 10. FILMS (Query Loop) ══════════════════ */
.prod-band { background: var(--charcoal); color: #fff; position: relative; }
.prod-band .sec-head h2, .prod-band .wp-block-heading { color: #fff; }
.prod-band .eyebrow { color: rgba(255,255,255,.6); }

.film-grid .wp-block-post-template,
ul.film-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px;
               list-style: none; padding: 0; margin: 0; }
.film-grid .wp-block-post { margin: 0; }
div.film-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; }
.film-grid.wp-block-query { display: block; }

.film-v2 { position: relative; border-radius: 6px; overflow: hidden;
           background: var(--coal-2); border: 1px solid rgba(255,255,255,.08);
           transition: .5s ease; display: flex; flex-direction: column; height: 100%; }
.film-v2:hover { transform: translateY(-8px); border-color: rgba(245,168,60,.45);
                 box-shadow: 0 30px 80px rgba(0,0,0,.5), 0 0 70px rgba(245,168,60,.12); }

.film-media, .film-v2 .wp-block-post-featured-image {
           aspect-ratio: 16/9; position: relative; overflow: hidden;
           background: #000; margin: 0; }
.film-media img, .film-v2 .wp-block-post-featured-image img {
           width: 100%; height: 100%; object-fit: cover;
           filter: brightness(.72); transition: .8s; }
.film-media video { position: absolute; inset: 0; width: 100%; height: 100%;
                    object-fit: cover; opacity: 0; transition: opacity .6s; }
.film-v2:hover .film-media video.ready { opacity: 1; }
.film-v2:hover .film-media img,
.film-v2:hover .wp-block-post-featured-image img { transform: scale(1.05); filter: brightness(.85); }
.film-media .mini-play { position: absolute; right: 16px; bottom: 16px; z-index: 2;
                    width: 44px; height: 44px; border-radius: 50%; display: flex;
                    align-items: center; justify-content: center; font-size: .8rem;
                    color: #fff; background: rgba(7,6,6,.55); border: 1px solid rgba(255,255,255,.3);
                    backdrop-filter: blur(6px); transition: .35s; padding-left: 3px; }
.film-v2:hover .mini-play { background: var(--flame); border-color: transparent; }

.film-body { padding: 28px 30px 32px; flex: 1; }

/* status chip — plain markup (.status) or Query Loop (post-terms).
   JS adds .kindling to the card when the term looks like "in development". */
.status,
.film-v2 .wp-block-post-terms {
          font-family: var(--ui); font-size: .64rem; letter-spacing: .16em;
          text-transform: uppercase; font-weight: 600; padding: 6px 12px;
          border-radius: 2px; display: inline-flex; align-items: center; gap: 8px;
          margin-bottom: 16px;
          background: var(--lantern-dim); color: var(--lantern);
          border: 1px solid rgba(245,168,60,.3); }
.status::before,
.film-v2 .wp-block-post-terms::before {
          content: ""; width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0;
          background: var(--lantern);
          box-shadow: 0 0 0 0 rgba(245,168,60,.7);
          animation: lantern-pulse 2.2s ease-in-out infinite; }
.film-v2 .wp-block-post-terms a { color: inherit; }
.status.kindling,
.film-v2.kindling .wp-block-post-terms {
          background: rgba(255,255,255,.06); color: rgba(255,255,255,.6);
          border: 1px solid rgba(255,255,255,.12); }
.status.kindling::before,
.film-v2.kindling .wp-block-post-terms::before {
          background: rgba(255,255,255,.4); box-shadow: none;
          animation: flicker 3s infinite; }
.status.lit { background: var(--lantern-dim); color: var(--lantern);
          border: 1px solid rgba(245,168,60,.3); }

.film-v2 h3, .film-v2 .wp-block-post-title { font-size: 1.6rem; color: #fff;
          margin-bottom: 10px; font-family: var(--display); line-height: 1.15; }
.film-v2 .wp-block-post-title a { color: #fff; }
.film-v2 .wp-block-post-title a:hover { color: var(--lantern); }
.film-v2 .film-body p,
.film-v2 .wp-block-post-excerpt__excerpt { color: rgba(255,255,255,.62); font-size: .98rem; }
.film-v2 .wp-block-post-excerpt__more-link { display: none; }
.film-v2 .film-year,
.film-v2 .wp-block-post-date { font-family: var(--ui); font-size: .72rem; letter-spacing: .14em;
          color: var(--clay); display: block; margin-top: 18px; text-transform: uppercase; }

@media (max-width: 920px) {
  .film-grid .wp-block-post-template, ul.film-grid, div.film-grid {
    grid-template-columns: 1fr; gap: 26px; } }


/* ══════════════════ 11. ARTICLES (Query Loop) ══════════════════ */
.articles-grid .wp-block-post-template,
div.articles-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 26px;
                    list-style: none; padding: 0; margin: 0; }
.articles-grid.wp-block-query { display: block; }
.articles-grid .wp-block-post { margin: 0; }

.acard { background: var(--paper); border: 1px solid var(--stone); border-radius: 6px;
         overflow: hidden; display: flex; flex-direction: column; transition: .4s; height: 100%; }
.acard:hover { transform: translateY(-6px); border-color: var(--clay);
               box-shadow: 0 26px 60px rgba(28,26,25,.1); }
.athumb, .acard .wp-block-post-featured-image { aspect-ratio: 3/2; overflow: hidden;
         position: relative; margin: 0; }
.athumb img, .acard .wp-block-post-featured-image img {
         width: 100%; height: 100%; object-fit: cover; transition: .6s; }
.acard:hover .athumb img,
.acard:hover .wp-block-post-featured-image img { transform: scale(1.06); }
.athumb .cat,
.athumb .wp-block-post-terms { position: absolute; top: 14px; left: 14px; z-index: 2;
               font-family: var(--ui); font-size: .62rem; letter-spacing: .16em;
               text-transform: uppercase; font-weight: 600; color: #fff;
               background: rgba(7,6,6,.65); backdrop-filter: blur(6px);
               padding: 6px 12px; border-radius: 2px; border-left: 2px solid var(--lantern); }
.athumb .wp-block-post-terms a { color: #fff; }
.acard-body { padding: 26px 28px 30px; display: flex; flex-direction: column; flex: 1; }
.acard .meta, .acard-body .wp-block-post-date {
               font-family: var(--ui); font-size: .68rem; letter-spacing: .1em;
               text-transform: uppercase; color: var(--clay); font-weight: 600;
               display: flex; gap: 14px; margin-bottom: 14px; }
.acard h3, .acard .wp-block-post-title { font-size: 1.32rem; transition: .3s; flex: 1;
               font-family: var(--display); line-height: 1.2; }
.acard .wp-block-post-title a { color: inherit; }
.acard:hover h3, .acard:hover .wp-block-post-title { color: var(--red-deep); }
.acard .loc { font-family: var(--ui); font-size: .74rem; color: #8c8273; margin-top: 16px; }

/* dark variant */
.dark .acard { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); }
.dark .acard h3, .dark .acard .wp-block-post-title,
.dark .acard .wp-block-post-title a { color: #fff; }
.dark .acard:hover { border-color: rgba(245,168,60,.4); }
.dark .acard:hover h3, .dark .acard:hover .wp-block-post-title,
.dark .acard:hover .wp-block-post-title a { color: var(--lantern); }

/* filter chips — category links styled as chips */
.chips { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 44px; list-style: none; padding: 0; }
.chip, .chips a { font-family: var(--ui); font-size: .78rem; font-weight: 600; letter-spacing: .04em;
        padding: 10px 20px; border-radius: 30px; border: 1px solid var(--stone);
        color: #6b655c; transition: .3s; cursor: pointer; background: transparent;
        display: inline-block; }
.chip:hover, .chips a:hover { border-color: var(--clay); color: var(--ink); }
.chip.active { background: var(--ink); color: var(--lantern); border-color: var(--ink); }
.dark .chip, .dark .chips a { border-color: rgba(255,255,255,.18); color: rgba(255,255,255,.65); }
.dark .chip:hover, .dark .chips a:hover { color: #fff; border-color: rgba(255,255,255,.4); }
.dark .chip.active { background: var(--lantern-dim); color: var(--lantern);
                     border-color: rgba(245,168,60,.55);
                     box-shadow: 0 0 24px rgba(245,168,60,.15); }

/* pagination */
.wp-block-query-pagination { font-family: var(--ui); font-size: .85rem; margin-top: 50px; }
.wp-block-query-pagination a { border: 1px solid var(--stone); padding: 10px 18px;
                     border-radius: 3px; transition: .3s; }
.wp-block-query-pagination a:hover { border-color: var(--lantern-deep); color: var(--lantern-deep); }
.dark .wp-block-query-pagination a { border-color: rgba(255,255,255,.2); color: rgba(255,255,255,.7); }
.dark .wp-block-query-pagination a:hover { border-color: var(--lantern); color: var(--lantern); }

@media (max-width: 920px) {
  .articles-grid .wp-block-post-template, div.articles-grid { grid-template-columns: 1fr; } }
@media (min-width: 921px) and (max-width: 1200px) {
  .articles-grid .wp-block-post-template, div.articles-grid { grid-template-columns: 1fr 1fr; } }


/* ══════════════════ 12. PAGE HERO + CTA ══════════════════ */
.page-hero { min-height: 62vh; background: var(--ink); color: #fff; position: relative;
             display: flex; align-items: flex-end; overflow: hidden; padding: 0; }
.wp-block-cover.page-hero { align-items: flex-end; }
.page-hero .bg-media { z-index: 0; opacity: .45; filter: grayscale(.35) contrast(1.05); }
.page-hero .veil { position: absolute; inset: 0; z-index: 1;
                   background: linear-gradient(0deg, rgba(7,6,6,.96), rgba(7,6,6,.2) 55%, rgba(7,6,6,.5)); }
.page-hero .wrap { position: relative; z-index: 4; padding-top: 150px; padding-bottom: 70px; width: 100%; }
.page-hero h1, .page-hero .wp-block-post-title, .page-hero h1.wp-block-heading {
                font-family: var(--display); color: #fff;
                font-size: clamp(2.8rem, 6.5vw, 5.4rem); line-height: .98; margin: 14px 0 18px; }
.page-hero h1 em { font-style: italic; background: var(--flame);
                   -webkit-background-clip: text; background-clip: text; color: transparent; }
.page-hero .subtitle,
.page-hero .wp-block-post-excerpt__excerpt { font-family: var(--display); font-style: italic;
                       font-size: clamp(1.05rem, 1.9vw, 1.4rem);
                       color: rgba(255,255,255,.82); max-width: 46ch; line-height: 1.45; }

.page-cta { background: var(--ink); color: #fff; text-align: center;
            padding: 120px 0; position: relative; overflow: hidden; }
.page-cta .pattern-layer { opacity: .06; }
.page-cta h2, .page-cta .wp-block-heading { font-size: clamp(2rem, 4.2vw, 3.1rem);
            max-width: 24ch; margin: 0 auto 30px; color: #fff; }
.page-cta .links, .page-cta .wp-block-buttons { display: flex; gap: 18px;
            justify-content: center; flex-wrap: wrap; }


/* ══════════════════ 13. SINGLE PRODUCTION ══════════════════ */
.film-hero { min-height: 92vh; align-items: flex-end; }
.film-hero .crumb { font-family: var(--ui); font-size: .74rem; letter-spacing: .1em;
                    text-transform: uppercase; color: rgba(255,255,255,.55); margin-bottom: 20px; }
.film-hero .crumb a:hover { color: var(--lantern); }
.film-hero .wp-block-post-terms { position: static; margin-bottom: 16px; }
.film-hero .tagline,
.film-hero .wp-block-post-excerpt__excerpt { font-family: var(--display); font-style: italic;
                      font-size: clamp(1.1rem, 2vw, 1.5rem); color: rgba(255,255,255,.85);
                      max-width: 44ch; margin-bottom: 34px; }
.film-hero .wp-block-post-excerpt__more-link { display: none; }

.meta-slate { display: flex; gap: 0; flex-wrap: wrap;
              border-top: 1px solid rgba(255,255,255,.16); }
.meta-slate > div { padding: 20px 40px 4px 0; margin-right: 40px; font-family: var(--ui);
                    font-size: 1rem; color: #fff; }
.meta-slate b { display: block; font-size: .64rem; letter-spacing: .2em;
                text-transform: uppercase; color: var(--clay); margin-bottom: 6px; font-weight: 600; }

.trailer-band { background: var(--ink); padding: 60px 0 130px; position: relative; }
.trailer-band .video-note { color: var(--lantern); }

.synopsis { max-width: 780px; margin: 0 auto; }
.synopsis .big { font-family: var(--display); font-size: clamp(1.5rem, 2.4vw, 2rem);
                 line-height: 1.4; color: var(--ink); margin: 22px 0 26px; }
.synopsis p:not(.big):not(.eyebrow) { font-size: 1.12rem; line-height: 1.85;
                 color: #36332e; margin-bottom: 22px; }

/* single production body — content the client writes in the editor */
.production-body.wp-block-post-content { max-width: 780px; margin: 0 auto; }
.production-body p { font-size: 1.12rem; line-height: 1.85; color: #36332e; margin-bottom: 22px; }
.production-body h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); margin: 54px 0 20px; }
.production-body .wp-block-embed { margin: 44px 0; }
.production-body .wp-block-embed iframe { width: 100%; aspect-ratio: 16/9; height: auto;
                 border-radius: 6px; }
.production-body .wp-block-image img, .production-body .wp-block-video video { border-radius: 4px; }

/* credits — end-credit roll */
.credits-band { background: var(--charcoal); color: #fff; position: relative; }
.credits { list-style: none; max-width: 720px; margin: 0 auto; padding: 0; }
.credits li { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: 18px 0;
              border-bottom: 1px solid rgba(255,255,255,.1); align-items: baseline; }
.credits .role { font-family: var(--ui); font-size: .74rem; letter-spacing: .2em;
                 text-transform: uppercase; color: var(--clay); text-align: right; }
.credits .name { font-family: var(--display); font-size: 1.2rem; color: #fff; }

/* stills — core gallery with class "stills" */
.stills, .wp-block-gallery.stills { display: grid !important;
         grid-template-columns: repeat(3,1fr); gap: 14px !important; }
.stills a, .stills .wp-block-image { position: relative; overflow: hidden;
         border-radius: 4px; margin: 0 !important; width: auto !important; }
.stills img { width: 100% !important; aspect-ratio: 4/3; object-fit: cover;
         transition: .6s; filter: brightness(.92); }
.stills a:hover img, .stills .wp-block-image:hover img {
         transform: scale(1.06); filter: brightness(1.05); }

/* prev / next film */
.film-nav { display: grid; grid-template-columns: 1fr 1fr;
            border-top: 1px solid rgba(255,255,255,.12); }
.film-nav a, .film-nav .wp-block-post-navigation-link { padding: 44px 40px; transition: .4s; }
.film-nav .wp-block-post-navigation-link { font-family: var(--display);
            font-size: 1.3rem; color: #fff; }
.film-nav > *:first-child { border-right: 1px solid rgba(255,255,255,.12); }
.film-nav a:hover { background: rgba(245,168,60,.06); color: var(--lantern); }
.film-nav .post-navigation-link__label { display: block; font-family: var(--ui);
            font-size: .66rem; letter-spacing: .24em; text-transform: uppercase;
            color: var(--clay); margin-bottom: 10px; }

@media (max-width: 920px) {
  .credits li { grid-template-columns: 1fr; gap: 4px; }
  .credits .role { text-align: left; }
  .stills, .wp-block-gallery.stills { grid-template-columns: 1fr 1fr; }
  .film-nav { grid-template-columns: 1fr; }
  .film-nav > *:first-child { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.12); }
}


/* ══════════════════ 14. SINGLE POST (article) ══════════════════ */
.article-hero { min-height: 72vh; align-items: center; text-align: center; }
.wp-block-cover.article-hero { align-items: center; }
.article-hero .wrap { align-self: center; padding-bottom: 60px; }
.article-hero .wp-block-post-terms,
.article-hero .cat-chip { position: static; font-family: var(--ui); font-size: .68rem;
                letter-spacing: .22em; text-transform: uppercase; font-weight: 600;
                color: var(--lantern); border: 1px solid rgba(245,168,60,.4);
                background: var(--lantern-dim); padding: 7px 16px; border-radius: 30px;
                display: inline-block; }
.article-hero .wp-block-post-terms a { color: var(--lantern); }
.article-hero h1, .article-hero .wp-block-post-title {
                font-size: clamp(2.2rem, 5vw, 4.2rem); max-width: 22ch; margin: 24px auto 18px; }
.article-hero .standfirst,
.article-hero .wp-block-post-excerpt__excerpt { font-family: var(--display); font-style: italic;
                font-size: clamp(1.05rem, 1.9vw, 1.4rem); color: rgba(255,255,255,.82);
                max-width: 50ch; margin: 0 auto; }
.article-hero .wp-block-post-excerpt__more-link { display: none; }
.article-hero .a-meta { display: flex; gap: 12px; justify-content: center; align-items: center;
                margin-top: 30px; font-family: var(--ui); font-size: .85rem;
                color: rgba(255,255,255,.6); flex-wrap: wrap; }
.article-hero .a-meta a, .article-hero .a-meta b { color: #fff; font-weight: 500; }
.article-hero .a-meta > * { display: inline-flex; }

.article-body, .article-body.wp-block-post-content { max-width: 740px; margin: 0 auto; }
.article-body p { font-size: 1.15rem; line-height: 1.9; color: #36332e; margin-bottom: 26px; }
.article-body > p:first-of-type::first-letter { font-family: var(--display); font-size: 3.4em;
                float: left; line-height: .8; padding: 8px 14px 0 0; color: var(--red); }
.article-body h2 { font-size: clamp(1.6rem, 2.6vw, 2.1rem); margin: 54px 0 20px; }
.article-body blockquote { margin: 46px 0; padding: 4px 0 4px 30px;
                border-left: 3px solid; border-image: var(--flame) 1;
                font-family: var(--display); font-style: italic;
                font-size: 1.5rem; line-height: 1.5; color: var(--ink); }
.article-body figure:not(.wp-block-embed) { margin: 44px 0; }
.article-body figure img { border-radius: 4px; width: 100%; }
.article-body figcaption { font-family: var(--ui); font-size: .78rem; color: #8c8273;
                margin-top: 12px; }
.article-body .wp-block-embed { margin: 44px 0; }
.article-body .wp-block-embed iframe { width: 100%; aspect-ratio: 16/9; height: auto;
                border-radius: 4px; }

.share-row { max-width: 740px; margin: 60px auto 0; padding-top: 28px;
             border-top: 1px solid var(--stone); display: flex;
             justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.share-row .lbl { font-family: var(--ui); font-size: .72rem; letter-spacing: .18em;
             text-transform: uppercase; color: var(--clay); }
.share-row .socials-inline { display: flex; gap: 10px; }
.share-row .socials-inline a { width: 40px; height: 40px; border: 1px solid var(--stone);
             border-radius: 50%; display: flex; align-items: center; justify-content: center;
             font-family: var(--ui); font-size: .75rem; color: #6b655c; transition: .3s; }
.share-row .socials-inline a:hover { border-color: var(--lantern-deep);
             color: var(--lantern-deep); box-shadow: 0 0 20px rgba(245,168,60,.25); }


/* ══════════════════ 15. FOOTER (site-footer part) ══════════════════ */
footer.wp-block-template-part { display: contents; }
.site-footer { background: var(--ink); color: rgba(255,255,255,.7);
               padding: 90px 0 0; position: relative; overflow: hidden; }
.site-footer .fns-word { position: absolute; right: -3%; bottom: -12%;
               font-size: clamp(10rem, 24vw, 20rem); opacity: .5; }
.site-footer .wp-block-columns { display: grid;
               grid-template-columns: 1.6fr 1fr 1fr 1.2fr; gap: 50px;
               padding-bottom: 64px; border-bottom: 1px solid rgba(255,255,255,.1);
               position: relative; z-index: 2; }
.site-footer .f-brand img { width: 130px; margin-bottom: 24px; }
.site-footer .f-brand p { font-family: var(--display); font-style: italic; font-size: 1.05rem;
               color: rgba(255,255,255,.6); max-width: 30ch; }
.site-footer h4, .site-footer .wp-block-heading { font-family: var(--ui); font-size: .7rem;
               letter-spacing: .2em; text-transform: uppercase; color: var(--lantern);
               font-weight: 600; margin-bottom: 22px; }
.site-footer ul, .site-footer .wp-block-list { list-style: none; display: flex;
               flex-direction: column; gap: 13px; font-family: var(--ui); font-size: .92rem;
               padding: 0; }
.site-footer ul a, .site-footer .wp-block-list a { color: rgba(255,255,255,.62); transition: .3s; }
.site-footer ul a:hover, .site-footer .wp-block-list a:hover { color: var(--lantern); padding-left: 4px; }
.site-footer .socials { display: flex; gap: 14px; margin-top: 10px; }
.site-footer .socials a { width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.18);
               border-radius: 50%; display: flex; align-items: center; justify-content: center;
               transition: .3s; font-family: var(--ui); font-size: .78rem;
               color: rgba(255,255,255,.7); }
.site-footer .socials a:hover { border-color: var(--lantern); color: var(--lantern);
               box-shadow: 0 0 24px rgba(245,168,60,.35); }
.site-footer .f-bottom { display: flex; justify-content: space-between; align-items: center;
               padding: 26px 0; font-family: var(--ui); font-size: .78rem;
               color: rgba(255,255,255,.4); flex-wrap: wrap; gap: 12px;
               position: relative; z-index: 2; }
.site-footer .f-bottom a:hover { color: var(--lantern); }
@media (max-width: 920px) { .site-footer .wp-block-columns { grid-template-columns: 1fr 1fr; gap: 36px; } }
@media (max-width: 560px) { .site-footer .wp-block-columns { grid-template-columns: 1fr; } }


/* ══════════════════ 16. TRAILER MODAL (injected by JS) ══════════════════ */
.modal { position: fixed; inset: 0; z-index: 99999; display: none;
         align-items: center; justify-content: center; padding: 4vw;
         background: rgba(7,6,6,.92); backdrop-filter: blur(10px); }
.modal.open { display: flex; }
.modal-frame { width: min(1100px, 100%); aspect-ratio: 16/9; background: #000;
               border-radius: 6px; overflow: hidden; position: relative;
               box-shadow: 0 0 120px rgba(245,168,60,.18); }
.modal-frame iframe, .modal-frame video { width: 100%; height: 100%; border: 0; }
.modal-close { position: absolute; top: 26px; right: 30px; color: #fff;
               background: none; border: none; font-family: var(--ui); font-size: .8rem;
               letter-spacing: .2em; text-transform: uppercase; }
.modal-close:hover { color: var(--lantern); }


/* ══════════════════ 17. PARALLAX STATEMENT BAND ══════════════════
   Cover block + classes "statement-band has-parallax" */
.statement-band { min-height: 60vh; position: relative; overflow: hidden;
                  display: flex; align-items: center; text-align: center; color: #fff; }
.wp-block-cover.statement-band { align-items: center; }
.statement-band .band-veil { position: absolute; inset: 0; z-index: 1;
                  background: rgba(7,6,6,.72); }
.statement-band .wrap { position: relative; z-index: 2; }
.statement-band h2, .statement-band .wp-block-heading {
                  font-size: clamp(1.9rem, 3.6vw, 2.9rem); line-height: 1.25;
                  max-width: 26ch; margin: 0 auto 18px; color: #fff; }
.statement-band p { color: rgba(255,255,255,.78); max-width: 56ch;
                  margin: 0 auto; font-size: 1.05rem; }
.statement-band cite { display: block; font-style: normal; font-family: var(--ui);
                  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
                  color: var(--clay); margin-top: 18px; }


/* ══════════════════ 18. ABOUT PAGE ══════════════════ */
.photo-split { display: grid; grid-template-columns: .85fr 1.15fr;
               gap: 64px; align-items: center; }
.photo-split.wp-block-columns { display: grid; }
.photo-split .photo, .photo-split .wp-block-image { aspect-ratio: 4/5; border-radius: 6px;
                      overflow: hidden; position: relative; margin: 0; }
.photo-split .photo img, .photo-split .wp-block-image img {
                      width: 100%; height: 100%; object-fit: cover; }
.photo-split .body p:not(.eyebrow) { color: #4a4742; font-size: 1.08rem; line-height: 1.78;
                       margin-bottom: 18px; }
.photo-split .body p.big { font-family: var(--display); color: var(--ink);
                       font-size: clamp(1.3rem, 2.2vw, 1.7rem); line-height: 1.4; }
@media (max-width: 920px) { .photo-split, .photo-split.wp-block-columns {
                       grid-template-columns: 1fr; gap: 32px; } }

.value-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; }
.value-grid.wp-block-columns { display: grid; }
.value-card { background: var(--paper); border: 1px solid var(--stone);
              border-radius: 6px; padding: 38px 32px; position: relative;
              overflow: hidden; transition: .45s; }
.value-card::before { content: ""; position: absolute; top: 0; left: 32px;
              width: 44px; height: 2px; background: var(--lantern); transition: width .5s; }
.value-card:hover { transform: translateY(-5px); border-color: var(--clay);
              box-shadow: 0 24px 50px rgba(28,26,25,.08); }
.value-card:hover::before { width: 90px; }
.value-card .num { font-family: var(--ui); font-size: .7rem; letter-spacing: .22em;
              color: var(--clay); text-transform: uppercase; font-weight: 600; }
.value-card h3, .value-card .wp-block-heading { font-size: 1.6rem; margin: 14px 0 12px; }
.value-card p:not(.num) { color: #4a4742; font-size: 1rem; line-height: 1.7; }
@media (max-width: 920px) { .value-grid, .value-grid.wp-block-columns {
              grid-template-columns: 1fr; gap: 18px; } }


/* ══════════════════ 19. PEOPLE PAGE ══════════════════ */
.people-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 40px 32px; }
.people-grid.wp-block-columns { display: grid; }
.person { position: relative; }
.person .p-photo, .person .wp-block-image { aspect-ratio: 4/5; border-radius: 6px;
                   overflow: hidden; margin: 0 0 20px; position: relative;
                   background: var(--stone); }
.person .p-photo img, .person .wp-block-image img { width: 100%; height: 100%;
                   object-fit: cover; filter: grayscale(.5); transition: .8s; }
.person .p-photo::after, .person .wp-block-image::after { content: "";
                   position: absolute; inset: auto 0 0 0; height: 45%; opacity: 0;
                   transition: .7s;
                   background: radial-gradient(70% 90% at 50% 100%,
                     rgba(245,168,60,.25), transparent 70%); }
.person:hover img { filter: grayscale(0); transform: scale(1.04); }
.person:hover .p-photo::after, .person:hover .wp-block-image::after { opacity: 1; }
.person h3, .person .wp-block-heading { font-size: 1.45rem; margin-bottom: 4px; }
.person .p-role { font-family: var(--ui); font-size: .72rem; letter-spacing: .16em;
                   text-transform: uppercase; font-weight: 600; color: var(--red);
                   display: block; margin-bottom: 12px; }
.person p:not(.p-role) { color: #4a4742; font-size: .96rem; line-height: 1.65; }
@media (max-width: 920px) { .people-grid, .people-grid.wp-block-columns {
                   grid-template-columns: 1fr 1fr; gap: 26px 18px; } }
@media (max-width: 560px) { .people-grid, .people-grid.wp-block-columns {
                   grid-template-columns: 1fr; } }


/* ══════════════════ 20. CONTACT PAGE ══════════════════ */
.con-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: start; }
.con-grid.wp-block-columns { display: grid; }
.con-info h2, .con-info .wp-block-heading { font-size: clamp(1.8rem, 3vw, 2.4rem);
            margin: 14px 0 30px; }
.con-item { margin-bottom: 28px; }
.con-item .lbl { font-family: var(--ui); font-size: .68rem; letter-spacing: .2em;
                 text-transform: uppercase; color: var(--clay);
                 margin-bottom: 7px; display: block; }
.con-item a, .con-item .v { font-family: var(--display); font-size: 1.25rem;
                 color: var(--ink); transition: .3s; }
.con-item a:hover { color: var(--red); }
.con-socials { display: flex; gap: 12px; margin-top: 10px; }
.con-socials a { width: 42px; height: 42px; border: 1px solid var(--stone);
                 border-radius: 50%; display: flex; align-items: center;
                 justify-content: center; font-family: var(--ui); font-size: .78rem;
                 color: #6b655c; transition: .3s; }
.con-socials a:hover { border-color: var(--lantern-deep); color: var(--lantern-deep);
                 box-shadow: 0 0 22px rgba(245,168,60,.25); }

/* works for WPForms / Contact Form 7 markup inside .con-form */
.con-form { background: var(--paper); border: 1px solid var(--stone);
            border-radius: 6px; padding: 46px; position: relative; overflow: hidden; }
.con-form::before { content: ""; position: absolute; top: 0; left: 0; right: 0;
            height: 2px; background: linear-gradient(90deg, var(--red), var(--lantern), transparent 70%); }
.con-form h3, .con-form .wp-block-heading { font-size: 1.5rem; margin-bottom: 6px; }
.con-form .note { font-family: var(--ui); font-size: .9rem; color: #8c8273; margin-bottom: 28px; }
.con-form label { font-family: var(--ui); font-size: .7rem; letter-spacing: .16em;
            text-transform: uppercase; color: var(--clay); display: block; margin: 18px 0 8px; }
.con-form input[type="text"], .con-form input[type="email"],
.con-form input[type="tel"], .con-form textarea { width: 100%; background: var(--sand);
            border: 1px solid var(--stone); border-radius: 3px; padding: 14px 16px;
            font-family: var(--ui); font-size: .98rem; color: var(--ink); transition: .3s; }
.con-form input:focus, .con-form textarea:focus { outline: none;
            border-color: var(--lantern-deep); box-shadow: 0 0 0 3px rgba(245,168,60,.12); }
.con-form textarea { min-height: 140px; resize: vertical; }
.con-form input[type="submit"], .con-form button[type="submit"] {
            font-family: var(--ui); font-size: .78rem; font-weight: 600;
            letter-spacing: .16em; text-transform: uppercase; margin-top: 26px;
            padding: 18px 34px; background: var(--ink); color: #fff;
            border: 1px solid var(--ink); border-radius: 0; transition: .4s; }
.con-form input[type="submit"]:hover, .con-form button[type="submit"]:hover {
            background: var(--charcoal); border-color: var(--lantern);
            color: var(--lantern); box-shadow: 0 0 30px rgba(245,168,60,.2); }
/* Contact Form 7 specifics */
.con-form .wpcf7 p { margin: 0 0 4px; font-family: var(--ui); }
.con-form .wpcf7-form-control-wrap { display: block; margin-bottom: 14px; }
.con-form .wpcf7-not-valid-tip { font-family: var(--ui); font-size: .78rem;
            color: var(--red-deep); margin-top: 6px; display: block; }
.con-form .wpcf7-response-output { border: 1px solid var(--stone) !important;
            border-left: 3px solid var(--lantern) !important; border-radius: 3px;
            margin: 22px 0 0 !important; padding: 12px 16px !important;
            font-family: var(--ui); font-size: .9rem; }
.con-form .wpcf7-spinner { margin: 0 0 0 12px; }

@media (max-width: 920px) {
  .con-grid, .con-grid.wp-block-columns { grid-template-columns: 1fr; gap: 44px; }
  .con-form { padding: 32px 24px; } }


/* ══════════════════ 21. MISC / BANDS / TIERS ══════════════════ */
.sand-band { background: var(--sand); }
.paper-band { background: var(--paper); }
.dark { color: #fff; }
.video-note { font-family: var(--ui); font-size: .7rem; letter-spacing: .08em;
              color: var(--lantern-deep); border: 1px dashed rgba(217,126,36,.5);
              border-radius: 3px; padding: 8px 14px; display: inline-block; margin-top: 16px; }

@media (max-width: 920px) { .sec { padding: 84px 0; } }
@media (min-width: 1441px) { :root { --maxw: min(1800px, calc(100vw - 160px)); } .wrap { padding: 0 40px; } }
@media (min-width: 1600px) { html { font-size: 17px; } .sec { padding: 150px 0; } }
@media (min-width: 1900px) { html { font-size: 18px; } }