/*
Theme Name: B&I Socle
Theme URI: https://bourse-et-investissement.fr
Author: Gautier
Author URI: https://bourse-et-investissement.fr
Description: Theme socle de bourse-et-investissement.fr. Sert le contenu des pages sans aucune surcouche de mise en page, garantit un seul H1 par page, et porte la palette et la typographie v3 une fois pour toutes.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bei-socle
*/

/* ==========================================================================
   1. Jetons de design v3 — source de verite
   ========================================================================== */
:root{
  /* Textes / fonds sombres */
  --ink:#0A2231; --ink-2:#153749; --ink-body:#243A48;
  --gray:#243748; --muted:#5A6A75;
  /* Fonds clairs */
  --paper:#EAF2F5; --paper-2:#FFFFFF; --cream:#DFEDE6;
  /* Teal — ancre de marque, jamais modifie */
  --blue:#0089AF; --blue-dark:#005672; --blue-pale:#CFE8EE; --blue-soft:#9FD1DD;
  /* Verts — accents harmoniques */
  --green:#3E9174; --green-dark:#2E6952; --green-pale:#CFE7DD; --green-soft:#AFD4C2;
  /* Sauge — numeros DM Serif italic uniquement */
  --sage:#5B9B7E; --sage-dark:#3F7960;
  /* Accent chaud — warnings, badges premium, hub-links */
  --gold:#B8925A;
  /* Lignes */
  --line:#C5D5DB;
  /* Radius */
  --r-sm:12px; --r-md:20px; --r-lg:32px; --r-pill:999px;
}

