/* Shared shell for GDN subpages (shows index, show pages).
   Same tokens and chrome as the homepage, which keeps its own inline copy. */
@property --glow { syntax: '<color>'; inherits: true; initial-value: #1D3B5C; }
:root {
  --gdn-paper: #FFFFFF; --gdn-screen: #000000; --gdn-ink: #111111;
  --gdn-ink-soft: #4A4A4A; --gdn-ink-dim: #BDBDBD;
  --gdn-navy: #1D3B5C; --gdn-gold: #E3A857; --gdn-panel: #F2F2F0;
  --gdn-rule: rgba(0,0,0,.2); --gdn-rule-strong: #000000; --gdn-rule-dark: #2E2E2E;
  --gdn-web-display-xl: clamp(3rem, 1.4rem + 6.2vw, 7.75rem);
  --gdn-web-display-lg: clamp(2.5rem, 1.5rem + 4vw, 5.5rem);
  --gdn-web-display-md: clamp(2rem, 1.4rem + 2.4vw, 3.5rem);
  --gdn-web-numeral: clamp(5rem, 3rem + 6vw, 9rem);
  --gdn-r-card: 16px; --gdn-r-chip: 8px; --gdn-r-pill: 999px;
  --gdn-ease: cubic-bezier(0.23, 1, 0.32, 1);
  --gdn-gutter: clamp(16px, 4vw, 56px); --gdn-maxw: 1360px;
  --bar-h: 60px; --nav-h: 72px;
  --font-display: "Akshar", system-ui, sans-serif;
  --font-text: "Archivo", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-padding-top: calc(var(--nav-h) + 16px); -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--gdn-screen); color: #FFFFFF; font-family: var(--font-text); font-size: 1rem; line-height: 1.5; -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, video, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; margin: 0; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
a { color: inherit; }
::selection { background: var(--gdn-navy); color: #FFFFFF; }
.wrap { max-width: var(--gdn-maxw); margin: 0 auto; padding-inline: var(--gdn-gutter); }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.watch { background: var(--gdn-screen); color: #FFFFFF; --focus: #FFFFFF; }
.read  { background: var(--gdn-paper); color: var(--gdn-ink); --focus: var(--gdn-navy); }
:focus-visible { outline: 3px solid var(--focus, #FFFFFF); outline-offset: 3px; border-radius: 4px; }
.skip { position: fixed; left: 16px; top: -80px; z-index: 100; background: #FFFFFF; color: #000000; padding: 12px 18px; border-radius: var(--gdn-r-pill); font-weight: 600; text-decoration: none; }
.skip:focus { top: 12px; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 26px; border-radius: var(--gdn-r-pill); border: 0; font: 600 1rem/1 var(--font-text); text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color 160ms var(--gdn-ease), color 160ms var(--gdn-ease), transform 120ms var(--gdn-ease); }
.btn:active { transform: scale(0.97); }
.btn svg { flex: none; }
.btn--light { background: #FFFFFF; color: #000000; } .btn--light:hover { background: #E2E2E2; }
.btn--dark { background: var(--gdn-ink); color: #FFFFFF; } .btn--dark:hover { background: #333333; }
.btn--glass { background: rgba(255,255,255,.16); color: #FFFFFF; -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); box-shadow: inset 0 1px 0 rgba(255,255,255,.18); }
.btn--glass:hover { background: rgba(255,255,255,.26); }
.btn--line { background: transparent; color: inherit; box-shadow: inset 0 0 0 1.5px currentColor; }
.btn--line:hover { background: rgba(127,127,127,.14); }
.btn--text { background: transparent; color: inherit; padding: 0 14px; }
.btn--text:hover { text-decoration: underline; text-underline-offset: 4px; }
.btn--sm { min-height: 44px; padding: 0 18px; font-size: .9375rem; }
@media (prefers-reduced-transparency: reduce) { .btn--glass { background: #2A2A2A; -webkit-backdrop-filter: none; backdrop-filter: none; } }

.prelaunch { position: relative; z-index: 61; isolation: isolate; overflow: hidden; height: var(--bar-h); display: flex; align-items: center; justify-content: center; gap: clamp(10px, 1.6vw, 22px); padding: 0 16px; background: #1D3B5C; color: #FFFFFF; text-decoration: none; font-size: 15px; line-height: 1.2; text-align: center; white-space: nowrap; }
.prelaunch::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.14) 50%, rgba(255,255,255,0) 70%) 0 0 / 220% 100% no-repeat; animation: barSheen 6s ease-in-out infinite; }
@keyframes barSheen { 0% { background-position: 140% 0; } 55%, 100% { background-position: -40% 0; } }
.prelaunch__dot { width: 9px; height: 9px; border-radius: 50%; background: #FFFFFF; flex: none; box-shadow: 0 0 0 0 rgba(255,255,255,.6); animation: barPulse 2.4s ease-out infinite; }
@keyframes barPulse { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.55); } 70% { box-shadow: 0 0 0 8px rgba(255,255,255,0); } 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); } }
.prelaunch__txt b { font-family: var(--font-display, "Akshar", sans-serif); font-weight: 600; font-size: 1.2em; letter-spacing: -0.01em; }
.prelaunch__mid, .prelaunch__short, .prelaunch__tiny { display: none; }
.prelaunch__go { display: inline-flex; flex: none; transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1); }
.prelaunch:hover .prelaunch__go { transform: translateX(4px); }
.prelaunch:hover .prelaunch__txt { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.prelaunch:focus-visible { outline: 3px solid #FFFFFF; outline-offset: -5px; }
@media (prefers-reduced-motion: reduce) { .prelaunch::before, .prelaunch__dot { animation: none; } }
.nav { position: fixed; left: 0; right: 0; top: 0; z-index: 60; height: calc(var(--nav-h) + env(safe-area-inset-top, 0px)); padding-top: env(safe-area-inset-top, 0px); transform: translateY(var(--nav-y, var(--bar-h))); transition: background-color 240ms var(--gdn-ease), color 240ms var(--gdn-ease), box-shadow 240ms var(--gdn-ease); }
.nav .wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.nav__home { display: block; padding: 6px 0; }
.nav__home img { height: 40px; width: auto; }
.nav__r { display: flex; align-items: center; gap: 6px; }
.nav[data-material="glass"] { color: #FFFFFF; background: rgba(0,0,0,.32); -webkit-backdrop-filter: blur(20px) saturate(1.5); backdrop-filter: blur(20px) saturate(1.5); box-shadow: inset 0 -1px 0 rgba(255,255,255,.08); --focus: #FFFFFF; }
.nav[data-material="solid"] { color: var(--gdn-ink); background: #FFFFFF; box-shadow: inset 0 -1px 0 var(--gdn-rule); --focus: var(--gdn-navy); }
.nav .logo-navy, .nav[data-material="solid"] .logo-white { display: none; }
.nav[data-material="solid"] .logo-navy { display: block; }
.nav[data-material="glass"] .nav__cta { background: #FFFFFF; color: #000000; }
.nav[data-material="solid"] .nav__cta { background: var(--gdn-ink); color: #FFFFFF; }
@media (prefers-reduced-transparency: reduce) { .nav[data-material="glass"] { background: #000000; -webkit-backdrop-filter: none; backdrop-filter: none; } }

.crumbs { display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--gdn-ink-dim); }
.crumbs a { color: #FFFFFF; text-decoration: none; font-weight: 600; }
.crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }
.endorse { font-size: 13px; font-weight: 600; letter-spacing: .02em; color: #E6E6E6; }
.eyebrow { display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gdn-navy); }
.h2 { font-size: var(--gdn-web-display-lg); line-height: .94; letter-spacing: -0.04em; }
.h2--md { font-size: var(--gdn-web-display-md); line-height: 1; letter-spacing: -0.035em; }
.soft { color: var(--gdn-ink-soft); }
.watch .soft { color: var(--gdn-ink-dim); }
.read a:not(.btn) { color: var(--gdn-navy); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.read a:not(.btn):hover { color: #000000; }
.ext::after { content: " \2197"; }

.chip { display: inline-flex; align-items: center; gap: 6px; min-height: 26px; border-radius: var(--gdn-r-chip); padding: 3px 9px; font-size: 12.5px; font-weight: 700; letter-spacing: .03em; }
.chip--free { box-shadow: inset 0 0 0 1px rgba(255,255,255,.55); color: #FFFFFF; }
.chip--plus { background: #000000; box-shadow: inset 0 0 0 1px rgba(227,168,87,.6); color: #FFFFFF; font-family: var(--font-display); font-weight: 700; font-size: 14px; letter-spacing: 0; }
.chip--plus > span:first-child { color: var(--gdn-gold); }

/* trailer dialog */
.trailer { width: min(1200px, calc(100vw - 32px)); padding: 0; border: 0; border-radius: var(--gdn-r-card); background: #000000; color: #FFFFFF; overflow: hidden; }
.trailer::backdrop { background: rgba(0,0,0,.86); }
.trailer video { width: 100%; aspect-ratio: 16 / 9; display: block; background: #000000; }
.trailer__bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 12px 12px 20px; }
.trailer__end { aspect-ratio: 16 / 9; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: clamp(28px, 5vw, 64px) clamp(20px, 5vw, 64px); text-align: center; background: radial-gradient(130% 90% at 50% 0%, rgba(29,59,92,.55) 0%, rgba(29,59,92,.16) 45%, transparent 75%), linear-gradient(rgba(0,0,0,.72), rgba(0,0,0,.9)), url("/www/assets/gud-fishing.webp") center / cover; animation: endIn 520ms cubic-bezier(0.23, 1, 0.32, 1) both; }
.trailer__end[hidden] { display: none; }
.trailer.is-ended video { display: none; }
.trailer__logo { width: min(420px, 70%); height: auto; }
.trailer__h { font-size: clamp(1.75rem, 1.2rem + 2vw, 3rem); line-height: 1; letter-spacing: -0.04em; margin-top: 6px; }
.trailer__line { max-width: 44ch; color: #D6D6D6; font-size: clamp(.9375rem, .9rem + .2vw, 1.0625rem); line-height: 1.5; }
.trailer__ctas { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 6px; }
@keyframes endIn { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .trailer__end { animation: none; } }
.trailer__bar b { font-family: var(--font-display); font-weight: 600; font-size: 20px; }

/* reveal once on entry; visible at rest without JS */
.js [data-in] { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity 620ms var(--gdn-ease), transform 620ms var(--gdn-ease); }
.js [data-in].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js [data-in] { transform: none; transition-duration: 200ms; } }

/* footer */
.foot { padding: clamp(56px, 7vw, 96px) 0 40px; }
.foot__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(28px, 4vw, 64px); border-top: 1px solid var(--gdn-rule-strong); padding-top: 22px; }
.foot h2 { font-family: var(--font-text); font-size: 15px; font-weight: 700; line-height: 24px; margin: 0 0 6px; padding: 6px 0; }
.foot p { color: var(--gdn-ink-soft); max-width: 46ch; }
.foot ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
/* two equal columns of four rows: the heading counts as the left column's first row */
.foot__nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; align-items: start; }
ul.foot__col { padding: 0; }
.foot nav ul a { display: inline-block; padding: 6px 0; line-height: 24px; font-weight: 600; text-decoration: none; }
.foot nav ul a:hover { text-decoration: underline; }
.sign { --s: clamp(1.5rem, 0.4rem + 4.6vw, 5rem); margin-top: clamp(56px, 8vw, 120px); display: flex; justify-content: space-between; align-items: center; gap: clamp(12px, 2vw, 32px); }
.sign b { font-family: var(--font-display); font-weight: 600; font-size: var(--s); line-height: 1; letter-spacing: -0.045em; color: var(--gdn-ink); white-space: nowrap; }
.sign img { height: calc(var(--s) * 0.9); width: auto; flex: none; }
.legal { margin-top: 32px; font-size: 13px; color: var(--gdn-ink-soft); }

@media (max-width: 860px) {
  :root { --nav-h: 64px; }
  .nav__home img { height: 34px; }
  .nav .btn--text { padding: 0 10px; font-size: 15px; }
  .nav__cta { padding: 0 18px; }
  .foot__grid { grid-template-columns: minmax(0, 1fr); }
  .sign { --s: calc((100vw - 2 * var(--gdn-gutter) - 12px) / 12.2); }
}

@media (max-width: 900px) { .prelaunch__more { display: none; } .prelaunch__mid { display: inline; } .prelaunch { font-size: 14px; gap: 10px; } }
@media (max-width: 560px) { .prelaunch__mid { display: none; } .prelaunch__short { display: inline; } }
@media (max-width: 400px) { .prelaunch__short { display: none; } .prelaunch__tiny { display: inline; } .prelaunch { gap: 8px; padding: 0 10px; } .prelaunch__txt b { font-size: 1.1em; } }
@media (max-width: 340px) { .prelaunch__tiny { display: none; } }

/* "new episodes" call-out: white on black, never gold (gold means GDN+) */
.flag { display: inline-flex; align-items: center; gap: 8px; min-height: 30px; padding: 5px 12px 5px 10px; border-radius: var(--gdn-r-pill); background: #FFFFFF; color: #000000; font: 700 13px/1.1 var(--font-text, "Archivo", sans-serif); letter-spacing: .01em; white-space: nowrap; box-shadow: 0 6px 18px -8px rgba(0,0,0,.6); }
.flag__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gdn-navy, #1D3B5C); box-shadow: 0 0 0 0 rgba(29,59,92,.55); animation: flagPulse 2.4s ease-out infinite; }
@keyframes flagPulse { 0% { box-shadow: 0 0 0 0 rgba(29,59,92,.55); } 70% { box-shadow: 0 0 0 7px rgba(29,59,92,0); } 100% { box-shadow: 0 0 0 0 rgba(29,59,92,0); } }
@media (prefers-reduced-motion: reduce) { .flag__dot { animation: none; } }
.poster .flag { position: absolute; left: 16px; top: 16px; z-index: 2; }