/*
Theme Name:   Glow In My Own Way Child
Theme URI:    https://glowinmyownway.org
Description:  Stained Glass / Leaded Panel editorial child theme for Glow In My Own Way. Leaded image grids with arched caps, deep teal and apricot, Lustria and Be Vietnam Pro.
Author:       Naomi Threadgill
Template:     generatepress
Version:      1.0.0
*/

/* ============================================================
   GLOW IN MY OWN WAY - DESIGN SYSTEM
   Archetype : Stained Glass / Leaded Panel
     - thick dark "leading" (--lead-w) divides unequal-height image panels
     - arched caps sit ONLY on homepage image panels, never on page headers
     - glass-shard triangles mark section rules
   Fonts     : Lustria (display) + Be Vietnam Pro (text)
   Motion    : dial 1. Hover-only transitions. No JS, no scroll effects.
   Radius    : 0 everywhere. Exceptions by design: editor portrait circle,
               arched image caps.
   ============================================================ */

:root {
  /* teal is the single accent; violet is a LINE accent only (rules, stiles,
     hover strokes). Never a fill, never a gradient, never a glow. */
  --color-primary: #235B5E;
  --color-primary-dark: #17403F;
  --color-primary-soft: #D6E2E1;
  --color-lead: #1C3A3C;

  --color-accent: #6B4A82;
  --color-accent-soft: #B9A3C9;
  --color-accent-deep: #4E3460;

  --color-apricot: #F3DEC6;
  --color-apricot-deep: #E6C6A2;

  --color-bg: #F7F6F3;
  --color-bg-deep: #EDEBE6;
  --color-ink: #1A1F1E;
  --color-charcoal: #232A29;
  --color-muted: #5C6664;
  --color-line: #D8D5CE;
  --color-white: #FFFFFF;

  --font-serif: 'Lustria', Georgia, 'Times New Roman', serif;
  --font-sans: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, sans-serif;

  --max-w: 1240px;
  --max-w-wide: 1440px;
  --max-w-narrow: 720px;

  --lead-w: 8px;

  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
  --radius-xl: 0;
}

/* ============================================================
   GLOBAL
   ============================================================ */
body, .entry-content, .widget {
  font-family: var(--font-sans);
  color: var(--color-ink);
  background: var(--color-bg);
  font-size: 17px;
  line-height: 1.72;
  letter-spacing: 0.003em;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-serif);
  font-weight: 400;
  color: var(--color-ink);
  letter-spacing: 0;
  line-height: 1.16;
}
h1 { font-size: clamp(2.1rem, 4.4vw, 3.15rem); }
h2 { font-size: clamp(1.55rem, 2.7vw, 2.1rem); margin-top: 2.3em; margin-bottom: 0.55em; }
h3 { font-size: 1.3rem; margin-top: 1.9em; margin-bottom: 0.45em; }

a {
  color: var(--color-primary-dark);
  text-decoration: underline;
  text-decoration-color: var(--color-primary-soft);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 0.2s, text-decoration-color 0.2s;
}
a:hover { color: var(--color-primary); text-decoration-color: var(--color-accent); }
p { margin: 0 0 1.2em; }

img { max-width: 100%; height: auto; border-radius: 0; }
figure { margin: 2em 0; }
figcaption { font-size: 0.9rem; color: var(--color-muted); margin-top: 0.5rem; }
hr { border: none; height: 2px; background: var(--color-lead); margin: 3em 0; }

blockquote {
  border-left: var(--lead-w) solid var(--color-accent);
  background: transparent;
  padding: 0.5rem 0 0.5rem 1.7rem;
  margin: 2.2em 0;
  font-family: var(--font-serif);
  font-size: 1.24rem;
  line-height: 1.42;
  color: var(--color-ink);
}

/* Glass shard: the signature accent triangle. Pure CSS clip-path, no SVG. */
.gw-shard {
  display: block;
  width: 14px; height: 12px;
  flex: none;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background: var(--color-accent);
}
.gw-shard.apricot { background: var(--color-apricot-deep); }
.gw-shard.small { width: 9px; height: 8px; }

/* Eyebrow helper kept for archive/single only. The homepage uses ZERO. */
.tb-eyebrow {
  font-family: var(--font-sans);
  font-size: 0.73rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--color-primary);
  font-weight: 600;
}

/* ============================================================
   MASTHEAD + NAV (sticky brand bar)
   ============================================================ */
