/* Bolt — site de démonstration 360 Web Agency (maquette Figma 26:*) */
:root{
  --navy:#00113a; --navy-2:#002366; --navy-deep:#00152b; --periwinkle:#758dd5;
  --yellow:#fcd400; --yellow-ink:#6e5c00; --gold:#705d00; --gold-light:#ffe16d;
  --bg:#faf8ff; --bg-2:#f4f3f9; --white:#fff;
  --ink:#00113a; --text:#444650; --muted:#757682; --pale:#dbe1ff; --pale-2:#d2e4ff; --footer-text:#c5c6d2;
  --radius:32px; --shadow:0 12px 16px rgba(0,26,51,.05);
  --font-head:"Montserrat",system-ui,sans-serif; --font-body:"Hanken Grotesk",system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 var(--font-body);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5{font-family:var(--font-head);color:var(--ink);margin:0;font-weight:700}
p{margin:0}
.container{max-width:1280px;margin:0 auto;padding:0 24px}
.section{padding:80px 0}
.eyebrow{color:var(--gold);letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}
.h2{font-size:48px;line-height:1.2}
.lead{max-width:672px;margin:16px auto 0;text-align:center}
.center{text-align:center}

/* Bandeau démo */
.demo-bar{background:#111;color:#ddd;font-size:13px;text-align:center;padding:8px 16px}
.demo-bar a{color:var(--yellow);text-decoration:underline}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:56px;padding:0 32px;border-radius:9999px;font-size:16px;cursor:pointer;border:2px solid transparent;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-2px)}
.btn-yellow{background:var(--yellow);color:var(--yellow-ink)}
.btn-outline{border-color:var(--yellow);color:var(--yellow)}
.btn-outline:hover{background:rgba(252,212,0,.1)}
.btn-sm{height:auto;padding:12px 24px}

/* Navigation */
.nav{position:sticky;top:0;z-index:50;background:var(--bg);box-shadow:var(--shadow)}
.nav .inner{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;max-width:1440px;margin:0 auto}
.logo{font-family:var(--font-head);font-weight:800;font-size:64px;line-height:1.1;letter-spacing:-.05em;color:var(--navy)}
.nav .logo{font-size:48px}
.nav ul{display:flex;gap:32px;list-style:none;margin:0;padding:0}
.nav ul a{color:var(--text);padding-bottom:2px;border-bottom:2px solid transparent}
.nav ul a:hover{color:var(--gold)}
.nav ul a.active{color:var(--gold);font-weight:700;border-color:var(--gold)}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:26px;height:3px;background:var(--navy);margin:5px 0;border-radius:2px}

/* Héros */
.hero{position:relative;background:var(--navy);overflow:hidden;padding:120px 0 110px}
.hero::before,.cta-band::before{content:"";position:absolute;inset:0;opacity:.05;background-image:repeating-linear-gradient(54deg,#eee 0 3.5%,transparent 3.5% 50%);background-size:40px 40px;pointer-events:none}
.hero .grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--periwinkle);color:var(--pale);padding:8px 16px;border-radius:9999px}
.hero h1{color:#fff;font-size:64px;line-height:1.1;letter-spacing:-.02em;font-weight:800;margin:33px 0}
.hero .text{color:var(--pale);font-size:18px;line-height:32px;max-width:512px}
.hero .text p+p{margin-top:12px}
.hero .actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:33px}
.hero-photo{position:relative;justify-self:end}
.frame{border:8px solid var(--navy-2);border-radius:48px;padding:8px;overflow:hidden;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);max-width:592px}
.frame img{width:100%;height:600px;object-fit:cover;border-radius:32px}
.float-card{position:absolute;left:-32px;bottom:-46px;background:#fff;border-radius:32px;padding:24px;display:flex;gap:16px;align-items:center;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1)}
.float-card strong{display:block;font:700 32px/1 var(--font-head);color:var(--navy)}
.float-card span{color:#2e4f81}

/* Chiffres */
.stats{background:var(--navy-deep);padding:20px 0}
.stats .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;text-align:center}
.stats strong{display:block;font:700 48px/1.2 var(--font-head);color:var(--yellow)}
.stats span{color:var(--pale-2)}

/* Cartes services */
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;margin-bottom:64px}
.head-row h2{font-size:45px;line-height:1.28}
.head-row p{max-width:448px}
.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow)}
.svc{padding:8px;display:flex;flex-direction:column;gap:24px;transition:transform .2s}
.svc:hover{transform:translateY(-4px)}
.svc>img{height:192px;width:100%;object-fit:cover;border-radius:32px}
.svc .body{padding:0 16px 24px;display:flex;flex-direction:column;gap:8px}
.svc h3{font-size:24px;line-height:36px}
.svc p{padding-bottom:16px}
.round-btn{width:40px;height:40px;border:2px solid var(--pale);border-radius:50%;display:flex;align-items:center;justify-content:center}

