/* ============================================================
   Rise to Wellness — modernization layer (v54)
   Loaded AFTER each page's inline <style>, so it wins by source order.
   It recolors the site to a refined sunrise palette and adds modern
   polish (shadows, radii, hover lifts, scroll reveals, progress bar).
   It does NOT change markup, structure, logos, the Brevo iframe,
   the Zeffy form, the donation tiers, or the allocation bar.
   ============================================================ */

/* 1) Refined sunrise palette (drawn from the logo) -------------- */
:root{
  --cream:#fbf7ee;
  --cream-dark:#f3ecda;
  --ink:#18241d;          /* deep evergreen charcoal, warmer + more premium */
  --ink-soft:#434a40;
  --muted:#716b5d;
  --terracotta:#ee7a1c;   /* primary orange */
  --terracotta-dark:#cc6411;
  --sage:#6cae3a;         /* leafier green */
  --gold:#f6ad22;         /* amber gold */
  --rule:#e8dcc2;
  /* new accents used only by this layer */
  --rtw-grad:linear-gradient(118deg,var(--terracotta),var(--gold));
  --rtw-sky:#bfe3ee;
  --rtw-blush:#f7d0c6;
  --rtw-ease:cubic-bezier(.2,.7,.2,1);
  --rtw-shadow:0 26px 50px -28px rgba(24,36,29,.42);
  --rtw-shadow-sm:0 14px 30px -20px rgba(24,36,29,.32);
}

/* 2) Global niceties ------------------------------------------- */
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:rgba(246,173,34,.28)}
h1,h2,h3{letter-spacing:-.02em}
a{transition:color .2s var(--rtw-ease)}
img{image-rendering:auto}

/* keyboard focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:2px solid var(--terracotta);outline-offset:3px;border-radius:6px}

/* 3) Scroll progress bar (element is injected by modern.js) ----- */
#rtw-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:2000;
  background:var(--rtw-grad);transition:width .1s linear;pointer-events:none}

/* 4) Sticky nav: soft elevation once scrolled ------------------ */
nav{transition:box-shadow .35s var(--rtw-ease),background .35s var(--rtw-ease),backdrop-filter .35s}
nav.rtw-scrolled{box-shadow:0 6px 24px -16px rgba(24,36,29,.5);backdrop-filter:saturate(160%) blur(14px)}

/* 5) Buttons: pill, gradient, lift ----------------------------- */
.btn-primary,.nav-cta,a.nav-cta,.tier-cta,.founding-cta{
  border-radius:999px!important;
  transition:transform .25s var(--rtw-ease),box-shadow .25s var(--rtw-ease),background .25s,filter .25s!important;
  will-change:transform}
.btn-primary,.nav-cta,a.nav-cta{
  background:var(--rtw-grad)!important;color:#fff!important;
  box-shadow:0 12px 26px -12px rgba(238,122,28,.85)!important;border:0!important}
.btn-primary:hover,.nav-cta:hover,a.nav-cta:hover{
  transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(238,122,28,.95)!important;filter:saturate(1.04)}
.tier-cta:hover,.founding-cta:hover{transform:translateY(-2px)}

/* 6) Cards: rounder, softer, with a hover lift ----------------- */
.geo-card,.partner-card,.model-step,.compare-cell,.way,.faq-item,
.tier,.milestone,.module,.mod,.curr-stat,.team-card,.board-card,
.dtier,.tier-card,.values-card,.stat-card,.story-card,.info-card{
  transition:transform .35s var(--rtw-ease),box-shadow .35s var(--rtw-ease),border-color .35s var(--rtw-ease)!important}
.geo-card,.partner-card,.way,.module,.mod,.team-card,.board-card,
.dtier,.tier-card,.values-card,.story-card,.info-card{
  border-radius:18px!important}
.geo-card:hover,.partner-card:hover,.way:hover,.module:hover,.mod:hover,
.team-card:hover,.board-card:hover,.tier-card:hover,.values-card:hover,
.story-card:hover,.info-card:hover{
  transform:translateY(-5px);box-shadow:var(--rtw-shadow)!important}

