/* ============================================
   BT MULTI SERVICES — style.css
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Lora:ital,wght@0,400;0,500;1,400&display=swap');

:root{
  --navy:      #14212E;
  --indigo:    #1B4A5E;
  --teal:      #1FA6A0;
  --teal-dark: #158E88;
  --cream:     #F0E6D2;
  --red:       #E4432B;
  --ink-soft:  #4A5C68;
  --bg:        #FBF9F4;
  --bg-alt:    #F3EEE3;
  --line:      #E2DCCB;
  --radius:    18px;
  --radius-sm: 10px;
  --shadow:    0 18px 40px -18px rgba(20,33,46,0.22);
  --maxw:      1180px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--bg);
  color:var(--navy);
  font-family:'Lora', Georgia, serif;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.disp{
  font-family:'Poppins', Verdana, sans-serif;
  font-weight:700;
  color:var(--navy);
  line-height:1.12;
  margin:0 0 .5em;
  letter-spacing:-0.01em;
}
h1{ font-size:clamp(2.1rem, 4.4vw, 3.4rem); }
h2{ font-size:clamp(1.6rem, 3vw, 2.3rem); }
h3{ font-size:1.25rem; }
p{ margin:0 0 1.1em; color:var(--ink-soft); }
a{ color:inherit; text-decoration:none; }
img,svg{ max-width:100%; display:block; }
.container{ max-width:var(--maxw); margin:0 auto; padding:0 28px; }
.eyebrow{
  font-family:'Poppins',sans-serif; font-weight:600; font-size:.78rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--teal-dark);
  display:inline-flex; align-items:center; gap:.5em; margin-bottom:1em;
}
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--red); display:inline-block; }

/* Buttons */
.btn{
  font-family:'Poppins',sans-serif; font-weight:600; font-size:.95rem;
  display:inline-flex; align-items:center; gap:.55em;
  padding:.95em 1.7em; border-radius:100px; border:2px solid transparent;
  cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
  white-space:nowrap;
}
.btn-primary{ background:var(--red); color:#fff; }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 22px -8px rgba(228,67,43,.55); }
.btn-ghost{ background:transparent; border-color:rgba(20,33,46,.18); color:var(--navy); }
.btn-ghost:hover{ border-color:var(--navy); }
.btn-light{ background:#fff; color:var(--navy); }
.btn-light:hover{ transform:translateY(-2px); box-shadow:0 10px 22px -8px rgba(0,0,0,.25); }
.btn-teal{ background:var(--teal); color:#fff; }
.btn-teal:hover{ transform:translateY(-2px); box-shadow:0 10px 22px -8px rgba(31,166,160,.5); }

/* Header */
header.site{
  position:sticky; top:0; z-index:50; background:var(--bg);
  border-bottom:1px solid var(--line);
}
.nav-wrap{ display:flex; align-items:center; justify-content:space-between; padding:14px 28px; max-width:var(--maxw); margin:0 auto; }
.brand{ display:flex; align-items:center; gap:.6em; font-family:'Poppins',sans-serif; font-weight:700; font-size:1.15rem; color:var(--navy); }
.brand img{ height:34px; width:auto; }
.brand-logo{ height:46px !important; width:auto; }
nav.main-nav{ display:flex; align-items:center; gap:2.1em; }
nav.main-nav a{ font-family:'Poppins',sans-serif; font-weight:500; font-size:.92rem; color:var(--navy); position:relative; padding:.3em 0; }
nav.main-nav a.active{ color:var(--teal-dark); }
nav.main-nav a:not(.btn)::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--teal);
  transform:scaleX(0); transform-origin:left; transition:transform .2s ease;
}
nav.main-nav a:not(.btn):hover::after, nav.main-nav a.active:not(.btn)::after{ transform:scaleX(1); }
.nav-actions{ display:flex; align-items:center; gap:1.3em; }
.nav-phone{ font-family:'Poppins',sans-serif; font-weight:600; font-size:.92rem; display:flex; align-items:center; gap:.5em; }
.burger{ display:none; }

/* Panneau de navigation mobile : élément indépendant, hors du header, pour ne jamais être piégé par un contexte d'empilement parent (sticky/transform/filter) */
#mobile-nav-panel{ display:none; }

@media (max-width: 880px){
  nav.main-nav{ display:none; }
  .nav-phone{ display:none; }
  .burger{
    display:flex; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px; z-index:60;
  }
  .burger span{ width:24px; height:2px; background:var(--navy); display:block; }

  #mobile-nav-panel{
    position:fixed; top:0; right:0; bottom:0; left:0; background:var(--bg);
    flex-direction:column; justify-content:flex-start; align-items:flex-start;
    padding:5.5em 1.8em 3em; gap:1.3em;
    transform:translateX(100%); transition:transform .25s ease;
    overflow-y:auto; -webkit-overflow-scrolling:touch; z-index:9999;
  }
  #mobile-nav-panel.open{ display:flex; transform:translateX(0); }
  #mobile-nav-panel a{ font-family:'Poppins',sans-serif; font-weight:500; font-size:1.15rem; color:var(--navy); }
  #mobile-nav-panel a.active{ color:var(--teal-dark); }
  .mobile-nav-close{
    position:absolute; top:1.4em; right:1.4em; background:none; border:none; font-size:1.6rem;
    color:var(--navy); cursor:pointer; line-height:1; padding:.2em .4em;
  }
}

