/* =========================================================
   BOOKING / CONTACT — V4 PREMIUM
   ========================================================= */

.booking{
    max-width:1500px;
    margin:60px auto 96px;
    padding:0 5vw;
}

.booking-card{
    display:grid;
    grid-template-columns:38% 62%;
    gap:0;
    overflow:hidden;
    border-radius:34px;
    background:linear-gradient(145deg,rgba(28,28,28,.98),rgba(8,8,8,.98));
    border:1px solid rgba(210,164,73,.28);
    box-shadow:0 30px 90px rgba(0,0,0,.42);
}

.booking-card > .kicker,
.booking-card > h2,
.booking-card > p:not(.kicker){
    grid-column:1;
    margin-left:46px;
    margin-right:46px;
}

.booking-card > .kicker{
    margin-top:52px;
    margin-bottom:20px;
    color:#d2a449;
    letter-spacing:.24em;
    text-transform:uppercase;
}

.booking-card > h2{
    margin-top:0;
    margin-bottom:24px;
    font-family:var(--font-serif, Georgia, serif);
    font-size:clamp(48px,4.6vw,78px);
    font-weight:400;
    line-height:.92;
    color:#f7f2e9;
}

.booking-card > p:not(.kicker){
    max-width:420px;
    margin-bottom:52px;
    color:rgba(255,255,255,.70);
    font-size:18px;
    line-height:1.65;
}

.booking-card form{
    grid-column:2;
    grid-row:1 / span 4;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px 16px;
    padding:42px 42px;
    border-left:1px solid rgba(255,255,255,.08);
    align-content:center;
}

.booking-card input,
.booking-card select,
.booking-card textarea{
    width:100%;
    min-height:52px;
    box-sizing:border-box;
    padding:0 16px;
    border-radius:10px;
    background:rgba(255,255,255,.045);
    border:1px solid rgba(255,255,255,.14);
    color:#fff;
    font-size:15px;
    outline:none;
}

.booking-card textarea{
    min-height:96px;
    padding-top:15px;
    resize:vertical;
}

.booking-card select,
.booking-card textarea{
    grid-column:1 / -1;
}

.booking-card input:focus,
.booking-card select:focus,
.booking-card textarea:focus{
    border-color:rgba(210,164,73,.70);
    box-shadow:0 0 0 3px rgba(210,164,73,.10);
}

.booking-card label{
    grid-column:1 / 2;
    display:flex;
    gap:10px;
    align-items:flex-start;
    color:rgba(255,255,255,.68);
    font-size:13px;
    line-height:1.45;
}

.booking-card input[type="checkbox"]{
    width:16px;
    min-width:16px;
    height:16px;
    min-height:16px;
    margin-top:2px;
    padding:0;
    accent-color:#d2a449;
}

