/*
Theme Name:   Divi Child — AM Service
Theme URI:    https://amservice-vendee.fr
Description:  Thème enfant Divi pour AM Service — Plombier & Menuisier, Bouin (85)
Author:       Graffocean
Template:     Divi
Version:      1.0.0
*/

/* ============================================================
   AM SERVICE — Charte graphique (source : maquette Claude Design)
   Les classes .ams-* s'appliquent dans Divi via
   Réglages du module > Avancé > ID et classes CSS > Classe CSS
   ============================================================ */

/* ---------- Tokens ---------- */
:root {
  --ams-petrol:      #1B5E7B;
  --ams-petrol-mid:  #134A62;
  --ams-petrol-dark: #0D3A4F;
  --ams-turquoise:   #2ABFBF;
  --ams-turquoise-h: #1B9E9E;
  --ams-ink:         #1C2833;
  --ams-ink-soft:    #4A5965;
  --ams-alt:         #F4F6F7;
  --ams-border:      #E3E8EA;
  --ams-shadow:      0 2px 12px rgba(27, 94, 123, 0.08);
  --ams-shadow-md:   0 8px 28px rgba(27, 94, 123, 0.12);
  --ams-radius:      6px;
  --ams-radius-lg:   14px;
}

/* ---------- Typo globale ---------- */
/* DM Sans : à définir dans Divi > Options du thème (police par défaut).
   Ici on ne force que les détails que Divi ne gère pas. */
body { color: var(--ams-ink); }
h1, h2, h3, h4 { letter-spacing: -0.015em; }

/* ---------- Boutons ----------
   .ams-btn        : CTA principal turquoise (module Bouton)
   .ams-btn-ghost  : contour pétrole sur fond clair
   .ams-btn-light  : contour blanc sur fond sombre           */
.ams-btn.et_pb_button,
.ams-btn .et_pb_button {
  background: var(--ams-turquoise);
  color: #fff;
  border: 2px solid var(--ams-turquoise);
  border-radius: var(--ams-radius);
  font-weight: 600;
  padding: 14px 26px !important;
}
.ams-btn.et_pb_button:hover,
.ams-btn .et_pb_button:hover {
  background: var(--ams-turquoise-h);
  border-color: var(--ams-turquoise-h);
  box-shadow: 0 8px 20px rgba(42, 191, 191, 0.32);
}
.ams-btn-ghost.et_pb_button,
.ams-btn-ghost .et_pb_button {
  background: transparent;
  color: var(--ams-petrol);
  border: 2px solid var(--ams-petrol);
  border-radius: var(--ams-radius);
  font-weight: 600;
}
.ams-btn-ghost.et_pb_button:hover,
.ams-btn-ghost .et_pb_button:hover {
  background: var(--ams-petrol);
  color: #fff;
}
.ams-btn-light.et_pb_button,
.ams-btn-light .et_pb_button {
  background: transparent;
  color: #fff;
  border: 2px solid rgba(255, 255, 255, 0.55);
  border-radius: var(--ams-radius);
  font-weight: 600;
}
.ams-btn-light.et_pb_button:hover,
.ams-btn-light .et_pb_button:hover {
  background: #fff;
  color: var(--ams-petrol);
  border-color: #fff;
}

/* ---------- Surtitre de section ----------
   .ams-eyebrow sur un module Texte */
.ams-eyebrow, .ams-eyebrow p {
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ams-turquoise);
}

/* ---------- Badge géo du hero ----------
   .ams-geo sur un module Texte (hero) */
.ams-geo p {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: rgba(42, 191, 191, 0.16);
  border: 1px solid rgba(42, 191, 191, 0.45);
  color: #aef2f2;
  padding: 8px 16px;
  border-radius: 100px;
  font-size: 0.86rem;
  font-weight: 600;
}
.ams-geo p::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ams-turquoise);
  box-shadow: 0 0 0 4px rgba(42, 191, 191, 0.25);
}

/* ---------- Cartes prestations ----------
   .ams-card sur un module Blurb */
.ams-card.et_pb_blurb {
  background: #fff;
  border: 1px solid var(--ams-border);
  border-radius: var(--ams-radius-lg);
  padding: 32px 30px;
  box-shadow: var(--ams-shadow);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.ams-card.et_pb_blurb:hover {
  border-color: var(--ams-turquoise);
  box-shadow: var(--ams-shadow-md);
  transform: translateY(-4px);
}
.ams-card .et_pb_main_blurb_image { margin-bottom: 20px; }
.ams-card .et_pb_module_header { font-size: 1.32rem; margin-bottom: 12px; }
.ams-card ul {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
}
.ams-card ul li {
  position: relative;
  padding-left: 27px;
  margin-bottom: 9px;
  color: var(--ams-ink-soft);
  font-size: 0.98rem;
}
.ams-card ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--ams-turquoise);
  font-weight: 700;
}

/* ---------- Blocs avantages ----------
   .ams-adv sur un module Blurb (fond section #F4F6F7) */
.ams-adv .et_pb_main_blurb_image .et_pb_image_wrap {
  width: 52px;
  height: 52px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: #fff;
  border: 1px solid var(--ams-border);
  box-shadow: var(--ams-shadow);
}
.ams-adv .et_pb_module_header { font-size: 1.12rem; }
.ams-adv .et_pb_blurb_description { color: var(--ams-ink-soft); font-size: 0.96rem; }

/* ---------- Chips communes ----------
   .ams-chips sur un module Texte contenant une liste ul */
