
/* =====================================================================
   Premium Typography System - 20260614
   Objectif : polices fines ultra modernes + titres/nav plus compacts
   ===================================================================== */
:root{
  --font-body:"Manrope","Inter","Aptos","Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  --font-display:"Outfit","Manrope","Inter","Aptos","Segoe UI",system-ui,sans-serif;
  --font-nav:"Manrope","Inter","Aptos","Segoe UI",system-ui,sans-serif;
}
html{font-size:15px;-webkit-text-size-adjust:100%;text-rendering:geometricPrecision;}
body,
button,
input,
textarea,
select{
  font-family:var(--font-body) !important;
  font-weight:400;
  letter-spacing:-.006em;
}
body{line-height:1.62;}
h1,h2,h3,h4,h5,h6,
.section-heading h2,
.split-copy h2,
.cta-box h2,
.contact-grid h2,
.premium-card h3,
.search-result h3,
.site-footer h3,
.site-footer h4{
  font-family:var(--font-display) !important;
  font-weight:600 !important;
  letter-spacing:-.028em !important;
  text-wrap:balance;
}
p,.lead,.section-heading p,.premium-card p,.split-copy p,.contact-grid p{font-weight:400;}
strong,b{font-weight:700;}

/* Header & navbar : plus lisible, plus fin, plus premium */
.site-header{backdrop-filter:blur(18px);}
.navbar{
  min-height:88px !important;
  gap:clamp(10px,1.45vw,18px) !important;
  padding:10px clamp(16px,3.5vw,58px) !important;
}
.brand img{
  width:68px !important;
  height:68px !important;
  border-radius:19px !important;
  padding:7px !important;
}
.brand-socials{
  gap:6px !important;
  margin-right:clamp(8px,1.2vw,16px) !important;
  padding-right:clamp(8px,1.2vw,14px) !important;
}
.brand-socials a{
  width:27px !important;
  height:27px !important;
  font-size:11px !important;
}
.nav-links{
  gap:4px !important;
  margin-right:clamp(6px,1vw,12px) !important;
}
.nav-links a{
  font-family:var(--font-nav) !important;
  font-size:clamp(10.4px,.68vw,12px) !important;
  line-height:1.15 !important;
  font-weight:600 !important;
  letter-spacing:.006em !important;
  padding:9px 8px !important;
  border-radius:13px !important;
  text-transform:none !important;
  color:#fff !important;
}
.nav-links a:hover,
.nav-links>li:hover>a{
  background:rgba(255,255,255,.16) !important;
  color:#fff !important;
  transform:translateY(-1px);
}
.nav-arrow{font-size:8px !important;}
.submenu{
  min-width:260px !important;
  border-radius:20px !important;
  padding:9px !important;
}
.submenu a{
  font-size:11.5px !important;
  line-height:1.38 !important;
  font-weight:600 !important;
  padding:9px 11px !important;
  color:#101827 !important;
  letter-spacing:-.004em !important;
}
.search-trigger{
  height:39px !important;
  padding:0 13px !important;
  font-family:var(--font-nav) !important;
  font-size:11px !important;
  font-weight:600 !important;
  letter-spacing:.006em !important;
}
.mobile-toggle{
  width:43px !important;
  height:43px !important;
  border-radius:14px !important;
  font-size:17px !important;
}

