/* =====================================================================
   Les Cabanes de Marie — feuille de style commune, v2 « la porte vers la forêt »
   Utilisée par TOUTES les pages. Les sections de l'accueil sont dans assets/home.css.

   Principes : le site est la porte vers la forêt, pas la forêt. Calme, lenteur, beaucoup de vide.
   - Base claire : blanc cassé chaud et assumé. Base sombre : brun très foncé (jamais de noir pur).
   - Accent principal : la terre (bois, feu, accueil). Accent signal : un vert sauge, en touches minuscules
     (puces, flèches, état actif) pour guider l'œil. Deux teintes de sauge : une pour fond clair, une pour fond sombre,
     toutes deux calculées pour rester visibles (contraste >= 3:1).
   - ANGLES DROITS PARTOUT, sans exception (seul l'avatar rond d'Edith reste rond).
   - Aucune boîte, aucune carte, aucune ombre : les sections SONT le fond, l'info va bord à bord.
   - Contenu calé à GAUCHE (marge normale), grand vide à DROITE (--void) ; menu en haut, identique partout.
     Les photos « plein cadre » (.ff) restent pleine largeur ; les autres suivent la colonne de gauche.
   - Police unique : Cabinet Grotesk (titres très gras, texte medium) + police de secours calée dessus.
   ===================================================================== */
:root{
  --paper:#EFE8D8; --paper-2:#E6DDCA;
  --ink:#241C15; --ink-soft:#5A4D40;
  --dark:#1C1511; --dark-2:#261D17;
  --earth:#7C5238; --earth-deep:#5E3C28;
  --sage:#65795F; --sage-lt:#A8BCA0;
  --line:rgba(36,28,21,.26); --line-lt:rgba(239,232,216,.3);
  --font:'Cabinet Grotesk','Cabinet Grotesk Fallback','Hanken Grotesk',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --hb:72px;                           /* hauteur de la barre (logo, menu) */
  --bh:0px;                            /* hauteur du bandeau d'information (0 sans bandeau) */
  --hh:calc(var(--hb) + var(--bh));    /* barre du haut complete : bandeau + barre */
  --gut:clamp(20px,4.2vw,72px);
  --hl:min(35vw,620px);                /* colonne de gauche de l'en-tête (le menu ne bouge pas) */
  --pl:var(--gut);                     /* marge gauche du contenu */
  /* le contenu vit dans un conteneur calé à gauche, large d'au plus --wrap (1160 px, ou 65 % de l'écran sur très grand écran) :
     le reste de l'écran est le vide, à droite, et ne dépasse jamais ~35 %. Aucun bloc ne reçoit de « marge-vide » à lui. */
  --wrap:max(1160px,calc(65vw - var(--pl)));
  --pr:max(var(--gut),calc(100vw - var(--pl) - var(--wrap)));   /* ce qui reste à droite du conteneur (une gouttière sur téléphone) */
  --ease:cubic-bezier(.22,.61,.36,1);
  --slow:1.5s;
}
@media(max-width:960px){:root{--pr:var(--gut);--hb:64px}}
/* bandeau d'information (fermeture) : il fait partie de la barre du haut ; une ligne sur ordinateur, deux au plus sur telephone */
:root:has(.closing){--bh:32px}
@media(max-width:960px){:root:has(.closing){--bh:40px}}

/* ---------------------------------------------------------------- base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border-radius:0}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + 16px);-webkit-text-size-adjust:100%}
body{font:500 clamp(1.0625rem,.3vw + 1rem,1.1875rem)/1.62 var(--font);color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video,iframe{max-width:100%}
img{display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
::selection{background:var(--earth);color:var(--paper)}
:focus-visible{outline:3px solid var(--earth);outline-offset:3px}
.dark :focus-visible,.deep :focus-visible,.warm :focus-visible{outline-color:var(--paper)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--ink);color:var(--paper);padding:14px 20px;font-weight:700}
.skip:focus{left:0}
h1,h2,h3,h4{font-family:var(--font);font-weight:800;letter-spacing:-.026em;line-height:.96;text-wrap:balance}
h1 b,h2 b,h3 b{font-weight:800;color:var(--earth)}
.dark h1 b,.dark h2 b,.dark h3 b,.deep h1 b,.deep h2 b,.deep h3 b,.warm h1 b,.warm h2 b,.warm h3 b{color:var(--paper)}
p{text-wrap:pretty}
b,strong{font-weight:800}

/* étiquette : petite capitale + puce sauge (le « signal ») */
.lbl{font-weight:700;font-size:.8rem;letter-spacing:.17em;text-transform:uppercase;display:flex;align-items:center;gap:.9em}
.lbl::before{content:"";flex:0 0 .55em;width:.55em;height:.55em;background:var(--sage)}
.dark .lbl::before,.deep .lbl::before,.warm .lbl::before{background:var(--sage-lt)}

/* mise en page : le contenu part de la gauche avec une marge normale ; le grand vide reste à droite */
.rc{padding-left:var(--pl);padding-right:var(--pr)}
.pad{padding-block:clamp(88px,15vh,200px)}
.dark{background:var(--dark);color:var(--paper)}
.deep{background:var(--earth-deep);color:var(--paper)}
.warm{background:var(--earth);color:var(--paper)}

