/* =========================================================
   Accueil — la charte vient des opercules :
   blanc lait, marine du « y », couleur portée par chaque parfum,
   titres ronds et épais (Baloo 2), annotations manuscrites.
   Scopé sous body.home : le reste du site n'est pas touché.
   ========================================================= */
.home{
  --milk: #FFFFFF;
  --whey: #EEF3F9;
  --navy: #00315C;
  --text: #13243A;
  --navy-soft: #C9DAEE;
  --font-round: "Baloo 2", "Inter", system-ui, sans-serif;
  background: var(--milk);
  color: var(--text);
}
.home h1, .home h2, .home h3{ font-family: var(--font-round); font-weight: 800; letter-spacing: -0.01em; color: var(--navy); line-height: 1.02; }
.home :focus-visible{ outline-color: var(--navy); }

/* header & footer, recoloured for the white page */
.home .site-header{ background: rgba(255,255,255,.94); border-bottom-color: var(--whey); }
.home .nav-links a:hover, .home .nav-links a[aria-current="page"]{ border-color: var(--navy); }
.home .site-footer{ background: var(--navy); color: var(--navy-soft); }

/* buttons: pills like the lid's rounded forms, no arrows */
.v2-btn{
  display:inline-flex; align-items:center; min-height:48px; padding:.7rem 1.5rem;
  border-radius:999px; font-weight:700; text-decoration:none; font-size:1rem;
  border:2px solid var(--navy); transition: background-color .15s ease, color .15s ease;
}
.v2-btn-solid{ background: var(--navy); color: var(--milk); }
.v2-btn-solid:hover{ background: var(--text); border-color: var(--text); }
.v2-btn-line{ color: var(--navy); background: transparent; }
.v2-btn-line:hover{ background: var(--whey); }
.v2-actions{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.8rem; }

/* ---------- hero ---------- */
.v2-hero{ padding: clamp(2.5rem, 6vw, 5rem) 0 clamp(3rem, 7vw, 6rem); overflow:hidden; }
.v2-hero-grid{ display:grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4rem); align-items:center; }
.v2-hero h1{ font-size: clamp(2.6rem, 5.6vw, 4.6rem); margin:0; max-width: 12ch; }
.v2-lede{ font-size: 1.15rem; line-height:1.65; max-width: 44ch; margin-top:1.4rem; }

.v2-hero-lids{ position:relative; aspect-ratio: 1 / 1; max-width: 520px; width:100%; justify-self:center; color: var(--navy); }
.v2-hero-lids img{ position:absolute; width:62%; height:auto; filter: drop-shadow(0 14px 18px rgba(0,49,92,.18)); }
.lid-a{ left:0;   top:4%;  --r:-8deg; transform: rotate(var(--r)); z-index:2; }
.lid-b{ right:0;  top:22%; --r: 7deg; transform: rotate(var(--r)); z-index:1; }
.lid-c{ left:18%; bottom:0; --r:-2deg; transform: rotate(var(--r)); z-index:3; }
.v2-note{
  position:absolute; right:0; top:-2%; z-index:4; margin:0; text-align:right;
  font-family: var(--font-script); font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height:1.05; color: var(--navy);
  transform: rotate(-6deg);
}
.v2-note-arrow{ position:absolute; right:30%; top:9%; width:18%; z-index:4; transform: rotate(-15deg); }

/* the one orchestrated moment: the three lids are set down on load */
@media (prefers-reduced-motion: no-preference){
  .v2-hero-lids img{ animation: v2-set-down .7s cubic-bezier(.2,.8,.25,1) both; }
  .lid-b{ animation-delay: .12s; }
  .lid-c{ animation-delay: .24s; }
  .v2-note, .v2-note-arrow{ animation: v2-appear .4s ease-out .7s both; }
}
@keyframes v2-set-down{
  from{ opacity:0; transform: translateY(-28px) rotate(calc(var(--r) - 10deg)) scale(1.06); }
  to{   opacity:1; transform: translateY(0) rotate(var(--r)) scale(1); }
}
@keyframes v2-appear{ from{ opacity:0; } to{ opacity:1; } }

/* ---------- range wall ---------- */
.v2-range{ background: var(--whey); padding: clamp(3rem, 7vw, 5.5rem) 0; }
.v2-range h2, .v2-band h2, .v2-visit h2{ font-size: clamp(2rem, 4vw, 3rem); margin:0 0 .6rem; }
.v2-intro{ max-width: 52ch; font-size:1.08rem; margin-bottom: 2.4rem; }
.v2-range-groups{ display:grid; grid-template-columns: 4fr 1fr; gap: 1.2rem; margin-bottom: 2.4rem; } /* same column rhythm: every lid the same width */
.v2-range h3{ font-size:1.35rem; margin: 0 0 1rem; }
.v2-wall{ list-style:none; margin:0; padding:0; display:grid; gap: 1.6rem 1.2rem; }
.v2-wall-7{ grid-template-columns: repeat(4, 1fr); }
.v2-wall-2{ grid-template-columns: 1fr; }
.lid{ text-align:center; }
.lid img{ width:100%; height:auto; aspect-ratio: 700 / 615; object-fit: contain; filter: drop-shadow(0 8px 10px rgba(0,49,92,.14)); }
.lid span{ display:block; margin-top:.5rem; font-family: var(--font-round); font-weight:700; font-size:1.1rem; color: var(--navy); }

/* ---------- navy band ---------- */
.v2-band{ background: var(--navy); color: var(--milk); padding-top: clamp(3rem, 7vw, 5.5rem); }
.v2-band h2{ color: var(--milk); }
.v2-facts{ list-style:none; margin: 1.6rem 0 clamp(2.5rem, 5vw, 3.5rem); padding:0; display:grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.v2-facts li{ color: var(--navy-soft); line-height:1.6; }
.v2-facts strong{ display:block; font-family: var(--font-round); font-weight:800; font-size:1.5rem; color: var(--milk); margin-bottom:.3rem; }
.v2-band-photo{ display:block; width:100%; height:auto; }

/* ---------- visit ---------- */
.v2-visit{ padding: clamp(3rem, 7vw, 5.5rem) 0; }
.v2-visit-grid{ display:grid; grid-template-columns: 1.3fr 1fr; gap: 3rem; align-items:start; }
.v2-hours{ margin:0; background: var(--whey); border-radius: 28px; padding: 1.6rem 1.8rem; }
.v2-hours div{ display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; border-bottom: 2px dotted #C9D6E4; }
.v2-hours div:last-child{ border-bottom:0; }
.v2-hours dt{ font-weight:600; }
.v2-hours dd{ margin:0; font-variant-numeric: tabular-nums; font-weight:700; color: var(--navy); }

/* ---------- responsive ---------- */
@media (max-width: 900px){
  .v2-hero-grid, .v2-visit-grid{ grid-template-columns: 1fr; }
  .v2-hero-lids{ max-width: 380px; }
  .v2-range-groups{ grid-template-columns: 1fr; }
  .v2-wall-2{ grid-template-columns: repeat(4, 1fr); }
  .v2-facts{ grid-template-columns: 1fr; gap: 1.4rem; }
}
@media (max-width: 560px){
  .v2-wall-7, .v2-wall-2{ grid-template-columns: repeat(3, 1fr); gap: 1.2rem .8rem; }
  .lid span{ font-size: .95rem; }
  .v2-btn{ width:100%; justify-content:center; }
}