/* Bureau Transfert : feuille de style principale.
Police via Google Fonts pour ce prototype.
TODO avant mise en ligne : auto-héberger Archivo / Public Sans / IBM Plex Mono
(performance + RGPD, éviter l'appel direct à fonts.googleapis.com). */

:root{
--ink:#001729;
--paper:#f2f6fa;
--paper-raised:#e8f3fb;
--white:#ffffff;
--horizon:#007cba;
--cuivre:#015597;
--cuivre-dark:#013f73;
--cuivre-clair:#5b9fdb;
--ardoise:#5c7690;
--line:#d7e3ec;
--text:#001729;
--text-soft:#45607a;
--radius:3px;
--wrap:1400px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
margin:0;
background:var(--paper);
color:var(--text);
font-family:"Public Sans", ui-sans-serif, system-ui, sans-serif;
-webkit-font-smoothing:antialiased;
font-size:16px;
line-height:1.6;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.container{max-width:var(--wrap);margin:0 auto;padding:0 28px;}
.mono{font-family:"IBM Plex Mono", ui-monospace, monospace;}
h1,h2,h3,h4{font-family:"Archivo", ui-sans-serif, sans-serif;font-weight:800;letter-spacing:-0.01em;margin:0;text-wrap:balance;}
.eyebrow{
font-family:"IBM Plex Mono",monospace;
font-size:12px;
letter-spacing:.12em;
text-transform:uppercase;
color:var(--cuivre);
margin:0 0 12px;
display:block;
}
.btn{
display:inline-flex;align-items:center;justify-content:center;gap:8px;
font-family:"Public Sans",sans-serif;font-weight:600;font-size:15px;
padding:13px 24px;border-radius:var(--radius);border:1px solid transparent;
cursor:pointer;transition:background-color .15s ease, border-color .15s ease, color .15s ease;
line-height:1;
}
.btn-primary{background:var(--cuivre);color:var(--white);}
.btn-primary:hover{background:var(--cuivre-dark);}
.btn-ghost{background:transparent;color:var(--white);border-color:rgba(255,255,255,.5);}
.btn-ghost:hover{border-color:#fff;}
.btn-dark{background:var(--ink);color:var(--white);}
.btn-dark:hover{background:#232b45;}
.btn[disabled],.btn.is-disabled{opacity:.55;cursor:not-allowed;}
.btn-sm{padding:9px 18px;font-size:13.5px;}

/* CTA répété en bas de chaque section */
.section-cta{margin-top:36px;}
.section-cta-center{text-align:center;}

/* ---------- Header ---------- */
.site-header{
position:sticky;top:0;z-index:50;
background:var(--paper);
border-bottom:1px solid var(--line);
}
.header-row{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px;}
.brand-group{display:flex;align-items:center;}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);}
.brand svg,.brand img{flex:none;}
.brand-word{display:flex;flex-direction:column;justify-content:center;line-height:1;height:30px;}
.brand-word .l1{font-family:"Archivo",sans-serif;font-weight:800;font-size:16px;letter-spacing:-0.01em;}
.brand-word .l2{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ardoise);margin-top:3px;}
.footer-brand .brand-word .l2{color:#9aa1b3;}

/* Badge avis Google, à côté du logo dans le header */
.header-google-badge{
display:flex;align-items:center;gap:8px;
margin-left:16px;padding-left:16px;border-left:1px solid var(--line);
}
.header-google-badge .g-icon{width:17px;height:17px;flex:none;}
.header-google-badge .txt{line-height:1.3;}
.header-google-badge .stars{display:flex;gap:1px;margin-bottom:2px;}
.header-google-badge .stars svg{width:10px;height:10px;}
.header-google-badge .txt span{display:block;font-family:"Public Sans",sans-serif;font-size:11.5px;color:var(--text-soft);white-space:nowrap;}
.header-google-badge .txt span b{color:var(--text);font-weight:700;}
@media (max-width:760px){.header-google-badge{display:none;}}

.main-nav{display:flex;align-items:center;gap:2px;}
.nav-item{position:relative;}
.nav-link{
display:flex;align-items:center;gap:5px;
padding:10px 14px;font-size:14.5px;font-weight:600;color:var(--text);
border-radius:var(--radius);
}
.nav-item.has-children:hover .nav-link,
.nav-item.has-children:focus-within .nav-link{background:var(--paper-raised);}
.nav-caret{width:8px;height:8px;border-right:1.5px solid var(--ardoise);border-bottom:1.5px solid var(--ardoise);transform:rotate(45deg);margin-top:-3px;}
.nav-dropdown{
position:absolute;top:100%;left:0;min-width:280px;
background:var(--white);border:1px solid var(--line);border-radius:var(--radius);
box-shadow:0 12px 24px -12px rgba(18,24,42,.18);
padding:8px;opacity:0;visibility:hidden;transform:translateY(4px);
transition:opacity .15s ease, transform .15s ease, visibility .15s ease;
}
.nav-item.has-children:hover .nav-dropdown,
.nav-item.has-children:focus-within .nav-dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.nav-dropdown a, .nav-dropdown span{
display:block;padding:9px 12px;border-radius:var(--radius);font-size:13.5px;color:var(--text-soft);
}
.nav-dropdown a:hover,
.nav-dropdown a:focus-visible{background:var(--paper-raised);color:var(--text);}
.nav-dropdown .soon{
display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--ardoise);
}
.nav-dropdown .soon .tag{font-family:"IBM Plex Mono",monospace;font-size:9.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ardoise);border:1px solid var(--line);padding:1px 6px;border-radius:3px;}
.nav-cta{display:flex;align-items:center;gap:14px;}
.nav-toggle{display:none;background:none;border:1px solid var(--line);border-radius:var(--radius);width:40px;height:40px;align-items:center;justify-content:center;}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{
content:"";display:block;width:18px;height:2px;background:var(--ink);position:relative;
}
.nav-toggle span::before{position:absolute;top:-6px;}
.nav-toggle span::after{position:absolute;top:6px;}

