/* ===== Tokens rapides ===== */
:root{
    --c-primary:#184b8a;        /* bleu titre */
    --c-muted:#96a3b0;          /* sous-titre gris bleuté */
    --c-bg:#f8fafc;             /* fond doux */
    --c-card:#ffffff;           /* panneau split */
    --c-card-alt:#f5f7fa;       /* fond clair côté form */
    --c-border:#e7edf3;
    --radius-lg:20px;
    --radius-xl:22px;
    --shadow:0 10px 24px rgba(16,24,40,.08);
  }
  
  /* ===== HERO ===== */
  .contact-hero{
    padding: 48px 0 12px;
    margin-top: 70px;
    /*background: linear-gradient(180deg, rgba(24,75,138,.06), transparent 70%);*/
  }
  .contact-title{
    margin:0 0 6px;
    font-size: clamp(30px, 5vw, 44px);
    font-weight:800;
    color: var(--c-primary);
    letter-spacing:.2px;
  }
  .contact-subtitle{
    margin:0;
    font-size: clamp(15px, 2.2vw, 18px);
    color: var(--c-muted);
  }
  
  /* ===== SPLIT CARD ===== */
  .contact-split-wrap{ padding: 18px 0 28px; }
  .contact-split{
    display:grid;
    grid-template-columns: 1fr 1fr; 
    gap:0;
    background: var(--c-card);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow);
    overflow:hidden;
    border:1px solid var(--c-border);
  }
  
  /* gauche (fond gris clair) */
  .split-form{
    background: var(--c-card-alt);
    display:flex;
    align-items:stretch;
  }
  .split-form-inner{
    width:100%;
    max-width: 560px;
    padding: 28px 28px 28px 28px;
    margin: 0 auto;
  }
  
  /* droite (image) */
  .split-media{
    background-image: var(--contact-img);
    background-size: cover;
    background-position: center;
    min-height: 420px; /* assure la hauteur si peu de champs */
  }
  
  /* ===== Formulaire Drupal — styles arrondis ===== */
  .contact-split .form-item{ margin-bottom:14px; }
  .contact-split .form-item label{
    display:block;
    margin:0 0 6px;
    /* label */


    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    /* identical to box height, or 143% */
    display: flex;
    align-items: center;

    color: #181D25;
    align-self: stretch;


  }
  .contact-split input[type="text"],
  .contact-split input[type="email"],
  .contact-split input[type="tel"],
  .contact-split select,
  .contact-split textarea{
    width:100%;
    border:1px solid var(--c-border);
    border-radius: 999px; /* pilules comme sur la maquette */
    background:#fff;
    padding: 12px 16px;
    outline: none;
  }
  .contact-split textarea{
    border-radius: 18px; /* zone message plus grande */
    min-height: 140px; resize: vertical;
  }
  .contact-split input:focus,
  .contact-split select:focus,
  .contact-split textarea:focus{
    border-color:#85b0ff;
    box-shadow:0 0 0 3px rgba(24,75,138,.15);
  }
  
  /* bouton */
  .contact-split .form-actions{ margin-top: 12px; }
  .contact-split .form-actions .button,
  .contact-split .form-actions input[type="submit"]{
    background:#1a4f94;
    color:#fff;
    border:0;
    border-radius: 999px;
    padding: 12px 20px;
    box-shadow: 0 6px 14px rgba(26,79,148,.25);
  }
  .contact-split .form-actions .button:hover,
  .contact-split .form-actions input[type="submit"]:hover{
    filter: brightness(.96);
    transform: translateY(-1px);
  }
  
  /* ===== Info Row (3 items) ===== */
  .contact-infos-row{ padding: 16px 0 48px; }
  .info-row{
    display:grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px;
    border-top: 1px solid var(--c-border);
    padding-top: 22px;
  }
  .info-item{
    text-align:center;
  }
  .info-ico{
    width:56px;height:56px;
    margin:0 auto 10px;
    display:grid;place-items:center;
    border-radius:50%;
    border:1px solid var(--c-border);
    background:#fff;
    box-shadow: var(--shadow);
    color:#1f2937;
  }
  .info-ico i{ font-size:20px; }
  .info-title{
    margin:0 0 4px;
    font-weight:700;
    font-size:16px;
    color:#0f172a;
  }
  .info-text, .info-text a {
    margin:0;
    color:#64748b;
    font-size:14px;
    text-decoration: none;
  }
  
  /* ===== Responsive ===== */
  @media (max-width: 1199.98px){
    .contact-split{ grid-template-columns: 1fr 460px; }
  }
  @media (max-width: 991.98px){
    .contact-split{ grid-template-columns: 1fr; }
    .split-media{ order:-1; min-height: 280px; }
    .split-form-inner{ padding: 22px; }
    .info-row{ grid-template-columns: 1fr; }
  }
  


  /* === HERO BANNIÈRE TOP === */
.contact-hero-banner{
    position: relative;
    isolation: isolate;
    background-image: var(--hero-img);
    background-size: cover;
    background-position: center;
    overflow: hidden;
    margin: 0 0 24px;
  }
  .contact-hero-banner::before{
    content:"";
    position:absolute; inset:0;
    background: #004A8C45; /* overlay bleu sombre */
    z-index:0;
  }
  .contact-hero-banner .container{ position: relative; z-index: 1; }
  .contact-hero-banner .hero-inner{
    padding: clamp(36px, 6vw, 72px) 0;
    color: #fff;
    max-width: 840px;
  }
  .contact-hero-banner .hero-title{
    margin:0 0 8px;
    font-weight: 800;
    font-size: clamp(26px, 4.5vw, 42px);
    line-height: 1.15;
  }
  .contact-hero-banner .hero-subtitle{
    margin:0;
    font-size: clamp(14px, 2vw, 18px);
    opacity: .95;
  }
  
  /* Option : si tu supprimes le 2e hero, garde un espace après la bannière */
  .contact-hero{ padding-top: 16px; }