/* ============ page-specific layout (landing + shared sections) ============ */

/* HERO */
.hero{ position:relative; min-height: clamp(520px, 76vh, 760px); display:flex; align-items:flex-end; overflow:hidden; }
.hero-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 42%; z-index:0; }
.hero-scrim{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background: linear-gradient(to top, rgba(28,32,24,.90) 0%, rgba(28,32,24,.72) 34%, rgba(28,32,24,.30) 62%, rgba(28,32,24,.18) 100%),
              radial-gradient(70% 90% at 8% 100%, rgba(20,26,16,.55), transparent 70%); }
.hero-inner{ position:relative; z-index:2; padding-block: clamp(44px,6vw,76px); }
.hero-copy{ max-width: 80ch; margin:0 auto; text-align:center; color:#fff; text-shadow: 0 2px 14px rgba(18,22,14,.7), 0 1px 3px rgba(18,22,14,.55); }
.hero-copy .eyebrow{ margin-bottom:20px; }
.eyebrow--light{ color:#fff; }
.hero-copy .eyebrow{ justify-content:center; font-size: clamp(.95rem, 1.5vw, 1.15rem); letter-spacing:.16em; text-shadow: 0 2px 8px rgba(18,22,14,.95), 0 1px 3px rgba(18,22,14,.9), 0 0 18px rgba(18,22,14,.7); }
.hero-copy .eyebrow::before,.hero-copy .eyebrow::after{ background: var(--gold); width:22px; }
.hero-copy .eyebrow::after{ content:""; height:3px; display:inline-block; transform: skewX(-24deg); }
.eyebrow--light::before{ background:var(--gold); }
.hero h1{ margin-bottom:20px; color:#fff; font-size: clamp(2.4rem, 5.2vw, 4.2rem); max-width:22ch; margin-inline:auto; text-shadow: 0 3px 20px rgba(18,22,14,.72), 0 1px 3px rgba(18,22,14,.6); }
.hero h1 .accent{ color: var(--gold); }
.hero .lead{ max-width:70ch; margin-inline:auto; color:#fff; text-shadow: 0 2px 8px rgba(18,22,14,.95), 0 1px 3px rgba(18,22,14,.9), 0 0 18px rgba(18,22,14,.7); }
.hero-actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin:28px 0 24px; }
.hero-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.hero-chips .tag{ text-shadow:none; }
.hero-actions .btn{ text-shadow:none; }
.tag--light{ background: rgba(24,28,20,.55); border-color: rgba(255,255,255,.5); color:#fff; backdrop-filter: blur(3px); }
.btn--light{ background:#fff; color: var(--ink); border-color:#fff; }
.btn--light:hover{ background: rgba(255,255,255,.88); color: var(--ink); }

/* TRUST STRIP */
.trust{ border-bottom:1px solid var(--line); background: var(--surface-2); }
.trust-grid{ display:grid; grid-template-columns: repeat(4,1fr); }
.trust-grid div{ padding:32px 18px; text-align:center; border-right:1px solid var(--line); }
.trust-grid div:last-child{ border-right:0; }
.trust-grid b{ display:block; font-family:var(--font-display); font-weight:900; font-size: clamp(1.8rem,3vw,2.6rem); color:var(--green-deep); }
.trust-grid span{ color:var(--ink-soft); font-size:.92rem; }

/* HEAD ROW */
.head-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:30px; flex-wrap:wrap; }
.head-row-p{ max-width:38ch; }

/* SERVICES */
.svc-grid{ grid-template-columns: repeat(3,1fr); }
.svc-extra{
  margin-top:24px; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  background: linear-gradient(100deg, var(--green-soft), var(--surface));
}
.svc-extra-main{ display:flex; align-items:flex-start; gap:20px; }
.svc-extra .ico{
  width:50px; height:50px; flex:none; border-radius:var(--r);
  display:flex; align-items:center; justify-content:center;
  background:var(--green); color:#fff;
}
.svc-extra .ico svg{ width:26px; height:26px; }
.svc-extra--accent{ border-color:var(--green); }

/* WHY */
.why{ background: var(--surface-2); border-block:1px solid var(--line); }
.why-grid{ display:grid; grid-template-columns: .85fr 1.15fr; gap: clamp(34px,5vw,72px); align-items:center; }
.why-media .ph{ width:100%; }
.why-img{ width:100%; display:block; aspect-ratio:1/1; object-fit:cover; border-radius:12px; box-shadow: 0 22px 34px -20px rgba(40,38,33,.4); }
.why-list{ list-style:none; padding:0; margin:26px 0 30px; display:grid; gap:18px; }
.why-list li{ display:flex; gap:14px; align-items:flex-start; }
.why-list svg{ width:22px; height:22px; color:var(--green); flex:none; margin-top:3px; }
.why-list b{ display:block; font-family:var(--font-display); font-size:1.05rem; color:var(--ink); }
.why-list span{ color:var(--ink-soft); font-size:.96rem; }

/* ZONE */
.zone-grid{ display:grid; grid-template-columns: 1fr 1.1fr; gap: clamp(34px,5vw,64px); align-items:center; }
.zone-chips{ display:flex; flex-wrap:wrap; gap:9px; margin-top:24px; }
.zone-map{ border-radius:var(--r); overflow:hidden; border:1px solid var(--line-strong); box-shadow:var(--shadow); }
.zone-map iframe{ width:100%; height:420px; border:0; display:block; filter: grayscale(.15) contrast(.98); }

/* TESTIMONIALS */
.revs{ grid-template-columns: repeat(3,1fr); }
.rev .stars{ color:var(--gold); letter-spacing:.12em; margin-bottom:14px; }
.rev blockquote{ margin:0 0 18px; font-size:1.02rem; line-height:1.6; color:var(--ink); }
.rev figcaption{ font-family:var(--font-display); font-weight:700; color:var(--ink-soft); font-size:.92rem; }

/* CONSEILS / POSTS */
.posts{ grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.post{ display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
.post-ph{ width:100%; aspect-ratio:16/9; margin-bottom:4px; }
.post .card-img{ width:100%; aspect-ratio:16/9; object-fit:cover; display:block; border-radius: var(--r); margin-bottom:4px; }
.post h3{ font-size:1.4rem; }
.post p{ margin:0; }
.post .read{ font-family:var(--font-display); font-weight:700; color:var(--green-deep); margin-top:auto; padding-top:6px; }
.post:hover .read{ color:var(--green); }

/* CONTACT */
.contact{ background: var(--surface-2); border-top:1px solid var(--line); }
.contact-grid{ display:grid; grid-template-columns: 1fr 1.05fr; gap: clamp(34px,5vw,68px); align-items:start; }
.contact-info{ display:grid; gap:12px; margin-top:30px; }
.ci{ display:flex; align-items:center; gap:15px; padding:14px 16px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); transition:border-color .2s; }
.ci:not(.ci-static):hover{ border-color:var(--green); }
.ci-ic{ width:42px; height:42px; flex:none; border-radius:var(--r); background:var(--green-soft); color:var(--green-deep); display:flex; align-items:center; justify-content:center; }
.ci-ic svg{ width:20px; height:20px; }
.ci b{ font-family:var(--font-display); font-size:1.04rem; display:block; color:var(--ink); }
.ci small{ color:var(--ink-soft); font-size:.86rem; }

.contact-form{ display:grid; gap:16px; }
.field{ display:flex; flex-direction:column; gap:7px; }
.field label{ font-family:var(--font-display); font-weight:600; font-size:.86rem; color:var(--ink-soft); }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.contact-form input, .contact-form select, .contact-form textarea{
  font-family:var(--font-body); font-size:1rem; color:var(--ink);
  background: var(--bg); border:1px solid var(--line-strong); border-radius:var(--r);
  padding:.85em 1em; width:100%; transition:border-color .18s, box-shadow .18s; resize:vertical;
}
.contact-form input::placeholder, .contact-form textarea::placeholder{ color:var(--ink-faint); }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{
  outline:0; border-color:var(--green); box-shadow:0 0 0 3px rgba(107,142,87,.18);
}
.contact-form input:invalid:not(:placeholder-shown){ border-color:#c0593f; }
.form-note{ font-size:.82rem; margin:0; }
.form-ok{
  display:flex; align-items:center; gap:12px; padding:16px; border-radius:var(--r);
  background: var(--green-soft); border:1px solid var(--green); color:var(--green-deep); font-weight:600;
}
.form-ok svg{ width:22px; height:22px; color:var(--green); flex:none; }
/* 404 page */
.err-page{ padding-block: clamp(56px,9vw,120px); }
.err-code{ display:block; font-family:var(--font-display); font-weight:900; line-height:.9; letter-spacing:-.04em;
  font-size:clamp(5.5rem,18vw,11rem); color:var(--green); opacity:.22; margin-bottom:10px; transform:skewX(-8deg); transform-origin:left; }

/* display:flex above would otherwise override the [hidden] attribute */
.form-ok[hidden], .form-err[hidden]{ display:none; }
.form-err{
  padding:14px 16px; border-radius:var(--r); font-size:.95rem; font-weight:600;
  background:#fbeeea; border:1px solid #c0593f; color:#8f3a25;
}
.form-err a{ text-decoration:underline; }
.hp{ position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.contact-form button[disabled]{ opacity:.7; cursor:progress; }

/* responsive */
@media (max-width: 960px){
  .hero{ min-height: 560px; }
  .hero-copy{ max-width:none; }
  .why-grid, .zone-grid, .contact-grid{ grid-template-columns:1fr; }
  .why-media{ width:100%; max-width:420px; margin-inline:auto; }
  .svc-grid{ grid-template-columns: repeat(2,1fr); }
  .revs{ grid-template-columns:1fr; }
}
@media (max-width: 640px){
  .trust-grid{ grid-template-columns:1fr 1fr; }
  .trust-grid div:nth-child(2){ border-right:0; }
  .trust-grid div:nth-child(1),.trust-grid div:nth-child(2){ border-bottom:1px solid var(--line); }
  .svc-grid{ grid-template-columns:1fr; }
  .posts{ grid-template-columns:1fr; }
  .row2{ grid-template-columns:1fr; }
  .head-row-p{ align-self:start !important; }
}