/* ---------- Hero ---------- */
.hero{
position:relative;
min-height:600px;
display:flex;align-items:center;
background-color:var(--ink);
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/immeubles-gratte-ciel.webp");
background-size:cover;
background-position:center 30%;
color:var(--white);
}
/* Page service : meme habillage que le hero de l'accueil, photo differente */
.page-hero{
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/bureau-open-space-copie.webp");
}
/* Page zones desservies : meme habillage, photo differente */
.zones-hero{
min-height:300px;
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/salle-reunion-vue-ville.webp");
}
.zones-hero .hero-single-copy{max-width:none;width:100%;}
/* Page methode : hero plus bas, le texte prend toute la largeur disponible.
justify-self:start (herite de .hero-single-copy) fige sinon la largeur de
la boite a son contenu au lieu de l'etirer, meme sans max-width. */
.methode-hero{min-height:300px;}
.methode-hero .hero-single-copy{max-width:none;width:100%;}
.zones-hero .hero-headline,
.methode-hero .hero-headline,
.service-hero .hero-headline{max-width:none;}
.zones-hero .hero-sub,
.methode-hero .hero-sub,
.service-hero .hero-sub{max-width:none;}
/* Pages de service enfant (ex. /transfert-de-bureaux-ile-de-france/demenagement-de-bureaux/) : meme
petit hero que methode/zones, reutilisable pour les prochaines pages service.
La photo change par service (voir modificateurs .svc-* ci-dessous), pour ne
pas afficher la meme image sur les 5 pages de service. */
.service-hero{min-height:300px;}
.service-hero .hero-single-copy{max-width:none;width:100%;}
.svc-demenagement{
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/bureau-espaces-ouverts.webp");
}
.svc-archives{
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/dossiers-arc-en-ciel.webp");
}
.svc-materiel{
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/bureau-open-space.webp");
}
.svc-collecte{
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/ordinateur-salle-classe.webp");
}
.svc-grands-comptes{
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/immeubles-modernes-ville.webp");
}
/* Pages departement (ex. /zone-de-transfert-de-bureau-desservie/paris-75/) :
meme petit hero que methode/zones/service, une seule colonne pleine largeur.
La carte interactive est affichee plus bas, dans la section d'introduction. */
.dept-hero{
min-height:300px;
background-image:
linear-gradient(115deg, rgba(15,19,33,.95) 0%, rgba(15,19,33,.82) 38%, rgba(15,19,33,.42) 72%, rgba(15,19,33,.55) 100%),
url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/salle-reunion-vue-ville.webp");
}
.dept-hero .hero-single-copy{max-width:none;width:100%;}
.dept-hero .hero-headline,
.dept-hero .hero-sub{max-width:none;}
/* Departement mis en evidence sur la carte interactive (section d'introduction) :
reste affiche comme au survol en permanence, et n'est pas cliquable puisqu'on
est deja sur sa page (les 7 autres departements restent des liens). */
.dept-shape.is-current{fill:var(--cuivre);cursor:default;}
/* Section d'introduction (texte + carte) des pages departement : moins de
padding que les autres sections, la carte remplit deja bien la hauteur. */
.dept-intro{padding:56px 0;}
/* Page demande de devis : hero plein largeur, fond bleu uni (pas de photo,
la page va droit au formulaire), hauteur reduite. */
.devis-hero{
min-height:180px;
background-color:var(--cuivre);
background-image:none;
}
.devis-hero .hero-inner{padding-top:48px;padding-bottom:48px;}
.devis-hero .hero-single-copy{max-width:none;width:100%;}
.devis-hero .hero-headline,
.devis-hero .hero-sub{max-width:none;}
.hero-inner{
display:grid;grid-template-columns:1.2fr .8fr;gap:56px;
padding-top:56px;padding-bottom:56px;width:100%;}
.hero-kicker{
font-family:"IBM Plex Mono",monospace;
font-size:12px;font-weight:500;
letter-spacing:.12em;text-transform:uppercase;
color:var(--cuivre-clair);
margin:0 0 14px;
display:block;
}
.hero-headline{
font-family:"Archivo",sans-serif;font-weight:800;
font-size:clamp(34px,4.6vw,54px);line-height:1.08;letter-spacing:-0.01em;
color:var(--white);max-width:16ch;margin:0;text-wrap:balance;
}
.hero-headline em{font-style:normal;color:var(--cuivre-clair);}
.hero-sub{font-size:18px;color:#dfe2ea;max-width:46ch;margin:20px 0 0;line-height:1.55;}
.hero-cta-row{display:flex;align-items:center;gap:20px;margin-top:32px;flex-wrap:wrap;}

.hero-badges{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none;}
.hero-badge{
display:inline-flex;align-items:center;gap:6px;
padding:6px 11px;border-radius:999px;
background:var(--white);color:var(--text);
font-family:"IBM Plex Mono",monospace;font-size:11px;
white-space:nowrap;
}
.hero-badge::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--cuivre);flex:none;}
@media (min-width:900px){.hero-badges{flex-wrap:nowrap;}}

