/* ==================================================
   PAGINA PRENOTA — ARTWORK STUDIO
================================================== */

.booking-page{
    background:var(--paper);
}

.booking-header{
    background:rgba(246,243,239,.92);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
    box-shadow:0 10px 35px rgba(33,23,28,.06);
}

.booking-header .brand-copy strong,
.booking-header .brand-copy span,
.booking-header .main-nav a,
.booking-header .menu-toggle{
    color:var(--ink);
}

.booking-header .nav-cta{
    color:var(--plum);
    border-color:var(--plum);
}

/* HERO */
.booking-hero{
    position:relative;
    min-height:720px;
    display:flex;
    align-items:flex-end;
    overflow:hidden;
}

.booking-hero-media{
    position:absolute;
    inset:0;
    background:url("../img/hero2.jpg") center 42%/cover no-repeat;
    transform:scale(1.02);
}

.booking-hero-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(90deg,rgba(31,15,23,.84),rgba(31,15,23,.46) 52%,rgba(31,15,23,.14)),
        linear-gradient(0deg,rgba(20,9,14,.55),transparent 48%);
}

.booking-hero-inner{
    position:relative;
    z-index:2;
    min-height:720px;
    padding:190px 0 85px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    color:white;
}

.booking-hero-copy{
    max-width:780px;
}

.booking-hero h1{
    font-family:var(--serif);
    font-size:clamp(80px,9vw,132px);
    font-weight:500;
    line-height:.8;
    letter-spacing:-.05em;
}

.booking-hero h1 em{
    color:#ffffff;
    font-weight:400;
}

.booking-hero-copy p{
    max-width:590px;
    margin-top:36px;
    color:rgba(255,255,255,.82);
    font-size:14px;
    line-height:1.9;
}

.booking-hero-index{
    text-align:right;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.booking-hero-index span{
    color:rgba(255,255,255,.65);
    font-size:9px;
    letter-spacing:.3em;
}

.booking-hero-index strong{
    font-family:var(--serif);
    font-size:34px;
    font-weight:500;
}

/* INTRO */
.booking-intro{
    padding:105px 0;
    border-bottom:1px solid var(--line);
}

.booking-intro-grid{
    display:grid;
    grid-template-columns:.7fr 2fr 1fr;
    gap:60px;
    align-items:start;
}

.booking-intro-title h2{
    font-family:var(--serif);
    font-size:clamp(42px,4.6vw,70px);
    font-weight:500;
    line-height:1.04;
    letter-spacing:-.03em;
}

.booking-intro-text p{
    color:var(--muted);
    font-size:13px;
    line-height:1.95;
}

/* FORM SECTION */
.booking-section{
    padding:135px 0 150px;
    background:var(--white);
}

.booking-layout{
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    gap:80px;
    align-items:start;
}

.booking-sidebar{
    position:sticky;
    top:130px;
}

.booking-sidebar h2{
    font-family:var(--serif);
    font-size:55px;
    font-weight:500;
    line-height:.98;
    letter-spacing:-.035em;
    max-width:470px;
}

.sidebar-lead{
    margin:28px 0 48px;
    color:var(--muted);
    line-height:1.9;
    font-size:13px;
    max-width:450px;
}

.booking-steps{
    border-top:1px solid var(--line);
}

.booking-step{
    display:grid;
    grid-template-columns:50px 1fr;
    gap:18px;
    padding:25px 0;
    border-bottom:1px solid var(--line);
}

.booking-step>span{
    font-family:var(--serif);
    font-size:25px;
    color:var(--plum);
}

.booking-step strong{
    display:block;
    font-family:var(--serif);
    font-size:24px;
    font-weight:600;
    margin-bottom:6px;
}

.booking-step p{
    color:var(--muted);
    font-size:12px;
    line-height:1.7;
}

.studio-mini-card{
    margin-top:38px;
    padding:28px;
    display:flex;
    gap:20px;
    background:var(--paper);
}

.studio-mini-card img{
    width:62px;
    height:62px;
    object-fit:contain;
}

.studio-mini-card span{
    display:block;
    font-family:var(--serif);
    font-size:23px;
    font-weight:600;
}

.studio-mini-card p{
    margin:7px 0;
    color:var(--muted);
    font-size:11px;
    line-height:1.6;
}

.studio-mini-card a{
    color:var(--plum);
    font-size:11px;
    font-weight:600;
}

/* FORM */
.booking-form-shell{
    background:var(--paper);
    padding:68px;
    box-shadow:var(--shadow);
}

.form-heading{
    padding-bottom:42px;
    margin-bottom:42px;
    border-bottom:1px solid var(--line);
}

.form-heading>span{
    display:block;
    color:var(--plum);
    font-size:9px;
    letter-spacing:.28em;
    text-transform:uppercase;
    margin-bottom:15px;
}

.form-heading h2{
    font-family:var(--serif);
    font-size:54px;
    font-weight:500;
    line-height:1;
}

.form-heading p{
    color:var(--muted);
    margin-top:14px;
    font-size:11px;
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
}

.field{
    margin-bottom:26px;
}

.field label{
    display:block;
    margin-bottom:10px;
    color:var(--ink);
    font-size:9px;
    font-weight:600;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.field input,
.field select,
.field textarea{
    width:100%;
    border:0;
    border-bottom:1px solid rgba(50,23,36,.28);
    border-radius:0;
    background:transparent;
    color:var(--ink);
    padding:14px 0;
    font-family:var(--sans);
    font-size:13px;
    outline:none;
    transition:.3s;
}

.field textarea{
    resize:vertical;
    min-height:145px;
    line-height:1.7;
}

.field input::placeholder,
.field textarea::placeholder{
    color:#9a9094;
}

.field input:focus,
.field select:focus,
.field textarea:focus{
    border-color:var(--plum);
}

.field input.invalid,
.field select.invalid,
.field textarea.invalid{
    border-color:#a23a3a;
}

/* UPLOAD */
.upload-field{
    margin:6px 0 28px;
}

.upload-field input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.upload-field label{
    min-height:110px;
    border:1px dashed rgba(75,35,54,.36);
    padding:22px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:18px;
    cursor:pointer;
    transition:.35s;
}

.upload-field label:hover,
.upload-field label.has-file{
    background:var(--white);
    border-color:var(--plum);
}

.upload-icon{
    width:44px;
    height:44px;
    background:var(--plum);
    color:white;
    display:grid;
    place-items:center;
}

.upload-copy{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.upload-copy strong{
    font-family:var(--serif);
    font-size:21px;
    font-weight:600;
}

.upload-copy small{
    color:var(--muted);
    font-size:9px;
    letter-spacing:.08em;
}

.upload-action{
    color:var(--plum);
    font-size:9px;
    font-weight:600;
    letter-spacing:.15em;
    text-transform:uppercase;
}

/* CHECKBOX */
.privacy-check{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:13px;
    align-items:start;
    margin:35px 0;
    color:var(--muted);
    font-size:10px;
    line-height:1.7;
    cursor:pointer;
}

.privacy-check input{
    margin-top:3px;
    accent-color:var(--plum);
}

/* SUBMIT */
.form-submit-row{
    display:flex;
    align-items:center;
    gap:26px;
}

.booking-submit{
    min-width:245px;
    height:58px;
    border:0;
    background:var(--plum);
    color:white;
    padding:0 26px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
    cursor:pointer;
    text-transform:uppercase;
    letter-spacing:.16em;
    font-size:9px;
    transition:.35s;
}

.booking-submit:hover{
    background:var(--green);
    transform:translateY(-3px);
}

.booking-submit:disabled{
    opacity:.65;
    cursor:wait;
    transform:none;
}

.form-submit-row p{
    color:var(--muted);
    font-size:9px;
    line-height:1.6;
}

#form-message{
    display:none;
    margin-top:28px;
    padding:18px;
    font-size:12px;
    line-height:1.7;
}

#form-message.success{
    display:block;
    background:rgba(23,61,53,.1);
    color:var(--green);
    border-left:3px solid var(--green);
}

#form-message.error{
    display:block;
    background:rgba(162,58,58,.09);
    color:#8e3030;
    border-left:3px solid #a23a3a;
}

