/*
Theme Name: Let's Talk Gymnastics — GeneratePress Child
Theme URI: https://thewebdesignninja.com
Description: Custom GeneratePress child theme for letstalkgymnastics.com. Built to the WDN GeneratePress Build Sheet spec — one theme, no page-template sprawl. All page and post content lives in the block editor; this file provides only design tokens and shared utility classes.
Author: The Web Design Ninja
Author URI: https://thewebdesignninja.com
Template: generatepress
Version: 1.0.25
*/

/* =====================================================
   1. DESIGN TOKENS
   Per-project values. Structure matches every WDN build;
   values are unique to Let's Talk Gymnastics (the "Scrapbook" concept).
   ===================================================== */
:root {
  /* Color */
  --wdn-color-primary: #A63D2C;       /* rust — CTAs, accents, article numbering */
  --wdn-color-primary-dark: #7E2D1F;
  --wdn-color-secondary: #223349;     /* navy — gym panel */
  --wdn-color-text: #24211C;          /* ink */
  --wdn-color-text-muted: #5B5344;
  --wdn-color-bg: #EDE6D6;            /* paper */
  --wdn-color-bg-alt: #E4DAC4;        /* paper, alt panel */
  --wdn-color-border: #C9BEA4;

  /* Spacing scale */
  --wdn-space-xs: 0.5rem;
  --wdn-space-sm: 1rem;
  --wdn-space-md: 2rem;
  --wdn-space-lg: 4rem;
  --wdn-space-xl: 6rem;

  /* Typography */
  --wdn-font-heading: 'Fraunces', Georgia, serif;
  --wdn-font-body: 'Source Serif 4', Georgia, serif;
  --wdn-font-mono: 'Courier Prime', 'Courier New', monospace; /* captions, eyebrows, bylines — approved per-project addition, see Build Sheet §9 */
  --wdn-font-size-h1: clamp(2rem, 4vw, 3.25rem);
  --wdn-font-size-h2: clamp(1.5rem, 3vw, 2.25rem);
  --wdn-font-size-body: 1.0625rem;

  /* Radius */
  --wdn-radius-sm: 4px;
  --wdn-radius-md: 8px;
}

:root{
    --paper:#EDE6D6;
    --paper-alt:#E4DAC4;
    --ink:#24211C;
    --ink-soft:#5B5344;
    --rust:#A63D2C;
    --navy:#223349;
    --line:#C9BEA4;
  }

div#page{
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
}
.photo-stack p {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: sepia(0.2) contrast(1.02);
}

/* =====================================================
   2. TYPOGRAPHY BASE
   Applies everywhere by default so a plain post/page —
   just headings, paragraphs, images — already looks right
   with zero utility classes required.
   ===================================================== */
body {
  background: var(--wdn-color-bg);
  color: var(--wdn-color-text);
  font-family: var(--wdn-font-body);
  font-size: var(--wdn-font-size-body);
  line-height: 1.65;
}

/* h1, h2, h3, h4, h5, h6 {
  font-family: var(--wdn-font-heading);
  font-weight: 500;
  line-height: 1.15;
  color: var(--wdn-color-text);
} */

.entry-title, h1 { font-size: var(--wdn-font-size-h1); }
h2 { font-size: var(--wdn-font-size-h2); }

a { color: var(--wdn-color-primary); }
a:hover { color: var(--wdn-color-primary-dark); }

/* Default article/page body — this is what makes "just add a post" work */
.entry-content {
  font-size: 1.0625rem;
  color: var(--wdn-color-text);
}
ul {
    padding: 0px;
    margin: 0px;
}
.entry-content p { margin-bottom: 1.4em; max-width: 68ch; }
.entry-content > p:first-of-type {
  font-size: 1.15em;
  color: var(--wdn-color-text);
}
.entry-content img {
  border-radius: var(--wdn-radius-md);
  height: auto;
}
.entry-content figure { margin: 2em 0; }
.entry-content figcaption {
  font-family: var(--wdn-font-mono);
  font-size: 0.8rem;
  color: var(--wdn-color-text-muted);
  margin-top: 0.5em;
}
.entry-content blockquote {
  font-family: var(--wdn-font-heading);
  font-size: 1.4rem;
  font-style: italic;
  color: var(--wdn-color-primary-dark);
  border-left: 3px solid var(--wdn-color-primary);
  padding-left: 1.2em;
  margin: 2em 0;
  max-width: 60ch;
}