.booking-card button{
    grid-column:2;
    justify-self:end;
    width:auto;
    min-width:245px;
    height:54px;
    padding:0 24px;
    border:0;
    border-radius:999px;
    background:linear-gradient(135deg,#d2a449,#f3c76b,#b98224);
    color:#090909;
    font-size:12px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
    cursor:pointer;
}

@media(max-width:1100px){
    .booking-card{
        grid-template-columns:1fr;
    }

    .booking-card form{
        grid-column:1;
        grid-row:auto;
        border-left:0;
        border-top:1px solid rgba(255,255,255,.08);
    }
}

@media(max-width:720px){
    .booking{
        padding:0 22px;
        margin:42px auto 70px;
    }

    .booking-card > .kicker,
    .booking-card > h2,
    .booking-card > p:not(.kicker){
        margin-left:26px;
        margin-right:26px;
    }

    .booking-card form{
        grid-template-columns:1fr;
        padding:30px 24px;
    }

    .booking-card button,
    .booking-card label{
        grid-column:1;
    }

    .booking-card button{
        width:100%;
        min-width:0;
    }
}

/* BOOKING V4 — plus d'espace entre le titre et le texte */

.booking-card > h2{
    margin-bottom:38px;
}

.booking-card > p:not(.kicker){
    margin-top:0;
}


/* BOOKING V4 — espacement premium */

.booking-card > h2{
    margin-bottom:42px;
}

.booking-card > p:not(.kicker){
    margin-top:0;
}


/* BOOKING V4 — séparation forcée titre / texte */
.booking-card > h2{
    margin-bottom:42px !important;
}

.booking-card > p:not(.kicker){
    margin-top:0 !important;
    padding-top:0 !important;
    display:block !important;
}

.booking-card > h2 + p{
    margin-top:42px !important;
}


/* BOOKING — séparation titre / texte garantie */

.booking-card{
    grid-template-columns:38% 62% !important;
    grid-template-areas:
        "kicker form"
        "title form"
        "copy form" !important;
    row-gap:0 !important;
}

.booking-card > .kicker{
    grid-area:kicker !important;
    margin-bottom:22px !important;
}

.booking-card > h2{
    grid-area:title !important;
    margin-bottom:46px !important;
}

.booking-card > p:not(.kicker){
    grid-area:copy !important;
    margin-top:0 !important;
    padding-top:0 !important;
}

.booking-card form{
    grid-area:form !important;
}

@media(max-width:1100px){
    .booking-card{
        grid-template-columns:1fr !important;
        grid-template-areas:
            "kicker"
            "title"
            "copy"
            "form" !important;
    }
}


/* =========================================================
   BOOKING — Correction couleurs du menu déroulant
   ========================================================= */

.booking-card select{
    background:#1b1b1b;
    color:#f5f1e8;
}

.booking-card select option{
    background:#1b1b1b;
    color:#f5f1e8;
}

.booking-card select option:hover,
.booking-card select option:checked{
    background:#d2a449;
    color:#111;
}

/* Firefox */
.booking-card select:-moz-focusring{
    color:transparent;
    text-shadow:0 0 0 #f5f1e8;
}


/* =========================================================
   BOOKING — Select premium natif stabilisé
   ========================================================= */

.booking-card select{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    background:
        linear-gradient(45deg, transparent 50%, #d2a449 50%) calc(100% - 22px) 50% / 7px 7px no-repeat,
        linear-gradient(135deg, #d2a449 50%, transparent 50%) calc(100% - 16px) 50% / 7px 7px no-repeat,
        rgba(255,255,255,.045);
    color:#f5f1e8;
    cursor:pointer;
    padding-right:48px;
}

.booking-card select option{
    background:#151515;
    color:#f5f1e8;
}

.booking-card select option:checked{
    background:#d2a449;
    color:#111;
}

.booking-card select:focus{
    border-color:rgba(210,164,73,.75);
    box-shadow:0 0 0 3px rgba(210,164,73,.12);
}


/* =========================================================
   BOOKING V3 — request type premium radio cards
   Replaces native select for consistent dark UI
   ========================================================= */

.booking-request-v3{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:2px 0 2px;
}

.booking-request-title-v3{
    grid-column:1 / -1;
    margin:0 0 4px;
    color:#d2a449;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.booking-request-v3 label{
    position:relative;
    display:flex;
    align-items:center;
    min-height:46px;
    padding:0 14px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.045);
    color:#f5f1e8;
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, color .2s ease;
}

.booking-request-v3 input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.booking-request-v3 span{
    display:block;
    color:#f5f1e8;
    font-size:14px;
    line-height:1.25;
}

.booking-request-v3 label:has(input:checked){
    border-color:rgba(210,164,73,.85);
    background:linear-gradient(135deg,rgba(210,164,73,.22),rgba(210,164,73,.08));
}

.booking-request-v3 label:has(input:checked) span{
    color:#f7d88b;
}

@media(max-width:720px){
    .booking-request-v3{
        grid-template-columns:1fr;
    }
}
EOFcat >> /tmp/booking-radio-css.txt <<'EOF'

/* =========================================================
   BOOKING V3 — request type premium radio cards
   Replaces native select for consistent dark UI
   ========================================================= */

.booking-request-v3{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:2px 0 2px;
}

.booking-request-title-v3{
    grid-column:1 / -1;
    margin:0 0 4px;
    color:#d2a449;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.booking-request-v3 label{
    position:relative;
    display:flex;
    align-items:center;
    min-height:46px;
    padding:0 14px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.045);
    color:#f5f1e8;
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, color .2s ease;
}

.booking-request-v3 input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.booking-request-v3 span{
    display:block;
    color:#f5f1e8;
    font-size:14px;
    line-height:1.25;
}

.booking-request-v3 label:has(input:checked){
    border-color:rgba(210,164,73,.85);
    background:linear-gradient(135deg,rgba(210,164,73,.22),rgba(210,164,73,.08));
}

.booking-request-v3 label:has(input:checked) span{
    color:#f7d88b;
}

@media(max-width:720px){
    .booking-request-v3{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   BOOKING V3 — request type premium radio cards
   Replaces native select for consistent dark UI
   ========================================================= */

.booking-request-v3{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:2px 0 2px;
}

.booking-request-title-v3{
    grid-column:1 / -1;
    margin:0 0 4px;
    color:#d2a449;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.booking-request-v3 label{
    position:relative;
    display:flex;
    align-items:center;
    min-height:46px;
    padding:0 14px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.045);
    color:#f5f1e8;
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, color .2s ease;
}

.booking-request-v3 input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.booking-request-v3 span{
    display:block;
    color:#f5f1e8;
    font-size:14px;
    line-height:1.25;
}

.booking-request-v3 label:has(input:checked){
    border-color:rgba(210,164,73,.85);
    background:linear-gradient(135deg,rgba(210,164,73,.22),rgba(210,164,73,.08));
}

.booking-request-v3 label:has(input:checked) span{
    color:#f7d88b;
}

@media(max-width:720px){
    .booking-request-v3{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   BOOKING V3 — request type premium radio cards
   Replaces native select for consistent dark UI
   ========================================================= */

.booking-request-v3{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:2px 0 2px;
}

.booking-request-title-v3{
    grid-column:1 / -1;
    margin:0 0 4px;
    color:#d2a449;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.booking-request-v3 label{
    position:relative;
    display:flex;
    align-items:center;
    min-height:46px;
    padding:0 14px;
    border-radius:10px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.045);
    color:#f5f1e8;
    cursor:pointer;
    transition:border-color .2s ease, background .2s ease, color .2s ease;
}

.booking-request-v3 input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.booking-request-v3 span{
    display:block;
    color:#f5f1e8;
    font-size:14px;
    line-height:1.25;
}

.booking-request-v3 label:has(input:checked){
    border-color:rgba(210,164,73,.85);
    background:linear-gradient(135deg,rgba(210,164,73,.22),rgba(210,164,73,.08));
}

.booking-request-v3 label:has(input:checked) span{
    color:#f7d88b;
}

@media(max-width:720px){
    .booking-request-v3{
        grid-template-columns:1fr;
    }
}
