/*
Theme Name: TPHI Editorial
Theme URI: https://www.tphinstitute.org/
Author: Thrive Precision Health Institute
Author URI: https://www.tphinstitute.org/
Description: Bold Editorial block theme for the Thrive Precision Health Institute. Full-bleed deep-navy hero, oversized Crimson Text serif display headlines, numbered eyebrow labels, a numbered 01-04 programs index on dark, alternating cream/navy bands, hairline borders, and an ink footer. Built for WordPress 6.x full site editing.
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
Version: 1.1.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tphi-editorial
Tags: block-patterns, block-styles, full-site-editing, one-column, custom-colors, custom-menu, editor-style, featured-images, wide-blocks
*/

/* ============================================================
   TPHI EDITORIAL - Bold Editorial design language (Option C)
   Palette: Research Navy #003366 | Trust Bone White #f6f2ee
            Wellness Lapis Lazuli #005c95 | Innovation Cerulean #3e8bc8
            Derived deep hero navy #0b2a3d
   ============================================================ */
:root{
  --tphi-navy:#003366;          /* Research Navy */
  --tphi-blue:#005c95;          /* Wellness Lapis Lazuli - primary interactive blue */
  --tphi-blue-hover:#004a78;
  --tphi-cerulean:#3e8bc8;      /* Innovation Cerulean - focus/accent */
  --tphi-deep:#0b2a3d;          /* derived deep editorial navy */
  --tphi-deeper:#071d2b;
  --tphi-paper:#f6f2ee;         /* Trust Bone White */
  --tphi-white:#ffffff;
  --tphi-ink:#1a1b1f;
  --tphi-slate-ink:#4d5b68;     /* AA-safe muted text on paper/white */
  --tphi-cloud:#eef4f8;         /* light text on deep */
  --tphi-mist:#b9cbd7;          /* muted text on deep */
  --tphi-sky:#8ec4e6;           /* accent text on deep */
  --tphi-hairline-light:rgba(26,27,31,.16);
  --tphi-hairline-dark:rgba(238,244,248,.18);
  --tphi-serif:"Crimson Text", Georgia, "Times New Roman", serif;
  --tphi-sans:"Palanquin", "Helvetica Neue", Arial, sans-serif;
  --tphi-container:1240px;
  --tphi-gutter:clamp(20px, 4.5vw, 64px);
}

html{ -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: no-preference){
  html{ scroll-behavior:smooth; }
}
body{
  font-family:var(--tphi-sans);
  font-weight:400;
  font-size:1.0625rem;
  line-height:1.7;
  color:var(--tphi-ink);
  background:var(--tphi-paper);
  overflow-x:clip;
  margin:0;
}
img{ max-width:100%; height:auto; }
figure{ margin:0; }
a{ color:var(--tphi-blue); }

/* Focus - visible everywhere, on light and dark */
:focus-visible{
  outline:2px solid var(--tphi-cerulean);
  outline-offset:3px;
  border-radius:2px;
}
.on-dark :focus-visible, .on-blue :focus-visible{
  outline-color:var(--tphi-sky);
}

/* Skip link (core prints one for block themes; style ours + core's) */
.skip-link,
.skip-link.screen-reader-text{
  position:absolute; left:-9999px; top:0;
  background:var(--tphi-ink); color:var(--tphi-paper);
  padding:.75rem 1.25rem; z-index:200;
  font-weight:600; text-decoration:none;
  clip:auto; -webkit-clip-path:none; clip-path:none;
  width:auto; height:auto;
}
.skip-link:focus,
.skip-link.screen-reader-text:focus{ left:0; }

.tphi-container{
  max-width:var(--tphi-container);
  margin-inline:auto;
  padding-inline:var(--tphi-gutter);
}

/* ============ Type ============ */
h1,h2,h3{ font-family:var(--tphi-serif); font-weight:600; line-height:1.12; letter-spacing:-.01em; margin:0; }
h4,h5,h6{ font-family:var(--tphi-serif); font-weight:600; line-height:1.2; margin:0; }
p{ margin:0; }
.display-xl{ font-size:clamp(2.35rem, 5.6vw, 4.75rem); }
.display-lg{ font-size:clamp(1.95rem, 3.9vw, 3.4rem); }
.display-md{ font-size:clamp(1.45rem, 2.4vw, 2.05rem); }

/* Oversized eyebrow / section label */
.eyebrow{
  display:flex; align-items:baseline; gap:1.1rem;
  margin-bottom:clamp(1.75rem, 3.5vw, 3rem);
}
.eyebrow .num{
  font-family:var(--tphi-serif); font-style:italic; font-weight:600;
  font-size:clamp(1.4rem, 2.2vw, 1.9rem);
  color:var(--tphi-blue); line-height:1;
}
.eyebrow .label{
  font-size:clamp(.78rem, 1vw, .9rem);
  font-weight:600; text-transform:uppercase; letter-spacing:.24em;
  color:var(--tphi-ink);
}
.eyebrow::after{
  content:""; flex:1 1 3rem; height:1px;
  background:var(--tphi-hairline-light); transform:translateY(-.35em);
}
.on-dark .eyebrow .num, .on-blue .eyebrow .num{ color:var(--tphi-sky); }
.on-dark .eyebrow .label, .on-blue .eyebrow .label{ color:var(--tphi-cloud); }
.on-dark .eyebrow::after, .on-blue .eyebrow::after{ background:var(--tphi-hairline-dark); }

