/* ============================================================
   Le Clos de la Fuie — design system
   Warm, natural, honest. Linen · sage · forest · terracotta.
   ============================================================ */

/* Polices auto-hébergées — aucune donnée envoyée à Google */
@import url('./fonts/fonts.css');

:root{
  /* palette */
  --linen:      #F7F2E8;
  --linen-2:    #F1EADb;
  --sand:       #ECE3D2;
  --sand-deep:  #E3D7BF;
  --forest:     #33422F;
  --forest-700: #28341F;
  --moss:       #5B6B4E;
  --sage:       #97A485;
  --ink:        #2B2A24;
  --ink-soft:   #5C5849;
  --terracotta: #B05E3B;
  --terracotta-soft:#C98B5E;
  --gold:       #C99A2E;
  --line:       rgba(43,42,36,0.13);
  --line-soft:  rgba(43,42,36,0.07);
  --white:      #FFFDF8;

  --serif:'Newsreader', Georgia, 'Times New Roman', serif;
  --sans:'Hanken Grotesk', -apple-system, system-ui, sans-serif;

  --maxw: 1180px;
  --pad: clamp(20px, 5vw, 64px);
  --radius: 4px;
  --shadow-sm: 0 1px 2px rgba(43,42,36,.06), 0 6px 18px rgba(43,42,36,.06);
  --shadow-md: 0 10px 40px rgba(43,42,36,.14);
  --ease: cubic-bezier(.4,.0,.15,1);
}

*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  color:var(--ink);
  background:var(--linen);
  line-height:1.6;
  font-size:17px;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{display:block; max-width:100%}
a{color:inherit; text-decoration:none}
button{font-family:inherit; cursor:pointer; border:none; background:none}
::selection{background:var(--sage); color:var(--forest-700)}

/* ---------- type ---------- */
h1,h2,h3,h4{font-family:var(--serif); font-weight:500; line-height:1.08; letter-spacing:-.01em; color:var(--forest-700)}
.overline{
  font-family:var(--sans); font-size:12.5px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--moss);
  display:inline-flex; align-items:center; gap:.6em;
}
.overline::before{content:""; width:26px; height:1px; background:var(--sage)}
.overline.center::after{content:""; width:26px; height:1px; background:var(--sage)}
.overline.center{justify-content:center}
.lead{font-size:clamp(18px,2.2vw,21px); color:var(--ink-soft); line-height:1.7}
em{font-style:italic}
.serif-em{font-family:var(--serif); font-style:italic; font-weight:400}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad)}
section{position:relative}
.section{padding:clamp(64px,9vw,120px) 0}
.section.tight{padding:clamp(48px,6vw,80px) 0}
.bg-sand{background:var(--sand)}
.bg-linen2{background:var(--linen-2)}
.bg-forest{background:var(--forest); color:var(--linen)}
.bg-forest h1,.bg-forest h2,.bg-forest h3{color:var(--white)}
.bg-forest .overline{color:var(--sage)}
.bg-forest .lead{color:rgba(247,242,232,.82)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family:var(--sans); font-weight:600; font-size:15.5px; letter-spacing:.01em;
  padding:15px 26px; border-radius:var(--radius); transition:all .25s var(--ease);
  white-space:nowrap; line-height:1; cursor:pointer;
}
.btn-primary{background:var(--forest); color:var(--linen); box-shadow:0 2px 10px rgba(40,52,31,.25)}
.btn-primary:hover{background:var(--forest-700); transform:translateY(-2px); box-shadow:0 8px 22px rgba(40,52,31,.32)}
.btn-ghost{background:transparent; color:var(--forest); box-shadow:inset 0 0 0 1.5px var(--forest)}
.btn-ghost:hover{background:var(--forest); color:var(--linen)}
.btn-light{background:var(--linen); color:var(--forest-700)}
.btn-light:hover{background:var(--white); transform:translateY(-2px)}
.btn-cream-ghost{background:transparent; color:var(--linen); box-shadow:inset 0 0 0 1.5px rgba(247,242,232,.5)}
.btn-cream-ghost:hover{background:rgba(247,242,232,.12)}
.btn-sm{padding:11px 18px; font-size:14px}
.btn-lg{padding:18px 34px; font-size:16.5px}
.btn .arrow{transition:transform .25s var(--ease)}
.btn:hover .arrow{transform:translateX(3px)}

/* =========================================================
   NAV
   ========================================================= */
