
  :root{
    /* Charte graphique Anne Philippe · Entre les nombres — août 2026 */
    --creme:#FFFDEB;          /* fond de tous les supports, jamais de blanc pur */
    --kraft:#FFFDEB;          /* alias : tout fond clair est crème */
    --kraft-fonce:#9CBFC1;    /* filets discrets (turquoise atténué) */
    --brun:#216C72;           /* texte principal : turquoise profond */
    --brun-doux:#417A7E;      /* texte secondaire : turquoise atténué */
    --terracotta:#E06D47;     /* corail — accent par petites touches */
    --terracotta-clair:#EA9C7A;
    --teal:#216C72;           /* turquoise profond — principal */
    --teal-fonce:#14312F;     /* sapin profond — fonds sombres */
    --corail:#E06D47;
    --surface:rgba(33,108,114,.055);   /* crème teinté : rythme des blocs */
    --trait-carte:#216C72;    /* courbes de niveau en turquoise */
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;background:#FFFDEB;}
  body{
    font-family:'Lato',sans-serif;
    background:transparent;
    color:var(--brun);
    line-height:1.65;
    font-size:17px;
  }
  /* Constellation en filigrane — traverse tout le document (la carte, opaque, la masque) */
  body::before{
    content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
    background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><g transform="rotate(-42 50 50)"><g stroke="%23216C72" stroke-width="1.67" stroke-linecap="round" fill="none"><line x1="29.69" y1="27.1" x2="46.44" y2="45.12"/><line x1="64.42" y1="16.9" x2="64.42" y2="32.79"/><line x1="46.44" y1="45.12" x2="64.42" y2="32.79"/><line x1="46.44" y1="45.12" x2="34.48" y2="80.43"/><line x1="64.92" y1="68.32" x2="34.48" y2="80.43"/></g><circle cx="29.69" cy="27.1" r="2.85" fill="%23E06D47"/><circle cx="64.42" cy="16.9" r="2.85" fill="%23E06D47"/><circle cx="64.92" cy="68.32" r="2.85" fill="%23E06D47"/><circle cx="46.44" cy="45.12" r="2.85" fill="%23216C72"/><circle cx="64.42" cy="32.79" r="2.85" fill="%23216C72"/><circle cx="34.48" cy="80.43" r="2.85" fill="%23216C72"/></g></svg>');
    background-repeat:no-repeat;
    background-position:calc(100% - 2vh) -6vh;   /* il arrive par le haut droit, léger décalé à gauche */
    background-size:min(170vh,1500px);
    opacity:0.07;
  }
  h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;}


  /* ---------- Navigation par rubriques ---------- */
  .page{display:block;}
  .page.actif{display:block;animation:apparait .35s ease-out;}
  @keyframes apparait{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
  nav a.actif{color:var(--terracotta);border-color:var(--terracotta);}
  .sep-page{display:flex;align-items:center;gap:14px;max-width:calc(1000px + 3rem);margin:0 auto;padding:0 1.5rem;}
  .sep-page span{flex:1;height:1px;background:var(--kraft-fonce);}
  .sep-page i{width:8px;height:8px;border-radius:50%;background:var(--corail);}
  .suite{max-width:1000px;margin:0 auto;padding:0.5rem 1.5rem 3.5rem;}
  .suite .sur-titre{margin-bottom:0.4rem;}
  .suite a{
    display:inline-block;font-family:'Lato',sans-serif;font-size:0.95rem;
    color:var(--teal);text-decoration:none;border-bottom:1.3px solid var(--corail);
    padding-bottom:2px;transition:color .2s;text-wrap:nowrap;white-space:nowrap;
  }
  .suite a:hover{color:var(--corail);}
  .suite a::after{content:"\00a0\2192";color:var(--corail);}

  /* ---------- Header ---------- */
  header{
    position:sticky;top:0;z-index:50;
    background:rgba(33,108,114,0.97);   /* turquoise profond */
    backdrop-filter:blur(6px);
  }
  .header-inner{
    max-width:1200px;margin:0 auto;
    display:flex;align-items:center;justify-content:space-between;
    padding:0.7rem 1.5rem;
  }
  .brand{display:flex;align-items:center;gap:0.8rem;text-decoration:none;color:var(--creme);}
  .brand svg{display:block;}
  .brand-name{font-family:'Cormorant Garamond',serif;font-size:1.45rem;font-weight:600;letter-spacing:0.04em;color:var(--corail);}
  .brand-sub{font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;color:rgba(255,252,225,0.75);}
  nav a{
    text-decoration:none;color:rgba(255,252,225,0.88);
    font-size:0.85rem;letter-spacing:0.08em;text-transform:uppercase;
    margin-left:1.15rem;padding-bottom:3px;
    border-bottom:1px solid transparent;
    transition:color .2s,border-color .2s;
  }
  nav a:hover{color:var(--terracotta);border-color:var(--terracotta);}



  /* ---------- Carte ---------- */
  .carte-section{
    background:transparent;
    position:relative;
    padding:2rem 0.4rem 0;
  }
  .carte-titre{
    text-align:center;max-width:820px;margin:0 auto 1.2rem;
  }
  .carte-titre h1{
    font-size:clamp(1.9rem,4.5vw,3.1rem);
    font-weight:500;line-height:1.2;
  }
  .carte-titre p{
    margin-top:0.6rem;color:var(--brun-doux);
    font-size:clamp(0.95rem,1.6vw,1.08rem);
  }
  .carte-wrap{max-width:1400px;margin:0 auto;}
  .carte-wrap svg{width:100%;height:auto;display:block;}
  .carte-note{
    text-align:center;font-size:0.8rem;color:var(--brun-doux);
    padding:0.8rem 0 1.2rem;font-style:italic;
  }

  /* éléments SVG interactifs */
  .chemin{
    fill:none;stroke:var(--teal);stroke-width:1.2;
    stroke-dasharray:2 7;stroke-linecap:round;
    opacity:0.55;transition:opacity .25s;
  }
  .destination{cursor:pointer;}
  .destination circle.pt{
    fill:var(--creme);stroke:var(--teal);stroke-width:2.5;
    transition:all .25s;
  }
  .destination text{fill:var(--brun);}
  .destination .dest-nom{
    font-family:'Cormorant Garamond',serif;font-size:31px;font-weight:600;
  }
  .destination .dest-sous{
    font-family:'Lato',sans-serif;font-size:15.5px;fill:var(--brun-doux);
  }
  .ici-txt{font-size:24px;}
  .destination:hover circle.pt{fill:var(--terracotta);stroke:var(--terracotta);r:11;}
  .destination:hover .dest-nom{fill:var(--terracotta);}
  .contour{fill:none;stroke:var(--trait-carte);stroke-width:1.1;opacity:0.35;}
  .pulse{animation:pulse 2.4s ease-out infinite;transform-origin:center;transform-box:fill-box;}
  @keyframes pulse{
    0%{opacity:.8;transform:scale(1);}
    70%{opacity:0;transform:scale(2.6);}
    100%{opacity:0;transform:scale(2.6);}
  }
  .pulse-pt{fill:none;stroke:var(--corail);stroke-width:1.3;
    animation:pulse 2.4s ease-out infinite;transform-origin:center;transform-box:fill-box;}


  /* Apparition en cascade à l'ouverture d'une rubrique */
  .page.actif .carte-offre,
  .page.actif .temoin,
  .page.actif .etape{animation:monte .5s ease-out backwards;}
  .page.actif .carte-offre:nth-child(2),.page.actif .temoin:nth-child(2),.page.actif .etape:nth-child(2){animation-delay:.07s;}
  .page.actif .carte-offre:nth-child(3),.page.actif .temoin:nth-child(3),.page.actif .etape:nth-child(3){animation-delay:.14s;}
  .page.actif .carte-offre:nth-child(4),.page.actif .temoin:nth-child(4){animation-delay:.21s;}
  .page.actif .carte-offre:nth-child(5){animation-delay:.28s;}
  @keyframes monte{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
  @media (prefers-reduced-motion:reduce){
    .page.actif,.page.actif *{animation:none !important;}
  }


  /* La carte se dessine à l'ouverture */
  .page.actif .chemin{
    animation:trace .7s ease-out backwards;
    transform-box:view-box;transform-origin:600px 335px;
  }
  @keyframes trace{from{transform:scale(.12);opacity:0;}to{transform:scale(1);opacity:.55;}}
  #ray-adulte{animation-delay:.05s;} #ray-temporalite{animation-delay:.12s;}
  #ray-couple{animation-delay:.19s;} #ray-enfant{animation-delay:.26s;}
  #ray-amis{animation-delay:.33s;} #ray-equipe{animation-delay:.40s;}
  #ray-entreprise{animation-delay:.47s;}
  .page.actif .destination{animation:eclot .45s ease-out backwards;}
  @keyframes eclot{from{opacity:0;}to{opacity:1;}}
  .page.actif .destination:nth-of-type(1){animation-delay:.40s;}
  .page.actif .destination:nth-of-type(2){animation-delay:.48s;}
  .page.actif .destination:nth-of-type(3){animation-delay:.56s;}
  .page.actif .destination:nth-of-type(4){animation-delay:.64s;}
  .page.actif .destination:nth-of-type(5){animation-delay:.72s;}
  .page.actif .destination:nth-of-type(6){animation-delay:.80s;}
  .page.actif .destination:nth-of-type(7){animation-delay:.88s;}
  .page.actif .destination:nth-of-type(8){animation-delay:.96s;}
  /* le rayon s'éclaire au survol de sa porte */
  .chemin.eclaire{opacity:1;stroke:var(--corail);stroke-width:2;}




  /* Rythme sur petit écran : bandes teintées pleine largeur */
  @media(max-width:760px){
    :root{--surface:rgba(33,108,114,.085);}
    #temoignages{background:transparent;}
    #temoignages .temoin{background:var(--creme);}
    .grille-bloc{
      margin-left:-1.5rem;margin-right:-1.5rem;
      padding-left:1.5rem;padding-right:1.5rem;border-radius:0;
    }
    .encart{margin-left:-1.5rem;margin-right:-1.5rem;border-radius:0;padding:1.6rem 1.5rem;}
    section{padding:2.4rem 1.5rem;}
  }

  /* ---------- Sections communes ---------- */
  section{padding:3rem 1.5rem;}
  .inner{max-width:1000px;margin:0 auto;}
  .inner, .inner-narrow{max-width:1000px;margin:0 auto;}
  .inner-narrow{max-width:760px;}
  .sur-titre{
    font-size:0.78rem;letter-spacing:0.22em;text-transform:uppercase;
    color:var(--terracotta);margin-bottom:0.8rem;font-weight:700;
  }
  h2,h1.titre-page{font-size:clamp(1.7rem,3.5vw,2.4rem);font-weight:500;margin-bottom:1.4rem;line-height:1.25;}
  .lead{font-size:1.12rem;}

  /* ---------- Démarche ---------- */
  #bloc-demarche{background:transparent;scroll-margin-top:150px;}
  #bloc-demarche .deux-col{
    display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;
  }
  @media(max-width:760px){#bloc-demarche .deux-col{grid-template-columns:1fr;}}
  .encart{
    background:transparent;border-radius:4px;
    padding:1.6rem 1.8rem;font-size:0.98rem;
  }
  .encart p+p{margin-top:0.8rem;}
  .encart .serif{font-size:1.25rem;font-style:italic;}

  /* ---------- À propos ---------- */
  #apropos{background:transparent;}
  #apropos .duo{display:grid;grid-template-columns:230px 1fr;gap:2.6rem;align-items:center;}
  #apropos img{width:100%;height:auto;display:block;aspect-ratio:1;object-fit:cover;border-radius:50%;border:1.3px solid var(--teal);outline:1px solid var(--teal);outline-offset:6px;}
  #apropos p{font-size:1.02rem;}
  #apropos p+p{margin-top:0.9rem;}
  #apropos .signature{font-family:'Cormorant Garamond',serif;font-size:1.25rem;font-style:italic;margin-top:1.4rem;}
  @media(max-width:820px){#apropos .duo{grid-template-columns:1fr;gap:1.6rem;justify-items:center;text-align:center;}
    #apropos img{max-width:210px;}
    #apropos .signature{text-align:center;}}

  /* ---------- Chemins / offres ---------- */
  #portes{background:transparent;}
  .cartes-grille{
    display:grid;grid-template-columns:repeat(6,1fr);
    gap:1.4rem;margin-top:2.2rem;
  }
  .cartes-grille > .carte-offre{grid-column:span 2;}
  /* les deux dernières cartes individuelles tiennent la ligne à elles seules */
  .cartes-grille > #offre-enfant,
  .cartes-grille > #offre-couple{grid-column:span 3;}
  @media(max-width:980px){
    .cartes-grille{grid-template-columns:repeat(2,1fr);}
    .cartes-grille > .carte-offre,
    .cartes-grille > #offre-enfant,
    .cartes-grille > #offre-couple{grid-column:span 1;}
  }
  @media(max-width:620px){
    .cartes-grille{grid-template-columns:1fr;}
  }
  .carte-offre{
    background:var(--creme);border-radius:4px;
    padding:1.8rem 1.6rem;
    border-top:3px solid var(--teal);
    transition:transform .3s, box-shadow .3s, border-color .3s, outline-color .3s;
    scroll-margin-top:150px;
  }
  .carte-offre:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(74,55,40,0.12);}
  .carte-offre.visee{
    border-color:var(--corail);outline-color:var(--corail);
    box-shadow:0 0 0 4px rgba(224,109,71,.28), 0 12px 30px rgba(33,108,114,.16);
    transform:translateY(-5px);
  }

  /* Les deux ateliers grand public, côte à côte, l'illustration en tête */
  .ateliers-duo{
    grid-column:1 / -1;
    display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;
  }
  #offre-atelier .illu-atelier,#offre-inconnus .illu-atelier{
    max-width:220px;margin:0 auto 1.4rem;
  }
  /* Les publics de l'atelier, une ligne chacun */
  .publics{list-style:none;margin:1rem 0 0;padding:0;}
  .publics li{
    position:relative;padding-left:1.1rem;margin-bottom:0.35rem;
    font-size:0.95rem;color:var(--brun-doux);
  }
  .publics li::before{
    content:"";position:absolute;left:0;top:0.62em;
    width:5px;height:5px;border-radius:50%;background:var(--corail);
  }
  @media(max-width:760px){
    .ateliers-duo{grid-template-columns:1fr;}
  }
  /* Le cadre entoure l'image : les filets se dessinent autour d'elle, jamais dessus */
  .illu-atelier{
    display:block;width:100%;border-radius:50%;
    border:1.3px solid var(--teal);
    outline:1px solid var(--teal);outline-offset:5px;
    margin-bottom:1.2rem;
  }
  .illu-atelier img{
    display:block;width:100%;aspect-ratio:1;object-fit:cover;
    border-radius:50%;
  }
  .carte-offre h3{font-size:1.5rem;font-weight:600;margin-bottom:0.5rem;}
  .carte-offre .promesse{font-style:italic;color:var(--terracotta);font-family:'Cormorant Garamond',serif;font-size:1.1rem;margin-bottom:0.7rem;}
  .carte-offre p{font-size:0.95rem;color:var(--brun-doux);}

  /* ---------- Déroulé & tarifs ---------- */
  #offre,#seances{background:transparent;}
  .etapes{display:flex;flex-direction:column;gap:1.7rem;margin:2rem 0 2.5rem;max-width:760px;}
  .etape{display:grid;grid-template-columns:34px 1fr;column-gap:1.1rem;row-gap:0.2rem;align-items:start;}
  .etape .num{grid-column:1;grid-row:1 / span 2;}
  .etape h3{grid-column:2;}
  .etape p{grid-column:2;}
  .etape .num{
    font-family:'Cormorant Garamond',serif;font-size:1.55rem;color:var(--terracotta);
    line-height:1.4;text-align:center;font-weight:600;
  }
  .etape h3{font-size:1.25rem;margin-bottom:0.3rem;}
  .etape p{font-size:0.93rem;color:var(--brun-doux);}
  .tarifs{
    background:var(--kraft);border-radius:4px;padding:1.8rem 2rem;
    display:flex;flex-wrap:wrap;gap:2.5rem;align-items:center;
  }
  .tarif .montant{font-family:'Cormorant Garamond',serif;font-size:2.4rem;color:var(--teal);font-weight:600;}
  .tarif .detail{font-size:0.9rem;color:var(--brun-doux);max-width:230px;}
  .tarifs .mention{flex:1;min-width:240px;font-size:0.9rem;font-style:italic;color:var(--brun-doux);}
  .grille-bloc{background:transparent;border-radius:4px;padding:1.8rem 2rem;margin-top:0.5rem;}
  .grille-bloc h3{font-size:1.35rem;margin-bottom:0.4rem;color:var(--corail);}
  .grille-bloc h3+.ligne{border-top:1px solid var(--kraft-fonce);}
  .ligne{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;padding:0.8rem 0;border-bottom:1px solid var(--kraft-fonce);}
  .ligne .nom{font-weight:700;flex:1;min-width:180px;}
  .ligne .duree{color:var(--brun-doux);font-size:0.9rem;white-space:nowrap;}
  .ligne .prix{font-family:'Lato',sans-serif;font-size:1.02rem;color:var(--brun);font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums;}
  .ligne .pour{flex-basis:100%;font-size:0.88rem;color:var(--brun-doux);margin-top:-0.3rem;}
  .modalites{font-size:0.92rem;color:var(--brun-doux);margin-top:1.4rem;max-width:820px;}
  .modalites em{display:block;margin-top:0.6rem;font-size:0.85rem;}


  /* Sur la page d'accueil, le filigrane s'efface derriere l'arbre */
  body:has(.arbre)::before{display:none;}

  /* ---------- Comparatif des offres ---------- */
  .page-comparatif{max-width:980px;margin:0 auto;}
  .page-comparatif .lead{max-width:720px;}
  table.comparatif{width:100%;border-collapse:collapse;margin-top:2.2rem;
                   font-size:0.95rem;}
  table.comparatif th,table.comparatif td{padding:0.62rem 0.5rem;
                   border-bottom:1px solid var(--kraft-fonce);}
  table.comparatif thead td{border-bottom:none;}
  table.comparatif thead th{
    font-family:'Lato',sans-serif;font-size:0.78rem;font-weight:700;
    letter-spacing:0.08em;text-transform:uppercase;text-align:center;
    vertical-align:bottom;border-bottom:1.3px solid var(--teal);
  }
  table.comparatif thead th a{color:var(--teal);text-decoration:none;
    border-bottom:1.3px solid var(--corail);padding-bottom:2px;transition:color .2s;}
  table.comparatif thead th a:hover{color:var(--terracotta);}
  table.comparatif tbody th{text-align:left;font-weight:700;color:var(--brun);
    font-size:0.92rem;width:34%;}
  table.comparatif td{text-align:center;}
  table.comparatif tbody tr:hover{background:rgba(33,108,114,0.04);}
  .comparatif .oui{color:var(--corail);font-size:1.15rem;font-weight:700;}
  .comparatif .non{color:var(--kraft-fonce);}
  .comparatif .val{color:var(--brun-doux);font-size:0.9rem;}
  .vers-comparatif{margin:2.8rem 0 2.4rem;}
  .vers-comparatif a{
    font-family:'Lato',sans-serif;font-size:0.8rem;font-weight:700;
    letter-spacing:0.09em;text-transform:uppercase;white-space:nowrap;
    color:var(--terracotta);text-decoration:none;
    border:1.3px solid var(--terracotta);border-radius:2px;
    padding:0.42rem 1rem;display:inline-block;transition:background .2s,color .2s;
  }
  .vers-comparatif a:hover{background:var(--terracotta);color:var(--creme);}
  /* appel fort vers le comparatif, juste sous les tarifs d'une page d'offre */
  .page-offre .comparer-fort{
    display:block;margin:1.9rem 0 1.5rem;
    background:var(--terracotta);color:var(--creme);
    text-align:center;text-decoration:none;
    font-family:'Lato',sans-serif;font-weight:700;
    font-size:0.86rem;letter-spacing:0.15em;text-transform:uppercase;
    padding:1rem 1.2rem;border-radius:2px;
    transition:background .2s,transform .2s;
  }
  .page-offre .comparer-fort:hover,.page-offre .comparer-fort:focus{
    background:#c75a36;
  }
  table.comparatif tfoot td{border-bottom:none;padding-top:1.1rem;}
  .resa{
    font-family:'Lato',sans-serif;font-size:0.74rem;font-weight:700;
    letter-spacing:0.09em;text-transform:uppercase;white-space:nowrap;
    color:var(--terracotta);text-decoration:none;
    border:1.3px solid var(--terracotta);border-radius:2px;
    padding:0.34rem 0.8rem;display:inline-block;
    transition:background .2s,color .2s;
  }
  .resa:hover{background:var(--terracotta);color:var(--creme);}
  .resa-carte{margin:1.1rem 0 0;}
  .note-prepa{font-size:0.88rem;color:var(--brun-doux);max-width:720px;
              margin:1.4rem 0 0;font-style:italic;}
  .pts{display:inline-flex;gap:4px;align-items:center;}
  .pts i{width:8px;height:8px;border-radius:50%;display:block;}
  .pts i.on{background:var(--corail);}
  .pts i.off{background:transparent;box-shadow:inset 0 0 0 1.2px rgba(224,109,71,0.38);}
  .comparatif-cartes{display:none;}
  @media(max-width:760px){
    table.comparatif{display:none;}
    .comparatif-cartes{display:block;margin-top:2rem;}
    .comp-carte{border:1.3px solid var(--teal);outline:1px solid var(--teal);
                outline-offset:3px;padding:1.4rem 1.2rem;margin-bottom:2rem;
                background:var(--creme);}
    .comp-carte h3{font-size:1.3rem;margin-bottom:0.8rem;}
    .comp-carte h3 a{color:var(--teal);text-decoration:none;
      border-bottom:1.3px solid var(--corail);padding-bottom:2px;}
    .comp-carte dl{display:grid;grid-template-columns:1fr auto;gap:0.35rem 1rem;
                   margin:0;font-size:0.92rem;}
    .comp-carte dt{color:var(--brun);font-weight:700;}
    .comp-carte dd{margin:0;text-align:right;}
  }

  /* ---------- L'arbre des offres ---------- */
  .arbre .nom{font-family:'Lato',sans-serif;font-size:23.5px;font-weight:700;
       text-transform:uppercase;letter-spacing:0.07em;
       fill:var(--corail);text-anchor:middle;}
  .arbre .nom.g{text-anchor:end;}
  .arbre .nom.d{text-anchor:start;}
  .arbre .halo{fill:none;stroke:var(--corail);stroke-width:1.4;
       transform-origin:center;transform-box:fill-box;opacity:0;
       animation:souffle 3.6s ease-out infinite;}
  @keyframes souffle{
    0%{opacity:0.55;transform:scale(1);}
    65%{opacity:0;transform:scale(2.4);}
    100%{opacity:0;transform:scale(2.4);}
  }
  .arbre .porte:hover .halo{animation:none;opacity:0.9;transform:scale(1.7);}
  .arbre .porte{cursor:pointer;}
  .arbre .porte .nom{transition:fill .2s;}
  .arbre .porte:hover .nom{fill:var(--teal);}
  .arbre .porte .pt{transition:r .2s;}
  .arbre .porte:hover .pt{r:13;}
  .arbre .ici{font-size:26.67px;font-style:italic;fill:var(--creme);
       text-anchor:middle;transition:fill .2s;}
  .arbre .coeur{cursor:pointer;}
  .arbre .coeur:hover .ici{fill:var(--corail);}
  .liste{display:none;}
  @media(max-width:760px){
    .arbre{display:none;}
    .liste{display:block;max-width:420px;margin:0 auto;}
    .liste h2{color:var(--teal);margin:1.6rem 0 0.6rem;
              letter-spacing:0.14em;text-transform:uppercase;font-size:0.78rem;}
    .liste a{display:block;padding:0.7rem 0;color:var(--corail);font-weight:700;
             text-decoration:none;font-size:1.05rem;
             border-bottom:1px solid rgba(33,108,114,0.18);}
    .liste a span{display:block;font-weight:400;font-size:0.84rem;
                  color:var(--brun-doux);margin-top:0.15rem;}
  }

  /* ---------- Carnets ---------- */
  #carnets{background:transparent;}
  .carnet-grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.4rem;margin-top:2rem;}
  .carnet{
    background:var(--creme);padding:1.6rem;border-radius:4px;
    border-left:3px solid var(--terracotta);
  }
  .carnet .theme{font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--corail);font-weight:700;}
  .carnet h3{font-size:1.35rem;margin:0.5rem 0;}
  .carnet p{font-size:0.92rem;color:var(--brun-doux);}

  /* ---------- Contact ---------- */
  #bloc-contact{background:var(--teal);color:var(--creme);text-align:center;}
  #bloc-contact h2{color:var(--creme);}
  #bloc-contact p{max-width:560px;margin:0 auto 1.8rem;color:rgba(247,241,230,0.85);}
  .btn{
    display:inline-block;background:var(--terracotta);color:var(--creme);
    text-decoration:none;padding:0.9rem 2.2rem;border-radius:2px;
    letter-spacing:0.1em;text-transform:uppercase;font-size:0.85rem;font-weight:700;
    transition:background .2s;
  }
  .btn:hover{background:var(--terracotta-clair);}

  footer{
    background:var(--teal-fonce);color:rgba(255,252,225,0.8);
    padding:2.2rem 1.5rem;font-size:0.82rem;text-align:center;line-height:1.8;
  }
  footer .methode{font-style:italic;}
  @media(max-width:820px){ #cadeau .inner{grid-template-columns:1fr !important;} }

  /* Charte : cadres en double filet turquoise, fond toujours crème */
  .encart,.grille-bloc,.carte-offre,.carnet{
    background:var(--creme);
    border:1.3px solid var(--teal);
    outline:1px solid var(--teal);
    outline-offset:3px;
    border-radius:0;
  }
  .carte-offre{border-top:1.3px solid var(--teal);}
  .carnet{border-left:1.3px solid var(--teal);}
  .carte-offre:hover{box-shadow:0 10px 24px rgba(33,108,114,0.14);}
  .modalites{color:var(--brun-doux);}
  .temoins{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;margin-top:2rem;}
  @media(max-width:820px){.temoins{grid-template-columns:1fr;}}
  .temoin{background:transparent;border:1.3px solid var(--teal);outline:1px solid var(--teal);outline-offset:3px;padding:1.6rem 1.5rem;}
  .temoin blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.12rem;line-height:1.5;margin:0 0 0.9rem;}
  .temoin .qui{font-size:0.8rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--corail);font-weight:700;}
  .temoin-final{grid-column:1 / -1;}
  /* Séparateur charte : ligne – point corail – ligne */
  .sep{display:flex;align-items:center;gap:12px;width:180px;margin:1.2rem auto 0;}
  .sep::before,.sep::after{content:"";flex:1;height:1px;background:var(--teal);}
  .sep i{width:7px;height:7px;border-radius:50%;background:var(--corail);}
  /* Bouton Réserver sur chaque ligne de la grille */
  .ligne .reserver{
    font-family:'Lato',sans-serif;font-size:0.78rem;font-weight:700;
    letter-spacing:0.09em;text-transform:uppercase;white-space:nowrap;
    color:var(--terracotta);text-decoration:none;
    border:1.3px solid var(--terracotta);border-radius:2px;
    padding:0.34rem 0.85rem;transition:background .2s,color .2s;
  }
  .ligne .reserver:hover,.ligne .reserver:focus{
    background:var(--terracotta);color:var(--creme);
  }
  @media(max-width:560px){
    .ligne .reserver{order:3;margin-top:0.5rem;}
  }

  /* Coordonnées en clair sous le bouton du bon cadeau */
  .coordonnees{
    margin-top:1rem;font-size:0.92rem;color:var(--brun-doux);
  }
  .coordonnees a{
    color:var(--teal);text-decoration:none;font-weight:700;white-space:nowrap;
    border-bottom:1.3px solid var(--corail);padding-bottom:1px;transition:color .2s;
  }
  .coordonnees a:hover{color:var(--terracotta);}
  .coordonnees .point{color:var(--kraft-fonce);margin:0 0.45rem;}

  /* Ligne d'appel sous « La marche à suivre » */
  .appel{
    font-size:0.95rem;color:var(--brun-doux);margin:0.2rem 0 2rem;
  }
  .appel a{
    color:var(--teal);text-decoration:none;font-weight:700;white-space:nowrap;
    border-bottom:1.3px solid var(--corail);padding-bottom:1px;transition:color .2s;
  }
  .appel a:hover{color:var(--terracotta);}

  /* Pied de page : petit phi entre deux filets */
  .footer-phi{display:flex;align-items:center;gap:16px;max-width:280px;margin:0 auto 1.2rem;}
  .footer-phi::before,.footer-phi::after{content:"";flex:1;height:1px;background:rgba(255,252,225,0.5);}
  .footer-legal{margin-top:1.4rem;font-size:0.78rem;}
  .footer-legal a{
    color:rgba(255,252,225,0.75);text-decoration:none;
    border-bottom:1px solid rgba(224,109,71,0.7);padding-bottom:1px;transition:color .2s;
  }
  .footer-legal a:hover{color:var(--terracotta-clair);}
  .footer-legal .point{color:rgba(255,252,225,0.45);margin:0 0.7rem;}

  /* ---------- Pages légales ---------- */
  .legal{max-width:760px;margin:0 auto;padding:3rem 1.5rem 4rem;}
  .legal h3{
    font-family:'Lato',sans-serif;font-size:0.78rem;letter-spacing:0.22em;
    text-transform:uppercase;color:var(--terracotta);font-weight:700;
    margin:2.4rem 0 0.6rem;
  }
  .legal h3:first-of-type{margin-top:1.6rem;}
  .legal p{margin-bottom:0.9rem;}
  .legal a{
    color:var(--teal);text-decoration:none;
    border-bottom:1px solid var(--corail);padding-bottom:1px;transition:color .2s;
  }
  .legal a:hover{color:var(--terracotta);}
  .legal .bloc-adresse{line-height:1.9;margin-bottom:0.9rem;}
  .legal .note{font-size:0.9rem;color:var(--brun-doux);font-style:italic;}
  .legal .retour{
    display:inline-block;margin-top:2.6rem;font-size:0.95rem;color:var(--teal);
    text-decoration:none;border-bottom:1.3px solid var(--corail);padding-bottom:2px;
  }
  /* menu déroulant sur mobile */
  @media(max-width:900px){
    /* Le bandeau passe à gauche : la marque au-dessus, le menu aligné dessous,
       les lignes se remplissant de gauche à droite plutôt qu'en escalier centré. */
    /* Sur mobile le bandeau ne colle plus en haut : à 227 px de haut il mangeait
       un tiers de l'écran en permanence. On le laisse défiler avec la page. */
    header{position:static;}
    .header-inner{flex-direction:column;align-items:stretch;gap:0.45rem;padding:0.6rem 1.2rem;}
    .brand{gap:0.6rem;}
    .brand svg{width:24px;height:34px;}
    .brand-name{font-size:1.28rem;}
    .brand-sub{font-size:0.6rem;letter-spacing:0.1em;}
    nav{
      display:flex;flex-wrap:wrap;justify-content:flex-start;
      gap:0.3rem 0.8rem;padding:0.45rem 0 0.05rem;
      border-top:1px solid rgba(255,252,225,0.18);
    }
    nav a{margin-left:0;font-size:0.66rem;letter-spacing:0.04em;}
  }

  /* Sur téléphone, le motif garde exactement la taille des grands écrans : seule
     la fenêtre se déplace, pour tomber sur la constellation et non sur le vide. */
  @media(max-width:760px){
    body::before{
      background-position:-47vh -18vh;
    }
  }


  /* Ajouts du découpage en pages */
  .voisines a{color:var(--teal);text-decoration:none;border-bottom:1.3px solid var(--corail);padding-bottom:2px;}
  .voisines a:hover{color:var(--terracotta);}
  .voisines .point{color:var(--kraft-fonce);margin:0 0.5rem;}
  .carte svg a{cursor:pointer;}
  .carte svg a:focus{outline:none;}
  .carte svg a:focus .pt{stroke:var(--corail);stroke-width:3;}
  .carte-offre h3 a.vers-offre{color:inherit;text-decoration:none;border-bottom:1.3px solid var(--corail);padding-bottom:2px;transition:color .2s;}
  .carte-offre h3 a.vers-offre:hover{color:var(--terracotta);}
  .carte-offre .vers{margin-top:1.1rem;}
  .carte-offre .vers a{font-size:0.9rem;color:var(--teal);text-decoration:none;
                       border-bottom:1.3px solid var(--corail);padding-bottom:2px;
                       transition:color .2s;}
  .carte-offre:hover .vers a{color:var(--terracotta);}

  /* Lien vers la page de l offre, dans la grille tarifaire */
  .ligne .savoir-plus{
    font-size:0.88rem;color:var(--teal);text-decoration:none;
    border-bottom:1.3px solid var(--corail);padding-bottom:2px;
    margin-top:0.55rem;white-space:nowrap;transition:color .2s;
  }
  .ligne .savoir-plus:hover,.ligne .savoir-plus:focus{color:var(--terracotta);}
  @media(max-width:620px){.ligne .savoir-plus{order:2;}}

  /* Bouton Offrir : bon cadeau Stripe, a cote de Reserver */
  .ligne .offrir{
    font-family:'Lato',sans-serif;font-size:0.78rem;font-weight:700;
    letter-spacing:0.09em;text-transform:uppercase;white-space:nowrap;
    color:var(--teal);text-decoration:none;
    border:1.3px solid var(--teal);border-radius:2px;
    padding:0.34rem 0.85rem;margin-right:auto;transition:background .2s,color .2s;
  }
  .ligne .offrir:hover,.ligne .offrir:focus{background:var(--teal);color:var(--creme);}
  @media(max-width:560px){.ligne .offrir{order:4;margin-top:0.5rem;}}

  /* Pages d offre : une seule colonne, tout a la suite, aucun cadre */
  .page-offre{max-width:720px;margin:0 auto;}
  .page-offre .sur-titre{font-size:0.92rem;letter-spacing:0.2em;}
  /* Titre du bloc demarche : pleine largeur au-dessus des deux colonnes,
     pour que le texte de gauche et l encart de droite demarrent sur la meme ligne. */
  #bloc-demarche .titre-bloc{max-width:620px;margin-bottom:1.6rem;}
  /* Rattrapage optique des capitales rondes en tete de titre */
  h1.ronde,h2.ronde{margin-left:-0.035em;}
  /* Les deux paragraphes de la colonne de gauche a la meme taille :
     le premier heritait de .lead, plus gros, et ca se voyait. */
  #bloc-demarche .deux-col p{font-size:1.02rem;line-height:1.72;}
  .page-offre .fil,.page-comparatif .fil{font-size:0.8rem;letter-spacing:0.08em;text-transform:uppercase;
                   margin-bottom:1.3rem;}
  .page-offre .fil a,.page-comparatif .fil a{color:var(--kraft-fonce);text-decoration:none;
                     border-bottom:1.3px solid var(--kraft-fonce);padding-bottom:3px;
                     transition:color .2s, border-color .2s;}
  .page-offre .fil a:hover,.page-offre .fil a:focus{color:var(--terracotta);
                     border-color:var(--corail);}
  .page-offre h1{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:500;line-height:1.2;
                 margin:0.3rem 0 1.1rem;}
  .page-offre h2{font-size:1.35rem;font-weight:600;color:var(--corail);
                 margin:2.3rem 0 0.7rem;}
  .page-offre p{font-size:1.02rem;line-height:1.72;}
  .page-offre p.lead{font-size:1.12rem;color:var(--brun);font-weight:700;}
  .page-offre p + p{margin-top:0.85rem;}
  .page-offre .ligne{padding:0.9rem 0;}
  .page-offre .paiement{margin-top:0.9rem;font-size:0.95rem;
    color:var(--brun-doux);}
  .page-offre .appel{margin-top:1.6rem;font-size:0.95rem;color:var(--brun-doux);}

  /* Portrait dans la page La demarche : habille par le texte sur grand ecran,
     centre au-dessus du texte sur telephone. */
  .portrait-demarche{
    float:left; width:160px; aspect-ratio:1; object-fit:cover;
    margin:0.3rem 1.4rem 0.4rem 0; border-radius:50%;
    border:1.3px solid var(--teal); outline:1px solid var(--teal); outline-offset:5px;
  }
  @media(max-width:820px){
    .portrait-demarche{float:none; display:block; width:190px; margin:0 auto 1.6rem;}
  }
