/* ==========================================================================
   NAVEENA SRINIVASAN — Life & Relationship Coaching
   Design tokens
   ========================================================================== */
:root{
  /* --- brand palette (client-supplied, do not alter) --- */
  --cream:      #F3EBDD;
  --tan:        #D7C6B0;
  --powder:     #C2D7E6;
  --steel:      #5D88A6;
  --navy:       #223241;

  /* --- derived tints/shades --- */
  --cream-soft: #F9F5EE;
  --white:      #FFFFFF;
  --steel-dark: #496E87;
  --steel-deep: #3E6280;
  --navy-soft:  #2C4053;
  --navy-80:    rgba(34,50,65,.8);
  --navy-60:    rgba(34,50,65,.6);
  --navy-12:    rgba(34,50,65,.12);
  --navy-08:    rgba(34,50,65,.08);
  --line:       rgba(34,50,65,.14);
  --wa-green:   #2F8058;

  /* --- type --- */
  --font-display: 'Fraunces', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* --- fluid type scale --- */
  --fs-xs:   clamp(.75rem, .72rem + .12vw, .82rem);
  --fs-sm:   clamp(.85rem, .82rem + .15vw, .95rem);
  --fs-base: clamp(1rem, .96rem + .2vw, 1.08rem);
  --fs-md:   clamp(1.15rem, 1.08rem + .3vw, 1.35rem);
  --fs-lg:   clamp(1.4rem, 1.25rem + .6vw, 1.85rem);
  --fs-xl:   clamp(1.9rem, 1.55rem + 1.4vw, 2.7rem);
  --fs-2xl:  clamp(2.4rem, 1.9rem + 2vw, 3.6rem);
  --fs-3xl:  clamp(2.9rem, 2.1rem + 3.2vw, 4.8rem);

  /* --- spacing (fluid) --- */
  --sp-xs:  clamp(.5rem, .46rem + .2vw, .7rem);
  --sp-sm:  clamp(.9rem, .82rem + .3vw, 1.1rem);
  --sp-md:  clamp(1.4rem, 1.2rem + .8vw, 2rem);
  --sp-lg:  clamp(2.2rem, 1.7rem + 2vw, 3.4rem);
  --sp-xl:  clamp(3.2rem, 2.3rem + 3.6vw, 5.6rem);
  --sp-2xl: clamp(4rem, 2.8rem + 4.8vw, 7.5rem);

  --container: 1480px;
  --container-narrow: 760px;
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;
  --shadow-sm: 0 2px 10px rgba(34,50,65,.06);
  --shadow-md: 0 12px 32px rgba(34,50,65,.12);
  --shadow-lg: 0 24px 60px rgba(34,50,65,.16);
  --ease: cubic-bezier(.22,.61,.36,1);
  --dur: .5s;
  --header-h: 76px;
}

@media (max-width: 640px){
  :root{ --header-h: 64px; }
}

/* ==========================================================================
   Reset
   ========================================================================== */