.nav{
  position:fixed; top:var(--tb-h,40px); left:0; right:0; z-index:60;
  display:flex; align-items:center; justify-content:space-between;
  padding:14px var(--pad);
  transition:background .4s var(--ease), box-shadow .4s var(--ease), padding .4s var(--ease), top .45s var(--ease);
}
body.scrolled .nav{top:0}
.nav.solid{background:rgba(247,242,232,.92); backdrop-filter:blur(12px); box-shadow:0 1px 0 var(--line); padding-top:11px; padding-bottom:11px}
.nav-brand{display:flex; flex-direction:row; align-items:center; gap:13px; z-index:2; text-decoration:none}
.logo-rose{flex:0 0 auto; transition:opacity .4s}
.lp{fill:rgba(244,240,228,.12); stroke:#f4f0e4; transition:fill .4s, stroke .4s}
.ls{fill:none; stroke:#f4f0e4; transition:stroke .4s}
.logo-text{display:flex; flex-direction:column}
.logo-name{font-family:var(--serif); font-size:19px; font-weight:600; color:#f4f0e4; letter-spacing:.01em; white-space:nowrap; line-height:1.05; transition:color .4s}
.logo-tagline{font-size:9.5px; letter-spacing:.28em; text-transform:uppercase; color:rgba(244,240,228,.7); margin-top:4px; white-space:nowrap; transition:color .4s}
.nav.solid .lp{fill:#e7ebdc; stroke:#6f7a58}
.nav.solid .ls{stroke:#6f7a58}
.nav.solid .logo-name{color:#474e39}
.nav.solid .logo-tagline{color:#6f7a58}
.nav-links{display:flex; align-items:center; gap:28px}
.nav-links a{font-size:14.5px; font-weight:500; color:var(--white); opacity:.92; position:relative; padding:4px 0; transition:color .4s}
.nav-links a::after{content:""; position:absolute; left:0; bottom:-2px; width:0; height:1.5px; background:currentColor; transition:width .25s var(--ease)}
.nav-links a:hover::after{width:100%}
.nav.solid .nav-links a{color:var(--ink)}
.nav-right{display:flex; align-items:center; gap:16px; z-index:2}

.lang{display:inline-flex; align-items:center; font-size:13px; font-weight:600; letter-spacing:.04em; border-radius:20px; overflow:hidden; box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.nav.solid .lang{box-shadow:inset 0 0 0 1px var(--line)}
.lang button{padding:6px 11px; color:var(--white); opacity:.7; transition:all .25s}
.nav.solid .lang button{color:var(--ink-soft)}
.lang button.on{background:var(--linen); color:var(--forest-700); opacity:1}
.nav.solid .lang button.on{background:var(--forest); color:var(--linen)}

.nav-toggle{display:none; flex-direction:column; gap:5px; padding:8px; z-index:2}
.nav-toggle span{width:24px; height:2px; background:var(--white); transition:.3s}
.nav.solid .nav-toggle span{background:var(--ink)}

/* mobile menu */
.mobile-menu{
  position:fixed; inset:0; z-index:55; background:var(--forest);
  display:flex; flex-direction:column; justify-content:center; gap:6px; padding:0 var(--pad);
  transform:translateY(-100%); transition:transform .5s var(--ease); pointer-events:none;
}
.mobile-menu.open{transform:translateY(0); pointer-events:auto}
.mobile-menu a{font-family:var(--serif); font-size:clamp(28px,8vw,40px); color:var(--linen); padding:8px 0; opacity:.92}
.mobile-menu a small{font-family:var(--sans); font-size:13px; letter-spacing:.1em; color:var(--sage); display:block; margin-top:2px}
.mobile-menu .mm-cta{margin-top:24px}

/* =========================================================
   HERO
   ========================================================= */
.hero{position:relative; isolation:isolate; min-height:100svh; display:flex; align-items:flex-end; color:var(--linen);
  background-image:
    linear-gradient(180deg, rgba(11,16,9,.18) 0%, rgba(11,16,9,0) 32%, rgba(11,16,9,.06) 58%, rgba(11,16,9,.34) 84%, rgba(11,16,9,.52) 100%),
    linear-gradient(96deg, rgba(11,16,9,.46) 0%, rgba(11,16,9,.26) 28%, rgba(11,16,9,.06) 52%, rgba(11,16,9,0) 70%),
    url('images/hero-exterior.jpg');
  background-size:cover; background-position:center 60%; background-repeat:no-repeat}
.hero-img{display:none}
.hero::after{content:none}
.hero-inner{position:relative; z-index:2; width:100%; max-width:var(--maxw); margin:0 auto; padding:0 var(--pad) clamp(48px,7vw,84px)}
.hero-rating{display:inline-flex; align-items:center; gap:10px; background:rgba(247,242,232,.16); backdrop-filter:blur(6px); border:1px solid rgba(247,242,232,.28); padding:8px 14px 8px 12px; border-radius:30px; font-size:13.5px; font-weight:600; margin-bottom:22px}
.hero-rating .stars{color:var(--gold); letter-spacing:1px}
.hero h1{font-size:clamp(38px,6.4vw,78px); font-weight:500; max-width:20ch; color:var(--white); text-shadow:0 1px 2px rgba(10,14,8,.55), 0 2px 26px rgba(10,14,8,.5)}
.hero h1 em{font-style:italic; color:#F4E9C8}
.hero-loc{font-family:var(--serif); font-style:italic; font-size:clamp(16px,2vw,22px); color:#F4E9C8; margin-top:14px; letter-spacing:.01em; text-shadow:0 1px 2px rgba(10,14,8,.5)}
.hero .lead{color:rgba(247,242,232,.96); max-width:46ch; margin-top:20px; font-size:clamp(17px,2vw,21px); text-shadow:0 1px 2px rgba(10,14,8,.5), 0 1px 18px rgba(10,14,8,.45)}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; align-items:center}
.hero-actions .note{font-size:13.5px; color:rgba(247,242,232,.78); display:flex; align-items:center; gap:7px}
.dot{width:7px; height:7px; border-radius:50%; background:#7FB069; box-shadow:0 0 0 4px rgba(127,176,105,.25)}
.scroll-cue{position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:2; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:rgba(247,242,232,.7); display:flex; flex-direction:column; align-items:center; gap:8px}
.scroll-cue .l{width:1px; height:34px; background:linear-gradient(rgba(247,242,232,.6), transparent); animation:cue 2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0); transform-origin:top}45%{transform:scaleY(1); transform-origin:top}55%{transform:scaleY(1); transform-origin:bottom}100%{transform:scaleY(0); transform-origin:bottom}}

/* =========================================================
   FACTS STRIP
   ========================================================= */
.facts{background:var(--forest); color:var(--linen)}
.facts .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(247,242,232,.14); border-radius:0}
.fact{background:var(--forest); padding:26px 22px; text-align:center}
.fact .n{font-family:var(--serif); font-size:clamp(28px,3.5vw,38px); color:var(--white); line-height:1}
.fact .l{font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--sage); margin-top:8px}
.facts.inline .wrap{background:transparent; gap:0}

/* =========================================================
   GENERIC SECTION HEAD
   ========================================================= */
.head{max-width:680px}
.head.center{margin:0 auto; text-align:center}
.head h2{font-size:clamp(30px,4.6vw,52px); margin-top:16px}
.head .lead{margin-top:18px}
.section-num{font-family:var(--serif); font-style:italic; color:var(--sage); font-size:18px}

/* =========================================================
   SPLIT (image + text)
   ========================================================= */
.split{display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(32px,5vw,72px); align-items:center}
.split.rev .split-media{order:2}
.split-media{position:relative}
.split-media img{width:100%; height:100%; max-height:560px; object-fit:cover; border-radius:var(--radius)}
.split-media .tag{position:absolute; bottom:16px; left:16px; background:var(--linen); color:var(--forest-700); font-size:12.5px; font-weight:600; letter-spacing:.04em; padding:8px 14px; border-radius:30px; box-shadow:var(--shadow-sm)}
.split-body h2{font-size:clamp(28px,4vw,46px); margin-top:14px}
.split-body p{margin-top:18px; color:var(--ink-soft)}
.split-body .btn{margin-top:28px}

/* =========================================================
   SELLING POINTS
   ========================================================= */
.points{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,40px)}
.point{padding:8px 0}
.point .ic{width:52px; height:52px; color:var(--moss); margin-bottom:20px}
.point .ic svg{width:100%; height:100%}
.point h3{font-size:23px; margin-bottom:10px}
.point p{color:var(--ink-soft); font-size:16px}

/* =========================================================
   GALLERY
   ========================================================= */
.gallery{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; gap:14px}
.gallery figure{position:relative; overflow:hidden; border-radius:var(--radius); cursor:pointer; background:var(--sand-deep)}
.gallery img{width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease)}
.gallery figure:hover img{transform:scale(1.06)}
.gallery figcaption{position:absolute; inset:auto 0 0 0; padding:30px 16px 14px; font-size:13px; font-weight:600; letter-spacing:.04em; color:#fff;
  background:linear-gradient(transparent, rgba(20,28,18,.66)); opacity:0; transform:translateY(8px); transition:.35s var(--ease)}
.gallery figure:hover figcaption{opacity:1; transform:translateY(0)}
.g-tall{grid-row:span 2}
.g-wide{grid-column:span 2}
.gallery .more{display:flex; align-items:center; justify-content:center; background:var(--forest); color:var(--linen); font-weight:600; font-size:15px; gap:8px; text-align:center}
.gallery .more:hover{background:var(--forest-700)}

/* room chips grid */
.rooms{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.room{position:relative; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3.1; cursor:pointer; background:var(--sand-deep)}
.room img{width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease)}
.room:hover img{transform:scale(1.05)}
.room::after{content:""; position:absolute; inset:0; background:linear-gradient(transparent 40%, rgba(20,28,18,.72))}
.room .meta{position:absolute; left:18px; bottom:16px; right:18px; z-index:2; color:#fff}
.room .meta h3{color:#fff; font-size:21px}
.room .meta p{font-size:13.5px; opacity:.85; margin-top:2px}

/* equipment */
.equip{display:grid; grid-template-columns:repeat(3,1fr); gap:14px 40px; margin-top:10px}
.equip li{display:flex; align-items:flex-start; gap:12px; padding:11px 0; border-bottom:1px solid var(--line-soft); font-size:15.5px; list-style:none}
.equip li svg{flex:none; width:19px; height:19px; color:var(--moss); margin-top:2px}

/* =========================================================
   PRICING
   ========================================================= */
.price-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.price-card{background:var(--white); border:1px solid var(--line); border-radius:8px; padding:34px 28px; position:relative; transition:.3s var(--ease)}
.price-card:hover{transform:translateY(-4px); box-shadow:var(--shadow-md)}
.price-card.feature{background:var(--forest); color:var(--linen); border-color:var(--forest)}
.price-card.feature h3{color:var(--white)}
.price-card .season{font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--moss); font-weight:700}
.price-card.feature .season{color:var(--sage)}
.price-card .when{font-family:var(--serif); font-size:22px; margin:6px 0 18px}
.price-card .amt{font-family:var(--serif); font-size:46px; color:var(--forest-700); line-height:1}
.price-card.feature .amt{color:var(--white)}
.price-card .amt small{font-family:var(--sans); font-size:15px; color:var(--ink-soft); font-weight:500}
.price-card.feature .amt small{color:rgba(247,242,232,.7)}
.price-card .pl{margin-top:18px; font-size:14.5px}
.price-card .pl li{padding:7px 0; border-top:1px solid var(--line-soft); display:flex; gap:9px; list-style:none}
.price-card.feature .pl li{border-color:rgba(247,242,232,.16)}
.badge-feature{position:absolute; top:-12px; right:24px; background:var(--terracotta); color:#fff; font-size:11.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:6px 13px; border-radius:20px}
.price-note{margin-top:22px; font-size:14.5px; color:var(--ink-soft); display:flex; flex-wrap:wrap; justify-content:center; gap:8px 24px}
.price-note span{display:inline-flex; align-items:center; gap:8px}

/* conditions panel */
.conditions{margin-top:44px; background:var(--white); border:1px solid var(--line); border-radius:12px; padding:clamp(26px,3.5vw,40px); box-shadow:var(--shadow-sm)}
.conditions h4{font-family:var(--serif); font-weight:500; font-size:clamp(20px,2.6vw,26px); color:var(--forest-700); margin-bottom:22px}
.cond-list{display:grid; grid-template-columns:repeat(2,1fr); gap:22px 40px; list-style:none}
.cond-list li{display:flex; gap:15px; align-items:flex-start}
.cond-ic{flex:none; width:42px; height:42px; border-radius:50%; background:var(--sand); display:flex; align-items:center; justify-content:center; font-size:20px; line-height:1}
.cond-list strong{display:block; font-size:16px; color:var(--ink); font-weight:700; margin-bottom:3px}
.cond-list p{font-size:14.5px; color:var(--ink-soft); line-height:1.55; max-width:42ch}
@media (max-width:760px){.cond-list{grid-template-columns:1fr; gap:18px}}

/* =========================================================
   CALENDAR
   ========================================================= */
.cal-wrap{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.cal{background:var(--white); border:1px solid var(--line); border-radius:8px; padding:24px}
.cal h4{font-size:20px; display:flex; align-items:center; justify-content:space-between}
.cal h4 .av{font-family:var(--sans); font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--moss)}
.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:5px; margin-top:16px}
.cal-grid .dow{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); text-align:center; padding-bottom:4px}
.cal-cell{aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:13.5px; border-radius:5px; color:var(--ink); font-variant-numeric:tabular-nums}
.cal-cell.empty{visibility:hidden}
.cal-cell.free{background:rgba(127,176,105,.16); color:var(--moss); font-weight:600}
.cal-cell.free:hover{background:rgba(127,176,105,.32); cursor:pointer}
.cal-cell.busy{background:var(--sand-deep); color:var(--ink-soft); text-decoration:line-through; opacity:.55}
.cal-cell.changeover{background:linear-gradient(135deg, rgba(127,176,105,.16) 50%, var(--sand-deep) 50%); color:var(--ink-soft)}
.cal-legend{display:flex; gap:20px; margin-top:18px; font-size:13px; color:var(--ink-soft); flex-wrap:wrap}
.cal-legend span{display:inline-flex; align-items:center; gap:8px}
.sw{width:13px; height:13px; border-radius:3px}
.sw.free{background:rgba(127,176,105,.45)} .sw.busy{background:var(--sand-deep)}

/* =========================================================
   STEPS
   ========================================================= */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,44px); counter-reset:step}
.step{position:relative; padding-top:14px}
.step::before{counter-increment:step; content:"0" counter(step); font-family:var(--serif); font-size:46px; color:var(--sage); display:block; margin-bottom:12px; line-height:1}
.step h3{font-size:21px; margin-bottom:8px}
.step p{color:var(--ink-soft); font-size:15.5px}

/* =========================================================
   REVIEWS
   ========================================================= */
.rev-head{display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap}
.score{display:flex; align-items:center; gap:18px}
.score .big{font-family:var(--serif); font-size:62px; color:var(--forest-700); line-height:.9}
.score .stars{color:var(--gold); font-size:20px; letter-spacing:2px}
.score .cnt{font-size:14px; color:var(--ink-soft); margin-top:3px}
.reviews{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:48px}
.review{background:var(--white); border:1px solid var(--line); border-radius:8px; padding:28px}
.review .stars{color:var(--gold); font-size:15px; letter-spacing:1.5px}
.review blockquote{font-family:var(--serif); font-size:19px; line-height:1.5; color:var(--ink); margin:14px 0 20px; font-weight:400}
.review .who{display:flex; align-items:center; gap:12px}
.review .av{width:42px; height:42px; border-radius:50%; background:var(--sage); color:var(--forest-700); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:19px; font-weight:600}
.review .who .nm{font-weight:600; font-size:15px}
.review .who .dt{font-size:13px; color:var(--ink-soft)}
.review .src{margin-left:auto; font-size:11.5px; font-weight:600; letter-spacing:.04em; color:var(--moss); text-transform:uppercase}

/* host band */
.host{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,70px); align-items:center}
.host-media{position:relative}
.host-media img{width:100%; aspect-ratio:4/4.4; object-fit:cover; object-position:center 30%; border-radius:8px}
.host-media .stamp{position:absolute; right:-52px; top:32%; width:150px; height:150px; border-radius:50%; background:rgba(176,94,59,.55); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); box-shadow:inset 0 0 0 1px rgba(255,255,255,.35), var(--shadow-md); text-shadow:0 1px 3px rgba(60,30,15,.35); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; line-height:1.3; transform:rotate(-8deg)}
.host-media .stamp b{font-family:var(--serif); font-size:31px; font-weight:600; display:block; letter-spacing:0}
.host-body .sig{font-family:var(--serif); font-style:italic; font-size:26px; color:var(--moss); margin-top:24px}
.host-stats{display:flex; gap:34px; margin-top:28px; flex-wrap:wrap}
.host-stats .n{font-family:var(--serif); font-size:32px; color:var(--forest-700)}
.host-stats .l{font-size:13px; color:var(--ink-soft)}

