/*
 * Vino Terre Happy — Feuille de styles principale
 * Version 1.0 — 2025
 * Auteur : Etienne Bertet
 */

/* ============================================================
   1. VARIABLES & RESET
   ============================================================ */
:root {
  --burgundy: #6B1A2A;
  --deep-wine: #3D0C14;
  --gold: #C9A84C;
  --gold-light: #E8D18A;
  --cream: #F5EFE0;
  --warm-white: #FAF7F0;
  --text-dark: #1C0A0E;
  --nav-h: 88px;
  --t: 0.3s ease;
  --max-w: 1200px;
}

*,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:16px; }
body { background:var(--deep-wine); color:var(--cream); font-family:'Jost',sans-serif; font-weight:300; overflow-x:hidden; }
img { max-width:100%; height:auto; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }
button { font-family:inherit; }

/* ============================================================
   2. TYPOGRAPHY UTILITIES
   ============================================================ */
.label {
  font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold);
  display:flex; align-items:center; gap:1rem; margin-bottom:1.2rem;
}
.label::after { content:''; display:inline-block; width:40px; height:1px; background:var(--gold); }

/* ============================================================
   3. BUTTONS
   ============================================================ */
.btn-primary {
  display:inline-block; font-family:'Cinzel',serif; font-size:.68rem;
  letter-spacing:.25em; text-transform:uppercase; color:var(--deep-wine);
  background:var(--gold); border:none; padding:1rem 2.5rem;
  cursor:pointer; transition:background var(--t),transform var(--t);
}
.btn-primary:hover { background:var(--gold-light); transform:translateY(-2px); }

.btn-outline {
  display:inline-block; font-family:'Cinzel',serif; font-size:.68rem;
  letter-spacing:.25em; text-transform:uppercase; color:var(--gold);
  background:transparent; border:1px solid rgba(201,168,76,.5);
  padding:1rem 2.5rem; cursor:pointer;
  transition:border-color var(--t),color var(--t),transform var(--t);
}
.btn-outline:hover { border-color:var(--gold); color:var(--gold-light); transform:translateY(-2px); }

.btn-text {
  font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--gold); background:none;
  border:none; cursor:pointer; padding:0;
  transition:color var(--t); display:inline-flex; align-items:center; gap:.6rem;
}
.btn-text::after { content:'→'; font-size:.8rem; transition:transform var(--t); }
.btn-text:hover { color:var(--gold-light); }
.btn-text:hover::after { transform:translateX(4px); }

/* ============================================================
   4. NAVIGATION
   ============================================================ */
.site-nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--nav-h); display:flex; align-items:center;
  justify-content:space-between; padding:0 5vw;
  border-bottom:1px solid rgba(201,168,76,.12);
  background:rgba(26,5,8,.94);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  transition:background var(--t);
}
.nav-logo {
  font-family:'Cinzel',serif; font-size:.82rem;
  letter-spacing:.35em; color:var(--gold); text-transform:uppercase;
  white-space:nowrap;
}
.nav-menu { display:flex; align-items:center; gap:.3rem; }
.nav-menu > li { position:relative; }
.nav-menu > li > a,
.nav-menu > li > button.nav-item {
  font-family:'Jost',sans-serif; font-weight:200; font-size:.71rem;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--cream); opacity:.65;
  transition:opacity var(--t),color var(--t);
  padding:.5rem .9rem; display:block;
  background:none; border:none; cursor:pointer; white-space:nowrap;
}
.nav-menu > li > a:hover,
.nav-menu > li > button.nav-item:hover,
.nav-menu > li > a.active { opacity:1; color:var(--gold-light); }

/* Dropdown toggle button */
.nav-dropdown-btn {
  display:flex; align-items:center; gap:.4rem;
  font-family:'Jost',sans-serif; font-weight:200; font-size:.71rem;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--cream); opacity:.65;
  transition:opacity var(--t),color var(--t);
  padding:.5rem .9rem; background:none; border:none; cursor:pointer;
}
.nav-dropdown-btn:hover { opacity:1; color:var(--gold-light); }
.dropdown-arrow { font-size:.45rem; transition:transform var(--t); }
.has-dropdown:hover .dropdown-arrow { transform:rotate(180deg); }