/* ---------------------------------------------------------------- boutons et liens */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.8em;min-height:56px;padding:14px 30px;background:var(--earth);color:var(--paper);border:4px solid var(--earth);border-image:var(--wood) 8 / 4px round;font-weight:700;font-size:.86rem;line-height:1.1;letter-spacing:.14em;text-transform:uppercase;text-align:center;transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease)}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn.o{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.o:hover{background:var(--ink);color:var(--paper)}
.btn.inv{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn.inv:hover{background:transparent;color:var(--paper)}
.btn.line-inv{background:transparent;color:var(--paper);border-color:var(--paper)}
.btn.line-inv:hover{background:var(--paper);color:var(--ink)}
.btn.sm{min-height:46px;padding:9px 20px}
.btn small{display:block;margin-top:5px;font-weight:500;font-size:.8rem;letter-spacing:.02em;text-transform:none}
.cta{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.go{display:inline-flex;align-items:center;min-height:44px;gap:.7em;font-weight:800;border-bottom:2px solid currentColor;padding-bottom:.18em;transition:gap .5s var(--ease),color .4s}
.go:hover{gap:1.1em;color:var(--earth)}
.dark .go:hover,.deep .go:hover,.warm .go:hover{color:var(--sage-lt)}
.ar{width:1.15em;height:1.15em;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:square}
.ar.sage{color:var(--sage)}
.dark .ar.sage,.deep .ar.sage,.warm .ar.sage{color:var(--sage-lt)}

/* ---------------------------------------------------------------- en-tête (identique sur toutes les pages, inchangé) */
/* la barre recouvre le haut de la page (marge négative) : quand elle se replie en « logo seul », il n'y a plus de bandeau, la première section monte jusqu'en haut */
.site-header{position:sticky;top:0;z-index:70;height:var(--hh);margin-bottom:calc(var(--hh) * -1);display:grid;grid-template-columns:calc(var(--hl) - var(--gut)) minmax(0,1fr) auto;align-items:center;padding-inline:var(--gut);padding-top:var(--bh);background:var(--paper);border-bottom:1px solid var(--line)}
.closing{position:absolute;top:0;left:0;right:0;height:var(--bh);display:flex;align-items:center;justify-content:center;padding:0 var(--gut);background:var(--earth-deep);color:var(--paper);font-weight:600;font-size:.8125rem;line-height:1.25;letter-spacing:.01em;text-align:center;text-wrap:balance;pointer-events:auto}
@media(max-width:960px){.closing{font-size:.78rem}}
/* pop-up de fermeture (hiver) : <dialog> ouvert en modal par site.js (couche du dessus : au-dessus de la barre,
   de la barre « Réserver », d'Edith et du volet Planyo) ; carte centrée, 16 px d'air autour sur téléphone */
.wpop{margin:auto;padding:0;border:0;background:transparent;color:var(--ink);width:min(460px,calc(100vw - 32px));max-width:none;max-height:calc(100svh - 32px);overflow:visible}
.wpop::backdrop{background:rgba(28,21,17,.62)}
.wpop-in{position:relative;max-height:calc(100svh - 32px);overflow-y:auto;background:var(--paper);border-top:6px solid var(--earth-deep);padding:clamp(28px,6vw,40px) clamp(22px,6vw,40px) clamp(24px,5vw,36px)}
.wpop-logo{width:34px;height:32px;margin-bottom:18px}
.wpop h2{font-size:clamp(1.9rem,6.4vw,2.5rem);margin:0 44px 14px 0}
.wpop p{color:var(--ink);font-size:1.0625rem;line-height:1.55;margin-bottom:26px}
.wpop-go{width:100%}
.wpop-x{position:absolute;top:8px;right:8px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:2rem;line-height:1;color:var(--ink)}
.wpop-x:hover{color:var(--earth)}
html.wpop-lock{overflow:hidden}
html.wpop-lock body{padding-right:var(--sbw,0px)}
@media(prefers-reduced-motion:no-preference){
  .wpop[open]{animation:wpop-in .45s var(--ease)}
  .wpop[open]::backdrop{animation:wpop-fade .45s var(--ease)}
}
@keyframes wpop-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes wpop-fade{from{opacity:0}to{opacity:1}}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:1.12rem;letter-spacing:-.02em;white-space:nowrap}
.brand img{height:34px;width:auto}
.nav{display:flex;gap:clamp(18px,2vw,34px)}
.nav a{font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;padding:10px 0;text-decoration:underline 2px transparent;text-underline-offset:.55em;transition:text-decoration-color .4s,color .4s;white-space:nowrap}
.nav a:hover,.nav a[aria-current="page"]{text-decoration-color:var(--sage)}
.hr{display:flex;align-items:center;gap:18px;justify-self:end}
.langsw{display:flex;gap:2px}
.lang-b{min-width:42px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem;letter-spacing:.14em;color:var(--ink-soft);text-decoration:underline 2px transparent;text-underline-offset:.55em}
.lang-b:hover{color:var(--ink)}
.lang-b[aria-current="true"]{color:var(--ink);text-decoration-color:var(--sage)}
.burger{display:none;width:48px;height:48px;flex-direction:column;align-items:flex-end;justify-content:center;gap:7px}
.burger span{display:block;height:2px;background:var(--ink)}
.burger span:nth-child(1){width:30px}.burger span:nth-child(2){width:20px}.burger span:nth-child(3){width:26px}
.burger:hover span{width:30px}
.burger span{transition:width .4s var(--ease)}
/* priorité du menu : plus l'écran est étroit, moins de liens (le tiroir les contient tous) */
@media(max-width:1999px){.nav .n3{display:none}.burger{display:flex}}
@media(max-width:1519px){.nav .n2{display:none}}
@media(max-width:1359px){.nav .n1b{display:none}}
/* téléphone et tactile : logo + burger, toujours là ; langues et « Réserver » sont dans le menu */
@media(max-width:960px),(hover:none) and (pointer:coarse){
  .site-header{display:flex;justify-content:space-between}
  .nav,.hr .btn,.hr .langsw{display:none}
  .burger{display:flex}
  .brand{font-size:1.05rem}
  .brand img{height:30px}
}

/* barre du haut sur ordinateur : repliée en « logo seul » (hors accueil, et sur l'accueil après l'entrée).
   Elle revient en remontant, quand la souris approche du haut, ou au clavier (site.js pose / retire .bar-min).
   Plus de bandeau : seul le logo reste, sur un petit fond couleur papier (opaque, angles droits) pour que rien de ce qui défile
   dessous (le prix du bandeau, une photo) ne se mêle au logo. */
.site-header{transition:background-color .25s ease,border-color .25s ease,opacity .25s ease}
.site-header .nav,.site-header .hr{transition:opacity .25s ease}
.site-header .brand{justify-self:start;min-height:44px;transition:color .25s ease,text-shadow .25s ease}
@media(min-width:961px) and (hover:hover) and (pointer:fine){
  html.js body.bar-min .site-header{background:transparent;border-bottom-color:transparent;pointer-events:none}
  html.js body.bar-min .site-header .brand{pointer-events:auto;margin:-10px;padding:10px;background:var(--paper)}
  html.js body.bar-min .site-header .nav,html.js body.bar-min .site-header .hr{opacity:0}
}
/* pendant la rupture, plus rien en haut (silence), pas même le logo ; revient au clavier */
body.bar-off .site-header{opacity:0;pointer-events:none}

/* tiroir de navigation : pleine hauteur, bord à bord, s'ouvre depuis la droite */
.scrim{position:fixed;inset:0;z-index:110;background:rgba(28,21,17,.5);opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s .5s}
.scrim.open{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:120;width:min(100%,440px);background:var(--paper);border-left:1px solid var(--line);display:flex;flex-direction:column;overflow-y:auto;padding:0 32px 36px;transform:translateX(100%);visibility:hidden;transition:transform .6s var(--ease),visibility 0s .6s}
.drawer.open{transform:none;visibility:visible;transition:transform .6s var(--ease)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;height:var(--hb);margin:0 -32px 10px;padding:0 32px;border-bottom:1px solid var(--line);flex:0 0 auto}
.drawer-close{width:48px;height:48px;font-size:2rem;font-weight:500;line-height:1;display:grid;place-items:center;margin-right:-10px}
.drawer a.dl{display:block;padding:14px 0;border-bottom:1px solid var(--line);font-weight:800;font-size:clamp(1.5rem,5vw,1.9rem);letter-spacing:-.025em;line-height:1.1;transition:padding-left .5s var(--ease),color .4s}
.drawer a.dl:hover,.drawer a.dl[aria-current="page"]{padding-left:12px;color:var(--earth)}
.drawer .langsw{margin:24px 0 18px}
.drawer .btn{margin-top:8px;width:100%}
body.menu-open{overflow:hidden}

/* barre « Réserver » fixe (téléphone) */
.bookbar{display:none}
@media(max-width:960px){
  .bookbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;min-height:58px;align-items:center;justify-content:center;background:var(--earth);color:var(--paper);font-weight:700;font-size:.86rem;letter-spacing:.16em;text-transform:uppercase;padding:0 20px env(safe-area-inset-bottom,0px);transition:opacity .9s var(--ease),visibility 0s,background .4s}
  .bookbar:hover{background:var(--ink)}
  .site-footer{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 96px)}
}

/* la rupture est un silence : tant qu'elle est à l'écran (classe posée par home.js), rien ne flotte dessus */
body.hush .bookbar,body.hush .cc-fab{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .9s var(--ease),visibility 0s .9s}