.gw-masthead {
  background: var(--color-bg);
  padding: 2.4rem 1.5rem 1.9rem;
  text-align: left;
}
.gw-masthead-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 2rem;
  flex-wrap: wrap;
}
.gw-masthead-title {
  font-family: var(--font-serif);
  font-size: clamp(1.9rem, 3.4vw, 2.75rem);
  color: var(--color-ink);
  text-decoration: none;
  line-height: 1.05;
  display: block;
}
.gw-masthead-title:hover { color: var(--color-primary); text-decoration: none; }
.gw-masthead-tagline {
  font-family: var(--font-sans);
  font-size: 0.95rem;
  color: var(--color-muted);
  margin-top: 0.45rem;
  max-width: 46ch;
}
.gw-masthead-meta {
  font-family: var(--font-sans);
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  color: var(--color-muted);
  text-transform: uppercase;
  padding-bottom: 0.3rem;
}

.gw-nav {
  position: sticky;
  top: 0;
  z-index: 40;
  background: var(--color-bg);
  border-top: var(--lead-w) solid var(--color-lead);
  border-bottom: var(--lead-w) solid var(--color-lead);
}
.gw-nav-inner { max-width: var(--max-w); margin: 0 auto; padding: 0 1.5rem; }
.gw-nav-menu {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.7rem;
  list-style: none;
  margin: 0;
  padding: 0;
  min-height: 56px;
  align-items: center;
}
.gw-nav-menu li { list-style: none; margin: 0; padding: 0; }
.gw-nav-menu li a {
  font-family: var(--font-sans);
  font-size: 0.83rem;
  font-weight: 500;
  letter-spacing: 0.045em;
  color: var(--color-muted);
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 2px solid transparent;
  transition: color 0.2s, border-color 0.2s;
  white-space: nowrap;
}
.gw-nav-menu li a:hover,
.gw-nav-menu li.current-menu-item > a {
  color: var(--color-primary);
  border-bottom-color: var(--color-accent);
}

.tb-main { display: block; width: 100%; }
/* NOTE: never add `.tb-main > * { display:block }` - it flattens grid children. */
.tb-main > * { width: 100%; }

/* ============================================================
   HOMEPAGE 1. HERO - brand-forward, title beside the image
   ============================================================ */
.gw-hero {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 3.4rem 1.5rem 5rem;
  display: grid;
  grid-template-columns: 3fr 2fr;
  gap: var(--lead-w);
  align-items: stretch;
}
.gw-hero-fig {
  position: relative;
  background: var(--color-lead);
  overflow: hidden;
  min-height: 520px;
  margin: 0;
  display: block;
}
.gw-hero-fig img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.82) contrast(1.02) brightness(1.06);
  border-radius: 0;
}
/* apricot light-spill + cool teal cast: the "light / mirror" language */
.gw-hero-fig::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;
  background:
    radial-gradient(78% 62% at 88% 14%, rgba(243,222,198,0.52), rgba(243,222,198,0) 62%),
    linear-gradient(200deg, rgba(35,91,94,0.16), rgba(35,91,94,0) 48%);
}
.gw-hero-panel {
  background: var(--color-apricot);
  padding: 3.2rem 2.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.1rem;
}
.gw-hero-panel h1 { font-size: clamp(2.1rem, 3.4vw, 3rem); line-height: 1.1; margin: 0; }
.gw-hero-panel h1 a { color: inherit; text-decoration: none; }
.gw-hero-panel h1 a:hover { color: var(--color-primary-dark); }
.gw-hero-rule { display: flex; align-items: center; gap: 0.6rem; }
.gw-hero-rule i { display: block; height: 2px; width: 56px; background: var(--color-accent); }
.gw-hero-panel .lead {
  font-size: 1.02rem;
  color: #4A423C;
  margin: 0;
  max-width: 36ch;
}
.gw-hero-sig {
  font-family: var(--font-serif);
  font-size: 0.98rem;
  color: var(--color-primary-dark);
  padding-top: 1.1rem;
  border-top: 1px solid rgba(28,58,60,0.22);
}
.gw-hero-sig a { color: inherit; text-decoration: none; border-bottom: 1px solid rgba(28,58,60,0.3); }

/* ============================================================
   SECTION SHELL - a full-bleed lead rule between "rooms"
   ============================================================ */
.gw-sec { max-width: var(--max-w); margin: 0 auto; padding: 5rem 1.5rem; }
.gw-sec-head { margin-bottom: 2.5rem; max-width: 58ch; }
.gw-sec-rule { display: flex; align-items: center; gap: 0.7rem; margin-bottom: 1rem; }
.gw-sec-rule i { display: block; height: 2px; flex: 1; max-width: 150px; background: var(--color-accent); }
.gw-sec-title { font-size: clamp(1.9rem, 3vw, 2.6rem); margin: 0; }
.gw-sec-deck { margin: 0.8rem 0 0; color: var(--color-muted); font-size: 1rem; max-width: 54ch; }
.gw-band { border-top: var(--lead-w) solid var(--color-lead); }
.gw-more {
  font-family: var(--font-sans);
  font-size: 0.79rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--color-primary);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 1rem;
}
.gw-more:hover { color: var(--color-accent-deep); }