/* Ndop ribbon divider — signature element */
.ndop-ribbon{ height:46px; width:100%; background-repeat:repeat-x; background-size:auto 46px; }
.ndop-ribbon.dark{
  background-color:var(--indigo);
  background-image:
    linear-gradient(var(--indigo),var(--indigo)),
    repeating-linear-gradient(90deg, transparent 0 34px, transparent 34px 36px);
}

/* Hero */
.hero{ position:relative; overflow:hidden; padding:64px 0 40px; }
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
@media (max-width:920px){ .hero-grid{ grid-template-columns:1fr; } }
.hero h1{ margin-bottom:.4em; }
.hero .lead{ font-size:1.15rem; max-width:46ch; }
.hero-ctas{ display:flex; gap:1em; flex-wrap:wrap; margin-top:1.6em; }
.hero-art{ position:relative; }
.hero-art .truck{ filter:drop-shadow(0 24px 30px rgba(20,33,46,.18)); }
.truck-photo{ width:100%; height:340px; object-fit:cover; border-radius:var(--radius); box-shadow:var(--shadow); }
.photo-credit{ font-size:.72rem; color:#B9B2A0; margin:.5em 0 0; text-align:right; }

/* Section spacing */
section{ padding:76px 0; }
section.tight{ padding:52px 0; }
.section-head{ max-width:640px; margin:0 auto 3em; text-align:center; }
.section-head.left{ margin:0 0 2.6em; text-align:left; }

/* Service cards */
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
@media (max-width:920px){ .grid-3,.grid-4{ grid-template-columns:1fr 1fr; } }
@media (max-width:620px){ .grid-3,.grid-4{ grid-template-columns:1fr; } }

.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:30px 28px; transition:transform .18s ease, box-shadow .18s ease;
}
.card:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.card .icon{
  width:52px; height:52px; border-radius:14px; background:var(--indigo);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;
}
.card .icon svg{ width:26px; height:26px; }
.card h3{ margin-bottom:.4em; }
.card p{ font-size:.96rem; margin-bottom:.8em; }
.card .tag{
  font-family:'Poppins',sans-serif; font-size:.72rem; font-weight:600; letter-spacing:.06em;
  text-transform:uppercase; color:var(--teal-dark); background:#E8F6F5; padding:.3em .8em; border-radius:100px;
}
.card .tag.soon{ color:#9A6B14; background:#FBEFDA; }

/* Bands */
.band{ background:var(--navy); color:#fff; }
.band h2, .band h3{ color:#fff; }
.band p{ color:#C7D1D8; }
.band-cream{ background:var(--bg-alt); }

/* Clients strip */
.clients-strip{ display:flex; flex-wrap:wrap; gap:14px 34px; justify-content:center; align-items:center; }
.clients-strip a{ text-decoration:none; }
.clients-strip span{
  font-family:'Poppins',sans-serif; font-weight:600; color:var(--navy); font-size:1.02rem; opacity:.82;
  transition:opacity .15s ease, color .15s ease;
}
.clients-strip a:hover span{ opacity:1; color:var(--teal-dark); }

/* Stats */
.stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; text-align:center; }
@media (max-width:700px){ .stats{ grid-template-columns:1fr; } }
.stat b{ font-family:'Poppins',sans-serif; font-size:2.2rem; display:block; color:var(--teal); }
.stat span{ font-family:'Poppins',sans-serif; font-size:.85rem; color:#C7D1D8; text-transform:uppercase; letter-spacing:.08em; }

/* Pricing table (transport froid) */
table.pricing{ width:100%; border-collapse:collapse; background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
table.pricing th{
  background:var(--navy); color:#fff; font-family:'Poppins',sans-serif; font-weight:600; font-size:.85rem;
  text-transform:uppercase; letter-spacing:.05em; padding:14px 18px; text-align:left;
}
table.pricing td{ padding:14px 18px; border-top:1px solid var(--line); font-size:.95rem; }
table.pricing tr:nth-child(even) td{ background:#FAF7F0; }
table.pricing td.price{ font-family:'Poppins',sans-serif; font-weight:600; color:var(--indigo); white-space:nowrap; }

/* Forms */
.form-card{ background:#fff; border:1px solid var(--line); border-radius:var(--radius); padding:36px; box-shadow:var(--shadow); }
.field{ margin-bottom:20px; }
.field label{ font-family:'Poppins',sans-serif; font-weight:500; font-size:.88rem; display:block; margin-bottom:.5em; color:var(--navy); }
.field .hint{ font-size:.8rem; color:#8A8577; margin-top:.35em; }
input,select,textarea{
  width:100%; font-family:'Lora',serif; font-size:1rem; padding:.85em 1em; border-radius:var(--radius-sm);
  border:1.5px solid var(--line); background:#FCFBF8; color:var(--navy); transition:border-color .15s ease;
}
input:focus,select:focus,textarea:focus{ outline:none; border-color:var(--teal); }
textarea{ resize:vertical; min-height:110px; }
.row-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:620px){ .row-2{ grid-template-columns:1fr; } }

.service-picker{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:8px; }
@media (max-width:780px){ .service-picker{ grid-template-columns:1fr 1fr; } }
.service-picker input{ display:none; }
.service-picker label{
  display:flex; flex-direction:column; gap:.4em; padding:16px; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  cursor:pointer; transition:.15s ease; background:#fff;
}
.service-picker label b{ font-family:'Poppins',sans-serif; font-size:.92rem; }
.service-picker label span{ font-size:.78rem; color:#8A8577; }
.service-picker input:checked + label{ border-color:var(--teal); background:#EFFBFA; box-shadow:0 0 0 3px rgba(31,166,160,.15); }

.dyn-fields{ display:none; }
.dyn-fields.active{ display:block; animation:fadeIn .25s ease; }
@keyframes fadeIn{ from{ opacity:0; transform:translateY(4px);} to{ opacity:1; transform:translateY(0);} }

/* Timeline / values (about page) */
.values-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:820px){ .values-grid{ grid-template-columns:1fr; } }

/* Map + contact */
.contact-grid{ display:grid; grid-template-columns:.95fr 1.05fr; gap:44px; align-items:start; }
@media (max-width:920px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-item{ display:flex; gap:16px; align-items:flex-start; margin-bottom:22px; }
.contact-item .ic{ width:44px; height:44px; border-radius:12px; background:var(--teal); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-item .ic svg{ width:20px; height:20px; }
.map-frame{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow); }
.map-frame iframe{ width:100%; height:340px; border:0; display:block; }

/* Footer */
footer.site{ background:var(--navy); color:#C7D1D8; padding:56px 0 26px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; }
@media (max-width:780px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
footer.site h4{ color:#fff; font-size:.95rem; margin-bottom:1em; }
footer.site a{ display:block; color:#AAB8BF; font-size:.9rem; margin-bottom:.7em; font-family:'Poppins',sans-serif; }
footer.site a:hover{ color:#fff; }
.footer-brand img{ height:32px; margin-bottom:14px; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.12); margin-top:40px; padding-top:22px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.78rem; color:#7C8A92; font-family:'Poppins',sans-serif; }

/* Page hero (inner pages) */
.page-hero{ padding:56px 0 40px; }
.page-hero .eyebrow{ margin-bottom:.6em; }
.page-hero p.lead{ max-width:56ch; font-size:1.08rem; }

/* Utility */
.mt-0{ margin-top:0; } .center{ text-align:center; }
.pill-list{ display:flex; flex-wrap:wrap; gap:10px; }
.pill-list li{ list-style:none; }
.pill-list span{
  display:inline-block; background:#fff; border:1px solid var(--line); border-radius:100px; padding:.5em 1em;
  font-family:'Poppins',sans-serif; font-size:.85rem;
}
.icon-check{ color:var(--teal); font-weight:700; margin-right:.4em; }

/* --- Déménagement quote calculator --- */
.access-picker{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
@media (max-width:680px){ .access-picker{ grid-template-columns:1fr; } }
.access-picker input, .formule-picker input{ display:none; }
.access-picker label, .formule-picker label{
  display:flex; flex-direction:column; gap:.3em; padding:14px 16px; border:1.5px solid var(--line); border-radius:var(--radius-sm);
  cursor:pointer; transition:.15s ease; background:#fff;
}
.access-picker label b, .formule-picker label b{ font-family:'Poppins',sans-serif; font-size:.92rem; }
.access-picker label span, .formule-picker label span{ font-size:.78rem; color:#8A8577; line-height:1.4; }
.access-picker input:checked + label, .formule-picker input:checked + label{
  border-color:var(--teal); background:#EFFBFA; box-shadow:0 0 0 3px rgba(31,166,160,.15);
}
.formule-picker{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
@media (max-width:680px){ .formule-picker{ grid-template-columns:1fr; } }

.furniture-grid{ display:flex; flex-direction:column; gap:10px; background:#FCFBF8; border:1px solid var(--line); border-radius:var(--radius-sm); padding:14px 16px; }
.furniture-row{ display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:.9rem; }
.furniture-row i{ font-style:normal; color:#8A8577; font-size:.82rem; margin-left:.4em; }
.qty-mini{ display:flex; align-items:center; gap:10px; }
.qm-btn{
  width:28px; height:28px; border-radius:6px; border:1px solid var(--line); background:#fff;
  font-size:15px; font-weight:700; color:var(--navy); cursor:pointer; line-height:1;
}
.qm-btn:hover{ border-color:var(--teal); color:var(--teal-dark); }
.qm-val{
  width:38px; text-align:center; font-weight:600; font-size:.9rem; font-family:'Poppins',sans-serif;
  border:1.5px solid var(--line); border-radius:6px; padding:4px 2px; -moz-appearance:textfield;
}
.qm-val::-webkit-outer-spin-button, .qm-val::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.qm-val:focus{ outline:none; border-color:var(--teal); }

.price-box{
  margin-top:24px; background:var(--navy); color:#fff; border-radius:var(--radius);
  padding:14px 20px; box-shadow:0 12px 30px -10px rgba(20,33,46,.5); text-align:center;
}
.price-box-label{ font-family:'Poppins',sans-serif; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; opacity:.7; }
.price-box-value{ font-family:'Poppins',sans-serif; font-size:1.4rem; font-weight:700; margin:.15em 0 .3em; }
.price-box-value .price-note{ font-size:.68rem; font-weight:400; opacity:.65; display:block; margin-top:.15em; }
.price-detail-toggle{
  background:none; border:1px solid rgba(255,255,255,.3); color:#fff; border-radius:100px; padding:.3em .9em;
  font-family:'Poppins',sans-serif; font-size:.7rem; cursor:pointer;
}
.price-detail-toggle:hover{ border-color:#fff; }
.price-detail{ list-style:none; padding:0; margin:14px 0 0; text-align:left; font-size:.82rem; border-top:1px solid rgba(255,255,255,.15); padding-top:12px; }
.price-detail li{ display:flex; justify-content:space-between; padding:3px 0; color:#C7D1D8; }
.price-detail li b{ color:#fff; font-weight:600; }