/* =====================================================
   R1 ReadyFirst – What Is Readiness? Page Layout
   Requires: shared.css
   v23 – New page: focused emotional + conceptual intro
   ===================================================== */

/* HERO – warm dark, no photo, intimate tone */
.rd-hero{padding:var(--xxl) var(--md) var(--xl);background:var(--g-deep);text-align:center;position:relative;overflow:hidden;color:var(--white)}
.rd-hero::before{content:'';position:absolute;top:-100px;right:-60px;width:320px;height:320px;border-radius:50%;background:rgba(var(--terra-rgb),.04)}
.rd-hero::after{content:'';position:absolute;bottom:-80px;left:-40px;width:240px;height:240px;border-radius:50%;background:rgba(var(--sky-rgb),.03)}
.rd-hero__inner{max-width:640px;margin:0 auto;position:relative;z-index:1}
.rd-hero__icon{width:64px;height:64px;border-radius:50%;background:rgba(var(--jade-lt-rgb),.1);display:flex;align-items:center;justify-content:center;margin:0 auto var(--md)}
.rd-hero__icon svg{width:28px;height:28px}
.rd-hero .section-eyebrow{color:var(--eyebrow-dark)}
.rd-hero h1{font-size:clamp(1.75rem,4.5vw,2.5rem);font-weight:800;color:var(--white);margin-bottom:var(--md);line-height:1.15}
.rd-hero p{font-family:var(--font-prose);font-size:clamp(1rem,2vw,1.125rem);color:rgba(var(--sand-rgb),.85);line-height:1.75;max-width:580px;margin:0 auto}

/* SECTION 2 – REFRAME: GROWING, NOT BROKEN */
/* Visual pause – corridor photo */
.rd-pause{padding:var(--lg) var(--md) 0;background:var(--white)}
.rd-pause__inner{max-width:1060px;margin:0 auto;overflow:hidden;border-radius:12px}
.rd-pause__photo{width:100%;height:480px;object-fit:cover;object-position:center 20%;display:block}

.rd-reframe{background:var(--white);padding:var(--xxl) var(--md)}
.rd-reframe__inner{max-width:var(--read);margin:0 auto}
.rd-reframe .section-eyebrow{color:var(--eyebrow-light)}
.rd-reframe h2{margin-bottom:var(--md)}
.rd-reframe p{font-size:1.0625rem;line-height:1.75;color:var(--char);margin-bottom:var(--md)}
.rd-reframe blockquote{font-family:var(--font-quote);font-size:clamp(1.125rem,2.5vw,1.3125rem);font-style:italic;color:var(--char);line-height:1.65;padding:var(--md) 0 0;border-top:1px solid var(--sand-dk);margin-top:var(--md)}
.rd-reframe blockquote em{font-style:normal;color:var(--jade);font-weight:700}

/* SECTION 3 – THREE PILLARS */
.rd-pillars{background:var(--sand);padding:var(--xxl) var(--md)}
.rd-pillars__inner{max-width:900px;margin:0 auto}
.rd-pillars__header{text-align:center;max-width:580px;margin:0 auto var(--xl)}
.rd-pillars__header .section-eyebrow{color:var(--eyebrow-light)}
.rd-pillars__header h2{margin-bottom:var(--sm)}
.rd-pillars__header p{color:var(--char);font-size:1.0625rem}

.rd-pillars__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md)}
.rd-pillar-card{background:var(--sand);border-radius:12px;padding:var(--md);text-align:center;box-shadow:var(--sh);display:flex;flex-direction:column;align-items:center}
.rd-pillar-card .pillar-tag{margin-bottom:var(--sm)}
.rd-pillar-card h3{font-size:1.25rem;margin-bottom:var(--sm)}
.rd-pillar-card--mind h3{color:var(--char)}
.rd-pillar-card--body h3{color:var(--char)}
.rd-pillar-card--energy h3{color:var(--char)}

.rd-pillar-card__moment{font-family:var(--font-quote);font-size:.9375rem;font-style:italic;color:var(--char);line-height:1.6;margin-bottom:var(--md);padding-bottom:var(--md);border-bottom:1px solid var(--sand-dk)}
.rd-pillar-card__dims{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:.375rem}
.rd-pillar-card__dims li{font-family:var(--font-ui);font-size:.75rem;font-weight:500;color:var(--char);padding:.25rem .75rem;border-radius:100px}
.rd-pillar-card--mind .rd-pillar-card__dims li{background:rgba(var(--pillar-warm-rgb),.15)}
.rd-pillar-card--body .rd-pillar-card__dims li{background:rgba(var(--pillar-green-rgb),.13)}
.rd-pillar-card--energy .rd-pillar-card__dims li{background:rgba(var(--pillar-teal-rgb),.13)}