/* ============================================================
   HOMEPAGE 2. THE WINDOWS - leaded grid, explicit placement
   4 cols x 3 rows = 12 units. 4 tall (span 2) + 4 short = 12.
   Exactly filled: no empty cells. Placement is set inline per panel
   in front-page.php so every column has a different tall/short order.
   ============================================================ */
.gw-windows {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 190px;
  gap: var(--lead-w);
  background: var(--color-lead);
  border: var(--lead-w) solid var(--color-lead);
}
/* The cell itself is filled with LEAD, so the corners left uncovered by the
   arch read as leading rather than as page background. */
.gw-win {
  position: relative;
  display: block;
  text-decoration: none;
  background: var(--color-lead);
  overflow: hidden;
}
.gw-win.h2 { grid-row: span 2; }
.gw-win-img {
  position: relative;
  height: 100%;
  overflow: hidden;
  border-radius: 50% 50% 0 0 / 22% 22% 0 0;   /* arched cap: homepage panels only */
}
.gw-win-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.84) contrast(1.03);
  border-radius: 0;
  transition: filter 0.3s ease;
}
.gw-win-img::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(26,31,30,0.78) 0, rgba(26,31,30,0.16) 42%, rgba(26,31,30,0) 66%);
}
.gw-win:hover .gw-win-img img { filter: saturate(1) contrast(1.03); }
.gw-win-label { position: absolute; left: 1.15rem; right: 1.15rem; bottom: 1.05rem; z-index: 2; }
.gw-win-name { font-family: var(--font-serif); font-size: 1.14rem; color: #fff; line-height: 1.2; }
.gw-win.h2 .gw-win-name { font-size: 1.48rem; }
.gw-win-n {
  font-family: var(--font-sans);
  font-size: 0.73rem; font-weight: 500; letter-spacing: 0.085em;
  color: rgba(255,255,255,0.74); margin-top: 0.26rem;
}
/* Placeholder when a section has no thumbnail: an apricot pane, never a hole. */
.gw-pane-ph {
  height: 100%;
  background: var(--color-apricot);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-serif);
  font-size: 3rem;
  color: var(--color-primary);
  border-radius: 50% 50% 0 0 / 22% 22% 0 0;
}
.gw-pane-ph.flat { border-radius: 0; font-size: 2.2rem; }

/* ============================================================
   HOMEPAGE 3. EDITOR'S LETTER - apricot warm room
   ============================================================ */
.gw-letter {
  background: var(--color-apricot);
  border-top: var(--lead-w) solid var(--color-lead);
  border-bottom: var(--lead-w) solid var(--color-lead);
}
.gw-letter-inner { max-width: 820px; margin: 0 auto; padding: 4.4rem 1.5rem; text-align: center; }
.gw-letter-portrait {
  width: 132px; height: 132px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 1.5rem;
  filter: saturate(0.86);
  box-shadow: 0 0 0 var(--lead-w) var(--color-lead);
  display: flex; align-items: center; justify-content: center;
  background: var(--color-primary);
  color: var(--color-apricot);
  font-family: var(--font-serif);
  font-size: 2.6rem;
}
.gw-letter h2 { font-size: clamp(1.65rem, 2.5vw, 2.15rem); margin: 0 0 1.05rem; }
.gw-letter p { color: #4A423C; font-size: 1.03rem; margin: 0 0 1rem; text-align: left; }
.gw-letter-sig {
  font-family: var(--font-serif);
  font-size: 1.06rem;
  color: var(--color-primary-dark);
  margin-top: 1.5rem;
}

/* ============================================================
   HOMEPAGE 4. LATEST - asymmetric trio (1 lead + 2 stacked)
   ============================================================ */
.gw-trio {
  display: grid;
  grid-template-columns: 1.32fr 1fr;
  gap: var(--lead-w);
  background: var(--color-lead);
  border: var(--lead-w) solid var(--color-lead);
}
.gw-trio-side { display: grid; grid-template-rows: 1fr 1fr; gap: var(--lead-w); }
.gw-card { background: var(--color-bg); text-decoration: none; display: flex; flex-direction: column; }
.gw-card:hover { text-decoration: none; }
.gw-card-img { overflow: hidden; background: var(--color-primary-soft); }
.gw-card-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.85) contrast(1.02);
  border-radius: 0;
  transition: filter 0.3s ease;
}
.gw-card:hover .gw-card-img img { filter: saturate(1) contrast(1.02); }
.gw-trio-lead .gw-card-img { aspect-ratio: 4 / 3.4; }
.gw-trio-side .gw-card { flex-direction: row; align-items: stretch; }
.gw-trio-side .gw-card-img { width: 42%; flex: none; }
.gw-card-body {
  padding: 1.45rem 1.55rem 1.6rem;
  display: flex; flex-direction: column; gap: 0.42rem;
  flex: 1; justify-content: center;
}
.gw-cat {
  font-family: var(--font-sans);
  font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.11em; text-transform: uppercase;
  color: var(--color-primary);
}
.gw-card h3 { font-size: 1.22rem; line-height: 1.26; margin: 0; }
.gw-trio-lead h3 { font-size: 1.72rem; }
.gw-card p { margin: 0.2rem 0 0; font-size: 0.94rem; color: var(--color-muted); line-height: 1.6; }
.gw-date { font-family: var(--font-sans); font-size: 0.78rem; color: var(--color-muted); margin-top: 0.18rem; }
.gw-card:hover h3 { color: var(--color-primary); }

