body.wg-home-live { padding-top: 0 !important; }
body.wg-home-live .djerba-header { transition: opacity 420ms cubic-bezier(.16,1,.3,1), transform 560ms cubic-bezier(.16,1,.3,1), background 300ms; }
body.wg-home-opening .djerba-header { opacity: 0; transform: translateY(-100%); pointer-events: none; }
body.wg-home-nav-ready .djerba-header { opacity: 1; transform: translateY(0); }

.wg-home-immersive {
  --wg-bg: oklch(.13 .012 75);
  --wg-surface: oklch(.19 .018 75);
  --wg-ink: oklch(.94 .018 88);
  --wg-muted: oklch(.72 .025 82);
  --wg-gold: oklch(.75 .13 86);
  --wg-focus: oklch(.82 .14 88);
  --wg-line: oklch(.82 .06 84 / .22);
  --wg-ease: cubic-bezier(.16,1,.3,1);
  box-sizing: border-box;
  color: var(--wg-ink);
  font-family: "Helvetica Neue", Inter, system-ui, sans-serif;
}
.wg-home-immersive *, .wg-home-immersive *::before, .wg-home-immersive *::after { box-sizing: border-box; }
.wg-home-immersive :focus-visible { outline: 2px solid var(--wg-focus); outline-offset: 4px; }
.wg-home-immersive img, .wg-home-immersive video { display: block; width: 100%; }