/* Barre de réassurance sous le hero */
.trust-bar{background:var(--white);border-bottom:1px solid var(--line);padding:0;}
.trust-bar .container{
display:grid;grid-template-columns:repeat(4,1fr);
}
.trust-item{
display:flex;align-items:flex-start;gap:12px;
padding:26px 22px;border-left:1px solid var(--line);
}
.trust-item:first-child{border-left:none;padding-left:0;}
.trust-item .ico{flex:none;width:20px;height:20px;margin-top:2px;}
.trust-item .ico svg{width:100%;height:100%;}
.trust-item strong{display:block;font-family:"Archivo",sans-serif;font-size:14.5px;font-weight:700;margin-bottom:3px;}
.trust-item span{display:block;font-size:12.5px;color:var(--text-soft);line-height:1.4;}

.hero-form{
align-self:start;
background:var(--white);color:var(--text);
border-radius:var(--radius);
padding:26px 26px 24px;
box-shadow:0 24px 48px -20px rgba(0,0,0,.45);
}
.hero-form h2{font-size:17px;margin-bottom:4px;}
.hero-form p{font-size:13.5px;color:var(--text-soft);margin:0 0 18px;}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12.5px;font-weight:600;color:var(--text);margin-bottom:6px;}
.field input{
width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:var(--radius);
font-family:"Public Sans",sans-serif;font-size:14.5px;background:var(--paper);color:var(--text);
}
.field input:focus{outline:2px solid var(--horizon);outline-offset:1px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.form-note{font-size:11.5px;color:var(--ardoise);margin-top:10px;}
.form-msg{font-size:13px;margin-top:12px;padding:10px 12px;border-radius:var(--radius);display:none;}
.form-msg.is-visible{display:block;}

/* ---------- Section scaffolding ---------- */
section{padding:88px 0;}
.section-head{max-width:640px;margin-bottom:48px;}
.section-head h2{font-size:clamp(24px,3vw,32px);}
.section-head p{color:var(--text-soft);font-size:16.5px;margin-top:14px;}
.bg-raised{background:var(--paper-raised);}
.bg-ink{background:var(--ink);color:var(--white);}
.bg-ink .section-head p{color:#b7bccb;}
.bg-ink .guarantee p{color:#b7bccb;}
.bg-ink .eyebrow{color:var(--cuivre-clair);}
.bg-ink.bg-photo{
background-color:var(--ink);
background-image:linear-gradient(100deg, rgba(15,19,33,.94) 0%, rgba(15,19,33,.86) 55%, rgba(15,19,33,.7) 100%), url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/boites-entreposees-entrepot.webp");
background-size:cover;background-position:center;
}

/* Méthode */
.method-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.method-step{background:var(--paper);padding:32px 26px;}
.method-step .num{font-family:"IBM Plex Mono",monospace;color:var(--cuivre);font-size:13px;display:block;margin-bottom:18px;}
.method-step h3{font-size:17px;margin-bottom:10px;}
.method-step p{font-size:14px;color:var(--text-soft);margin:0;}

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.services-grid .service-card{grid-column:span 2;}
.services-grid .service-card:nth-last-child(-n+2){grid-column:span 3;}
.service-card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.service-card .photo{aspect-ratio:16/10;overflow:hidden;background:var(--paper-raised);}
.service-card .photo img{width:100%;height:100%;object-fit:cover;}
.service-card .body{padding:28px 30px 32px;}
.service-card h3{font-size:19px;margin-bottom:12px;}
.service-card p{color:var(--text-soft);font-size:14.5px;margin:0;}
.service-card .kicker{display:block;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--ardoise);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;}

/* Bande image plein cadre, simple séparateur entre deux sections */
.image-break{
height:50vh;
min-height:340px;
background-color:var(--ink);
background-image:url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/bureau-open-space.webp");
background-size:cover;background-position:center;
padding:0;margin:0;
}

/* Variante de la bande image avec un texte en surimpression (overlay sombre) */
.image-break--text{
height:auto;
min-height:340px;
display:flex;
align-items:center;
position:relative;
padding:56px 0;
background-image:url("https://demenagements-bureaux.fr/wp-content/uploads/2026/09/tour-eiffel-paris.webp");
}
.image-break--text::before{
content:"";
position:absolute;inset:0;
background:linear-gradient(rgba(2,12,26,.86),rgba(2,12,26,.86));
}
.image-break-copy{
position:relative;
z-index:1;
width:100%;
max-width:760px;
margin:0 auto;
padding:0 28px;
color:var(--white);
font-size:17px;
line-height:1.7;
}
.image-break-copy p{margin:0 0 14px;}
.image-break-copy p:last-child{margin-bottom:0;}
.image-break-copy a{color:var(--cuivre-clair);text-decoration:underline;text-underline-offset:2px;}
.image-break-copy a:hover{color:var(--white);}

/* Layout générique 2 colonnes (texte + visuel), réutilisable sur tout le site */
.split-section .container{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}
.split-copy .section-head{margin-bottom:24px;}
.split-visual{width:100%;}
.split-visual .zone-map-visual{max-width:420px;}

/* Variante FAQ : le visuel prend toute la hauteur de la section, en format portrait */
.faq-split .container{align-items:stretch;}
.faq-visual-media{height:100%;min-height:420px;border-radius:var(--radius);overflow:hidden;background:var(--paper-raised);}
.faq-visual-media img{width:100%;height:100%;object-fit:cover;display:block;}

/* Zones : carte réelle de l'Île-de-France (tracé issu de données publiques,
projection simplifiée), départements desservis vs grande couronne */
.zone-map{display:flex;flex-direction:column;align-items:center;gap:14px;margin:0 0 44px;border-radius:var(--radius);padding:32px 24px;}
.zone-map-visual{width:100%;max-width:600px;margin:0 auto;}
.zone-map-svg{width:100%;height:auto;display:block;overflow:visible;}
.dept-shape{stroke:var(--paper);stroke-width:2px;cursor:pointer;transition:fill .15s ease;}
.dept-outer{fill:#c7cbd4;}
.dept-served{fill:var(--horizon);}
.dept-shape:hover,.dept-shape:focus-visible{fill:var(--cuivre);}
.dept-labels{pointer-events:none;}
.dept-code-label{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:13px;}
.label-served{fill:var(--white);}
.label-outer{fill:var(--text-soft);}
.zone-map-legend{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;}
.legend-item{display:inline-flex;align-items:center;gap:7px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:var(--text-soft);}
.legend-swatch{width:10px;height:10px;border-radius:2px;flex:none;}
.legend-served{background:var(--horizon);}
.legend-outer{background:#c7cbd4;}
.zone-map-caption{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--ardoise);text-align:center;margin:0;min-height:18px;}
@media (max-width:620px){.zone-map-visual{max-width:360px;}}

.zone-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:8px;}
.zone-card{border:1px solid var(--line);border-radius:var(--radius);padding:20px 18px;background:var(--white);}
.zone-card .dept{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--cuivre);display:block;margin-bottom:8px;}
.zone-card h3{font-size:16px;margin-bottom:8px;}
.zone-card p{font-size:13px;color:var(--text-soft);margin:0;}
.zone-note{margin-top:20px;font-size:14px;color:var(--text-soft);}

/* Garanties */
.guarantee-list{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:8px;}
.guarantee{border-top:2px solid var(--cuivre);padding-top:16px;}
.guarantee h3{font-size:15.5px;margin-bottom:8px;}
.guarantee p{font-size:13.5px;color:var(--text-soft);margin:0;}

/* Contact / devis détaillé */
.contact-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start;}
.contact-copy h2{font-size:clamp(24px,3vw,32px);}
.contact-copy p{color:var(--text-soft);margin-top:16px;font-size:16px;}
.contact-facts{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;}
.contact-facts li{display:flex;gap:10px;font-size:14px;color:var(--text-soft);}
.contact-facts li b{color:var(--text);}
.contact-form{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:32px;}
.contact-form h3{font-size:12px;text-transform:uppercase;letter-spacing:.1em;font-family:"IBM Plex Mono",monospace;color:var(--ardoise);margin-bottom:18px;font-weight:500;}
.field-group{border:1px solid var(--line);border-radius:var(--radius);padding:16px 16px 4px;margin-bottom:18px;}
.field-group > span{display:block;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ardoise);font-family:"IBM Plex Mono",monospace;margin-bottom:12px;}

