/*
Theme Name:   3D-service — enfant Astra
Theme URI:    https://3d-service.fr
Description:  Thème enfant Astra portant l'identité visuelle 3D-service (vert #C1B400,
              direction « plan technique »). Toute personnalisation vit ici : le thème
              parent Astra peut être mis à jour sans rien écraser.
Author:       Foxchip
Author URI:   https://foxchip.com
Template:     astra
Version:      1.0.0
Text Domain:  astra-child-3dservice
*/

/* ============================================================
   1. JETONS — charte imposée par le client (carte de visite + flyer)
   Vert #C1B400 = CMJN C0 M7 J100 N24. Ne pas dériver sans son accord.
   ============================================================ */
:root{
  --3ds-accent:      #C1B400;
  --3ds-accent-soft: #ECE8C2;
  --3ds-accent-deep: #6b6400;  /* accent assombri : seul ratio lisible sur fond clair */
  --3ds-ink:         #23221A;
  --3ds-ink-soft:    #5C5B4E;
  --3ds-paper:       #FAFAF6;
  --3ds-paper-2:     #F1F1E4;
  --3ds-line:        #DDDCC8;
  --3ds-grid:        rgba(107,100,0,.08);
  --3ds-shadow:      0 10px 30px rgba(35,34,26,.08);
}

/* ============================================================
   2. TYPOGRAPHIE
   Familles chargées en local par functions.php (pas de CDN Google :
   RGPD + pas de requête tierce bloquante au premier rendu).
   ============================================================ */
body,
.ast-container{
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
  color: var(--3ds-ink);
  background: var(--3ds-paper);
}

h1, h2, h3, h4, h5, h6,
.entry-title, .site-title{
  font-family: "Bahnschrift", "DIN Alternate", "Franklin Gothic Medium", system-ui, sans-serif;
  color: var(--3ds-ink);
  line-height: 1.15;
  text-wrap: balance;
}

/* Les titres de section reprennent l'échelle fluide de la maquette. */
.entry-content h2{ font-size: clamp(1.7rem, 3.4vw, 2.4rem); }
.entry-content h3{ font-size: clamp(1.15rem, 2vw, 1.4rem); }

/* Confort de lecture : on borne la longueur de ligne du texte courant. */
.entry-content > p{ max-width: 68ch; }

/* ============================================================
   3. LIENS ET BOUTONS
   ============================================================ */
a{ color: var(--3ds-accent-deep); }
a:hover, a:focus{ color: var(--3ds-ink); }

.wp-block-button__link,
.ast-button, button, input[type="submit"]{
  font-family: "Bahnschrift", "DIN Alternate", system-ui, sans-serif;
  letter-spacing: .02em;
  border-radius: 8px;
  border: 1px solid transparent;
  background: var(--3ds-accent);
  color: var(--3ds-ink);
  box-shadow: 0 4px 14px rgba(193,180,0,.35);
  transition: transform .15s ease;
}
.wp-block-button__link:hover,
.ast-button:hover, button:hover, input[type="submit"]:hover{
  transform: translateY(-1px);
  background: var(--3ds-accent);
  color: var(--3ds-ink);
}

.wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent;
  border-color: var(--3ds-line);
  color: var(--3ds-ink);
  box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover{
  border-color: var(--3ds-accent-deep);
}

/* Le focus clavier doit rester visible partout : obligation d'accessibilité,
   et Astra le retire par défaut sur plusieurs composants. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-block-button__link:focus-visible{
  outline: 3px solid var(--3ds-accent);
  outline-offset: 2px;
}

::selection{ background: var(--3ds-accent); color: var(--3ds-ink); }

/* ============================================================
   4. SIGNATURE VISUELLE — trame « plan technique »
   Reprend le fond millimétré de la maquette. Appliquer la classe
   is-style-3ds-blueprint à un groupe de blocs depuis l'éditeur.
   ============================================================ */
.is-style-3ds-blueprint{
  background:
    linear-gradient(var(--3ds-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--3ds-grid) 1px, transparent 1px),
    var(--3ds-paper);
  background-size: 28px 28px, 28px 28px;
  border-block: 1px solid var(--3ds-line);
}

/* Intertitre technique : « PLANCHE 02 / 06 — SERVICES ». */
.is-style-3ds-plate{
  display: flex;
  align-items: center;
  gap: 14px;
  font-family: "Cascadia Code", "Consolas", ui-monospace, monospace;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--3ds-accent-deep);
}
.is-style-3ds-plate::after{
  content: "";
  height: 1px;
  flex: 1;
  background: var(--3ds-line);
}

/* ============================================================
   5. CARTES — services et réalisations
   ============================================================ */
/* NB : les classes ne peuvent pas commencer par un chiffre en CSS — d'où le
   préfixe `is-style-3ds-` (valide) et jamais `.3ds-…` (invalide, casse la règle). */
.wp-block-group.is-style-3ds-card{
  background: #fff;
  border: 1px solid var(--3ds-line);
  border-radius: 10px;
  padding: 26px;
  box-shadow: var(--3ds-shadow);
  transition: transform .15s ease, border-color .15s ease;
}
a:hover > .wp-block-group.is-style-3ds-card{
  transform: translateY(-3px);
  border-color: var(--3ds-accent);
}

/* Étiquette de spécification : « PETG-GF », « DÉLAI · 3 J ». */
.is-style-3ds-spec{
  display: inline-block;
  font-family: "Cascadia Code", "Consolas", ui-monospace, monospace;
  font-size: .68rem;
  letter-spacing: .06em;
  padding: 3px 9px;
  border-radius: 4px;
  background: var(--3ds-accent-soft);
  color: var(--3ds-accent-deep);
}

/* ============================================================
   6. EN-TÊTE ET PIED DE PAGE
   ============================================================ */
.site-header{ border-bottom: 1px solid var(--3ds-line); }
.main-header-menu a{ color: var(--3ds-ink-soft); }
.main-header-menu .current-menu-item > a,
.main-header-menu a:hover{ color: var(--3ds-ink); }

.site-footer,
.ast-small-footer{
  background: var(--3ds-paper-2);
  border-top: 1px solid var(--3ds-line);
  font-family: "Cascadia Code", "Consolas", ui-monospace, monospace;
  font-size: .72rem;
  letter-spacing: .08em;
}

/* ============================================================
   7. FORMULAIRES
   ============================================================ */
input[type="text"], input[type="email"], input[type="tel"],
input[type="number"], select, textarea{
  background: var(--3ds-paper);
  border: 1px solid var(--3ds-line);
  border-radius: 7px;
  padding: 11px 13px;
  color: var(--3ds-ink);
}
input:focus, select:focus, textarea:focus{ border-color: var(--3ds-accent-deep); }

/* ============================================================
   8. MOUVEMENT
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}