.dropdown-menu {
  position:absolute; top:100%; left:50%; min-width:220px;
  background:rgba(22,5,9,.97); border:1px solid rgba(201,168,76,.2);
  padding:.7rem 0;
  opacity:0; visibility:hidden;
  transform:translateX(-50%) translateY(-6px);
  transition:opacity var(--t),visibility var(--t),transform var(--t);
  backdrop-filter:blur(12px);
}
.has-dropdown:hover .dropdown-menu {
  opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
}
.dropdown-menu a {
  display:block; font-family:'Jost',sans-serif; font-weight:300;
  font-size:.7rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--cream); opacity:.6; padding:.7rem 1.5rem;
  transition:opacity var(--t),color var(--t),padding var(--t);
}
.dropdown-menu a:hover { opacity:1; color:var(--gold-light); padding-left:2rem; }

.nav-cta {
  font-family:'Cinzel',serif !important; font-size:.62rem !important;
  letter-spacing:.22em !important; color:var(--deep-wine) !important;
  background:var(--gold) !important; opacity:1 !important;
  padding:.6rem 1.4rem !important; border:none !important;
  cursor:pointer; transition:background var(--t) !important; display:inline-block;
}
.nav-cta:hover { background:var(--gold-light) !important; }

/* Hamburger */
.nav-hamburger {
  display:none; flex-direction:column; justify-content:center;
  gap:5px; background:none; border:none; cursor:pointer; padding:4px;
}
.nav-hamburger span {
  display:block; width:24px; height:1.5px; background:var(--gold);
  transition:transform var(--t),opacity var(--t);
}
.nav-hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity:0; }
.nav-hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* Mobile overlay */
.nav-overlay {
  position:fixed; inset:0; background:rgba(22,4,8,.97); z-index:99;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1.6rem; opacity:0; visibility:hidden; transition:opacity .4s,visibility .4s;
  overflow-y:auto; padding:6rem 2rem 3rem;
}
.nav-overlay.open { opacity:1; visibility:visible; }
.nav-overlay > a, .nav-overlay > button.nav-overlay-link {
  font-family:'Cormorant Garamond',serif; font-size:1.7rem; font-weight:300;
  letter-spacing:.08em; color:var(--cream); opacity:.8;
  transition:color var(--t),opacity var(--t);
  background:none; border:none; cursor:pointer; text-align:center;
}
.nav-overlay > a:hover, .nav-overlay > button.nav-overlay-link:hover { color:var(--gold-light); opacity:1; }
.nav-overlay-sublabel {
  font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold); opacity:.45;
}
.nav-overlay-sub {
  display:flex; flex-direction:column; align-items:center;
  gap:.7rem; margin-top:-.8rem;
}
.nav-overlay-sub a {
  font-family:'Jost',sans-serif; font-size:.82rem; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold); opacity:.6;
  transition:opacity var(--t);
}
.nav-overlay-sub a:hover { opacity:1; }

/* ============================================================
   5. PAGE HERO (inner pages)
   ============================================================ */
.page-hero {
  min-height:38vh; display:flex; flex-direction:column;
  justify-content:flex-end;
  padding:calc(var(--nav-h) + 4rem) 5vw 4rem;
  position:relative; overflow:hidden;
  background:linear-gradient(160deg,#1A0508 0%,#3D0C14 60%,#1A0508 100%);
}
.page-hero::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 70% 70% at 30% 50%,rgba(107,26,42,.4),transparent);
  pointer-events:none;
}
.page-hero-eyebrow {
  font-family:'Cinzel',serif; font-size:.63rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold); margin-bottom:1.2rem;
  position:relative; display:block;
}
.page-hero h1 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(2.5rem,6vw,5rem); line-height:1.05; position:relative;
}
.page-hero h1 em { font-style:italic; color:var(--gold-light); }
.page-hero-divider {
  width:60px; height:1px;
  background:linear-gradient(to right,var(--gold),transparent);
  margin-top:2rem; position:relative;
}

/* ============================================================
   6. HOMEPAGE HERO
   ============================================================ */
