/* ==========================================================================
   YOB K BUSINESS — feuille de style principale
   ========================================================================== */

:root{
  --bg:#faf7f0;
  --bg-alt:#f2ecdf;
  --ink:#201d16;
  --heading:#142a1d;
  --muted:#6b6355;
  --accent:#cf6a26;
  --accent-dark:#a8541c;
  --green:#2f5233;
  --border:rgba(32,29,22,.14);
  --border-strong:rgba(32,29,22,.28);
  --radius-sm:4px;
  --radius-md:6px;
  --shadow:0 18px 40px -20px rgba(20,20,10,.25);
  --font-head:'Fraunces', Georgia, 'Iowan Old Style', serif;
  --font-body:'Work Sans','Segoe UI',-apple-system,sans-serif;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-head); color:var(--heading); line-height:1.15; margin:0 0 .5em; font-weight:600; }
h1{ font-size:clamp(2.4rem,5vw,3.6rem); font-weight:600; }
h2{ font-size:clamp(1.8rem,3.4vw,2.5rem); }
h3{ font-size:1.25rem; }
p{ margin:0 0 1em; }
.wrap{ max-width:1200px; margin:0 auto; padding:0 24px; }

/* Eyebrow label */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:.8rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); font-weight:600; margin-bottom:14px;
}
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--accent); display:inline-block; }
.eyebrow.on-dark{ color:#fbe9d4; }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 24px; font-weight:600; font-size:.95rem;
  border-radius:var(--radius-sm); border:1.5px solid transparent; cursor:pointer;
  transition:.2s background,.2s color,.2s border-color,.2s transform;
  white-space:nowrap;
}
.btn-primary{ background:var(--accent); color:#fff; }
.btn-primary:hover{ background:var(--accent-dark); }
.btn-outline{ border-color:rgba(255,255,255,.6); color:#fff; }
.btn-outline:hover{ background:rgba(255,255,255,.12); }
.btn-outline-ink{ border-color:var(--border-strong); color:var(--ink); }
.btn-outline-ink:hover{ border-color:var(--ink); }
.btn-block{ width:100%; }

/* ==========================================================================
   Header / navigation
   ========================================================================== */
.site-header{
  position:sticky; top:0; z-index:200;
  background:rgba(250,247,240,.96);
  border-bottom:1px solid transparent;
  transition:.25s border-color,.25s box-shadow;
}
.site-header.scrolled{ border-bottom-color:var(--border); box-shadow:0 6px 24px -18px rgba(0,0,0,.4); }
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; padding:14px 24px; }

.brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand-logo{ width:44px; height:44px; object-fit:cover; border-radius:6px; }
.brand-name{ font-family:var(--font-head); font-weight:700; font-size:1.05rem; line-height:1.1; color:var(--heading); }

.main-nav{ flex:1; display:flex; justify-content:center; }
.main-nav > ul{ display:flex; align-items:center; gap:26px; flex-wrap:wrap; }
.main-nav > ul > li{ position:relative; }
.main-nav > ul > li > a{ display:flex; align-items:center; gap:4px; font-weight:500; font-size:.96rem; padding:8px 2px; position:relative; }
.main-nav > ul > li > a::after{
  content:""; position:absolute; left:2px; right:2px; bottom:2px; height:2px; background:var(--accent);
  transform:scaleX(0); transform-origin:left; transition:.2s transform;
}
.main-nav > ul > li > a:hover::after,
.main-nav > ul > li.active > a::after{ transform:scaleX(1); }
.caret{ font-size:.7em; opacity:.7; }

.submenu{
  position:absolute; top:calc(100% + 10px); left:0; min-width:240px;
  background:#fff; border:1px solid var(--border); border-radius:var(--radius-md);
  box-shadow:var(--shadow); padding:8px; opacity:0; visibility:hidden; transform:translateY(6px);
  transition:.18s opacity,.18s transform,.18s visibility;
}
.has-children:hover > .submenu{ opacity:1; visibility:visible; transform:translateY(0); }
.submenu li a{ display:block; padding:10px 12px; border-radius:var(--radius-sm); font-size:.92rem; }
.submenu li a:hover{ background:var(--bg-alt); color:var(--accent); }

.header-ctas{ display:flex; align-items:center; gap:14px; flex-shrink:0; }
.nav-cta-mobile{ display:none; }

.nav-toggle{
  display:none; align-items:center; justify-content:center;
  width:44px; height:44px; border:1.5px solid var(--border-strong); border-radius:var(--radius-sm);
  background:transparent; cursor:pointer; color:var(--heading); padding:0; position:relative; flex-shrink:0;
}
.nav-toggle .icon-menu,.nav-toggle .icon-close{ width:22px; height:22px; flex-shrink:0; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.nav-toggle .icon-close{ display:none; }
.nav-toggle[aria-expanded="true"] .icon-menu{ display:none; }
.nav-toggle[aria-expanded="true"] .icon-close{ display:block; }

.nav-backdrop{
  position:fixed; inset:0; background:rgba(16,14,10,.45); z-index:190;
  opacity:0; pointer-events:none; transition:.25s opacity;
}
body.nav-open .nav-backdrop{ opacity:1; pointer-events:auto; }
body.nav-open{ overflow:hidden; }

@media (max-width:960px){
  .main-nav{
    position:fixed; top:0; right:0; bottom:0; width:min(340px,86vw);
    background:#fff; z-index:201; transform:translateX(100%);
    transition:.28s transform; overflow-y:auto; padding:88px 26px 32px;
    box-shadow:-18px 0 40px -20px rgba(0,0,0,.35);
    display:block;
  }
  .main-nav.open{ transform:translateX(0); }
  .main-nav > ul{ flex-direction:column; align-items:stretch; gap:2px; }
  .main-nav > ul > li{ border-bottom:1px solid var(--border); }
  .main-nav > ul > li > a{ padding:14px 4px; font-size:1.02rem; justify-content:space-between; }
  .main-nav > ul > li > a::after{ display:none; }
  .submenu{
    position:static; opacity:1; visibility:visible; transform:none; box-shadow:none; border:none;
    padding:0 0 8px 12px; display:none; background:transparent;
  }
  li.submenu-open .submenu{ display:block; }
  .submenu li a{ padding:10px 8px; color:var(--muted); }
  .nav-cta-mobile{ display:flex; margin-top:18px; }
  .header-ctas .btn-primary{ display:none; }
  .nav-toggle{ display:inline-flex; }
}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative; color:#fff; overflow:hidden;
  background:linear-gradient(180deg,rgba(10,14,8,.55),rgba(10,14,8,.78)), var(--heading);
  background-size:cover; background-position:center;
}
.hero-inner{ position:relative; padding:96px 0 84px; max-width:760px; }
.hero h1{ color:#fff; margin-bottom:18px; }
.hero h1 em{ font-style:normal; color:var(--accent); }
.hero p.lead{ font-size:1.1rem; color:rgba(255,255,255,.92); max-width:600px; margin-bottom:30px; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }

.page-hero{
  position:relative; color:#fff; padding:72px 0 60px;
  background:linear-gradient(180deg,rgba(10,14,8,.6),rgba(10,14,8,.8)), var(--heading);
  background-size:cover; background-position:center;
}
.page-hero h1{ color:#fff; margin-bottom:10px; }
.page-hero p{ color:rgba(255,255,255,.9); font-size:1.05rem; max-width:640px; margin-bottom:0; }
.breadcrumb{ font-size:.85rem; color:rgba(255,255,255,.75); margin-bottom:14px; }
.breadcrumb a{ color:rgba(255,255,255,.9); }

/* Stat strip */
.stats-row{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border);
  border:1px solid var(--border); margin-top:-1px;
}
.stats-row.on-dark{ background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.14); }
.stat-tile{ background:var(--bg); padding:26px 18px; text-align:center; }
.stats-row.on-dark .stat-tile{ background:rgba(10,14,8,.35); color:#fff; }
.stat-num{ font-family:var(--font-head); font-size:2rem; font-weight:700; color:var(--accent); }
.stats-row.on-dark .stat-num{ color:#f4a862; }
.stat-label{ font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-top:4px; }
.stats-row.on-dark .stat-label{ color:rgba(255,255,255,.75); }
@media (max-width:720px){ .stats-row{ grid-template-columns:repeat(2,1fr); } }

/* ==========================================================================
   Sections & cards
   ========================================================================== */
section{ padding:72px 0; }
section.alt{ background:var(--bg-alt); }
.section-head{ max-width:680px; margin-bottom:44px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }

.cards-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.cards-grid.cols-2{ grid-template-columns:repeat(2,1fr); }
.cards-grid.cols-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:960px){ .cards-grid,.cards-grid.cols-4{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .cards-grid,.cards-grid.cols-2,.cards-grid.cols-4{ grid-template-columns:1fr; } }

.card{
  background:#fff; border:1px solid var(--border); border-left:3px solid var(--accent);
  border-radius:0 var(--radius-md) var(--radius-md) 0; padding:26px 24px;
}
.card .icon{ width:30px; height:30px; color:var(--accent); margin-bottom:14px; }
.card h3{ margin-bottom:8px; }
.card p{ color:var(--muted); margin-bottom:0; font-size:.95rem; }

.card-plain{ padding:26px 0 26px 20px; border-left:3px solid var(--accent); }

/* Site agricole card */
.site-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; }
.site-card .site-card-body{ padding:22px 24px; border-left:3px solid var(--accent); }
.site-card h3{ margin-bottom:6px; }
.site-card .meta{ font-size:.88rem; color:var(--muted); margin-bottom:14px; }
.tag-row{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.tag{ display:inline-block; padding:4px 10px; border-radius:20px; background:var(--bg-alt); font-size:.78rem; color:var(--heading); font-weight:500; }
.tag.status{ background:#e7f3e8; color:#2c6b32; }

/* Timeline / steps */
.steps{ display:grid; gap:22px; }
.step{ display:flex; gap:18px; }
.step-num{
  flex-shrink:0; width:42px; height:42px; border-radius:50%; background:var(--heading); color:#fff;
  display:flex; align-items:center; justify-content:center; font-family:var(--font-head); font-weight:700;
}
.step h3{ margin-bottom:4px; font-size:1.05rem; }
.step p{ color:var(--muted); margin-bottom:0; font-size:.94rem; }

/* CTA band */
.cta-band{
  background:var(--heading); color:#fff; padding:56px 0; text-align:center;
}
.cta-band h2{ color:#fff; margin-bottom:20px; }
.cta-band .actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* Quote / testimonial */
.quote{ background:#fff; border:1px solid var(--border); border-left:3px solid var(--accent); padding:22px 24px; border-radius:0 var(--radius-md) var(--radius-md) 0; }
.quote p{ font-style:italic; margin-bottom:10px; }
.quote cite{ font-style:normal; font-size:.85rem; color:var(--muted); }

/* Table (plan d'investissement) */
.data-table{ width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; }
.data-table th,.data-table td{ padding:12px 16px; text-align:left; border-bottom:1px solid var(--border); font-size:.94rem; }
.data-table tr:last-child td{ border-bottom:none; }
.data-table tr.total td{ font-weight:700; background:var(--bg-alt); }
.data-table td:last-child,.data-table th:last-child{ text-align:right; }

/* Progress split (répartition revenus) */
.split-bar{ display:flex; height:14px; border-radius:8px; overflow:hidden; margin-bottom:18px; }
.split-legend{ display:grid; grid-template-columns:repeat(2,1fr); gap:10px 20px; }
.split-legend-item{ display:flex; align-items:center; gap:10px; font-size:.9rem; }
.swatch{ width:12px; height:12px; border-radius:3px; flex-shrink:0; }

/* Gallery */
.gallery-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.gallery-grid img{ width:100%; height:200px; object-fit:cover; border-radius:var(--radius-md); }
@media (max-width:860px){ .gallery-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .gallery-grid{ grid-template-columns:1fr; } .gallery-grid img{ height:220px; } }

/* Forms */
.form-card{ background:#fff; border:1px solid var(--border); border-radius:var(--radius-md); padding:30px; }
.field{ margin-bottom:18px; }
.field label{ display:block; font-size:.88rem; font-weight:600; margin-bottom:6px; }
.field input,.field textarea,.field select{
  width:100%; padding:12px 14px; border:1.5px solid var(--border-strong); border-radius:var(--radius-sm);
  font-family:var(--font-body); font-size:.96rem; background:#fff; color:var(--ink);
}
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--accent); }
.field textarea{ min-height:120px; resize:vertical; }
.form-note{ font-size:.82rem; color:var(--muted); margin-top:10px; }
.alert{ padding:14px 16px; border-radius:var(--radius-md); margin-bottom:20px; display:flex; gap:10px; align-items:flex-start; font-size:.94rem; }
.alert-success{ background:#e7f3e8; border:1px solid #a9d6ad; color:#215c26; }
.alert-error{ background:#fdeceb; border:1px solid #f3b3ac; color:#8f2c22; }

/* Contact info list */
.contact-info-list{ display:grid; gap:16px; }
.contact-info-list li{ display:flex; gap:12px; align-items:flex-start; font-size:.96rem; }
.contact-info-list .icon{ width:20px; height:20px; color:var(--accent); flex-shrink:0; margin-top:2px; }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background:var(--heading); color:rgba(255,255,255,.82); padding:64px 0 0; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.3fr; gap:36px; padding-bottom:40px; border-bottom:1px solid rgba(255,255,255,.14); }
.footer-brand .brand-name{ color:#fff; }
.footer-brand p{ margin-top:14px; font-size:.9rem; color:rgba(255,255,255,.68); max-width:280px; }
.site-footer h4{ color:#fff; font-family:var(--font-body); font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:16px; }
.footer-links{ display:grid; gap:10px; font-size:.92rem; }
.footer-links a:hover{ color:var(--accent); }
.footer-contact li{ display:flex; gap:8px; align-items:flex-start; }
.footer-contact .icon-xs{ width:16px; height:16px; margin-top:3px; flex-shrink:0; color:var(--accent); }
.footer-bottom{ display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; padding:22px 24px; font-size:.82rem; color:rgba(255,255,255,.6); }
.icon-xs{ width:16px; height:16px; }

@media (max-width:860px){
  .footer-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .footer-grid{ grid-template-columns:1fr; }
  .cards-grid{ grid-template-columns:1fr; }
  section{ padding:52px 0; }
  .hero-inner{ padding:64px 0 48px; }
}

/* Reveal animation */
[data-reveal]{ opacity:0; transform:translateY(14px); transition:.5s opacity,.5s transform; }
[data-reveal].revealed{ opacity:1; transform:none; }

/* Utility */
.text-center{ text-align:center; }
.mt-0{ margin-top:0; }
.mb-0{ margin-bottom:0; }