/* ---------------------------------------------------------------- pied de page */
.site-footer{background:var(--paper-2);border-top:1px solid var(--line);padding-block:clamp(72px,11vw,140px) 36px}
.ft-grid{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:40px;margin:0 var(--pr) 0 var(--pl);padding-bottom:56px;border-bottom:1px solid var(--line)}
.ft-brand img{height:46px;width:auto;margin-bottom:18px}
.ft-brand h2{font-size:1.75rem;margin-bottom:12px}
.ft-brand p{max-width:36ch;font-size:.98rem;color:var(--ink-soft)}
.ft-col h3{font-weight:700;font-size:.8rem;letter-spacing:.17em;text-transform:uppercase;margin-bottom:18px}
.ft-col a{display:inline-block;padding:6px 0;font-size:1rem;text-decoration:underline 2px transparent;text-underline-offset:.35em;transition:text-decoration-color .4s}
.ft-col a:hover{text-decoration-color:var(--sage)}
.socials{display:flex;gap:10px;margin-top:22px}
.socials a{width:46px;height:46px;border:1.5px solid var(--ink);display:grid;place-items:center;transition:background .4s var(--ease),color .4s var(--ease)}
.socials a:hover{background:var(--ink);color:var(--paper)}
.socials svg{width:20px;height:20px;fill:currentColor}
.ft-bot,.ft-info{margin-left:var(--pl);margin-right:var(--pr)}
.ft-bot{padding-top:26px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 30px;font-size:.92rem;color:var(--ink-soft)}
.ft-info{margin-top:24px;font-size:.98rem;line-height:1.8}
.ft-info a{text-decoration:underline 1.5px var(--line);text-underline-offset:.3em}
.ft-info a:hover{text-decoration-color:var(--sage)}
@media(max-width:960px){
  .ft-grid{grid-template-columns:1fr 1fr}
  .ft-brand{grid-column:1/-1}
}
@media(max-width:520px){.ft-grid{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- apparition lente au défilement
   (sans JavaScript : tout est visible ; avec « mouvement réduit » : tout est visible tout de suite) */
.js .reveal{opacity:0;transform:translateY(34px);transition:opacity var(--slow) var(--ease),transform var(--slow) var(--ease)}
.js .reveal.seen{opacity:1;transform:none}
/* ancre vers un bloc pas encore apparu (decale de 34 px) : il arrive quand meme sous la barre, pas dessous */
.reveal[id]:not(.seen){scroll-margin-top:34px}
.js .reveal.late{transition-delay:.25s}
.js .reveal.later{transition-delay:.5s}
.d1{transition-delay:.12s}.d2{transition-delay:.24s}.d3{transition-delay:.36s}
/* une photo se révèle en se posant très lentement */
.js .unveil{opacity:0;transition:opacity 2s var(--ease)}
.js .unveil img{transform:scale(1.07);transition:transform 3.2s var(--ease)}
.js .unveil.seen{opacity:1}
.js .unveil.seen img{transform:scale(1)}

/* ---------------------------------------------------------------- formulaires (sans boîtes : un simple trait) */
label,.fl{display:block;font-weight:700;font-size:.78rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:4px;color:var(--ink-soft)}
input,select,textarea{width:100%;font:inherit;font-weight:500;color:var(--ink);background:transparent;border:0;border-bottom:2px solid var(--ink);padding:12px 0;min-height:52px;border-radius:0;transition:border-color .4s}
textarea{min-height:140px;resize:vertical;border:2px solid var(--ink);padding:12px 14px}
input::placeholder,textarea::placeholder{color:var(--ink-soft);opacity:.75}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--earth)}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--earth);outline-offset:2px}
/* case à cocher carrée dessinée à la main (celle du navigateur a les coins un peu arrondis) */
input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:0 0 22px;position:relative;width:22px;height:22px;min-height:0;padding:0;border:2px solid var(--ink);border-radius:0;background:transparent;cursor:pointer;transition:border-color .3s}
input[type=checkbox]:checked{border-color:var(--earth)}
input[type=checkbox]:checked::after{content:"";position:absolute;inset:3px;background:var(--earth)}
fieldset{border:0;min-width:0}
legend{padding:0}
.field{margin-bottom:22px}
.req{font-weight:800}
.hint{font-size:.9rem;color:var(--ink-soft);margin:-4px 0 14px}
.msg-err{display:none;border-left:4px solid var(--earth);padding:6px 0 6px 16px;margin:0 0 18px;font-weight:700}
.msg-err.show{display:block}
/* erreur propre a un champ (formulaire d'alerte : telephone) */
.field-err{margin:8px 0 0;border-left:4px solid var(--earth);padding:2px 0 2px 12px;font-weight:700;font-size:.92rem;line-height:1.4;color:var(--earth-deep)}
.field-err[hidden]{display:none}
/* rappel de fermeture sous « Disponibilites » (accueil) */
.closing-note{margin:-8px 0 26px;font-weight:700;color:var(--earth-deep);max-width:60ch}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ---------------------------------------------------------------- pages intérieures */
.page-head{position:relative;overflow:hidden;border-bottom:1px solid var(--line);padding-block:calc(var(--hh) + clamp(72px,13vh,170px)) clamp(56px,9vh,110px)}
.page-head .in{position:relative;z-index:1;margin:0 var(--pr) 0 var(--pl)}
.page-head h1{font-size:clamp(2.8rem,8vw,8rem);margin:22px 0 24px;line-height:.9}
.page-head p{max-width:50ch;color:var(--ink-soft)}
.page-body{margin:0 var(--pr) 0 var(--pl);padding-block:clamp(56px,9vh,110px) clamp(80px,12vh,150px)}
.box{padding:0}
.note-box{border-top:1px solid var(--line);padding:36px 0 0;margin:56px 0 0}
.note-box h2,.note-box h3{font-size:1.7rem;margin-bottom:12px}
.note-box p{margin-bottom:10px;max-width:60ch}
.note-box a,.page-body p a{text-decoration:underline 1.5px var(--earth);text-underline-offset:.25em}
.after-cta{margin-top:44px}
.cta-box{border-top:1px solid var(--line);padding:44px 0 0;margin-top:64px}
.cta-box h2,.cta-box h3{font-size:clamp(1.9rem,3.4vw,2.8rem);margin-bottom:14px}
.cta-box p{max-width:52ch;margin:0 0 24px}
.cta-box p a{text-decoration:underline 1.5px var(--earth);text-underline-offset:.25em;font-weight:800}

/* FAQ : de simples lignes */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;position:relative;padding:26px 56px 26px 0;font-weight:800;font-size:clamp(1.2rem,2.2vw,1.55rem);letter-spacing:-.02em;line-height:1.2;min-height:68px;transition:color .4s}
.faq summary:hover{color:var(--earth)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:14px;height:14px;margin-top:-9px;border-right:3px solid var(--sage);border-bottom:3px solid var(--sage);transform:rotate(45deg);transition:transform .5s var(--ease)}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-3px}
.faq .a{padding:0 0 32px;max-width:64ch;color:var(--ink-soft)}

/* pages juridiques */
.cg section,.prose section{padding:36px 0;border-bottom:1px solid var(--line)}
.cg section:first-child,.prose section:first-child{padding-top:0}
.cg section:last-child,.prose section:last-child{border-bottom:0}
.cg h2,.prose h2{font-size:clamp(1.6rem,2.8vw,2.2rem);margin-bottom:.6em;line-height:1.05}
.cg h3,.prose h3{font-weight:800;font-size:1.1rem;letter-spacing:-.01em;margin:1.4em 0 .3em;color:var(--earth)}
.cg p,.prose p{margin-bottom:.8em;max-width:66ch}
.cg ul,.prose ul{margin:.6em 0}
.cg li,.prose li{position:relative;padding:6px 0 6px 24px;max-width:66ch}
.cg li::before,.prose li::before{content:"";position:absolute;left:0;top:1.05em;width:8px;height:8px;background:var(--sage)}
.cg a,.prose a{text-decoration:underline 1.5px var(--earth);text-underline-offset:.25em}
.cg-note{font-size:.92rem;color:var(--ink-soft);margin-top:30px}

/* contact : deux colonnes ouvertes, sans cadre */
.cgrid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,96px);margin-bottom:40px}
.coord h2{font-size:clamp(1.9rem,3.2vw,2.6rem);margin-bottom:28px}
.coord .row{display:flex;gap:18px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--line)}
.coord .row:last-of-type{border-bottom:1px solid var(--line)}
.coord .ic{flex:0 0 28px;width:28px;height:28px;margin-top:3px}
.coord .ic svg{width:28px;height:28px;fill:none;stroke:var(--earth);stroke-width:1.8;stroke-linecap:square;stroke-linejoin:miter}
.coord .k{font-weight:700;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.coord a{text-decoration:underline 1.5px var(--earth);text-underline-offset:.25em;font-weight:700}
.map{margin-top:28px;background:var(--paper-2);min-height:230px;position:relative}
.map iframe{display:block;width:100%;height:260px;border:0}
.map-load{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px;color:var(--ink-soft);font-size:.98rem}
.form-card legend{font-weight:800;font-size:clamp(1.9rem,3.2vw,2.6rem);letter-spacing:-.03em;line-height:1;margin-bottom:26px}
.done{display:none;padding:30px 0}
.done h3{font-size:2.2rem;margin-bottom:10px}
@media(max-width:960px){.cgrid{grid-template-columns:1fr}}

/* bons cadeaux (formulaire 123FormBuilder) */
.fb-embed{margin-bottom:26px}
.fb-embed iframe{width:100%;border:0;background:transparent;min-height:1100px}

/* page 404 */
.nf{min-height:100svh;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;padding:calc(var(--hh) + 60px) var(--pr) 90px var(--pl)}
.nf .num{font-weight:800;font-size:clamp(7rem,26vw,20rem);line-height:.8;letter-spacing:-.06em;color:var(--earth);position:relative}
.nf h1{font-size:clamp(2.2rem,5.6vw,4.6rem);margin:.4em 0 .4em;position:relative}
.nf p{max-width:46ch;margin:0 0 34px;position:relative}
.nf .hand{color:var(--ink-soft);margin-bottom:12px}
.nf .cta{position:relative}

/* ---------------------------------------------------------------- une cabane : accueil ET pages cabane (même logique partout)
   Le rêve en grand (photo, nom, citation, description) · la bande pratique (prix, capacité, voir les dates), la même sur
   toutes les cabanes · la suite en photos. Les photos « plein cadre » (.ff) prennent toute la largeur de l'écran, les autres
   suivent la colonne de gauche. */
.cab{position:relative;display:flex;flex-direction:column;background:var(--paper)}
.cab.alt{background:var(--paper-2)}
.cab-top{order:0;padding:clamp(22px,4vh,40px) var(--pr) 0 var(--pl);display:flex;justify-content:flex-start}
body.cabpage .cab-top{padding-top:calc(var(--hh) + clamp(22px,4vh,40px))}
.others{display:inline-flex;align-items:center;min-height:44px;gap:.7em;font-weight:700;font-size:.98rem;color:var(--ink-soft);padding:8px 0;transition:color .5s var(--ease),gap .6s var(--ease)}
.others .ar{width:1.05em;height:1.05em;color:var(--sage);transform:rotate(-90deg)}
.others:hover{color:var(--ink);gap:1.1em}
.cab-dream{order:1;margin:0 var(--pr) 0 var(--pl);display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);gap:clamp(32px,4.4vw,80px);min-height:min(calc(100svh - var(--hh) - 150px),900px)}
.cab.flip .cab-dream{grid-template-columns:minmax(0,1fr) minmax(0,.92fr)}
.cab.flip .cab-photo{order:-1}
.cab-text{align-self:center;padding:clamp(34px,6vh,72px) 0}
.cab-photo{position:relative;margin:0;overflow:hidden;background:var(--paper-2);min-height:380px}
.cab-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cab h1,.cab h2{font-size:clamp(2.6rem,4.7vw,5rem);line-height:.94;margin:clamp(18px,3vh,28px) 0 clamp(16px,2.6vh,26px)}
.cab-q{font-weight:800;font-size:clamp(1.3rem,1.95vw,1.9rem);line-height:1.2;letter-spacing:-.02em;color:var(--earth);max-width:min(26ch,100%)}
.cab-desc{margin-top:clamp(18px,3vh,30px);max-width:44ch;font-size:clamp(1rem,1.15vw,1.1rem)}
/* « Dans cette cabane » : un titre en clair, puis une ligne par option, en texte normal (même taille que la description), sans tags ni puces */
.cab .cab-opts-h{margin:clamp(26px,4.4vh,42px) 0 0;font-size:clamp(1.15rem,1.4vw,1.3rem);line-height:1.15;letter-spacing:-.015em}
.cab-opts{margin-top:10px;max-width:44ch}
.cab-opts li{font-size:clamp(1rem,1.15vw,1.1rem);line-height:1.5;padding:2px 0}