/* conciergerie */
.serv-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:clamp(40px,5vw,58px)}
.serv{background:var(--white); border-radius:8px; padding:26px 24px 28px; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s var(--ease)}
.serv:hover{transform:translateY(-4px); box-shadow:var(--shadow-md)}
.serv .ic{width:44px; height:44px; color:var(--terracotta); margin-bottom:16px}
.serv h4{font-family:var(--serif); font-size:21px; color:var(--forest-700); margin-bottom:8px}
.serv p{font-size:14.5px; color:var(--ink-soft); line-height:1.5}
.conc-foot{margin-top:clamp(30px,4vw,40px); text-align:center; font-family:var(--serif); font-style:italic; font-size:clamp(20px,2.4vw,25px); color:var(--moss); max-width:760px; margin-left:auto; margin-right:auto; text-wrap:balance}
@media (max-width:900px){.serv-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.serv-grid{grid-template-columns:1fr}}

/* carnets d'Aurélie */
.carnets .kicker{color:var(--gold)}
.carnets-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:clamp(40px,5vw,56px)}
.carnet{position:relative; background:rgba(247,242,232,.05); border:1px solid rgba(247,242,232,.16); border-radius:12px; padding:34px 30px 36px; transition:transform .3s var(--ease), background .3s var(--ease), border-color .3s var(--ease)}
.carnet:hover{transform:translateY(-5px); background:rgba(247,242,232,.09); border-color:rgba(201,154,46,.5)}
.carnet .num{position:absolute; top:26px; right:30px; font-family:var(--serif); font-style:italic; font-size:24px; color:rgba(247,242,232,.28)}
.carnet .ic{width:46px; height:46px; color:var(--gold); margin-bottom:20px}
.carnet h4{font-family:var(--serif); font-weight:500; font-size:clamp(21px,2.3vw,25px); color:var(--white); margin-bottom:11px; max-width:15ch}
.carnet p{font-size:15px; color:rgba(247,242,232,.78); line-height:1.6}
.carnet .cn-meta{display:block; margin-top:18px; padding-top:16px; border-top:1px solid rgba(247,242,232,.16); font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--gold)}
.carnets-foot{margin-top:clamp(34px,4vw,46px); display:flex; gap:24px; flex-wrap:wrap; align-items:center}
.carnets-foot .ribbon{font-family:var(--serif); font-style:italic; font-size:clamp(19px,2.4vw,26px); color:#F4E9C8; max-width:32ch; line-height:1.38; text-wrap:pretty}
@media (max-width:860px){.carnets-grid{grid-template-columns:1fr}
  .carnets-foot .btn{margin-left:0 !important}}

/* loisirs / jeux */
.play-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:clamp(40px,5vw,52px)}
.play-card{background:var(--white); border:1px solid var(--line); border-radius:12px; padding:32px 28px 30px; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s var(--ease)}
.play-card:hover{transform:translateY(-5px); box-shadow:var(--shadow-md)}
.play-card .ic{width:46px; height:46px; color:var(--terracotta); margin-bottom:18px}
.play-card .pk{font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--moss)}
.play-card h4{font-family:var(--serif); font-weight:500; font-size:clamp(21px,2.3vw,25px); color:var(--forest-700); margin:7px 0 11px; max-width:18ch}
.play-card p{font-size:15px; color:var(--ink-soft); line-height:1.6}
.play-tags{display:flex; flex-direction:column; gap:0; margin-top:20px; border-top:1px solid var(--line-soft)}
.play-tags span{display:flex; align-items:center; gap:11px; font-size:14.5px; font-weight:500; color:var(--forest-700); padding:10px 2px; border-bottom:1px solid var(--line-soft)}
.play-tags span::before{content:""; width:6px; height:6px; background:var(--terracotta-soft); transform:rotate(45deg); flex:none}
.lois-foot{margin-top:clamp(32px,4vw,42px); text-align:center; font-family:var(--serif); font-style:italic; font-size:clamp(20px,2.4vw,26px); color:var(--moss); max-width:30ch; margin-left:auto; margin-right:auto; text-wrap:balance}
@media (max-width:860px){.play-grid{grid-template-columns:1fr}}