/* Pourquoi */
.why{background:var(--bg-2)}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px}
.feature{padding:32px;display:flex;flex-direction:column;gap:8px}
.feature img{height:34px;width:auto;align-self:flex-start}
.feature h4{font-size:20px;line-height:30px;padding-top:8px}

/* Processus */
.process{background:#fff;overflow:hidden}
.process .grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.process h2{margin-bottom:40px}
.steps{display:flex;flex-direction:column;gap:32px}
.step{display:flex;gap:24px}
.step .num{flex:0 0 48px;height:48px;border-radius:50%;background:var(--navy);color:#fff;font:700 20px/48px var(--font-head);text-align:center}
.step h4{font-size:20px;line-height:30px;margin-bottom:8px}
.process-photo{position:relative}
.process-photo img{width:100%;height:500px;object-fit:cover;border-radius:48px;box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}
.seal{position:absolute;top:-24px;right:-24px;width:128px;height:128px;border-radius:50%;background:var(--yellow);color:var(--yellow-ink);display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;transform:rotate(12deg);box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}

/* Avis */
.stars{display:flex;gap:4px;justify-content:center;margin-top:16px}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px}
.quote{border-top:4px solid var(--gold);padding:36px 32px 32px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.quote blockquote{margin:0;font-style:italic}
.who{display:flex;gap:16px;align-items:center}
.who img{width:48px;height:48px;border-radius:50%;background:#e9e7ee}
.who strong{display:block;color:var(--navy);font-weight:400}
.who small{color:var(--muted);font-size:12px}

/* FAQ */
.faq{background:#fff}
.faq .container{max-width:768px}
.faq-list{display:flex;flex-direction:column;gap:16px;margin-top:48px}
.faq details{background:var(--bg);border-radius:32px}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px;cursor:pointer;font:700 20px/30px var(--font-head);color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary img{transition:transform .2s}
.faq details[open] summary img{transform:rotate(180deg)}
.faq details p{padding:0 24px 24px}

/* Bandeau final */
.cta-wrap{background:#fff;padding:0 40px 80px 32px}
.cta-band{position:relative;overflow:hidden;background:var(--navy);border-radius:48px;padding:48px;text-align:center}
.cta-band h2{color:#fff;font-size:48px;line-height:1.2}
.cta-band p{color:var(--pale);font-size:20px;line-height:32px;max-width:860px;margin:24px auto 0}
.cta-band .btn{margin-top:40px;font:700 24px/36px var(--font-head);padding:16px 40px;height:auto}

/* Pied de page */
.footer{background:var(--navy-deep);color:var(--footer-text)}
.footer .top{display:flex;justify-content:space-between;gap:48px;padding:80px 24px}
.footer .logo{color:var(--gold-light);font-size:48px;font-weight:700;letter-spacing:0}
.footer .about{max-width:403px}
.footer .about p{margin-top:24px}
.footer .cols{display:grid;grid-template-columns:repeat(3,auto);gap:48px}
.footer h5{font:400 16px/24px var(--font-body);color:#fff;margin-bottom:16px}
.footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.footer a:hover{color:#fff}
.footer .bottom{border-top:1px solid rgba(255,255,255,.1);padding:33px 24px 32px}

/* En-tête de page intérieure */
.page-hero{position:relative;background:var(--navy);overflow:hidden;padding:120px 0 100px;text-align:center}
.page-hero::before{content:"";position:absolute;inset:0;opacity:.05;background-image:repeating-linear-gradient(54deg,#eee 0 3.5%,transparent 3.5% 50%);background-size:40px 40px}
.page-hero .container{position:relative}
.page-hero h1{color:#fff;font-size:64px;line-height:1.1;font-weight:800;letter-spacing:-.02em;margin:24px 0}
.page-hero p{color:var(--pale);font-size:18px;line-height:32px;max-width:720px;margin:0 auto}

/* Page Services */
.btn-white{border-color:#fff;color:#fff}
.btn-navy{background:var(--navy);color:#fff;height:auto;padding:16px 32px;align-self:flex-start}
.btn-line{border-color:var(--navy);color:var(--navy);height:auto;padding:14px;width:100%}
.btn-line:hover{background:var(--navy);color:#fff}
.tag{display:inline-block;background:var(--yellow);color:var(--yellow-ink);font-size:12px;text-transform:uppercase;letter-spacing:.05em;padding:4px 16px;border-radius:9999px}
.hero-split{padding:80px 0}
.hero-split h1{margin:24px 0}
.hero .text.big{color:var(--periwinkle);font-size:20px;max-width:576px}
.hero-visual{position:relative;border-radius:48px;overflow:hidden;box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}
.hero-visual>img{width:100%;height:592px;object-fit:cover}
.live{position:absolute;left:8px;right:8px;bottom:24px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px;border-radius:32px;background:rgba(250,248,255,.9);backdrop-filter:blur(6px)}
.live small{display:block;color:var(--gold);text-transform:uppercase;font-size:14px}
.live strong{color:var(--navy);font-size:20px}
.svc-row{display:grid;grid-template-columns:7fr 5fr;gap:24px;align-items:center;margin-top:64px}
.svc-row>.svc-text:first-child{order:0}
.svc-row:has(.svc-text:first-child){grid-template-columns:5fr 7fr}
.svc-img{width:100%;height:400px;object-fit:cover;border-radius:32px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
.svc-text{display:flex;flex-direction:column;gap:24px}
.svc-title{display:flex;align-items:center;gap:12px;font-size:32px;line-height:1.3;color:var(--gold)}
.price-box{background:#efedf3;border-left:4px solid var(--gold);border-radius:32px;padding:24px 24px 24px 28px}
.price-box small{display:block;text-transform:uppercase;font-size:14px}
.price-box strong{font-size:30px;line-height:36px;color:var(--navy)}
.checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;color:#1a1b20}
.checks li{display:flex;gap:12px;align-items:center}
.checks li::before{content:"";width:20px;height:20px;flex:0 0 20px;background:url(services/check.svg) center/contain no-repeat}
.svc-row.dark{background:var(--navy-deep);border-radius:32px;padding:80px 48px 48px;position:relative;overflow:hidden}
.svc-row.dark .svc-title{color:var(--yellow);font-size:29px}
.svc-row.dark p{color:#7b92b0}
.svc-row.dark .price-box{background:#122a44;border-color:var(--yellow)}
.svc-row.dark .price-box small{color:#7b92b0}
.svc-row.dark .price-box strong{color:#fff}
.svc-row.dark .checks{color:#fff}
.svc-row.dark .checks li::before{background-image:url(services/check-jaune.svg)}
.svc-row.dark .svc-img{height:450px}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:64px}
.mini{border:1px solid #efedf3;padding:32px 10px 24px;display:flex;flex-direction:column;gap:16px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
.mini>img{height:192px;width:100%;object-fit:cover;border-radius:32px}
.mini h3{display:flex;gap:12px;align-items:center;font-size:24px;padding-top:8px}
.mini p,.mini h3{padding-left:6px;padding-right:6px}
.price-line{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--bg-2);border-radius:32px;padding:16px;color:var(--navy)}
.price-line strong{color:var(--gold);font-size:20px;text-align:right}
.tiers{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tiers div{background:#efedf3;border-radius:32px;padding:16px}
.tiers small{display:block;font-size:12px}
.tiers strong{font-size:20px;color:var(--navy)}
.tiers .hl{background:var(--yellow)}
.tiers .hl small,.tiers .hl strong{color:var(--yellow-ink)}
.tile{position:relative;border-radius:32px;overflow:hidden;display:block}
.tile>img{width:100%;height:453px;object-fit:cover;transition:transform .4s}
.tile:hover>img{transform:scale(1.04)}
.tile>div{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;background:linear-gradient(to top,rgba(0,17,58,.9),rgba(0,17,58,0))}
.tile h3{color:#fff;font-size:32px;margin-bottom:8px}
.tile p{color:var(--periwinkle);margin-bottom:16px}
.tile span{display:flex;gap:8px;align-items:center;color:var(--yellow);text-transform:uppercase}
.strip{background:var(--yellow);padding:48px 0}
.strip .container{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.strip-text{display:flex;gap:24px;align-items:center}
.strip strong{display:block;font-size:24px;color:var(--yellow-ink)}
.strip span{color:#544600}
.strip .btn-navy{font:700 20px/28px var(--font-head)}

/* Page À propos */
.tag-navy{background:var(--navy-2);color:var(--periwinkle);font-size:16px}
.about-hero .grid{display:grid;grid-template-columns:7fr 5fr;gap:24px;align-items:center}
.about-intro{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.about-intro h1{font-size:64px;line-height:1.1;font-weight:800;letter-spacing:-.02em}
.big{font-size:20px;line-height:32px;max-width:672px}
.chips{display:flex;gap:16px;flex-wrap:wrap}
.chip{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid rgba(197,198,210,.3);border-radius:32px;padding:16px;color:var(--navy);box-shadow:var(--shadow)}
.about-photo{position:relative}
.about-photo>img{width:100%;height:500px;object-fit:cover;border-radius:32px;box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}
.badge-99{position:absolute;left:-24px;bottom:-24px;max-width:240px;background:var(--yellow);border-radius:32px;padding:12px 22px 16px 20px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
.badge-99 strong{display:block;font:700 32px/1.3 var(--font-head);color:var(--navy)}
.badge-99 span{color:var(--yellow-ink)}
.bento-wrap{background:var(--bg-2)}
.bento{display:grid;grid-template-columns:2fr 1fr;gap:24px}
.dna{position:relative;overflow:hidden;background:var(--navy);border-radius:32px;padding:48px}
.dna .ghost{position:absolute;right:-80px;bottom:-80px;font:700 240px/1.5 var(--font-head);color:#fff;opacity:.05;pointer-events:none}
.dna h2{color:#fff;font-size:48px;margin-bottom:32px;position:relative}
.dna-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px;position:relative}
.dna h4{color:var(--yellow);font-size:32px;margin-bottom:8px}
.dna p{color:var(--periwinkle)}
.vision{border:1px solid rgba(197,198,210,.3);padding:56px 41px 48px;display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.vision h3{font-size:32px;margin:24px 0 16px}
.vision .sign{border-top:1px solid #c5c6d2;padding-top:32px;color:var(--navy)}
.timeline{position:relative;display:flex;flex-direction:column;gap:80px;margin-top:64px}
.timeline::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:#c5c6d2;transform:translateX(-50%)}
.tl-item{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.tl-item::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:16px;border-radius:50%;background:var(--navy);border:4px solid var(--bg);transform:translate(-50%,-50%)}
.tl-text.right{text-align:right}
.year{display:block;font:800 64px/1.1 var(--font-head);color:rgba(252,212,0,.3);letter-spacing:-.02em;margin-bottom:8px}
.tl-text h3{font-size:32px;margin-bottom:16px}
.tl-img{background:#efedf3;border-radius:32px;padding:24px;margin-left:32px}
.tl-item.flip .tl-img{margin:0 32px 0 0}
.tl-img img{width:100%;height:192px;object-fit:cover;border-radius:6px}
.guarantee{display:flex;gap:40px;align-items:center;background:var(--bg);border:4px solid var(--yellow);outline:4px solid var(--yellow);border-radius:32px;padding:52px;margin:0 4px}
.g-icon{flex:0 0 96px;height:96px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center}
.guarantee h2{font-size:32px;margin-bottom:8px}
.guarantee p{font-size:20px;line-height:32px}
.guarantee .btn{flex:0 0 auto;align-self:center}
.mt{margin-top:16px;max-width:765px}
.link-line{display:flex;gap:8px;align-items:center;color:var(--navy);border-bottom:2px solid var(--navy);padding-bottom:6px;white-space:nowrap}
.team img{width:100%;height:402px;object-fit:cover;border-radius:32px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
.team h4{font-size:32px;line-height:1.3;padding-top:20px}
.team span{color:var(--gold)}
.team p{font-size:14px;line-height:20px;padding-top:8px}
.certs{border-top:1px solid rgba(197,198,210,.3);padding:64px 0;opacity:.5;filter:grayscale(1)}
.certs .container{display:flex;gap:48px;justify-content:center;flex-wrap:wrap}
.certs span{display:flex;gap:12px;align-items:center;font:700 32px/1.3 var(--font-head);color:#1a1b20}

/* Page Réalisations */
.proj-intro{max-width:768px;display:flex;flex-direction:column;gap:24px;align-items:flex-start;padding:40px 0 80px}
.proj-intro h1{font-size:64px;line-height:1.1;font-weight:800;letter-spacing:-.02em}
.proj-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.proj{position:relative;border-radius:32px;overflow:hidden;box-shadow:0 12px 32px rgba(0,26,51,.05);grid-column:span 4}
.proj.wide{grid-column:span 8}
.proj-grid .proj:nth-child(3){grid-column:1/span 4}
.proj-grid .proj:nth-child(4){grid-column:5/span 8}
.proj>img{width:100%;height:457px;object-fit:cover;transition:transform .4s}
.proj:hover>img{transform:scale(1.04)}
.proj>div{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:32px;background:linear-gradient(to top,rgba(0,17,58,.8),rgba(0,17,58,0))}
.pills{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.pill-y{background:var(--yellow);color:var(--yellow-ink);border-radius:9999px;padding:4px 12px}
.pill-g{background:rgba(255,255,255,.2);backdrop-filter:blur(2px);color:#fff;border-radius:9999px;padding:4px 12px}
.proj h3{color:#fff;font-size:32px;line-height:1.3}
.proj h3.sm{font-size:24px;line-height:30px;font-weight:400}
.proj .desc{color:rgba(255,255,255,.8);max-width:448px;padding-top:8px}
.proj .where{display:flex;gap:4px;align-items:center;color:rgba(255,255,255,.7);font-size:14px;padding-top:8px}
.proj-cta{display:flex;justify-content:space-between;align-items:center;gap:32px;background:var(--navy-deep);border-radius:32px;padding:48px;margin-top:160px;position:relative;overflow:hidden}
.proj-cta h2{color:#fff;font-size:40px;line-height:1.4}
.proj-cta p{color:rgba(255,255,255,.7);max-width:600px;margin-top:8px}
.proj-cta .actions{display:flex;gap:16px;flex-wrap:wrap}

/* Page Contact */
.ct-top{display:grid;grid-template-columns:7fr 5fr;gap:24px;align-items:start}
.ct-head{padding:32px 48px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.ct-head h1{font-size:48px;line-height:60px;font-weight:800;letter-spacing:-.02em}
.hotline{position:relative;overflow:hidden;background:var(--navy-deep) url(contact/motif.svg) no-repeat -50px 10px;border-radius:32px;padding:48px}
.hl-eyebrow{display:flex;gap:12px;align-items:center;color:var(--yellow);text-transform:uppercase;letter-spacing:.1em}
.hotline h2{color:#fff;font-size:32px;line-height:1.3;margin:16px 0}
.hl-text{color:#7b92b0;margin-bottom:32px}
.hl-btn{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--yellow);color:var(--yellow-ink);border-radius:32px;padding:12px 24px;font:700 32px/1.3 var(--font-head);letter-spacing:-.025em;max-width:370px}
.ct-main{display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-top:80px;align-items:start}
.ct-form{padding:48px 48px 64px;display:flex;flex-direction:column;gap:24px}
.ct-form h3{font-size:32px;margin-bottom:8px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.ct-form label{display:flex;flex-direction:column;gap:8px;color:#1a1b20}
.ct-form input,.ct-form select,.ct-form textarea{font:inherit;color:#1a1b20;background:var(--bg);border:2px solid transparent;border-radius:32px;padding:16px;outline:none;width:100%}
.ct-form textarea{resize:vertical;min-height:120px}
.ct-form input:focus,.ct-form select:focus,.ct-form textarea:focus{border-color:var(--yellow)}
.ct-form select{appearance:none;background:var(--bg) url(contact/select.svg) no-repeat right 12px center}
.btn-send{background:var(--navy);color:#fff;border:0;border-radius:32px;padding:24px;font:700 32px/1.3 var(--font-head);cursor:pointer;transition:background .2s}
.btn-send:hover{background:var(--navy-2)}
.ok{background:#e7f6ec;color:#11592c;border-radius:16px;padding:12px 16px}
.ct-side{display:flex;flex-direction:column;gap:24px}
.side-card{padding:32px 32px 32px 40px;display:flex;flex-direction:column;gap:8px}
.side-card h4{font:400 18px/28px var(--font-body);color:#1a1b20;padding-top:8px}
.navy-edge{border-left:8px solid var(--navy)}
.yellow-edge{border-left:8px solid var(--yellow)}
.hours{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.hours li{display:flex;justify-content:space-between;gap:12px}
.hours .urg{color:var(--gold)}
.direct{background:#efedf3;border-radius:32px;box-shadow:inset 0 2px 4px rgba(0,0,0,.05);padding:32px;gap:16px}
.direct h4{padding:0;font-size:16px}
.direct p{display:flex;gap:12px;align-items:center;color:#1a1b20}
.zone{display:grid;grid-template-columns:1fr 3fr;overflow:hidden;margin-top:80px;box-shadow:0 12px 32px rgba(0,26,51,.05)}
.zone-text{padding:52px 48px}
.zone-text h3{font-size:32px;line-height:1.3;margin-bottom:16px}
.zone-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.zone-tags span{background:#efedf3;border-radius:9999px;padding:4px 12px}
.zone-map{position:relative;height:400px;background:#e9e7ee}
.zone-map>img{width:100%;height:100%;object-fit:cover;filter:grayscale(1)}
.zone-map::after{content:"";position:absolute;inset:0;background:rgba(0,17,58,.1)}
.pin{position:absolute;z-index:1;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 15px -3px rgba(0,0,0,.1)}
.pin.y{background:var(--yellow)}
.pin.n{background:var(--navy)}
.yellow-cta{position:relative;overflow:hidden;background:var(--yellow);border-radius:32px;padding:64px;text-align:center;margin-top:80px}
.yellow-cta h2{font-size:48px;line-height:1.2;max-width:672px;margin:0 auto}
.yellow-cta p{color:var(--yellow-ink);font-size:20px;line-height:32px;max-width:588px;margin:24px auto 40px}
.yellow-cta .actions{display:flex;gap:24px;justify-content:center;flex-wrap:wrap}
.big-btn{height:auto;padding:22px 40px;border-radius:32px;font:700 32px/1.3 var(--font-head);box-shadow:0 20px 25px -5px rgba(0,0,0,.1)}
.big-btn.navy{background:var(--navy);color:#fff}
.big-btn.white{background:#fff;border-color:var(--navy);color:var(--navy)}

/* Page Tarifs */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.plan{position:relative;padding:40px 32px;display:flex;flex-direction:column;gap:16px;border-top:4px solid transparent}
.plan h3{font-size:28px}
.plan-sub{color:var(--muted)}
.plan-price{font:700 40px/1.2 var(--font-head);color:var(--navy);margin:8px 0}
.plan-price small{font:400 16px var(--font-body);color:var(--text)}
.plan .checks{flex:1;margin-bottom:8px}
.plan .btn{width:100%;height:56px}
.plan.featured{background:var(--navy);border-top-color:var(--yellow);transform:translateY(-12px)}
.plan.featured h3,.plan.featured .plan-price{color:#fff}
.plan.featured .plan-sub,.plan.featured .plan-price small{color:var(--pale)}
.plan.featured .checks{color:#fff}
.plan.featured .checks li::before{background-image:url(services/check-jaune.svg)}
.plan-badge{position:absolute;top:-16px;right:24px;background:var(--yellow);color:var(--yellow-ink);border-radius:9999px;padding:4px 14px;font-size:14px}
.price-table{max-width:860px;margin:48px auto 0;padding:16px 32px}
.price-table div{display:flex;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid #efedf3}
.price-table div:last-child{border:0}
.price-table b{color:var(--gold);white-space:nowrap}

/* Responsive */
@media (max-width:1100px){
  .cards-4{grid-template-columns:repeat(2,1fr)}
  .hero h1,.page-hero h1{font-size:52px}
}
@media (max-width:900px){
  .nav .logo{font-size:36px}
  .burger{display:block}
  .nav ul,.nav .btn{display:none}
  .nav.open ul{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:var(--bg);padding:24px;gap:20px;box-shadow:var(--shadow)}
  .hero{padding:72px 0 96px}
  .hero .grid,.process .grid{grid-template-columns:1fr}
  .hero-photo{justify-self:stretch}
  .frame img{height:420px}
  .float-card{left:16px;bottom:-32px;padding:16px}
  .stats .grid{grid-template-columns:repeat(2,1fr);gap:24px}
  .head-row{flex-direction:column;align-items:flex-start}
  .cards-3,.quotes{grid-template-columns:1fr}
  .footer .top{flex-direction:column}
  .seal{right:8px}
  .svc-row,.svc-row:has(.svc-text:first-child),.duo{grid-template-columns:1fr}
  .svc-row .svc-img{order:-1}
  .svc-row.dark{padding:32px 20px}
  .hero-visual>img{height:420px}
  .tile>img{height:360px}
  .about-hero .grid,.bento,.dna-grid{grid-template-columns:1fr}
  .about-intro h1{font-size:44px}
  .about-photo{margin-bottom:24px}
  .badge-99{left:12px}
  .timeline::before,.tl-item::after{display:none}
  .timeline{gap:48px}
  .tl-item{grid-template-columns:1fr;gap:16px}
  .tl-text.right{text-align:left}
  .tl-img,.tl-item.flip .tl-img{margin:0;order:-1}
  .guarantee{flex-direction:column;align-items:flex-start;padding:32px 24px;gap:24px}
  .guarantee .btn{align-self:flex-start}
  .proj-intro{padding:0 0 40px}
  .proj-intro h1{font-size:44px}
  .proj-grid .proj,.proj-grid .proj.wide,.proj-grid .proj:nth-child(3),.proj-grid .proj:nth-child(4){grid-column:1/-1}
  .proj>img{height:360px}
  .proj>div{padding:24px}
  .proj-cta{flex-direction:column;align-items:flex-start;padding:32px 24px;margin-top:64px}
  .proj-cta h2{font-size:30px}
  .ct-top,.ct-main,.zone{grid-template-columns:1fr}
  .ct-main,.zone,.yellow-cta{margin-top:48px}
  .zone-map{height:300px}
  .plans{grid-template-columns:1fr;gap:32px}
  .plan.featured{transform:none}
}
@media (max-width:600px){
  .ct-head,.hotline,.ct-form,.zone-text{padding:28px 20px}
  .ct-head h1{font-size:34px;line-height:42px}
  .hl-btn{font-size:24px}
  .row2{grid-template-columns:1fr}
  .btn-send,.big-btn{font-size:22px;padding:18px 24px}
  .yellow-cta{padding:40px 20px}
  .yellow-cta h2{font-size:32px}
  .certs span{font-size:22px}
  .dna{padding:32px 24px}
  .dna h4{font-size:26px}
  .team img{height:340px}
}
@media (max-width:600px){
  .section{padding:56px 0}
  .container{padding:0 16px}
  .hero h1,.page-hero h1{font-size:38px}
  .h2,.head-row h2,.cta-band h2{font-size:32px}
  .cards-4{grid-template-columns:1fr}
  .stats strong{font-size:36px}
  .frame{border-radius:32px;border-width:6px}
  .frame img{height:340px;border-radius:24px}
  .process-photo img{height:320px;border-radius:32px}
  .seal{width:100px;height:100px;padding:16px;font-size:14px}
  .cta-wrap{padding:0 16px 56px}
  .cta-band{padding:40px 20px;border-radius:32px}
  .cta-band .btn{font-size:20px;padding:14px 28px}
  .faq summary{font-size:17px;line-height:26px}
  .footer .cols{grid-template-columns:1fr 1fr}
}