/* ============================================================
   HOMEPAGE 5. PULL QUOTE - dark teal band, violet stile
   ============================================================ */
.gw-quote {
  background: var(--color-primary-dark);
  color: var(--color-bg);
  border-top: var(--lead-w) solid var(--color-lead);
  border-bottom: var(--lead-w) solid var(--color-lead);
}
.gw-quote-inner {
  max-width: 860px;
  margin: 0 auto;
  padding: 4.4rem 1.5rem 4.4rem 2.6rem;
  border-left: var(--lead-w) solid var(--color-accent);
}
.gw-quote blockquote {
  margin: 0; padding: 0; border: none; background: none;
  font-family: var(--font-serif);
  font-size: clamp(1.35rem, 2.5vw, 2rem);
  line-height: 1.4;
  color: var(--color-bg);
}
.gw-quote-src { margin-top: 1.35rem; font-family: var(--font-sans); font-size: 0.86rem; color: rgba(247,246,243,0.66); }
.gw-quote-src a { color: var(--color-apricot); text-decoration-color: rgba(243,222,198,0.4); }

/* ============================================================
   HOMEPAGE 6. LEADED MOSAIC - unequal-height leaded grid
   ============================================================ */
.gw-mosaic {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 132px;
  gap: var(--lead-w);
  background: var(--color-lead);
  border: var(--lead-w) solid var(--color-lead);
}
.gw-tile {
  position: relative;
  display: block;
  text-decoration: none;
  background: var(--color-lead);
  overflow: hidden;
}
.gw-tile img {
  width: 100%; height: 100%;
  object-fit: cover;
  filter: saturate(0.84) contrast(1.02);
  border-radius: 0;
  transition: filter 0.3s ease;
}
.gw-tile:hover img { filter: saturate(1) contrast(1.02); }
.gw-tile::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(26,31,30,0.8) 0, rgba(26,31,30,0.1) 52%, rgba(26,31,30,0) 74%);
}
.gw-tile-cap { position: absolute; left: 1rem; right: 1rem; bottom: 0.85rem; z-index: 2; color: #fff; }
.gw-tile-cap .t { font-family: var(--font-serif); font-size: 1.02rem; line-height: 1.24; }
.gw-tile-cap .m {
  font-family: var(--font-sans);
  font-size: 0.71rem; letter-spacing: 0.08em;
  color: rgba(255,255,255,0.72); margin-top: 0.18rem;
}
.gw-tile.s2 { grid-row: span 2; }
.gw-tile.s3 { grid-row: span 3; }
.gw-tile.c2 { grid-column: span 2; }
.gw-tile.s3 .gw-tile-cap .t { font-size: 1.4rem; }
.gw-tile.c2 .gw-tile-cap .t { font-size: 1.18rem; }

/* ============================================================
   HOMEPAGE 7. BY SECTION - thumbnail hairline rows
   ============================================================ */
.gw-bysec { background: var(--color-bg-deep); border-top: var(--lead-w) solid var(--color-lead); }
.gw-bysec-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.3rem; }
.gw-bysec-col h3 {
  font-size: 1.14rem;
  margin: 0 0 0.85rem;
  padding-bottom: 0.65rem;
  border-bottom: 2px solid var(--color-lead);
}
.gw-bysec-col h3 a { color: inherit; text-decoration: none; }
.gw-bysec-col h3 a:hover { color: var(--color-primary); }
.gw-bysec-col ul { list-style: none; margin: 0; padding: 0; }
.gw-bysec-col li {
  display: flex; gap: 0.85rem;
  padding: 0.78rem 0;
  border-bottom: 1px solid var(--color-line);
}
.gw-bysec-col li:last-child { border-bottom: none; }
.gw-bysec-thumb { width: 62px; height: 62px; flex: none; display: block; overflow: hidden; }
.gw-bysec-thumb img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.84); border-radius: 0; }
.gw-bysec-col li .t { font-family: var(--font-serif); font-size: 0.97rem; line-height: 1.3; margin: 0; }
.gw-bysec-col li .t a { color: var(--color-ink); text-decoration: none; }
.gw-bysec-col li .t a:hover { color: var(--color-primary); }
.gw-bysec-col li .d { font-family: var(--font-sans); font-size: 0.75rem; color: var(--color-muted); margin-top: 0.16rem; }

