/* =====================================================================
   Experiences in Provence — La Terre en tete
   Feuille de style de la page /experiences-in-provence/
   ===================================================================== */

:root{
  --font-display:'Playfair Display',Georgia,serif;
  --font-body:'Source Sans 3',system-ui,sans-serif;
  --brand:#7B1FA2;          /* violet de marque, pour le chrome (header, liens) */
  --brand-d:#5e1480;
  --gold:#c9962e;         /* doré discret, rappelle le filet du PPTX */
  --ink:#1d1b22;
  --cream:#f4f1ec;
  --nature:#043f0c;
  --radius:16px;
  --maxw:1100px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--cream);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--brand);}

/* ============ HEADER STICKY ============ */
.topbar{
  position:sticky;top:0;z-index:100;
  display:flex;align-items:center;gap:14px;
  padding:10px 20px;
  background:rgba(255,255,255,.88);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(0,0,0,.07);
  box-shadow:0 2px 14px rgba(0,0,0,.06);
}
.topbar__logo{
  width:46px;height:46px;border-radius:50%;flex:0 0 auto;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}
.topbar__brand{
  display:flex;flex-direction:column;line-height:1.15;min-width:0;
}
.topbar__brand b{
  font-family:var(--font-display);font-weight:700;font-size:1.05rem;color:var(--brand-d);
}
.topbar__brand span{
  font-size:.74rem;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.topbar__spacer{flex:1 1 auto;}
.btn-download{
  display:inline-flex;align-items:center;gap:9px;
  background:var(--brand);color:#fff;text-decoration:none;
  font-weight:600;font-size:.92rem;
  padding:11px 18px;border-radius:999px;
  box-shadow:0 4px 14px rgba(123,31,162,.35);
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;
  white-space:nowrap;
}
.btn-download:hover{background:var(--brand-d);transform:translateY(-1px);box-shadow:0 6px 18px rgba(123,31,162,.45);}
.btn-download svg{width:18px;height:18px;flex:0 0 auto;}
.btn-download .lbl-long{display:inline;}
.btn-download .lbl-short{display:none;}
@media(max-width:560px){
  .topbar__brand{display:none;}        /* logo + icône maison suffisent à identifier la page */
  .btn-download .lbl-long{display:none;}
  .btn-download .lbl-short{display:inline;}
}

/* ============ HERO / COVER ============ */
.hero{
  text-align:center;color:#fff;
  padding:64px 24px 76px;
  background:linear-gradient(160deg,#19a8a0 0%,#2f9d6a 42%,#0c5d57 100%);
  position:relative;overflow:hidden;
}
.hero::after{ /* léger voile lumineux en diagonale, comme le PPTX */
  content:"";position:absolute;inset:0;
  background:linear-gradient(125deg,rgba(255,255,255,.18),transparent 38%);
  pointer-events:none;
}
.hero__logo{
  width:140px;height:140px;border-radius:50%;margin:0 auto 26px;
  box-shadow:0 10px 30px rgba(0,0,0,.28);position:relative;
}
.hero h1{
  font-family:var(--font-display);font-style:italic;font-weight:600;
  font-size:clamp(2.4rem,7vw,4rem);line-height:1.05;margin:0 0 18px;position:relative;
}
.hero__tag{font-size:1.15rem;font-weight:500;margin:0 0 6px;position:relative;}
.hero__region{
  font-family:var(--font-display);font-style:italic;font-size:1.1rem;
  letter-spacing:.04em;margin:0 0 30px;position:relative;
}
.hero .btn-cta{
  position:relative;display:inline-flex;align-items:center;gap:10px;
  background:#fff;color:var(--brand-d);text-decoration:none;font-weight:600;
  padding:14px 26px;border-radius:999px;box-shadow:0 8px 24px rgba(0,0,0,.22);
  transition:transform .15s ease;
}
.hero .btn-cta:hover{transform:translateY(-2px);}
.hero .btn-cta svg{width:20px;height:20px;}

/* ============ SECTIONS GÉNÉRIQUES ============ */
.section{padding:72px 24px;}
.section .inner{max-width:var(--maxw);margin:0 auto;}
.eyebrow{
  font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  font-size:.72rem;margin:0 0 14px;
}
.section h2{
  font-family:var(--font-display);font-style:italic;font-weight:600;
  font-size:clamp(1.9rem,4.6vw,3rem);line-height:1.1;margin:0 0 12px;
}
.lead{font-size:1.12rem;margin:0 0 40px;}

/* zone neutre (about, prices) */
.section--neutral{background:var(--cream);color:var(--ink);}
.section--neutral .eyebrow{color:var(--brand);}

/* ====== ZONES THÉMATIQUES ====== */
.section--astro{
  background:linear-gradient(160deg,#FFEDBB 0%,#FFAD77 40%,#0E2E87 60%,#000000 100%);
  color:#000;
}
.section--nature{
  background:linear-gradient(160deg,#FFFF66 0%,#DEF4FC 30%,#BFF3D3 50%, #C7A2E3 100%);
  color:#000;
}
.section--rainy{
  background:linear-gradient(160deg,#595959 0%,#215F9A 50%,#DFF6F2 70%, #FFEDBB 100%);
  color:#fff;
}
.section--fullday{
  background:linear-gradient(160deg,#59C9EE 0%,#DEF4FC 40%,#FFD6BB 60%, #FF8533 100%);
  color:#000;
}
.section--booking{
  background:linear-gradient(160deg,#123a4f 0%,#0e6b63 60%,#0a3f3a 100%);
  color:#fff;
}

/* duo texte / photo */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px;align-items:stretch;}
.duo:last-child{margin-bottom:0;}
@media(max-width:780px){
  .duo{grid-template-columns:1fr;}
  .duo .photo{order:-1;min-height:220px;} /* photo au-dessus du texte sur mobile */
}

/* panneau translucide (remplace la carte blanche) */
.panel{
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius);
  padding:30px 30px 34px;
  display:flex;flex-direction:column;justify-content:center;
}

.panel.violet{
  background:rgba(137, 31, 236, 0.34);
}

.panel.orange{
  background:rgba(255, 163, 51, 0.34);
}

.panel.darkblue{
  background:rgba(14, 46, 135, 0.5);
  color:#fff
}
/* panneau clair "papier" pour les sections sur fond crème (texte foncé) */
.panel--paper{
  background:rgba(255,255,255,.6);
  border:1px solid rgba(0,0,0,.08);
  color:var(--ink);
}
.panel--paper h3{color:var(--brand-d);margin:0 0 8px;}
.panel--paper .cred-title{margin-top:22px;font-size:1.15rem;}
.mission{list-style:none;padding:0;margin:0 0 4px;display:grid;gap:8px;}
.mission li{position:relative;padding-left:22px;}
.mission li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--brand);}
/* tuiles légendées (full-day) */
.tile{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:0 12px 30px rgba(0,0,0,.25);min-height:210px;background:rgba(0,0,0,.15);}
.tile img{width:100%;height:100%;min-height:210px;object-fit:cover;display:block;}
.tile figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:30px 16px 14px;
  color:#fff;font-family:var(--font-display);font-style:italic;font-size:1.08rem;line-height:1.25;
  background:linear-gradient(to top,rgba(0,0,0,.78),rgba(0,0,0,.35) 55%,transparent);
}

.panel.green{
  background:rgba(13, 136, 23, 0.34);
}

.panel--light{background:rgba(0,0,0,.22);}
.hook{
  font-family:var(--font-display);font-style:italic;
  font-size:1.22rem;line-height:1.42;margin:0 0 20px;opacity:.96;
}
.panel h3{font-family:var(--font-display);font-weight:600;font-size:1.5rem;margin:0 0 6px;}
.panel .sub{font-family:var(--font-display);font-style:italic;font-size:1.05rem;opacity:.9;margin:0 0 12px;}
.meta {
  font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:600;margin:0 0 16px;
}
.meta.gold{
  color:var(--gold);
}

.meta.nature{
  color:var(--nature);
}

.panel p{margin:0 0 12px;opacity:.93;}
.panel p:last-child{margin-bottom:0;}
.signoff{font-family:var(--font-display);font-style:italic;opacity:1;}

/* cadre photo */
.photo{
  border-radius:var(--radius);overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.30);
  background:rgba(0,0,0,.18);min-height:280px;
}
.photo img{width:100%;height:100%;object-fit:cover;}
.photo--tall{min-height:340px;}

/* ====== ABOUT ====== */
.about{display:grid;grid-template-columns:1fr 1.3fr;gap:36px;align-items:center;}
@media(max-width:780px){.about{grid-template-columns:1fr;}}
.credentials{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px;}
.credentials li{position:relative;padding-left:30px;}
.credentials li::before{
  content:"";position:absolute;left:0;top:.45em;width:16px;height:16px;border-radius:50%;
  background:var(--brand);
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/12px no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/></svg>") center/12px no-repeat;
}

/* ====== FULL-DAY HIGHLIGHTS ====== */
.highlights{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:6px 0 28px;}
@media(max-width:780px){.highlights{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.highlights{grid-template-columns:1fr;}}
.highlights li{
  list-style:none;
  background:rgba(0,0,0,.20);border:1px solid rgba(255,255,255,.16);
  border-radius:12px;padding:14px 16px;
  font-family:var(--font-display);font-style:italic;font-size:1.05rem;
}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media(max-width:600px){.gallery{grid-template-columns:1fr 1fr;}}
.gallery .photo{min-height:170px;}

/* ====== PRICING ====== */
.pricing{
  width:100%;border-collapse:collapse;background:#fff;
  border-radius:var(--radius);overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.10);font-size:.98rem;
}
.pricing th,.pricing td{padding:14px 18px;text-align:left;}
.pricing thead th{
  background:linear-gradient(135deg,var(--brand),#9C27B0);color:#fff;
  font-weight:600;letter-spacing:.02em;
}
.pricing tbody tr{border-bottom:1px solid #eee;}
.pricing tbody tr:nth-child(even){background:#faf6fd;}
.pricing td.exp{font-weight:600;color:var(--brand-d);}
.pricing td.price{font-weight:700;color:var(--brand-d);white-space:nowrap;}
.pricing td.add{color:#555;white-space:nowrap;}
@media(max-width:680px){
  .pricing thead{display:none;}
  .pricing,.pricing tbody,.pricing tr,.pricing td{display:block;width:100%;}
  .pricing tr{padding:12px 16px;}
  .pricing td{padding:3px 0;}
  .pricing td.exp{font-size:1.1rem;margin-bottom:4px;}
  .pricing td.add::before{content:"Additional guest: ";color:#999;font-weight:400;}
}
.practical{margin-top:28px;background:#fff;border-radius:var(--radius);padding:24px 28px;box-shadow:0 6px 20px rgba(0,0,0,.07);}
.practical h3{font-family:var(--font-display);font-style:italic;margin:0 0 12px;font-size:1.3rem;color:var(--brand-d);}
.practical ul{margin:0;padding-left:20px;}
.practical li{margin-bottom:6px;}

/* ====== BOOKING ====== */
.booking-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;}
@media(max-width:780px){.booking-grid{grid-template-columns:1fr;}}
.contact-card{
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.2);
  border-radius:var(--radius);padding:30px;backdrop-filter:blur(6px);
}
.contact-card .names{font-family:var(--font-display);font-style:italic;font-size:1.35rem;margin:0 0 14px;}
.contact-line{display:flex;align-items:center;gap:12px;margin:12px 0;font-size:1.05rem;}
.contact-line svg{width:22px;height:22px;flex:0 0 auto;opacity:.9;}
.contact-line a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);}
.btn-whatsapp{
  display:inline-flex;align-items:center;gap:10px;margin-top:10px;
  background:#25D366;color:#06351a;font-weight:700;text-decoration:none;
  padding:13px 22px;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.25);
}
.btn-whatsapp svg{width:20px;height:20px;}

/* ====== FOOTER ====== */
.site-footer{background:#15131a;color:#bdb8c5;text-align:center;padding:28px 24px;font-size:.85rem;}
.site-footer a{color:#d7b8ec;}

/* =====================================================================
   Remplacements des styles inline (plus rien dans le HTML)
   ===================================================================== */
figure{margin:0;}                                   /* <figure class="photo"> */
.section--neutral .lead{color:#555;}                /* "Prices as of 1 June 2026." */
.section--fullday .panel{margin-bottom:24px;}       /* panneau d'intro full-day */
.section--booking .lead{opacity:.95;}               /* accroche booking */
.contact-card .btn-download{margin-top:18px;}       /* bouton dans la carte contact */

/* =====================================================================
   Icône "home" dans la topbar (retour à la racine du site)
   ===================================================================== */
.topbar__home{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;flex:0 0 auto;border-radius:50%;
  color:var(--brand);text-decoration:none;
  background:rgba(123,31,162,.08);
  border:1px solid rgba(123,31,162,.18);
  transition:background .15s ease,color .15s ease,transform .15s ease;
}
.topbar__home:hover,
.topbar__home:focus-visible{
  background:var(--brand);color:#fff;transform:translateY(-1px);outline:none;
}
.topbar__home svg{width:22px;height:22px;display:block;}
@media(max-width:560px){
  .topbar__home{width:40px;height:40px;}
  .topbar__home svg{width:20px;height:20px;}
}