/* =========================================================
   REGION
   ========================================================= */
.region-grid{display:grid; grid-template-columns:repeat(12,1fr); gap:16px; grid-auto-rows:minmax(150px,auto)}
.region-card{position:relative; border-radius:var(--radius); overflow:hidden; min-height:150px; background:var(--sand-deep)}
.region-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease)}
.region-card:hover img{transform:scale(1.05)}
.region-card::after{content:""; position:absolute; inset:0; background:linear-gradient(transparent 35%, rgba(20,28,18,.74))}
.region-card .rc{position:absolute; left:20px; bottom:16px; right:20px; z-index:2; color:#fff}
.region-card .rc .k{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.8)}
.region-card .rc h3{color:#fff; font-size:23px; margin-top:3px}
.region-card .rc p{font-size:14px; color:rgba(255,255,255,.85); margin-top:5px}
.r-a{grid-column:span 7; grid-row:span 2}
.r-b{grid-column:span 5}
.r-c{grid-column:span 5}
.r-d{grid-column:span 4}
.r-e{grid-column:span 4}
.r-f{grid-column:span 4}

.tips{display:grid; grid-template-columns:repeat(2,1fr); gap:14px 40px; margin-top:34px}
.tip{display:flex; gap:16px; padding:18px 0; border-top:1px solid var(--line)}
.tip .mi{flex:none; width:40px; height:40px; border-radius:50%; background:var(--sand); color:var(--moss); display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-style:italic; font-size:18px}
.tip h4{font-size:17px; font-family:var(--sans); font-weight:700; color:var(--ink)}
.tip p{font-size:14.5px; color:var(--ink-soft); margin-top:3px}

/* =========================================================
   FAQ
   ========================================================= */
.faq{max-width:820px; margin:0 auto}
.qa{border-bottom:1px solid var(--line)}
.qa button{width:100%; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; text-align:left; font-family:var(--serif); font-size:clamp(19px,2.4vw,24px); color:var(--forest-700)}
.qa .pm{flex:none; width:30px; height:30px; border-radius:50%; border:1.5px solid var(--line); position:relative; transition:.3s}
.qa .pm::before,.qa .pm::after{content:""; position:absolute; left:50%; top:50%; width:11px; height:1.5px; background:var(--forest); transform:translate(-50%,-50%); transition:.3s}
.qa .pm::after{transform:translate(-50%,-50%) rotate(90deg)}
.qa.open .pm{background:var(--forest); border-color:var(--forest)}
.qa.open .pm::before,.qa.open .pm::after{background:var(--linen)}
.qa.open .pm::after{transform:translate(-50%,-50%) rotate(0)}
.qa .ans{max-height:0; overflow:hidden; transition:max-height .4s var(--ease)}
.qa .ans p{padding:0 0 24px; color:var(--ink-soft); max-width:70ch}

/* =========================================================
   BOOKING / CONTACT FORM
   ========================================================= */
.book{display:grid; grid-template-columns:1fr 1fr; gap:clamp(34px,5vw,72px); align-items:start}
.book-intro .chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:26px}
.chip{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--forest-700); background:var(--sand); padding:9px 15px; border-radius:30px}
.book-intro .extlink{display:flex; gap:12px; margin-top:30px; flex-wrap:wrap}
.extbtn{display:inline-flex; align-items:center; gap:9px; font-size:14.5px; font-weight:600; padding:12px 18px; border-radius:6px; background:var(--white); box-shadow:inset 0 0 0 1px var(--line); transition:.25s}
.extbtn:hover{box-shadow:inset 0 0 0 1.5px var(--moss); transform:translateY(-2px)}
.form{background:var(--white); border:1px solid var(--line); border-radius:10px; padding:clamp(24px,3vw,38px); box-shadow:var(--shadow-sm)}
.form h3{font-size:24px; margin-bottom:6px}
.form .fsub{font-size:14.5px; color:var(--ink-soft); margin-bottom:22px}
.field{margin-bottom:16px}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
label{display:block; font-size:13px; font-weight:600; letter-spacing:.02em; color:var(--ink-soft); margin-bottom:7px}
input,select,textarea{width:100%; font-family:inherit; font-size:15.5px; color:var(--ink); background:var(--linen); border:1px solid var(--line); border-radius:6px; padding:13px 14px; transition:.2s}
input:focus,select,textarea:focus{outline:none; border-color:var(--moss); background:var(--white); box-shadow:0 0 0 3px rgba(91,107,78,.12)}
textarea{resize:vertical; min-height:96px}
.form .btn{width:100%; margin-top:8px}
.form .priv{font-size:12.5px; color:var(--ink-soft); text-align:center; margin-top:14px}
.form-success{text-align:center; padding:30px 10px}
.form-success .ok{width:64px; height:64px; border-radius:50%; background:rgba(127,176,105,.2); color:var(--moss); display:flex; align-items:center; justify-content:center; margin:0 auto 18px}
.form-success h3{margin-bottom:8px}
.form-success p{color:var(--ink-soft); font-size:15.5px}