/* Text links, editorial arrow style */
.text-link{
  display:inline-flex; align-items:center; gap:.55rem;
  font-weight:600; font-size:.95rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--tphi-blue); text-decoration:none;
  padding-bottom:.2rem; border-bottom:1px solid currentColor;
}
.text-link .arr{ transition:transform .2s ease; }
.text-link:hover .arr{ transform:translateX(4px); }
.on-dark .text-link{ color:var(--tphi-sky); }
.on-blue .text-link{ color:var(--tphi-white); }

/* Buttons - shared with the verbatim Authorize.net form submit */
.btn,
.button-primary,
.wp-block-button__link{
  display:inline-block; font-family:var(--tphi-sans); font-weight:600;
  font-size:1rem; letter-spacing:.04em; line-height:1.7;
  padding:.85rem 2rem; text-decoration:none; text-align:center;
  border:1px solid transparent; border-radius:0; cursor:pointer;
  transition:background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn-solid,
.button-primary,
.wp-block-button__link{ background:var(--tphi-blue); color:var(--tphi-white); }
.btn-solid:hover,
.button-primary:hover,
.wp-block-button__link:hover{ background:var(--tphi-blue-hover); color:var(--tphi-white); }
.btn-ghost-light{ background:transparent; color:var(--tphi-cloud); border-color:rgba(238,244,248,.55); }
.btn-ghost-light:hover{ background:rgba(238,244,248,.12); border-color:var(--tphi-cloud); }
.btn-paper,
.on-blue .button-primary{ background:var(--tphi-paper); color:var(--tphi-blue); }
.btn-paper:hover,
.on-blue .button-primary:hover{ background:var(--tphi-white); color:var(--tphi-blue-hover); }

/* Verbatim Authorize.net donate form wrapper */
.donate-form form{ display:inline-block; margin:0; }

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position:sticky; top:0; z-index:100;
  background:var(--tphi-paper);
  border-bottom:1px solid var(--tphi-hairline-light);
}
.header-bar{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; min-height:76px; flex-wrap:wrap;
  padding-block:.5rem;
}
.brand{ display:flex; align-items:center; text-decoration:none; }
.brand img{ height:48px; width:auto; }
.header-nav{ display:flex; align-items:center; gap:clamp(1rem, 1.8vw, 1.9rem); }

.site-header .wp-block-navigation a{
  font-size:.95rem; font-weight:500; letter-spacing:.02em;
  color:var(--tphi-ink); text-decoration:none;
  padding:.35rem 0; border-bottom:2px solid transparent;
}
.site-header .wp-block-navigation a:hover{ color:var(--tphi-blue); border-bottom-color:var(--tphi-blue); }
.site-header .wp-block-navigation .current-menu-item > a{ color:var(--tphi-blue); border-bottom-color:var(--tphi-blue); }
.site-header .wp-block-navigation__responsive-container.is-menu-open{
  background:var(--tphi-paper); padding:2rem var(--tphi-gutter);
}
.site-header .wp-block-navigation__responsive-container.is-menu-open a{
  font-family:var(--tphi-serif); font-size:1.5rem; font-weight:600; border-bottom:0;
}
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close{ color:var(--tphi-ink); }
.header-donate .button-primary{ padding:.6rem 1.5rem; }

/* ============================================================
   HERO (front page)
   ============================================================ */
.hero{
  position:relative; isolation:isolate;
  background:var(--tphi-deep);
  color:var(--tphi-cloud);
  display:flex; flex-direction:column; justify-content:flex-end;
  min-height:min(92vh, 860px);
}
.hero .hero-bg{
  position:absolute; inset:0; z-index:-2;
  background-size:cover; background-position:center 30%;
  filter:grayscale(65%);
  opacity:.26;
}
.hero::after{
  content:"";
  position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg, rgba(7,29,43,.35) 0%, rgba(7,29,43,.05) 45%, rgba(7,29,43,.75) 100%);
}
.hero-inner{
  padding-top:clamp(5rem, 12vh, 9rem);
  padding-bottom:clamp(2.5rem, 5vh, 4rem);
}
.hero-kicker{
  font-size:clamp(.78rem, 1vw, .9rem); font-weight:600;
  text-transform:uppercase; letter-spacing:.28em;
  color:var(--tphi-sky);
  display:flex; align-items:center; gap:1.1rem;
  margin-bottom:clamp(1.25rem, 2.5vh, 2rem);
}
.hero-kicker::before{ content:""; width:3rem; height:1px; background:var(--tphi-sky); }
.hero h1{
  color:var(--tphi-white);
  max-width:26ch;
  margin-bottom:clamp(1.75rem, 4vh, 2.75rem);
}
.hero-actions{ display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:clamp(3rem, 8vh, 5.5rem); }

