/*
Theme Name: Maison Gendry - Art du Tapis
Description: Thème WordPress sur-mesure pour Maison Gendry Art du Tapis, entretien et restauration de tapis d'orient dans le Morbihan (56).
Author: Maison Gendry Art du Tapis
Version: 1.0
Text Domain: maison-gendry
*/

/* =========================================================
   DESIGN TOKENS
   Inspiration : le carnet d'expertise d'un restaurateur de
   tapis anciens — fiches d'authentification, mesures au
   millimètre, teintures naturelles (garance, indigo, laiton).
   ========================================================= */
:root{
  --color-ink: #0E1524;      /* bleu marine profond, repris du logo */
  --color-ink-panel: #141D30;/* panneaux légèrement plus clairs */
  --color-wool: #ECE6D6;     /* texte principal, blanc laine */
  --color-wool-muted: #A9AEC2;
  --color-madder: #9C3B31;   /* rouge garance, accent secondaire */
  --color-madder-light: #C1584C;
  --color-brass: #C9A35C;    /* or du logo */
  --color-indigo: #33465A;   /* indigo tissé */
  --line: rgba(201,163,92,0.22);
  --line-strong: rgba(201,163,92,0.4);

  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Public Sans', -apple-system, Segoe UI, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;

  --container: 1160px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--color-ink);
  color:var(--color-wool);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }

h1,h2,h3{
  font-family:var(--font-display);
  font-weight:600;
  line-height:1.15;
  margin:0 0 .5em;
  color:var(--color-wool);
}
h1{ font-size:clamp(2.4rem, 5vw, 4rem); }
h2{ font-size:clamp(1.8rem, 3.2vw, 2.6rem); }
h3{ font-size:1.3rem; }

.eyebrow{
  font-family:var(--font-mono);
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--color-brass);
  display:block;
  margin-bottom:.9em;
}

/* motif tissé subtil, en remplacement d'une photo, en attendant vos visuels */
.woven-texture{
  background-image:
    repeating-linear-gradient(45deg, rgba(237,230,216,0.035) 0 2px, transparent 2px 14px),
    repeating-linear-gradient(-45deg, rgba(237,230,216,0.035) 0 2px, transparent 2px 14px);
}

/* double filet = clin d'œil chaîne/trame du tissage, remplace le hairline générique */
.weft-divider{
  border:none;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  height:5px;
  margin:0;
}

/* =========================
   HEADER
   ========================= */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(14,21,36,0.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.site-header .inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 24px;
}
.logotype{ display:flex; align-items:center; }
.logotype img{ height:60px; width:auto; }

.main-nav ul{ list-style:none; display:flex; gap:32px; margin:0; padding:0; }
.main-nav a{
  font-size:.95rem;
  padding-bottom:4px;
  border-bottom:1px solid transparent;
  transition:border-color .2s;
}
.main-nav a:hover, .main-nav a:focus-visible{ border-color:var(--color-brass); }

.btn{
  display:inline-block;
  font-family:var(--font-body);
  font-weight:600;
  font-size:.92rem;
  padding:12px 24px;
  border-radius:2px;
  background:var(--color-madder);
  color:var(--color-wool);
  border:1px solid var(--color-madder);
  transition:background .2s, color .2s;
}
.btn:hover, .btn:focus-visible{ background:transparent; color:var(--color-madder-light); }
.btn.btn-outline{ background:transparent; border-color:var(--line-strong); }
.btn.btn-outline:hover{ border-color:var(--color-brass); color:var(--color-brass); }

.menu-toggle{ display:none; background:none; border:0; color:var(--color-wool); font-size:1.6rem; }

@media (max-width:860px){
  .main-nav{ display:none; }
  .main-nav.is-open{
    display:block;
    position:absolute;
    top:100%; left:0; right:0;
    background:var(--color-ink);
    border-bottom:1px solid var(--line);
    padding:10px 24px 20px;
  }
  .main-nav.is-open ul{ flex-direction:column; gap:4px; }
  .main-nav.is-open a{ display:block; padding:12px 0; border-bottom:1px solid var(--line); }
  .menu-toggle{ display:block; }
  .header-cta{ display:none; }
}

/* =========================
   HERO
   ========================= */
.hero{
  padding:110px 0 90px;
  position:relative;
}
.hero .container{ position:relative; z-index:1; }
.hero .container.grid-2{ align-items:center; }
.hero-visual{ display:flex; justify-content:center; }
.hero-visual svg{ width:100%; max-width:340px; height:auto; }
.hero-visual img{
  width:100%; max-width:380px;
  aspect-ratio:3/4; object-fit:cover;
  border:2px solid var(--color-brass);
  box-shadow:0 30px 70px rgba(0,0,0,0.45);
}
@media (max-width:860px){ .hero-visual{ margin-top:36px; } .hero-visual svg{ max-width:220px; } .hero-visual img{ max-width:280px; } }