/* =========================================================
   STICKY CTA BAND + MOBILE BAR
   ========================================================= */
.cta-band{background:var(--forest); color:var(--linen); text-align:center; padding:clamp(56px,8vw,96px) var(--pad)}
.cta-band h2{font-size:clamp(30px,5vw,56px); color:var(--white); max-width:18ch; margin:0 auto}
.cta-band .lead{color:rgba(247,242,232,.82); max-width:50ch; margin:18px auto 0}
.cta-band .btns{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:34px}

.mobile-cta{position:fixed; left:0; right:0; bottom:0; z-index:50; background:rgba(247,242,232,.95); backdrop-filter:blur(10px); box-shadow:0 -1px 0 var(--line); padding:11px var(--pad); display:none; align-items:center; justify-content:space-between; gap:14px; transform:translateY(110%); transition:transform .4s var(--ease)}
.mobile-cta.show{transform:translateY(0)}
.mobile-cta .pm{font-size:13px; color:var(--ink-soft)}
.mobile-cta .pm b{font-family:var(--serif); font-size:20px; color:var(--forest-700); display:block}
.mobile-cta .btn{flex:none}

/* =========================================================
   FOOTER
   ========================================================= */
.footer{background:var(--forest-700); color:rgba(247,242,232,.7); padding:clamp(56px,7vw,90px) 0 30px}
.footer h3{color:var(--white); font-size:13px; letter-spacing:.16em; text-transform:uppercase; font-family:var(--sans); font-weight:700; margin-bottom:18px}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px}
.footer .brand-mark{font-family:var(--serif); font-size:26px; color:var(--white); margin-bottom:10px}
.footer p{font-size:14.5px; line-height:1.7}
.footer ul{list-style:none}
.footer ul li{margin-bottom:10px}
.footer a:hover{color:var(--linen)}
.footer ul li a{font-size:14.5px}
.footer .soc{display:flex; gap:12px; margin-top:8px}
.footer .soc a{width:40px; height:40px; border-radius:50%; box-shadow:inset 0 0 0 1px rgba(247,242,232,.25); display:flex; align-items:center; justify-content:center; transition:.25s}
.footer .soc a:hover{background:rgba(247,242,232,.1)}
.footer .soc svg{width:18px; height:18px}
.footer-bot{margin-top:50px; padding-top:24px; border-top:1px solid rgba(247,242,232,.14); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:13px}