/* In-hero contents index */
.hero-index{
  border-top:1px solid var(--tphi-hairline-dark);
  padding-top:1.4rem;
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  gap:1rem;
}
.hero-index a{
  display:flex; align-items:baseline; gap:.6rem;
  color:var(--tphi-mist); text-decoration:none;
  font-size:.9rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase;
}
.hero-index a:hover{ color:var(--tphi-white); }
.hero-index .ix{
  font-family:var(--tphi-serif); font-style:italic; color:var(--tphi-sky); font-size:1.05rem;
}
@media (max-width: 640px){
  .hero-index{ grid-template-columns:repeat(2, minmax(0,1fr)); row-gap:.9rem; }
}

/* ============================================================
   SECTION SHELLS
   ============================================================ */
.section{ padding-block:clamp(4rem, 9vw, 7.5rem); }
.on-dark{ background:var(--tphi-deep); color:var(--tphi-cloud); }
.on-dark h2, .on-dark h3{ color:var(--tphi-white); }
.on-white{ background:var(--tphi-white); }
.on-blue{ background:var(--tphi-blue); color:var(--tphi-white); }
.on-blue h2, .on-blue h3{ color:var(--tphi-white); }

/* ============================================================
   MISSION
   ============================================================ */
.mission-grid{
  display:grid; grid-template-columns:minmax(0, 7fr) minmax(0, 5fr);
  gap:clamp(2rem, 5vw, 5rem);
  align-items:start;
}
.mission-copy h2{ max-width:18ch; margin-bottom:clamp(1.5rem, 3vw, 2.25rem); }
.mission-copy .lede{
  font-size:clamp(1.1rem, 1.5vw, 1.25rem);
  color:var(--tphi-slate-ink);
  margin-bottom:1.5rem;
  max-width:58ch;
}
.mission-note{
  border-top:1px solid var(--tphi-hairline-light);
  padding-top:1.25rem; margin-top:.5rem; margin-bottom:2rem;
  font-size:.92rem; color:var(--tphi-slate-ink); max-width:52ch;
}
.mission-media figure{ position:relative; margin:0; }
.mission-media img{ width:100%; object-fit:cover; display:block; }
.mission-media figcaption{
  margin-top:.8rem; font-size:.85rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--tphi-slate-ink);
  display:flex; gap:.75rem; align-items:baseline;
}
.mission-media figcaption::before{ content:""; width:2rem; height:1px; background:var(--tphi-blue); transform:translateY(-.25em); }
@media (max-width: 860px){
  .mission-grid{ grid-template-columns:1fr; }
  .mission-media{ order:2; }
}

/* Pull quote band */
.pullquote{
  border-top:1px solid var(--tphi-hairline-light);
  margin-top:clamp(3rem, 6vw, 5rem);
  padding-top:clamp(2.5rem, 5vw, 4rem);
  text-align:center;
}
.pullquote blockquote{ margin:0; border:0; padding:0; }
.pullquote blockquote p{
  font-family:var(--tphi-serif); font-style:italic; font-weight:600;
  font-size:clamp(1.7rem, 3.6vw, 3rem);
  line-height:1.25; color:var(--tphi-blue);
  max-width:24ch; margin-inline:auto;
}
.pullquote .q-rule{
  width:3.5rem; height:1px; background:var(--tphi-blue);
  margin:1.75rem auto 0;
}

/* ============================================================
   PROGRAMS - numbered index 01-04
   ============================================================ */
.programs-head{
  display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between;
  gap:1.5rem; margin-bottom:clamp(2.5rem, 5vw, 4rem);
}
.programs-head h2{ max-width:16ch; }
.programs-head .standfirst{
  color:var(--tphi-mist); max-width:34ch; font-size:1.05rem;
  border-left:1px solid var(--tphi-hairline-dark); padding-left:1.5rem;
}
.program-list{ border-top:1px solid var(--tphi-hairline-dark); }
.program-row{
  display:grid;
  grid-template-columns:minmax(70px, 130px) minmax(0, 1fr) auto;
  gap:clamp(1rem, 3vw, 3rem);
  align-items:start;
  padding-block:clamp(1.75rem, 3.5vw, 2.75rem);
  border-bottom:1px solid var(--tphi-hairline-dark);
  text-decoration:none;
  transition:background-color .2s ease;
}
.program-row:hover{ background:rgba(238,244,248,.05); }
.program-row .p-num{
  font-family:var(--tphi-serif); font-weight:600; font-style:italic;
  font-size:clamp(2.2rem, 4.5vw, 3.8rem); line-height:1;
  color:var(--tphi-sky);
}
.program-row .p-name{
  font-family:var(--tphi-serif); font-weight:600;
  font-size:clamp(1.5rem, 2.8vw, 2.3rem); line-height:1.15;
  color:var(--tphi-white); margin-bottom:.45rem;
}
.program-row .p-tag{
  display:block;
  font-size:.85rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--tphi-sky); margin-bottom:.8rem;
}
.program-row .p-desc{ display:block; color:var(--tphi-mist); max-width:64ch; font-size:.98rem; }
.program-row .p-arrow{
  font-family:var(--tphi-serif); font-size:1.8rem; line-height:1;
  color:var(--tphi-sky); align-self:center;
  transition:transform .2s ease;
}
.program-row:hover .p-arrow{ transform:translateX(6px); }
.program-row:hover .p-name{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:6px; }
@media (max-width: 640px){
  .program-row{ grid-template-columns:minmax(0,1fr) auto; }
  .program-row .p-num{ grid-column:1 / -1; font-size:1.9rem; }
}

