/* ============================================================
   Gîte au Cœur de Tours — Design system v2
   Direction : sobre, très visuel, professionnel — inspiré des
   sites d'agences immobilières haut de gamme et des maisons
   d'hôtes premium. Photographie au premier plan, densité
   d'information faible, hiérarchie claire.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,500&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --white:#FFFFFF;
  --paper:#F7F6F2;         /* fond secondaire, très légèrement chaud */
  --paper-deep:#EFEDE6;
  --ink:#171916;           /* texte principal, quasi noir */
  --ink-soft:#5B5F58;      /* texte secondaire */
  --forest:#1F3D2E;        /* vert profond — accent principal, sobre */
  --forest-tint:#E7EDE8;   /* fond teinté vert très clair */
  --forest-hover:#16301F;
  --brass:#A9843F;         /* accent chaud, utilisé avec parcimonie */
  --border:#E3E0D7;
  --border-strong:#CFCBBD;
  --shadow:0 18px 40px rgba(23,25,22,0.10);
  --shadow-sm:0 4px 14px rgba(23,25,22,0.08);
  --radius:6px;
  --max:1240px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:'Inter', sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}
h1,h2,h3,h4{
  font-family:'Newsreader', serif;
  font-weight:500;
  line-height:1.14;
  margin:0 0 0.45em;
  color:var(--ink);
  letter-spacing:-0.01em;
}
h1{font-size:clamp(2.3rem, 4.4vw, 3.6rem); font-weight:500;}
h2{font-size:clamp(1.7rem, 2.8vw, 2.35rem);}
h3{font-size:1.2rem; font-family:'Inter',sans-serif; font-weight:600;}
p{margin:0 0 1em; color:var(--ink-soft); max-width:60ch;}
.container{max-width:var(--max); margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:'Inter',sans-serif; text-transform:uppercase;
  font-size:0.74rem; letter-spacing:0.14em; font-weight:600;
  color:var(--brass); display:inline-block; margin-bottom:10px;
}

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:3px solid var(--forest); outline-offset:2px;
}

