@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');:root{--navy:#10283e;--ink:#19364a;--cyan:#16a9c6;--sky:#e8f8fb;--muted:#607786;--border:#e0eaf0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'DM Sans',Arial,sans-serif;background:#fff}h1,h2,h3{font-family:Manrope,Arial,sans-serif;letter-spacing:-.04em;line-height:1.15}h1{font-size:clamp(2.6rem,5.4vw,5.2rem);margin:22px 0}h2{font-size:clamp(2rem,3.2vw,3.25rem);margin:0 0 20px}h3{font-size:1.25rem}p{line-height:1.75;color:var(--muted)}a{color:inherit;text-decoration:none}.wrap{max-width:1180px;padding:0 28px;margin:auto}.header{background:white;position:sticky;top:0;z-index:10;border-bottom:1px solid var(--border)}.head-inner{height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{width:138px;height:auto}.nav{display:flex;gap:27px;align-items:center}.nav a{font-size:14px;font-weight:700}.nav a:hover,.nav a.active{color:#0a98b6}.button{display:inline-flex;align-items:center;justify-content:center;padding:16px 25px;border-radius:12px;background:var(--cyan);color:#fff;font-weight:700;border:0;cursor:pointer}.button.secondary{background:white;color:var(--navy);border:1px solid #bcd3dc}.hero{background:linear-gradient(115deg,#f4fbfd 0%,#fff 60%);padding:110px 0 100px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:70px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#078ca8}.lead{font-size:19px;max-width:610px}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.visual{min-height:400px;border-radius:30px;background:linear-gradient(145deg,#0d2c46,#126b87);position:relative;overflow:hidden;box-shadow:0 30px 70px #133b572a}.visual:before{content:'';position:absolute;inset:35px;border:1px solid #ffffff38;border-radius:22px}.visual:after{content:'';position:absolute;width:380px;height:380px;border:1px solid #ffffff3b;border-radius:50%;right:-120px;top:-140px;box-shadow:0 0 0 55px #ffffff09,0 0 0 110px #ffffff08}.visual-content{position:absolute;bottom:45px;left:45px;right:35px;color:white}.visual-content strong{font-size:30px;font-family:Manrope}.visual-content p{color:#c3eaf4}.chip{display:inline-block;border:1px solid #ffffff6e;border-radius:99px;padding:9px 14px;color:white;font-size:12px;margin-bottom:25px}.section{padding:92px 0}.section.alt{background:#f6fafc}.section-head{max-width:730px;margin-bottom:35px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{border:1px solid var(--border);border-radius:20px;padding:32px;background:white;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-4px);box-shadow:0 14px 38px #19364a12}.card .num{font-size:13px;color:var(--cyan);font-weight:800}.card h3{margin:18px 0 12px}.card p{margin:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.panel{border-radius:24px;background:#e9f7fa;padding:55px}.panel ul{line-height:2.3;padding-left:20px}.banner{background:#112e46;color:white;border-radius:26px;padding:55px;display:flex;justify-content:space-between;align-items:center;gap:25px}.banner p{color:#bed5e2}.banner h2{margin:0}.footer{background:#10283e;color:white;padding:55px 0 30px}.footer p,.footer a{color:#bdd0db}.footer-grid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}.footer .logo{background:white;border-radius:10px;padding:7px}.small{font-size:13px}.page-hero{padding:88px 0 70px;background:#f4fbfd}.page-hero h1{max-width:850px}.page-hero p{max-width:720px;font-size:19px}.contact-card{border:1px solid var(--border);border-radius:22px;padding:35px}.form{display:grid;gap:16px}.form label{font-weight:700;font-size:14px}.form input,.form textarea{display:block;width:100%;padding:14px;border:1px solid #cbdde6;border-radius:10px;margin-top:8px;font:inherit}.form textarea{min-height:140px}.note{font-size:13px}.mobile-toggle{display:none}@media(max-width:900px){.hero-grid,.split{grid-template-columns:1fr}.grid{grid-template-columns:1fr 1fr}.nav{gap:12px}.nav a{font-size:12px}.hero{padding:65px 0}.visual{min-height:330px}}@media(max-width:650px){.head-inner{height:75px}.logo{width:115px}.mobile-toggle{display:block;background:none;border:0;font-size:25px;cursor:pointer}.nav{display:none;position:absolute;top:75px;left:0;right:0;background:white;padding:22px;flex-direction:column;align-items:flex-start;box-shadow:0 15px 25px #0001}.nav.open{display:flex}.grid{grid-template-columns:1fr}.section{padding:65px 0}.banner{padding:32px;display:block}.banner .button{margin-top:20px}.visual-content{left:25px}.wrap{padding:0 20px}}