/* Hero : grands-titres diminués sur toutes les pages */
.hero,
.hero.hero-carousel{
  min-height:clamp(400px,54vh,560px) !important;
}
.hero-content{
  max-width:600px !important;
  margin-left:clamp(16px,4.4vw,62px) !important;
  padding-top:48px !important;
  padding-bottom:44px !important;
}
.kicker,
.hero .kicker,
.hero-content .kicker{
  font-family:var(--font-nav) !important;
  font-size:clamp(7.2px,.55vw,9.2px) !important;
  line-height:1.18 !important;
  font-weight:600 !important;
  letter-spacing:.065em !important;
  padding:5px 8px !important;
}
.hero h1,
main > section:first-child.hero h1{
  font-size:clamp(18px,2.05vw,30px) !important;
  line-height:1.18 !important;
  max-width:600px !important;
  margin:8px 0 7px !important;
  font-weight:600 !important;
  letter-spacing:-.018em !important;
}
.hero p,
main > section:first-child.hero p{
  font-size:clamp(10.8px,.88vw,13.5px) !important;
  line-height:1.48 !important;
  max-width:550px !important;
  font-weight:400 !important;
}
body.page-accueil .hero-content{max-width:520px !important;}
body.page-accueil .hero h1,
body.page-accueil main > section:first-child.hero h1{
  font-size:clamp(15px,1.32vw,22px) !important;
  line-height:1.24 !important;
  max-width:520px !important;
  font-weight:600 !important;
}
body.page-accueil .hero p{
  font-size:clamp(9.8px,.74vw,11.8px) !important;
  max-width:470px !important;
}
.hero-actions{gap:6px !important;margin-top:10px !important;}
.hero-actions .btn{
  font-size:9.2px !important;
  font-weight:600 !important;
  padding:6px 9px !important;
  letter-spacing:.005em !important;
}
.hero-pills{gap:5px !important;margin-top:9px !important;}
.hero-pills span{
  font-size:8.8px !important;
  font-weight:600 !important;
  padding:4px 7px !important;
}

/* Titres, sous-titres, cartes et contenus */
.content-section{padding-top:clamp(56px,6.2vw,82px) !important;padding-bottom:clamp(56px,6.2vw,82px) !important;}
.section-heading{max-width:700px !important;margin-bottom:34px !important;}
.section-heading h2,
.split-copy h2,
.cta-box h2,
.contact-grid h2,
main > section:first-child:not(.hero) h1,
main > section:first-child:not(.hero) h2{
  font-size:clamp(21px,2.65vw,36px) !important;
  line-height:1.12 !important;
  margin:11px 0 9px !important;
  font-weight:600 !important;
  letter-spacing:-.024em !important;
}
.section-heading p,
.lead,
.split-copy .lead,
.contact-grid .lead,
main > section:first-child:not(.hero) p,
main > section:first-child:not(.hero) .lead{
  font-size:clamp(12px,1.05vw,15px) !important;
  line-height:1.55 !important;
  font-weight:400 !important;
}
.split-copy>p:not(.lead),
.contact-grid p,
.premium-card p,
.search-result p,
.site-footer p,
.site-footer a{
  font-size:clamp(12px,.95vw,14px) !important;
  line-height:1.56 !important;
}
.premium-card{padding:22px !important;border-radius:25px !important;}
.premium-card h3,
.search-result h3{
  font-size:clamp(15.5px,1.18vw,19px) !important;
  line-height:1.22 !important;
  font-weight:600 !important;
  margin-bottom:8px !important;
}
.compact h3{font-size:clamp(13.5px,.95vw,16px) !important;line-height:1.24 !important;}
.compact p{font-size:12px !important;line-height:1.48 !important;}
.btn,
.btn-card,
.contact-form button,
.search-panel button{
  font-family:var(--font-nav) !important;
  font-size:clamp(10.5px,.82vw,12.8px) !important;
  font-weight:600 !important;
  letter-spacing:.004em !important;
}
.btn{padding:11px 17px !important;}
.btn-card{padding:8px 12px !important;}
.icon-bubble{width:48px !important;height:48px !important;border-radius:17px !important;font-size:20px !important;}
.compact .icon-bubble{width:38px !important;height:38px !important;font-size:15px !important;}
.cta-box{padding:clamp(30px,4.6vw,46px) !important;}
.contact-form label{font-size:12.5px !important;font-weight:600 !important;}
.contact-form input,
.contact-form textarea,
.search-panel input{font-size:13px !important;font-weight:400 !important;}
.site-footer{font-size:13px !important;}
.site-footer h3{font-size:18px !important;line-height:1.2 !important;}
.site-footer h4{font-size:13px !important;letter-spacing:.04em;text-transform:uppercase;}
.footer-bottom{font-size:12px !important;}

