/* ================================================================
   The Winning Strategy(TM) - Editorial Theme
   Palette: near-black ink, true white, warm paper gray, brass gold.
   Flat, editorial, disciplined - no gradients, no glassmorphism.
   Single stylesheet for the whole site (public + member + admin) so
   every page ships with one <link> and nothing else to load.
================================================================ */

:root{
  --black:        #0B0B0D;
  --white:        #FFFFFF;
  --paper:        #F7F5F1;
  --paper-deep:   #F0EDE6;
  --line:         #E4E0D6;
  --line-strong:  #D8D2C4;
  --ink:          #17171A;
  --ink-soft:     #58554C;
  --ink-faint:    #8B877C;

  --gold:         #9C7A2E;
  --gold-text:    #7A5E22;
  --gold-on-black:#D9B872;
  --gold-line:    #C7A34E;
  --gold-wash:    #FBF7EC;

  --good:         #4B6B4B;
  --good-wash:    #F1F5F0;
  --bad:          #7A3B3B;
  --bad-wash:     #F7EEEE;

  --font-display: 'Manrope', -apple-system, sans-serif;
  --font-body:    'Inter', -apple-system, sans-serif;

  --max: 1240px;
  --max-wide: 1320px;
  --pad: clamp(20px, 5vw, 64px);
  --ease: cubic-bezier(.4,0,.2,1);
}

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