*,*::before,*::after{ box-sizing: border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
body{
  font-family:var(--font-body);
  background:var(--cream);
  color:var(--navy);
  font-size:var(--fs-base);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; height:auto; }
svg{ display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; padding:0; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
input,select,textarea{ font:inherit; color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:600; line-height:1.12; letter-spacing:-.01em; }
p{ max-width:60ch; }
.no-scroll{ overflow:hidden; height:100%; }

:focus-visible{ outline:2.5px solid var(--steel); outline-offset:3px; border-radius:4px; }

/* ==========================================================================
   Utility
   ========================================================================== */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:clamp(1.25rem,2.4vw,2.25rem); }
.container-narrow{ width:100%; max-width:var(--container-narrow); margin-inline:auto; padding-inline:clamp(1.25rem,4vw,2.5rem); }
.section{ padding-block:var(--sp-2xl); }
.section-tight{ padding-block:var(--sp-xl); }
.bg-cream{ background:var(--cream); }
.bg-white{ background:var(--white); }
.bg-tan{ background:var(--tan); }
.bg-powder{ background:var(--powder); }
.bg-navy{ background:var(--navy); color:var(--cream); }
.bg-navy h1,.bg-navy h2,.bg-navy h3,.bg-navy h4{ color:var(--white); }
.center{ text-align:center; margin-inline:auto; }
.eyebrow{
  display:inline-flex; align-items:center; gap:.55em;
  font-size:var(--fs-xs); font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--steel-dark);
}
.bg-navy .eyebrow{ color:var(--powder); }
.eyebrow::before{ content:''; width:1.6em; height:1px; background:currentColor; opacity:.7; }
.italic{ font-style:italic; font-family:var(--font-display); }
.stack-sm > * + *{ margin-top:var(--sp-xs); }
.stack-md > * + *{ margin-top:var(--sp-sm); }
.stack-lg > * + *{ margin-top:var(--sp-md); }
.max-prose{ max-width:62ch; }
.visually-hidden{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link{
  position:absolute; left:1rem; top:-60px; background:var(--navy); color:var(--white);
  padding:.7em 1.2em; border-radius:var(--radius-sm); z-index:1000; transition:top .25s var(--ease);
}
.skip-link:focus{ top:1rem; }

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:.95em 1.7em; border-radius:var(--radius-pill);
  font-size:var(--fs-sm); font-weight:600; letter-spacing:.01em;
  white-space:nowrap; transition:transform .3s var(--ease), box-shadow .3s var(--ease), background-color .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
  min-height:48px; border:1.5px solid transparent; cursor:pointer;
}
.btn svg{ width:1.15em; height:1.15em; flex:none; }
.btn-primary{ background:var(--navy); color:var(--cream); box-shadow:var(--shadow-sm); }
.btn-primary:hover{ background:var(--steel-deep); transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-primary:active{ transform:translateY(0); }
.btn-secondary{ background:transparent; border-color:var(--navy); color:var(--navy); }
.btn-secondary:hover{ background:var(--navy); color:var(--cream); transform:translateY(-2px); }
.bg-navy .btn-secondary{ border-color:var(--cream); color:var(--cream); }
.bg-navy .btn-secondary:hover{ background:var(--cream); color:var(--navy); }
.btn-whatsapp{ background:var(--wa-green); color:var(--white); box-shadow:var(--shadow-sm); }
.btn-whatsapp:hover{ background:#26744C; transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-ghost{ background:var(--white); color:var(--navy); box-shadow:var(--shadow-sm); }
.btn-ghost:hover{ transform:translateY(-2px); box-shadow:var(--shadow-md); }
.btn-block{ width:100%; }
.btn-sm{ padding:.7em 1.3em; font-size:var(--fs-xs); min-height:40px; }
.btn[disabled]{ opacity:.6; pointer-events:none; }
.btn-row{ display:flex; flex-wrap:wrap; gap:var(--sp-xs); align-items:center; }
.center .btn-row{ justify-content:center; }

/* ==========================================================================
   Header / Nav
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:500;
  height:var(--header-h);
  display:flex; align-items:center;
  background:rgba(243,235,221,.88);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease), box-shadow .3s var(--ease), background-color .3s var(--ease);
}
.site-header.is-scrolled{ border-color:var(--line); box-shadow:0 6px 24px rgba(34,50,65,.06); }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; gap:clamp(.55rem,1.3vw,1rem); min-width:0; }

.brand{ display:inline-flex; align-items:center; flex:none; min-width:0; }
.brand-logo-shell{
  display:block; width:clamp(250px,20vw,312px); max-width:100%;
  padding:0; border-radius:0; overflow:visible;
  background:transparent; border:0; box-shadow:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.brand:hover .brand-logo-shell{ transform:translateY(-1px); opacity:.92; }
.brand-logo-shell picture{ display:block; }
.brand-logo{ display:block; width:100%; height:auto; aspect-ratio:1512/337; object-fit:contain; }
@media (max-width:1180px){ .brand-logo-shell{ width:clamp(220px,20vw,270px); } }
@media (max-width:640px){
  .brand-logo-shell{ width:clamp(190px,57vw,228px); padding:0; border-radius:0; }
}
@media (max-width:360px){ .brand-logo-shell{ width:176px; } }

.nav-desktop{ display:flex; align-items:center; gap:clamp(.8rem,1.55vw,1.65rem); min-width:0; }
.nav-desktop a{ font-size:var(--fs-sm); font-weight:500; color:var(--navy-80); position:relative; padding:.4em .1em; transition:color .25s var(--ease); }
.nav-desktop a::after{ content:''; position:absolute; left:0; right:100%; bottom:0; height:2px; background:var(--steel); transition:right .3s var(--ease); }
.nav-desktop a:hover{ color:var(--navy); }
.nav-desktop a:hover::after{ right:0; }
.nav-desktop a.is-active{ color:var(--navy); font-weight:600; }
.nav-desktop a.is-active::after{ right:0; }

.has-dropdown{ position:relative; }
.dropdown-trigger{ display:inline-flex; align-items:center; gap:.35em; background:none; border:0; font:inherit; }
.dropdown-trigger svg{ width:.8em; height:.8em; transition:transform .25s var(--ease); }
.has-dropdown:hover .dropdown-trigger svg,
.has-dropdown:focus-within .dropdown-trigger svg{ transform:rotate(180deg); }
.dropdown-panel{
  position:absolute; top:100%; left:50%; transform:translate(-50%,8px);
  min-width:230px; background:var(--white); border-radius:var(--radius-md);
  box-shadow:var(--shadow-lg); padding:.6rem; opacity:0; visibility:hidden;
  transition:opacity .25s var(--ease), transform .25s var(--ease), visibility .25s;
  pointer-events:none;
}
.has-dropdown:hover .dropdown-panel,
.has-dropdown:focus-within .dropdown-panel{
  opacity:1; visibility:visible; transform:translate(-50%,14px); pointer-events:auto;
}
.dropdown-panel a{ display:flex; flex-direction:column; padding:.7em .9em; border-radius:var(--radius-sm); color:var(--navy); }
.dropdown-panel a:hover{ background:var(--cream); }
.dropdown-panel a::after{ display:none; }
.dropdown-panel .dd-label{ font-weight:600; font-size:var(--fs-sm); }
.dropdown-panel .dd-desc{ font-size:var(--fs-xs); color:var(--navy-60); margin-top:.15em; }

.header-actions{ display:flex; align-items:center; gap:.6rem; flex:none; }
.nav-toggle{
  display:none; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:var(--radius-sm); flex:none;
  color:var(--navy);
}
.nav-toggle .bars{ position:relative; width:20px; height:14px; }
.nav-toggle .bars span{ position:absolute; left:0; right:0; height:2px; background:currentColor; border-radius:2px; transition:transform .3s var(--ease), opacity .3s var(--ease), top .3s var(--ease); }
.nav-toggle .bars span:nth-child(1){ top:0; }
.nav-toggle .bars span:nth-child(2){ top:6px; }
.nav-toggle .bars span:nth-child(3){ top:12px; }
.nav-open .nav-toggle .bars span:nth-child(1){ top:6px; transform:rotate(45deg); }
.nav-open .nav-toggle .bars span:nth-child(2){ opacity:0; }
.nav-open .nav-toggle .bars span:nth-child(3){ top:6px; transform:rotate(-45deg); }

@media (max-width:960px){
  .nav-desktop, .header-actions .btn-primary{ display:none; }
  .nav-toggle{ display:inline-flex; }
}

/* ---- Mobile drawer ---- */
.nav-drawer{
  position:fixed; inset:0; z-index:600;
  visibility:hidden;
}
.nav-drawer-backdrop{
  position:absolute; inset:0; background:var(--navy-60); opacity:0; transition:opacity .35s var(--ease);
}
.nav-drawer-panel{
  position:absolute; top:0; right:0; bottom:0;
  width:min(390px,88vw);
  background:var(--cream-soft);
  box-shadow:-16px 0 50px rgba(34,50,65,.25);
  transform:translateX(100%);
  transition:transform .4s var(--ease);
  display:flex; flex-direction:column;
  padding:max(1.1rem, env(safe-area-inset-top)) 1.4rem max(1.4rem, env(safe-area-inset-bottom));
  overflow-y:auto;
}
.nav-open .nav-drawer{ visibility:visible; }
.nav-open .nav-drawer-backdrop{ opacity:1; }
.nav-open .nav-drawer-panel{ transform:translateX(0); }

.drawer-top{ display:flex; align-items:center; justify-content:space-between; height:var(--header-h); flex:none; }
.drawer-close{ width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; color:var(--navy); background:var(--navy-08); flex:none; }
.drawer-close svg{ width:18px; height:18px; }

.drawer-nav{ margin-top:var(--sp-sm); flex:1; }
.drawer-nav > li + li{ margin-top:.15em; }
.drawer-nav a, .drawer-nav .drawer-group-trigger{
  display:flex; align-items:center; justify-content:space-between;
  width:100%; padding:.85em .2em; font-family:var(--font-display); font-size:1.28rem; font-weight:600;
  border-bottom:1px solid var(--line); color:var(--navy); text-align:left;
}
.drawer-nav .drawer-group-trigger svg{ width:.75em; height:.75em; transition:transform .3s var(--ease); flex:none; color:var(--steel-dark); }
.drawer-group.is-open .drawer-group-trigger svg{ transform:rotate(180deg); }
.drawer-submenu{ max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
.drawer-group.is-open .drawer-submenu{ max-height:320px; }
.drawer-submenu a{ font-family:var(--font-body); font-size:1rem; font-weight:500; padding:.7em .2em .7em 1rem; border-bottom:1px dashed var(--line); }
.drawer-nav a.is-active{ color:var(--steel-deep); }

.drawer-foot{ flex:none; padding-top:var(--sp-sm); }
.drawer-foot .btn{ margin-top:.6rem; }
.drawer-contact{ margin-top:var(--sp-sm); font-size:var(--fs-xs); color:var(--navy-60); display:flex; flex-direction:column; gap:.35em; }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  padding-top:clamp(2.2rem,4vw,3.5rem);
  padding-bottom:var(--sp-2xl);
  position:relative; overflow:hidden;
}
.hero .container{
  display:grid; grid-template-columns:1.03fr .97fr; gap:clamp(2.25rem,4.4vw,4.25rem); align-items:center;
}
.hero-copy{ max-width:680px; }
.hero-media{ width:100%; max-width:610px; justify-self:end; }
.hero-copy .eyebrow{ margin-bottom:var(--sp-sm); }
.hero-copy h1{ font-size:var(--fs-3xl); }
.hero-copy h1 em{ font-style:italic; color:var(--steel-deep); }
.hero-copy .lede{ font-size:var(--fs-md); color:var(--navy-80); margin-top:var(--sp-sm); max-width:46ch; }
.hero-copy p.support{ margin-top:var(--sp-sm); color:var(--navy-80); max-width:50ch; }
.hero-copy .btn-row{ margin-top:var(--sp-md); }

.hero-media{ position:relative; }
.hero-media .frame{
  position:relative; border-radius:var(--radius-lg); overflow:hidden;
  aspect-ratio:4/5; box-shadow:var(--shadow-lg);
}
.hero-media .frame img{ width:100%; height:100%; object-fit:cover; }
.hero-media .wing-accent{
  position:absolute; width:120px; height:120px; color:var(--powder); z-index:-1;
  top:-38px; right:-38px; opacity:.9;
}
.hero-media .dot{
  position:absolute; bottom:-22px; left:-22px; width:110px; height:110px; border-radius:50%;
  background:var(--tan); z-index:-1;
}
.hero-badge{
  position:absolute; left:-18px; bottom:22px; background:var(--white); border-radius:var(--radius-md);
  box-shadow:var(--shadow-md); padding:.85em 1.1em; display:flex; align-items:center; gap:.7em; max-width:230px;
}
.hero-badge svg{ width:26px; height:26px; color:var(--steel); flex:none; }
.hero-badge .t{ font-size:var(--fs-xs); line-height:1.35; font-weight:600; color:var(--navy); }

@media (max-width:960px){
  .hero .container{ grid-template-columns:1fr; }
  .hero-media{ order:-1; max-width:340px; margin-inline:auto; width:70%; }
  .hero-copy{ text-align:left; }
  .hero-badge{ left:-10px; bottom:-16px; padding:.7em .9em; max-width:190px; }
}
@media (max-width:480px){
  .hero-media{ width:62%; }
}


/* ==========================================================================
   Ambient 3D SVG accents — lightweight, decorative, theme-matched
   ========================================================================== */
.hero::before,
.page-hero::after{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(240px,34vw,520px); aspect-ratio:1;
  background:url('../images/ambient-ribbon.svg') center/contain no-repeat;
  opacity:.42; filter:drop-shadow(0 18px 28px rgba(34,50,65,.08));
  --ambient-rotate:-6deg;
  transform:translateZ(0) rotate(var(--ambient-rotate));
  animation:ambientFloat 10s ease-in-out infinite alternate;
}
.hero::before{ left:-8%; bottom:-18%; }
.hero > .container{ position:relative; z-index:1; }
.page-hero{ position:relative; overflow:hidden; isolation:isolate; }
.page-hero::after{ right:-9%; top:-38%; opacity:.3; --ambient-rotate:17deg; }
.page-hero > .container, .page-hero > .container-narrow{ position:relative; z-index:1; }
@keyframes ambientFloat{ from{ transform:translate3d(0,0,0) rotate(var(--ambient-rotate)); } to{ transform:translate3d(10px,-12px,0) rotate(calc(var(--ambient-rotate) + 4deg)); } }
@media (max-width:760px){
  .hero::before{ width:290px; left:-34%; bottom:-7%; opacity:.26; }
  .page-hero::after{ width:260px; right:-31%; top:-10%; opacity:.22; }
}
@media (prefers-reduced-motion:reduce){
  .hero::before,.page-hero::after{ animation:none; }
}

/* ==========================================================================
   Premium spatial SVG layer
   Subtle 3D-style vector accents fill otherwise empty edges without
   competing with the coaching content. All artwork is decorative only.
   ========================================================================== */
.hero::after{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(220px,27vw,430px); aspect-ratio:1;
  right:-7%; top:3%;
  background:url('../images/decor-orbit.svg') center/contain no-repeat;
  opacity:.34; filter:drop-shadow(0 24px 34px rgba(34,50,65,.07));
  transform:translateZ(0) rotate(8deg);
  animation:ambientOrbit 12s ease-in-out infinite alternate;
}
.page-hero::before{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(190px,24vw,340px); aspect-ratio:360/260;
  left:-4%; bottom:-16%;
  background:url('../images/decor-constellation.svg') center/contain no-repeat;
  opacity:.32;
  transform:translateZ(0) rotate(-8deg);
  --ambient-rotate:-8deg; animation:ambientFloat 11s ease-in-out infinite alternate-reverse;
}

.section,.section-tight{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.section > .container,.section > .container-narrow,
.section-tight > .container,.section-tight > .container-narrow{
  position:relative;
  z-index:1;
}
main > .section.bg-cream::before,
main > .section-tight.bg-cream::before{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(220px,30vw,440px); aspect-ratio:430/320;
  left:clamp(-180px,-11vw,-100px); top:clamp(18px,8%,90px);
  background:url('../images/decor-wing.svg') center/contain no-repeat;
  opacity:.24;
  filter:drop-shadow(0 24px 36px rgba(34,50,65,.055));
  transform:translateZ(0) rotate(-9deg);
  animation:ambientWing 14s ease-in-out infinite alternate;
}
main > .section.bg-cream::after,
main > .section-tight.bg-cream::after{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(150px,21vw,300px); aspect-ratio:360/260;
  right:clamp(-105px,-5vw,-44px); bottom:clamp(-36px,4%,42px);
  background:url('../images/decor-constellation.svg') center/contain no-repeat;
  opacity:.25;
  transform:translateZ(0) rotate(10deg);
}
main > .section.bg-white::before,
main > .section-tight.bg-white::before{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(190px,25vw,350px); aspect-ratio:460/300;
  left:clamp(-145px,-7vw,-65px); bottom:clamp(-50px,5%,50px);
  background:url('../images/decor-halo.svg') center/contain no-repeat;
  opacity:.23;
  transform:translateZ(0) rotate(-8deg);
}
main > .section.bg-white::after,
main > .section-tight.bg-white::after{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(190px,25vw,360px); aspect-ratio:1;
  right:clamp(-145px,-7vw,-55px); top:clamp(-28px,8%,70px);
  background:url('../images/decor-orbit.svg') center/contain no-repeat;
  opacity:.18;
  filter:drop-shadow(0 20px 32px rgba(34,50,65,.05));
  transform:translateZ(0) rotate(16deg);
  animation:ambientOrbit 15s ease-in-out infinite alternate-reverse;
}
main > .section.bg-navy::before,
main > .section-tight.bg-navy::before{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(230px,30vw,440px); aspect-ratio:430/320;
  right:clamp(-170px,-9vw,-80px); top:4%;
  background:url('../images/decor-wing.svg') center/contain no-repeat;
  opacity:.13;
  filter:brightness(1.25) saturate(.8);
  transform:translateZ(0) rotate(15deg);
}
main > .section.bg-powder::after,
main > .section-tight.bg-powder::after{
  content:''; position:absolute; pointer-events:none; z-index:0;
  width:clamp(210px,28vw,390px); aspect-ratio:1;
  right:clamp(-150px,-7vw,-65px); bottom:-16%;
  background:url('../images/decor-orbit.svg') center/contain no-repeat;
  opacity:.22;
  transform:translateZ(0) rotate(-11deg);
}
main > .section:nth-of-type(even)::before{ transform:translateZ(0) rotate(8deg) scaleX(-1); }
main > .section:nth-of-type(3n)::after{ top:auto; bottom:-8%; transform:translateZ(0) rotate(-13deg); }

@keyframes ambientOrbit{
  from{ transform:translate3d(0,0,0) rotate(5deg); }
  to{ transform:translate3d(-10px,13px,0) rotate(12deg); }
}
@keyframes ambientWing{
  from{ transform:translate3d(0,0,0) rotate(-9deg); }
  to{ transform:translate3d(11px,-8px,0) rotate(-5deg); }
}
@media (max-width:960px){
  .hero::after{ width:300px; right:-18%; top:10%; opacity:.2; }
  .page-hero::before{ left:-18%; opacity:.23; }
  main > .section::before, main > .section::after,
  main > .section-tight::before, main > .section-tight::after{ opacity:.15; }
}
@media (max-width:640px){
  .hero::after{ width:220px; right:-33%; top:5%; opacity:.16; }
  .page-hero::before{ width:210px; left:-35%; bottom:-4%; opacity:.16; }
  main > .section::before, main > .section::after,
  main > .section-tight::before, main > .section-tight::after{
    width:210px; opacity:.10;
  }
}
@media (prefers-reduced-motion:reduce){
  .hero::after,.page-hero::before,
  main > .section::before, main > .section::after,
  main > .section-tight::before, main > .section-tight::after{ animation:none !important; }
}

/* ==========================================================================
   Section headers
   ========================================================================== */
.section-head{ max-width:52ch; }
.section-head.center{ max-width:56ch; }
.section-head h2{ font-size:var(--fs-2xl); margin-top:.5rem; }
.section-head .lede{ font-size:var(--fs-md); color:var(--navy-80); margin-top:var(--sp-sm); }

/* ==========================================================================
   Cards — offerings
   ========================================================================== */
.grid-cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-md); margin-top:var(--sp-lg); }
@media (max-width:1080px){ .grid-cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .grid-cards{ grid-template-columns:1fr; gap:var(--sp-sm); } }

.card{
  background:var(--white); border-radius:var(--radius-md); padding:var(--sp-md);
  box-shadow:var(--shadow-sm); transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  display:flex; flex-direction:column; height:100%;
}
.card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }
.card .num{ font-family:var(--font-display); font-size:var(--fs-lg); color:var(--tan); font-weight:600; }
.card h3{ font-size:var(--fs-md); margin-top:.5em; }
.card p{ margin-top:.6em; color:var(--navy-80); font-size:var(--fs-sm); flex:1; }
.card-link{ display:inline-flex; align-items:center; gap:.45em; font-weight:600; font-size:var(--fs-sm); color:var(--steel-deep); text-decoration:none; }
.card-link svg{ width:1em; height:1em; flex:none; transition:transform .3s var(--ease); }
.card-link:hover svg,.card-link:focus-visible svg{ transform:translateX(4px); }
.card .card-link{ margin-top:var(--sp-sm); display:inline-flex; align-items:center; gap:.4em; font-weight:600; font-size:var(--fs-sm); color:var(--steel-deep); }
.card .card-link svg{ width:1em; height:1em; transition:transform .3s var(--ease); }
.card:hover .card-link svg{ transform:translateX(4px); }
.card-icon{ width:44px; height:44px; border-radius:12px; background:var(--cream); color:var(--steel-deep); display:flex; align-items:center; justify-content:center; flex:none; }
.card-icon svg{ width:22px; height:22px; }