/* NOTES */
.booking-notes{
    padding:100px 0;
    background:var(--paper);
}

.notes-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.note-card{
    background:var(--white);
    padding:38px;
    display:grid;
    grid-template-columns:auto 1fr;
    gap:22px;
    min-height:260px;
}

.note-number{
    color:var(--plum);
    font-family:var(--serif);
    font-size:28px;
}

.note-card h3{
    font-family:var(--serif);
    font-size:30px;
    font-weight:600;
    margin-bottom:15px;
}

.note-card p{
    color:var(--muted);
    font-size:11px;
    line-height:1.85;
}

/* CONTACT STRIP */
.booking-contact-strip{
    padding:105px 0;
    background:var(--plum-deep);
    color:white;
}

.contact-strip-inner{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:50px;
}

.booking-contact-strip h2{
    font-family:var(--serif);
    font-size:clamp(52px,6vw,86px);
    font-weight:500;
    line-height:.95;
}

/* RESPONSIVE */
@media(max-width:1050px){
    .booking-hero-inner{
        padding-top:160px;
    }

    .booking-intro-grid,
    .booking-layout{
        grid-template-columns:1fr;
    }

    .booking-sidebar{
        position:static;
    }

    .notes-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:760px){
    .booking-hero,
    .booking-hero-inner{
        min-height:650px;
    }

    .booking-hero-inner{
        padding:150px 0 60px;
    }

    .booking-hero h1{
        font-size:68px;
    }

    .booking-hero-index{
        display:none;
    }

    .booking-intro{
        padding:80px 0;
    }

    .booking-intro-grid{
        grid-template-columns:1fr;
        gap:28px;
    }

    .booking-section{
        padding:90px 0;
    }

    .booking-layout{
        gap:55px;
    }

    .booking-sidebar h2{
        font-size:47px;
    }

    .booking-form-shell{
        padding:38px 22px;
    }

    .form-heading h2{
        font-size:43px;
    }

    .form-grid{
        grid-template-columns:1fr;
        gap:0;
    }

    .upload-field label{
        grid-template-columns:auto 1fr;
    }

    .upload-action{
        grid-column:2;
    }

    .form-submit-row{
        align-items:stretch;
        flex-direction:column;
    }

    .booking-submit{
        width:100%;
    }

    .note-card{
        padding:28px 22px;
    }

    .contact-strip-inner{
        align-items:flex-start;
        flex-direction:column;
    }
}
