/*
Theme Name: Enlightio
Theme URI: https://enlightio.com
Description: Enlightio design system — GeneratePress child theme on the UJ v2 skeleton. Honey palette, Lora+Figtree, 66ch measure, grids A/B. Built 2026-07 per projects/enlightio/el-migration-handoff-2026-07-06.md.
Author: Enlightio
Template: generatepress
Version: 0.1.0
*/


/* ============ SELF-HOSTED FONTS (variable woff2, latin) ============ */
@font-face{font-family:'Figtree';font-style:normal;font-weight:300 900;font-display:swap;src:url('fonts/figtree-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Lora';font-style:normal;font-weight:400 700;font-display:swap;src:url('fonts/lora-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ============ TOKENS (Honey, from el-migration-handoff-2026-07-06 sec 4 +
   cockpit PAL.yellow — var names kept from UJ v2 so ported components skin
   without edits) ============ */
:root{
  /* color */
  --uj-primary:#8A5A00;      /* dark ochre: links, buttons, chrome (text-grade, WCAG-safe) */
  --uj-primary-dark:#6E4700; /* hovers, footer */
  --uj-accent:#FACC15;       /* bright yellow: rules/borders/fills ONLY — NEVER text */
  --uj-accent-text:#8A5A00;  /* text-safe accent (labels, list markers) */
  --uj-tint:#FBF4E0;         /* box surfaces (KT box etc.) */
  --uj-wash:#FCEFB8;         /* link-hover wash + highlight marks */
  --uj-hero:#EDE6D2;         /* hero band (UJ pattern: hero == hair) */
  --uj-hero-ink:#2B2410;     /* text on hero */
  --uj-head:#2B2410;         /* headlines: near-black warm (cockpit PAL.yellow hd —
                                Honey headlines are NOT primary-colored like UJ navy) */
  --uj-ink:#34301F;          /* body text */
  --uj-muted:#6B6450;        /* bylines, meta */
  --uj-hair:#EDE6D2;         /* hairlines */
  /* CTA: OPEN decision (Adrian 2026-07-06) — preview amber vs ochre on dev.
     Default amber (UJ values); ochre variant via body.el-cta-ochre below. */
  --uj-cta:#FFB648;          /* amber: AFFILIATE buy buttons ONLY */
  --uj-cta-hover:#F0A032;    /* hover deepens */
  --uj-cta-ink:#231A0D;      /* near-black text on amber */
  /* type */
  --uj-font-heading:'Lora',Georgia,serif;
  --uj-font-body:'Figtree',system-ui,-apple-system,sans-serif;
  /* layout */
  /* LAYOUT CONTRACT (final, Verywell-validated): container 1280 = nav +
     footer width (researched: Wirecutter 1265, NerdWallet 1280). The ARTICLE
     GROUP centers beneath it: A = 640+96+300 = 1036; B (TOC rail) =
     220+48+640+48+300 = 1256 — fits inside 1280, which is WHY 1280.
     The band (kicker/title/byline) aligns to the GROUP, not the nav. */
  --uj-container:1280px;
  /* 66 average chars/line = 640px. In REM (root 16px x 40 = 640): rem is
     constant for EVERY element — em would compute against each element's own
     font-size (h2 at 29px -> 928px blowout, caught live 2026-07-03), and ch
     measures Figtree's extra-wide zero (66ch -> 846px, caught 2026-07-02). */
  --uj-measure:40rem;
  --uj-rail:220px;
  --uj-adcol:300px;
  --uj-gap-b:48px;   /* grid B both gaps */
  --uj-gap-a:96px;   /* grid A single gap */
}

/* CTA DECIDED 2026-07-07: amber (UJ-proven, warm pop on the cream tints).
   DOCUMENTED ALTERNATIVE (Adrian: keep as an option) — dark ochre variant;
   to switch, replace the three --uj-cta* tokens above with:
     --uj-cta:#6E4700;  --uj-cta-hover:#8A5A00;  --uj-cta-ink:#FFFFFF;  */

/* ============ BASE TYPOGRAPHY ============ */
body{
  font-family:var(--uj-font-body);
  font-size:20px;line-height:1.6;color:var(--uj-ink);
}
h1,h2,h3,h4,.entry-title{font-family:var(--uj-font-heading);color:var(--uj-head);}
h1,.entry-title{font-size:46px;line-height:1.2;font-weight:700;}
h2{font-size:29px;line-height:44px;font-weight:700;}
h3{font-size:23px;line-height:1.3;font-weight:700;}
/* h4/h5 scale (2026-07-07: 78 EL posts use h4; unsized, they inherited the
   OLD GP setting 22px = h3-sized. Same gap exists on UJ — flagged there). */
h4{font-size:20px;line-height:1.35;font-weight:700;}
h5{font-size:18px;line-height:1.4;font-weight:700;}
/* Books pages: portal-scaled H2 (decision: 35px on Books only) */
article.category-books .entry-content h2{font-size:35px;line-height:48px;}
@media(max-width:768px){
  /* mobile reading scale (Adrian 2026-07-04): 20px body reads oversized on
     phones. 2026-07-06: 18 -> 19 (Adrian: 18 a bit small with reading
     glasses; 19 stays inside the 18-20 pro band, NYT 18 / Medium 20). */
  body{font-size:19px;line-height:1.65;}
  h1,.entry-title{font-size:31px;}
  h2{font-size:23px;line-height:1.3;}
  h3{font-size:20px;}
  h4{font-size:18px;}
  h5{font-size:17px;}
  article.category-books .entry-content h2{font-size:26px;line-height:1.28;}
}

/* ============ MEASURE — text elements only, NEVER ad containers ============ */
.entry-content p,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content ul,
.entry-content ol,
.entry-content blockquote,
.entry-content figure{
  max-width:var(--uj-measure);
}
/* Mediavine full-bleed carve-out: ad boxes span the full content column.
   (.lasso-display removed 2026-07-03: it was never measure-capped — divs are
   not in the list above — and the book card is now explicitly measure-wide.) */
.entry-content .mv-ad-box,
.entry-content [id^="mediavine"]{max-width:none;}

/* ============ LINKS — the locked template treatment ============ */
.entry-content a:not(.lasso-button):not(.wp-block-button__link){
  color:var(--uj-ink);
  text-decoration:underline;
  text-decoration-color:rgba(91,103,112,.45);
  text-decoration-thickness:2px;
  text-underline-offset:3px;
  border-radius:2px;
  transition:text-decoration-color .15s,color .15s,background-color .15s;
}
.entry-content a:not(.lasso-button):not(.wp-block-button__link):hover{
  color:var(--uj-primary);
  text-decoration-color:var(--uj-primary);
  background:var(--uj-wash);
}
.entry-content a:focus-visible{outline:2px solid var(--uj-primary);outline-offset:2px;}
mark{background:var(--uj-wash);}

/* ============ BYLINE / CHIPS / DISCLOSURE (GP Element markup) ============ */
.inline-post-meta-area{font-family:var(--uj-font-body);font-size:14px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}
.inline-post-meta-area a{color:var(--uj-accent-text);text-decoration:none;}
.entry-meta-block{font-size:14.5px;color:var(--uj-muted);}

/* ============ JUMP LIST — skin for TOC+ ([toc] in 2,155 posts) ============ */
#toc_container{
  background:var(--uj-tint);
  border:none;border-radius:12px;
  padding:22px 24px;margin:24px 0;
  max-width:var(--uj-measure);
  font-family:var(--uj-font-body);font-size:17px;
}
#toc_container .toc_title{
  font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--uj-primary);
  border-bottom:1px solid var(--uj-hair);padding-bottom:12px;margin-bottom:14px;
}
/* Jump-list box — DEMO-TRUE (cockpit Meaningful v2, extracted 2026-07-07;
   header + alignment fixed per Adrian 2026-07-07 round 2):
   tint box + hair border, radius 12, box carries the padding so the
   COLLAPSED state is a clean padded strip; header = original eyebrow
   treatment, label left + toggle right (plugin floats it), NO underline;
   items 15.5px ink; numbers = small teal 700 12px zero-padded, no dot,
   hanging indent (wrapped lines align under TEXT, not under the number);
   2 columns at 9+ entries (>600px).
   NOTE: plugin selectors are div#toc_container p.toc_title /
   ul.toc_list — theme overrides MUST match that specificity or lose. */
#toc_container{width:100%;border:1px solid var(--uj-hair);padding:18px 22px;}
body div#toc_container p.toc_title{
  color:var(--uj-primary);
  text-align:left;margin:0;padding:0;
  border-bottom:none;text-decoration:none;
}
body div#toc_container p.toc_title a{color:var(--uj-accent-text);text-decoration:none;}
#toc_container .toc_toggle{font-size:12px;letter-spacing:.12em;}
body div#toc_container ul.toc_list{list-style:none;margin:14px 0 0;padding:0;counter-reset:ujtoc;}
body div#toc_container ul.toc_list > li{
  display:flex;gap:10px;align-items:baseline;
  margin-bottom:9px;line-height:1.45;font-size:15.5px;
  counter-increment:ujtoc;break-inside:avoid;
}
body div#toc_container ul.toc_list > li::before{
  content:counter(ujtoc,decimal-leading-zero);
  flex:0 0 auto;
  /* EL divergence: UJ uses --uj-accent (teal, readable); EL's accent is
     bright yellow which washes out on the tint — brown instead (Adrian 2026-07-07) */
  color:var(--uj-accent-text);font-weight:700;font-size:12px;
  font-variant-numeric:tabular-nums;
}
/* long jump lists split into 2 columns on >600px */
@media(min-width:601px){
  #toc_container ul:has(li:nth-child(9)){columns:2;column-gap:36px;}
}
/* mobile: long jump lists (13+ entries) scroll INTERNALLY so the box never
   runs multiple screens; the title row stays put above the scrolling list
   (Adrian 2026-07-07). Soft bottom fade hints there is more to scroll.
   Items bump 15.5 -> 17px on touch (15.5 was the desktop demo size; rows
   also gain spacing to reach comfortable tap-target height). */
@media(max-width:600px){
  body div#toc_container ul.toc_list > li{font-size:17px;margin-bottom:11px;}
  body div#toc_container ul.toc_list > li::before{font-size:12.5px;}
  body div#toc_container ul.toc_list:has(li:nth-child(13)){
    max-height:55vh;overflow-y:auto;
    /* no overscroll-behavior:contain — when the list ends, the same swipe
       continues scrolling the article (Adrian 2026-07-08, same fix as UJ) */
    -webkit-overflow-scrolling:touch;
    padding-right:6px;
    -webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);
            mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);
  }
}
/* out-rank the TOC+ inline settings CSS (four #000 custom colors) */
body div#toc_container ul.toc_list a{color:var(--uj-ink);text-decoration:none;font-weight:500;}
body div#toc_container ul.toc_list a:hover{color:var(--uj-primary);}
#toc_container .toc_number{color:var(--uj-accent-text);font-weight:800;font-size:13px;margin-right:10px;}


/* ============ BOOK CARD — Lasso skin, REDESIGNED 2026-07-03 ============
   Direction (Adrian: demo was better, target even better): a two-cell "buy
   module" — tint gallery panel LEFT with the cover floating on a soft shadow
   (natural aspect, never cropped), buy column RIGHT with a generated
   "Get the book" eyebrow, Lora price, amber Amazon CTA + quiet outline
   secondary merchant, and the price-updated line de-emphasized at the
   bottom. The H2 + review text around the card carry title/author (Lasso's
   flow markup has no title node). !important = matching Lasso's own
   !important rules, documented bridge. */
/* base fallback for any non-flow display type */
.lasso-display{
  border:1px solid var(--uj-hair)!important;
  border-radius:14px!important;
  box-shadow:none!important;
}
.lasso-display .lasso-title, .lasso-display .lasso-title a{
  font-family:var(--uj-font-heading)!important;color:var(--uj-primary)!important;
}
/* Lasso's .lasso-container wrapper pads 15px each side (card measured 610
   wide at x+15 instead of 640 on the text spine) — zero it, the card owns
   its own geometry */
.entry-content .lasso-container{padding:0!important;}
/* --- flow card = the book buy module --- */
.entry-content .lasso-display.lasso-flow{
  display:grid!important;
  grid-template-columns:200px minmax(0,1fr);
  align-items:stretch;
  max-width:var(--uj-measure);
  margin:32px 0!important;
  background:#fff!important;
  overflow:hidden;
}
/* left: cover gallery panel */
.entry-content .lasso-flow .lasso-box-1{
  max-width:none;
  background:var(--uj-tint);
  padding:24px 20px!important;
  display:flex;align-items:center;justify-content:center;
}
.entry-content .lasso-flow .lasso-box-1 .lasso-image{padding:0!important;display:block;line-height:0;}
.entry-content .lasso-flow .lasso-box-1 .lasso-image img{
  width:auto!important;max-width:144px!important;max-height:196px!important;
  border-radius:6px;
  box-shadow:0 10px 26px rgba(16,59,99,.20)!important;
}
/* right: buy column — vertically centered so sparse cards (no price/date,
   e.g. multi-merchant-only) never show a dead zone under the buttons */
.entry-content .lasso-flow .lasso-box-2{
  max-width:none;
  background:#fff;
  padding:20px 26px!important;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
}
.entry-content .lasso-flow .lasso-box-2::before{
  content:"Get the book";
  font:800 11px/1 var(--uj-font-body);
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--uj-accent-text);
  margin-bottom:13px;
}
.entry-content .lasso-flow .lasso-price{
  font-family:var(--uj-font-heading);font-size:22px;line-height:1;font-weight:700;
  color:var(--uj-hero-ink);margin:0 0 16px!important;
}
.entry-content .lasso-flow .lasso-price .discount-price{
  font-family:var(--uj-font-body);font-size:14.5px;font-weight:400;
  color:var(--uj-muted);text-decoration:line-through;margin-right:8px;}