/* ==========================================================================
   Split content (text + image) rows
   ========================================================================== */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.split.reverse .split-media{ order:2; }
@media (max-width:900px){
  .split{ grid-template-columns:1fr; }
  .split.reverse .split-media{ order:-1; }
  .split-media{ order:-1; }
}
.split-media .frame{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); position:relative; }
.split-media .frame img{ width:100%; height:100%; object-fit:cover; }
.split-media.ratio-4-5 .frame{ aspect-ratio:4/5; }
.split-media.ratio-1-1 .frame{ aspect-ratio:1/1; }
.split-copy h2{ font-size:var(--fs-2xl); }
.split-copy .lede{ font-size:var(--fs-md); margin-top:var(--sp-xs); color:var(--steel-deep); }
.split-copy p{ margin-top:var(--sp-sm); color:var(--navy-80); max-width:56ch; }
.split-copy .btn-row{ margin-top:var(--sp-md); }

/* ==========================================================================
   Wide banner image (speaking / cta)
   ========================================================================== */
.banner{ position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); }
.banner img{ width:100%; height:100%; object-fit:cover; aspect-ratio:16/10; }
@media (max-width:640px){ .banner img{ aspect-ratio:4/5; } }

/* ==========================================================================
   Lists (topic bullets, service bullets)
   ========================================================================== */