.hero {
  min-height:100vh; display:grid; grid-template-rows:auto 1fr auto;
  position:relative; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 80% 60% at 70% 40%,rgba(107,26,42,.6) 0%,transparent 60%),
             radial-gradient(ellipse 50% 80% at 10% 80%,rgba(201,168,76,.12) 0%,transparent 50%),
             linear-gradient(160deg,#1A0508 0%,#3D0C14 40%,#1A0508 100%);
  z-index:0;
}
.vine-left,.vine-right {
  position:absolute; top:0; bottom:0; width:80px;
  opacity:.12; z-index:1; pointer-events:none;
}
.vine-left { left:0; }
.vine-right { right:0; transform:scaleX(-1); }
.hero-content {
  position:relative; z-index:10; display:flex; flex-direction:column;
  justify-content:center; align-items:center; text-align:center;
  padding:calc(var(--nav-h) + 3rem) 5vw 3rem;
}
.hero-eyebrow {
  font-family:'Jost',sans-serif; font-weight:200; font-size:.7rem;
  letter-spacing:.5em; text-transform:uppercase; color:var(--gold);
  margin-bottom:2rem; animation:fadeUp 1.2s ease .3s both;
}
.hero-title {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(4rem,10vw,9rem); line-height:.9; color:var(--cream);
  animation:fadeUp 1.2s ease .5s both;
}
.hero-title em { font-style:italic; color:var(--gold-light); display:block; }
.hero-divider {
  width:1px; height:60px;
  background:linear-gradient(to bottom,transparent,var(--gold),transparent);
  margin:2.5rem auto; animation:fadeUp 1.2s ease .7s both;
}
.hero-subtitle {
  font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:300;
  font-size:clamp(1.1rem,2.5vw,1.6rem); color:var(--cream); opacity:.8;
  max-width:600px; line-height:1.6; animation:fadeUp 1.2s ease .9s both;
}
.hero-cta-group {
  display:flex; gap:1.5rem; margin-top:3.5rem; flex-wrap:wrap;
  justify-content:center; animation:fadeUp 1.2s ease 1.1s both;
}
.hero-footer-bar {
  position:relative; z-index:10; display:flex; justify-content:center;
  gap:5vw; padding:2.5rem 5vw;
  border-top:1px solid rgba(201,168,76,.1);
  animation:fadeUp 1.2s ease 1.3s both;
}
.hero-stat { text-align:center; }
.hero-stat-number {
  font-family:'Cormorant Garamond',serif; font-size:2.2rem;
  font-weight:300; color:var(--gold); display:block;
}
.hero-stat-label {
  font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; opacity:.5; margin-top:.2rem;
}

/* ============================================================
   7. INTRO SECTION
   ============================================================ */
.intro {
  background:var(--warm-white); color:var(--text-dark);
  padding:8rem 5vw; position:relative; overflow:hidden;
}
.intro::before {
  content:'"'; position:absolute; top:-2rem; left:3vw;
  font-family:'Cormorant Garamond',serif; font-size:30rem;
  color:var(--burgundy); opacity:.04; line-height:1; pointer-events:none;
}
.intro-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:6rem; max-width:var(--max-w); margin:0 auto; align-items:start;
}
.intro-label {
  font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--burgundy);
  margin-bottom:1.5rem; display:flex; align-items:center; gap:1rem;
}
.intro-label::after { content:''; display:inline-block; width:40px; height:1px; background:var(--gold); }
.intro-heading {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(2.2rem,4vw,3.5rem); line-height:1.15;
  color:var(--deep-wine); margin-bottom:2rem;
}
.intro-heading em { font-style:italic; color:var(--burgundy); }
.intro-text {
  font-family:'Cormorant Garamond',serif; font-size:1.15rem;
  line-height:1.85; color:#3A2020; opacity:.85;
}
.intro-text + .intro-text { margin-top:1.2rem; }
.intro-right { padding-top:1rem; }
.intro-quote {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:1.5rem; line-height:1.6; color:var(--burgundy);
  border-left:2px solid var(--gold); padding-left:1.8rem; margin-bottom:3rem;
}

/* ============================================================
   8. SERVICES SECTION
   ============================================================ */
.services { background:var(--deep-wine); padding:6rem 5vw; }
.services-header { text-align:center; margin-bottom:4rem; }
.services-label {
  font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold); display:block; margin-bottom:1rem;
}
.services-title {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(2rem,4vw,3rem); color:var(--cream);
}
.services-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:2px; max-width:var(--max-w); margin:0 auto;
}
.service-card {
  background:rgba(255,255,255,.03); border:1px solid rgba(201,168,76,.1);
  padding:3rem 2.5rem; transition:background .4s,border-color .4s,transform .3s;
  cursor:pointer; position:relative; overflow:hidden; display:block; color:var(--cream);
}
.service-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
  transform:scaleX(0); transition:transform .4s;
}
.service-card:hover { background:rgba(201,168,76,.06); border-color:rgba(201,168,76,.3); transform:translateY(-4px); }
.service-card:hover::after { transform:scaleX(1); }
.service-icon { font-size:2rem; margin-bottom:1.5rem; display:block; }
.service-number {
  font-family:'Cormorant Garamond',serif; font-size:.8rem; color:var(--gold);
  opacity:.6; letter-spacing:.2em; margin-bottom:.8rem; display:block;
}
.service-name {
  font-family:'Cormorant Garamond',serif; font-size:1.5rem; font-weight:400;
  color:var(--cream); margin-bottom:1rem; line-height:1.2;
}
.service-desc { font-size:.8rem; line-height:1.8; color:var(--cream); opacity:.55; font-weight:200; }

