/* Acres of Diamond — "Field Atlas" redesign (22 Oct 2026)
   Layout: an expedition atlas — full-width moving photographs, then calm
   limestone pages with expanded documentary title type, survey-grade data in mono.
   Loaded after site.css: it re-skins every page; no content is removed. */
:root{
  /* palette — limestone, volcanic slate, lagoon teal, maize */
  --ground:#F4F4EF; --paper:#FFFFFF; --sand:#EBEDE6; --sand-2:#E0E4DA;
  --ink:#1A2731; --ink-2:#4A5862; --rule:#D3D8D0; --rule-2:#E4E7E0; --field:#7E8A90;
  --jade:#2B6C7C; --jade-deep:#1F5463; --jade-tint:#E2EDEF;
  --gold:#E2B15A; --gold-deep:#C2913C; --gold-tint:#F5EAD2;
  --lagoon:#3B8DAE; --lagoon-tint:#E1EEF3; --sea:#E6F0F2;
  --celadon:#E7EEEC; --sage:#DCE5E2; --wheat:#F3EDDF; --wheat-line:#DECB9C;
  /* type — documentary title cards, readable serif text, survey mono */
  --display:"Archivo","Hanken Grotesk",system-ui,sans-serif;
  --body:"Source Serif 4","Iowan Old Style","Georgia",serif;
  --ui:"Archivo","Hanken Grotesk",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --max:1240px;
}
body{font:400 1.0625rem/1.7 var(--body);letter-spacing:.002em}
::selection{background:var(--gold-tint);color:var(--ink)}
h1,h2,h3{font-family:var(--display);font-stretch:118%;letter-spacing:-.012em}
h1{font-weight:800;font-size:clamp(2.4rem,1.2rem + 4.4vw,4.8rem);line-height:1.02}
h2{font-weight:750;font-size:clamp(1.8rem,1.15rem + 2.2vw,3rem);line-height:1.06}
h3{font-weight:700;font-size:clamp(1.2rem,1.05rem + .6vw,1.5rem);line-height:1.18;letter-spacing:-.006em}
.lede{font-size:clamp(1.12rem,1.02rem + .4vw,1.32rem);line-height:1.6;color:var(--ink-2)}

/* every UI label, nav item, button and small caption speaks in the sans */
.btn,.nav,.lang,.menu-label,.crumbs,.vtitle,.vmeta,.vsoon,.status,.d-name,.d-dist,.d-code,.d-stat,
.foot-h,.fine,.legal,.ph-credit,.photo-credit,.credit,.note,.fmt,.runtime,.cn,.dist,.sw,.tk-ep,
.ph-cap,.textlink,.sub,.field,.notify-copy,label,input,select,textarea,figcaption{font-family:var(--ui)}
/* coordinates, durations and route data are measurements */
[data-slide-coords],.d-dist,.dist,.runtime,.vmeta [data-dur],.d-code,.cn{font-family:var(--mono);font-stretch:100%;letter-spacing:0}

/* header — quiet limestone bar */
.site-header{background:color-mix(in srgb,var(--ground) 92%,transparent);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--rule)}
.brand span{font-family:var(--display);font-stretch:118%;font-weight:800;letter-spacing:-.01em}
.nav a{font-weight:600;letter-spacing:.01em}

/* buttons — squared, confident, soft depth */
.btn{font:650 .98rem/1.1 var(--ui);font-stretch:108%;border-radius:2px;padding:1em 1.45em;letter-spacing:.01em}
.btn-jade{background:var(--jade);color:#fff;box-shadow:0 10px 24px -14px rgba(31,84,99,.7)}
.btn-jade:hover{background:var(--jade-deep);color:#fff}
.btn-line{border-color:var(--ink);color:var(--ink);background:transparent}
.btn-line:hover{background:var(--ink);color:var(--ground)}
.btn-deep{background:var(--ink);color:var(--ground)}

/* the old photo stages give way to the moving-photo header above;
   the country ticker (coordinates + episodes) stays */
.stage .slides,.stage .ph-cap,.stage .scroll-cue,.stage-shade{display:none!important}
.stage,.stage--photo{height:auto!important;min-height:0!important;overflow:visible!important;background:var(--paper)!important;margin:0!important;border-bottom:1px solid var(--rule)}
.ph-stage{display:none!important}

/* sections — alternating limestone and paper fields, contour art softened */
.section{padding-block:clamp(64px,8vw,116px)}
.field-jade{background-color:var(--celadon)}
.field-gold{background-color:var(--wheat)}
.field-sand{background:var(--sand)}
.field-jade,.field-gold{background-blend-mode:luminosity}
.site-footer{background:var(--ink)!important;color:#E7ECEF!important;border-top:0}
.site-footer a{color:#fff}
.site-footer .foot-h{color:var(--gold)}
.site-footer .fine,.site-footer .legal{color:#B9C3C9}

/* film slots — real photographs as posters, a cinematic frame */
.vframe{border-radius:3px;overflow:hidden;box-shadow:0 22px 44px -26px rgba(26,39,49,.55)}
.vframe img{filter:saturate(.95) brightness(1.02)}
.vplay{background:rgba(255,255,255,.92);color:var(--jade-deep)}
.vsoon{font-weight:600;letter-spacing:.04em}

/* status chips and the episode pipeline */
.status{border-radius:2px;font-weight:650;letter-spacing:.03em}
.status--planned{background:var(--lagoon-tint);color:var(--jade-deep)}
.status--scouting{background:var(--gold-tint);color:#7A5714}
.status--production{background:var(--jade);color:#fff}

/* quiet, consistent cards */
.format,.track,.dx,.agency{border-radius:3px;border:1px solid var(--rule);background:var(--paper);box-shadow:0 14px 30px -26px rgba(26,39,49,.45)}

/* browser surfaces */
html{scrollbar-color:var(--jade) var(--sand)}
::-webkit-scrollbar-thumb{background:var(--jade);border-color:var(--sand)}
:focus-visible{outline:3px solid var(--gold-deep);outline-offset:3px}
a:hover{text-decoration-color:var(--gold-deep)}

@media (max-width:760px){
  h1{font-size:clamp(2.1rem,9vw,3rem)}
  .btn{padding:.95em 1.2em}
}