.check-list{ display:flex; flex-direction:column; gap:.6em; margin-top:var(--sp-sm); }
.check-list li{ display:flex; align-items:flex-start; gap:.7em; font-size:var(--fs-sm); color:var(--navy-80); }
.check-list li svg{ width:1.2em; height:1.2em; color:var(--steel); flex:none; margin-top:.1em; }
.pill-list{ display:flex; flex-wrap:wrap; gap:.6em; margin-top:var(--sp-sm); }
.pill{ background:var(--white); border:1px solid var(--line); padding:.55em 1.1em; border-radius:var(--radius-pill); font-size:var(--fs-sm); font-weight:500; }
.bg-navy .pill{ background:var(--navy-soft); border-color:rgba(255,255,255,.14); color:var(--cream); }

.topic-grid{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-md); margin-top:var(--sp-lg); }
@media (max-width:760px){ .topic-grid{ grid-template-columns:1fr; gap:var(--sp-sm); } }
.topic-card{ background:var(--white); border-radius:var(--radius-md); padding:var(--sp-md); box-shadow:var(--shadow-sm); }
.topic-card h3{ font-size:var(--fs-md); display:flex; align-items:center; gap:.5em; }
.topic-card h3 svg{ width:1.1em; height:1.1em; color:var(--steel); flex:none; }

/* Native details/summary — used as compact mobile accordions, no JS needed */
details.accordion{ background:var(--white); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); overflow:hidden; }
details.accordion + details.accordion{ margin-top:.75rem; }
details.accordion summary{
  list-style:none; cursor:pointer; padding:1.1em 1.3em; display:flex; align-items:center; justify-content:space-between; gap:1em;
  font-family:var(--font-display); font-weight:600; font-size:var(--fs-md);
}
details.accordion summary::-webkit-details-marker{ display:none; }
details.accordion summary .plus{ width:26px; height:26px; border-radius:50%; background:var(--cream); color:var(--navy); flex:none; display:flex; align-items:center; justify-content:center; transition:transform .3s var(--ease); }
details.accordion summary .plus svg{ width:12px; height:12px; }
details.accordion[open] summary .plus{ transform:rotate(135deg); }
.accordion-body{ padding:0 1.3em 1.3em; color:var(--navy-80); font-size:var(--fs-sm); }
.accordion-body .check-list{ margin-top:.3em; }

/* ==========================================================================
   Testimonial / quote-style layout (used for founder philosophy quotes)
   ========================================================================== */
.quote-block{ display:grid; grid-template-columns:auto 1fr; gap:var(--sp-md); align-items:center; }
@media (max-width:760px){ .quote-block{ grid-template-columns:1fr; text-align:center; } .quote-block .qimg{ margin-inline:auto; } }
.quote-block .qimg{ width:140px; height:140px; border-radius:50%; overflow:hidden; box-shadow:var(--shadow-md); flex:none; }
.quote-block .qimg img{ width:100%; height:100%; object-fit:cover; }
.quote-block blockquote{ font-family:var(--font-display); font-style:italic; font-size:var(--fs-lg); line-height:1.4; color:var(--navy); }
.quote-block cite{ display:block; margin-top:.8em; font-style:normal; font-family:var(--font-body); font-weight:600; font-size:var(--fs-sm); color:var(--steel-deep); }

/* ==========================================================================
   CTA banner
   ========================================================================== */
.cta-banner{ position:relative; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-lg); }
.cta-banner .bg-img{ position:absolute; inset:0; }
.cta-banner .bg-img img{ width:100%; height:100%; object-fit:cover; }
.cta-banner .bg-img::after{ content:''; position:absolute; inset:0; background:linear-gradient(100deg, rgba(34,50,65,.92) 30%, rgba(34,50,65,.55) 65%, rgba(34,50,65,.25) 100%); }
.cta-banner .inner{ position:relative; padding:clamp(2.4rem,6vw,4.5rem); max-width:640px; }
.cta-banner .eyebrow{ color:var(--powder); }
.cta-banner h2{ color:var(--white); font-size:var(--fs-2xl); margin-top:.5rem; }
.cta-banner p{ color:rgba(243,235,221,.88); margin-top:var(--sp-sm); }
.cta-banner .btn-row{ margin-top:var(--sp-md); }
@media (max-width:640px){ .cta-banner .inner{ max-width:none; } }

/* ==========================================================================
   Form
   ========================================================================== */