/* SECTION 4 – THE CASCADE */
.rd-cascade{background:var(--white);padding:var(--xxl) var(--md)}
.rd-cascade__inner{max-width:900px;margin:0 auto;display:grid;grid-template-columns:1fr 280px;gap:var(--xl);align-items:center}

.rd-cascade__story .section-eyebrow{color:var(--eyebrow-light)}
.rd-cascade__story h2{margin-bottom:var(--md)}
.rd-cascade__narrative p{font-size:1.0625rem;line-height:1.75;color:var(--char);margin-bottom:var(--sm)}
.rd-cascade__narrative p:last-child{font-family:var(--font-ui);font-size:.9375rem;font-weight:500;color:var(--wgray);font-style:italic}

/* Cascade flow diagram */
.rd-cascade__flow{display:flex;flex-direction:column;align-items:center;gap:0}
.rd-cascade__node{width:100%;padding:var(--sm) var(--md);border-radius:10px;text-align:center}
.rd-cascade__node--energy{background:rgba(var(--grow-rgb),.06);border:none}
.rd-cascade__node--mind{background:rgba(var(--build-rgb),.05);border:none}
.rd-cascade__node--body{background:rgba(var(--build-rgb),.08);border:none}
.rd-cascade__pillar-label{font-family:var(--font-ui);font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;display:block;margin-bottom:.25rem;color:var(--char)}
.rd-cascade__node--energy .rd-cascade__pillar-label{color:var(--char)}
.rd-cascade__node--mind .rd-cascade__pillar-label{color:var(--char)}
.rd-cascade__node--body .rd-cascade__pillar-label{color:var(--char)}
.rd-cascade__signal{font-family:var(--font-ui);font-size:.875rem;color:var(--char);font-weight:500}
.rd-cascade__arrow{height:32px;display:flex;align-items:center;justify-content:center}
.rd-cascade__arrow svg{width:24px;height:32px}

/* SECTION 5 – THE INVISIBLE GAP */
/* Visual pause – kata photo */
.rd-kata{padding:0 var(--md) var(--lg);background:var(--white)}
.rd-kata__inner{max-width:1060px;margin:0 auto;overflow:hidden;border-radius:12px}
.rd-kata__photo{width:100%;height:480px;object-fit:cover;object-position:center 20%;display:block}

.rd-gap{background:var(--g-deep);padding:var(--xxl) var(--md);color:var(--white)}
.rd-gap__inner{max-width:780px;margin:0 auto;text-align:center}
.rd-gap .section-eyebrow{color:var(--eyebrow-dark)}
.rd-gap h2{color:var(--white);margin-bottom:var(--xl);max-width:640px;margin-left:auto;margin-right:auto}

.rd-gap__sequence{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md);margin-bottom:var(--sm);align-items:stretch}
.rd-gap__stat{padding:var(--lg) var(--md);border-radius:12px;background:rgba(var(--sand-rgb),.04);border:1px solid rgba(var(--sand-rgb),.08);display:flex;flex-direction:column;align-items:center;text-align:center}
.rd-gap__stat--highlight{background:rgba(var(--sand-rgb),.08);border-color:rgba(var(--sand-rgb),.15)}
.rd-gap__stat-number{font-family:var(--font-display);font-size:clamp(2.5rem,5vw,3.5rem);font-weight:800;color:var(--white);line-height:1;margin-bottom:var(--sm)}
.rd-gap__stat-caption{font-family:var(--font-ui);font-size:.875rem;color:rgba(var(--sand-rgb),.8);line-height:1.55;max-width:220px}
.rd-gap__sequence-source{font-family:var(--font-ui);font-size:.75rem;color:rgba(var(--sand-rgb),.45);text-align:center;margin:0 0 var(--xl)}

.rd-gap__bridge{font-family:var(--font-quote);font-size:clamp(1.0625rem,1.8vw,1.1875rem);color:rgba(var(--sand-rgb),.78);line-height:1.7;max-width:620px;margin:0 auto var(--lg);font-style:italic}
.rd-gap__bridge--lead{font-size:clamp(1.1875rem,2.2vw,1.375rem);color:rgba(var(--sand-rgb),.92);margin-bottom:var(--xl);padding-bottom:var(--lg);border-bottom:1px solid rgba(var(--sand-rgb),.12)}
.rd-gap__bridge:last-of-type{margin-bottom:0}