/* BSCOM - Illustrations restaurees */
.card-image {
  display:block;
  width:100%;
  height:185px;
  object-fit:cover;
  border-radius:12px;
  margin:0 0 20px;
}
.visual-photo {
  background:
    linear-gradient(180deg,rgba(10,34,54,.08),rgba(10,34,54,.88)),
    url('/assets/images/accompagnement.webp') center/cover no-repeat;
}
.visual-photo:before,
.visual-photo:after {
  pointer-events:none;
}
@media(max-width:650px) {
  .card-image {height:210px;}
}


/* BSCOM - Harmonisation accueil */

/* Rapprochement des sections */
.hero {
    padding-top: 65px;
    padding-bottom: 45px;
}

.section {
    padding-top: 48px;
    padding-bottom: 48px;
}

/* Espacement des titres */
.section-head {
    margin-bottom: 28px;
}

.section-head h2 {
    margin-bottom: 12px;
}

/* Encadres expertises */
.card {
    display: flex;
    flex-direction: column;
    padding: 28px;
}

.card-image {
    width: 100%;
    height: 185px;
    object-fit: cover;
    border-radius: 12px;
    margin: 0 0 20px;
}

.card h3 {
    margin-top: 14px;
    margin-bottom: 10px;
}

.card p {
    margin: 0 0 10px;
}

/* Separation maintenance applicative */
.card h3 + p + h3 {
    border-top: 1px solid #e0eaf0;
    padding-top: 18px;
    margin-top: 18px;
}

/* Adaptation tablettes */
@media (max-width: 900px) {
    .hero {
        padding-top: 48px;
        padding-bottom: 35px;
    }

    .section {
        padding-top: 40px;
        padding-bottom: 40px;
    }
}

/* Adaptation mobiles */
@media (max-width: 650px) {
    .hero {
        padding-top: 35px;
        padding-bottom: 30px;
    }

    .section {
        padding-top: 35px;
        padding-bottom: 35px;
    }

    .card {
        padding: 24px;
    }
}

/* FIN BSCOM - Harmonisation accueil */


/* BSCOM SERVICES - ESPACEMENTS */

/* Réduire le grand espace après le titre */
.page-services .page-hero {
    padding-top: 45px;
    padding-bottom: 20px;
}

/* Rapprocher les sections */
.page-services .section {
    padding-top: 28px;
    padding-bottom: 28px;
}

/* Titres des sections */
.page-services .section-head {
    margin-bottom: 22px;
}

.page-services .section-head h2 {
    margin-bottom: 10px;
}

/* Encadrés */
.page-services .card {
    padding: 24px;
}

/* Espace avant le bandeau de contact */
.page-services .banner {
    margin-top: 0;
}

/* Tablettes et mobiles */
@media (max-width: 900px) {
    .page-services .page-hero {
        padding-top: 35px;
        padding-bottom: 18px;
    }

    .page-services .section {
        padding-top: 24px;
        padding-bottom: 24px;
    }
}

@media (max-width: 650px) {
    .page-services .page-hero {
        padding-top: 28px;
        padding-bottom: 15px;
    }

    .page-services .section {
        padding-top: 22px;
        padding-bottom: 22px;
    }

    .page-services .card {
        padding: 22px;
    }
}

