:root{
    color-scheme:light;
    --bg:#f7f3ed;
    --surface:#ffffff;
    --surface-alt:#efe6da;
    --ink:#171717;
    --muted:#616775;
    --border:#ddd3c6;
    --primary:#e35b18;
    --primary-dark:#b94712;
    --panel:#121a24;
    --panel-ink:#f6f7fb;
    --green:#2f6f5e;
    --green-soft:#e2f0ea;
    --amber:#9a6700;
    --amber-soft:#fff1d8;
    --slate:#536171;
    --slate-soft:#edf1f5;
    --radius:8px;
    --shadow:0 12px 32px rgba(18, 26, 36, 0.08);
    --container:min(1120px, calc(100% - 32px));
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

#recherche,
#lignes,
#publier,
#securite,
#regles,
#liste{
    scroll-margin-top:96px;
}

body{
    margin:0;
    font-family:Inter, Arial, Helvetica, sans-serif;
    line-height:1.5;
    color:var(--ink);
    background:var(--bg);
}

img{
    display:block;
    max-width:100%;
}

a{
    color:inherit;
    text-decoration:none;
}

button,
input{
    font:inherit;
    letter-spacing:0;
}

button{
    cursor:pointer;
}

.skip-link{
    position:absolute;
    left:12px;
    top:-48px;
    background:var(--ink);
    color:#fff;
    padding:10px 14px;
    border-radius:var(--radius);
    z-index:20;
}

.skip-link:focus{
    top:12px;
}

.container{
    width:var(--container);
    margin:0 auto;
}

.site-header{
    position:sticky;
    top:0;
    z-index:10;
    background:rgba(247, 243, 237, 0.95);
    backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(221, 211, 198, 0.9);
}

.header-inner{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:14px 0;
}

.brand{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
}

.brand-mark{
    width:48px;
    height:48px;
    object-fit:contain;
}

.brand-copy{
    display:grid;
    gap:2px;
}

.brand-copy strong{
    font-size:1rem;
    line-height:1.1;
}

.brand-copy span{
    color:var(--muted);
    font-size:0.88rem;
}

.nav-toggle{
    min-width:92px;
    min-height:44px;
    padding:0 14px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--surface);
    color:var(--ink);
    font-weight:700;
}

.site-nav{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:100%;
    background:rgba(255, 255, 255, 0.98);
    border-bottom:1px solid var(--border);
    box-shadow:var(--shadow);
}

.site-nav.is-open{
    display:block;
}

.nav-list{
    list-style:none;
    margin:0;
    padding:12px 0 16px;
    display:grid;
    gap:4px;
}

.nav-link{
    display:flex;
    align-items:center;
    min-height:44px;
    padding:0 14px;
    border-radius:var(--radius);
    color:var(--muted);
    font-weight:700;
}

.nav-link:hover,
.nav-link:focus-visible{
    color:var(--ink);
    background:var(--surface-alt);
}

.nav-link-active{
    color:var(--ink);
    background:var(--surface-alt);
}

.hero-section{
    padding:32px 0 24px;
}

.hero-grid,
.page-hero-grid{
    display:grid;
    gap:24px;
    align-items:start;
}

.eyebrow{
    margin:0 0 10px;
    color:var(--primary-dark);
    font-size:0.88rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

h1,
h2,
h3{
    margin:0;
    line-height:1.1;
}

h1{
    font-size:2.3rem;
}

h2{
    font-size:1.8rem;
}

h3{
    font-size:1.15rem;
}

p{
    margin:0;
}

.hero-lead,
.section-heading p,
.panel-heading p,
.feature-card p,
.safety-item p,
.rule-card p,
.driver-bio,
.driver-preview-card p,
.footer-inner p,
.empty-state p{
    color:var(--muted);
}

.hero-lead{
    margin-top:14px;
    font-size:1.02rem;
    max-width:42rem;
}

.hero-points{
    display:grid;
    gap:12px;
    margin-top:20px;
}

.hero-point{
    padding:14px 16px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--surface);
}

.hero-point strong{
    display:block;
    margin-bottom:4px;
}

.search-panel{
    padding:18px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--surface);
    box-shadow:var(--shadow);
}

.compact-panel{
    box-shadow:none;
}

.panel-heading{
    margin-bottom:16px;
}

.trip-switch{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:16px;
}

.trip-switch-compact{
    margin-bottom:14px;
}

.trip-chip{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    background:var(--amber-soft);
    color:var(--amber);
    font-size:0.84rem;
    font-weight:800;
}