/* ============================================================
   FOCUS - three editorial columns
   ============================================================ */
.focus-cols{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  border-top:1px solid var(--tphi-hairline-light);
}
.focus-col{
  padding:clamp(1.75rem, 3vw, 2.75rem) clamp(1.25rem, 2.5vw, 2.25rem);
  border-left:1px solid var(--tphi-hairline-light);
  display:flex; flex-direction:column; gap:1rem;
}
.focus-col:first-child{ border-left:0; padding-left:0; }
.focus-col:last-child{ padding-right:0; }
.focus-col h3{ font-size:clamp(1.35rem, 1.9vw, 1.7rem); max-width:16ch; }
.focus-col p{ color:var(--tphi-slate-ink); font-size:.98rem; flex:1; }
.focus-col .text-link{ align-self:flex-start; }
@media (max-width: 860px){
  .focus-cols{ grid-template-columns:1fr; }
  .focus-col{ border-left:0; border-top:1px solid var(--tphi-hairline-light); padding-inline:0; }
  .focus-col:first-child{ border-top:0; }
}

/* ============================================================
   NEWS / BLOG
   ============================================================ */
.news-grid{
  display:grid; grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);
  gap:clamp(2rem, 5vw, 4.5rem);
  align-items:start;
}
.news-feature{ text-decoration:none; color:inherit; display:block; }
.news-feature img{ width:100%; aspect-ratio:16/10; object-fit:cover; margin-bottom:1.4rem; display:block; }
.news-feature .n-date, .news-item .n-date{
  font-size:.8rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--tphi-blue); display:block; margin-bottom:.5rem;
}
.news-feature h3, .news-feature .n-title{
  font-family:var(--tphi-serif); font-weight:600; line-height:1.12;
  font-size:clamp(1.55rem, 2.6vw, 2.2rem); margin-bottom:.8rem; max-width:22ch;
}
.news-feature p{ color:var(--tphi-slate-ink); max-width:58ch; margin-bottom:1.2rem; }
.news-feature:hover h3, .news-feature:hover .n-title{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:6px; color:var(--tphi-blue); }

.news-list{ border-top:1px solid var(--tphi-hairline-light); }
.news-item{
  display:block; text-decoration:none; color:inherit;
  padding-block:clamp(1.4rem, 2.5vw, 2rem);
  border-bottom:1px solid var(--tphi-hairline-light);
}
.news-item h3, .news-item .n-title{
  font-family:var(--tphi-serif); font-weight:600;
  font-size:clamp(1.2rem, 1.8vw, 1.55rem); line-height:1.25; max-width:30ch;
}
.news-item a{ color:inherit; text-decoration:none; }
.news-item:hover h3, .news-item:hover .n-title,
.news-item h3 a:hover, .news-item .n-title a:hover{
  color:var(--tphi-blue); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px;
}
.news-cta{ margin-top:2rem; }
@media (max-width: 860px){
  .news-grid{ grid-template-columns:1fr; }
}

/* Query-loop driven news blocks (front page + blog index) */
.news-query .wp-block-post-date,
.news-query .wp-block-post-date a{
  font-size:.8rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--tphi-blue); text-decoration:none; display:block; margin-bottom:.5rem;
}
.news-query .wp-block-post-title{ margin:0; }
.news-query .wp-block-post-title a{ color:inherit; text-decoration:none; }
.news-query .wp-block-post-title a:hover{
  color:var(--tphi-blue); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:5px;
}
.news-query .wp-block-post-excerpt{ color:var(--tphi-slate-ink); max-width:58ch; }
.news-query .wp-block-post-excerpt__more-link{ display:none; }
.news-query .wp-block-post-featured-image img{ aspect-ratio:16/10; object-fit:cover; }
.news-query .wp-block-post-featured-image{ margin-bottom:1.4rem; }
.news-query-feature .wp-block-post-title{
  font-size:clamp(1.55rem, 2.6vw, 2.2rem); max-width:22ch; margin-bottom:.8rem;
}
.news-query-list .wp-block-post{
  padding-block:clamp(1.4rem, 2.5vw, 2rem);
  border-bottom:1px solid var(--tphi-hairline-light);
}
.news-query-list .wp-block-post-title{
  font-size:clamp(1.2rem, 1.8vw, 1.55rem); line-height:1.25; max-width:30ch;
}
.news-query-list{ border-top:1px solid var(--tphi-hairline-light); margin:0; padding:0; }

/* Blog index full list */
.blog-index-list .wp-block-post{
  display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr);
  gap:clamp(1.25rem, 3vw, 2.5rem); align-items:start;
  padding-block:clamp(1.75rem, 3.5vw, 2.75rem);
  border-bottom:1px solid var(--tphi-hairline-light);
}
.blog-index-list .wp-block-post-featured-image{ margin:0; }
.blog-index-list .wp-block-post-title{
  font-size:clamp(1.4rem, 2.3vw, 2rem); margin-bottom:.6rem; max-width:26ch;
}
@media (max-width: 700px){
  .blog-index-list .wp-block-post{ grid-template-columns:1fr; }
}