.form-card{ background:var(--white); border-radius:var(--radius-lg); box-shadow:var(--shadow-md); padding:clamp(1.5rem,4vw,2.8rem); }
.field{ display:flex; flex-direction:column; gap:.5em; }
.field + .field{ margin-top:var(--sp-sm); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-sm); }
@media (max-width:560px){ .field-row{ grid-template-columns:1fr; } }
.field label{ font-size:var(--fs-xs); font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--navy-60); }
.field .req{ color:var(--steel-deep); }
.field input, .field select, .field textarea{
  width:100%; padding:.9em 1em; border-radius:var(--radius-sm); border:1.5px solid var(--line);
  background:var(--cream-soft); font-size:var(--fs-base); transition:border-color .25s var(--ease), background-color .25s var(--ease);
  min-height:50px;
}
.field textarea{ min-height:110px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--steel); background:var(--white); outline:none; }
.field input:invalid:not(:placeholder-shown){ border-color:#c0554f; }
.field-hint{ font-size:var(--fs-xs); color:var(--navy-60); }
.field-error{ font-size:var(--fs-xs); color:#a8433c; display:none; }
.field.has-error input, .field.has-error select, .field.has-error textarea{ border-color:#a8433c; }
.field.has-error .field-error{ display:block; }
.form-actions{ margin-top:var(--sp-md); display:flex; flex-direction:column; gap:.8em; }
.form-note{ font-size:var(--fs-xs); color:var(--navy-60); text-align:center; }
.form-status{ font-size:var(--fs-sm); font-weight:600; text-align:center; min-height:1.4em; }
.form-status.is-error{ color:#a8433c; }
.form-status.is-ok{ color:var(--wa-green); }
.select-wrap{ position:relative; }
.select-wrap::after{
  content:''; position:absolute; right:1.1em; top:50%; width:9px; height:9px;
  border-right:2px solid var(--navy-60); border-bottom:2px solid var(--navy-60);
  transform:translateY(-70%) rotate(45deg); pointer-events:none;
}
.select-wrap select{ appearance:none; -webkit-appearance:none; }

/* ==========================================================================
   Quiz
   ========================================================================== */
.quiz-shell{ background:var(--white); border-radius:var(--radius-lg); box-shadow:var(--shadow-md); padding:clamp(1.6rem,4vw,3rem); max-width:760px; margin-inline:auto; }
.quiz-progress{ height:6px; border-radius:var(--radius-pill); background:var(--cream); overflow:hidden; }
.quiz-progress-bar{ height:100%; background:var(--steel); border-radius:inherit; transition:width .4s var(--ease); width:0%; }
.quiz-meta{ display:flex; justify-content:space-between; align-items:center; margin-top:.8em; font-size:var(--fs-xs); color:var(--navy-60); font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.quiz-question{ margin-top:var(--sp-md); }
.quiz-question h2{ font-size:var(--fs-lg); }
.quiz-options{ margin-top:var(--sp-md); display:flex; flex-direction:column; gap:.7em; }
.quiz-option{
  text-align:left; padding:1em 1.2em; border-radius:var(--radius-md); border:1.5px solid var(--line);
  background:var(--cream-soft); font-size:var(--fs-sm); display:flex; align-items:center; gap:.9em;
  transition:border-color .25s var(--ease), background-color .25s var(--ease), transform .2s var(--ease);
  width:100%;
}
.quiz-option .letter{ width:28px; height:28px; border-radius:50%; background:var(--white); border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:var(--fs-xs); flex:none; transition:inherit; }
.quiz-option:hover{ border-color:var(--steel); transform:translateX(3px); }
.quiz-option:hover .letter{ border-color:var(--steel); color:var(--steel-deep); }
.quiz-option:active{ transform:translateX(0) scale(.99); }
.quiz-nav{ margin-top:var(--sp-md); display:flex; justify-content:space-between; align-items:center; }
.quiz-back{ font-size:var(--fs-sm); font-weight:600; color:var(--navy-60); display:inline-flex; align-items:center; gap:.4em; }
.quiz-back[disabled]{ opacity:0; pointer-events:none; }
.quiz-back svg{ width:1em; height:1em; }
.quiz-restart{ font-size:var(--fs-sm); font-weight:600; color:var(--steel-deep); }

.quiz-result{ display:none; }
.quiz-result.is-active{ display:block; }
.quiz-result .eyebrow{ margin-bottom:.6em; }
.quiz-result h2{ font-size:var(--fs-xl); }
.quiz-result .lede{ font-size:var(--fs-md); color:var(--steel-deep); margin-top:.5em; font-family:var(--font-display); font-style:italic; }
.quiz-result p{ margin-top:var(--sp-sm); color:var(--navy-80); }
.quiz-result .btn-row{ margin-top:var(--sp-md); }
[data-quiz-step]{ display:none; }
[data-quiz-step].is-active{ display:block; }

/* ==========================================================================
   Certifications
   ========================================================================== */
.cert-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-md); margin-top:var(--sp-lg); }
@media (max-width:820px){ .cert-grid{ grid-template-columns:1fr; } }
.cert-card{ background:var(--white); border-radius:var(--radius-md); padding:var(--sp-md); box-shadow:var(--shadow-sm); text-align:center; }
.cert-card .badge{ width:52px; height:52px; border-radius:50%; background:var(--powder); color:var(--navy); display:flex; align-items:center; justify-content:center; margin-inline:auto; }
.cert-card .badge svg{ width:26px; height:26px; }
.cert-card h3{ margin-top:.9em; font-size:var(--fs-md); }
.cert-card p{ margin-top:.4em; font-size:var(--fs-sm); color:var(--navy-80); margin-inline:auto; }

/* ==========================================================================
   Stat row
   ========================================================================== */
.stat-row{ display:flex; flex-wrap:wrap; gap:var(--sp-lg); margin-top:var(--sp-lg); }
.stat{ min-width:140px; }
.stat .n{ font-family:var(--font-display); font-size:var(--fs-2xl); color:var(--navy); font-weight:600; }
.stat .l{ font-size:var(--fs-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--steel-dark); font-weight:600; margin-top:.3em; }

/* ==========================================================================
   Legal pages
   ========================================================================== */
.legal-body h2{ font-size:var(--fs-lg); margin-top:var(--sp-lg); }
.legal-body h2:first-child{ margin-top:0; }
.legal-body p{ margin-top:var(--sp-sm); max-width:70ch; color:var(--navy-80); }
.legal-body ul{ margin-top:var(--sp-sm); display:flex; flex-direction:column; gap:.5em; }
.legal-body ul li{ padding-left:1.3em; position:relative; color:var(--navy-80); max-width:70ch; }
.legal-body ul li::before{ content:''; position:absolute; left:0; top:.65em; width:6px; height:6px; border-radius:50%; background:var(--steel); }
.legal-updated{ font-size:var(--fs-xs); color:var(--navy-60); font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.legal-flag{ background:var(--tan); color:var(--navy); border-radius:6px; padding:.05em .5em; font-weight:700; font-size:.85em; }

/* ==========================================================================
   Page hero (interior pages)
   ========================================================================== */
.page-hero{ padding-top:clamp(2.5rem,5vw,4rem); padding-bottom:var(--sp-xl); }
.page-hero .eyebrow{ margin-bottom:var(--sp-sm); }
.page-hero h1{ font-size:var(--fs-2xl); max-width:20ch; }
.page-hero .lede{ font-size:var(--fs-md); color:var(--navy-80); margin-top:var(--sp-sm); max-width:60ch; }
.breadcrumb{ font-size:var(--fs-xs); color:var(--navy-60); font-weight:600; letter-spacing:.03em; margin-bottom:var(--sp-sm); }
.breadcrumb a{ color:var(--steel-deep); }

/* ==========================================================================
   Note / disclaimer callout
   ========================================================================== */
.note-card{ background:var(--powder); border-radius:var(--radius-md); padding:var(--sp-md); display:flex; gap:1em; align-items:flex-start; }
.note-card svg{ width:26px; height:26px; color:var(--navy); flex:none; margin-top:.1em; }
.note-card p{ color:var(--navy); font-size:var(--fs-sm); max-width:none; }
.note-card a{ font-weight:700; text-decoration:underline; text-underline-offset:3px; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background:var(--navy); color:var(--cream); padding-top:var(--sp-2xl); }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:var(--sp-lg); padding-bottom:var(--sp-xl); border-bottom:1px solid rgba(243,235,221,.14); }
@media (max-width:900px){ .footer-top{ grid-template-columns:1fr 1fr; row-gap:var(--sp-lg); } }
@media (max-width:560px){ .footer-top{ grid-template-columns:1fr; } }
.footer-brand .brand-logo-shell{ width:min(100%,310px); background:transparent; border:0; box-shadow:none; }
.footer-brand p{ margin-top:var(--sp-sm); color:rgba(243,235,221,.72); font-size:var(--fs-sm); max-width:32ch; }
.footer-social{ display:flex; gap:.7em; margin-top:var(--sp-sm); }
.footer-social a{ width:40px; height:40px; border-radius:50%; background:rgba(243,235,221,.1); display:flex; align-items:center; justify-content:center; transition:background-color .25s var(--ease), transform .25s var(--ease); }
.footer-social a:hover{ background:var(--steel); transform:translateY(-3px); }
.footer-social svg{ width:18px; height:18px; }
.footer-col .footer-heading{ font-family:var(--font-body); font-size:var(--fs-xs); font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--powder); }
.footer-col ul{ margin-top:var(--sp-sm); display:flex; flex-direction:column; gap:.65em; }
.footer-col a{ font-size:var(--fs-sm); color:rgba(243,235,221,.8); transition:color .25s var(--ease); }
.footer-col a:hover{ color:var(--white); }
.footer-bottom{ padding-block:var(--sp-md); display:flex; flex-wrap:wrap; gap:.8em 1.6em; align-items:center; justify-content:space-between; font-size:var(--fs-xs); color:rgba(243,235,221,.6); }
.footer-legal-links{ display:flex; flex-wrap:wrap; gap:1em; }

/* ==========================================================================
   Floating WhatsApp (desktop) + sticky bottom bar (mobile)
   ========================================================================== */
.wa-float{
  position:fixed; right:clamp(1.1rem,3vw,2rem); bottom:clamp(1.1rem,3vw,2rem); z-index:400;
  width:58px; height:58px; border-radius:50%; background:var(--wa-green); color:var(--white);
  display:flex; align-items:center; justify-content:center; box-shadow:var(--shadow-lg);
  transition:transform .3s var(--ease);
}
.wa-float:hover{ transform:scale(1.08); }
.wa-float svg{ width:28px; height:28px; }
.wa-sticky{ display:none; }

@media (max-width:760px){
  .wa-float{ display:none; }
  .wa-sticky{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:400;
    padding:.7rem 1rem max(.7rem, env(safe-area-inset-bottom));
    background:rgba(249,245,238,.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
    border-top:1px solid var(--line);
  }
  .wa-sticky .btn{ width:100%; }
  body{ padding-bottom:76px; }
  body.no-sticky-cta{ padding-bottom:0; }
  body.no-sticky-cta .wa-sticky{ display:none; }
}

/* ==========================================================================
   Reveal-on-scroll
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }
.reveal-group .reveal:nth-child(2){ transition-delay:.08s; }
.reveal-group .reveal:nth-child(3){ transition-delay:.16s; }
.reveal-group .reveal:nth-child(4){ transition-delay:.24s; }

/* ==========================================================================
   Misc components
   ========================================================================== */
.divider-wing{ display:flex; justify-content:center; margin-block:var(--sp-lg); color:var(--tan); }
.divider-wing svg{ width:46px; height:46px; }

.two-col-cta{ display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-md); margin-top:var(--sp-lg); }
@media (max-width:760px){ .two-col-cta{ grid-template-columns:1fr; } }
.mini-cta{ background:var(--white); border-radius:var(--radius-md); padding:var(--sp-md); box-shadow:var(--shadow-sm); }
.mini-cta .card-icon{ margin-bottom:.8em; }
.mini-cta h3,.mini-cta h2{ font-size:var(--fs-md); }
.mini-cta p{ margin-top:.5em; color:var(--navy-80); font-size:var(--fs-sm); }
.mini-cta .btn{ margin-top:var(--sp-sm); }

.coming-soon-tag{ display:inline-block; background:var(--tan); color:var(--navy); font-size:var(--fs-xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:.35em .9em; border-radius:var(--radius-pill); }

.audience-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-sm); margin-top:var(--sp-lg); }
@media (max-width:900px){ .audience-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .audience-grid{ grid-template-columns:1fr; } }
.audience-card{ background:var(--white); border-radius:var(--radius-md); padding:var(--sp-md); text-align:center; box-shadow:var(--shadow-sm); }
.audience-card svg{ width:30px; height:30px; color:var(--steel-deep); margin-inline:auto; }
.audience-card p{ margin-top:.7em; font-weight:600; font-size:var(--fs-sm); margin-inline:auto; }

.testimonial-note{ text-align:center; padding:var(--sp-lg) 0; }
.testimonial-note p{ margin-inline:auto; color:var(--navy-60); font-style:italic; font-family:var(--font-display); font-size:var(--fs-md); }

/* ==========================================================================
   2026 content & media enhancement — Gallery / Insights / Testimonials
   Extends the existing palette, typography, radius and spacing language.
   ========================================================================== */
.dropdown-trigger.is-active{ color:var(--navy); font-weight:600; }
.dropdown-trigger.is-active::after{
  content:''; display:block; position:absolute; left:.1em; right:.1em; bottom:-.35em;
  height:2px; background:var(--steel);
}
.explore-dropdown .dropdown-panel{ min-width:270px; }

/* Home: featured moments */
.moments-grid{ display:grid; grid-template-columns:1.15fr 1fr 1fr; gap:var(--sp-sm); margin-top:var(--sp-lg); }
.moment-card{
  position:relative; min-height:320px; overflow:hidden; border-radius:var(--radius-md);
  background:var(--navy); box-shadow:var(--shadow-sm); isolation:isolate;
}
.moment-card picture,.moment-card img{ width:100%; height:100%; position:absolute; inset:0; }
.moment-card img{ object-fit:cover; transition:transform .55s var(--ease), opacity .4s var(--ease); }
.moment-card::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 36%,rgba(20,34,47,.82) 100%); z-index:1; }
.moment-card-copy{ position:absolute; inset:auto 0 0; padding:var(--sp-md); z-index:2; color:var(--white); display:grid; gap:.35rem; }
.moment-card-copy .eyebrow{ color:var(--powder); }
.moment-card-copy strong{ font-family:var(--font-display); font-size:var(--fs-md); line-height:1.2; }
.moment-card:hover img{ transform:scale(1.035); opacity:.96; }