/* la bande pratique : la même, au même endroit, sur les quatre cabanes */
.strip{order:3;position:relative;z-index:5;background:inherit;border-top:1px solid var(--line)}
.strip.strip-under{visibility:hidden} /* il touche la barre du haut : masqué (site.js) */
.strip-in{padding:16px var(--pr) 16px var(--pl);display:flex;align-items:center;justify-content:space-between;gap:12px 36px;flex-wrap:wrap}
.strip-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 18px;min-width:0;font-weight:800;font-size:1.85rem;line-height:1.1;letter-spacing:-.04em}
.strip-price small{font-weight:500;font-size:.92rem;letter-spacing:0;color:var(--ink-soft);max-width:62ch}
.strip .go{white-space:nowrap}
@media(min-width:961px){.strip{position:sticky;bottom:0}}

/* une photo « plein cadre » : toute la largeur de l'écran */
.ff{order:2;margin:0;overflow:hidden;background:var(--paper-2)}
.ff img{width:100%;height:min(80svh,860px);object-fit:cover}
.cab .ff{margin-top:clamp(48px,8vh,96px)}
.cab.alt .ff{background:var(--paper)}

/* la suite de la cabane : les autres photos, une à une, avec beaucoup d'air */
.gal{order:2;margin:0 var(--pr) 0 var(--pl);padding:clamp(48px,8vh,96px) 0 clamp(40px,7vh,80px);column-count:2;column-gap:clamp(20px,3vw,44px)}
.ff + .gal{padding-top:clamp(32px,6vh,72px)}
.gal figure{margin:0 0 clamp(20px,3vw,44px);overflow:hidden;background:var(--paper-2);break-inside:avoid}
.cab.alt .gal figure{background:var(--paper)}
.gal img{width:100%;height:auto}

/* ce que la cabane comprend (pages cabane) */
.ch-included{order:2;padding:clamp(24px,4vh,48px) var(--pr) clamp(56px,9vh,96px) var(--pl)}
.ch-included h2{font-size:clamp(2rem,4vw,3.2rem);margin:18px 0 30px}
.ch-included ul{border-top:2px solid var(--ink)}
.ch-included li{padding:18px 0;border-bottom:1px solid var(--line)}

/* le calendrier de la cabane (pages cabane) */
.ch-avail{padding:clamp(72px,12vh,150px) var(--pr) clamp(88px,14vh,170px) var(--pl);background:var(--paper-2)}
.cab.alt + .ch-avail{background:var(--paper)}
.ch-avail h2{font-size:clamp(2rem,4vw,3.2rem);margin:18px 0 14px}
.ch-avail .lead{max-width:56ch;margin-bottom:28px;color:var(--ink-soft)}
.calbox{background:var(--paper)}
.cab.alt + .ch-avail .calbox{background:var(--paper-2)}
.calbox iframe{display:block;width:100%;border:0;height:320px}
.ch-avail .cta{margin-top:30px}

/* Edith se pose au-dessus de la bande pratique, pas dessus */
@media(min-width:961px){body.home .cc-fab,body.cabpage .cc-fab{bottom:92px}}

@media(max-width:960px){
  .cab-dream,.cab.flip .cab-dream{margin-inline:0;grid-template-columns:1fr;min-height:0;gap:0}
  .cab-photo,.cab.flip .cab-photo{order:-1;min-height:0;height:min(68svh,560px)}
  .cab-text,.cab.flip .cab-text{padding:36px var(--gut) 44px}
  .strip{order:2}
  .ch-included{order:3;padding-block:40px 12px}
  .ff{order:4}
  .ff img{height:auto}
  .cab .ff{margin-top:48px}
  .ff + .gal{padding-top:32px}
  .gal{order:4;margin-inline:0;padding:40px 0 36px;column-count:1}
  .gal figure{margin-bottom:12px}
}
/* ---------------------------------------------------------------- Edith (assistante) : un tiroir, pas une carte flottante */
.cc-fab{position:fixed;right:0;bottom:28px;z-index:100;display:flex;align-items:center;gap:0;background:var(--ink);color:var(--paper);padding:8px;font-weight:700;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;transition:transform .6s var(--ease),opacity .9s var(--ease),background .4s,visibility 0s}
.cc-fab:hover{background:var(--earth)}
/* discret : seul le petit chien se montre ; le texte se déplie au survol (et se montre quelques secondes à l'arrivée) */
.cc-fab .cc-txt{display:block;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;margin:0;transition:max-width .6s var(--ease),opacity .4s,margin .6s var(--ease)}
.cc-fab:hover .cc-txt,.cc-fab:focus-visible .cc-txt{max-width:240px;opacity:1;margin:0 14px 0 12px}
.cc-fab .cc-txt{animation:ccpeek 7s var(--ease) 3s 1 backwards}
@keyframes ccpeek{0%{max-width:0;opacity:0;margin:0}10%,78%{max-width:240px;opacity:1;margin:0 14px 0 12px}100%{max-width:0;opacity:0;margin:0}}
/* l'avatar d'Edith est le SEUL élément rond du site */
.cc-fab .cc-ico{width:44px;height:44px;flex:0 0 44px;border-radius:50%;background:var(--paper-2) url("img/edith-avatar.jpeg") center 45%/cover no-repeat}
.cc-fab.hide{transform:translateX(110%);opacity:0;pointer-events:none;transition:transform .6s var(--ease),opacity .4s var(--ease),background .4s}
.cc-panel{position:fixed;top:0;right:0;bottom:0;z-index:130;width:min(100%,440px);background:var(--paper);border-left:1px solid var(--line);display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;transition:transform .6s var(--ease),visibility 0s .6s}
.cc-panel.open{transform:none;visibility:visible;transition:transform .6s var(--ease)}
.cc-head{display:flex;align-items:center;gap:16px;padding:0 24px;height:var(--hb);flex:0 0 auto;border-bottom:1px solid var(--line)}
.cc-head .av{width:46px;height:46px;flex:0 0 46px;border-radius:50%;background:var(--paper-2) url("img/edith-avatar.jpeg") center 45%/cover no-repeat}
.cc-head h4{font-weight:800;font-size:1.2rem;letter-spacing:-.02em;line-height:1.1}
.cc-head p{font-size:.84rem;color:var(--ink-soft);margin:3px 0 0;display:flex;align-items:center;gap:8px;font-weight:500}
.cc-head .cdot{display:inline-block;width:8px;height:8px;background:var(--sage)}
.cc-head .cx{margin-left:auto;width:44px;height:44px;font-size:1.5rem;display:grid;place-items:center;margin-right:-8px}
.cc-body{flex:1;overflow-y:auto;padding:24px;display:flex;flex-direction:column;gap:16px}
.cc-msg{max-width:92%;font-size:1rem;line-height:1.55}
.cc-msg.bot{border-left:3px solid var(--sage);padding-left:14px;align-self:flex-start}
.cc-msg.user{background:var(--earth);color:var(--paper);padding:10px 16px;align-self:flex-end}
.cc-typing{align-self:flex-start;display:flex;gap:6px;padding:8px 0 8px 17px}
.cc-typing span{width:7px;height:7px;background:var(--earth);animation:ccb 1.4s infinite}
.cc-typing span:nth-child(2){animation-delay:.2s}.cc-typing span:nth-child(3){animation-delay:.4s}
@keyframes ccb{0%,60%,100%{opacity:.25}30%{opacity:1}}
.cc-chips{display:flex;gap:8px 18px;flex-wrap:wrap;padding:12px 24px;border-top:1px solid var(--line)}
.cc-chips:empty{display:none}
.cc-chip{font-weight:700;font-size:.92rem;min-height:40px;text-decoration:underline 1.5px var(--sage);text-underline-offset:.3em;text-align:left}
.cc-chip:hover{color:var(--earth)}
.cc-bar{display:flex;border-top:1px solid var(--line);flex:0 0 auto}
.cc-bar input{flex:1;border:0;min-height:62px;padding:0 24px;font-size:1.02rem;border-radius:0}
.cc-bar input:focus{outline-offset:-3px}
.cc-bar button{width:66px;background:var(--earth);color:var(--paper);font-size:1.2rem}
.cc-bar button:hover{background:var(--ink)}
.cc-bar button:disabled{opacity:.4;cursor:not-allowed}
@media(max-width:960px){.cc-fab{bottom:calc(env(safe-area-inset-bottom,0px) + 72px)}.cc-fab .cc-txt{display:none}.cc-fab{padding-right:8px}}