/* ============================================================
   9. TERROIR SECTION (homepage)
   ============================================================ */
.terroir-section {
  background:var(--burgundy); padding:5rem 5vw; text-align:center;
  position:relative; overflow:hidden;
}
.terroir-section::before {
  content:'TERROIR'; position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-family:'Cinzel',serif; font-size:clamp(5rem,15vw,14rem); font-weight:600;
  color:rgba(255,255,255,.04); white-space:nowrap; pointer-events:none; letter-spacing:.2em;
}
.terroir-inner { position:relative; z-index:1; }
.terroir-text {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:clamp(1.3rem,3vw,2rem); line-height:1.7; color:var(--cream);
  max-width:750px; margin:0 auto 2.5rem; opacity:.9;
}
.terroir-regions { display:flex; justify-content:center; gap:1.5rem; flex-wrap:wrap; }
.region-tag {
  font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--gold);
  border:1px solid rgba(201,168,76,.35); padding:.5rem 1.2rem; opacity:.8;
  transition:opacity var(--t),border-color var(--t),background var(--t);
  cursor:pointer; display:inline-block;
}
.region-tag:hover { opacity:1; border-color:var(--gold); background:rgba(201,168,76,.08); }

/* ============================================================
   10. CTA BLOCK
   ============================================================ */
.cta-block {
  background:rgba(255,255,255,.02); border:1px solid rgba(201,168,76,.18);
  padding:3.5rem 4rem; display:flex;
  align-items:center; justify-content:space-between; gap:2rem;
  margin-bottom:4rem; flex-wrap:wrap;
}
.cta-block-text h2 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(1.6rem,3vw,2.3rem); color:var(--cream); margin-bottom:.5rem;
}
.cta-block-text h2 em { font-style:italic; color:var(--gold-light); }
.cta-block-text p {
  font-size:.85rem; line-height:1.75; color:var(--cream); opacity:.5; max-width:480px;
}

/* ============================================================
   11. ARTICLE SYSTEM
   ============================================================ */
/* Featured article */
.article-featured {
  border:1px solid rgba(201,168,76,.15);
  background:rgba(255,255,255,.02); margin-bottom:3.5rem;
  overflow:hidden;
}
.article-featured-image {
  width:100%; aspect-ratio:16/7;
  background:rgba(107,26,42,.25);
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden; border-bottom:1px solid rgba(201,168,76,.1);
}
.article-featured-image img { width:100%; height:100%; object-fit:cover; }
.photo-placeholder-inner {
  text-align:center; padding:2rem;
}
.photo-placeholder-inner .ph-icon { font-size:3rem; opacity:.15; margin-bottom:.8rem; }
.photo-placeholder-inner .ph-text {
  font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--gold); opacity:.35; display:block;
}
.article-featured-body { padding:3rem 3.5rem; }
.article-meta {
  display:flex; align-items:center; gap:1rem; margin-bottom:1.8rem; flex-wrap:wrap;
}
.article-tag {
  font-family:'Cinzel',serif; font-size:.55rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--gold);
  border:1px solid rgba(201,168,76,.4); padding:.3rem .8rem;
}
.article-date {
  font-size:.68rem; letter-spacing:.15em; color:var(--cream); opacity:.35;
}
.article-featured-title {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--cream); line-height:1.1;
  margin-bottom:1.8rem;
}
.article-featured-title em { font-style:italic; color:var(--gold-light); }
.article-body {
  font-family:'Cormorant Garamond',serif; font-size:1.1rem;
  line-height:1.9; color:var(--cream); opacity:.78;
}
.article-body p { margin-bottom:1.3rem; }
.article-body h3 {
  font-family:'Cinzel',serif; font-size:.7rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--gold); margin:2.2rem 0 .9rem;
}
.article-body p:last-child { margin-bottom:0; }

/* Article list */
.articles-list-header {
  font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold); opacity:.5;
  margin-bottom:1.5rem; display:block;
}
.article-list-item {
  display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem 0; border-bottom:1px solid rgba(201,168,76,.1);
  cursor:pointer; transition:padding var(--t); gap:1rem;
  text-decoration:none;
}
.article-list-item:first-of-type { border-top:1px solid rgba(201,168,76,.1); }
.article-list-item:hover { padding-left:.6rem; }
.article-list-title {
  font-family:'Cormorant Garamond',serif; font-size:1.22rem; font-weight:400;
  color:var(--cream); opacity:.75; flex:1;
  transition:color var(--t),opacity var(--t);
}
.article-list-item:hover .article-list-title { color:var(--gold-light); opacity:1; }
.article-list-right { display:flex; align-items:center; gap:1.5rem; flex-shrink:0; }
.article-list-date { font-size:.65rem; letter-spacing:.12em; color:var(--cream); opacity:.3; white-space:nowrap; }
.article-list-arrow { font-size:.7rem; color:var(--gold); opacity:.4; transition:transform var(--t),opacity var(--t); }
.article-list-item:hover .article-list-arrow { transform:translateX(4px); opacity:1; }