.ams-chips ul {
  list-style: none;
  padding: 0;
  margin: 22px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ams-chips ul li {
  background: var(--ams-alt);
  border: 1px solid var(--ams-border);
  border-radius: 100px;
  padding: 8px 16px;
  font-weight: 500;
  font-size: 0.96rem;
  margin: 0;
}
.ams-chips ul li:first-child {
  background: var(--ams-petrol);
  color: #fff;
  border-color: var(--ams-petrol);
}

/* ---------- Encadré info ----------
   .ams-note sur un module Texte */
.ams-note {
  background: rgba(42, 191, 191, 0.08);
  border-left: 3px solid var(--ams-turquoise);
  padding: 16px 18px;
  border-radius: 0 var(--ams-radius) var(--ams-radius) 0;
  color: var(--ams-ink-soft);
}

/* ---------- Blocs service pages intérieures ----------
   .ams-svc sur un module Blurb (icône à gauche) */
.ams-svc.et_pb_blurb {
  padding: 30px 0;
  border-top: 1px solid var(--ams-border);
}
.ams-svc.et_pb_blurb:first-child { border-top: 0; }
.ams-svc .et_pb_main_blurb_image .et_pb_image_wrap {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(42, 191, 191, 0.12);
}
.ams-svc .et_pb_module_header { font-size: 1.42rem; }
.ams-svc .et_pb_blurb_description > p { color: var(--ams-ink-soft); font-size: 1.04rem; }

/* Tags sous les blocs service : ul dans la description du Blurb */
.ams-svc ul {
  list-style: none;
  padding: 0;
  margin: 16px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ams-svc ul li {
  background: var(--ams-alt);
  border: 1px solid var(--ams-border);
  border-radius: 100px;
  padding: 5px 14px;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--ams-ink-soft);
  margin: 0;
}

/* ---------- Stats bar ----------
   .ams-stat sur les modules Texte de la rangée (fond section #134A62) */
.ams-stat h3 {
  font-size: clamp(1.7rem, 3.4vw, 2.4rem);
  font-weight: 700;
  color: var(--ams-turquoise);
}
.ams-stat p { color: rgba(255, 255, 255, 0.82); }

/* ---------- Formulaire de contact Divi ----------
   .ams-form sur le module Contact Form */
.ams-form .et_pb_contact_field input,
.ams-form .et_pb_contact_field textarea,
.ams-form .et_pb_contact_field select {
  background: #fff;
  color: var(--ams-ink);
  border: 1px solid #ccc;
  border-radius: var(--ams-radius);
  padding: 12px 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ams-form .et_pb_contact_field input:focus,
.ams-form .et_pb_contact_field textarea:focus,
.ams-form .et_pb_contact_field select:focus {
  outline: none;
  border-color: var(--ams-turquoise);
  box-shadow: 0 0 0 3px rgba(42, 191, 191, 0.16);
}
.ams-form .et_pb_contact_submit {
  background: var(--ams-turquoise);
  color: #fff;
  border: 0;
  border-radius: var(--ams-radius);
  font-weight: 600;
  width: 100%;
  padding: 15px;
}
.ams-form .et_pb_contact_submit:hover { background: var(--ams-turquoise-h); }

/* ---------- Carte OSM (shortcode [ams_map]) ---------- */
.ams-map {
  border-radius: var(--ams-radius-lg);
  overflow: hidden;
  box-shadow: var(--ams-shadow-md);
  border: 1px solid var(--ams-border);
}
.ams-map iframe {
  display: block;
  width: 100%;
  height: 380px;
  border: 0;
}

/* ---------- Header (Theme Builder) ----------
   .ams-nav sur la section du header global */
.ams-nav .et_pb_menu .et-menu a {
  color: #fff;
  font-weight: 500;
  padding: 9px 14px;
  border-radius: var(--ams-radius);
  transition: background 0.15s ease;
}
.ams-nav .et_pb_menu .et-menu a:hover {
  background: rgba(255, 255, 255, 0.1);
  opacity: 1;
}
.ams-nav .et_pb_menu .et-menu li.current-menu-item > a {
  color: var(--ams-turquoise);
  box-shadow: inset 0 -2px 0 var(--ams-turquoise);
}
/* Menu mobile Divi */
.ams-nav .et_mobile_menu {
  background: var(--ams-petrol);
  border-top: 3px solid var(--ams-turquoise);
}
.ams-nav .et_mobile_menu li a {
  color: #fff;
  font-size: 20px;
  border-color: rgba(255, 255, 255, 0.12);
}
.ams-nav .mobile_menu_bar:before { color: #fff; }

/* ---------- Footer (Theme Builder) ----------
   .ams-footer sur la section du footer global */
.ams-footer { color: rgba(255, 255, 255, 0.78); }
.ams-footer h4 {
  color: #fff;
  font-size: 0.92rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 600;
}
.ams-footer a { color: rgba(255, 255, 255, 0.78); transition: color 0.15s; }
.ams-footer a:hover { color: var(--ams-turquoise); }
.ams-footer .ams-footer-bar {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 0.88rem;
}

/* ---------- Fil d'Ariane Yoast (pages intérieures) ----------
   .ams-crumb sur le module Texte contenant [wpseo_breadcrumb] */
.ams-crumb, .ams-crumb a { color: rgba(255, 255, 255, 0.7); font-size: 0.9rem; }
.ams-crumb a:hover { color: var(--ams-turquoise); }
.ams-crumb .breadcrumb_last { color: var(--ams-turquoise); font-weight: 600; }