/* Home / Insights cards */
.home-insights-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-md); margin-top:var(--sp-lg); }
.home-insight-card{ border:1px solid var(--line); border-radius:var(--radius-md); padding:var(--sp-md); background:var(--white); transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease); }
.home-insight-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); border-color:rgba(93,136,166,.35); }
.home-insight-card h3{ font-size:var(--fs-lg); margin-top:.65rem; }
.home-insight-card h3 a:hover{ color:var(--steel-deep); }
.home-insight-card p{ margin-top:.65rem; color:var(--navy-80); font-size:var(--fs-sm); }
.home-insight-card .card-link{ margin-top:var(--sp-sm); }

/* Testimonials: horizontal on small screens, fixed cards on desktop */
.testimonial-scroller{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--sp-sm); margin-top:var(--sp-lg); }
.testimonial-card{ background:rgba(255,255,255,.78); border:1px solid rgba(34,50,65,.1); border-radius:var(--radius-md); padding:var(--sp-md); box-shadow:var(--shadow-sm); }
.testimonial-card > svg{ width:28px; height:28px; color:var(--steel-deep); margin-bottom:var(--sp-sm); }
.testimonial-card > svg path{ stroke:currentColor; }
.testimonial-card blockquote{ font-family:var(--font-display); font-size:clamp(1rem,.96rem + .2vw,1.16rem); line-height:1.55; }
.testimonial-card figcaption{ margin-top:var(--sp-md); padding-top:var(--sp-sm); border-top:1px solid var(--line); display:grid; gap:.1rem; }
.testimonial-card figcaption strong{ font-size:var(--fs-sm); }
.testimonial-card figcaption span{ font-size:var(--fs-xs); color:var(--navy-60); }