*{ box-sizing: border-box; margin:0; padding:0; }
html{ scroll-behavior: smooth; }
body{
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
button{ font-family:inherit; cursor:pointer; }
input,select,textarea{ font-family:inherit; }
:focus-visible{ outline: 2px solid var(--gold); outline-offset: 3px; }

.wrap{ max-width: var(--max); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }
.wrap-wide{ max-width: var(--max-wide); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }

.skip-link{ position:absolute; left:-999px; top:auto; background: var(--black); color:var(--white); padding: 12px 20px; z-index: 200; font-size: .9rem; }
.skip-link:focus{ left: 16px; top:16px; }

/* ---------- Type scale ---------- */
h1,h2,h3,h4{ font-family: var(--font-display); color: var(--black); letter-spacing: -0.01em; }
.eyebrow{
  font-family: var(--font-body); font-size: .72rem; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: var(--gold-text); display: inline-flex; align-items: center; gap: 10px;
}
.eyebrow::before{ content:""; width: 18px; height: 1px; background: var(--gold-line); display: inline-block; }
.section-head{ max-width: 640px; margin-bottom: 44px; }
.section-head h2{ font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 800; margin-top: 14px; line-height: 1.15; }
.section-head p{ margin-top: 14px; color: var(--ink-soft); font-size: 1.02rem; max-width: 56ch; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
section{ padding: 88px 0; }
.section-tight{ padding: 56px 0; }
.section-line{ border-top: 1px solid var(--line); }

.reveal{ opacity: 0; transform: translateY(14px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in{ opacity: 1; transform: translateY(0); }

/* ================================================================
   TAGS / CATEGORY PALETTE
================================================================ */
.tag{ display:inline-flex; align-items:center; gap:6px; font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color: var(--gold-text); }
.tag::before{ content:"⟨"; color: var(--gold-line); }
.tag::after{ content:"⟩"; color: var(--gold-line); }
.tag-leadership{ color:#7A5E22; } .tag-leadership::before,.tag-leadership::after{ color:#C7A34E; }
.tag-strategy{ color:#2E4A6B; } .tag-strategy::before,.tag-strategy::after{ color:#6A88AC; }
.tag-execution{ color:#7A3B3B; } .tag-execution::before,.tag-execution::after{ color:#B06B6B; }
.tag-business-leadership{ color:#3E6B75; } .tag-business-leadership::before,.tag-business-leadership::after{ color:#6FA0AA; }
.tag-ministry-leadership{ color:#5B3A6E; } .tag-ministry-leadership::before,.tag-ministry-leadership::after{ color:#9271A8; }
.tag-decision-making{ color:#3D5C43; } .tag-decision-making::before,.tag-decision-making::after{ color:#74A17D; }
.tag-ai-and-leadership{ color:#3D3A6E; } .tag-ai-and-leadership::before,.tag-ai-and-leadership::after{ color:#7A76B0; }
.tag-organizational-growth{ color:#6B6B3A; } .tag-organizational-growth::before,.tag-organizational-growth::after{ color:#A3A36E; }
.tag-communication{ color:#9C5A2E; } .tag-communication::before,.tag-communication::after{ color:#C98F63; }
.tag-personal-mastery{ color:#6E3A4A; } .tag-personal-mastery::before,.tag-personal-mastery::after{ color:#A66E7D; }
.tag-team-leadership{ color:#4A5C7A; } .tag-team-leadership::before,.tag-team-leadership::after{ color:#829BC0; }
.tag-culture{ color:#2D6A63; } .tag-culture::before,.tag-culture::after{ color:#63A297; }

.meta-row{ display:flex; gap:14px; align-items:center; margin-top:14px; font-size:.8rem; color: var(--ink-faint); flex-wrap:wrap; }
.meta-row .dot{ width:3px; height:3px; border-radius:50%; background: var(--ink-faint); flex-shrink:0; }

/* ================================================================
   BUTTONS
================================================================ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:700; font-size:.86rem;
  letter-spacing:.01em; padding: 13px 24px; border-radius: 2px; border: 1px solid transparent; white-space:nowrap;
  transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.btn-gold{ background: var(--black); color:var(--white); }
.btn-gold:hover{ background: var(--gold-text); transform: translateY(-1px); color:var(--white); }
.btn-outline{ background: transparent; color: var(--black); border-color: var(--black); }
.btn-outline:hover{ background: var(--black); color: var(--white); }
.btn-outline-light{ background: transparent; color: var(--white); border-color: rgba(255,255,255,.5); }
.btn-outline-light:hover{ background: var(--white); color: var(--black); }
.btn-danger{ background:#7A3B3B; color:#fff; }
.btn-danger:hover{ background:#5E2C2C; }
.btn-sm{ padding: 10px 18px; font-size:.8rem; }
.btn-block{ width:100%; }
.btn:disabled{ opacity:.4; cursor:not-allowed; transform:none; }

/* ================================================================
   NAV
================================================================ */
header.site-nav{
  position: sticky; top:0; z-index: 100; background: rgba(255,255,255,.92);
  backdrop-filter: saturate(120%) blur(6px); border-bottom: 1px solid var(--line);
  transition: box-shadow .3s var(--ease);
}
header.site-nav.scrolled{ box-shadow: 0 6px 24px rgba(11,11,13,.05); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding-top: 16px; padding-bottom: 16px; gap: 24px; }
.brand{ display:flex; align-items:center; gap:12px; }
.brand-text{ display:flex; flex-direction:column; line-height:1.2; }
.brand-kicker{ font-size: .62rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color: var(--ink-faint); }
.brand-name{ font-family: var(--font-display); font-weight:800; font-size:1.02rem; color: var(--black); letter-spacing:-.01em; }
.brand-name sup{ font-size:.55em; color: var(--gold-text); }
nav.primary-links{ display:flex; align-items:center; gap:36px; }
nav.primary-links a{ font-size:.92rem; font-weight:600; color: var(--ink); position:relative; padding-bottom:4px; }
nav.primary-links a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background: var(--gold); transform: scaleX(0); transform-origin:left; transition: transform .25s var(--ease); }
nav.primary-links a:hover::after, nav.primary-links a.active::after{ transform: scaleX(1); }
.nav-right{ display:flex; align-items:center; gap:18px; }
.menu-toggle{ display:none; background:none; border:none; padding:8px; }
.menu-toggle span{ display:block; width:22px; height:2px; background: var(--black); margin:5px 0; transition: transform .25s var(--ease), opacity .25s var(--ease); }

.mobile-panel{
  position: fixed; inset:0; background: var(--white); z-index: 150; display:flex; flex-direction:column;
  padding: 24px var(--pad); transform: translateX(100%); transition: transform .3s var(--ease);
}
.mobile-panel.open{ transform: translateX(0); }
.mobile-panel-top{ display:flex; justify-content:flex-end; }
.mobile-panel nav{ display:flex; flex-direction:column; gap:28px; margin-top:48px; }
.mobile-panel nav a{ font-family: var(--font-display); font-weight:800; font-size:1.6rem; }
.mobile-panel .btn{ margin-top:40px; align-self:flex-start; }

/* Flash messages */
.flash-row{ padding: 18px 0 0; }
.flash{ font-family: var(--font-body); font-size:.9rem; padding: 14px 18px; border:1px solid var(--line); margin-bottom:12px; }
.flash-success{ background: var(--good-wash); color: var(--good); border-color:#CFE0CF; }
.flash-error{ background: var(--bad-wash); color: var(--bad); border-color:#E7C9C9; }

/* ================================================================
   HERO
================================================================ */
.hero{ padding-top: 76px; padding-bottom: 76px; background: var(--white); }
.hero-grid{ display:grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items:center; }
.hero-copy h1{ font-size: clamp(2.4rem, 5vw, 3.8rem); font-weight:800; line-height:1.06; margin-top:18px; }
.hero-copy .sub{ font-family: var(--font-display); font-weight:700; font-size: clamp(1.05rem,1.6vw,1.3rem); color: var(--ink-soft); margin-top:22px; max-width: 42ch; line-height:1.4; }
.hero-copy .desc{ margin-top:18px; color: var(--ink-soft); max-width: 46ch; font-size:1.02rem; }
.hero-actions{ display:flex; gap:12px; margin-top:32px; flex-wrap:wrap; }
.hero-note{ margin-top:14px; font-size:.78rem; color: var(--ink-faint); }
.hero-schedule-chip{ display:inline-flex; gap:16px; margin-top:28px; padding: 10px 16px; border:1px solid var(--line); background: var(--paper); font-size:.76rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: var(--ink-soft); flex-wrap:wrap; }
.hero-schedule-chip b{ color: var(--gold-text); }
.hero-media{ position:relative; }
.hero-blob{ position:absolute; border-radius:50%; z-index:0; filter: blur(2px); animation: float 7s ease-in-out infinite alternate; }
.hero-blob.b1{ width:220px; height:220px; background:#2E4A6B; opacity:.10; top:-40px; left:-40px; }
.hero-blob.b2{ width:150px; height:150px; background:#2D6A63; opacity:.12; bottom:-30px; right:-30px; animation-delay:.6s; animation-duration:8.5s; }
.hero-blob.b3{ width:90px; height:90px; background:#9C7A2E; opacity:.16; bottom:60px; left:-24px; animation-delay:1.2s; animation-duration:6s; }
@keyframes float{ from{ transform: translate(0,0); } to{ transform: translate(10px,-14px); } }
.portrait-frame{ position:relative; z-index:1; aspect-ratio: 4/5; width:100%; background: var(--paper-deep); border: 1px dashed var(--line-strong); display:flex; align-items:center; justify-content:center; text-align:center; padding:32px; overflow:hidden; }
.portrait-frame img{ width:100%; height:100%; object-fit:cover; }
.portrait-frame span{ font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color: var(--ink-faint); }
.frame-corner{ position:absolute; width:26px; height:26px; border-color: var(--gold); }
.frame-corner.tl{ top:-1px; left:-1px; border-top:2px solid; border-left:2px solid; }
.frame-corner.br{ bottom:-1px; right:-1px; border-bottom:2px solid; border-right:2px solid; }

/* ================================================================
   TRUST METRICS
================================================================ */
.trust{ background: var(--black); padding: 56px 0; }
.trust-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap: 32px; }
.trust-item{ border-left: 2px solid rgba(255,255,255,.14); padding-left:22px; }
.trust-item .num{ font-family: var(--font-display); font-weight:800; font-size: clamp(1.8rem,3vw,2.4rem); color: var(--white); }
.trust-grid .trust-item:nth-child(1){ border-left-color:#D9B872; } .trust-grid .trust-item:nth-child(1) .num{ color:#D9B872; }
.trust-grid .trust-item:nth-child(2){ border-left-color:#8FB4D9; } .trust-grid .trust-item:nth-child(2) .num{ color:#8FB4D9; }
.trust-grid .trust-item:nth-child(3){ border-left-color:#7FD1C0; } .trust-grid .trust-item:nth-child(3) .num{ color:#7FD1C0; }
.trust-grid .trust-item:nth-child(4){ border-left-color:#C29ED9; } .trust-grid .trust-item:nth-child(4) .num{ color:#C29ED9; }
.trust-item .label{ margin-top:6px; font-size:.85rem; color: rgba(255,255,255,.62); }

/* ================================================================
   CARDS - editorial (featured / edition / related)
================================================================ */
.featured-card{ display:grid; grid-template-columns: .95fr 1.05fr; border: 1px solid var(--line); background: var(--white); transition: border-color .25s var(--ease), box-shadow .25s var(--ease); }
.featured-card:hover{ border-color:#2E4A6B; box-shadow: 0 18px 40px rgba(46,74,107,.14); }
.featured-media{ background: var(--paper-deep); border-right: 1px solid var(--line); display:flex; align-items:center; justify-content:center; min-height: 320px; overflow:hidden; }
.featured-media img{ width:100%; height:100%; object-fit:cover; }
.featured-media span{ font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); text-align:center; padding: 0 20px; }
.featured-body{ padding: 44px; display:flex; flex-direction:column; }
.featured-body h3{ font-size: clamp(1.4rem,2.4vw,1.9rem); font-weight:800; margin-top:16px; line-height:1.2; }
.featured-body p.summary{ margin-top:16px; color: var(--ink-soft); }
.read-link{ margin-top:26px; display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:.9rem; color: var(--black); border-bottom: 1px solid var(--black); padding-bottom:3px; width:fit-content; }
.read-link svg{ transition: transform .2s var(--ease); }
.read-link:hover svg{ transform: translateX(4px); }

.editions-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 28px; margin-top: 8px; }
.editions-grid.cols-2{ grid-template-columns: repeat(2,1fr); }
.edition-card{ border: 1px solid var(--line); background: var(--white); display:flex; flex-direction:column; transition: transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease); }
.edition-card:hover{ transform: translateY(-4px); border-color: var(--gold-line); box-shadow: 0 16px 32px rgba(11,11,13,.06); }
.edition-media{ aspect-ratio: 16/10; background: var(--paper-deep); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.edition-media img{ width:100%; height:100%; object-fit:cover; }
.edition-media span{ font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); }
.edition-body{ padding: 24px; display:flex; flex-direction:column; flex:1; }
.edition-body h4{ font-size:1.08rem; font-weight:800; margin-top:12px; line-height:1.3; }
.edition-body p{ margin-top:10px; color: var(--ink-soft); font-size:.92rem; flex:1; }

.related-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.related-card{ border:1px solid var(--line); background: var(--white); display:flex; flex-direction:column; transition: transform .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease); }
.related-card:hover{ transform: translateY(-4px); border-color: var(--gold-line); box-shadow: 0 16px 32px rgba(11,11,13,.06); }
.related-media{ aspect-ratio:16/10; background: var(--paper-deep); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.related-media img{ width:100%; height:100%; object-fit:cover; }
.related-media span{ font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); }
.related-body{ padding:22px; }
.related-body h4{ font-family: var(--font-display); font-size:1.02rem; font-weight:800; margin-top:10px; line-height:1.3; }

.empty-note{ padding: 50px 20px; text-align:center; color: var(--ink-faint); border:1px dashed var(--line-strong); }

/* ================================================================
   CATEGORIES GRID
================================================================ */
.cat-grid{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line); border:1px solid var(--line); }
.cat-card{ background: var(--white); padding: 30px 26px; min-height:150px; display:flex; flex-direction:column; justify-content:space-between; border-top: 3px solid var(--line-strong); transition: background .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease); }
.cat-card:hover{ transform: translateY(-3px); box-shadow: 0 14px 28px rgba(11,11,13,.08); z-index:1; position:relative; }
.cat-card .cat-icon{ margin-bottom:18px; width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; background: var(--gold); transition: background .25s var(--ease), transform .3s var(--ease); }
.cat-card:hover .cat-icon{ transform: scale(1.08) rotate(-4deg); }
.cat-card h4{ font-size:1rem; font-weight:800; }
.cat-card p{ margin-top:8px; font-size:.84rem; color: var(--ink-soft); }
.cat-card[data-cat="leadership"]{ border-top-color:#9C7A2E; } .cat-card[data-cat="leadership"] .cat-icon{ background:#9C7A2E; } .cat-card[data-cat="leadership"]:hover{ background:#FBF7EC; }
.cat-card[data-cat="strategy"]{ border-top-color:#2E4A6B; } .cat-card[data-cat="strategy"] .cat-icon{ background:#2E4A6B; } .cat-card[data-cat="strategy"]:hover{ background:#EEF2F6; }
.cat-card[data-cat="execution"]{ border-top-color:#7A3B3B; } .cat-card[data-cat="execution"] .cat-icon{ background:#7A3B3B; } .cat-card[data-cat="execution"]:hover{ background:#F7EEEE; }
.cat-card[data-cat="business-leadership"]{ border-top-color:#3E6B75; } .cat-card[data-cat="business-leadership"] .cat-icon{ background:#3E6B75; } .cat-card[data-cat="business-leadership"]:hover{ background:#EDF3F4; }
.cat-card[data-cat="ministry-leadership"]{ border-top-color:#5B3A6E; } .cat-card[data-cat="ministry-leadership"] .cat-icon{ background:#5B3A6E; } .cat-card[data-cat="ministry-leadership"]:hover{ background:#F2EEF4; }
.cat-card[data-cat="decision-making"]{ border-top-color:#3D5C43; } .cat-card[data-cat="decision-making"] .cat-icon{ background:#3D5C43; } .cat-card[data-cat="decision-making"]:hover{ background:#EEF3EF; }
.cat-card[data-cat="ai-and-leadership"]{ border-top-color:#3D3A6E; } .cat-card[data-cat="ai-and-leadership"] .cat-icon{ background:#3D3A6E; } .cat-card[data-cat="ai-and-leadership"]:hover{ background:#EEEDF4; }
.cat-card[data-cat="organizational-growth"]{ border-top-color:#6B6B3A; } .cat-card[data-cat="organizational-growth"] .cat-icon{ background:#6B6B3A; } .cat-card[data-cat="organizational-growth"]:hover{ background:#F3F3EC; }
.cat-card[data-cat="communication"]{ border-top-color:#9C5A2E; } .cat-card[data-cat="communication"] .cat-icon{ background:#9C5A2E; } .cat-card[data-cat="communication"]:hover{ background:#F7F0EA; }
.cat-card[data-cat="personal-mastery"]{ border-top-color:#6E3A4A; } .cat-card[data-cat="personal-mastery"] .cat-icon{ background:#6E3A4A; } .cat-card[data-cat="personal-mastery"]:hover{ background:#F4EEF0; }
.cat-card[data-cat="team-leadership"]{ border-top-color:#4A5C7A; } .cat-card[data-cat="team-leadership"] .cat-icon{ background:#4A5C7A; } .cat-card[data-cat="team-leadership"]:hover{ background:#EEF0F4; }
.cat-card[data-cat="culture"]{ border-top-color:#2D6A63; } .cat-card[data-cat="culture"] .cat-icon{ background:#2D6A63; } .cat-card[data-cat="culture"]:hover{ background:#EDF3F2; }

/* ================================================================
   WINNING FRAMEWORK (marketing section + in-article block)
================================================================ */
.framework{ background: var(--paper); }
.framework-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items:center; }
.framework-copy .eyebrow{ margin-bottom:0; }
.framework-copy h2{ font-size: clamp(1.7rem,3vw,2.3rem); font-weight:800; margin-top:14px; line-height:1.18; }
.framework-copy p{ margin-top:18px; color: var(--ink-soft); max-width:50ch; }
.framework-points{ margin-top:26px; display:flex; flex-direction:column; gap:14px; }
.framework-points li{ display:flex; gap:12px; align-items:flex-start; font-size:.95rem; color: var(--ink); }
.framework-points .mark{ color: var(--gold-text); font-weight:800; flex-shrink:0; }
.framework-diagram{ aspect-ratio: 1/1; background: var(--white); border: 1px dashed var(--line-strong); display:flex; align-items:center; justify-content:center; flex-direction:column; gap:10px; padding:32px; overflow:hidden; }
.framework-diagram img{ width:100%; height:100%; object-fit:contain; }
.framework-diagram span{ font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); text-align:center; }

.article-framework{ margin: 52px 0; background: var(--paper); border:1px solid var(--line); padding: 40px; }
.article-framework h3{ font-family: var(--font-display); font-weight:800; font-size:1.5rem; margin-top:12px; }
.article-framework > p{ margin-top:14px; color: var(--ink-soft); max-width:64ch; }

/* ================================================================
   SCHEDULE
================================================================ */
.schedule-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.schedule-card{ border:1px solid var(--line); border-top: 3px solid var(--line-strong); padding: 32px 28px; background: var(--white); transition: border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease); }
.schedule-card:hover{ transform: translateY(-4px); }
.schedule-day{ font-family: var(--font-display); font-weight:800; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase; color: var(--gold-text); }
.schedule-title{ margin-top:14px; font-size:1.35rem; font-weight:800; font-family: var(--font-display); }
.schedule-desc{ margin-top:12px; color: var(--ink-soft); font-size:.94rem; }
.schedule-grid .schedule-card:nth-child(1){ border-top-color:#9C7A2E; } .schedule-grid .schedule-card:nth-child(1):hover{ border-color:#9C7A2E; box-shadow: 0 16px 32px rgba(156,122,46,.14); }
.schedule-grid .schedule-card:nth-child(2){ border-top-color:#2E4A6B; } .schedule-grid .schedule-card:nth-child(2) .schedule-day{ color:#2E4A6B; } .schedule-grid .schedule-card:nth-child(2):hover{ border-color:#2E4A6B; box-shadow: 0 16px 32px rgba(46,74,107,.14); }
.schedule-grid .schedule-card:nth-child(3){ border-top-color:#2D6A63; } .schedule-grid .schedule-card:nth-child(3) .schedule-day{ color:#2D6A63; } .schedule-grid .schedule-card:nth-child(3):hover{ border-color:#2D6A63; box-shadow: 0 16px 32px rgba(45,106,99,.14); }

/* ================================================================
   QUOTE
================================================================ */
.quote-section{ background: var(--black); padding: 110px 0; }
.quote-mark{ font-family: var(--font-display); font-size: 4.5rem; color: var(--gold-on-black); line-height:1; margin-bottom:10px; }
.quote-text{ font-family: var(--font-display); font-weight:700; color: var(--white); font-size: clamp(1.5rem, 3.4vw, 2.5rem); line-height:1.3; max-width:900px; }
.quote-attr{ margin-top:28px; display:flex; align-items:center; gap:16px; }
.quote-attr .rule{ width:40px; height:1px; background: var(--gold-line); }
.quote-attr span{ color: var(--gold-on-black); font-weight:700; font-size:.95rem; }
.quote-attr small{ display:block; color: rgba(255,255,255,.5); font-size:.78rem; margin-top:2px; }

/* ================================================================
   CTA
================================================================ */
.cta-section{ background: var(--paper); text-align:center; padding: 90px 0; border-top:1px solid var(--line); }
.cta-section h2{ font-size: clamp(1.6rem,3vw,2.2rem); font-weight:800; max-width:640px; margin:16px auto 0; }
.cta-section p{ color: var(--ink-soft); max-width:520px; margin: 14px auto 0; }
.cta-actions{ display:flex; gap:12px; justify-content:center; margin-top:30px; flex-wrap:wrap; }

/* ================================================================
   TOAST
================================================================ */
.toast{
  position:fixed; bottom:28px; left:50%; transform: translateX(-50%) translateY(10px);
  background: var(--black); color: var(--white); padding:13px 24px; font-size:.86rem; font-weight:600;
  border-radius:2px; opacity:0; pointer-events:none; transition: opacity .25s var(--ease), transform .25s var(--ease);
  z-index:300; display:flex; align-items:center; gap:9px; box-shadow: 0 12px 32px rgba(11,11,13,.25);
}
.toast.show{ opacity:1; transform: translateX(-50%) translateY(0); }
.toast .dot{ width:6px; height:6px; border-radius:50%; background: var(--gold-on-black); flex-shrink:0; }

/* ================================================================
   FOOTER
================================================================ */
footer.site-footer{ background: var(--black); color: rgba(255,255,255,.7); border-top: 2px solid var(--gold); }
.footer-top{ padding: 64px 0 40px; display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
.footer-brand .brand-name{ color: var(--white); }
.footer-brand .brand-kicker{ color: rgba(255,255,255,.45); }
.footer-tagline{ margin-top:16px; font-size:.9rem; color: rgba(255,255,255,.55); max-width:34ch; }
.footer-col h5{ font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color: rgba(255,255,255,.4); margin-bottom:16px; }
.footer-col ul{ display:flex; flex-direction:column; gap:11px; }
.footer-col a{ font-size:.9rem; color: rgba(255,255,255,.75); transition: color .2s var(--ease); }
.footer-col a:hover{ color: var(--gold-on-black); }
.social-row{ display:flex; gap:14px; margin-top:6px; }
.social-row a{ width:34px; height:34px; border:1px solid rgba(255,255,255,.18); border-radius:50%; display:flex; align-items:center; justify-content:center; transition: border-color .2s var(--ease), background .2s var(--ease); }
.social-row a:hover{ border-color: var(--gold-on-black); background: rgba(217,184,114,.08); }
.footer-bottom{ border-top: 1px solid rgba(255,255,255,.1); padding: 24px 0; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:.8rem; color: rgba(255,255,255,.4); }
.footer-bottom-links{ display:flex; gap:22px; }
.footer-bottom-links a{ color: rgba(255,255,255,.5); }
.footer-bottom-links a:hover{ color: var(--gold-on-black); }

/* ================================================================
   AUTH / FORM PAGES (login, register, forgot/reset password)
   Reuses the mockup's "gate-card" component as a centered form card.
================================================================ */
.auth-section{ background: var(--paper); padding: 76px 0; min-height: calc(100vh - 400px); display:flex; align-items:center; }
.auth-card{ background: var(--white); max-width:460px; width:100%; margin: 0 auto; padding: 44px 40px; border-top:3px solid var(--gold); box-shadow: 0 20px 60px rgba(11,11,13,.08); }
.auth-card .mark{ margin: 0 auto 16px; }
.auth-card h1{ font-family: var(--font-display); font-weight:800; font-size:1.5rem; color: var(--black); margin-top:6px; line-height:1.28; }
.auth-card .lede{ margin-top:10px; color: var(--ink-soft); font-size:.92rem; }
.auth-card.centered{ text-align:center; }
.auth-card.centered .mark{ margin-left:auto; margin-right:auto; }
.auth-card .field{ margin-top:20px; text-align:left; }
.auth-card form{ margin-top: 24px; }
.auth-foot{ margin-top: 22px; font-size:.85rem; color: var(--ink-soft); text-align:center; }
.auth-foot a{ color: var(--gold-text); font-weight:700; }

/* ================================================================
   GENERIC FORM FIELDS (used site-wide: auth, contact, admin, profile)
================================================================ */
.field{ margin-bottom:20px; }
.field:last-child{ margin-bottom:0; }
.field label{ display:block; font-size:.78rem; font-weight:700; letter-spacing:.03em; color: var(--ink); margin-bottom:8px; }
.field .hint{ font-size:.76rem; color: var(--ink-faint); margin-top:6px; }
.field input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
.field select, .field textarea{
  width:100%; padding:12px 14px; border:1px solid var(--line-strong); background: var(--paper);
  border-radius:2px; transition: border-color .2s var(--ease), background .2s var(--ease); font-size:.95rem; color: var(--ink); font-family: inherit;
}
.field input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):focus,
.field select:focus, .field textarea:focus{ border-color: var(--gold); background: var(--white); outline:none; }
.field input:disabled{ color: var(--ink-faint); cursor: not-allowed; }
.field textarea{ resize: vertical; line-height:1.6; }
.field-row{ display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.field-row.three{ grid-template-columns: repeat(3,1fr); }
.suffix-field{ position:relative; }
.suffix-field input{ padding-right:64px !important; }
.suffix-field .suffix{ position:absolute; right:14px; top:50%; transform: translateY(-50%); font-size:.78rem; color: var(--ink-faint); pointer-events:none; }
.field-check{ display:flex; align-items:center; gap:8px; font-size:.88rem; color: var(--ink); }
.field-inline-link{ display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; font-size:.85rem; }
.field-inline-link a{ color: var(--gold-text); font-weight:600; }

/* ================================================================
   MEMBER AREA (dashboard, article library, profile)
================================================================ */
.member-shell{ display:grid; grid-template-columns: 240px 1fr; gap: 44px; padding: 48px 0 90px; align-items:start; }
.member-nav{ border:1px solid var(--line); background: var(--paper); position: sticky; top: 96px; }
.member-nav a{ display:block; padding: 14px 20px; font-size:.9rem; font-weight:600; color: var(--ink-soft); border-bottom:1px solid var(--line); }
.member-nav a:last-child{ border-bottom:none; }
.member-nav a:hover{ color: var(--black); background: var(--paper-deep); }
.member-nav a.active{ color: var(--black); background: var(--white); border-left: 3px solid var(--gold); padding-left:17px; }
.member-header{ margin-bottom: 32px; }
.member-header h1{ font-size: clamp(1.5rem,2.6vw,2rem); font-weight:800; }
.member-header p{ margin-top:8px; color: var(--ink-soft); }
.stat-cards{ display:grid; grid-template-columns: repeat(3,1fr); gap: 20px; margin-bottom: 40px; }
.stat-card{ border:1px solid var(--line); background: var(--white); padding: 24px; }
.stat-card .num{ font-family: var(--font-display); font-weight:800; font-size:1.8rem; color: var(--black); }
.stat-card .label{ margin-top:6px; font-size:.82rem; color: var(--ink-faint); }
.toolbar{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:24px; }
.search-field{ position:relative; flex:1; min-width:220px; }
.search-field svg{ position:absolute; left:14px; top:50%; transform:translateY(-50%); pointer-events:none; }
.search-field input{ width:100%; padding:11px 14px 11px 40px; border:1px solid var(--line-strong); background: var(--white); border-radius:2px; }
.filter-select{ padding:11px 14px; border:1px solid var(--line-strong); background: var(--white); border-radius:2px; font-weight:600; }

/* ================================================================
   ADMIN - TOPBAR (editorial dashboard chrome)
================================================================ */
.admin-topbar{ background: var(--white); border-bottom:1px solid var(--line); position: sticky; top:0; z-index:80; }
.admin-topbar .topbar-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:24px; flex-wrap:wrap; }
.admin-tabs{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.admin-tabs a{ font-size:.86rem; font-weight:600; color: var(--ink-soft); padding:6px 0; position:relative; }
.admin-tabs a.active{ color: var(--black); }
.admin-tabs a.active::after{ content:""; position:absolute; left:0; right:0; bottom:-16px; height:2px; background: var(--gold); }
.user-chip{ display:flex; align-items:center; gap:10px; }

/* ================================================================
   ADMIN - LEFT SIDEBAR NAVIGATION
================================================================ */
body.admin-shell{ padding-left: 240px; }
.admin-sidebar{
  position: fixed; top:0; left:0; bottom:0; width:240px; overflow-y:auto;
  background: var(--white); border-right:1px solid var(--line); z-index:85;
  display:flex; flex-direction:column;
}
.admin-sidebar-brand{ display:flex; align-items:center; gap:11px; padding:20px 22px; border-bottom:1px solid var(--line); }
.admin-sidebar-nav{ padding: 14px 0; flex:1; }
.admin-sidebar-nav a{
  display:flex; align-items:center; gap:10px; padding: 12px 22px; font-size:.87rem; font-weight:600;
  color: var(--ink-soft); border-left:3px solid transparent; transition: background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.admin-sidebar-nav a:hover{ background: var(--paper); color: var(--black); }
.admin-sidebar-nav a.active{ background: var(--paper); color: var(--black); border-left-color: var(--gold); font-weight:700; }
.admin-sidebar-foot{ padding: 16px 22px; border-top:1px solid var(--line); font-size:.8rem; }
.admin-sidebar-foot a{ display:block; color: var(--ink-faint); font-weight:600; padding: 6px 0; }
.admin-sidebar-foot a:hover{ color: var(--gold-text); }
.admin-sidebar-foot a.user-chip{ display:flex; padding:0; }
.admin-sidebar-foot a.user-chip:hover .user-name{ color: var(--gold-text); }
@media (max-width: 900px){
  body.admin-shell{ padding-left:0; }
  .admin-sidebar{ position: static; width:auto; flex-direction:row; border-right:none; border-bottom:1px solid var(--line); overflow-x:auto; }
  .admin-sidebar-brand{ border-bottom:none; border-right:1px solid var(--line); flex-shrink:0; }
  .admin-sidebar-nav{ display:flex; padding:0; }
  .admin-sidebar-nav a{ border-left:none; border-bottom:3px solid transparent; white-space:nowrap; }
  .admin-sidebar-nav a.active{ border-left-color:transparent; border-bottom-color: var(--gold); }
  .admin-sidebar-foot{ display:flex; border-top:none; border-left:1px solid var(--line); flex-shrink:0; }
}
.logout-link{ font-size:.8rem; font-weight:600; color: var(--ink-faint); border-left:1px solid var(--line); padding-left:22px; transition: color .2s var(--ease); }
.logout-link:hover{ color: var(--gold-text); }
.avatar{ width:34px; height:34px; border-radius:50%; background: var(--black); color: var(--gold-on-black); display:flex; align-items:center; justify-content:center; font-family: var(--font-display); font-weight:800; font-size:.8rem; flex-shrink:0; }
.user-meta{ line-height:1.25; }
.user-name{ font-size:.85rem; font-weight:700; color: var(--black); }
.user-role{ font-size:.72rem; color: var(--ink-faint); }
.autosave-chip{ display:flex; align-items:center; gap:6px; font-size:.76rem; color: var(--ink-faint); }
.autosave-dot{ width:6px; height:6px; border-radius:50%; background: var(--good); }

/* ================================================================
   ADMIN - PAGE HEAD / BREADCRUMB
================================================================ */
.page-head{ padding: 40px 0 8px; }
.breadcrumb{ font-size:.8rem; color: var(--ink-faint); margin-bottom:18px; }
.breadcrumb a{ color: var(--ink-faint); } .breadcrumb a:hover{ color: var(--gold-text); }
.breadcrumb .sep{ margin:0 8px; } .breadcrumb .current{ color: var(--ink-soft); font-weight:600; }
.page-head-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.page-head h1{ font-size: clamp(1.7rem,3vw,2.3rem); font-weight:800; margin-top:6px; }
.page-head p{ margin-top:10px; color: var(--ink-soft); max-width:56ch; }
.stat-row{ display:flex; gap:22px; flex-wrap:wrap; margin: 22px 0 28px; font-size:.84rem; color: var(--ink-soft); }
.stat-row b{ color: var(--black); font-weight:800; }
.stat-dot{ width:7px; height:7px; border-radius:50%; display:inline-block; margin-right:7px; vertical-align:middle; }

/* ================================================================
   ADMIN - DATA TABLE (stories/members/books/etc)
================================================================ */
.data-table{ background: var(--white); border:1px solid var(--line); margin-bottom: 40px; overflow-x:auto; }
.data-row{ display:grid; gap:18px; align-items:center; padding: 18px 22px; border-bottom:1px solid var(--line); transition: background .2s var(--ease); min-width: 640px; }
.data-row:last-child{ border-bottom:none; }
.data-row:hover{ background: var(--paper); }
.data-row.head-row{ background: var(--paper-deep); font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); padding-top:13px; padding-bottom:13px; }
.data-row.head-row:hover{ background: var(--paper-deep); }
.cols-5{ grid-template-columns: 2.4fr 1fr 1fr 1fr .8fr; }
.cols-4{ grid-template-columns: 2.4fr 1fr 1fr .8fr; }
.cols-3{ grid-template-columns: 2.4fr 1fr .8fr; }
.row-main .headline{ font-weight:700; font-size:.96rem; color: var(--black); line-height:1.35; }
.row-main .tag{ margin-top:6px; }
.row-meta{ font-size:.86rem; color: var(--ink-soft); }
.row-meta .sub{ font-size:.76rem; color: var(--ink-faint); margin-top:2px; }
.row-actions{ display:flex; gap:6px; justify-content:flex-end; }

.status-pill{ display:inline-flex; align-items:center; gap:6px; font-size:.72rem; font-weight:700; padding:5px 12px; border-radius:20px; white-space:nowrap; }
.status-pill .dot{ width:6px; height:6px; border-radius:50%; }
.status-published{ background: var(--good-wash); color: var(--good); } .status-published .dot{ background: var(--good); }
.status-draft{ background: var(--paper-deep); color: var(--ink-faint); } .status-draft .dot{ background: var(--ink-faint); }
.status-scheduled{ background: var(--gold-wash); color: var(--gold-text); } .status-scheduled .dot{ background: var(--gold); }
.status-active{ background: var(--good-wash); color: var(--good); } .status-active .dot{ background: var(--good); }
.status-pending{ background: var(--gold-wash); color: var(--gold-text); } .status-pending .dot{ background: var(--gold); }
.status-suspended{ background: var(--bad-wash); color: var(--bad); } .status-suspended .dot{ background: var(--bad); }

.icon-btn{ width:32px; height:32px; border-radius:2px; border:1px solid var(--line-strong); background: var(--white); display:flex; align-items:center; justify-content:center; transition: border-color .2s var(--ease), background .2s var(--ease); flex-shrink:0; }
.icon-btn:hover{ border-color: var(--black); background: var(--paper); }
.icon-btn.danger:hover{ border-color:#7A3B3B; background:#F7EEEE; }

/* ================================================================
   ADMIN - MODALS
================================================================ */
.modal-overlay{ position:fixed; inset:0; background: rgba(11,11,13,.55); z-index:200; display:none; align-items:center; justify-content:center; padding:24px; }
.modal-overlay.open{ display:flex; }
.confirm-modal{ background: var(--white); max-width:400px; width:100%; padding:32px; box-shadow: 0 30px 80px rgba(11,11,13,.35); text-align:center; }
.confirm-modal svg{ margin: 0 auto 14px; }
.confirm-modal h3{ font-size:1.1rem; font-weight:800; }
.confirm-modal p{ margin-top:10px; font-size:.9rem; color: var(--ink-soft); }
.confirm-actions{ display:flex; gap:10px; margin-top:24px; }
.confirm-actions .btn{ flex:1; }

/* ================================================================
   ADMIN - FORM PANELS (article editor, settings, books, masterclasses)
================================================================ */
.admin-layout{ display:grid; grid-template-columns: 1.55fr 1fr; gap: 32px; align-items:start; padding-bottom: 60px; }
.admin-layout.single{ grid-template-columns: 1fr; max-width: 780px; }
.panel{ background: var(--white); border:1px solid var(--line); padding: 30px; margin-bottom: 24px; }
.panel-head{ margin-bottom:22px; }
.panel-head h2{ font-size:1.05rem; font-weight:800; }
.panel-head p{ margin-top:6px; font-size:.86rem; color: var(--ink-faint); }
.headline-input{ font-family: var(--font-display); font-weight:800; font-size:1.15rem !important; }
.char-count{ font-size:.72rem; color: var(--ink-faint); text-align:right; margin-top:6px; }

.segmented{ display:grid; grid-template-columns: repeat(3,1fr); gap:10px; }
.seg-option{ position:relative; }
.seg-option input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.seg-card{ display:block; border:1px solid var(--line-strong); padding:14px 14px; text-align:left; background: var(--paper); transition: border-color .2s var(--ease), background .2s var(--ease); }
.seg-card .day{ display:block; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); }
.seg-card .name{ display:block; margin-top:5px; font-weight:700; font-size:.88rem; color: var(--ink); }
.seg-option input:checked + .seg-card{ border-color: var(--gold); background: var(--gold-wash); }
.seg-option input:checked + .seg-card .day{ color: var(--gold-text); }

.dropzone{ border:1px dashed var(--line-strong); background: var(--paper); padding: 30px 20px; text-align:center; cursor:pointer; transition: border-color .2s var(--ease), background .2s var(--ease); }
.dropzone:hover, .dropzone.drag{ border-color: var(--gold); background: var(--gold-wash); }
.dropzone svg{ margin: 0 auto 12px; }
.dropzone .dz-title{ font-size:.86rem; font-weight:700; color: var(--ink); }
.dropzone .dz-sub{ font-size:.76rem; color: var(--ink-faint); margin-top:5px; }
.dropzone.has-file{ border-style:solid; border-color: var(--gold-line); }
.dropzone .dz-filename{ font-size:.82rem; font-weight:600; color: var(--gold-text); margin-top:4px; }
.dz-thumb{ max-height:120px; margin:0 auto 12px; border:1px solid var(--line); }
.current-image{ display:flex; align-items:center; gap:12px; margin-bottom:14px; font-size:.82rem; color: var(--ink-soft); }
.current-image img{ width:64px; height:64px; object-fit:cover; border:1px solid var(--line); }

.checklist{ display:flex; flex-direction:column; gap:12px; }
.check-item{ display:flex; align-items:center; gap:10px; font-size:.86rem; color: var(--ink-faint); }
.check-dot{ width:18px; height:18px; border-radius:50%; border:1.5px solid var(--line-strong); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition: border-color .2s var(--ease), background .2s var(--ease); }
.check-dot svg{ opacity:0; transition: opacity .2s var(--ease); }
.check-item.done{ color: var(--ink); }
.check-item.done .check-dot{ background: var(--good); border-color: var(--good); }
.check-item.done .check-dot svg{ opacity:1; }

.action-bar{ position: fixed; left:240px; right:0; bottom:0; z-index:90; background: var(--white); border-top:1px solid var(--line); box-shadow: 0 -8px 24px rgba(11,11,13,.04); }
.action-bar-inner{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:16px; flex-wrap:wrap; }
.action-left{ font-size:.8rem; color: var(--ink-faint); }
.action-right{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.action-bar-spacer{ height:88px; }
@media (max-width: 900px){ .action-bar{ left:0; } }

/* Full-form Story Preview modal (article-edit.php) - reuses the public
   article page's own classes inside an overlay so the preview matches
   the live template exactly. */
.preview-modal-overlay{ position: fixed; inset:0; background: rgba(11,11,13,.55); z-index:400; display:none; align-items:flex-start; justify-content:center; padding: 48px 20px; overflow-y:auto; }
.preview-modal-overlay.open{ display:flex; }
.preview-modal-inner{ background: var(--white); max-width: 900px; width:100%; margin-bottom:40px; box-shadow: 0 30px 80px rgba(11,11,13,.35); }
.preview-modal-topbar{ display:flex; align-items:center; justify-content:space-between; padding: 16px 28px; border-bottom:1px solid var(--line); background: var(--paper); position: sticky; top:0; }
.preview-badge{ display:inline-flex; align-items:center; gap:8px; font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--gold-text); border:1px solid var(--gold-line); padding:7px 12px; background: var(--gold-wash); }
.preview-badge .dot{ width:6px; height:6px; border-radius:50%; background: var(--gold); }
.modal-close{ width:34px; height:34px; border-radius:50%; border:1px solid var(--line-strong); background: var(--white); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition: border-color .2s var(--ease), background .2s var(--ease); }
.modal-close:hover{ border-color: var(--black); }
.preview-modal-inner .wrap{ padding-left:32px; padding-right:32px; }

.preview-sticky{ position: sticky; top: 96px; }
.preview-label{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.preview-note{ font-size:.78rem; color: var(--ink-faint); margin-top:4px; }
.preview-card{ border:1px solid var(--line); background: var(--white); }
.preview-media{ aspect-ratio:16/10; background: var(--paper-deep); border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:center; overflow:hidden; }
.preview-media img{ width:100%; height:100%; object-fit:cover; }
.preview-media span{ font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); text-align:center; padding:0 16px; }
.preview-body{ padding:24px; }
.preview-headline{ font-family: var(--font-display); font-weight:800; font-size:1.15rem; margin-top:12px; line-height:1.3; }
.preview-summary{ margin-top:10px; font-size:.88rem; color: var(--ink-soft); }

/* Quill editor container - restyled to sit inside a .field like other inputs */
.ql-toolbar.ql-snow{ border-color: var(--line-strong) !important; background: var(--paper); }
.ql-container.ql-snow{ border-color: var(--line-strong) !important; background: var(--white); font-family: var(--font-body); font-size: .98rem; min-height: 320px; }
.field.focused .ql-toolbar.ql-snow, .field.focused .ql-container.ql-snow{ border-color: var(--gold) !important; }

/* ================================================================
   ARTICLE PAGE
================================================================ */
.breadcrumb-row{ padding: 22px 0 0; font-size:.82rem; color: var(--ink-faint); }
.breadcrumb-row a{ color: var(--ink-faint); } .breadcrumb-row a:hover{ color: var(--gold-text); }
.breadcrumb-row .sep{ margin:0 8px; } .breadcrumb-row .current{ color: var(--ink-soft); }
.article-header{ padding: 22px 0 36px; max-width: 820px; }
.article-header h1{ font-family: var(--font-display); font-weight:800; letter-spacing:-.01em; color: var(--black); font-size: clamp(2rem, 4vw, 3rem); margin-top:16px; line-height:1.12; }
.article-dek{ margin-top:18px; font-size:1.15rem; color: var(--ink-soft); max-width:60ch; }
.byline-row{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px; margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
.byline-left{ display:flex; align-items:center; gap:12px; }
.byline-name{ font-size:.9rem; font-weight:700; color: var(--black); }
.byline-meta{ font-size:.78rem; color: var(--ink-faint); margin-top:2px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.byline-meta .dot{ width:3px; height:3px; border-radius:50%; background: var(--ink-faint); }
.copy-link-btn{ display:inline-flex; align-items:center; gap:8px; font-size:.8rem; font-weight:700; color: var(--ink); border:1px solid var(--line-strong); padding:9px 16px; border-radius:2px; background: var(--white); transition: border-color .2s var(--ease), background .2s var(--ease); }
.copy-link-btn:hover{ border-color: var(--black); }
.copy-link-btn.copied{ border-color: var(--gold); background: var(--gold-wash); color: var(--gold-text); }
.article-media{ aspect-ratio: 21/9; background: var(--paper-deep); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; margin: 0 0 8px; overflow:hidden; }
.article-media img{ width:100%; height:100%; object-fit:cover; }
.article-media span{ font-size:.75rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-faint); text-align:center; padding:0 20px; }
.article-layout{ display:grid; grid-template-columns: 1fr 720px 1fr; padding: 56px 0 0; }
.article-prose{ grid-column: 2; font-size:1.06rem; color: var(--ink); }
.article-prose > p{ margin-bottom: 22px; line-height:1.85; }
.article-prose h2, .article-prose h3{ font-family: var(--font-display); font-weight:800; font-size:1.5rem; color: var(--black); margin: 42px 0 16px; line-height:1.3; }
.article-prose blockquote, .pull-quote{ margin: 40px 0; padding: 8px 0 8px 26px; border-left: 3px solid var(--gold); font-family: var(--font-display); font-weight:700; font-size:1.4rem; color: var(--black); line-height:1.4; }
.article-prose img{ margin: 1.5em 0; width:100%; height:auto; }
.article-prose table{ width:100%; border-collapse:collapse; margin:1.5em 0; }
.article-prose table td, .article-prose table th{ border:1px solid var(--line); padding:10px; }
.article-framework{ grid-column: 2; }
.author-card{ grid-column: 2; display:flex; gap:22px; padding: 32px 0; margin-top: 12px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); align-items:flex-start; }
.author-portrait{ width:64px; height:64px; border-radius:50%; background: var(--paper-deep); border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-family: var(--font-display); font-weight:800; color: var(--ink-faint); font-size:1rem; overflow:hidden; }
.author-portrait img{ width:100%; height:100%; object-fit:cover; }
.author-info h4{ font-family: var(--font-display); font-weight:800; font-size:1.05rem; color: var(--black); }
.author-info .role{ font-size:.8rem; color: var(--gold-text); font-weight:700; margin-top:2px; }
.author-info p{ margin-top:10px; font-size:.92rem; color: var(--ink-soft); max-width:60ch; line-height:1.7; }
.related-section{ padding: 64px 0 90px; }
.related-head{ margin-bottom:32px; }

/* ================================================================
   GENERIC CONTENT PAGES (about, privacy, terms, contact)
================================================================ */
.page-header{ padding: 64px 0 20px; text-align:center; }
.page-header h1{ font-size: clamp(2rem,4vw,2.8rem); font-weight:800; margin-top:14px; }
.page-header p{ margin-top:14px; color: var(--ink-soft); max-width:60ch; margin-left:auto; margin-right:auto; }
.prose{ max-width: 760px; margin: 0 auto; font-size:1.02rem; }
.prose h2{ font-size:1.4rem; font-weight:800; margin: 36px 0 14px; }
.prose p{ margin-bottom: 18px; line-height:1.8; color: var(--ink); }
.prose ul{ list-style: disc; margin: 0 0 18px 22px; }
.prose ul li{ margin-bottom:8px; line-height:1.7; }

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width: 1024px){
  .hero-grid{ grid-template-columns: 1fr; }
  .hero-media{ order:-1; max-width: 420px; }
  .trust-grid{ grid-template-columns: repeat(2,1fr); row-gap:28px; }
  .cat-grid{ grid-template-columns: repeat(2,1fr); }
  .featured-card{ grid-template-columns: 1fr; }
  .featured-media{ border-right:none; border-bottom:1px solid var(--line); min-height:240px; }
  .editions-grid{ grid-template-columns: repeat(2,1fr); }
  .framework-grid{ grid-template-columns: 1fr; }
  .framework-diagram{ order:-1; max-width:420px; margin:0 auto; }
  .schedule-grid{ grid-template-columns: 1fr; }
  .footer-top{ grid-template-columns: 1fr 1fr; }
  .admin-layout{ grid-template-columns: 1fr; }
  .preview-sticky{ position: static; }
  .member-shell{ grid-template-columns: 1fr; }
  .member-nav{ position:static; display:flex; overflow-x:auto; }
  .member-nav a{ border-bottom:none; border-right:1px solid var(--line); white-space:nowrap; }
  .article-layout{ grid-template-columns: 1fr; padding-left: var(--pad); padding-right: var(--pad); }
  .article-prose, .article-framework, .author-card{ grid-column: 1; }
  .related-grid{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 760px){
  nav.primary-links, .nav-right .btn-outline{ display:none; }
  .menu-toggle{ display:block; }
  section{ padding: 60px 0; }
  .trust{ padding: 44px 0; }
  .trust-grid{ grid-template-columns: 1fr 1fr; }
  .cat-grid{ grid-template-columns: 1fr; }
  .editions-grid{ grid-template-columns: 1fr; }
  .related-grid{ grid-template-columns: 1fr; }
  .footer-top{ grid-template-columns: 1fr; padding-bottom:20px; }
  .quote-section{ padding: 72px 0; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; }
  .field-row{ grid-template-columns: 1fr; }
  .segmented{ grid-template-columns: 1fr; }
  .byline-row{ flex-direction:column; align-items:flex-start; }
  .author-card{ flex-direction:column; }
  .stat-cards{ grid-template-columns: 1fr; }
  .data-row{ grid-template-columns: 1fr !important; gap:8px; }
  .data-row .row-actions{ justify-content:flex-start; margin-top:6px; }
  .data-row.head-row{ display:none; }
}