/* ============================================================
   HOMEPAGE 8. NEWSLETTER - dark teal band
   ============================================================ */
.gw-news {
  background: var(--color-primary);
  color: var(--color-bg);
  border-top: var(--lead-w) solid var(--color-lead);
  padding: 4.2rem 1.5rem;
  text-align: center;
}
.gw-news-inner { max-width: 600px; margin: 0 auto; }
.gw-news h3 { font-size: clamp(1.45rem, 2.3vw, 1.95rem); margin: 0 0 0.75rem; color: var(--color-bg); }
.gw-news p { color: rgba(247,246,243,0.82); font-size: 0.98rem; margin: 0 0 1.6rem; }
.gw-news-form { display: flex; gap: var(--lead-w); justify-content: center; flex-wrap: wrap; }
.gw-news-form input[type="email"] {
  flex: 1; min-width: 230px; max-width: 330px;
  padding: 0.85rem 1rem;
  border: 0; border-radius: 0;
  background: var(--color-bg);
  color: var(--color-ink);
  font-family: var(--font-sans);
  font-size: 0.95rem;
}
.gw-news-form input[type="email"]::placeholder { color: #7C8583; }
.gw-news-form input[type="email"]:focus { outline: 3px solid var(--color-apricot); outline-offset: 0; }
.gw-news-form button {
  padding: 0.85rem 1.8rem;
  border: 0; border-radius: 0;
  background: var(--color-accent);
  color: #fff;
  font-family: var(--font-sans);
  font-size: 0.85rem; font-weight: 600;
  letter-spacing: 0.07em; text-transform: uppercase;
  cursor: pointer; white-space: nowrap;
  transition: background 0.2s;
}
.gw-news-form button:hover { background: var(--color-accent-deep); }
.gw-news-note { font-size: 0.78rem; color: rgba(247,246,243,0.62); margin-top: 1.05rem; }
.gw-news-note a { color: inherit; text-decoration: underline; }

/* ============================================================
   SINGLE POST
   ============================================================ */
.single .entry-content, .page .entry-content {
  max-width: var(--max-w-narrow);
  margin: 0 auto;
  padding: 0 1.5rem;
  font-size: 1.06rem;
  line-height: 1.78;
}
.single .entry-content > p:first-of-type::first-letter {
  font-family: var(--font-serif);
  font-size: 3.5rem;
  float: left;
  line-height: 0.86;
  padding: 0.14em 0.1em 0 0;
  color: var(--color-primary);
}

.gw-post-header { max-width: var(--max-w-narrow); margin: 3.2rem auto 1.8rem; padding: 0 1.5rem; }
.gw-breadcrumb { font-family: var(--font-sans); font-size: 0.78rem; color: var(--color-muted); margin-bottom: 1.1rem; }
.gw-breadcrumb a { color: var(--color-primary); text-decoration: none; }
.gw-breadcrumb a:hover { text-decoration: underline; }
.gw-post-cat {
  display: inline-flex; align-items: center; gap: 0.5rem;
  font-family: var(--font-sans); font-size: 0.73rem; font-weight: 600;
  letter-spacing: 0.11em; text-transform: uppercase;
  color: var(--color-primary); text-decoration: none;
  margin-bottom: 0.9rem;
}
.gw-post-title { font-size: clamp(1.95rem, 4vw, 2.9rem); margin: 0 0 1rem; }
.gw-post-meta {
  font-family: var(--font-sans); font-size: 0.85rem; color: var(--color-muted);
  display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center;
  padding-top: 0.9rem; border-top: 2px solid var(--color-lead);
}
.gw-post-meta strong { color: var(--color-ink); font-weight: 600; }
.gw-post-cover { max-width: var(--max-w); margin: 0 auto 2.6rem; padding: 0 1.5rem; }
.gw-post-cover img {
  width: 100%; border-radius: 0;
  border: var(--lead-w) solid var(--color-lead);
  filter: saturate(0.85) contrast(1.02);
}

.ftc-disclosure {
  max-width: var(--max-w-narrow);
  margin: 0 auto 2rem;
  padding: 1rem 1.2rem;
  background: var(--color-apricot);
  border-left: var(--lead-w) solid var(--color-lead);
  font-size: 0.9rem;
  color: #4A423C;
}
.ftc-disclosure p { margin: 0; }
.entry-content .ftc-disclosure { margin-left: auto; margin-right: auto; }

.single .entry-content blockquote {
  border-left: var(--lead-w) solid var(--color-accent);
  background: transparent;
  padding: 0.4rem 0 0.4rem 1.6rem;
  margin: 2.4rem 0;
  font-style: normal;
  color: var(--color-ink);
}

.gw-author-bio {
  max-width: var(--max-w-narrow);
  margin: 4rem auto 2rem;
  padding: 2rem;
  background: var(--color-bg-deep);
  border-left: var(--lead-w) solid var(--color-lead);
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 1.5rem;
  align-items: start;
}
.gw-author-avatar {
  width: 92px; height: 92px;
  border-radius: 50%;
  background: var(--color-primary);
  color: var(--color-apricot);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-serif); font-size: 1.9rem;
}
.gw-author-bio h4 { margin: 0.3rem 0 0.4rem; font-size: 1.14rem; }
.gw-author-bio p { font-size: 0.96rem; color: var(--color-muted); margin: 0 0 0.5rem; line-height: 1.62; }
.gw-author-bio a { font-family: var(--font-sans); font-size: 0.85rem; }

