/* ── HERO ── */
.hero { display:grid; grid-template-columns:1fr 1fr; min-height:100vh; margin-top:68px; }
.hero-visual-img { height: 75vh; }
.hero-content {
  display:flex; flex-direction:column; justify-content:center;
  padding:80px 5%;
}
.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--bleu-clair); color:var(--bleu);
  font-size:0.78rem; font-weight:600; padding:6px 14px;
  border-radius:50px; margin-bottom:24px; width:fit-content;
}
.hero-badge::before { content:''; display:block; width:7px; height:7px; background:var(--ocre); border-radius:50%; }
.hero-content h1 { margin-bottom:20px; }
.hero-content h1 em { color:var(--bleu); font-style:normal; }
.hero-content > p { font-size:1.1rem; max-width:440px; margin-bottom:36px; }
.hero-btns { display:flex; gap:14px; flex-wrap:wrap; }
.hero-stats { display:flex; gap:36px; margin-top:52px; padding-top:36px; border-top:1px solid var(--gris-mid); }
.stat-num { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--bleu); line-height:1; }
.stat-label { font-size:0.78rem; color:var(--gris-light); margin-top:5px; }
.hero-visual {
  background:linear-gradient(160deg,var(--bleu-fonce) 0%,var(--bleu) 60%,#3d8fa6 100%);
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:12px; color:rgba(255,255,255,.45);
  position:relative; overflow:hidden;
}
.hero-visual svg { width:72px; height:72px; opacity:.3; }
.hero-visual span { font-size:0.85rem; }
.paint-line { position:absolute; bottom:0; left:0; right:0; height:6px; background:linear-gradient(90deg,var(--ocre),transparent 60%); }

/* ── MÉTIER BANNER ── */
.metier-banner {
  background:var(--bleu); padding:32px 5%;
  display:flex; gap:40px; flex-wrap:wrap; align-items:center; justify-content:center;
}
.metier-item { display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.8); font-size:0.88rem; font-weight:500; }
.dot { width:8px; height:8px; background:var(--ocre); border-radius:50%; flex-shrink:0; }

