:root {
  --app-orange: #ff8a00;
  --app-black: #080808;
  --app-cream: #fff7eb;
}

/* Theme global partage entre toutes les pages publiques. */
:root{--app-accent:#ff8a00;--app-page-bg:#f5f5f4;--app-header-rgb:9,9,9;--app-header-opacity:.72;--app-footer-bg:#090909;--app-footer-text:#fff;--app-logo-width:184px}
.app-legacy-chrome{display:none!important}
html body .app-site-topbar{width:min(1480px,calc(100% - 28px));max-width:none;min-height:68px;left:auto;right:auto;transform:none;margin-left:auto;margin-right:auto;background:rgba(var(--app-header-rgb),var(--app-header-opacity));border:1px solid rgba(255,255,255,.26);box-shadow:0 16px 48px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.24);backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%)}
html body .app-site-topbar::after{content:"";position:absolute;left:3%;right:3%;bottom:-5px;height:3px;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 2px 12px rgba(255,255,255,.52);pointer-events:none}
.app-top-logo{width:var(--app-logo-width);height:48px;display:block;flex:0 0 auto;background-position:left center;background-size:contain;background-repeat:no-repeat}
.app-site-topbar .app-language-button{appearance:none;border:0;background:transparent;color:#fff;padding:9px 8px;font:inherit;font-weight:750;cursor:pointer}
html body{background-color:var(--app-page-bg)}
.app-site-footer{position:relative;z-index:4;width:100%;margin:52px 0 0;padding:50px max(22px,env(safe-area-inset-left)) 26px;color:var(--app-footer-text);background:var(--app-footer-bg);border-top:1px solid rgba(255,255,255,.2);box-shadow:0 -18px 60px rgba(0,0,0,.14)}
.app-footer-inner{width:min(1280px,100%);margin:0 auto;display:grid;grid-template-columns:1.35fr repeat(3,1fr);gap:38px}
.app-site-footer section{min-width:0}.app-site-footer h2,.app-site-footer h3{color:inherit;letter-spacing:0}.app-site-footer h2{margin:12px 0 10px;font-size:22px}.app-site-footer h3{margin:0 0 14px;font-size:14px;text-transform:uppercase}.app-site-footer p,.app-site-footer address{margin:8px 0;color:inherit;opacity:.74;font-style:normal;line-height:1.65}.app-site-footer a{display:block;width:fit-content;margin:0 0 10px;color:inherit;text-decoration:none;font-weight:680}.app-site-footer a:hover{color:var(--app-accent)}
.app-footer-logo{display:block;width:min(var(--app-logo-width),220px);height:54px;background-position:left center;background-size:contain;background-repeat:no-repeat}.app-footer-bottom{width:min(1280px,100%);margin:32px auto 0;padding-top:18px;border-top:1px solid rgba(255,255,255,.15);opacity:.64;font-size:12px}
@media(max-width:980px){.app-footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))}.app-site-topbar .app-top-text{display:none}}
@media(max-width:720px){html body .app-site-topbar{width:calc(100% - 20px);min-height:58px;top:max(8px,env(safe-area-inset-top));padding:6px 10px}.app-top-logo{width:min(var(--app-logo-width),154px);height:42px}.app-site-topbar nav{display:none}.app-site-topbar .app-top-menu-btn{display:inline-flex}.app-site-footer{margin-top:34px;padding-top:36px;padding-bottom:112px}.app-footer-inner{grid-template-columns:1fr;gap:26px}}