.trip-chip-muted{
    background:var(--surface-alt);
    color:var(--ink);
}

.panel-heading h2{
    font-size:1.4rem;
    margin-bottom:6px;
}

.form-grid{
    display:grid;
    gap:14px;
}

.field span{
    display:block;
    margin-bottom:6px;
    font-size:0.92rem;
    font-weight:700;
}

.field input{
    width:100%;
    min-height:52px;
    padding:0 14px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:#fff;
    color:var(--ink);
}

.field input::placeholder{
    color:#8b8f99;
}

.button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:0 18px;
    border:1px solid transparent;
    border-radius:var(--radius);
    font-weight:800;
    text-align:center;
}

.button:focus-visible,
.nav-toggle:focus-visible,
.field input:focus-visible,
.chip:focus-visible{
    outline:3px solid rgba(227, 91, 24, 0.22);
    outline-offset:2px;
}

.button-primary{
    background:var(--primary);
    color:#fff;
}

.button-primary:hover,
.button-primary:focus-visible{
    background:var(--primary-dark);
}

.button-secondary{
    background:transparent;
    color:var(--ink);
    border-color:var(--border);
}

.button-secondary:hover,
.button-secondary:focus-visible{
    background:var(--surface-alt);
}

.button-block{
    width:100%;
}

.form-hint{
    margin-top:12px;
    color:var(--muted);
    font-size:0.92rem;
}

.info-band{
    padding-bottom:24px;
}

.stats-grid,
.route-grid,
.feature-grid,
.driver-preview-grid,
.rules-grid,
.safety-list,
.driver-grid{
    display:grid;
    gap:16px;
}

.stat-item{
    padding:16px;
    border-radius:var(--radius);
    background:var(--panel);
    color:var(--panel-ink);
}

.stat-item strong{
    display:block;
    margin-bottom:6px;
}

.stat-item span{
    color:rgba(246, 247, 251, 0.78);
}

.section{
    padding:44px 0;
}

.section-alt{
    background:var(--surface);
}

.section-dark{
    background:var(--panel);
    color:var(--panel-ink);
}

.section-heading{
    max-width:42rem;
    margin-bottom:24px;
}

.section-heading h2{
    margin-bottom:8px;
}

.section-dark .eyebrow{
    color:#ffb083;
}

.section-dark .section-heading p,
.section-dark .rule-card p{
    color:rgba(246, 247, 251, 0.78);
}

.route-card,
.feature-card,
.driver-preview-card,
.rule-card,
.safety-item,
.driver-card,
.empty-state{
    padding:18px;
    border:1px solid var(--border);
    border-radius:var(--radius);
    background:var(--surface);
}

.section-dark .rule-card{
    background:rgba(255, 255, 255, 0.04);
    border-color:rgba(255, 255, 255, 0.14);
}

.card-kicker{
    margin-bottom:8px;
    color:var(--primary-dark);
    font-size:0.86rem;
    font-weight:700;
}

.meta-list,
.driver-details{
    margin:14px 0 0;
}

.meta-list div,
.driver-details div{
    padding:12px 0;
    border-top:1px solid var(--border);
}

.meta-list dt,
.driver-details dt{
    margin-bottom:4px;
    color:var(--muted);
    font-size:0.82rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.meta-list dd,
.driver-details dd{
    margin:0;
    font-weight:700;
}

.feature-card h3,
.rule-card h3,
.safety-item h3{
    margin-bottom:8px;
}

.driver-preview-top,
.driver-title-row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.driver-preview-top h3,
.driver-title-row h2{
    margin-bottom:4px;
}

.driver-preview-top p,
.driver-title-row p{
    color:var(--muted);
}

.driver-preview-route{
    margin:0;
    font-weight:800;
    color:var(--ink);
}

.driver-preview-route-secondary{
    font-weight:700;
}

.route-stack{
    display:grid;
    gap:8px;
    margin-top:14px;
}

.route-label{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:24px;
    padding:0 8px;
    border-radius:999px;
    background:var(--surface-alt);
    color:var(--primary-dark);
    font-size:0.75rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:0.04em;
}

.line-sketch{
    display:grid;
    gap:12px;
    margin-top:16px;
}

.line-flow{
    display:grid;
    gap:8px;
}

.line-track{
    display:flex;
    align-items:center;
    gap:0;
}

.line-stop{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:42px;
    max-width:110px;
    padding:8px 10px;
    border:1px solid var(--border);
    border-radius:18px;
    background:var(--surface);
    color:var(--ink);
    font-size:0.78rem;
    font-weight:800;
    text-align:center;
    line-height:1.2;
}

.line-stop-hub{
    background:var(--ink);
    border-color:var(--ink);
    color:#fff;
}

.line-link{
    position:relative;
    flex:1 1 18px;
    min-width:18px;
    height:4px;
    background:var(--primary);
    border-radius:999px;
}

.line-link::after{
    content:"";
    position:absolute;
    right:-1px;
    top:50%;
    width:8px;
    height:8px;
    border-top:2px solid var(--primary);
    border-right:2px solid var(--primary);
    transform:translateY(-50%) rotate(45deg);
}

.line-track-return .line-link::after{
    left:-1px;
    right:auto;
    border-right:0;
    border-left:2px solid var(--primary);
    transform:translateY(-50%) rotate(-45deg);
}

.route-line{
    color:var(--ink);
}

.compact-list{
    margin:14px 0 0;
    padding-left:18px;
    color:var(--muted);
}

.section-actions{
    margin-top:24px;
}

.rule-card-light{
    background:var(--surface);
}

.page-hero{
    padding:32px 0 20px;
}

.filters-toolbar{
    display:grid;
    gap:14px;
}

.chip-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 14px;
    border:1px solid var(--border);
    border-radius:999px;
    background:var(--surface);
    color:var(--muted);
    font-weight:700;
}

