/*
Theme Name: Jeûner Randonner
Author: Hélène Lefort
Version: 1.5
Description: Thème WordPress pour Jeûner Randonner — jeûne Buchinger accompagné à Nantes.
*/
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&display=swap');

/* ══════════════════════════════════════════════
   FONTS — Local
   ══════════════════════════════════════════════ */
@font-face{font-family:'DevinaGarden';src:url('DevinaGarden.otf') format('opentype');font-display:swap;}
@font-face{font-family:'HumanSans';src:url('HumanSans-Regular.otf') format('opentype');font-weight:400;font-display:swap;}
@font-face{font-family:'HumanSans';src:url('HumanSans-Thin.otf') format('opentype');font-weight:300;font-display:swap;}

/* ══════════════════════════════════════════════
   DESIGN TOKENS
   ══════════════════════════════════════════════ */
:root{
  --navy:       #2b3a67;
  --navy-mid:   #3d5299;
  --navy-light: #5a6fa0;
  --navy-pale:  #8a9bc4;
  --cream:      #f8f5e6;
  --cream-warm: #f0ead6;
  --cream-card: #ede8df;
  --cream-deep: #e6dece;
  --taupe:      #b0a090;
  --taupe-light:#d4cdc0;
  --taupe-pale: #e8e3dc;
  --sage:       #9ab89a;
  --sage-mid:   #7da07d;
  --sage-dark:  #5a7e5a;
  --sage-pale:  #d8e8d8;
  --white:      #ffffff;
  --text:       #4a4a5a;
  --text-body:  #4a4a5a;
  --text-light: #7a7a8a;
  --text-mid:   #7a7a8a;
  --text-faint: #a8a8b8;
  --bg-sage:    #e8f2e8;

  --ff-script: 'DevinaGarden','Caveat',cursive;
  --ff-body:   'HumanSans','Outfit',sans-serif;
  --ff-serif:  'HumanSans',serif;

  --sh:    0 2px 20px rgba(43,58,103,.07), 0 1px 4px rgba(43,58,103,.04);
  --sh-sm: 0 1px 8px rgba(43,58,103,.06);
  --sh-lg: 0 12px 48px rgba(43,58,103,.14), 0 4px 12px rgba(43,58,103,.06);
  --sh-up: 0 -2px 20px rgba(43,58,103,.05);

  --r-sm:   8px;
  --r-card: 16px;
  --r-lg:   20px;
  --r-xl:   28px;
  --r-pill: 30px;

  --ease-out-expo: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out:   cubic-bezier(0.65, 0, 0.35, 1);

  --nav-h: 80px;
}

/* ══════════════════════════════════════════════
   RESET + BASE
   ══════════════════════════════════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;cursor:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='20' viewBox='0 0 14 20'><path d='M1,1 L1,15 L5,11 L8,19 L11,18 L8,10 L13,10 Z' fill='%232b3a67' stroke='white' stroke-width='1.2' stroke-linejoin='round' stroke-linecap='round'/></svg>") 1 1, auto !important;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  font-family:var(--ff-body);
  color:var(--text);
  background:var(--cream);
  line-height:1.6;
  overflow-x:hidden;
  opacity:0;
  animation:pageLoad .65s var(--ease-out-expo) .05s forwards;
}
@keyframes pageLoad{to{opacity:1;}}
img{display:block;max-width:100%;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}

/* ══════════════════════════════════════════════
   PROGRESS BAR
   ══════════════════════════════════════════════ */
.progress-bar{
  position:fixed;top:0;left:0;height:2.5px;
  background:linear-gradient(90deg, var(--sage) 0%, var(--navy) 100%);
  z-index:999;width:0%;
  transition:width .12s linear;
  box-shadow:0 0 10px rgba(154,184,154,.5);
}

/* ══════════════════════════════════════════════
   NAVIGATION
   ══════════════════════════════════════════════ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:22px 60px;
  display:flex;align-items:center;justify-content:space-between;
  transition:padding .4s var(--ease-out-expo), background .4s ease, box-shadow .4s ease;
}
.nav.scrolled{
  background:rgba(248,245,230,.94);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  padding:14px 60px;
  box-shadow:0 1px 0 rgba(43,58,103,.07), 0 4px 24px rgba(43,58,103,.06);
}
.nav-logo{display:flex;align-items:center;gap:12px;}
.nav-logo-mark{
  width:40px;height:40px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.92);
  box-shadow:0 1px 6px rgba(0,0,0,.15);
  overflow:hidden;
  transition:background .4s var(--ease-out-expo), box-shadow .4s var(--ease-out-expo), transform .4s var(--ease-out-expo);
  flex-shrink:0;
}
.nav-logo-mark img{
  width:36px;height:36px;object-fit:contain;
}
.nav.scrolled .nav-logo-mark{background:rgba(255,255,255,.95);box-shadow:0 1px 6px rgba(43,58,103,.10);}
.nav-logo:hover .nav-logo-mark{transform:scale(1.08) rotate(-4deg);}
.nav-logo-text{
  font-family:var(--ff-script);
  font-size:1.4rem;
  color:rgba(255,255,255,.92);
  transition:color .4s;
}
.nav.scrolled .nav-logo-text{color:var(--navy);}
.nav-logo:hover .nav-logo-text{color:var(--sage);}
.nav.scrolled .nav-logo:hover .nav-logo-text{color:var(--sage-mid);}

.nav-links{display:flex;gap:36px;}
.nav-links a{
  font-size:.67rem;font-weight:500;letter-spacing:.28em;text-transform:uppercase;
  color:rgba(255,255,255,.68);
  transition:color .3s;
  position:relative;
}
.nav-links a::after{
  content:'';position:absolute;left:0;bottom:-3px;
  width:0;height:1px;
  background:rgba(255,255,255,.5);
  transition:width .3s var(--ease-out-expo);
}
.nav-links a:hover{color:rgba(255,255,255,1);}
.nav-links a:hover::after,.nav-links a.active::after{width:100%;}
.nav-links a.active{color:rgba(255,255,255,1);}
.nav.scrolled .nav-links a{color:var(--navy);opacity:.62;}
.nav.scrolled .nav-links a::after{background:var(--sage-mid);}
.nav.scrolled .nav-links a:hover,.nav.scrolled .nav-links a.active{opacity:1;color:var(--navy);}

.nav-cta{
  font-size:.65rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  color:rgba(255,255,255,.88);
  border:1.5px solid rgba(255,255,255,.35);
  border-radius:var(--r-pill);
  padding:9px 24px;
  display:inline-block;
  transition:background .28s, color .28s, border-color .28s, box-shadow .28s;
}
.nav-cta:hover{
  background:rgba(255,255,255,.15);
  border-color:rgba(255,255,255,.6);
  color:white;
}
.nav.scrolled .nav-cta{color:var(--navy);border-color:rgba(43,58,103,.28);}
.nav.scrolled .nav-cta:hover{
  background:var(--navy);color:var(--cream);
  border-color:var(--navy);
  box-shadow:0 4px 16px rgba(43,58,103,.2);
}

.hamburger{
  display:none;flex-direction:column;gap:5px;
  cursor:pointer;border:none;background:none;padding:4px;
}
.hamburger span{
  width:24px;height:1.5px;background:white;border-radius:2px;
  transition:transform .35s var(--ease-out-expo), opacity .25s, background .4s;
  display:block;
}
.nav.scrolled .hamburger span{background:var(--navy);}

/* ══════════════════════════════════════════════
   MOBILE MENU
   ══════════════════════════════════════════════ */
.mobile-menu{
  position:fixed;inset:0;
  background:var(--cream);
  z-index:99;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:20px;
  transform:translateX(100%);
  transition:transform .45s var(--ease-out-expo);
  overflow:hidden;
}
.mobile-menu.open{transform:translateX(0);}
.mobile-menu a{
  font-family:var(--ff-script);font-size:2rem;
  color:var(--navy);
  opacity:0;transform:translateX(28px);
  transition:opacity .45s ease, transform .45s var(--ease-out-expo), color .2s;
}
.mobile-menu.open a{opacity:1;transform:translateX(0);}
.mobile-menu.open a:nth-child(2){transition-delay:.10s;}
.mobile-menu.open a:nth-child(3){transition-delay:.18s;}
.mobile-menu.open a:nth-child(4){transition-delay:.26s;}
.mobile-menu.open a:nth-child(5){transition-delay:.34s;}
.mobile-menu.open a:nth-child(6){transition-delay:.40s;}
.mobile-menu a:hover{color:var(--sage-mid);}
.mobile-menu-cta{
  font-family:var(--ff-body) !important;
  font-size:.72rem !important;
  font-weight:500;letter-spacing:.24em;text-transform:uppercase;
  color:var(--white) !important;
  background:var(--navy);
  border-radius:var(--r-pill);
  padding:12px 32px !important;
  margin-top:8px;
  transition-delay:.42s !important;
}
.mobile-menu-cta:hover{color:var(--white) !important;background:var(--navy-mid);}
.mobile-menu-deco{
  position:absolute;bottom:-10px;
  font-family:var(--ff-script);font-size:9rem;
  color:rgba(43,58,103,.04);
  pointer-events:none;user-select:none;white-space:nowrap;
  opacity:0;transform:translateY(20px);
  transition:opacity .5s ease .4s, transform .5s var(--ease-out-expo) .4s;
}
.mobile-menu.open .mobile-menu-deco{opacity:1;transform:translateY(0);}

/* ══════════════════════════════════════════════
   BLOB KEYFRAMES (shared)
   ══════════════════════════════════════════════ */
@keyframes blobDrift{
  0%,100%{transform:translate(0,0) rotate(0deg);}
  33%{transform:translate(18px,-22px) rotate(4deg);}
  66%{transform:translate(-12px,14px) rotate(-3deg);}
}
@keyframes blobDrift2{
  0%,100%{transform:translate(0,0) scale(1);}
  40%{transform:translate(-16px,20px) scale(1.05);}
  70%{transform:translate(10px,-10px) scale(0.96);}
}

/* ══════════════════════════════════════════════
   HERO — index.html full-viewport photo
   ══════════════════════════════════════════════ */
.hero{
  position:relative;width:100%;height:100vh;min-height:620px;
  display:flex;align-items:center;overflow:hidden;
}
.hero-bg{position:absolute;inset:0;}
.hero-bg img{width:100%;height:100%;object-fit:cover;display:block;}
.hero-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.5s ease-in-out;}
.hero-slide--active{opacity:1;}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(160deg, rgba(30,40,70,.52) 0%, rgba(43,58,103,.68) 60%, rgba(20,30,55,.80) 100%);
}
/* Organic blobs */
.hero::before{
  content:'';position:absolute;
  width:700px;height:700px;top:-140px;right:-160px;
  background:radial-gradient(ellipse, rgba(154,184,154,.09) 0%, transparent 65%);
  border-radius:40% 60% 55% 45% / 50% 40% 60% 50%;
  animation:blobDrift 26s ease-in-out infinite;
  pointer-events:none;z-index:1;
}
.hero::after{
  content:'';position:absolute;
  width:480px;height:480px;bottom:-80px;left:-100px;
  background:radial-gradient(ellipse, rgba(176,160,144,.07) 0%, transparent 65%);
  border-radius:60% 40% 45% 55% / 40% 55% 45% 60%;
  animation:blobDrift 20s ease-in-out 4s infinite reverse;
  pointer-events:none;z-index:1;
}
.hero-content{
  position:relative;z-index:2;
  padding:0 64px;max-width:820px;
  animation:fadeUp .95s var(--ease-out-expo) .3s both;
}
.hero-label{
  font-size:.64rem;font-weight:500;letter-spacing:.44em;text-transform:uppercase;
  color:rgba(255,255,255,.52);margin-bottom:22px;display:block;
}
.hero-title{
  font-family:var(--ff-script);
  font-size:clamp(2.8rem,5.5vw,6rem);
  color:white;
  line-height:.9;
  margin-bottom:24px;
}
.hero-title em{color:var(--sage);font-style:normal;}
.hero-tagline{
  font-family:var(--ff-body);font-size:clamp(.95rem,1.4vw,1.1rem);
  color:rgba(255,255,255,.62);font-style:italic;letter-spacing:.08em;margin-bottom:14px;
}
.hero-desc{
  font-family:var(--ff-body);font-size:clamp(.9rem,1.3vw,1rem);
  color:rgba(255,255,255,.58);line-height:1.88;
  max-width:540px;margin-bottom:38px;
}
.hero-btns{display:flex;gap:14px;flex-wrap:wrap;}
.hero-scroll{
  position:absolute;bottom:38px;left:64px;z-index:2;
  display:flex;flex-direction:column;align-items:flex-start;gap:10px;
  animation:fadeIn 1s ease 1.2s both;
}
.hero-scroll-line{
  width:1px;height:44px;
  background:linear-gradient(to bottom, transparent, rgba(255,255,255,.4));
}
.hero-scroll-label{
  font-size:.52rem;letter-spacing:.44em;text-transform:uppercase;
  color:rgba(255,255,255,.35);
  writing-mode:vertical-lr;transform:rotate(180deg);
}