/* En-tete inspire du modele hotelier Qomfort, adapte a la marque. */
@media(min-width:721px){
  html body .app-site-topbar{position:sticky;top:0;width:100%;min-height:88px;margin:0;padding:0 clamp(28px,4.5vw,72px);border:0;border-bottom:1px solid rgba(255,255,255,.18);border-radius:0!important;background:rgba(var(--app-header-rgb),.76);box-shadow:0 12px 42px rgba(0,0,0,.18);overflow:visible}
  html body .app-site-topbar::before{content:"";position:absolute;z-index:-1;left:0;top:0;width:clamp(250px,27vw,430px);height:100%;background:var(--app-accent);clip-path:polygon(0 0,100% 0,78% 100%,0 100%);opacity:.92}
  html body .app-site-topbar::after{left:0;right:0;bottom:-2px;height:2px;border-radius:0;background:rgba(255,255,255,.82);box-shadow:0 2px 12px rgba(255,255,255,.32)}
  .app-site-topbar .app-top-brand{position:relative;z-index:1;min-width:clamp(220px,25vw,390px)}
  .app-site-topbar .app-top-text{display:none}
  .app-site-topbar nav{margin-left:auto;gap:clamp(8px,1.4vw,24px)}
  .app-site-topbar nav>a,.app-site-topbar .app-language-button{position:relative;display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:8px 4px;color:#fff!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;font-size:14px;font-weight:760;text-decoration:none;white-space:nowrap}
  .app-site-topbar nav>a:not(.app-top-cta)::after,.app-site-topbar .app-language-button::after{content:"";position:absolute;left:4px;right:4px;bottom:5px;height:2px;background:var(--app-accent);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
  .app-site-topbar nav>a:hover::after,.app-site-topbar .app-language-button:hover::after,.app-site-topbar .app-language-button[aria-expanded="true"]::after{transform:scaleX(1)}
  .app-site-topbar nav>a.app-top-cta{min-height:46px;padding:0 20px!important;background:var(--app-accent)!important;color:#111!important;font-weight:900}
}
.app-language-menu{position:fixed;z-index:220;top:84px;right:clamp(90px,13vw,210px);width:min(310px,calc(100% - 24px));max-height:min(560px,calc(100vh - 110px));overflow:auto;display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:10px;background:rgba(12,12,12,.94);color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:8px;box-shadow:0 24px 70px rgba(0,0,0,.34);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.18s ease}
.app-language-menu.open{opacity:1;visibility:visible;transform:translateY(0)}
.app-language-title{grid-column:1/-1;padding:8px 9px 11px;color:rgba(255,255,255,.62);font-size:11px;font-weight:850;text-transform:uppercase}
.app-language-menu a{display:flex;align-items:center;gap:9px;padding:9px;color:#fff;text-decoration:none;border-radius:6px}.app-language-menu a:hover,.app-language-menu a.active{background:rgba(255,138,0,.18);color:#fff}.app-language-menu a span{display:grid;place-items:center;width:30px;height:24px;background:rgba(255,255,255,.1);font-weight:900;font-size:11px}.app-language-menu a small{font-size:12px;font-weight:700}
@media(max-width:720px){.app-language-menu{top:74px;right:10px;grid-template-columns:1fr 1fr}.app-language-menu:not(.open){display:none}}

/* Variante verre : pleine largeur, sans trait droit, avec vague douce. */
@media(min-width:721px){
  html body .app-site-topbar{background:rgba(32,25,24,.38);border-bottom:0;box-shadow:0 14px 44px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.2);backdrop-filter:blur(26px) saturate(145%);-webkit-backdrop-filter:blur(26px) saturate(145%)}
  html body .app-site-topbar::before{display:none}
  html body .app-site-topbar::after{content:"";display:block;left:0;right:0;bottom:-9px;width:100%;height:14px;border-radius:0;background-color:rgba(255,255,255,.14);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 10 C160 34 300 -8 470 12 S780 34 940 10 S1120 -4 1200 12 L1200 0 L0 0 Z' fill='white' fill-opacity='.32'/%3E%3C/svg%3E");background-repeat:repeat-x;background-size:calc(100% + 40px) 100%;box-shadow:none;opacity:.72;animation:app-glass-wave 8s ease-in-out infinite alternate;pointer-events:none}
  .app-site-topbar nav>a,.app-site-topbar .app-language-button{color:#fff!important;text-shadow:0 2px 8px rgba(0,0,0,.72)}
  .app-site-topbar nav>a.app-top-cta{text-shadow:none}
}
@keyframes app-glass-wave{from{background-position:-20px 0;opacity:.58}to{background-position:20px 2px;opacity:.78}}
@media(prefers-reduced-motion:reduce){html body .app-site-topbar::after{animation:none}}

/* Glass 2026 : neutre, transparent et pose au-dessus du contenu. */
html body{background-color:transparent}
html body .app-site-topbar{position:fixed!important;z-index:170;background:rgba(8,10,12,.22)!important;border:1px solid rgba(255,255,255,.16)!important;border-left:0!important;border-right:0!important;box-shadow:0 10px 36px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.18)!important;backdrop-filter:blur(20px) saturate(175%) contrast(108%)!important;-webkit-backdrop-filter:blur(20px) saturate(175%) contrast(108%)!important}
html body .app-site-topbar::before{content:""!important;display:block!important;position:absolute;inset:1px 10% auto;width:80%;height:1px;background:rgba(255,255,255,.28);clip-path:none;opacity:.8;pointer-events:none}
html body .app-site-topbar::after{bottom:-6px;height:8px;background-color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 24' preserveAspectRatio='none'%3E%3Cpath d='M0 5 C180 18 310 -4 490 6 S810 18 980 5 S1140 0 1200 6' fill='none' stroke='white' stroke-opacity='.16' stroke-width='3'/%3E%3C/svg%3E");opacity:.6}
html body .app-site-topbar nav>a,html body .app-site-topbar .app-language-button{min-height:40px;padding:0 12px!important;border:1px solid rgba(255,255,255,.11)!important;border-radius:8px!important;background:rgba(255,255,255,.055)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.11),0 6px 18px rgba(0,0,0,.08)!important;color:#fff!important;text-shadow:0 2px 9px rgba(0,0,0,.72);transition:background-color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
html body .app-site-topbar nav>a:hover,html body .app-site-topbar .app-language-button:hover,html body .app-site-topbar .app-language-button[aria-expanded="true"],html body .app-site-topbar nav>a.app-nav-active{transform:translateY(-1px);background:rgba(255,255,255,.15)!important;border-color:rgba(255,255,255,.28)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 24px rgba(0,0,0,.14)!important}
html body .app-site-topbar nav>a:not(.app-top-cta)::after,html body .app-site-topbar .app-language-button::after{display:none}
html body .app-site-topbar nav>a.app-top-cta{border-color:rgba(255,166,61,.65)!important;background:rgba(255,138,0,.88)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 10px 28px rgba(255,138,0,.2)!important;color:#111!important}
@property --app-cta-glow-angle{syntax:"<angle>";inherits:false;initial-value:0deg}
html body .app-site-topbar nav>a.app-top-cta{border:1.5px solid transparent!important;background:linear-gradient(#ff8a00,#ff8a00) padding-box,conic-gradient(from var(--app-cta-glow-angle),#ff8a00,#fff 22%,#2187ff 45%,#9b4dff 62%,#00d0d8 78%,#ff8a00) border-box!important;box-shadow:0 8px 24px rgba(255,138,0,.2),0 0 12px rgba(60,138,255,.16),inset 0 1px 0 rgba(255,255,255,.38)!important;animation:app-cta-glow-spin 5.5s linear infinite}
@keyframes app-cta-glow-spin{to{--app-cta-glow-angle:360deg}}
.app-language-menu{background:rgba(8,10,12,.72);border-color:rgba(255,255,255,.2);box-shadow:0 24px 70px rgba(0,0,0,.3),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(26px) saturate(170%);-webkit-backdrop-filter:blur(26px) saturate(170%)}
@media(max-width:720px){html body .app-site-topbar{left:max(8px,env(safe-area-inset-left))!important;right:auto!important;margin-left:0!important;margin-right:0!important;background:rgba(8,10,12,.28)!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:20px!important}.app-top-menu-btn{border:1px solid rgba(255,255,255,.16)!important;background:rgba(255,255,255,.1)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 8px 22px rgba(0,0,0,.13)!important}}

/* Pied de page verre noir avec vague orange animee. */
html body .app-site-footer{overflow:hidden;isolation:isolate;margin-top:0;padding-top:76px;background-color:#030508!important;background-image:radial-gradient(circle at 5% 30%,rgba(255,116,0,.42),transparent 31%),radial-gradient(circle at 92% 18%,rgba(20,105,255,.44),transparent 35%),radial-gradient(circle at 58% 92%,rgba(0,205,215,.2),transparent 32%),radial-gradient(circle at 48% 8%,rgba(184,58,255,.17),transparent 28%)!important;background-size:145% 145%,150% 150%,135% 135%,140% 140%!important;border-top:1px solid rgba(255,255,255,.14);box-shadow:0 -22px 70px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%);animation:app-footer-aurora 14s ease-in-out infinite alternate}
html body .app-site-footer::before,html body .app-site-footer::after{display:none!important}
.app-site-footer .app-footer-inner{position:relative;z-index:1}.app-site-footer section{padding:4px 0}.app-site-footer h2{font-family:Georgia,serif;font-size:28px}.app-site-footer h3{color:#ff9a24!important;font-size:12px;letter-spacing:.12em}.app-site-footer a{position:relative;padding:3px 0;color:rgba(255,255,255,.84)}.app-site-footer a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:#ff9418;transform:scaleX(0);transform-origin:left;transition:transform .25s ease}.app-site-footer a:hover::after{transform:scaleX(1)}.app-site-footer .app-footer-bottom{color:rgba(255,255,255,.72);opacity:1;border-top-color:rgba(255,255,255,.13)}
@keyframes app-footer-wave{from{transform:translateX(-1.5%) scaleY(.92)}to{transform:translateX(1.5%) scaleY(1.08)}}
@keyframes app-footer-aurora{0%{background-position:0 20%,100% 0,50% 100%}50%{background-position:22% 0,76% 24%,62% 74%}100%{background-position:8% 32%,92% 8%,42% 88%}}
@media(max-width:720px){html body .app-site-footer{padding-top:54px}.app-site-footer h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){html body .app-site-footer,html body .app-site-footer::before,html body .app-site-topbar nav>a.app-top-cta{animation:none}}

/* Composition du pied de page inspiree de Qomfort. */
.app-footer-gallery{position:relative;z-index:1;width:min(1380px,calc(100% - 48px));margin:0 auto 72px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px}
.app-footer-gallery img{display:block;width:100%;aspect-ratio:1.18/1;object-fit:cover;border-radius:0;filter:saturate(.9);transition:transform .4s ease,filter .4s ease}
.app-footer-gallery img:hover{transform:translateY(-7px);filter:saturate(1.08)}
.app-footer-qomfort{grid-template-columns:minmax(180px,.8fr) minmax(420px,1.8fr) minmax(180px,.8fr);align-items:start;gap:72px}
.app-footer-feature{text-align:center}.app-footer-feature h2{margin-top:0;font-size:38px;line-height:1.1}.app-footer-feature p{max-width:620px;margin:16px auto!important}.app-footer-feature .app-footer-logo{margin:26px auto 12px;background-position:center}.app-footer-feature a{margin-left:auto;margin-right:auto}.app-footer-reserve{display:inline-flex!important;align-items:center;justify-content:center;min-height:54px;margin:22px auto 4px!important;padding:0 28px!important;color:#121212!important;background:#ff9418;border:1px solid rgba(255,255,255,.22);font-weight:900!important}.app-footer-reserve::after{display:none}.app-footer-qomfort nav{display:grid;gap:4px}
@media(max-width:980px){.app-footer-gallery{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:54px}.app-footer-qomfort{grid-template-columns:1fr 1.5fr;gap:46px}.app-footer-qomfort>section:last-child{grid-column:1/-1}}
@media(max-width:720px){.app-footer-gallery{width:calc(100% - 24px);grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:42px}.app-footer-gallery img{aspect-ratio:1/1}.app-footer-qomfort{grid-template-columns:1fr;gap:34px}.app-footer-qomfort>section:last-child{grid-column:auto}.app-footer-feature{order:-1}.app-footer-feature h2{font-size:30px}}

.app-site-topbar,
.app-tabbar,
.app-menu-sheet {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.app-site-topbar {
  position: sticky;
  top: 0;
  z-index: 70;
  width: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px clamp(16px, 3vw, 34px);
  border-radius: 0;
  background: rgba(0, 0, 0, .50);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .2);
  border-left: 0;
  border-right: 0;
  border-top: 0;
  box-shadow: 0 18px 54px rgba(0, 0, 0, .20);
  backdrop-filter: blur(8px) saturate(115%);
  -webkit-backdrop-filter: blur(8px) saturate(115%);
}

.app-site-topbar .app-top-brand {
  min-width: 0;
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: inherit;
  font-weight: 950;
  text-decoration: none;
}

.app-site-topbar .app-top-mark {
  width: 204px;
  height: 56px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 0;
  background: transparent url("logo-gites-colmar-anime-dark.svg?v=20260708dark3") center / contain no-repeat;
  color: transparent;
  font-size: 0;
  font-weight: 950;
  box-shadow: none;
  filter: none;
}

.app-site-topbar .app-top-text {
  min-width: 0;
  display: grid;
  line-height: 1.1;
}

.app-site-topbar .app-top-text strong,
.app-site-topbar .app-top-text small {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.app-site-topbar .app-top-text small {
  color: rgba(255, 255, 255, .72);
  font-size: 12px;
  font-weight: 750;
}

.app-site-topbar nav {
  display: flex;
  align-items: center;
  gap: 6px;
}

.app-site-topbar nav a {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  padding: 0 12px;
  color: rgba(255, 255, 255, .88);
  background: rgba(255, 255, 255, .08);
  font-size: 14px;
  font-weight: 850;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.app-site-topbar nav a.app-top-cta {
  background: rgba(255,138,0,.92);
  color: #fff;
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.16);
}

.app-top-menu-btn {
  width: auto !important;
  min-width: 92px;
  max-width: 104px;
  height: 44px !important;
  min-height: 44px !important;
  display: none;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  border: 0 !important;
  border-radius: 16px;
  padding: 0 16px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
  font: inherit;
  font-size: 13px;
  font-weight: 950;
}

.app-tabbar {
  --active-index: 0;
  position: fixed;
  z-index: 120;
  left: max(8px, env(safe-area-inset-left));
  right: max(8px, env(safe-area-inset-right));
  bottom: max(8px, env(safe-area-inset-bottom));
  width: auto;
  min-height: 70px;
  transform: none;
  display: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  padding: 6px;
  overflow: hidden;
  isolation: isolate;
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .62), rgba(244, 246, 249, .30) 48%, rgba(220, 225, 231, .25));
  border: 1px solid rgba(255, 255, 255, .72);
  box-shadow:
    0 16px 42px rgba(0, 0, 0, .24),
    0 2px 10px rgba(0, 0, 0, .10),
    inset 0 1px 0 rgba(255, 255, 255, .92),
    inset 0 -1px 0 rgba(255, 255, 255, .28);
  backdrop-filter: blur(30px) saturate(180%) contrast(104%);
  -webkit-backdrop-filter: blur(30px) saturate(180%) contrast(104%);
  transition: opacity .22s ease, transform .22s ease, background-color .18s ease;
}

.app-tabbar::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 6px;
  top: 6px;
  bottom: 6px;
  width: calc((100% - 12px) / 5);
  border-radius: 22px !important;
  background:
    linear-gradient(155deg, rgba(255, 255, 255, .82), rgba(255, 255, 255, .37) 58%, rgba(255, 255, 255, .18));
  border: 1px solid rgba(255, 255, 255, .78);
  box-shadow:
    0 8px 20px rgba(26, 32, 40, .15),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    inset 0 -1px 0 rgba(255, 255, 255, .30);
  transform: translateX(calc(var(--active-index) * 100%));
  transition: transform .42s cubic-bezier(.22, .86, .24, 1);
  pointer-events: none;
}

.app-tabbar::after {
  content: "";
  position: absolute;
  z-index: 0;
  left: 18px;
  right: 18px;
  top: 1px;
  height: 30px;
  border-radius: 28px 28px 50% 50%;
  background: linear-gradient(180deg, rgba(255, 255, 255, .54), rgba(255, 255, 255, 0));
  pointer-events: none;
}

html body .app-tabbar a,
html body .app-tabbar button {
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: 58px;
  border: 0 !important;
  border-radius: 22px !important;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 3px;
  padding: 5px 2px 4px !important;
  background: transparent !important;
  color: rgba(27, 30, 35, .76) !important;
  box-shadow: none !important;
  font: inherit;
  font-size: 10px;
  line-height: 1;
  font-weight: 750;
  letter-spacing: 0;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .38);
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: color .22s ease, transform .16s ease;
}

html body .app-tabbar a:active,
html body .app-tabbar button:active {
  transform: scale(.93);
}

html body .app-tabbar a:focus-visible,
html body .app-tabbar button:focus-visible {
  outline: 2px solid rgba(255, 138, 0, .92);
  outline-offset: -3px;
}

.app-tabbar svg {
  width: 25px;
  height: 25px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .72));
  transition: color .22s ease, transform .28s cubic-bezier(.22, .86, .24, 1);
}

.app-tabbar .app-active {
  color: #16181c !important;
  font-weight: 850;
}

.app-tabbar .app-active svg {
  color: #d96f00;
  transform: translateY(-1px) scale(1.04);
}

.app-tabbar .app-book {
  color: rgba(31, 34, 39, .72) !important;
}

.app-tabbar .app-book .app-icon-bubble {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  margin: 0;
  border-radius: 12px;
  background: rgba(255, 138, 0, .16);
  border: 1px solid rgba(255, 169, 67, .46);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .62),
    0 4px 12px rgba(216, 106, 0, .13);
}

.app-tabbar .app-book svg {
  width: 21px;
  height: 21px;
  color: #b95f00;
}

.app-tabbar .app-book.app-active .app-icon-bubble {
  background: rgba(255, 138, 0, .26);
  border-color: rgba(255, 157, 39, .64);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .72),
    0 6px 16px rgba(216, 106, 0, .18);
}

.app-menu-backdrop {
  position: fixed;
  inset: 0;
  z-index: 118;
  display: none;
  background: rgba(0, 0, 0, .36);
}

.app-menu-backdrop.open {
  display: block;
}

.app-menu-sheet {
  position: fixed;
  z-index: 119;
  left: 50%;
  bottom: max(92px, calc(82px + env(safe-area-inset-bottom)));
  width: min(calc(100vw - 18px), 430px);
  max-height: min(72vh, 620px);
  overflow: auto;
  transform: translate(-50%, 18px);
  opacity: 0;
  pointer-events: none;
  padding: 14px;
  border-radius: 26px;
  background: rgba(10, 10, 10, .94);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 24px 74px rgba(0, 0, 0, .48);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  transition: opacity .22s ease, transform .22s ease;
}

.app-menu-sheet.open {
  opacity: 1;
  pointer-events: auto;
  transform: translate(-50%, 0);
}

.app-menu-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.app-menu-head strong {
  display: block;
  font-size: 17px;
}

.app-menu-head small {
  color: rgba(255, 255, 255, .66);
  font-weight: 750;
}

.app-menu-close {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 15px;
  background: rgba(255, 255, 255, .10);
  color: #fff;
  font-size: 22px;
  font-weight: 900;
}

.app-menu-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.app-menu-grid a {
  min-height: 56px;
  display: grid;
  align-content: center;
  gap: 4px;
  border-radius: 18px;
  padding: 11px 12px;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  text-decoration: none;
  font-weight: 900;
}

.app-menu-grid a small {
  color: rgba(255, 255, 255, .60);
  font-size: 11px;
  font-weight: 750;
}

.app-menu-grid a.primary {
  background: var(--app-orange);
  color: #111;
}

.app-menu-grid a.primary small {
  color: rgba(0, 0, 0, .64);
}

.app-menu-section {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.app-menu-section span {
  display: block;
  margin-bottom: 8px;
  color: rgba(255, 255, 255, .58);
  font-size: 11px;
  font-weight: 950;
  text-transform: uppercase;
}

.app-lang-row {
  display: flex;
  gap: 7px;
  overflow-x: auto;
  padding-bottom: 3px;
}

.app-lang-row a {
  flex: 0 0 auto;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  padding: 0 11px;
  background: rgba(255, 255, 255, .09);
  color: #fff;
  font-weight: 900;
  text-decoration: none;
}

.app-lang-row a.active {
  background: var(--app-orange);
  color: #111;
}

@media (max-width: 760px) {
  html {
    overflow-x: hidden;
  }

  body {
    overflow-x: hidden;
    padding-bottom: 98px;
  }

  input,
  select,
  textarea {
    font-size: 16px !important;
  }

  #gite-arrivee,
  #gite-depart,
  #res-arrivee,
  #res-depart,
  .date-input {
    font-size: 16px !important;
    touch-action: manipulation !important;
    -webkit-text-size-adjust: 100% !important;
  }

  .mobile-nav {
    display: none !important;
  }

  .app-tabbar {
    display: grid;
  }

  .app-site-topbar,
  .simple-nav {
    top: 8px !important;
    width: calc(100% - 16px) !important;
    margin-top: 8px !important;
    padding: 8px !important;
    border-radius: 22px !important;
  }

  .app-site-topbar {
    align-items: center;
  }

  .app-site-topbar .app-top-mark {
    width: 132px;
    height: 39px;
  }

  .app-site-topbar nav {
    display: none;
  }

  .app-top-menu-btn {
    display: inline-flex;
    flex: 0 0 auto;
    margin-left: auto;
  }

  .simple-nav {
    display: grid !important;
    gap: 8px !important;
    align-items: start !important;
  }

  .simple-nav .brand {
    min-width: 0;
  }

  .simple-nav .brand span:last-child {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .simple-nav nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    overflow-x: auto !important;
    padding-bottom: 2px !important;
    scrollbar-width: none;
  }

  .simple-nav nav::-webkit-scrollbar {
    display: none;
  }

  .simple-nav nav a,
  .simple-nav nav summary {
    flex: 0 0 auto;
    min-height: 38px !important;
    border-radius: 14px !important;
    padding: 0 11px !important;
    font-size: 12px !important;
    white-space: nowrap;
  }

  .page-hero {
    min-height: 66svh !important;
    margin-top: -96px !important;
    padding: 170px 0 38px !important;
  }

  .page-hero h1 {
    max-width: 100%;
    font-size: clamp(31px, 9vw, 42px) !important;
    line-height: 1.03 !important;
  }

  .page-hero p {
    font-size: 15px !important;
    line-height: 1.52 !important;
  }

  .band {
    padding: 42px 0 !important;
  }

  .section-head h2,
  .video-copy h2 {
    font-size: clamp(27px, 8vw, 36px) !important;
  }

  .card,
  .gallery-feature-photo,
  .gallery-feature-copy,
  .video-frame {
    border-radius: 18px !important;
  }

  .gallery-feature-copy {
    padding: 16px !important;
  }

  .gallery-kpis {
    grid-template-columns: 1fr !important;
  }

  .gallery-item,
  .gallery-item img {
    min-height: 235px !important;
  }

  footer {
    padding-bottom: 122px !important;
  }

  .contact-float {
    bottom: 102px !important;
  }

  .booking-card .form-grid {
    align-items: stretch !important;
  }

  .booking-card .quick-field,
  .booking-card .quick-field.full {
    position: relative !important;
    display: block !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .booking-card .quick-field.full {
    grid-column: 1 / -1 !important;
    margin-bottom: 8px !important;
  }

  .booking-card .quick-field::before {
    top: 50% !important;
    width: 32px !important;
    height: 32px !important;
    transform: translateY(-50%) !important;
  }

  .booking-card .quick-field::after {
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  .booking-card .quick-field span {
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  .booking-card .quick-field input,
  .booking-card .quick-field select {
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    font-size: 16px !important;
    margin: 0 !important;
    border-radius: 16px !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    vertical-align: top !important;
  }

  .booking-card .quick-field select {
    background-image: linear-gradient(45deg, transparent 50%, rgba(255,255,255,.92) 50%), linear-gradient(135deg, rgba(255,255,255,.92) 50%, transparent 50%) !important;
    background-position: calc(100% - 16px) 19px, calc(100% - 11px) 19px !important;
    background-size: 5px 5px, 5px 5px !important;
    background-repeat: no-repeat !important;
  }

  .booking-card .quick-logement select {
    padding-left: 116px !important;
    padding-right: 26px !important;
  }

  .booking-card .quick-arrivee input,
  .booking-card .quick-depart input {
    padding-left: 96px !important;
    padding-right: 10px !important;
  }

  .booking-card .quick-adultes select,
  .booking-card .quick-enfants select {
    padding-left: 88px !important;
    padding-right: 26px !important;
  }

  html body .flatpickr-calendar.app-price-calendar.open {
    position: fixed !important;
    left: max(4px, env(safe-area-inset-left)) !important;
    right: max(4px, env(safe-area-inset-right)) !important;
    top: auto !important;
    bottom: max(92px, calc(82px + env(safe-area-inset-bottom))) !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    max-height: min(640px, calc(100dvh - 104px)) !important;
    padding: 8px 8px 11px !important;
    border-radius: 28px !important;
    transform: none !important;
    background: rgba(18, 18, 18, .88) !important;
    border: 1px solid rgba(255, 255, 255, .24) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .46), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
    backdrop-filter: blur(26px) saturate(165%) !important;
    -webkit-backdrop-filter: blur(26px) saturate(165%) !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    z-index: 240 !important;
  }

  html body .flatpickr-calendar.app-price-calendar,
  html body .flatpickr-calendar.app-price-calendar *,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-innerContainer,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-rContainer,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-days,
  html body .flatpickr-calendar.app-price-calendar .dayContainer {
    background-color: transparent !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-months,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-month,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-weekdays,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-weekdaycontainer {
    background: rgba(255, 255, 255, .08) !important;
    border-radius: 18px !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-months {
    min-height: 48px !important;
    margin-bottom: 8px !important;
    display: flex !important;
    align-items: center !important;
    overflow: visible !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-current-month,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-current-month input.cur-year,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-monthDropdown-months,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-monthDropdown-month,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-weekday {
    background: transparent !important;
    color: rgba(255, 255, 255, .88) !important;
    fill: rgba(255, 255, 255, .88) !important;
    font-size: 13px !important;
    letter-spacing: 0 !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-current-month {
    position: static !important;
    width: auto !important;
    height: auto !important;
    left: auto !important;
    padding: 0 !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex: 1 1 auto !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-current-month .flatpickr-monthDropdown-months {
    width: auto !important;
    min-width: 102px !important;
    padding: 0 4px !important;
    text-align: center !important;
  }

  html body .flatpickr-calendar.app-price-calendar .numInputWrapper {
    width: 74px !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-current-month input.cur-year,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-monthDropdown-months {
    font-size: 16px !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-prev-month svg,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-next-month svg {
    fill: #fff !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-innerContainer,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-rContainer,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-days,
  html body .flatpickr-calendar.app-price-calendar .dayContainer {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  html body .flatpickr-calendar.app-price-calendar .dayContainer {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 2px 0 !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day {
    flex: 0 0 calc(100% / 7) !important;
    width: calc(100% / 7) !important;
    max-width: none !important;
    height: 50px !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    border-radius: 14px !important;
    border: 1px solid transparent !important;
    color: #fff !important;
    font-size: 16px !important;
    line-height: 1 !important;
    font-weight: 900 !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day:hover,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.selected,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.startRange,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.endRange {
    background: rgba(255, 255, 255, .20) !important;
    border-color: rgba(255, 255, 255, .30) !important;
    color: #fff !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.priced-day {
    background: rgba(255, 255, 255, .08) !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day .day-price,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day .day-status {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 9px !important;
    line-height: 1 !important;
    font-weight: 950 !important;
    color: rgba(255, 255, 255, .68) !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day .day-price.price-low {
    color: #68e6a1 !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day .day-price.price-high {
    color: #ffb15a !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.selected .day-price,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day:hover .day-price,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.selected .day-status,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day:hover .day-status {
    color: #fff !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.reserved-day,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.flatpickr-disabled.reserved-day,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.pending-day,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.flatpickr-disabled.pending-day {
    background: rgba(255, 255, 255, .12) !important;
    border-color: rgba(255, 255, 255, .18) !important;
    opacity: .72 !important;
  }

  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.reserved-day .day-status,
  html body .flatpickr-calendar.app-price-calendar .flatpickr-day.pending-day .day-status {
    color: rgba(255, 255, 255, .74) !important;
  }

  body:has(.flatpickr-calendar.app-price-calendar.open) .app-tabbar {
    opacity: 0;
    pointer-events: none;
    transform: translateY(18px) scale(.96);
  }
}

/* Unified iOS-style mobile tab bar: every destination has equal visual weight. */
@media (max-width: 760px) {
  html body .app-tabbar {
    left: 0 !important;right: 0 !important;bottom: 0 !important;width: 100% !important;
    min-height: 70px !important;margin: 0 !important;
    padding: 6px max(8px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)) !important;
    gap: 0 !important;overflow: hidden !important;
    border: 1px solid rgba(255,255,255,.34) !important;border-bottom: 0 !important;
    border-radius: 24px 24px 0 0 !important;
    background: linear-gradient(180deg,rgba(39,42,48,.68),rgba(14,16,20,.88)) !important;
    box-shadow: 0 -10px 34px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.34) !important;
    backdrop-filter: blur(30px) saturate(190%) contrast(105%) !important;
    -webkit-backdrop-filter: blur(30px) saturate(190%) contrast(105%) !important
  }
  html body .app-tabbar::before {
    left: max(8px, env(safe-area-inset-left)) !important;top: 6px !important;
    bottom: max(6px, env(safe-area-inset-bottom)) !important;
    width: calc((100% - 16px) / 5) !important;
    border-radius: 17px !important;
    background: linear-gradient(155deg,rgba(255,255,255,.24),rgba(255,255,255,.10)) !important;
    border: 1px solid rgba(255,255,255,.30) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.28),0 5px 16px rgba(0,0,0,.18) !important
  }
  html body .app-tabbar::after {
    left: 14px !important;right: 14px !important;top: 1px !important;height: 22px !important;
    background: linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,0)) !important
  }
  html body .app-tabbar a,html body .app-tabbar button,
  html body .app-tabbar .app-book {
    min-height: 56px !important;padding: 5px 2px 4px !important;gap: 3px !important;
    border-radius: 17px !important;background: transparent !important;
    color: rgba(238,241,246,.68) !important;
    font-size: 9.5px !important;font-weight: 700 !important;text-shadow: 0 1px 2px rgba(0,0,0,.34) !important
  }
  html body .app-tabbar .app-active,
  html body .app-tabbar [aria-current="page"],
  html body .app-tabbar .app-book.app-active {color:#fff !important;font-weight:800 !important}
  html body .app-tabbar svg,
  html body .app-tabbar .app-book svg {
    width:24px !important;height:24px !important;color:inherit !important;
    stroke:currentColor !important;stroke-width:1.9 !important;fill:none !important;
    filter:drop-shadow(0 1px 2px rgba(0,0,0,.42)) !important
  }
  html body .app-tabbar .app-active svg {color:#ff941f !important;transform:translateY(-1px) scale(1.04) !important}
  html body .app-tabbar .app-icon-bubble {
    display:contents !important;width:auto !important;height:auto !important;
    background:none !important;border:0 !important;box-shadow:none !important
  }
}

@media (max-width: 420px) {
  .app-site-topbar .app-top-text {
    display: none;
  }

  .app-site-topbar .app-top-mark {
    width: 142px;
  }

  .app-tabbar {
    left: max(6px, env(safe-area-inset-left));
    right: max(6px, env(safe-area-inset-right));
    bottom: max(6px, env(safe-area-inset-bottom));
    min-height: 68px;
    padding: 5px;
    border-radius: 26px;
  }

  .app-tabbar::before {
    left: 5px;
    top: 5px;
    bottom: 5px;
    width: calc((100% - 10px) / 5);
    border-radius: 21px;
  }

  .app-tabbar a,
  .app-tabbar button {
    min-height: 56px;
    font-size: 9.5px;
  }

  .app-tabbar svg {
    width: 24px;
    height: 24px;
  }

  .app-tabbar .app-book .app-icon-bubble {
    width: 29px;
    height: 29px;
    border-radius: 11px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-tabbar,
  .app-tabbar::before,
  .app-tabbar a,
  .app-tabbar button,
  .app-tabbar svg {
    transition: none !important;
  }
}

@media (prefers-contrast: more) {
  .app-tabbar {
    background: rgba(245, 247, 250, .94);
    border-color: #fff;
  }

  .app-tabbar a,
  .app-tabbar button {
    color: #30343a;
  }
}

@media (max-width: 760px) {
  .booking-card .quick-adultes span,
  .booking-card .quick-enfants span {
    left: 46px !important;
    width: 68px !important;
    font-size: 11px !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
  }

  .booking-card .quick-adultes select,
  .booking-card .quick-enfants select {
    padding-left: 118px !important;
    padding-right: 32px !important;
    text-align: right !important;
    line-height: 44px !important;
  }

  .booking-card .quick-adultes .quick-select-display,
  .booking-card .quick-enfants .quick-select-display {
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 32px 0 118px !important;
    justify-content: flex-end !important;
    font-size: 16px !important;
    line-height: 1 !important;
  }

  .booking-card .quick-adultes .quick-select-value,
  .booking-card .quick-enfants .quick-select-value {
    display: inline-flex !important;
    min-width: 28px !important;
    justify-content: center !important;
    margin-left: 14px !important;
  }
}

/* Show only the active month; adjacent-month cells keep their grid space invisibly. */
html body .flatpickr-calendar.app-price-calendar .flatpickr-day.prevMonthDay,
html body .flatpickr-calendar.app-price-calendar .flatpickr-day.nextMonthDay {
  visibility: hidden !important;
  pointer-events: none !important;
}

html body .flatpickr-calendar.app-price-calendar .flatpickr-day.prevMonthDay *,
html body .flatpickr-calendar.app-price-calendar .flatpickr-day.nextMonthDay * {
  visibility: hidden !important;
}