/* SCN2A Australia — site overrides + utility classes
   Loaded after lib/tokens.css
   Brand v1.1 — orthogonal geometry, all corners 0px. Coral retired,
   Mulberry #8E3B5E in its place. */

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; }
*:focus-visible { outline: 2px solid #8E3B5E; outline-offset: 2px; }   /* v1.1 — Mulberry focus ring */
img { display: block; max-width: 100%; }

/* All three homepage directions inherit the brand's 0px corners.
   The dir-* classes remain so existing code that scopes via them
   still resolves cleanly. */
.dir-a, .dir-a *,
.dir-b, .dir-b *,
.dir-c, .dir-c * { --site-radius: 0px; }

/* Density */
.density-compact { --sec-pad-y: 56px; }
.density-comfy   { --sec-pad-y: 88px; }

/* Mobile menu animation */
@keyframes slidein { from { transform: translateX(100%); } to { transform: translateX(0); } }
.mobile-drawer { animation: slidein 200ms cubic-bezier(0.4,0,0.2,1); }

/* Pulse for the network nodes in Direction C */
@keyframes nodePulse {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.4); }
}
.node-pulse { transform-origin: center; transform-box: fill-box; animation: nodePulse 4s ease-in-out infinite; }

/* Soft hover for cards */
.card-hover { transition: border-color 200ms, box-shadow 200ms, transform 200ms; }
.card-hover:hover { border-color: #0D1B2A !important; box-shadow: 0 12px 32px rgba(20,40,60,0.10); transform: translateY(-2px); }

/* Mono ledger style for Direction A */
.ledger-mono { font-family: 'JetBrains Mono', 'Courier New', monospace; font-feature-settings: 'tnum'; }

/* Hide on small */
@media (max-width: 900px) {
  .hide-mobile { display: none !important; }
  .stack-mobile { grid-template-columns: 1fr !important; }
  .stack-mobile-2 { grid-template-columns: repeat(2, 1fr) !important; }
  .pad-mobile { padding-left: 20px !important; padding-right: 20px !important; }
  .hero-h1-mobile { font-size: 36px !important; }
  .hero-h1-mobile-lg { font-size: 44px !important; }
  .hero-sub-mobile { font-size: 16px !important; }
  .h2-mobile { font-size: 26px !important; }
}
/* Phones: collapse the 2-up grids to a single column */
@media (max-width: 600px) {
  .stack-mobile-2 { grid-template-columns: 1fr !important; }
}
@media (min-width: 901px) {
  .only-mobile { display: none !important; }
}

/* Photo treatment — slight teal multiply for unified mixed-source library */
.photo-tint { position: relative; overflow: hidden; }
.photo-tint::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(13,27,42,0) 50%, rgba(13,27,42,0.18) 100%);
}