/* =========================================================
   LIGHTBOX
   ========================================================= */
.lightbox{position:fixed; inset:0; z-index:90; background:rgba(20,24,16,.94); display:none; align-items:center; justify-content:center; padding:30px}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw; max-height:84vh; object-fit:contain; border-radius:4px; box-shadow:0 20px 80px rgba(0,0,0,.5)}
.lb-cap{position:absolute; bottom:26px; left:0; right:0; text-align:center; color:rgba(247,242,232,.85); font-size:14px; letter-spacing:.04em}
.lb-x{position:absolute; top:22px; right:26px; width:46px; height:46px; border-radius:50%; background:rgba(247,242,232,.12); color:#fff; font-size:22px; display:flex; align-items:center; justify-content:center; transition:.25s}
.lb-x:hover{background:rgba(247,242,232,.24)}
.lb-nav{position:absolute; top:50%; transform:translateY(-50%); width:54px; height:54px; border-radius:50%; background:rgba(247,242,232,.1); color:#fff; font-size:24px; display:flex; align-items:center; justify-content:center; transition:.25s}
.lb-nav:hover{background:rgba(247,242,232,.22)}
.lb-prev{left:20px} .lb-next{right:20px}

/* =========================================================
   SCROLL REVEAL
   ========================================================= */
.reveal{opacity:0; transform:translateY(26px); transition:opacity .8s var(--ease), transform .8s var(--ease)}
.reveal.in{opacity:1; transform:none}
.reveal.d1{transition-delay:.08s} .reveal.d2{transition-delay:.16s} .reveal.d3{transition-delay:.24s} .reveal.d4{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1; transform:none} *{scroll-behavior:auto}}

/* =========================================================
   SEASON TOP BAR  (insp. Moulin de Fourges)
   ========================================================= */
.topbar{position:fixed; top:0; left:0; right:0; z-index:65; height:40px;
  display:flex; align-items:center; justify-content:center; gap:14px;
  background:var(--forest-700); color:var(--linen); padding:0 var(--pad);
  font-size:13.5px; letter-spacing:.01em; transition:transform .45s var(--ease)}
.topbar .tb-dot{width:7px; height:7px; border-radius:50%; background:#7FB069; box-shadow:0 0 0 4px rgba(127,176,105,.22); flex:none}
.topbar .tb-msg{opacity:.92}
.topbar a{font-weight:700; color:var(--white); text-decoration:underline; text-underline-offset:3px; text-decoration-color:rgba(255,255,255,.45); white-space:nowrap}
.topbar a:hover{text-decoration-color:var(--white)}
body.scrolled .topbar{transform:translateY(-100%)}

/* =========================================================
   EDITORIAL HEADER FLOURISHES  (insp. Moulin / Vau d'Arz)
   ========================================================= */
.kicker{font-family:var(--serif); font-style:italic; font-weight:400; font-size:clamp(17px,2.1vw,21px); color:var(--moss); display:block; margin-bottom:12px; letter-spacing:.005em}
.bg-forest .kicker{color:var(--sage)}
.sep{display:flex; align-items:center; gap:14px; margin-top:22px}
.head.center .sep{justify-content:center}
.sep::before,.sep::after{content:""; height:1px; width:54px; background:var(--sage); opacity:.55}
.head:not(.center) .sep::before{display:none}
.sep .dia{width:7px; height:7px; background:var(--terracotta-soft); transform:rotate(45deg); flex:none}
.bg-forest .sep .dia{background:var(--sage)}
.ch-dia{width:6px; height:6px; background:var(--terracotta-soft); transform:rotate(45deg); flex:none}
.split-body .chips{display:flex; flex-wrap:wrap; gap:10px; align-items:stretch}
.split-body .chips .chip{white-space:nowrap}
.split-body .chips + .btn{margin-top:26px}

/* =========================================================
   NAMED BEDROOMS  (insp. Domaine de la Partoucie)
   ========================================================= */
.beds{display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(28px,4vw,56px); align-items:center; margin-top:30px}
.beds-media{position:relative}
.beds-media img{width:100%; aspect-ratio:4/4.6; object-fit:cover; border-radius:6px}
.beds-media .tag{position:absolute; left:16px; bottom:16px; background:var(--linen); color:var(--forest-700); font-size:12.5px; font-weight:600; padding:8px 14px; border-radius:30px; box-shadow:var(--shadow-sm)}
.bedlist{display:flex; flex-direction:column}
.bedrow{padding:22px 0; border-top:1px solid var(--line)}
.bedrow:first-child{border-top:none; padding-top:0}
.bedrow .bh{display:flex; align-items:baseline; justify-content:space-between; gap:16px; flex-wrap:wrap}
.bedrow h4{font-family:var(--serif); font-size:clamp(21px,2.6vw,27px); font-weight:500; color:var(--forest-700)}
.bedrow .cfg{font-size:13px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--moss); white-space:nowrap}
.bedrow p{color:var(--ink-soft); font-size:15.5px; margin-top:7px; max-width:48ch}
.bedrow .feat{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px}
.bedrow .feat span{font-size:12.5px; color:var(--ink-soft); background:var(--sand); padding:5px 11px; border-radius:20px}

/* =========================================================
   PULL-QUOTE BAND  (insp. Manoir du Vau d'Arz)
   ========================================================= */
.quoteband{background:var(--forest-700); color:var(--linen); text-align:center; padding:clamp(60px,9vw,108px) var(--pad)}
.quoteband .qb-mark{font-family:var(--serif); font-size:64px; line-height:.6; color:var(--sage); display:block; margin-bottom:6px}
.quoteband blockquote{font-family:var(--serif); font-style:italic; font-weight:400; font-size:clamp(24px,4vw,42px); line-height:1.32; color:var(--white); max-width:24ch; margin:0 auto; text-wrap:balance}
.quoteband .qb-by{margin-top:26px; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--sage)}