.chip-active{
    background:var(--ink);
    border-color:var(--ink);
    color:#fff;
}

.results-summary{
    color:var(--muted);
    font-weight:700;
}

.driver-card-header{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:14px;
}

.avatar{
    display:grid;
    place-items:center;
    width:56px;
    height:56px;
    border-radius:var(--radius);
    background:var(--panel);
    color:#fff;
    font-weight:800;
}

.driver-heading{
    min-width:0;
}

.driver-route{
    margin:0;
    font-weight:800;
    font-size:1.06rem;
}

.driver-route-secondary{
    font-size:1rem;
    font-weight:700;
}

.status-pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    font-size:0.85rem;
    font-weight:800;
    white-space:nowrap;
}

.status-available{
    background:var(--green-soft);
    color:var(--green);
}

.status-pause{
    background:var(--amber-soft);
    color:var(--amber);
}

.status-leave{
    background:var(--slate-soft);
    color:var(--slate);
}

.driver-bio{
    margin-top:16px;
}

.driver-tags{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:18px;
}

.tag{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    padding:0 12px;
    border-radius:999px;
    background:var(--amber-soft);
    color:var(--amber);
    font-size:0.84rem;
    font-weight:800;
}

.tag-muted{
    background:var(--surface-alt);
    color:var(--ink);
}

.driver-actions{
    display:grid;
    gap:12px;
    margin-top:18px;
}

.contact-note{
    margin-top:14px;
    padding:12px 14px;
    border-radius:var(--radius);
    background:var(--surface-alt);
    color:var(--ink);
    font-weight:700;
}

.empty-state{
    text-align:center;
}

.empty-state h2{
    margin-bottom:8px;
}

.empty-state .button{
    margin-top:16px;
}

.site-footer{
    border-top:1px solid var(--border);
    background:var(--surface);
}

.footer-inner{
    display:grid;
    gap:16px;
    padding:24px 0 32px;
}

.footer-inner strong{
    display:block;
    margin-bottom:6px;
}

.footer-links{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    color:var(--muted);
    font-weight:700;
}

@media (min-width:760px){
    h1{
        font-size:3.2rem;
    }

    h2{
        font-size:2.2rem;
    }

    .hero-grid{
        grid-template-columns:minmax(0, 1.1fr) minmax(320px, 0.9fr);
    }

    .page-hero-grid{
        grid-template-columns:minmax(0, 1.05fr) minmax(320px, 0.95fr);
    }

    .form-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .form-grid .button-block{
        grid-column:1 / -1;
    }

    .stats-grid,
    .feature-grid,
    .rules-grid,
    .safety-list{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .route-grid,
    .driver-preview-grid,
    .driver-grid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .driver-details{
        display:grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:0 18px;
    }

    .driver-actions{
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .footer-inner{
        grid-template-columns:minmax(0, 1fr) auto;
        align-items:center;
    }
}

@media (min-width:980px){
    .nav-toggle{
        display:none;
    }

    .site-nav{
        display:block;
        position:static;
        background:transparent;
        border:0;
        box-shadow:none;
    }

    .nav-list{
        padding:0;
        display:flex;
        align-items:center;
        gap:4px;
    }

    .route-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .driver-preview-grid,
    .driver-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }
}