/* ---------------------------------------------------------------- photos : même rendu pour toutes
   Couleurs d'origine ; luminosité et saturation ajustées photo par photo vers une référence commune. */
.ph-hero{filter:brightness(1.10) saturate(1.12) contrast(1.04)}
.ph-story{filter:brightness(.96) saturate(1.12) contrast(1.04)}
.ph-spa{filter:brightness(.90) saturate(.87) contrast(1.04)}
.ph-domaine-1{filter:brightness(.94) saturate(1.12) contrast(1.04)}
.ph-domaine-2{filter:brightness(.97) saturate(1.12) contrast(1.04)}
.ph-activites{filter:brightness(.90) saturate(1.06) contrast(1.04)}
.ph-final{filter:brightness(1.06) saturate(1.12) contrast(1.04)}
.ph-camille-1{filter:brightness(1.19) saturate(.79) contrast(1.04)}
.ph-camille-2{filter:brightness(1.30) saturate(.91) contrast(1.04)}
.ph-camille-3{filter:brightness(1.24) saturate(1.05) contrast(1.04)}
.ph-mathis-1{filter:brightness(1.01) saturate(.87) contrast(1.04)}
.ph-mathis-2{filter:brightness(.96) saturate(.84) contrast(1.04)}
.ph-mathis-3{filter:brightness(1) saturate(.85) contrast(1.04)}
.ph-alanis-1{filter:brightness(1.20) saturate(1.12) contrast(1.04)}
.ph-alanis-2{filter:brightness(.90) saturate(1.12) contrast(1.04)}
.ph-alanis-3{filter:brightness(.98) saturate(.68) contrast(1.04)}
.ph-mila-1{filter:brightness(1.30) saturate(.68) contrast(1.04)}
.ph-mila-2{filter:brightness(1.13) saturate(.93) contrast(1.04)}
.ph-mila-3{filter:brightness(.90) saturate(.76) contrast(1.04)}
.ph-mila-4{filter:brightness(.93) saturate(1.12) contrast(1.04)}
.ph-mila-5{filter:brightness(.99) saturate(.73) contrast(1.04)}

/* ---------------------------------------------------------------- mouvement réduit */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  .js .reveal,.js .unveil,.js .unveil img{opacity:1;transform:none}
}

/* ---------- boutons : bordure "planche de bois" (border-image, 4 px ; le centre garde son aplat) ----------
   Les veines sont un petit SVG en ligne (6 variantes, ~10 Ko en tout) ; au survol / focus, la veine fonce d'environ 10 %.
   Genere par un script : pour changer les couleurs, demander une nouvelle generation plutot que d'editer a la main. */