/* Article modal */
.article-modal-overlay {
  position:fixed; inset:0; background:rgba(8,2,3,.93);
  z-index:200; display:flex; align-items:flex-start; justify-content:center;
  padding:5vh 5vw; opacity:0; visibility:hidden;
  transition:opacity .4s,visibility .4s; overflow-y:auto;
}
.article-modal-overlay.open { opacity:1; visibility:visible; }
.article-modal {
  background:#1e0810; border:1px solid rgba(201,168,76,.2);
  max-width:860px; width:100%; padding:4rem;
  position:relative; transform:translateY(28px); transition:transform .4s;
}
.article-modal-overlay.open .article-modal { transform:translateY(0); }
.modal-x {
  position:absolute; top:1.5rem; right:1.5rem;
  background:none; border:none; cursor:pointer;
  font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.25em;
  text-transform:uppercase; color:var(--gold); opacity:.55;
  transition:opacity var(--t); padding:.5rem;
  display:flex; align-items:center; gap:.4rem;
}
.modal-x::before { content:'✕'; font-size:.75rem; }
.modal-x:hover { opacity:1; }

/* ============================================================
   12. FORMULAIRES & PAGE CONTACT
   ============================================================ */
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; margin-bottom:1.2rem; }
.form-group { display:flex; flex-direction:column; gap:.45rem; }
.form-group.full { grid-column:1/-1; }
.form-label {
  font-family:'Cinzel',serif; font-size:.57rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gold); opacity:.65;
}
.form-label .opt, .opt {
  font-family:'Jost',sans-serif; font-size:.6rem; letter-spacing:.05em;
  text-transform:none; color:var(--cream); opacity:.3; margin-left:.3rem;
}
.form-input,.form-textarea,.form-select {
  background:rgba(255,255,255,.04); border:1px solid rgba(201,168,76,.2);
  color:var(--cream); padding:.85rem 1rem;
  font-family:'Jost',sans-serif; font-weight:300; font-size:.85rem;
  transition:border-color var(--t),background var(--t); outline:none;
  appearance:none; -webkit-appearance:none; border-radius:0;
}
.form-input:focus,.form-textarea:focus,.form-select:focus {
  border-color:rgba(201,168,76,.55); background:rgba(255,255,255,.07);
}
.form-input::placeholder,.form-textarea::placeholder { color:var(--cream); opacity:.2; }
.form-textarea { resize:vertical; min-height:130px; }
.form-select option { background:#1A0508; color:var(--cream); }
.form-submit-row {
  margin-top:2rem; display:flex; align-items:center;
  justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.form-privacy { font-size:.62rem; letter-spacing:.04em; color:var(--cream); opacity:.28; max-width:280px; line-height:1.55; }
.form-error { color:#e8a0a0; font-size:.82rem; margin-top:1rem; padding:.8rem 1rem; border:1px solid rgba(232,160,160,.2); }

/* Page contact */
.contact-page-grid {
  display:grid; grid-template-columns:1fr 1.8fr;
  gap:6rem; align-items:start;
}
.contact-info-text {
  font-family:'Cormorant Garamond',serif; font-size:1.1rem;
  line-height:1.85; color:var(--cream); opacity:.7; margin-bottom:2.5rem;
}
.contact-detail { margin-bottom:1.6rem; }
.contact-detail-label {
  font-family:'Cinzel',serif; font-size:.57rem; letter-spacing:.3em;
  text-transform:uppercase; color:var(--gold); opacity:.5;
  display:block; margin-bottom:.35rem;
}
.contact-detail-value {
  font-family:'Jost',sans-serif; font-size:.9rem; color:var(--cream); opacity:.75;
}
a.contact-detail-value {
  border-bottom:1px solid rgba(201,168,76,.25);
  transition:color var(--t),border-color var(--t);
}
a.contact-detail-value:hover { color:var(--gold-light); border-color:rgba(201,168,76,.7); opacity:1; }
.contact-social { display:flex; flex-direction:column; gap:.65rem; margin-top:.3rem; }
.contact-social-link {
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:'Jost',sans-serif; font-size:.82rem; color:var(--gold);
  opacity:.6; transition:opacity var(--t),color var(--t);
}
.contact-social-link:hover { opacity:1; color:var(--gold-light); }
.contact-quote {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:1.2rem; line-height:1.65; color:var(--gold-light);
  border-left:2px solid var(--gold); padding-left:1.5rem;
  margin-top:3rem; opacity:.75;
}
.contact-form-wrap {
  background:rgba(255,255,255,.02); border:1px solid rgba(201,168,76,.12);
  padding:3.5rem;
}
.contact-success { text-align:center; padding:3rem 1rem; }
.contact-success .cs-icon { font-size:3rem; margin-bottom:1.2rem; display:block; }
.contact-success h2 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:2rem; color:var(--gold-light); margin-bottom:.8rem;
}
.contact-success p { font-family:'Cormorant Garamond',serif; font-style:italic; font-size:1.05rem; opacity:.55; }

@media (max-width:900px) {
  .contact-page-grid { grid-template-columns:1fr; gap:3.5rem; }
  .contact-form-wrap { padding:2.5rem 1.8rem; }
}

/* ============================================================
   13. PAGE CONTENT WRAPPER
   ============================================================ */
.page-inner { max-width:var(--max-w); margin:0 auto; padding:5rem 5vw; }
.text-block { max-width:800px; }
.text-block p {
  font-family:'Cormorant Garamond',serif; font-size:1.1rem;
  line-height:1.9; color:var(--cream); opacity:.78; margin-bottom:1.3rem;
}
.text-block a { color:var(--gold); border-bottom:1px solid rgba(201,168,76,.35); transition:color var(--t),border-color var(--t); }
.text-block a:hover { color:var(--gold-light); border-color:rgba(232,209,138,.8); }

/* ============================================================
   14. COURS ET ATELIERS — PARTNER CARDS
   ============================================================ */
.partners-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:2.5rem; margin-top:4rem; margin-bottom:3rem;
}
.partner-card {
  border:1px solid rgba(201,168,76,.15); background:rgba(255,255,255,.02); overflow:hidden;
}
.partner-photo {
  aspect-ratio:4/3; background:rgba(107,26,42,.2);
  display:flex; align-items:center; justify-content:center;
  border-bottom:1px solid rgba(201,168,76,.1); position:relative; overflow:hidden;
}
.partner-photo img { width:100%; height:100%; object-fit:cover; }
.ph-box { text-align:center; padding:2rem; }
.ph-box .ph-icon { font-size:2.5rem; opacity:.18; margin-bottom:.7rem; }
.ph-box .ph-text {
  font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gold); opacity:.3; display:block;
}
.partner-info { padding:2rem 2.2rem 2.5rem; }
.partner-name {
  font-family:'Cormorant Garamond',serif; font-size:1.65rem; font-weight:400;
  color:var(--cream); margin-bottom:.7rem;
}
.partner-link {
  font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold);
  border-bottom:1px solid rgba(201,168,76,.3); padding-bottom:.1rem;
  transition:color var(--t),border-color var(--t); display:inline-block; margin-bottom:1.3rem;
}
.partner-link:hover { color:var(--gold-light); border-color:rgba(232,209,138,.7); }
.partner-schedule {
  border-top:1px solid rgba(201,168,76,.12); padding-top:1.2rem;
}
.partner-schedule-label {
  font-family:'Cinzel',serif; font-size:.57rem; letter-spacing:.32em;
  text-transform:uppercase; color:var(--gold); opacity:.5; margin-bottom:.6rem; display:block;
}
.partner-schedule p {
  font-family:'Jost',sans-serif; font-size:.82rem; font-weight:300;
  color:var(--cream); opacity:.45; line-height:1.75;
}