.wg-home-hero {
  position: relative;
  min-height: 100svh;
  padding: clamp(6rem, 12vh, 9rem) clamp(1rem, 7vw, 7rem) clamp(3rem, 8vh, 6rem) !important;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  isolation: isolate;
  background: var(--wg-bg);
}
.wg-home-hero__media, .wg-home-hero__veil { position: absolute; inset: 0; }
.wg-home-hero__media { z-index: -3; background: var(--wg-bg); }
.wg-home-hero__media img, .wg-home-hero__media video { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.wg-home-hero__media img { z-index: 0; }
.wg-home-hero__media video { z-index: 1; }
.wg-home-hero__veil { z-index: -2; background: linear-gradient(180deg, oklch(.09 .012 75 / .03), oklch(.08 .014 75 / .06) 50%, oklch(.07 .014 75 / .18)); pointer-events: none; }
.wg-home-hero__content { width: min(100%, 900px); display: grid; justify-items: start; }
.wg-film-reveal { overflow: hidden; opacity: 0; clip-path: inset(0 0 100% 0); transform: translateY(28px); transition: opacity 900ms var(--wg-ease), transform 1050ms var(--wg-ease), clip-path 1050ms var(--wg-ease); }
.wg-home-hero.has-eyebrow .wg-film-reveal--eyebrow,
.wg-home-hero.has-title .wg-film-reveal--title,
.wg-home-hero.has-subtitle .wg-film-reveal--subtitle,
.wg-home-hero.has-cta .wg-film-reveal--cta { opacity: 1; clip-path: inset(0); transform: translateY(0); }
.wg-eyebrow { margin: 0 0 .75rem; color: var(--wg-gold); font-size: clamp(.65rem, .8vw, .78rem); font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.wg-home-hero h1 { max-width: 10ch; margin: 0; color: var(--wg-ink); font-family: "Helvetica Neue Condensed Black", "HelveticaNeue-CondensedBlack", "Arial Narrow", Impact, sans-serif; font-size: clamp(3.35rem, 8.8vw, 8.8rem); font-weight: 900; letter-spacing: -.055em; line-height: .82; text-transform: uppercase; text-wrap: balance; }
.wg-film-reveal--subtitle p { max-width: 38ch; margin: 1rem 0 0; color: var(--wg-ink); font-size: clamp(1rem, 1.7vw, 1.35rem); font-weight: 600; line-height: 1.35; text-shadow: 0 2px 18px oklch(.04 .01 75 / .42); }
.wg-home-button { min-height: 48px; margin-top: 1.35rem; padding: .9rem 1.45rem; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; background: var(--wg-gold); color: oklch(.15 .02 75); font-size: .88rem; font-weight: 850; line-height: 1; text-decoration: none; transition: transform 240ms var(--wg-ease), background 280ms; }
.wg-home-button:hover { background: var(--wg-focus); transform: translateY(-2px); }
.wg-home-button:active { transform: scale(.98); }

.wg-villa-search { padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 6vw, 5rem) !important; display: grid; place-items: center; background: oklch(.985 .008 95); }
.wg-villa-search > .booking-form-hero { width: min(1160px, 100%); }

.wg-ais-v2 { padding: clamp(5rem, 10vw, 10rem) clamp(1rem, 6vw, 6rem) !important; overflow: clip; background: linear-gradient(160deg, oklch(.105 .012 75), var(--wg-bg) 48%, oklch(.17 .018 75)); }
.wg-ais-v2__intro { width: min(1380px, 100%); margin: 0 auto clamp(3rem, 7vw, 7rem); display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: clamp(2rem, 7vw, 7rem); align-items: end; }
.wg-ais-v2 h2 { max-width: 12ch; margin: 0; color: var(--wg-ink); font-family: "Helvetica Neue Condensed Black", "HelveticaNeue-CondensedBlack", "Arial Narrow", Impact, sans-serif; font-size: clamp(3rem, 7vw, 7.5rem); font-weight: 900; letter-spacing: -.05em; line-height: .86; text-transform: uppercase; text-wrap: balance; }
.wg-ais-v2 h2 em, .wg-ais-v2__film-copy h3 em { color: var(--wg-gold); font-style: normal; }
.wg-ais-v2__promise { display: grid; justify-items: start; }
.wg-ais-price { padding: .58rem .8rem; border: 1px solid var(--wg-line); border-radius: 999px; color: var(--wg-gold); font-size: clamp(1.1rem, 2vw, 1.55rem); font-weight: 900; letter-spacing: .04em; }
.wg-ais-v2__promise p { max-width: 48ch; margin: 1rem 0 0; color: var(--wg-muted); line-height: 1.7; }
.wg-ais-v2__film { position: relative; width: min(1380px, 100%); min-height: min(78svh, 820px); margin: 0 auto clamp(4rem, 10vw, 10rem); overflow: hidden; background: var(--wg-surface); }
.wg-ais-v2__film picture, .wg-ais-v2__film picture img, .wg-ais-v2__film video { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.wg-ais-v2__film video { z-index: 1; }
.wg-ais-v2__film::after { content: ""; position: absolute; z-index: 2; inset: 0; background: linear-gradient(180deg, transparent 42%, oklch(.05 .01 75 / .72)); pointer-events: none; }
.wg-ais-v2__film-copy { position: absolute; z-index: 3; inset: auto clamp(1.25rem, 5vw, 5rem) clamp(1.5rem, 6vw, 5rem); }
.wg-ais-v2__film-copy p { margin: 0 0 .5rem; color: var(--wg-gold); font-size: .72rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.wg-ais-v2__film-copy h3 { color: var(--wg-ink); max-width: 11ch; margin: 0; font-family: "Helvetica Neue Condensed Black", "HelveticaNeue-CondensedBlack", "Arial Narrow", Impact, sans-serif; font-size: clamp(2.8rem, 7vw, 7rem); letter-spacing: -.045em; line-height: .87; text-transform: uppercase; }
.wg-ais-days { width: min(1380px, 100%); margin: 0 auto; display: grid; gap: clamp(2rem, 6vw, 6rem); }
.wg-ais-day { min-height: min(74svh, 760px); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); overflow: hidden; background: var(--wg-surface); opacity: 0; transform: translateY(48px); transition: opacity 760ms var(--wg-ease), transform 920ms var(--wg-ease); }
.wg-ais-day.is-visible { opacity: 1; transform: translateY(0); }
.wg-ais-day:nth-child(even) { grid-template-columns: minmax(320px, .8fr) minmax(0, 1.2fr); }
.wg-ais-day:nth-child(even) .wg-ais-day__media { order: 2; }
.wg-ais-day__media { min-height: 420px; }
.wg-ais-day__media img { height: 100%; object-fit: cover; }
.wg-ais-day__copy { padding: clamp(2rem, 5vw, 5rem); display: flex; flex-direction: column; justify-content: center; }
.wg-ais-day__number { color: var(--wg-gold); font-family: "Helvetica Neue Condensed Black", "HelveticaNeue-CondensedBlack", "Arial Narrow", Impact, sans-serif; font-size: clamp(2.2rem, 4vw, 4.5rem); font-weight: 900; line-height: 1; }
.wg-ais-day h3 { color: var(--wg-ink); max-width: 13ch; margin: .55rem 0 0; font-family: "Helvetica Neue Condensed Black", "HelveticaNeue-CondensedBlack", "Arial Narrow", Impact, sans-serif; font-size: clamp(2rem, 4.5vw, 4.8rem); letter-spacing: -.04em; line-height: .9; text-transform: uppercase; }
.wg-ais-day__lead { margin: 1.4rem 0 .65rem; color: var(--wg-ink); font-size: clamp(1.05rem, 1.6vw, 1.35rem); font-weight: 750; }
.wg-ais-day__copy > p:not(.wg-ais-day__lead) { max-width: 50ch; margin: 0; color: var(--wg-muted); line-height: 1.65; }
.wg-ais-day ul { margin: 1.3rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; }
.wg-ais-day li { padding: .46rem .65rem; border: 1px solid var(--wg-line); border-radius: 999px; color: var(--wg-ink); font-size: .72rem; }
.wg-ais-v2__footer { width: min(1380px, 100%); margin: clamp(3rem, 7vw, 7rem) auto 0; display: flex; align-items: center; gap: 1.25rem; }
.wg-ais-whatsapp { color: var(--wg-ink); font-weight: 750; text-underline-offset: .3em; }

@media (max-width: 767px) {
  .wg-home-hero { min-height: 100svh; padding: 6.5rem 1rem 3rem !important; }
  .wg-home-hero h1 { max-width: 8ch; font-size: clamp(3.25rem, 18vw, 5.2rem); }
  .wg-film-reveal--subtitle p { max-width: 28ch; font-size: .96rem; }
  .wg-ais-v2 { padding: 5rem .85rem !important; }
  .wg-ais-v2__intro { grid-template-columns: 1fr; gap: 2rem; }
  .wg-ais-v2 h2 { font-size: clamp(3rem, 15vw, 4.8rem); }
  .wg-ais-v2__film { min-height: 76svh; }
  .wg-ais-day, .wg-ais-day:nth-child(even) { min-height: 0; grid-template-columns: 1fr; }
  .wg-ais-day:nth-child(even) .wg-ais-day__media { order: 0; }
  .wg-ais-day__media { min-height: 68svh; }
  .wg-ais-day__copy { padding: 2rem 1.25rem 2.5rem; }
  .wg-ais-day h3 { font-size: clamp(2.6rem, 13vw, 4rem); }
  .wg-ais-v2__footer { align-items: stretch; flex-direction: column; }
  .wg-ais-v2__footer .wg-home-button { width: 100%; }
}

[dir="rtl"].wg-home-immersive { text-align: right; }
[dir="rtl"] .wg-ais-day:nth-child(even) .wg-ais-day__media { order: 2; }

@media (prefers-reduced-motion: reduce) {
  .wg-film-reveal, .wg-ais-day { opacity: 1 !important; clip-path: none !important; transform: none !important; transition: none !important; }
}

/* WG 2026-08-15 — fix mobile: titres condensed coupés a 390 (famille #414/#476) */
@media (max-width: 480px) {
  .wg-home-hero h1 { font-size: clamp(2.5rem, 12vw, 3.1rem) !important; letter-spacing: -.04em !important; }
  .wg-ais-v2 h2 { font-size: clamp(2.2rem, 10.5vw, 2.9rem); }
  .wg-ais-v2__film-copy h3 { font-size: clamp(2rem, 10vw, 2.7rem); }
  .wg-ais-day h3 { font-size: clamp(1.7rem, 8.5vw, 2.3rem); }
}

/* fix A3 20260815c: le body blanc transparaissait dans un gap pre-footer */
body.home, body.page-template-front-page { background: #0d0a07; }

/* fix titre coupe mobile 20260815d (#435 classe entiere): boites ch trop etroites avec fallback large */
@media (max-width: 480px) {
  .wg-home-hero h1, .wg-ais-v2 h2, .wg-ais-v2__film-copy h3, .wg-ais-day h3 { max-width: 100%; overflow-wrap: normal; }
}

/* A4 20260815e: cartes jour en video */
video.wg-ais-day__media { width: 100%; height: 100%; min-height: inherit; object-fit: cover; display: block; }