/* Post meta (byline/date) rendered mono, like a typed photo caption */
.entry-meta, .wdn-byline {
  font-family: var(--wdn-font-mono);
  font-size: 0.8rem;
  letter-spacing: 0.02em;
  color: var(--wdn-color-text-muted);
  text-transform: uppercase;
}

/* =====================================================
   3. UTILITY CLASSES ("Tailwind-lite" layer)
   Applied via the block editor's Additional CSS Class(es)
   field. This is how page-to-page variation happens —
   never new CSS per page. New classes here must be
   approved and logged per Build Sheet §5 / §9.
   ===================================================== */
.wdn-section          { padding-block: var(--wdn-space-lg); }
.wdn-section--tight    { padding-block: var(--wdn-space-md); }
.wdn-section--alt-bg   { background: var(--wdn-color-bg-alt); }
.wdn-section--dark     { background: var(--wdn-color-secondary); color: #fff; }
.wdn-section--dark h1, .wdn-section--dark h2, .wdn-section--dark h3 { color: #fff; }
.wdn-section--ink      { background: var(--wdn-color-text); color: var(--wdn-color-bg); }

.wdn-container-narrow  { max-width: 760px; margin-inline: auto; }
.wdn-container-wide    { max-width: 1080px; margin-inline: auto; padding-inline: var(--wdn-space-sm); }

.wdn-card              { border: 1px solid var(--wdn-color-border); border-radius: var(--wdn-radius-md); padding: var(--wdn-space-sm); background: var(--wdn-color-bg); }
.wdn-card-grid, .wdn-card-grid > .wp-block-group__inner-container { display: grid; gap: var(--wdn-space-sm); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
/* Homepage "Through the years" strip — force exactly 5 across, matching the mockup */
.wdn-archive-grid, .wdn-archive-grid > .wp-block-group__inner-container { display: grid; gap: var(--wdn-space-sm); grid-template-columns: repeat(5, 1fr); }
@media (max-width: 782px) {
  .wdn-archive-grid, .wdn-archive-grid > .wp-block-group__inner-container { grid-template-columns: repeat(2, 1fr); }
}

.wdn-btn                { display: inline-block; }
.wdn-btn .wp-block-button__link {
  display: inline-block; border-radius: var(--wdn-radius-sm) !important; padding: 0.75rem 1.5rem !important;
  font-family: var(--wdn-font-mono); font-size: 0.85rem; font-weight: 600; text-decoration: none !important;
  border: none; box-shadow: none !important;
}
.wdn-btn--primary .wp-block-button__link { background: var(--wdn-color-primary) !important; color: #fff !important; }
.wdn-btn--outline .wp-block-button__link { background: transparent !important; border: 2px solid currentColor !important; color: inherit !important; }

.wdn-text-muted         { color: var(--wdn-color-text-muted); }
.wdn-text-center        { text-align: center; }
.wdn-eyebrow            { font-family: var(--wdn-font-mono); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--wdn-color-primary); margin-bottom: 0.75em; display: block; }

/* Scrapbook photo treatment — approved per-project addition (Build Sheet §9) */
.wdn-photo-tape {
  background: var(--wdn-color-bg);
  padding: 8px 8px 22px;
  border: 1px solid var(--wdn-color-border);
  box-shadow: 2px 3px 6px rgba(0,0,0,0.15);
  display: inline-block;
}
.wdn-photo-tape img { display: block; width: 100%; border-radius: 0; filter: sepia(0.18) contrast(1.02); }
.wdn-photo-tape--rotate-left  { transform: rotate(-3deg); }
.wdn-photo-tape--rotate-right { transform: rotate(2.5deg); }

/* Two-panel full-bleed band (e.g. "the gym" / "stories") with text
   kept to a readable measure instead of stretching edge-to-edge.
   Approved per-project utility — see Build Sheet §9. */
.wdn-split, .wdn-split > .wp-block-group__inner-container { display: grid; grid-template-columns: 1fr 1fr; }
.wdn-split-panel      { display: flex; padding: var(--wdn-space-lg) var(--wdn-space-md); }
.wdn-split-panel--right { justify-content: flex-end; }
.wdn-split-panel--left  { justify-content: flex-start; }
.wdn-prose-narrow     { max-width: 46ch; width: 100%; }
@media (max-width: 782px) {
  .wdn-split { grid-template-columns: 1fr; }
  .wdn-split-panel--right, .wdn-split-panel--left { justify-content: flex-start; }
}

@media (max-width: 782px) {
  .wdn-card-grid { grid-template-columns: 1fr; }
}

/* =====================================================
   4. LAYOUT FIXES — this design never uses GP's sidebar;
   every page runs full-width, and full-bleed (alignfull)
   sections need to escape GP's boxed container entirely.
   Kept here (CSS only) per Build Sheet — no template edits.
   ===================================================== */
.widget-area.sidebar { display: none !important; }
#primary, .content-area, .site-main, .inside-article {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
}
.site-content { display: block !important; }
.inside-article {
  background: transparent !important;
  padding: 0 !important;
  box-shadow: none !important;
  border: none !important;
}

.entry-content .alignfull {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
.wdn-split, .wdn-split > .wp-block-group__inner-container {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
}
.wdn-card-grid, .wdn-card-grid > .wp-block-group__inner-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
}

/* The homepage's hero already establishes context — the default
   GP page-title heading above it is redundant on this page only. */
body.home .entry-header .entry-title {
  display: none;
}

/* Dark/ink section text contrast — .entry-content p sets a dark ink
   color globally, which was overriding inherited light text inside
   dark-background sections. Force light text explicitly here instead. */
.wdn-section--dark, .wdn-section--dark p, .wdn-section--dark li,
.wdn-section--dark a:not(.wp-block-button__link) {
  color: var(--wdn-color-bg) !important;
}
.wdn-section--dark .wdn-eyebrow { color: #9FB6D2 !important; }
.wdn-section--ink, .wdn-section--ink p, .wdn-section--ink li {
  color: var(--wdn-color-bg) !important;
}
.wdn-section--ink a:not(.wp-block-button__link) { color: var(--wdn-color-primary) !important; }

/* Footer bottom bar — replaces GP's default styling to match the site */
#colophon, .site-info {
  background: var(--wdn-color-text) !important;
  color: var(--wdn-color-bg) !important;
  border-top: none !important;
}
.site-info { padding: 1.5rem 0 !important; font-size: 0.8rem; text-align: center; }
.site-info a { color: var(--wdn-color-bg); text-decoration: underline; }
.ltg-credit { display: inline-block; margin-left: 0.4em; }
.ltg-credit a { color: var(--wdn-color-primary); font-weight: 600; text-decoration: none; }
.ltg-credit a:hover { text-decoration: underline; }

/* Header logo — sized small and inline with the site title, matching
   the mockup's proportions (the raw uploaded logo file is much larger). */
.site-logo { display: inline-flex; align-items: center; margin-right: 0.75rem; }
.site-logo img.header-image { height: 42px !important; width: auto !important; max-width: none !important; }
.site-branding-container { display: flex; align-items: center; }

/* Top bar — dark strip above the header, matching the mockup */
.ltg-topbar {
  background: var(--wdn-color-text);
  color: #D9CFB8;
}
.ltg-topbar-inner {
  max-width: 1080px;
  margin: 0 auto;
  padding: 9px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: var(--wdn-font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.03em;
}
.ltg-topbar-inner strong { color: var(--wdn-color-bg); }

/* Main header/nav — dark theme matching the mockup, not GP's default white */
.site-header {
  background: var(--wdn-color-text) !important;
  border-bottom: 1px solid #3A362C;
}
.site-header .site-title a,
.site-header .site-title,
.site-header .main-title a {
  color: var(--wdn-color-bg) !important;
  font-family: var(--wdn-font-heading);
}
.main-navigation, .main-navigation .main-nav ul li a {
  background: transparent !important;
  color: #C9BEA4 !important;
  font-family: var(--wdn-font-mono);
  font-size: 0.85rem;
}
.main-navigation .main-nav ul li a:hover { color: var(--wdn-color-bg) !important; }
.main-navigation .menu-toggle { color: var(--wdn-color-bg) !important; }

/* Hero photo stack — three overlapping taped photos, matching the mockup */
.wdn-photo-tape figcaption {
  font-family: var(--wdn-font-mono);
  font-size: 0.625rem;
  color: var(--wdn-color-text-muted);
  margin-top: 4px;
}
.wdn-photo-stack, .wdn-photo-stack > .wp-block-group__inner-container { position: relative; height: 340px; }
.wdn-photo-stack .wdn-photo-tape { position: absolute; }
.wdn-photo-stack__p1 { width: 220px; top: 0; left: 20px; transform: rotate(-4deg); z-index: 2; }
.wdn-photo-stack__p1 img { height: 170px; object-fit: cover; }
.wdn-photo-stack__p2 { width: 190px; top: 60px; right: 0; transform: rotate(3deg); z-index: 1; }
.wdn-photo-stack__p2 img { height: 150px; object-fit: cover; }
.wdn-photo-stack__p3 { width: 170px; bottom: 0; left: 70px; transform: rotate(2deg); z-index: 3; }
.wdn-photo-stack__p3 img { height: 130px; object-fit: cover; }
@media (max-width: 782px) {
  .wdn-photo-stack, .wdn-photo-stack > .wp-block-group__inner-container { height: 260px; margin-top: 1.5rem; }
}

/* Gym facts — key/value rows, matching the mockup's ledger style */
.wdn-gym-facts, .wdn-gym-facts > .wp-block-group__inner-container { font-family: var(--wdn-font-mono); font-size: 0.78rem; margin-bottom: 1.4rem; width: 100%; }
.wdn-gym-facts__row, .wdn-gym-facts__row > .wp-block-group__inner-container {
  display: flex; justify-content: space-between; width: 100%;
  padding: 0.4rem 0; border-bottom: 1px solid rgba(255,255,255,0.12);
}
.wdn-gym-facts__row p { margin: 0; }
.wdn-btn--on-dark .wp-block-button__link { background: var(--wdn-color-bg) !important; color: var(--wdn-color-secondary) !important; }

/* Story list — thumbnail + numbered title + meta, matching the mockup */
.wdn-story-list__item, .wdn-story-list__item > .wp-block-group__inner-container {
  display: flex; gap: 1rem; align-items: flex-start; width: 100%;
  padding: 0.9rem 0; border-bottom: 1px solid var(--wdn-color-border);
}
.wdn-story-list__thumb { flex-shrink: 0; margin: 0; }
.wdn-story-list__thumb img { width: 56px !important; height: 56px !important; object-fit: cover; filter: sepia(0.15); border-radius: 2px; }
.wdn-story-list__num { font-family: var(--wdn-font-mono); font-size: 0.7rem; color: var(--wdn-color-primary); margin: 0 0 2px !important; }
.wdn-story-list__title { font-family: var(--wdn-font-heading); font-size: 1rem; margin: 0 0 2px !important; line-height: 1.3; }
.wdn-story-list__title a { color: var(--wdn-color-text); text-decoration: none; }
.wdn-story-list__meta { font-family: var(--wdn-font-mono); font-size: 0.7rem; color: var(--wdn-color-text-muted); margin: 0 !important; }

/* Archive section header — title left, link right */
.wdn-archive-head, .wdn-archive-head > .wp-block-group__inner-container {
  display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 1.5rem; width: 100%;
}

/* Strip GP's default 40px group-padding inside our nested prose blocks —
   it was compounding at every nesting level, eating available width. Our
   own utility classes already define all intentional spacing here. */
.wdn-prose-narrow .wp-block-group__inner-container,
.wdn-prose-narrow .wp-block-group,
.wdn-story-list .wp-block-group__inner-container,
.wdn-story-list .wp-block-group {
  padding: 0 !important;
}


 *{box-sizing:border-box;margin:0;padding:0;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:'Source Serif 4', serif;
    line-height:1.6;
  }
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1080px;margin:0 auto;padding:0 32px;}
  .display{font-family:'Fraunces', serif;font-optical-sizing:auto;}
  .mono{font-family:'Courier Prime', monospace;letter-spacing:0.02em;}

  header.top{
    background:var(--ink);
    color:var(--paper);
  }
  .top-bar{
    display:flex;align-items:center;justify-content:space-between;
    padding:9px 32px;font-family:'Courier Prime',monospace;font-size:12px;
    max-width:1080px;margin:0 auto;letter-spacing:0.03em;color:#D9CFB8;
  }
  .top-bar strong{color:var(--paper);}
  nav.main{
    display:flex;align-items:center;justify-content:space-between;
    padding:20px 32px;border-bottom:1px solid #3A362C;
    max-width:1080px;margin:0 auto;
  }
  .brand{display:flex;align-items:center;gap:14px;}
  .brand img{height:40px;border-radius:3px;filter:sepia(0.15);}
  .brand .name{font-family:'Fraunces',serif;font-size:22px;color:var(--paper);}
  .nav-links{display:flex;gap:28px;font-size:13px;font-family:'Courier Prime',monospace;}
  .nav-links a{color:#C9BEA4;}
  .nav-links a:hover{color:var(--paper);}

  .hero{
    display:grid;grid-template-columns:1.15fr 1fr;gap:56px;
    padding:64px 32px 56px;align-items:center;
    max-width:1080px;margin:0 auto;
  }
  .eyebrow{font-family:'Courier Prime',monospace;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--rust);margin-bottom:16px;}
  .hero h1{font-size:44px;line-height:1.1;font-weight:500;margin-bottom:20px;max-width:15ch;}
  .hero p{font-size:16.5px;color:var(--ink-soft);max-width:48ch;margin-bottom:26px;}
  .hero .ctas{display:flex;gap:12px;}
  .btn{
    display:inline-block;padding:13px 24px;font-family:'Courier Prime',monospace;
    font-size:13px;letter-spacing:0.03em;border-radius:2px;
  }
  .btn.primary{background:var(--rust);color:var(--paper);}
  .btn.secondary{border:1px solid var(--ink);color:var(--ink);}

  .photo-stack{position:relative;height:340px;}
  .photo-stack .p{
    position:absolute;background:var(--paper);padding:8px 8px 26px;border:1px solid #B9AD8E;
    box-shadow:2px 3px 6px rgba(0,0,0,0.15);
  }
  .photo-stack .p img{display:block;width:100%;height:100%;object-fit:cover;filter:sepia(0.2) contrast(1.02);}
  .photo-stack .p .cap{position:absolute;bottom:6px;left:8px;right:8px;font-family:'Courier Prime',monospace;font-size:10px;color:var(--ink-soft);}
  .photo-stack .p1{width:220px;height:170px;top:0;left:20px;transform:rotate(-4deg);z-index:2;}
  .photo-stack .p2{width:190px;height:150px;top:60px;right:0;transform:rotate(3deg);z-index:1;}
  .photo-stack .p3{width:170px;height:130px;bottom:0;left:70px;transform:rotate(2deg);z-index:3;}
  .tape{
    position:absolute;width:56px;height:20px;background:rgba(237,230,214,0.75);
    border:1px solid rgba(0,0,0,0.08);top:-8px;left:50%;transform:translateX(-50%) rotate(-3deg);
  }

  .split{
    display:grid;grid-template-columns:1fr 1fr;
    border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  }
  .split > div{display:flex;padding:48px 40px;}
  .split .inner{max-width:460px;width:100%;}
  .split .gym{background:var(--navy);color:var(--paper);justify-content:flex-end;}
  .split .gym .inner{padding-left:16px;}
  .split .gym .eyebrow{color:#9FB6D2;}
  .split .stories{background:var(--paper-alt);justify-content:flex-start;}
  .split .stories .inner{padding-right:16px;}
  .split h2{font-family:'Fraunces',serif;font-size:26px;font-weight:500;margin-bottom:14px;}
  .split p{font-size:15px;color:var(--ink-soft);margin-bottom:20px;}
  .split .gym p{color:#C5D2E0;}
  .gym-facts{list-style:none;font-family:'Courier Prime',monospace;font-size:12.5px;margin-bottom:22px;}
  .gym-facts li{padding:6px 0;border-bottom:1px solid rgba(255,255,255,0.12);display:flex;justify-content:space-between;}
  .gym .btn.primary{background:var(--paper);color:var(--navy);}

  .story-list{list-style:none;}
  .story-list li{
    display:flex;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);
  }
  .story-list img{width:64px;height:64px;object-fit:cover;border-radius:2px;filter:sepia(0.15);flex-shrink:0;}
  .story-list .num{font-family:'Courier Prime',monospace;font-size:11px;color:var(--rust);}
  .story-list .t{font-family:'Fraunces',serif;font-size:16px;margin-top:2px;}
  .story-list .m{font-family:'Courier Prime',monospace;font-size:11px;color:var(--ink-soft);margin-top:4px;}

  .archive{padding:56px 32px;max-width:1080px;margin:0 auto;}
  .archive-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px;}
  .archive-head h2{font-family:'Fraunces',serif;font-size:24px;font-weight:500;}
  .archive-head a{font-family:'Courier Prime',monospace;font-size:12px;color:var(--rust);}
  .archive-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
  .archive-grid .frame{
    background:var(--paper);padding:6px 6px 18px;border:1px solid #B9AD8E;
    box-shadow:1px 2px 4px rgba(0,0,0,0.12);position:relative;
  }
  .archive-grid .frame:nth-child(2n){transform:rotate(-2deg);}
  .archive-grid .frame:nth-child(2n+1){transform:rotate(1.5deg);}
  .archive-grid img{width:100%;height:100px;object-fit:cover;filter:sepia(0.2);}
  .archive-grid .cap{font-family:'Courier Prime',monospace;font-size:9.5px;color:var(--ink-soft);position:absolute;bottom:4px;left:6px;}

  footer{
    background:var(--ink);color:#B9AD8E;padding:28px 0;
    font-family:'Courier Prime',monospace;font-size:12px;
  }
  footer .wrap{display:flex;justify-content:space-between;align-items:center;}
  footer a{color:#D9CFB8;}

  @media (max-width:820px){
    .hero, .split{grid-template-columns:1fr;}
    .archive-grid{grid-template-columns:repeat(2,1fr);}
    .photo-stack{height:260px;margin-top:24px;}
  }

/* WN fix: let taped photos float with text wrap (2026-11-10) */
.entry-content .wp-block-image.wdn-photo-tape:has(> figure.alignright){float:right;width:fit-content;max-width:min(320px,48%);margin:.35rem 0 1.25rem 2rem}
.entry-content .wp-block-image.wdn-photo-tape:has(> figure.alignleft){float:left;width:fit-content;max-width:min(320px,48%);margin:.35rem 2rem 1.25rem 0}
.entry-content .wp-block-image.wdn-photo-tape:has(> figure.aligncenter){display:block;width:fit-content;max-width:100%;margin-left:auto;margin-right:auto}
.entry-content .wp-block-image.wdn-photo-tape > figure.alignright,.entry-content .wp-block-image.wdn-photo-tape > figure.alignleft{float:none;margin:0;max-width:100%}
.entry-content .wp-block-image.wdn-photo-tape > figure:not([style*="width"]){width:300px}
.entry-content h2,.entry-content .wdn-section--alt-bg{clear:both}
@media (max-width:640px){.entry-content .wp-block-image.wdn-photo-tape:has(> figure.alignright),.entry-content .wp-block-image.wdn-photo-tape:has(> figure.alignleft){float:none;max-width:100%;margin:1rem auto;display:block}}

/* WN mega menu: Stories (3 columns) and Olympic Notebook (2 columns), desktop only (2026-11-10) */
@media (min-width: 769px) {
  .main-navigation .main-nav ul li.wn-mega { position: static; }
  .main-navigation .main-nav ul li.wn-mega > ul.sub-menu,
  .main-navigation .main-nav ul li.wn-cols-2 > ul.sub-menu {
    display: grid;
    gap: .25rem 2rem;
    padding: 1.25rem 1.5rem;
    width: auto;
    background: var(--base);
    box-shadow: 0 10px 24px rgba(0,0,0,.25);
  }
  .main-navigation .main-nav ul li.wn-mega > ul.sub-menu { grid-template-columns: repeat(3, minmax(190px, 1fr)); left: auto; right: 0; }
  .main-navigation .main-nav ul li.wn-cols-2 > ul.sub-menu { grid-template-columns: repeat(2, minmax(230px, 1fr)); }
  /* column headers */
  .main-navigation .main-nav ul li.wn-mega > ul.sub-menu > li > a {
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: .78em;
    border-bottom: 1px solid var(--wdn-color-border, rgba(0,0,0,.15));
    margin-bottom: .35rem;
  }
  .main-navigation .main-nav ul li.wn-mega > ul.sub-menu > li > a .dropdown-menu-toggle { display: none; }
  /* third level shows as a plain list under its header */
  .main-navigation .main-nav ul li.wn-mega ul.sub-menu ul.sub-menu {
    position: static;
    display: block;
    opacity: 1;
    visibility: visible;
    height: auto;
    width: auto;
    left: auto;
    pointer-events: auto;
    box-shadow: none;
    background: transparent;
    transform: none;
  }
  .main-navigation .main-nav ul li.wn-mega ul.sub-menu ul.sub-menu a { padding-top: .3rem; padding-bottom: .3rem; }
  .main-navigation .main-nav ul li.wn-mega > ul.sub-menu > li,
  .main-navigation .main-nav ul li.wn-cols-2 > ul.sub-menu > li { width: auto; }
}
/* Homepage story cards are links (replaces the old WPCode snippet) */
.story-list a.story-link { display: block; color: inherit; text-decoration: none; }
.story-list a.story-link:hover .t, .story-list a.story-link:focus .t { text-decoration: underline; }
/* WN mobile gutter: inner pages had text touching the screen edge (2026-11-10) */
@media (max-width: 768px) {
  body:not(.home) .inside-article { padding-left: 16px !important; padding-right: 16px !important; }
}
/* WN card grid fix: when WordPress adds an inner container, only the inner one is the grid (stops a 1148px-wide row on phones) */
.wdn-card-grid:has(> .wp-block-group__inner-container) { display: block !important; }
.wdn-card-grid > .wp-block-group__inner-container { min-width: 0; }

/* WN menu row under the header (2026-11-10) */
#site-navigation.main-navigation { background-color: rgb(36, 33, 28) !important; border-top: 1px solid rgba(255,255,255,.08); }
.main-navigation .menu-toggle, .main-navigation .menu-toggle:hover, .main-navigation .menu-toggle:focus { color: rgb(201, 190, 164); background: transparent; }
@media (min-width: 769px) {
  .main-navigation .inside-navigation { justify-content: center; }
  .main-navigation .main-nav > ul { justify-content: center; flex-wrap: nowrap; }
  .main-navigation .main-nav > ul > li > a { padding-left: 14px; padding-right: 4px; line-height: 52px; }
  .main-navigation .main-nav > ul > li > a .dropdown-menu-toggle { padding-left: 6px; padding-right: 10px; }
  .main-navigation .main-nav > ul > li:not(.wn-cols-2) > ul.sub-menu { width: auto; min-width: 250px; }
  .main-navigation .main-nav > ul > li:not(.wn-cols-2) > ul.sub-menu a { white-space: nowrap; }
}
@media (min-width: 769px) {
  .main-navigation .main-nav { flex: 1 1 auto; }
  .main-navigation .main-nav > ul > li > a { white-space: nowrap; }
}
@media (min-width: 769px) and (max-width: 1180px) {
  .main-navigation .main-nav > ul { flex-wrap: wrap; }
  .main-navigation .main-nav > ul > li > a { font-size: 12px; padding-left: 7px; padding-right: 2px; line-height: 46px; }
  .main-navigation .main-nav > ul > li > a .dropdown-menu-toggle { padding-left: 4px; padding-right: 5px; }
  .main-navigation .inside-navigation { padding-left: 10px; padding-right: 10px; }
}
@media (min-width: 769px) and (max-width: 960px) {
  .main-navigation .main-nav > ul > li > a { font-size: 10.5px; padding-left: 5px; }
}