/* RED'ONE TRANSPORT — site vitrine logistique pharmaceutique */

@font-face{font-family:"Manrope";font-weight:400;font-style:normal;font-display:swap;src:url("polices/manrope-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:500;font-style:normal;font-display:swap;src:url("polices/manrope-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:600;font-style:normal;font-display:swap;src:url("polices/manrope-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:700;font-style:normal;font-display:swap;src:url("polices/manrope-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:800;font-style:normal;font-display:swap;src:url("polices/manrope-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-weight:600;font-style:normal;font-display:swap;src:url("polices/cormorant-garamond-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-weight:700;font-style:normal;font-display:swap;src:url("polices/cormorant-garamond-latin-700-normal.woff2") format("woff2")}

:root{
  --marine:#16243A; --marine-2:#1E2F49; --marine-3:#2E4262; --marine-nuit:#0F1A2B;
  --rouge:#D9363E; --rouge-clair:#FF6166;
  --texte:#16243A; --texte-2:#44516A; --texte-3:#5A6680;
  --gris-fond:#F3F5F8; --bordure:#DDE2EA; --bordure-champ:#B9C2D0;
  --clair-sur-marine:#D6DCE6; --doux-sur-marine:#9FB0C8;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
h1,h2,.chiffre,.num,.lieu,.citation p{font-variant-numeric:lining-nums}
body{margin:0;background:#fff;color:var(--texte);font-family:var(--sans);font-size:16px;line-height:1.5}
img,svg,video{display:block;max-width:100%}
a{color:var(--marine)}a:hover{color:var(--rouge)}
:focus-visible{outline:3px solid var(--rouge-clair);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.evitement{position:absolute;left:16px;top:-60px;background:#fff;color:var(--marine);padding:10px 16px;border-radius:6px;font-weight:700;z-index:10}
.evitement:focus{top:12px}

.conteneur{max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px}
section[id]{scroll-margin-top:16px}
.bloc{padding-top:96px;padding-bottom:96px}
.fond-gris{background:var(--gris-fond)}
.fond-marine{background:var(--marine);color:#fff}

.surtitre{display:flex;align-items:center;gap:12px;margin:0;font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--rouge)}
.fond-marine .surtitre{color:var(--rouge-clair)}
.surtitre.trait::before{content:"";display:inline-block;width:32px;height:2px;background:currentColor}
h1,h2{font-family:var(--serif);font-weight:700;margin:0;line-height:1.1}
h1{font-size:58px;line-height:1.05;letter-spacing:-.5px}
h2{font-size:44px}
h3{margin:0;font-size:18px;font-weight:800;line-height:1.3}
p{margin:0}
.intro{display:flex;flex-direction:column;gap:14px;max-width:720px}
.chapo{font-size:17px;line-height:1.65;color:var(--texte-2)}
.fond-marine .chapo{color:var(--clair-sur-marine)}
.texte{font-size:15px;line-height:1.6;color:var(--texte-2)}
.pile{display:flex;flex-direction:column;gap:48px}

/* Boutons */
.bouton{display:inline-block;text-decoration:none;font-family:var(--sans);font-weight:700;font-size:15px;line-height:1.2;padding:16px 26px;border-radius:6px;border:0;cursor:pointer;text-align:center}
.bouton-rouge{background:var(--rouge);color:#fff}.bouton-rouge:hover{background:#B92A32;color:#fff}
.bouton-marine{background:var(--marine);color:#fff}.bouton-marine:hover{background:#0F1A2B;color:#fff}
.bouton-contour{color:#fff;border:1px solid #5A6B86;padding:15px 24px}.bouton-contour:hover{color:#fff;border-color:#fff}

/* Logo */
.monogramme{font-family:var(--serif);font-weight:700;line-height:1;letter-spacing:1px;display:inline-flex;align-items:center;color:#fff}
.monogramme .croix{color:var(--rouge-clair);margin:0 3px}

/* En-tête */
.entete{background:var(--marine);color:#fff}
.entete .conteneur{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;padding-bottom:18px}
.marque{display:flex;align-items:center;gap:14px;text-decoration:none;color:#fff}
.marque:hover{color:#fff}
.marque .monogramme{font-size:34px}
.marque-texte{display:flex;flex-direction:column;gap:2px}
.marque-nom{font-weight:800;font-size:15px;letter-spacing:2px}
.marque-activite{font-weight:500;font-size:11px;letter-spacing:2px;color:#C9D1DE}
.nav{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;font-size:14px;font-weight:600}
.nav a{color:#fff;text-decoration:none;padding:12px 0}
.nav a:hover{color:var(--rouge-clair)}
.nav a.nav-contact{color:var(--marine);background:#fff;padding:12px 18px;border-radius:6px}
.nav a.nav-contact:hover{background:var(--rouge-clair);color:#fff}

/* Accroche */
.accroche{border-top:1px solid #2A3A55}
.accroche .conteneur{display:flex;flex-wrap:wrap;gap:56px;align-items:center;padding-top:88px;padding-bottom:96px}
.accroche-texte{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:24px}
.accroche-texte .chapo{font-size:18px;line-height:1.6;max-width:560px}
.actions{display:flex;flex-wrap:wrap;gap:14px;padding-top:8px}
.tournee{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:12px}
.tournee-carte{background:var(--marine-2);border:1px solid var(--marine-3);border-radius:10px;padding:22px 24px;margin:0;list-style:none;display:flex;flex-direction:column;gap:14px}
.tournee-titre{font-size:12px;font-weight:700;letter-spacing:2px;color:var(--doux-sur-marine)}
.tournee-ligne{display:flex;justify-content:space-between;gap:12px;font-size:15px;padding-top:14px;border-top:1px solid var(--marine-3)}
.tournee-ligne:first-of-type{border-top:0;padding-top:0}
.tournee-ligne strong{font-weight:700}
.etat-ok{color:#7FD3A4}.etat-route{color:var(--rouge-clair)}.etat-attente{color:var(--doux-sur-marine)}
.legende{font-size:12px;color:var(--doux-sur-marine)}

/* Grilles */
.grille{display:grid;gap:20px}
.grille-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grille-4{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.argument{display:flex;flex-direction:column;gap:10px;border-top:2px solid var(--marine);padding-top:20px}
.carte{border:1px solid var(--bordure);border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:12px;background:#fff}
.carte-blanche{background:#fff;border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:12px}
.chiffre{font-family:var(--serif);font-size:40px;font-weight:700;color:var(--rouge);line-height:1}
.encart{background:#fff;border:1px solid var(--bordure);border-radius:10px;padding:22px 26px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.encart p{flex:1 1 420px;font-size:15px;line-height:1.6;color:#2C3A52}
.encart a{font-weight:700;font-size:15px}
.note{background:var(--gris-fond);border-radius:10px;padding:22px 26px;font-size:15px;line-height:1.6;color:#2C3A52}

/* Démo */
.demo .conteneur{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start}
.demo-media{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;gap:20px}
.video{width:100%;aspect-ratio:16/9;background:var(--marine);border-radius:12px;overflow:hidden}
.video video{width:100%;height:100%;object-fit:cover}
.video-attente{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:#fff;text-align:center;padding:24px}
.video-attente .rond{width:72px;height:72px;border-radius:50%;background:var(--rouge);display:flex;align-items:center;justify-content:center}
.video-attente span{font-size:15px;font-weight:600;color:var(--clair-sur-marine);max-width:380px}
.etapes{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0;padding:0;list-style:none}
.etapes li{display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:1.5;color:var(--texte-2)}
.etapes b{font-size:13px;font-weight:800;color:var(--rouge)}

/* Formulaires */
.formulaire{background:#fff;border:1px solid var(--bordure);border-radius:12px;padding:32px;display:flex;flex-direction:column;gap:16px}
.demo .formulaire{flex:1 1 340px;min-width:0}
.formulaire h3{font-size:22px}
.champ{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700}
.champ .facultatif{font-weight:500;color:var(--texte-3)}
.champ input,.champ textarea{font-family:var(--sans);font-size:16px;padding:12px 14px;border:1px solid var(--bordure-champ);border-radius:6px;color:var(--texte);background:#fff;width:100%}
.champ textarea{resize:vertical;min-height:130px}
.champ input:focus,.champ textarea:focus{outline:none;border-color:var(--marine);box-shadow:0 0 0 3px rgba(22,36,58,.15)}
.piege{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.mention-form{font-size:13px;line-height:1.5;color:var(--texte-3)}
.message{border-radius:8px;padding:14px 16px;font-size:15px;line-height:1.5;font-weight:600}
.message-ok{background:#E7F5EC;color:#1D5E36;border:1px solid #B5DEC4}
.message-erreur{background:#FCEBEC;color:#8E1F25;border:1px solid #F1BEC1}

/* Espace pharmacie */
.liste-num{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));border-top:1px solid var(--bordure);margin:0;padding:0;list-style:none}
.liste-num li{padding:28px 24px 28px 0;border-bottom:1px solid var(--bordure);display:flex;gap:20px}
.liste-num .num{font-family:var(--serif);font-size:34px;font-weight:700;color:var(--rouge);line-height:1}
.liste-num div{display:flex;flex-direction:column;gap:6px}
.liste-num h3{font-size:17px}

/* Tarification */
.tarif{background:var(--marine);color:#fff;border-radius:10px;padding:28px 32px;display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.tarif div{flex:1 1 520px;display:flex;flex-direction:column;gap:8px}
.tarif p{font-size:15px;line-height:1.6;color:var(--clair-sur-marine)}

/* Qui sommes-nous */
.apropos .conteneur{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start}
.apropos-texte{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;gap:18px}
.citation{flex:1 1 320px;min-width:0;border-left:2px solid var(--rouge);padding:8px 0 8px 28px;margin:0;display:flex;flex-direction:column;gap:14px}
.citation p{font-family:var(--serif);font-size:28px;font-weight:600;line-height:1.3;color:var(--marine)}
.citation footer{font-size:14px;font-weight:700;letter-spacing:1px;color:var(--texte-3);text-transform:uppercase}

/* Zone */
.zone .conteneur{display:flex;flex-wrap:wrap;gap:48px;align-items:center;padding-top:88px;padding-bottom:88px}
.zone-texte{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:16px}
.base{flex:1 1 320px;min-width:0;border:1px solid #3A4E6E;border-radius:10px;padding:28px;display:flex;flex-direction:column;gap:6px}
.base .etiquette{font-size:12px;font-weight:700;letter-spacing:2px;color:var(--doux-sur-marine)}
.base .lieu{font-family:var(--serif);font-size:34px;font-weight:700}
.base .detail{font-size:15px;color:var(--clair-sur-marine)}

/* Contact */
.contact .conteneur{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start}
.contact-texte{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
.coordonnees{display:flex;flex-direction:column;gap:10px;padding-top:8px;font-size:16px}
.coordonnees a{font-weight:700}
.coordonnees span{color:var(--texte-2)}
.contact .formulaire{flex:1 1 520px;min-width:0;border:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.contact .formulaire .large{grid-column:1/-1}
.envoi{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}

/* Pied de page */
.pied{background:var(--marine-nuit);color:var(--doux-sur-marine)}
.pied .conteneur{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;padding-top:36px;padding-bottom:36px;font-size:13px;line-height:1.6}
.pied-gauche{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pied .monogramme{font-size:24px}
.pied-liens{display:flex;gap:20px}
.pied a{color:#C9D1DE}.pied a:hover{color:#fff}

/* Pages légales */
.legal{max-width:820px;margin:0 auto;padding:72px 24px 96px;display:flex;flex-direction:column;gap:28px}
.legal h1{font-size:46px}
.legal h2{font-family:var(--sans);font-size:20px;font-weight:800;margin-top:12px}
.legal p,.legal li{font-size:16px;line-height:1.7;color:#2C3A52}
.legal ul{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.legal .retour{font-weight:700;font-size:15px}
.a-completer{background:#FFF4CC;padding:0 4px;border-radius:3px}

/* Mobile */
@media (max-width:720px){
  h1{font-size:40px}
  h2{font-size:34px}
  .bloc{padding-top:64px;padding-bottom:64px}
  .accroche .conteneur{padding-top:56px;padding-bottom:64px;gap:40px}
  .zone .conteneur{padding-top:64px;padding-bottom:64px}
  .entete .conteneur{flex-direction:column;align-items:flex-start}
  .nav{gap:4px 18px}
  .formulaire{padding:24px}
  .tarif{padding:24px}
  .liste-num li{padding-right:0}
  .legal h1{font-size:36px}
  .actions .bouton{flex:1 1 100%}
}
@media (max-width:480px){.liste-num{grid-template-columns:1fr}}