/* ---------- Formulaires Contact Form 7 (hero-form + contact-form) ---------- */
.hero-form .wpcf7-form p,
.hero-form .wpcf7-form > div,
.contact-form .wpcf7-form p,
.contact-form .wpcf7-form > div{
margin:0 0 14px;
}
.hero-form .wpcf7-form p:last-child,
.hero-form .wpcf7-form > div:last-child,
.contact-form .wpcf7-form p:last-child,
.contact-form .wpcf7-form > div:last-child{
margin-bottom:0;
}
.hero-form .wpcf7-form p.titreform,
.contact-form .wpcf7-form p.titreform{
font-family:"IBM Plex Mono",monospace;font-size:11.5px;font-weight:500;
text-transform:uppercase;letter-spacing:.06em;color:var(--ardoise);
margin-top:18px;margin-bottom:10px;
}
.hero-form .wpcf7-form p.titreform:first-child,
.contact-form .wpcf7-form p.titreform:first-child{margin-top:0;}
.hero-form .wpcf7-form label,
.contact-form .wpcf7-form label{
display:block;font-size:12.5px;font-weight:600;color:var(--text);margin-bottom:6px;
}
.hero-form .wpcf7-form-control-wrap,
.contact-form .wpcf7-form-control-wrap{display:block;}
.hero-form .wpcf7-form-control,
.contact-form .wpcf7-form-control{
width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:var(--radius);
font-family:"Public Sans",sans-serif;font-size:14.5px;background:var(--paper);color:var(--text);
}
.hero-form .wpcf7-form-control:focus,
.contact-form .wpcf7-form-control:focus{outline:2px solid var(--horizon);outline-offset:1px;}
.hero-form textarea.wpcf7-form-control,
.contact-form textarea.wpcf7-form-control{min-height:110px;resize:vertical;}
.hero-form select.wpcf7-form-control,
.contact-form select.wpcf7-form-control{background:var(--paper);}
.hero-form .wpcf7-form-control.wpcf7-submit,
.contact-form .wpcf7-form-control.wpcf7-submit{
width:100%;background:var(--cuivre);color:var(--white);border:1px solid transparent;
font-family:"Public Sans",sans-serif;font-weight:600;font-size:15px;
padding:13px 24px;border-radius:var(--radius);cursor:pointer;
transition:background-color .15s ease;
}
.hero-form .wpcf7-form-control.wpcf7-submit:hover,
.contact-form .wpcf7-form-control.wpcf7-submit:hover{background:var(--cuivre-dark);}
.hero-form .wpcf7-form-control.wpcf7-acceptance,
.contact-form .wpcf7-form-control.wpcf7-acceptance{width:auto;}
.hero-form .wpcf7-list-item,
.contact-form .wpcf7-list-item{margin:0;}
.hero-form .wpcf7-not-valid-tip,
.contact-form .wpcf7-not-valid-tip{display:block;color:#c0392b;font-size:12px;margin-top:5px;}
/* La boîte de réponse CF7 est vide tant qu'il n'y a pas eu de tentative
d'envoi : on la garde masquée jusque-là pour éviter un rectangle vide. */
.hero-form .wpcf7-response-output,
.contact-form .wpcf7-response-output{
display:none;
font-size:13px;margin:12px 0 0 !important;padding:10px 12px;border-radius:var(--radius);border:1px solid var(--line);
}
/* Les erreurs de champ (obligatoire, format, etc.) sont déjà indiquées
juste sous chaque champ via .wpcf7-not-valid-tip : on n'affiche donc pas
en plus le pavé récapitulatif en haut du formulaire pour .invalid /
.unaccepted. On garde le pavé pour les autres retours (envoi réussi,
spam, etc.) qui n'ont pas d'indicateur par champ. */
.hero-form .wpcf7-form.sent .wpcf7-response-output,
.hero-form .wpcf7-form.spam .wpcf7-response-output,
.hero-form .wpcf7-form.aborted .wpcf7-response-output,
.hero-form .wpcf7-form.payment-required .wpcf7-response-output,
.contact-form .wpcf7-form.sent .wpcf7-response-output,
.contact-form .wpcf7-form.spam .wpcf7-response-output,
.contact-form .wpcf7-form.aborted .wpcf7-response-output,
.contact-form .wpcf7-form.payment-required .wpcf7-response-output{
display:block;
}
.hero-form .wpcf7-form.sent .wpcf7-response-output,
.contact-form .wpcf7-form.sent .wpcf7-response-output{border-color:#2e7d46;color:#2e7d46;background:#eef8f1;}
.hero-form .wpcf7-form.spam .wpcf7-response-output,
.hero-form .wpcf7-form.aborted .wpcf7-response-output,
.hero-form .wpcf7-form.payment-required .wpcf7-response-output,
.contact-form .wpcf7-form.spam .wpcf7-response-output,
.contact-form .wpcf7-form.aborted .wpcf7-response-output,
.contact-form .wpcf7-form.payment-required .wpcf7-response-output{border-color:#c0392b;color:#c0392b;background:#fbeceb;}
/* CF7 duplique aussi son récapitulatif d'erreurs dans une zone destinée
aux lecteurs d'écran (.screen-reader-response) : ce thème ne définissait
pas le masquage visuel standard de cette classe, donc le texte et la
liste à puces ("Veuillez renseigner ce champ." répété) apparaissaient
en clair tout en haut du formulaire. On la masque visuellement, comme
le fait WordPress par défaut, sans la retirer pour les lecteurs d'écran. */
.screen-reader-response{
position:absolute !important;width:1px !important;height:1px !important;
padding:0 !important;margin:-1px !important;overflow:hidden !important;
clip:rect(1px,1px,1px,1px) !important;white-space:nowrap !important;border:0 !important;
}
.hero-form .wpcf7-spinner,
.contact-form .wpcf7-spinner{margin:0 0 0 8px;}
/* Le paragraphe "Candidater" du formulaire de rappel a un texte blanc codé en dur
côté Contact Form 7 : on le rend lisible sur le fond blanc du bloc hero-form. */
.hero-form .wpcf7-form p[style*="fff"]{color:var(--text-soft) !important;}
.hero-form .wpcf7-form p[style*="fff"] a{color:var(--cuivre) !important;}
/* Conteneur de champs cachés (anti-spam / hCaptcha) : invisible par nature,
mais un <fieldset> sans reset affiche une bordure par défaut du navigateur. */
.hero-form .hidden-fields-container,
.contact-form .hidden-fields-container{
display:none;
}

/* Champs côte à côte (ex. adresse + code postal), assemblés en JS
(voir main.js, fonction pairFields) via une div.field-pair. */
.hero-form .field-pair,
.contact-form .field-pair{
display:flex;gap:12px;align-items:flex-start;margin:0 0 14px;
}
.hero-form .field-pair-main,
.hero-form .field-pair-side,
.contact-form .field-pair-main,
.contact-form .field-pair-side{
margin:0 !important;flex:1 1 auto;min-width:0;
}
.hero-form .field-pair-side,
.contact-form .field-pair-side{
flex:0 0 var(--pair-side-width, 30%);
}

/* Formulaires en 2 étapes (voir main.js, fonction wireStepForm) */
.hero-form .form-step-indicator,
.contact-form .form-step-indicator{
font-family:"IBM Plex Mono",monospace;font-size:11.5px;font-weight:500;
text-transform:uppercase;letter-spacing:.06em;color:var(--ardoise);
margin:0 0 14px;
}
.hero-form .form-step-2,
.contact-form .form-step-2{display:none;}
/* is-step-2 est posée sur .hero-form/.contact-form (le conteneur du thème),
pas sur .wpcf7-form : ce dernier voit ses classes régulièrement réinitialisées
par le script de Contact Form 7 lui-même à chaque tentative d'envoi. */
.hero-form.is-step-2 .form-step-1,
.contact-form.is-step-2 .form-step-1{display:none;}
.hero-form.is-step-2 .form-step-2,
.contact-form.is-step-2 .form-step-2{display:block;}
.hero-form .btn-outline,
.contact-form .btn-outline{
background:transparent;color:var(--cuivre);border:1px solid var(--line);
}
.hero-form .btn-outline:hover,
.contact-form .btn-outline:hover{background:var(--paper-raised);}
.hero-form .form-step-next,
.hero-form .form-step-prev,
.contact-form .form-step-next,
.contact-form .form-step-prev{width:100%;margin-bottom:14px;}

/* Avis clients (widget Trustindex, avis Google) */
.reviews-widget{text-align:center;}

/* FAQ */
.faq-list{max-width:760px;}
.faq-item{border-bottom:1px solid var(--line);padding:22px 0;}
.faq-item summary{
cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;
font-family:"Archivo",sans-serif;font-weight:700;font-size:16.5px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary .plus{width:18px;height:18px;position:relative;flex:none;}
.faq-item summary .plus::before,.faq-item summary .plus::after{
content:"";position:absolute;background:var(--cuivre);
}
.faq-item summary .plus::before{top:8px;left:0;width:18px;height:2px;}
.faq-item summary .plus::after{top:0;left:8px;width:2px;height:18px;transition:transform .15s ease;}
.faq-item[open] summary .plus::after{transform:rotate(90deg);}
.faq-item p{color:var(--text-soft);font-size:14.5px;margin:14px 0 0;max-width:66ch;}

/* Footer */
.site-footer{background:var(--ink);color:#c9cedb;padding:64px 0 28px;}
.footer-top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.12);}
.footer-brand .brand{color:var(--white);}
.footer-brand p{font-size:13.5px;color:#9aa1b3;margin-top:14px;max-width:34ch;}
.footer-col h4{font-family:"IBM Plex Mono",monospace;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#8b93a8;margin-bottom:16px;font-weight:500;}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.footer-col ul span, .footer-col ul a{font-size:13.5px;color:#c9cedb;}
.footer-col address{font-style:normal;font-size:13.5px;color:#c9cedb;line-height:1.7;}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:24px;font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:#7b8296;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
.main-nav{
display:none;position:fixed;inset:65px 0 0 0;background:var(--paper);
flex-direction:column;align-items:stretch;padding:12px 20px 32px;overflow-y:auto;
gap:0;
}
.main-nav.is-open{display:flex;}
.nav-item{border-bottom:1px solid var(--line);}
.nav-link{padding:16px 4px;justify-content:space-between;}
.nav-dropdown{
position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
border:none;padding:0 0 12px 12px;display:none;
}
.nav-item.has-children.is-expanded .nav-dropdown{display:block;}
.nav-cta{display:none;}
.nav-toggle{display:flex;}
.hero-inner{grid-template-columns:1fr;}
.dept-hero .hero-inner{grid-template-columns:1fr;}
.dept-hero .hero-mini-map{max-width:200px;margin:24px auto 0;}
.method-grid,.services-grid{grid-template-columns:repeat(2,1fr);}
.services-grid .service-card{grid-column:span 1;}
.zone-grid,.guarantee-list{grid-template-columns:repeat(2,1fr);}
.contact-wrap{grid-template-columns:1fr;}
.footer-top{grid-template-columns:1fr 1fr;}
.trust-bar .container{grid-template-columns:repeat(2,1fr);}
.trust-item:nth-child(3){border-left:none;}
}
@media (max-width:620px){
.method-grid,.services-grid,.zone-grid,.guarantee-list{grid-template-columns:1fr;}
.services-grid .service-card{grid-column:span 1;}
.field-row{grid-template-columns:1fr;}
.footer-top{grid-template-columns:1fr;}
section{padding:64px 0;}
.hero-inner{padding-top:80px;padding-bottom:40px;}
.hero-form{width:100%;}
.trust-bar .container{grid-template-columns:1fr;}
.trust-item{border-left:none !important;border-top:1px solid var(--line);padding:20px 0;}
.trust-item:first-child{border-top:none;}

/* Carte des zones : pas besoin du cadre en tirets sur mobile, le container suffit */
.zone-map{border:none;padding:0;margin-bottom:32px;}

/* Boutons pleine largeur et plus confortables au toucher sur mobile */
.btn{width:100%;padding:16px 22px;font-size:15.5px;}
.hero-cta-row{flex-direction:column;align-items:stretch;gap:12px;}

/* Repères "Parlons de votre transfert" : pastilles au lieu d'une liste
en flex-row (qui provoquait un décalage disgracieux au retour à la ligne) */
.contact-facts{gap:10px;}
.contact-facts li{
display:block;
background:var(--white);
border-radius:10px;
padding:12px 14px;
}
.contact-facts li b{display:block;font-size:13px;margin-bottom:3px;}

/* Champs côte à côte : on repasse en pile sur mobile, plus confortable au clavier */
.hero-form .field-pair,
.contact-form .field-pair{flex-direction:column;gap:0;}
.hero-form .field-pair-main,
.hero-form .field-pair-side,
.contact-form .field-pair-main,
.contact-form .field-pair-side{
flex:1 1 auto;width:100%;margin:0 0 14px !important;
}
}

/* ================= PAGE SERVICE : hero sans formulaire ================= */
.hero-inner--single{grid-template-columns:1fr;}
.hero-single-copy{max-width:640px;justify-self:start;margin-right:auto;}

/* Section d'intro sans grille en dessous : le section-head est alors
le dernier élément visible, sa marge basse habituelle double l'espace
avant la section suivante. */
.section-head--flush{margin-bottom:0;}

/* ================= PAGE SERVICE : une section détaillée par sous-service ================= */
.service-detail-list{display:flex;flex-direction:column;gap:64px;margin-top:8px;}
.service-detail{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
.service-detail:nth-child(even) .service-detail-media{order:2;}
.service-detail-media{aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius);background:var(--paper-raised);}
.service-detail-media img{width:100%;height:100%;object-fit:cover;display:block;}
.service-detail-body .kicker{display:block;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--ardoise);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;}
.service-detail-body h3{font-size:22px;margin-bottom:14px;}
.service-detail-body p{color:var(--text-soft);font-size:15.5px;line-height:1.65;margin:0 0 14px;}
.service-detail-body ul{margin:0 0 20px;padding-left:20px;color:var(--text-soft);font-size:14.5px;line-height:1.7;}

/* ================= PAGE ZONES DESSERVIES : carte cliquable + fiche département ================= */
/* Contrairement à .section-head par défaut (aligné à gauche), cette variante
centre le bloc entier (pas seulement le texte) dans son conteneur. */
.section-head-center{margin-left:auto;margin-right:auto;text-align:center;}
.dept-explorer-hint{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--ardoise);text-align:center;margin:0 0 24px;}
.dept-explorer-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin-top:8px;}
.dept-shape.is-selected{fill:var(--cuivre);}
.dept-card{
background:var(--white);
border:1px solid var(--line);
border-radius:var(--radius);
box-shadow:0 24px 48px -32px rgba(0,23,41,.25);
padding:32px;
margin-top:12px;
}
.dept-card-item{display:none;}
.dept-card-item.is-active{display:flex;flex-direction:column;gap:24px;}

/* ================= PAGE MÉTHODE : frise verticale animée au scroll ================= */
.timeline{position:relative;margin-top:16px;}
.timeline::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--line);transform:translateX(-50%);}
.timeline-step{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:120px;align-items:center;padding:56px 0;}
.timeline-step:first-child{padding-top:0;}
.timeline-step:nth-child(even) .timeline-media{order:2;}
.timeline-step:nth-child(even) .timeline-body{order:1;}
.timeline-marker{
position:absolute;top:56px;left:50%;transform:translateX(-50%);
width:52px;height:52px;border-radius:50%;
background:var(--cuivre);color:var(--white);
display:flex;align-items:center;justify-content:center;
font-size:15px;font-weight:600;
box-shadow:0 0 0 6px var(--paper);
z-index:2;
}
.timeline-media{aspect-ratio:16/10;overflow:hidden;border-radius:var(--radius);background:var(--paper-raised);}
.timeline-media img{width:100%;height:100%;object-fit:cover;display:block;}
.timeline-body .kicker{display:block;font-family:"IBM Plex Mono",monospace;font-size:11px;color:var(--ardoise);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;}
.timeline-body h3{font-size:22px;margin-bottom:14px;}
.timeline-body p{color:var(--text-soft);font-size:15.5px;line-height:1.65;margin:0 0 14px;}
.timeline-body ul{margin:0;padding-left:20px;color:var(--text-soft);font-size:14.5px;line-height:1.7;}
/* .will-animate n'est posé qu'en JS (voir main.js) : sans JS ou si
IntersectionObserver est indisponible, les étapes restent visibles direct. */
.timeline-step.will-animate{opacity:0;transform:translateY(48px);transition:opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1);}
.timeline-step.will-animate.is-visible{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion:reduce){
.timeline-step.will-animate{transition:none;opacity:1;transform:none;}
}