/* ---------- Header — single green band: brand + tagline + nav ---------- */
header.site{
  position:sticky; top:0; z-index:50;
  background:var(--forest);
}
.nav-wrap{
  display:flex; flex-direction:column; gap:6px;
  max-width:var(--max); margin:0 auto; padding:10px 28px 14px;
}
.header-top{
  display:flex; justify-content:flex-end; align-items:center; gap:18px;
  font-size:0.78rem; flex-wrap:wrap;
}
.header-main{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand-block{display:flex; flex-direction:column; gap:2px; text-decoration:none; flex-shrink:0;}
.brand-title{
  font-family:'Newsreader',serif; font-weight:600; font-size:1.36rem;
  color:#FAF7EF; line-height:1.1; white-space:nowrap;
}
.brand-tagline{
  font-family:'Inter',sans-serif; font-weight:500; font-size:0.7rem;
  letter-spacing:0.07em; text-transform:uppercase; color:#AEC2B4; white-space:nowrap;
}
nav.primary{display:flex; gap:20px; align-items:center;}
nav.primary a{
  text-decoration:none; font-size:0.87rem; font-weight:500; color:#D7E1DF;
  position:relative; padding:6px 0; white-space:nowrap;
}
nav.primary a:hover, nav.primary a[aria-current="page"]{color:#FAF7EF;}
nav.primary a[aria-current="page"]::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--brass);
}
.nav-phone{
  display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
  color:#D7E1DF; text-decoration:none; font-size:0.78rem; font-weight:500;
}
.nav-phone:hover{color:#FAF7EF;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--forest); color:#fff; text-decoration:none; text-align:center; white-space:nowrap;
  padding:13px 24px; border-radius:var(--radius); font-weight:600; font-size:0.9rem;
  border:1px solid var(--forest); cursor:pointer; font-family:'Inter',sans-serif;
  transition:background .15s ease, transform .15s ease, box-shadow .15s ease;
}
.btn:hover{background:var(--forest-hover); box-shadow:var(--shadow-sm);}
.btn.ghost{background:#fff; color:var(--ink); border:1px solid var(--border-strong);}
.btn.ghost:hover{border-color:var(--forest); color:var(--forest);}
.btn.gold{background:var(--brass); border-color:var(--brass); color:#fff;}
.btn.gold:hover{background:#8E7136;}
.btn.block{width:100%; white-space:normal;}
.nav-toggle{display:none; background:none; border:none; cursor:pointer;}

.lang-switch{display:flex; align-items:center; gap:2px; font-size:0.78rem; font-weight:600; color:#AEC2B4; white-space:nowrap;}
.lang-switch a{padding:4px 6px; border-radius:3px; text-decoration:none; color:#AEC2B4;}
.lang-switch a.active{color:#FAF7EF; text-decoration:underline; text-underline-offset:3px;}
.lang-switch a:hover{color:#FAF7EF;}
.lang-switch span{color:#5B7666;}

/* ---------- Hero — photo-forward, split layout ---------- */
.hero{
  display:grid; grid-template-columns:1fr 1fr; align-items:stretch;
  min-height:min(80vh,660px);
}
.hero-copy{
  display:flex; flex-direction:column; justify-content:center;
  padding:64px clamp(28px,5vw,80px);
}
.hero-copy p.lede{font-size:1.08rem; max-width:44ch;}
.hero-facts{display:flex; gap:28px; margin:26px 0 30px; flex-wrap:wrap;}
.hero-facts .fact b{display:block; font-family:'Newsreader',serif; font-size:1.7rem; color:var(--forest); font-weight:600;}
.hero-facts .fact span{font-size:0.8rem; color:var(--ink-soft);}
.hero-cta{display:flex; gap:14px; flex-wrap:wrap;}
.hero-media{
  background-size:cover; background-position:center;
  min-height:340px;
}
.rating-pill{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--forest-tint); color:var(--forest);
  padding:8px 14px; border-radius:100px; font-size:0.82rem; font-weight:600;
  margin-bottom:20px;
}
@media (max-width:900px){
  .hero{grid-template-columns:1fr;}
  .hero-media{min-height:280px; order:-1;}
  .hero-copy{padding:40px 24px;}
}

/* ---------- Sections ---------- */
section{padding:80px 0;}
section.tight{padding:52px 0;}
.section-head{max-width:640px; margin:0 0 44px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.two-col{display:grid; grid-template-columns:1.05fr 0.95fr; gap:64px; align-items:center;}
@media (max-width:860px){ .two-col{grid-template-columns:1fr; gap:36px;} }

/* ---------- Cards / features ---------- */
.cards{display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden;}
@media (max-width:860px){ .cards{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .cards{grid-template-columns:1fr;} }
.card{background:#fff; padding:32px 26px;}
.card svg{margin-bottom:16px;}
.card h3{margin-bottom:8px; font-size:1.02rem;}
.card p{font-size:0.92rem; margin:0;}

.stat-row{display:flex; gap:44px; flex-wrap:wrap; margin-top:10px;}
.stat b{font-family:'Newsreader',serif; font-size:2.1rem; display:block; color:var(--forest); font-weight:600;}
.stat span{font-size:0.84rem; color:var(--ink-soft);}

/* ---------- Gallery ---------- */
.gallery{display:grid; grid-template-columns:repeat(4, 1fr); gap:12px;}
.gallery figure{margin:0; overflow:hidden; border-radius:var(--radius);}
.gallery img{border-radius:var(--radius); aspect-ratio:4/3; object-fit:cover; width:100%; height:100%; transition:transform .3s ease;}
.gallery figure:hover img{transform:scale(1.05);}
.gallery .tall{grid-row:span 2; aspect-ratio:auto; height:100%;}
@media (max-width:760px){ .gallery{grid-template-columns:1fr 1fr;} }

/* ---------- Testimonial ---------- */
.testimonial{
  background:var(--forest); color:#fff; border-radius:var(--radius);
  padding:40px 38px; position:relative;
}
.testimonial p{color:#EAEFEA; font-family:'Newsreader',serif; font-style:italic; font-size:1.24rem; max-width:none;}
.testimonial footer{font-size:0.85rem; color:#B9C7BC; font-family:'Inter',sans-serif; font-style:normal;}
.stars{color:var(--brass); letter-spacing:2px; margin-bottom:12px; font-size:1rem;}

/* ---------- Pricing table ---------- */
table.pricing{width:100%; border-collapse:collapse; margin:24px 0; border:1px solid var(--border); border-radius:var(--radius); overflow:hidden;}
table.pricing th, table.pricing td{ text-align:left; padding:16px 18px; border-bottom:1px solid var(--border);}
table.pricing thead th{background:var(--paper); font-family:'Inter',sans-serif; font-weight:600; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-soft);}
table.pricing td.price{font-family:'Newsreader',serif; font-size:1.4rem; color:var(--forest); white-space:nowrap; font-weight:600;}
table.pricing tr:last-child td{border-bottom:none;}

/* ---------- Availability calendar (informative, green/red) ---------- */
.availability{display:grid; grid-template-columns:repeat(7, 1fr); gap:6px; max-width:420px;}
.availability .day-header{
  aspect-ratio:1; display:flex; align-items:center; justify-content:center;
  font-size:0.72rem; font-weight:700; color:var(--ink-soft); text-transform:uppercase;
}
.availability .day{
  aspect-ratio:1; border-radius:4px; display:flex; align-items:center; justify-content:center;
  font-size:0.72rem; font-weight:600; color:#fff; background:#3F8D5C;
}
.availability .day.empty{background:transparent;}
.availability .day.booked{background:#C6453B;}
.legend{display:flex; gap:20px; margin-top:16px; font-size:0.85rem; color:var(--ink-soft);}
.legend span{display:inline-flex; align-items:center; gap:8px;}
.legend i{width:12px;height:12px;border-radius:3px;display:inline-block;}

/* ---------- Date field popup calendar (in the booking form) ---------- */
.date-popup{
  position:absolute; top:calc(100% + 6px); left:0; z-index:60;
  background:#fff; border:1px solid var(--border); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:16px; width:280px; max-height:340px; overflow-y:auto;
}
.pd-month-label{font-size:0.85rem; font-weight:700; color:var(--ink); margin:10px 0 6px;}
.pd-month-label:first-child{margin-top:0;}
.pd-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:3px;}
.pd-weekday{
  aspect-ratio:1; display:flex; align-items:center; justify-content:center;
  font-size:0.65rem; font-weight:700; color:var(--ink-soft); text-transform:uppercase;
}
.pd-day{
  aspect-ratio:1; border-radius:3px; display:flex; align-items:center; justify-content:center;
  font-size:0.72rem;
}
.pd-day.pd-empty{background:transparent;}
.pd-day.pd-available{background:var(--forest-tint); color:var(--forest); cursor:pointer;}
.pd-day.pd-available:hover{background:var(--forest); color:#fff;}
.pd-day.pd-disabled{
  background:var(--paper-deep); color:#B0AA98; text-decoration:line-through; cursor:not-allowed;
}

/* ---------- Booking form ---------- */
form.request{background:var(--paper); border:1px solid var(--border); border-radius:var(--radius); padding:36px; box-shadow:var(--shadow-sm);}
form.request label{display:block; font-size:0.84rem; font-weight:600; margin:18px 0 7px; color:var(--ink);}
form.request label:first-of-type{margin-top:0;}
form.request input, form.request textarea, form.request select{
  width:100%; padding:12px 14px; border:1px solid var(--border-strong); border-radius:var(--radius);
  font-family:'Inter',sans-serif; font-size:0.95rem; background:#fff;
}
form.request input:focus, form.request textarea:focus{border-color:var(--forest);}
form.request textarea{min-height:110px; resize:vertical;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.form-row > div{position:relative;}
@media (max-width:520px){ .form-row{grid-template-columns:1fr;} }
.form-note{font-size:0.83rem; color:var(--ink-soft); margin-top:16px;}
.form-status{margin-top:14px; font-size:0.9rem; font-weight:600;}
.form-status.ok{color:var(--forest);}
.form-status.err{color:#a33;}

/* ---------- Activities list ---------- */
.activity-item{display:grid; grid-template-columns:240px 1fr; gap:32px; align-items:start; padding:32px 0; border-top:1px solid var(--border);}
.activity-item:last-child{border-bottom:1px solid var(--border);}
.activity-item img{border-radius:var(--radius); aspect-ratio:4/3; object-fit:cover;}
@media (max-width:640px){ .activity-item{grid-template-columns:1fr;} }

/* ---------- CTA band ---------- */
.cta-band{background:var(--forest); color:#fff; text-align:center;}
.cta-band h2{color:#fff;}
.cta-band p{color:#C9D4CC; margin-left:auto; margin-right:auto;}

/* ---------- Footer ---------- */
footer.site{background:var(--ink); color:#C7C9C3; padding:56px 0 28px; margin-top:0;}
footer.site a{color:#F1F0EA; text-decoration:none;}
footer.site a:hover{text-decoration:underline;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px;}
@media (max-width:700px){ .footer-grid{grid-template-columns:1fr;} }
.footer-grid h4{color:#F4F0E4; font-size:0.9rem; margin-bottom:14px; font-family:'Inter',sans-serif; text-transform:uppercase; letter-spacing:0.05em;}
.footer-grid p, .footer-grid li{color:#9C9F97; font-size:0.9rem;}
.footer-grid ul{list-style:none; padding:0; margin:0;}
.footer-grid li{margin-bottom:9px;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,0.1); margin-top:40px; padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:0.8rem; color:#7D8078;
}

.skip-link{position:absolute; left:-999px; top:auto; background:var(--ink); color:#fff; padding:10px 16px; z-index:100;}
.skip-link:focus{left:16px; top:16px;}

@media (max-width:760px){
  .header-main{flex-wrap:wrap;}
  nav.primary{
    position:fixed; inset:0 0 0 0; top:88px; background:var(--forest);
    flex-direction:column; padding:32px 24px; gap:24px; align-items:flex-start;
    transform:translateX(100%); transition:transform .25s ease; z-index:40;
    opacity:1;
  }
  nav.primary.open{transform:translateX(0);}
  .nav-toggle{display:block;}
  .nav-toggle svg path{stroke:#FAF7EF;}
}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto;} }