/* ══════════════════════════════════════════════
   PAGE HERO — inner pages
   ══════════════════════════════════════════════ */
.page-hero{
  position:relative;
  height:clamp(300px,52vh,520px);min-height:320px;
  display:flex;align-items:flex-end;overflow:hidden;
  padding-top:var(--nav-h);
}
.page-hero-bg{position:absolute;inset:0;}
.page-hero-bg img{width:100%;height:100%;object-fit:cover;display:block;}
.page-hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(160deg, rgba(30,40,70,.48) 0%, rgba(43,58,103,.72) 70%, rgba(20,30,55,.85) 100%);
}
.page-hero-content{
  position:relative;z-index:2;
  padding:48px 64px 52px;
  animation:fadeUp .8s var(--ease-out-expo) .15s both;
}
.page-hero-content .label{color:rgba(255,255,255,.5);opacity:1;margin-bottom:10px;display:block;}
.page-hero-content .label::before{background:rgba(255,255,255,.35);}
.page-hero-content h1{
  font-family:var(--ff-script);
  font-size:clamp(2.8rem,6vw,5.5rem);
  color:white;line-height:.95;margin-top:14px;margin-bottom:8px;
}

/* ══════════════════════════════════════════════
   BUTTONS
   ══════════════════════════════════════════════ */
.btn{
  font-size:.68rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  border-radius:var(--r-pill);padding:13px 34px;
  display:inline-block;
  transition:background .28s ease, color .28s ease, border-color .28s ease, box-shadow .28s ease, transform .15s ease;
  cursor:none;
  border:1.5px solid transparent;
  position:relative;overflow:hidden;
}
.btn::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.12) 50%, transparent 60%);
  transform:translateX(-100%);
  transition:transform .55s var(--ease-out-expo);
  pointer-events:none;
}
.btn:hover::before{transform:translateX(120%);}
.btn-primary,.btn-dark{background:var(--navy);color:var(--cream);border-color:var(--navy);}
.btn-primary:hover,.btn-dark:hover{background:transparent;color:var(--navy);box-shadow:0 0 0 1.5px var(--navy);}
.btn-outline{background:transparent;color:var(--navy);border-color:rgba(43,58,103,.28);}
.btn-outline:hover{border-color:var(--navy);background:rgba(43,58,103,.04);}
.btn-white,.btn-cream{
  font-size:.68rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  color:var(--navy);background:var(--cream);
  border:none;border-radius:var(--r-pill);padding:14px 34px;
  display:inline-block;cursor:none;
  box-shadow:0 4px 24px rgba(248,245,230,.2);
  transition:background .28s, box-shadow .28s, transform .15s ease;
  position:relative;overflow:hidden;
}
.btn-white::before,.btn-cream::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg, transparent 40%, rgba(255,255,255,.2) 50%, transparent 60%);
  transform:translateX(-100%);
  transition:transform .55s var(--ease-out-expo);
  pointer-events:none;
}
.btn-white:hover::before,.btn-cream:hover::before{transform:translateX(120%);}
.btn-white:hover,.btn-cream:hover{
  background:rgba(248,245,230,.88);
  box-shadow:0 10px 36px rgba(0,0,0,.18);
}
.btn-outline-white{
  background:transparent;color:rgba(255,255,255,.82);
  border-color:rgba(255,255,255,.35);
}
.btn-outline-white:hover{
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.65);color:white;
}
.btn-arr{margin-left:6px;display:inline-block;transition:transform .3s var(--ease-out-expo);}
.btn:hover .btn-arr,.btn-white:hover .btn-arr,.btn-cream:hover .btn-arr{transform:translateX(4px);}

.btn:active,.btn-white:active,.btn-cream:active{
  transform:scale(.96);
}

/* ══════════════════════════════════════════════
   SECTIONS + CONTAINERS
   ══════════════════════════════════════════════ */
.section{padding:104px 64px;position:relative;}
.section--sm{padding:64px 64px;}
.section--alt{background:var(--cream-warm);}
.section--sage{
  background:linear-gradient(135deg, #edf5ed 0%, var(--sage-pale) 50%, #edf5ed 100%);
}
.container{max-width:1180px;margin:0 auto;}
.container--narrow{max-width:780px;margin:0 auto;}
.text-center{text-align:center;}

/* ══════════════════════════════════════════════
   LABELS + SECTION HEADERS + LEAD
   ══════════════════════════════════════════════ */
.label{
  font-size:.64rem;font-weight:500;letter-spacing:.44em;text-transform:uppercase;
  color:var(--navy);opacity:.52;
  display:flex;align-items:center;gap:10px;
}
.label::before{
  content:'';display:inline-block;width:18px;height:1px;
  background:var(--sage-mid);opacity:.8;flex-shrink:0;
}
.text-center .label,.cta-section .label{justify-content:center;}
.text-center .label::before{display:none;}
.section-header{margin-bottom:52px;}
.section-header h2{
  font-family:var(--ff-script);
  font-size:clamp(2.4rem,5vw,4.2rem);
  color:var(--navy);line-height:1.05;margin:10px 0 14px;
}
.lead{
  font-family:var(--ff-body);font-size:1.05rem;line-height:1.8;
  color:var(--text);
}
.section-header .lead{max-width:640px;}
.text-center .lead{margin:0 auto;}
.body-note{
  font-family:var(--ff-body);font-size:.95rem;line-height:1.8;
  color:var(--text-mid);
}

/* Divider */
.divider{
  width:0;height:1.5px;background:var(--sage);opacity:.45;
  margin:20px 0;
  transition:width .9s var(--ease-out-expo);position:relative;
}
.divider.visible{width:44px;}
.divider.visible::after{
  content:'';position:absolute;right:-4px;top:50%;transform:translateY(-50%);
  width:5px;height:5px;border-radius:50%;background:var(--sage);opacity:.7;
}

/* ══════════════════════════════════════════════
   BREATHE SECTION — Marcher · Respirer · Se régénérer
   ══════════════════════════════════════════════ */
/* OLD BREATHE — 3-column grid with two flanking photos (left: forest, right: woman by water)
.breathe-section{
  display:grid;
  grid-template-columns:minmax(140px,250px) 1fr minmax(140px,250px);
  align-items:center;
  overflow:hidden;
  background:var(--cream);
}
.breathe-img{
  height:460px;
  overflow:hidden;
}
.breathe-img img{
  width:100%;height:100%;
  object-fit:cover;display:block;
}
.breathe-img--left{
  opacity:0;transform:translateX(-80px);
  transition:opacity .95s var(--ease-out-expo), transform .95s var(--ease-out-expo);
  clip-path:url(#breatheClipLeft);
}
.breathe-img--left.visible{opacity:1;transform:translateX(0);}
.breathe-img--right{
  opacity:0;transform:translateX(80px);
  transition:opacity .95s var(--ease-out-expo), transform .95s var(--ease-out-expo);
  clip-path:url(#breatheClipRight);
}
.breathe-img--right.visible{opacity:1;transform:translateX(0);}
.breathe-content{padding:60px 80px;text-align:center;}
.breathe-title{font-family:var(--ff-script);font-size:clamp(2rem,3.5vw,3.2rem);color:var(--navy);line-height:1.2;margin-bottom:22px;}
.breathe-illus{width:clamp(80px,10vw,130px);margin:0 auto 24px;display:block;}
.breathe-desc{font-family:var(--ff-body);font-size:clamp(.88rem,1.2vw,1rem);color:var(--text);line-height:1.9;}
@media(max-width:900px){.breathe-section{grid-template-columns:minmax(100px,160px) 1fr minmax(100px,160px);}.breathe-content{padding:48px 40px;}}
@media(max-width:600px){.breathe-section{grid-template-columns:1fr;grid-template-rows:auto auto auto;}.breathe-img{height:220px;}.breathe-img--left{order:-1;}.breathe-img--right{order:1;}.breathe-content{padding:40px 24px;}}
END OLD BREATHE */
.breathe-section{
  display:flex;
  flex-direction:column;
  background:var(--cream);
  overflow:hidden;
}
.breathe-img{
  overflow:hidden;
}
.breathe-img img{
  width:100%;height:100%;
  object-fit:cover;display:block;
}
.breathe-img--full{
  display:flex;
  justify-content:center;
  opacity:0;transform:translateY(30px);
  transition:opacity .95s var(--ease-out-expo), transform .95s var(--ease-out-expo);
}
.breathe-img--full img{
  width:auto;
  height:520px;
  object-fit:unset;
}
.breathe-img--full.visible{opacity:1;transform:translateY(0);}
.breathe-content{
  padding:60px 80px;
  text-align:center;
}
.breathe-title{
  font-family:var(--ff-script);
  font-size:clamp(2rem,3.5vw,3.2rem);
  color:var(--navy);
  line-height:1.2;
  margin-bottom:22px;
}
.breathe-illus{
  width:clamp(80px,10vw,130px);
  margin:0 auto 24px;
  display:block;
}
.breathe-desc{
  font-family:var(--ff-body);
  font-size:clamp(.88rem,1.2vw,1rem);
  color:var(--text);
  line-height:1.9;
}
@media(max-width:900px){
  .breathe-content{padding:48px 40px;}
}
@media(max-width:600px){
  .breathe-content{padding:40px 24px;}
  .breathe-img--full img{width:100%;height:280px;object-fit:cover;}
}


/* ══════════════════════════════════════════════
   INTRO SECTION
   ══════════════════════════════════════════════ */
.intro-section{background:var(--white);}
.intro-divider{
  width:0;height:1px;
  background:linear-gradient(90deg, transparent, var(--sage-mid), transparent);
  opacity:.5;margin:24px auto;
  transition:width .9s var(--ease-out-expo);
}
.intro-divider.visible{width:120px;}

/* ══════════════════════════════════════════════
   BENEFITS LIST
   ══════════════════════════════════════════════ */
.benefits-list{
  display:grid;grid-template-columns:repeat(auto-fill, minmax(260px,1fr));
}
/* Benefits puddle canvas — horizontal pill row layout */
.benefits-droppy {
  --text-color: var(--cream);
  --drops-color: var(--navy);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.9rem;
  height: auto;
  min-height: 0;
  margin: 1.5rem 0 0.5rem;
  overflow: visible;
}

/* Each word is its own self-contained pill bubble — no merging between words */
.benefits-droppy .puddle {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  /* Override the absolute-centered transform from the base .puddle rule */
  transform: rotate(var(--r, 0deg));
  /* Pill bubble styling */
  background: var(--navy);
  border-radius: 999px;
  padding: 0.25em 1.1em 0.38em;
  color: var(--cream);
  font-size: clamp(1.5rem, 2.8vw, 2rem);
}

/* Suppress the gooey merged-blob layer — each word is its own bubble */
.benefits-droppy .combined-puddles {
  display: none;
}

/* ══════════════════════════════════════════════
   SPLIT LAYOUT
   ══════════════════════════════════════════════ */
.split{
  display:grid;grid-template-columns:1fr 1fr;
  gap:72px;align-items:center;
}
.split-image{
  border-radius:var(--r-card);overflow:hidden;
  aspect-ratio:4/3;position:relative;
  box-shadow:var(--sh-lg);will-change:transform;
}
.split-image img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.split-image:hover img{transform:scale(1.035);}
.split-content{padding:12px 0;}
.split-content h2{
  font-family:var(--ff-script);
  font-size:clamp(2.2rem,4.5vw,3.8rem);
  color:var(--navy);line-height:1.05;margin:10px 0 18px;
}
.split-content p{
  font-family:var(--ff-body);font-size:1rem;line-height:1.75;
  color:var(--text);margin-bottom:14px;
}
.split-content .btn{margin-top:8px;}

/* ══════════════════════════════════════════════
   À QUI GRID
   ══════════════════════════════════════════════ */
.aqui-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0;
}
.aqui-item{
  display:flex;align-items:flex-start;gap:12px;
  padding:14px 16px;
  background:var(--cream-warm);border-radius:var(--r-sm);
  transition:background .25s;
}
.aqui-item:hover{background:var(--cream-deep);}
.aqui-icon{flex-shrink:0;margin-top:2px;color:var(--sage-mid);display:flex;align-items:center;}
.aqui-item p{font-size:.9rem;line-height:1.6;color:var(--text);}

/* ══════════════════════════════════════════════
   PILIERS GRID
   ══════════════════════════════════════════════ */