.gw-related { max-width: var(--max-w); margin: 4rem auto 3rem; padding: 0 1.5rem; }
.gw-related h3 {
  font-size: 1.38rem; margin: 0 0 1.4rem;
  padding-bottom: 0.6rem; border-bottom: 2px solid var(--color-lead);
}
.gw-related-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--lead-w);
  background: var(--color-lead);
  border: var(--lead-w) solid var(--color-lead);
}
.gw-related-card { text-decoration: none; color: inherit; display: block; background: var(--color-bg); }
.gw-related-cover { aspect-ratio: 4/3; overflow: hidden; background: var(--color-primary-soft); }
.gw-related-cover img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.85); border-radius: 0; }
.gw-related-title { font-family: var(--font-serif); font-size: 1.06rem; line-height: 1.3; margin: 0; padding: 1rem 1.1rem 1.2rem; }
.gw-related-card:hover .gw-related-title { color: var(--color-primary); }

/* ============================================================
   ARCHIVE
   ============================================================ */
.gw-archive-hero {
  background: var(--color-apricot);
  border-bottom: var(--lead-w) solid var(--color-lead);
  padding: 3.6rem 1.5rem 3.2rem;
}
.gw-archive-hero-inner { max-width: var(--max-w); margin: 0 auto; }
.gw-archive-hero h1 { font-size: clamp(1.95rem, 3.5vw, 2.8rem); margin: 0 0 0.55rem; }
.gw-archive-hero .count {
  font-family: var(--font-sans); font-size: 0.79rem; font-weight: 600;
  letter-spacing: 0.11em; text-transform: uppercase; color: var(--color-primary-dark);
}
.gw-archive-hero p { max-width: 62ch; margin: 0.8rem 0 0; color: #4A423C; }

.gw-archive-grid {
  max-width: var(--max-w);
  margin: 3rem auto;
  padding: 0 1.5rem;
}
.gw-archive-inner {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--lead-w);
  background: var(--color-lead);
  border: var(--lead-w) solid var(--color-lead);
}
.gw-archive-card { background: var(--color-bg); text-decoration: none; color: inherit; display: flex; flex-direction: column; }
.gw-archive-cover { aspect-ratio: 4/3; overflow: hidden; background: var(--color-primary-soft); }
.gw-archive-cover img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.85); border-radius: 0; transition: filter 0.3s; }
.gw-archive-card:hover .gw-archive-cover img { filter: saturate(1); }
.gw-archive-body { padding: 1.3rem 1.4rem 1.5rem; display: flex; flex-direction: column; gap: 0.4rem; flex: 1; }
.gw-archive-title { font-family: var(--font-serif); font-size: 1.2rem; line-height: 1.28; margin: 0; }
.gw-archive-excerpt { font-size: 0.93rem; color: var(--color-muted); line-height: 1.56; margin: 0; }
.gw-archive-card:hover .gw-archive-title { color: var(--color-primary); }