/* SECTION 6 – THE RIPPLE */
/* ===== INSIDE THE APP (rd-app) ===== */
.rd-app{background:var(--white);padding:var(--xxl) var(--md)}
.rd-app__inner{max-width:1080px;margin:0 auto}
.rd-app__header{text-align:center;max-width:680px;margin:0 auto var(--xl)}
.rd-app__header .section-eyebrow{color:var(--eyebrow-light)}
.rd-app__header h2{margin-bottom:var(--md)}
.rd-app__header p{font-size:1.0625rem;line-height:1.7;color:var(--char);margin:0}

.rd-app__phones{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--md);align-items:start}
.rd-app__phone{margin:0;display:flex;flex-direction:column;align-items:center;gap:var(--sm)}
.rd-app__phone img{width:100%;height:auto;display:block;border-radius:18px}
.rd-app__phone figcaption{font-family:var(--font-ui);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--wgray)}
.rd-app__phone--meta figcaption{color:var(--jade)}

.rd-app__mascot-row{display:flex;align-items:center;justify-content:center;gap:var(--md);margin-top:var(--md);padding-top:var(--md);border-top:1px solid rgba(var(--char-rgb),.08);max-width:680px;margin-left:auto;margin-right:auto}
.rd-app__mascot{width:88px;height:auto;flex-shrink:0}
.rd-app__mascot-line{font-family:var(--font-quote);font-style:italic;font-size:1.0625rem;line-height:1.6;color:var(--char);margin:0}

.rd-ripple{background:var(--sand);padding:var(--xxl) var(--md)}
.rd-ripple__inner{max-width:980px;margin:0 auto;display:flex;flex-direction:column;gap:var(--xl)}

/* Band 1: image + intro */
.rd-ripple__top{display:grid;grid-template-columns:1fr 1fr;gap:var(--xl);align-items:center}
.rd-ripple__image{border-radius:12px;overflow:hidden;aspect-ratio:3/4}
.rd-ripple__intro .section-eyebrow{color:var(--eyebrow-light)}
.rd-ripple__intro h2{margin-bottom:var(--md)}
.rd-ripple__intro p{font-size:1.0625rem;line-height:1.75;color:var(--char);margin:0}

/* Band 2: voice cards */
.rd-ripple__voices{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--md)}
.rd-ripple__voice{background:var(--white);border:1px solid rgba(var(--char-rgb),.08);border-radius:12px;padding:var(--md);display:flex;flex-direction:column;gap:var(--sm)}
.rd-ripple__voice-role{font-family:var(--font-ui);font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow-light)}
.rd-ripple__voice p{font-family:var(--font-quote);font-style:italic;font-size:1.0625rem;line-height:1.65;color:var(--char);margin:0}

/* Band 3: closing payoff + CTAs */
.rd-ripple__close{text-align:center;max-width:720px;margin:0 auto}
.rd-ripple__payoff{font-family:var(--font-ui);font-size:1rem;font-weight:500;line-height:1.7;color:var(--char);margin:0 0 var(--lg)}
.rd-ripple__cta{display:flex;gap:var(--sm);flex-wrap:wrap;justify-content:center}

/* RESPONSIVE */
@media(max-width:1024px){
  .rd-cascade__inner{grid-template-columns:1fr 240px}
  .rd-gap__sequence{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:767px){
  .rd-hero,.rd-reframe,.rd-pillars,.rd-cascade,.rd-gap,.rd-ripple,.rd-app{padding:var(--xl) var(--sm)}
  .rd-app__phones{grid-template-columns:1fr 1fr;gap:var(--sm)}
  .rd-app__mascot-row{flex-direction:column;text-align:center;gap:var(--sm)}
  .rd-app__mascot{width:72px}
  .rd-pause__inner{margin:0 var(--sm);border-radius:10px}
  .rd-pause__photo{height:320px}
  .rd-pillars__grid{grid-template-columns:1fr}
  .rd-cascade__inner{grid-template-columns:1fr;gap:var(--lg)}
  .rd-cascade__visual{order:-1}
  .rd-cascade__flow{flex-direction:row;overflow-x:auto;gap:0}
  .rd-cascade__flow{flex-direction:column}
  .rd-kata__inner{margin:0 var(--sm);border-radius:10px}
  .rd-kata__photo{height:320px}
  .rd-gap__sequence{grid-template-columns:1fr}
  .rd-ripple__top{grid-template-columns:1fr;gap:var(--lg);text-align:center}
  .rd-ripple__image{max-width:400px;margin:0 auto;aspect-ratio:4/3}
  .rd-ripple__voices{grid-template-columns:1fr}
  .rd-ripple__voice{text-align:left}
  .rd-ripple__cta{justify-content:center}
}