:root{--nuit:#061528;
  --marine:#0a2240;
  --marine-2:#0f2f55;
  --bleu:#10508f;
  --bleu-2:#1666aa;
  --cyan:#0090c0;
  --cyan-clair:#4fc3ea;
  --glace:#eef5fa;
  --glace-2:#dfeef7;
  --encre:#10223a;
  --gris:#4a5d73;
  --filet:#d5e3ee;
  --blanc:#fff;
  --rayon:8px;
  --entete:76px;
  --titre:"Archivo", "Roboto", system-ui, sans-serif;
  --texte:"Roboto", system-ui, -apple-system, sans-serif;
  --page:1240px;}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--entete)}
body{margin:0;background:var(--blanc);color:var(--encre);font:400 1.0625rem/1.65 var(--texte);-webkit-font-smoothing:antialiased}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--titre);font-stretch:108%;line-height:1.15;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(1.75rem,2.6vw,2.5rem);font-weight:750}
h3{font-size:1.25rem;font-weight:700}
p{margin:0 0 1em}
.page{width:min(100% - 32px, var(--page));margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
section{padding-block:clamp(64px,9vw,112px)}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:8px;font:600 1rem/1 var(--titre);font-stretch:105%;text-decoration:none;border:1.5px solid transparent;transition:background .2s,border-color .2s,color .2s,transform .2s;cursor:pointer;white-space:nowrap}
.btn svg{width:20px;height:20px;flex:none}
.btn-plein{background:var(--cyan);color:#fff}
.btn-plein:hover{background:#00a6dc}
.btn-contour{border-color:rgba(255,255,255,.55);color:#fff}
.btn-contour:hover{background:rgba(255,255,255,.1);border-color:#fff}
.btn-marine{background:var(--marine);color:#fff}
.btn-marine:hover{background:var(--bleu)}
.btn-trait{border-color:var(--bleu);color:var(--bleu)}
.btn-trait:hover{background:var(--bleu);color:#fff}
.revele{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.revele.vu{opacity:1;transform:none}
@media (max-width:640px){
  :root{--entete:66px}
}
@media (prefers-reduced-motion:reduce){
  .revele{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}
.page-cloud{--ambre:#e8963a;--rouge:#e5534b;--vert:#23a66b;--onglets:54px}
.page-cloud section{padding-block:0}
@media (prefers-reduced-motion:reduce){
  .page-cloud *{animation:none!important}
}
.page-fille section{padding-block:0}
.page-fille [hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){
  .page-fille *{animation:none!important}
}
.page-contact section{padding-block:0}
.page-contact [hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){
  .page-contact *{animation:none!important}
}
.page-404 [hidden]{display:none!important}

/* ===== Ajouts WordPress : icônes en masque, boutons natifs, structures communes ===== */
:root{--ic-fleche:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22M5 12h14M13 6l6 6-6 6%22/%3E%3C/svg%3E");--ic-tel:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22M5 4h3.2l1.6 4-2 1.3a11 11 0 0 0 6.9 6.9l1.3-2 4 1.6V19a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2Z%22/%3E%3C/svg%3E");--ic-coche:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%229%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.6%22/%3E%3Cpath fill=%22none%22 stroke=%22%23000%22 stroke-width=%221.8%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22 d=%22m8 12.3 2.6 2.6L16 9.5%22/%3E%3C/svg%3E");--ic-plus:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22%3E%3Cpath fill=%22none%22 stroke=%22%23000%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 d=%22M12 4v16M4 12h16%22/%3E%3C/svg%3E")}

/* Les blocs natifs ne portent aucune marge ni largeur imposée : la mise en page vient des classes des maquettes. */
.wp-site-blocks > *{margin:0}
ul.wp-block-list{margin:0}

/* Boutons : le bloc Bouton reprend .btn et ses variantes ; les icônes sont des masques en currentColor. */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px}
.wp-block-button > .wp-block-button__link{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 24px;border-radius:8px;font:600 1rem/1 var(--titre);font-stretch:105%;text-decoration:none;border:1.5px solid transparent;transition:background .2s,border-color .2s,color .2s,transform .2s;cursor:pointer;white-space:nowrap;background:var(--cyan);color:#fff;box-shadow:none}
.wp-block-button > .wp-block-button__link:hover{background:#00a6dc;color:#fff}
.wp-block-button[class*="-fleche"] .wp-block-button__link::after,
.wp-block-button[class*="-tel"] .wp-block-button__link::before,
.wp-block-button.is-style-urgence .wp-block-button__link::before{content:"";width:20px;height:20px;flex:none;background:currentColor;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.wp-block-button[class*="-fleche"]{--ic:var(--ic-fleche)}
.wp-block-button[class*="-tel"],.wp-block-button.is-style-urgence{--ic:var(--ic-tel)}
.wp-block-button.is-style-contour .wp-block-button__link,.wp-block-button.is-style-contour-tel .wp-block-button__link{background:transparent;border-color:rgba(255,255,255,.55);color:#fff}
.wp-block-button.is-style-contour .wp-block-button__link:hover,.wp-block-button.is-style-contour-tel .wp-block-button__link:hover{background:rgba(255,255,255,.1);border-color:#fff}
.wp-block-button.is-style-marine .wp-block-button__link,.wp-block-button.is-style-marine-fleche .wp-block-button__link{background:var(--marine)}
.wp-block-button.is-style-marine .wp-block-button__link:hover,.wp-block-button.is-style-marine-fleche .wp-block-button__link:hover{background:var(--bleu)}
.wp-block-button.is-style-trait .wp-block-button__link,.wp-block-button.is-style-trait-tel .wp-block-button__link,.wp-block-button.is-style-trait-fleche .wp-block-button__link{background:transparent;border-color:var(--bleu);color:var(--bleu)}
.wp-block-button.is-style-trait .wp-block-button__link:hover,.wp-block-button.is-style-trait-tel .wp-block-button__link:hover,.wp-block-button.is-style-trait-fleche .wp-block-button__link:hover{background:var(--bleu);color:#fff}
.wp-block-button.is-style-urgence .wp-block-button__link{min-height:0;gap:12px;margin-top:8px;padding:14px 22px;font:780 1.45rem/1 var(--titre);font-stretch:108%}
.wp-block-button.is-style-urgence .wp-block-button__link:hover{transform:translateY(-2px)}
.wp-block-button.is-style-urgence .wp-block-button__link::before{width:24px;height:24px}
.wp-block-button.is-style-tel-grand .wp-block-button__link{background:transparent;min-height:0;justify-content:center;padding:6px 0;font:780 1.6rem/1 var(--titre);font-stretch:110%}
.wp-block-button.is-style-tel-grand .wp-block-button__link::before{width:24px;height:24px;background:var(--cyan-clair)}

/* Structures communes aux sections */
.duo{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(40px,6vw,88px);align-items:start}
.texte p{color:var(--gris)}
.texte p strong{color:var(--encre);font-weight:500}
.intro-section > p{margin-bottom:0}

@media (max-width:980px){
  .duo{grid-template-columns:1fr}
}
@media (max-width:640px){
  .wp-block-buttons.hero-boutons .wp-block-button,.wp-block-buttons.hero-boutons .wp-block-button__link{width:100%;justify-content:center}
}

/* Réassurance : liste de petits pictos, partagée par le hero et l'appel */
.rassurance{display:flex;flex-wrap:wrap;gap:10px 28px;list-style:none;margin:0;padding:0;color:#c5d9ea;font-size:.95rem}
.rassurance > *{display:flex;align-items:center;gap:8px}
.rassurance svg{width:18px;height:18px;color:var(--cyan-clair);flex:none}
.appel .rassurance{justify-content:center;font-size:.88rem;gap:8px 18px}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .cle{animation:visse 1.1s ease-in-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .coche{animation:trace-boucle 1.4s ease-in-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .restaure{animation:tourne-inverse 1.2s cubic-bezier(.4,0,.2,1)}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .fleche-haut{animation:monte 1.2s ease-in-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .noeud{animation:pulse-n 1.2s ease-in-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .liens{animation:trace-boucle 1.2s ease-in-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .etincelle{animation:etincelle 1.2s ease-in-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .ecran{animation:trace-inverse 1.2s ease-out}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .notif{animation:tampon .6s cubic-bezier(.3,1.6,.5,1)}
:is(.tuile,.onglet,.rail-item,.pied-domaines a,.univers-tel,.lien-assistance,.rassurance > *,.garanties-titre,.tiroir summary):hover .pd .lignes path{animation:trace-inverse 1s ease-out}
.rassurance > *:hover .pd .p1,.rassurance > *:hover .pd .p2,.rassurance > *:hover .pd .p3{animation:saute .9s ease-in-out infinite}
.rassurance > *:hover .pd .p2{animation-delay:.15s}
.rassurance > *:hover .pd .p3{animation-delay:.3s}
.rassurance > *:hover .pd .sceau{animation:tampon .6s cubic-bezier(.3,1.6,.5,1)}
.rassurance > *:hover .pd .epingle{animation:rebond .8s ease-in-out}
.rassurance p{margin:0}

/* Image de fond (bloc econcept/image-fond) : sous le contenu du groupe qui la contient */
.fond-image{position:absolute;inset:0;z-index:-2;overflow:hidden;border-radius:inherit}
.fond-image img{width:100%;height:100%;object-fit:cover;display:block}
