/* DESKTOP PASS 1 — isolated from the validated mobile layout. */
@media (min-width:1024px){

    /* Header: same composition, slightly more deliberate desktop spacing. */
    html body header{
        min-height:72px!important;
        padding-top:11px!important;
        padding-bottom:11px!important;
        padding-left:max(4.5vw,56px)!important;
        padding-right:max(4.5vw,56px)!important;
    }
    html body header nav{
        gap:30px!important;
    }
    html body header .header-actions{
        gap:12px!important;
    }

    /* Hero keeps its current art direction, but is proportioned for a desktop viewport. */
    html body #home-view .hero{
        min-height:calc(100vh - 72px)!important;
        padding-top:112px!important;
        padding-bottom:54px!important;
        box-sizing:border-box!important;
    }

    /* Slightly narrower and more architectural than the mobile-derived 850px panel. */
    html body #home-view .booking-widget{
        width:min(820px,calc(100vw - 96px))!important;
        max-width:820px!important;
        padding:23px 20px 22px!important;
    }

    /* Remove the large desktop-only dead space around the heading block. */
    html body #home-view .hero-heading-panel{
        margin-top:8px!important;
        margin-bottom:24px!important;
        padding:12px 18px 14px!important;
    }

    html body #home-view .booking-widget h1,
    html body #home-view .booking-widget h1 > span{
        font-size:46px!important;
        line-height:1.04!important;
    }
    html body #home-view .booking-widget h1{
        margin-bottom:12px!important;
    }

    html body #home-view .hero-coachline-separator{
        margin-bottom:12px!important;
    }

    html body #home-view .hero-subtitle.lang-en,
    html body #home-view .hero-subtitle.lang-fr{
        font-size:18px!important;
        line-height:1.4!important;
        margin-bottom:0!important;
    }

    html body #home-view .widget-tabs{
        margin-bottom:17px!important;
    }
}



@media (min-width:1024px){

    /* 1) Language dropdown: remove any selected/pressed tile behind the non-active flag. */
    html body header .language-menu .language-option,
    html body header .language-menu .language-option:hover,
    html body header .language-menu .language-option:focus,
    html body header .language-menu .language-option:focus-visible,
    html body header .language-menu .language-option:active,
    html body header .language-menu .language-option.active{
        background:transparent!important;
        background-color:transparent!important;
        background-image:none!important;
        border-color:transparent!important;
        outline:0!important;
        box-shadow:none!important;
        -webkit-box-shadow:none!important;
    }
    html body header .language-menu .language-option::before,
    html body header .language-menu .language-option::after{
        content:none!important;
        display:none!important;
    }

    /* 2) Phone: rectangular rounded control, harmonised with email button.
       Hide only the phone icon, keeping the number itself. */
    html body header .btn-phone-prestige{
        display:inline-flex!important;
        align-items:center!important;
        justify-content:center!important;
        min-height:38px!important;
        height:38px!important;
        padding:0 18px!important;
        border-radius:9px!important;
        background:rgba(18,18,18,.92)!important;
        background-color:rgba(18,18,18,.92)!important;
        border:1px solid rgba(223,184,107,.28)!important;
        box-shadow:none!important;
        gap:0!important;
    }
    html body header .btn-phone-prestige i,
    html body header .btn-phone-prestige svg,
    html body header .btn-phone-prestige .fa-phone,
    html body header .btn-phone-prestige .ph-phone,
    html body header .btn-phone-prestige .phone-icon{
        display:none!important;
    }
    html body header .btn-phone-prestige span,
    html body header .btn-phone-prestige{
        color:var(--accent-gold)!important;
        font-size:.78rem!important;
        letter-spacing:.045em!important;
        font-weight:500!important;
        text-decoration:none!important;
        white-space:nowrap!important;
    }

    /* 3) Desktop booking form labels are redundant; placeholders remain.
       Mobile is untouched because this rule starts at 1024px. */
    html body #home-view #calcForm .booking-field-label-mobile-hidden{
        display:none!important;
    }

    /* Remove the vertical space that belonged to those labels. */
    html body #home-view #calcForm .form-grid{
        row-gap:15px!important;
    }
    html body #home-view #calcForm .form-group{
        gap:0!important;
    }
}