.piliers-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.pilier-card{
  background:var(--white);border-radius:var(--r-card);
  padding:36px 28px;box-shadow:var(--sh);
  position:relative;overflow:hidden;
  transition:transform .4s var(--ease-out-expo), box-shadow .4s ease;
  text-align:center;
}
.pilier-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg, var(--sage), var(--sage-mid) 60%, var(--navy-light));
}
.pilier-card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);}
.pilier-num{
  font-family:var(--ff-script);font-size:2.8rem;
  color:var(--sage-mid);
  margin-bottom:14px;
}
.pilier-card h3{
  font-family:var(--ff-script);font-size:1.95rem;
  color:var(--navy);margin-bottom:10px;
}
.pilier-card p{
  font-family:var(--ff-body);font-size:.93rem;line-height:1.75;color:var(--text);
}

/* ══════════════════════════════════════════════
   SESSION CARDS
   ══════════════════════════════════════════════ */
.session-card{
  background:var(--white);border-radius:var(--r-card);
  box-shadow:var(--sh);overflow:hidden;
}
.session-card-header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:32px;
  padding:40px 44px 28px;
  border-bottom:1px solid rgba(43,58,103,.07);
}
.session-badge{
  display:inline-block;
  font-size:.59rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
  color:white;background:var(--sage-mid);
  border-radius:var(--r-pill);padding:5px 14px;margin-bottom:14px;
}
.session-card-header h2{
  font-family:var(--ff-script);
  font-size:clamp(2.2rem,4vw,3.6rem);
  color:var(--navy);line-height:1.02;margin-bottom:12px;
}
.session-card-header .lead{max-width:560px;margin:0;}
.session-price-wrap{
  text-align:center;flex-shrink:0;
  padding:16px 20px;background:var(--cream-card);
  border-radius:var(--r-sm);min-width:170px;
}
.price-main{
  font-family:var(--ff-script);font-size:3.2rem;
  color:var(--navy);line-height:1;margin-bottom:4px;
}
.price-promo{
  font-family:var(--ff-serif);font-size:.95rem;font-style:italic;
  color:var(--sage-dark);display:block;
}
.price-period{
  font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-mid);display:block;margin-top:3px;
}
.session-card-body{padding:32px 44px 40px;}
.session-grid-2{
  display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:28px;
}
.session-block{margin-bottom:24px;}
.session-block:last-child{margin-bottom:0;}
.session-block-label{
  font-size:.61rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--navy);opacity:.6;display:block;margin-bottom:10px;
}
.session-list{font-size:.92rem;line-height:1.75;color:var(--text);}
.session-list li{
  display:flex;align-items:baseline;gap:10px;
  padding:4px 0;border-bottom:1px solid rgba(43,58,103,.05);
}
.session-list li:last-child{border-bottom:none;}
.session-list li::before{
  content:'';width:5px;height:5px;border-radius:50%;
  background:var(--sage-mid);flex-shrink:0;margin-top:5px;
}

/* ══════════════════════════════════════════════
   TARIFF BOX
   ══════════════════════════════════════════════ */
.tariff-box{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;
  padding:18px 24px;
  background:var(--cream-card);border-radius:var(--r-sm);
  border-left:3px solid var(--sage-mid);
}
.tariff-price{
  font-family:var(--ff-script);font-size:2.2rem;
  /* PROMO CODE — re-add  text-decoration:line-through  when promo is active */
  color:var(--text-mid);line-height:1;
}
.tariff-sep{color:var(--taupe-light);font-size:1.2rem;}
.tariff-promo{
  font-family:var(--ff-script);font-size:2.2rem;
  color:var(--sage-dark);line-height:1;
}
.tariff-promo-note{
  font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--text-mid);display:block;margin-top:2px;
}

/* ══════════════════════════════════════════════
   DAY TIMELINE
   ══════════════════════════════════════════════ */
.day-timeline{
  position:relative;
  max-width:680px;
  margin-inline:auto;
  padding:0.25rem 0;
}
.dti{
  display:grid;
  grid-template-columns:100px 36px 1fr;
  position:relative;
}
.dti-time-col{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  padding-top:17px;
  padding-right:14px;
}
.dti-time{
  display:inline-block;
  font-size:.67rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--sage-dark);
  background:rgba(125,160,125,.13);
  padding:4px 9px;border-radius:20px;
  white-space:nowrap;
  line-height:1.3;
}
.dti-axis{
  display:flex;flex-direction:column;align-items:center;
}
.dti-dot{
  width:14px;height:14px;border-radius:50%;flex-shrink:0;
  background:#fff;border:2.5px solid var(--sage-mid);
  box-shadow:0 0 0 5px rgba(125,160,125,.14);
  margin-top:20px;position:relative;z-index:1;
}
.dti-stem{
  flex:1;width:2px;min-height:20px;
  background:linear-gradient(to bottom,rgba(125,160,125,.45),rgba(125,160,125,.08));
}
.dti:last-child .dti-stem{display:none;}
.dti-card{
  margin-left:18px;margin-bottom:14px;
  background:#fff;
  border:1px solid rgba(43,58,103,.07);
  border-radius:14px;
  padding:17px 20px;
  box-shadow:0 2px 14px rgba(43,58,103,.05);
  transition:box-shadow .22s ease,transform .22s ease;
}
.dti-card:hover{
  box-shadow:0 6px 24px rgba(43,58,103,.1);
  transform:translateY(-2px);
}
.dti-card h4{
  font-family:var(--ff-body);font-size:.95rem;font-weight:600;
  color:var(--navy);margin-bottom:5px;line-height:1.4;
}
.dti-card p{
  font-family:var(--ff-serif);font-size:.87rem;font-style:italic;
  color:var(--text-mid);line-height:1.65;margin:0;
}
.dti-time-mobile{display:none;}
@media(max-width:540px){
  .dti{grid-template-columns:28px 1fr;}
  .dti-time-col{display:none;}
  .dti-time-mobile{
    display:inline-block;
    font-size:.62rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
    color:var(--sage-dark);
    background:rgba(125,160,125,.13);
    padding:3px 9px;border-radius:20px;
    margin-bottom:7px;
    white-space:nowrap;
  }
  .dti-card{margin-left:14px;padding:13px 15px;border-radius:11px;}
  .dti-card h4{font-size:.9rem;}
  .dti-dot{margin-top:16px;}
}

/* ══════════════════════════════════════════════
   LOCATIONS GRID
   ══════════════════════════════════════════════ */
.locations-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px, 240px));
  justify-content:center;
  gap:24px;
  margin-bottom:32px;
}

@media (max-width:880px){
  .locations-grid{grid-template-columns:repeat(auto-fill, minmax(180px,1fr));gap:16px;}
}
.location-item{
  padding:24px 20px;background:var(--white);
  border-radius:var(--r-card);box-shadow:var(--sh);
  text-align:center;
  transition:transform .3s var(--ease-out-expo), box-shadow .3s;
}
.location-item:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);}
.location-icon{
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 12px;color:var(--sage-mid);height:28px;
}
.location-name{
  font-family:var(--ff-script);font-size:1.3rem;
  color:var(--navy);line-height:1.2;margin-bottom:4px;
}
.location-sub{
  font-family:var(--ff-serif);font-size:.82rem;font-style:italic;color:var(--text-mid);
}

/* ══════════════════════════════════════════════
   BENEFITS — premium wellness section with cinematic reveal
   ══════════════════════════════════════════════ */

/* Title reveal — word-by-word cinematic animation */
.bienfaits-title-reveal{
  display:flex;flex-wrap:wrap;gap:0.3em;line-height:1.3;
}
.title-word{
  display:inline-block;
  opacity:0;filter:blur(8px);transform:scale(0.92) translateY(12px);
}
.title-word.reveal-word{
  animation:titleReveal 0.8s cubic-bezier(0.34,1.56,0.64,1) forwards;
}

@keyframes titleReveal{
  to{opacity:1;filter:blur(0px);transform:scale(1) translateY(0)}
}

/* Benefits layout */
.benefits{
  padding:0.5rem 0;
}

.benefits-list{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
}

/* Benefit cards — soft luxury design */
.benefit-item{
  background:var(--white);
  padding:20px 24px;
  border-radius:16px;
  box-shadow:0 4px 16px rgba(43,58,103,0.06), 0 1px 3px rgba(43,58,103,0.04);
  font-family:'HumanSans', var(--ff-body);
  color:var(--navy);
  font-weight:600;
  letter-spacing:0.005em;
  display:flex;align-items:center;gap:14px;
  opacity:0;filter:blur(6px);transform:translateX(-24px) translateY(16px) scale(0.98);
  will-change:opacity, filter, transform;
  position:relative;
  overflow:hidden;
}

.benefit-item::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 100%);
  opacity:0;pointer-events:none;
}

.benefit-item:hover{
  box-shadow:0 16px 40px rgba(43,58,103,0.12), 0 4px 12px rgba(43,58,103,0.06);
  transform:translateY(-4px);
}

.benefit-item:hover::before{animation:shimmer 0.6s ease-out forwards}

@keyframes shimmer{
  0%{opacity:0;transform:translateX(-100%)}
  50%{opacity:1}
  100%{opacity:0;transform:translateX(100%)}
}

.benefit-star{
  width:20px;height:20px;flex-shrink:0;
  filter:drop-shadow(0 2px 4px rgba(154,184,154,0.2));
}

.benefit-item span{position:relative;z-index:1}
.benefit-item:last-child{margin-bottom:0}

/* Benefits + portrait two-column layout */
.benefits-with-photo{
  display:flex;
  gap:3rem;
  align-items:center;
}
.benefits-with-photo .benefits{
  flex:1;
  min-width:0;
}
.benefits-photo{
  flex-shrink:0;
  width:320px;
}
.benefits-photo img{
  width:100%;
  height:auto;
  border-radius:12px;
  object-fit:cover;
  display:block;
}

/* Responsive — mobile single column */
@media (max-width:1024px){
  .benefits-list{grid-template-columns:1fr;}
  .benefits-photo{width:280px;}
}

@media (max-width:880px){
  .benefits{gap:24px}
  .benefit-item{padding:18px 20px;gap:12px}
  .benefit-star{width:18px;height:18px}
  .benefits-with-photo{gap:2rem;}
  .benefits-photo{width:240px;}
}

@media (max-width:768px){
  .benefits-with-photo{
    flex-direction:column;
    gap:2rem;
  }
  .benefits-photo{
    width:100%;
    max-width:420px;
    margin:0 auto;
  }
  .bienfaits-title-reveal > span{
    display:inline !important;
    width:auto !important;
  }
}

/* ══════════════════════════════════════════════
   3D CAROUSEL (old) — commented out; uncomment to restore
   ══════════════════════════════════════════════ */
/*
 .scene,
 .a3d{
   display:grid;
 }

 .scene{
   overflow:hidden;
   perspective:35em;
   mask:linear-gradient(90deg, transparent, black 20%, black 80%, transparent);
   margin-top:3rem;
 }

 .a3d{
   place-self:center;
   transform-style:preserve-3d;
   animation:rotateCarousel 32s linear infinite;
 }

 @keyframes rotateCarousel {
   to {
     transform:rotateY(360deg);
   }
 }

 .card{
   --w:17.5em;
   --ba:calc(1turn / var(--n));

   grid-area:1 / 1;
   width:var(--w);
   aspect-ratio:7 / 10;
   object-fit:cover;
   border-radius:1.5em;
   backface-visibility:hidden;

   transform:
     rotateY(calc(var(--i) * var(--ba)))
     translateZ(calc(-1 * (0.5 * var(--w) + 0.5em) / tan(0.5 * var(--ba))));
 }

 @media (prefers-reduced-motion: reduce) {
   .a3d {
     animation-duration:128s;
   }
 }
*/

/* ══════════════════════════════════════════════
   BLUR-IN SLIDESHOW (v3) — commented out; uncomment to restore
   ══════════════════════════════════════════════ */
/*
.jrs-photos{ margin-top:3rem; font-size:2vmin; }
.jrs-photos .slideshow-container{ position:relative; overflow:hidden; width:100%; height:50vmin; max-height:480px; min-height:260px; background:var(--cream-card); border-radius:var(--r-sm); box-shadow:.25em .25em 2.5em rgba(43,58,103,.14),inset 0 0 6em rgba(43,58,103,.06); filter:brightness(var(--light,.99)); --blur:.4; --light:.99; }
.jrs-photos .slide{ position:absolute; border-radius:2.5%; width:90%; height:90%; left:5%; top:5%; object-fit:cover; --angle:8deg; transform:translateX(1000%) rotate(var(--angle)) translateX(-1000%) rotate(1.5deg); transition:270ms transform linear,1.8s filter ease; filter:blur(calc(var(--blur)*1em)); }
.jrs-photos .slide.visible{ --angle:0deg; }
.jrs-mote{ position:absolute; width:calc(var(--size,.5)*1em); height:calc(var(--size,.5)*1em); background:var(--navy); left:calc(var(--x,.5)*100%); top:calc(var(--y,.5)*100%); opacity:0; border-radius:50%; filter:blur(.6em); pointer-events:none; }
*/

/* ══════════════════════════════════════════════
   COVERFLOW SLIDESHOW
   ══════════════════════════════════════════════ */