/* Body resets to keep brand readable */
body { color: #0D1B2A; font-family: 'Inter', system-ui, sans-serif; }
a { color: inherit; }

/* Link hover */
.link { color: #0D1B2A; text-decoration: none; font-weight: 600; transition: color 120ms; }
.link:hover { color: #8E3B5E; }

/* Container */
.container { max-width: 1200px; margin: 0 auto; padding: 0 32px; }
.container-narrow { max-width: 880px; margin: 0 auto; padding: 0 32px; }

/* Eyebrow */
.eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing: 0.14em;
  text-transform: uppercase; color: #0D1B2A;
}

/* 6px rule */
.rule-teal     { border: 0; background: #0D1B2A; height: 6px; width: 56px; margin: 0; }
.rule-mulberry { border: 0; background: #8E3B5E; height: 6px; width: 56px; margin: 0; }
.rule-coral    { border: 0; background: #8E3B5E; height: 6px; width: 56px; margin: 0; } /* alias */

/* Tag chip — v1.1: square corners */
.chip {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 5px 10px; border-radius: 0; background: #E8E3DA; color: #0D1B2A;
}
.chip-mulberry { background: #E8E3DA; color: #8E3B5E; }
.chip-coral    { background: #E8E3DA; color: #8E3B5E; } /* alias */
.chip-slate    { background: rgba(44,62,80,0.08); color: #0D1B2A; }

/* Long-form prose page styles */
.prose-body h3 { font-size: 22px; font-weight: 700; color: #0D1B2A; margin: 36px 0 14px; line-height: 1.3; letter-spacing: -0.005em; }
.prose-body h4 { font-size: 18px; font-weight: 700; color: #0D1B2A; margin: 24px 0 8px; }
.prose-body p { margin: 0 0 16px; max-width: none; }
.prose-body ul, .prose-body ol { padding-left: 22px; margin: 8px 0 20px; }
.prose-body ul li, .prose-body ol li { margin-bottom: 8px; line-height: 1.65; }
.prose-body strong { color: #0D1B2A; }
.prose-body a { color: #0D1B2A; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.prose-body a:hover { color: #8E3B5E; }
.prose-body blockquote { margin: 22px 0; padding: 16px 0 16px 22px; border-left: 4px solid #8E3B5E; font-size: 18px; font-style: italic; color: #0D1B2A; }
.prose-body table { border-collapse: collapse; width: 100%; margin: 16px 0 24px; font-size: 15px; }
.prose-body table th, .prose-body table td { border: 1px solid #D5CFBF; padding: 12px 14px; text-align: left; vertical-align: top; }
.prose-body table th { background: #F7F4F0; font-weight: 700; color: #0D1B2A; }

/* Smooth fade-in for routed content */
@keyframes pageIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
main { animation: pageIn 240ms cubic-bezier(0.4,0,0.2,1); }

/* ---- Walk Around Australia map animations ---- */
/* Kangaroo hopping gait as it follows the coastline */
@keyframes walk-roo-hop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
.walk-roo-hop { transform-box: fill-box; transform-origin: center bottom; animation: walk-roo-hop 620ms ease-in-out infinite; }
/* Expanding "current position" pulse under the kangaroo */
@keyframes walk-roo-pulse { 0% { transform: scale(0.5); opacity: 0.45; } 70% { transform: scale(2.4); opacity: 0; } 100% { opacity: 0; } }
.walk-roo-pulse { transform-box: fill-box; transform-origin: center; animation: walk-roo-pulse 1.8s ease-out infinite; }
/* Pulse ring on the next-stop marker */
@keyframes walk-stop-pulse { 0% { opacity: 0.9; transform: scale(1); } 70% { opacity: 0; transform: scale(2.6); } 100% { opacity: 0; } }
.walk-stop-pulse { transform-box: fill-box; transform-origin: center; animation: walk-stop-pulse 2s ease-out infinite; }
/* Landmark/city markers pop in on load */
@keyframes walk-pin { from { opacity: 0; transform: scale(0.3); } to { opacity: 1; transform: scale(1); } }
.walk-pin { transform-box: fill-box; transform-origin: center; animation: walk-pin 400ms cubic-bezier(0.34,1.3,0.64,1) both; }
/* Marching ants along the remaining route */
@keyframes walk-ants { to { stroke-dashoffset: -24; } }
.walk-ants { animation: walk-ants 2.4s linear infinite; }
/* Twinkling Southern Cross */
@keyframes walk-twinkle { 0%, 100% { opacity: 0.35; } 50% { opacity: 1; } }
.walk-twinkle { animation: walk-twinkle 3s ease-in-out infinite; }
/* Gentle bob for the koala */
@keyframes walk-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.walk-bob { transform-box: fill-box; transform-origin: center; animation: walk-bob 3.2s ease-in-out infinite; }

/* ---- SCN2A Family Map: restrained motion (fades + small translates only) ---- */
@keyframes fmap-pulse { 0% { transform: scale(1); opacity: 0.5; } 70% { transform: scale(2.6); opacity: 0; } 100% { transform: scale(2.6); opacity: 0; } }
.fmap-pulse { transform-origin: center; transform-box: fill-box; animation: fmap-pulse 2.4s cubic-bezier(0.4,0,0.2,1) infinite; }
@keyframes fmap-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
.fmap-rise { animation: fmap-rise 200ms cubic-bezier(0.4,0,0.2,1) both; }
@keyframes fmap-fade { from { opacity: 0; } to { opacity: 1; } }
.fmap-overlay { animation: fmap-fade 160ms cubic-bezier(0.4,0,0.2,1) both; }
.fmap-state { transition: fill 160ms cubic-bezier(0.4,0,0.2,1); }
@media (prefers-reduced-motion: reduce) {
  .fmap-pulse, .fmap-rise, .fmap-overlay { animation: none !important; }
}

/* ---- Families page: hide the in-page nav scrollbar ---- */
.door-nav-strip > div::-webkit-scrollbar { height: 0; display: none; }
.door-nav-strip > div { scrollbar-width: none; }

/* ---- Families page: responsive collapse ---- */
@media (max-width: 900px) {
  .families-page .door-head { grid-template-columns: 1fr !important; align-items: start !important; }
  .families-page .door-toggle { justify-self: start; }
}
@media (max-width: 720px) {
  .journey-rail { grid-template-columns: repeat(9, 132px) !important; }
  .journey-cols { grid-template-columns: 1fr !important; }
  .journey-cols > div:first-child { border-right: none !important; border-bottom: 1px solid #E8E3DA; }
  .carer-grid { grid-template-columns: 1fr 1fr !important; }
  .featured-story { grid-template-columns: 1fr !important; }
  .featured-story > div:first-child { min-height: 300px !important; }
  .families-page .door-grid { grid-template-columns: 1fr !important; }
}
@media (max-width: 480px) {
  .carer-grid { grid-template-columns: 1fr !important; }
}

/* ---- Families page: print — flatten, expand all cards, hide chrome ---- */
@media print {
  @page { margin: 14mm; }
  header, footer, .door-nav-strip, .skip-link,
  .families-page .door-toggle,
  .families-page .print-btn,
  .families-page .journey-rail,
  .families-page .journey-stepper { display: none !important; }
  .families-page section { padding-top: 16px !important; padding-bottom: 16px !important; background: #fff !important; break-inside: avoid; }
  .families-page .card-collapsible { height: auto !important; overflow: visible !important; }
  .families-page article { break-inside: avoid; box-shadow: none !important; border-color: #999 !important; }
  .journey-cols { grid-template-columns: 1fr 1fr !important; }
}