@media(max-width:1220px){
  .navbar{min-height:82px !important;padding:9px 18px !important;}
  .brand img{width:62px !important;height:62px !important;}
  .nav-links a{font-size:10.2px !important;padding:8px 6px !important;}
  .search-trigger span{display:none !important;}
}
@media(max-width:1060px){
  .navbar{min-height:76px !important;}
  .brand img{width:58px !important;height:58px !important;border-radius:17px !important;}
  .nav-links{
    left:12px !important;
    right:12px !important;
    top:calc(100% + 8px) !important;
    border-radius:22px !important;
    padding:11px !important;
  }
  .nav-links a{
    color:#0f172a !important;
    font-size:13px !important;
    line-height:1.24 !important;
    padding:10px 12px !important;
    font-weight:600 !important;
  }
  .submenu a{font-size:12px !important;padding:8px 10px !important;}
  .hero{min-height:470px !important;}
  .hero-content{padding-top:42px !important;padding-bottom:38px !important;max-width:560px !important;}
  .hero h1{font-size:clamp(17px,3.1vw,26px) !important;}
  body.page-accueil .hero h1{font-size:clamp(14.8px,2.6vw,20px) !important;}
  .section-heading h2,.split-copy h2,.cta-box h2,.contact-grid h2{font-size:clamp(20px,3.5vw,31px) !important;}
}
@media(max-width:760px){
  html{font-size:14px;}
  .navbar{min-height:68px !important;padding:8px 14px !important;}
  .brand img{width:52px !important;height:52px !important;border-radius:15px !important;}
  .mobile-toggle{width:40px !important;height:40px !important;font-size:16px !important;}
  .search-trigger{height:37px !important;width:37px !important;padding:0 !important;justify-content:center;}
  .hero,
  .hero.hero-carousel{min-height:420px !important;}
  .hero-content{
    margin-left:0 !important;
    max-width:100% !important;
    padding:58px 16px 32px !important;
  }
  .hero h1,
  main > section:first-child.hero h1{
    font-size:clamp(16px,5.1vw,22px) !important;
    line-height:1.24 !important;
    max-width:92vw !important;
  }
  body.page-accueil .hero h1,
  body.page-accueil main > section:first-child.hero h1{
    font-size:clamp(14px,4.4vw,18px) !important;
    line-height:1.28 !important;
    max-width:91vw !important;
  }
  .hero p,
  body.page-accueil .hero p{
    font-size:10.5px !important;
    line-height:1.45 !important;
    max-width:91vw !important;
  }
  .hero .kicker{font-size:7px !important;padding:4px 6px !important;}
  .hero-actions .btn{font-size:8.6px !important;padding:5px 8px !important;}
  .hero-pills span{font-size:7.8px !important;padding:3px 6px !important;}
  .content-section{padding:52px 16px !important;}
  .section-heading{margin-bottom:26px !important;}
  .section-heading h2,
  .split-copy h2,
  .cta-box h2,
  .contact-grid h2,
  main > section:first-child:not(.hero) h1,
  main > section:first-child:not(.hero) h2{
    font-size:clamp(18px,5.4vw,25px) !important;
    line-height:1.2 !important;
    margin:8px 0 7px !important;
  }
  .section-heading p,.lead,.split-copy .lead,.contact-grid .lead{font-size:12px !important;line-height:1.5 !important;}
  .premium-card{padding:18px !important;border-radius:22px !important;}
  .premium-card h3,.search-result h3{font-size:15px !important;line-height:1.24 !important;}
  .premium-card p,.split-copy>p:not(.lead),.contact-grid p{font-size:12px !important;}
  .btn,.btn-card{font-size:10px !important;}
  .site-footer h3{font-size:16px !important;}
}
@media(max-width:420px){
  .hero{min-height:400px !important;}
  .hero-content{padding:52px 14px 28px !important;}
  .hero h1{font-size:clamp(15.5px,5vw,20px) !important;}
  body.page-accueil .hero h1{font-size:clamp(13.5px,4.2vw,17px) !important;}
  .nav-links a{font-size:12.2px !important;}
  .section-heading h2,.split-copy h2,.cta-box h2,.contact-grid h2{font-size:clamp(17px,5.3vw,22px) !important;}
}


