/* ==========================================================================
   Charte SOSCC v1.0 — habillage des pages publiques (vitrine, demande, pages légales)
   Chargée après les styles propres à chaque page : elle ne définit que l'habillage
   (couleurs, surfaces, verre, polices). La mise en page reste celle de la page.
   ========================================================================== */
body { background: var(--c-ambiance), var(--c-fond); color: var(--c-texte); }
a { color: inherit; }
h1, h2, h3, h4, h5 { font-family: var(--f-titre); color: inherit; }
h1, h2 { font-weight: 750 !important; letter-spacing: -.02em !important; line-height: 1.04 !important; }
h3, h4, h5 { font-weight: 700 !important; letter-spacing: -.01em !important; }
button, .btn, .call { font-family: var(--f-texte); }
p, li { text-wrap: pretty; }

/* En-tête : barre de verre + fine livrée camping-car */
.top {
  background: var(--c-nav);
  -webkit-backdrop-filter: var(--verre); backdrop-filter: var(--verre);
  border-bottom: var(--trait-l) solid var(--c-trait);
  color: var(--c-texte);
  box-shadow: none;
}
.top::after { content: ""; display: block; height: 6px; background: var(--livree); opacity: .9; }
.brand, .brand a { color: var(--c-texte); font-family: var(--f-titre); font-weight: 750; letter-spacing: -.01em; }
.brand small { color: var(--c-texte-3); font-family: var(--f-texte); font-weight: 600; }
.brand-mark, .logo:not(.logo-marque), .brand-logo { background: transparent !important; box-shadow: none !important; padding: 0 !important; }
.brand-mark svg, .brand-logo svg { width: 100%; height: 100%; }
.nav-links { color: var(--c-texte-2); }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--c-texte); }
.call { background: var(--c-accent); color: var(--c-sur-accent) !important; border-radius: var(--r-bouton); box-shadow: none; font-weight: 700; }
.phone-nav, .phone-top { color: var(--c-texte); background: var(--c-surface-forte); border: var(--trait-l) solid var(--c-trait); border-radius: var(--r-bouton); }
.phone-inline { color: var(--c-accent); background: var(--c-accent-doux); border-radius: var(--r-bouton); }
.phone-card { color: var(--c-texte); border-bottom: var(--trait-l) solid var(--c-trait); }
.beta-badge { background: var(--n-vert-fond); color: var(--n-vert-encre); }
.mobile-menu-toggle { color: var(--c-texte); background: var(--c-surface-forte); border: var(--trait-l) solid var(--c-trait); border-radius: var(--r-s); }
@media (max-width: 620px) {
  .nav-links { background: var(--c-surface-forte); -webkit-backdrop-filter: var(--verre); backdrop-filter: var(--verre); border: var(--trait-l) solid var(--c-bord); box-shadow: var(--o-2); }
}
.back, .top-actions a { color: var(--c-texte); background: var(--c-surface-forte); border: var(--trait-l) solid var(--c-trait); border-radius: var(--r-bouton); }

/* Textes */
.eyebrow { background: var(--c-accent-doux); color: var(--c-accent); border-radius: var(--r-bouton); font-weight: 700; }
.eyebrow::before { background: var(--c-accent); }
.lead, .section-head p, .fine, .hint, .small, .form-intro { color: var(--c-texte-2); }
strong { color: inherit; }

/* Boutons */
.btn { border-radius: var(--r-bouton); font-weight: 700; box-shadow: none; }
.btn.primary, .primary.btn, a.primary, button.primary { background: var(--c-accent); color: var(--c-sur-accent); border-color: transparent; }
.btn.secondary, .secondary.btn, a.secondary, button.secondary { background: var(--c-surface-forte); color: var(--c-texte); border: var(--trait-l) solid var(--c-trait); }