.slideshow-outer{
  position:relative;
  margin-top:3rem;
}
.slideshow-container{
  height:400px;
  position:relative;
  overflow:hidden;
}
.slideshow-container::after{
  content:"";
  z-index:10;
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    #f0ead6 0%,#f0ead6 1%,
    transparent 9%,transparent 91%,
    #f0ead6 99%,#f0ead6 100%
  );
}
.image-box{
  width:20%;
  height:100%;
  border-radius:var(--r-sm);
  overflow:hidden;
  position:absolute;
  transition:left 0.9s cubic-bezier(.4,0,.2,1);
  transform:translateX(-50%);
  top:0;
  box-shadow:0 4px 24px rgba(43,58,103,0.18);
}
.image-box img.slide{
  height:100%;
  width:100%;
  object-fit:cover;
  display:block;
}
.image-desc{
  position:absolute;
  width:100%;
  bottom:0;left:0;
  padding:52px 18px 16px;
  opacity:0;
  transition:opacity 0.5s ease;
  background:linear-gradient(0deg,
    rgba(43,58,103,0.90) 0%,
    rgba(43,58,103,0.55) 50%,
    transparent 100%
  );
  color:var(--cream);
}
.image-desc h3{
  font-family:var(--ff-script);
  font-size:1.5rem;
  color:var(--cream);
  margin-bottom:3px;
  line-height:1.15;
}
.image-desc p{
  font-family:var(--ff-body);
  font-size:0.8rem;
  font-style:italic;
  color:var(--cream-warm);
  opacity:0.9;
}
.image-box.main .image-desc{
  opacity:1;
}
.slideshow-controls{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:14px;
}
.slideshow-controls button{
  background:var(--navy-pale);
  border:none;
  height:6px;width:6px;
  border-radius:100px;
  cursor:pointer;
  transition:background 0.5s ease, width 0.3s ease;
}
.slideshow-controls button:hover{ background:var(--sage-mid); }
.slideshow-controls button.main{ background:var(--navy); width:16px; }
.control-arrow{
  background:rgba(43,58,103,0.22);
  border:1.5px solid rgba(43,58,103,0.35);
  color:var(--cream);
  height:42px;width:42px;
  border-radius:100px;
  cursor:pointer;
  transition:background 0.35s ease;
  backdrop-filter:blur(10px);
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:center;
}
.control-arrow:hover{ background:rgba(43,58,103,0.65); }
.control-arrow.arrow-left{ left:19%; }
.control-arrow.arrow-right{ right:19%; }
@media(max-width:900px){
  .slideshow-container{ height:340px; }
}
@media(max-width:700px){
  .slideshow-container{ height:280px; }
  .control-arrow{ height:36px;width:36px; }
}
@media(max-width:549px){
  .slideshow-container{ height:240px; }
  .control-arrow{ height:34px;width:34px; }
  .control-arrow.arrow-left{ left:3%; }
  .control-arrow.arrow-right{ right:3%; }
  .slideshow-container::after{
    background:linear-gradient(90deg,
      #f0ead6 0%,transparent 4%,transparent 96%,#f0ead6 100%
    );
  }
}

/* ══════════════════════════════════════════════
   INCLUDES COLUMNS
   ══════════════════════════════════════════════ */
.includes-cols{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
.includes-col h4{
  font-size:.64rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:var(--navy);opacity:.7;margin-bottom:12px;
}
.includes-list{font-size:.91rem;color:var(--text);line-height:1.7;margin-bottom:8px;}
.includes-list li{
  display:flex;align-items:baseline;gap:10px;
  padding:5px 0;border-bottom:1px solid rgba(43,58,103,.05);
}
.includes-list li:last-child{border-bottom:none;}
.includes-list li::before{
  content:'';width:4px;height:4px;border-radius:50%;
  background:var(--sage-mid);flex-shrink:0;margin-top:6px;
}
.conditions-box{
  padding:20px 28px;
  background:var(--cream-card);border-radius:var(--r-sm);
  font-family:var(--ff-serif);font-size:.93rem;color:var(--text);line-height:1.7;
}
.conditions-box .label::before{display:none;}
.conditions-list{
  list-style:none;padding:0;margin:0;
}
.conditions-list li{display:inline;}
.conditions-list li+li::before{content:' · ';margin:0 .2em;color:var(--sage-mid);}
@media(max-width:600px){
  .conditions-list li{display:list-item;list-style:disc;margin-left:1.2em;}
  .conditions-list li+li::before{content:none;}
}

/* ══════════════════════════════════════════════
   À PROPOS LAYOUT
   ══════════════════════════════════════════════ */
.apropos-layout{
  display:grid;grid-template-columns:300px 1fr;gap:68px;align-items:start;
}
.apropos-sticky{position:sticky;top:calc(var(--nav-h) + 32px);}
.portrait-frame{
  border-radius:var(--r-card);overflow:hidden;aspect-ratio:3/4;box-shadow:var(--sh-lg);
}
.portrait-frame img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
.portrait-frame:hover img{transform:scale(1.03);}
.portrait-caption{margin-top:16px;text-align:center;}
.portrait-name{font-family:var(--ff-script);font-size:1.6rem;color:var(--navy);}
.portrait-title{
  font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--text-mid);margin-top:3px;
}
.apropos-text h2{
  font-family:var(--ff-script);font-size:clamp(2.4rem,4.5vw,3.8rem);
  color:var(--navy);line-height:1.02;margin:10px 0 22px;
}
.apropos-text p{
  font-family:var(--ff-serif);font-size:1.02rem;line-height:1.9;
  color:var(--text);margin-bottom:16px;
}
.approach-box{
  margin:28px 0;padding:22px 26px;
  background:linear-gradient(135deg, rgba(154,184,154,.1), rgba(208,200,188,.07));
  border-left:2.5px solid rgba(154,184,154,.55);
  border-radius:0 var(--r-sm) var(--r-sm) 0;
}
.approach-box p{
  font-family:var(--ff-serif);font-size:.96rem;font-style:italic;
  color:var(--text);line-height:1.75;margin-bottom:8px;
}
.approach-box p:last-child{margin-bottom:0;}
.placeholder-block{
  padding:32px;background:var(--cream-card);
  border-radius:var(--r-card);border:1.5px dashed rgba(43,58,103,.15);text-align:center;
}
.placeholder-block h3{
  font-family:var(--ff-script);font-size:1.8rem;color:var(--navy);margin-bottom:8px;
}
.placeholder-block p{font-size:.9rem;color:var(--text-mid);}

/* ══════════════════════════════════════════════
   CERTIFICATIONS
   ══════════════════════════════════════════════ */
.certif-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  max-width:780px;
  margin:2.5rem auto 0;
}
.certif-card{
  margin:0;
  background:var(--cream);
  border-radius:var(--r-card);
  overflow:hidden;
  box-shadow:0 2px 18px rgba(43,58,103,0.10);
  transition:transform 0.3s ease, box-shadow 0.3s ease;
}
.certif-card:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 28px rgba(43,58,103,0.16);
}
.certif-card img{
  width:100%;
  height:auto;
  display:block;
}
.certif-card figcaption{
  font-family:var(--ff-body);
  font-size:0.78rem;
  letter-spacing:0.04em;
  color:var(--text-mid);
  text-align:center;
  padding:10px 14px 12px;
  font-style:italic;
}
@media(max-width:600px){
  .certif-grid{grid-template-columns:1fr;max-width:450px;}
}

/* ══════════════════════════════════════════════
   ASSOCIATIONS
   ══════════════════════════════════════════════ */
.assoc-grid{
  display:flex;
  flex-direction:column;
  gap:0.65rem;
  max-width:760px;
  margin:2.5rem auto 0;
}
.assoc-card{
  display:flex;
  align-items:center;
  gap:0.85rem;
  padding:0.85rem 1rem;
  background:transparent;
  border-radius:6px;
  border:2px solid var(--navy);
  text-decoration:none;
  color:var(--navy);
  font-family:var(--ff-body);
  letter-spacing:0.01em;
  user-select:none;
  transition:background 0.18s ease, color 0.18s ease;
}
.assoc-card:hover{
  background:var(--navy);
  color:#fff;
}
.assoc-abbr{
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:100px;
  border:2px solid currentColor;
  background:transparent;
  color:currentColor;
  font-family:var(--ff-body);
  font-size:0.66rem;
  font-weight:700;
  letter-spacing:0.06em;
  text-align:center;
  line-height:1.2;
}
.assoc-info{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:0.15rem;
  min-width:0;
}
.assoc-name{
  font-family:var(--ff-body);
  font-size:0.94rem;
  font-weight:600;
  color:inherit;
  line-height:1.3;
}
.assoc-tagline{
  font-size:0.78rem;
  color:inherit;
  opacity:0.6;
  line-height:1.4;
}
.assoc-arr{
  flex-shrink:0;
  width:38px;
  height:38px;
  border:2px solid var(--navy);
  border-radius:100px;
  background:var(--navy);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.95rem;
  transition:background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
  margin-left:auto;
}
.assoc-card:hover .assoc-arr{
  background:transparent;
  border-color:rgba(255,255,255,0.4);
  color:#fff;
}
@media(max-width:600px){
  .assoc-card{flex-wrap:wrap; gap:0.65rem; padding:0.75rem;}
  .assoc-arr{display:none;}
}

/* ══════════════════════════════════════════════
   CALENDAR + FORM PLACEHOLDERS
   ══════════════════════════════════════════════ */
.calendar-placeholder,.form-placeholder{
  padding:52px 40px;background:var(--cream-card);
  border-radius:var(--r-card);border:1.5px dashed rgba(43,58,103,.15);text-align:center;
}
.cal-icon{display:flex;align-items:center;justify-content:center;margin:0 auto 16px;color:var(--sage-mid);}
.calendar-placeholder h3,.form-placeholder h3{
  font-family:var(--ff-script);font-size:2rem;color:var(--navy);margin-bottom:10px;
}
.calendar-placeholder p,.form-placeholder p{
  font-family:var(--ff-serif);font-size:.96rem;color:var(--text-mid);line-height:1.75;
}
.form-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 64px 40px 56px;
  background: var(--cream-card);
  border-radius: var(--r-xl);
  box-shadow: var(--sh);
}
.form-cta__text {
  font-family: var(--ff-serif);
  font-size: 1.18rem;
  color: var(--text);
  line-height: 1.75;
  max-width: 38ch;
}
.form-cta__arrow {
  margin: 12px 0 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  animation: arrow-bounce 1.1s infinite ease-in-out;
}
.form-cta__arrow span {
  width: 3px;
  height: 16px;
  background: var(--navy);
  border-radius: 3px;
  margin: 0 3px;
}
.form-cta__arrow span:nth-of-type(1) {
  transform: rotate(-45deg);
}
.form-cta__arrow span:nth-of-type(2) {
  transform: rotate(45deg);
}
@keyframes arrow-bounce {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(8px); }
  100% { transform: translateY(0); }
}
.form-cta__btn {
  margin-top: 8px;
}

/* ══════════════════════════════════════════════
   GRID-2 + FEATURE CARD
   ══════════════════════════════════════════════ */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.feature-card{
  background:var(--white);border-radius:var(--r-card);
  padding:34px 28px;box-shadow:var(--sh);
  position:relative;overflow:hidden;
  transition:transform .4s var(--ease-out-expo), box-shadow .4s ease;
}
.feature-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg, var(--sage), var(--sage-mid) 60%, var(--navy-light));
}
.feature-card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);}
.feature-icon{
  width:44px;height:44px;border-radius:50%;
  background:var(--sage-pale);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-script);font-size:1.5rem;
  color:var(--sage-dark);margin-bottom:16px;
}
.feature-card h3{
  font-family:var(--ff-script);font-size:1.9rem;color:var(--navy);margin-bottom:8px;
}
.feature-card p{font-family:var(--ff-serif);font-size:.93rem;line-height:1.75;color:var(--text);}

/* ══════════════════════════════════════════════
   STEPS GRID
   ══════════════════════════════════════════════ */
.steps-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:32px 0;
}
.step-card{
  padding:28px 22px;background:var(--white);
  border-radius:var(--r-card);box-shadow:var(--sh);position:relative;
  transition:transform .35s var(--ease-out-expo), box-shadow .35s;
}
.step-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg);}
.step-num{
  font-family:var(--ff-serif);font-size:3rem;font-style:italic;
  color:rgba(43,58,103,.12);line-height:1;margin-bottom:12px;display:block;
}
.step-card h3{font-family:var(--ff-body);font-size:.93rem;font-weight:500;color:var(--navy);margin-bottom:8px;}
.step-card p{font-family:var(--ff-serif);font-size:.88rem;line-height:1.7;color:var(--text);}

/* ══════════════════════════════════════════════
   FLEX UTILITIES
   ══════════════════════════════════════════════ */