.gw-pagination { max-width: var(--max-w); margin: 2rem auto 4rem; padding: 0 1.5rem; text-align: center; }
.gw-pagination .page-numbers {
  display: inline-block; padding: 0.5rem 0.9rem;
  font-family: var(--font-sans); font-size: 0.88rem;
  text-decoration: none; color: var(--color-primary-dark);
  border: 2px solid var(--color-line);
  margin: 0 0.15rem;
}
.gw-pagination .page-numbers.current,
.gw-pagination .page-numbers:hover { background: var(--color-lead); color: var(--color-bg); border-color: var(--color-lead); }

/* ============================================================
   TRUST PAGES - "The Facing Panel"
   Signature: a left-aligned solid teal lead plate with an apricot light
   band down its right edge (a mirror catching light). Square corners.
   NO arch here: the arch belongs to homepage image panels only.
   ============================================================ */
.gw-panel-main { padding-bottom: 1rem; }

.gw-panel-head {
  max-width: 900px;
  margin: 2.6rem auto 0;
  padding: 0 1.5rem;
}
.gw-panel-plate {
  position: relative;
  background: var(--color-primary-dark);
  color: var(--color-bg);
  padding: 2.9rem 3.4rem 2.2rem 2.6rem;
  border-radius: 0;
}
/* the light band: apricot vertical strip down the right edge of the plate */
.gw-panel-plate::after {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 14px;
  background: linear-gradient(to bottom, var(--color-apricot), var(--color-apricot-deep));
}
.gw-panel-title {
  font-family: var(--font-serif);
  font-size: clamp(1.9rem, 3.6vw, 2.7rem);
  color: var(--color-bg);
  margin: 0;
  line-height: 1.1;
}
.gw-panel-updated {
  font-family: var(--font-sans);
  font-size: 0.79rem;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: rgba(247,246,243,0.72);
  margin: 1.4rem 0 0;
  padding-top: 1rem;
  border-top: 2px solid var(--color-accent);
}

/* two-column leaded sommaire: square cells split by 3px leading */
.gw-panel-toc {
  max-width: 900px;
  margin: 2.4rem auto 0;
  padding: 0 1.5rem;
}
.gw-panel-toc-label {
  font-family: var(--font-sans);
  font-size: 0.74rem; font-weight: 600;
  letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--color-muted);
  display: block; margin-bottom: 0.8rem;
}
.gw-panel-toc ul {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 3px;
  background: var(--color-lead);
  border: 3px solid var(--color-lead);
}
.gw-panel-toc li { margin: 0; }
.gw-panel-toc li a {
  display: block;
  background: var(--color-bg);
  padding: 0.72rem 0.95rem;
  font-family: var(--font-sans);
  font-size: 0.9rem;
  color: var(--color-ink);
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}
.gw-panel-toc li a:hover { background: var(--color-apricot); color: var(--color-primary-dark); }

.gw-panel-body {
  max-width: 900px;
  margin: 2.8rem auto 0;
  padding: 0 1.5rem;
  font-size: 1.04rem;
  line-height: 1.76;
}
/* h2: left lead stile + a violet rule with an apricot shard above it.
   No numbering, no small caps. */
.gw-panel-body h2 {
  position: relative;
  font-size: clamp(1.4rem, 2.3vw, 1.75rem);
  margin: 2.8em 0 0.7em;
  padding: 0.9rem 0 0.1rem 1.2rem;
  border-left: var(--lead-w) solid var(--color-primary);
}
.gw-panel-body h2::before {
  content: "";
  position: absolute; top: 0; left: 1.2rem;
  width: 88px; height: 2px;
  background: var(--color-accent);
}
.gw-panel-body h2::after {
  content: "";
  position: absolute; top: -5px; left: calc(1.2rem + 96px);
  width: 10px; height: 9px;
  clip-path: polygon(50% 0, 100% 100%, 0 100%);
  background: var(--color-apricot-deep);
}
.gw-panel-body h2:first-child { margin-top: 0; }
.gw-panel-body h3 { font-size: 1.2rem; margin: 2em 0 0.5em; }
/* identity block: a "pane" held by two lead cames, left and right only */
.gw-panel-body > p:has(> strong:first-child) {
  background: rgba(243,222,198,0.42);
  border-left: var(--lead-w) solid var(--color-primary);
  border-right: var(--lead-w) solid var(--color-primary);
  padding: 1rem 1.3rem;
  margin: 1.5em 0;
}
.gw-panel-body ul, .gw-panel-body ol { padding-left: 1.3rem; }
.gw-panel-body li { margin-bottom: 0.5em; }