/* Surfaces de verre */
.problem, .service:not(.photo-tile), .qa, .price-card, .card, .price-table, .expert-copy li,
.trust article, .step, .steps li, .work article, .work-grid > *, .cards > *, .contact-card, .page, .group, .choice-block,
.notice, .contact-strip, .intro {
  background: var(--c-surface);
  border-color: var(--c-bord);
  -webkit-backdrop-filter: var(--verre); backdrop-filter: var(--verre);
  box-shadow: var(--o-1);
  color: var(--c-texte);
}
.problem:hover { box-shadow: var(--o-2); }
.problem p, .service p, .qa p, .card p, .step p, .trust p, .expert-copy li, .page p, .page li { color: var(--c-texte-2); }
.tag, .service span, .icon, .number { background: var(--c-accent-doux); color: var(--c-accent); }
.price-card strong, .card strong, .row span { color: var(--c-accent); font-family: var(--f-titre); }
.row { border-color: var(--c-trait); }
.note { background: var(--c-accent-doux); color: var(--c-texte); border-color: transparent; }

/* Bandes de fond */
.problem-band, .prices-preview, .band {
  background: linear-gradient(var(--c-surface), var(--c-surface));
  border-color: var(--c-trait);
  color: var(--c-texte);
}

/* Panneaux mis en avant (zone, appel à l'action) */
.zone-box, .cta-box {
  background: radial-gradient(60% 80% at 88% 10%, var(--c-accent-doux), transparent 70%), var(--c-surface-forte);
  border: var(--trait-l) solid var(--c-bord);
  -webkit-backdrop-filter: var(--verre); backdrop-filter: var(--verre);
  box-shadow: var(--o-2);
  color: var(--c-texte);
  position: relative; overflow: hidden;
}
.zone-box::after, .cta-box::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 8px; background: var(--livree); }
.zone-box h2, .cta-box h2 { color: var(--c-texte); }
.zone-box p, .cta-box p, .zone-map-note { color: var(--c-texte-2) !important; }
.zone-map-open { color: var(--c-accent); }
.cities span { background: var(--c-accent-doux); color: var(--c-accent); border-color: transparent; }
.cta-box .secondary { border-color: var(--c-trait); }
.contact-card a, .contact-card div { border-color: var(--c-trait); }
.contact-card div { color: var(--c-texte-2); }
.zone-map { background: var(--c-surface); }

/* Blocs photo : texte blanc sur voile sombre neutre */
.hero-photo, .feature-card, .expert-photo, .tech-photo, .service.photo-tile { color: #fff; }
.feature-card h3, .feature-card p, .service.photo-tile h3, .service.photo-tile p, .hero-photo strong, .hero-photo p { color: #fff; }
.service.photo-tile span { background: rgba(255,255,255,.18); color: #fff; }
.photo-caption {
  color: #fff;
  background: rgba(6,10,16,.55);
  -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%);
  border: 1px solid rgba(255,255,255,.18);
}
.photo-caption p { color: rgba(255,255,255,.88); }

/* Formulaire public (demande) */
.err, .error { background: var(--n-rouge-fond); color: var(--n-rouge-encre); border-color: transparent; }
.ok, .success { background: var(--n-vert-fond); color: var(--n-vert-encre); border-color: transparent; }
.required { color: var(--n-rouge-encre); }
.choice-title, .step strong { color: var(--c-texte); }
.check, .choice { color: var(--c-texte); border-color: var(--c-trait); }
.steps .on, .step.on, .step[aria-current] { background: var(--c-accent); color: var(--c-sur-accent); }

/* Pied de page */
footer { color: var(--c-texte-3); border-color: var(--c-trait); }
footer a { color: var(--c-texte-2); }

/* Plan du site */
.stamp, .dot { background: var(--c-accent); color: var(--c-sur-accent); }
.links a { color: var(--c-accent); }

@media print {
  .top::after, .zone-box::after, .cta-box::after { display: none; }
  .problem, .card, .qa, .price-card, .price-table, .page { background: #fff; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
}

.brand .tag, .brand .n small, .seal .t small { letter-spacing: .02em; }
.contact-strip .phone-link { background: var(--c-accent); color: var(--c-sur-accent); }

/* Plus de titres ni de libellés tout en majuscules (ancienne charte) */
body *:not(code):not(kbd) { text-transform: none !important; }