/* RE&L · Modern Mosaic — approved editorial identity.
   Palette and mark sampled from the supplied logo-system artwork. Layout, resource
   content, interaction and floating glass dock remain unchanged. */
:root {
  --bg: #FAF7F4;
  --bg-card: #FFFEFC;
  --bg-card-2: #F6EFEC;
  --midnight: #101B37;
  --granite: #395269;
  --blue: #58A3CD;
  --green: #76B88B;
  --yellow: #E7C44E;
  --coral: #DB777B;
  --text: #101B37;
  --text-muted: #455269;
  --text-faint: #6B7181;
  --border: #EAE0DC;
  --shadow-sm: 0 2px 14px rgba(16,27,55,.035);
  --shadow-md: 0 9px 30px rgba(16,27,55,.075);
  --shadow-lg: 0 18px 50px rgba(16,27,55,.12);
  --font-display: 'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --font-body: 'DM Sans', Arial, sans-serif;
}
body {background:var(--bg);color:var(--midnight)}
body[data-page="home"] {background:var(--bg)}
::selection{background:#E8DAB0;color:var(--midnight)}
a {color:inherit}
:where(a,button):focus-visible{outline:2px solid var(--midnight);outline-offset:4px}

/* Light editorial masthead, small mark + authoritative navy serif wordmark. */
.global-header {background:rgba(250,247,244,.96);border-bottom:1px solid var(--border)}
.site-header {max-width:1190px;padding:17px 32px;min-height:92px}
.logo {display:inline-flex;align-items:center;gap:11px;font-family:var(--font-display);font-size:clamp(1.48rem,2.35vw,2rem);letter-spacing:-.065em;line-height:1;font-style:normal;font-weight:700;color:var(--midnight);white-space:nowrap}
.logo:hover{color:var(--midnight)}
.logo .logo-dot{display:none}
.logo .logo-mark{width:54px;height:54px;object-fit:contain;flex:none;border-radius:0}
.logo .logo-wordmark{display:inline-block}
.header-tag{color:#6B7181;letter-spacing:.12em;font-size:10px;max-width:330px;text-align:right;line-height:1.7}

/* Hero: airy paper, structural rule and exact brand sheet's full lock-up. */
.home-hero{position:relative;width:100%;max-width:none;min-height:570px;padding:clamp(68px,7vw,106px) max(26px,calc((100% - 1136px)/2));display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.95fr);gap:clamp(38px,5vw,90px);align-items:center;background:radial-gradient(ellipse at 82% 26%,#F9EDE8 0%,transparent 42%),linear-gradient(145deg,#FAF7F4 3%,#FFFBF8 100%);border-bottom:1px solid var(--border)}
.home-hero::before{content:'';position:absolute;left:max(26px,calc((100% - 1136px)/2));right:max(26px,calc((100% - 1136px)/2));top:24px;height:1px;background:linear-gradient(to right,var(--midnight) 65%,transparent 65%);opacity:.16}
.home-hero>div:first-child{max-width:660px;min-width:0}
.hero-eyebrow{color:var(--granite);font-size:10px;letter-spacing:.15em;gap:10px;margin-bottom:22px}
.hero-eyebrow .eyebrow-dot{background:var(--coral)!important;width:8px;height:8px}
.hero-title{font:700 clamp(2.65rem,4.4vw,4.7rem)/1.15 var(--font-display);letter-spacing:-.06em;margin-bottom:25px;color:var(--midnight)}
.hero-title em{font-weight:400;letter-spacing:-.055em;color:#397C91}
.hero-desc{color:var(--text-muted);font-size:clamp(.98rem,1.2vw,1.08rem);line-height:1.85;max-width:52ch;margin-bottom:31px}
.hero-btn,.waveform-button{background:var(--midnight);color:#fff}
.hero-btn{box-shadow:0 8px 20px rgba(16,27,55,.13);border:1px solid var(--midnight);padding:14px 25px}
.hero-btn:hover{background:#253657}
.home-brand-art{min-width:0;display:flex;align-items:center;justify-content:center;position:relative;isolation:isolate;padding:22px 0}
.home-brand-art::before{content:'';z-index:-1;position:absolute;inset:5% 0;background:radial-gradient(ellipse at center,#F4E5E0 0%,rgba(244,229,224,.22) 50%,transparent 74%);border-radius:50%}
.home-brand-art img{display:block;width:min(100%,555px);height:auto;object-fit:contain;filter:drop-shadow(0 8px 14px rgba(16,27,55,.04));background:none;border:none;border-radius:0;box-shadow:none}

/* Pale cards with confident typography and warm, understated accents. */
#pillars{padding-top:55px}
.section-label{font-size:11px;color:var(--granite);letter-spacing:.15em;margin-bottom:22px}
.section-label::after{background:var(--border)}
.cards-grid{gap:18px}
.card{background:#FFFEFC;border:1px solid #EDE2DE;box-shadow:0 6px 18px rgba(16,27,55,.035);border-radius:25px;padding:clamp(22px,3vw,28px)}
.card:hover{border-color:#D9CBC7;box-shadow:var(--shadow-md)}
.card h3{font-family:var(--font-display);font-weight:700;letter-spacing:-.04em;line-height:1.3;color:var(--midnight)}
.card p{color:var(--text-muted)}
.card-icon{border-radius:17px;width:52px;height:52px}
.cards-grid .card[href="podcast.html"] .card-icon{background:#DDECF4!important}
.cards-grid .card[href="workbook.html"] .card-icon{background:#E2EFE1!important}
.cards-grid .card[href="manual.html"] .card-icon{background:#F6EDD0!important}
.cards-grid .card[href="session.html"] .card-icon{background:#F8DFDD!important}
.cards-grid .card[href="fundraiser.html"] .card-icon{background:#F6EDD0!important}
.cards-grid .card[href="founder.html"] .card-icon{background:#E5EAF2!important}
/* Soft, legible green ribbon in place of the dark navy strip. */
.motion-band {
  background:linear-gradient(105deg,#E5F0E6 0%,#EDF3E8 51%,#EEF4EF 100%);
  color:var(--midnight);
  border-top:2px solid rgba(118,184,139,.36);
  border-bottom:2px solid rgba(118,184,139,.36);
}
.motion-band .motion-track {
  color:var(--midnight);
  -webkit-text-stroke:0;
  font-weight:700;
  letter-spacing:-.05em;
  opacity:.9;
}
/* Removing the promotional hero CTA leaves the editorial intro balanced. */
.home-hero .hero-desc {margin-bottom:0}
.home-background{padding-top:42px;padding-bottom:62px}
.stat-band{background:#F8EFD7;border-radius:25px;border:1px solid #EEDFB6;box-shadow:none}
.stat-band strong{color:var(--midnight)}
.stat-band p{color:var(--midnight)}

/* The subdued four-colour palette gives every resource its own identity without harsh banners. */
.inner-hero{min-height:395px;padding:clamp(62px,7vw,94px) max(26px,calc((100% - 1110px)/2));border-bottom:1px solid var(--border);border-radius:0}
.inner-hero--blue{background:linear-gradient(130deg,#EFF6F9,#E2EFF4)}
.inner-hero--green{background:linear-gradient(130deg,#F1F6EF,#E7F0E6)}
.inner-hero--yellow{background:linear-gradient(130deg,#FBF7E8,#F7EACD)}
.inner-hero--midnight{background:var(--midnight)}
body[data-page="podcast"]{--page-tone:#E2EFF4}
body[data-page="workbook"]{--page-tone:#E7F0E6}
body[data-page="manual"]{--page-tone:#F7EACD}
body[data-page="session"]{--page-tone:#F8DFDD}
body[data-page="fundraiser"]{--page-tone:#F7EACD}
body[data-page="founder"]{--page-tone:var(--midnight)}
.inner-hero h1{font:700 clamp(3rem,6.15vw,6rem)/1.1 var(--font-display);letter-spacing:-.075em;margin:17px 0 22px}
.inner-hero .lead{font-size:1.06rem;line-height:1.78;color:var(--text-muted)}
.inner-hero--midnight .lead{color:#E3E7F2}
.page-visual{border:1px solid rgba(16,27,55,.085);border-radius:34px;background:rgba(255,255,255,.38);width:min(216px,100%)}
.inner-hero--midnight .page-visual{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.14)}
.page-tag,.chip{border-radius:999px}
.mod-num{border-color:rgba(16,27,55,.10)}
.resource-pair-card{border-radius:24px;border:1px solid var(--border);box-shadow:var(--shadow-sm)}
.resource-pair-card--textbook{background:#F9F4EB}
.resource-pair-kicker{color:var(--granite)}
.highlight-box{background:#FFFEFC;border:1px solid var(--border)}

/* Sheet-inspired four-colour bar, dark editorial footer, small-size brand. */
.site-footer{border-top:5px solid transparent;border-image:linear-gradient(90deg,var(--green) 0% 25%,var(--yellow) 25% 50%,var(--coral) 50% 75%,var(--blue) 75% 100%) 1;background:var(--midnight);color:#F8F5F1}
.site-footer .footer-headline,.site-footer .footer-channel-label{color:#F8F5F1}
.site-footer .footer-headline{letter-spacing:-.065em}
.site-footer .footer-headline em{color:#BFD4C2}
.site-footer .footer-description,.site-footer .footer-channel-status{color:rgba(248,245,241,.76)}
.site-footer .footer-channel{border-color:rgba(248,245,241,.18);background:rgba(248,245,241,.06)}
.site-footer .footer-channel:hover{background:rgba(248,245,241,.1)}
.site-footer .footer-channel-icon{color:#F8F5F1}
.site-footer .footer-base{border-color:rgba(248,245,241,.2);color:rgba(248,245,241,.78)}
.site-footer .footer-wordmark{display:inline-flex;align-items:center;gap:9px;color:#F8F5F1;font:700 1.12rem/1 var(--font-display);letter-spacing:-.055em}
.footer-wordmark .footer-mark{width:38px;height:38px;object-fit:contain;border-radius:0}
.footer-signal{background:var(--coral)!important}

/* Existing glass dock kept, but tuned to subdued editorial palette. */
.float-nav{background:rgba(255,255,255,.41);border:1px solid rgba(255,255,255,.75);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);box-shadow:0 8px 34px rgba(16,27,55,.14),0 2px 8px rgba(16,27,55,.05),inset 0 1px 0 rgba(255,255,255,.7)}
.nav-label{color:#495064}
.nav-btn[data-page="home"].active .nav-icon{background:#F4E8BE}
.nav-btn[data-page="podcast"].active .nav-icon{background:#DCECF5}
.nav-btn[data-page="workbook"].active .nav-icon{background:#E0EDDF}
.nav-btn[data-page="manual"].active .nav-icon{background:#F3E8C4}
.nav-btn[data-page="session"].active .nav-icon{background:#F6D9D6}
.nav-btn[data-page="fundraiser"].active .nav-icon{background:#F3E8C4}
.nav-btn[data-page="founder"].active .nav-icon{background:#E1E7EF}

/* The fund-raising initiative is planned. No invented target or raised totals. */
.fundraiser-opening{border-left:4px solid var(--yellow);background:#FBF6E8;border-radius:12px;padding:16px 18px;line-height:1.65;color:var(--midnight);max-width:68ch}
.fundraiser-opening p{margin:9px 0 0}
.fundraiser-demo .status-tag{background:#FBF0CC;border-color:#E7D6A3}

@media(max-width:850px){
 .home-hero{grid-template-columns:1fr;padding:76px 34px 75px;gap:38px;min-height:0}
 .home-hero::before{left:34px;right:34px}
 .home-brand-art{justify-content:flex-start;padding:0}
 .home-brand-art img{max-width:580px;width:min(100%,580px)}
}
@media(max-width:600px){
 .site-header{min-height:75px;padding:13px 19px}
 .logo{gap:8px;font-size:1.35rem}
 .logo .logo-mark{width:41px;height:41px}
 .header-tag{font-size:8px;max-width:145px;letter-spacing:.06em}
 .home-hero{padding:57px 20px 62px;gap:30px}
 .home-hero::before{top:18px;left:20px;right:20px}
 .hero-title{font-size:clamp(2.38rem,9vw,3.4rem)}
 .hero-desc{font-size:.96rem}
 .home-brand-art img{width:100%;max-width:500px}
 #pillars{padding-top:40px}
 .inner-hero{min-height:345px;padding:57px 20px 67px;grid-template-columns:minmax(0,1fr) 82px;gap:14px}
 .inner-hero h1{font-size:clamp(2.85rem,11vw,4rem)}
 .page-visual{width:82px;border-radius:19px}
 .site-footer .footer-wordmark{font-size:1rem}
 .footer-wordmark .footer-mark{width:30px;height:30px}
}
@media(max-width:380px){.header-tag{max-width:122px;font-size:7px}.logo{font-size:1.2rem}.logo .logo-mark{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){.home-brand-art img{animation:none!important;transition:none!important}}
