/* Cinéroutes — navy ground, white type, bronze taken from the é in the logo.
   Photos carry the sections; text sits on them with just enough shade to read. */
:root {
  --ink: #071a2c;          /* page ground, deep navy */
  --panel: #0c2640;        /* raised panels */
  --line: #1c3b5a;         /* hairlines */
  --paper: #f4f4f2;        /* primary text */
  --soft: #dbe6f0;         /* body text on photos */
  --muted: #9fb3c8;        /* secondary text */
  --bronze: #c8896a;       /* logo é, lifted for dark ground: labels and details */
  --action: #8a4934;       /* logo é: buttons */
  --action-hi: #b3674a;    /* button hover, focus */
  --wa: #1e8e4f;           /* WhatsApp green */
  --shade: 7, 26, 44;      /* navy as rgb, for photo overlays */
  --f-display: "Barlow Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --f-body: "Source Sans 3", "Segoe UI", Helvetica, Arial, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  color-scheme: dark;
}

/* ---------- base ---------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--ink); color: var(--paper); font: 400 1.0625rem/1.6 var(--f-body); }
a { color: inherit; }
p { margin: 0; }
:focus-visible { outline: 2px solid var(--action-hi); outline-offset: 3px; }
.wrap { max-width: 72rem; margin-inline: auto; padding-inline: max(16px, 4vw); }
h1, h2, h3 { font-family: var(--f-display); font-weight: 700; line-height: 1.02; text-wrap: balance; margin: 0; letter-spacing: .005em; }
h2 { font-size: clamp(2rem, 4.5vw, 3.25rem); text-transform: uppercase; }
h3 { font-size: 1.5rem; font-weight: 600; text-transform: uppercase; letter-spacing: .02em; }
.mono { font-family: var(--f-mono); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.ph { display: block; width: 100%; height: 100%; object-fit: cover; max-width: 100%; }

/* buttons */
.btn { display: inline-flex; align-items: center; gap: .5rem; font: 600 1rem/1 var(--f-body); padding: .9rem 1.4rem; border-radius: 2px; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: background .2s, border-color .2s; }
.btn-action { background: var(--action); color: #fff; }
.btn-action:hover { background: var(--action-hi); }
.btn-line { border-color: var(--paper); color: var(--paper); background: transparent; }
.btn-line:hover { background: rgba(244,244,242,.08); }
.btn-wa { background: var(--wa); color: #fff; }
.btn-wa:hover:not(:disabled) { background: #25a35c; }
.btn-wa:disabled { opacity: .45; cursor: not-allowed; }

/* section frame */
section.block { padding-block: clamp(4rem, 8vw, 6.5rem); border-bottom: 1px solid var(--line); }
.head { display: grid; gap: .9rem; margin-bottom: 2.75rem; max-width: 44rem; }
.head p { color: var(--muted); }
.head.flush { margin: 0; }
.kicker, .head .kicker { color: var(--bronze); }
.head > .kicker::before { content: ""; display: inline-block; width: 1.6rem; height: 1px; background: var(--bronze); vertical-align: middle; margin-right: .6rem; }
.h2-sm { font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
.caption { position: absolute; right: max(16px, 4vw); bottom: 1.4rem; z-index: 2; margin: 0; color: var(--bronze); font-size: .7rem; }

/* photo-backed sections: .photo-bg + an <img class="bg-img"> + a ::before shade */
.photo-bg { position: relative; overflow: hidden; }
.photo-bg > .bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.photo-bg::before { content: ""; position: absolute; inset: 0; z-index: 1; }
.photo-bg > .wrap { position: relative; z-index: 2; }

/* ---------- header ---------- */
header.site { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 10; background: rgba(var(--shade), .92); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(200,137,106,.35); }
.bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 4.25rem; flex-wrap: wrap; padding-block: .5rem; }
.logo img { display: block; height: 34px; width: auto; border-radius: 2px; }
nav.main { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
nav.main a { text-decoration: none; font-weight: 600; font-size: .95rem; color: var(--muted); }
nav.main a:hover { color: var(--paper); }
nav.main .btn { color: #fff; }
.lang { font-family: var(--f-mono); font-size: .8rem; display: flex; gap: .4rem; }
.lang a[aria-current] { color: var(--paper); border-bottom: 2px solid var(--action); }

/* ---------- hero ---------- */
.hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--line); }
.hero-img { position: absolute; inset: 0; }
.hero-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(var(--shade), .45) 0%, rgba(var(--shade), .12) 55%, rgba(var(--shade), 0) 100%); }
.hero-inner { position: relative; padding-block: clamp(4rem, 11vw, 8.5rem) clamp(7rem, 14vw, 12rem); display: grid; gap: 1.5rem; text-shadow: 0 1px 12px rgba(var(--shade), .55); }
.hero-inner > .mono { color: #f0d2bf; }
.hero h1 { font-size: clamp(2.3rem, 5.4vw, 4.4rem); text-transform: uppercase; max-width: 16ch; }
.hero h1 em { font-style: normal; text-decoration: underline; text-decoration-color: var(--bronze); text-decoration-thickness: .08em; text-underline-offset: .12em; }
.hero .lead { font-size: clamp(1.1rem, 1.6vw, 1.3rem); max-width: 40rem; color: var(--soft); }
.ctas { display: flex; gap: .75rem; flex-wrap: wrap; }
.slate-band { background: var(--panel); border-bottom: 1px solid var(--line); }
.slate { display: flex; flex-wrap: wrap; gap: .4rem 2rem; padding-block: 1rem; }
.slate b { color: var(--bronze); font-weight: 500; }

/* ---------- services ---------- */
.services { display: grid; grid-template-columns: 1.15fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.svc { background: var(--ink); padding: 2.25rem; display: grid; gap: .75rem; align-content: start; min-width: 0; }
.svc.lead-svc { background: var(--panel); }
.svc h3 { font-size: 2.25rem; }
.svc p { color: var(--muted); }
.svc ul { margin: .25rem 0 0; padding-left: 1.1rem; color: #cfcfcd; display: grid; gap: .3rem; }
.svc figure { margin: -2.25rem -2.25rem .75rem; aspect-ratio: 16 / 9; overflow: hidden; }
.svc-video figure { aspect-ratio: 16 / 10; }
.svc figure img { transition: transform .5s; }
.svc:hover figure img { transform: scale(1.03); }
.svc .go { font-weight: 600; color: var(--paper); text-decoration: none; margin-top: .25rem; }
.svc .go:hover { color: var(--action-hi); }

.genres { margin-top: 2.25rem; display: grid; gap: .9rem; }
.genre-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.genre { margin: 0; position: relative; aspect-ratio: 4 / 5; overflow: hidden; border: 1px solid var(--line); min-width: 0; }
.genre > img { position: absolute; inset: 0; }
.genre.split2 { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--line); }
.genre.split2 > img { position: static; }
.genre figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 2.5rem .9rem .9rem; background: linear-gradient(0deg, rgba(var(--shade), .95) 0%, rgba(var(--shade), .75) 55%, rgba(var(--shade), 0) 100%); display: grid; gap: .2rem; }
.genre figcaption b { font: 600 1.15rem/1.1 var(--f-display); text-transform: uppercase; color: var(--paper); }
.genre figcaption span { font-size: .85rem; color: #cfdbe6; line-height: 1.35; }

/* ---------- network (photo background, crew band at the bottom) ---------- */
section.network { padding-top: clamp(2.5rem, 5vw, 3.5rem); padding-bottom: 0; }
.network::before { background: linear-gradient(180deg, rgba(var(--shade), .7) 0%, rgba(var(--shade), .35) 40%, rgba(var(--shade), .05) 65%); }
.network .head { max-width: 46rem; gap: .6rem; margin: 0; text-shadow: 0 1px 8px rgba(var(--shade), .85); }
.network .head p:last-child { color: #eef3f8; font-size: 1rem; max-width: 42rem; }
.roster { margin: clamp(12rem, 30vw, 22rem) calc(50% - 50vw) 0; background: rgba(var(--shade), .88); padding: 1rem calc(max(0px, (100vw - 72rem) / 2) + max(16px, 4vw)); display: grid; grid-template-columns: auto 1fr; gap: .35rem 1.5rem; align-items: baseline; }
.roster .kicker { font-size: .72rem; white-space: nowrap; }
.chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .1rem .4rem; }
.chips li { font-size: .9rem; color: #eef3f8; }
.chips li:not(:last-child)::after { content: "·"; margin-left: .4rem; color: var(--bronze); }
.roster .note { grid-column: 2; font-size: .82rem; color: var(--muted); }

/* ---------- process (photo background, steps on top) ---------- */
section.process { padding-top: clamp(2.5rem, 5vw, 3.5rem); padding-bottom: clamp(14rem, 32vw, 24rem); }
.process::before { background: linear-gradient(180deg, rgba(var(--shade), .9) 0%, rgba(var(--shade), .78) 38%, rgba(var(--shade), .2) 62%, rgba(var(--shade), 0) 100%); }
.process .wrap { text-shadow: 0 1px 8px rgba(var(--shade), .85), 0 0 2px rgba(var(--shade), .9); }
.process .head { margin-bottom: 1.75rem; gap: .5rem; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); counter-reset: s; position: relative; }
.steps::before { content: ""; position: absolute; left: 0; right: 0; top: .95rem; height: 2px; background: rgba(244,244,242,.35); }
.steps li { counter-increment: s; position: relative; display: grid; gap: .3rem; align-content: start; min-width: 0; padding-right: 1rem; }
.steps li::before { content: counter(s); display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 50%; background: rgba(var(--shade), .85); border: 1.5px solid var(--bronze); color: var(--bronze); font: 600 .85rem var(--f-mono); margin-bottom: .5rem; position: relative; }
.steps b { font-family: var(--f-display); font-size: 1.05rem; text-transform: uppercase; font-weight: 600; line-height: 1; }
.steps span { color: #eef3f8; font-size: .88rem; line-height: 1.45; }

/* ---------- portfolio ---------- */
.vids { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 1.25rem; }
.vids .vid:first-child { grid-column: span 2; }
.vids .vid:first-child .vt { font-size: 1.9rem; }
.vid { text-decoration: none; display: grid; gap: .35rem; align-content: start; min-width: 0; }
.vid .mono { margin-top: .4rem; color: var(--bronze); }
.thumb { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--panel); border: 1px solid var(--line); display: block; }
.thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.play { position: absolute; left: 50%; top: 50%; width: 3.6rem; height: 2.5rem; transform: translate(-50%, -50%); background: var(--action); border-radius: .7rem; transition: background .2s; }
.play::after { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: .5rem 0 .5rem .85rem; border-color: transparent transparent transparent #fff; }
.vid:hover .play { background: var(--action-hi); }
.vid:hover .thumb img { transform: scale(1.04); }
.vt { font: 600 1.35rem/1.15 var(--f-display); }
.vc { color: var(--muted); font-size: .95rem; }
.also { margin-top: 2rem; display: grid; gap: .5rem; max-width: 56rem; }
.also > .mono { color: var(--bronze); }
.also p:last-child { color: #cfdbe6; line-height: 1.8; }
.wild-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; margin-top: 2rem; }
.wild-grid figure { margin: 0; position: relative; aspect-ratio: 4 / 5; overflow: hidden; min-width: 0; border: 1px solid var(--line); }
.wild-grid img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.wild-grid figcaption { position: absolute; left: .6rem; bottom: .6rem; background: rgba(var(--shade), .8); color: var(--paper); padding: .25rem .5rem; font-size: .7rem; }

/* ---------- about (photo background, text panel on the left) ---------- */
section.about { padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(3rem, 6vw, 5rem); }
.about > .bg-img { object-position: 0% 78%; }
.about::before { background: linear-gradient(90deg, rgba(var(--shade), .35) 0%, rgba(var(--shade), .1) 60%, rgba(var(--shade), 0) 100%); }
.about .text { display: grid; gap: 1.1rem; max-width: 31rem; background: rgba(var(--shade), .72); padding: clamp(1.25rem, 3vw, 2rem); backdrop-filter: blur(2px); }
.about .text p { color: #e3edf7; }
.about h2 { font-size: clamp(1.8rem, 3.2vw, 2.6rem); }
.hary { display: flex; align-items: center; gap: 1rem; }
.hary img { width: 5.5rem; height: 5.5rem; border-radius: 50%; object-fit: cover; object-position: 50% 45%; border: 2px solid var(--bronze); flex: none; }
.about .hary .hary-role { font-size: .9rem; color: var(--muted); margin-top: .2rem; }

/* ---------- questions ---------- */
section.faq-sec { padding-top: 0; }
.faq-banner { position: relative; overflow: hidden; margin-bottom: clamp(2rem, 4vw, 3rem); min-height: clamp(14rem, 28vw, 22rem); display: grid; align-items: start; }
.faq-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.faq-banner::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(var(--shade), .55) 0%, rgba(var(--shade), 0) 35%, rgba(var(--shade), 0) 94%, var(--ink) 100%); }
.faq-banner .wrap { position: relative; z-index: 2; width: 100%; padding-top: clamp(2.5rem, 5vw, 3.5rem); }
.faq-banner .head { margin: 0; text-shadow: 0 1px 10px rgba(var(--shade), .6); }
.faq { display: grid; border-top: 1px solid var(--line); max-width: 52rem; }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; list-style: none; padding: 1.2rem 2.5rem 1.2rem 0; font-weight: 600; font-size: 1.1rem; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: .25rem; top: 1rem; font: 400 1.5rem var(--f-mono); color: var(--bronze); }
.faq details[open] summary::after { content: "–"; }
.faq details p { padding: 0 0 1.3rem; color: #cfcfcd; max-width: 44rem; }

/* ---------- contact (photo background) ---------- */
.contact-sec > .bg-img { object-position: 50% 30%; filter: brightness(1.25) saturate(1.1); }
.contact-sec::before { background: linear-gradient(90deg, rgba(var(--shade), .45) 0%, rgba(var(--shade), .15) 55%, rgba(var(--shade), .1) 100%); }
.contact { display: grid; align-items: start; grid-template-columns: 1fr 1.2fr; gap: clamp(2rem, 5vw, 4rem); }
.contact-intro { display: grid; gap: 1.5rem; align-content: start; }
.contact-intro .head { text-shadow: 0 1px 10px rgba(var(--shade), .9); }
.contact-intro .head p:not(.kicker) { color: var(--soft); }
.contact dl { margin: 0; display: grid; gap: 1rem; background: rgba(var(--shade), .7); padding: .8rem 1rem; justify-self: start; }
.contact dt { font: 500 .75rem var(--f-mono); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.contact dd { margin: .15rem 0 0; font-size: 1.1rem; }
.wa-box { display: grid; gap: .75rem; justify-items: start; }
.wa-panel { display: grid; gap: .5rem; width: 100%; max-width: 26rem; background: rgba(12,38,64,.85); border: 1px solid var(--line); padding: 1rem; }
.wa-panel label { font-size: .88rem; font-weight: 600; }
.wa-panel select, .wa-panel input:not([type=checkbox]) { font: inherit; color: var(--paper); background: var(--ink); border: 1px solid var(--line); border-radius: 2px; padding: .6rem .7rem; width: 100%; }
.wa-panel .wa-check { display: flex; gap: .5rem; align-items: flex-start; font-weight: 400; color: #cfdbe6; }
.wa-note { font-size: .82rem; color: var(--muted); }
form.quote { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; background: rgba(12,38,64,.8); backdrop-filter: blur(3px); padding: 1.75rem; border: 1px solid var(--line); }
form.quote .full { grid-column: 1 / -1; }
form.quote label { display: grid; gap: .35rem; font-size: .9rem; font-weight: 600; min-width: 0; }
form.quote input, form.quote select, form.quote textarea { font: inherit; color: var(--paper); background: var(--ink); border: 1px solid var(--line); border-radius: 2px; padding: .7rem .8rem; width: 100%; }
form.quote input:focus, form.quote select:focus, form.quote textarea:focus { border-color: var(--action-hi); outline: none; }
.form-actions { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; }
.form-msg { font-size: .95rem; color: var(--muted); }
.fine { font-size: .85rem; line-height: 1.5; color: var(--muted); }
.fine a { color: var(--paper); }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- footer ---------- */
footer.site { padding-block: 2.5rem; color: var(--muted); font-size: .9rem; }
footer.site .wrap { display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; align-items: center; }
footer.site img { height: 24px; width: auto; }

/* ---------- responsive ---------- */
@media (min-width: 861px) { .svc-video figure { aspect-ratio: 3 / 4; } }
@media (max-width: 900px) { .genre-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 860px) {
  nav.main .hide-sm { display: none; }
  .services, .contact { grid-template-columns: 1fr; }
  .steps { grid-template-columns: repeat(3, 1fr); gap: 1rem 1.25rem; }
  .steps::before { display: none; }
  .steps li { gap: .2rem; padding-right: 0; }
  .steps li::before { width: 1.6rem; height: 1.6rem; font-size: .75rem; margin-bottom: .2rem; }
  .process::before { background: linear-gradient(180deg, rgba(var(--shade), .9) 0%, rgba(var(--shade), .8) 55%, rgba(var(--shade), .15) 78%, rgba(var(--shade), 0) 100%); }
}
@media (max-width: 700px) {
  .roster { grid-template-columns: 1fr; }
  .roster .note { grid-column: 1; }
  section.about { padding-bottom: 0; display: flex; flex-direction: column; }
  .about > .bg-img { position: static; order: 2; height: auto; aspect-ratio: 4 / 3; object-position: 50% 80%; }
  .about::before, .about .caption { display: none; }
  .about > .wrap { order: 1; padding-bottom: 1.5rem; }
  .about .text { background: none; padding: 0; backdrop-filter: none; }
}
@media (max-width: 560px) {
  .faq-banner .caption { display: none; }
  .wild-grid { gap: .4rem; }
  .wild-grid figure { aspect-ratio: auto; border: 0; }
  .wild-grid img { position: static; height: auto; aspect-ratio: 3 / 4; border: 1px solid var(--line); }
  .wild-grid figcaption { position: static; background: none; padding: .35rem 0 0; font-size: .58rem; line-height: 1.3; }
}
@media (max-width: 540px) {
  .vids { grid-template-columns: 1fr; }
  .vids .vid:first-child { grid-column: auto; }
  .vids .vid:first-child .vt { font-size: 1.35rem; }
}
@media (max-width: 520px) {
  form.quote { grid-template-columns: 1fr; padding: 1.25rem; }
  .steps { grid-template-columns: 1fr 1fr; }
  section.process { padding-bottom: 13rem; }
  .process::before { background: linear-gradient(180deg, rgba(var(--shade), .9) 0%, rgba(var(--shade), .82) 64%, rgba(var(--shade), .1) 82%, rgba(var(--shade), 0) 100%); }
  .genre figcaption { padding: 2rem .6rem .6rem; }
  .genre figcaption b { font-size: .92rem; overflow-wrap: anywhere; }
  .genre figcaption span { font-size: .72rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ---------- inner pages ---------- */
nav.main a[aria-current="page"] { color: var(--paper); box-shadow: 0 2px 0 var(--bronze); }
.page-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--line); }
.page-hero > .bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.page-hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(var(--shade), .82) 0%, rgba(var(--shade), .5) 55%, rgba(var(--shade), .15) 100%); }
.page-hero .wrap { position: relative; z-index: 2; padding-block: clamp(3.5rem, 9vw, 7rem); display: grid; gap: 1.1rem; text-shadow: 0 1px 12px rgba(var(--shade), .6); }
.page-hero h1 { font-size: clamp(2.2rem, 5vw, 4rem); text-transform: uppercase; max-width: 18ch; }
.page-hero .lead { font-size: clamp(1.05rem, 1.5vw, 1.25rem); max-width: 42rem; color: var(--soft); }
.crumbs { font-family: var(--f-mono); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: #f0d2bf; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--paper); }

.prose { max-width: 46rem; display: grid; gap: 1.1rem; }
.prose p { color: #d9e3ed; }
.prose h3 { margin-top: .6rem; }

.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.card { background: var(--ink); padding: 1.6rem; display: grid; gap: .7rem; align-content: start; min-width: 0; }
.card h3 { font-size: 1.35rem; }
.card ul { margin: 0; padding-left: 1.1rem; color: #cfdbe6; display: grid; gap: .3rem; }
.card p { color: var(--muted); }

.stories { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.story { margin: 0; background: var(--panel); border: 1px solid var(--line); display: grid; min-width: 0; }
.story img { aspect-ratio: 16 / 9; }
.story div { padding: 1.4rem; display: grid; gap: .6rem; }
.story h3 { font-size: 1.4rem; }
.story p { color: #cfdbe6; }

.table-wrap { overflow-x: auto; border: 1px solid var(--line); }
table.facts { width: 100%; border-collapse: collapse; min-width: 34rem; font-variant-numeric: tabular-nums; }
table.facts th, table.facts td { text-align: left; padding: .85rem 1rem; border-bottom: 1px solid var(--line); vertical-align: top; }
table.facts th { font: 500 .72rem var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--bronze); background: var(--panel); }
table.facts td { color: #d9e3ed; }
table.facts td:first-child { color: var(--paper); font-weight: 600; }
table.facts tr:last-child td { border-bottom: 0; }

.seasons { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.season { background: var(--ink); padding: 1.6rem; display: grid; gap: .5rem; }
.season .mono { color: var(--bronze); }
.season h3 { font-size: 1.5rem; }
.season p { color: #cfdbe6; }

.locs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.locs-text { grid-template-columns: repeat(3, 1fr); margin-top: 1rem; }
.locs-text .loc { grid-template-rows: auto; border-top: 2px solid var(--action); }
.loc { margin: 0; background: var(--panel); border: 1px solid var(--line); display: grid; grid-template-rows: auto 1fr; min-width: 0; }
.loc img { aspect-ratio: 3 / 2; }
.loc div { padding: 1.1rem 1.2rem 1.3rem; display: grid; gap: .45rem; align-content: start; }
.loc .mono { color: var(--bronze); }
.loc h3 { font-size: 1.25rem; }
.loc p { color: #cfdbe6; font-size: .95rem; }

.checklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem 2rem; max-width: 52rem; }
.checklist li { padding-left: 1.4rem; position: relative; color: #d9e3ed; }
.checklist li::before { content: ""; position: absolute; left: 0; top: .65em; width: .6rem; height: 1px; background: var(--bronze); }

.credit-groups { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.cgroup { background: var(--ink); padding: 1.4rem; display: grid; gap: .7rem; align-content: start; min-width: 0; }
.cgroup h3 { font-size: 1.2rem; color: var(--bronze); }
.cgroup ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.cgroup li { display: grid; gap: .05rem; }
.cgroup li b { font-weight: 600; color: var(--paper); }
.cgroup li span { color: var(--muted); font-size: .88rem; }

.gallery { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(9rem, 16vw, 13rem); gap: .6rem; }
.gallery figure { margin: 0; position: relative; overflow: hidden; border: 1px solid var(--line); min-width: 0; }
.gallery figure.wide { grid-column: span 2; }
.gallery figure.tall { grid-row: span 2; }
.gallery img { position: absolute; inset: 0; }
.gallery figcaption { position: absolute; left: .5rem; bottom: .5rem; background: rgba(var(--shade), .8); color: var(--paper); padding: .2rem .45rem; font: 500 .65rem var(--f-mono); letter-spacing: .06em; text-transform: uppercase; }

.cta-band { position: relative; overflow: hidden; }
.cta-band > .bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cta-band::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(var(--shade), .6); }
.cta-band .wrap { position: relative; z-index: 2; padding-block: clamp(3rem, 7vw, 5rem); display: grid; gap: 1rem; justify-items: start; text-shadow: 0 1px 10px rgba(var(--shade), .8); }
.cta-band p { color: var(--soft); max-width: 36rem; }

.more-link { display: inline-block; margin-top: 1.5rem; font-weight: 600; text-decoration: none; color: var(--paper); border-bottom: 1px solid var(--bronze); padding-bottom: .15rem; }
.more-link:hover { color: var(--bronze); }
.section-gap { display: grid; gap: clamp(3rem, 6vw, 4.5rem); }

@media (max-width: 900px) { .locs, .credit-groups { grid-template-columns: 1fr 1fr; } .gallery { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) { .stories, .seasons, .checklist { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .locs, .credit-groups { grid-template-columns: 1fr; } .gallery figure.wide { grid-column: auto; } }
.section-gap > * { min-width: 0; }
.cgroup:last-child:nth-child(3n+1) { grid-column: 1 / -1; }
.cgroup:last-child:nth-child(3n+1) ul { grid-template-columns: repeat(3, 1fr); gap: .55rem 1.5rem; }
@media (max-width: 900px) { .locs { grid-template-columns: 1fr 1fr; } .cgroup:last-child:nth-child(3n+1) ul { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .locs-text { grid-template-columns: 1fr; } .cgroup:last-child:nth-child(3n+1) ul { grid-template-columns: 1fr; } }
.kit { display: grid; grid-template-columns: 1fr 2fr; gap: 2.5rem; max-width: 60rem; }
.kit > div { min-width: 0; display: grid; gap: .8rem; align-content: start; }
.kit h3 { font-size: 1.35rem; }
.kit ul { margin: 0; padding-left: 1.1rem; color: #d9e3ed; display: grid; gap: .3rem; }
.kit .note { color: #f0d2bf; font-size: .95rem; }
@media (max-width: 700px) { .kit { grid-template-columns: 1fr; } }
.kit .chips { display: block; columns: 3; column-gap: 1.5rem; }
.kit .chips li { display: block; break-inside: avoid; padding: .15rem 0; }
.kit .chips li:not(:last-child)::after { content: none; }
@media (max-width: 560px) { .kit .chips { columns: 2; } }
.page-hero h1 em { font-style: normal; text-decoration: underline; text-decoration-color: var(--bronze); text-decoration-thickness: .08em; text-underline-offset: .12em; }
.page-hero .lead a { color: var(--paper); text-decoration-color: var(--bronze); }
.card .go { font-weight: 600; color: var(--paper); text-decoration: none; margin-top: .3rem; }
.card .go:hover, .card a:hover { color: var(--action-hi); }
.card a { color: inherit; text-decoration-color: var(--bronze); }
.steps.steps-5 { grid-template-columns: repeat(5, 1fr); }
.network .roster .note a { color: var(--paper); white-space: nowrap; }
.kit-sec { min-height: 0; }

.info3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.info3 > div { background: rgba(var(--shade), .82); padding: 1.5rem; display: grid; gap: .6rem; align-content: start; min-width: 0; }
.info3 h3 { font-size: 1.4rem; }
.info3 p:not(.kicker) { color: #dfe8f1; font-size: .97rem; }

.regions { display: grid; gap: 1.25rem; }
.region { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); background: var(--panel); border: 1px solid var(--line); }
.region.noimg { grid-template-columns: 1fr; border-top: 2px solid var(--action); }
.region figure { margin: 0; min-height: 16rem; }
.region > div { padding: 1.5rem 1.75rem; display: grid; gap: 1rem; align-content: start; }
.region h3 { font-size: 1.6rem; color: var(--bronze); }
.region dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .9rem 1.75rem; }
.region.noimg dl { grid-template-columns: repeat(3, 1fr); }
.region dt { font-weight: 600; color: var(--paper); }
.region dd { margin: .15rem 0 0; color: #cfdbe6; font-size: .93rem; }

@media (max-width: 900px) { .info3 { grid-template-columns: 1fr; } .region, .region.noimg dl { grid-template-columns: 1fr; } .region.noimg dl { grid-template-columns: 1fr 1fr; } .region figure { min-height: 0; aspect-ratio: 16 / 9; } }
@media (max-width: 560px) { .region dl, .region.noimg dl { grid-template-columns: 1fr; } }
.bar-end { display: flex; gap: 1.25rem; align-items: center; }
.bar-end .btn { color: #fff; }
@media (max-width: 860px) {
  .bar { gap: .5rem 1rem; }
  nav.pages { order: 3; width: 100%; flex-wrap: nowrap; overflow-x: auto; gap: .95rem; padding-bottom: .35rem; scrollbar-width: none; }
  nav.pages a { white-space: nowrap; font-size: .86rem; }
  .bar-end { gap: .9rem; }
  .bar-end .btn { padding: .65rem 1rem; font-size: .9rem; }
}
body { margin: 0; }
@media (max-width: 560px) {
  .logo img { height: 26px; }
  .bar-end { gap: .7rem; }
  .bar-end .btn { padding: .55rem .8rem; }
  .hide-xs { display: none; }
}
.region figure { position: relative; overflow: hidden; }
.region figure img { position: absolute; inset: 0; }

/* ---------- placeholders (photos to come) ---------- */
.ph-box { width: 100%; height: 100%; min-height: 12rem; display: grid; place-content: center; justify-items: center; gap: .35rem; text-align: center; padding: 1.25rem; background: repeating-linear-gradient(135deg, #0d2944 0 14px, #0b243c 14px 28px); border: 1px dashed rgba(200,137,106,.55); color: var(--bronze); }
.ph-box span { font: 600 1.3rem var(--f-display); text-transform: uppercase; letter-spacing: .06em; }
.ph-box small { font: 400 .78rem var(--f-mono); color: var(--muted); max-width: 22ch; }
.ph-box.tall { min-height: 22rem; }
.story .ph-box { aspect-ratio: 16 / 9; height: auto; min-height: 0; }
.region figure .ph-box { position: absolute; inset: 0; min-height: 0; }
.gallery.ph-gallery { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 12rem; }
.gallery.ph-gallery figure { border: 0; }

/* ---------- sections without photo ---------- */
.page-hero.plain { background: radial-gradient(120% 140% at 85% 0%, #123a5e 0%, var(--ink) 60%); }
.page-hero.plain::before { display: none; }
.contact-sec.plain { background: radial-gradient(110% 120% at 100% 100%, #123a5e 0%, var(--ink) 65%); }
.contact-sec.plain::before { display: none; }
.plain-steps { background: var(--panel); border-block: 1px solid var(--line); }
.plain-steps .steps li::before { background: var(--panel); }

.kit-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 2.5rem; align-items: stretch; }
.kit-grid .kit { grid-template-columns: 1fr 1.6fr; }
.kit-grid .kit .chips { columns: 2; }

.parks { background: var(--panel); border-block: 1px solid var(--line); }
.parks-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 2.5rem; align-items: center; }
.duo { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.duo img { aspect-ratio: 3 / 4; border: 1px solid var(--line); }
.duo figcaption { grid-column: 1 / -1; color: var(--bronze); font-size: .72rem; }
.info2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); }
.info2 > div { background: var(--ink); padding: 1.75rem; display: grid; gap: .6rem; align-content: start; }
.info2 h3 { font-size: 1.45rem; }
.info2 p:not(.kicker) { color: #cfdbe6; }

@media (max-width: 860px) {
  .kit-grid, .parks-grid, .info2 { grid-template-columns: 1fr; }
  .kit-grid .ph-box.tall { min-height: 14rem; }
  .gallery.ph-gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 9rem; }
}
@media (max-width: 560px) { .kit-grid .kit { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .steps, .steps.steps-5 { grid-template-columns: 1fr 1fr; } .steps b { overflow-wrap: anywhere; } }
.kits .card .kicker { font-size: .8rem; }
.kits .card li { font-size: .95rem; }
.crew-cols .chips { display: block; columns: 3; column-gap: 1.5rem; }
.crew-cols .chips li { display: block; break-inside: avoid; padding: .2rem 0; }
.crew-cols .chips li:not(:last-child)::after { content: none; }
#equipment { padding-bottom: 0; }
@media (max-width: 560px) { .crew-cols .chips { columns: 2; } }
.cgroup li b a { color: var(--paper); text-decoration: none; border-bottom: 1px solid var(--bronze); }
.cgroup li b a:hover { color: var(--action-hi); }
.cgroup li b a span { color: var(--bronze); font-size: .8em; }
.cgroup li b a { color: var(--paper); text-decoration: none; border-bottom: 1px solid var(--bronze); }
.cgroup li b a:hover { color: var(--action-hi); }
.cgroup li b a span { color: var(--bronze); font-size: .8em; }
.cgroup li { align-content: start; }
.vids.vids4 { grid-template-columns: repeat(4, 1fr); gap: 1.75rem 1rem; }
.vids.vids4 .vid:first-child { grid-column: auto; }
.vids.vids4 .vid:first-child .vt, .vids.vids4 .vt { font-size: 1.05rem; }
.thumb iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.yt-thumb { background: radial-gradient(120% 120% at 20% 0%, #164a74 0%, var(--panel) 70%); }
.yt-thumb::before { content: attr(data-label); position: absolute; left: .8rem; top: .7rem; right: .8rem; font: 500 .7rem var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--bronze); }
.yt-thumb img { z-index: 1; }
.yt-thumb .play { z-index: 2; }
.more-prod { margin-top: 2.5rem; }
@media (max-width: 900px) { .vids.vids4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .vids.vids4 { grid-template-columns: 1fr; } }
.kit-photos { display: grid; grid-template-columns: 1fr 1.5fr; gap: .75rem; margin-bottom: 1.25rem; }
.kit-photos figure { margin: 0; position: relative; height: clamp(14rem, 28vw, 22rem); overflow: hidden; border: 1px solid var(--line); }
.kit-photos img { position: absolute; inset: 0; }
.kit-photos figcaption, .crew-photo figcaption { position: absolute; left: .6rem; bottom: .6rem; background: rgba(var(--shade), .8); color: var(--paper); padding: .25rem .5rem; font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; }
.crew-photo { margin: 0; position: relative; min-height: 22rem; overflow: hidden; border: 1px solid var(--line); }
.crew-photo img { position: absolute; inset: 0; }
@media (max-width: 860px) { .crew-photo { min-height: 18rem; } }
@media (max-width: 560px) { .kit-photos { grid-template-columns: 1fr; } }
.intro-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 2.5rem; align-items: center; }
.intro-photo { margin: 0; position: relative; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--line); }
.intro-photo img { position: absolute; inset: 0; }
.intro-photo figcaption { position: absolute; left: .6rem; bottom: .6rem; background: rgba(var(--shade), .8); color: var(--paper); padding: .25rem .5rem; font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; }
.kit-photos.kp3 { grid-template-columns: 1fr 1.6fr 1fr; }
@media (max-width: 860px) { .intro-split { grid-template-columns: 1fr; } .kit-photos.kp3 { grid-template-columns: 1fr 1fr; } .kit-photos.kp3 figure:nth-child(2) { grid-column: 1 / -1; order: -1; } }
@media (max-width: 560px) { .kit-photos.kp3 { grid-template-columns: 1fr; } }
.crew-row { grid-template-columns: 1fr 1fr 1fr; }
.crew-cols { margin-top: 1.5rem; }
.crew-cols .chips { columns: 4; }
@media (max-width: 860px) { .crew-row { grid-template-columns: 1fr 1fr; } .crew-row figure:nth-child(2) { order: 0; grid-column: auto; } .crew-cols .chips { columns: 3; } }
@media (max-width: 560px) { .crew-row { grid-template-columns: 1fr; } .crew-cols .chips { columns: 2; } }
.wide-photo { margin: 0 0 1.25rem; position: relative; aspect-ratio: 21 / 8; overflow: hidden; border: 1px solid var(--line); }
.wide-photo img { position: absolute; inset: 0; }
.wide-photo figcaption { position: absolute; left: .6rem; bottom: .6rem; background: rgba(var(--shade), .8); color: var(--paper); padding: .25rem .5rem; font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; }
.duo.trio { grid-template-columns: 1fr 1fr; }
.duo.trio img:nth-of-type(3) { grid-column: 1 / -1; aspect-ratio: 16 / 7; }
.info-img { aspect-ratio: 16 / 8; height: auto; margin: -1.75rem -1.75rem .6rem; width: calc(100% + 3.5rem); max-width: none; }
.region figure.stack { display: grid; grid-template-rows: 1fr 1fr; gap: 2px; min-height: 26rem; }
.region figure.stack .cell { position: relative; overflow: hidden; }
.region figure.stack .cell img { position: absolute; inset: 0; }
@media (max-width: 900px) { .region figure.stack { min-height: 0; aspect-ratio: auto; grid-template-rows: none; grid-template-columns: 1fr 1fr; } .region figure.stack .cell { aspect-ratio: 4 / 3; } }
@media (max-width: 560px) { .wide-photo { aspect-ratio: 16 / 9; } }
.fixer-photos { grid-template-columns: 1fr 1fr; margin: 1.25rem 0 0; }
@media (max-width: 560px) { .fixer-photos { grid-template-columns: 1fr; } }
.about.about-plain { background: radial-gradient(110% 130% at 90% 10%, #123a5e 0%, var(--panel) 55%, var(--ink) 100%); border-block: 1px solid var(--line); }
.about.about-plain::before { display: none; }
.about.about-plain .text { max-width: 46rem; background: none; padding: 0; backdrop-filter: none; }
.kit-photos.kp2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 560px) { .kit-photos.kp2 { grid-template-columns: 1fr; } }
.page-hero.hero-right .wrap { justify-items: end; text-align: right; }
.page-hero.hero-right .wrap > * { max-width: 34rem; }
.page-hero.hero-right .ctas { justify-content: flex-end; }
.page-hero.hero-right::before { background: linear-gradient(270deg, rgba(var(--shade), .85) 0%, rgba(var(--shade), .55) 45%, rgba(var(--shade), .05) 75%); }
@media (max-width: 760px) {
  .page-hero.hero-right .wrap { justify-items: start; text-align: left; }
  .page-hero.hero-right .ctas { justify-content: flex-start; }
  .page-hero.hero-right::before { background: linear-gradient(180deg, rgba(var(--shade), .35) 0%, rgba(var(--shade), .85) 100%); }
}
@media (max-width: 760px) {
  .page-hero.hero-right { display: flex; flex-direction: column; }
  .page-hero.hero-right > .bg-img { position: static; height: auto; aspect-ratio: 16 / 9; object-position: 30% 30%; }
  .page-hero.hero-right::before { display: none; }
  .page-hero.hero-right .wrap { padding-block: 1.75rem 2.5rem; text-shadow: none; }
}
.kit-photos.crew-row { grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 13rem 13rem; }
.kit-photos.crew-row figure { height: auto; }
.crew-row figure.tall { grid-row: span 2; }
.crew-row figure:nth-child(1) { grid-column: 1; grid-row: 1 / 3; }
.crew-row figure:nth-child(2) { grid-column: 2 / 4; grid-row: 1; }
.crew-row figure:nth-child(3) { grid-column: 2; grid-row: 2; }
.crew-row figure:nth-child(4) { grid-column: 3; grid-row: 2; }
.crew-row figure:nth-child(5) { grid-column: 4; grid-row: 1 / 3; }
@media (max-width: 760px) {
  .kit-photos.crew-row { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 11rem; }
  .crew-row figure:nth-child(n) { grid-column: auto; grid-row: auto; }
  .crew-row figure.tall { grid-row: span 2; }
  .crew-row figure:nth-child(2) { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .crew-row figure:nth-child(5) { grid-column: 1 / -1; grid-row: span 2; }
}
.kit-photos.mosaic4 { grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 13rem 13rem; }
.mosaic4 figure { height: auto; }
.mosaic4 figure:nth-child(1) { grid-column: 1; grid-row: 1 / 3; }
.mosaic4 figure:nth-child(2) { grid-column: 2 / 4; grid-row: 1; }
.mosaic4 figure:nth-child(3) { grid-column: 2 / 4; grid-row: 2; }
.mosaic4 figure:nth-child(4) { grid-column: 4; grid-row: 1 / 3; }
@media (max-width: 760px) {
  .kit-photos.mosaic4 { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 11rem; }
  .mosaic4 figure:nth-child(1), .mosaic4 figure:nth-child(4) { grid-column: auto; grid-row: span 2; }
  .mosaic4 figure:nth-child(2), .mosaic4 figure:nth-child(3) { grid-column: 1 / -1; grid-row: auto; }
  .mosaic4 figure:nth-child(1) { order: 1; } .mosaic4 figure:nth-child(4) { order: 2; } .mosaic4 figure:nth-child(2) { order: 3; } .mosaic4 figure:nth-child(3) { order: 4; }
}
.kit-photos.mosaic5 { grid-template-columns: repeat(6, 1fr); grid-template-rows: 21rem 15rem; }
.mosaic5 figure { height: auto; }
.mosaic5 figure:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
.mosaic5 figure:nth-child(2) { grid-column: 3 / 5; grid-row: 1; }
.mosaic5 figure:nth-child(5) { grid-column: 5 / 7; grid-row: 1; }
.mosaic5 figure:nth-child(3) { grid-column: 1 / 4; grid-row: 2; }
.mosaic5 figure:nth-child(4) { grid-column: 4 / 7; grid-row: 2; }
@media (max-width: 760px) {
  .kit-photos.mosaic5 { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 11rem; }
  .mosaic5 figure:nth-child(n) { grid-column: 1 / -1; grid-row: auto; }
  .mosaic5 figure:nth-child(1) { grid-column: 1 / -1; grid-row: span 2; order: 1; }
  .mosaic5 figure:nth-child(2) { grid-column: 1; grid-row: span 2; order: 2; }
  .mosaic5 figure:nth-child(5) { grid-column: 2; grid-row: span 2; order: 2; }
  .mosaic5 figure:nth-child(3) { order: 3; } .mosaic5 figure:nth-child(4) { order: 4; }
}
.mosaic6 figure:nth-child(3) { grid-column: 1 / 3; grid-row: 2; }
.mosaic6 figure:nth-child(4) { grid-column: 3 / 5; grid-row: 2; }
.mosaic6 figure:nth-child(6) { grid-column: 5 / 7; grid-row: 2; }
@media (max-width: 760px) {
  .mosaic6 figure:nth-child(3), .mosaic6 figure:nth-child(4), .mosaic6 figure:nth-child(6) { grid-column: 1 / -1; grid-row: auto; }
  .mosaic6 figure:nth-child(6) { order: 5; }
}

/* ---------- photo backgrounds behind text ---------- */
.photo-bg.bgx::before { background: linear-gradient(180deg, rgba(var(--shade), .82) 0%, rgba(var(--shade), .66) 100%); display: block; }
.photo-bg.bgx { text-shadow: 0 1px 8px rgba(var(--shade), .7); }
.photo-bg.bgx .faq details { background: rgba(var(--shade), .6); }
.photo-bg.bgx .checklist li, .photo-bg.bgx .head p { color: #eef3f8; }
.contact-sec.bgx > .bg-img { filter: none; object-position: 50% 50%; }
.contact-sec.bgx::before { background: linear-gradient(90deg, rgba(var(--shade), .8) 0%, rgba(var(--shade), .6) 100%); }
.about.about-plain.bgx { background: none; border-block: 0; }
.about.about-plain.bgx::before { display: block; background: linear-gradient(90deg, rgba(var(--shade), .88) 0%, rgba(var(--shade), .7) 55%, rgba(var(--shade), .25) 100%); }
.about.bgx > .bg-img { object-position: 50% 80%; }
.plain-steps.bgx { background: none; }
.plain-steps.bgx .steps li::before { background: rgba(var(--shade), .85); }

.cards.cards-photo { position: relative; overflow: hidden; grid-template-columns: repeat(3, 1fr); background: none; gap: 0; }
.cards-photo > .bg-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; z-index: 0; }
.cards-photo .card { position: relative; z-index: 1; background: rgba(var(--shade), .84); box-shadow: 0 0 0 1px var(--line); }
.cards-photo .card-window { grid-column: span 2; min-height: 15rem; position: relative; z-index: 1; }
@media (max-width: 900px) { .cards.cards-photo { grid-template-columns: 1fr 1fr; } .cards-photo .card-window { grid-column: 1 / -1; min-height: 14rem; } }
@media (max-width: 560px) { .cards.cards-photo { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .about.about-plain.bgx { display: block; } .about.about-plain.bgx > .bg-img { position: absolute; height: 100%; aspect-ratio: auto; } .about.about-plain.bgx::before { display: block; } }
@media (max-width: 900px) {
  .cards-photo > .bg-img { position: static; grid-column: 1 / -1; order: 99; height: auto; aspect-ratio: 3 / 2; z-index: 1; }
  .cards-photo .card-window { display: none; }
  .cards-photo .card { background: var(--ink); }
}
/* village photo: shown whole in the free space beside the last card */
.cards.cards-photo { background: var(--line); gap: 1px; }
.cards-photo .card { background: var(--ink); box-shadow: none; }
.cards-photo .card-window { display: none; }
.cards-photo > .bg-img { position: static; order: 99; grid-column: span 2; width: 100%; height: 100%; min-height: 17rem; object-fit: cover; object-position: 50% 80% !important; z-index: 1; }
@media (max-width: 900px) { .cards-photo > .bg-img { grid-column: 1 / -1; height: auto; min-height: 0; aspect-ratio: 3 / 2; } }
@media (min-width: 901px) {
  .cards-photo > .bg-img { height: 0; min-height: 100%; }
  .cards-photo .card:nth-of-type(4) { min-height: 19rem; }
}
.genre-grid.g5 { grid-template-columns: repeat(5, 1fr); }
.genre-grid.g5 .genre { aspect-ratio: 3 / 4; }
.genre-ph .ph-box { position: absolute; inset: 0; min-height: 0; align-content: start; padding-top: 30%; }
.genre-grid.g5 figcaption b { font-size: 1.02rem; }
.genre-grid.g5 figcaption span { font-size: .8rem; }
@media (max-width: 1000px) { .genre-grid.g5 { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 620px) { .genre-grid.g5 { grid-template-columns: 1fr 1fr; } .genre-grid.g5 .genre:last-child { grid-column: 1 / -1; aspect-ratio: 16 / 9; } }
.genre-grid.g6 { grid-template-columns: repeat(3, 1fr); }
.genre-grid.g6 .genre { aspect-ratio: 4 / 3; }
.genre-grid.g6 .genre-ph .ph-box { padding-top: 14%; }
@media (max-width: 700px) { .genre-grid.g6 { grid-template-columns: 1fr 1fr; } .genre-grid.g6 .genre { aspect-ratio: 4 / 5; } .genre-grid.g6 .genre-ph .ph-box { padding-top: 30%; } }
/* productions grid: tall photography card, wide commercials card */
.genre-grid.gmix { grid-template-columns: repeat(4, 1fr); grid-template-rows: 16rem 16rem; }
.genre-grid.gmix .genre { aspect-ratio: auto; }
.gmix .genre:nth-child(1) { grid-column: 1; grid-row: 1; }
.gmix .genre:nth-child(2) { grid-column: 2; grid-row: 1 / 3; }
.gmix .genre:nth-child(3) { grid-column: 3 / 5; grid-row: 1; }
.gmix .genre:nth-child(4) { grid-column: 1; grid-row: 2; }
.gmix .genre:nth-child(5) { grid-column: 3; grid-row: 2; }
.gmix .genre:nth-child(6) { grid-column: 4; grid-row: 2; }
@media (max-width: 860px) {
  .genre-grid.gmix { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 12.5rem; }
  .genre-grid.gmix .genre { aspect-ratio: auto; }
  .gmix .genre:nth-child(1) { grid-column: 1; grid-row: 1; }
  .gmix .genre:nth-child(2) { grid-column: 2; grid-row: 1 / 3; }
  .gmix .genre:nth-child(3) { grid-column: 1; grid-row: 2; }
  .gmix .genre:nth-child(4) { grid-column: 1; grid-row: 3; }
  .gmix .genre:nth-child(5) { grid-column: 2; grid-row: 3; }
  .gmix .genre:nth-child(6) { grid-column: 1 / -1; grid-row: 4; }
}
.genre-grid.gmix .genre-ph .ph-box { padding-top: 2.2rem; }
.news-img { object-position: 50% 78%; }
@media (max-width: 860px) { .news-img { object-position: 50% 57%; } }
/* crew photos: four */
.kit-photos.crew-row.crew4 { grid-template-columns: 1fr 1fr 1fr; grid-template-rows: 13rem 13rem; }
.crew4 figure:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
.crew4 figure:nth-child(2) { grid-column: 1; grid-row: 2; }
.crew4 figure:nth-child(3) { grid-column: 2; grid-row: 2; }
.crew4 figure:nth-child(4) { grid-column: 3; grid-row: 1 / 3; }
@media (max-width: 760px) {
  .kit-photos.crew-row.crew4 { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 11rem; }
  .crew4 figure:nth-child(1) { grid-column: 1 / -1; grid-row: auto; }
  .crew4 figure:nth-child(2), .crew4 figure:nth-child(3) { grid-column: auto; grid-row: auto; }
  .crew4 figure:nth-child(4) { grid-column: 1 / -1; grid-row: span 2; }
}
/* airport photo behind the left column (Permits + Safety) */
.cards-photo .col-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; z-index: 0; grid-column: 1; grid-row: 1 / 3; max-width: none; }
.cards-photo .card:nth-of-type(1), .cards-photo .card:nth-of-type(4) { background: linear-gradient(180deg, rgba(var(--shade), .8), rgba(var(--shade), .7)); text-shadow: 0 1px 6px rgba(var(--shade), .9); }
.cards-photo .card:nth-of-type(4) { box-shadow: 0 -1px 0 var(--line); }
.cards-photo .card:nth-of-type(1) li, .cards-photo .card:nth-of-type(4) li { color: #f1f5f9; }
.cards-photo .card:nth-of-type(1) { grid-column: 1; grid-row: 1; }
.cards-photo .card:nth-of-type(4) { grid-column: 1; grid-row: 2; }
.cards-photo .card:nth-of-type(2) { grid-column: 2; grid-row: 1; }
.cards-photo .card:nth-of-type(3) { grid-column: 3; grid-row: 1; }
.cards-photo > .bg-img { grid-column: 2 / 4; grid-row: 2; }
@media (max-width: 900px) {
  .cards-photo .card:nth-of-type(3) { grid-column: 2; grid-row: 2; }
  .cards-photo > .bg-img { grid-column: 1 / -1; grid-row: 3; }
}
@media (max-width: 560px) {
  .cards-photo .card:nth-of-type(2) { grid-column: 1; grid-row: 3; }
  .cards-photo .card:nth-of-type(3) { grid-column: 1; grid-row: 4; }
  .cards-photo > .bg-img { grid-row: 5; }
}
/* three photos under the cards */
.kit-photos.mosaic3 { grid-template-columns: 1fr 1fr 1fr; }
.kit-photos.mosaic3 figure { height: 19rem; }
@media (max-width: 760px) { .kit-photos.mosaic3 { grid-template-columns: 1fr; } .kit-photos.mosaic3 figure { height: 15rem; } }
/* airport photo: whole photo visible, lighter overlay */
.cards-photo .col-bg { inset: auto 0 0 0; height: auto; aspect-ratio: 3 / 4; object-position: 50% 50%; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%); mask-image: linear-gradient(180deg, transparent 0, #000 22%); }
.cards-photo .card:nth-of-type(1) { background: linear-gradient(180deg, rgba(var(--shade), .92) 0%, rgba(var(--shade), .55) 100%); }
.cards-photo .card:nth-of-type(4) { background: rgba(var(--shade), .38); box-shadow: none; }
.cards-photo .card:nth-of-type(1), .cards-photo .card:nth-of-type(4) { text-shadow: 0 1px 3px rgba(var(--shade), 1), 0 0 10px rgba(var(--shade), .95); }
.cards-photo .card:nth-of-type(4) li, .cards-photo .card:nth-of-type(4) h3 { color: #fff; font-weight: 600; }
.cards.cards-photo { grid-template-rows: repeat(2, auto); }
.cards-photo .col-bg { grid-column: 1 / 2; grid-row: 1 / 3; }
@media (max-width: 900px) { .cards.cards-photo { grid-template-rows: repeat(3, auto); } }
@media (max-width: 560px) { .cards.cards-photo { grid-template-rows: repeat(5, auto); } }

/* ---------- "Everything on the ground": cards over photos + two photo cells ---------- */
.cards.ground { position: relative; overflow: hidden; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, auto); gap: 1px; background: var(--line); }
.ground .gbg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; z-index: 0; }
.ground .g1 { grid-column: 1 / 2; grid-row: 1 / 3; inset: auto 0 0 0; height: auto; aspect-ratio: 3 / 4; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 22%); mask-image: linear-gradient(180deg, transparent 0, #000 22%); background: var(--ink); }
.ground .g2 { grid-column: 2 / 3; grid-row: 1 / 2; object-position: 18% 50%; }
.ground .g3 { grid-column: 3 / 4; grid-row: 1 / 2; object-position: 72% 50%; }
.ground .card { position: relative; z-index: 1; text-shadow: 0 1px 3px rgba(var(--shade), 1), 0 0 10px rgba(var(--shade), .95); }
.ground .card li, .ground .card h3 { color: #fff; }
.ground .card li { font-weight: 600; }
.ground .card:nth-of-type(1) { grid-column: 1; grid-row: 1; background: linear-gradient(180deg, rgba(var(--shade), .92) 0%, rgba(var(--shade), .55) 100%); }
.ground .card:nth-of-type(2) { grid-column: 2; grid-row: 1; background: rgba(var(--shade), .5); }
.ground .card:nth-of-type(3) { grid-column: 3; grid-row: 1; background: rgba(var(--shade), .5); }
.ground .card:nth-of-type(4) { grid-column: 1; grid-row: 2; background: rgba(var(--shade), .38); min-height: 19rem; }
.gphoto { margin: 0; position: relative; overflow: hidden; z-index: 1; min-height: 14rem; background: var(--ink); }
.gphoto img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; max-width: none; }
.gphoto figcaption { position: absolute; left: .6rem; bottom: .6rem; background: rgba(var(--shade), .8); color: var(--paper); padding: .25rem .5rem; font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; }
.ground .gp1 { grid-column: 2; grid-row: 2; }
.ground .gp1 img { top: -42%; height: 150%; object-position: 58% 50%; }
.ground .gp2 { grid-column: 3; grid-row: 2; }
.ground .gp2 img { object-position: 40% 22%; }
@media (max-width: 900px) {
  .cards.ground { grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, auto); }
  .ground .card:nth-of-type(3) { grid-column: 2; grid-row: 2; }
  .ground .g3 { grid-column: 2 / 3; grid-row: 2 / 3; }
  .ground .gp1 { grid-column: 1; grid-row: 3; min-height: 16rem; }
  .ground .gp2 { grid-column: 2; grid-row: 3; min-height: 16rem; }
}
@media (max-width: 560px) {
  .cards.ground { grid-template-columns: 1fr; grid-template-rows: repeat(6, auto); }
  .ground .card:nth-of-type(2) { grid-column: 1; grid-row: 3; }
  .ground .card:nth-of-type(3) { grid-column: 1; grid-row: 4; }
  .ground .g2 { grid-column: 1 / 2; grid-row: 3 / 4; }
  .ground .g3 { grid-column: 1 / 2; grid-row: 4 / 5; }
  .ground .gp1 { grid-column: 1; grid-row: 5; min-height: 15rem; }
  .ground .gp1 img { top: 0; height: 100%; object-position: 55% 80%; }
  .ground .gp2 { grid-column: 1; grid-row: 6; min-height: 17rem; }
}
.ground .gp1 img { top: 0; height: 100%; object-position: 45% 60%; }
@media (max-width: 560px) { .ground .gp1 img { object-position: 45% 60%; } }
@media (min-width: 861px) { .network .head p:last-child { max-width: 27rem; } }
/* one baobab photo behind Hary's message and the fixer questions */
.photo-bg.span2 > .bg-img { object-position: 50% 100%; }
.photo-bg.span2::before { background: linear-gradient(90deg, rgba(var(--shade), .86) 0%, rgba(var(--shade), .62) 50%, rgba(var(--shade), .12) 100%); }
.photo-bg.span2 > section { position: relative; z-index: 2; background: none; border: 0; text-shadow: 0 1px 8px rgba(var(--shade), .7); }
.span2 .about.about-plain { background: none; border-block: 0; }
.span2 .about.about-plain::before { display: none; }
.span2 .faq { max-width: 44rem; }
.span2 .faq details { background: rgba(var(--shade), .55); }
@media (max-width: 860px) { .photo-bg.span2::before { background: rgba(var(--shade), .78); } }
.ground .gp1 img { object-position: 46% 30%; }
@media (max-width: 560px) { .ground .gp1 img { object-position: 46% 30%; } }
.ground .gp1 img { object-position: 62% 50%; }
@media (max-width: 560px) { .ground .gp1 img { object-position: 62% 50%; } }
.ground .gp1 img { object-position: 54% 50%; }
@media (min-width: 561px) { .ground .gp1 img { object-position: 55% 50%; } }
/* baobab avenue full width at the bottom, text up in the sky */
.photo-bg.span2 { background: #0e2238; }
.photo-bg.span2 > .bg-img { inset: auto 0 0 0; width: 100%; height: auto; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 30%); mask-image: linear-gradient(180deg, transparent 0, #000 30%); }
.photo-bg.span2::before { background: linear-gradient(180deg, rgba(var(--shade), .78) 0%, rgba(var(--shade), .7) 48%, rgba(var(--shade), .12) 72%, rgba(var(--shade), 0) 100%); }
.span2 section.about { display: block; padding-top: clamp(2.5rem, 5vw, 3.5rem); padding-bottom: clamp(13rem, 31vw, 27rem); }
.span2 .about > .wrap { padding-bottom: 0; }
.sky-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.span2 .about.about-plain .text { max-width: none; }
.sky-faq .head { margin-bottom: 1.25rem; }
.sky-faq .faq { max-width: none; }
.sky-faq .more-link { margin-top: 1rem; }
@media (max-width: 860px) {
  .sky-grid { grid-template-columns: 1fr; }
  .photo-bg.span2::before { background: linear-gradient(180deg, rgba(var(--shade), .8) 0%, rgba(var(--shade), .75) 70%, rgba(var(--shade), .1) 90%, rgba(var(--shade), 0) 100%); }
  .span2 section.about { padding-bottom: 46vw; }
}
/* desktop: wide cell for the buggy + plane photo, narrow portrait cell for rose quartz */
@media (min-width: 901px) {
  .cards.ground { grid-template-columns: repeat(6, 1fr); }
  .ground .g1 { grid-column: 1 / 3; }
  .ground .g2 { grid-column: 3 / 5; }
  .ground .g3 { grid-column: 5 / 7; }
  .ground .card:nth-of-type(1) { grid-column: 1 / 3; }
  .ground .card:nth-of-type(2) { grid-column: 3 / 5; }
  .ground .card:nth-of-type(3) { grid-column: 5 / 7; }
  .ground .card:nth-of-type(4) { grid-column: 1 / 3; }
  .ground .gp1 { grid-column: 3 / 6; }
  .ground .gp2 { grid-column: 6 / 7; }
  .ground .gp1 img { object-position: 50% 75%; }
  .ground .gp2 img { object-position: 45% 20%; }
}
/* local crew: photo in the free space beside the intro */
.crew-top { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .75rem; align-items: stretch; margin-bottom: .75rem; }
.crew-top .head { margin-bottom: 0; padding: 0 1.5rem 1.5rem 0; align-content: end; }
.crew-top figure { margin: 0; position: relative; overflow: hidden; border: 1px solid var(--line); min-height: 15rem; }
.crew-top figure img { position: absolute; inset: 0; }
@media (max-width: 760px) { .crew-top { grid-template-columns: 1fr; } .crew-top .head { padding: 0 0 1rem; } .crew-top figure { min-height: 0; aspect-ratio: 3 / 2; } }
@media (min-width: 761px) { .crew-top { grid-template-columns: repeat(3, minmax(0, 1fr)); } .crew-top .head { grid-column: 1 / 3; } }
/* local crew: five photos, no empty cells at any width */
.kit-photos.crew5 { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: 14rem 14rem; }
.crew5 figure { height: auto; }
.crew5 figure:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
.crew5 figure:nth-child(2) { grid-column: 3; grid-row: 1; }
.crew5 figure:nth-child(3) { grid-column: 1; grid-row: 2; }
.crew5 figure:nth-child(4) { grid-column: 2 / 4; grid-row: 2; }
.crew5 figure:nth-child(5) { grid-column: 4; grid-row: 1 / 3; }
@media (max-width: 760px) {
  .kit-photos.crew5 { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 11rem; }
  .crew5 figure:nth-child(1) { grid-column: 1 / -1; grid-row: 1; }
  .crew5 figure:nth-child(2) { grid-column: 1; grid-row: 2; }
  .crew5 figure:nth-child(3) { grid-column: 2; grid-row: 2; }
  .crew5 figure:nth-child(4) { grid-column: 1 / -1; grid-row: 3; }
  .crew5 figure:nth-child(5) { grid-column: 1 / -1; grid-row: 4 / 6; }
}
/* local crew: four photos, no empty cells */
.kit-photos.crewq { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: 14rem 14rem; }
.crewq figure { height: auto; }
.crewq figure:nth-child(1) { grid-column: 1 / 3; grid-row: 1; }
.crewq figure:nth-child(2) { grid-column: 1; grid-row: 2; }
.crewq figure:nth-child(3) { grid-column: 2; grid-row: 2; }
.crewq figure:nth-child(4) { grid-column: 3; grid-row: 1 / 3; }
@media (max-width: 760px) {
  .kit-photos.crewq { grid-template-columns: 1fr 1fr; grid-template-rows: none; grid-auto-rows: 11rem; }
  .crewq figure:nth-child(1) { grid-column: 1 / -1; grid-row: 1; }
  .crewq figure:nth-child(2) { grid-column: 1; grid-row: 2; }
  .crewq figure:nth-child(3) { grid-column: 2; grid-row: 2; }
  .crewq figure:nth-child(4) { grid-column: 1 / -1; grid-row: 3 / 5; }
}
/* filming guide: equipment photo beside the checklist */
.check-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.check-split .checklist { grid-template-columns: 1fr; max-width: none; }
.check-split .head { margin-bottom: 1.5rem; }
.check-photo { margin: 0; position: relative; aspect-ratio: 1400 / 722; overflow: hidden; border: 1px solid var(--line); }
.check-photo img { position: absolute; inset: 0; }
@media (max-width: 860px) { .check-split { grid-template-columns: 1fr; } }
.info2 > .has-photo-b { display: flex; flex-direction: column; gap: .6rem; padding-bottom: 0; }
.info-img-b { margin: auto -1.75rem 0; padding-top: .9rem; width: calc(100% + 3.5rem); max-width: none; height: auto; aspect-ratio: 16 / 8; object-position: 50% 62%; box-sizing: content-box; }
/* seasons over a sea photo */
.seasons.seasons-photo { position: relative; overflow: hidden; background: none; gap: 0; }
.seasons-photo .sea-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 55%; max-width: none; z-index: 0; }
.seasons-photo .season { position: relative; z-index: 1; background: linear-gradient(180deg, rgba(var(--shade), .2) 0%, rgba(var(--shade), .68) 45%, rgba(var(--shade), .8) 100%); padding-top: clamp(8rem, 16vw, 13rem); text-shadow: 0 1px 4px rgba(var(--shade), 1), 0 0 10px rgba(var(--shade), .9); }
.seasons-photo .season + .season { box-shadow: -1px 0 0 rgba(244,244,242,.25); }
.seasons-photo .season p:not(.mono) { color: #fff; }
.seasons-photo .season .mono { color: #f0d2bf; }
@media (max-width: 700px) {
  .seasons-photo .season { padding-top: 1.6rem; background: rgba(var(--shade), .62); }
  .seasons-photo .season:first-of-type { padding-top: 9rem; background: linear-gradient(180deg, rgba(var(--shade), .1) 0%, rgba(var(--shade), .62) 45%); }
  .seasons-photo .season + .season { box-shadow: 0 -1px 0 rgba(244,244,242,.25); }
}
.seasons-photo .sea-bg { object-position: 50% 100%; }
.seasons-photo .season { padding-top: 1.6rem; padding-bottom: clamp(9rem, 17vw, 14rem); background: linear-gradient(180deg, rgba(var(--shade), .72) 0%, rgba(var(--shade), .6) 45%, rgba(var(--shade), 0) 78%); }
@media (max-width: 700px) {
  .seasons-photo .season, .seasons-photo .season:first-of-type { padding-top: 1.6rem; padding-bottom: 1.6rem; background: rgba(var(--shade), .66); }
  .seasons-photo .season:last-of-type { padding-bottom: 11rem; background: linear-gradient(180deg, rgba(var(--shade), .66) 0%, rgba(var(--shade), .6) 50%, rgba(var(--shade), 0) 82%); }
}
@media (max-width: 700px) {
  .seasons.seasons-photo { background: #12365c; }
  .seasons-photo .sea-bg { inset: auto 0 0 0; height: 15rem; object-position: 62% 100%; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 30%); mask-image: linear-gradient(180deg, transparent 0, #000 30%); }
  .seasons-photo .season, .seasons-photo .season:first-of-type { background: rgba(var(--shade), .5); }
  .seasons-photo .season:last-of-type { padding-bottom: 12.5rem; background: linear-gradient(180deg, rgba(var(--shade), .5) 0%, rgba(var(--shade), .45) 45%, rgba(var(--shade), 0) 70%); }
}
/* fixer page: baobab reflection photo under the two texts */
.photo-bg.span2 { background: #10263d; }
.photo-bg.span2 > .bg-img { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 26%); mask-image: linear-gradient(180deg, transparent 0, #000 26%); }
.photo-bg.span2::before { background: linear-gradient(180deg, rgba(var(--shade), .8) 0%, rgba(var(--shade), .72) 46%, rgba(var(--shade), .1) 64%, rgba(var(--shade), 0) 100%); }
.span2 section.about { padding-bottom: clamp(15rem, 41vw, 35rem); }
@media (max-width: 860px) {
  .photo-bg.span2::before { background: linear-gradient(180deg, rgba(var(--shade), .82) 0%, rgba(var(--shade), .76) 74%, rgba(var(--shade), .08) 88%, rgba(var(--shade), 0) 100%); }
  .span2 section.about { padding-bottom: 44vw; }
}
/* filming guide contact: lemur in the forest */
.contact-sec.bgx > .bg-img[src*="ruffed-lemur"] { object-position: 18% 80%; }
.contact-sec.bgx:has(> .bg-img[src*="ruffed-lemur"])::before { background: linear-gradient(90deg, rgba(var(--shade), .66) 0%, rgba(var(--shade), .42) 100%); }
/* "Everything on the ground": rose quartz photo first, buggy + plane photo after it */
@media (min-width: 901px) { .ground .gp2 { grid-column: 3 / 4; } .ground .gp1 { grid-column: 4 / 7; } }
@media (min-width: 561px) and (max-width: 900px) { .ground .gp2 { grid-column: 1; } .ground .gp1 { grid-column: 2; } }
@media (max-width: 560px) { .ground .gp2 { grid-row: 5; } .ground .gp1 { grid-row: 6; } }
/* video hero: photo flipped, text on the left; on phones the photo sits above the text */
.page-hero.hero-stack .wrap > * { max-width: 30rem; }
.page-hero.hero-stack::before { background: linear-gradient(90deg, rgba(var(--shade), .88) 0%, rgba(var(--shade), .6) 42%, rgba(var(--shade), .05) 72%); }
@media (max-width: 760px) {
  .page-hero.hero-stack { display: flex; flex-direction: column; }
  .page-hero.hero-stack > .bg-img { position: static; height: auto; aspect-ratio: 16 / 9; object-position: 70% 30%; }
  .page-hero.hero-stack::before { display: none; }
  .page-hero.hero-stack .wrap { padding-block: 1.75rem 2.5rem; text-shadow: none; }
}
/* video page: steps over the sky, crew visible below */
section.crew-steps { padding-bottom: clamp(22rem, 50vw, 40rem); }
.crew-steps > .bg-img { object-position: 50% 44%; }
.crew-steps::before { background: linear-gradient(180deg, rgba(var(--shade), .82) 0%, rgba(var(--shade), .66) 30%, rgba(var(--shade), .1) 46%, rgba(var(--shade), 0) 100%); }
@media (max-width: 860px) {
  section.crew-steps { display: flex; flex-direction: column; padding-bottom: 0; background: var(--panel); }
  .crew-steps > .bg-img { position: static; order: 2; height: auto; aspect-ratio: 4 / 3; object-position: 50% 96%; margin-top: 2rem; }
  .crew-steps::before { display: none; }
  .crew-steps > .wrap { order: 1; }
}
.crew-steps::before { background: linear-gradient(180deg, rgba(var(--shade), .84) 0%, rgba(var(--shade), .72) 28%, rgba(var(--shade), .1) 40%, rgba(var(--shade), 0) 100%); }

/* ---------- "Everything on the ground", v2: photo above each card, text on plain background ---------- */
.cards.ground2 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; background: var(--line); }
.ground2 .card { grid-column: span 2; background: var(--ink); }
.ground2 .card-top { display: block; width: calc(100% + 3.2rem); max-width: none; margin: -1.6rem -1.6rem .5rem; aspect-ratio: 16 / 9; height: auto; object-fit: cover; }
.ground2 .card:nth-of-type(4) { grid-column: 1 / 3; grid-row: 2; align-content: center; }
.ground2 .gphoto { min-height: 17rem; }
.ground2 .gp2 { grid-column: 3 / 4; grid-row: 2; }
.ground2 .gp1 { grid-column: 4 / 7; grid-row: 2; }
.ground2 .gp1 img { object-position: 50% 75%; }
.ground2 .gp2 img { object-position: 45% 20%; }
@media (max-width: 900px) {
  .cards.ground2 { grid-template-columns: 1fr 1fr; }
  .ground2 .card, .ground2 .card:nth-of-type(4) { grid-column: auto; grid-row: auto; align-content: start; }
  .ground2 .gp2 { grid-column: 1; grid-row: 3; }
  .ground2 .gp1 { grid-column: 2; grid-row: 3; }
}
@media (max-width: 560px) {
  .cards.ground2 { grid-template-columns: 1fr; }
  .ground2 .gp2 { grid-column: 1; grid-row: auto; min-height: 18rem; }
  .ground2 .gp1 { grid-column: 1; grid-row: auto; min-height: 14rem; }
}

/* ---------- video page: steps listed beside the crew photo ---------- */
section.steps-side { padding: 0; border-block: 1px solid var(--line); }
.steps-side > .bg-img { position: static; display: block; width: 100%; height: auto; max-width: none; }
.steps-side::before { background: linear-gradient(270deg, rgba(var(--shade), .9) 0%, rgba(var(--shade), .82) 24%, rgba(var(--shade), .25) 40%, rgba(var(--shade), 0) 52%); }
.steps-side > .wrap { position: absolute; inset: 0; z-index: 2; display: flex; justify-content: flex-end; align-items: center; }
.steps-side .side { width: min(20rem, 30vw); }
.steps-side .head { margin-bottom: 1.25rem; gap: .5rem; }
.steps-side .steps, .steps-side .steps.steps-5 { grid-template-columns: 1fr; gap: .85rem; }
.steps-side .steps::before { display: none; }
.steps-side .steps li { grid-template-columns: 1.9rem 1fr; column-gap: .8rem; row-gap: .1rem; padding-right: 0; }
.steps-side .steps li::before { grid-row: 1 / 3; margin-bottom: 0; }
.steps-side .steps b { align-self: end; }
.steps-side .steps span { grid-column: 2; }
@media (max-width: 960px) {
  section.steps-side { display: flex; flex-direction: column; background: var(--panel); }
  .steps-side::before { display: none; }
  .steps-side > .wrap { position: relative; inset: auto; order: 1; display: block; padding-block: 2.5rem 2rem; }
  .steps-side > .bg-img { order: 2; }
  .steps-side .side { width: auto; }
  .steps-side .steps, .steps-side .steps.steps-5 { grid-template-columns: 1fr 1fr; gap: 1rem 1.25rem; }
}
@media (max-width: 560px) { .steps-side .steps, .steps-side .steps.steps-5 { grid-template-columns: 1fr; } }
@media (min-width: 961px) { .steps-side::before { background: linear-gradient(270deg, rgba(var(--shade), .9) 0%, rgba(var(--shade), .84) 28%, rgba(var(--shade), .3) 36%, rgba(var(--shade), 0) 43%); } }
/* equipment kits: three cards + one photo, never an empty cell */
.cards.kits { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kit-photo { margin: 0; position: relative; overflow: hidden; min-height: 15rem; background: var(--ink); }
.kit-photo img { position: absolute; inset: 0; object-position: 27% 88%; }
@media (max-width: 1000px) { .cards.kits { grid-template-columns: 1fr 1fr; } .kit-photo img { object-position: 30% 85%; } }
@media (max-width: 560px) { .cards.kits { grid-template-columns: 1fr; } .kit-photo { min-height: 14rem; } }
/* video contact: beach interview at sunset */
.contact-sec.bgx > .bg-img[src*="village-interview-beach"] { object-position: 30% 45%; }
.contact-sec.bgx:has(> .bg-img[src*="village-interview-beach"])::before { background: linear-gradient(90deg, rgba(var(--shade), .72) 0%, rgba(var(--shade), .5) 100%); }
/* video contact: hanging lemur */
.contact-sec.bgx > .bg-img[src*="hanging-ruffed-lemur"] { object-position: 50% 78%; }
.contact-sec.bgx:has(> .bg-img[src*="hanging-ruffed-lemur"])::before { background: linear-gradient(90deg, rgba(var(--shade), .6) 0%, rgba(var(--shade), .38) 100%); }
@media (min-width: 861px) {
  .contact-sec.bgx > .bg-img[src*="hanging-ruffed-lemur"] { left: -4%; object-position: 50% 80%; }
  .contact-sec.bgx:has(> .bg-img[src*="hanging-ruffed-lemur"]) { background: var(--ink); }
  .contact-sec.bgx:has(> .bg-img[src*="hanging-ruffed-lemur"])::before { background: linear-gradient(90deg, rgba(var(--shade), .94) 0%, rgba(var(--shade), .92) 17%, rgba(var(--shade), .3) 34%, rgba(var(--shade), .3) 58%, rgba(var(--shade), .92) 72%, rgba(var(--shade), .94) 100%); }
}
/* video contact: lemur shown whole in its own column */
.contact.with-side { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr) minmax(0, .62fr); gap: clamp(1.25rem, 3vw, 2.5rem); align-items: stretch; }
.contact.with-side form.quote { align-self: start; }
.contact-side { margin: 0; position: relative; overflow: hidden; border: 1px solid var(--line); min-height: 30rem; }
.contact-side img { position: absolute; inset: 0; object-position: 50% 60%; }
@media (max-width: 1080px) { .contact.with-side { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); } .contact-side { grid-column: 1 / -1; min-height: 0; aspect-ratio: 16 / 10; } .contact-side img { object-position: 50% 82%; } }
@media (max-width: 860px) { .contact.with-side { grid-template-columns: 1fr; } .contact-side { aspect-ratio: 3 / 4; } .contact-side img { object-position: 50% 88%; } }
@media (min-width: 1081px) { .contact.with-side { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.2fr) minmax(0, .58fr); } .contact.with-side h2 { font-size: clamp(1.7rem, 2.6vw, 2.3rem); } }
/* video contact: basalt cliffs */
.contact-sec.bgx > .bg-img[src*="basalt-columns"] { object-position: 50% 45%; }
.contact-sec.bgx:has(> .bg-img[src*="basalt-columns"])::before { background: linear-gradient(90deg, rgba(var(--shade), .62) 0%, rgba(var(--shade), .36) 100%); }
.region img[src*="limestone-islets"] { object-position: 50% 96%; }
.region img[src*="isalo-natural-pool"] { object-position: 62% 60%; }
.region img[src*="highland-mud-house"] { object-position: 50% 45%; }
/* portfolio credits: landscape photo fills the free space under shorter lists */
.cgroup.has-photo { display: flex; flex-direction: column; gap: .7rem; padding-bottom: 0; }
.cgroup.has-photo figure { margin: .7rem -1.4rem 0; flex: 1 1 9rem; min-height: 9rem; position: relative; overflow: hidden; }
.cgroup.has-photo figure img { position: absolute; inset: 0; }
/* portfolio hero: music and dance shoot */
.page-hero.hero-port .wrap { padding-block: clamp(4.5rem, 11vw, 9rem); }
.page-hero.hero-port::before { background: linear-gradient(90deg, rgba(var(--shade), .8) 0%, rgba(var(--shade), .5) 38%, rgba(var(--shade), .05) 62%); }
.page-hero.hero-port .wrap > * { max-width: 30rem; }
@media (max-width: 760px) {
  .page-hero.hero-port { display: flex; flex-direction: column; }
  .page-hero.hero-port > .bg-img { position: static; height: auto; aspect-ratio: 16 / 9; }
  .page-hero.hero-port::before { display: none; }
  .page-hero.hero-port .wrap { padding-block: 1.75rem 2.5rem; text-shadow: none; }
}
.page-hero.hero-port::before { background: linear-gradient(90deg, rgba(var(--shade), .78) 0%, rgba(var(--shade), .5) 36%, rgba(var(--shade), .04) 60%); }
/* portfolio: behind-the-scenes photos */
.gallery.bts { grid-template-columns: repeat(3, 1fr); grid-auto-rows: clamp(11rem, 19vw, 16rem); }
@media (max-width: 760px) { .gallery.bts { grid-template-columns: 1fr 1fr; grid-auto-rows: 9.5rem; } }
.page-hero.hero-stack .wrap > h1 { max-width: 36rem; }
/* filming guide: four wildlife photos, landscape row, questions beside the night sky */
.duo.quad { grid-template-columns: 1fr 1fr; }
.duo.quad img { aspect-ratio: 1 / 1; }
.kit-photos.land2 { grid-template-columns: 1.7fr 1fr; margin-bottom: 1.25rem; }
.kit-photos.land2 figure { height: clamp(14rem, 26vw, 21rem); }
.faq-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: stretch; }
.faq-split .faq { max-width: none; }
.faq-photo { margin: 0; position: relative; overflow: hidden; border: 1px solid var(--line); min-height: 22rem; }
.faq-photo img { position: absolute; inset: 0; object-position: 50% 50%; }
@media (max-width: 860px) { .faq-split { grid-template-columns: 1fr; } .faq-photo { min-height: 0; aspect-ratio: 4 / 3; } }
@media (max-width: 560px) { .kit-photos.land2 { grid-template-columns: 1fr; } }

/* ---------- navigation help ---------- */
.pagenav { border-top: 1px solid var(--line); background: var(--panel); }
.pagenav .wrap { padding-block: 1.75rem; display: flex; align-items: center; gap: 1rem 1.5rem; flex-wrap: wrap; }
.pagenav .kicker { margin: 0; }
.pagenav-links { display: flex; gap: .6rem; flex-wrap: wrap; }
.pagenav-links .btn { padding: .7rem 1.1rem; font-size: .95rem; }
footer.site .foot-top { font-weight: 600; text-decoration: none; color: var(--paper); border-bottom: 1px solid var(--bronze); }
footer.site .foot-top:hover { color: var(--bronze); }
.to-top { position: fixed; right: max(14px, 2vw); bottom: max(14px, 2vw); z-index: 20; width: 2.9rem; height: 2.9rem; border-radius: 50%; border: 1px solid rgba(244,244,242,.5); background: var(--action); color: #fff; font: 600 1.25rem/1 var(--f-body); cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.4); }
.to-top:hover { background: var(--action-hi); }
.to-top[hidden] { display: none; }

/* stand-alone photo between two sections (video page) */
.photo-solo { padding: 1.25rem 0 0; }
.photo-solo img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; object-position: 50% 30%; border: 1px solid var(--line); }

/* permit table: stacked rows on phones, so timing and fees are visible without sideways scrolling */
@media (max-width: 640px) {
  table.facts { min-width: 0; display: block; }
  table.facts thead { display: none; }
  table.facts tbody { display: block; }
  table.facts tr { display: block; padding: .9rem 1rem; border-bottom: 1px solid var(--line); }
  table.facts tr:last-child { border-bottom: 0; }
  table.facts td { display: block; padding: 0; border: 0; }
  table.facts td:first-child { font-size: 1.02rem; margin-bottom: .2rem; }
  table.facts td:last-child { margin-top: .35rem; color: var(--bronze); font-weight: 600; }
}

/* Where to film: three smaller photos per region (one wide, two below) */
.region figure.mosaic { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 3fr 2fr; gap: 2px; min-height: 21rem; }
.region figure.mosaic .cell { position: relative; overflow: hidden; }
.region figure.mosaic .cell:first-child { grid-column: 1 / -1; }
.region figure.mosaic .cell img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) {
  .region figure.mosaic { min-height: 0; aspect-ratio: auto; grid-template-rows: none; }
  .region figure.mosaic .cell { aspect-ratio: 3 / 2; }
  .region figure.mosaic .cell:first-child { aspect-ratio: 2 / 1; }
}
.region img[src*="loc-baobab-avenue-dusk"] { object-position: 50% 100%; }
.region img[src*="loc-village-interview-shore"] { object-position: 22% 55%; }
.region img[src*="loc-canyon-waterfall"] { object-position: 50% 62%; }
.region img[src*="loc-dhow-beach-filming"] { object-position: 45% 70%; }
.region img[src*="loc-antananarivo-city-shoot"] { object-position: 50% 62%; }

/* Where to film: two or four smaller photos per region */
@media (min-width: 901px) { .region figure.stack { min-height: 20rem; } }
.region figure.quad { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 2px; min-height: 22rem; }
.region figure.quad .cell { position: relative; overflow: hidden; }
.region figure.quad .cell img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) { .region figure.quad { min-height: 0; aspect-ratio: auto; grid-template-rows: none; } .region figure.quad .cell { aspect-ratio: 4 / 3; } }
.region img[src*="highland-rice-terraces"] { object-position: 40% 70%; }
.region img[src*="loc-rocks-sunset"] { object-position: 50% 60%; }
.cgroup.has-photo figure + figure { margin-top: calc(-.7rem + 2px); }

.region img[src*="antananarivo-hill-lake-anosy"] { object-position: 50% 58%; }

footer.site .social a { color: var(--paper); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--bronze); }
footer.site .social a:hover { color: var(--bronze); }

.contact dd a.map-link { color: var(--paper); text-decoration: underline; text-decoration-color: var(--bronze); text-underline-offset: .18em; }
.contact dd a.map-link:hover { color: var(--bronze); }
.contact dd a.map-link span { color: var(--bronze); font-size: .85em; }

/* navigation: full labels on desktop, short labels on phones */
.show-xs { display: none; }
@media (max-width: 560px) { .show-xs { display: inline; } }
.page-hero.hero-stack .wrap > h1 { max-width: 36rem; }
.page-hero h1 { overflow-wrap: break-word; }

/* reCAPTCHA: the badge is hidden because the form itself shows the required Google notice. */
.grecaptcha-badge { visibility: hidden; }
.recaptcha-note[hidden] { display: none; }
.form-msg.ok { color: #7fd6a4; }
.form-msg.err { color: #f0b39c; }
body { margin: 0; }