.entry-content .lasso-flow .lasso-description:empty,
.entry-content .lasso-flow .clear{display:none;}
/* price-updated line: whisper-quiet, follows the buttons */
.entry-content .lasso-flow .lasso-end{margin-top:8px;line-height:1;}
.entry-content .lasso-flow .lasso-date{
  font-family:var(--uj-font-body);font-size:11.5px;font-style:normal;
  color:var(--uj-muted);opacity:.75;}
/* Amber affiliate CTA — the reserved action color, affiliate buttons ONLY */
.lasso-display .lasso-button,
.lasso-display a.lasso-button-1{
  background:var(--uj-cta)!important;
  color:var(--uj-cta-ink)!important;
  font-family:var(--uj-font-body)!important;font-weight:700!important;font-size:15px!important;
  border:none!important;border-radius:10px!important;
  padding:11px 18px!important;margin:0 10px 10px 0!important;
  text-decoration:none!important;
  transition:background .15s;
}
.lasso-display .lasso-button:hover,
.lasso-display a.lasso-button-1:hover{
  background:var(--uj-cta-hover)!important;color:var(--uj-cta-ink)!important;
}
/* secondary merchant (B&N, audiobook …): quiet outline, never competes with amber */
.lasso-display a.lasso-button-2{
  background:#fff!important;
  color:var(--uj-primary)!important;
  font-family:var(--uj-font-body)!important;font-weight:600!important;font-size:14px!important;
  border:1px solid var(--uj-hair)!important;border-radius:10px!important;
  padding:10px 16px!important;margin:0 10px 10px 0!important;
  text-decoration:none!important;
  transition:background .15s,border-color .15s;
}
.lasso-display a.lasso-button-2:hover{
  background:var(--uj-tint)!important;border-color:var(--uj-accent)!important;
  color:var(--uj-primary)!important;
}
/* phones: panel on top, buy column below, full-width tap targets */
@media(max-width:600px){
  .entry-content .lasso-display.lasso-flow{grid-template-columns:1fr;}
  .entry-content .lasso-flow .lasso-box-1{padding:20px!important;}
  .entry-content .lasso-flow .lasso-box-1 .lasso-image img{max-height:172px!important;}
  .entry-content .lasso-flow .lasso-box-2{padding:18px 20px 12px!important;}
  .lasso-display a.lasso-button-1,
  .lasso-display a.lasso-button-2{
    display:block;width:100%;text-align:center!important;margin:0 0 10px!important;}
}

/* Books-roundup H2s are affiliate links: headings must not carry the body
   link treatment (2px underline + hover wash read as body links at 35px).
   Heading treatment: inherit the heading navy, no underline; hover = teal
   text shift only (same accent language as kicker links). Specificity
   (0,3,2) beats the body-link rule's (0,3,1). */
.entry-content h2 a:not(.lasso-button):not(.wp-block-button__link),
.entry-content h3 a:not(.lasso-button):not(.wp-block-button__link){
  color:inherit;text-decoration:none;background:transparent;
}
.entry-content h2 a:not(.lasso-button):not(.wp-block-button__link):hover,
.entry-content h3 a:not(.lasso-button):not(.wp-block-button__link):hover{
  color:var(--uj-accent-text);text-decoration:none;background:transparent;
}

/* ============ SHARE (Novashare) ============ */
.ns-buttons .ns-button-wrapper .ns-button{border-radius:50%;}
.ns-buttons .ns-cta-text{font-family:var(--uj-font-body);color:var(--uj-muted);letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:700;}

/* ============ RATE MY POST ============ */
.rmp-main-container{max-width:var(--uj-measure);font-family:var(--uj-font-body);}
.rmp-widgets-container .rmp-rating-widget__title{font-family:var(--uj-font-body);font-size:15px;color:var(--uj-muted);}

/* ============ GRID A / GRID B ============ */
/* GP handles the base 2-col; the rail activates via body.uj-layout-rail */
@media(min-width:1360px){
  body.uj-layout-rail .site-content{
    display:grid;
    grid-template-columns:var(--uj-rail) minmax(0,1fr) ;
    gap:var(--uj-gap-b);
  }
  body.uj-layout-rail #uj-toc-rail{display:block;position:sticky;top:96px;align-self:start;}
}
#uj-toc-rail{display:none;}
#uj-toc-rail .uj-rail-box{
  border:1px solid var(--uj-hair);border-top:3px solid var(--uj-accent);
  border-radius:12px;background:#fff;padding:18px 20px;
}
#uj-toc-rail h4{
  font-family:var(--uj-font-body);font-size:11px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;color:var(--uj-hero-ink);
  margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid var(--uj-hair);
}
#uj-toc-rail ol{list-style:none;margin:0;padding:0;font-family:var(--uj-font-body);}
#uj-toc-rail li{margin-bottom:11px;line-height:1.32;}
#uj-toc-rail a{color:var(--uj-primary);font-weight:700;font-size:13px;text-decoration:none;}
#uj-toc-rail a:hover{color:var(--uj-accent-text);}

/* ============ READ NEXT / RECIRCULATION (redesigned 2026-07-03) ============
   Verywell pattern: full-width blocks BELOW the content+sidebar grid
   (functions.php hooks generate_before_footer — fires after #page closes),
   inner wrapper re-centers on the article group. 2 blocks × 8 cards:
   "Read next" (meta-seeded) + "More in {category}".
   .uj-read-next class + .uj-no-pin/data-pin-nopin on thumbs are LOAD-BEARING
   (Novashare pin-button exclusions) — never remove. */
.uj-recirc{background:#fff;}
.uj-recirc .uj-recirc-inner{max-width:var(--uj-groupA);margin:0 auto;padding:0 20px;}
@media(min-width:1100px){.uj-recirc .uj-recirc-inner{padding:0;}}
/* rail pages (grid B) inherit the wider group */
body.uj-layout-rail .uj-recirc .uj-recirc-inner{max-width:calc(var(--uj-rail) + var(--uj-gap-b) + var(--uj-measure) + var(--uj-gap-b) + var(--uj-adcol));}
.uj-recirc h4{font-family:var(--uj-font-body);font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--uj-primary);margin:0 0 20px;padding-top:26px;border-top:1px solid var(--uj-hair);}
.uj-recirc:last-of-type{padding-bottom:48px;}
.uj-recirc .uj-rn-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px 24px;margin-bottom:36px;}
.uj-rn-card{display:block;color:var(--uj-ink);text-decoration:none;}
.uj-rn-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:10px;margin-bottom:10px;}
.uj-rn-card .uj-thumb{border-radius:10px;margin-bottom:10px;}
.uj-rn-kicker{display:block;font:600 11.5px/1.5 var(--uj-font-body);letter-spacing:.05em;text-transform:uppercase;color:var(--uj-muted);margin:0 0 4px;}
.uj-rn-title{display:block;font-family:var(--uj-font-heading);font-weight:700;font-size:17.5px;line-height:1.3;color:var(--uj-hero-ink);transition:color .15s;}
.uj-rn-card:hover .uj-rn-title{color:var(--uj-accent-text);}
.uj-rn-card:focus-visible{outline:2px solid var(--uj-primary);outline-offset:3px;border-radius:8px;}
/* 3-up between tablet and the full group width */
@media(min-width:769px) and (max-width:1099px){.uj-recirc .uj-rn-grid{grid-template-columns:repeat(3,1fr);}}
/* tablet: 2-up card grid */
@media(min-width:601px) and (max-width:768px){.uj-recirc .uj-rn-grid{grid-template-columns:repeat(2,1fr);}}
/* phones ≤600 (Adrian spec 2026-07-03): compact horizontal recirc ROWS
   (Verywell/NYT mobile pattern) — thumb left 3:2, kicker+title right,
   hairline between rows, whole row tappable (measures ~93px tall) */
@media(max-width:600px){
  .uj-recirc .uj-rn-grid{grid-template-columns:1fr;gap:0;margin-bottom:28px;}
  .uj-rn-card{display:grid;grid-template-columns:104px minmax(0,1fr);gap:2px 14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--uj-hair);}
  .uj-rn-card:last-child{border-bottom:0;}
  .uj-rn-card img{aspect-ratio:3/2;margin:0;grid-row:1 / span 2;border-radius:8px;}
  .uj-rn-kicker{margin:0;}
  .uj-rn-title{font-size:16px;line-height:1.28;}
}

/* closed mega-menu panels are visibility:hidden but still occupy layout
   (absolute, centered under triggers near the right edge) — they poked
   3px past the viewport = permanent horizontal scrollbar at 1440
   (found 2026-07-03). clip = no scrollbar, no scroll; overflow-y stays
   visible so position:sticky (masthead) keeps working. */
html{overflow-x:clip;}