@media (min-width:1024px){
    /* More breathing room between phone / WhatsApp / email / language controls. */
    html body header .header-actions{
        gap:16px!important;
    }
    html body header .language-dropdown,
    html body header .lang-switcher{
        margin-left:2px!important;
    }
}



@media (min-width:1024px){

    /* Phone hover: gold background, dark readable number. */
    html body header .btn-phone-prestige:hover,
    html body header .btn-phone-prestige:focus-visible{
        background:var(--accent-gold)!important;
        background-color:var(--accent-gold)!important;
        border-color:var(--accent-gold)!important;
        color:#070707!important;
        -webkit-text-fill-color:#070707!important;
        transform:translateY(-1px)!important;
        box-shadow:0 5px 18px rgba(223,184,107,.22)!important;
    }
    html body header .btn-phone-prestige:hover *,
    html body header .btn-phone-prestige:focus-visible *{
        color:#070707!important;
        -webkit-text-fill-color:#070707!important;
    }

    /* Rebuild the desktop booking composition around the label-free form. */
    html body #home-view .hero{
        padding-top:124px!important;
    }

    html body #home-view .booking-widget{
        width:min(900px,calc(100vw - 96px))!important;
        max-width:900px!important;
        padding:22px 22px 23px!important;
    }

    html body #home-view .hero-heading-panel{
        margin-top:7px!important;
        margin-bottom:22px!important;
        padding:11px 18px 13px!important;
    }

    html body #home-view .widget-tabs{
        margin-bottom:16px!important;
    }

    html body #home-view #calcForm .form-grid{
        display:grid!important;
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        column-gap:14px!important;
        row-gap:14px!important;
        align-items:stretch!important;
    }

    /* Transfer: pickup / dropoff. Hourly: pickup / number of hours.
       Date and time always form the second row. */
    html body #home-view #calcForm #box-depart,
    html body #home-view #calcForm #box-arrivee,
    html body #home-view #calcForm #box-heures,
    html body #home-view #calcForm #box-date,
    html body #home-view #calcForm #box-time{
        grid-column:auto!important;
        width:100%!important;
        min-width:0!important;
    }

    html body #home-view #calcForm .input-icon-wrapper,
    html body #home-view #calcForm #depart,
    html body #home-view #calcForm #arrivee,
    html body #home-view #calcForm #heures_input,
    html body #home-view #calcForm #date_picker,
    html body #home-view #calcForm #time_input{
        width:100%!important;
        box-sizing:border-box!important;
    }

    html body #home-view #calcForm #depart,
    html body #home-view #calcForm #arrivee,
    html body #home-view #calcForm #heures_input,
    html body #home-view #calcForm #date_picker,
    html body #home-view #calcForm #time_input{
        height:48px!important;
        min-height:48px!important;
    }

    html body #home-view #calcForm #form-error-msg,
    html body #home-view #calcForm .btn-calc{
        grid-column:1 / -1!important;
        width:100%!important;
    }

    html body #home-view #calcForm .btn-calc{
        height:50px!important;
        min-height:50px!important;
        margin-top:0!important;
    }
}



@media (min-width:1024px) and (max-width:1500px){
    html body header{
        min-height:72px!important;
        padding-left:28px!important;
        padding-right:28px!important;
        padding-top:11px!important;
        padding-bottom:11px!important;
        flex-wrap:nowrap!important;
    }
    html body header nav{
        gap:18px!important;
        flex:0 1 auto!important;
    }
    html body header nav a{
        font-size:.72rem!important;
        white-space:nowrap!important;
    }
    html body header .header-actions{
        gap:9px!important;
        flex:0 0 auto!important;
    }
    html body header .btn-phone-prestige{
        padding-left:13px!important;
        padding-right:13px!important;
    }
}



@media (min-width:1024px){
    html body #home-view #timePickerPopup.red-v112-desktop-contained{
        position:absolute!important;
        bottom:auto!important;
        margin:0!important;
        transform:none!important;
        -webkit-transform:none!important;
    }
}