/* ============================================================
   15. QUI SUIS-JE
   ============================================================ */
.about-grid {
  display:grid; grid-template-columns:1fr 1.7fr;
  gap:6rem; align-items:start;
  max-width:var(--max-w); margin:0 auto; padding:5rem 5vw;
}
.about-left { position:sticky; top:calc(var(--nav-h) + 2rem); }
.about-photo {
  aspect-ratio:3/4; background:rgba(107,26,42,.2);
  border:1px solid rgba(201,168,76,.15);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:2rem; overflow:hidden;
}
.about-photo img { width:100%; height:100%; object-fit:cover; }
.about-stats { display:flex; flex-direction:column; gap:1.6rem; }
.about-stat { border-left:2px solid var(--gold); padding-left:1.2rem; }
.about-stat-number {
  font-family:'Cormorant Garamond',serif; font-size:2rem;
  font-weight:300; color:var(--gold); display:block;
}
.about-stat-label { font-size:.63rem; letter-spacing:.2em; text-transform:uppercase; color:var(--cream); opacity:.4; }
.about-right h1 {
  font-family:'Cormorant Garamond',serif; font-weight:300;
  font-size:clamp(2rem,4vw,3rem); color:var(--cream); margin-bottom:2.5rem;
}
.about-right h1 em { font-style:italic; color:var(--gold-light); }
.about-right p {
  font-family:'Cormorant Garamond',serif; font-size:1.12rem;
  line-height:1.9; color:var(--cream); opacity:.78; margin-bottom:1.5rem;
}
.about-quote {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:1.4rem; line-height:1.65; color:var(--gold-light);
  border-left:2px solid var(--gold); padding-left:2rem; margin:3rem 0;
}