/* ================= PAGE SERVICE : zones desservies / pages sœurs ================= */
.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
a.zone-card{display:block;text-decoration:none;color:inherit;transition:border-color .15s;}
a.zone-card:hover{border-color:var(--horizon);}
.zone-card.is-soon{opacity:.6;}
.zone-card .tag-soon{display:inline-block;margin-top:8px;font-family:"IBM Plex Mono",monospace;font-size:10.5px;color:var(--ardoise);text-transform:uppercase;letter-spacing:.05em;background:var(--paper-raised);padding:3px 8px;border-radius:999px;}

/* ================= PAGE SERVICE ENFANT : reperes chiffres ================= */
.stat-strip{background:var(--ink);padding:0;}
.stat-strip .container{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(255,255,255,.12);}
.stat-item{background:var(--ink);padding:32px 22px;text-align:center;}
.stat-number{display:block;font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(28px,4vw,38px);color:var(--white);}
.stat-label{display:block;margin-top:8px;font-family:"IBM Plex Mono",monospace;font-size:11px;color:#b7bccb;text-transform:uppercase;letter-spacing:.06em;}

/* ================= PAGE SERVICE ENFANT : inclus / en option ================= */
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:8px;}
.compare-card{border:1px solid var(--line);border-radius:var(--radius);padding:32px;background:var(--white);}
.compare-card.is-highlight{border-color:var(--cuivre);box-shadow:0 24px 48px -32px rgba(0,23,41,.25);}
.compare-card h3{font-size:18px;margin-bottom:18px;}
.compare-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.compare-card li{display:flex;gap:10px;font-size:14.5px;color:var(--text-soft);align-items:flex-start;line-height:1.5;}
.compare-card li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--cuivre);margin-top:6px;}
.compare-card.is-muted li::before{background:var(--ardoise);}
/* Liens vers d'autres pages service au sein d'une liste : la regle globale
p a ne couvre pas les li, on stylise donc ce cas explicitement. */
.compare-card li a{color:var(--cuivre);text-decoration:underline;text-underline-offset:2px;}
.compare-card li a:hover{color:var(--cuivre-dark);}

