/* ===== T2 « Société pro » — corporate, navy/bleu, CTA ambre ===== */
:root{
  --ink:#1b2a38; --muted:#5a6b7a; --line:#e3e9ef;
  --navy:#123a45; --blue:#1785a0; --blue-d:#0f5f6e; --blue-l:#e8f5f4;
  --cta:#e08a1f; --cta-d:#c67516; --white:#fff; --bg:#f5f8fb;
  --radius:8px; --shadow:0 3px 16px rgba(14,47,79,.09);
  --wrap:1140px;
}
*{box-sizing:border-box}
body.t2{margin:0; font-family:"Segoe UI",Roboto,Arial,sans-serif; color:var(--ink); background:var(--white); line-height:1.62}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 22px}
.coltight{max-width:780px}
h1,h2,h3{line-height:1.22; color:var(--navy); margin:0 0 .5em}
h1{font-size:clamp(1.8rem,4vw,2.6rem)}
h2{font-size:clamp(1.4rem,3vw,2rem)}
a{color:var(--blue-d)}
img{max-width:100%; height:auto}

/* Topbar */
.topbar{background:var(--navy); color:#cfe0f0; font-size:.85rem}
.topbar-inner{display:flex; justify-content:space-between; align-items:center; min-height:40px; gap:16px}
.topbar-left{display:flex; gap:20px; flex-wrap:wrap}
.topbar-left span{display:inline-flex; align-items:center; gap:7px}
.topbar-left b{color:#fff; font-weight:600}
.topbar-tel{display:inline-flex; align-items:center; gap:8px; color:#fff; text-decoration:none; font-weight:700; cursor:pointer}
.topbar-tel .tt-ico{color:var(--cta)}

/* Header */
.hdbar{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:20}
.hd-inner{display:flex; align-items:center; gap:24px; min-height:74px}
.logo{display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--navy); font-weight:800; font-size:1.12rem; letter-spacing:-.01em}
.logo-badge{display:grid; place-items:center; width:40px; height:40px; border-radius:9px; background:linear-gradient(135deg,var(--blue),var(--navy)); color:#fff; font-weight:800}
.logo-badge small{font-size:.62rem}
.nav{display:flex; gap:22px; margin-left:auto}
.nav a{text-decoration:none; color:var(--ink); font-weight:600; font-size:.96rem; padding:6px 0; border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{color:var(--blue); border-color:var(--cta)}
.head-cta{margin-left:8px}

/* Boutons */
.btn{display:inline-block; text-decoration:none; text-align:center; padding:13px 24px; border-radius:var(--radius); font-weight:700; cursor:pointer; border:0; font-size:1rem; transition:background .15s,transform .15s}
.btn-cta{background:var(--cta); color:#fff}
.btn-cta:hover{background:var(--cta-d)}
.btn-primary{background:var(--blue); color:#fff}
.btn-primary:hover{background:var(--blue-d)}
.btn-ghost{background:transparent; color:var(--navy); border:2px solid var(--line)}
.btn-ghost:hover{border-color:var(--blue)}
.btn-light{background:#fff; color:var(--navy)}
.btn-outline-light{background:transparent; color:#fff; border:2px solid rgba(255,255,255,.6)}
.btn-block{display:block; width:100%}
.btn-lg{padding:15px 28px; font-size:1.05rem}

/* Hero */
.mh{background:linear-gradient(120deg,var(--navy),var(--blue-d)); color:#fff; position:relative; overflow:hidden}
.mh::after{content:""; position:absolute; right:-120px; top:-120px; width:380px; height:380px; border-radius:50%; background:rgba(255,255,255,.05)}
.hero-inner{display:grid; grid-template-columns:1.25fr .9fr; gap:40px; align-items:center; padding:56px 0}
.hero-eyebrow{display:inline-block; background:rgba(242,150,13,.16); color:#ffcf87; font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; padding:5px 12px; border-radius:99px; margin-bottom:16px}
.mh h1{color:#fff}
.hero-lead{font-size:1.14rem; color:#d6e4f2; margin-bottom:24px}
.mh-cta{display:flex; flex-wrap:wrap; gap:13px}
.hero-trust{display:flex; gap:24px; margin-top:24px; flex-wrap:wrap}
.hero-trust div{display:flex; flex-direction:column}
.hero-trust b{font-size:1.5rem; color:#fff}
.hero-trust span{font-size:.82rem; color:#aecbe6}
.mh-card{background:#fff; border-radius:14px; box-shadow:0 20px 50px rgba(0,0,0,.28); padding:26px; color:var(--ink)}
.mh-card h3{color:var(--navy); font-size:1.15rem}
.mh-card .ck{margin:14px 0 18px}

/* Bandeau features (pourquoi nous) */
.feat{background:var(--blue-l)}
.feat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding:40px 0}
.feat-item{display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px}
.feat-ico{color:var(--blue); line-height:0}
.feat-ico svg{width:44px; height:44px; stroke-width:1.6}
.feat-item b{color:var(--navy); font-size:1.05rem}
.feat-item span{font-size:.86rem; color:var(--muted)}

/* Sections */
.section{padding:56px 0}
.section-alt{background:var(--bg)}
.section-head{text-align:center; max-width:680px; margin:0 auto 34px}
.section-head p{color:var(--muted)}

/* Grille services */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
.svc-card{background:#fff; border:1px solid var(--line); border-radius:12px; padding:26px; box-shadow:var(--shadow); transition:transform .15s,box-shadow .15s}
.svc-card:hover{transform:translateY(-4px); box-shadow:0 14px 34px rgba(14,47,79,.14)}
.svc-card .svc-ico{width:52px; height:52px; border-radius:11px; background:var(--blue-l); color:var(--blue); display:grid; place-items:center; margin-bottom:14px}
.svc-card .svc-ico svg{width:28px;height:28px;stroke-width:1.7}
.svc-card h3{font-size:1.15rem}
.svc-card p{color:var(--muted); font-size:.96rem}

/* Process */
.steps-h{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; counter-reset:st}
.step{position:relative; padding:26px 20px 20px; background:#fff; border:1px solid var(--line); border-radius:12px}
.step::before{counter-increment:st; content:counter(st); position:absolute; top:-16px; left:20px; width:34px; height:34px; border-radius:50%; background:var(--cta); color:#fff; display:grid; place-items:center; font-weight:800}
.step h3{font-size:1.05rem; margin-top:6px}
.step p{font-size:.92rem; color:var(--muted); margin:0}

/* Form band */
.formband{background:var(--navy); color:#fff}
.formband-inner{display:grid; grid-template-columns:1fr 1.1fr; gap:40px; align-items:center; padding:48px 0}
.formband h2{color:#fff}
.formband p{color:#c7d7e6}
.reqform{display:grid; gap:14px; background:#fff; padding:26px; border-radius:14px; color:var(--ink)}
.reqform.grid2{grid-template-columns:1fr 1fr}
.reqform .full{grid-column:1/-1}
.reqform label{display:block; font-size:.86rem; font-weight:700; color:var(--navy)}
.reqform select,.reqform input,.reqform textarea{width:100%; margin-top:6px; padding:12px 13px; border:1.5px solid var(--line); border-radius:8px; font-size:1rem; font-family:inherit; background:var(--bg)}
.reqform select:focus,.reqform input:focus,.reqform textarea:focus{outline:none; border-color:var(--blue); background:#fff; box-shadow:0 0 0 3px rgba(22,104,176,.12)}
.reqform textarea{min-height:110px; resize:vertical}
.fnote{font-size:.8rem; color:var(--muted); text-align:center; margin:0}
.hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}

/* Tick */
.ck{list-style:none; padding:0; margin:0}
.ck li{position:relative; padding-left:26px; margin-bottom:9px}
.ck li::before{content:""; position:absolute; left:0; top:7px; width:14px; height:14px; border-radius:50%; background:var(--blue); box-shadow:inset 0 0 0 2px #fff, 0 0 0 2px var(--blue)}
.ck2{columns:2; column-gap:34px}
.ck2 li{break-inside:avoid}

/* Guides vignettes */
.gx-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:8px}
.gx-card{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:12px; overflow:hidden; text-decoration:none; color:inherit; box-shadow:var(--shadow); transition:transform .15s}
.gx-card:hover{transform:translateY(-4px)}
.gx-card img{width:100%; height:150px; object-fit:cover}
.gx-body{padding:16px; display:flex; flex-direction:column; gap:6px; flex:1}
.gx-body h3{font-size:1.02rem; margin:0}
.gx-body p{font-size:.88rem; color:var(--muted); margin:0; flex:1}
.gx-body span{color:var(--blue); font-weight:700; font-size:.88rem}

/* FAQ */
.qa details{background:#fff; border:1px solid var(--line); border-radius:10px; margin-bottom:12px}
.qa summary{cursor:pointer; padding:16px 46px 16px 18px; font-weight:700; color:var(--navy); list-style:none; position:relative}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+"; position:absolute; right:18px; top:13px; font-size:1.4rem; color:var(--cta)}
.qa details[open] summary::after{content:"–"}
.qa details p{padding:0 18px 16px; margin:0; color:var(--muted)}

/* Page interne */
.pghead{background:linear-gradient(120deg,var(--navy),var(--blue-d)); color:#fff; padding:44px 0}
.pghead .kicker{color:#ffcf87; text-transform:uppercase; letter-spacing:.06em; font-weight:700; font-size:.8rem}
.pghead h1{color:#fff; margin:.3em 0 .2em}
.pghead .intro{color:#d6e4f2; max-width:760px}
.pgfig{margin:26px 0 0}
.pgfig img{width:100%; max-height:340px; object-fit:cover; border-radius:12px; box-shadow:var(--shadow)}
.pgfig figcaption{margin-top:8px; font-size:.85rem; color:var(--muted); text-align:center; font-style:italic}
.legalblk h2{font-size:1.2rem; margin-top:1.5em}
.legalblk p{color:var(--muted)}
.notebox{background:var(--blue-l); border-left:3px solid var(--blue); padding:14px 18px; border-radius:0 8px 8px 0; color:var(--ink); margin-top:22px}
.xarrow{font-weight:700; text-decoration:none; color:var(--blue-d)}
.xarrow::after{content:" →"}
.xlink{color:var(--blue-d); font-weight:600; text-decoration:underline}

/* Prix */
.ratetable{border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:22px 0}
.raterow{display:flex; justify-content:space-between; gap:16px; padding:15px 18px; border-bottom:1px solid var(--line)}
.raterow:last-child{border-bottom:0}
.raterow:nth-child(odd){background:var(--bg)}
.raterow .ratename{font-weight:600; color:var(--navy)}
.raterow .ratename small{display:block; font-weight:400; color:var(--muted); font-size:.85rem}
.raterow .rateval{white-space:nowrap; font-weight:800; color:var(--blue); font-size:1.05rem}

/* CTA band */
.cta-band{background:linear-gradient(120deg,var(--blue),var(--blue-d)); color:#fff; padding:52px 0; text-align:center}
.cta-band h2{color:#fff}
.cta-band p{color:#dbe8f5; max-width:620px; margin:0 auto 22px}
.cta-band .mh-cta{justify-content:center}

/* Footer */
.ftbar{background:var(--navy); color:#b9cadb; padding:46px 0 20px; font-size:.93rem}
.ft-cols{display:grid; grid-template-columns:1.6fr 1fr 1fr 1.1fr; gap:28px}
.ftbar h4{color:#fff; font-size:1rem; margin:0 0 12px}
.ftbar .logo-name{color:#fff; font-weight:800; font-size:1.1rem}
.ftbar nav{display:flex; flex-direction:column; gap:8px}
.ftbar a{color:#b9cadb; text-decoration:none}
.ftbar a:hover{color:#fff}
.ft-legal{text-align:center; border-top:1px solid rgba(255,255,255,.12); margin-top:28px; padding-top:16px; font-size:.82rem; color:#8ba3ba}

/* Numéro dévoilé */
.nv-shown{display:inline-flex!important; align-items:center; gap:9px; cursor:default!important}
.nv-shown canvas{vertical-align:middle}
.topbar-tel .tt-num,.btn .tel-num{display:inline-flex; align-items:center}

/* Responsive */
@media(max-width:900px){
  .hero-inner{grid-template-columns:1fr; gap:28px}
  .nav,.head-cta,.topbar-left{display:none}
  .feat-grid{grid-template-columns:repeat(2,1fr); gap:26px}
  .svc-grid{grid-template-columns:1fr}
  .steps-h{grid-template-columns:1fr 1fr}
  .formband-inner{grid-template-columns:1fr; gap:26px}
  .gx-grid{grid-template-columns:repeat(2,1fr)}
  .ft-cols{grid-template-columns:1fr 1fr}
  .reqform.grid2{grid-template-columns:1fr}
}
@media(max-width:520px){
  .feat-grid,.steps-h,.gx-grid,.ft-cols{grid-template-columns:1fr}
  .ck2{columns:1}
}

/* Lisibilité des liens sur fonds foncés (hero, page-head, bande formulaire, CTA) */
.mh a:not(.btn), .pghead a:not(.btn), .formband a:not(.btn), .cta-band a:not(.btn){ color:#ffb43d; font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.mh a:not(.btn):hover, .pghead a:not(.btn):hover, .formband a:not(.btn):hover, .cta-band a:not(.btn):hover{ color:#fff; }