:root{
  --wood:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M0 0H160L152 8H8Z'/%3E%3C/clipPath%3E%3Cg id='s' clip-path='url(%23m)'%3E%3Crect width='160' height='8' fill='%23694330'/%3E%3Cpath d='M0 1.4L4 1.5L8 1.7L12 1.9L16 2L20 2.1L24 2.2L28 2.2L32 2.1L36 2L40 1.9L44 1.7L48 1.5L52 1.4L56 1.3L60 1.2L64 1.2L68 1.3L72 1.4L76 1.5L80 1.7L84 1.9L88 2L92 2.1L96 2.2L100 2.2L104 2.1L108 2L112 1.9L116 1.7L120 1.5L124 1.4L128 1.3L132 1.2L136 1.2L140 1.3L144 1.4L148 1.5L152 1.7L156 1.9L160 2' stroke='%233F2819' stroke-width='1.2'/%3E%3Cpath d='M0 4.5L4 4.5L8 4.6L12 4.6L16 4.6L20 4.6L24 4.5L28 4.5L32 4.4L36 4.3L40 4.2L44 4.1L48 4L52 3.8L56 3.7L60 3.6L64 3.5L68 3.4L72 3.3L76 3.3L80 3.2L84 3.2L88 3.2L92 3.2L96 3.3L100 3.3L104 3.4L108 3.5L112 3.6L116 3.7L120 3.8L124 4L128 4.1L132 4.2L136 4.3L140 4.4L144 4.5L148 4.5L152 4.6L156 4.6L160 4.6' stroke='%239C6C4A' stroke-width='1.5'/%3E%3Cpath d='M0 6.6L4 6.6L8 6.6L12 6.4L16 6.2L20 6L24 5.8L28 5.8L32 5.8L36 6L40 6.2L44 6.4L48 6.6L52 6.6L56 6.6L60 6.4L64 6.2L68 6L72 5.8L76 5.8L80 5.8L84 6L88 6.2L92 6.4L96 6.6L100 6.6L104 6.6L108 6.4L112 6.2L116 6L120 5.8L124 5.8L128 5.8L132 6L136 6.2L140 6.4L144 6.6L148 6.6L152 6.6L156 6.4L160 6.2' stroke='%233F2819' stroke-width='1.2'/%3E%3Cellipse cx='62' cy='4' rx='5' ry='1.5' stroke='%233F2819' stroke-width='.8'/%3E%3Cpath d='M104 2.6h14M30 5.4h9' stroke='%239C6C4A' stroke-width='.7'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' transform='rotate(90 80 80)'/%3E%3Cuse href='%23s' transform='rotate(180 80 80)'/%3E%3Cuse href='%23s' transform='rotate(270 80 80)'/%3E%3Cpath d='M0 0L8 8M160 0L152 8M160 160L152 152M0 160L8 152' stroke='%233F2819' stroke-width='.8'/%3E%3C/svg%3E");
  --wood-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M0 0H160L152 8H8Z'/%3E%3C/clipPath%3E%3Cg id='s' clip-path='url(%23m)'%3E%3Crect width='160' height='8' fill='%23694330'/%3E%3Cpath d='M0 1.4L4 1.5L8 1.7L12 1.9L16 2L20 2.1L24 2.2L28 2.2L32 2.1L36 2L40 1.9L44 1.7L48 1.5L52 1.4L56 1.3L60 1.2L64 1.2L68 1.3L72 1.4L76 1.5L80 1.7L84 1.9L88 2L92 2.1L96 2.2L100 2.2L104 2.1L108 2L112 1.9L116 1.7L120 1.5L124 1.4L128 1.3L132 1.2L136 1.2L140 1.3L144 1.4L148 1.5L152 1.7L156 1.9L160 2' stroke='%23392417' stroke-width='1.2'/%3E%3Cpath d='M0 4.5L4 4.5L8 4.6L12 4.6L16 4.6L20 4.6L24 4.5L28 4.5L32 4.4L36 4.3L40 4.2L44 4.1L48 4L52 3.8L56 3.7L60 3.6L64 3.5L68 3.4L72 3.3L76 3.3L80 3.2L84 3.2L88 3.2L92 3.2L96 3.3L100 3.3L104 3.4L108 3.5L112 3.6L116 3.7L120 3.8L124 4L128 4.1L132 4.2L136 4.3L140 4.4L144 4.5L148 4.5L152 4.6L156 4.6L160 4.6' stroke='%238c6143' stroke-width='1.5'/%3E%3Cpath d='M0 6.6L4 6.6L8 6.6L12 6.4L16 6.2L20 6L24 5.8L28 5.8L32 5.8L36 6L40 6.2L44 6.4L48 6.6L52 6.6L56 6.6L60 6.4L64 6.2L68 6L72 5.8L76 5.8L80 5.8L84 6L88 6.2L92 6.4L96 6.6L100 6.6L104 6.6L108 6.4L112 6.2L116 6L120 5.8L124 5.8L128 5.8L132 6L136 6.2L140 6.4L144 6.6L148 6.6L152 6.6L156 6.4L160 6.2' stroke='%23392417' stroke-width='1.2'/%3E%3Cellipse cx='62' cy='4' rx='5' ry='1.5' stroke='%23392417' stroke-width='.8'/%3E%3Cpath d='M104 2.6h14M30 5.4h9' stroke='%238c6143' stroke-width='.7'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' transform='rotate(90 80 80)'/%3E%3Cuse href='%23s' transform='rotate(180 80 80)'/%3E%3Cuse href='%23s' transform='rotate(270 80 80)'/%3E%3Cpath d='M0 0L8 8M160 0L152 8M160 160L152 152M0 160L8 152' stroke='%23392417' stroke-width='.8'/%3E%3C/svg%3E");
  --wood-dk:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M0 0H160L152 8H8Z'/%3E%3C/clipPath%3E%3Cg id='s' clip-path='url(%23m)'%3E%3Crect width='160' height='8' fill='%235E3C28'/%3E%3Cpath d='M0 1.4L4 1.5L8 1.7L12 1.9L16 2L20 2.1L24 2.2L28 2.2L32 2.1L36 2L40 1.9L44 1.7L48 1.5L52 1.4L56 1.3L60 1.2L64 1.2L68 1.3L72 1.4L76 1.5L80 1.7L84 1.9L88 2L92 2.1L96 2.2L100 2.2L104 2.1L108 2L112 1.9L116 1.7L120 1.5L124 1.4L128 1.3L132 1.2L136 1.2L140 1.3L144 1.4L148 1.5L152 1.7L156 1.9L160 2' stroke='%232C1D14' stroke-width='1.2'/%3E%3Cpath d='M0 4.5L4 4.5L8 4.6L12 4.6L16 4.6L20 4.6L24 4.5L28 4.5L32 4.4L36 4.3L40 4.2L44 4.1L48 4L52 3.8L56 3.7L60 3.6L64 3.5L68 3.4L72 3.3L76 3.3L80 3.2L84 3.2L88 3.2L92 3.2L96 3.3L100 3.3L104 3.4L108 3.5L112 3.6L116 3.7L120 3.8L124 4L128 4.1L132 4.2L136 4.3L140 4.4L144 4.5L148 4.5L152 4.6L156 4.6L160 4.6' stroke='%238A5D40' stroke-width='1.5'/%3E%3Cpath d='M0 6.6L4 6.6L8 6.6L12 6.4L16 6.2L20 6L24 5.8L28 5.8L32 5.8L36 6L40 6.2L44 6.4L48 6.6L52 6.6L56 6.6L60 6.4L64 6.2L68 6L72 5.8L76 5.8L80 5.8L84 6L88 6.2L92 6.4L96 6.6L100 6.6L104 6.6L108 6.4L112 6.2L116 6L120 5.8L124 5.8L128 5.8L132 6L136 6.2L140 6.4L144 6.6L148 6.6L152 6.6L156 6.4L160 6.2' stroke='%232C1D14' stroke-width='1.2'/%3E%3Cellipse cx='62' cy='4' rx='5' ry='1.5' stroke='%232C1D14' stroke-width='.8'/%3E%3Cpath d='M104 2.6h14M30 5.4h9' stroke='%238A5D40' stroke-width='.7'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' transform='rotate(90 80 80)'/%3E%3Cuse href='%23s' transform='rotate(180 80 80)'/%3E%3Cuse href='%23s' transform='rotate(270 80 80)'/%3E%3Cpath d='M0 0L8 8M160 0L152 8M160 160L152 152M0 160L8 152' stroke='%232C1D14' stroke-width='.8'/%3E%3C/svg%3E");
  --wood-dk-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M0 0H160L152 8H8Z'/%3E%3C/clipPath%3E%3Cg id='s' clip-path='url(%23m)'%3E%3Crect width='160' height='8' fill='%235E3C28'/%3E%3Cpath d='M0 1.4L4 1.5L8 1.7L12 1.9L16 2L20 2.1L24 2.2L28 2.2L32 2.1L36 2L40 1.9L44 1.7L48 1.5L52 1.4L56 1.3L60 1.2L64 1.2L68 1.3L72 1.4L76 1.5L80 1.7L84 1.9L88 2L92 2.1L96 2.2L100 2.2L104 2.1L108 2L112 1.9L116 1.7L120 1.5L124 1.4L128 1.3L132 1.2L136 1.2L140 1.3L144 1.4L148 1.5L152 1.7L156 1.9L160 2' stroke='%23281a12' stroke-width='1.2'/%3E%3Cpath d='M0 4.5L4 4.5L8 4.6L12 4.6L16 4.6L20 4.6L24 4.5L28 4.5L32 4.4L36 4.3L40 4.2L44 4.1L48 4L52 3.8L56 3.7L60 3.6L64 3.5L68 3.4L72 3.3L76 3.3L80 3.2L84 3.2L88 3.2L92 3.2L96 3.3L100 3.3L104 3.4L108 3.5L112 3.6L116 3.7L120 3.8L124 4L128 4.1L132 4.2L136 4.3L140 4.4L144 4.5L148 4.5L152 4.6L156 4.6L160 4.6' stroke='%237c543a' stroke-width='1.5'/%3E%3Cpath d='M0 6.6L4 6.6L8 6.6L12 6.4L16 6.2L20 6L24 5.8L28 5.8L32 5.8L36 6L40 6.2L44 6.4L48 6.6L52 6.6L56 6.6L60 6.4L64 6.2L68 6L72 5.8L76 5.8L80 5.8L84 6L88 6.2L92 6.4L96 6.6L100 6.6L104 6.6L108 6.4L112 6.2L116 6L120 5.8L124 5.8L128 5.8L132 6L136 6.2L140 6.4L144 6.6L148 6.6L152 6.6L156 6.4L160 6.2' stroke='%23281a12' stroke-width='1.2'/%3E%3Cellipse cx='62' cy='4' rx='5' ry='1.5' stroke='%23281a12' stroke-width='.8'/%3E%3Cpath d='M104 2.6h14M30 5.4h9' stroke='%237c543a' stroke-width='.7'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' transform='rotate(90 80 80)'/%3E%3Cuse href='%23s' transform='rotate(180 80 80)'/%3E%3Cuse href='%23s' transform='rotate(270 80 80)'/%3E%3Cpath d='M0 0L8 8M160 0L152 8M160 160L152 152M0 160L8 152' stroke='%23281a12' stroke-width='.8'/%3E%3C/svg%3E");
  --wood-lt:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M0 0H160L152 8H8Z'/%3E%3C/clipPath%3E%3Cg id='s' clip-path='url(%23m)'%3E%3Crect width='160' height='8' fill='%23DCCFB6'/%3E%3Cpath d='M0 1.4L4 1.5L8 1.7L12 1.9L16 2L20 2.1L24 2.2L28 2.2L32 2.1L36 2L40 1.9L44 1.7L48 1.5L52 1.4L56 1.3L60 1.2L64 1.2L68 1.3L72 1.4L76 1.5L80 1.7L84 1.9L88 2L92 2.1L96 2.2L100 2.2L104 2.1L108 2L112 1.9L116 1.7L120 1.5L124 1.4L128 1.3L132 1.2L136 1.2L140 1.3L144 1.4L148 1.5L152 1.7L156 1.9L160 2' stroke='%239C8462' stroke-width='1.2'/%3E%3Cpath d='M0 4.5L4 4.5L8 4.6L12 4.6L16 4.6L20 4.6L24 4.5L28 4.5L32 4.4L36 4.3L40 4.2L44 4.1L48 4L52 3.8L56 3.7L60 3.6L64 3.5L68 3.4L72 3.3L76 3.3L80 3.2L84 3.2L88 3.2L92 3.2L96 3.3L100 3.3L104 3.4L108 3.5L112 3.6L116 3.7L120 3.8L124 4L128 4.1L132 4.2L136 4.3L140 4.4L144 4.5L148 4.5L152 4.6L156 4.6L160 4.6' stroke='%23F6EFE0' stroke-width='1.5'/%3E%3Cpath d='M0 6.6L4 6.6L8 6.6L12 6.4L16 6.2L20 6L24 5.8L28 5.8L32 5.8L36 6L40 6.2L44 6.4L48 6.6L52 6.6L56 6.6L60 6.4L64 6.2L68 6L72 5.8L76 5.8L80 5.8L84 6L88 6.2L92 6.4L96 6.6L100 6.6L104 6.6L108 6.4L112 6.2L116 6L120 5.8L124 5.8L128 5.8L132 6L136 6.2L140 6.4L144 6.6L148 6.6L152 6.6L156 6.4L160 6.2' stroke='%239C8462' stroke-width='1.2'/%3E%3Cellipse cx='62' cy='4' rx='5' ry='1.5' stroke='%239C8462' stroke-width='.8'/%3E%3Cpath d='M104 2.6h14M30 5.4h9' stroke='%23F6EFE0' stroke-width='.7'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' transform='rotate(90 80 80)'/%3E%3Cuse href='%23s' transform='rotate(180 80 80)'/%3E%3Cuse href='%23s' transform='rotate(270 80 80)'/%3E%3Cpath d='M0 0L8 8M160 0L152 8M160 160L152 152M0 160L8 152' stroke='%239C8462' stroke-width='.8'/%3E%3C/svg%3E");
  --wood-lt-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 160 160' fill='none'%3E%3Cdefs%3E%3CclipPath id='m'%3E%3Cpath d='M0 0H160L152 8H8Z'/%3E%3C/clipPath%3E%3Cg id='s' clip-path='url(%23m)'%3E%3Crect width='160' height='8' fill='%23DCCFB6'/%3E%3Cpath d='M0 1.4L4 1.5L8 1.7L12 1.9L16 2L20 2.1L24 2.2L28 2.2L32 2.1L36 2L40 1.9L44 1.7L48 1.5L52 1.4L56 1.3L60 1.2L64 1.2L68 1.3L72 1.4L76 1.5L80 1.7L84 1.9L88 2L92 2.1L96 2.2L100 2.2L104 2.1L108 2L112 1.9L116 1.7L120 1.5L124 1.4L128 1.3L132 1.2L136 1.2L140 1.3L144 1.4L148 1.5L152 1.7L156 1.9L160 2' stroke='%238c7758' stroke-width='1.2'/%3E%3Cpath d='M0 4.5L4 4.5L8 4.6L12 4.6L16 4.6L20 4.6L24 4.5L28 4.5L32 4.4L36 4.3L40 4.2L44 4.1L48 4L52 3.8L56 3.7L60 3.6L64 3.5L68 3.4L72 3.3L76 3.3L80 3.2L84 3.2L88 3.2L92 3.2L96 3.3L100 3.3L104 3.4L108 3.5L112 3.6L116 3.7L120 3.8L124 4L128 4.1L132 4.2L136 4.3L140 4.4L144 4.5L148 4.5L152 4.6L156 4.6L160 4.6' stroke='%23ddd7ca' stroke-width='1.5'/%3E%3Cpath d='M0 6.6L4 6.6L8 6.6L12 6.4L16 6.2L20 6L24 5.8L28 5.8L32 5.8L36 6L40 6.2L44 6.4L48 6.6L52 6.6L56 6.6L60 6.4L64 6.2L68 6L72 5.8L76 5.8L80 5.8L84 6L88 6.2L92 6.4L96 6.6L100 6.6L104 6.6L108 6.4L112 6.2L116 6L120 5.8L124 5.8L128 5.8L132 6L136 6.2L140 6.4L144 6.6L148 6.6L152 6.6L156 6.4L160 6.2' stroke='%238c7758' stroke-width='1.2'/%3E%3Cellipse cx='62' cy='4' rx='5' ry='1.5' stroke='%238c7758' stroke-width='.8'/%3E%3Cpath d='M104 2.6h14M30 5.4h9' stroke='%23ddd7ca' stroke-width='.7'/%3E%3C/g%3E%3C/defs%3E%3Cuse href='%23s'/%3E%3Cuse href='%23s' transform='rotate(90 80 80)'/%3E%3Cuse href='%23s' transform='rotate(180 80 80)'/%3E%3Cuse href='%23s' transform='rotate(270 80 80)'/%3E%3Cpath d='M0 0L8 8M160 0L152 8M160 160L152 152M0 160L8 152' stroke='%238c7758' stroke-width='.8'/%3E%3C/svg%3E");
}
.btn:hover,.btn:focus-visible{border-image-source:var(--wood-h)}
.btn.o{border-image-source:var(--wood-dk)}
.btn.o:hover,.btn.o:focus-visible{border-image-source:var(--wood-dk-h)}
.btn.inv,.btn.line-inv{border-image-source:var(--wood-lt)}
.btn.inv:hover,.btn.inv:focus-visible,.btn.line-inv:hover,.btn.line-inv:focus-visible{border-image-source:var(--wood-lt-h)}
.btn:focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 3px var(--paper)}
.dark .btn:focus-visible,.deep .btn:focus-visible,.warm .btn:focus-visible{outline-color:var(--paper);box-shadow:0 0 0 3px var(--ink)}
@media(max-width:960px){
  .bookbar{border:0;border-top:4px solid var(--earth-deep);border-image:var(--wood) 8 / 4px 0 0 round}
  .bookbar:hover,.bookbar:focus-visible{border-image-source:var(--wood-h)}
}

