/* =========================================================
   TYREN – main stylesheet
   ========================================================= */
html { font-size: 16px; }
@media (min-width: 1440px) { html { font-size: calc(100vw / 90); } }

/* ---------- Tokens ---------- */
:root {
  --t-green: var(--wp--preset--color--green, #0E3C27);
  --t-red: var(--wp--preset--color--red, #F00000);
  --t-ink: var(--wp--preset--color--ink, #0C0C0C);
  --t-cream: var(--wp--preset--color--cream, #F3ECDD);
  --t-taupe: var(--wp--preset--color--taupe, #9F9786);
  --t-pink: var(--wp--preset--color--pink, #E2AAAA);

  --t-display: 'Rhode', 'Oswald', Impact, sans-serif;
  --t-body: 'Apple Garamond', Garamond, 'Times New Roman', serif;

  --t-gutter: clamp(1.25rem, 5vw, 6rem);
  --t-section: clamp(4rem, 9vw, 9rem);

  --t-fs-mega: clamp(3.25rem, 12.5vw, 11rem);
  --t-fs-xl:   clamp(2.75rem, 8.5vw, 7.5rem);
  --t-fs-lg:   clamp(2.25rem, 6vw, 5.25rem);
  --t-fs-md:   clamp(1.5rem, 3.2vw, 2.75rem);
  --t-fs-sm:   clamp(1.15rem, 1.6vw, 1.5rem);
  --t-fs-body: clamp(1rem, .92rem + .3vw, 1.2rem);
  --t-fs-xs:   clamp(.75rem, .7rem + .15vw, .875rem);
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; }
body { font-family: var(--t-body); font-size: var(--t-fs-body); line-height: 1.5; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; }

/* ---------- Astra resets (full-bleed canvas) ---------- */
#masthead, #colophon { display: none !important; }
.ast-page-builder-template .entry-header { display: none; }
.ast-page-builder-template .site-content > .ast-container { max-width: 100%; padding: 0; }
.ast-page-builder-template #primary,
.ast-page-builder-template article,
.ast-page-builder-template .entry-content { margin: 0 !important; padding: 0 !important; }
.ast-page-builder-template .entry-content > * { margin-top: 0; margin-bottom: 0; }

/* ---------- Header ---------- */
.t-header {
  position: absolute; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.25rem var(--t-gutter);
  color: var(--t-cream); font-family: var(--t-display); font-size: var(--t-fs-xs);
  letter-spacing: .12em; text-transform: uppercase;
}
.admin-bar .t-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .t-header { top: 46px; } }
.t-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 1.75rem; }
.t-menu a { color: inherit; text-decoration: none; transition: color .2s; }
.t-menu a:hover { color: var(--t-red); }

/* ---------- Section system ---------- */
.t-section {
  position: relative; overflow: hidden; text-align: center;
  padding: var(--t-section) var(--t-gutter);
  margin: 0 !important;
}
.t-section > * { margin-left: auto; margin-right: auto; }
.t-section > * + * { margin-top: clamp(1.25rem, 2.5vw, 2.5rem); }
.t-section p { font-size: var(--t-fs-body); line-height: 1.45; max-width: 34rem; margin-left: auto; margin-right: auto; }
.t-section a { color: inherit; }
.t-section figure { margin-top: 0; margin-bottom: 0; }
.t-section .wp-block-image { text-align: center; }
.t-section :is(h1, h2, h3, h4) {
  color: inherit; font-family: var(--t-display); font-weight: 700;
  text-transform: uppercase; line-height: .9; letter-spacing: -.005em; margin: 0;
}

/* Heading sizes – add these classes in the editor (Advanced → Additional CSS class) */
.t-h-mega { font-size: var(--t-fs-mega) !important; }
.t-h-xl   { font-size: var(--t-fs-xl) !important; }
.t-h-lg   { font-size: var(--t-fs-lg) !important; }
.t-h-md   { font-size: var(--t-fs-md) !important; }
.is-style-outline { color: transparent !important; -webkit-text-stroke: .02em currentColor; }

/* Full-bleed images inside a section */
.t-section > .t-bleed {
  max-width: none; width: calc(100% + 2 * var(--t-gutter));
  margin-left: calc(var(--t-gutter) * -1); margin-right: calc(var(--t-gutter) * -1);
}
.t-section > .t-bleed--bottom { margin-top: var(--t-section); margin-bottom: calc(var(--t-section) * -1); }
/* .t-bleed img { display: block; width: 100%; aspect-ratio: 16 / 6; object-fit: cover; } */
.t-bleed img { display: block; width: 100%; aspect-ratio: 1474 / 450; object-fit: cover; }

.t-icon img { width: clamp(3rem, 6vw, 6rem); }
.t-eyebrow { font-family: var(--t-display); font-size: var(--t-fs-xs) !important; letter-spacing: .15em; text-transform: uppercase; }
.t-script { font-style: italic; font-size: var(--t-fs-md) !important; transform: rotate(-4deg); }

/* ---------- Hero ---------- */
.t-hero { padding-top: clamp(5rem, 8vw, 8rem); padding-bottom: 0; }
.t-hero__logo img { width: min(84vw, 46rem); }
.t-hero__tag { max-width: 22rem !important; }
.t-chevron { font-size: var(--t-fs-sm) !important; margin-top: .5rem !important; }
.t-hero__art { max-width: 80rem; }
.t-hero__art img { width: 100%; display: block; }

/* ---------- Mind fire ---------- */
.t-mindfire .t-icon { margin-top: .25rem !important; margin-bottom: -.75rem; }

/* ---------- Manifesto ---------- */
.t-manifesto h2 { font-size: var(--t-fs-xl) !important; }
.t-manifesto > h2 + h2 { margin-top: 0; }
.t-manifesto h2 img {
  height: .78em !important; width: auto !important; max-width: none;
  vertical-align: -.04em; margin: 0 .15em; border-radius: .08em;
}
.t-born { margin-top: .35em !important; }

/* ---------- Buttons ---------- */
.is-style-tyren .wp-block-button__link {
  background: var(--t-red); color: #fff; border-radius: 0;
  font-family: var(--t-display); text-transform: uppercase; letter-spacing: .06em;
  font-size: var(--t-fs-xs); padding: 1em 2.2em; transition: transform .2s, background .2s;
}
.is-style-tyren .wp-block-button__link:hover { background: var(--t-ink); transform: translateY(-2px); }

/* ---------- Preloader ---------- */
#tyren-preloader {
  position: fixed; inset: 0; z-index: 99999;
  display: grid; place-content: center; justify-items: center; gap: 1.5rem;
  background: var(--t-green); transition: opacity .6s ease, visibility .6s ease;
}
#tyren-preloader img { width: clamp(140px, 22vw, 30rem); height: auto; animation: tyren-pulse 1.6s ease-in-out infinite; }
.tyren-preloader__bar { width: clamp(120px, 18vw, 24rem); height: 3px; background: rgba(255, 255, 255, .15); overflow: hidden; position: relative; }
.tyren-preloader__bar::after { content: ''; position: absolute; inset: 0; width: 40%; background: var(--t-red); animation: tyren-load 1.2s ease-in-out infinite; }
#tyren-preloader.is-done { opacity: 0; visibility: hidden; }
@keyframes tyren-pulse { 50% { opacity: .55; transform: scale(.97); } }
@keyframes tyren-load { from { transform: translateX(-100%); } to { transform: translateX(260%); } }
.editor-styles-wrapper #tyren-preloader { display: none; }

/* =========================================================
   Responsive
   ========================================================= */

/* Mobile */
@media (max-width: 767px) {
/*   .t-bleed img { aspect-ratio: 4 / 3; } */
	 .t-bleed img { aspect-ratio: 2.1 / 1; }
  .t-manifesto h2:not(.t-born) img { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- Fonts ---------- */
@font-face {
  font-family: 'Rhode';
  src: url('../fonts/rhode-bold.ttf') format('truetype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Apple Garamond';
  src: url('../fonts/apple-garamond-regular.ttf') format('truetype');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Apple Garamond';
  src: url('../fonts/apple-garamond-italic.ttf') format('truetype');
  font-weight: 400; font-style: italic; font-display: swap;
}

body, p, li, input, textarea, select, button,
.t-section p, .t-footer {
  font-family: var(--t-body) !important;
}
h1, h2, h3, h4, h5, h6,
.t-section :is(h1, h2, h3, h4),
.t-header, .t-menu, .t-eyebrow, .t-name, .t-arrows,
.t-pillars .t-menu a, .t-footer h4,
.is-style-tyren .wp-block-button__link {
  font-family: var(--t-display) !important;
  font-weight: 400 !important;
}

/* =========================================================
   HERO – Figma adjustments (v2)
   ========================================================= */
.t-hero {
  --t-hero-inset: clamp(.45rem, 1.2vw, 1.125rem); /* image side gap: ~7px mobile, ~18px desktop */
}

/* Paragraph: 23px mobile → 32px desktop */
.t-hero .t-hero__tag {
  font-size: clamp(1.4375rem, 2.12vw, 2rem) !important;
  line-height: 1.15 !important;
  max-width: min(42.1rem, 60.5vw) !important;
}

/* Caret: bigger, bolder, sits between the text and the image */
.t-hero .t-chevron {
  display: flex !important;
  justify-content: center;
  align-items: center;
  max-width: none !important;
  height: clamp(1.75rem, 2.6vw, 2.5rem);
  font-size: 0 !important;
  line-height: 0 !important;
  margin: clamp(.75rem, 1.5vw, 1.25rem) auto clamp(1.5rem, 3vw, 2.5rem) !important;
}
.t-hero .t-chevron::before {
  content: '';
  display: block;
  width: clamp(.95rem, 1.4vw, 1.35rem);
  height: clamp(.95rem, 1.4vw, 1.35rem);
  border-right: clamp(.25rem, .4vw, .375rem) solid currentColor;
  border-bottom: clamp(.25rem, .4vw, .375rem) solid currentColor;
  transform: translateY(-30%) rotate(45deg);
}

/* Image: small gap left and right (section padding = the gap) */
.t-hero {
  padding-left: var(--t-hero-inset) !important;
  padding-right: var(--t-hero-inset) !important;
}
.t-hero .t-hero__art,
.t-hero .wp-block-image:not(.t-hero__logo) {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
.t-hero .t-hero__art figure,
.t-hero .wp-block-image:not(.t-hero__logo) figure {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
}

.t-hero .t-hero__art img,
.t-hero .wp-block-image:not(.t-hero__logo) img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  aspect-ratio: 3.6 / 1 !important;
  object-fit: cover;
  object-position: 50% 100%;
  border-radius: clamp(.35rem, .6vw, .6rem);
}

/* Mobile */
@media (max-width: 767px) {
  .t-hero { padding-top: 7rem !important; }  /* keeps About/Lens clear of the logo */
  .t-hero .t-hero__art img,
  .t-hero .wp-block-image:not(.t-hero__logo) img { aspect-ratio: 0.95 / 1 !important; object-position: 40% 100%; }
}

/* ---------- Preloader: logo only, smooth ---------- */
.tyren-preloader__bar { display: none !important; }
#tyren-preloader { transition: opacity 1s ease, visibility 1s ease !important; }
#tyren-preloader img {
  animation: tyren-in 1s ease both, tyren-breathe 2.6s ease-in-out 1s infinite !important;
}
@keyframes tyren-in {
  from { opacity: 0; transform: scale(.94); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes tyren-breathe {
  50% { transform: scale(1.03); opacity: .85; }
}

/* =========================================================
   SECTION 2 – When Your Mind Catches Fire
   ========================================================= */
.t-mindfire {
  --t-mf-fs: clamp(4.0625rem, 10.4vw, 9.8rem);  /* 65px mobile → 157px desktop */
  min-height: 100vh;
  min-height: 100svh;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.t-mindfire > * { width: 100%; }

/* Headlines */
.t-mindfire .t-mf-head {
  font-size: var(--t-mf-fs) !important;
  line-height: .86 !important;
  letter-spacing: -.03em !important;
  position: relative;
  z-index: 1;
}
.t-mindfire .t-swap__slide > * + * { margin-top: 0 !important; }

/* Crown: overlaps "WHEN YOUR", sits on top of "MIND" */
.t-mindfire .t-mf-crown {
  position: relative;
  z-index: 2;
  width: calc(var(--t-mf-fs) * 1.85) !important;
  max-width: none !important;
  margin: calc(var(--t-mf-fs) * -.42) auto calc(var(--t-mf-fs) * -.02) !important;
}
.t-mindfire .t-mf-crown img { display: block; width: 100% !important; height: auto !important; }

/* "A Great Nation Is Reborn" */
.t-mindfire .t-reborn {
  color: #C4E2AD !important;
  font-size: calc(var(--t-mf-fs) * .955) !important;
  line-height: .89 !important;
}
.t-mindfire .t-reborn-slide { position: relative; }
.t-mindfire .t-reborn-mark {
  position: absolute !important;
  z-index: 2;
  width: calc(var(--t-mf-fs) * 2) !important;
  max-width: none !important;
  left: calc(50% + var(--t-mf-fs) * .35);
  top: 42%;
  margin: 0 !important;
}
.t-mindfire .t-reborn-mark img { display: block; width: 100% !important; height: auto !important; }

/* Paragraph: 26px desktop, line height 131% */
.t-mindfire .t-mf-text {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.31 !important;
  max-width: min(50.6rem, 92%) !important;
  margin-top: clamp(2rem, 4vw, 4rem) !important;
}

/* Fade + slide swap (only active on the live site) */
.t-swap-grid { display: grid !important; }
.t-swap.is-ready .t-swap__slide {
  grid-area: 1 / 1;
  align-self: center;
  opacity: 0;
  transform: translateY(2.5rem);
  transition: opacity .9s ease, transform .9s cubic-bezier(.2, .7, .2, 1);
  pointer-events: none;
}
.t-swap.is-ready .t-swap__slide.is-active {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.t-swap.is-ready .t-swap__slide.is-leaving {
  opacity: 0;
  transform: translateY(-2.5rem);
}

/* Section 2 – smaller map on desktop */
@media (min-width: 1024px) {
  .t-mindfire .t-reborn-mark {
    width: calc(var(--t-mf-fs) * 1.5) !important;
    left: calc(50% + var(--t-mf-fs) * .5);
    top: 45%;
  }
}

/* Section 2 – mobile: no empty space, headline fills the width */
@media (max-width: 767px) {
  .t-mindfire {
    --t-mf-fs: 21vw;              /* headline size: fills the screen width */
    min-height: auto !important;  /* only as tall as the content */
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
  .t-mindfire .t-mf-text {
    font-size: 1.125rem !important;  /* 18px, like Figma mobile */
    max-width: 100% !important;
    margin-top: 2.5rem !important;
  }
  .t-mindfire .t-reborn-mark {
    width: calc(var(--t-mf-fs) * 1.7) !important;
  }
}

@media (max-width: 767px) {
  .t-mindfire {
    --t-mf-fs: 18.5vw;            /* was 21vw – keeps "CATCHES FIRE" on one line */
    min-height: auto !important;
    padding-top: 3rem !important;    /* was 5rem */
    padding-bottom: 4rem !important; /* was 5rem */
  }
}	
/* Remove hairline gaps between sections */
.ast-page-builder-template .entry-content > * + * {
  margin-top: -1px !important;
}
.ast-page-builder-template .entry-content > * {
  position: relative;
}

	/* =========================================================
   SECTION 3 – From Thought to Thunder (Manifesto)
   ========================================================= */
.t-manifesto {
  --t-mn-fs: clamp(3.5rem, 9.92vw, 9.375rem);    /* 150px on the Figma desktop frame */
  --t-mn-inset: clamp(.45rem, 1.2vw, 1.125rem);  /* image side gap, same as hero */
}

/* Headline lines */
.t-manifesto h2 {
  font-size: var(--t-mn-fs) !important;
  line-height: .91 !important;
  letter-spacing: 0 !important;
  word-spacing: -.08em;
}
.t-manifesto > h2 + h2 { margin-top: 0 !important; }

/* Images between the words */
.t-manifesto h2 img {
  height: .78em !important;
  width: auto !important;
  aspect-ratio: 2.24 / 1;
  object-fit: cover;
  border-radius: 0;
  margin: 0 !important;
  vertical-align: -.02em;
}

/* "Tyren is B⬠rn" */
.t-manifesto .t-born { margin-top: .05em !important; }
.t-manifesto .t-born img { aspect-ratio: 1 / 1; object-fit: contain; }

/* Paragraph: 26px, line height 131% */
.t-manifesto p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.31 !important;
  max-width: min(50.6rem, 92%) !important;
  margin-top: clamp(2rem, 3vw, 3rem) !important;
}

/* Bottom crowd image: small side gap + rounded, like the hero */
.t-manifesto > .t-bleed {
  width: auto !important;
  max-width: none !important;
  margin-left: calc(var(--t-mn-inset) - var(--t-gutter)) !important;
  margin-right: calc(var(--t-mn-inset) - var(--t-gutter)) !important;
}
.t-manifesto > .t-bleed img { border-radius: clamp(.35rem, .6vw, .6rem); }

/* Mobile: one word per line, gap where the images were */
@media (max-width: 767px) {
  .t-manifesto { --t-mn-fs: 17.3vw; }   /* 65px on a 375px phone */
  .t-manifesto h2:not(.t-born) { line-height: 1.38 !important; }
  .t-manifesto h2:not(.t-born) img {
    display: block !important;
    visibility: hidden;
    width: 1px !important;
    height: .55em !important;
    margin: 0 auto !important;
  }
  .t-manifesto .t-born {
    line-height: .95 !important;
    margin-top: .25em !important;
  }
  .t-manifesto p {
    font-size: 1.125rem !important;
    max-width: 100% !important;
  }
}

/* =========================================================
   SECTION 4 – Dreams Deferred
   ========================================================= */
.t-dreams {
  --t-dr-fs: clamp(3.5rem, 10.4vw, 9.8rem);   /* 157px on the Figma desktop frame */
}

/* Headlines */
.t-dreams h2 {
  font-size: var(--t-dr-fs) !important;
  line-height: .86 !important;
  letter-spacing: -.01em !important;
  position: relative;
  z-index: 1;
}

.t-dreams h2 mark { color: #C4E2AD !important; position: relative; z-index: 1; }

/* Illustration: crowns overlap "DREAMS DEFERRED" */
.t-dreams > .t-dreams__art {
  position: relative;
  z-index: 2;
  width: calc(var(--t-dr-fs) * 4.35);
  max-width: 100%;
  margin-top: calc(var(--t-dr-fs) * -.35) !important;
}
.t-dreams .t-dreams__art img { display: block; width: 100% !important; }
.t-dreams > .t-dreams__art + h2 { margin-top: calc(var(--t-dr-fs) * .1) !important; }

/* Paragraphs: one block, 30px / 124% (Figma) */
.t-dreams p {
  font-size: clamp(1.125rem, 1.99vw, 1.875rem) !important;
  line-height: 1.24 !important;
  max-width: min(58.3rem, 92%) !important;
  margin-bottom: 0 !important;
}
.t-dreams > p + p { margin-top: 0 !important; }

/* "We are the Awakening!" – Pacifico 43px / 48px, two lines */
.t-dreams .t-script {
  font-family: 'Pacifico', cursive !important;
  font-style: normal;
  font-size: clamp(1.75rem, 2.85vw, 2.6875rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.01em;
  max-width: 7.5em !important;
  transform: none;
  margin-top: clamp(1rem, 2vw, 1.75rem) !important;
}

@media (max-width: 767px) {
  .t-dreams { --t-dr-fs: 15vw; }
  .t-dreams p { font-size: 1.125rem !important; max-width: 100% !important; }
}

/* =========================================================
   SECTION 5 – But Here's The Other Side
   ========================================================= */
.t-otherside {
  --t-os-fs: clamp(3.5rem, 10.4vw, 9.8rem);   /* 157px on the Figma desktop frame */
}

/* Headline: 157px / 137px */
.t-otherside h2 {
  font-size: var(--t-os-fs) !important;
  line-height: .873 !important;
  letter-spacing: 0 !important;
  position: relative;
  z-index: 1;
}

/* Hand: overlaps the end of "THE OTHER SIDE", bleeds off the right edge */
.t-otherside > .t-hand {
  position: relative;
  z-index: 2;
  width: 47vw !important;
  max-width: none !important;
  margin-left: calc(60vw - var(--t-gutter)) !important;
  margin-right: 0 !important;
  margin-top: calc(var(--t-os-fs) * -.5) !important;
}
.t-otherside .t-hand img { display: block; width: 100% !important; height: auto !important; }

/* Paragraphs: 26px / 116%, one blank line between */
.t-otherside p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.16 !important;
  max-width: min(35.1rem, 92%) !important;
  margin-bottom: 0 !important;
}
.t-otherside > .t-hand + p { margin-top: clamp(1.5rem, 4vw, 4rem) !important; }
.t-otherside > p + p { margin-top: 1.16em !important; }

/* Mobile: 65px / 60px headline on 3 lines, 20px paragraphs */
@media (max-width: 767px) {
  .t-otherside { --t-os-fs: 16.7vw; }
  .t-otherside h2 { line-height: .923 !important; max-width: 5.4em !important; }
  .t-otherside > .t-hand {
    width: 80vw !important;
    margin-left: calc(25vw - var(--t-gutter)) !important;
    margin-top: .5rem !important;
  }
  .t-otherside p {
    font-size: 1.25rem !important;
    line-height: 1.02 !important;
    max-width: 79% !important;
  }
}

/* =========================================================
   SECTION 6 – Not Anymore!
   ========================================================= */
.t-notanymore {
  --t-na-fs: clamp(3.5rem, 10.4vw, 9.8rem);   /* 157px on the Figma desktop frame */
}

/* Headline: 157px / 139px */
.t-notanymore h2 {
  font-size: var(--t-na-fs) !important;
  line-height: .885 !important;
  letter-spacing: 0 !important;
  position: relative;
  z-index: 1;
}

/* Fist: comes in from the left edge, knuckles touch "ANYMORE!" */
.t-notanymore > .t-fist {
  position: relative;
  z-index: 2;
  width: 65vw !important;
  max-width: none !important;
  margin-left: calc(var(--t-gutter) * -1) !important;
  margin-right: 0 !important;
  margin-top: calc(var(--t-na-fs) * -.16) !important;
}
.t-notanymore .t-fist img { display: block; width: 100% !important; height: auto !important; }

/* Paragraphs: 26px / 113%, one blank line between */
.t-notanymore p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(41.1rem, 92%) !important;
  margin-bottom: 0 !important;
}
.t-notanymore > .t-fist + p { margin-top: clamp(1rem, 2.5vw, 2.5rem) !important; }
.t-notanymore > p + p { margin-top: 1.13em !important; }

/* Mobile: 65px / 57.7px headline, 20px paragraphs */
@media (max-width: 767px) {
  .t-notanymore { --t-na-fs: 16.5vw; }
  .t-notanymore h2 { line-height: .888 !important; }
  .t-notanymore > .t-fist {
    width: 79vw !important;
    margin-top: calc(var(--t-na-fs) * -.1) !important;
  }
  .t-notanymore p {
    font-size: 1.25rem !important;
    line-height: 1.02 !important;
    max-width: 80% !important;
  }
}

/* =========================================================
   SECTION 7 – From Bold Ideas >>> Sustained Action
   ========================================================= */
.t-boldideas {
  --t-bi-fs: clamp(3.5rem, 10.4vw, 9.8rem);   /* 157px on the Figma desktop frame */
}

/* Headlines: 157px / 139px */
.t-boldideas h2 {
  font-size: var(--t-bi-fs) !important;
  line-height: .885 !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

/* Row: left heading | arrows | right heading */
.t-boldideas .t-arrowrow {
  display: flex !important;
  justify-content: center;
  align-items: center !important;
  gap: calc(var(--t-bi-fs) * .1) !important;
  max-width: none !important;
  margin-bottom: 0 !important;
}
.t-boldideas .t-arrowrow > .wp-block-column {
  flex: 0 0 auto !important;
  flex-basis: auto !important;
  width: auto !important;
  margin: 0 !important;
}
.t-boldideas .t-arrowrow > .wp-block-column:first-child h2 { text-align: right !important; }
.t-boldideas .t-arrowrow > .wp-block-column:last-child h2  { text-align: left !important; }

/* Red arrows (image): ~109px wide at 157px headline, like Figma */
.t-boldideas p.t-arrows {
  font-size: 0 !important;
  line-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
}
.t-boldideas img.t-arrows {
  display: block;
  width: calc(var(--t-bi-fs) * .7) !important;
  max-width: none !important;
  height: auto !important;
  margin: 0 auto;
}

/* Paragraphs: 26px / 113%, one blank line between */
.t-boldideas p:not(.t-arrows) {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(39.8rem, 92%) !important;
  margin-bottom: 0 !important;
}
.t-boldideas > .t-arrowrow + p { margin-top: clamp(3rem, 6vw, 6rem) !important; }  /* gap: headline → text */
.t-boldideas > p + p { margin-top: 1.13em !important; }

/* Mobile: stacked, 62.8px / 55.6px headline, 20px paragraphs */
@media (max-width: 781px) {
  .t-boldideas { --t-bi-fs: 16vw; }
  .t-boldideas .t-arrowrow {
    flex-direction: column !important;
    align-items: stretch !important;
    width: fit-content;
    margin-left: auto !important;
    margin-right: auto !important;
    gap: calc(var(--t-bi-fs) * .15) !important;
  }
	
  .t-boldideas .t-arrowrow > .wp-block-column { align-self: stretch !important; }
  .t-boldideas img.t-arrows { margin: 0; } 
	
  .t-boldideas p:not(.t-arrows) {
    font-size: 1.25rem !important;
    max-width: 73% !important;
  }
}

/* =========================================================
   SECTION 8 – Your Mind Is The Final Frontier
   ========================================================= */
.t-frontier {
  --t-fr-fs: clamp(3.5rem, 10.4vw, 9.8rem);   /* 157px on the Figma desktop frame */
}

/* Eyebrow: Jost 31px / 48px, red */
.t-frontier .t-eyebrow {
  font-family: 'Jost', sans-serif !important;
  font-size: clamp(1.0625rem, 2.05vw, 1.9375rem) !important;
  line-height: 1.55 !important;
  letter-spacing: -.01em !important;
  max-width: none !important;
}

/* Headline: 157px / 139px */
.t-frontier h2 {
  font-size: var(--t-fr-fs) !important;
  line-height: .885 !important;
  letter-spacing: 0 !important;
}

.t-frontier .t-eyebrow + h2 { margin-top: clamp(.5rem, 1vw, 1rem) !important; }
.t-frontier .t-br-m { display: none; } 

/* Intro + closing line: 26px / 113% */
.t-frontier > p:not(.t-eyebrow) {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(42.8rem, 92%) !important;
  margin-bottom: 0 !important;
}

/* Cards: 2 left | empty middle | 2 right, edge to edge with the image inset */
.t-frontier .t-revs {
  display: grid !important;
  grid-template-columns: 282fr 282fr 317fr 282fr 282fr;
  column-gap: clamp(.5rem, .8vw, .75rem) !important;
  row-gap: 0 !important;
  max-width: none !important;
  margin-left: calc(var(--t-inset) - var(--t-gutter)) !important;
  margin-right: calc(var(--t-inset) - var(--t-gutter)) !important;
}
.t-frontier .t-revs > .wp-block-column { margin: 0 !important; min-width: 0; }
.t-frontier .t-revs > .wp-block-column:nth-child(3) { grid-column: 4; }
.t-frontier .t-revs > .wp-block-column:nth-child(4) { grid-column: 5; }
.t-frontier .t-revs img {
  display: block;
  width: 100% !important;
  aspect-ratio: 282 / 175;
  object-fit: cover;
  border-radius: clamp(.5rem, .8vw, .75rem);
}
.t-frontier .t-rev__label:empty { display: none; }
.t-frontier .t-revs p {
  font-size: clamp(.875rem, 1.2vw, 1.125rem) !important;
  line-height: 1.15 !important;
  max-width: 13em !important;
  margin: .75em auto 0 !important;
}
.t-frontier .t-revs + p { margin-top: clamp(1.5rem, 3vw, 3rem) !important; }

/* Mobile: 65px / 60px headline on 3 lines, 2 × 2 cards */
@media (max-width: 781px) {
  .t-frontier { --t-fr-fs: 16.5vw; }
   .t-frontier h2 { line-height: .923 !important; }
  .t-frontier .t-br-m { display: inline; }
  .t-frontier .t-br-d { display: none; }
  .t-frontier .t-revs {
    grid-template-columns: 1fr 1fr;
    row-gap: 1.5rem !important;
    column-gap: .75rem !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .t-frontier .t-revs > .wp-block-column:nth-child(3),
  .t-frontier .t-revs > .wp-block-column:nth-child(4) { grid-column: auto; }
  .t-frontier .t-revs p { font-size: .9375rem !important; }
  .t-frontier > p:not(.t-eyebrow) { font-size: 1.25rem !important; }
}

/* =========================================================
   SECTION 9 – The Intellectual Revolution
   (your illustration image behind, text on the torso – like Figma)
   ========================================================= */
.t-intellectual {
  --t-ir-fs: clamp(2.75rem, 6.6vw, 6.25rem);   /* 100px heading on the Figma desktop frame */
  --t-ir-img: 88.4vw;                          /* body width: 1337 of 1512 in Figma */
  isolation: isolate;
  padding-top: calc(var(--t-ir-img) * .434) !important;    /* heading starts on the chest */
  padding-bottom: clamp(2rem, 3.8vw, 4rem) !important;
}

/* Your image: centred behind the text, bottom clipped by the section */
.t-intellectual > .t-head {
  position: absolute !important;
  z-index: -1;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: var(--t-ir-img) !important;
  max-width: none !important;
  margin: 0 !important;
}
.t-intellectual .t-head img { display: block; width: 100% !important; height: auto !important; }

/* Heading: 100px / 91px */
.t-intellectual h2 {
  font-size: var(--t-ir-fs) !important;
  line-height: .91 !important;
  letter-spacing: 0 !important;
  margin-top: 0 !important;
}

/* Paragraphs: 26px / 113%, one blank line between */
.t-intellectual p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(35.75rem, 92%) !important;
  margin-bottom: 0 !important;
}
.t-intellectual > h2 + p { margin-top: clamp(1rem, 1.5vw, 1.5rem) !important; }
.t-intellectual > p + p { margin-top: 1.13em !important; }

/* Mobile image hidden on desktop */
.t-intellectual > .t-head-m { display: none; }

/* Mobile (Figma mobile frame): mobile illustration fills the section, text on the chest */
@media (max-width: 781px) {
  .t-intellectual {
    --t-ir-fs: 16.5vw;                       /* 65px heading */
    padding-top: 74vw !important;            /* "THE" starts on the chest */
    padding-bottom: 2rem !important;
  }
  .t-intellectual > .t-head { display: none !important; }
  .t-intellectual > .t-head-m {
    display: block;
    position: absolute !important;
    z-index: -1;
    top: 0; bottom: 0; left: 0;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }
  .t-intellectual .t-head-m img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    object-position: 50% 0;
  }
  .t-intellectual h2 { line-height: .908 !important; }
  .t-intellectual p {
    font-size: 1.25rem !important;             /* 20px / 113% */
    max-width: 67% !important;
  }
}
	/* =========================================================
   SECTION 10 – Hands + map  →  Tyren Is The Fifth Revolution
   (arms continue straight on from the body in Section 9)
   ========================================================= */
.t-fifth {
  --t-ff-fs: clamp(3.5rem, 10.4vw, 9.8rem);   /* 157px headline on the Figma desktop frame */
  --t-ff-hands: 99vw;                         /* hands width = body width */
  --t-ff-shift: -.9vw;                        /* nudges the arms onto the body's arms */
  isolation: isolate;
  padding-top: 0 !important;
  padding-bottom: clamp(2rem, 6.4vw, 6rem) !important;
}

/* Gray hands: in the flow, so the section height follows the image */
.t-fifth > .t-hands {
  position: relative;
  z-index: -1;
  width: var(--t-ff-hands) !important;
  max-width: none !important;
  margin: 0 0 0 calc(50% - var(--t-ff-hands) / 2 + var(--t-ff-shift)) !important;
}
.t-fifth .t-hands img { display: block; width: 100% !important; height: auto !important; }

/* "Because…" text between the arms: 26px / 113%, one line per sentence */
.t-fifth > .t-because {
  position: absolute;
  z-index: 1;
  top: 3.4vw;
  left: 50%;
  transform: translateX(-50%);
  width: 52vw;
  max-width: none !important;
  margin: 0 !important;
}
.t-fifth .t-because p {
  font-size: 1.72vw !important;
  line-height: 1.13 !important;
  white-space: nowrap;
  max-width: none !important;
  margin: 0 !important;
}
.t-fifth .t-because p + p { margin-top: 1.13em !important; }

/* Map: centred in the cupped hands, swaps on hover */
.t-fifth > .t-map {
  position: absolute;
  z-index: 1;
  top: 30vw;
  left: 47.5%;
  transform: translateX(-50%);
  width: 40vw;
  max-width: none !important;
  margin: 0 !important;
  cursor: pointer;
}
.t-fifth .t-map figure { margin: 0 !important; }
.t-fifth .t-map img { display: block; width: 100% !important; height: auto !important; }
.t-fifth .t-map__a,
.t-fifth .t-map__b { transition: opacity .5s ease; }
.t-fifth .t-map__b { position: absolute !important; inset: 0; opacity: 0; }
.t-fifth .t-map:hover .t-map__a { opacity: 0; }
.t-fifth .t-map:hover .t-map__b { opacity: 1; }

/* Headlines: 157px / 137px, straight under the hands */
.t-fifth h2 {
  font-size: var(--t-ff-fs) !important;
  line-height: .873 !important;
  letter-spacing: 0 !important;
  margin-top: 0 !important;
}
.t-fifth > .t-map + h2 { margin-top: 2vw !important; }

/* Mobile hands hidden on desktop */
.t-fifth > .t-hands-m { display: none; }

 /* Mobile (Figma mobile frame): text, hands and net share one cell → headline below */
@media (max-width: 781px) {
  .t-fifth {
    --t-ff-fs: 15.5vw;            /* 65px headline, never splits words */
    --t-ff-hands-down: 17vw;      /* moves the hands down */
    --t-ff-net-lift: 29vw;        /* net's distance from the bottom of the hands */
    --t-ff-top: 3.5rem;           /* text distance from the top (53px in Figma) */
    display: grid !important;
    grid-template-columns: 100%;
    padding-top: var(--t-ff-top) !important;
  }
  .t-fifth > * { margin-top: 0 !important; }
  .t-fifth > .t-hands { display: none !important; }

  /* Hands: start at the very top of the section, behind everything */
  .t-fifth > .t-hands-m {
    grid-row: 1;
    grid-column: 1;
    align-self: start;
    display: block;
    position: relative;
    z-index: -1;
    width: calc(100% + 2 * var(--t-gutter)) !important;
    max-width: none !important;
	margin: calc(var(--t-ff-top) * -1 + var(--t-ff-hands-down)) calc(var(--t-gutter) * -1) 0 !important;
  }
  .t-fifth .t-hands-m img { display: block; width: 100% !important; height: auto !important; }

  /* Text: on top of the hands image, 20px / 113%, narrow column */
  .t-fifth > .t-because {
    grid-row: 1;
    grid-column: 1;
    align-self: start;
    position: relative;
    top: auto; left: auto;
    transform: none;
    width: 77%;
    margin: 0 auto !important;
  }
  .t-fifth .t-because p {
    font-size: 1.25rem !important;
    white-space: normal;
  }

  /* Net: anchored to the bottom of the hands, so it sits in the palms */
  .t-fifth > .t-map {
    grid-row: 1;
    grid-column: 1;
    align-self: end;
    justify-self: center;
    position: relative;
    top: auto; left: auto;
    transform: none;
    width: 63vw;
    margin: 0 0 var(--t-ff-net-lift) !important;
  }

  /* Headline below: 65px / 61.6px */
  .t-fifth h2 {
    line-height: .948 !important;
    max-width: 92% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow-wrap: normal;
    word-break: keep-all;
    hyphens: none;
  }
  .t-fifth > h2:first-of-type { margin-top: 2.5rem !important; }
}
/* =========================================================
   SECTION 11 – Become A Reformer (rounded image card on cream)
   ========================================================= */
.t-reformer {
  --t-rf-fs: clamp(2.75rem, 6.6vw, 6.25rem);       /* 100px heading on the Figma desktop frame */
  --t-rf-radius: clamp(.75rem, 1.4vw, 1.3125rem);  /* 21px */
  --t-rf-ratio: 900 / 1483;                        /* card height ÷ width (Figma) */
  background: var(--t-cream) !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  height: calc((100vw - 2 * var(--t-inset)) * var(--t-rf-ratio) + var(--t-inset)) !important;
  margin: 0 !important;
  padding: 0 var(--t-inset) var(--t-inset) !important;
  text-align: center;
}

/* Image card: inset + rounded, no dark overlay */
.t-reformer .wp-block-cover__image-background,
.t-reformer .wp-block-cover__background {
  top: 0 !important;
  left: var(--t-inset) !important;
  right: auto !important;
  bottom: auto !important;
  width: calc(100% - 2 * var(--t-inset)) !important;
  height: calc(100% - var(--t-inset)) !important;
  object-fit: cover;
  border-radius: var(--t-rf-radius);
}

.t-reformer .wp-block-cover__background { opacity: 0 !important; }

.t-reformer .wp-block-cover__inner-container,
.t-reformer .wp-block-cover__inner-container p { color: var(--t-cream) !important; }

/* Heading: 100px / 91px */
.t-reformer h2 {
  font-size: var(--t-rf-fs) !important;
  line-height: .91 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
}

/* Paragraph: 26px / 116% */
.t-reformer p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.16 !important;
  max-width: min(42.3rem, 80%) !important;
  margin: clamp(.75rem, 1.5vw, 1.5rem) auto 0 !important;
}

/* Button: dark green on desktop */
.t-reformer .wp-block-buttons { margin-top: clamp(1.25rem, 2.6vw, 2.5rem) !important; }
.t-reformer .is-style-tyren .wp-block-button__link {
  background: var(--t-green);
  color: var(--t-cream);
  font-family: 'Jost', sans-serif !important;
  font-size: clamp(.75rem, 1.25vw, 1.1875rem);
  letter-spacing: .02em;
  padding: 1.1em 2.4em;
  border-radius: .6em;
}
.t-reformer .is-style-tyren .wp-block-button__link:hover { background: var(--t-red); color: #fff; }

/* Mobile: taller card, 65px / 57px heading, red button */
@media (max-width: 781px) {
    .t-reformer {
    --t-rf-fs: 16.5vw;
    --t-rf-ratio: 440 / 374;   /* taller card on mobile (Figma) */
  }
  .t-reformer .wp-block-cover__image-background { object-position: 45% 50%; }
  .t-reformer h2 { line-height: .877 !important; }
  .t-reformer p {
    font-size: 1.0625rem !important;
    max-width: 78% !important;
  }
  .t-reformer .is-style-tyren .wp-block-button__link {
    background: var(--t-red);
    color: #fff;
    font-size: .75rem;
    padding: .9em 2.2em;
    border-radius: .75rem;
  }
}

/* =========================================================
   SECTION 12 – Link rows + "Stories From The Republic" row
   ========================================================= */
.t-linkrows {
  --t-lr-fs: clamp(2.4375rem, 6.6vw, 6.25rem);    /* 100px desktop → 39px mobile */
  --t-lr-side: clamp(3rem, 9vw, 8rem);            /* room for the arrow / plus */
  --t-lr-icon: clamp(1.25rem, 5.7vw, 5.375rem);   /* arrow distance from the right edge */
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Each row: full-width divider line, whole row clickable */
.t-linkrows > .t-linkrow {
  position: relative;
  max-width: none !important;
  margin: 0 calc(var(--t-gutter) * -1) !important;
  padding: clamp(1.75rem, 4vw, 3.75rem) var(--t-lr-side) !important;
  border-bottom: 1px solid rgba(159, 151, 134, .45);
}

/* Title: Rhode 100px / 91px, taupe, no underline */
.t-linkrows .t-linkrow h2 {
  font-size: var(--t-lr-fs) !important;
  line-height: .91 !important;
  letter-spacing: 0 !important;
  color: var(--t-taupe) !important;
  transition: color .25s;
}
.t-linkrows .t-linkrow h2 a {
  color: inherit !important;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
.t-linkrows .t-linkrow h2 a::after { content: ''; position: absolute; inset: 0; }

/* Subtitle: Jost 26px / 113%, uppercase */
.t-linkrows .t-linkrow p {
  font-family: 'Jost', sans-serif !important;
  font-size: clamp(.75rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase;
  color: var(--t-taupe);
  opacity: 1 !important;
  max-width: none !important;
  margin: clamp(.4rem, 1.4vw, 1.25rem) auto 0 !important;
  transition: color .25s;
}

/* Arrow on the right */
.t-linkrows .t-linkrow::after {
  content: '→';
  position: absolute;
  top: 50%;
  right: var(--t-lr-icon);
  transform: translateY(-50%);
  font-family: 'Jost', sans-serif;
  font-size: clamp(1.25rem, 2.6vw, 2.5rem);
  line-height: 1;
  color: var(--t-taupe);
  transition: transform .25s, color .25s;
}

/* Hover: everything turns cream, arrow nudges right */
.t-linkrows .t-linkrow:hover h2,
.t-linkrows .t-linkrow:hover p,
.t-linkrows .t-linkrow:hover::after { color: var(--t-cream) !important; }
.t-linkrows .t-linkrow:hover::after { transform: translate(.4rem, -50%); }

/* "Programs" is the active row: always cream, like Figma */
.t-linkrows > .t-linkrow:nth-child(2) h2,
.t-linkrows > .t-linkrow:nth-child(2) p,
.t-linkrows > .t-linkrow:nth-child(2)::after { color: var(--t-cream) !important; }

/* "Stories From The Republic": cream title, plus icon, no line under it */
.t-linkrows > .t-storyrow { border-bottom: 0; }
.t-linkrows .t-storyrow h2 { color: var(--t-cream) !important; }
.t-linkrows .t-storyrow::after {
  content: '+';
  color: var(--t-cream);
  font-size: clamp(1.5rem, 3vw, 2.75rem);
}
.t-linkrows .t-storyrow:hover::after { transform: translateY(-50%); }
.t-linkrows .t-storyrow[role="button"] { cursor: pointer; }
.t-linkrows .t-storyrow.is-open::after,
.t-linkrows .t-storyrow.is-open:hover::after { transform: translateY(-50%) rotate(45deg); }

/* Mobile: 39px titles, small subtitles */
@media (max-width: 781px) {
  .t-linkrows { --t-lr-side: 2.75rem; --t-lr-icon: 1.25rem; }
  .t-linkrows > .t-linkrow { padding-top: 2.25rem !important; padding-bottom: 2.25rem !important; }
  .t-linkrows .t-linkrow p { font-size: .75rem !important; }
}

/* =========================================================
   SECTION 13 – Stories From The Republic (testimonials)
   ========================================================= */
.t-storiesec {
  --t-st-line: rgba(14, 60, 39, .25);
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Three columns, full width, thin dividers between them */
.t-storiesec > .t-stories {
  display: flex !important;
  gap: 0 !important;
  max-width: none !important;
  margin: 0 calc(var(--t-gutter) * -1) !important;
  text-align: left;
}
.t-storiesec .t-stories > .wp-block-column {
  display: flex;
  flex-direction: column;
  flex: 1 1 0 !important;
  margin: 0 !important;
  padding: clamp(2rem, 4.5vw, 4.25rem) clamp(1.5rem, 4.4vw, 4.125rem) clamp(2.5rem, 5.6vw, 5.25rem) !important;
}
.t-storiesec .t-stories > .wp-block-column + .wp-block-column { border-left: 1px solid var(--t-st-line); }

/* Quote: Garamond 26px / 113%, pushes avatar + name to the bottom */
.t-storiesec .t-stories > .wp-block-column > p:first-child {
  flex: 1 0 auto;
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: 14em !important;
  margin: 0 0 clamp(2rem, 4vw, 4rem) !important;
}

/* Avatar: round, ~93px */
.t-storiesec .t-avatar {
  text-align: left !important;
  max-width: none !important;
  margin: 0 !important;
}
.t-storiesec .t-avatar img {
  display: block;
  width: clamp(2.5rem, 6.1vw, 5.8rem) !important;
  height: clamp(2.5rem, 6.1vw, 5.8rem) !important;
  border-radius: 50%;
  object-fit: cover;
}

/* Name: Futura-style (Jost Medium) 22px, uppercase */
.t-storiesec .t-name {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
  font-size: clamp(.9375rem, 1.45vw, 1.375rem) !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase;
  max-width: none !important;
  margin: clamp(.75rem, 1.6vw, 1.5rem) 0 0 !important;
}

/* Open / close (only once the script has run, so it never hides content without JS) */
.t-storiesec.is-collapsible {
  display: grid !important;
  grid-template-rows: 0fr;
  transition: grid-template-rows .5s ease;
}
.t-storiesec.is-collapsible.is-open { grid-template-rows: 1fr; }
.t-storiesec.is-collapsible > .t-stories { min-height: 0; overflow: hidden; }

/* Mobile: stacked, horizontal dividers, 20px quotes, 40px avatars */
@media (max-width: 781px) {
  .t-storiesec > .t-stories { flex-direction: column; }
  .t-storiesec .t-stories > .wp-block-column {
    padding: 1.75rem 1.25rem 2rem !important;
  }
  .t-storiesec .t-stories > .wp-block-column + .wp-block-column {
    border-left: 0;
    border-top: 1px solid var(--t-st-line);
  }
  .t-storiesec .t-stories > .wp-block-column > p:first-child {
    font-size: 1.25rem !important;
    max-width: none !important;
    margin-bottom: 1.75rem !important;
  }
  .t-storiesec .t-name { font-size: .9375rem !important; }
}

/* =========================================================
   SECTION 14 – Pillars strip + Footer
   ========================================================= */
.t-footer {
  --t-ft-side: clamp(1.25rem, 5.5vw, 5.25rem);
  --t-ft-small: clamp(.875rem, 1.1vw, 1.0625rem);
  background: var(--t-green);
  color: var(--t-cream);
}

/* ---- Pillars: Philosophy | Institution | Reform ---- */
.t-pillars .t-menu {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.t-pillars .t-menu li { position: relative; }
.t-pillars .t-menu a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: clamp(4rem, 7.3vw, 6.875rem);
  padding: 0 1rem;
  font-family: var(--t-display) !important;
  font-size: clamp(1.75rem, 3.77vw, 3.5625rem);
  line-height: 1;
  text-transform: uppercase;
  color: var(--t-green);
  background: #D9CBA1;
  transition: color .2s;
}
.t-pillars .t-menu li:nth-child(2) a { background: var(--t-pink); }
.t-pillars .t-menu li:nth-child(3) a { background: #C4E2AD; }
.t-pillars .t-menu a:hover { color: var(--t-red); }

/* Green logo on each boundary between the blocks */
.t-pillars .t-menu li + li::before {
  content: '';
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 0;
  width: clamp(1.25rem, 1.9vw, 1.75rem);
  height: clamp(1.25rem, 1.9vw, 1.75rem);
  transform: translate(-50%, -50%);
  background: url('../img/tyren-logo-green.png') center / contain no-repeat;
  pointer-events: none;
}

/* ---- Main footer: org + address | email + phone | 4 link columns ---- */
.t-footer__main {
  display: grid;
  grid-template-columns: 1.45fr 1.35fr repeat(4, 1fr);
  gap: clamp(1.5rem, 3vw, 3rem);
  padding: clamp(3rem, 6.6vw, 6rem) var(--t-ft-side) clamp(3rem, 6.4vw, 6rem);
}
.t-footer__main,
.t-footer__main p,
.t-footer__main a,
.t-footer__main span,
.t-footer__bottom,
.t-footer__bottom span { font-family: 'Jost', sans-serif !important; }

.t-footer__brand,
.t-footer__contact {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2.5rem;
}
.t-footer__org {
  font-size: clamp(1rem, 1.35vw, 1.25rem) !important;
  line-height: 1.2 !important;
  text-transform: uppercase;
  color: var(--t-taupe);
  max-width: 12em;
  margin: 0 !important;
}
.t-footer__label {
  display: block;
  font-size: var(--t-ft-small);
  text-transform: uppercase;
  color: var(--t-taupe);
}
.t-footer__item p {
  font-size: var(--t-ft-small) !important;
  line-height: 1.4 !important;
  margin: .6rem 0 0 !important;
}

/* Link columns */
.t-footer h4 {
  font-family: 'Jost', sans-serif !important;
  font-size: var(--t-ft-small);
  font-weight: 500 !important;
  letter-spacing: 0;
  text-transform: uppercase;
  color: var(--t-cream);
  margin: 0 0 clamp(1rem, 2.1vw, 2rem);
}
.t-footer__col .t-menu {
  display: grid;
  gap: clamp(.9rem, 2.1vw, 2rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.t-footer__col .t-menu a { font-size: var(--t-ft-small); opacity: .85; }

.t-footer a { color: inherit; text-decoration: none; transition: color .2s, opacity .2s; }
.t-footer__main a:hover { color: var(--t-red); opacity: 1; }

/* ---- Bottom bar: socials left, copyright right ---- */
.t-footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding: clamp(1rem, 2.1vw, 1.75rem) var(--t-ft-side);
  border-top: 1px solid rgba(243, 236, 221, .25);
  font-size: clamp(.625rem, .75vw, .75rem);
}
.t-socials { display: flex; gap: clamp(1rem, 1.6vw, 1.5rem); margin: 0; }
.t-socials svg { width: clamp(1rem, 1.25vw, 1.25rem); height: clamp(1rem, 1.25vw, 1.25rem); display: block; }
.t-socials a:hover { color: var(--t-red); }

/* ---- Tablet: brand + contact on one row, links on the next ---- */
@media (max-width: 1023px) {
  .t-footer__main { grid-template-columns: repeat(4, 1fr); }
  .t-footer__brand,
  .t-footer__contact { grid-column: span 2; }
}

/* ---- Mobile: stacked pillars, 2 × 2 links, centred bottom bar ---- */
@media (max-width: 767px) {
  .t-pillars .t-menu a {
    height: 3.25rem;
    padding: 0 .25rem;
    font-size: 5.2vw;            /* all three words fit in one row */
  }
  .t-pillars .t-menu li + li::before {
    width: .875rem;
    height: .875rem;
  }

  .t-footer__main {
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem 1.5rem;
  }
  .t-footer__brand,
  .t-footer__contact { grid-column: 1 / -1; gap: 1.5rem; }
  .t-footer__org { font-size: 1.125rem !important; }
  .t-footer__label,
  .t-footer__item p,
  .t-footer h4,
  .t-footer__col .t-menu a { font-size: .9375rem !important; }
  .t-footer__col .t-menu { gap: 1rem; }

  .t-footer__bottom {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: .75rem;
  }
}

/* Youth Republic image: full bleed, no side gaps, sits on the pillars */
.t-section.t-republic.t-republic { padding-bottom: 0 !important; }
.t-section.t-republic > .t-bleed {
  margin-left: calc(var(--t-gutter) * -1) !important;
  margin-right: calc(var(--t-gutter) * -1) !important;
  border-radius: 0;
}
.t-section.t-republic > .t-bleed img { border-radius: 0 !important; }

/* No gap between the last section and the footer (Astra wrappers) */
.ast-page-builder-template #primary,
.ast-page-builder-template .site-main,
.ast-page-builder-template .site-main > article,
.ast-page-builder-template .entry-content {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.ast-page-builder-template .entry-content > :last-child { margin-bottom: 0 !important; }
.ast-page-builder-template .site-content > .ast-container { padding-bottom: 0 !important; }
.t-section.t-republic { margin-bottom: 0 !important; }

/* Remove the empty leftover paragraph WordPress adds after the page content */
.ast-page-builder-template .site-main > article > p:empty,
.ast-page-builder-template .site-main > article > p:has(> :only-child:is(br)) {
  display: none !important;
  margin: 0 !important;
}

/* Header (ABOUT / LENS): Futura-style (Jost Medium) 16px, like Figma */
.t-header,
.t-header .t-menu,
.t-header .t-menu a {
  font-family: 'Jost', sans-serif !important;
  font-weight: 500 !important;
}
.t-header {
  font-size: clamp(.8125rem, 1.06vw, 1rem);
  letter-spacing: 0;
  padding: clamp(1rem, 3.3vw, 3.125rem) clamp(1.25rem, 2.8vw, 2.75rem);
}

	/* =========================================================
   EDITOR PREVIEW – make the block editor look like the live site
   (only affects the editor, not the live site)
   ========================================================= */
.editor-styles-wrapper .is-root-container > * + * { margin-top: 0 !important; }

.editor-styles-wrapper .t-section h1,
.editor-styles-wrapper .t-section h2,
.editor-styles-wrapper .t-section h3,
.editor-styles-wrapper .t-section h4 {
  color: inherit;
}

.editor-styles-wrapper .t-mindfire .t-mf-crown,
.editor-styles-wrapper .t-mindfire .t-reborn-mark {
  margin-left: auto !important;
  margin-right: auto !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
}
.editor-styles-wrapper .t-mindfire .t-mf-crown img,
.editor-styles-wrapper .t-mindfire .t-reborn-mark img {
  width: calc(var(--t-mf-fs) * 1.85) !important;
  max-width: 100% !important;
  margin: 0 auto;
  display: block;
}

/* =========================================================
   FIX 1 – Same side gap for every full-width image (matches hero)
   ========================================================= */
:root { --t-inset: clamp(.45rem, 1.2vw, 1.125rem); }

.t-section > .t-bleed {
  width: auto !important;
  max-width: none !important;
  margin-left: calc(var(--t-inset) - var(--t-gutter)) !important;
  margin-right: calc(var(--t-inset) - var(--t-gutter)) !important;
  border-radius: clamp(.35rem, .6vw, 1rem);
  overflow: hidden;
}

.t-section > .t-bleed--bottom { margin-bottom: 0 !important; }
.t-section:has(> .t-bleed--bottom) { padding-bottom: var(--t-inset) !important; }

/* =========================================================
   FIX 2 – Manifesto: all three arrow lines share one width (Figma)
   Desktop/tablet only – mobile layout untouched
   ========================================================= */
@media (min-width: 768px) {
  .t-manifesto h2:not(.t-born):has(img) {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: .1em;
    width: min(8.7em, 100%);
    margin-left: auto !important;
    margin-right: auto !important;
    word-spacing: 0;
  }
  .t-manifesto h2:not(.t-born):has(img) img {
    flex: 1 1 0;
    min-width: 0;
    width: auto !important;
    height: .78em !important;
    aspect-ratio: auto !important;
    object-fit: cover;
    margin: 0 !important;
  }
}

/* =========================================================
   FIX 1b – Lock section side padding so image gaps match the hero
   ========================================================= */
.t-section:not(.t-hero) {
  padding-left: var(--t-gutter) !important;
  padding-right: var(--t-gutter) !important;
}

/* =========================================================
   ABOUT PAGE
   ========================================================= */

/* ---- A1. Hero: crowd photo, 157px headline, 26px text ---- */
.t-ab-hero {
  --t-ab-fs: clamp(3.5rem, 9.92vw, 9.375rem);          
  --t-ab-ratio: 952 / 1488;                             
  background: var(--t-green) !important;
  min-height: 0 !important;
  height: calc((100vw - 2 * var(--t-inset)) * var(--t-ab-ratio) + 2 * var(--t-inset)) !important;
  margin: 0 !important;
  padding: 14vw var(--t-gutter) 3vw !important;         
  align-items: flex-start !important;
  text-align: center;
}

/* Photo + overlay: inset on all sides, rounded like your other images */
.t-ab-hero .wp-block-cover__image-background,
.t-ab-hero .wp-block-cover__background {
  top: var(--t-inset) !important;
  left: var(--t-inset) !important;
  right: auto !important;
  bottom: auto !important;
  width: calc(100% - 2 * var(--t-inset)) !important;
  height: calc(100% - 2 * var(--t-inset)) !important;
  object-fit: cover;
  border-radius: clamp(.35rem, .6vw, 1rem);
}

.t-ab-hero .wp-block-cover__inner-container { color: var(--t-cream); }
.t-ab-hero h1 {
  font-family: var(--t-display) !important;
  font-weight: 400 !important;
  font-size: var(--t-ab-fs) !important;
  line-height: .907 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase;
  color: var(--t-cream) !important;
  margin: 0 !important;
}
.t-ab-hero p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.16 !important;
  max-width: min(36.5rem, 90%);
  margin: clamp(1.5rem, 5.3vw, 5rem) auto 0 !important;
  color: var(--t-cream) !important;
}
.t-ab-hero .t-ab-chevron {
  font-size: 0 !important;
  height: clamp(1.75rem, 2.6vw, 2.5rem);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: clamp(1rem, 3.3vw, 3rem) !important;
}
.t-ab-hero .t-ab-chevron::before {
  content: '';
  width: clamp(.95rem, 1.4vw, 1.35rem);
  height: clamp(.95rem, 1.4vw, 1.35rem);
  border-right: clamp(.25rem, .4vw, .375rem) solid currentColor;
  border-bottom: clamp(.25rem, .4vw, .375rem) solid currentColor;
  transform: translateY(-30%) rotate(45deg);
}

/* ---- A2. Pillars strip: identical to the footer's (removes Astra's content-list styles) ---- */
.t-ab-pillars { margin: 0 !important; max-width: none !important; }
.t-ab-pillars .t-menu {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.t-ab-pillars .t-menu li { margin: 0 !important; padding: 0 !important; }
.t-ab-pillars .t-menu a {
  color: var(--t-green) !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.t-ab-pillars .t-menu a:hover { color: var(--t-red) !important; }

/* ---- A3. Intro + NOT / WE ARE ---- */
.t-ab-notwe {
  --t-ab-nw-fs: clamp(2.75rem, 6.6vw, 6.25rem);   /* 100px headings */
  --t-ab-nw-text: clamp(.9375rem, 1.72vw, 1.625rem); /* 26px text */
  padding-top: clamp(3rem, 6.2vw, 6rem) !important;
  padding-bottom: clamp(2.5rem, 3.1vw, 3rem) !important;
}

/* Intro: 26px / 113%, ~833px wide */
.t-ab-notwe .t-ab-lead {
  font-size: var(--t-ab-nw-text) !important;
  line-height: 1.13 !important;
  max-width: min(52rem, 92%) !important;
  margin: 0 auto !important;
}

/* Two columns meeting slightly left of centre, 88px apart */
.t-ab-notwe .t-ab-cols {
  display: flex !important;
  justify-content: center;
  gap: clamp(1.25rem, 5.8vw, 5.5rem) !important;
  max-width: none !important;
  margin-top: clamp(2.5rem, 6.6vw, 6.25rem) !important;
  transform: translateX(-1.4vw);
}
.t-ab-notwe .t-ab-cols > .wp-block-column {
  flex: 0 0 auto !important;
  width: min(25vw, 24rem);
  margin: 0 !important;
}

/* Headings: Rhode 100px */
.t-ab-notwe h2 {
  font-size: var(--t-ab-nw-fs) !important;
  line-height: .9 !important;
  letter-spacing: 0 !important;
  margin: 0 0 clamp(1.5rem, 4.2vw, 4rem) !important;
}
.t-ab-not h2 { color: var(--t-taupe) !important; text-align: right; }
.t-ab-we  h2 { color: var(--t-green) !important; text-align: left; }

/* Items: 26px / 113%, ~293px wide, ~43px apart */
.t-ab-notwe ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: clamp(1.25rem, 2.85vw, 2.7rem);
}
.t-ab-notwe li {
  position: relative;
  font-size: var(--t-ab-nw-text);
  line-height: 1.13;
  max-width: 11.3em;
}

/* NOT: grey-brown, right-aligned, red × after */
.t-ab-not ul { justify-items: end; }
.t-ab-not li { color: #6A6658; text-align: right; padding-right: 1em; }
.t-ab-not li::after {
  content: '×';
  position: absolute;
  right: 0;
  top: -.1em;
  font-family: 'Jost', sans-serif;
  font-size: 1.05em;
  line-height: 1;
  color: var(--t-red);
}

/* WE ARE: green, left-aligned, red TYREN logo before */
.t-ab-we ul { justify-items: start; }
.t-ab-we li { color: var(--t-green); text-align: left; padding-left: 1.05em; }
.t-ab-we li::before {
  content: '';
  position: absolute;
  left: 0;
  top: .3em;
  width: .6em;
  height: .6em;
  background: url('/wp-content/uploads/2026/10/tyren-logo.png') center / contain no-repeat;
}

/* ---- A4. Why Now? ---- */
.t-ab-why {
  --t-why-fs: clamp(3.5rem, 9.92vw, 9.375rem);  
  --t-why-pad: 4.3vw;                            
  --t-why-gap: 8.35vw;                          
  --t-why-art: 6.37vw;                        
  --t-why-man: 2.47vw;                         
  --t-why-space: 1.19vw;                         
  /* where green meets black = bottom of the people row */
  --t-why-line: calc(var(--t-why-pad) + var(--t-why-fs) * .907 + var(--t-why-gap) + var(--t-why-art));

  background:
    linear-gradient(var(--t-green), var(--t-green)) center var(--t-why-line) / 9.06vw 100% no-repeat,
    linear-gradient(to bottom, var(--t-green) var(--t-why-line), var(--t-ink) var(--t-why-line)) !important;
  padding-top: var(--t-why-pad) !important;
  padding-bottom: 4.3vw !important;
}

/* Heading: 150px / 136px */
.t-ab-why h2 {
  font-size: var(--t-why-fs) !important;
  line-height: .907 !important;
  letter-spacing: 0 !important;
  margin: 0 !important;
}

/* People row standing on the green/black line, logo in the middle */
.t-ab-why > .t-why-art {
  position: relative;
  height: var(--t-why-art);
  max-width: none !important;
  margin: var(--t-why-gap) calc(var(--t-gutter) * -1) 0 !important;
}
.t-why-left,
.t-why-right {
  position: absolute;
  bottom: 0;
  display: flex;
  gap: var(--t-why-space);
}
.t-why-left  { right: calc(50% + 5.75vw); }
.t-why-right { left:  calc(50% + 5.8vw); }
.t-why-art i {
  display: block;
  width: var(--t-why-man);
  height: var(--t-why-art);
  -webkit-mask: url('/wp-content/uploads/2026/10/cartoon.png') center bottom / contain no-repeat;
          mask: url('/wp-content/uploads/2026/10/cartoon.png') center bottom / contain no-repeat;
}
.t-why-left i  { background: var(--t-taupe); }
.t-why-right i { background: var(--t-cream); }

.t-why-logo {
  position: absolute;
  left: 50%;
  bottom: -5.2vw;
  width: 8.8vw !important;
  height: auto !important;
  transform: translateX(-50%);
}

/* Text: 26px / 113%, ~934px wide, starts ~213px below the line */
.t-ab-why p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(58.4rem, 92%) !important;
  margin: 0 auto !important;
  position: relative;
}
.t-ab-why > .t-why-art + p { margin-top: 14vw !important; }
.t-ab-why > p + p { margin-top: .7em !important; }

/* ---- A5. Our Mission: DRIVE / KEEP / CRAVE / IDEAL ---- */
.t-ab-mission {
  --t-mis-fs: clamp(3.5rem, 10.4vw, 9.8rem);       /* 157px words */
  padding-top: clamp(3.5rem, 7vw, 6.625rem) !important;
  padding-bottom: clamp(4rem, 12.3vw, 11.625rem) !important;
}

/* Label: Jost 30px / 48px, red (shared by Mission, Vision, Method) */
.t-ab-label {
  font-family: 'Jost', sans-serif !important;
  font-size: clamp(1.0625rem, 1.98vw, 1.875rem) !important;
  line-height: 1.6 !important;
  letter-spacing: -.01em !important;
  text-transform: uppercase;
  color: var(--t-red) !important;
  max-width: none !important;
  margin: 0 auto !important;
}

/* Word stack */
.t-ab-mission > .t-mis {
  max-width: none !important;
  margin-top: clamp(2rem, 4.5vw, 4.25rem) !important;
}
.t-mis-row {
  display: flex;
  justify-content: center;
}
.t-mis-word {
  position: relative;
  display: inline-flex;
  align-items: flex-end;
  gap: .04em;
  font-family: var(--t-display) !important;
  font-size: var(--t-mis-fs);
  line-height: .855;
  text-transform: uppercase;
  color: var(--t-green);
}

/* Coloured squares on the baseline */
.t-sq {
  display: block;
  flex: none;
  width: .16em;
  height: .16em;
  margin-bottom: .07em;
}
.t-sq--pink { background: #D9707E; }
.t-sq--mint { background: #9FD2B0; }
.t-sq--tan  { background: #E9C98D; }
.t-sq--blue { background: #8EC9DA; }

/* Side notes: Garamond 26px / 113%, bottom-aligned with the word */
.t-mis-note {
  position: absolute;
  bottom: .07em;
  width: 21.6vw;
  font-family: var(--t-body) !important;
  font-size: clamp(.875rem, 1.72vw, 1.625rem);
  line-height: 1.13;
  text-transform: none;
  color: var(--t-green);
}
.t-mis-note--r { left:  calc(100% + .14em); text-align: left; }
.t-mis-note--l { right: calc(100% + .15em); text-align: right; }

/* ---- A6. Our Vision ---- */
.t-ab-vision {
  --t-vis-fs: clamp(3.5rem, 9.92vw, 9.375rem);     /* 150px heading */
  isolation: isolate;
  padding-top: 5.36vw !important;                  /* 81px above the label */
  padding-bottom: 10.3vw !important;               /* 156px below the text */
}

/* Heading: 150px / 136px, cream, 3 lines */
.t-ab-vision h2 {
  font-size: var(--t-vis-fs) !important;
  line-height: .907 !important;
  letter-spacing: 0 !important;
  margin: 4.23vw auto 0 !important;                /* 64px below the label */
}

/* Africa map: right side, overlapping the end of "ORGANISATION" */
.t-ab-vision > .t-vis-map {
  position: absolute !important;
  z-index: 1;
  top: 33.2vw;
  left: 67.9vw;
  width: 23.5vw !important;
  max-width: none !important;
  margin: 0 !important;
  pointer-events: none;
}
.t-ab-vision .t-vis-map img { display: block; width: 100% !important; height: auto !important; }

/* Text: 26px / 113%, ~588px wide */
.t-ab-vision p:not(.t-ab-label) {
  position: relative;
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(36.75rem, 92%) !important;
  margin-bottom: 0 !important;
}
.t-ab-vision > .t-vis-map + p { margin-top: 7.3vw !important; }   /* 110px below the heading */
.t-ab-vision > p + p { margin-top: 1.27em !important; }

/* ---- A7. Our Method: THE IDEA FRAMEWORK ---- */
.t-ab-method {
  --t-me-fs: clamp(3.5rem, 9.92vw, 9.375rem);      /* 150px THE / FRAMEWORK */
  padding-top: 2.7vw !important;
  padding-bottom: 3.1vw !important;
}

/* THE / FRAMEWORK: Rhode 150px / 136px, taupe */
.t-ab-method h2 {
  font-size: var(--t-me-fs) !important;
  line-height: .907 !important;
  letter-spacing: 0 !important;
  color: var(--t-taupe) !important;
  margin: 0 !important;
}
.t-ab-method > .t-ab-label + h2 { margin-top: 2vw !important; }

/* Letters: almost edge to edge, A slightly wider, ~23px apart */
.t-ab-method > .t-idea {
  display: grid;
  grid-template-columns: 336fr 336fr 336fr 371fr;
  gap: 1.5vw;
  align-items: end;
  max-width: none !important;
  margin: 1.05vw calc(2.4vw - var(--t-gutter)) 0 !important;
}
.t-idea img { display: block; width: 100%; height: auto; }
.t-ab-method > .t-idea + h2 { margin-top: 2vw !important; }

/* Hover: the letter fills with its photo, cut to the letter's exact shape */
.t-idea__l {
  position: relative;
  display: block;
}
.t-idea__l::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--t-p) center / cover no-repeat;
  -webkit-mask: var(--t-m) center / 100% 100% no-repeat;
          mask: var(--t-m) center / 100% 100% no-repeat;
  opacity: 0;
  transition: opacity .45s ease;
  pointer-events: none;
}
.t-idea__l:hover::after { opacity: 1; }

/* Text: 26px / 113%, green */
.t-ab-method p:not(.t-ab-label) {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  max-width: min(46rem, 92%) !important;
  margin: 2.4vw auto 0 !important;
}

/* ---- A8. Phases accordion: Inculcation / Development / Expansion / Actualization ---- */
.t-phases { max-width: none !important; margin: 0 !important; }

.t-phase { --t-ph-c: #E2AAAA; background: var(--t-ph-c); margin: 0; }
.t-phase--pink   { --t-ph-c: #E2AAAA; }
.t-phase--yellow { --t-ph-c: #FFE09E; }
.t-phase--blue   { --t-ph-c: #ADD3E6; }
.t-phase--mint   { --t-ph-c: #8FCBA0; }

/* Bar: heading + subtitle, toggle on the right */
.t-phase > summary {
  position: relative;
  display: block;
  list-style: none;
  cursor: default;
  pointer-events: none;
  text-align: center;
  padding: 5.2vw var(--t-gutter) 3.2vw;
}

/* Inculcation: clickable toggle (the other phases stay locked) */
.t-phase--pink > summary { cursor: pointer; pointer-events: auto; }
.t-phase--pink > summary:focus-visible { outline: 2px solid var(--t-green); outline-offset: -6px; }

/* Smooth open/close slide (modern browsers; others simply open/close instantly) */
.t-phase--pink { interpolate-size: allow-keywords; }
.t-phase--pink::details-content {
  block-size: 0;
  overflow: hidden;
  transition: block-size .5s ease, content-visibility .5s allow-discrete;
}
.t-phase--pink[open]::details-content { block-size: auto; }

.t-phase > summary::-webkit-details-marker { display: none; }
/* Toggle icon drawn with two lines: "—" = horizontal only, "+" = horizontal + vertical */
.t-phase > summary::before,
.t-phase > summary::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 5.75vw;
  width: clamp(1rem, 1.9vw, 1.75rem);
  height: clamp(2px, .18vw, 3px);
  background: var(--t-green);
  transform: translateY(-50%);
}
.t-phase > summary::after { transform: translateY(-50%) rotate(90deg); }   /* vertical line */
.t-phase[open] > summary::after { display: none; }                         /* open = "—" only */

/* Heading: Rhode 100px, block letter first */
.t-phase h2 {
  display: block;
  margin: 0 !important;
  font-size: clamp(2.5rem, 6.6vw, 6.25rem) !important;
  line-height: .91 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase;
  color: var(--t-green) !important;
}

/* Block letter: exactly the capital height, on the text baseline */
.t-phase h2 img {
  display: inline-block !important;
  height: .79em !important;          /* fallback for older browsers */
  height: 1cap !important;           /* exact capital-letter height of the font */
  width: auto !important;
  max-width: none !important;
  vertical-align: baseline !important;
  margin: 0 .04em 0 0 !important;
}

/* Subtitle: Jost 20px uppercase */
.t-phase .t-phase__sub {
  font-family: 'Jost', sans-serif !important;
  font-size: clamp(.75rem, 1.32vw, 1.25rem) !important;
  line-height: 1.3 !important;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--t-green);
  max-width: none !important;
  margin: 2.1vw 0 0 !important;
}

/* Open panel: green, pink text */
.t-phase__body {
  background: var(--t-green);
  color: var(--t-pink);
  text-align: center;
  padding: 8.6vw var(--t-gutter) 10.6vw;
}
.t-phase__body p {
  font-size: clamp(.9375rem, 1.45vw, 1.375rem) !important;
  line-height: 1.32 !important;
  color: var(--t-pink);
  max-width: 52vw;
  margin: 0 auto !important;
}

/* Five icons, ~287px apart */
.t-phase__grid {
  display: grid;
  grid-template-columns: repeat(5, 16.5vw);
  justify-content: center;
  column-gap: 2.5vw;
  margin: 9.1vw auto 8.6vw;
}
.t-phase__item img {
  display: block;
  height: 6.2vw;
  width: auto;
  margin: 0 auto;
}
.t-phase__item h3 {
  font-family: 'Jost', sans-serif !important;
  font-weight: 400 !important;
  font-size: clamp(.875rem, 1.45vw, 1.375rem) !important;
  line-height: 1.2 !important;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--t-pink) !important;
  margin: 1.5vw 0 1.7vw !important;
}
.t-phase__item p { max-width: none; }

/* ---- A9. Our Tools: The ReformTech Platform ---- */
.t-ab-tools {
  --t-to-fs: clamp(3.5rem, 9.92vw, 9.375rem);      /* 150px heading */
  padding-top: 5vw !important;                     /* ~75px above the label */
  padding-bottom: 6.2vw !important;                /* ~93px below the columns */
}

/* "Our Tools": Pacifico 43px / 48px, red */
.t-ab-tools .t-ab-script {
  font-family: 'Pacifico', cursive !important;
  font-size: clamp(1.75rem, 2.85vw, 2.6875rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.01em !important;
  color: var(--t-red) !important;
  max-width: none !important;
  margin: 0 auto !important;
}

/* Heading: Rhode 150px / 136px */
.t-ab-tools h2 {
  font-size: var(--t-to-fs) !important;
  line-height: .907 !important;
  letter-spacing: 0 !important;
  margin: 3.1vw auto 0 !important;
}

/* Intro: Garamond 22px / 29px, ~586px wide */
.t-ab-tools .t-ab-tools__intro {
  font-size: clamp(1rem, 1.45vw, 1.375rem) !important;
  line-height: 1.32 !important;
  max-width: min(36.6rem, 92%) !important;
  margin: 1.8vw auto 0 !important;
}

/* Three columns at ~19% / 52% / 84% across */
.t-ab-tools > .t-pillar3 {
  display: grid;
  grid-template-columns: 37.6fr 28.8fr 33.6fr;
  align-items: start;
  max-width: none !important;
  margin: 4vw calc(var(--t-gutter) * -1) 0 !important;
}
.t-pillar3__item { text-align: center; }
.t-pillar3__item img {
  display: block;
  height: 9.5vw;
  width: auto;
  margin: 0 auto;
}
.t-pillar3__item h3 {
  font-size: clamp(1.75rem, 3.3vw, 3.125rem) !important;   /* 50px */
  line-height: .91 !important;
  letter-spacing: 0 !important;
  color: var(--t-cream) !important;
  margin: 2.6vw 0 0 !important;
}
.t-pillar3__item p {
  font-size: clamp(.9375rem, 1.45vw, 1.375rem) !important;
  line-height: 1.32 !important;
  max-width: 18.7vw !important;
  margin: 1.8vw auto 0 !important;
}

/* ---- A10. Program cards: REDDD / Volumers / MindShift / Civiqi ---- */
.t-progs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: none !important;
  margin: 0 !important;
}

/* Card: 378 × 604 (Figma) – explicit height, so it can never collapse */
.t-prog {
  --t-pc-w: 25vw;                 /* card width: 4 per row on desktop */
  --t-pc-bg: var(--t-red);
  --t-pc-tag: var(--t-ink);
  --t-pc-logo: 74%;
  position: relative;
  display: block !important;
  width: 100% !important;
  height: calc(var(--t-pc-w) * 1.598) !important;   /* 604 ÷ 378 */
  overflow: hidden;
  background: var(--t-pc-bg);
  text-decoration: none !important;
  color: inherit;
}

.t-prog--reddd     { --t-pc-bg: #F00000; --t-pc-tag: #0C0C0C;       --t-pc-logo: 74%; }
.t-prog--volumers  { --t-pc-bg: #FFDA8F; --t-pc-tag: var(--t-green); --t-pc-logo: 71%; }
.t-prog--mindshift { --t-pc-bg: #0A2BFF; --t-pc-tag: #0C0C0C;       --t-pc-logo: 86%; }
.t-prog--civiqi    { --t-pc-bg: #D4F3D3; --t-pc-tag: var(--t-green); --t-pc-logo: 56%; }

/* Hover photo + dark gradient */
.t-prog__bg {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
  opacity: 0;
  transition: opacity .5s ease;
}
.t-prog::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(to top, rgba(0, 0, 0, .6), rgba(0, 0, 0, .15) 55%, rgba(0, 0, 0, .25));
  opacity: 0;
  transition: opacity .5s ease;
}

/* Logo at the top (default + light version for hover) */
.t-prog__logo {
  position: absolute;
  z-index: 2;
  top: 6.5%;
  left: 50%;
  transform: translateX(-50%);
  width: var(--t-pc-logo) !important;
  max-width: none !important;
  height: auto !important;
  transition: opacity .4s ease;
}
.t-prog__logo--hover { opacity: 0; }

/* Tagline: Jost, bottom */
.t-prog__tag {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 9.4%;
  font-family: 'Jost', sans-serif !important;
  font-size: calc(var(--t-pc-w) * .055);
  line-height: 1.3;
  text-align: center;
  color: var(--t-pc-tag);
  transition: opacity .3s ease;
}

/* Hover description + arrow */
.t-prog__desc {
  position: absolute;
  z-index: 2;
  left: 12%;
  right: 12%;
  bottom: 15.3%;
  font-family: var(--t-body) !important;
  font-size: calc(var(--t-pc-w) * .0635);
  line-height: 1.15;
  text-align: center;
  color: var(--t-cream);
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity .45s ease, transform .45s ease;
}
.t-prog__arrow {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 5%;
  transform: translateX(-50%);
  font-family: 'Jost', sans-serif;
  font-size: calc(var(--t-pc-w) * .088);
  line-height: 1;
  color: var(--t-cream);
  opacity: 0;
  transition: opacity .45s ease .05s;
}

/* Hover (and keyboard focus) state */
.t-prog:hover .t-prog__bg,
.t-prog:focus-visible .t-prog__bg,
.t-prog:hover::after,
.t-prog:focus-visible::after { opacity: 1; }
.t-prog:hover .t-prog__logo--swap,
.t-prog:focus-visible .t-prog__logo--swap { opacity: 0; }
.t-prog:hover .t-prog__logo--hover,
.t-prog:focus-visible .t-prog__logo--hover { opacity: 1; }
.t-prog:hover .t-prog__tag,
.t-prog:focus-visible .t-prog__tag { opacity: 0; }
.t-prog:hover .t-prog__desc,
.t-prog:focus-visible .t-prog__desc { opacity: 1; transform: none; }
.t-prog:hover .t-prog__arrow,
.t-prog:focus-visible .t-prog__arrow { opacity: 1; }

/* Civiqi's hover background is green behind its photo */
.t-prog--civiqi:hover,
.t-prog--civiqi:focus-visible { background: var(--t-green); }

/* ---- A11. Join The Moving Train ---- */
.t-ab-train {
  --t-jt-ratio: 974 / 1512;                        /* photo height ÷ width (Figma) */
  min-height: 0 !important;
  height: calc(100vw * var(--t-jt-ratio)) !important;
  margin: 0 !important;
  padding: 18.5vw var(--t-gutter) 0 !important;    /* heading starts ~280px down */
  align-items: flex-start !important;
  text-align: center;
}
.t-ab-train .wp-block-cover__image-background { object-fit: cover; }
.t-ab-train .wp-block-cover__inner-container { color: var(--t-cream); }

/* Heading: Rhode 100px / 91px, cream */
.t-ab-train h2 {
  font-size: clamp(2.75rem, 6.6vw, 6.25rem) !important;
  line-height: .91 !important;
  letter-spacing: 0 !important;
  color: var(--t-cream) !important;
  margin: 0 !important;
}

/* Text: Garamond 22px, ~334px wide */
.t-ab-train p {
  font-size: clamp(1rem, 1.45vw, 1.375rem) !important;
  line-height: 1.32 !important;
  color: var(--t-cream) !important;
  max-width: min(21rem, 80%) !important;
  margin: 3.8vw auto 0 !important;
}

/* Button: dark green, cream Jost text, rounded */
.t-ab-train .wp-block-buttons { margin-top: 6vw !important; }
.t-ab-train .is-style-tyren .wp-block-button__link {
  background: var(--t-green);
  color: var(--t-cream);
  font-family: 'Jost', sans-serif !important;
  font-size: clamp(.75rem, 1.1vw, 1.0625rem);
  letter-spacing: .02em;
  padding: 1.3em 2.2em;
  border-radius: .8em;
}
.t-ab-train .is-style-tyren .wp-block-button__link:hover { background: var(--t-red); color: #fff; }

/* ---- Mobile ---- */
@media (max-width: 781px) {
  .t-ab-hero {
    --t-ab-fs: 16.5vw;
    height: auto !important;
    min-height: 100svh !important;
    padding-top: 8rem !important;
    padding-bottom: 3rem !important;
  }
  .t-ab-hero p { font-size: 1.125rem !important; }

   .t-ab-notwe { --t-ab-nw-fs: 13vw; --t-ab-nw-text: .9375rem; }
  .t-ab-notwe .t-ab-lead { font-size: 1.125rem !important; }
  .t-ab-notwe .t-ab-cols { gap: 1.25rem !important; transform: none; }
  .t-ab-notwe .t-ab-cols > .wp-block-column { width: calc(50% - .625rem); }
	
	  .t-ab-why {
    --t-why-fs: 16.5vw;
    --t-why-pad: 10vw;
    --t-why-gap: 8vw;
    --t-why-art: 11vw;
    --t-why-man: 4.2vw;
    --t-why-space: 1.6vw;
    padding-bottom: 3rem !important;
    background:
      linear-gradient(var(--t-green), var(--t-green)) center var(--t-why-line) / 15vw 100% no-repeat,
      linear-gradient(to bottom, var(--t-green) var(--t-why-line), var(--t-ink) var(--t-why-line)) !important;
  }
  .t-why-left  { right: calc(50% + 9vw); }
  .t-why-right { left:  calc(50% + 9vw); }
  .t-why-logo { width: 15vw !important; bottom: -8.5vw; }
  .t-ab-why p { font-size: 1.125rem !important; max-width: 88% !important; }
  .t-ab-why > .t-why-art + p { margin-top: 18vw !important; }
	
	  .t-ab-mission { --t-mis-fs: 20vw; }
  .t-mis-row + .t-mis-row { margin-top: 1rem; }
  .t-mis-word { flex-wrap: wrap; justify-content: center; }
  .t-mis-note {
    position: static;
    flex-basis: 100%;
    width: auto;
    max-width: 80vw;
    margin: .5rem auto 0;
    font-size: 1rem;
    text-align: center !important;
  }
	
	  .t-ab-vision {
    --t-vis-fs: 15vw;
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
  .t-ab-vision h2 { margin-top: 1.25rem !important; }
  .t-ab-vision > .t-vis-map {
    position: relative !important;
    top: auto;
    left: auto;
    width: 55vw !important;
    margin: 1.5rem auto 0 !important;
  }
  .t-ab-vision > .t-vis-map + p { margin-top: 1.5rem !important; }
  .t-ab-vision p:not(.t-ab-label) { font-size: 1.125rem !important; max-width: 88% !important; }
	
	  .t-ab-method {
    --t-me-fs: 15vw;
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }
  .t-ab-method > .t-ab-label + h2 { margin-top: .75rem !important; }
  .t-ab-method > .t-idea {
    gap: 2vw;
    margin: .75rem calc(1rem - var(--t-gutter)) 0 !important;
  }
  .t-ab-method p:not(.t-ab-label) {
    font-size: 1.125rem !important;
    max-width: 88% !important;
    margin-top: 1.25rem !important;
  }
    .t-phase > summary { padding: 2.75rem 1.25rem 1.75rem; }
    .t-phase > summary::before,
  .t-phase > summary::after {
    top: calc(2.75rem + 9.5vw * .91 / 2);
    right: 1.25rem;
    width: 1rem;
    height: 2px;
  }
  .t-phase h2 { font-size: 9.5vw !important; white-space: nowrap; }
  .t-phase .t-phase__sub {
    font-size: .6875rem !important;
    letter-spacing: .01em;
    max-width: 30em !important;
    margin: .75rem auto 0 !important;
  }
  .t-phase__body { padding: 3rem 1.25rem 3.5rem; }
  .t-phase__body p { max-width: 90%; }
  .t-phase__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5rem 1.25rem;
    margin: 2.5rem auto;
  }
  .t-phase__item { width: 42vw; }
  .t-phase__item img { height: 3.5rem; }
  .t-phase__item h3 { margin: .75rem 0 .5rem !important; }
	
	  .t-ab-tools {
    --t-to-fs: 15vw;
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
  .t-ab-tools h2 { margin-top: .75rem !important; }
  .t-ab-tools .t-ab-tools__intro { font-size: 1.125rem !important; margin-top: 1rem !important; }
  .t-ab-tools > .t-pillar3 {
    grid-template-columns: 1fr;
    row-gap: 2.5rem;
    margin: 2.5rem 0 0 !important;
  }
  .t-pillar3__item img { height: 6rem; }
  .t-pillar3__item h3 { margin-top: 1rem !important; }
  .t-pillar3__item p { max-width: 80% !important; margin-top: .75rem !important; }
	
  .t-progs { grid-template-columns: repeat(2, 1fr); }
  .t-prog { --t-pc-w: 50vw; }       /* 2 per row on phones */
	
	  .t-ab-train {
    height: auto !important;
    min-height: 120vw !important;
    padding: 30vw 1.25rem 4rem !important;
  }
  .t-ab-train h2 { font-size: 15vw !important; }
  .t-ab-train p { font-size: 1.0625rem !important; margin-top: 1.25rem !important; }
  .t-ab-train .wp-block-buttons { margin-top: 2rem !important; }
}

/* ---- Mobile END---- */

/* Centre logo on inner pages (About, Lens, …) */
.t-header__logo {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  line-height: 0;
}
.t-header__logo img {
  width: clamp(1.75rem, 2.4vw, 2.25rem);
  height: auto;
}

/* =========================================================
   REDDD PAGE
   ========================================================= */
/* KaiTi (Figma) – self-hosted file first, then system KaiTi, then a close fallback */
@font-face {
  font-family: 'KaiTi Web';
  src: url('../fonts/kaiti-latin.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root { --t-mono: 'KaiTi Web', 'KaiTi', 'STKaiti', 'Share Tech Mono', monospace; }

.t-section .t-rd-mono,
.t-rd-mono {
  font-family: var(--t-mono) !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: 0 !important;
}

/* Header: only BACK on program pages */
.t-header--program { justify-content: flex-start; }

/* ---- R1. Hero: red seats, logo sits 8px above the bottom ---- */
.t-rd-hero {
  min-height: 0 !important;
  height: 65.1vw !important;                       /* 1512 × 985 */
  margin: 0 !important;
  padding: 0 0 .5rem !important;                   /* 8px breathing space under the logo */
  align-items: flex-end !important;
  background: #8E0000 !important;                  /* matches the photo if it ever loads late */
}
.t-rd-hero .wp-block-cover__image-background,
.t-rd-photo .wp-block-cover__image-background {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
}
.t-rd-hero .t-rd-hero__logo { margin: 0 auto !important; width: 56.3vw !important; max-width: none !important; }
.t-rd-hero .t-rd-hero__logo img { display: block; width: 100% !important; height: auto !important; }

/* ---- R2. Red intro: cream mono heading with dark shadow ---- */
.t-rd-intro {
  background: var(--t-red) !important;
  color: var(--t-cream);
  padding-top: 12.4vw !important;
  padding-bottom: 7.5vw !important;
}
.t-rd-intro h2 {
  font-size: clamp(2rem, 5.16vw, 4.875rem) !important;   /* 78px */
  line-height: 1 !important;
  color: var(--t-cream) !important;
  text-shadow: .045em .045em 0 var(--t-ink);
  max-width: 7.6em !important;
  margin: 0 auto !important;
}
.t-rd-intro p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  color: var(--t-cream) !important;
  max-width: min(45.4rem, 92%) !important;
  margin: 10.7vw auto 0 !important;
}

/* ---- R3. Photo: red mono heading with cream shadow, two red stars ---- */
.t-rd-photo {
  min-height: 0 !important;
  height: 61.9vw !important;                       /* 1512 × 936 */
  margin: 0 !important;
  padding: 6vw var(--t-gutter) 0 !important;
  align-items: flex-start !important;
}
.t-rd-photo .wp-block-cover__image-background { object-fit: cover; }
.t-rd-photo::before,
.t-rd-photo::after {
  content: '';
  position: absolute;
  z-index: 2;
  top: 16vw;
  width: 2.8vw;
  height: 2.8vw;
  background: url('/wp-content/uploads/2026/10/reddd-star.png') center / contain no-repeat;
}
.t-rd-photo::before { left: 10%; }
.t-rd-photo::after  { right: 11%; top: 15vw; }
.t-rd-photo h2 {
  font-size: clamp(2rem, 5.16vw, 4.875rem) !important;
  line-height: .85 !important;
  color: var(--t-red) !important;
  text-shadow: .045em .045em 0 var(--t-cream);
  max-width: 10.7em !important;
  margin: 0 auto !important;
}

/* ---- R4. Stats band ---- */
.t-rd-stats {
  display: grid;
  grid-template-columns: 35.4fr 24.6fr 40fr;
  align-items: start;
  min-height: 18.4vw;
  padding: 1.4vw 0 2.5vw;
  background: var(--t-red);
  color: var(--t-cream);
  max-width: none !important;
  margin: 0 !important;
}
.t-rd-stat { grid-column: 1; text-align: center; display: grid; justify-items: center; }
.t-rd-stat--right { grid-column: 3; }
.t-rd-stat__label,
.t-rd-stat__value {
  font-family: var(--t-mono) !important;
  text-transform: uppercase;
  line-height: 1;
}
.t-rd-stat__label { font-size: clamp(1.25rem, 2.4vw, 2.25rem); }
.t-rd-stat__value {
  font-size: clamp(2rem, 5.16vw, 4.875rem);
  margin-top: 2.4vw;
  text-shadow: .045em .045em 0 var(--t-green);
}
.t-rd-stat__note {
  font-family: var(--t-body);
  font-size: clamp(.9375rem, 1.45vw, 1.375rem);
  margin-top: 1.5vw;
}

/* ---- R5. Call to mobilize: charcoal, all red ---- */
.t-rd-cta {
  background: #2B2B2B !important;
  color: var(--t-red);
  padding-top: 13vw !important;
  padding-bottom: 10vw !important;
}
.t-rd-cta .t-rd-cta__label {
  font-family: var(--t-mono) !important;
  font-size: clamp(.875rem, 1.32vw, 1.25rem) !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--t-red) !important;
  max-width: none !important;
  margin: 0 auto !important;
}
.t-rd-cta h2 {
  font-size: clamp(2rem, 4.7vw, 4.4375rem) !important;     /* 71px */
  line-height: .86 !important;
  color: var(--t-red) !important;
  max-width: 7.5em !important;
  margin: 2.6vw auto 0 !important;
}
.t-rd-cta p:not(.t-rd-cta__label) {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.27 !important;
  color: var(--t-red) !important;
  max-width: min(33.6rem, 92%) !important;
  margin: 2.8vw auto 0 !important;
}
.t-rd-cta .wp-block-buttons { margin-top: 5.6vw !important; }
.t-rd-btn .wp-block-button__link {
  font-family: var(--t-mono) !important;
  font-size: clamp(.6875rem, .86vw, .8125rem) !important;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: var(--t-red) !important;
  color: var(--t-cream) !important;
  border-radius: .5rem;
  padding: 1.2em 1.6em;
  transition: background .2s;
}
.t-rd-btn .wp-block-button__link:hover { background: #C80000 !important; }

/* ---- R6. Red Youth Republic + red pillars on this page ---- */
.t-section.t-republic--red {
  background: var(--t-red) !important;
  color: var(--t-cream);
  padding-top: 3.7vw !important;                          /* ~56px above the logo */
}
.t-section.t-republic--red .t-icon { margin: 0 auto !important; }
.t-section.t-republic--red .t-icon img { display: block; width: 7.9vw; height: auto; margin: 0 auto; }
.t-section.t-republic--red h2 {
  font-size: clamp(2.75rem, 7.8vw, 7.375rem) !important;  /* Rhode 118px on the 1512 frame */
  line-height: .873 !important;                           /* 103px */
  letter-spacing: 0 !important;
  color: var(--t-cream) !important;                       /* #F3ECDD */
  margin-top: 1.4vw !important;                           /* ~30px under the logo */
}
.t-section.t-republic--red > .t-bleed { margin-top: 6.3vw !important; }   /* ~95px gap to the image */
.page-reddd .t-pillars .t-menu a { background: var(--t-red) !important; }
.page-reddd .t-pillars .t-menu a:hover { color: var(--t-cream) !important; }

/* ---- Mobile ---- */
@media (max-width: 781px) {
    .t-rd-hero { height: 120vw !important; padding-bottom: 9vw !important; }
	.t-rd-hero .t-rd-hero__logo { width: 88vw !important; }

  .t-rd-intro { padding-top: 4rem !important; padding-bottom: 3.5rem !important; }
  .t-rd-intro h2 { font-size: 9vw !important; }
  .t-rd-intro p { font-size: 1.0625rem !important; max-width: 88% !important; margin-top: 2rem !important; }

  .t-rd-photo { height: 140vw !important; padding-top: 3rem !important; }
  .t-rd-photo h2 { font-size: 9vw !important; }
  .t-rd-photo::before,
  .t-rd-photo::after { width: 6vw; height: 6vw; top: 32vw; }

  .t-rd-stats { grid-template-columns: 1fr 1fr; padding: 1.5rem 0 2rem; }
  .t-rd-stat--right { grid-column: 2; }
  .t-rd-stat__label { font-size: 5vw; }
  .t-rd-stat__value { font-size: 9vw; margin-top: .75rem; }
  .t-rd-stat__note { font-size: .9375rem; margin-top: .5rem; }

  .t-rd-cta { padding-top: 4rem !important; padding-bottom: 4rem !important; }
  .t-rd-cta h2 { font-size: 11vw !important; margin-top: 1rem !important; }
  .t-rd-cta p:not(.t-rd-cta__label) { font-size: 1.0625rem !important; margin-top: 1.25rem !important; }
  .t-rd-cta .wp-block-buttons { margin-top: 2rem !important; }
	
   .t-section.t-republic--red { padding-top: 3rem !important; }
  .t-section.t-republic--red .t-icon img { width: 3.5rem; }
  .t-section.t-republic--red h2 { font-size: 13vw !important; margin-top: 1rem !important; }
  .t-section.t-republic--red > .t-bleed { margin-top: 2.5rem !important; }
}

/* =========================================================
   VOLUMERS PAGE
   ========================================================= */
:root { --t-vo-yellow: #FFDC91; }

/* ---- V1. Hero: crowd photo, logo near the top ---- */
.t-vo-hero {
  min-height: 0 !important;
  height: 44.6vw !important;                       /* 674px on the 1512 frame */
  margin: 0 !important;
  padding: 3.8vw var(--t-gutter) 0 !important;
  align-items: flex-start !important;
  background: #3B4A3C !important;                  /* shows only if the photo loads late */
}
.t-vo-hero .wp-block-cover__image-background {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover;
}
.t-vo-hero .t-vo-hero__logo { margin: 0 auto !important; width: 16.9vw !important; max-width: none !important; }
.t-vo-hero .t-vo-hero__logo img { display: block; width: 100% !important; height: auto !important; }


/* ---- Shared headings: Rhode 100px / 87px ---- */
.t-vo-title h1,
.t-vo-premise h2,
.t-vo-solution h2,
.t-vo-why h2 {
  font-size: clamp(2.75rem, 6.6vw, 6.25rem) !important;
  line-height: .87 !important;
  letter-spacing: 0 !important;
  margin: 0 auto !important;
}

/* ---- Shared text: Apple Garamond 26px / 113%, yellow on green ---- */
.t-vo-premise p,
.t-vo-why p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  color: var(--t-vo-yellow) !important;
  max-width: min(35.7rem, 92%) !important;
  margin: 7.7vw auto 0 !important;                 /* 116px below the heading */
}

/* ---- V2. Title band: yellow, green heading ---- */
.t-vo-title {
  background: var(--t-vo-yellow) !important;
  padding-top: 2.45vw !important;
  padding-bottom: 1.2vw !important;
}
.t-vo-title h1 { color: var(--t-green) !important; }

/* ---- V3. The Premise: green, black heading ---- */
.t-vo-premise {
  background: var(--t-green) !important;
  padding-top: 8vw !important;                     /* 121px */
  padding-bottom: 10.6vw !important;
}
.t-vo-premise h2 { color: var(--t-ink) !important; }

/* ---- V4. This Is Our Solution: yellow, 3 + 2 points ---- */
.t-vo-solution {
  background: var(--t-vo-yellow) !important;
  padding-top: 4.8vw !important;
  padding-bottom: 6.6vw !important;
}
.t-vo-solution h2 { color: var(--t-green) !important; }
.t-vo-solution > .t-vo-points {
  display: grid;
  grid-template-columns: repeat(3, 18.4vw);
  justify-content: center;
  column-gap: 10vw;
  row-gap: 13.2vw;
  max-width: none !important;
  margin: 18.6vw auto 0 !important;
}
.t-vo-points p {
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  color: var(--t-green) !important;
  text-align: center;
  max-width: none !important;
  margin: 0 !important;
}

/* ---- V5. Photo + Why It Matters: green, black heading ---- */
.t-vo-why {
  background: var(--t-green) !important;
  padding-top: 0 !important;
  padding-bottom: 4.4vw !important;
}
.t-vo-why > .t-vo-why__img {
  max-width: none !important;
  margin: 0 calc(var(--t-gutter) * -1) !important;
}
.t-vo-why .t-vo-why__img img {
  display: block;
  width: 100% !important;
  height: 39.7vw !important;                       /* 600px */
  object-fit: cover;
}
.t-vo-why h2 { color: var(--t-ink) !important; }
.t-vo-why > .t-vo-why__img + h2 { margin-top: 5.3vw !important; }
.t-vo-why > h2 + p { margin-top: 4.8vw !important; }

/* ---- V6. Target stat: yellow band ---- */
.t-vo-stat {
  display: grid;
  justify-items: center;
  align-content: center;
  min-height: 18.65vw;                             /* 282px */
  padding: 1.5vw var(--t-gutter);
  background: var(--t-vo-yellow);
  color: var(--t-green);
  text-align: center;
}
.t-vo-stat__label {
  font-family: var(--t-body) !important;
  font-size: clamp(.875rem, 1.32vw, 1.25rem);
  text-transform: uppercase;
  line-height: 1;
}
.t-vo-stat__value {
  font-family: var(--t-display) !important;
  font-size: clamp(2.75rem, 6.6vw, 6.25rem);
  line-height: .87;
  margin-top: .9vw;
}
.t-vo-stat__note {
  font-family: var(--t-body) !important;
  font-size: clamp(1rem, 1.45vw, 1.375rem);
  line-height: 1.2;
  margin-top: 1vw;
}

/* ---- V7. Flag image above the pillars ---- */
.t-vo-flag { margin: 0 !important; max-width: none !important; }
.t-vo-flag img {
  display: block;
  width: 100% !important;
  height: 33vw !important;                         /* 499px */
  max-width: none !important;
  object-fit: cover;
}

/* ---- Mobile ---- */
@media (max-width: 781px) {
  /* Logo centred on the BACK line (header top padding + half its line height) */
  .t-vo-hero { height: 110vw !important; padding-top: 0 !important; }
  .t-vo-hero .t-vo-hero__logo {
    position: absolute !important;
    left: 50%;
    top: calc(clamp(1rem, 3.3vw, 3.125rem) + .61rem);
    transform: translate(-50%, -50%);
    width: 32vw !important;
    margin: 0 !important;
  }
	
	  /* Logged in: BACK is pushed down by the admin bar, so the logo follows */
  .admin-bar .t-vo-hero .t-vo-hero__logo {
    top: calc(46px + clamp(1rem, 3.3vw, 3.125rem) + .61rem);
  }

  .t-vo-title h1,
  .t-vo-premise h2,
  .t-vo-solution h2,
  .t-vo-why h2 { font-size: 13vw !important; }

  .t-vo-premise p,
  .t-vo-why p { font-size: 1.125rem !important; max-width: 88% !important; margin-top: 1.5rem !important; }

  .t-vo-title { padding-top: 2rem !important; padding-bottom: 2rem !important; }
  .t-vo-premise { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }

  .t-vo-solution { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
  .t-vo-solution > .t-vo-points {
    grid-template-columns: 1fr;
    row-gap: 2rem;
    margin-top: 2.5rem !important;
  }
  .t-vo-points p { font-size: 1.125rem !important; max-width: 80% !important; margin: 0 auto !important; }

  .t-vo-why { padding-bottom: 3rem !important; }
  .t-vo-why .t-vo-why__img img { height: 75vw !important; }
  .t-vo-why > .t-vo-why__img + h2 { margin-top: 2.5rem !important; }

  .t-vo-stat { min-height: 0; padding: 2.5rem 1.25rem; }
  .t-vo-stat__label { font-size: .875rem; }
  .t-vo-stat__value { font-size: 15vw; margin-top: .5rem; }
  .t-vo-stat__note { font-size: 1rem; margin-top: .5rem; }

  .t-vo-flag img { height: 60vw !important; }
}

/* =========================================================
   MINDSHIFT PAGE
   ========================================================= */
:root { --t-ms-blue: #0026E4; }

/* ---- M1. Hero: wordmark bleeding right, intro, strip, BOOTCAMP, text-on-strip ---- */
.t-ms-hero {
  background: var(--t-ms-blue) !important;
  padding-top: 9.6vw !important;                   /* 145px to the wordmark */
  padding-bottom: 0 !important;
  text-align: left;
}
.t-ms-hero > .t-ms-logo {
  width: 77vw !important;
  max-width: none !important;
  margin: 0 0 0 calc(27vw - var(--t-gutter)) !important;   /* starts 408px in, clipped at the right */
}
.t-ms-hero > .t-ms-bootcamp {
  width: 76vw !important;
  max-width: none !important;
  margin: 8.1vw 0 0 calc(-1.3vw - var(--t-gutter)) !important;  /* B bleeds off the left */
}
.t-ms-logo img,
.t-ms-bootcamp img { display: block; width: 100% !important; height: auto !important; }

/* Intro: KaiTi 26px / 113%, 841px wide, 57px from the left */
.t-ms-hero p.t-ms-text {
  font-family: var(--t-mono) !important;
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  color: var(--t-cream) !important;
  text-align: left;
  max-width: 55.7vw !important;
  margin: 2.8vw 0 0 calc(3.8vw - var(--t-gutter)) !important;
}

/* Book strips: 65px side inset, 216px tall */
.t-ms-hero > .t-ms-strip,
.t-ms-hero > .t-ms-band {
  position: relative;
  max-width: none !important;
  margin: 1.5vw calc(4.3vw - var(--t-gutter)) 0 !important;
}
.t-ms-hero > .t-ms-band { margin-top: 9.5vw !important; }
.t-ms-strip img,
.t-ms-band img {
  display: block;
  width: 100% !important;
  height: 14.3vw !important;
  max-width: none !important;
  object-fit: cover;
}
.t-ms-band p {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--t-mono) !important;
  font-size: clamp(1rem, 1.72vw, 1.625rem) !important;
  line-height: 1.13 !important;
  color: var(--t-cream) !important;
  text-align: center;
  max-width: 41vw !important;
  margin: 0 auto !important;
}

/* ---- M2. Modules: 100px heading, 3 × 2 cards ---- */
.t-ms-modules {
  background: var(--t-ms-blue) !important;
  color: var(--t-ink);
  padding-top: 8vw !important;
  padding-bottom: 7.2vw !important;
}
.t-ms-modules h2 {
  font-size: clamp(2.75rem, 6.6vw, 6.25rem) !important;
  line-height: .87 !important;
  letter-spacing: 0 !important;
  color: var(--t-ink) !important;
}
.t-ms-modules > .t-ms-cards {
  display: grid;
  grid-template-columns: repeat(3, 25.7vw);        /* 388px cards */
  justify-content: center;
  column-gap: 4.1vw;                               /* 62px */
  row-gap: 3.1vw;                                  /* 47px */
  max-width: none !important;
  margin-top: 7.5vw !important;
}
.t-ms-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;                  /* title top, text bottom */
  height: 29vw;                                    /* 438px */
  padding: 3.2vw 2vw 2vw;
  border: 2px solid #414943;
  transition: background .3s ease;
}
.t-ms-card:hover { background: #D9D9D9; }
.t-ms-card h3 {
  font-size: clamp(1.5rem, 3.3vw, 3.125rem) !important;   /* 50px */
  line-height: .9 !important;
  letter-spacing: 0 !important;
  color: var(--t-ink) !important;
}
.t-ms-card p {
  font-family: var(--t-mono) !important;
  font-size: clamp(.875rem, 1.45vw, 1.375rem) !important; /* 22px */
  line-height: 1.3 !important;
  color: var(--t-ink) !important;
  max-width: none !important;
  margin: 0 !important;
}

/* ---- M3. Stat band (shared .t-vo-stat): blue, ink number, cream note ---- */
.page-mindshift .t-vo-stat { background: var(--t-ms-blue); color: var(--t-ink); }
.page-mindshift .t-vo-stat__note { color: var(--t-cream); }

/* ---- M4. Blue pillars with dark dividers ---- */
.page-mindshift .t-pillars .t-menu a {
  background: var(--t-ms-blue) !important;
  color: var(--t-ink) !important;
  border-top: 2px solid #414943;
}
.page-mindshift .t-pillars .t-menu li + li a { border-left: 2px solid #414943; }
.page-mindshift .t-pillars .t-menu li + li::before { display: none; }
.page-mindshift .t-pillars .t-menu a:hover { color: var(--t-cream) !important; }

/* ---- Mobile ---- */
@media (max-width: 781px) {
  .t-ms-hero { padding-top: 5rem !important; }
  .t-ms-hero > .t-ms-logo { width: 100vw !important; margin-left: calc(8vw - var(--t-gutter)) !important; }
  .t-ms-hero > .t-ms-bootcamp { width: 100vw !important; margin: 3rem 0 0 calc(-2vw - var(--t-gutter)) !important; }
  .t-ms-hero p.t-ms-text { font-size: 1rem !important; max-width: none !important; margin: 1.5rem 0 0 !important; }

  .t-ms-hero > .t-ms-strip,
  .t-ms-hero > .t-ms-band { margin-left: 0 !important; margin-right: 0 !important; }
  .t-ms-hero > .t-ms-strip { margin-top: 1.5rem !important; }
  .t-ms-hero > .t-ms-band { margin-top: 3rem !important; }
  .t-ms-strip img { height: 40vw !important; }
  .t-ms-band img { height: 55vw !important; }
  .t-ms-band p { font-size: .9375rem !important; max-width: 85% !important; }

  .t-ms-modules { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
  .t-ms-modules h2 { font-size: 13vw !important; }
  .t-ms-modules > .t-ms-cards {
    grid-template-columns: 1fr;
    row-gap: 1.25rem;
    margin-top: 2.5rem !important;
  }
  .t-ms-card { height: auto; min-height: 70vw; gap: 2rem; padding: 2rem 1.25rem 1.5rem; }
  .t-ms-card h3 { font-size: 9vw !important; }
  .t-ms-card p { font-size: 1rem !important; }
}