/* ============ ACCESSIBILITY ============ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;}
}

/* ============ MASTHEAD — GP nav-as-header markup (.main-navigation) ============ */
nav.main-navigation{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(1.1) blur(8px);
  -webkit-backdrop-filter:saturate(1.1) blur(8px);
  border-bottom:1px solid var(--uj-hair);
}
nav.main-navigation .inside-navigation{
  max-width:var(--uj-container);margin:0 auto;padding:0 30px;
  min-height:66px;display:flex;align-items:center;gap:30px;
}
/* wordmark = real site title (GP Customizer); old ::before hack removed 07-03 */
.main-navigation .main-nav{margin-left:auto;}
.main-navigation .main-nav ul li a{
  font-family:var(--uj-font-body);font-size:15.5px;font-weight:600;
  color:#554E3B;padding:0 13px;line-height:66px;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .main-nav ul li.current-menu-item > a{color:var(--uj-primary);background:transparent;}
/* dropdown -> v2 panel skin */
.main-navigation .main-nav ul ul{
  background:#fff;border:1px solid var(--uj-hair);
  border-top:3px solid var(--uj-accent);
  border-radius:0 0 14px 14px;
  box-shadow:0 26px 64px rgba(10,40,60,.18);
  padding:10px 0;width:240px;
}
.main-navigation .main-nav ul ul li a{
  line-height:1.4;padding:9px 20px;font-size:14px;font-weight:600;
  color:var(--uj-hero-ink);
}
.main-navigation .main-nav ul ul li a:hover{color:var(--uj-primary);background:var(--uj-tint);}
/* reading progress bar (3px, teal) */
#uj-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;background:transparent;pointer-events:none;}
#uj-progress i{display:block;height:100%;width:0;background:var(--uj-accent);transition:width .08s linear;}
@media(prefers-reduced-motion:reduce){#uj-progress i{transition:none;}}

/* ============ ARTICLE HEADER BAND (ported from v2 template) ============ */
.entry-header{max-width:var(--uj-measure);}
.inline-post-meta-area{
  font-size:11.5px!important;font-weight:600;letter-spacing:.05em;
  color:var(--uj-muted);opacity:.85;line-height:1;text-transform:uppercase;
}
.inline-post-meta-area a{color:var(--uj-accent-text);}
h1.entry-title{
  font-size:clamp(30px,4vw,46px);line-height:1.07;letter-spacing:-.02em;
  margin:9px 0 16px;color:var(--uj-hero-ink);text-wrap:pretty;
}
.entry-meta-block{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-family:var(--uj-font-body);font-size:14.5px;color:var(--uj-muted);
  padding-bottom:22px;border-bottom:1px solid var(--uj-hair);margin-bottom:8px;
}
.entry-meta-block a{color:var(--uj-primary);font-weight:600;text-decoration:none;}
.entry-meta-block a:hover{color:var(--uj-accent-text);}

/* ============ ARTICLE FORMATS (census: verse 241, pullquote 76, separator 1194, pre 142, tables 42) ============ */
/* editor artifacts: empty blockquotes/paragraphs render as visible empty
   tint boxes under the v2 skin (caught on UJ 2026-07-07) — hide them */
.entry-content blockquote:empty,
.entry-content p:empty{display:none;}
.entry-content blockquote{
  /* darker brown rule (Adrian 2026-07-07) — the compat posts use centered
     quotes as highlight boxes; yellow read too loud beside body text */
  border-left:3px solid var(--uj-primary-dark);
  /* EL diverges from UJ here (Adrian 2026-07-07): all four corners rounded;
     UJ keeps the square left spine */
  background:var(--uj-tint);border-radius:12px;
  padding:18px 24px;margin:28px 0;font-style:normal;
}
.entry-content blockquote p{margin-bottom:0;}
.entry-content blockquote cite{font-size:15px;color:var(--uj-muted);font-style:normal;}
/* pullquote flattened to ONE card (Adrian 2026-07-07: the outer rules +
   inner quote box double-framed) — the inner blockquote carries the tint
   card; pullquote just scales the type */
.entry-content .wp-block-pullquote{
  border:0;padding:0;margin:36px 0;
}
.entry-content .wp-block-pullquote blockquote{margin:0;max-width:none;}
.entry-content .wp-block-pullquote p{
  font-family:var(--uj-font-heading);font-size:26px;line-height:1.35;color:var(--uj-primary);
}
.entry-content .wp-block-verse{
  font-family:var(--uj-font-body);font-size:19px;line-height:1.75;
  background:var(--uj-tint);border-radius:12px;padding:22px 26px;margin:24px 0;
  white-space:pre-wrap;
}
.entry-content hr,.entry-content .wp-block-separator{
  border:0;height:1px;background:var(--uj-hair);margin:36px auto;max-width:var(--uj-measure);
}
.entry-content pre,.entry-content .wp-block-preformatted{
  background:var(--uj-tint);border-radius:12px;padding:20px 24px;
  font-family:var(--uj-font-body);font-size:17px;white-space:pre-wrap;
}
.entry-content table{font-size:17px;border-collapse:collapse;}
.entry-content table th{font-family:var(--uj-font-body);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--uj-muted);border-bottom:2px solid var(--uj-hair);padding:10px 12px;text-align:left;}
.entry-content table td{border-bottom:1px solid var(--uj-hair);padding:10px 12px;}
.entry-content figcaption{font-size:14.5px;color:var(--uj-muted);margin-top:8px;}

/* EL: Rank Math FAQ block (460 posts — census 2026-07-06). Quiet Q/A rhythm
   in the v2 language; schema markup untouched. Hairlines removed (Adrian
   2026-07-07 — UJ renders FAQ without them; spacing carries the rhythm). */
.entry-content .rank-math-block{max-width:var(--uj-measure);margin:30px 0;}
.entry-content .rank-math-list-item{padding:10px 0;}
.entry-content h3.rank-math-question{font-size:20px;line-height:1.35;margin:0 0 8px;}
.entry-content .rank-math-answer{font-size:18px;line-height:1.6;}
.entry-content .rank-math-answer p:last-child{margin-bottom:0;}
.entry-content img{border-radius:12px;}
/* VERIFY #4 resolution (2026-07-03): centering is fine everywhere, but
   block-era image wrappers carry 0 bottom margin — images sat flush against
   the following text (measured on sad-girl-quotes). Old CSS had 30px; 28px
   matches the v2 blockquote rhythm. */
.entry-content .wp-block-image{margin-bottom:28px;}
/* (VERIFY #3 CSS hide rule for dead amazon-adsystem imgs REMOVED 2026-07-03
   morning fixes: the imgs were stripped from the user descriptions in the DB —
   backup: projects/upjourney/corpus/author-bios-backup-2026-07-03.json) */

/* ============ TOP SHARE ROW (theme-rendered, v2 byline treatment) ============ */
.uj-share{display:flex;align-items:center;gap:8px;justify-content:flex-end;
  max-width:var(--uj-measure);margin:-64px 0 26px;position:relative;z-index:2;}
.uj-share .uj-share-lb{font:700 10.5px var(--uj-font-body);letter-spacing:.14em;color:var(--uj-muted);text-transform:uppercase;margin-right:2px;}
.uj-share a,
.uj-share button,
.uj-byline .uj-share button{
  width:34px!important;height:34px!important;
  min-width:0!important;min-height:0!important;
  padding:0!important;margin:0!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  border:1px solid var(--uj-hair)!important;border-radius:50%!important;
  background:#fff!important;color:var(--uj-muted)!important;
  box-sizing:border-box!important;line-height:1!important;
  cursor:pointer;text-decoration:none!important;
  transition:color .15s,border-color .15s,background .15s;}
.uj-share svg{display:block;width:15px;height:15px;}
.uj-share a[aria-label*="Facebook"] svg{width:17px;height:17px;transform:translateY(1.5px);}
.uj-share a[aria-label*="Pinterest"] svg{width:16px;height:16px;}
.uj-share a:hover,.uj-share button:hover{color:var(--uj-primary)!important;border-color:var(--uj-primary)!important;background:var(--uj-tint)!important;}
.uj-share .ok{color:#fff;background:var(--uj-accent);border-color:var(--uj-accent);}
@media(max-width:768px){.uj-share{justify-content:flex-start;margin:4px 0 18px;}}

/* ============ FOOTER — REDESIGNED 2026-07-04 (polish round T5) ============
   Dark skin, 4 balanced columns on one grid: brand (wider) + Company +
   Legal + Follow. GP's float/width column CSS is neutralized; the grid owns
   the geometry so vertical rhythm is identical in every column. Copyright
   bar: centered, hairline top. */
/* NOTE: GP's dynamic CSS (customizer spacing relic) adds ANOTHER 40px via
   .footer-widgets-container — killed below at the shell-audit rule, so THIS
   padding is the real total (was rendering 80px top before 2026-07-04 fix) */
.footer-widgets{background:#1B1712;color:#CCC8BD;padding:44px 0;}
.footer-widgets .inside-footer-widgets{
  max-width:var(--uj-container);margin:0 auto;
  display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
  gap:36px 48px;align-items:start;}
.footer-widgets .inside-footer-widgets > div[class*="footer-widget-"]{
  width:100%!important;float:none!important;margin:0;}
.footer-widgets .widget,.footer-widgets .widget.inner-padding{margin:0;padding:0!important;}
.footer-widgets .widget-title,.footer-widgets .widget .widget-title{
  font-family:var(--uj-font-body);text-transform:uppercase;letter-spacing:.14em;
  font-size:11px;font-weight:800;color:var(--uj-accent);margin:0 0 16px;line-height:1;}
.footer-widgets,.footer-widgets p{font-family:var(--uj-font-body);font-size:15px;line-height:1.65;}
.footer-widgets p{color:#A49E8F;margin:0 0 14px;}
.footer-widgets p:last-child{margin-bottom:0;}
.footer-widgets a{color:#CCC8BD;text-decoration:none;transition:color .15s;}
.footer-widgets a:hover{color:#fff;}
.footer-widgets ul{list-style:none;margin:0;padding:0;font-size:15px;}
.footer-widgets ul li{margin:0 0 10px;}
.footer-widgets ul li:last-child{margin-bottom:0;}
/* brand column */
.uj-f-brandline{font-size:14px;}
.uj-f-sisters{font-size:14px;color:#A49E8F;}
.uj-f-sisters a{margin-right:8px;} /* 16 rendered ~20px gap between site links — too airy vs the 4px label gap */
.uj-f-sisters a:last-child{margin-right:0;}
/* copyright bar: centered, hairline top */
.site-info{background:#1B1712;color:#87816E;border-top:1px solid rgba(255,255,255,.08);}
.site-info .inside-site-info{max-width:var(--uj-container);margin:0 auto;font-family:var(--uj-font-body);font-size:14px;padding:20px 30px;line-height:1.7;text-align:center;}
.site-info a{color:#A49E8F;text-decoration:none;}
.site-info a:hover{color:#fff;}
/* footer responsive: 2 cols (brand spans both) at tablet, 1 col on phones */
@media(max-width:1024px){
  .footer-widgets .inside-footer-widgets{grid-template-columns:1fr 1fr;gap:32px 36px;}
  .footer-widgets .inside-footer-widgets > .footer-widget-1{grid-column:1/-1;}
}
@media(max-width:600px){
  .footer-widgets .inside-footer-widgets{grid-template-columns:1fr;gap:28px;}
}

/* ============ ARCHIVE / BLOG CARDS — REBUILT 2026-07-03 (map 6.1/6.2) ============
   Old "Blog and Archives" GP Block Element (1092257) drafted on dev; archives
   render GP's NATIVE loop again (.inside-article/.post-image). The grid itself
   is ours: GP Premium's float columns (grid-33 + padding) are converted to CSS
   grid — page-header and the paging nav are ITEMS of .generate-columns-container
   in columns mode, hence grid-column:1/-1. Card language = recirc/homepage:
   3:2 thumb, kicker, Lora title, no excerpt (excerpt off via filter). */
body.archive .generate-columns-container,
body.blog .generate-columns-container,
body.search .generate-columns-container{
  display:grid;grid-template-columns:repeat(4,1fr);gap:32px 22px;
  margin-left:0;}
/* 4-col only where the 1280 container is full; 3-col in the between band */
@media(min-width:1100px) and (max-width:1279px){
  body.archive .generate-columns-container,
  body.blog .generate-columns-container,
  body.search .generate-columns-container{grid-template-columns:repeat(3,1fr);}
}
.archive article.generate-columns,
.blog article.generate-columns,
.search article.generate-columns{
  width:100%;float:none;padding:0;margin:0;}
.archive .generate-columns-container > .page-header,
.blog .generate-columns-container > .page-header,
.search .generate-columns-container > .page-header,
.generate-columns-container > .paging-navigation{grid-column:1/-1;}
/* card shell */
.archive article.generate-columns .inside-article,
.blog article.generate-columns .inside-article,
.search article.generate-columns .inside-article{
  background:#fff;border:1px solid var(--uj-hair);border-radius:14px;
  overflow:hidden;padding:0 0 22px;height:100%;margin:0;
  transition:box-shadow .18s,transform .18s;}
.archive article.generate-columns .inside-article:hover,
.blog article.generate-columns .inside-article:hover,
.search article.generate-columns .inside-article:hover{
  box-shadow:0 14px 34px rgba(16,36,58,.10);transform:translateY(-2px);}
.archive .post-image,.blog .post-image,.search .post-image{margin:0 0 16px;}
.archive .post-image a,.blog .post-image a,.search .post-image a{display:block;}
.archive .post-image img,.blog .post-image img,.search .post-image img{
  display:block;border-radius:0;width:100%;aspect-ratio:3/2;object-fit:cover;}
/* excerpt is emptied at the PHP layer (functions.php 8e) but GP still prints
   the wrapper div — as a grid item it created a phantom 2nd row in the
   compact-row mode (rows measured 188px for ~100px of content) */
.archive article.generate-columns .entry-summary,
.blog article.generate-columns .entry-summary,
.search article.generate-columns .entry-summary{display:none;}
/* kicker + title (uj-card-kicker rendered by functions.php 8e) */
.archive article.generate-columns .entry-header,
.blog article.generate-columns .entry-header,
.search article.generate-columns .entry-header{padding:0 20px;}
.uj-card-kicker{display:block;font:600 11.5px/1.5 var(--uj-font-body);
  letter-spacing:.05em;text-transform:uppercase;color:var(--uj-muted);margin:0 0 5px;}
.archive article.generate-columns .entry-title,
.blog article.generate-columns .entry-title,
.search article.generate-columns .entry-title{font-size:20px;line-height:1.32;margin:0;}
.archive article.generate-columns .entry-title a,
.blog article.generate-columns .entry-title a,
.search article.generate-columns .entry-title a{color:var(--uj-primary);text-decoration:none;transition:color .15s;}
.archive article.generate-columns .entry-title a:hover,
.blog article.generate-columns .entry-title a:hover,
.search article.generate-columns .entry-title a:hover{color:var(--uj-accent-text);}
/* archive header: eyebrow / Lora title / count */
.archive .page-header,.search .page-header,.blog .page-header{margin:34px 0 14px;}
/* archive surfaces align to the nav's CONTENT line (logo/search sit 30px
   inside the 1280 container; band + grid ran flush to the container edge and
   visibly overflowed the header line once the band went navy — Adrian
   2026-07-05). Single posts keep their own narrower group geometry. */
body:is(.category,.tag,.search,.author,.blog) .site-content{
  padding-left:30px;padding-right:30px;box-sizing:border-box;}
@media(max-width:1319px){
  body:is(.category,.tag,.search,.author,.blog) .site-content{
    padding-left:20px;padding-right:20px;}
}
@media(max-width:768px){
  /* mobile shell rules already gutter these surfaces — avoid doubling */
  body:is(.category,.tag,.search,.author,.blog) .site-content{
    padding-left:0;padding-right:0;}
}

/* ---------- hub header band. EL 2026-07-07 round 7 (Adrian): the FRONT-PAGE
   header treatment — cream tint band + ochre H1 (same language as
   .uj-home-hero). Dark/brown/yellow fills all rejected; light band it is.
   Category/tag/search only; author keeps the tint card. ---------- */
body:is(.category,.tag,.search,.blog) .page-header{
  background:var(--uj-tint);border-radius:16px;padding:28px 32px 30px;margin:34px 0 24px;}
/* ink-on-cream companions. Round 8 (Adrian): eyebrow gray like the count
   line, H1 near-black — matches article H1s instead of ochre */
body:is(.category,.tag,.search,.blog) .page-header .uj-archive-eyebrow{color:var(--uj-muted);}
body:is(.category,.tag,.search,.blog) .page-header h1{color:var(--uj-head);}
body:is(.category,.tag,.search,.blog) .page-header .uj-archive-count{color:var(--uj-muted);}
body:is(.category,.tag,.search,.blog) .page-header .taxonomy-description,
body:is(.category,.tag,.search,.blog) .page-header .taxonomy-description p{color:var(--uj-ink);}
body:is(.category,.tag,.search,.blog) .page-header .uj-crumbs,
body:is(.category,.tag,.search,.blog) .page-header .uj-crumbs a,
body:is(.category,.tag,.search,.blog) .page-header .uj-crumb-sep{color:var(--uj-muted);}
body:is(.category,.tag,.search,.blog) .page-header .uj-crumbs a:hover{color:var(--uj-primary);}
body:is(.category,.tag,.search,.blog) .page-header .uj-crumbs [aria-current]{color:var(--uj-ink);}
body:is(.category,.tag,.search,.blog) .page-header .uj-chip{
  background:#fff;border-color:var(--uj-hair);color:var(--uj-ink);}
body:is(.category,.tag,.search,.blog) .page-header .uj-chip .uj-chip-n{color:var(--uj-muted);}
body:is(.category,.tag,.search,.blog) .page-header .uj-chip:hover{
  background:#fff;border-color:var(--uj-primary);color:var(--uj-primary);}
body:is(.category,.tag,.search,.blog) .page-header .uj-hub-pillars .uj-home-label{color:var(--uj-accent-text);}
@media(max-width:768px){
  .archive .taxonomy-description{font-size:19px;} /* device body size */
}
@media(max-width:600px){
  body:is(.category,.tag,.search,.blog) .page-header{padding:22px 20px;}
}
.uj-archive-eyebrow{display:block;font:800 11.5px/1 var(--uj-font-body);
  letter-spacing:.14em;text-transform:uppercase;color:var(--uj-accent-text);margin:0 0 10px;}
.archive .page-header h1,.search .page-header h1{
  font-size:40px;line-height:1.1;color:var(--uj-hero-ink);margin:0;}
.uj-archive-count{font-family:var(--uj-font-body);font-size:15px;color:var(--uj-muted);margin:10px 0 0;}
.archive .taxonomy-description{color:var(--uj-muted);font-size:20px;max-width:none;margin:10px 0 0;} /* full width + body-size (Adrian 2026-07-05) */
.archive .taxonomy-description p{margin:0;font-size:inherit;}
/* pagination: numbered pills; GP's Older/Newer arrow rows are redundant */
.paging-navigation{border-top:1px solid var(--uj-hair);padding:26px 0 40px;margin-top:14px;}
.paging-navigation .nav-previous,.paging-navigation .nav-next{display:none;}
.paging-navigation .nav-links{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;font-family:var(--uj-font-body);}
.paging-navigation .page-numbers{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 13px;border:1px solid var(--uj-hair);
  border-radius:10px;font-size:15px;font-weight:600;color:var(--uj-primary);
  text-decoration:none;background:#fff;transition:background .15s,color .15s,border-color .15s;}
.paging-navigation a.page-numbers:hover{background:var(--uj-tint);border-color:var(--uj-accent);}
.paging-navigation .page-numbers.current{background:var(--uj-primary);border-color:var(--uj-primary);color:#fff;}
.paging-navigation .page-numbers.dots{border:none;background:transparent;color:var(--uj-muted);min-width:auto;padding:0 2px;}
/* author archives: ProfilePress injects an avatar into the archive title */
.archive .page-header h1 img.avatar{
  width:44px;height:44px;border-radius:50%;vertical-align:-8px;margin-right:12px;}
/* responsive: below container+insets the grid needs its own side padding
   (article cards measured flush at x=0 on 768/390 without it) */
@media(max-width:1319px){
  body.archive .generate-columns-container,
  body.blog .generate-columns-container,
  body.search .generate-columns-container{padding-left:20px;padding-right:20px;}
}
@media(max-width:359px){
  body.archive .generate-columns-container,
  body.blog .generate-columns-container,
  body.search .generate-columns-container{padding-left:10px;padding-right:10px;}
}
/* responsive: 2-col tablet band, compact recirc-style rows on phones */
@media(min-width:601px) and (max-width:1099px){
  body.archive .generate-columns-container,
  body.blog .generate-columns-container,
  body.search .generate-columns-container{grid-template-columns:repeat(2,1fr);gap:30px 24px;}
}
@media(max-width:600px){
  body.archive .generate-columns-container,
  body.blog .generate-columns-container,
  body.search .generate-columns-container{grid-template-columns:1fr;gap:0;}
  .archive article.generate-columns .inside-article,
  .blog article.generate-columns .inside-article,
  .search article.generate-columns .inside-article{
    display:grid;grid-template-columns:104px minmax(0,1fr);gap:14px;align-items:center;
    background:transparent;border:0;border-radius:0;border-bottom:1px solid var(--uj-hair);
    padding:12px 0;height:auto;}
  .archive article.generate-columns .inside-article:hover,
  .blog article.generate-columns .inside-article:hover,
  .search article.generate-columns .inside-article:hover{box-shadow:none;transform:none;}
  .archive article.generate-columns:last-of-type .inside-article,
  .blog article.generate-columns:last-of-type .inside-article,
  .search article.generate-columns:last-of-type .inside-article{border-bottom:0;}
  /* GP's .inside-article .post-image margin (36px) outranks the bare
     selector and skews the centered compact row — text sat 18px low
     (Adrian caught it on search, 2026-07-05). Match its specificity. */
  .archive article.generate-columns .inside-article .post-image,
  .blog article.generate-columns .inside-article .post-image,
  .search article.generate-columns .inside-article .post-image{margin:0;}
  .archive article.generate-columns .inside-article .entry-summary,
  .blog article.generate-columns .inside-article .entry-summary,
  .search article.generate-columns .inside-article .entry-summary{margin:0;}
  .archive .post-image img,.blog .post-image img,.search .post-image img{border-radius:8px;}
  .archive article.generate-columns .entry-header,
  .blog article.generate-columns .entry-header,
  .search article.generate-columns .entry-header{padding:0;}
  .archive article.generate-columns .entry-title,
  .blog article.generate-columns .entry-title,
  .search article.generate-columns .entry-title{font-size:16px;line-height:1.28;}
  .uj-card-kicker{margin-bottom:2px;}
  .archive .page-header h1,.search .page-header h1{font-size:30px;}
  .archive .page-header,.search .page-header,.blog .page-header{margin:22px 0 4px;}
}

/* ============ AUTHOR BOX (GP Element GB container after content) ============ */
.gb-container-4f8d8179{
  border:1px solid var(--uj-hair);border-radius:14px;background:var(--uj-tint);
  padding:24px 26px!important;margin:44px 0 !important;max-width:var(--uj-measure);}
.gb-container-4f8d8179 img{border-radius:50%;}
.gb-container-4f8d8179 a{color:var(--uj-primary);font-family:var(--uj-font-heading);font-weight:700;text-decoration:none;}
.gb-container-4f8d8179 p{font-size:16.5px;line-height:1.6;color:var(--uj-ink);}

/* ============ SIDEBAR ============ */
#right-sidebar .inside-right-sidebar{font-family:var(--uj-font-body);}
/* GP's dynamic CSS (customizer spacing relic) padded sidebar widgets
   80px 15px 20px — the mystery 80px that pushed the newsletter box 50px
   below the first body line (measured 2026-07-04). Widgets are flush; each
   card (uj-nl etc.) brings its own internal padding. The 30px top offset
   matches the article column's rule-to-content gap so the first sidebar
   element top-aligns with the first body line. */
#right-sidebar .widget{margin-bottom:28px;padding:0!important;}
/* 36 not 30: body text's half-leading ((1.65 - 1) x 20px / 2 ~ 6.5px) means
   the first INK line starts ~6px below the paragraph box, while the card
   border is ink at its box edge — box-aligning them made the card look a few
   px high (Adrian 2026-07-04). Optical alignment = box offset + half-leading. */
.single-post #right-sidebar .inside-right-sidebar{padding-top:36px;}
/* PAGES (about/standards/contact...): no band; the sidebar box floated 21px
   ABOVE the H1 (widget at y=95 vs H1 at 116, measured 2026-07-05). Align the
   box top to the H1 cap line. */
body.page #right-sidebar .inside-right-sidebar{padding-top:52px;} /* GP already had 28 default here; 52 lands the box on the H1 cap line (measured) */

/* ============ SEARCH / 404 / PAGES ============ */
.search-results .page-header h1,.error404 .page-header h1{font-size:34px;color:var(--uj-hero-ink);}
.error404 .page-content,.search-no-results .page-content{max-width:var(--uj-measure);font-size:18px;}
.page .entry-content h1{font-size:40px;}

/* (first-pass mobile block removed 2026-07-03 — superseded by the dedicated
   MOBILE PASS section at the end of this file) */

/* ============ ARTICLE HEADER BAND — PRECISION FIX (2026-07-02b) ============
   The chips row AND the byline row both carry .inline-post-meta-area (GP
   Elements share the class), and GB per-block stylesheets outrank generic
   rules — hence scoping + !important here. Spec = v2 template extraction. */
/* kicker chips row (the one that is NOT the byline) */
.entry-header .inline-post-meta-area:not(.entry-meta-block) .gb-headline,
.entry-header .inline-post-meta-area:not(.entry-meta-block) .post-term-item,
.entry-header .inline-post-meta-area:not(.entry-meta-block) a{
  font-family:var(--uj-font-body)!important;
  font-size:11.5px!important;font-weight:600!important;
  letter-spacing:.05em!important;text-transform:uppercase!important;
  color:var(--uj-muted)!important;text-decoration:none!important;line-height:1.5!important;}
.entry-header .inline-post-meta-area:not(.entry-meta-block) a:hover{color:var(--uj-accent-text)!important;}
/* byline row: normal case, 14.5 muted, author link navy; border lives on the block */
.entry-header .entry-meta-block{display:block;border-bottom:1px solid var(--uj-hair);
  padding-bottom:18px;margin-bottom:12px;max-width:var(--uj-measure);}
.entry-header .entry-meta-block .gb-inside-container{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.entry-header .entry-meta-block .gb-headline{
  font-family:var(--uj-font-body)!important;font-size:14.5px!important;
  font-weight:400!important;letter-spacing:0!important;text-transform:none!important;
  color:var(--uj-muted)!important;margin:0!important;}
.entry-header .entry-meta-block .gb-headline a{
  color:var(--uj-primary)!important;font-weight:600!important;font-size:14.5px!important;
  text-transform:none!important;letter-spacing:0!important;text-decoration:none!important;}
.entry-header .entry-meta-block .gb-headline a:hover{color:var(--uj-accent-text)!important;}
/* share row: static fallback = own right-aligned row (NO negative margin);
   JS relocates it into the byline flex row where it right-aligns cleanly */
.uj-share{margin:0 0 26px;}
.entry-meta-block .uj-share{margin:0 0 0 auto;}
/* share label: icons are self-evident; label costs 55px and wraps long bylines */
.uj-share .uj-share-lb{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
/* GB gives the byline container a fixed ~368px width — widen to the measure */
.entry-header .entry-meta-block,
.entry-header .entry-meta-block .gb-inside-container{width:100%!important;max-width:100%!important;}
/* NOT var(--uj-measure) here: this block inherits 11.5px font-size from the shared class, so 32em = 368px and wrapped the share row. Parent entry-header owns the measure. */

/* ============ REBUILD 2026-07-03 — theme-owned article header (GP Elements drafted on dev) ============ */
/* header band spans the content area; body text keeps the measure */
.entry-header{max-width:none;}
h1.entry-title{max-width:none;}
.uj-kicker{font:600 11.5px/1.5 var(--uj-font-body);letter-spacing:.05em;text-transform:uppercase;color:var(--uj-muted);margin-bottom:12px;}
.uj-kicker a{color:var(--uj-muted);text-decoration:none;transition:color .15s;}
.uj-kicker a:hover{color:var(--uj-accent-text);}
.uj-kicker-sep{margin:0 8px;opacity:.45;}
.uj-byline{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-family:var(--uj-font-body);font-size:14.5px;color:var(--uj-muted);padding-bottom:18px;border-bottom:1px solid var(--uj-hair);margin-bottom:26px;}
.uj-byline-by a{color:var(--uj-primary);font-weight:600;text-decoration:none;}
.uj-byline-by a:hover{color:var(--uj-accent-text);}
.uj-byline-sep{width:3px;height:3px;border-radius:50%;background:currentColor;display:inline-block;overflow:hidden;text-indent:-99px;opacity:.7;}
.uj-byline .uj-share{margin:0 0 0 auto;}
.uj-authorbox{display:flex;gap:18px;border:1px solid var(--uj-hair);border-radius:14px;background:var(--uj-tint);padding:24px 26px;margin:44px 0;max-width:var(--uj-measure);}
.uj-authorbox-avatar img{border-radius:50%;}
.uj-authorbox-name{font-family:var(--uj-font-heading);font-weight:700;font-size:19px;color:var(--uj-primary);text-decoration:none;display:inline-block;margin-bottom:6px;}
.uj-authorbox-body p{font-size:16.5px;line-height:1.6;margin-bottom:10px;}
.uj-authorbox-body p:last-child{margin-bottom:0;}

/* wordmark = GP site title in nav branding (logo removed at Customizer layer) */
.main-navigation .navigation-branding .main-title{line-height:66px!important;margin:0;font-size:inherit;}
.main-navigation .navigation-branding .main-title a{font-family:var(--uj-font-heading);font-weight:700;font-size:25px;letter-spacing:.01em;text-transform:uppercase;color:var(--uj-primary);text-decoration:none;}

/* nav search (GP native): icon + dropdown field skin.
   Hover feedback (2026-07-03): primary icon color + soft wash disc, matching
   the site link treatment; the old rule forced background:transparent. */
.main-navigation .menu-bar-items{display:flex;align-items:center;}
.main-navigation .menu-bar-items .menu-bar-item a{
  color:#554E3B;display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;padding:0;border-radius:50%;
  transition:color .15s,background-color .15s;}
.main-navigation .menu-bar-items .menu-bar-item a:hover{color:var(--uj-primary);background:var(--uj-wash);}
.main-navigation .menu-bar-items .menu-bar-item a:focus-visible{outline:2px solid var(--uj-primary);outline-offset:2px;}
.main-navigation .navigation-search{top:100%!important;}
.main-navigation .navigation-search input[type="search"]{
  font-family:var(--uj-font-body);font-size:16px;font-weight:500;color:var(--uj-ink);
  background:#fff;border:1px solid var(--uj-hair);border-top:3px solid var(--uj-accent);
  border-radius:0 0 12px 12px;box-shadow:0 20px 44px rgba(10,40,60,.15);height:64px;opacity:1;}

/* footer brand column + lists (v2 demo spec) */
.uj-f-wordmark{font-family:var(--uj-font-heading);font-weight:700;font-size:22px;letter-spacing:.02em;text-transform:uppercase;color:#fff;display:block;margin-bottom:14px;}
.uj-f-brand p{color:#A49E8F;font-size:14px;line-height:1.65;margin:0 0 18px;}
.uj-f-social{display:flex;gap:18px;font-size:13.5px;font-weight:600;}
.uj-f-social a{color:#CCC8BD;}
.uj-f-social a:hover{color:#fff;}
.uj-f-disclosure{font-size:12.5px;color:#87816E;margin-top:16px;}

/* (NEWSLETTER SHELLS removed for EL — no newsletter on Enlightio, Adrian 2026-07-06) */

/* ============ ARTICLE BAND — full-container header (demo spec: meta full width) ============ */
.uj-article-band{background:#fff;}
.uj-article-band .uj-band-inner{max-width:var(--uj-container);margin:0 auto;padding:36px 30px 0;}
.uj-article-band h1{font-family:var(--uj-font-heading);font-weight:700;font-size:clamp(30px,4vw,46px);line-height:1.07;letter-spacing:-.02em;margin:0 0 16px;color:var(--uj-hero-ink);text-wrap:pretty;}
/* pad 28 (was 20): the 34px share circles bottom out 5px below the text, so
   20 rendered as 21px circle-to-rule vs 30 rule-to-content — read as lopsided
   (Adrian 2026-07-04). 28 puts the circle side at ~29, matching the 30 below. */
.uj-article-band .uj-byline{margin-bottom:0;padding-bottom:28px;}
/* in-column duplicates are removed at the hook level; belt+suspenders: */
.single-post .entry-header .entry-title{display:none;}
.single-post .entry-header .entry-meta{display:none;}
.single-post .entry-header{margin:0;}

/* ============ GRID A PROPER (2026-07-03): the COLUMN is the unit ============
   Demo geometry: text column 640 + 96 gap + 300 sidebar = 1036 group, centered;
   the article band aligns to the GROUP (title left edge = text left edge),
   nav/footer stay at the 1280 container. Kills the dead 320px void that
   appeared when text floated inside a 75%-wide content area. */
:root{--uj-groupA:calc(var(--uj-measure) + var(--uj-gap-a) + var(--uj-adcol));} /* 1036px */
.single-post .uj-article-band .uj-band-inner{max-width:var(--uj-groupA);}
.single-post .uj-article-band h1{text-wrap:pretty;} /* demo spec; pretty only rebalances text that already wraps — the earlier 2-line bug was a 900px cap, not pretty */
@media(min-width:1100px){
  /* ONE LEFT SPINE: article group left-aligned inside the same 1280 container
     as the nav — title/kicker/byline/text all start under the wordmark. */
  .single-post:not(.uj-layout-rail) .site-content{
    display:flex;
    max-width:var(--uj-groupA);
    margin:0 auto;
    padding:0;
    gap:var(--uj-gap-a);
  }
  .single-post:not(.uj-layout-rail) .site-content .content-area{
    width:auto;flex:0 0 var(--uj-measure);float:none;
  }
  .single-post:not(.uj-layout-rail) .content-area .inside-article{
    padding-left:0;padding-right:0;
  }
  .single-post:not(.uj-layout-rail) .site-content #right-sidebar{
    width:var(--uj-adcol);flex:0 0 var(--uj-adcol);float:none;
  }
  .single-post:not(.uj-layout-rail) .uj-article-band .uj-band-inner{
    max-width:var(--uj-groupA);
    padding-left:0;padding-right:0;
  }
  /* band text block + hairline end exactly at the sidebar's right edge */
  .single-post:not(.uj-layout-rail) .uj-article-band h1{max-width:var(--uj-groupA);}
  .single-post:not(.uj-layout-rail) .uj-article-band .uj-byline{max-width:var(--uj-groupA);}
}

/* spine exactness: kill the empty logo box (image hidden but 179px box remained),
   normalize nav padding to the article band's 30px so the wordmark sits on the spine */
.main-navigation .navigation-branding .site-logo{display:none!important;}
.main-navigation .inside-navigation{padding-left:30px!important;padding-right:30px!important;}
.main-navigation .navigation-branding{margin-left:0!important;}
.main-navigation .navigation-branding .main-title{margin-left:0!important;}

/* shell audit fix (2026-07-03): GP renders the footer widget ROW full-bleed —
   force it onto the shared shell like every other region */
.footer-widgets .inside-footer-widgets{
  max-width:var(--uj-container)!important;
  margin-left:auto!important;margin-right:auto!important;
  padding-left:30px;padding-right:30px;box-sizing:border-box;
}
/* band top: section-break space above the kicker. Rhythm normalized
   2026-07-04 (Adrian: "different sizes visually off"): 32 above kicker ->
   12 kicker/H1 -> 16 H1/byline -> 20 byline pad -> 30 rule to content AND
   sidebar (ascending scale, no near-miss pairs) */
.uj-article-band .uj-band-inner{padding-top:32px;}
/* footer parent container: kill GP's own padding on ALL sides — its dynamic
   CSS (customizer spacing relic) adds 40px top that doubled our footer top
   padding (measured 80px, 2026-07-04) */
.footer-widgets .footer-widgets-container{padding:0!important;}

/* ==================================================================
   PORTED FROM OLD ADDITIONAL CSS — audit + apply 2026-07-03
   (source: projects/upjourney/old-additional-css-review-2026-07-03.md;
   colors mapped to --uj-* tokens)
   ================================================================== */

/* #8 Gutenberg group padding kill (CRITICAL): GP's generated CSS pads
   .site-main .wp-block-group__inner-container (20px / 40px 25px) — groups
   exist in 1,420 posts; every one rendered with stray padding. Global on
   purpose = exact prod behavior. */
.wp-block-group__inner-container{padding:0 !important;}

/* #14/#15 Key Points + Highlight callouts (60 + 224 posts) — adapted from
   #FAFAFA/shadow to the v2 box language (tint, radius 12, like the jump list) */
.entry-content .key,
.entry-content .highlight{
  background:var(--uj-tint);
  border-radius:12px;
  padding:20px 24px;
  padding-bottom:4px;   /* children carry their own margin-bottom */
  margin:30px 0;
  max-width:var(--uj-measure);
}

/* #12 list-item spacing (2,208 posts / 182k items) — 1em was too airy on
   long quote lists (Adrian 2026-07-03); .6em reads professional, not cramped */
.entry-content ul:not(.toc_list):not(.rmp-rating-widget__icons-list) > li,
.entry-content ol:not(.toc_list) > li{
  margin-bottom:.6em;
}
/* #23 Option B, modernized (Adrian 2026-07-03): the old teal-dot bullet
   system carried into the new language via ::marker (no list-style:none /
   ::before hacks). --uj-accent-text (4.95:1) — calmer than bright accent
   on long lists; markers are decorative so this is a brand accent, not
   a contrast requirement. Applies to nested lists too by design. */
.entry-content ul:not(.toc_list):not(.rmp-rating-widget__icons-list) li::marker{
  color:var(--uj-accent-text);
}
.entry-content ol:not(.toc_list) li::marker{
  color:var(--uj-accent-text);
  font-weight:600;
}
/* lists shipped with padding-left:0 (GP reset) → markers hung OUTSIDE the
   text column (invisible at mobile insets), while GP's 3em margin-left
   over-indented the text. Normalize: flush with paragraphs, markers inside
   (Verywell pattern; nested lists indent one 1.2em step per level). */
.entry-content ul:not(.toc_list):not(.rmp-rating-widget__icons-list){margin-left:0;padding-left:1.2em;}
.entry-content ol:not(.toc_list){margin-left:0;padding-left:1.5em;}

/* #27 homepage GB card-title links (.category-page) — exempt from the
   article underline+wash treatment until the homepage rebuild */
.entry-content .category-page a{
  text-decoration:none !important;
  background:transparent !important;
}

/* ============ CONTENT-OPS CLASS CONTRACT (2026-07-03) ============
   Styles for the markup the content-port pipeline will write on approval
   (projects/upjourney/content-port-flags-2026-07-03.md, T2 + T3). Ships
   ahead of the content so approved flags land already styled. */

/* Key Takeaways box — demo spec: tint + hair border + teal top rule,
   radius 14, Figtree eyebrow title, 18px list (body minus 2px).
   The group also carries .key; these rules come later and override. */
.entry-content .uj-key-takeaways{
  background:var(--uj-tint);
  border:1px solid var(--uj-hair);
  border-top:3px solid var(--uj-accent);
  border-radius:14px;
  padding:24px 28px 18px;
  margin:30px 0 38px;
  max-width:var(--uj-measure);
}
.entry-content .uj-kt-title{
  font-family:var(--uj-font-body);
  font-size:12px;font-weight:800;line-height:1;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--uj-accent-text);
  margin:0 0 14px;
}
.entry-content .uj-key-takeaways .uj-kt-list{
  margin:0;font-size:18px;line-height:1.6;
}
.entry-content .uj-key-takeaways .uj-kt-list > li{margin-bottom:9px;}
.entry-content .uj-key-takeaways .uj-kt-list > li:last-child{margin-bottom:0;}
/* numbered variant (listicles): weight the numbers like the jump list */
.entry-content ol.uj-kt-list > li::marker{font-weight:700;color:var(--uj-accent-text);}

/* Expert Insight chip — demo spec: teal left rule, 50px round avatar,
   ANSWER BY eyebrow, bold name, muted credential. Markup contract:
   group > figure.uj-expert-avatar + p.uj-expert-name + p.uj-expert-cred. */
.entry-content .uj-expert-insight{
  display:grid;
  grid-template-columns:50px minmax(0,1fr);
  column-gap:14px;row-gap:0;
  align-items:start;align-content:center;
  border-left:3px solid var(--uj-accent);
  padding:3px 0 3px 16px;
  margin:26px 0;
  max-width:var(--uj-measure);
}
.entry-content .uj-expert-insight::before{
  content:"Answer by";
  grid-column:2;
  font:700 10px/1.6 var(--uj-font-body);
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--uj-accent-text);
}
.entry-content .uj-expert-insight .uj-expert-avatar{
  grid-column:1;grid-row:1 / span 3;
  margin:0!important;width:50px;line-height:0;
}
.entry-content .uj-expert-insight .uj-expert-avatar img{
  width:50px!important;height:50px!important;
  border-radius:50%!important;object-fit:cover;display:block;
}
.entry-content .uj-expert-insight .uj-expert-name{
  grid-column:2;
  font-family:var(--uj-font-body);font-size:16.5px;font-weight:700;line-height:1.35;
  color:var(--uj-hero-ink);margin:1px 0 1px;max-width:none;
}
.entry-content .uj-expert-insight .uj-expert-cred{
  grid-column:2;
  font-family:var(--uj-font-body);font-size:14px;line-height:1.45;
  color:var(--uj-muted);margin:0;max-width:none;
}
/* name/credential links: chip language, not the body-link underline
   (these ties beat the (0,3,1) body rule by source order) */
.entry-content .uj-expert-insight .uj-expert-name a,
.entry-content .uj-expert-insight .uj-expert-cred a{
  color:var(--uj-primary);text-decoration:none;background:transparent;
}
.entry-content .uj-expert-insight .uj-expert-name a:hover,
.entry-content .uj-expert-insight .uj-expert-cred a:hover{
  color:var(--uj-accent-text);background:transparent;
}

/* grandfathered prod-parity, Mediavine-adjacent: do not extend */
.entry-content .mv-ad-box{margin-bottom:1.5em;}
.adunitlabel{padding-left:0 !important;padding-right:0 !important;}

/* ============ MOBILE PASS (dedicated, 2026-07-03 — 360/390/430/768) ============
   Measured baseline: content inset = 20px (GP .inside-article) but band/nav/
   footer sat at 30px → ragged left edge. Unify EVERYTHING on 20px at ≤768.
   Desktop (≥769) untouched. */

/* anchor jumps must land clear of the sticky masthead (66px desktop bar,
   56px mobile) — jump-list/rail targets are the theme-added h2 ids plus any
   TOC-plugin span anchors. Behavioral fix, all widths (bug exists on desktop
   too: sticky header covered jump targets; scroll-margin has zero layout
   impact). */
.entry-content h2[id],.entry-content h3[id],.entry-content h4[id],
.entry-content span[id]{scroll-margin-top:86px;}

/* mobile header brand — GP's Menu Plus mobile header renders NO branding
   (hamburger + search only); functions.php hooks the wordmark in.
   Specificity: GP's mobile-header link rules (17px) beat a bare class —
   prefix with the nav ancestors like the mega-menu module does. */
nav.main-navigation .inside-navigation .uj-mobile-brand{
  font-family:var(--uj-font-heading);font-weight:700;font-size:20px;
  letter-spacing:.01em;text-transform:uppercase;color:var(--uj-primary);
  text-decoration:none;line-height:56px;white-space:nowrap;padding:0;
  order:-1;margin-right:auto;}
nav.main-navigation .inside-navigation .uj-mobile-brand:hover{color:var(--uj-primary-dark);background:transparent;}

/* ---- mobile HEADER band = GP's real breakpoint (menu_plus
   mobile_menu_breakpoint = 1025, NOT 768) — these bar/panel rules must
   cover the whole ≤1024 range or the 769-1024 band renders GP's mobile
   header unfixed (86px bar, white-on-white hamburger; found 2026-07-03
   during the mega-menu redesign). Side padding stays range-specific:
   30px base at 769-1024 (matches band/footer), 20px ≤768 below. */
@media(max-width:1024px){
  nav.main-navigation .inside-navigation{
    min-height:56px;
    gap:0 4px;row-gap:0; /* desktop gap:30px leaked here: the wrapped (hidden) .main-nav row added 30px of dead nav height (86px bar) */
  }
  /* mobile header order: [brand] ... [search][hamburger]; the hidden .main-nav
     list wraps to its own 0-height row below */
  nav.main-navigation .menu-bar-items{order:2;}
  nav.main-navigation .menu-toggle{order:3;}
  nav.main-navigation .main-nav{order:4;margin-left:0;}
  /* hamburger: GP stock button color was WHITE on the white blur bar (icon
     invisible — pre-existing; same GP-stock-button leakage family as the
     mega-toggle dark square). Force ink + transparent across states. */
  nav.main-navigation button.menu-toggle,
  nav.main-navigation button.menu-toggle:hover,
  nav.main-navigation button.menu-toggle:focus,
  nav.main-navigation button.menu-toggle:active{
    background:transparent!important;color:#554E3B!important;box-shadow:none;}
  nav.main-navigation button.menu-toggle:hover{color:var(--uj-primary)!important;}
  nav.main-navigation button.menu-toggle:focus-visible{outline:2px solid var(--uj-primary);outline-offset:-2px;border-radius:8px;}
  /* GP slide-out panel: old nav colors leaked (black current-item row, white
     text). Calm skin — white panel, ink items, tint+navy hover/current.
     !important = beats GP's dynamic inline nav-color CSS (documented bridge;
     nav colors otherwise live in Customizer settings we don't touch). */
  nav.main-navigation .main-nav > ul{background:#fff;}
  nav.main-navigation .main-nav ul li a{
    color:var(--uj-hero-ink)!important;background:transparent!important;
    font-size:16px;line-height:52px;padding:0 6px;}
  nav.main-navigation .main-nav ul li a:hover,
  nav.main-navigation .main-nav ul li.sfHover > a,
  nav.main-navigation .main-nav ul li[class*="current-menu"] > a{
    color:var(--uj-primary)!important;background:var(--uj-tint)!important;}
  nav.main-navigation .main-nav ul ul li a{font-size:15px;line-height:44px;}
}

@media(max-width:768px){
  /* one shared 20px inset: nav, band, content (native), footer, copyright */
  nav.main-navigation .inside-navigation{
    padding-left:20px!important;padding-right:20px!important; /* beats the desktop spine !important */
  }
  .uj-article-band .uj-band-inner{padding-left:20px;padding-right:20px;padding-top:22px;}
  .footer-widgets .inside-footer-widgets{padding-left:20px;padding-right:20px;}
  .site-info .inside-site-info{padding:18px 20px;}
  /* jump list: full column card (TOC+ display:table shrink-wrapped to 256px;
     plugin ships div#toc_container width rules — out-specify with the
     .entry-content ancestor). Still capped at the measure so it never
     exceeds the text column at 641–768. */
  .entry-content #toc_container,
  div#toc_container{display:block;width:100%!important;max-width:var(--uj-measure);box-sizing:border-box;}
  /* tables scroll inside their own box instead of stretching the viewport
     (this fixture set fits, but 42 posts have tables — guard them all) */
  .entry-content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  /* archive page title: 36px is desktop-scaled */
  .archive .page-header h1{font-size:30px;}
  /* footer links: readable stays 15px, add tap padding (was 18px line pitch) */
  .footer-widgets ul li a{display:inline-block;padding:5px 0;}
  .footer-widgets ul li{margin-bottom:2px;}
  .site-info a{display:inline-block;padding:3px 0;}
  /* carried over from the first pass */
  .entry-meta-block{font-size:13.5px;}
  .footer-widgets{padding:36px 0 20px;}
  /* share icons: own flush-left row below the byline (matches big-media
     mobile). flex-basis:100% forces the wrap even at 600-768 where they'd
     otherwise trail the date mid-line; margin:0 kills the desktop auto-push.
     Spacing (Adrian 2026-07-06): 9px flex gap + 4px = 13 above; 16 below
     (desktop's 28px pad existed for circles overhanging the text line). */
  .uj-byline .uj-share{margin:4px 0 0;flex-basis:100%;justify-content:flex-start;}
  .uj-byline,.uj-article-band .uj-byline{padding-bottom:16px;}
}
/* Mediavine small-screen ad-width guarantee (ported #5): ≤359px viewports
   get 10px side padding so the content column stays ≥300px and 300px MV
   units fit (320 − 2×10 = 300). Styles GP's .inside-article, not Mediavine
   markup. Band/nav/footer follow to keep the shared inset consistent. */
@media(max-width:359px){
  .inside-article{padding-left:10px !important;padding-right:10px !important;}
  nav.main-navigation .inside-navigation{padding-left:10px!important;padding-right:10px!important;}
  .uj-article-band .uj-band-inner{padding-left:10px;padding-right:10px;}
  .footer-widgets .inside-footer-widgets{padding-left:10px;padding-right:10px;}
  .site-info .inside-site-info{padding:18px 10px;}
  .uj-recirc .uj-recirc-inner{padding:0 10px;}
}

/* ==================================================================
   SURFACE BUILDER 2026-07-03 — homepage, category hubs, expert
   directory, author profiles (spec: homepage-hub-proposal-2026-07-03)
   ================================================================== */

/* ---------- homepage shell: sections flow in one column; the front page's
   entry-content owns the 1280 width; measure caps don't apply here ---------- */
.home.page .entry-content p,
.home.page .entry-content h2,
.home.page .entry-content ul{max-width:none;}
.uj-home-sec{margin:0 0 54px;}
.uj-home-label{
  font-family:var(--uj-font-body);font-size:12px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--uj-primary);
  margin:0 0 18px;}
/* homepage reuses .uj-recirc for the rail card grids — neutralize the
   article-page inner wrapper (groupA cap + border-top h4) on home only */
.uj-home-sec .uj-recirc-inner{max-width:none;padding:0;}
.uj-home-sec.uj-recirc h4{border-top:0;padding-top:0;}
.uj-home-sec.uj-recirc .uj-rn-grid{margin-bottom:0;}

/* ---------- value band (full-bleed tint; html{overflow-x:clip} guards) ---------- */
.uj-home-hero{
  width:100vw;margin:0 0 46px calc(50% - 50vw);
  background:var(--uj-hero);}
.uj-home-hero-inner{max-width:var(--uj-container);margin:0 auto;padding:44px 30px 42px;}
.uj-home-hero h1{
  font-family:var(--uj-font-heading);font-weight:700;color:var(--uj-hero-ink);
  font-size:clamp(28px,3.2vw,40px);line-height:1.14;letter-spacing:-.015em;
  margin:0 0 12px;max-width:820px;text-wrap:pretty;}
.uj-home-hero .uj-home-sub{
  font-family:var(--uj-font-body);font-size:17.5px;line-height:1.55;
  color:var(--uj-muted);margin:0;max-width:720px;}

/* ---------- featured + trending split (Verywell pattern) ---------- */
.uj-home-split{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:44px;align-items:start;}
.uj-feat-card{display:block;text-decoration:none;color:var(--uj-ink);}
.uj-feat-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:14px;margin-bottom:14px;}
.uj-feat-card .uj-thumb{border-radius:14px;margin-bottom:14px;}
.uj-feat-title{
  display:block;font-family:var(--uj-font-heading);font-weight:700;
  font-size:29px;line-height:1.22;color:var(--uj-hero-ink);
  margin:2px 0 8px;transition:color .15s;}
.uj-feat-card:hover .uj-feat-title{color:var(--uj-accent-text);}
.uj-feat-dek{display:block;font-family:var(--uj-font-body);font-size:16.5px;line-height:1.55;color:var(--uj-muted);}
.uj-feat-card:focus-visible,.uj-trend-row:focus-visible{outline:2px solid var(--uj-primary);outline-offset:3px;border-radius:8px;}
.uj-trending .uj-trend-row{
  display:grid;grid-template-columns:104px minmax(0,1fr);gap:14px;align-items:center;
  padding:12px 0;border-bottom:1px solid var(--uj-hair);text-decoration:none;color:var(--uj-ink);}
.uj-trending .uj-trend-row:first-of-type{padding-top:0;}
.uj-trending .uj-trend-row:last-of-type{border-bottom:0;}
.uj-trend-row img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:8px;}
.uj-trend-row .uj-thumb{border-radius:8px;}
.uj-trend-title{display:block;font-family:var(--uj-font-heading);font-weight:700;font-size:16.5px;line-height:1.28;color:var(--uj-hero-ink);transition:color .15s;}
.uj-trend-row:hover .uj-trend-title{color:var(--uj-accent-text);}

/* ---------- topic rails: section head + 4-card row ---------- */
.uj-rail-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;
  border-top:1px solid var(--uj-hair);padding-top:24px;margin-bottom:20px;}
h2.uj-rail-title{font-size:24px;line-height:1.2;margin:0 0 4px;}
h2.uj-rail-title a{color:var(--uj-hero-ink);text-decoration:none;transition:color .15s;}
h2.uj-rail-title a:hover{color:var(--uj-accent-text);}
.uj-rail-desc{font-family:var(--uj-font-body);font-size:15.5px;line-height:1.5;color:var(--uj-muted);margin:0;}
.uj-rail-explore{
  font-family:var(--uj-font-body);font-size:14px;font-weight:700;
  color:var(--uj-primary);text-decoration:none;white-space:nowrap;padding-bottom:3px;}
.uj-rail-explore:hover{color:var(--uj-accent-text);}
/* the ONE amber element on the homepage (Books rail CTA; amber = action) */
.uj-rail-cta{
  font-family:var(--uj-font-body);font-size:14px;font-weight:700;
  background:var(--uj-cta);color:var(--uj-cta-ink);text-decoration:none;
  padding:9px 16px;border-radius:10px;white-space:nowrap;transition:background .15s;}
.uj-rail-cta:hover{background:var(--uj-cta-hover);color:var(--uj-cta-ink);}

/* ---------- trust strip (full-bleed tint band) ---------- */
.uj-home-trust{
  width:100vw;margin:64px 0 54px calc(50% - 50vw);
  background:var(--uj-tint);border-top:3px solid var(--uj-accent);}
.uj-home-trust-inner{max-width:var(--uj-container);margin:0 auto;padding:40px 30px 38px;}
.uj-trust-mission{
  font-family:var(--uj-font-heading);font-weight:700;font-size:22px;line-height:1.4;
  color:var(--uj-hero-ink);margin:0 0 26px;max-width:760px;}
.uj-trust-stats{display:flex;gap:56px;flex-wrap:wrap;margin:0 0 18px;}
.uj-trust-n{display:block;font-family:var(--uj-font-heading);font-weight:700;font-size:34px;line-height:1.1;color:var(--uj-primary);}
.uj-trust-l{display:block;font-family:var(--uj-font-body);font-size:14px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--uj-muted);margin-top:6px;}
.uj-trust-link{margin:0;font-family:var(--uj-font-body);font-size:15px;}
.uj-trust-link a{color:var(--uj-primary);font-weight:700;text-decoration:none;}
.uj-trust-link a:hover{color:var(--uj-accent-text);}

/* (homepage newsletter slot removed 2026-07-04 polish round T4: the ONE
   capture surface is the sidebar; the .uj-home-news block was deleted from
   the front page content) */

/* ---------- category hub layer ---------- */
.uj-crumbs{font-family:var(--uj-font-body);font-size:13px;color:var(--uj-muted);margin:0 0 14px;}
.uj-crumbs a{color:var(--uj-muted);text-decoration:none;}
.uj-crumbs a:hover{color:var(--uj-primary);}
.uj-crumbs [aria-current]{color:var(--uj-ink);font-weight:600;}
.uj-crumb-sep{margin:0 8px;opacity:.5;}
.uj-hub-chips{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 6px;}
.uj-chip{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--uj-font-body);font-size:14px;font-weight:600;color:var(--uj-primary);
  background:#fff;border:1px solid var(--uj-hair);border-radius:999px;
  padding:7px 15px;text-decoration:none;transition:background .15s,border-color .15s;}
/* hover pins TEXT too: without it GP's global a:hover light blue leaked
   into the label while border/bg went teal (Adrian caught it, 2026-07-05) */
.uj-chip:hover{background:var(--uj-tint);border-color:var(--uj-accent);color:var(--uj-accent-text);}
.uj-chip-n{font-size:11.5px;font-weight:700;color:var(--uj-muted);}
.uj-hub-pillars{margin:26px 0 8px;}
.uj-pillar-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.uj-pillar-card{
  display:grid;grid-template-columns:132px minmax(0,1fr);gap:14px;align-items:center;
  background:#fff;border:1px solid var(--uj-hair);border-radius:14px;padding:14px;
  text-decoration:none;color:var(--uj-ink);transition:box-shadow .18s,transform .18s;}
.uj-pillar-card:hover{box-shadow:0 14px 34px rgba(16,36,58,.10);transform:translateY(-2px);}
.uj-pillar-card:focus-visible{outline:2px solid var(--uj-primary);outline-offset:3px;border-radius:14px;}
.uj-pillar-card img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:9px;}
.uj-pillar-card .uj-thumb{border-radius:9px;}
.uj-pillar-title{display:block;font-family:var(--uj-font-heading);font-weight:700;font-size:16.5px;line-height:1.3;color:var(--uj-hero-ink);transition:color .15s;}
/* hub header rhythm: description reads as the editorial intro */
.archive .taxonomy-description{font-size:20px;line-height:1.6;margin:12px 0 0;max-width:none;}

/* ---------- author profile layer (card treatment, 2026-07-03 morning fixes) ----------
   The whole GP .page-header becomes the profile card: tint surface, avatar
   column left, eyebrow/name/chips/bio right. Chips = article count + social
   links from EXISTING user meta (inc/hubs.php §4). Degrades cleanly for
   no-bio authors (card = avatar + eyebrow + name + count chip). */
.archive.author .page-header{
  display:grid;grid-template-columns:112px minmax(0,1fr);column-gap:28px;
  align-items:start;
  background:var(--uj-tint);border:1px solid var(--uj-hair);border-radius:16px;
  padding:30px 32px 28px;margin:34px 0 24px;}
.uj-author-avatar{grid-column:1;grid-row:1 / span 4;margin:4px 0 0;}
.uj-author-avatar img{width:112px;height:112px;border-radius:50%;display:block;
  border:3px solid #fff;box-shadow:0 6px 18px rgba(16,59,99,.14);}
.archive.author .page-header .uj-archive-eyebrow,
.archive.author .page-header h1,
.archive.author .page-header .uj-archive-count,
.archive.author .page-header .uj-author-profile,
.archive.author .page-header .uj-author-topics,
.archive.author .page-header .uj-team-people,
.archive.author .page-header .uj-editorial-link{grid-column:2;}
/* our card avatar replaces ProfilePress's in-title 44px one */
.archive.author .page-header h1 img.avatar{display:none;}
.uj-author-profile{max-width:var(--uj-measure);margin:14px 0 0;}
.uj-author-meta{display:flex;flex-wrap:wrap;gap:8px;}
.uj-author-meta .uj-chip{background:#fff;}
.uj-author-meta .uj-chip-stat,.uj-author-meta .uj-chip-stat:hover{
  background:var(--uj-wash);border-color:transparent;color:var(--uj-hero-ink);cursor:default;}
.uj-author-bio{margin-top:16px;}
.uj-author-bio p{font-size:17px;line-height:1.6;color:var(--uj-ink);margin:0 0 10px;}
.uj-author-bio p:last-child{margin-bottom:0;}
.uj-author-bio a{color:var(--uj-primary);font-weight:600;
  text-decoration:underline;text-decoration-color:rgba(91,103,112,.45);
  text-decoration-thickness:2px;text-underline-offset:3px;}
.uj-author-bio a:hover{color:var(--uj-accent-text);text-decoration-color:var(--uj-accent-text);}
/* computed expertise chips + The Editors extras (eeat round 2026-07-03) */
.uj-author-topics{display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:14px 0 0;max-width:var(--uj-measure);}
.uj-topics-label{font:600 12.5px/1 var(--uj-font-body);letter-spacing:.08em;
  text-transform:uppercase;color:var(--uj-muted);}
.uj-author-topics .uj-chip{background:#fff;}
.uj-editorial-link{margin:16px 0 0;max-width:var(--uj-measure);}
.uj-editorial-link a{font:700 14px/1.4 var(--uj-font-body);color:var(--uj-primary);text-decoration:none;}
.uj-editorial-link a:hover{color:var(--uj-accent-text);}
/* team page: the people behind the team (2026-07-04, Adrian round) */
.uj-team-people{margin:22px 0 0;}
.uj-team-people .uj-topics-label{display:block;margin-bottom:12px;}
.uj-team-cards{display:flex;flex-wrap:wrap;gap:14px;}
.uj-team-card{display:flex;align-items:center;gap:14px;background:#fff;
  border:1px solid var(--uj-hair);border-radius:12px;padding:14px 22px 14px 14px;
  text-decoration:none;transition:border-color .15s,box-shadow .15s;}
.uj-team-card:hover{border-color:var(--uj-accent);box-shadow:0 2px 10px rgba(16,59,99,.10);}
.uj-team-card img{width:56px;height:56px;border-radius:50%;display:block;
  border:2px solid #fff;box-shadow:0 2px 8px rgba(16,59,99,.12);}
.uj-team-card-name{display:block;font-family:var(--uj-font-heading);font-weight:700;
  font-size:17px;line-height:1.25;color:var(--uj-primary);}
.uj-team-card:hover .uj-team-card-name{color:var(--uj-accent-text);}
.uj-team-card-role{display:block;font-size:13.5px;color:var(--uj-muted);margin-top:3px;}
@media(max-width:600px){
  .archive.author .page-header{grid-template-columns:1fr;column-gap:0;padding:22px 20px;}
  .archive.author .page-header .uj-archive-eyebrow,
  .archive.author .page-header h1,
  .archive.author .page-header .uj-archive-count,
  .archive.author .page-header .uj-author-profile,
  .archive.author .page-header .uj-author-topics,
  .archive.author .page-header .uj-team-people,
  .archive.author .page-header .uj-editorial-link{grid-column:1;}
  .uj-author-avatar{grid-column:1;grid-row:auto;margin:0 0 14px;}
  .uj-author-avatar img{width:84px;height:84px;}
}

/* ---------- archive end-cap + bottom breathing room (author + category) ---------- */
.uj-archive-endcap{border-top:1px solid var(--uj-hair);margin:30px 0 0;padding:22px 0 8px;text-align:center;}
.uj-archive-endcap span{font:600 12.5px/1.6 var(--uj-font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--uj-muted);}
body.archive .site-content,body.blog .site-content,body.search .site-content{padding-bottom:56px;}
@media(max-width:1319px){.uj-archive-endcap{margin-left:20px;margin-right:20px;}}
@media(max-width:768px){
  body.archive .site-content,body.blog .site-content,body.search .site-content{padding-bottom:40px;}
}

/* ---------- expert directory (/experts) ---------- */
.uj-expdir{margin-top:6px;}
/* section heads: writers block + quoted-experts grid (morning fixes 2026-07-03) */
.entry-content h2.uj-expdir-head{font-size:26px;line-height:1.25;margin:0 0 20px;max-width:none;}
/* Our writers & editors: byline-author cards above the quoted-experts grid */
.uj-writers{margin:2px 0 46px;}
ul.uj-writers-grid{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:14px;max-width:none;}
ul.uj-writers-grid li{margin:0;}
a.uj-writer-card{display:grid;grid-template-columns:52px minmax(0,1fr);
  column-gap:14px;row-gap:2px;align-items:center;
  background:#fff;border:1px solid var(--uj-hair);border-radius:12px;padding:12px 16px;
  text-decoration:none;color:var(--uj-ink);
  transition:box-shadow .18s,transform .18s;}
.uj-writer-card img{grid-row:1 / span 2;width:52px;height:52px;border-radius:50%;display:block;}
.uj-writer-name{font-family:var(--uj-font-heading);font-weight:700;font-size:16.5px;line-height:1.3;color:var(--uj-hero-ink);transition:color .15s;}
.uj-writer-count{font-family:var(--uj-font-body);font-size:12.5px;font-weight:600;color:var(--uj-muted);}
.uj-writer-card:hover{box-shadow:0 14px 34px rgba(16,36,58,.10);transform:translateY(-2px);}
.uj-writer-card:hover .uj-writer-name{color:var(--uj-accent-text);}
.uj-writer-card:focus-visible{outline:2px solid var(--uj-primary);outline-offset:3px;}
.uj-expdir-tools{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:6px 0 26px;}
.uj-expdir-q{
  font-family:var(--uj-font-body);font-size:16px;color:var(--uj-ink);
  background:#fff;border:1px solid var(--uj-hair);border-radius:12px;
  padding:11px 16px;width:min(420px,100%);}
.uj-expdir-q:focus{outline:2px solid var(--uj-primary);outline-offset:1px;}
.uj-expdir-count{font-family:var(--uj-font-body);font-size:14px;color:var(--uj-muted);}
/* visible methodology note (E-E-A-T, eeat round 2026-07-03) */
.entry-content p.uj-expdir-method{
  font-family:var(--uj-font-body);font-size:14.5px;line-height:1.55;color:var(--uj-muted);
  border-left:3px solid var(--uj-accent);padding-left:14px;margin:0 0 22px;max-width:none;}
/* sticky A-Z letter nav (eeat round 2026-07-03: 6,366 entries).
   top offset = GP sticky nav height (67px desktop / 57px mobile header),
   else the fading site nav covers the bar at top:0. */
.uj-az{position:sticky;top:66px;z-index:40;display:flex;flex-wrap:wrap;gap:2px;
  background:#fff;padding:10px 0;margin:0 0 4px;border-bottom:1px solid var(--uj-hair);}
@media(max-width:768px){
  .uj-az{top:56px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;}
}
.uj-az a{font-family:var(--uj-font-body);font-size:13px;font-weight:800;
  color:var(--uj-primary);text-decoration:none;padding:4px 9px;border-radius:8px;}
.uj-az a:hover{background:var(--uj-wash);}
.uj-az a.is-off{opacity:.3;pointer-events:none;}
.uj-expdir-letter{
  font-family:var(--uj-font-body);font-size:13px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--uj-accent-text);
  border-bottom:1px solid var(--uj-hair);padding-bottom:8px;margin:30px 0 16px;max-width:none;}
/* letter groups: only lay out what scrolls into view (6.4k chips) */
.uj-expdir-group{content-visibility:auto;contain-intrinsic-size:auto 1200px;scroll-margin-top:130px;}
@media(max-width:768px){.uj-expdir-group{scroll-margin-top:112px;}}
ul.uj-expdir-grid{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:14px;max-width:none;}
/* minimal chips: <li><a><b>name</b><i>credential</i><small>count</small></a></li> */
ul.uj-expdir-grid li{margin:0;}
ul.uj-expdir-grid li>a{
  display:flex;flex-direction:column;gap:3px;height:100%;
  background:#fff;border:1px solid var(--uj-hair);border-radius:12px;
  padding:14px 16px;text-decoration:none;transition:border-color .15s;}
ul.uj-expdir-grid li>a:hover{border-color:var(--uj-accent);}
ul.uj-expdir-grid li>a b{font-family:var(--uj-font-heading);font-weight:700;font-size:16.5px;line-height:1.3;color:var(--uj-hero-ink);}
ul.uj-expdir-grid li>a i{font-style:normal;font-family:var(--uj-font-body);font-size:13.5px;line-height:1.45;color:var(--uj-muted);}
ul.uj-expdir-grid li>a small{font-family:var(--uj-font-body);font-size:12.5px;font-weight:700;color:var(--uj-primary);margin-top:5px;}
ul.uj-expdir-grid li>a:hover small{color:var(--uj-accent-text);}
.uj-expdir-empty{font-family:var(--uj-font-body);color:var(--uj-muted);}

/* ---------- card links are CARDS, not body prose ----------
   On the homepage + /experts the shortcodes render inside entry-content, so
   the body-link underline/wash treatment leaked onto card titles (posts'
   recirc blocks render OUTSIDE entry-content and never hit this).
   .page prefix = (0,3,1), ties the body rule, later source wins. */
.page .entry-content a.uj-rn-card,
.page .entry-content a.uj-feat-card,
.page .entry-content a.uj-trend-row,
.page .entry-content a.uj-rail-explore,
.page .entry-content a.uj-rail-cta,
.page .entry-content h2.uj-rail-title a,
.page .entry-content .uj-trust-link a,
.page .entry-content a.uj-writer-card,
.page .entry-content .uj-expdir-grid a,
.page .entry-content .uj-az a{
  text-decoration:none;background:transparent;}
.page .entry-content a.uj-rn-card:hover,
.page .entry-content a.uj-feat-card:hover,
.page .entry-content a.uj-trend-row:hover,
.page .entry-content a.uj-writer-card:hover{
  background:transparent;color:inherit;}
.page .entry-content a.uj-rail-explore:hover,
.page .entry-content .uj-trust-link a:hover,
.page .entry-content h2.uj-rail-title a:hover{
  background:transparent;color:var(--uj-accent-text);}
/* expert chips + letter nav keep their own hover language (chip = border,
   az = wash pill), not the body-link wash */
.page .entry-content .uj-expdir-grid a:hover{background:#fff;color:inherit;}
.page .entry-content .uj-az a:hover{background:var(--uj-wash);color:var(--uj-primary);}
.page .entry-content a.uj-rail-cta:hover{background:var(--uj-cta-hover);color:var(--uj-cta-ink);}
.page .entry-content a.uj-rail-explore,
.page .entry-content .uj-trust-link a,
.page .entry-content .uj-az a{color:var(--uj-primary);}
.page .entry-content a.uj-rail-cta{color:var(--uj-cta-ink);background:var(--uj-cta);}
/* Popular strip: same section separator rhythm as the rails */
.uj-home-popular .uj-recirc-inner{border-top:1px solid var(--uj-hair);padding-top:24px;}
/* homepage spine: GP's .inside-article pads 25px on pages — nav/bands sit on
   the 30px inset (x=110 at 1440, measured). Align the in-flow sections. */
@media(min-width:769px){
  .home.page .inside-article{padding-left:30px;padding-right:30px;}
}

/* ---------- responsive: 768 / 600 / 390 ---------- */
@media(max-width:1024px){
  .uj-home-split{grid-template-columns:1fr;gap:36px;}
  .uj-pillar-row{grid-template-columns:1fr 1fr;}
  ul.uj-expdir-grid{grid-template-columns:1fr 1fr;}
  ul.uj-writers-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:768px){
  .uj-home-hero{margin-bottom:34px;}
  .uj-home-hero-inner{padding:30px 20px 28px;}
  .uj-home-sec{margin-bottom:40px;}
  .uj-feat-title{font-size:23px;}
  .uj-rail-head{align-items:flex-start;flex-direction:column;gap:6px;padding-top:20px;}
  .uj-home-trust-inner{padding:30px 20px 28px;}
  .uj-trust-stats{gap:28px;}
  .uj-trust-n{font-size:28px;}
  .uj-trust-mission{font-size:19px;}
}
@media(max-width:600px){
  .uj-pillar-row{grid-template-columns:1fr;gap:12px;}
  .uj-pillar-card{grid-template-columns:104px minmax(0,1fr);padding:10px;}
  ul.uj-expdir-grid{grid-template-columns:1fr;}
  ul.uj-writers-grid{grid-template-columns:1fr;}
  /* homepage rails inherit the compact-row collapse from .uj-recirc; the
     trending list is already rows. Feature card stays a big card. */
  .uj-trend-title{font-size:16px;}
  h2.uj-rail-title{font-size:21px;}
}

/* ==================================================================
   CARD HOVER SYSTEM — unified 2026-07-03 (morning fixes, Adrian)
   ONE perceptible treatment on every card surface: thumbnail zoom
   (scale 1.04, 320ms) + title shift to the text-safe teal (visible
   against the navy resting state — the old navy-on-navy shift was
   invisible) + the existing subtle lift stays on bordered card shells.
   .uj-thumb = overflow-clip wrapper rendered by the PHP card helpers
   (functions.php uj_recirc_card, inc/home.php feature/trending,
   inc/hubs.php pillars); the wrapper carries the img's old radius +
   margin geometry (per-surface rules above), the img goes cornerless
   and marginless inside (the two rules below out-cascade the earlier
   per-surface img rules by source order). Archive/blog/search cards
   reuse GP's .post-image > a as the clip wrapper — no PHP change.
   ================================================================== */
.uj-thumb{display:block;overflow:hidden;line-height:0;}
.uj-thumb img{margin:0;border-radius:0;display:block;}
.archive .post-image a,.blog .post-image a,.search .post-image a{overflow:hidden;}
/* the zoom */
.uj-thumb img,
.archive .post-image img,.blog .post-image img,.search .post-image img{
  transition:transform .32s ease;}
.uj-rn-card:hover .uj-thumb img,.uj-rn-card:focus-visible .uj-thumb img,
.uj-feat-card:hover .uj-thumb img,.uj-feat-card:focus-visible .uj-thumb img,
.uj-trend-row:hover .uj-thumb img,.uj-trend-row:focus-visible .uj-thumb img,
.uj-pillar-card:hover .uj-thumb img,.uj-pillar-card:focus-visible .uj-thumb img,
.archive article.generate-columns .inside-article:hover .post-image img,
.blog article.generate-columns .inside-article:hover .post-image img,
.search article.generate-columns .inside-article:hover .post-image img{
  transform:scale(1.04);}
/* title shift fires from anywhere on the card (surfaces whose hover rules
   predate the system are already teal via their own rules above) */
.uj-pillar-card:hover .uj-pillar-title,.uj-pillar-card:focus-visible .uj-pillar-title,
.uj-rn-card:focus-visible .uj-rn-title,
.uj-feat-card:focus-visible .uj-feat-title,
.uj-trend-row:focus-visible .uj-trend-title,
.archive article.generate-columns .inside-article:hover .entry-title a,
.blog article.generate-columns .inside-article:hover .entry-title a,
.search article.generate-columns .inside-article:hover .entry-title a{
  color:var(--uj-accent-text);}
/* expert chips: whisper acknowledgement lives on ul.uj-expdir-grid li>a:hover */
/* mobile geometry: the wrapper takes over the img's old grid placement */
@media(max-width:600px){
  .uj-rn-card .uj-thumb{grid-row:1 / span 2;border-radius:8px;margin:0;}
  .archive .post-image a,.blog .post-image a,.search .post-image a{border-radius:8px;}
}
/* reduced motion: keep the color shift, drop the transforms */
@media(prefers-reduced-motion:reduce){
  .uj-thumb img,
  .archive .post-image img,.blog .post-image img,.search .post-image img{
    transition:none;transform:none!important;}
  .archive article.generate-columns .inside-article:hover,
  .blog article.generate-columns .inside-article:hover,
  .search article.generate-columns .inside-article:hover,
  .uj-pillar-card:hover,.uj-writer-card:hover{transform:none;}
}

/* (UJ newsletter box + ConvertBox skin REMOVED for EL — Adrian 2026-07-06:
   NO newsletter on Enlightio, no ConvertBox.) */

/* ---------- EL sidebar: "Popular on Enlightio" (renders ABOVE the widget
   area, so the Mediavine sticky unit always lands below it) ---------- */
.uj-sidepop{
  background:var(--uj-tint);border-radius:12px;
  padding:20px 22px 16px;margin:0 0 28px;
  font-family:var(--uj-font-body);
}
.uj-sidepop-title{
  font-family:var(--uj-font-body);font-size:12px;font-weight:800;line-height:1;
  letter-spacing:.14em;text-transform:uppercase;color:var(--uj-primary);
  border-bottom:1px solid var(--uj-hair);padding-bottom:12px;margin:0 0 12px;
}
.uj-sidepop ol{list-style:none;counter-reset:sidepop;margin:0;padding:0;}
.uj-sidepop li{
  counter-increment:sidepop;
  display:flex;gap:12px;align-items:baseline;
  padding:8px 0;margin:0;
}
.uj-sidepop li+li{border-top:1px solid var(--uj-hair);}
.uj-sidepop li::before{
  content:counter(sidepop);
  font-weight:800;font-size:14px;color:var(--uj-accent-text);
  flex:0 0 14px;
}
.uj-sidepop a{
  color:var(--uj-ink);text-decoration:none;font-weight:600;
  font-size:14.5px;line-height:1.4;
}
.uj-sidepop a:hover{color:var(--uj-primary);}

/* sidebar Pinterest-follow block (kept widget): quiet card frame */
#right-sidebar .widget_block .wp-block-social-links{margin-top:6px;}

/* ==================================================================
   POLISH ROUND 2026-07-04 (Adrian live review with the team)
   ================================================================== */

/* ---------- T2: homepage value band = full-bleed tint + primary H1 ---------- */
.uj-home-hero{background:var(--uj-tint);}
.uj-home-hero h1{color:var(--uj-primary);}
/* ---------- mobile nav accordion (2026-07-05, big-media pattern) ----------
   The slide-down mobile menu rendered ALL 50+ links expanded. Collapse
   sub-menus until the arrow is tapped; GP's menu JS supplies the contract
   (adds .toggled-on to the sub-menu, .sfHover/aria-expanded to the parent).
   Also neutralize the desktop dropdown skin (card border/shadow/240px). */
@media(max-width:1025px){
  .main-navigation .main-nav ul ul{
    display:none;box-shadow:none;border:0;border-radius:0;width:100%;padding:0 0 6px;}
  .main-navigation .main-nav ul ul.toggled-on{display:block;}
  .main-navigation .main-nav ul ul li a{padding:9px 20px 9px 34px;font-weight:500;}
  .main-navigation .main-nav > ul > li > a{font-weight:700;}
}

/* mobile hero (type audit 2026-07-05): rendered 40px at 390w = 7-line wrap.
   Lives HERE, after the base .uj-home-hero h1 rule — an earlier media block
   loses the same-specificity cascade to it (caught live). */
@media(max-width:600px){
  /* .page .entry-content h1 (40px, specificity 0-2-1) wins over
     .uj-home-hero h1 — the hero lives inside the page's entry-content */
  .page .entry-content .uj-home-hero h1,
  .uj-home-hero h1{font-size:30px;line-height:1.2;}
  .uj-home-hero .uj-home-sub{font-size:16.5px;}
}

/* ---------- T4: trust strip centered + rating stars (amber, decorative) ---------- */
.uj-home-trust-inner{text-align:center;}
.uj-trust-mission{margin-left:auto;margin-right:auto;}
.uj-trust-stats{justify-content:center;}
.uj-trust-stars{display:block;line-height:1;color:var(--uj-cta);margin:7px 0 0;}
.uj-trust-stars svg{width:19px;height:19px;vertical-align:middle;margin:0 1px;}

/* ---------- T7: post top gap — byline hairline to first content element.
   Was GP's 40px .inside-article padding-top + 40px .entry-content margin-top
   = 80px (measured 2026-07-04); professional target ~30px. The books-post
   affiliate-disclosure line (hooked into .entry-header) keeps the same 30px
   rhythm above and its own 30px paragraph margin below. */
.single-post .content-area .inside-article{padding-top:30px;}
.single-post .entry-content{margin-top:0;}

/* ---------- T8: end-of-article author box — 72px avatar, enforced against
   plugin (ProfilePress) sizing; rebalanced padding ---------- */
.uj-authorbox{align-items:flex-start;padding:26px 28px;gap:20px;}
.uj-authorbox-avatar{flex:0 0 72px;}
.uj-authorbox-avatar img{width:72px!important;height:72px!important;max-width:none;display:block;}
@media(max-width:600px){
  .uj-authorbox{padding:20px;gap:16px;}
  .uj-authorbox-avatar{flex-basis:56px;}
  .uj-authorbox-avatar img{width:56px!important;height:56px!important;}
}

/* ---------- T9: pick/summary boxes (tint .key / .highlight groups): linked
   book titles inside the box get the standard body underline treatment so
   underline = link and the plain labels ("Best Overall:") stay plain.
   Heading-level affiliate links OUTSIDE boxes keep the theme heading rules.
   Specificity (0,4,2) beats the heading exemption's (0,3,2). */
.entry-content .key h2 a:not(.lasso-button):not(.wp-block-button__link),
.entry-content .key h3 a:not(.lasso-button):not(.wp-block-button__link),
.entry-content .highlight h2 a:not(.lasso-button):not(.wp-block-button__link),
.entry-content .highlight h3 a:not(.lasso-button):not(.wp-block-button__link){
  color:var(--uj-ink);
  text-decoration:underline;
  text-decoration-color:rgba(91,103,112,.45);
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}
.entry-content .key h2 a:not(.lasso-button):not(.wp-block-button__link):hover,
.entry-content .key h3 a:not(.lasso-button):not(.wp-block-button__link):hover,
.entry-content .highlight h2 a:not(.lasso-button):not(.wp-block-button__link):hover,
.entry-content .highlight h3 a:not(.lasso-button):not(.wp-block-button__link):hover{
  color:var(--uj-primary);
  text-decoration-color:var(--uj-primary);
  background:var(--uj-wash);
}

/* ---------- T10: static pages get the post reading geometry (grid A):
   640 measure + 96 gap + 300 sidebar, group centered. Scoped to pages WITH
   a sidebar; no-sidebar pages (home, /experts) keep their wide layouts. */
@media(min-width:1100px){
  .page.right-sidebar .site-content{
    display:flex;
    max-width:var(--uj-groupA);
    margin:0 auto;
    padding:0;
    gap:var(--uj-gap-a);
  }
  .page.right-sidebar .site-content .content-area{
    width:auto;flex:0 0 var(--uj-measure);float:none;
  }
  .page.right-sidebar .content-area .inside-article{
    padding-left:0;padding-right:0;
  }
  .page.right-sidebar .site-content #right-sidebar{
    width:var(--uj-adcol);flex:0 0 var(--uj-adcol);float:none;
  }
}

/* ============ AFFILIATE PARTNER BOX (Phase 0 pilot 2026-07-06) ============ */
/* (EL fix vs UJ source: --uj-border/--uj-font-display/--uj-headline were
   UNDEFINED vars in the UJ theme — title silently fell back to body font +
   inherited color. Mapped to the real tokens here.) */
.uj-aff{background:var(--uj-tint);border:1px solid var(--uj-hair);border-top:3px solid var(--uj-accent);
  border-radius:12px;padding:22px 26px 18px;margin:30px 0;max-width:var(--uj-measure);}
.uj-aff-kicker{font:700 11px var(--uj-font-body);letter-spacing:.14em;text-transform:uppercase;
  color:var(--uj-accent-text);margin:0 0 6px;}
.uj-aff-title{font-family:var(--uj-font-heading);font-size:21px;font-weight:700;line-height:1.3;
  color:var(--uj-head);margin:0 0 8px;}
.uj-aff-body{font-size:17px;line-height:1.55;margin:0 0 14px;}
.uj-aff-btn{margin:0 0 12px;}
.entry-content .uj-aff-btn a,.uj-aff-btn a{display:inline-block;background:var(--uj-cta);color:var(--uj-cta-ink)!important;
  font:600 15.5px var(--uj-font-body);padding:11px 22px;border-radius:9px;
  text-decoration:none!important;border-bottom:none!important;}
.entry-content .uj-aff-btn a:hover,.uj-aff-btn a:hover{background:var(--uj-cta-hover);color:var(--uj-cta-ink)!important;}
.uj-aff-disclosure{font-size:12.5px;line-height:1.5;color:var(--uj-muted);margin:0;}
/* dual-CTA (amazonbooks): second button = quiet outline */
.uj-aff-btn{display:flex;flex-wrap:wrap;gap:10px;}
.entry-content .uj-aff-btn a:nth-child(2),.uj-aff-btn a:nth-child(2){background:#fff;
  border:1px solid var(--uj-hair);color:var(--uj-primary)!important;}
.entry-content .uj-aff-btn a:nth-child(2):hover,.uj-aff-btn a:nth-child(2):hover{background:var(--uj-tint);color:var(--uj-primary)!important;}
@media(max-width:768px){.uj-aff{padding:18px 18px 14px;}.uj-aff-title{font-size:19px;}}