/* ============ Taga — feuille de style partagée ============ */
:root{
  --brand:#E84B1F; --brand-deep:#C53B14; --brand-soft:#FFEAE0;
  --ink:#161310; --ink-2:#3A332D; --ink-soft:#6E665E;
  --bg:#F4F1EC; --surface:#FFFFFF; --line:#EAE6DF;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:'Hanken Grotesk',system-ui,sans-serif;color:var(--ink);background:var(--surface);-webkit-font-smoothing:antialiased;line-height:1.45;}
img{display:block;width:100%;height:100%;object-fit:cover;}
a{text-decoration:none;color:inherit;}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px;}
.mark{font-size:24px;font-weight:800;letter-spacing:-.03em;display:inline-flex;align-items:center;gap:7px;}
.mark i{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--brand);margin-left:2px;}
.mark .lk{width:22px;height:22px;flex-shrink:0;}
.eyebrow{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 26px;border-radius:14px;font-weight:700;font-size:15.5px;border:none;cursor:pointer;font-family:inherit;transition:.15s;}
.btn-p{background:var(--brand);color:#fff;} .btn-p:hover{background:var(--brand-deep);}
.btn-d{background:var(--ink);color:#fff;} .btn-d:hover{background:#000;}
.btn-w{background:#fff;color:var(--ink);} .btn-w:hover{background:#f0ece6;}

/* HEADER (transparent, posé sur un héros photo) */
header{position:absolute;top:0;left:0;right:0;z-index:30;}
.nav{display:flex;align-items:center;gap:30px;height:78px;color:#fff;}
.nav .mark{color:#fff;}
.nav .links{display:flex;gap:26px;margin-left:auto;}
.nav .links a{font-size:14.5px;font-weight:600;opacity:.9;}
.nav .links a:hover,.nav .links a.on{opacity:1;border-bottom:2px solid var(--brand);padding-bottom:2px;}
.nav .pill{background:#fff;color:var(--ink);height:42px;padding:0 18px;border-radius:11px;display:inline-flex;align-items:center;font-weight:700;font-size:14px;}
.navtog{display:none;}
@media(max-width:900px){
  .nav .links{display:none;position:absolute;top:68px;left:16px;right:16px;flex-direction:column;gap:2px;background:#fff;border-radius:16px;padding:10px;box-shadow:0 24px 60px rgba(0,0,0,.35);}
  .nav .links.open{display:flex;}
  .nav .links a{color:var(--ink);opacity:1;font-size:15.5px;font-weight:700;padding:13px 14px;border-radius:11px;}
  .nav .links a:hover,.nav .links a.on{border-bottom:none;padding-bottom:13px;background:var(--brand-soft);color:var(--brand);}
  .navtog{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);cursor:pointer;margin-left:auto;}
}
@media(max-width:560px){
  .hero h1{font-size:34px;} .hero.page h1{font-size:28px;}
  .shead h2{font-size:30px;} .appband h2{font-size:32px;} .cband h2{font-size:30px;}
  .panel{padding:30px;} .split .txt{padding:34px 22px;}
  .finder{flex-wrap:wrap;} .finder .btn{width:100%;}
}

/* HERO */
.hero{position:relative;display:flex;align-items:center;color:#fff;overflow:hidden;}
.hero.big{min-height:620px;}
.hero.page{min-height:440px;}
.hero .bg{position:absolute;inset:0;z-index:0;}
.hero .bg video{width:100%;height:100%;object-fit:cover;}
.hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,12,10,.85) 0%,rgba(15,12,10,.55) 45%,rgba(15,12,10,.18) 100%);}
.hero .inner{position:relative;z-index:1;max-width:640px;}
.hero.big .inner{padding:120px 0 70px;}
.hero.page .inner{padding:130px 0 64px;}
.hero h1{font-size:60px;line-height:1.0;letter-spacing:-.04em;font-weight:800;margin-bottom:16px;}
.hero.page h1{font-size:48px;}
.hero .lead{font-size:19px;opacity:.92;font-weight:500;max-width:470px;margin-bottom:26px;}
@media(max-width:900px){ .hero h1{font-size:40px;} .hero.page h1{font-size:34px;} .hero .inner{padding-top:104px;} }

/* barre d'adresse (style Uber) */
.finder{background:#fff;border-radius:16px;padding:8px;display:flex;gap:8px;max-width:520px;box-shadow:0 20px 50px rgba(0,0,0,.3);}
.finder .f-in{flex:1;display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:11px;padding:0 14px;height:54px;}
.finder .f-in input{border:none;background:none;outline:none;font-family:inherit;font-size:15px;font-weight:600;color:var(--ink);width:100%;}
.finder .btn{height:54px;flex-shrink:0;}

/* badges stores */
.stores{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap;}
.store{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 18px;border-radius:13px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(6px);}
.store small{display:block;font-size:10px;opacity:.85;font-weight:600;line-height:1;}
.store b{font-size:14.5px;font-weight:700;line-height:1.25;}
.store .soon{font-size:8.5px;background:var(--brand);padding:2px 5px;border-radius:5px;margin-left:4px;font-weight:800;}

/* titres de section */
.shead{padding:64px 0 8px;}
.shead h2{font-size:40px;letter-spacing:-.035em;font-weight:800;}
.shead p{font-size:17px;color:var(--ink-soft);font-weight:500;margin-top:6px;}

/* split image + texte */
.split{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:440px;}
.split .pic{position:relative;overflow:hidden;}
.split .pic .tagpill{position:absolute;left:22px;top:22px;background:#fff;color:var(--ink);font-weight:800;font-size:13.5px;padding:7px 14px 7px 9px;border-radius:12px;display:inline-flex;align-items:center;gap:8px;box-shadow:0 8px 20px rgba(0,0,0,.18);}
.split .pic .tagpill img{width:28px;height:28px;object-fit:contain;}
.split .txt{display:flex;flex-direction:column;justify-content:center;padding:60px;}
.split .txt h3{font-size:36px;letter-spacing:-.03em;font-weight:800;line-height:1.05;margin-bottom:14px;}
.split .txt p{font-size:17px;color:var(--ink-soft);font-weight:500;max-width:430px;margin-bottom:24px;}
.split.alt .pic{order:2;}
.split .pic.illus{background:var(--brand-soft);display:flex;align-items:center;justify-content:center;}
.split .pic.illus img{width:84%;height:84%;object-fit:contain;}
@media(max-width:900px){ .split{grid-template-columns:1fr;} .split .pic{min-height:300px;} .split.alt .pic{order:0;} .split .txt{padding:40px 24px;} .split .txt h3{font-size:29px;} }

/* panneaux 3D (colis + location) */
.panels{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:26px 0;}
.panel{border-radius:26px;padding:42px;min-height:330px;display:flex;flex-direction:column;justify-content:space-between;color:#fff;position:relative;overflow:hidden;}
.panel h3{font-size:30px;font-weight:800;letter-spacing:-.03em;}
.panel p{font-size:15.5px;opacity:.92;font-weight:500;max-width:280px;margin-top:8px;}
.panel .art3d{align-self:flex-end;filter:drop-shadow(0 22px 30px rgba(0,0,0,.35));}
.panel .p-icon{width:auto;height:150px;object-fit:contain;align-self:flex-end;filter:drop-shadow(0 18px 26px rgba(0,0,0,.4));}
@media(max-width:760px){ .panels{grid-template-columns:1fr;} }

/* feature list (pages) */
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:54px 0;}
.fcard{background:var(--bg);border-radius:20px;padding:30px 26px;}
.fcard .ic{width:54px;height:54px;border-radius:15px;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.fcard .ic.veh{background:var(--brand);}
.fcard .ic img{width:42px;height:42px;object-fit:contain;}
.fcard b{font-size:18px;font-weight:800;letter-spacing:-.02em;display:block;margin-bottom:6px;}
.fcard span{font-size:14.5px;color:var(--ink-soft);font-weight:500;}
@media(max-width:820px){ .feat{grid-template-columns:1fr;} }

/* étapes */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:30px 0 60px;}
.step{text-align:left;}
.step .n{display:inline-flex;width:40px;height:40px;border-radius:12px;background:var(--ink);color:#fff;align-items:center;justify-content:center;font-weight:800;font-size:16px;margin-bottom:12px;}
.step b{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;margin-bottom:4px;}
.step span{font-size:15px;color:var(--ink-soft);font-weight:500;}
@media(max-width:760px){ .steps{grid-template-columns:1fr;} }

/* app band */
.appband{background:var(--ink);color:#fff;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:520px;overflow:hidden;}
.appband .txt{padding:70px;}
.appband h2{font-size:42px;letter-spacing:-.035em;font-weight:800;margin-bottom:14px;}
.appband p{font-size:17px;color:#C9C1B8;font-weight:500;max-width:380px;margin-bottom:24px;}
.appband .pic{height:520px;position:relative;}
@media(max-width:900px){ .appband{grid-template-columns:1fr;} .appband .txt{padding:44px 24px;} .appband .pic{height:340px;} }

/* CTA duo */
.cta2{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:64px 0;}
.ctaC{position:relative;border-radius:24px;overflow:hidden;min-height:320px;display:flex;align-items:flex-end;}
.ctaC .bg{position:absolute;inset:0;z-index:0;}
.ctaC.dark .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,12,10,.9),rgba(15,12,10,.35));}
.ctaC.warm .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(197,59,20,.92),rgba(232,75,31,.45));}
.ctaC .ct{position:relative;z-index:1;padding:38px;color:#fff;}
.ctaC h3{font-size:28px;font-weight:800;letter-spacing:-.03em;}
.ctaC p{font-size:15px;opacity:.95;font-weight:500;margin:8px 0 18px;max-width:320px;}
@media(max-width:760px){ .cta2{grid-template-columns:1fr;} }

/* bande CTA simple */
.cband{background:var(--brand);color:#fff;text-align:center;padding:70px 24px;}
.cband h2{font-size:38px;font-weight:800;letter-spacing:-.03em;margin-bottom:10px;}
.cband p{font-size:17px;opacity:.95;font-weight:500;margin-bottom:24px;}

/* footer */
footer{background:var(--ink);color:#fff;padding:56px 0 34px;}
.foot{display:flex;flex-wrap:wrap;gap:36px;justify-content:space-between;}
.foot .col b{font-size:12.5px;text-transform:uppercase;letter-spacing:.08em;color:#9A8F84;display:block;margin-bottom:14px;}
.foot .col a{display:block;font-size:15px;color:#E8E2DA;font-weight:600;margin-bottom:10px;}
.foot .col a:hover{color:#fff;}
.copy{margin-top:38px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-size:13px;color:#9A8F84;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}