/* Design « Chalet » : un chalet d'alpage (madriers de mélèze, balcons découpés, laine à carreaux, sommets enneigés et coin du feu). Zilla Slab + Work Sans. */
.d-chalet {
  --larch: #b47b47;
  --larch-d: #6f4628;
  --bark: #3d2a1c;
  --pine: #2e4a3d;
  --snow: #fbfaf7;
  --wool: color-mix(in oklab, var(--primary), #3a1d12 15%);
  /* Bardage : planches verticales de mélèze */
  --planks: repeating-linear-gradient(90deg, rgba(0, 0, 0, .22) 0 2px, transparent 2px 38px), repeating-linear-gradient(90deg, rgba(255, 255, 255, .06) 0 19px, transparent 19px 38px),
    repeating-linear-gradient(180deg, rgba(60, 30, 10, .07) 0 1px, transparent 1px 9px), var(--larch);
  /* Laine à carreaux */
  --tartan: repeating-linear-gradient(90deg, rgba(0, 0, 0, .28) 0 14px, transparent 14px 30px, rgba(255, 255, 255, .12) 30px 33px, transparent 33px 56px),
    repeating-linear-gradient(0deg, rgba(0, 0, 0, .28) 0 14px, transparent 14px 30px, rgba(255, 255, 255, .12) 30px 33px, transparent 33px 56px), var(--wool);
  /* Rondelle de bois : cernes et écorce */
  --log: repeating-radial-gradient(circle, #d8ae78 0 2px, #c99a62 2px 5px), #c99a62;
  --bg: #f7f2ea;
  --bg-soft: #efe6d8;
  --surface: #fffdf9;
  --ink: #2b211a;
  --ink-2: #56473b;
  --ink-3: #76675a;
  --line: #e3d7c5;
  --head-w: 700;
  --h1-w: 700;
  --head-track: -.01em;
  --h1-track: -.02em;
  --btn-r: 10px;
  --footer-bg: var(--bark);
}

/* Boutons */
.d-chalet .btn-primary { background: var(--wool); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .25), 0 8px 18px -8px rgba(60, 25, 10, .6); }
.d-chalet .btn-primary:hover { background: color-mix(in oklab, var(--wool), #000 15%); }
.d-chalet .btn-ghost { background: var(--surface); border: 2px solid var(--larch); color: var(--bark); }

/* Annonce, en-tête et lambrequin découpé sous l'avant-toit */
.d-chalet .announce { background: var(--tartan); background-size: auto; text-shadow: 0 1px 2px rgba(0, 0, 0, .4); }
.d-chalet .site-header { background: #fffaf2; border-bottom: 0; }
.d-chalet .site-header::after { content: ''; position: absolute; left: 0; right: 0; top: 100%; height: 16px; background: var(--larch-d); pointer-events: none;
  mask: radial-gradient(circle 9px at 50% 0, #000 96%, #0000) 0 7px / 22px 9px repeat-x, linear-gradient(#000 0 0) 0 0 / 100% 7px no-repeat; }
.d-chalet .brand-mark { border-radius: 50%; background: var(--log); color: var(--bark); box-shadow: inset 0 0 0 4px var(--bark), 0 4px 10px -4px rgba(0, 0, 0, .4); }
.d-chalet .brand-text strong { font-size: 1.3rem; }
.d-chalet .brand-stars { color: #c4892f; }
.d-chalet .nav a { font-weight: 600; color: var(--ink-2); }
.d-chalet .nav a:hover { background: var(--bg-soft); color: var(--wool); }

/* Bannière : sommets au crépuscule, sapins et chalet éclairé */
.d-chalet .hero { background: radial-gradient(800px 420px at 90% 0, color-mix(in oklab, var(--primary), transparent 88%), transparent 70%), var(--bg); padding-bottom: 130px; }
.d-chalet .hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 64px; border-top: 8px solid var(--larch-d);
  background: repeating-linear-gradient(90deg, var(--larch) 0 26px, var(--larch-d) 26px 28px);
  mask: radial-gradient(ellipse 5px 10px at 13px 24px, #0000 95%, #000) 0 0 / 28px 100%, radial-gradient(circle 4px at 13px 42px, #0000 95%, #000) 0 0 / 28px 100%; mask-composite: intersect; }
.d-chalet .hero h1 { font-size: clamp(2.5rem, 5vw, 4.2rem); line-height: 1.02; }
.d-chalet .pill-badge { border-radius: 8px; background: var(--surface); border: 0; border-left: 5px solid var(--wool); color: var(--wool); }
.d-chalet .pill-badge .dot { background: var(--wool); box-shadow: 0 0 0 4px color-mix(in oklab, var(--wool), transparent 80%); }
.d-chalet .hero-art { border-radius: 16px; border: 12px solid var(--larch-d); box-shadow: var(--shadow-lg), inset 0 0 0 2px rgba(0, 0, 0, .25);
  background: radial-gradient(circle 1.5px at 20% 14%, #fff 98%, transparent), radial-gradient(circle 1px at 42% 8%, #fff 98%, transparent), radial-gradient(circle 1.5px at 58% 20%, #fff 98%, transparent), radial-gradient(circle 1px at 12% 30%, #fff 98%, transparent),
    radial-gradient(60% 10% at 30% 100%, #fff 98%, transparent), linear-gradient(transparent 83%, #eef0f0 83%),
    conic-gradient(from 152deg at 50% 0, #4a6a63 0 56deg, transparent 0) 12px 66% / 30px 56px repeat-x,
    conic-gradient(from 135deg at 28% 0, #fbe6dc 0 90deg, transparent 0) 0 40% / 100% 10% no-repeat,
    conic-gradient(from 135deg at 28% 40%, #6c7a8c 0 90deg, transparent 0),
    conic-gradient(from 140deg at 70% 0, #f7d9cf 0 80deg, transparent 0) 0 26% / 100% 11% no-repeat,
    conic-gradient(from 140deg at 70% 26%, #8995a6 0 80deg, transparent 0),
    linear-gradient(color-mix(in oklab, var(--primary), #1b2a44 78%), #5b5f80 45%, #e8a98a 72%); }
.d-chalet .hero-art::before { inset: auto 0 16.5% 0; height: 20%; background: conic-gradient(from 150deg at 50% 0, var(--pine) 0 60deg, transparent 0) 10px 0 / 46px 100% repeat-x; }
.d-chalet .art-ring.r2, .d-chalet .art-pill { display: none; }
.d-chalet .art-ring.r1 { width: 13%; left: 82%; top: 16%; border: 0; background: #fdf3dc; box-shadow: 0 0 30px 8px rgba(253, 243, 220, .35); }
.d-chalet .art-cross { top: auto; bottom: 13%; translate: -50% 0; width: 44%; aspect-ratio: 1 / .82; border-radius: 0; border: 0; backdrop-filter: none; place-items: start center; padding-top: 11%;
  background: linear-gradient(to bottom right, #fbfaf7 0 56%, transparent 56.5%) 0 0 / 50.5% 36% no-repeat, linear-gradient(to bottom left, #fbfaf7 0 56%, transparent 56.5%) 100% 0 / 50.5% 36% no-repeat,
    linear-gradient(transparent 36%, rgba(0, 0, 0, .3) 36% 39%, transparent 39%), var(--planks); clip-path: polygon(50% 0, 100% 36%, 91% 36%, 91% 100%, 9% 100%, 9% 36%, 0 36%); }
.d-chalet .art-cross::before { content: ''; position: absolute; left: 24%; right: 24%; top: 48%; height: 26%; border: 4px solid var(--bark); border-radius: 2px;
  background: linear-gradient(90deg, transparent 47%, var(--bark) 47% 53%, transparent 53%), radial-gradient(circle at 50% 70%, #ffe2a0, #f0a64c); box-shadow: 0 0 24px 6px rgba(255, 196, 110, .5); }
.d-chalet .art-cross::after { content: ''; position: absolute; left: 9%; right: 9%; bottom: 0; height: 14%; background: repeating-linear-gradient(90deg, var(--larch-d) 0 7px, transparent 7px 13px), var(--bark) 0 0 / 100% 3px no-repeat; }
.d-chalet .art-cross .ic { width: 18%; height: auto; stroke: #fdf3dc; filter: none; }
.d-chalet .float-card { border-radius: 12px; border-top: 5px solid var(--wool); }

/* Points forts : l'enseigne posée sur le balcon */
.d-chalet .highlights { margin-top: -40px; }
.d-chalet .hl-grid { border-radius: 14px; border: 0; box-shadow: var(--shadow-lg), inset 0 6px 0 var(--wool); }
.d-chalet .hl-item { padding-top: 30px; }
.d-chalet .hl-item strong { font-family: var(--font-head); font-size: 1.08rem; }
.d-chalet .ic-box { border-radius: 50%; background: var(--log); color: var(--bark); box-shadow: inset 0 0 0 4px var(--larch-d); }

/* Titres : un petit sapin au-dessus du sur-titre */
.d-chalet .eyebrow { color: var(--wool); letter-spacing: .16em; }
.d-chalet .sec-head.center .eyebrow::before { content: ''; display: block; width: 26px; height: 22px; margin: 0 auto 10px; background: var(--pine); clip-path: polygon(50% 0, 75% 40%, 64% 40%, 90% 82%, 56% 82%, 56% 100%, 44% 100%, 44% 82%, 10% 82%, 36% 40%, 25% 40%); }
.d-chalet .sec-head h2 { font-size: clamp(2rem, 3.6vw, 2.9rem); }

/* Chambres : cadres de bois, vue sur les sommets */
.d-chalet .pj-chip { border-radius: 10px; }
.d-chalet .pj-chip.on, .d-chalet .pj-pager button.on { background: var(--wool); border-color: var(--wool); }
.d-chalet .room { border-radius: 14px; border: 0; box-shadow: var(--shadow-sm); }
.d-chalet .room-img { border: 10px solid var(--larch-d); border-bottom-width: 14px; border-radius: 14px 14px 0 0; }
.d-chalet .room-ph { color: rgba(255, 253, 249, .9);
  background: linear-gradient(transparent 86%, #f2f2f0 86%), conic-gradient(from 152deg at 50% 0, #2a4438 0 56deg, transparent 0) 0 84% / 18px 30px repeat-x,
    conic-gradient(from 135deg at 34% 0, #fbe6dc 0 90deg, transparent 0) 0 22% / 100% 9% no-repeat, conic-gradient(from 135deg at 34% 22%, #77859a 0 90deg, transparent 0),
    conic-gradient(from 135deg at 74% 0, #fff 0 90deg, transparent 0) 0 34% / 100% 8% no-repeat, conic-gradient(from 135deg at 74% 34%, #95a1b2 0 90deg, transparent 0),
    linear-gradient(color-mix(in oklab, var(--primary), #6e8fb0 75%), #e9d3c3 70%); }
.d-chalet .room-ph::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent calc(50% - 4px), var(--larch-d) 0 calc(50% + 4px), transparent 0), linear-gradient(transparent calc(45% - 4px), var(--larch-d) 0 calc(45% + 4px), transparent 0); }
.d-chalet .room-ph .ic { display: none; }
.d-chalet .room-price { top: 22px; right: 22px; border-radius: 6px; background: var(--bark); color: #fdf3dc; box-shadow: 0 6px 14px -6px rgba(0, 0, 0, .6); font-family: var(--font-head); }
.d-chalet .room-cat { color: var(--wool); }
.d-chalet .room h3 { font-size: 1.35rem; }
.d-chalet .room-facts .ic { color: var(--larch-d); }
.d-chalet .room-book { color: var(--wool); }

/* La carte : feuille crème posée sur une planche de mélèze */
.d-chalet .menu-sec { background: var(--bg-soft); }
.d-chalet .menu-board { border: 0; border-radius: 18px; background: var(--planks); padding: clamp(14px, 2.5vw, 26px); box-shadow: var(--shadow-lg); }
.d-chalet .menu-groups { background: var(--surface); border-radius: 10px; padding: clamp(26px, 4.5vw, 52px); box-shadow: 0 0 0 3px rgba(61, 42, 28, .35); }
.d-chalet .menu-group h3 { color: var(--wool); border-bottom: 3px double var(--line); font-size: 1.5rem; }
.d-chalet .menu-group h3::before { content: '✻ '; color: var(--larch); }
.d-chalet .dish-line strong { font-family: var(--font-head); font-size: 1.08rem; }
.d-chalet .dish-price { color: var(--wool); font-family: var(--font-head); font-size: 1.08rem; }
.d-chalet .menu-note { display: table; margin: 18px auto 0; padding: .45em 1.1em; border-radius: 6px; background: var(--bark); color: #fdf3dc; }

/* Services : plaid à carreaux au liseré */
.d-chalet .card { border-radius: 14px; border: 0; box-shadow: var(--shadow-sm); padding-top: 40px; }
.d-chalet .card::before { content: ''; position: absolute; inset: 0 0 auto; height: 12px; background: var(--tartan); background-size: auto; }
.d-chalet .card::after { background: var(--larch); }
.d-chalet .card h3 { font-size: 1.25rem; }
.d-chalet .card:hover .ic-box { background: var(--log); color: var(--wool); }

/* L'établissement : un pan de bardage avec son enseigne */
.d-chalet .about-art { padding-bottom: 22%; border-radius: 16px; border: 0; background: var(--planks); color: var(--bark); box-shadow: var(--shadow-lg); position: relative; overflow: hidden; }
.d-chalet .about-art::before { content: ''; position: absolute; inset: 0 0 auto; height: 18px; background: var(--larch-d); mask: radial-gradient(circle 9px at 50% 0, #000 96%, #0000) 0 9px / 22px 9px repeat-x, linear-gradient(#000 0 0) 0 0 / 100% 9px no-repeat; }
.d-chalet .about-art::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; border-top: 10px solid var(--bark);
  background: repeating-linear-gradient(90deg, #8a5a33 0 26px, var(--bark) 26px 28px);
  mask: radial-gradient(ellipse 5px 11px at 13px 40%, #0000 95%, #000) 0 0 / 28px 100%, radial-gradient(circle 4px at 13px 68%, #0000 95%, #000) 0 0 / 28px 100%; mask-composite: intersect; }
.d-chalet .about-art .ic { width: 32%; padding: 6%; border-radius: 50%; background: var(--log); box-shadow: inset 0 0 0 8px var(--bark), 0 14px 26px -10px rgba(0, 0, 0, .6); stroke: var(--bark); opacity: 1; }
.d-chalet .about-art-name { background: var(--bark); color: #fdf3dc; padding: .35em 1.1em; border-radius: 6px; box-shadow: 0 10px 20px -10px rgba(0, 0, 0, .7), inset 0 0 0 2px rgba(253, 243, 220, .2); }
.d-chalet .stats div { border: 0; border-top: 5px solid var(--larch); border-radius: 10px; }
.d-chalet .stats dt { color: var(--wool); }

/* Labels, avis */
.d-chalet .trust-item { border: 0; border-radius: 14px; box-shadow: var(--shadow-sm); border-left: 6px solid var(--larch); }
.d-chalet .trust-item h3, .d-chalet .member strong, .d-chalet .review figcaption strong { font-family: var(--font-head); font-size: 1.15rem; }
.d-chalet .review { position: relative; border: 0; border-radius: 14px; box-shadow: var(--shadow-sm); overflow: hidden; }
.d-chalet .review::before { content: '“'; position: absolute; right: 18px; top: -4px; font: 700 5rem/1 var(--font-head); color: color-mix(in oklab, var(--primary), transparent 82%); }
.d-chalet .review blockquote { font-size: 1.04rem; color: var(--ink); }
.d-chalet .stars { color: #c4892f; }
.d-chalet .review .avatar { background: var(--log); border: 3px solid var(--bark); }
.d-chalet .review .avatar span { color: var(--bark); }

/* Encadré : le plaid au coin du feu */
.d-chalet .cta { border-radius: 18px; background: radial-gradient(500px 300px at 100% 120%, rgba(255, 170, 80, .35), transparent 70%), var(--tartan); box-shadow: var(--shadow-lg), inset 0 0 0 8px rgba(0, 0, 0, .18); }
.d-chalet .cta h2 { font-size: clamp(1.7rem, 3vw, 2.4rem); text-shadow: 0 2px 6px rgba(0, 0, 0, .35); }
.d-chalet .cta p { opacity: 1; text-shadow: 0 1px 3px rgba(0, 0, 0, .4); }
.d-chalet .cta .btn-white { color: var(--wool); }

/* Équipe : portraits dans une rondelle de bois */
.d-chalet .member .avatar { border-radius: 50%; border: 10px solid var(--bark); background: var(--log); box-shadow: var(--shadow); max-width: 220px; margin: 0 auto 16px; }
.d-chalet .member .avatar span { color: var(--bark); }

/* Réservation, panneaux */
.d-chalet .quote-sec, .d-chalet .visit { background: var(--bg-soft); }
.d-chalet .panel { border: 0; border-top: 10px solid var(--larch-d); border-radius: 14px; box-shadow: var(--shadow); }
.d-chalet .panel-head > .ic, .d-chalet .quote-points .ic { border-radius: 50%; background: var(--log); color: var(--bark); box-shadow: inset 0 0 0 3px var(--larch-d); }
.d-chalet .f-field input, .d-chalet .f-field select, .d-chalet .f-field textarea { background: #fffaf2; border-color: #dccbb3; }
.d-chalet .f-field input:focus, .d-chalet .f-field select:focus, .d-chalet .f-field textarea:focus { border-color: var(--larch-d); box-shadow: 0 0 0 3px rgba(180, 123, 71, .25); }
.d-chalet .status-line { background: var(--bg); }
.d-chalet .map { border-radius: 14px; border: 8px solid var(--larch-d); }

/* Alentours : panneaux fléchés de sentier */
.d-chalet .towns li { border: 0; border-radius: 3px; padding-right: 1.6em; background: var(--larch-d); color: #fdf3dc; clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 50%, calc(100% - 14px) 100%, 0 100%); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .25); }
.d-chalet .towns .ic { color: #f3c98b; }
.d-chalet .towns small { color: #f1dfc6; }

/* FAQ, actualités */
.d-chalet .faq details { border-radius: 12px; }
.d-chalet .faq details[open] { border-color: var(--larch); box-shadow: inset 6px 0 0 var(--wool), var(--shadow-sm); }
.d-chalet .faq summary { font-family: var(--font-head); font-size: 1.12rem; }
.d-chalet .faq .plus { background: var(--log); color: var(--bark); }
.d-chalet .faq details[open] .plus { background: var(--wool); }
.d-chalet .news-date { color: var(--wool); }
.d-chalet .news-card::before { display: none; }
.d-chalet .news-card { border-top: 6px solid var(--larch); padding-top: 28px; }

/* Pied de page : bardage sombre sous un balcon découpé */
.d-chalet .site-footer { position: relative; padding-top: 110px; background: repeating-linear-gradient(90deg, rgba(0, 0, 0, .25) 0 2px, transparent 2px 46px), var(--bark); }
.d-chalet .site-footer::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 56px; border-bottom: 8px solid var(--larch-d);
  background: repeating-linear-gradient(90deg, var(--larch) 0 26px, var(--larch-d) 26px 28px);
  mask: radial-gradient(ellipse 5px 10px at 13px 20px, #0000 95%, #000) 0 0 / 28px 100%, radial-gradient(circle 4px at 13px 37px, #0000 95%, #000) 0 0 / 28px 100%; mask-composite: intersect; }
.d-chalet .site-footer h3 { color: #f3c98b; font-family: var(--font-head); text-transform: none; letter-spacing: 0; font-size: 1.15rem; }
.d-chalet .brand-light .brand-mark { background: var(--log); color: var(--bark); }
.d-chalet .socials a:hover { background: var(--wool); }

@media (max-width: 920px) {
  .d-chalet .hero { padding-bottom: 100px; }
  .d-chalet .highlights { margin-top: -30px; }
  .d-chalet .art-cross { width: 36%; }
}
@media (max-width: 560px) {
  .d-chalet .hero-art { border-width: 8px; }
  .d-chalet .art-cross { width: 42%; }
  .d-chalet .site-footer { padding-top: 90px; }
}