/* ============================================================
   GET INVOLVED / DONATE
   ============================================================ */
.donate-head{
  display:grid; grid-template-columns:minmax(0, 7fr) minmax(0, 5fr);
  gap:clamp(2rem, 5vw, 4.5rem); align-items:start;
  margin-bottom:clamp(2.5rem, 5vw, 4rem);
}
.donate-head h2{ color:var(--tphi-white); max-width:14ch; }
.donate-head p{ color:#d9e6f0; font-size:1.05rem; }
.donate-cta{ margin-top:1.75rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center; }
.give-cols{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  border-top:1px solid rgba(255,255,255,.28);
}
.give-col{
  padding:clamp(1.5rem, 2.5vw, 2.25rem) clamp(1.25rem, 2vw, 2rem);
  border-left:1px solid rgba(255,255,255,.28);
}
.give-col:first-child{ border-left:0; padding-left:0; }
.give-col .g-num{
  font-family:var(--tphi-serif); font-style:italic; font-weight:600;
  color:#bcd9ec; font-size:1.3rem; display:block; margin-bottom:.4rem;
}
.give-col h3{ color:var(--tphi-white); font-size:1.45rem; margin-bottom:.4rem; }
.give-col p{ color:#d9e6f0; font-size:.95rem; }
@media (max-width: 860px){
  .donate-head{ grid-template-columns:1fr; }
  .give-cols{ grid-template-columns:1fr; }
  .give-col{ border-left:0; border-top:1px solid rgba(255,255,255,.28); padding-inline:0; }
  .give-col:first-child{ border-top:0; }
}

/* Get involved page - card grid + other ways */
.involve-cards{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:clamp(1.5rem, 3vw, 2.5rem);
}
.involve-card{ display:flex; flex-direction:column; }
.involve-card img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; margin-bottom:1.2rem; }
.involve-card h3{ font-size:clamp(1.35rem, 1.9vw, 1.7rem); margin-bottom:.5rem; }
.involve-card p{ color:var(--tphi-slate-ink); flex:1; margin-bottom:1.2rem; }
.involve-cards.cols-2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (max-width: 860px){
  .involve-cards, .involve-cards.cols-2{ grid-template-columns:1fr; }
}
.ways-grid{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr));
  border-top:1px solid var(--tphi-hairline-dark);
}
.ways-grid .way{
  padding:clamp(1.5rem, 2.5vw, 2.25rem) clamp(1.25rem, 2vw, 2rem);
  border-left:1px solid var(--tphi-hairline-dark);
  display:flex; flex-direction:column; gap:.6rem;
}
.ways-grid .way:first-child{ border-left:0; padding-left:0; }
.ways-grid .way h3{ color:var(--tphi-white); font-size:1.3rem; }
.ways-grid .way p{ color:var(--tphi-mist); font-size:.95rem; flex:1; }
@media (max-width: 860px){
  .ways-grid{ grid-template-columns:1fr; }
  .ways-grid .way{ border-left:0; border-top:1px solid var(--tphi-hairline-dark); padding-inline:0; }
  .ways-grid .way:first-child{ border-top:0; }
}

/* ============================================================
   NEWSLETTER
   ============================================================ */
.newsletter{ border-bottom:1px solid var(--tphi-hairline-light); }
.newsletter-grid{
  display:grid; grid-template-columns:minmax(0, 5fr) minmax(0, 7fr);
  gap:clamp(2rem, 5vw, 4.5rem); align-items:end;
}
.newsletter h2{ max-width:12ch; }
.newsletter .nl-lede{ color:var(--tphi-slate-ink); margin-top:1rem; max-width:44ch; }
.nl-form{ display:flex; gap:0; border-bottom:2px solid var(--tphi-ink); }
.nl-form input[type="email"]{
  flex:1 1 auto; min-width:0;
  font-family:var(--tphi-sans); font-size:1.05rem; color:var(--tphi-ink);
  background:transparent; border:0; padding:.9rem .25rem;
}
.nl-form input[type="email"]::placeholder{ color:var(--tphi-slate-ink); }
.nl-form button, .nl-form input[type="submit"]{ flex:none; }
@media (max-width: 860px){
  .newsletter-grid{ grid-template-columns:1fr; }
}
@media (max-width: 480px){
  .nl-form{ flex-direction:column; border-bottom:0; }
  .nl-form input[type="email"]{ border-bottom:2px solid var(--tphi-ink); }
  .nl-form button, .nl-form input[type="submit"]{ width:100%; margin-top:1rem; }
}
/* WPForms drop-in: inherit the editorial input style */
.newsletter .wpforms-container input[type="email"]{
  font-family:var(--tphi-sans); font-size:1.05rem; border:0;
  border-bottom:2px solid var(--tphi-ink); border-radius:0; background:transparent;
}
.newsletter .wpforms-container button[type="submit"]{
  background:var(--tphi-blue); color:var(--tphi-white); border:0; border-radius:0;
  font-weight:600; padding:.85rem 2rem;
}

/* ============================================================
   INTERIOR PAGES - navy page header band + entry content
   ============================================================ */