/* ==========================================================================
   2. Socle v3 — typographie, composants editoriaux, formulaires, FAQ
   Extrait du corpus v3 (page pilier PER), cascade et media queries intactes.
   ========================================================================== */

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;font-size:16px;line-height:1.65;color:#243748;background:#EAF2F5;-webkit-font-smoothing:antialiased}
::selection{background:#0089AF;color:#fff}

h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;color:var(--ink);margin:0;letter-spacing:-0.01em;line-height:1.15}
h1{font-size:clamp(34px,5vw,52px);font-weight:600}
h2{font-size:clamp(26px,3.4vw,34px);font-weight:600;margin:56px 0 20px}
h3{font-size:22px;font-weight:500;margin:32px 0 14px}
h4{font-size:18px;font-weight:500;margin:24px 0 10px}
h1 em,h2 em,h3 em{font-style:italic;color:var(--blue-dark);font-weight:400}
p{margin:0 0 18px}
a{color:var(--blue-dark);text-decoration:none;border-bottom:1px solid var(--blue-soft);transition:all .2s}
a:hover{color:var(--blue);border-bottom-color:var(--blue)}
strong{font-weight:600;color:var(--ink)}
ul,ol{padding-left:24px;margin:0 0 22px}
li{margin-bottom:8px}
.wrap{max-width:920px;margin:0 auto;padding:0 24px}
@media(max-width:640px){.wrap{padding:0 18px}}
.breadcrumb{font-size:13px;color:var(--muted);padding:28px 0 20px}
.breadcrumb a{color:var(--muted);border:none}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb span:not(:last-child)::after{content:" › ";color:var(--line);padding:0 6px}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;font-size:13px;color:var(--muted);margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--line)}
.author-chip{display:flex;align-items:center;gap:10px;font-weight:500;color:var(--gray)}
.author-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1.5px solid var(--paper-2)}
.updated-chip{background:var(--green-pale);color:var(--green-dark);padding:4px 12px;border-radius:var(--r-pill);font-weight:600;letter-spacing:0.04em;margin-left:auto;font-size:11px;text-transform:uppercase}
.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--green-dark);background:var(--green-pale);padding:6px 14px;border-radius:var(--r-pill);margin-bottom:20px}
.hero-eyebrow::before{content:"";width:6px;height:6px;background:var(--green);border-radius:50%}
.lead{font-family:'Fraunces',serif;font-style:italic;font-size:clamp(18px,2vw,22px);line-height:1.55;color:var(--gray);margin:24px 0 32px;max-width:720px}
.lead strong{font-style:normal;color:var(--ink);font-weight:500}
.hero-figure{background:linear-gradient(135deg,var(--blue-pale) 0%,var(--green-pale) 100%);border-radius:var(--r-lg);padding:36px 32px;margin:36px 0;display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;position:relative;overflow:hidden}
.hero-figure::before{content:"";position:absolute;top:-60px;right:-60px;width:220px;height:220px;background:radial-gradient(circle,rgba(0,137,175,0.1),transparent);border-radius:50%;pointer-events:none}
@media(max-width:640px){.hero-figure{grid-template-columns:1fr;padding:28px 22px;gap:16px}}
.hero-figure-num{font-family:'DM Serif Display',serif;font-style:italic;font-size:clamp(56px,8vw,96px);color:var(--blue-dark);line-height:0.85;letter-spacing:-0.03em}
.hero-figure-context h3{margin:0 0 8px;font-size:20px;color:var(--ink)}
.hero-figure-context p{margin:0;font-size:14px;color:var(--gray);line-height:1.5}
.toc{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);padding:28px 32px;margin:32px 0 44px}
.toc-title{font-family:'Fraunces',serif;font-size:14px;font-weight:600;color:var(--ink);text-transform:uppercase;letter-spacing:0.14em;margin:0 0 16px;display:flex;align-items:center;gap:10px}
.toc-title::before{content:"";width:24px;height:1px;background:var(--blue)}
.toc ol{list-style:none;padding:0;margin:0;counter-reset:toc}
.toc li{counter-increment:toc;margin:0 0 8px;padding:0}
.toc li::before{content:counter(toc,decimal-leading-zero) ".";font-family:'DM Serif Display',serif;font-style:italic;color:var(--sage);font-size:15px;margin-right:12px;font-weight:400}
.toc a{color:var(--gray);border:none;font-size:15px;transition:color .2s}
.toc a:hover{color:var(--blue)}
.callout{padding:24px 28px;border-radius:var(--r-md);margin:28px 0;font-size:15px;line-height:1.65}
.callout .label{display:inline-block;font-size:11px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;margin-bottom:10px}
.callout p:last-child{margin-bottom:0}
.callout-key{background:var(--blue-pale);border-left:4px solid var(--blue)}
.callout-key .label{color:var(--blue-dark)}
.callout-example{background:var(--cream);border-left:4px solid var(--sage)}
.callout-example .label{color:var(--sage-dark)}
.callout-warning{background:#FCF3E5;border-left:4px solid var(--gold)}
.callout-warning .label{color:var(--gold)}
.step-block{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:36px 34px;margin:24px 0}
@media(max-width:640px){.step-block{padding:24px 20px}}
.step-header{display:flex;align-items:baseline;gap:20px;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.step-num{font-family:'DM Serif Display',serif;font-style:italic;font-size:44px;color:var(--sage);line-height:0.85;letter-spacing:-0.03em;flex-shrink:0}
.step-header h2{margin:0;font-size:26px}
.table-wrap{overflow-x:auto;margin:26px 0;border-radius:var(--r-sm);border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;font-size:14px;background:var(--paper-2)}
th{background:var(--ink);color:var(--paper-2);font-weight:600;text-align:left;padding:14px 16px;font-size:12px;text-transform:uppercase;letter-spacing:0.06em}
td{padding:14px 16px;border-bottom:1px solid var(--line);color:var(--gray)}
tr:last-child td{border-bottom:none}
tr:nth-child(even) td{background:var(--paper)}
td.highlight{color:var(--blue-dark);font-weight:600}
td.figure{font-family:'Fraunces',serif;font-size:16px;font-weight:500;color:var(--ink)}
td.yes{color:var(--green-dark);font-weight:600}
td.no{color:var(--gold);font-weight:600}
.formula-box{background:var(--ink);color:var(--paper);padding:32px 36px;border-radius:var(--r-md);margin:24px 0;text-align:center}
.formula-box .formula{font-family:'DM Serif Display',serif;font-style:italic;font-size:clamp(20px,2.4vw,26px);line-height:1.4;margin:0 0 12px;letter-spacing:0.01em}
.formula-box .formula strong{color:var(--blue-soft);font-weight:400;font-style:italic}
.formula-box .formula-legend{font-size:13px;opacity:0.75;margin:0}
.compare-2col{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:26px 0}
@media(max-width:640px){.compare-2col{grid-template-columns:1fr}}
.compare-col{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);padding:26px 24px;position:relative}
.compare-col.highlight{border-color:var(--blue);border-width:2px}
.compare-col-badge{position:absolute;top:-12px;left:24px;background:var(--blue);color:var(--paper-2);font-size:10px;font-weight:600;letter-spacing:0.14em;padding:4px 12px;border-radius:var(--r-pill);text-transform:uppercase}
.compare-col h3{margin:0 0 8px;font-size:20px}
.compare-col .subtitle{font-size:13px;color:var(--muted);margin-bottom:16px;font-style:italic;font-family:'Fraunces',serif}
.compare-col ul{list-style:none;padding:0;margin:0}
.compare-col li{padding:8px 0 8px 24px;font-size:14px;color:var(--gray);border-bottom:1px solid var(--line);position:relative}
.compare-col li:last-child{border-bottom:none}
.compare-col li.pos::before{content:"✓";color:var(--green-dark);font-weight:700;position:absolute;left:0}
.compare-col li.neg::before{content:"×";color:var(--gold);font-weight:700;position:absolute;left:0;font-size:18px;top:6px}
.types-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:26px 0}
@media(max-width:640px){.types-grid{grid-template-columns:1fr}}
.type-card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);padding:24px 22px;transition:all .25s}
.type-card:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,137,175,0.08)}
.type-tag{display:inline-block;background:var(--blue-pale);color:var(--blue-dark);font-size:10px;font-weight:600;padding:3px 10px;border-radius:var(--r-pill);letter-spacing:0.06em;text-transform:uppercase;margin-bottom:10px}
.type-tag.green{background:var(--green-pale);color:var(--green-dark)}
.type-tag.gold{background:#F5E8D0;color:var(--gold)}
.type-yield{font-family:'DM Serif Display',serif;font-style:italic;font-size:26px;color:var(--blue-dark);line-height:1;margin:8px 0;letter-spacing:-0.02em}
.type-card h3{margin:0 0 4px;font-size:17px}
.type-card p{margin:0 0 6px;font-size:13px;color:var(--gray);line-height:1.55}
.type-card p.detail{color:var(--muted);font-size:12px;margin-top:8px;font-style:italic;font-family:'Fraunces',serif}
.brokers-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:26px 0}
@media(max-width:640px){.brokers-grid{grid-template-columns:1fr}}
.broker-card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);padding:24px 22px;transition:all .25s}
.broker-card:hover{border-color:var(--blue);transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,137,175,0.08)}
.broker-name{font-family:'Fraunces',serif;font-size:20px;font-weight:500;color:var(--ink);margin:0 0 4px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.broker-tag{display:inline-block;background:var(--blue-pale);color:var(--blue-dark);font-size:10px;font-weight:600;padding:3px 10px;border-radius:var(--r-pill);letter-spacing:0.06em;text-transform:uppercase}
.broker-tag.gold{background:#F5E8D0;color:var(--gold)}
.broker-price{font-family:'DM Serif Display',serif;font-style:italic;font-size:26px;color:var(--blue-dark);line-height:1;margin:12px 0;letter-spacing:-0.02em}
.broker-list{list-style:none;padding:0;margin:12px 0 0}
.broker-list li{font-size:13px;color:var(--gray);padding:4px 0 4px 18px;position:relative}
.broker-list li::before{content:"→";position:absolute;left:0;color:var(--blue)}
.risks-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:26px 0}
@media(max-width:640px){.risks-grid{grid-template-columns:1fr}}
.risk{background:var(--paper-2);border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:var(--r-sm);padding:20px 22px}
.risk-num{font-family:'DM Serif Display',serif;font-style:italic;font-size:22px;color:var(--gold);line-height:0.85;margin-bottom:6px;display:block}
.risk h4{margin:0 0 6px;font-size:16px}
.risk p{margin:0;font-size:13px;color:var(--muted);line-height:1.5}
.faq-section{background:var(--paper-2);border-radius:var(--r-lg);padding:40px 36px;margin:52px 0}
@media(max-width:640px){.faq-section{padding:30px 22px}}
.faq-section h2{padding:0;margin:0 0 24px}
.faq-item{border-bottom:1px solid var(--line);padding:16px 0}
.faq-item:last-child{border-bottom:none}
.faq-item summary{cursor:pointer;font-family:'Fraunces',serif;font-weight:500;font-size:17px;color:var(--ink);list-style:none;position:relative;padding-right:36px;line-height:1.35;transition:color .2s}
.faq-item summary:hover{color:var(--blue)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:22px;color:var(--blue);width:26px;height:26px;background:var(--blue-pale);border-radius:50%;display:flex;align-items:center;justify-content:center;line-height:1;font-weight:400;transition:all .3s}
.faq-item[open] summary::after{transform:translateY(-50%) rotate(45deg);background:var(--blue);color:var(--paper-2)}
.faq-item .answer{padding-top:14px;color:var(--gray);font-size:15px;line-height:1.7}
.cta-form{background:linear-gradient(135deg,var(--ink) 0%,var(--ink-2) 100%);color:var(--paper);border-radius:var(--r-lg);padding:44px 38px;margin:52px 0;position:relative;overflow:hidden}
.cta-form::before{content:"";position:absolute;top:-60px;right:-60px;width:240px;height:240px;background:radial-gradient(circle,rgba(0,137,175,0.25),transparent);border-radius:50%;pointer-events:none}
@media(max-width:640px){.cta-form{padding:32px 24px}}
.cta-form .cta-badge{display:inline-block;background:var(--blue);color:var(--paper-2);font-weight:600;font-size:11px;letter-spacing:0.14em;padding:5px 14px;border-radius:var(--r-pill);margin-bottom:14px;text-transform:uppercase}
.cta-form h2{font-family:'Fraunces',serif;color:var(--paper);padding:0;margin:0 0 12px;font-size:28px;font-weight:500}
.cta-form h2 em{color:var(--blue-soft);font-style:italic;font-weight:400}
.cta-form .cta-sub{font-size:15px;opacity:0.85;margin:0 0 24px;max-width:520px}
.cta-form .benefits{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}
.cta-form .benefits li{font-size:13px;margin:0;padding-left:22px;position:relative;color:rgba(255,255,255,0.9)}
.cta-form .benefits li::before{content:"✓";position:absolute;left:0;color:var(--blue-soft);font-weight:700}
.lead-form{background:var(--paper-2);border-radius:var(--r-md);padding:26px 24px;color:var(--ink);position:relative;z-index:2}
.lead-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
@media(max-width:520px){.lead-form .form-row{grid-template-columns:1fr}}
.lead-form label{display:block;font-size:13px;font-weight:600;color:var(--gray);margin-bottom:6px}
.lead-form input,.lead-form select{width:100%;padding:11px 13px;border:1.5px solid var(--line);border-radius:var(--r-sm);font-family:'Inter',sans-serif;font-size:15px;background:var(--paper-2);color:var(--ink)}
.lead-form input:focus,.lead-form select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(0,137,175,0.1)}
.lead-form button{width:100%;background:var(--blue);color:var(--paper-2);border:none;padding:14px 20px;border-radius:var(--r-pill);font-family:'Inter',sans-serif;font-size:15px;font-weight:600;cursor:pointer;margin-top:6px;transition:all .25s}
.lead-form button:hover{background:var(--blue-dark);transform:scale(1.01)}
.lead-form .form-note{font-size:12px;color:var(--muted);text-align:center;margin-top:10px}
.form-success-state{display:none;text-align:center;padding:20px}
.form-success-state.active{display:block}
.form-success-state .success-icon{width:56px;height:56px;margin:0 auto 14px;background:var(--green);color:var(--paper-2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:700}
nav.related{margin:48px 0;padding:32px 0;border-top:1px solid var(--line)}
nav.related h3{font-family:'Inter',sans-serif;font-size:12px;text-transform:uppercase;letter-spacing:0.14em;color:var(--muted);font-weight:600;margin:0 0 20px}
nav.related ul{list-style:none;padding:0;margin:0}
nav.related li{margin-bottom:10px}
nav.related a{display:block;padding:14px 18px;background:var(--paper-2);border-radius:var(--r-sm);font-weight:500;font-size:15px;color:var(--ink);border:1px solid var(--line);border-left:3px solid transparent;transition:all .2s}
nav.related a:hover{border-left-color:var(--blue);background:var(--blue-pale);color:var(--blue-dark);transform:translateX(4px)}
nav.related .pillar-link{background:var(--blue-pale);border-left-color:var(--blue);font-weight:600}
nav.related .hub-link{background:#F5E8D0;border-left-color:var(--gold);font-weight:600}
nav.related .tool-link{background:var(--green-pale);border-left-color:var(--green);font-weight:600}
.author-box{display:flex;align-items:center;gap:20px;background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px;margin:40px 0}
.author-box img{width:68px;height:68px;border-radius:50%;flex-shrink:0;object-fit:cover}
.author-box .author-name{font-family:'Fraunces',serif;font-weight:500;font-size:18px;color:var(--ink);margin:0 0 4px}
.author-box .author-role{font-size:14px;color:var(--muted);margin:0;line-height:1.5}

/* ==========================================================================
   3. Titre de secours — visible seulement si le contenu ne porte aucun H1
   ========================================================================== */
.bei-titre-secours{max-width:920px;margin:32px auto 24px;padding:0 24px}

/* ============================================================
   Pages importees du constructeur
   ------------------------------------------------------------
   Soixante-six pages viennent du builder Hostinger avec son
   balisage et sans sa feuille de style. Ces regles les ramenent
   a la convention v3 sans toucher au contenu des pages.
   ============================================================ */

.bei-import .block-background{display:none}
.bei-import .transition{opacity:1;transform:none;visibility:visible}

.bei-import .block-blog-header__content,
.bei-import .block-layout{max-width:920px;margin:0 auto;padding:0 24px}

/* Hero */
.bei-import .block-blog-header{padding-top:30px}
.bei-import .block-blog-header__title{font-family:'Fraunces',Georgia,serif;font-weight:600;
  font-size:clamp(30px,4.2vw,46px);line-height:1.14;letter-spacing:-0.01em;color:var(--ink);margin:0 0 20px}
.bei-import .blog-list-item-meta{margin:0 0 38px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.bei-import .blog-list-item-meta>div{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.bei-import .blog-list-item-meta p{margin:0;font-size:13px;color:var(--muted)}
.bei-import .blog-list-item-meta__author-name{font-weight:500;color:var(--gray)}
.bei-import .blog-list-item-meta__author-name::before{content:"Par ";font-weight:400;color:var(--muted)}
/* Date brute au format americain : la convention du site est evergreen, elle reste dans le Schema. */
.bei-import .blog-list-item-meta__subtitle{display:none}

/* Corps de texte */
.bei-import .layout-element{margin:0}
.bei-import .text-box>:first-child{margin-top:0}
.bei-import .text-box p{margin:0 0 18px;font-size:17px;line-height:1.72;color:var(--ink-body)}
.bei-import .text-box p.body-small{font-size:14.5px;color:var(--muted)}
.bei-import .text-box strong{font-weight:600;color:var(--ink)}
.bei-import .text-box h2{font-family:'Fraunces',Georgia,serif;font-weight:600;
  font-size:clamp(24px,3vw,32px);line-height:1.2;letter-spacing:-0.01em;color:var(--ink);margin:54px 0 18px}
.bei-import .text-box h3{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:21px;
  line-height:1.25;color:var(--ink);margin:36px 0 12px}
.bei-import .text-box h4,.bei-import .text-box h5,.bei-import .text-box h6{
  font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:18px;line-height:1.3;color:var(--ink);margin:28px 0 10px}
.bei-import .text-box ul,.bei-import .text-box ol{margin:0 0 22px;padding-left:26px}
.bei-import .text-box li{margin:0 0 10px;line-height:1.72;color:var(--ink-body)}
.bei-import .text-box li p{margin:0;font-size:inherit;line-height:inherit}
.bei-import .text-box li::marker{color:var(--blue-dark)}
.bei-import .text-box a{color:var(--blue-dark);text-decoration:none;border-bottom:1px solid var(--blue-soft);transition:all .2s}
.bei-import .text-box a:hover{color:var(--blue);border-bottom-color:var(--blue)}
.bei-import .text-box hr{border:0;border-top:1px solid var(--line);margin:44px 0}
.bei-import .text-box blockquote{margin:28px 0;padding:20px 26px;background:var(--blue-pale);
  border-left:4px solid var(--blue);border-radius:var(--r-md)}
.bei-import .text-box blockquote p:last-child{margin:0}
.bei-import .text-box table{width:100%;border-collapse:collapse;margin:28px 0;font-size:15px}
.bei-import .text-box th{background:var(--ink);color:#fff;text-align:left;padding:12px 14px;
  font-size:12px;text-transform:uppercase;letter-spacing:.06em}
.bei-import .text-box td{padding:12px 14px;border-bottom:1px solid var(--line)}
.bei-import .block:last-of-type{padding-bottom:64px}

/* Formulaire de contact du constructeur, ramene a la carte CTA v3 */
.bei-import .form{background:linear-gradient(135deg,#0f1b2d 0%,#1a3257 100%);color:#fff;
  border-radius:var(--r-lg);padding:38px 34px;margin:52px 0}
.bei-import .form__control{display:grid;gap:16px}
.bei-import .input{display:flex;flex-direction:column;gap:7px}
.bei-import .input__label{font-family:'Inter',sans-serif;font-size:11.5px;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:#9FC0D2}
.bei-import .input__component{width:100%;font-family:'Inter',sans-serif;font-size:15.5px;
  padding:13px 15px;border-radius:12px;border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);color:#fff;transition:border-color .18s,background .18s}
.bei-import .input__component::placeholder{color:#8FA5B2}
.bei-import .input__component:focus{outline:none;border-color:var(--blue-soft);background:rgba(255,255,255,.12)}
.bei-import textarea.input__component{min-height:120px;resize:vertical;line-height:1.6}
.bei-import .grid-button{font-family:'Inter',sans-serif;font-size:15px;font-weight:600;
  padding:14px 30px;border-radius:var(--r-pill);border:0;cursor:pointer;justify-self:start;
  background:var(--gold);color:#0f1b2d;transition:filter .18s}
.bei-import .grid-button:hover{filter:brightness(1.08)}
@media(min-width:620px){
  .bei-import .form__control{grid-template-columns:1fr 1fr}
  .bei-import .form:has(textarea) .input:has(textarea),
  .bei-import .form:has(textarea) .form__button{grid-column:1 / -1}
}

/* Bloc d inscription a la lettre d information : carte claire, pour ne pas
   la confondre avec la carte de contact. */
.bei-import .form:not(:has(textarea)){background:linear-gradient(135deg,var(--blue-pale) 0%,var(--green-pale) 100%);
  color:var(--ink);border-radius:var(--r-lg);padding:30px 32px;margin:46px 0}
.bei-import .form:not(:has(textarea)) .form__control{grid-template-columns:1fr auto;align-items:end;gap:14px}
.bei-import .form:not(:has(textarea)) .input__label{color:var(--blue-dark)}
.bei-import .form:not(:has(textarea)) .input__component{background:#fff;border-color:var(--line);color:var(--ink)}
.bei-import .form:not(:has(textarea)) .input__component::placeholder{color:var(--muted)}
.bei-import .form:not(:has(textarea)) .input__component:focus{border-color:var(--blue);background:#fff}
.bei-import .form:not(:has(textarea)) .grid-button{background:var(--blue-dark);color:#fff;justify-self:stretch}
.bei-import .form:not(:has(textarea)) .bei-mention{color:var(--muted)}
.bei-import .form:not(:has(textarea)) .bei-mention a{color:var(--blue-dark)}
.bei-import .form:not(:has(textarea)) .bei-succes-titre{color:var(--ink)}
.bei-import .form:not(:has(textarea)) .bei-succes-texte{color:var(--gray)}
.bei-import .form:not(:has(textarea)) .bei-erreur{color:#B3261E}
@media(max-width:620px){.bei-import .form:not(:has(textarea)) .form__control{grid-template-columns:1fr}}

@media(max-width:640px){
  .bei-import .block-blog-header__content,
  .bei-import .block-layout{padding:0 18px}
  .bei-import .text-box p{font-size:16.5px}
  .bei-import .form{padding:28px 22px;border-radius:var(--r-md);margin:40px 0}
}

/* Sommaire rendu cliquable par le script du pied de page */
.bei-import .bei-sommaire{list-style:none;padding:22px 28px;margin:0 0 32px;background:var(--paper-2);
  border:1px solid var(--line);border-radius:var(--r-md);counter-reset:bei-toc}
.bei-import .bei-sommaire li{counter-increment:bei-toc;margin:0;padding:0;display:flex;gap:12px;align-items:baseline}
.bei-import .bei-sommaire li::marker{content:none}
.bei-import .bei-sommaire li::before{content:counter(bei-toc,decimal-leading-zero);
  font-family:'DM Serif Display',Georgia,serif;font-style:italic;color:#5B9B7E;font-size:15px;flex:0 0 auto}
.bei-import .bei-sommaire a{display:block;flex:1;padding:7px 0;color:var(--gray);border:0;font-size:15.5px}
.bei-import .bei-sommaire a:hover{color:var(--blue);border:0}
.bei-import .bei-sommaire a p{margin:0;font-size:inherit;line-height:1.5;color:inherit}
.bei-import .bei-sommaire-titre{margin-bottom:18px}

/* Formulaires : mention d information, erreur, confirmation */
.bei-import .bei-mention{grid-column:1 / -1;margin:2px 0 0;font-size:12.5px;line-height:1.55;color:#8FA5B2}
.bei-import .bei-mention a{color:#C7D6DE;text-decoration:underline}
.bei-import .bei-erreur{grid-column:1 / -1;margin:0;font-size:14px;color:#FFC9C9}
.bei-import .bei-succes{text-align:center;padding:14px 0}
.bei-import .bei-succes-titre{font-family:'Fraunces',Georgia,serif;font-size:23px;font-weight:600;color:#fff;margin:0 0 10px}
.bei-import .bei-succes-texte{margin:0;font-size:15px;line-height:1.6;color:#C7D6DE}
.bei-import .grid-button[disabled]{opacity:.55;cursor:default}

/* Le pied de page du constructeur a ete importe dans chaque page : il double le
   vrai pied de page, mêmes liens et mêmes mentions. On ne garde de ce dernier
   bloc que la carte d inscription a la lettre d information. */
.bei-import section.block:last-of-type .layout-element{display:none}
.bei-import section.block:last-of-type{padding-top:0}

/* ===== En-tête et menu (déplacé depuis header.php le 25 septembre) ===== */
:root{--bei-entete:76px}
/* Chaque page importee embarque sa propre feuille de style, chargee apres celle
   du theme : sans cette specificite, son a{text-decoration:underline} souligne
   les liens du menu. */
.bei-entete a,.bei-entete a:hover,.bei-entete a:focus{text-decoration:none;border-bottom:0}
body{padding-top:var(--bei-entete)}
[id]{scroll-margin-top:calc(var(--bei-entete) + 16px)}

/* Le flou est porte par un pseudo-element : applique a .bei-entete, il ferait
   d elle le bloc conteneur des enfants en position:fixed, ce qui ecrasait le
   panneau mobile a la hauteur de la barre. */
.bei-entete{position:fixed;top:0;left:0;right:0;z-index:900;border-bottom:1px solid var(--line)}
.bei-entete::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(12px);-webkit-backdrop-filter:saturate(180%) blur(12px)}
.admin-bar .bei-entete{top:32px}
@media(max-width:782px){.admin-bar .bei-entete{top:46px}}
.bei-barre{max-width:1180px;margin:0 auto;padding:0 20px;height:var(--bei-entete);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.bei-logo{display:flex;align-items:center;gap:10px;border:none;grid-column:1;justify-self:start}
.bei-logo svg{display:block;height:48px;width:auto;color:#3D7297}
@media(max-width:560px){.bei-logo svg{height:40px}}
.bei-logo:hover{border:none}

.bei-nav{display:flex;align-items:center;gap:2px;grid-column:2;justify-self:center}
.bei-rubrique{position:relative}
.bei-declencheur{font-family:'Inter',sans-serif;font-size:14.5px;font-weight:500;color:var(--gray);
  background:none;border:0;padding:9px 13px;border-radius:var(--r-sm);cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;line-height:1.2}
.bei-declencheur::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.55;transition:transform .18s}
.bei-declencheur:hover,.bei-declencheur:focus-visible{background:var(--blue-pale);color:var(--blue-dark)}
.bei-rubrique[data-ouvert="oui"] .bei-declencheur{background:var(--blue-pale);color:var(--blue-dark)}
.bei-rubrique[data-ouvert="oui"] .bei-declencheur::after{transform:rotate(-135deg) translateY(-2px)}

.bei-panneau{position:absolute;top:calc(100% + 8px);right:0;min-width:322px;
  background:var(--paper-2);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:0 16px 44px rgba(10,34,49,.13);padding:10px;display:none}
.bei-rubrique[data-ouvert="oui"] .bei-panneau{display:block}
.bei-panneau ul{list-style:none;margin:0;padding:0}
.bei-panneau.bei-deux-colonnes ul{display:grid;grid-template-columns:1fr 1fr;gap:0 8px;min-width:520px}
.bei-panneau li{margin:0}
.bei-panneau a{display:block;padding:9px 12px;border-radius:var(--r-sm);font-size:14.5px;
  color:var(--ink-body);border:none;line-height:1.35}
.bei-panneau a:hover,.bei-panneau a:focus-visible{background:var(--blue-pale);color:var(--blue-dark);border:none}

.bei-panneau a.bei-hub{font-size:13.5px;color:var(--muted)}
.bei-panneau a.bei-hub:hover,.bei-panneau a.bei-hub:focus-visible{color:var(--blue-dark)}
@media(min-width:1081px){.bei-panneau a.bei-hub{padding-left:26px}}
.bei-burger{display:none;grid-column:3;justify-self:end;background:none;border:0;padding:0;
  width:44px;height:44px;cursor:pointer;border-radius:var(--r-sm);color:var(--ink);
  flex-direction:column;align-items:center;justify-content:center}
.bei-burger:hover{background:var(--blue-pale)}
.bei-burger span{display:block;width:22px;height:2px;background:currentColor;border-radius:2px;
  transition:transform .26s cubic-bezier(.2,.8,.25,1),opacity .16s ease}
.bei-burger span+span{margin-top:5px}
.bei-entete[data-menu="ouvert"] .bei-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.bei-entete[data-menu="ouvert"] .bei-burger span:nth-child(2){opacity:0;transform:scaleX(.3)}
.bei-entete[data-menu="ouvert"] .bei-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:1080px){
  .bei-burger{display:flex}
  .bei-nav{position:fixed;top:var(--bei-entete);left:0;right:0;bottom:0;background:var(--paper);
    flex-direction:column;align-items:stretch;gap:0;overflow-y:auto;overscroll-behavior:contain;
    padding:6px 0 48px;display:flex;visibility:hidden;opacity:0;transform:translateY(-8px);
    transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s}
  .admin-bar .bei-nav{top:calc(var(--bei-entete) + 32px)}
  @media(max-width:782px){.admin-bar .bei-nav{top:calc(var(--bei-entete) + 46px)}}
  .bei-entete[data-menu="ouvert"] .bei-nav{visibility:visible;opacity:1;transform:none;
    transition:opacity .2s ease,transform .28s cubic-bezier(.2,.8,.25,1),visibility 0s}

  .bei-rubrique{margin:0 18px;border-bottom:1px solid var(--line)}
  .bei-rubrique:last-child{border-bottom:0}
  .bei-declencheur{width:100%;justify-content:space-between;min-height:58px;padding:16px 2px;
    font-family:'Fraunces',Georgia,serif;font-size:17px;font-weight:600;color:var(--ink);
    border-radius:0;background:none}
  .bei-declencheur:hover,.bei-declencheur:focus-visible,.bei-rubrique[data-ouvert="oui"] .bei-declencheur{
    background:none;color:var(--blue-dark)}
  .bei-declencheur::after{width:8px;height:8px;border-right-width:2px;border-bottom-width:2px;opacity:.45}

  .bei-panneau{position:static;border:0;box-shadow:none;background:transparent;padding:0;min-width:0;
    display:grid;grid-template-rows:0fr;transition:grid-template-rows .26s cubic-bezier(.2,.8,.25,1)}
  .bei-rubrique[data-ouvert="oui"] .bei-panneau{display:grid;grid-template-rows:1fr}
  .bei-panneau>ul{overflow:hidden;min-height:0}
  .bei-panneau.bei-deux-colonnes ul{display:block;min-width:0}
  .bei-panneau li{margin:0}
  .bei-panneau a{position:relative;padding:11px 8px 11px 20px;font-size:15.5px;color:var(--gray);
    border-radius:10px;opacity:0;transform:translateY(-4px);transition:opacity .2s ease,transform .2s ease}
  .bei-rubrique[data-ouvert="oui"] .bei-panneau a{opacity:1;transform:none;transition-delay:.06s}
  .bei-panneau a::before{content:"";position:absolute;left:4px;top:50%;width:7px;height:1.5px;
    background:var(--blue-soft);border-radius:2px;transform:translateY(-50%)}
  .bei-panneau a:hover,.bei-panneau a:focus-visible{background:var(--blue-pale);color:var(--blue-dark)}
  .bei-panneau a:hover::before,.bei-panneau a:focus-visible::before{background:var(--blue)}
  .bei-panneau li:last-child a{margin-bottom:10px}
}
@media(prefers-reduced-motion:reduce){
  .bei-declencheur::after,.bei-burger span,.bei-nav,.bei-panneau{transition:none}
}