/* La Fosca Bay — Page d'accueil. Classes lfb-* posées par _install/e4-home.php. Scopé à .home. */

/* ===================== HERO ===================== */
.home .lfb-hero {
  position: relative;
  min-height: 82vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
}
.home .lfb-hero::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(35,48,58,.30) 0%, rgba(26,94,122,.45) 60%, rgba(35,48,58,.62) 100%);
  z-index: 0;
}
.home .lfb-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 860px;
  text-align: center;
  padding: var(--space-4) var(--space-3);
  align-items: center;
}
.home .lfb-hero-title .elementor-heading-title {
  font-family: var(--font-title);
  font-size: clamp(40px, 7vw, 76px);
  font-weight: 600;
  line-height: 1.05;
  color: var(--c-white);
  text-shadow: 0 2px 24px rgba(0,0,0,.25);
  margin: 0 0 var(--space-2);
}
.home .lfb-hero-sub {
  font-size: clamp(17px, 2vw, 21px);
  line-height: 1.6;
  color: rgba(255,255,255,.95);
  max-width: 620px;
  margin: 0 auto var(--space-4);
  text-shadow: 0 1px 12px rgba(0,0,0,.3);
}
.home .lfb-hero-cta {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  gap: var(--space-2);
  justify-content: center;
}
.home .lfb-hero-cta > .elementor-element { width: auto !important; }
.home .lfb-btn-hero .elementor-button {
  border-radius: var(--radius);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 16px;
  padding: 15px 32px;
  transition: all .2s ease;
}
.home .lfb-btn-hero-primary .elementor-button { background: var(--c-cta); color: #fff; }
.home .lfb-btn-hero-primary .elementor-button:hover { background: var(--c-cta-hover); transform: translateY(-1px); }
.home .lfb-btn-hero-ghost .elementor-button { background: rgba(255,255,255,.12); color: #fff; border: 1.5px solid rgba(255,255,255,.85); }
.home .lfb-btn-hero-ghost .elementor-button:hover { background: #fff; color: var(--c-primary); }

/* ===================== Sections génériques ===================== */
.home .lfb-home-sec {
  max-width: var(--container);
  margin-inline: auto;
  padding: var(--space-6) var(--space-3);
}
.home .lfb-h2 .elementor-heading-title { font-family: var(--font-title); font-weight: 500; color: var(--c-primary); }
.home .lfb-h2 .elementor-heading-title { font-size: clamp(28px, 3.4vw, 40px); }
.home .lfb-center { text-align: center; }
.home .lfb-center .elementor-heading-title::after {
  content: ""; display: block; width: 56px; height: 3px; background: var(--c-cta);
  margin: var(--space-2) auto 0; border-radius: 2px;
}
.home .lfb-center-btn { text-align: center; margin-top: var(--space-4); }

/* ===================== Intro + stats ===================== */
.home .lfb-intro-text { text-align: center; max-width: 760px; margin: var(--space-3) auto var(--space-5); font-size: 18px; line-height: 1.7; }
.home .lfb-stats {
  display: flex !important; flex-direction: row !important; flex-wrap: wrap;
  justify-content: center; gap: var(--space-5);
}
.home .lfb-stats > .elementor-element { width: auto !important; }
.home .lfb-stat { text-align: center; flex: 0 0 auto; }
.home .lfb-stat-num .elementor-heading-title { font-family: var(--font-title); font-size: clamp(30px, 4vw, 44px); font-weight: 600; color: var(--c-cta); line-height: 1; }
.home .lfb-stat-label { font-size: 14.5px; color: var(--c-pine); margin-top: 6px; }

/* ===================== Pourquoi La Fosca ===================== */
.home .lfb-why-grid {
  display: flex !important; flex-direction: row !important; flex-wrap: wrap;
  gap: var(--space-3); margin-top: var(--space-4);
}
.home .lfb-why-grid > .elementor-element { width: auto !important; }
.home .lfb-why-card {
  flex: 1 1 220px;
  background: var(--c-white);
  border: 1px solid var(--c-sand);
  border-radius: var(--radius-lg);
  padding: var(--space-4) var(--space-3);
  text-align: center;
  box-shadow: var(--shadow-soft);
}
.home .lfb-why-icon .elementor-heading-title { font-size: 40px; line-height: 1; }
.home .lfb-why-title .elementor-heading-title { font-family: var(--font-title); font-size: 20px; font-weight: 600; color: var(--c-primary); margin: var(--space-2) 0 var(--space-1); }
.home .lfb-why-text { font-size: 15px; line-height: 1.55; color: var(--c-ink); }

/* Pourquoi La Fosca — widgets JetElements jet-services (Conv.5) */
.home .lfb-why-service {
  flex: 1 1 220px;
  background: var(--c-white, #fff);
  border: 1px solid var(--c-sand);
  border-radius: var(--radius-lg);
  padding: 0;
  overflow: hidden;
  box-shadow: var(--shadow-soft);
}
.home .lfb-why-service .jet-services__inner,
.home .lfb-why-service .jet-services { text-align: center; }
.home .lfb-why-service .jet-services__title-icon { display: block; margin: 0 0 10px; line-height: 1; }
.home .lfb-why-service .jet-services__title-icon i { font-size: 40px; color: var(--c-azur); }
.home .lfb-why-service .jet-services__title {
  font-family: var(--font-title); font-size: 20px; font-weight: 600; color: var(--c-primary);
  margin: 0 0 var(--space-1); display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.home .lfb-why-service .jet-services__desc { font-size: 15px; line-height: 1.55; color: var(--c-ink); }

/* Carte-photo (demande Marc) : photo de couverture en haut, texte dessous, icône masquée. */
.home .lfb-why-service .jet-services__header { margin: 0; padding: 0; line-height: 0; }
/* override .jet-services__cover:empty{display:none} du plugin (notre cover est vide → on l'affiche pour la photo) */
.home .lfb-why-service .jet-services__cover { display: block !important; height: 175px; background-size: cover; background-position: center; background-repeat: no-repeat; }
.home .lfb-why-service .jet-services__content { padding: var(--space-3) var(--space-3) var(--space-4); }
.home .lfb-why-service .jet-services__title-icon { display: none; }      /* la photo remplace l'icône */
.home .lfb-why-service .jet-services__title { margin-top: 0; }
.home .lfb-whyph-castell .jet-services__cover { background-image: url("/wp-content/uploads/2026/06/miro-34-1024x681.jpg") !important; }
.home .lfb-whyph-cami    .jet-services__cover { background-image: url("/wp-content/uploads/2026/06/miro-33-1024x681.jpg") !important; }
.home .lfb-whyph-calme   .jet-services__cover { background-image: url("/wp-content/uploads/2026/06/miro-35-1024x683.jpg") !important; }
.home .lfb-whyph-acces   .jet-services__cover { background-image: url("/wp-content/uploads/2026/06/dali-12-1024x681.jpg") !important; }

/* Cartes « Pourquoi » version PHOTO (rebuild : container + vrai <img> + titre + texte). */
.home .lfb-whyc{ flex:1 1 220px; min-width:0; background:#fff; border:1px solid var(--c-sand); border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-soft); padding:0 !important; gap:0 !important; text-align:left; }
.home .lfb-whyc-img{ margin:0; line-height:0; }
.home .lfb-whyc-img img{ display:block; width:100%; height:180px; object-fit:cover; }
.home .lfb-whyc-title .elementor-heading-title{ font-family:var(--font-title); font-size:20px; font-weight:600; color:var(--c-primary); margin:0; padding:var(--space-3) var(--space-3) 0; }
.home .lfb-whyc-text{ font-size:15px; line-height:1.55; color:var(--c-ink); padding:8px var(--space-3) var(--space-4); margin:0; }

/* ===================== Bandeau expérience ===================== */
.home .lfb-exp {
  display: flex !important; flex-direction: row !important; align-items: center; gap: var(--space-5);
  background: var(--c-sand); border-radius: var(--radius-lg);
  max-width: var(--container); padding: var(--space-5);
}
.home .lfb-exp-text-col { flex: 1 1 50%; }
.home .lfb-exp-img { flex: 1 1 50%; }
.home .lfb-exp-img img { width: 100%; border-radius: var(--radius); display: block; aspect-ratio: 3/2; object-fit: cover; }
.home .lfb-exp-text { font-size: 17px; line-height: 1.7; margin: var(--space-2) 0 var(--space-3); }
.home .lfb-btn-exp .elementor-button { background: var(--c-primary); color: #fff; border-radius: var(--radius); font-weight: 600; padding: 12px 26px; }
.home .lfb-btn-exp .elementor-button:hover { background: #14506a; }

/* ===================== Galerie aperçu ===================== */
.home .lfb-home-gallery .gallery { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 200px; gap: var(--space-1); margin-top: var(--space-4); }
.home .lfb-home-gallery .gallery-item { width: 100% !important; margin: 0 !important; border-radius: var(--radius); overflow: hidden; }
.home .lfb-home-gallery .gallery-icon, .home .lfb-home-gallery .gallery-icon a { display: block; height: 100%; margin: 0 !important; }
.home .lfb-home-gallery .gallery-item img { width: 100% !important; height: 100% !important; object-fit: cover; display: block; transition: transform .5s ease; }
.home .lfb-home-gallery .gallery-item:hover img { transform: scale(1.05); }
.home .lfb-home-gallery .gallery-caption { display: none; }
.home .lfb-btn-gallery .elementor-button { background: transparent; color: var(--c-primary); border: 1.5px solid var(--c-primary); border-radius: var(--radius); font-weight: 600; padding: 11px 26px; }
.home .lfb-btn-gallery .elementor-button:hover { background: var(--c-primary); color: #fff; }

/* ===================== CTA final ===================== */
.home .lfb-home-cta {
  background: linear-gradient(135deg, var(--c-primary), #14506a);
  border-radius: var(--radius-lg);
  text-align: center;
  color: #fff;
  padding: var(--space-7) var(--space-3);
}
.home .lfb-home-cta-title .elementor-heading-title { color: #fff !important; }
.home .lfb-home-cta-title .elementor-heading-title::after { background: var(--c-cta); }
.home .lfb-home-cta-text { color: rgba(255,255,255,.9); font-size: 18px; margin-top: var(--space-2); }
.home .lfb-btn-home-cta .elementor-button { background: var(--c-cta); color: #fff; border-radius: var(--radius); font-weight: 600; font-size: 17px; padding: 16px 36px; }
.home .lfb-btn-home-cta .elementor-button:hover { background: var(--c-cta-hover); transform: translateY(-1px); }

/* ===================== Responsive ===================== */
@media (max-width: 880px) {
  .home .lfb-exp { flex-direction: column !important; }
  .home .lfb-why-card { flex: 1 1 45%; }
  .home .lfb-home-gallery .gallery { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .home .lfb-why-card { flex: 1 1 100%; }
  .home .lfb-stats { gap: var(--space-3); }
}

/* =========================================================================
 * CHARTE V4 (validée Marc) — accueil. Hero net + bandes bleu mer profond.
 * design de réf : app/public/_design/home-v4.html
 * ========================================================================= */
:root{ --v4-primary:#1A5E7A; --v4-deep:#134B62; }

/* Eyebrows */
.lfb-v4-eyebrow p, .lfb-v4-eyebrow-light p{ margin:0; font-weight:500; letter-spacing:.22em; text-transform:uppercase; font-size:12px; }
.lfb-v4-eyebrow p{ color:var(--c-cta); }
.lfb-v4-eyebrow-light p{ color:#fff; opacity:.85; }

/* Boutons V4 */
.lfb-v4-btn .elementor-button{ font-family:var(--font-body); font-weight:500; letter-spacing:.04em; font-size:14px; padding:15px 34px; border-radius:3px; transition:.25s; border:1px solid transparent; }
.lfb-v4-btn-white .elementor-button{ background:#fff; color:var(--c-ink); }
.lfb-v4-btn-white .elementor-button:hover{ background:var(--c-sand); color:var(--c-ink); }
.lfb-v4-btn-ghostlight .elementor-button{ background:transparent; color:#fff; border-color:rgba(255,255,255,.7); }
.lfb-v4-btn-ghostlight .elementor-button:hover{ background:#fff; color:var(--c-ink); border-color:#fff; }
.lfb-v4-btn-ghost .elementor-button{ background:transparent; color:var(--c-ink); border-color:var(--c-ink); }
.lfb-v4-btn-ghost .elementor-button:hover{ background:var(--c-ink); color:#fff; }
.lfb-v4-btn-ctafill .elementor-button{ background:var(--c-cta); color:#fff; }
.lfb-v4-btn-ctafill .elementor-button:hover{ background:var(--c-cta-hover,#B5663F); color:#fff; }
.lfb-v4-center-btn{ text-align:center; margin-top:30px; }

/* 1 — HERO (fond ET hauteur posés ici en dur — rendu fiable indépendant du CSS de page Elementor.
   ⚠️ La hauteur 100vh NE DOIT PAS dépendre de --min-height (post-109.css) : ce maillon saute
   au rendu déconnecté → hero écrasé + en-tête blanc flottant. Ancrage bas (flex-end) façon V1. */
.lfb-v4-hero{ position:relative;
  min-height:100vh !important; min-height:100svh !important;
  display:flex !important; flex-direction:column !important; justify-content:flex-end !important;
  background-image:url(/wp-content/uploads/2026/06/la-fosca-baie-panorama.jpg) !important; background-size:cover !important; background-position:center center !important; }
.lfb-v4-hero::before{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(20,30,40,.22) 0%,rgba(20,30,40,0) 34%,rgba(20,30,40,.52) 100%); }
.lfb-v4-hero-inner{ position:relative; z-index:2; max-width:1180px; width:100%; margin:0 auto; padding:0 32px 9vh; color:#fff; }
.lfb-v4-hero-title .elementor-heading-title{ font-family:var(--font-title); font-weight:400; font-size:clamp(52px,9vw,120px); line-height:1.05; letter-spacing:-.02em; color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.25); margin:14px 0 0; }
.lfb-v4-hero-sub p{ max-width:560px; margin:22px 0 8px; font-size:19px; font-weight:300; color:#fff; opacity:.96; }
.lfb-v4-hero-accent p{ margin:0 0 26px; font-weight:500; letter-spacing:.02em; color:#fff; opacity:.95; }
.lfb-v4-hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }

/* Bouton « Réserver » présent en haut à droite sur TOUTES les pages, accueil compris (demande Marc).
   (Ancienne règle V1 qui le masquait sur l'accueil supprimée.) */
.home .lfb-header .lfb-btn-reserver{ display:inline-flex !important; }

/* 2 — BANDE BLEUE stats */
.lfb-v4-stats{ padding:34px 0; background-image:linear-gradient(135deg,#1A5E7A,#134B62) !important; }
/* Rangée stats = 4 colonnes côte à côte (V4). On force la rangée + on neutralise
   le width:100% qu'Elementor pose sur les conteneurs enfants (sinon chaque stat
   prend toute la largeur et passe à la ligne → empilé vertical). */
.lfb-v4-stats-row{ max-width:1180px; width:100%; margin:0 auto; padding:0 32px; display:flex !important; flex-direction:row !important; justify-content:space-between; align-items:flex-start; gap:24px; flex-wrap:wrap; text-align:center; }
.lfb-v4-stat{ flex:1 1 0 !important; width:auto !important; max-width:none !important; min-width:120px; }
.lfb-v4-stat-num .elementor-heading-title{ font-family:var(--font-title); font-weight:500; font-size:46px; line-height:1; color:#fff; white-space:nowrap; }
.lfb-v4-stat-lab p{ margin:10px 0 0; font-size:13px; letter-spacing:.06em; color:#fff; opacity:.82; }
/* « jusqu'à 8 » est plus long que les autres chiffres : sous 1180px, 4 colonnes deviennent
   trop étroites → on passe en 2 colonnes (les chiffres restent grands, pas de coupure). */
@media (max-width: 1180px){
  .lfb-v4-stat{ flex:1 1 42% !important; max-width:50% !important; }
}
/* Mobile : chiffres plus petits (2×2 confortable) */
@media (max-width: 600px){
  .lfb-v4-stats-row{ gap:16px 12px; }
  .lfb-v4-stat-num .elementor-heading-title{ font-size:30px; }
}

/* 3 — INTRO */
.lfb-v4-intro{ max-width:780px; width:100%; margin:0 auto; padding:110px 32px 80px; text-align:center; }
.lfb-v4-intro-title .elementor-heading-title{ font-family:var(--font-title); font-weight:400; font-size:clamp(30px,4vw,52px); color:var(--v4-primary); max-width:15ch; margin:16px auto 26px; }
.lfb-v4-intro-text p{ max-width:60ch; margin:0 auto; font-size:18px; color:#4a5560; font-weight:300; }
.lfb-v4-rule{ width:54px; min-height:1px; background:var(--c-sand-deep); margin:46px auto 0; }

/* 4 — BANDE PHOTO « village de pêcheurs » (image réelle <img>) */
.lfb-v4-fullband{ position:relative; }
.lfb-v4-fullband-img img{ display:block; width:100%; height:44vh; min-height:340px; object-fit:cover; }
.lfb-v4-fullband-cap{ position:absolute; left:0; right:0; bottom:22px; z-index:2; }
.lfb-v4-fullband-cap p{ margin:0; color:#fff; font-family:var(--font-title); font-style:italic; font-size:21px; text-shadow:0 2px 18px rgba(0,0,0,.55); text-align:center; }

/* 5/6/8 — sections claires centrées */
.lfb-v4-why, .lfb-v4-homes, .lfb-v4-avis{ max-width:1180px; width:100%; margin:0 auto; padding:96px 32px; text-align:center; }
.lfb-v4-sec-title .elementor-heading-title{ font-family:var(--font-title); font-weight:400; font-size:clamp(28px,3.5vw,44px); color:var(--v4-primary); margin:14px 0 0; }
.lfb-v4-why .lfb-why-grid{ margin-top:56px; }
.lfb-v4-homes-grid{ margin-top:48px; }
.lfb-v4-avis .lfb-home-avis-carousel{ margin-top:44px; }

/* 7 — EXPÉRIENCE (photo réelle pleine largeur, texte posé dessus — SANS voile bleu) */
.lfb-v4-exp{ position:relative; overflow:hidden; justify-content:flex-start !important; }
.lfb-v4-exp-bg{ position:absolute; inset:0; z-index:0; line-height:0; }
.lfb-v4-exp-bg img{ width:100%; height:100%; object-fit:cover; display:block; }
/* dégradé sombre neutre uniquement vers le HAUT (là où est le texte) : la photo garde ses vraies couleurs, le bassin turquoise reste visible en bas */
.lfb-v4-exp::before{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to bottom, rgba(6,18,26,.66) 0%, rgba(6,18,26,.34) 24%, rgba(6,18,26,.08) 46%, transparent 64%); }
.lfb-v4-exp-box{ position:relative; z-index:2; max-width:1180px; width:100%; margin:0 auto; padding:8px 32px 0; color:#fff; }
.lfb-v4-exp-box > *{ max-width:620px; }
.lfb-v4-exp-box .lfb-v4-eyebrow-light p{ text-shadow:0 1px 12px rgba(0,0,0,.55); }
.lfb-v4-exp-title .elementor-heading-title{ font-family:var(--font-title); font-weight:400; font-size:clamp(30px,4vw,50px); color:#fff; margin:14px 0 16px; text-shadow:0 2px 22px rgba(0,0,0,.55); }
.lfb-v4-exp-text p{ font-size:18px; font-weight:300; color:#fff; opacity:.97; margin:0 0 26px; text-shadow:0 1px 16px rgba(0,0,0,.6); }

/* 9 — CTA (bande claire) */
/* CTA final = bande bleu profond pleine largeur (comme la maquette V4). */
.lfb-v4-cta{ text-align:center; padding:120px 32px; border-top:none;
  background:linear-gradient(135deg, var(--v4-primary,#1A5E7A) 0%, #134B62 100%); color:#fff; }
.lfb-v4-cta-title .elementor-heading-title{ font-family:var(--font-title); font-weight:400; font-size:clamp(30px,4vw,52px); color:#fff !important; margin-bottom:18px; }
.lfb-v4-cta-text p{ color:rgba(255,255,255,.9); font-weight:300; margin-bottom:8px; }

@media(max-width:860px){
  .lfb-v4-intro, .lfb-v4-why, .lfb-v4-homes, .lfb-v4-avis{ padding:64px 24px; }
}

/* Conv.27 — section « Découvrir les alentours » sur l'accueil */
.home .lfb-v4-dec{ padding:84px 32px 8px; }
.home .lfb-v4-dec .lfb-v4-sec-sub{ text-align:center; max-width:620px; margin:14px auto 0; color:#5a6b75; font-size:17px; font-weight:300; }
.home .lfb-v4-dec .lfb-pois-grid{ margin-top:34px; }
.home .lfb-v4-dec .elementor-widget-button{ text-align:center; }
.home .lfb-v4-dec .lfb-dec-cta{ margin-top:30px; }