/* FIN BSCOM SERVICES - ESPACEMENTS */


/* BSCOM POURQUOI - ESPACEMENTS */

.page-pourquoi .page-hero {
    padding-top: 45px;
    padding-bottom: 20px;
}

.page-pourquoi .section {
    padding-top: 28px;
    padding-bottom: 28px;
}

.page-pourquoi .section-head {
    margin-bottom: 22px;
}

.page-pourquoi .card {
    padding: 24px;
}

.page-pourquoi .card p + p {
    margin-top: 10px;
}

@media (max-width: 650px) {
    .page-pourquoi .page-hero {
        padding-top: 28px;
        padding-bottom: 15px;
    }

    .page-pourquoi .section {
        padding-top: 22px;
        padding-bottom: 22px;
    }
}

/* FIN BSCOM POURQUOI - ESPACEMENTS */


/* BSCOM SECTEURS - ESPACEMENTS */

.page-secteurs .page-hero {
    padding-top: 45px;
    padding-bottom: 20px;
}

.page-secteurs .section {
    padding-top: 28px;
    padding-bottom: 28px;
}

.page-secteurs .section-head {
    margin-bottom: 22px;
}

.page-secteurs .card {
    padding: 24px;
}

.page-secteurs .card-image {
    height: 185px;
    object-fit: cover;
}

@media (max-width: 650px) {
    .page-secteurs .page-hero {
        padding-top: 28px;
        padding-bottom: 15px;
    }

    .page-secteurs .section {
        padding-top: 22px;
        padding-bottom: 22px;
    }
}

/* FIN BSCOM SECTEURS - ESPACEMENTS */


/* BSCOM CONTACT - PRESENTATION */

.page-contact .page-hero {
    padding-top: 45px;
    padding-bottom: 20px;
}

.page-contact .section {
    padding-top: 28px;
    padding-bottom: 28px;
}

.bscom-contact-details {
    margin-top: 28px;
}

.bscom-contact-details h3,
.bscom-map h3 {
    margin-bottom: 18px;
}

.bscom-contact-details p {
    margin: 0 0 16px;
}

.bscom-contact-details strong,
.bscom-contact-details span {
    display: block;
}

.bscom-contact-details a {
    color: inherit;
}

.bscom-map {
    margin-top: 28px;
}

.bscom-map iframe {
    display: block;
    width: 100%;
    height: 250px;
    border: 0;
    border-radius: 14px;
    background: #edf3f6;
}

.bscom-map-load {
    margin-top: 12px;
    padding: 12px 18px;
    border: 0;
    border-radius: 10px;
    background: #12344a;
    color: white;
    cursor: pointer;
}

.bscom-map p {
    margin-top: 14px;
}

@media (max-width: 650px) {
    .page-contact .page-hero {
        padding-top: 28px;
        padding-bottom: 15px;
    }

    .page-contact .section {
        padding-top: 22px;
        padding-bottom: 22px;
    }
}

/* FIN BSCOM CONTACT - PRESENTATION */


/* Pages juridiques BSCOM */
.footer .legal-links {
    display: inline-flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-left: 16px;
}
.footer .legal-links a:hover {
    color: white;
    text-decoration: underline;
}
.page-legal .page-hero {
    padding: 65px 0 55px;
}
.page-legal .section {
    padding: 65px 0 85px;
}
.page-legal .legal-content {
    max-width: 850px;
}
.page-legal .legal-content h2 {
    font-size: 1.6rem;
    margin: 38px 0 14px;
}
.page-legal .legal-content h2:first-child {
    margin-top: 0;
}
.page-legal .legal-content p {
    margin: 0 0 18px;
}
.page-legal .legal-content a {
    color: #078ca8;
    text-decoration: underline;
}
@media(max-width:650px) {
    .footer .legal-links {
        display: flex;
        margin: 10px 0 0;
    }
}