/* Video block */
.video-block { margin:3rem 0; border:1px solid rgba(201,168,76,.15); overflow:hidden; }
.video-placeholder {
  aspect-ratio:16/9; background:rgba(107,26,42,.2);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1rem; cursor:pointer; position:relative; transition:background var(--t);
}
.video-placeholder:hover { background:rgba(107,26,42,.35); }
.vp-play {
  width:64px; height:64px; border:1.5px solid rgba(201,168,76,.6); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:border-color var(--t),background var(--t);
}
.video-placeholder:hover .vp-play { border-color:var(--gold); background:rgba(201,168,76,.1); }
.vp-triangle {
  width:0; height:0;
  border-top:9px solid transparent; border-bottom:9px solid transparent;
  border-left:16px solid var(--gold); margin-left:3px;
}
.vp-label {
  font-family:'Cinzel',serif; font-size:.68rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--gold); opacity:.65;
}
.video-caption {
  padding:1.1rem 1.5rem; font-family:'Cormorant Garamond',serif;
  font-style:italic; font-size:.95rem; color:var(--cream); opacity:.38;
  border-top:1px solid rgba(201,168,76,.1);
}
.video-embed { position:relative; aspect-ratio:16/9; }
.video-embed iframe { width:100%; height:100%; border:none; }

/* ============================================================
   16. TERROIR REGION PAGES
   ============================================================ */
.terroir-page-inner {
  max-width:var(--max-w); margin:0 auto; padding:5rem 5vw;
}
.terroir-intro { max-width:800px; margin-bottom:5rem; }
.terroir-intro p {
  font-family:'Cormorant Garamond',serif; font-size:1.12rem;
  line-height:1.9; color:var(--cream); opacity:.73; margin-bottom:1.3rem;
}
.coming-soon-note {
  font-family:'Jost',sans-serif; font-size:.75rem; letter-spacing:.1em;
  color:var(--gold); opacity:.38; border:1px dashed rgba(201,168,76,.2);
  padding:1rem 1.5rem; display:inline-block; margin-top:.5rem;
}
.articles-section-title {
  font-family:'Cinzel',serif; font-size:.62rem; letter-spacing:.4em;
  text-transform:uppercase; color:var(--gold);
  display:flex; align-items:center; gap:1rem; margin-bottom:2rem;
}
.articles-section-title::after { content:''; flex:1; height:1px; background:rgba(201,168,76,.15); }
.no-articles {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:1.1rem; color:var(--cream); opacity:.3; text-align:center; padding:4rem 0;
}

/* ============================================================
   17. MENTIONS LÉGALES
   ============================================================ */
.legal-inner { max-width:860px; margin:0 auto; padding:5rem 5vw; }
.legal-section { margin-bottom:3.5rem; }
.legal-section h2 {
  font-family:'Cinzel',serif; font-size:.72rem; letter-spacing:.32em;
  text-transform:uppercase; color:var(--gold); margin-bottom:1.2rem;
  padding-bottom:.8rem; border-bottom:1px solid rgba(201,168,76,.15);
}
.legal-section p, .legal-section li {
  font-family:'Cormorant Garamond',serif; font-size:1.05rem;
  line-height:1.85; color:var(--cream); opacity:.65; margin-bottom:.8rem;
}
.legal-section ul { padding-left:1.5rem; }
.legal-section li::marker { color:var(--gold); }
.legal-section a { color:var(--gold); opacity:1; transition:color var(--t); }
.legal-section a:hover { color:var(--gold-light); }

/* ============================================================
   18. FOOTER
   ============================================================ */