/* ---------- branches animees (d'apres les maquettes Chene / Sapin / Erable / Rosier) : rails de branches ----------
   Pages cabane, cabanes de l'accueil, sommaire. Dessins en SVG dans les pages, couleurs = variables ci-dessous (maquettes desaturees ~25 %).
   site.js pose chaque branche dans le vide (40 px de tout texte, photo ou bouton) puis la fait arriver (.in) ; hors ecran : pause (.off). */
.br-rail,.br-defs{--b-wood:#72543E;--b-shadow:#3B2B21;--b-leaf:#5D7342;--b-leaf2:#7A9055;--b-leaf3:#465932;--b-leafVein:#3E4E2D;--b-birdRed:#C36A41;--b-birdBack:#836B56;--b-birdWing:#654F3E;--b-birdBelly:#ECE5DB;--b-fir1:#355746;--b-fir2:#4A735B;--b-firBack:#243C2E;--b-sqBody:#AD653D;--b-sqTail:#C17B4D;--b-sqBelly:#EBE0CD;--b-sqDark:#80482E;--b-maple1:#AB4942;--b-maple2:#C56649;--b-mapleBack:#7E3331;--b-mapleVein:#612724;--b-dragonBody:#3D7C67;--b-dragonDark:#285446;--b-dragonGold:#C7A154;--b-dragonBelly:#EADEBE;--b-roseStem:#4D643A;--b-roseLeaf:#43643C;--b-roseLeaf2:#5D814E;--b-roseLeafVein:#2D4529;--b-rose1:#C6596A;--b-rose2:#E08996;--b-roseDark:#96394B;--b-beeYellow:#DAB648;--b-beeTrail:#867A6C}
.br .f-beeYellow,.br-defs .f-beeYellow{fill:var(--b-beeYellow)}.br .f-birdBack,.br-defs .f-birdBack{fill:var(--b-birdBack)}.br .f-birdBelly,.br-defs .f-birdBelly{fill:var(--b-birdBelly)}.br .f-birdRed,.br-defs .f-birdRed{fill:var(--b-birdRed)}.br .f-birdWing,.br-defs .f-birdWing{fill:var(--b-birdWing)}.br .f-dragonBelly,.br-defs .f-dragonBelly{fill:var(--b-dragonBelly)}.br .f-dragonBody,.br-defs .f-dragonBody{fill:var(--b-dragonBody)}.br .f-dragonDark,.br-defs .f-dragonDark{fill:var(--b-dragonDark)}.br .f-dragonGold,.br-defs .f-dragonGold{fill:var(--b-dragonGold)}.br .f-leaf,.br-defs .f-leaf{fill:var(--b-leaf)}.br .f-leaf2,.br-defs .f-leaf2{fill:var(--b-leaf2)}.br .f-leaf3,.br-defs .f-leaf3{fill:var(--b-leaf3)}.br .f-maple1,.br-defs .f-maple1{fill:var(--b-maple1)}.br .f-maple2,.br-defs .f-maple2{fill:var(--b-maple2)}.br .f-mapleBack,.br-defs .f-mapleBack{fill:var(--b-mapleBack)}.br .f-roseLeaf,.br-defs .f-roseLeaf{fill:var(--b-roseLeaf)}.br .f-roseLeaf2,.br-defs .f-roseLeaf2{fill:var(--b-roseLeaf2)}.br .f-roseStem,.br-defs .f-roseStem{fill:var(--b-roseStem)}.br .f-shadow,.br-defs .f-shadow{fill:var(--b-shadow)}.br .f-sqBelly,.br-defs .f-sqBelly{fill:var(--b-sqBelly)}.br .f-sqBody,.br-defs .f-sqBody{fill:var(--b-sqBody)}.br .f-sqDark,.br-defs .f-sqDark{fill:var(--b-sqDark)}.br .f-sqTail,.br-defs .f-sqTail{fill:var(--b-sqTail)}.br .s-beeTrail,.br-defs .s-beeTrail{stroke:var(--b-beeTrail)}.br .s-dragonBelly,.br-defs .s-dragonBelly{stroke:var(--b-dragonBelly)}.br .s-dragonBody,.br-defs .s-dragonBody{stroke:var(--b-dragonBody)}.br .s-dragonDark,.br-defs .s-dragonDark{stroke:var(--b-dragonDark)}.br .s-dragonGold,.br-defs .s-dragonGold{stroke:var(--b-dragonGold)}.br .s-fir1,.br-defs .s-fir1{stroke:var(--b-fir1)}.br .s-fir2,.br-defs .s-fir2{stroke:var(--b-fir2)}.br .s-firBack,.br-defs .s-firBack{stroke:var(--b-firBack)}.br .s-roseStem,.br-defs .s-roseStem{stroke:var(--b-roseStem)}.br .s-shadow,.br-defs .s-shadow{stroke:var(--b-shadow)}.br .s-wood,.br-defs .s-wood{stroke:var(--b-wood)}
.som .br-sa{--b-wood:#9F8B7C;--b-shadow:#7A6F68;--b-fir1:#768D81;--b-fir2:#84A08F;--b-firBack:#6A7A71}
.br-rail{position:absolute;inset:0;z-index:0;pointer-events:none}
.br{position:absolute;display:none}
.br > svg{display:block;width:100%;height:100%;overflow:hidden}
.br.mir > svg{transform:scaleX(-1)}
html.js .br:not(.in) *,.br.off *{animation-play-state:paused!important}
/* sans JS : la premiere branche de chaque rail, posee en haut a droite (pas sur le sommaire) */
html:not(.js) .br-rail > .br:first-child{display:block;right:0;top:calc(var(--hh) + 8px);width:clamp(110px,calc(var(--pr) - 40px),320px)}
html:not(.js) .br > svg{height:auto}
html:not(.js) .br-rail[data-rows]{display:none}
.cab{position:relative}
.cab-dream > *,.ch-avail > *{position:relative;z-index:1}
.ch-avail{position:relative}
/* accueil, grand ecran : une bande libre au-dessus du titre de chaque cabane, pour une branche d'au moins 220 px */
@media(min-width:1400px){.home .cab-top{min-height:calc(var(--hh) + 200px);align-items:flex-start}}
/* ecran moyen et telephone : bandes libres (au-dessus du titre, et avant les dates) ou les branches se posent */
@media(max-width:1399.98px){
  .cab-top{min-height:calc(var(--hh) + 240px);align-items:flex-start}
  .ch-avail{padding-top:200px}
}
@media(max-width:960px){
  .cab-top{min-height:calc(var(--hh) + 168px)}
  .ch-avail{padding-top:230px}
}
/* sommaire : une colonne libre a droite de chaque citation, des lignes assez hautes pour une branche de 220 px et plus */
.som-list li{padding-right:max(0px,calc(340px - var(--pr)))}
.som .som-list{border-top:0}
@media(min-width:961px){.som-item{min-height:clamp(150px,12vw,250px)}}
.som-list li:first-child .som-item{border-top:1px solid var(--line-lt)}
@media(max-width:960px){.som-list li{padding-right:40vw}}
@media(prefers-reduced-motion:reduce){.br *{animation:none!important}}
@keyframes br-windL { 0% { transform: translateX(-380px) rotate(-12deg); opacity: 0 } 15% { opacity: 1 } 60% { transform: translateX(8px) rotate(5deg) } 78% { transform: translateX(-2px) rotate(-2.5deg) } 92% { transform: translateX(0) rotate(1deg) } 100% { transform: translateX(0) rotate(0deg); opacity: 1 } }
@keyframes br-windR { 0% { transform: translateX(380px) rotate(12deg); opacity: 0 } 15% { opacity: 1 } 60% { transform: translateX(-8px) rotate(-5deg) } 78% { transform: translateX(2px) rotate(2.5deg) } 92% { transform: translateX(0) rotate(-1deg) } 100% { transform: translateX(0) rotate(0deg); opacity: 1 } }
@keyframes br-sway { from { transform: rotate(0deg) } to { transform: rotate(1.4deg) } }
@keyframes br-flap { from { transform: rotate(0deg) } to { transform: rotate(-45deg) scaleY(0.55) } }
@keyframes br-hover { from { transform: translate(0px, 0px) } to { transform: translate(3px, -4px) } }
@keyframes br-fadein { from { opacity: 0 } to { opacity: 1 } }
@keyframes ch-k0 { 0% { transform: translate(-230px, -210px); opacity: 0 } 8% { opacity: 1 } 35% { transform: translate(-150px, -91px) } 65% { transform: translate(-69px, -57px) } 90% { transform: translate(0px, -6px) } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ch-k1 { 0% { transform: translate(-230px, -210px); opacity: 0 } 8% { opacity: 1 } 35% { transform: translate(-150px, -91px) } 65% { transform: translate(-69px, -57px) } 90% { transform: translate(0px, -6px) } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ch-k2 { 0% { transform: translate(230px, -210px); opacity: 0 } 8% { opacity: 1 } 35% { transform: translate(150px, -91px) } 65% { transform: translate(69px, -57px) } 90% { transform: translate(0px, -6px) } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes sa-k0 { 0% { transform: translate(-73px, 21px); opacity: 1 } 17% { transform: translate(-61px, 18px); opacity: 1 } 33% { transform: translate(-48px, 15px); opacity: 1 } 50% { transform: translate(-36px, 11px); opacity: 1 } 67% { transform: translate(-24px, 8px); opacity: 1 } 83% { transform: translate(-12px, 4px); opacity: 1 } 100% { transform: translate(0px, -0px); opacity: 1 } }
@keyframes sa-k1 { 0% { transform: translate(-70px, 35px); opacity: 1 } 17% { transform: translate(-58px, 29px); opacity: 1 } 33% { transform: translate(-46px, 24px); opacity: 1 } 50% { transform: translate(-34px, 18px); opacity: 1 } 67% { transform: translate(-23px, 12px); opacity: 1 } 83% { transform: translate(-11px, 6px); opacity: 1 } 100% { transform: translate(0px, -0px); opacity: 1 } }
@keyframes sa-k2 { 0% { transform: translate(73px, 29px); opacity: 1 } 17% { transform: translate(61px, 25px); opacity: 1 } 33% { transform: translate(48px, 20px); opacity: 1 } 50% { transform: translate(36px, 16px); opacity: 1 } 67% { transform: translate(24px, 11px); opacity: 1 } 83% { transform: translate(12px, 5px); opacity: 1 } 100% { transform: translate(-0px, -0px); opacity: 1 } }
@keyframes er-k0 { 0% { transform: translate(-380px, -70px); opacity: 0 } 10% { opacity: 1 } 30% { transform: translate(-266px, -35px) } 55% { transform: translate(-152px, -51px) } 80% { transform: translate(-38px, 12px) } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes er-k1 { 0% { transform: translate(-380px, -70px); opacity: 0 } 10% { opacity: 1 } 30% { transform: translate(-266px, -35px) } 55% { transform: translate(-152px, -51px) } 80% { transform: translate(-38px, 12px) } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes er-k2 { 0% { transform: translate(380px, -70px); opacity: 0 } 10% { opacity: 1 } 30% { transform: translate(266px, -35px) } 55% { transform: translate(152px, -51px) } 80% { transform: translate(38px, 12px) } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k0 { 0% { transform: translate(33px, 25px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k1 { 0% { transform: translate(19px, -39px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k2 { 0% { transform: translate(37px, 1px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k3 { 0% { transform: translate(-33px, -21px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k4 { 0% { transform: translate(5px, 34px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k5 { 0% { transform: translate(35px, -25px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k6 { 0% { transform: translate(38px, -27px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k7 { 0% { transform: translate(15px, 34px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@keyframes ro-k8 { 0% { transform: translate(31px, 27px); opacity: 0 } 20% { opacity: 1 } 100% { transform: translate(0px, 0px); opacity: 1 } }
@media(max-width:959.98px){@keyframes br-sway{from{transform:rotate(0deg)}to{transform:rotate(.7deg)}}}