.page-hero{
  background:var(--tphi-deep); color:var(--tphi-cloud);
  padding-block:clamp(3.5rem, 8vw, 6.5rem);
}
.page-hero .page-kicker{
  font-size:clamp(.78rem, 1vw, .9rem); font-weight:600;
  text-transform:uppercase; letter-spacing:.28em;
  color:var(--tphi-sky);
  display:flex; align-items:center; gap:1.1rem;
  margin-bottom:clamp(1rem, 2vh, 1.5rem);
}
.page-hero .page-kicker::before{ content:""; width:3rem; height:1px; background:var(--tphi-sky); }
.page-hero h1{ color:var(--tphi-white); max-width:24ch; }
.page-hero .wp-block-post-title{ color:var(--tphi-white); max-width:24ch; }
.page-hero .page-standfirst,
.page-hero .wp-block-post-date{
  color:var(--tphi-mist); margin-top:1rem; max-width:60ch; font-size:1.05rem;
}
.page-hero .wp-block-post-date{
  font-size:.85rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase;
  color:var(--tphi-sky);
}

.entry{ padding-block:clamp(3rem, 7vw, 5.5rem); }
.entry-canvas{ padding-block:0; }
/* When post content sits directly in .entry (page templates), constrain
   each top-level block to the container; alignfull bands go edge to edge. */
.entry > .entry-content > *{
  max-width:var(--tphi-container); margin-inline:auto; padding-inline:var(--tphi-gutter);
}
.entry > .entry-content > .alignfull{ max-width:none; padding-inline:0; }

/* Readable measure + editorial rhythm inside post/page content */
.entry-content h2{ font-size:clamp(1.6rem, 2.6vw, 2.3rem); margin-top:2.5rem; margin-bottom:1rem; max-width:28ch; }
.entry-content h3{ font-size:clamp(1.35rem, 2vw, 1.8rem); margin-top:2rem; margin-bottom:.8rem; max-width:34ch; }
.entry-content h4{ font-size:clamp(1.15rem, 1.6vw, 1.4rem); margin-top:1.75rem; margin-bottom:.6rem; }
.entry-content p{ margin-bottom:1.2rem; }
.entry-content ul, .entry-content ol{ margin:0 0 1.2rem; padding-left:1.4rem; }
.entry-content li{ margin-bottom:.55rem; }
.entry-content img{ display:block; }
.entry-content a{ color:var(--tphi-blue); text-underline-offset:3px; }
.entry-content hr{
  border:0; height:1px; background:var(--tphi-hairline-light);
  margin:clamp(2rem, 5vw, 3.5rem) 0;
}

/* Single blog post - readable measure on cream */
.single-measure{ max-width:72ch; margin-inline:auto; }
.single-measure .wp-block-post-featured-image{ margin-bottom:clamp(1.5rem, 4vw, 2.5rem); }
.single-measure .wp-block-post-featured-image img{ width:100%; aspect-ratio:16/9; object-fit:cover; }

/* Team page sections */
.team-section-label{
  font-size:clamp(.78rem, 1vw, .9rem); font-weight:600;
  text-transform:uppercase; letter-spacing:.24em; color:var(--tphi-blue);
  border-bottom:1px solid var(--tphi-hairline-light);
  padding-bottom:.7rem; margin-top:2.5rem; margin-bottom:1.75rem;
}
.team-member{
  display:grid; grid-template-columns:minmax(120px, 220px) minmax(0,1fr);
  gap:clamp(1.25rem, 3vw, 2.5rem); align-items:start;
  padding-block:clamp(1.5rem, 3vw, 2.25rem);
  border-bottom:1px solid var(--tphi-hairline-light);
}
.team-member img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.team-member h3{ font-size:clamp(1.3rem, 2vw, 1.7rem); margin-bottom:.5rem; }
.team-member p{ color:var(--tphi-slate-ink); max-width:64ch; }
@media (max-width: 640px){
  .team-member{ grid-template-columns:1fr; }
  .team-member img{ max-width:220px; }
}

/* ============================================================
   FOOTER - ink
   ============================================================ */