/* Gallery */
.gallery-filters{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:var(--sp-md); margin-bottom:var(--sp-lg); }
.gallery-filter{ border:1px solid var(--line); border-radius:var(--radius-pill); padding:.65em 1.05em; font-size:var(--fs-xs); font-weight:700; color:var(--navy-80); background:var(--cream-soft); transition:background-color .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease); }
.gallery-filter:hover{ border-color:var(--steel); transform:translateY(-1px); }
.gallery-filter.is-active{ background:var(--navy); color:var(--cream); border-color:var(--navy); }
.gallery-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-sm); align-items:start; }
.gallery-card{ position:relative; display:block; width:100%; border-radius:var(--radius-md); overflow:hidden; background:var(--navy); text-align:left; box-shadow:var(--shadow-sm); isolation:isolate; min-height:280px; }
.gallery-card-media{ display:block; width:100%; height:100%; min-height:280px; }
.gallery-card picture,.gallery-card img{ display:block; width:100%; height:100%; }
.gallery-card img{ object-fit:cover; aspect-ratio:4/3; transition:transform .45s var(--ease), filter .35s var(--ease); }
.gallery-card:nth-child(2n) img{ aspect-ratio:4/5; }
.gallery-card:nth-child(5n) img{ aspect-ratio:16/10; }
.gallery-card::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 44%,rgba(20,34,47,.88) 100%); pointer-events:none; }
.gallery-card-overlay{ position:absolute; z-index:2; left:0; right:0; bottom:0; padding:var(--sp-md); color:var(--white); display:grid; gap:.25rem; }
.gallery-card-category{ font-size:var(--fs-xs); font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--powder); }
.gallery-card-title{ font-family:var(--font-display); font-size:var(--fs-md); font-weight:600; line-height:1.25; }
.gallery-card:hover img,.gallery-card:focus-visible img{ transform:scale(1.035); filter:saturate(1.04); }
.gallery-grid[aria-busy="true"]{ opacity:.62; transition:opacity .15s ease; }
.gallery-grid[aria-busy="false"]{ opacity:1; transition:opacity .25s ease; }

/* Native dialog lightbox */
.lightbox{ width:min(1120px,calc(100vw - 2rem)); max-height:calc(100dvh - 2rem); padding:0; border:0; border-radius:var(--radius-lg); background:var(--navy); color:var(--white); overflow:hidden; box-shadow:var(--shadow-lg); }
.lightbox::backdrop{ background:rgba(13,23,32,.82); backdrop-filter:blur(4px); }
.lightbox-panel{ position:relative; display:grid; grid-template-columns:minmax(0,1.55fr) minmax(260px,.65fr); min-height:min(720px,calc(100dvh - 2rem)); }
.lightbox-media{ background:#15222e; display:flex; align-items:center; justify-content:center; min-height:0; }
.lightbox-media img{ width:100%; height:100%; max-height:calc(100dvh - 2rem); object-fit:contain; }
.lightbox-copy{ align-self:end; padding:clamp(1.5rem,3vw,2.5rem); }
.lightbox-copy .eyebrow{ color:var(--powder); }
.lightbox-copy h2{ font-size:var(--fs-lg); margin-top:.6rem; color:var(--white); }
.lightbox-copy p{ color:rgba(255,255,255,.72); margin-top:.6rem; font-size:var(--fs-sm); }
.lightbox-close,.lightbox-nav{ position:absolute; z-index:3; display:grid; place-items:center; width:44px; height:44px; border-radius:50%; color:var(--white); background:rgba(20,34,47,.72); border:1px solid rgba(255,255,255,.22); backdrop-filter:blur(8px); }
.lightbox-close{ top:1rem; right:1rem; }
.lightbox-nav{ top:50%; transform:translateY(-50%); }
.lightbox-prev{ left:1rem; }
.lightbox-next{ right:calc(36% + 1rem); }
.lightbox-close svg,.lightbox-nav svg{ width:20px; height:20px; fill:none; }
.lightbox-close svg path,.lightbox-nav svg path{ stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.lightbox-close:hover,.lightbox-nav:hover{ background:var(--steel-deep); }

/* Videos */
.video-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-md); margin-top:var(--sp-lg); align-items:start; }
.video-card{ background:var(--white); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-sm); border:1px solid var(--line); }
.video-shell{ position:relative; background:#111b24; aspect-ratio:16/9; overflow:hidden; }
.video-card.is-portrait .video-shell{ aspect-ratio:4/5; }
.video-shell video{ width:100%; height:100%; object-fit:contain; background:#111b24; }
.video-loading,.video-error{ position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); z-index:2; padding:.55em .8em; border-radius:var(--radius-pill); font-size:var(--fs-xs); color:var(--white); background:rgba(20,34,47,.72); backdrop-filter:blur(6px); }
.video-controls{ position:absolute; z-index:3; left:.7rem; right:.7rem; bottom:.7rem; display:grid; grid-template-columns:auto auto auto minmax(80px,1fr) auto auto minmax(60px,100px) auto; gap:.35rem; align-items:center; padding:.45rem; border-radius:var(--radius-md); background:rgba(20,34,47,.78); backdrop-filter:blur(10px); color:var(--white); }
.video-controls[hidden]{ display:none; }
.video-controls button{ width:36px; height:36px; display:grid; place-items:center; border-radius:50%; color:var(--white); }
.video-controls button:hover{ background:rgba(255,255,255,.12); }
.video-controls svg{ width:19px; height:19px; fill:none; color:currentColor; }
.video-controls svg path{ stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.video-controls [data-video-play] svg path{ fill:currentColor; stroke:currentColor; }
.video-time{ font-size:.72rem; white-space:nowrap; font-variant-numeric:tabular-nums; color:rgba(255,255,255,.82); }
.video-progress,.video-volume{ width:100%; accent-color:var(--powder); cursor:pointer; }
.video-card-copy{ padding:var(--sp-md); }
.video-card-copy h3{ font-size:var(--fs-md); margin-top:.6rem; }
.video-card-copy p{ margin-top:.55rem; font-size:var(--fs-sm); color:var(--navy-80); }
.compact-cta{ min-height:clamp(300px,34vw,420px); }
.compact-cta .bg-img img{ object-position:center 38%; }
.compact-cta .bg-img::after{ background:linear-gradient(100deg, rgba(34,50,65,.90) 18%, rgba(34,50,65,.68) 58%, rgba(34,50,65,.34) 100%); }
@media (max-width:700px){ .compact-cta{ min-height:280px; } .compact-cta .btn-row{ flex-wrap:wrap; } }

/* Insights listing */
.featured-insight{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr); gap:var(--sp-lg); align-items:center; }
.featured-insight-media{ border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-sm); }
.featured-insight-media img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .45s var(--ease); }
.featured-insight-media:hover img{ transform:scale(1.025); }
.featured-insight-copy h2{ font-size:var(--fs-xl); margin-top:.7rem; }
.featured-insight-copy h2 a:hover{ color:var(--steel-deep); }
.featured-insight-copy p{ margin-top:var(--sp-sm); color:var(--navy-80); }
.insight-meta{ display:flex; flex-wrap:wrap; gap:.7rem 1rem; margin-top:var(--sp-sm); font-size:var(--fs-xs); color:var(--navy-60); font-weight:600; }
.featured-insight-copy .card-link{ margin-top:var(--sp-md); }
.insight-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-md); margin-top:var(--sp-lg); }
.insight-card{ border-radius:var(--radius-md); overflow:hidden; background:var(--white); box-shadow:var(--shadow-sm); border:1px solid var(--line); transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.insight-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-md); }
.insight-card-media{ display:block; overflow:hidden; }
.insight-card-media img{ width:100%; aspect-ratio:16/10; object-fit:cover; transition:transform .45s var(--ease); }
.insight-card:hover .insight-card-media img{ transform:scale(1.025); }
.insight-card-copy{ padding:var(--sp-md); }
.insight-card-copy h3{ font-size:var(--fs-lg); margin-top:.6rem; }
.insight-card-copy h3 a:hover{ color:var(--steel-deep); }
.insight-card-copy p{ margin-top:.65rem; color:var(--navy-80); font-size:var(--fs-sm); }
.insight-card-copy .card-link{ margin-top:var(--sp-sm); }