/* footer cross-links: a row of equal leaded panes, each with a violet shard */
.gw-panel-foot {
  max-width: var(--max-w);
  margin: 4rem auto 3rem;
  padding: 0 1.5rem;
}
.gw-panel-foot-title {
  font-family: var(--font-serif);
  font-size: 1.32rem;
  margin: 0 0 1.2rem;
  padding-bottom: 0.6rem;
  border-bottom: 2px solid var(--color-lead);
}
.gw-panel-links {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--lead-w);
  background: var(--color-lead);
  border: var(--lead-w) solid var(--color-lead);
}
.gw-panel-link {
  background: var(--color-bg);
  padding: 1.5rem 1rem 1.2rem;
  text-align: center;
  font-family: var(--font-sans);
  font-size: 0.9rem;
  color: var(--color-ink);
  text-decoration: none;
  display: flex; flex-direction: column; align-items: center; gap: 0.75rem;
  transition: background 0.2s, color 0.2s;
}
.gw-panel-link .gw-shard { background: var(--color-accent); }
.gw-panel-link:hover { background: var(--color-apricot); color: var(--color-primary-dark); }
.gw-panel-note {
  max-width: 900px;
  margin: 2rem auto 0;
  padding: 0 1.5rem;
  font-size: 0.93rem;
  color: var(--color-muted);
}

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer, .site-info {
  background: var(--color-primary-dark);
  color: var(--color-bg);
  font-family: var(--font-sans);
  font-size: 0.9rem;
  border-top: var(--lead-w) solid var(--color-lead);
}
.site-footer ul li a { color: var(--color-bg); text-decoration: none; }
.site-footer ul li a:hover { color: var(--color-apricot); }
.site-info a { color: var(--color-bg); text-decoration: underline; }
.footer-widgets, .site-info { padding: 2.5rem 1.5rem; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1000px) {
  .gw-hero { grid-template-columns: 1fr; }
  .gw-hero-fig { min-height: 380px; }
  .gw-windows { grid-template-columns: repeat(2, 1fr); }
  .gw-win { grid-column: auto !important; grid-row: auto !important; }
  .gw-win.h2 { grid-row: span 2 !important; }
  .gw-mosaic { grid-template-columns: repeat(2, 1fr); }
  .gw-bysec-grid { grid-template-columns: repeat(2, 1fr); }
  .gw-archive-inner { grid-template-columns: repeat(2, 1fr); }
  .gw-related-grid { grid-template-columns: repeat(2, 1fr); }
  .gw-panel-links { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 680px) {
  body { font-size: 16px; }
  .gw-sec { padding: 3.3rem 1.1rem; }
  .gw-hero { padding: 2.2rem 1.1rem 3.2rem; }
  .gw-hero-panel { padding: 2.2rem 1.5rem; }
  .gw-masthead { padding: 1.8rem 1.1rem 1.4rem; text-align: center; }
  .gw-masthead-inner { justify-content: center; text-align: center; }
  .gw-masthead-tagline { margin-left: auto; margin-right: auto; }
  .gw-nav-menu { justify-content: flex-start; gap: 1.2rem; overflow-x: auto; padding: 0.6rem 0; }
  .gw-windows { grid-template-columns: 1fr; grid-auto-rows: 236px; }
  .gw-win.h2 { grid-row: auto !important; }
  .gw-trio { grid-template-columns: 1fr; }
  .gw-trio-side .gw-card { flex-direction: column; }
  .gw-trio-side .gw-card-img { width: 100%; aspect-ratio: 16/9; }
  .gw-mosaic { grid-template-columns: 1fr; grid-auto-rows: 175px; }
  .gw-tile.c2 { grid-column: span 1; }
  .gw-tile.s3 { grid-row: span 2; }
  .gw-bysec-grid { grid-template-columns: 1fr; }
  .gw-quote-inner { padding-left: 1.5rem; }
  .gw-archive-inner { grid-template-columns: 1fr; }
  .gw-related-grid { grid-template-columns: 1fr; }
  .gw-author-bio { grid-template-columns: 1fr; text-align: center; }
  .gw-author-avatar { margin: 0 auto; }
  .gw-panel-plate { padding: 2.2rem 2.2rem 1.8rem 1.5rem; }
  .gw-panel-toc ul { grid-template-columns: 1fr; }
  .gw-panel-links { grid-template-columns: 1fr 1fr; }
  .gw-post-cover { padding: 0; }
  .gw-post-cover img { border-left: 0; border-right: 0; }
}