/* Adaptation de l’accueil Ducatibox index-3 : voiture, services, moteur et blocs d’atelier. */
.wptb-slider.style3.bd-ignition {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    text-align: center;
    padding: clamp(3rem, 5.5vw, 5rem) 0 clamp(2rem, 4vw, 3rem);
    background: linear-gradient(180deg, #08080936, #08080938 56%, #101012 99%), url('../img/bandeau.jpg') center 48% / cover;
    border-bottom: 2px solid var(--color-one);
}
.ignition-copy { position: relative; z-index: 1; }
.ignition-copy .eyebrow, .center-heading .eyebrow { justify-content: center; }
.ignition-copy h1 { font-size: clamp(2rem, 5.1vw, 4.45rem); line-height: 1.05; margin-bottom: 0; }
.ignition-copy h1 em { color: #f9f9f9; }
.ignition-car { position: relative; width: min(100%, 1280px); margin: .65rem auto -.35rem; }
.ignition-car .car-body { display: block; width: 100%; height: auto; }
.ignition-car .car-light {
    position: absolute;
    inset: 24% 4% auto;
    width: 92%;
    height: auto;
    opacity: .88;
    mix-blend-mode: screen;
    animation: ignition 3.8s ease-out both;
}
.ignition-car.lights-off .car-light { animation: none; opacity: 0; }
@keyframes ignition {
    0%, 15% { opacity: 0; }
    35% { opacity: 1; }
    55% { opacity: .28; }
    100% { opacity: .88; }
}
.ignition-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .7rem 1.15rem; }
.ignition-toggle, .carousel-controls button, .ticker-toggle {
    color: #fff;
    background: #19191c;
    border: 1px solid #55555a;
    padding: .45rem .7rem;
    font-weight: 700;
    cursor: pointer;
}
.ignition-toggle:hover, .carousel-controls button:hover, .ticker-toggle:hover { border-color: #ff6c70; }

.bd-workshop { overflow: hidden; }
.workshop-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.55fr) minmax(0, .8fr); align-items: center; gap: clamp(1.5rem, 4vw, 3.5rem); }
.workshop-layout img { width: 100%; max-height: 370px; object-fit: contain; }
.workshop-copy h2, .section-heading-row h2, .engine-section h2, .center-heading h2, .faq-section h2 {
    font-size: clamp(2rem, 4.3vw, 3.65rem);
    line-height: 1.06;
    margin: 0 0 .8rem;
}
.workshop-detail { align-self: end; transform: translateY(8%); }
.photo-services {
    background: #18181a url('../img/background/bg-1.png') center / cover no-repeat;
    border-top: 1px solid var(--bd-line);
}
.section-heading-row { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; margin-bottom: 1.75rem; }
.section-heading-row h2 { margin: 0; }
.photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem; }
.service-photo { display: grid; align-items: end; position: relative; min-height: clamp(310px, 31vw, 400px); overflow: hidden; background: #181b20; }
.service-photo > img, .service-photo::after { position: absolute; inset: 0; width: 100%; height: 100%; }
.service-photo > img { height: 76%; object-fit: cover; object-position: center; transition: transform .4s ease; }
.service-photo::after { content: ''; background: linear-gradient(0deg, #101115 8%, #101115f5 26%, #10111500 61%); }
.service-photo:hover > img, .service-photo:focus-visible > img { transform: scale(1.07); }
.service-photo:hover::after, .service-photo:focus-visible::after { background: linear-gradient(0deg, #58171c 6%, #3a1418eb 26%, #10111500 63%); }
.service-photo-content { position: relative; z-index: 1; padding: clamp(1rem, 3vw, 1.8rem); color: #fff; }
.service-photo h3 { font-size: clamp(1.3rem, 2.35vw, 2rem); margin: 0; }
.service-photo p { color: #e9e9eb; font-size: .88rem; margin: .5rem 0 .6rem; }
.slashes { display: block; width: 44px; height: 10px; margin: 0 0 .85rem .2rem; transform: skew(-40deg); background: repeating-linear-gradient(90deg, #ff4e53 0 7px, transparent 7px 14px); }
.photo-link { font-size: .8rem; font-weight: 700; }

.workshop-steps { padding: 1.7rem 0; background: #b80006; }
.workshop-steps ol { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; padding: 0; gap: 1.3rem; }
.workshop-steps li { display: flex; align-items: center; gap: .8rem; }
.workshop-steps li > span { font: 700 2.35rem var(--font-family-heading); padding: .3rem .65rem; background: #ffffff23; }
.workshop-steps h2 { font-size: 1.2rem; margin: 0; }
.workshop-steps p { margin: 0; color: #fff; font-size: .85rem; }

.engine-section { background: radial-gradient(ellipse at 76% 48%, #431719 0, #191417 40%, #111113 73%); }
.engine-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(1.5rem, 5vw, 4rem); align-items: center; }
.engine-diagram { position: relative; }
.engine-diagram > img { display: block; width: 100%; height: auto; }
.engine-point { position: absolute; display: grid; place-items: center; transform: translate(-50%, -50%); width: clamp(33px, 4vw, 48px); aspect-ratio: 1; border: 2px solid #ff979a; border-radius: 50%; background: #181618; color: white; font: 700 .9rem var(--font-family-heading); box-shadow: 0 0 0 6px #ff383a38; transition: background .2s; }
.engine-point:hover, .engine-point[aria-pressed="true"] { background: #b90008; color: #fff; }
.point-one { top: 31%; left: 65%; }
.point-two { top: 62%; left: 74%; }
.point-three { top: 64%; left: 32%; }
.point-four { top: 47%; left: 48%; }
.engine-info { margin-top: 1.3rem; border-left: 3px solid var(--color-one); background: #202023; padding: 1rem 1.3rem; }
.engine-info h3 { margin-bottom: .4rem; font-size: 1.45rem; }
.engine-info p { color: var(--bd-muted); margin-bottom: .45rem; }

.workshop-ticker { display: flex; align-items: center; overflow: hidden; gap: .7rem; padding: .65rem 0; border-block: 1px solid #562426; background: #191719; }
.ticker-toggle { margin-right: .65rem; flex: none; }
.ticker-window { min-width: 0; overflow: hidden; }
.ticker-content { display: flex; width: max-content; animation: workshop-ticker 36s linear infinite; }
.ticker-content.paused { animation-play-state: paused; }
.ticker-content span { white-space: nowrap; font: 700 clamp(1.25rem, 3.3vw, 2.8rem) var(--font-family-heading); letter-spacing: .035em; }
.ticker-content b { color: #ff5256; margin-inline: .65rem; }
@keyframes workshop-ticker { to { transform: translateX(-50%); } }

.system-section { background: #111113 url('../img/background/bg-11.png') center / cover no-repeat; }
.center-heading { text-align: center; }
.center-heading p:not(.eyebrow) { color: var(--bd-muted); }
.system-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 220px) minmax(0, 1fr); align-items: center; gap: clamp(1rem, 5vw, 4rem); margin-top: 2rem; }
.system-layout > img { width: 100%; height: auto; max-height: 390px; object-fit: contain; }
.system-layout a { display: flex; align-items: center; gap: .85rem; padding: .9rem 0; border-bottom: 1px solid var(--bd-line); }
.system-layout a i { color: #ff6c70; font-size: 1.65rem; }
.system-layout strong { display: block; font: 700 1.23rem var(--font-family-heading); }
.system-layout small { display: block; color: var(--bd-muted); }

.faq-section { background: #1a1a1d; }
.faq-layout { display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(1.5rem, 5vw, 4rem); align-items: center; }
.faq-layout details { border-bottom: 1px solid #46464c; }
.faq-layout summary { color: #fff; font-weight: 700; padding: .8rem 0; cursor: pointer; }
.faq-layout summary::marker { color: #ff6c70; }
.faq-layout details p { color: var(--bd-muted); padding-left: 1.15rem; }
.faq-contact { background: #111113; border-top: 3px solid var(--color-one); padding: clamp(1.2rem, 4vw, 2.8rem); }
.faq-contact p { color: var(--bd-muted); }

.carousel-controls { display: flex; gap: .55rem; flex: none; }
.carousel-controls button { min-width: 42px; }
.carousel-controls button:disabled { opacity: .48; cursor: default; }
.workshop-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2rem) / 3); gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-color: #ba292e #26262a; padding-bottom: .65rem; }
.workshop-track a { display: grid; align-content: end; position: relative; min-height: 260px; isolation: isolate; scroll-snap-align: start; overflow: hidden; }
.workshop-track img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
.workshop-track a::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 56%, #0e1014ed 100%); z-index: -1; }
.workshop-card-copy { padding: 1rem; color: #fff; background: linear-gradient(transparent, #0e1014); }
.workshop-card-copy strong { display: block; font: 700 1.45rem var(--font-family-heading); }
.workshop-card-copy small { display: block; margin-top: .2rem; line-height: 1.4; color: #dedee2; }
.workshop-track a:hover strong { text-decoration: underline; }
.workshop-reviews { background: linear-gradient(#101012a3,#101012e8), url('../img/background/bg-7.jpg') center / cover; }
.workshop-reviews .btn-two { margin-top: .65rem; }

@media (max-width: 820px) {
    .workshop-layout { grid-template-columns: minmax(0, .75fr) minmax(0, 1.35fr); }
    .workshop-detail { display: none; }
    .photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .workshop-track { grid-auto-columns: calc((100% - 1rem) / 2); }
}
@media (max-width: 640px) {
    .ignition-car { width: 146%; margin-left: -23%; }
    .ignition-copy h1 br { display: none; }
    .ignition-actions { gap: .7rem; }
    .workshop-layout, .engine-layout, .faq-layout { grid-template-columns: minmax(0, 1fr); }
    .workshop-portrait { display: none; }
    .section-heading-row { align-items: start; flex-wrap: wrap; }
    .photo-grid { grid-template-columns: minmax(0, 1fr); }
    .workshop-steps ol { grid-template-columns: minmax(0, 1fr); }
    .system-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .system-layout > img { grid-column: 1 / -1; grid-row: 1; max-height: 220px; }
    .workshop-track { grid-auto-columns: 85%; }
}
@media (prefers-reduced-motion: reduce) {
    .ignition-car .car-light, .ticker-content { animation: none; }
    .ticker-toggle { display: none; }
}


.system-intro { color: var(--bd-muted); text-align: center; margin: 0 auto; max-width: 38rem; }
.engine-zoom {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    width: fit-content;
    margin: 2rem auto 0;
    padding: .55rem 1rem;
    color: #fff;
    background: #a90007;
    border: 1px solid #ff7478;
    font-weight: 700;
}
.engine-zoom:hover { color: #fff; background: #c00008; }
.engine-section { border-top: 1px solid #532629; }
.diagram-note { color: var(--bd-muted); font-size: .85rem; margin: .65rem 0 0; }
.ignition-toggle .specific-icon { width: 1.2rem; height: 1.2rem; margin-right: .18rem; }