/* model-row: keep the framed look but round + clip */
.model-row{border-radius:18px!important;overflow:hidden}

/* 7) Photos: gentle zoom on hover where wrapped ---------------- */
.photo-frame,.geo-photo,.story-photo,.hero-photo,figure{overflow:hidden}
.photo-frame img,.geo-photo img,figure img{transition:transform .6s var(--rtw-ease)}
.photo-frame:hover img,.geo-photo:hover img,figure:hover img{transform:scale(1.045)}

/* 8) Section intros + eyebrows --------------------------------- */
.eyebrow{font-weight:600;letter-spacing:.14em}

/* 9) Scroll reveal (classes added by modern.js) ---------------- */
.rtw-reveal{opacity:0;transform:translateY(22px);
  transition:opacity .7s var(--rtw-ease),transform .7s var(--rtw-ease)}
.rtw-reveal.rtw-in{opacity:1;transform:none}

/* 10) Reduced motion: show everything, drop motion ------------- */
@media (prefers-reduced-motion:reduce){
  .rtw-reveal{opacity:1!important;transform:none!important}
  *{scroll-behavior:auto}
  .btn-primary,.nav-cta,.geo-card,.partner-card,.way,.module,.mod{transition:none!important}
}

/* 11) Email signup popup (markup injected by modern.js) --------- */
#rtw-popup-overlay{position:fixed;inset:0;z-index:3000;
  background:rgba(24,36,29,.55);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;padding:20px;
  opacity:0;transition:opacity .35s var(--rtw-ease)}
#rtw-popup-overlay.rtw-open{opacity:1}
#rtw-popup{background:var(--cream);border-radius:20px;box-shadow:var(--rtw-shadow);
  max-width:600px;width:100%;max-height:min(88vh,780px);overflow-y:auto;
  position:relative;padding:36px 32px 24px;
  transform:translateY(16px) scale(.98);
  transition:transform .35s var(--rtw-ease)}
#rtw-popup-overlay.rtw-open #rtw-popup{transform:none}
#rtw-popup-close{position:absolute;top:12px;right:12px;width:38px;height:38px;
  border:0;border-radius:50%;background:var(--cream-dark);color:var(--ink);
  font-size:20px;line-height:1;cursor:pointer;
  transition:background .2s,transform .2s}
#rtw-popup-close:hover{background:var(--rule);transform:rotate(90deg)}
.rtw-pop-eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--terracotta);font-weight:600;margin-bottom:12px;
  display:inline-flex;align-items:center;gap:8px}
.rtw-pop-eyebrow::before{content:'';width:6px;height:6px;border-radius:50%;
  background:var(--terracotta)}
#rtw-popup h3{font-family:'Fraunces',Georgia,serif;font-weight:500;
  font-size:clamp(24px,4vw,30px);line-height:1.15;letter-spacing:-.02em;
  color:var(--ink);margin:0 0 12px}
#rtw-popup .rtw-pop-body{font-size:15px;line-height:1.6;color:var(--ink-soft);
  margin-bottom:6px;max-width:52ch}
#rtw-popup iframe{width:100%;max-width:100%;border:0;display:block;margin:0 auto}
/* Brevo's own page has a near-black background, so any iframe height beyond the
   form's card renders as a dead black slab. 537px hugs the card at the widths the
   form is embedded at; modern.js trims it to 493px once the frame is wide enough
   for Brevo's own layout to shorten. */
.newsletter iframe,#rtw-popup iframe{height:537px}
.rtw-pop-dismiss{display:block;margin:2px auto 0;background:none;border:0;
  color:var(--muted);font-family:inherit;font-size:13px;cursor:pointer;
  text-decoration:underline;text-underline-offset:3px;padding:8px}
.rtw-pop-dismiss:hover{color:var(--ink)}
@media (max-width:560px){
  #rtw-popup{padding:28px 18px 16px;border-radius:16px}
}
@media (prefers-reduced-motion:reduce){
  #rtw-popup-overlay,#rtw-popup{transition:none}
}