.imgquote .iq-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:center}
.imgquote .iq-media{margin:0; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md)}
.imgquote .iq-media img{display:block; width:100%; aspect-ratio:1/1; object-fit:cover}
.imgquote .iq-body .qb-mark{font-family:var(--serif); font-size:64px; line-height:.6; display:block; margin-bottom:10px}
.imgquote .iq-quote{font-family:var(--serif); font-style:italic; font-weight:400; font-size:clamp(24px,3vw,38px); line-height:1.34; color:var(--forest-700); margin:0; max-width:18ch; text-wrap:balance}
.imgquote .iq-by{margin-top:28px; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--moss)}
@media (max-width:760px){
  .imgquote .iq-grid{grid-template-columns:1fr; gap:32px}
  .imgquote .iq-quote{max-width:none}
}

/* journal / blog */
.journal-head{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap}
.journal-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:44px}
.jcard{display:flex; flex-direction:column; background:var(--white); border-radius:8px; overflow:hidden; box-shadow:var(--shadow-sm); transition:transform .3s var(--ease), box-shadow .3s var(--ease)}
.jcard:hover{transform:translateY(-4px); box-shadow:var(--shadow-md)}
.jcard .jc-media{display:block; aspect-ratio:3/2.1; overflow:hidden; background:var(--sand-deep)}
.jcard .jc-media img{width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease)}
.jcard:hover .jc-media img{transform:scale(1.05)}
.jcard .jc-body{display:flex; flex-direction:column; gap:9px; padding:20px 20px 22px; flex:1}
.jcard .jc-k{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--moss); font-weight:700}
.jcard .jc-h{font-family:var(--serif); font-size:21px; line-height:1.25; color:var(--forest-700); text-wrap:pretty}
.jcard .jc-more{margin-top:auto; padding-top:6px; font-size:14px; font-weight:600; color:var(--terracotta)}
@media (max-width:900px){.journal-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:540px){.journal-grid{grid-template-columns:1fr}}

/* =========================================================
   ARTICLE / BLOG POST PAGES
   ========================================================= */
.art-top{position:sticky; top:0; z-index:40; background:rgba(247,242,232,.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.art-top .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:13px; padding-bottom:13px}
.art-top .brand{display:flex; flex-direction:column; line-height:1.12; text-decoration:none}
.art-top .brand b{font-family:var(--serif); font-size:20px; color:var(--forest-700); font-weight:600; white-space:nowrap}
.art-top .brand span{font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--moss)}
.art-top .back{font-size:14px; font-weight:600; color:var(--forest); display:inline-flex; align-items:center; gap:7px}
.art-top .back:hover{color:var(--terracotta)}

.art-hero{position:relative; height:min(58vh,540px); display:flex; align-items:flex-end; color:var(--linen); isolation:isolate}
.art-hero img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2}
.art-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(transparent 28%, rgba(18,26,16,.74)); z-index:-1}
.art-hero .wrap{padding-bottom:clamp(30px,5vw,58px); width:100%}
.art-hero .eyebrow{font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--sage); font-weight:700; margin-bottom:14px}
.art-hero h1{font-family:var(--serif); font-weight:500; font-size:clamp(34px,6vw,66px); line-height:1.03; color:#fff; max-width:20ch; text-wrap:balance}

.article{max-width:768px; margin:0 auto; padding:clamp(46px,7vw,84px) var(--pad)}
.article .lede{font-family:var(--serif); font-style:italic; font-size:clamp(20px,2.6vw,27px); line-height:1.44; color:var(--moss); margin-bottom:36px; text-wrap:pretty}
.article h2{font-family:var(--serif); font-weight:500; font-size:clamp(24px,3.4vw,34px); color:var(--forest-700); margin:48px 0 14px; line-height:1.16}
.article h3{font-size:20px; font-weight:700; color:var(--ink); margin:34px 0 10px}
.article p{margin:0 0 20px; color:var(--ink-soft); font-size:17.5px; line-height:1.74}
.article p strong{color:var(--ink); font-weight:700}
.article a{color:var(--terracotta); text-decoration:underline; text-underline-offset:2px}
.article ul{margin:4px 0 24px; padding-left:1.15em; color:var(--ink-soft)}
.article li{margin-bottom:9px; line-height:1.65; font-size:17.5px}
.article figure{margin:36px 0}
.article figure > img{width:100%; border-radius:var(--radius); display:block; box-shadow:var(--shadow-sm)}
.article figcaption{font-size:13.5px; color:var(--moss); margin-top:10px; text-align:center; font-style:italic}
.article .fig2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.article .fig2 img{width:100%; height:100%; max-height:340px; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow-sm)}
@media (max-width:560px){.article .fig2{grid-template-columns:1fr}}
.article .pullquote{font-family:var(--serif); font-style:italic; font-size:clamp(22px,3vw,30px); line-height:1.42; color:var(--forest-700); text-align:center; margin:44px 0; padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); text-wrap:balance}
.press-list{display:grid; grid-template-columns:repeat(2,1fr); gap:10px 16px; margin:10px 0 26px; list-style:none; padding:0}
.press-list li{margin:0}
.press-list a{display:flex; align-items:center; gap:10px; padding:14px 16px; background:var(--sand); border-radius:6px; font-size:15px; font-weight:600; color:var(--forest-700); text-decoration:none; transition:.2s var(--ease)}
.press-list a:hover{background:var(--sand-deep); transform:translateY(-2px)}
.press-list a::before{content:"▸"; color:var(--terracotta); font-size:13px}
@media (max-width:560px){.press-list{grid-template-columns:1fr}}
.art-cta{background:var(--forest); color:var(--linen); text-align:center; padding:clamp(52px,7vw,86px) var(--pad)}
.art-cta h2{font-family:var(--serif); font-weight:500; color:#fff; font-size:clamp(26px,4vw,42px); max-width:20ch; margin:0 auto 12px; line-height:1.1}
.art-cta p{color:rgba(247,242,232,.82); max-width:48ch; margin:0 auto 26px}
@media (max-width:860px){
  .beds{grid-template-columns:1fr; gap:26px}
  .beds-media img{aspect-ratio:16/11}
}

/* =========================================================
   PREMIUM RATING BADGE  (insp. Manoir du Vau d'Arz)
   ========================================================= */
.rating-badge{display:inline-flex; align-items:center; gap:20px; background:var(--white); border:1px solid var(--line); border-radius:14px; padding:18px 24px; box-shadow:var(--shadow-sm)}
.rating-badge .rb-score{font-family:var(--serif); font-size:56px; line-height:.85; color:var(--forest-700)}
.rating-badge .rb-stars{color:var(--gold); font-size:18px; letter-spacing:2px}
.rating-badge .rb-cnt{font-size:13.5px; color:var(--ink-soft); margin-top:5px}
.rating-badge .rb-src{display:flex; gap:7px; margin-top:9px; flex-wrap:wrap}
.rating-badge .rb-src span{font-size:10.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--moss); background:var(--sand); padding:4px 9px; border-radius:20px}
@media (max-width:520px){
  .topbar{font-size:12px; gap:10px}
  .topbar .tb-dot{display:none}
  .rating-badge{padding:16px 18px; gap:14px}
  .rating-badge .rb-score{font-size:46px}
}