/* Insight/article detail */
.article-hero h1{ max-width:24ch; }
.article-hero .insight-meta{ margin-top:var(--sp-md); }
.article-image{ border-radius:var(--radius-md); overflow:hidden; margin-bottom:var(--sp-lg); box-shadow:var(--shadow-sm); }
.article-image img{ width:100%; max-height:520px; object-fit:cover; }
.article-body{ font-size:var(--fs-base); }
.article-section + .article-section{ margin-top:var(--sp-lg); }
.article-section h2{ font-size:var(--fs-lg); margin-bottom:var(--sp-sm); }
.article-section p{ max-width:68ch; color:var(--navy-80); }
.article-section p + p{ margin-top:var(--sp-sm); }
.article-section ul{ display:grid; gap:.65rem; margin-top:var(--sp-sm); }
.article-section li{ position:relative; padding-left:1.25rem; color:var(--navy-80); }
.article-section li::before{ content:''; position:absolute; width:7px; height:7px; border-radius:50%; background:var(--steel); left:0; top:.7em; }
.reflection-prompt{ margin-top:var(--sp-lg); padding:var(--sp-md); border-radius:var(--radius-md); background:var(--powder); }
.reflection-prompt p{ margin-top:.65rem; font-family:var(--font-display); font-size:var(--fs-md); line-height:1.5; color:var(--navy); }
.article-back{ margin-top:var(--sp-lg); padding-top:var(--sp-md); border-top:1px solid var(--line); }

/* Workshop history */
.engagement-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-md); margin-top:var(--sp-lg); }
.engagement-card{ display:grid; grid-template-columns:180px minmax(0,1fr); min-height:260px; border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--line); background:var(--cream-soft); box-shadow:var(--shadow-sm); }
.engagement-media{ min-height:100%; }
.engagement-media picture,.engagement-media img{ width:100%; height:100%; display:block; }
.engagement-media img{ object-fit:cover; }
.engagement-copy{ padding:var(--sp-md); }
.engagement-copy h3{ font-size:var(--fs-md); margin-top:.6rem; }
.engagement-institution{ margin-top:.45rem; font-weight:600; color:var(--steel-deep); font-size:var(--fs-sm); }
.engagement-date{ display:block; margin-top:.4rem; font-size:var(--fs-xs); font-weight:700; color:var(--navy-60); }
.engagement-copy > p:not(.engagement-institution){ margin-top:.65rem; color:var(--navy-80); font-size:var(--fs-sm); }
.engagement-copy .pill-list{ margin-top:var(--sp-sm); }
.institution-strip{ margin-top:var(--sp-xl); padding:clamp(1.25rem,3vw,2rem); border-radius:var(--radius-md); background:var(--cream); border:1px solid var(--line); }
.institution-logo-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--sp-md); margin-top:var(--sp-md); }
.institution-logo-card{ min-width:0; display:flex; flex-direction:column; align-items:center; text-align:center; padding:clamp(1rem,2.5vw,1.5rem); background:var(--navy); border:1px solid rgba(255,255,255,.12); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); }
.institution-logo-media{ width:100%; min-height:150px; display:grid; place-items:center; padding:.75rem; }
.institution-logo-media img{ display:block; width:100%; height:130px; object-fit:contain; object-position:center; }
.institution-logo-card h3{ margin-top:.85rem; font-family:var(--font-body); font-size:clamp(.78rem,1.15vw,.95rem); line-height:1.45; font-weight:600; color:var(--white); max-width:28ch; }
@media (max-width:820px){ .institution-logo-grid{ grid-template-columns:1fr; } .institution-logo-media{ min-height:125px; } .institution-logo-media img{ height:110px; } }

@media (max-width:1100px){
  .testimonial-scroller{ grid-template-columns:repeat(2,1fr); }
  .engagement-card{ grid-template-columns:150px minmax(0,1fr); }
  .video-controls{ grid-template-columns:auto auto auto minmax(80px,1fr) auto auto auto; }
  .video-volume{ display:none; }
}
@media (max-width:820px){
  .moments-grid{ grid-template-columns:1fr 1fr; }
  .moment-card:first-child{ grid-column:1/-1; }
  .home-insights-grid{ grid-template-columns:1fr; }
  .gallery-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .video-grid{ grid-template-columns:1fr; }
  .featured-insight{ grid-template-columns:1fr; gap:var(--sp-md); }
  .insight-grid{ grid-template-columns:1fr; }
  .engagement-grid{ grid-template-columns:1fr; }
  .lightbox-panel{ grid-template-columns:1fr; grid-template-rows:minmax(0,1fr) auto; }
  .lightbox-copy{ padding:var(--sp-md); }
  .lightbox-next{ right:1rem; }
}
@media (max-width:620px){
  .gallery-filters{ flex-wrap:nowrap; overflow-x:auto; padding-bottom:.3rem; scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
  .gallery-filter{ flex:none; }
  .gallery-grid{ grid-template-columns:1fr; }
  .gallery-card,.gallery-card-media{ min-height:0; }
  .gallery-card img,.gallery-card:nth-child(2n) img,.gallery-card:nth-child(5n) img{ aspect-ratio:4/3; }
  .moments-grid{ grid-template-columns:1fr; }
  .moment-card:first-child{ grid-column:auto; }
  .moment-card{ min-height:300px; }
  .testimonial-scroller{ display:flex; gap:var(--sp-sm); overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:.5rem; margin-inline:-1.25rem; padding-inline:1.25rem; }
  .testimonial-card{ min-width:min(84vw,340px); scroll-snap-align:start; }
  .engagement-card{ grid-template-columns:1fr; }
  .engagement-media{ max-height:240px; }
  .video-controls{ left:.4rem; right:.4rem; bottom:.4rem; grid-template-columns:auto auto minmax(72px,1fr) auto auto; padding:.35rem; }
  .video-controls [data-video-back],.video-controls [data-video-forward],.video-time{ display:none; }
  .video-controls button{ width:34px; height:34px; }
  .lightbox{ width:calc(100vw - 1rem); max-height:calc(100dvh - 1rem); border-radius:var(--radius-md); }
  .lightbox-panel{ min-height:calc(100dvh - 1rem); }
  .lightbox-media img{ max-height:70dvh; }
  .lightbox-prev{ left:.5rem; }
  .lightbox-next{ right:.5rem; }
  .lightbox-close{ top:.5rem; right:.5rem; }
  .article-image img{ max-height:380px; }
}
.noscript-note{ margin-bottom:var(--sp-md); padding:.8rem 1rem; border-radius:var(--radius-sm); background:var(--cream); border:1px solid var(--line); font-size:var(--fs-sm); color:var(--navy-80); }


/* Targeted refinement for Gallery and Insights pages */
.page-gallery .page-hero::before,.page-gallery .page-hero::after,.page-insights .page-hero::before,.page-insights .page-hero::after,.page-insight-detail .page-hero::before,.page-insight-detail .page-hero::after{ width:clamp(140px,18vw,240px); opacity:.14; }
.page-gallery main > .section::before,.page-gallery main > .section::after,.page-gallery main > .section-tight::before,.page-gallery main > .section-tight::after,.page-insights main > .section::before,.page-insights main > .section::after,.page-insights main > .section-tight::before,.page-insights main > .section-tight::after,.page-insight-detail main > .section::before,.page-insight-detail main > .section::after,.page-insight-detail main > .section-tight::before,.page-insight-detail main > .section-tight::after{ width:clamp(140px,18vw,240px); opacity:.10; }
.page-insights .featured-insight-media,.page-insights .insight-card,.page-insight-detail .article-image{ box-shadow:var(--shadow-md); }