.flex-center{display:flex;align-items:center;justify-content:center;}
.flex-wrap{flex-wrap:wrap;}
.gap-md{gap:16px;}
.legal-links{display:flex;gap:20px;flex-wrap:wrap;}
.legal-links a{
  font-size:.8rem;color:var(--text-mid);
  text-decoration:underline;text-underline-offset:2px;transition:color .2s;
}
.legal-links a:hover{color:var(--navy);}

/* ══════════════════════════════════════════════
   CONTACT CARD
   ══════════════════════════════════════════════ */
.contact-card{
  display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start;
  background:var(--navy);border-radius:var(--r-card);
  padding:48px;box-shadow:var(--sh-lg);overflow:hidden;position:relative;
}
.contact-card::before{
  content:'';position:absolute;
  width:400px;height:400px;top:-100px;right:-80px;
  background:radial-gradient(ellipse, rgba(154,184,154,.1) 0%, transparent 65%);
  border-radius:50% 50% 60% 40% / 40% 60% 40% 60%;
  animation:blobDrift2 22s ease-in-out infinite;pointer-events:none;
}
.contact-card h2{
  font-family:var(--ff-script);font-size:clamp(2rem,4vw,3.2rem);
  color:white;margin-bottom:14px;
}
.contact-card p{
  font-family:var(--ff-serif);font-size:1rem;line-height:1.85;
  color:rgba(255,255,255,.72);margin-bottom:24px;
}
.contact-social{display:flex;gap:14px;margin-top:20px;}
.contact-social a{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(255,255,255,.35);color:rgba(255,255,255,.75);transition:background .2s,border-color .2s,color .2s;}
.contact-social a:hover{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.7);color:white;}
.contact-details{display:flex;flex-direction:column;gap:14px;}
.contact-row{
  display:flex;align-items:flex-start;gap:14px;
  padding:14px 16px;background:rgba(255,255,255,.07);
  border-radius:var(--r-sm);color:rgba(255,255,255,.82);font-size:.93rem;
  transition:background .25s;
}
.contact-row:hover{background:rgba(255,255,255,.12);}
.contact-row a{color:rgba(255,255,255,.82);transition:color .2s;}
.contact-row a:hover{color:white;}
.contact-row-icon{flex-shrink:0;width:24px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);}

/* ══════════════════════════════════════════════
   FAQ ACCORDION
   ══════════════════════════════════════════════ */
.faq-layout{
  display:grid;grid-template-columns:1fr 340px;gap:3rem;align-items:start;
}
.faq-list{border-top:1px solid rgba(43,58,103,.1);}
.faq-item{border-bottom:1px solid rgba(43,58,103,.1);}
.faq-question{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:20px 0;background:none;border:none;cursor:pointer;
  font-family:var(--ff-body);font-size:.95rem;font-weight:500;
  color:var(--navy);text-align:left;transition:color .25s;
}
.faq-question:hover{color:var(--sage-dark);}
.faq-question[aria-expanded="true"]{color:var(--sage-dark);}
.faq-icon{
  flex-shrink:0;width:24px;height:24px;border-radius:50%;
  border:1.5px solid rgba(43,58,103,.22);
  display:flex;align-items:center;justify-content:center;
  color:var(--navy);
  transition:transform .4s var(--ease-out-expo), background .25s, border-color .25s;
}
.faq-question[aria-expanded="true"] .faq-icon{
  transform:rotate(45deg);
  background:var(--sage-pale);border-color:var(--sage-mid);color:var(--sage-dark);
}
.faq-answer{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .4s var(--ease-out-expo);
}
.faq-answer.open{grid-template-rows:1fr;}
.faq-answer-inner{overflow:hidden;}
.faq-answer-inner p{
  padding:0 24px 20px 0;
  font-family:var(--ff-body);font-size:.97rem;line-height:1.75;color:var(--text);
}
.reveal-right{
  opacity:0;transform:translateX(28px);
  transition:opacity .75s var(--ease-out-expo), transform .75s var(--ease-out-expo);
}
.reveal-right.visible{opacity:1;transform:translateX(0);}

/* ══════════════════════════════════════════════
   IMG PLACEHOLDER
   ══════════════════════════════════════════════ */
.img-placeholder{
  width:100%;display:flex;align-items:center;justify-content:center;
  background:var(--cream-card);
  font-family:var(--ff-serif);font-style:italic;font-size:.9rem;color:var(--text-mid);
}

/* ══════════════════════════════════════════════
   CTA SECTION
   ══════════════════════════════════════════════ */