.photo-framed{
  border:2px solid var(--color-brass);
  box-shadow:0 20px 50px rgba(0,0,0,0.4);
  margin:36px 0;
}
.photo-framed img{ width:100%; display:block; aspect-ratio:16/10; object-fit:cover; }
.photo-framed figcaption{
  font-family:var(--font-mono); font-size:.75rem; color:var(--color-wool-muted);
  text-transform:uppercase; letter-spacing:.08em; padding:12px 16px; border-top:1px solid var(--line);
}
.hero-spec{
  font-family:var(--font-mono);
  font-size:.85rem;
  color:var(--color-wool-muted);
  border:1px solid var(--line);
  display:inline-block;
  padding:10px 16px;
  margin-top:28px;
}
.hero-spec b{ color:var(--color-brass); font-weight:600; }
.hero-actions{ margin-top:34px; display:flex; gap:16px; flex-wrap:wrap; }
.hero p.lede{ max-width:560px; color:var(--color-wool-muted); font-size:1.08rem; margin-top:18px; }

/* ---- Bloc photo à insérer (en attendant vos visuels réels) ---- */
.photo-slot{
  border:1px dashed var(--line-strong);
  aspect-ratio:16/10;
  display:flex; align-items:center; justify-content:center;
  text-align:center;
  color:var(--color-wool-muted);
  font-family:var(--font-mono);
  font-size:.78rem;
  letter-spacing:.03em;
  padding:20px;
  background:var(--color-ink-panel);
}
.photo-slot span{ color:var(--color-brass); display:block; margin-bottom:6px; font-size:.7rem; text-transform:uppercase; letter-spacing:.1em; }

/* =========================
   SECTIONS GÉNÉRALES
   ========================= */
section{ padding:80px 0; }
section.alt{ background:var(--color-ink-panel); }

.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.grid-2{ display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center; }
@media (max-width:860px){ .grid-3{grid-template-columns:1fr;} .grid-2{grid-template-columns:1fr;} }

/* ---- Fiche d'expertise (signature element) ---- */
.expert-card{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:28px 0;
}
.expert-card .num{
  font-family:var(--font-mono);
  color:var(--color-madder-light);
  font-size:.85rem;
  letter-spacing:.08em;
}
.expert-card h3{ margin:10px 0 10px; }
.expert-card p{ color:var(--color-wool-muted); margin:0 0 14px; }
.expert-card .spec-line{
  font-family:var(--font-mono);
  font-size:.78rem;
  color:var(--color-brass);
  letter-spacing:.02em;
}

/* ---- Zone d'intervention : liste de villes en fiche cadastrale ---- */
.zone-list{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(180px,1fr));
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
}
.zone-list div{
  background:var(--color-ink);
  padding:18px 16px;
  font-family:var(--font-mono);
  font-size:.85rem;
}
.zone-list div b{ color:var(--color-brass); display:block; font-size:.7rem; letter-spacing:.1em; margin-bottom:4px; }

/* ---- Réalisations : avant / après ---- */
.before-after{
  display:grid;
  grid-template-columns:1fr 1fr;
  border:1px solid var(--line);
}
.before-after figure{ margin:0; padding:26px; }
.before-after figcaption{ font-family:var(--font-mono); font-size:.75rem; color:var(--color-wool-muted); margin-top:10px; text-transform:uppercase; letter-spacing:.08em; }
.before-after .placeholder-img{
  aspect-ratio:4/3;
  border:1px dashed var(--line-strong);
  display:flex; align-items:center; justify-content:center;
  color:var(--color-wool-muted); font-size:.8rem; text-align:center; padding:20px;
}

/* =========================
   CONTACT
   ========================= */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; }
@media (max-width:860px){ .contact-grid{grid-template-columns:1fr;} }
.contact-info dl{ display:grid; grid-template-columns:auto 1fr; gap:8px 20px; font-size:.95rem; }
.contact-info dt{ font-family:var(--font-mono); color:var(--color-brass); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; align-self:start; padding-top:3px; }
.wpcf7-form input[type=text], .wpcf7-form input[type=email], .wpcf7-form input[type=tel], .wpcf7-form textarea{
  width:100%;
  background:var(--color-ink-panel);
  border:1px solid var(--line-strong);
  color:var(--color-wool);
  padding:12px 14px;
  font-family:var(--font-body);
  margin-bottom:16px;
  border-radius:2px;
}
.wpcf7-form label{ font-size:.85rem; color:var(--color-wool-muted); display:block; margin-bottom:6px; }
.wpcf7-form input[type=submit]{
  background:var(--color-madder); color:var(--color-wool); border:1px solid var(--color-madder);
  padding:12px 26px; font-weight:600; cursor:pointer;
}
.wpcf7-form input[type=submit]:hover{ background:transparent; color:var(--color-madder-light); }

/* =========================
   FOOTER
   ========================= */
.site-footer{
  border-top:1px solid var(--line);
  padding:56px 0 30px;
  color:var(--color-wool-muted);
  font-size:.9rem;
}
.site-footer .foot-grid{ display:grid; grid-template-columns:2fr 1fr 1fr; gap:32px; margin-bottom:40px; }
@media (max-width:860px){ .site-footer .foot-grid{grid-template-columns:1fr;} }
.site-footer h4{ color:var(--color-wool); font-family:var(--font-body); font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; }
.site-footer ul{ list-style:none; margin:0; padding:0; }
.site-footer li{ margin-bottom:8px; }
.site-footer .legal{ border-top:1px solid var(--line); padding-top:20px; font-size:.8rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }