/* Direction MESA : contraste, composition éditoriale et espaces cohérents. */
html { scroll-behavior: smooth; }
body { font-family: "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
a, button, summary { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid #88b6ff; outline-offset: 5px; }
.mesa-nav a[aria-current="page"] { color: #8fbaff; }
.mesa-header { box-shadow: 0 8px 35px #00152712; }
.mesa-agency-hero { padding: 76px 0 70px; overflow: hidden; background: radial-gradient(ellipse at 90% 15%,#153e6e,transparent 65%),#061827; }
.mesa-agency-hero .mesa-agency-hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
.mesa-agency-hero-copy { min-width: 0; }
.mesa-agency-hero h1 { font-size: clamp(38px,4vw,56px); line-height: 1.07; letter-spacing: -.045em; max-width: 620px; }
.mesa-agency-hero h1 span { display: block; color: #97c1ff; }
.mesa-agency-hero .mesa-page-hero-lead { max-width: 510px; color: #c2d3e2; font-size: 16px; line-height: 1.8; }
.mesa-agency-hero .mesa-btn { margin-top: 25px; display: inline-flex; gap: 18px; align-items: center; }
.mesa-agency-panel { position: relative; overflow: hidden; padding: 28px 30px; border: 1px solid #83afea30; border-radius: 20px; color: #e3efff; background: linear-gradient(145deg,#163753,#0c243c); box-shadow: 0 25px 65px #000c1e44; }
.mesa-agency-panel-top { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding-bottom: 24px; border-bottom: 1px solid #b7d4ef20; color: #8db8ed; font-size: 9px; font-weight: 700; letter-spacing: .12em; }
.mesa-agency-panel-top svg { width: 30px; height: 30px; fill: none; stroke: #8fbaff; stroke-width: 1.5; stroke-linecap: round; }
.mesa-agency-panel > strong { display: block; margin-top: 27px; font-size: 30px; line-height: 1.15; letter-spacing: -.04em; }
.mesa-agency-panel > p { color: #adc4da; font-size: 13px; line-height: 1.7; margin: 12px 0 24px; }
.mesa-agency-panel-row { display: grid; grid-template-columns: 23px 1fr 15px; align-items: baseline; gap: 13px; padding: 14px 0; border-top: 1px solid #b7d4ef18; font-size: 13px; line-height: 1.5; }
.mesa-agency-row-number { color: #7da9df; font-size: 10px; letter-spacing: .06em; }
.mesa-agency-panel-row > span:last-child { color: #8db8ed; }
.mesa-agency-panel-caption { display: block; margin-top: 22px; color: #8ba7c1; font-size: 10px; }
.mesa-agency-panel-cybersecurite { border-top: 3px solid #70a9f7; }
.mesa-agency-panel-reseaux-infrastructures .mesa-agency-panel-rows { border-left: 1px solid #5682b353; padding-left: 15px; }
.mesa-agency-panel-a-propos { background: linear-gradient(145deg,#183f60,#0b2439); }
.mesa-infogerance-benefits, .mesa-cyber-benefits, .mesa-about-intro, .mesa-contact-section, .mesa-services-page { padding-block: 80px; }
.mesa-infogerance-grid, .mesa-cyber-grid { gap: 0 55px; }
.mesa-infogerance-grid > article, .mesa-cyber-grid > article {
    padding: 29px 0; min-height: 0; border: 0; border-top: 1px solid #dae5ef; border-radius: 0;
    background: transparent; box-shadow: none; transform: none;
}
.mesa-infogerance-grid > article:hover, .mesa-cyber-grid > article:hover { transform: none; box-shadow: none; background: transparent; }
.mesa-infogerance-grid > article::before, .mesa-cyber-grid > article::before { display: none; }
.mesa-infogerance-grid h3, .mesa-cyber-grid h3 { color: #153751; font-size: 21px; letter-spacing: -.025em; }
.mesa-infogerance-grid p, .mesa-cyber-grid p { color: #63788a; font-size: 14px; line-height: 1.8; }
.mesa-infogerance-scope, .mesa-cyber-scope { background: radial-gradient(ellipse at right top,#173d65,transparent 70%),#0b2339; }
.mesa-services-cta { background: #f3f7fb; color: #153751; }
.mesa-services-cta h2 { color: #153751; letter-spacing: -.035em; }
.mesa-services-cta p { color: #63788a; }
.mesa-services-cta .mesa-eyebrow { color: #286bc3; }
.mesa-services-cta .mesa-btn { background: #2563eb; color: #fff; }
.mesa-contact-form-box { border: 1px solid #dbe6f0; padding: 35px; box-shadow: 0 20px 55px #163b6010; }
#mesa-contact-form { scroll-margin-top: 145px; }
.mesa-contact-form-box label { line-height: 1.6; }
.mesa-about-intro-heading h2, .mesa-contact-intro-v2 h2 { letter-spacing: -.035em; }
.mesa-service-icon-link { text-decoration: none; flex-shrink: 0; align-self: flex-start; margin: 0 !important; }
.mesa-services-grid .mesa-service-icon-link:hover { border-color: #a2c7f3; }
.mesa-footer { border-top: 1px solid #8eaeca20; }
.mesa-footer a { transition: color .18s ease; }
.mesa-footer a:hover { color: #90bbff; }
@media (min-width:961px) {
    .mesa-services-page-grid > .mesa-services-page-card { grid-column: span 2; }
    .mesa-services-page-grid > .mesa-services-page-card:nth-child(4) { grid-column: 2 / span 2; }
    .mesa-services-page-grid > .mesa-services-page-card:nth-child(5) { grid-column: 4 / span 2; }
    .mesa-services-page-grid > .mesa-services-page-card:nth-child(6) { grid-column: 1 / span 2; }
}
@media (max-width:960px) {
    .mesa-agency-hero .mesa-agency-hero-grid { grid-template-columns: 1fr; gap: 38px; }
    .mesa-agency-panel { max-width: 650px; width: 100%; justify-self: center; }
    .mesa-infogerance-grid, .mesa-cyber-grid { gap: 0 30px; }
}
@media (max-width:640px) {
    .mesa-agency-hero { padding: 48px 0; }
    .mesa-agency-hero h1 { font-size: clamp(35px,9vw,45px); }
    .mesa-agency-panel { padding: 23px; border-radius: 16px; }
    .mesa-agency-panel > strong { font-size: 27px; }
    .mesa-infogerance-benefits, .mesa-cyber-benefits, .mesa-about-intro, .mesa-contact-section, .mesa-services-page { padding-block: 50px; }
    .mesa-infogerance-grid, .mesa-cyber-grid { grid-template-columns: 1fr; }
    .mesa-contact-form-box { padding: 23px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }

/* Scènes détaillées validées : écrans, équipements et éléments superposés. */
.mesa-agency-illustration { margin: 0; width: 100%; min-width: 0; }
.mesa-agency-illustration img { display: block; width: 100%; height: auto; filter: drop-shadow(0 22px 30px #00122533); }
@media(max-width:960px) { .mesa-agency-illustration { max-width: 580px; justify-self: center; } }
@media(max-width:640px) { .mesa-agency-illustration { margin-block: -12px; } }

/* R7 : préserver les proportions des scènes validées sur tous les écrans. */
.mesa-agency-hero .mesa-agency-hero-grid { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); gap: 42px; }
.mesa-agency-hero h1 { font-weight: 750; overflow-wrap: normal; }
.mesa-agency-illustration img { aspect-ratio: 720 / 520; filter: none; }
@media(max-width:960px) {
    .mesa-agency-hero .mesa-agency-hero-grid { grid-template-columns: minmax(0,1fr); gap: 30px; }
    .mesa-agency-illustration { max-width: 720px; }
}
@media(max-width:640px) {
    .mesa-agency-hero h1 { font-size: clamp(32px,8.2vw,45px); line-height: 1.15; }
    .mesa-agency-illustration { margin-block: 0; }
}