/* =========================================================
   PERCHE & PERRIÈRE
   ========================================================= */
.terr-split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,60px); align-items:center; margin-top:clamp(40px,5vw,64px)}
.terr-split.rev .terr-media{order:2}
.terr-media{position:relative}
.terr-media img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:6px}
.terr-media .cap{position:absolute; left:14px; bottom:14px; background:var(--linen); color:var(--forest-700); font-size:12px; font-weight:600; padding:7px 13px; border-radius:30px; box-shadow:var(--shadow-sm)}
.terr-body .kicker{margin-bottom:6px}
.terr-body h3{font-size:clamp(24px,3.2vw,34px); color:var(--forest-700)}
.terr-body p{color:var(--ink-soft); margin-top:14px; max-width:50ch}
.terr-stats{display:flex; flex-wrap:wrap; gap:18px 32px; margin-top:24px}
.terr-stats .ts{display:flex; flex-direction:column}
.terr-stats .ts b{font-family:var(--serif); font-size:30px; color:var(--terracotta); line-height:1}
.terr-stats .ts span{font-size:13px; color:var(--ink-soft); margin-top:4px; max-width:16ch}
.press{margin-top:clamp(52px,7vw,80px); text-align:center}
.press .pl{display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:22px}
.press .pl span{font-family:var(--serif); font-style:italic; font-size:clamp(15px,1.8vw,19px); color:var(--moss); padding:9px 18px; border:1px solid var(--line); border-radius:30px; background:var(--white)}
@media (max-width:860px){.terr-split{grid-template-columns:1fr; gap:24px} .terr-split.rev .terr-media{order:0}}

/* =========================================================
   INSTAGRAM BAND
   ========================================================= */
.insta{background:var(--sand); padding:clamp(48px,7vw,84px) 0}
.insta-inner{display:flex; align-items:center; gap:clamp(22px,4vw,48px)}
.insta-logo{flex:none; width:74px; height:74px; border-radius:20px; display:flex; align-items:center; justify-content:center; color:#fff;
  background:linear-gradient(45deg,#F09433 0%,#E6683C 25%,#DC2743 50%,#CC2366 75%,#BC1888 100%); box-shadow:var(--shadow-sm); transition:transform .3s var(--ease)}
.insta-logo:hover{transform:rotate(-4deg) scale(1.04)}
.insta-logo svg{width:40px; height:40px}
.insta-text{flex:1; min-width:0}
.insta-text h2{font-size:clamp(24px,3.2vw,36px); margin-top:8px}
.insta-text p{color:var(--ink-soft); margin-top:12px; max-width:56ch; font-size:16px}
.insta-cta{flex:none; display:inline-flex; flex-direction:column; align-items:center; gap:4px; background:var(--forest); color:var(--linen); padding:20px 30px; border-radius:14px; box-shadow:0 2px 10px rgba(40,52,31,.25); transition:all .25s var(--ease)}
.insta-cta:hover{background:var(--forest-700); transform:translateY(-3px); box-shadow:0 10px 26px rgba(40,52,31,.3)}
.insta-cta .ig{width:30px; height:30px; color:var(--sage)}
.insta-cta .ig svg{width:100%; height:100%}
.insta-cta .hd{font-family:var(--serif); font-size:19px; margin-top:4px}
.insta-cta .fl{font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--sage)}
@media (max-width:760px){
  .insta-inner{flex-direction:column; text-align:center}
  .insta-text p{margin-left:auto; margin-right:auto}
  .insta-text .overline{justify-content:center}
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1000px){
  .region-grid{grid-template-columns:repeat(2,1fr)}
  .r-a,.r-b,.r-c,.r-d,.r-e,.r-f{grid-column:span 1; grid-row:auto}
  .r-a{grid-column:span 2}
  .host{grid-template-columns:1fr; gap:34px}
  .host-media img{aspect-ratio:16/10}
  .host-media .stamp{right:-8px; bottom:-18px}
}
@media (max-width:860px){
  .nav-links{display:none}
  .nav-toggle{display:flex}
  .nav .lang{display:none}
  .split{grid-template-columns:1fr; gap:28px}
  .split.rev .split-media{order:0}
  .points,.steps,.reviews,.rooms,.price-grid{grid-template-columns:1fr}
  .price-card.feature{order:-1}
  .cal-wrap,.book{grid-template-columns:1fr}
  .facts .wrap{grid-template-columns:repeat(2,1fr)}
  .equip{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-auto-rows:150px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .tips{grid-template-columns:1fr}
  .mobile-cta{display:flex}
  body{padding-bottom:64px}
  .hero{min-height:92svh}
}
@media (max-width:520px){
  .facts .wrap{grid-template-columns:repeat(2,1fr)}
  .equip{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .row2{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .g-wide{grid-column:span 2}
  .score .big{font-size:48px}
  .reviews .review:nth-child(n+3){display:none}
}