/* ================= PAGE SERVICE ENFANT : a qui s'adresse le service ================= */
.usecase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:8px;}
.usecase-card{background:var(--paper-raised);border-radius:var(--radius);padding:28px 24px;}
.usecase-card .num{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--cuivre);display:block;margin-bottom:14px;}
.usecase-card h3{font-size:17px;margin-bottom:10px;}
.usecase-card p{font-size:14px;color:var(--text-soft);margin:0;}

/* ================= PAGE SERVICE ENFANT : banniere CTA finale ================= */
.cta-banner{max-width:640px;margin:0 auto;text-align:center;}
.cta-banner p{color:#b7bccb;margin:16px 0 28px;font-size:16px;}

@media (max-width:980px){
.service-detail{grid-template-columns:1fr;gap:24px;}
.service-detail:nth-child(even) .service-detail-media{order:0;}
.related-grid{grid-template-columns:repeat(2,1fr);}
.split-section .container{grid-template-columns:1fr;gap:32px;}
.dept-explorer-grid{grid-template-columns:1fr;}
.dept-card{padding:20px;}
.timeline::before{left:22px;}
.timeline-step{grid-template-columns:1fr;gap:20px;padding-left:60px;padding-top:40px;padding-bottom:40px;}
.timeline-step:nth-child(even) .timeline-media{order:0;}
.timeline-step:nth-child(even) .timeline-body{order:0;}
.timeline-marker{left:22px;top:40px;width:40px;height:40px;font-size:13px;}
.stat-strip .container{grid-template-columns:repeat(2,1fr);}
.compare-grid{grid-template-columns:1fr;}
.usecase-grid{grid-template-columns:1fr;}
}
@media (max-width:620px){
.related-grid{grid-template-columns:1fr;}
.service-detail-list{gap:40px;}
.image-break-copy{font-size:15.5px;}
}

/* Liens de texte au sein d'un paragraphe (ex. renvoi vers une autre page depuis
un paragraphe de contenu) : la règle globale a{color:inherit;text-decoration:none}
les rendrait invisibles, donc on les distingue explicitement du texte courant. */
p a{color:var(--cuivre);text-decoration:underline;text-underline-offset:2px;}
p a:hover{color:var(--cuivre-dark);}

/* ================= PAGES LÉGALES (mentions légales / confidentialité / cookies) ================= */
.legal-content{max-width:760px;margin:0 auto;}
.legal-content .legal-updated{display:block;font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--ardoise);margin:0 0 32px;}
.legal-content h2{font-size:22px;margin:40px 0 14px;}
.legal-content h2:first-of-type{margin-top:0;}
.legal-content h3{font-size:16.5px;margin:24px 0 10px;}
.legal-content p{color:var(--text-soft);font-size:15px;line-height:1.7;margin:0 0 14px;}
.legal-content ul{margin:0 0 14px;padding-left:20px;color:var(--text-soft);font-size:15px;line-height:1.7;}
.legal-content li{margin-bottom:6px;}
.legal-content strong{color:var(--text);}
.legal-content table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:13.5px;}
.legal-content th,.legal-content td{text-align:left;padding:10px 12px;border:1px solid var(--line);color:var(--text-soft);vertical-align:top;}
.legal-content th{color:var(--text);background:var(--paper-raised);font-family:"IBM Plex Mono",monospace;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;}