/* ── QUI ── */
.qui-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.qui-photo {
  background:var(--bleu-clair); border-radius:16px; aspect-ratio:4/3;
  display:flex; align-items:center; justify-content:center;
  flex-direction:column; gap:10px; color:var(--bleu);
  position:relative; overflow:hidden;
}
.qui-photo svg { width:60px; height:60px; opacity:.3; }
.qui-photo span { font-size:0.8rem; opacity:.5; }
.qui-photo-img { width:100%; height:100%; object-fit:cover; object-position:center; }
.btn-decouvrir { margin-top:22px; }
.qui-badge {
  position:absolute; bottom:20px; right:20px;
  background:var(--ocre); color:var(--blanc);
  padding:9px 16px; border-radius:50px; font-weight:700; font-size:0.82rem;
}
.points { list-style:none; display:flex; flex-direction:column; gap:12px; margin:22px 0 28px; }
.points li {
  display:flex; align-items:center; gap:12px;
  font-size:0.95rem; color:var(--texte);
}
.points li::before {
  content:''; flex-shrink:0; width:20px; height:20px; border-radius:50%;
  background:var(--bleu);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
  background-size:12px; background-repeat:no-repeat; background-position:center;
}
.valeurs-row { display:grid; grid-template-columns:repeat(5,1fr); gap:20px; margin-top:64px; }
.valeur-card {
  text-align: center; padding: 32px 20px 28px;
  border-radius: 16px;
  border: 1px solid var(--gris-mid);
  background: var(--blanc);
  transition: transform .25s, box-shadow .25s;
}
.valeur-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.valeur-illu {
  width: 72px; height: 72px; margin: 0 auto 20px;
  display: flex; align-items: center; justify-content: center;
}
.valeur-illu svg { width: 64px; height: 64px; }
.valeur-card h4 {
  font-family: 'Playfair Display', serif;
  font-size: 1rem; font-weight: 600;
  color: var(--texte); margin-bottom: 10px;
}
.valeur-card p {
  font-size: 0.82rem; line-height: 1.6;
  color: var(--gris-light);
}
@media (max-width: 960px) { .valeurs-row { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 600px) { .valeurs-row { grid-template-columns: repeat(2, 1fr); } }

/* ── GALERIE VIEWER ── */
.gal-viewer {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}
.gal-main { display: flex; flex-direction: column; gap: 0; max-height: 92vh; }
.gal-slider {
  border-radius: 12px; overflow: hidden;
  aspect-ratio: 3/4;
  flex: 1;
  position: relative; cursor: col-resize;
  box-shadow: var(--shadow); background: var(--bleu-clair);
}
.s-after,.s-before { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; }
.s-after { background:linear-gradient(135deg,var(--bleu-clair),#c8e4ec); }
.s-before { background:#c2cdd0; clip-path:inset(0 50% 0 0); }
.s-after svg,.s-before svg { width:48px; height:48px; opacity:.3; }
.s-after span,.s-before span { font-size:0.82rem; opacity:.5; color:var(--texte); }
.gal-photo { width:100%; height:100%; object-fit:cover; }
.gal-fallback-icon { color: var(--bleu); }
.gal-fallback-text { color: var(--gris-texte); }
.s-label { position:absolute; top:14px; background:rgba(0,0,0,.5); color:var(--blanc); font-size:0.7rem; font-weight:700; padding:4px 12px; border-radius:20px; letter-spacing:1.5px; text-transform:uppercase; z-index:2; }
.s-label.avant { left:14px; } .s-label.apres { right:14px; }
.s-divider { position:absolute; top:0; bottom:0; left:50%; width:3px; background:var(--blanc); transform:translateX(-50%); display:flex; align-items:center; justify-content:center; z-index:2; }
.s-handle { width:40px; height:40px; background:var(--blanc); border-radius:50%; box-shadow:0 2px 14px rgba(0,0,0,.25); display:flex; align-items:center; justify-content:center; font-size:0.9rem; color:var(--bleu); font-weight:700; user-select:none; }

/* Vignettes */
.gal-thumbs {
  display: flex; flex-direction: column; gap: 12px;
  max-height: 600px; overflow-y: auto;
  padding-right: 4px;
}
.gal-thumbs::-webkit-scrollbar { width: 4px; }
.gal-thumbs::-webkit-scrollbar-thumb { background: var(--gris-mid); border-radius: 2px; }
.gal-thumb {
  display: flex; gap: 14px; align-items: center;
  background: var(--blanc); border-radius: 12px;
  border: 2px solid var(--gris-mid);
  padding: 12px; cursor: pointer;
  transition: all .2s;
}
.gal-thumb:hover { border-color: var(--bleu); }
.gal-thumb.active { border-color: var(--bleu); box-shadow: 0 0 0 3px rgba(45,107,127,.12); }
.gal-thumb-imgs {
  width: 90px; flex-shrink: 0; aspect-ratio: 1;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 4px; border-radius: 8px; overflow: hidden;
}
.gal-thumb-img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.gal-thumb-ph {
  background: var(--bleu-clair);
  display: flex; align-items: center; justify-content: center;
  grid-column: 1 / -1;
}
.gal-thumb-ph svg { width: 28px; height: 28px; fill: var(--bleu); opacity: .35; }
.gal-thumb-cat { font-size: 0.72rem; font-weight: 700; color: var(--ocre); text-transform: uppercase; letter-spacing: .5px; display: block; margin-bottom: 2px; }
.gal-thumb-title { font-size: 0.85rem; font-weight: 600; color: var(--texte); display: block; }

@media (max-width: 960px) {
  .gal-viewer { grid-template-columns: 1fr; }
  .gal-thumbs { flex-direction: row; max-height: none; overflow-x: auto; overflow-y: visible; }
  .gal-thumb { flex-shrink: 0; width: 180px; flex-direction: column; }
  .gal-thumb-imgs { width: 100%; }
}

/* ── SERVICES ── */
.srv-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.srv-card {
  border-radius:14px; padding:30px 24px; border:1px solid var(--gris-mid);
  background:var(--blanc); transition:all .25s; position:relative;
  overflow:hidden; display:flex; flex-direction:column; text-decoration:none; color:inherit;
}
.srv-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:var(--bleu); transform:scaleX(0); transition:transform .25s; transform-origin:left; }
.srv-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); border-color:var(--bleu); }
.srv-card:hover::before { transform:scaleX(1); }
.srv-icon {
  width:64px; height:64px; margin-bottom:24px; border-radius:50%;
  background:var(--bleu-clair); display:flex; align-items:center; justify-content:center;
  transition:background .25s;
}
.srv-icon svg { width:30px; height:30px; stroke:var(--bleu); transition:stroke .25s; }
.srv-card:hover .srv-icon { background:var(--bleu); }
.srv-card:hover .srv-icon svg { stroke:var(--blanc); }
.srv-card h3 { margin-bottom:10px; font-size:1.05rem; }
.srv-card p { font-size:0.87rem; flex:1; margin-bottom:18px; }
.srv-price { font-family:'Playfair Display',serif; color:var(--bleu); font-size:1.3rem; font-weight:700; margin-bottom:16px; }
.srv-price small { font-family:'Inter',sans-serif; font-size:0.78rem; font-weight:400; color:var(--gris-light); }
.srv-link { display:flex; align-items:center; gap:6px; font-size:0.85rem; font-weight:600; color:var(--bleu); margin-top:auto; }
.srv-link::after { content:'→'; transition:transform .2s; }
.srv-card:hover .srv-link::after { transform:translateX(4px); }

/* ── AVIS ── */
.avis-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.avis-card { background:var(--blanc); border-radius:14px; padding:28px; border:1px solid var(--gris-mid); }

/* ── PARTENAIRES ── */
.section-partenaires .section-header p { margin-bottom: 40px; }
.part-row { display:flex; gap:20px; flex-wrap:wrap; align-items:center; justify-content:center; }
.part-logo {
  border-radius: 10px; padding: 16px 24px;
  display: flex; align-items: center; justify-content: center;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
  border: 1px solid var(--gris-mid);
  background: var(--blanc);
  min-width: 140px; height: 80px;
}
.part-logo:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.part-logo-dark { background: #1a1a1a; border-color: #1a1a1a; }
.part-logo-img { height: 40px; width: auto; object-fit: contain; display: block; }

@media (max-width:960px) {
  .hero { grid-template-columns:1fr; min-height:auto; }
  .hero-visual { display:none; }
  .hero-content { min-height:calc(100vh - 68px); }
  .qui-grid { grid-template-columns:1fr; gap:40px; }
  .valeurs-row { grid-template-columns:repeat(3,1fr); }
  .srv-grid { grid-template-columns:1fr 1fr; }
  .avis-grid { grid-template-columns:1fr; }
  .gal-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:600px) {
  .hero-stats { flex-direction:column; gap:20px; }
  .srv-grid { grid-template-columns:1fr; }
  .valeurs-row { grid-template-columns:repeat(2,1fr); }
  .gal-grid { grid-template-columns:1fr; }
  .metier-banner { gap:20px; }
}