/* =====================================================================
   Formulaire contact ultra moderne + email professionnel MMC
   Version 20260614-contact-pro-v1
   ===================================================================== */
.brand-socials a[href^="mailto:"]{
  background:linear-gradient(135deg,#2382d1,#0f3f91);
  color:#fff;
  box-shadow:0 12px 28px rgba(35,130,209,.22);
}
.footer-mail{display:inline-flex !important;align-items:center;gap:8px;color:#ffffff !important;font-weight:850;word-break:break-word;margin:0 !important}
.mmc-pro-contact-form{position:relative;overflow:hidden;padding:34px !important;border-radius:38px !important;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,251,255,.96)) !important;border:1px solid rgba(219,231,245,.96) !important;box-shadow:0 32px 90px rgba(15,63,147,.16) !important;isolation:isolate}
.mmc-pro-contact-form:before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(35,130,209,.52),rgba(117,185,255,.24),rgba(15,63,145,.42));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:0}
.mmc-pro-contact-form .form-glow{position:absolute;right:-95px;top:-95px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(35,130,209,.22),transparent 68%);filter:blur(4px);z-index:-1}
.mmc-pro-contact-form .form-head{position:relative;margin-bottom:8px;padding-bottom:18px;border-bottom:1px solid rgba(219,231,245,.86)}
.mmc-pro-contact-form .form-head span{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:8px 12px;background:rgba(35,130,209,.10);color:#0f3f91;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.08em}
.mmc-pro-contact-form .form-head h3{margin:14px 0 8px;color:#061a42;font-size:clamp(24px,2.4vw,34px);line-height:1.05;letter-spacing:-.035em}
.mmc-pro-contact-form .form-head p{margin:0;color:#475569;font-weight:650;line-height:1.55}
.mmc-pro-contact-form .form-head a{color:#0f3f91;font-weight:950;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;word-break:break-word}
.mmc-pro-contact-form .form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.mmc-pro-contact-form label{position:relative;color:#0f172a !important;font-size:13px;font-weight:900;letter-spacing:.01em}
.mmc-pro-contact-form input,.mmc-pro-contact-form textarea{margin-top:7px;background:rgba(255,255,255,.88);border:1px solid rgba(203,218,237,.96) !important;border-radius:20px !important;padding:15px 16px !important;color:#0f172a;box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 10px 24px rgba(15,63,147,.05);transition:border-color .22s ease,box-shadow .22s ease,transform .22s ease}
.mmc-pro-contact-form input::placeholder,.mmc-pro-contact-form textarea::placeholder{color:#94a3b8}
.mmc-pro-contact-form input:focus,.mmc-pro-contact-form textarea:focus{border-color:#2382d1 !important;box-shadow:0 0 0 5px rgba(35,130,209,.12),0 16px 34px rgba(15,63,147,.08) !important;transform:translateY(-1px)}
.mmc-pro-contact-form textarea{resize:vertical;min-height:150px}
.mmc-hp{position:absolute !important;left:-9999px !important;opacity:0 !important;height:0 !important;width:0 !important;padding:0 !important;border:0 !important}
.form-consent{display:flex;align-items:flex-start;gap:10px;padding:13px 15px;border-radius:20px;background:linear-gradient(135deg,rgba(35,130,209,.08),rgba(15,63,145,.05));border:1px solid rgba(219,231,245,.92);color:#475569;font-size:13px;font-weight:750;line-height:1.45}
.form-consent i{color:#2382d1;margin-top:2px}
.contact-submit-btn{width:100%;min-height:54px;margin-top:2px;letter-spacing:.01em;box-shadow:0 20px 48px rgba(35,130,209,.24) !important}
.flash{position:relative;z-index:5;box-shadow:0 18px 48px rgba(15,63,147,.10);border:1px solid rgba(255,255,255,.74)}
@media(max-width:760px){.mmc-pro-contact-form{padding:24px !important;border-radius:30px !important}.mmc-pro-contact-form .form-row{grid-template-columns:1fr}.mmc-pro-contact-form .form-head h3{font-size:25px}.contact-submit-btn{min-height:50px}}