/* ================= BANDEAU DE CONSENTEMENT COOKIES (voir main.js) ================= */
.cookie-banner{
position:fixed;left:0;right:0;bottom:0;z-index:200;
background:var(--ink);color:#dfe2ea;
padding:20px 0;
box-shadow:0 -12px 32px -16px rgba(0,0,0,.4);
transform:translateY(100%);
transition:transform .3s ease;
}
.cookie-banner.is-visible{transform:translateY(0);}
.cookie-banner .container{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.cookie-banner-text{flex:1 1 420px;font-size:13.5px;line-height:1.6;margin:0;}
.cookie-banner-text a{color:var(--cuivre-clair);text-decoration:underline;text-underline-offset:2px;}
.cookie-banner-actions{display:flex;gap:10px;flex-wrap:wrap;flex:0 0 auto;}
.cookie-banner-actions .btn{white-space:nowrap;}
@media (max-width:620px){
.cookie-banner .container{flex-direction:column;align-items:stretch;}
.cookie-banner-actions{flex-direction:column;}
.cookie-banner-actions .btn{width:100%;}
}

/* Avis Google (widget Trustindex) masqués par défaut si les cookies tiers sont
refusés : un bouton de remplacement, ajouté par main.js, permet de les afficher
ponctuellement sans changer le choix global de l'utilisateur. */
body.cookies-refused .reviews-widget{display:none;}
.reviews-consent-placeholder{display:none;max-width:480px;margin:0 auto;text-align:center;border:1px solid var(--line);border-radius:var(--radius);padding:28px 24px;background:var(--paper-raised);}
body.cookies-refused .reviews-consent-placeholder{display:block;}
.reviews-consent-placeholder p{color:var(--text-soft);font-size:14px;margin:0 0 16px;}