.site-footer {
  background:#0E0307; padding:4rem 5vw 2.5rem;
  border-top:1px solid rgba(201,168,76,.1);
}
.footer-grid {
  display:grid; grid-template-columns:1.5fr 1fr 1fr;
  gap:4rem; max-width:var(--max-w); margin:0 auto 3rem;
}
.footer-logo {
  font-family:'Cinzel',serif; font-size:1.1rem; letter-spacing:.3em;
  color:var(--gold); display:block; margin-bottom:.4rem;
}
.footer-sub {
  font-size:.62rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--cream); opacity:.22;
}
.footer-tagline {
  font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:.9rem; color:var(--cream); opacity:.3; margin-top:1.2rem;
}
.footer-col-title {
  font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.33em;
  text-transform:uppercase; color:var(--gold); opacity:.55;
  margin-bottom:1rem; display:block;
}
.footer-nav-list { display:flex; flex-direction:column; gap:.65rem; }
.footer-nav-list a {
  font-family:'Jost',sans-serif; font-size:.78rem; font-weight:300;
  color:var(--cream); opacity:.42; transition:opacity var(--t),color var(--t);
}
.footer-nav-list a:hover { opacity:.9; color:var(--gold-light); }
.footer-social { display:flex; flex-direction:column; gap:.9rem; }
.footer-social-link {
  display:flex; align-items:center; gap:.9rem;
  font-family:'Jost',sans-serif; font-size:.78rem; font-weight:300;
  color:var(--cream); opacity:.42; transition:opacity var(--t),color var(--t);
}
.footer-social-link:hover { opacity:1; color:var(--gold-light); }
.footer-social-icon {
  width:34px; height:34px; border:1px solid rgba(201,168,76,.22);
  display:flex; align-items:center; justify-content:center;
  font-size:.95rem; flex-shrink:0;
  transition:border-color var(--t),background var(--t);
}
.footer-social-link:hover .footer-social-icon {
  border-color:rgba(201,168,76,.6); background:rgba(201,168,76,.08);
}
.footer-bottom {
  border-top:1px solid rgba(201,168,76,.08); padding-top:2rem;
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap;
  max-width:var(--max-w); margin:0 auto;
}
.footer-copy { font-size:.63rem; letter-spacing:.08em; color:var(--cream); opacity:.22; }
.footer-legal {
  font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold); opacity:.32;
  transition:opacity var(--t);
}
.footer-legal:hover { opacity:.75; }

/* ============================================================
   19. ANIMATIONS
   ============================================================ */
@keyframes fadeUp { from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);} }
@keyframes fadeDown { from{opacity:0;transform:translateY(-12px);}to{opacity:1;transform:translateY(0);} }
@keyframes fadeIn { from{opacity:0;}to{opacity:1;} }

/* ============================================================
   20. RESPONSIVE
   ============================================================ */
@media (max-width:1024px) {
  .footer-grid { grid-template-columns:1fr 1fr; gap:3rem; }
  .footer-grid > .footer-brand { grid-column:1/-1; }
  .about-grid { grid-template-columns:1fr; gap:4rem; }
  .about-left { position:static; }
  .about-photo { aspect-ratio:16/7; max-height:380px; }
  .about-stats { flex-direction:row; flex-wrap:wrap; gap:2rem; }
}
@media (max-width:768px) {
  :root { --nav-h:72px; }
  .nav-menu { display:none; }
  .nav-hamburger { display:flex; }
  .intro-grid { grid-template-columns:1fr; gap:3rem; }
  .services-grid { grid-template-columns:1fr; }
  .partners-grid { grid-template-columns:1fr; }
  .form-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; gap:2.5rem; }
  .footer-bottom { flex-direction:column; align-items:flex-start; }
  .cta-block { flex-direction:column; padding:2.5rem; }
  .cta-block-text p { max-width:100%; }
  .hero-footer-bar { gap:2rem; flex-wrap:wrap; justify-content:center; }
  .contact-modal { padding:2.5rem 1.8rem; }
  .article-modal { padding:2.5rem 1.5rem; }
  .article-featured-body { padding:2rem 1.5rem; }
  .about-grid { padding:3rem 5vw; }
  .page-inner { padding:3.5rem 5vw; }
  .terroir-page-inner { padding:3.5rem 5vw; }
  .legal-inner { padding:3rem 5vw; }
}
@media (max-width:480px) {
  .hero-title { font-size:clamp(3.2rem,15vw,5rem); }
  .hero-cta-group { flex-direction:column; align-items:center; }
  .terroir-regions { gap:.8rem; }
  .footer-social { flex-direction:row; flex-wrap:wrap; gap:.8rem 1.5rem; }
  .footer-social-link { flex-direction:column; text-align:center; font-size:.65rem; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}
:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }