/* Carnets de route — bannière [carnet_de_route] */
@font-face{ font-family:'CDR Serif'; src:url(../assets/fonts/instrument-serif-latin-400-normal.woff2) format('woff2'); font-weight:400; font-style:normal; font-display:swap; }
@font-face{ font-family:'CDR Serif'; src:url(../assets/fonts/instrument-serif-latin-400-italic.woff2) format('woff2'); font-weight:400; font-style:italic; font-display:swap; }
.cdr-teaser{ --cdr-accent:#f2b36b; position:relative; display:flex; align-items:flex-end; min-height:clamp(260px, 42vw, 440px); margin:2em 0; border-radius:18px; overflow:hidden; background:#10141b; color:#f4efe6 !important; text-decoration:none !important; isolation:isolate; box-shadow:0 18px 50px rgba(0,0,0,.18); }
.cdr-teaser__bg{ position:absolute; inset:0; background-size:cover; background-position:center; transition:transform 1.2s cubic-bezier(.2,.7,.2,1); z-index:-2; }
.cdr-teaser:hover .cdr-teaser__bg{ transform:scale(1.05); }
.cdr-teaser__shade{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,10,14,.78) 0%, rgba(8,10,14,.35) 55%, rgba(8,10,14,.1) 100%), linear-gradient(0deg, rgba(8,10,14,.6), rgba(8,10,14,0) 60%); z-index:-1; }
.cdr-teaser__body{ display:flex; flex-direction:column; gap:10px; padding:clamp(22px, 4vw, 44px); max-width:620px; }
.cdr-teaser__kicker{ font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--cdr-accent); }
.cdr-teaser__title{ font-family:'CDR Serif', Georgia, 'Times New Roman', serif; font-size:clamp(34px, 5vw, 60px); line-height:.95; letter-spacing:-.015em; }
.cdr-teaser__title em{ font-style:italic; color:var(--cdr-accent); }
.cdr-teaser__btn{ align-self:flex-start; margin-top:12px; padding:12px 20px; border-radius:999px; background:#f4efe6; color:#0b0d11; font-weight:700; font-size:15px; transition:transform .25s; }
.cdr-teaser:hover .cdr-teaser__btn{ transform:translateY(-2px); }
.cdr-teaser__route{ position:absolute; right:clamp(16px, 3vw, 36px); top:clamp(16px, 3vw, 36px); width:clamp(120px, 20vw, 220px); height:auto; opacity:.9; overflow:visible; }
.cdr-teaser__route polyline{ fill:none; stroke:var(--cdr-accent); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 6px rgba(0,0,0,.5)); }
.cdr-teaser__route circle{ fill:#10141b; stroke:var(--cdr-accent); stroke-width:1.6; }
@media (max-width: 600px){ .cdr-teaser__route{ width:110px; opacity:.75; } }
@media (prefers-reduced-motion: reduce){ .cdr-teaser__bg, .cdr-teaser__btn{ transition:none; } }