.site-footer{ background:var(--tphi-ink); color:var(--tphi-paper); }
.site-footer a{ color:var(--tphi-paper); }
.footer-main{
  display:grid;
  grid-template-columns:minmax(0, 5fr) minmax(0, 2.3fr) minmax(0, 2.3fr) minmax(0, 2.4fr);
  gap:clamp(2rem, 4vw, 3.5rem);
  padding-block:clamp(3rem, 6vw, 5rem);
}
.footer-brand-chip{ display:inline-block; margin-bottom:1.4rem; }
.footer-brand-chip img{ width:auto; height:96px; }
.footer-addr{
  font-style:normal; font-size:.95rem; line-height:1.8; color:#c9c5c0;
}
.footer-addr a{ color:var(--tphi-paper); }
.footer-col .f-title{
  font-size:.8rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:#a39e98; margin-bottom:1.1rem;
  padding-bottom:.7rem; border-bottom:1px solid rgba(246,242,238,.16);
}
.footer-col ul{ list-style:none; margin:0; padding:0; }
.footer-col ul li{ margin-bottom:.55rem; }
.footer-col a{ color:var(--tphi-paper); text-decoration:none; font-size:.98rem; }
.footer-col a:hover{ text-decoration:underline; text-underline-offset:4px; }
.social-list{ display:flex; flex-direction:column; gap:.55rem; }
.social-list a{ display:inline-flex; align-items:center; gap:.7rem; text-decoration:none; font-size:.98rem; }
.social-list a:hover{ text-decoration:underline; text-underline-offset:4px; }
.social-list svg{ width:18px; height:18px; fill:#a39e98; flex:none; }
.social-list a:hover svg{ fill:var(--tphi-paper); }
.footer-legal{
  border-top:1px solid rgba(246,242,238,.16);
  padding-block:1.4rem;
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem 2rem;
  font-size:.88rem; color:#a39e98;
}
.footer-legal a{ color:#c9c5c0; }
@media (max-width: 960px){
  .footer-main{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px){
  .footer-main{ grid-template-columns:1fr; }
}

/* ============================================================
   404
   ============================================================ */
.error-hero{ min-height:60vh; display:flex; align-items:center; }
.error-hero .err-num{
  font-family:var(--tphi-serif); font-style:italic; font-weight:600;
  font-size:clamp(1.4rem, 2.2vw, 1.9rem); color:var(--tphi-sky);
}

/* ============================================================
   BLOCK / TEMPLATE PLUMBING
   ============================================================ */
/* The header template part wrapper is the sticky element. */
header.wp-block-template-part{ position:sticky; top:0; z-index:100; }

/* Program index rows use spans for names inside the anchor. */
.program-row .p-name{ display:block; }

/* Core query loop resets */
.wp-block-post-template{ list-style:none; margin:0; padding:0; }
.wp-block-post-template .wp-block-post{ margin:0; }
.wp-block-query-pagination{
  display:flex; gap:1rem; align-items:center; flex-wrap:wrap;
  padding-block:clamp(1.5rem, 3vw, 2.25rem);
  font-weight:600; letter-spacing:.06em; text-transform:uppercase; font-size:.9rem;
}
.wp-block-query-pagination a{ color:var(--tphi-blue); text-decoration:none; }
.wp-block-query-pagination a:hover{ text-decoration:underline; text-underline-offset:4px; }
.wp-block-query-pagination-numbers .current{ color:var(--tphi-slate-ink); }

/* Images inside content */
.entry-content .wp-block-image{ margin:0 0 1.2rem; }
.team-member figure, .involve-card figure{ margin:0; }

/* Post navigation on single posts */
.post-nav{
  border-top:1px solid var(--tphi-hairline-light);
  margin-top:clamp(2rem, 5vw, 3.5rem); padding-top:1.4rem;
}
.post-nav a{
  color:var(--tphi-blue); text-decoration:none; font-weight:600;
  font-size:.9rem; letter-spacing:.06em; text-transform:uppercase;
}
.post-nav a:hover{ text-decoration:underline; text-underline-offset:4px; }

/* ============================================================
   CONTENT HELPERS (used by imported page/post markup)
   ============================================================ */
.entry-content .lede{
  font-size:clamp(1.1rem, 1.5vw, 1.25rem);
  color:var(--tphi-slate-ink); max-width:58ch;
}
.program-prose{ max-width:76ch; }
.program-team{
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
  gap:clamp(1.5rem, 3vw, 2.5rem);
}
.program-team .pt-card img{
  width:100%; aspect-ratio:1/1; object-fit:cover; display:block; margin-bottom:.9rem;
}
.program-team .pt-card h3{ font-size:1.25rem; margin-bottom:.15rem; }
.program-team .pt-card .pt-tag{
  font-size:.8rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--tphi-blue); display:block; margin-bottom:.15rem;
}
.program-team .pt-card p{ color:var(--tphi-slate-ink); font-size:.95rem; }
@media (max-width: 860px){ .program-team{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px){ .program-team{ grid-template-columns:1fr; } }

/* ============================================================
   REVEAL - motion-safe only (JS adds .in when in view)
   ============================================================ */
@media (prefers-reduced-motion: no-preference){
  .reveal{
    opacity:0; transform:translateY(22px);
    transition:opacity .7s ease, transform .7s ease;
  }
  .reveal.in{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; }
  .text-link .arr, .program-row .p-arrow{ transition:none; }
}


/* ===== AUDIT POLISH 2026-08-11 ===== */

/* 1. Fail-safe reveals: visible unless JS confirms it can animate them. */
.reveal { opacity: 1; transform: none; }
@media (prefers-reduced-motion: no-preference) {
  .tphi-js .reveal { opacity: 0; transform: translateY(16px);
    transition: opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1); }
  .tphi-js .reveal.in { opacity: 1; transform: none; }
}

/* 2. Newsletter form: WPForms renders a transparent input, so it was invisible. */
.nl-form-wrap .wpforms-container { margin: 0; }
.nl-form-wrap .wpforms-field { padding: 0; }
.nl-form-wrap .wpforms-field-label { font-family: 'Palanquin', system-ui, sans-serif;
  font-size: .8rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--tphi-slate-ink); margin-bottom: .5rem; }
.nl-form-wrap .wpforms-required-label { color: var(--tphi-blue); }
.nl-form-wrap input[type='email'], .nl-form-wrap input[type='text'] {
  width: 100%; max-width: 26rem; background: var(--tphi-white);
  border: 1px solid rgba(26,27,31,.18); border-radius: 0; padding: .85rem 1rem;
  font-family: 'Palanquin', system-ui, sans-serif; font-size: 1rem; color: var(--tphi-ink);
  transition: border-color .18s ease, box-shadow .18s ease; }
.nl-form-wrap input[type='email']:hover { border-color: rgba(26,27,31,.34); }
.nl-form-wrap input[type='email']:focus { outline: none; border-color: var(--tphi-blue);
  box-shadow: 0 0 0 3px rgba(62,139,200,.28); }
.nl-form-wrap .wpforms-submit-container { padding: 0; margin-top: 1rem; }
.nl-form-wrap button.wpforms-submit { background: var(--tphi-blue); color: #fff; border: 0;
  border-radius: 0; padding: .85rem 2rem; font-family: 'Palanquin', system-ui, sans-serif;
  font-size: .95rem; font-weight: 600; letter-spacing: .02em; cursor: pointer;
  transition: background-color .18s ease, transform .18s ease; }
.nl-form-wrap button.wpforms-submit:hover { background: var(--tphi-navy); }
.nl-form-wrap button.wpforms-submit:active { transform: translateY(1px); }
.nl-form-wrap .wpforms-confirmation-container-full { background: transparent; border: 0;
  border-left: 3px solid var(--tphi-blue); padding: .25rem 0 .25rem 1rem; color: var(--tphi-ink); }
/* 3. Team photos: unify square + circular sources into one circular set. */
.team-member img, .program-team .pt-card img { border-radius: 50%; background: #eceae7; }
.team-member img { width: 190px; height: 190px; max-width: 190px; }
@media (max-width: 860px) { .team-member img { width: 150px; height: 150px; max-width: 150px; } }

/* 4. Motion polish - all inside a reduced-motion guard. */
@media (prefers-reduced-motion: no-preference) {
  .focus-cols .reveal:nth-child(2), .news-grid .reveal:nth-child(2), .involve-grid .reveal:nth-child(2) { transition-delay: .08s; }
  .focus-cols .reveal:nth-child(3), .news-grid .reveal:nth-child(3), .involve-grid .reveal:nth-child(3) { transition-delay: .16s; }
  .program-row { transition: background-color .28s ease, padding-left .28s ease; }
  .program-row:hover { background: rgba(255,255,255,.035); padding-left: .6rem; }
  .program-row .p-arrow { transition: transform .28s cubic-bezier(.22,.61,.36,1); }
  .program-row:hover .p-arrow { transform: translateX(7px); }
  .text-link .arr { transition: transform .24s cubic-bezier(.22,.61,.36,1); }
  .text-link:hover .arr { transform: translateX(6px); }
  .news-card figure, .involve-card figure, .team-member figure { overflow: hidden; }
  .news-card img, .involve-card img { transition: transform .9s cubic-bezier(.22,.61,.36,1); }
  .news-card:hover img, .involve-card:hover img { transform: scale(1.035); }
  .team-member img { transition: transform .35s cubic-bezier(.22,.61,.36,1); }
  .team-member:hover img { transform: translateY(-4px); }
  .btn, .btn-solid, .btn-outline { transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease; }
  .btn:active, .btn-solid:active, .btn-outline:active { transform: translateY(1px); }
  .site-header { transition: box-shadow .3s ease, background-color .3s ease; }
}

a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible {
  outline: 3px solid var(--tphi-cerulean); outline-offset: 2px; }

/* 2b. Override the theme's earlier transparent-input rule (same specificity,
   later in the file) so the email field is unmistakably a field. */
.newsletter .wpforms-container input[type="email"] {
  width: 100%; max-width: 26rem; background: var(--tphi-white);
  border: 1px solid rgba(26,27,31,.18); border-bottom: 1px solid rgba(26,27,31,.18);
  border-radius: 0; padding: .85rem 1rem; font-size: 1rem; color: var(--tphi-ink);
  transition: border-color .18s ease, box-shadow .18s ease; }
.newsletter .wpforms-container input[type="email"]:hover { border-color: rgba(26,27,31,.34); }
.newsletter .wpforms-container input[type="email"]:focus { outline: none;
  border-color: var(--tphi-blue); box-shadow: 0 0 0 3px rgba(62,139,200,.28); }
.newsletter .wpforms-container button[type="submit"]:hover { background: var(--tphi-navy); }
.newsletter .wpforms-field-label { font-size:.8rem; font-weight:600; letter-spacing:.1em;
  text-transform:uppercase; color:var(--tphi-slate-ink); margin-bottom:.5rem; }

/* 2c. WPForms scopes its own styles with an ID selector (#wpforms-<id>),
   which outranks any class-based rule. !important is the correct tool here. */
.newsletter .wpforms-container input[type="email"] {
  background-color: var(--tphi-white) !important;
  border: 1px solid rgba(26,27,31,.20) !important;
  border-radius: 0 !important;
  padding: .85rem 1rem !important;
  width: 100% !important; max-width: 26rem !important;
  color: var(--tphi-ink) !important;
  box-shadow: none !important;
}
.newsletter .wpforms-container input[type="email"]:focus {
  border-color: var(--tphi-blue) !important;
  box-shadow: 0 0 0 3px rgba(62,139,200,.28) !important;
}
