/* Take Up : site clients (centrale VTC). */

/* Accueil */
.client-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr);gap:clamp(32px,5vw,64px);align-items:center;padding-block:clamp(28px,4vw,56px) clamp(64px,7vw,96px)}
.hours{display:inline-flex;align-items:center;gap:12px;padding:10px 22px 10px 18px;border:1px solid #417d6e;border-radius:60px;background:linear-gradient(180deg,#14403a,#0f302b);font-size:clamp(16px,1.6vw,20px);line-height:1.3;font-weight:500}
.hours strong{font-weight:640;color:#7cecd4}
.hours::before{content:"";flex-shrink:0;width:10px;height:10px;border-radius:50%;background:#63dfc3;animation:hours-pulse 2.4s ease-out infinite}
@keyframes hours-pulse{0%{box-shadow:0 0 0 0 #63dfc380}70%,100%{box-shadow:0 0 0 12px #63dfc300}}
.client-hero .eyebrow{margin-top:26px}
.client-hero h1{margin-top:14px;font-size:clamp(44px,5.4vw,76px);font-weight:700;text-wrap:initial}
.client-hero .lead{max-width:50ch;margin-top:20px}
.call-buttons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:600px;margin-top:28px}
.notice{display:flex;gap:12px;align-items:flex-start;max-width:560px;margin-top:22px;color:var(--white-soft)}
.notice svg{flex-shrink:0;width:20px;height:20px;margin-top:3px;color:var(--mint-hi)}
.notice strong{display:block;color:var(--white)}
.driver-link{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font-weight:600;text-decoration:underline;text-underline-offset:4px}
.driver-link:hover{color:var(--mint-hi)}
.driver-link svg{width:17px;height:17px}
.city-card{position:relative;aspect-ratio:1.08;border:1px solid #2a524f;border-radius:16px;overflow:hidden;transform:rotate(-3deg);box-shadow:0 35px 85px #00100e66}
.city-card>svg{width:100%;height:100%}
.city-card__route{stroke-dasharray:1;stroke-dashoffset:1;animation:city-route 2.2s var(--ease) .3s forwards}
.city-card__end{transform-box:fill-box;transform-origin:center;animation:city-end 2.8s ease-out 2.2s infinite}
@keyframes city-route{to{stroke-dashoffset:0}}
@keyframes city-end{from{transform:scale(.7);opacity:.5}to{transform:scale(2.2);opacity:0}}
.city-card__note{position:absolute;top:24px;left:24px;font-size:13px;letter-spacing:.12em}
.city-card__label{position:absolute;left:24px;bottom:42px;display:flex;align-items:center;gap:14px;padding:14px 20px;border:1px solid #4a6b67;border-radius:8px;background:#091c20f0;transform:rotate(3deg);box-shadow:0 15px 45px #0005}
.city-card__label img{width:36px;height:36px}
.city-card__label span{display:grid;font-size:15px;color:var(--white-soft)}
.city-card__label strong{font-size:19px;color:var(--white)}

/* Préparer un trajet */
.request{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(32px,6vw,92px);align-items:start;padding-block:clamp(64px,7vw,96px)}
.request-section{scroll-margin-top:var(--header)}
.request__intro h2{margin-top:12px;font-size:clamp(36px,4.2vw,58px)}
.request__intro>p:not(.eyebrow){max-width:44ch;margin-top:18px;font-size:18px;color:var(--ink-soft)}
.request-steps{display:grid;gap:22px;margin-top:32px}
.request-steps li{display:flex;gap:16px}
.request-steps li>span{display:grid;place-items:center;flex-shrink:0;width:38px;height:38px;border:2px solid #007a6c;border-radius:50%;font-weight:640;color:#00695d}
.request-steps strong{display:block;font-size:18px}
.request-steps p{color:var(--ink-soft);line-height:1.45}

.assurances{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);padding-block:clamp(56px,6vw,84px)}
.assurances svg{width:28px;height:28px;color:var(--mint-hi)}
.assurances h2{margin-top:14px;font-family:var(--display);font-size:clamp(23px,2.2vw,29px);font-weight:660;letter-spacing:-.012em;line-height:1.15}
.assurances p{margin-top:6px;color:var(--white-soft)}

/* Réseau : carte de Lyon et carte de France */
.demo-head h2{font-size:clamp(32px,3.8vw,50px)}
.demo-head{text-align:center;max-width:760px;margin:0 auto 30px}
.lyon-count small,.lyon-legend,.detail-name span,.detail-car span{font-size:14px}
.lyon-hint,.lyon-detail{font-size:15px}
.france-status{font-size:15px}
.demo-note{font-size:15px}

/* Écrire à la centrale */
.reach{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:start;padding-block:clamp(64px,8vw,104px)}
.reach h2{margin-top:12px;font-size:clamp(36px,4.2vw,58px)}
.reach .lead{max-width:44ch;margin-top:18px}
.reach .call-buttons{max-width:none}
.card-form{display:grid;gap:16px;padding:clamp(22px,3vw,32px);border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.on-paper .card-form{border-color:#bcd2cc;background:#fff}
.card-form h3{font-family:var(--display);font-size:clamp(24px,2.4vw,30px);font-weight:660;letter-spacing:-.012em;line-height:1.15}
.card-form .btn{width:100%}
.card-form .check a{text-decoration:underline;text-underline-offset:3px}
.done{display:grid;gap:10px;padding:clamp(24px,3vw,34px);border:1px solid #2f9d84;border-radius:16px;background:#0e3a31}
.on-paper .done{background:#e0f6ee;color:#0b3a30}
.done h3{font-family:var(--display);font-size:26px;font-weight:660;line-height:1.2}
.done:focus{outline:none}

/* Contact */
.contact-page{min-height:60vh}
.contact-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,6vw,92px);align-items:start;padding-block:clamp(44px,6vw,84px)}
.contact-grid h1{font-size:clamp(42px,5.4vw,76px);font-weight:700}
.contact-grid .lead{margin-top:20px}
.contact-route{margin-top:30px}
.contact-route svg{width:100%;max-width:440px;height:auto}
.contact-route path{stroke-dasharray:1;stroke-dashoffset:1;animation:city-route 2s var(--ease) .2s forwards}
.contact-promise{display:flex;align-items:center;gap:18px;margin-top:22px}
.contact-promise strong{font-family:var(--display);font-size:clamp(44px,5vw,64px);font-weight:720;letter-spacing:-.03em;line-height:1;color:#00695d}

/* Publicité */
.ad-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,6vw,84px);align-items:end}
.ad-screen{padding:12px;border:1px solid var(--line);border-radius:18px;background:#040d0f;transform:rotate(2deg)}
.ad-screen__inner{display:grid;gap:8px;align-content:center;aspect-ratio:16/10;padding:clamp(18px,3vw,30px);border-radius:10px;background:radial-gradient(ellipse at 70% 30%,#14574e,#0a2a2c 70%)}
.ad-screen small{font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--mint-hi)}
.ad-screen strong{font-family:var(--display);font-size:clamp(26px,3vw,38px);font-weight:680;letter-spacing:-.015em;line-height:1.1}
.ad-reasons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,44px);padding-block:clamp(40px,5vw,64px)}
.ad-reasons h2{font-family:var(--display);font-size:clamp(22px,2vw,27px);font-weight:660;line-height:1.15}
.ad-reasons p{margin-top:6px;color:var(--white-soft)}
.ad-packs{padding-block:clamp(56px,7vw,92px)}
.ad-packs>.container>h2{font-size:clamp(34px,4vw,56px)}
.ad-packs__lead{max-width:60ch;margin-top:12px}
.ad-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:30px}
.ad-pack{display:flex;flex-direction:column;gap:10px;padding:clamp(20px,2.4vw,28px);border:1px solid #bcd2cc;border-radius:14px;background:#fff}
.ad-pack h3{font-family:var(--display);font-size:clamp(25px,2.4vw,31px);font-weight:680;letter-spacing:-.015em;line-height:1.1}
.ad-pack__scope{font-weight:640;color:#00695d}
.ad-pack ul{display:grid;gap:7px;margin-block:4px 14px}
.ad-pack li{position:relative;padding-left:24px;line-height:1.4}
.ad-pack li::before{content:"";position:absolute;left:2px;top:.36em;width:11px;height:6px;border-left:2px solid #00806f;border-bottom:2px solid #00806f;transform:rotate(-45deg)}
.ad-pack__quote{margin-top:auto;font-weight:680}
.ad-form-section{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,88px);align-items:start;padding-block:clamp(56px,7vw,92px)}
.ad-form-section h2{font-size:clamp(32px,3.8vw,52px)}
.ad-form-section .lead{margin-top:16px}
.ad-form-section a{text-decoration:underline;text-underline-offset:3px}

/* Offres partenaires */
.offers{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding-bottom:clamp(40px,5vw,64px)}
.offer{--r:11px;position:relative;display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px 16px;align-items:center;padding:20px;border-radius:14px;background:var(--paper);color:var(--ink);-webkit-mask:radial-gradient(circle var(--r) at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--r) at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle var(--r) at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(circle var(--r) at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat}
.offers-empty{max-width:68ch;margin-bottom:20px;padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--white-soft)}
.offers-empty strong{color:var(--white)}
.offer__logo{display:grid;place-items:center;width:96px;height:96px;border:2px dashed #7f9f98;border-radius:12px;font-size:14px;font-weight:600;line-height:1.2;text-align:center}
.offer__logo--image{padding:6px;border:0;background:#fff}
.offer__logo--image img{width:100%;height:100%;object-fit:contain}
.offer__value{font-family:var(--display);font-size:32px;font-weight:720;letter-spacing:-.02em;line-height:1;color:#00695d}
.offer h2{font-size:19px;font-weight:660;line-height:1.25}
.offer__desc{grid-column:1/-1;font-size:16px;line-height:1.45}
.offer__code{grid-column:1/-1;font-size:15px;line-height:1.5}
.offer__code strong{display:inline-block;padding:1px 9px;border:2px dashed #7f9f98;border-radius:7px;font-weight:680;letter-spacing:.04em}
.offer__terms{grid-column:1/-1;font-size:15px;line-height:1.4;color:var(--ink-soft)}
.offer__tag{grid-column:1/-1;font-size:14px;font-weight:640;letter-spacing:.08em;text-transform:uppercase;color:#00695d}
.offers-join{display:flex;flex-wrap:wrap;justify-content:space-between;gap:18px;align-items:center;margin-bottom:clamp(56px,7vw,92px);padding:clamp(22px,3vw,32px);border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.offers-join h2{font-family:var(--display);font-size:clamp(24px,2.6vw,32px);font-weight:660;line-height:1.15}
.offers-join p{color:var(--white-soft)}

@media(max-width:980px){
  .client-hero,.request,.reach,.contact-grid,.ad-hero,.ad-form-section{grid-template-columns:minmax(0,1fr)}
  .city-card{max-width:520px;transform:rotate(-1.5deg)}
  .ad-grid,.ad-reasons,.assurances{grid-template-columns:minmax(0,1fr)}
  .ad-screen{max-width:520px;transform:none}
}
@media(max-width:560px){
  .hours{display:inline-block;padding:12px 18px;border-radius:22px;font-size:16px;text-align:left}
  .hours::before{display:inline-block;vertical-align:middle;margin:-3px 9px 0 0}
  .hours strong{display:inline}
  .call-buttons{grid-template-columns:minmax(0,1fr)}
}
