/*! AM - ENSEIGNE — © 2026 AM ENSEIGNE · RCS Nîmes 130 898 927 · tous droits réservés.
 *  Logiciel protégé par le droit d’auteur (CPI art. L112-2, 13°). Reproduction, adaptation
 *  ou diffusion du code, totale ou partielle, interdites sans autorisation écrite.
 *  contact@am-enseigne.com */
/* ═══════════════════════════════════════════════════════════════════════════
   THÈME « DUO LIQUID GLASS » — surcouche chargée APRÈS style.css.
   Panneaux & contrôles en VERRE CLAIR (blanc translucide, reflet spéculaire),
   zone 3D SOMBRE inchangée pour faire éclater néons et éclairages.
   Retirer le <link> dans index.html suffit à revenir à l'ancien thème.
   ═══════════════════════════════════════════════════════════════════════════ */
/* Lot 285 perf : plus d'import Google Fonts. Bebas Neue et Inter sont servies par le site
   (ame2-*.woff2, prechargees, memes fichiers au bit pres que ceux de Google). L'import
   bloquait le rendu et gardait en sommeil le defer de Babylon (lot 268, correctifs 3 et 4). */

:root{
  --de-blue:#0071e3;
  --glass-w:rgba(255,255,255,.62);          /* verre blanc */
  --glass-w2:rgba(255,255,255,.8);
  --glass-line:rgba(255,255,255,.75);
  --glass-edge:rgba(11,13,16,.08);
  --r-lg:22px; --r-md:14px;
}

/* fond général : gris-bleu très clair + halos cyan/rose doux (ADN boutique) */
html, body{
  background:
    radial-gradient(900px 560px at 82% -10%, rgba(55,224,255,.16), transparent 60%),
    radial-gradient(760px 520px at 4% 108%, rgba(255,47,176,.10), transparent 60%),
    linear-gradient(180deg,#eef1f6,#e8ebf2);
  font-family:'Inter',"Helvetica Neue",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}

/* ── header : pastille BLANCHE, la même que sur l'accueil et la boutique ──
 * Le fond est opaque : le flou d'arrière-plan part avec la translucidité (il ne masquait
 * plus rien et se recomposait à chaque image), et le liseré blanc — invisible sur du
 * blanc — devient un gris fin qui pose le bord de la pastille sur le fond dégradé. */
header{
  margin:10px 14px 0; height:64px; border-radius:100px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 10px 30px rgba(15,20,30,.10);
  position:relative;            /* ancre le menu déplié en écran étroit (voir style.css) */
}

/* ── boutons : verre + levée au survol ── */
.btn{
  border-radius:100px; transition:transform .2s cubic-bezier(.2,.8,.2,1), box-shadow .2s, background .2s;
  box-shadow:0 4px 14px rgba(15,20,30,.08), inset 0 1px 0 rgba(255,255,255,.7);
}
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(15,20,30,.14), inset 0 1px 0 rgba(255,255,255,.8); }
.btn:active{ transform:translateY(0) scale(.98); }
.btn.ghost{
  background:var(--glass-w); border:1px solid var(--glass-edge);
  -webkit-backdrop-filter:blur(14px) saturate(1.5); backdrop-filter:blur(14px) saturate(1.5);
}
.btn.cta{
  background:linear-gradient(135deg,#0a84ff,#0071e3); border-color:transparent;
  box-shadow:0 8px 22px rgba(0,113,227,.35), inset 0 1px 0 rgba(255,255,255,.35);
}
.btn.cta:hover{ box-shadow:0 14px 30px rgba(0,113,227,.45), inset 0 1px 0 rgba(255,255,255,.4); }

/* ── zone 3D : reste SOMBRE, coins plus généreux, ombre plus douce ── */
.stage{
  border-radius:26px;
  box-shadow:0 30px 70px rgba(10,14,22,.30), 0 4px 16px rgba(10,14,22,.14);
  border:1px solid rgba(255,255,255,.5);
}
/* commandes posées sur le visuel : verre sombre plus soyeux */
.view-bar,.zoom{
  background:rgba(14,16,22,.5);
  -webkit-backdrop-filter:blur(18px) saturate(1.5); backdrop-filter:blur(18px) saturate(1.5);
  border:1px solid rgba(255,255,255,.14); border-radius:100px;
  box-shadow:0 6px 20px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12);
}
.view-bar button,.zoom button{ border-radius:100px; }
.view3d-btn{
  background:rgba(14,16,22,.5); border:1px solid rgba(255,255,255,.16); border-radius:100px;
  -webkit-backdrop-filter:blur(18px) saturate(1.5); backdrop-filter:blur(18px) saturate(1.5);
  box-shadow:0 6px 20px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.14);
}