.cta-section{
  background:var(--navy);padding:104px 64px;
  text-align:center;overflow:hidden;position:relative;
}
.cta-section::before{
  content:'';position:absolute;
  width:600px;height:600px;bottom:-200px;left:-120px;
  background:radial-gradient(ellipse, rgba(154,184,154,.08) 0%, transparent 60%);
  border-radius:55% 45% 50% 50% / 45% 55% 45% 55%;
  animation:blobDrift 28s ease-in-out 2s infinite;pointer-events:none;
}
.cta-section::after{
  content:'';position:absolute;
  width:400px;height:400px;top:-100px;right:-60px;
  background:radial-gradient(ellipse, rgba(176,160,144,.06) 0%, transparent 60%);
  border-radius:40% 60% 45% 55% / 55% 40% 60% 45%;
  animation:blobDrift2 22s ease-in-out 6s infinite reverse;pointer-events:none;
}
.cta-section .container{position:relative;z-index:1;}
.cta-section .label{justify-content:center;color:rgba(248,245,230,.44);opacity:1;}
.cta-section .label::before{display:none;}
.cta-section h2{
  font-family:var(--ff-script);
  font-size:clamp(3rem,6.5vw,5.8rem);
  color:var(--cream);line-height:1.02;margin:10px 0 18px;
}
.cta-section p{
  font-family:var(--ff-serif);font-size:1.02rem;
  color:rgba(248,245,230,.62);line-height:1.9;
  max-width:560px;margin:0 auto 36px;
}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* ══════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════ */
.footer{background:#1c253e;padding:56px 64px 36px;}
.footer .container{max-width:1180px;margin:0 auto;}
.footer-inner{
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;
  padding-bottom:40px;border-bottom:1px solid rgba(248,245,230,.06);
}
.footer-logo{
  font-family:var(--ff-script);font-size:1.5rem;
  color:rgba(248,245,230,.55);display:block;margin-bottom:12px;transition:color .25s;
}
.footer-logo-img{display:block;width:80px;height:80px;}
.footer-logo:hover{color:rgba(248,245,230,.85);}
.footer-tagline{
  font-family:var(--ff-serif);font-size:.88rem;font-style:italic;
  color:rgba(248,245,230,.35);line-height:1.7;
}
.footer-col h4{
  font-size:.6rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  color:rgba(248,245,230,.35);margin-bottom:16px;
}
.footer-col ul{display:flex;flex-direction:column;gap:8px;}
.footer-col a{font-size:.85rem;color:rgba(248,245,230,.45);transition:color .25s;}
.footer-col a:hover{color:rgba(248,245,230,.82);}
.footer-address{
  font-style:normal;font-size:.85rem;
  color:rgba(248,245,230,.45);line-height:1.8;
}
.footer-address a{color:rgba(248,245,230,.45);transition:color .25s;}
.footer-address a:hover{color:rgba(248,245,230,.82);}
.footer-social{display:flex;flex-direction:column;gap:8px;margin-top:12px;}
.footer-social a{display:flex;align-items:center;gap:8px;font-size:.85rem;color:rgba(248,245,230,.45);transition:color .25s;text-decoration:none;}
.footer-social a:hover{color:rgba(248,245,230,.82);}
.footer-bottom{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:28px;flex-wrap:wrap;gap:12px;
}
.footer-copy{font-size:.65rem;letter-spacing:.08em;color:rgba(248,245,230,.22);}
.footer-credit{font-size:.65rem;letter-spacing:.06em;color:rgba(248,245,230,.22);}
.footer-credit a{color:inherit;text-decoration:none;transition:color .25s;}
.footer-credit a:hover{color:rgba(248,245,230,.7);}
.footer-legal{display:flex;gap:24px;}
.footer-legal a{font-size:.65rem;color:rgba(248,245,230,.28);transition:color .25s;}
.footer-legal a:hover{color:rgba(248,245,230,.7);}

/* ══════════════════════════════════════════════
   REVEAL ANIMATIONS
   ══════════════════════════════════════════════ */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeDown{from{opacity:0;transform:translateY(-22px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}

.reveal{
  opacity:0;transform:translateY(28px);
  transition:opacity .75s var(--ease-out-expo), transform .75s var(--ease-out-expo);
}
.reveal.visible{opacity:1;transform:translateY(0);}
.reveal-left{
  opacity:0;transform:translateX(-28px);
  transition:opacity .75s var(--ease-out-expo), transform .75s var(--ease-out-expo);
}
.reveal-left.visible{opacity:1;transform:translateX(0);}
.d1{transition-delay:.08s}
.d2{transition-delay:.17s}
.d3{transition-delay:.26s}
.d4{transition-delay:.35s}
.d5{transition-delay:.44s}
.d6{transition-delay:.53s}

/* Line reveal */
.line-reveal{overflow:hidden;padding:.2em .1em;margin:-.2em -.1em;}
.line-reveal-inner{
  display:block;transform:translateY(110%);
  transition:transform .82s var(--ease-out-expo);
}
.line-reveal.visible .line-reveal-inner{transform:translateY(0);}

/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */
@media(max-width:1100px){
  .footer-inner{grid-template-columns:1fr 1fr;gap:36px;}
  .footer-brand{grid-column:1 / -1;}
  .apropos-layout{grid-template-columns:240px 1fr;gap:44px;}
  .steps-grid{grid-template-columns:repeat(2,1fr);}
  .session-card-header{flex-direction:column;gap:20px;}
  .session-price-wrap{text-align:center;}
}
@media(max-width:900px){
  .split{grid-template-columns:1fr;gap:40px;}
  .split-image{aspect-ratio:16/8;}
  .faq-layout{grid-template-columns:1fr;}
  .faq-layout > :last-child{display:none;}
  .piliers-grid{grid-template-columns:1fr 1fr;}
  .aqui-grid{grid-template-columns:1fr;}
  .includes-cols{grid-template-columns:1fr;}
  .session-grid-2{grid-template-columns:1fr;}
  .apropos-layout{grid-template-columns:1fr;gap:36px;}
  .apropos-sticky{position:static;}
  .portrait-frame{aspect-ratio:16/9;max-height:340px;}
  .contact-card{grid-template-columns:1fr;}
  /* benefits puddle — height is auto (flex column), nothing to override */
  .benefits-droppy{height:auto;min-height:0;}
}
@media(max-width:768px){
  .nav{padding:16px 24px;}
  .nav.scrolled{padding:13px 24px;}
  .nav-links,.nav-cta{display:none;}
  .hamburger{display:flex;}
  .section{padding:72px 20px;}
  .section--sm{padding:48px 20px;}
  .section--books > .container{padding-left:20px;padding-right:20px;}
  .cta-section{padding:72px 20px;}
  .footer{padding:44px 20px 30px;}
  .page-hero-content{padding:32px 20px 40px;}
  .hero-content{padding:0 20px;max-width:100%;}
  .hero-scroll{left:20px;}
  .grid-2{grid-template-columns:1fr;}
  .steps-grid{grid-template-columns:1fr 1fr;gap:14px;}
  .piliers-grid{grid-template-columns:1fr;}
  .contact-card{padding:28px 20px;}
  .contact-card h2{font-size:clamp(1.6rem,5vw,2.2rem);}
  .session-card-header,.session-card-body{padding:24px 20px;}
  .footer-inner{grid-template-columns:1fr 1fr;gap:28px;}
  /* FAQ mobile fixes */
  .faq-question{padding:16px 0;font-size:.95rem;}
  .faq-icon{width:20px;height:20px;flex-shrink:0;}
  .faq-answer-inner p{padding:0 8px 16px 0;font-size:.9rem;}
  /* benefits puddle */
  .benefits-droppy{height:auto;min-height:0;}
  /* split reveal smaller on mobile */
  .split-reveal{height:48vh;min-height:240px;cursor:default;}
  .split-reveal__word{font-size:clamp(2.2rem,6.5vw,4rem);}
  .split-reveal__accent{font-size:clamp(1.2rem,3.5vw,2rem);}
  /* todo section */
  .todo-section{padding:4rem 1.2rem 5rem;}
  #todo-app{gap:2rem;}
  .notepad{padding:1.4rem 1.4rem 1.6rem;}
  /* droppy canvas */
  .droppy-canvas{height:70vh;}
}
@media(max-width:600px){
  /* Headings scale */
  h1{font-size:clamp(2.4rem,10vw,3.6rem);}
  h2{font-size:clamp(1.8rem,7vw,2.8rem);}
  /* sections more breathing room */
  .section-header{margin-bottom:2rem;}
  .lead{font-size:.97rem;}
  /* split layout stacked */
  .split{gap:28px;}
  .split-image{border-radius:var(--r-sm);}
  /* pilier cards */
  .pilier-card{padding:22px 18px;}
  /* contact card */
  .contact-card{gap:24px;}
  .contact-details{gap:14px;}
  /* FAQ accordion */
  .faq-list{margin-top:0;}
  /* benefits */
  .benefits-droppy{height:auto;min-height:0;}
}
@media(max-width:480px){
  .steps-grid{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr;}
  .footer-legal{flex-direction:column;gap:8px;}
  .aqui-grid{grid-template-columns:1fr;}
  /* Mobile: bear below notepad */
  .bear-wrap{order:1;}
  #todo-app > .notepad{order:0;}
  /* split reveal touch only — disable handle */
  .split-reveal__handle{display:none;}
  .split-reveal{height:auto;min-height:0;cursor:default;}
  .split-reveal__side{position:relative;height:38vw;min-height:140px;}
  .split-reveal__right{z-index:1;}
  .split-reveal__left{position:relative;width:100%;z-index:2;}
  .split-reveal__content{left:50%;top:50%;}
}

/* ══════════════════════════════════════════════
   SESSION CALENDAR
   ══════════════════════════════════════════════ */
.session-cal{
  display:grid;
  grid-template-columns:260px 1fr;
  background:var(--white);
  border-radius:var(--r-xl);
  box-shadow:var(--sh-lg);
  overflow:hidden;
  border:1px solid var(--taupe-pale);
  min-height:500px;
}
.scal-sidebar{
  background:var(--cream);
  border-right:1px solid var(--taupe-pale);
  padding:28px 20px;
  display:flex;
  flex-direction:column;
  gap:24px;
}
.scal-sidebar-title{
  font-family:var(--ff-serif);
  font-size:1.1rem;
  font-weight:500;
  color:var(--navy);
  margin:0 0 2px;
}
.scal-filter-group{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.scal-filter-label{
  font-size:0.7rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--text-mid);
  margin-bottom:4px;
}
.scal-filter-btn{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:var(--r-sm);
  border:1.5px solid var(--taupe-pale);
  background:transparent;
  color:var(--text);
  font-family:var(--ff-body);
  font-size:0.85rem;
  cursor:pointer;
  transition:all .2s ease;
  text-align:left;
}
.scal-filter-btn:hover{
  border-color:var(--sage);
  background:var(--sage-pale);
  color:var(--navy);
}
.scal-filter-btn.active{
  border-color:var(--navy);
  background:var(--navy);
  color:var(--white);
}
.scal-filter-btn .scal-badge{
  margin-left:auto;
  font-size:0.7rem;
  font-weight:700;
  padding:2px 7px;
  border-radius:99px;
  background:rgba(255,255,255,.2);
  line-height:1.4;
}
.scal-filter-btn:not(.active) .scal-badge{
  background:var(--cream-deep);
  color:var(--text-mid);
}
.scal-selection{
  margin-top:auto;
  padding:16px;
  border-radius:var(--r-card);
  background:var(--sage-pale);
  border:1px solid var(--sage);
  display:none;
}
.scal-selection.visible{display:block;}
.scal-sel-label{
  font-size:0.7rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--sage-dark);
  margin-bottom:8px;
}
.scal-sel-name{
  font-family:var(--ff-serif);
  font-size:1.05rem;
  font-weight:500;
  color:var(--navy);
  margin-bottom:4px;
}
.scal-sel-dates{
  font-size:0.82rem;
  color:var(--text-mid);
  margin-bottom:12px;
}
.scal-sel-price{
  display:flex;
  align-items:baseline;
  gap:8px;
}
.scal-sel-price-full{
  font-size:0.85rem;
  color:var(--text-mid);
  text-decoration:line-through;
}
.scal-sel-price-promo{
  font-size:1.1rem;
  font-weight:700;
  color:var(--navy);
}
.scal-sel-price-note{
  font-size:0.7rem;
  color:var(--sage-dark);
}
.scal-reserve-btn{
  display:block;
  width:100%;
  margin-top:14px;
  padding:10px;
  background:var(--navy);
  color:var(--white);
  border:none;
  border-radius:var(--r-sm);
  font-family:var(--ff-body);
  font-size:0.85rem;
  font-weight:600;
  cursor:pointer;
  text-align:center;
  transition:background .2s ease;
  text-decoration:none;
}
.scal-reserve-btn:hover{background:var(--navy-mid);}

.scal-main{
  padding:28px 24px;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.scal-main-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:12px;
}
.scal-main-title{
  font-family:var(--ff-serif);
  font-size:1.35rem;
  font-weight:500;
  color:var(--navy);
  margin:0;
}
.scal-nav{
  display:flex;
  align-items:center;
  gap:8px;
}
.scal-nav-btn{
  width:32px;height:32px;
  border-radius:50%;
  border:1.5px solid var(--taupe-pale);
  background:transparent;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  color:var(--text);
  transition:all .2s ease;
}
.scal-nav-btn:hover{border-color:var(--navy);color:var(--navy);background:var(--cream);}
.scal-nav-label{
  font-size:0.85rem;
  color:var(--text-mid);
  min-width:180px;
  text-align:center;
}
.scal-months{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}
.scal-month-title{
  font-size:0.82rem;
  font-weight:600;
  color:var(--navy);
  text-align:center;
  margin-bottom:10px;
  text-transform:capitalize;
}
.scal-dow{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:2px;
  margin-bottom:4px;
}
.scal-dow span{
  font-size:0.68rem;
  font-weight:600;
  color:var(--text-mid);
  text-align:center;
  padding:4px 0;
}
.scal-days{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:2px;
}
.scal-day{
  aspect-ratio:1;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0.78rem;
  border-radius:6px;
  cursor:default;
  color:var(--text);
  transition:all .15s ease;
  position:relative;
}
.scal-day.empty{color:transparent;pointer-events:none;}
.scal-day.other-month{color:var(--text-faint);}
.scal-day.past{color:var(--taupe-light);}
.scal-day.has-session{
  cursor:pointer;
  font-weight:600;
}
.scal-day.has-session:hover{background:var(--cream-warm);}
.scal-day.sess-5j{
  background:var(--sage-pale);
  color:var(--sage-dark);
}
.scal-day.sess-7j{
  background:#e8eef8;
  color:var(--navy);
}
.scal-day.sess-start{
  border-radius:8px 0 0 8px;
  font-weight:700;
}
.scal-day.sess-end{
  border-radius:0 8px 8px 0;
}
.scal-day.sess-start.sess-end{
  border-radius:8px;
}
.scal-day.sess-selected{
  background:var(--navy) !important;
  color:var(--white) !important;
}
.scal-day.sess-selected-range{
  background:rgba(43,58,103,.12) !important;
  color:var(--navy) !important;
  border-radius:0;
}
.scal-legend{
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
  padding-top:16px;
  border-top:1px solid var(--taupe-pale);
}
.scal-legend-item{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:0.78rem;
  color:var(--text-mid);
}
.scal-legend-dot{
  width:12px;height:12px;
  border-radius:3px;
}
.scal-legend-dot.d5j{background:var(--sage-pale);border:1px solid var(--sage);}
.scal-legend-dot.d7j{background:#e8eef8;border:1px solid var(--navy-pale);}
.scal-reset-btn{
  margin-left:auto;
  padding:6px 14px;
  border-radius:var(--r-pill);
  border:1.5px solid var(--taupe-pale);
  background:transparent;
  color:var(--text-mid);
  font-family:var(--ff-body);
  font-size:0.78rem;
  cursor:pointer;
  transition:all .2s ease;
}
.scal-reset-btn:hover{border-color:var(--text-mid);color:var(--text);}

/* Session list below calendar */
.scal-sessions-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:12px;
  margin-top:8px;
}
.scal-sess-card{
  padding:14px 16px;
  border-radius:var(--r-card);
  border:1.5px solid var(--taupe-pale);
  background:var(--white);
  cursor:pointer;
  transition:all .2s ease;
}
.scal-sess-card:hover{border-color:var(--navy);box-shadow:var(--sh-sm);transform:translateY(-2px);}
.scal-sess-card.selected{border-color:var(--navy);background:var(--cream);}
.scal-sess-type{
  display:inline-block;
  font-size:0.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:3px 8px;
  border-radius:99px;
  margin-bottom:8px;
}
.scal-sess-type.t5j{background:var(--sage-pale);color:var(--sage-dark);}
.scal-sess-type.t7j{background:#e8eef8;color:var(--navy);}
.scal-sess-dates{
  font-size:0.85rem;
  font-weight:600;
  color:var(--navy);
  margin-bottom:3px;
}
.scal-sess-spots{
  font-size:0.75rem;
  color:var(--text-mid);
}
.scal-sess-price{
  margin-top:8px;
  font-size:0.78rem;
  color:var(--text-mid);
}
.scal-sess-price strong{
  color:var(--navy);
  font-size:0.95rem;
}

/* Mobile responsive */
@media(max-width:860px){
  .session-cal{grid-template-columns:1fr;grid-template-rows:auto auto;}
  .scal-sidebar{border-right:none;border-bottom:1px solid var(--taupe-pale);flex-direction:row;flex-wrap:wrap;gap:16px;padding:20px;}
  .scal-sidebar-title{width:100%;}
  .scal-filter-group{flex-direction:row;flex-wrap:wrap;}
  .scal-filter-btn{padding:8px 12px;font-size:0.8rem;}
  .scal-selection{margin-top:0;}
}
@media(max-width:640px){
  .scal-months{grid-template-columns:1fr;}
  .scal-main{padding:20px 16px;}
  .scal-sessions-list{grid-template-columns:1fr 1fr;}
}
@media(max-width:400px){
  .scal-sessions-list{grid-template-columns:1fr;}
}

/* ══════════════════════════════════════════════
   DROPPY — Liquid blob text animation
   ══════════════════════════════════════════════ */
.droppy-section{background:var(--cream);position:relative;}

.droppy-canvas{
  --text-color:var(--cream);
  --drops-color:var(--navy);
  position:relative;
  height:100vh;
  overflow:hidden;
  isolation:isolate;   /* scopes z-index so z:-1 stays above section bg */
}

.droppy-canvas.canvas--animated .puddle__letter{
  animation-play-state:running;
}

/* Word groups — centered, spread with --x/--y offsets */
@font-face {
  font-family: 'Devina Garden';
  src: url('DevinaGarden.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

.puddle{
  position:absolute;
  display:flex;
  transform:rotate(var(--r,0deg))
    translate(calc(-50% - var(--x,0em)),
    calc(-50% - var(--y,0em)));

  top:50%;
  left:50%;

  color:var(--text-color);

  font-family:'Devina Garden', cursive;

  font-weight:400; /* important */
  font-size:clamp(2rem,6vmin,4rem);

  letter-spacing:0.03em;
  white-space:pre;
  line-height:1;
}

.puddle__letter{
  transform:translateY(800px);
  padding:.22em .18em;
  margin:-.22em -.18em;
  will-change:transform;
  animation:drop .8s var(--delay,0ms) ease-out forwards paused;
}

/* Blob duplicate layer — SVG gooey filter applied here */
.combined-puddles{
  position:relative;
  height:100%;
  z-index:-1;
  filter:url(#drops-filter);
  user-select:none;
}
.combined-puddles .puddle{color:var(--drops-color);}

/* Force each blob letter into a square cell → border-radius:50% = perfect circle */
.combined-puddles .puddle__letter{
  width:1em;
  height:1em;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border-radius:50%;
  background-color:currentColor;
  /* reset the text-layer padding/margin — uniform sizing needed for circles */
  margin:0;
  padding:0;
}

/* Box-shadows scoped to blob layer only — fat spread so circles overlap + merge */
.combined-puddles .puddle__letter--t-1  {box-shadow: 0.05em -0.03em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-2  {box-shadow:-0.04em  0.05em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-3  {box-shadow: 0.05em  0.03em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-4  {box-shadow:-0.05em -0.04em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-5  {box-shadow: 0.03em -0.05em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-6  {box-shadow:-0.05em  0.03em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-7  {box-shadow: 0.04em  0.05em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-8  {box-shadow:-0.03em -0.04em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-9  {box-shadow: 0.05em -0.05em 0 0.55em currentColor;}
.combined-puddles .puddle__letter--t-10 {box-shadow:-0.04em  0.04em 0 0.55em currentColor;}

@keyframes drop{
  0%  {transform:translate(0, 100vh);}
  85% {transform:translate(0,-.15em);}
  100%{transform:translate(0, 0);}
}

@media(max-width:768px){
  .droppy-canvas{height:75vh;}
}

/* Reduced motion: static text instead of animation */
@media(prefers-reduced-motion:reduce){
  .droppy-canvas .puddle__letter{animation:none;transform:none;}
  .droppy-canvas .puddle{color:var(--navy);}
  .combined-puddles{display:none;}
}

/* ══════════════════════════════════════════════
   JIGSAW PUZZLE — Scroll-assembled portrait
   ══════════════════════════════════════════════ */

/* Root defaults so CSS works before JS fires */
:root {
  --animate: 0;
  --windowWidthScalar: 1;
  --windowHeightScalar: 1;
}

/* Tall section gives the scroll room; SVG stays sticky inside */
.puzzle-section {
  position: relative;
  height: 200vh;
  background: var(--navy);
}

.puzzle-intro {
  position: absolute;
  top: 0; left: 0; right: 0;
  padding: clamp(3.5rem,9vw,6rem) clamp(1.5rem,4vw,4rem) 0;
  text-align: center;
  z-index: 2;
  pointer-events: none;
}
.puzzle-intro .label {
  color: rgba(248,245,230,.45);
  border-color: rgba(248,245,230,.14);
}
.puzzle-intro h2 {
  color: var(--cream);
  margin-top: 0.5rem;
  font-size: clamp(1.5rem,3vw,2.2rem);
}

/* Sticky frame that holds the SVG at vertical centre */
.puzzle-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.puzzle-svg {
  width: 50vmin;
  height: 50vmin;
  overflow: visible !important;
}

/* ── Per-path transforms (CSS-only scroll animation) ─── */
.puzzle-svg path {
  fill: url(#puzzle);
  transform-box: view-box;  /* % origins are relative to the SVG viewport */
  /* Scatter positions lerped from start → assembled as --animate: 0→1 */
  --startX: calc(var(--pieceX, 0) * (var(--windowWidthScalar)  - 0.5) * 100%);
  --startY: calc(var(--pieceY, 0) * (var(--windowHeightScalar) - 0.5) * 100%);
  --startRotate: 0deg; /* overridden per piece below */
  --x:      calc(var(--startX)      * (1 - var(--animate)));
  --y:      calc(var(--startY)      * (1 - var(--animate)));
  --rotate: calc(var(--startRotate) * (1 - var(--animate)));
  /* Rotation origin = centre of each piece within the full SVG */
  transform-origin:
    calc(50% + 50% * var(--pieceX, 0))
    calc(50% + 50% * var(--pieceY, 0));
  transform: translate(var(--x), var(--y)) rotate(var(--rotate));
  stroke-width: 0.5vmin;
  stroke: var(--navy);
}

/* ── Column groups → pieceX (cascade: later rule wins) ── */
.puzzle-svg path:nth-of-type(n+1)  { --pieceX: -0.75; }
.puzzle-svg path:nth-of-type(n+5)  { --pieceX: -0.25; }
.puzzle-svg path:nth-of-type(n+9)  { --pieceX:  0.25; }
.puzzle-svg path:nth-of-type(n+13) { --pieceX:  0.75; }

/* ── Row groups → pieceY ──────────────────────────────── */
.puzzle-svg path:nth-of-type(4n+1) { --pieceY: -0.75; }
.puzzle-svg path:nth-of-type(4n+2) { --pieceY: -0.25; }
.puzzle-svg path:nth-of-type(4n+3) { --pieceY:  0.25; }
.puzzle-svg path:nth-of-type(4n)   { --pieceY:  0.75; }

/* ── Per-piece start rotations (±50–100°, pre-baked) ──── */
.puzzle-svg path:nth-of-type(1)  { --startRotate:  -72deg; }
.puzzle-svg path:nth-of-type(2)  { --startRotate:   63deg; }
.puzzle-svg path:nth-of-type(3)  { --startRotate:  -85deg; }
.puzzle-svg path:nth-of-type(4)  { --startRotate:   57deg; }
.puzzle-svg path:nth-of-type(5)  { --startRotate:   91deg; }
.puzzle-svg path:nth-of-type(6)  { --startRotate:  -68deg; }
.puzzle-svg path:nth-of-type(7)  { --startRotate:   75deg; }
.puzzle-svg path:nth-of-type(8)  { --startRotate:  -53deg; }
.puzzle-svg path:nth-of-type(9)  { --startRotate:  -89deg; }
.puzzle-svg path:nth-of-type(10) { --startRotate:   64deg; }
.puzzle-svg path:nth-of-type(11) { --startRotate:  -76deg; }
.puzzle-svg path:nth-of-type(12) { --startRotate:   58deg; }
.puzzle-svg path:nth-of-type(13) { --startRotate:   82deg; }
.puzzle-svg path:nth-of-type(14) { --startRotate:  -71deg; }
.puzzle-svg path:nth-of-type(15) { --startRotate:   60deg; }
.puzzle-svg path:nth-of-type(16) { --startRotate:  -94deg; }

/* Subtle scroll cue inside the sticky frame */
.puzzle-scroll-hint {
  position: absolute;
  bottom: 2rem; left: 0; right: 0;
  text-align: center;
  color: rgba(248,245,230,.28);
  font-family: var(--ff-body);
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  pointer-events: none;
  transition: opacity 0.6s ease;
}

@media (prefers-reduced-motion: reduce) {
  .puzzle-svg path { transform: none !important; }
}

/* ══════════════════════════════════════════════
   BLOB CAROUSEL SECTION
   ══════════════════════════════════════════════ */
.blob-section{overflow:hidden;}
.blob-layout{
  display:grid;grid-template-columns:1fr 1fr;
  gap:72px;align-items:center;
}
.blob-text .section-header{margin-bottom:22px;}
.blob-text .lead{max-width:440px;}
.blob-text .btn{margin-top:10px;}

/* Carousel container — size controlled by custom props */
.blob-carousel-wrap{
  display:flex;align-items:center;justify-content:center;
  /* default at ~desktop widths */
  --bc-size:520px;
  --bc-scale:0.65;   /* = bc-size / 800 */
  --bc-btn:1;
}
.blob-carousel{
  position:relative;z-index:1;flex-shrink:0;
  width:var(--bc-size);height:var(--bc-size);
}

/* Play / next button */
.blob-next{
  position:absolute;z-index:10;
  bottom:calc(10% * var(--bc-btn));
  left:calc(10% * var(--bc-btn));
  transform:rotate(-20deg) scale(var(--bc-btn));
  transition:transform .22s var(--ease-out-expo);
  width:108px;height:108px;
  background:var(--sage-mid);
  box-shadow:0 10px 28px -6px rgba(125,160,125,.45);
  border-radius:50%;
  color:var(--cream);
  font-family:var(--ff-body);
  font-size:.6rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.blob-next::before{
  content:'';position:absolute;inset:0;
  box-shadow:inset 0 0 0 10px rgba(255,255,255,.18);
  border-radius:50%;
  transform:scale(1.2);
  transition:transform .4s var(--ease-out-expo);
}
.blob-next:hover::before{transform:scale(1);}
.blob-next:active{
  transform:scale(calc(var(--bc-btn) * .88)) rotate(-5deg);
}

/* SVG blob shapes */
.blob-carousel > svg{
  position:absolute;z-index:1;inset:0;
  width:100%;height:100%;
  fill:var(--sage-pale);pointer-events:none;
}
/* Scale clip-path region to match actual pixel size (ratio = size/800) */
#blob-clip-region{
  transform:scale(var(--bc-scale));
}

/* Images container — clipped by blob path */
.blob-images{
  position:absolute;z-index:2;inset:0;
  -webkit-clip-path:url(#blob-clip-region);
  clip-path:url(#blob-clip-region);
  overflow:hidden;
}
.blob-images img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  transition:opacity .65s var(--ease-out-expo), transform .65s var(--ease-out-expo);
  opacity:0;transform:scale(.92) translateZ(0);
}
.blob-images img.active{
  opacity:1;transform:scale(1) translateZ(0);
}

/* Responsive blob sizes */
@media(max-width:1100px){
  .blob-carousel-wrap{--bc-size:460px;--bc-scale:0.575;}
}
@media(max-width:900px){
  .blob-layout{
    grid-template-columns:1fr;gap:40px;
  }
  .blob-layout .blob-text{order:2;text-align:center;}
  .blob-layout .blob-text .label{justify-content:center;}
  .blob-layout .blob-text .lead{max-width:none;margin-left:auto;margin-right:auto;}
  .blob-carousel-wrap{order:1;--bc-size:400px;--bc-scale:0.5;--bc-btn:.88;}
}
@media(max-width:700px){
  .blob-carousel-wrap{--bc-size:340px;--bc-scale:0.425;--bc-btn:.78;}
  .blob-next{left:0px;bottom:10px;width:84px;height:84px;}
}
@media(max-width:500px){
  .blob-carousel-wrap{--bc-size:280px;--bc-scale:0.35;--bc-btn:.68;}
  .blob-next{left:-4px;bottom:8px;width:70px;height:70px;font-size:.48rem;}
}

/* ══════════════════════════════════════════════
   SITE INTRO / LOADING SCREEN
   ══════════════════════════════════════════════ */
.site-intro{
  position:fixed;z-index:2000;inset:0;
  background:var(--navy);
  display:flex;align-items:center;justify-content:center;
  transform-origin:top;will-change:transform;
}
.site-intro__label{
  font-family:var(--ff-script);
  font-size:clamp(1.8rem,3.5vw,3.5rem);
  color:rgba(248,245,230,.78);
  letter-spacing:-.03em;word-spacing:-.10em;user-select:none;
}
.site-intro__bar{
  position:absolute;bottom:0;left:0;
  width:100%;height:30%;
  background:var(--sage);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  transform:scaleY(0);transform-origin:bottom;will-change:transform;
}
.site-intro__bar-text{
  font-family:var(--ff-script);
  font-size:24vw;line-height:1;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.18);
  white-space:nowrap;
  transform:scaleX(.48) scaleY(1.6);
  letter-spacing:-.4vw;user-select:none;
}

/* ══════════════════════════════════════════════
   CINEMATIC CLIP SECTION
   ══════════════════════════════════════════════ */
.cine-section{
  position:relative;width:100%;height:100vh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;background:var(--navy);
}
.cine-inner{
  position:relative;width:90vw;height:88vh;
  display:flex;align-items:center;justify-content:center;
}
.cine-title,
.cine-title-stroke{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--ff-script);
  font-size:clamp(7rem,17vw,19rem);
  line-height:1;margin:0;text-align:center;
  pointer-events:none;user-select:none;
  letter-spacing:-.01em;
}
.cine-title{z-index:1;color:var(--cream);}
.cine-title-stroke{
  z-index:3;color:transparent;
  -webkit-text-stroke:1px rgba(248,245,230,.36);
}
/* Each letter wrapped by JS for overflow clipping */
.cine-letter-row{display:flex;overflow:hidden;}
.cine-title span,
.cine-title-stroke span{display:inline-block;}

.cine-image{
  position:absolute;z-index:2;
  top:50%;left:50%;
  width:clamp(260px,35vw,500px);
  aspect-ratio:1/1;
  transform:translate(-60%,-50%) scaleX(-1);
  clip-path:url(#cineClipPath);
  overflow:hidden;
}
.cine-image img{
  position:absolute;top:50%;left:50%;
  min-width:110vw;min-height:110vh;
  width:auto;height:auto;
  object-fit:cover;
  transform:translate(-50%,-50%) scaleX(-1);
}
.cine-bg{
  position:absolute;z-index:0;inset:0;
  border-radius:2.5vw;overflow:hidden;
}
.cine-bg img{
  width:100%;height:100%;object-fit:cover;
  opacity:.32;filter:blur(2px);
}
.cine-caption{
  position:absolute;z-index:4;
  bottom:22px;left:50%;
  transform:translateX(-50%);
  font-family:var(--ff-serif);
  font-size:clamp(.76rem,1.15vw,.9rem);
  color:rgba(248,245,230,.5);
  text-align:center;font-style:italic;
  letter-spacing:.1em;white-space:nowrap;
}

/* ═══════════════════════════════════════════
   BEAR TODO LIST
   ═══════════════════════════════════════════ */
.todo-section {
  padding: 5rem 1.5rem 6rem;
  background: var(--sage-pale);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .4rem;
}
.todo-section__title {
  font-family: var(--ff-script);
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  color: var(--navy);
  text-align: center;
  margin: 0;
}
.todo-section__sub {
  font-family: var(--ff-body);
  color: var(--navy);
  opacity: .6;
  text-align: center;
  margin: 0 0 2.4rem;
  font-size: .98rem;
}
#todo-app {
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 3.5rem;
  align-items: center;
  max-width: 840px;
  width: 100%;
}
@media (max-width: 640px) {
  #todo-app { grid-template-columns: 1fr; }
}

/* Bear */
.bear-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
}
.bear-svg {
  width: clamp(155px, 26vw, 230px);
  height: auto;
  overflow: visible;
}
/* Initially hide animated face states (GSAP will reveal) */
.bear__shades,
.bear__sweat,
.bear__tear,
.bear__concerned-brow,
.bear__tired-eyes {
  opacity: 0;
}

/* ── Notepad ── clean, minimal, image-inspired */
.notepad {
  background: #eef6f0;
  border-radius: 6px;
  padding: 1.8rem 1.8rem 2rem;
  min-height: 290px;
  position: relative;
}
.notepad__rings { display: none; }
.notepad::before,
.notepad::after { content: none; }

.notepad__header {
  font-family: var(--ff-script);
  font-size: 2.1rem;
  color: rgba(43,58,103,.38);
  margin: 0 0 1.5rem;
  line-height: 1;
  font-weight: 400;
}
/* Input */
.notepad__input-row {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: 1.4rem;
  padding-bottom: .6rem;
  border-bottom: 1.5px solid rgba(43,58,103,.18);
}
.notepad__input {
  flex: 1;
  border: none;
  background: transparent;
  font-family: var(--ff-body);
  font-size: .95rem;
  font-weight: 500;
  color: var(--navy);
  padding: .15rem 0;
  outline: none;
  min-width: 0;
}
.notepad__input::placeholder { color: rgba(43,58,103,.3); }
.notepad__add-btn {
  flex-shrink: 0;
  background: none;
  border: none;
  color: rgba(43,58,103,.45);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  transition: color .2s, transform .15s;
}
.notepad__add-btn:hover { color: var(--navy); transform: rotate(90deg); }

/* List */
.notepad__items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  max-height: 210px;
  overflow-y: auto;
}
.notepad__items::-webkit-scrollbar { width: 3px; }
.notepad__items::-webkit-scrollbar-thumb { background: rgba(43,58,103,.14); border-radius: 2px; }
.notepad__item {
  display: flex;
  align-items: baseline;
  gap: .55rem;
  padding: .55rem 0;
  border-bottom: 1px solid rgba(43,58,103,.07);
  cursor: pointer;
  overflow: hidden;
}
.notepad__item:last-child { border-bottom: none; }

/* Star image bullet */
.todo__bullet {
  width: 18px;
  height: 18px;
  object-fit: contain;
  flex-shrink: 0;
  transition: opacity .3s;
  user-select: none;
  display: block;
}
.notepad__item.done .todo__bullet { opacity: .2; }

/* Label — DevinaGarden script font */
.todo__label {
  font-family: var(--ff-script);
  font-size: 1.15rem;
  font-weight: 400;
  color: var(--navy);
  flex: 1;
  position: relative;
  line-height: 1.3;
  transition: color .3s;
  word-break: break-word;
}
.todo__label::after {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%) scaleX(var(--strike, 0));
  transform-origin: left center;
  width: 100%;
  height: 2px;
  background: var(--navy);
  transition: transform .35s ease;
}
.notepad__item.done .todo__label {
  color: rgba(43,58,103,.3);
  --strike: 1;
}
.todo__remove {
  background: none;
  border: none;
  color: rgba(43,58,103,.22);
  cursor: pointer;
  font-size: .95rem;
  line-height: 1;
  padding: 0 .1rem;
  transition: color .2s;
  flex-shrink: 0;
}
.todo__remove:hover { color: hsl(0,60%,52%); }
.notepad__empty {
  font-family: var(--ff-body);
  color: rgba(43,58,103,.32);
  font-size: .86rem;
  padding: .5rem 0;
}

/* ═══════════════════════════════════════════
   SPLIT REVEAL
   ═══════════════════════════════════════════ */
.split-reveal {
  position: relative;
  height: 62vh;
  min-height: 340px;
  overflow: hidden;
  cursor: ew-resize;
  user-select: none;
}
.split-reveal__side {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.split-reveal__right {
  background: var(--sage-pale);
  z-index: 1;
}
.split-reveal__left {
  background: var(--navy);
  width: 50%;
  z-index: 2;
}
/* Both panels' content is anchored to the SAME centre point */
.split-reveal__content {
  position: absolute;
  left: 50vw;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
  white-space: nowrap;
}
.split-reveal__word {
  display: block;
  font-family: var(--ff-body);
  font-size: clamp(3rem, 8.5vw, 7.5rem);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .07em;
  line-height: 1;
}
.split-reveal__accent {
  display: block;
  font-family: var(--ff-script);
  font-size: clamp(1.6rem, 4vw, 3.2rem);
  line-height: 1.2;
  margin-top: .5rem;
}
.split-reveal__left .split-reveal__word    { color: var(--cream); }
.split-reveal__left .split-reveal__accent  { color: var(--sage); }
.split-reveal__right .split-reveal__word   { color: var(--navy); }
.split-reveal__right .split-reveal__accent { color: var(--sage-mid); }

/* Drag handle */
.split-reveal__handle {
  position: absolute;
  top: 0;
  left: 50%;
  width: 2px;
  height: 100%;
  background: rgba(255,255,255,.55);
  z-index: 4;
  transform: translateX(-50%);
}
.split-reveal__handle::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: white;
  box-shadow: 0 3px 14px rgba(43,58,103,.25);
}
@media (max-width: 600px) {
  .split-reveal { height: 50vh; min-height: 260px; }
  .split-reveal__content { left: 50%; }
}

/* ── Pill cursor for cine hover ─────────────── */
.site-cursor{
  position:fixed;z-index:1500;
  top:0;left:0;
  width:clamp(82px,9vw,118px);
  aspect-ratio:5/2;
  display:flex;align-items:center;justify-content:center;
  color:var(--navy);
  font-family:var(--ff-body);
  font-size:clamp(.48rem,.82vw,.66rem);
  font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  pointer-events:none;
  transform:translate(-50%,-50%) scale(0);
  will-change:transform;
}
.site-cursor::after{
  content:'';position:absolute;inset:0;
  background:var(--sage);border-radius:100px;
  transform:rotate(-10deg);z-index:-1;
}

/* ══════════════════════════════════════════════
   COUNTDOWN
   ══════════════════════════════════════════════ */
.countdown-section {
  position: relative;
  background: var(--navy);
  overflow: hidden;
  padding: 5rem 1.5rem;
  text-align: center;
}
.countdown-noise {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .07;
  pointer-events: none;
}
.countdown-inner {
  position: relative;
  z-index: 1;
}
.countdown-title {
  font-family: var(--ff-script);
  font-size: clamp(1.6rem, 4vw, 2.6rem);
  color: var(--cream);
  margin: .4rem 0 2rem;
}
.countdown-svg {
  display: block;
  width: 100%;
  max-width: 840px;
  margin: 0 auto 2rem;
}
.cd-value {
  fill: var(--cream);
  font-size: 111px;
  font-family: 'DevinaGarden', cursive;
  text-anchor: middle;
  dominant-baseline: auto;
  /* no filter — clean crisp digits */
}
.cd-label {
  fill: rgba(154,184,154,.75);
  font-size: 18px;
  font-family: var(--ff-body);
  text-anchor: middle;
  dominant-baseline: auto;
  letter-spacing: 5px;
}
.countdown-note {
  font-family: var(--ff-body);
  font-size: .92rem;
  color: rgba(248,245,230,.50);
  letter-spacing: .04em;
  margin-top: .5rem;
}
@media (max-width: 600px) {
  .countdown-section { padding: 3.5rem 1rem; }
  .countdown-svg { max-width: 100%; }
  .cd-value { font-size: 78px; }
  .cd-label { font-size: 12px; letter-spacing: 3px; }
}


/* ══════════════════════════════════════════════
   BOOK SHELF — Bibliographie
   ══════════════════════════════════════════════ */
.section--books {
  padding-left: 0;
  padding-right: 0;
}
.section--books > .container {
  padding-left: 64px;
  padding-right: 64px;
}

.book-shelf {
  overflow: hidden;
  background: var(--navy);
  margin: 2rem 0;
}

.book-grid {
  --bk-cols: 3;
  display: grid;
  grid-template-columns: repeat(var(--bk-cols), 1fr);
  list-style: none;
  margin: 180px 0;
  padding: 0;
}

.book-grid li {
  grid-column-end: span 2;
  position: relative;
  width: 100%;
  padding-bottom: 100%;
  margin-top: -50%;
}

.book-grid li:nth-child(2n) { grid-column-start: 2; }

.book-grid li::before,
.book-grid li::after {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background-size: 50% 100%, 100% 100%;
  background-position: left, right;
  background-repeat: no-repeat;
}

.book-grid li::before {
  z-index: -10;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  background-image:
    linear-gradient(-45deg, var(--cream-warm) 53.5%, var(--sage-mid) 53.5%, var(--sage-mid) 60%, var(--cream-warm) 60%),
    linear-gradient(45deg, var(--cream-warm) 65.3%, var(--sage-mid) 65.3%, var(--sage-mid) 69.9%, var(--cream-warm) 69.9%);
}
.book-grid li::after {
  clip-path: polygon(100% 50%, 50% 100%, 0 50%, 20% 50%, 50% 80%, 80% 50%);
  background-image:
    linear-gradient(45deg, var(--cream-warm) 40%, var(--sage-mid) 40%),
    linear-gradient(-45deg, var(--cream-warm) 30%, var(--sage-mid) 30%);
}

.book-grid li:nth-child(2n)::before {
  background-image:
    linear-gradient(-45deg, var(--sage) 53.5%, var(--navy-mid) 53.5%, var(--navy-mid) 60%, var(--sage) 60%),
    linear-gradient(45deg, var(--sage) 65.3%, var(--navy-mid) 65.3%, var(--navy-mid) 69.9%, var(--sage) 69.9%);
}
.book-grid li:nth-child(2n)::after {
  background-image:
    linear-gradient(45deg, var(--sage) 40%, var(--navy-mid) 40%),
    linear-gradient(-45deg, var(--sage) 30%, var(--navy-mid) 30%);
}

.book-grid li:nth-child(5n)::before {
  background-image:
    linear-gradient(-45deg, var(--sage-mid) 53.5%, var(--sage) 53.5%, var(--sage) 60%, var(--sage-mid) 60%),
    linear-gradient(45deg, var(--sage-mid) 65.3%, var(--sage) 65.3%, var(--sage) 69.9%, var(--sage-mid) 69.9%);
}
.book-grid li:nth-child(5n)::after {
  background-image:
    linear-gradient(45deg, var(--sage-mid) 40%, var(--sage) 40%),
    linear-gradient(-45deg, var(--sage-mid) 30%, var(--sage) 30%);
}

.book-grid li:nth-child(7n)::before,
.book-grid li:nth-child(7n-4)::before {
  background-image:
    linear-gradient(-45deg, var(--navy-mid) 53.5%, var(--cream) 53.5%, var(--cream) 60%, var(--navy-mid) 60%),
    linear-gradient(45deg, var(--navy-mid) 65.3%, var(--cream) 65.3%, var(--cream) 69.9%, var(--navy-mid) 69.9%);
}
.book-grid li:nth-child(7n)::after,
.book-grid li:nth-child(7n-4)::after {
  background-image:
    linear-gradient(45deg, var(--navy-mid) 40%, var(--cream) 40%),
    linear-gradient(-45deg, var(--navy-mid) 30%, var(--cream) 30%);
}

.book-grid li:nth-child(9n)::before,
.book-grid li:nth-child(9n-5)::before {
  background-image:
    linear-gradient(-45deg, var(--cream) 53.5%, var(--sage-mid) 53.5%, var(--sage-mid) 60%, var(--cream) 60%),
    linear-gradient(45deg, var(--cream) 65.3%, var(--sage-mid) 65.3%, var(--sage-mid) 69.9%, var(--cream) 69.9%);
}
.book-grid li:nth-child(9n)::after,
.book-grid li:nth-child(9n-5)::after {
  background-image:
    linear-gradient(45deg, var(--cream) 40%, var(--sage-mid) 40%),
    linear-gradient(-45deg, var(--cream) 30%, var(--sage-mid) 30%);
}

.book-grid img {
  position: absolute;
  width: 43%;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-60%);
  box-shadow: 5px -5px 10px rgba(0,0,0,0.45);
  transition: transform .3s;
}
.book-grid img:hover {
  transform: translateX(-40%) translateY(-70%) rotateZ(25deg);
}

@media (min-width: 450px) {
  .book-grid { margin: 190px 0; }
}
@media (min-width: 600px) {
  .book-grid { --bk-cols: 5; }
  .book-grid li:nth-child(2n) { grid-column-start: auto; }
  .book-grid li:nth-child(4n-1) { grid-column-start: 2; }
}
@media (min-width: 900px) {
  .book-grid { --bk-cols: 7; }
  .book-grid li:nth-child(4n-1) { grid-column-start: auto; }
  .book-grid li:nth-child(6n-2) { grid-column-start: 2; }
}
@media (min-width: 1200px) {
  .book-grid { --bk-cols: 9; }
  .book-grid li:nth-child(6n-2) { grid-column-start: auto; }
  .book-grid li:nth-child(8n-3) { grid-column-start: 2; }
}
@media (min-width: 1500px) {
  .book-grid { --bk-cols: 11; }
  .book-grid li:nth-child(8n-3) { grid-column-start: auto; }
  .book-grid li:nth-child(10n-4) { grid-column-start: 2; }
}

/* ══════════════════════════════════════════════
   REDUCED MOTION
   ══════════════════════════════════════════════ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}