/* ── panneau : cartes de verre sur fond translucide ── */
.panel{
  background:transparent; border-left:0; padding:20px 18px 44px;
}
.panel h1, .panel h2{
  font-family:'Bebas Neue',sans-serif; font-weight:400; font-size:30px; letter-spacing:.02em;
}
.card{
  background:var(--glass-w);
  -webkit-backdrop-filter:blur(20px) saturate(1.6); backdrop-filter:blur(20px) saturate(1.6);
  border:1px solid var(--glass-line); border-radius:var(--r-lg);
  box-shadow:0 10px 28px rgba(15,20,30,.08), inset 0 1px 0 rgba(255,255,255,.85);
  padding:17px 18px;
}
.card h3 b{ color:var(--de-blue); }

/* champs : verre dépoli + focus ring bleu */
input[type=text], input[type=number], select, .devis-form input, .devis-form textarea{
  background:rgba(255,255,255,.72); border:1px solid var(--glass-edge); border-radius:var(--r-md);
  transition:border-color .18s, box-shadow .18s, background .18s;
}
input[type=text]:focus, input[type=number]:focus, select:focus,
.devis-form input:focus, .devis-form textarea:focus{
  outline:none; border-color:rgba(0,113,227,.55);
  box-shadow:0 0 0 4px rgba(0,113,227,.14); background:#fff;
}

/* segmented : même UI que les onglets Face/Chant/Arrière (.mat-tabs) — le style de base
 * de style.css s'applique, pastille coulissante comprise. L'ancienne « pilule de verre »
 * redéfinissait fond + padding et se superposait à la pastille. */

/* tuiles décors & modèles : coins doux + focus bleu lumineux */
.decor,.model{ border-radius:var(--r-md); }
.decor.on,.model.on{ outline-color:var(--de-blue); box-shadow:0 0 0 4px rgba(0,113,227,.15), 0 8px 20px rgba(0,113,227,.14); }
.model{ background:rgba(255,255,255,.6); }
.el-tag{ border-radius:100px; background:rgba(11,13,16,.06); }
.add-el button, .el-del, .logo-x{ border-radius:100px; background:rgba(255,255,255,.7); }
.logo-chip, .de-modal-prev, .devis-recap{ background:rgba(255,255,255,.55); border-radius:var(--r-md); }

/* popups : verre épais */
.de-modal{ background:rgba(18,22,30,.38); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.de-modal-card{
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:blur(26px) saturate(1.6); backdrop-filter:blur(26px) saturate(1.6);
  border:1px solid rgba(255,255,255,.9); border-radius:24px;
  box-shadow:0 40px 90px rgba(10,14,22,.35), inset 0 1px 0 #fff;
}

/* scrollbar discrète du panneau */
.panel::-webkit-scrollbar{ width:9px }
.panel::-webkit-scrollbar-thumb{ background:rgba(11,13,16,.14); border-radius:8px }
.panel::-webkit-scrollbar-thumb:hover{ background:rgba(11,13,16,.24) }


/* En-tete align sur l accueil et la boutique : barre pleine largeur, sans pilule.
   Cette feuille est chargee apres style.css et y reimposait le coin arrondi, la
   marge et l ombre portee — il faut donc la corriger ici, a sa source. */
header{ margin:0; border-radius:0; box-shadow:none; border:0;
  border-bottom:1px solid rgba(15,23,42,.10) }

/* Lot 285 perf (accessibilite, /configurateur/) : contrastes AA (4,5:1), mesures sur les pixels
   RENDUS (fond echantillonne sous chaque texte masque), pas sur les couleurs declarees :
   Lighthouse ne juge pas les textes poses sur un degrade ou sous un halo.
   Gris secondaire : #8a8f98 -> #6c727b (cartes de verre 4,51 a 4,60:1, en-tete blanc 4,85:1,
   fenetre de devis 4,68 a 4,85:1), le meme que la page plaques (lot 268 C5, pose en PHP).
   Textes poses directement sur le fond degrade de la page (chapo, aide sous « Voir en 3D ») :
   #646972 (fond le plus sombre mesure #e5e9ef : 4,53:1 ; #6c727b n y donnait que 3,94 a 4,28:1).
   Pastilles de format du logo : l ombre bleue du bouton d import (position:relative) etait peinte
   PAR-DESSUS elles (fond reel jusqu a #dce7f3) ; .formats en position:relative les repasse
   devant, sans rien deplacer (la bulle « i », z-index:20, reste au-dessus). Pastilles grises
   #7b818b -> #6a6f78 sur leur fond #f1f2f5 : 4,51:1. Pastilles bleues (fond translucide, le halo
   se voit encore a travers) #0064cc -> #0061c6 : 4,50:1 sur #cfe2f7. Meme teinte a chaque fois. */
:root{ --muted:#6c727b; }
#panel > .sub, #panel > .note{ color:#646972; }
.formats{ position:relative; }
.fmt{ color:#6a6f78; }
.fmt.best{ color:#0061c6; }