:root{
    --paper:#F4F1E1;
    --black:#050505;
    --line:rgba(0,0,0,.20);
    --serif:"Cormorant Garamond",serif;
    --sans:"DM Sans",sans-serif;
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    background:var(--paper);
    color:#000;
    font-family:var(--sans);
    overflow-x:hidden;
}

body:before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;
    z-index:9999;
    opacity:.035;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

body.loading{
    overflow:hidden;
}

a{
    color:inherit;
}

button,
input,
select{
    font-family:inherit;
}

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

.top-loader{
    position:fixed;
    inset:0;
    background:#000;
    z-index:99999;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--paper);
    transition:opacity 1s ease,visibility 1s ease;
}

.top-loader.hide{
    opacity:0;
    visibility:hidden;
}

.loader-inner{
    text-align:center;
}

.loader-brand{
    font-family:var(--serif);
    font-size:52px;
    letter-spacing:4px;
    line-height:.8;
}

.loader-line{
    width:180px;
    height:1px;
    background:rgba(244,241,225,.4);
    margin:25px auto;
    overflow:hidden;
}

.loader-progress{
    width:0;
    height:100%;
    background:var(--paper);
    animation:loaderProgress 2s ease forwards;
}

.loader-text{
    font-size:8px;
    letter-spacing:4px;
    text-transform:uppercase;
}

@keyframes loaderProgress{
    to{
        width:100%;
    }
}

.top-bar{
    height:34px;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:8px;
    letter-spacing:3px;
    text-transform:uppercase;
}

.nav{
    height:92px;
    padding:0 5vw;
    border-bottom:1px solid var(--line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    z-index:100;
    background:rgba(244,241,225,.96);
    backdrop-filter:blur(10px);
}

.brand{
    display:flex;
    align-items:center;
    gap:14px;
}

.brand-mark{
    width:42px;
    height:42px;
    border:1px solid #000;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:var(--serif);
    font-size:17px;
}

.brand-text{
    line-height:.8;
}

.brand-main{
    font-family:var(--serif);
    font-size:27px;
    letter-spacing:2px;
}

.brand-sub{
    font-size:7px;
    letter-spacing:3px;
    margin-top:8px;
}

.nav-links{
    display:flex;
    gap:30px;
}

.nav-links a{
    text-decoration:none;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:1.8px;
    font-weight:600;
    position:relative;
}

.nav-links a:after{
    content:"";
    position:absolute;
    left:0;
    bottom:-7px;
    width:0;
    height:1px;
    background:#000;
    transition:.35s;
}

.nav-links a:hover:after{
    width:100%;
}

.book-btn{
    background:#000;
    color:var(--paper);
    border:1px solid #000;
    padding:14px 22px;
    font-size:9px;
    letter-spacing:1.5px;
    text-transform:uppercase;
    cursor:pointer;
    transition:.3s;
}

.book-btn:hover{
    background:transparent;
    color:#000;
}

.hero{
    min-height:calc(100vh - 126px);
    display:grid;
    grid-template-columns:.72fr 1.28fr;
    position:relative;
}

.hero-content{
    padding:80px 5vw 70px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    border-right:1px solid var(--line);
    position:relative;
    z-index:5;
}

.hero-small{
    display:flex;
    align-items:center;
    gap:12px;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:3px;
    margin-bottom:35px;
    opacity:0;
    transform:translateY(30px);
    animation:heroText 1s .2s cubic-bezier(.2,.8,.2,1) forwards;
}

.hero-small:before{
    content:"";
    width:35px;
    height:1px;
    background:#000;
}

.hero-title{
    font-family:var(--serif);
    font-weight:500;
    font-size:clamp(75px,8vw,145px);
    line-height:.72;
    letter-spacing:-6px;
    opacity:0;
    transform:translateY(50px);
    animation:heroText 1.2s .35s cubic-bezier(.2,.8,.2,1) forwards;
}

.hero-title em{
    display:block;
    margin-left:55px;
    font-style:italic;
}

.hero-description{
    max-width:420px;
    margin-top:45px;
    font-size:14px;
    line-height:1.9;
    color:#333;
    opacity:0;
    transform:translateY(30px);
    animation:heroText 1s .55s cubic-bezier(.2,.8,.2,1) forwards;
}

.hero-actions{
    display:flex;
    gap:12px;
    margin-top:35px;
    opacity:0;
    transform:translateY(25px);
    animation:heroText 1s .75s cubic-bezier(.2,.8,.2,1) forwards;
}

.hero-btn{
    border:1px solid #000;
    padding:15px 23px;
    text-decoration:none;
    font-size:9px;
    font-weight:700;
    letter-spacing:1.5px;
    text-transform:uppercase;
    transition:.4s;
    cursor:pointer;
}

.hero-btn.primary{
    background:#000;
    color:var(--paper);
}

.hero-btn:hover{
    background:#000;
    color:var(--paper);
    transform:translateY(-3px);
}

.hero-meta{
    position:absolute;
    bottom:28px;
    left:5vw;
    font-size:8px;
    letter-spacing:2px;
    text-transform:uppercase;
}

@keyframes heroText{
    to{
        opacity:1;
        transform:translateY(0);
    }
}

.hero-image{
    min-height:700px;
    overflow:hidden;
    position:relative;
    background:#111;
}

.hero-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:grayscale(100%) contrast(1.08) brightness(.72);
    transform:scale(1.14);
    animation:heroImage 12s cubic-bezier(.2,.7,.2,1) forwards;
    transition:transform .25s ease-out;
}

@keyframes heroImage{
    from{
        transform:scale(1.14);
    }
    to{
        transform:scale(1);
    }
}

.hero-image:after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.18),
            transparent 50%,
            rgba(0,0,0,.2)
        );
    pointer-events:none;
}

.hero-caption{
    position:absolute;
    left:40px;
    bottom:40px;
    color:#fff;
    z-index:3;
    opacity:0;
    transform:translateY(30px);
    animation:heroText 1s 1s cubic-bezier(.2,.8,.2,1) forwards;
}

.hero-caption small{
    display:block;
    font-size:8px;
    letter-spacing:3px;
    text-transform:uppercase;
    margin-bottom:10px;
}

.hero-caption h2{
    font-family:var(--serif);
    font-size:56px;
    line-height:.85;
    font-weight:500;
}

.hero-number{
    position:absolute;
    right:25px;
    top:30px;
    color:#fff;
    z-index:4;
    writing-mode:vertical-rl;
    font-size:8px;
    letter-spacing:3px;
}

.scroll-indicator{
    position:absolute;
    right:5vw;
    bottom:28px;
    z-index:5;
    color:#fff;
    display:flex;
    align-items:center;
    gap:10px;
    font-size:8px;
    letter-spacing:2px;
    text-transform:uppercase;
}

.scroll-line{
    width:50px;
    height:1px;
    background:#fff;
    position:relative;
    overflow:hidden;
}

.scroll-line:after{
    content:"";
    position:absolute;
    width:20px;
    height:1px;
    background:#fff;
    animation:scrollLine 1.5s infinite;
}

@keyframes scrollLine{
    from{
        left:-20px;
    }
    to{
        left:60px;
    }
}

.ornament{
    text-align:center;
    padding:35px 20px;
    font-family:var(--serif);
    font-size:23px;
}

.ornament:before,
.ornament:after{
    content:"";
    display:inline-block;
    width:90px;
    height:1px;
    background:#000;
    vertical-align:middle;
    margin:0 20px;
}

.intro{
    padding:130px 5vw;
    display:grid;
    grid-template-columns:.4fr 1.6fr;
    gap:80px;
}

.section-number{
    font-size:9px;
    letter-spacing:3px;
    text-transform:uppercase;
    font-weight:700;
}

.intro-title{
    font-family:var(--serif);
    font-size:clamp(48px,6vw,88px);
    line-height:.9;
    font-weight:500;
    max-width:900px;
}

.intro-title em{
    font-style:italic;
}

.intro-text{
    max-width:650px;
    margin-top:38px;
    font-size:15px;
    line-height:1.9;
    color:#333;
}

.stats{
    border-top:1px solid #000;
    border-bottom:1px solid #000;
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.stat{
    padding:45px 20px;
    text-align:center;
    border-right:1px solid var(--line);
}

.stat:last-child{
    border-right:0;
}

.stat-number{
    font-family:var(--serif);
    font-size:58px;
    line-height:1;
}

.stat-label{
    margin-top:12px;
    font-size:8px;
    letter-spacing:2px;
    text-transform:uppercase;
}

.collection{
    padding:130px 5vw;
}

.section-heading{
    border-bottom:1px solid #000;
    padding-bottom:20px;
    margin-bottom:35px;
    display:flex;
    justify-content:space-between;
    align-items:end;
}

.section-heading h2{
    font-family:var(--serif);
    font-size:60px;
    line-height:.8;
    font-weight:500;
}

.section-heading span{
    font-size:9px;
    letter-spacing:2px;
    text-transform:uppercase;
}

.collection-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.feature-card{
    position:relative;
    min-height:570px;
    overflow:hidden;
    border:1px solid #000;
}

.feature-card img{
    height:100%;
    object-fit:cover;
    filter:grayscale(100%) contrast(1.05);
    transition:transform 1s cubic-bezier(.2,.8,.2,1),filter .8s;
}

.feature-card:hover img{
    transform:scale(1.08);
    filter:grayscale(65%);
}

.feature-overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:end;
    padding:35px;
    color:#fff;
    background:linear-gradient(transparent 42%,rgba(0,0,0,.9));
}

.feature-overlay h3{
    font-family:var(--serif);
    font-size:50px;
    line-height:.9;
    font-weight:500;
}

.feature-overlay p{
    font-size:11px;
    line-height:1.6;
    margin-top:12px;
    max-width:400px;
}

.feature-small{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.small-card{
    border:1px solid #000;
    overflow:hidden;
    min-height:275px;
    position:relative;
}

.small-card img{
    height:100%;
    object-fit:cover;
    filter:grayscale(100%);
    transition:.8s;
}

.small-card:hover img{
    transform:scale(1.1);
    filter:grayscale(60%);
}

.small-card-content{
    position:absolute;
    inset:auto 0 0 0;
    padding:22px;
    color:#fff;
    background:linear-gradient(transparent,rgba(0,0,0,.9));
}

.small-card-content h3{
    font-family:var(--serif);
    font-size:31px;
    font-weight:500;
}

.rooms{
    background:#000;
    color:var(--paper);
    padding:130px 5vw;
}

.rooms .section-heading{
    border-color:rgba(244,241,225,.35);
}

.room-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.room{
    transition:transform .5s ease;
}

.room:hover{
    transform:translateY(-8px);
}

.room-image{
    height:540px;
    overflow:hidden;
}

.room-image img{
    height:100%;
    object-fit:cover;
    filter:grayscale(100%);
    transition:.8s;
}

.room:hover .room-image img{
    transform:scale(1.07);
    filter:grayscale(65%);
}

.room-info{
    border:1px solid rgba(244,241,225,.3);
    border-top:0;
    padding:30px;
}

.room-info h3{
    font-family:var(--serif);
    font-size:44px;
    font-weight:500;
}

.room-info p{
    color:#c9c6b9;
    max-width:500px;
    font-size:13px;
    line-height:1.8;
    margin-top:10px;
}

.room-info a{
    display:inline-block;
    margin-top:25px;
    color:var(--paper);
    text-decoration:none;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:2px;
}

.dining{
    padding:130px 5vw;
}

.dining-intro{
    max-width:850px;
    font-family:var(--serif);
    font-size:64px;
    line-height:.95;
    font-weight:500;
    margin-bottom:60px;
}

.dining-intro em{
    font-style:italic;
}

.dining-list{
    border-top:1px solid #000;
}

.dining-row{
    display:grid;
    grid-template-columns:70px 1fr 1fr 40px;
    align-items:center;
    gap:25px;
    padding:28px 0;
    border-bottom:1px solid var(--line);
    transition:.4s;
}

.dining-row:hover{
    padding-left:18px;
    padding-right:18px;
    background:rgba(0,0,0,.045);
}

.dining-no{
    font-size:9px;
    letter-spacing:2px;
}

.dining-name{
    font-family:var(--serif);
    font-size:30px;
}

.dining-type{
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:2px;
}

.dining-arrow{
    font-size:20px;
    transition:.3s;
}

.dining-row:hover .dining-arrow{
    transform:translateX(8px);
}

.meetings{
    background:#000;
    color:var(--paper);
    padding:130px 5vw;
}

.meeting-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.meeting-image{
    height:600px;
    overflow:hidden;
}

.meeting-image img{
    height:100%;
    object-fit:cover;
    filter:grayscale(100%);
    transition:.8s;
}

.meeting-image:hover img{
    transform:scale(1.06);
    filter:grayscale(60%);
}

.meeting-content h2{
    font-family:var(--serif);
    font-size:80px;
    font-weight:500;
    line-height:.82;
}

.meeting-content h2 em{
    font-style:italic;
}

.meeting-content p{
    max-width:480px;
    color:#c7c4b7;
    font-size:14px;
    line-height:1.9;
    margin-top:35px;
}

.sustainability{
    padding:130px 5vw;
}

.sustainability-grid{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:80px;
}

.sustainability-image{
    height:530px;
    overflow:hidden;
}

.sustainability-image img{
    height:100%;
    object-fit:cover;
    filter:grayscale(100%);
    transition:.8s;
}

.sustainability-image:hover img{
    transform:scale(1.06);
    filter:grayscale(60%);
}

.sustainability-content h2{
    font-family:var(--serif);
    font-size:75px;
    line-height:.85;
    font-weight:500;
}

.sustainability-content h2 em{
    font-style:italic;
}

.sustainability-content p{
    max-width:570px;
    font-size:14px;
    line-height:1.9;
    color:#333;
    margin-top:35px;
}

.getaway{
    padding:0 5vw 130px;
}

.getaway-box{
    position:relative;
    min-height:650px;
    overflow:hidden;
}

.getaway-box img{
    height:650px;
    object-fit:cover;
    filter:grayscale(100%);
    transition:transform 1.2s ease;
}

.getaway-box:hover img{
    transform:scale(1.05);
}

.getaway-overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:#fff;
    background:rgba(0,0,0,.42);
}

.getaway-overlay h2{
    font-family:var(--serif);
    font-size:90px;
    font-weight:500;
    line-height:.8;
}

.getaway-overlay h2 em{
    font-style:italic;
}

.getaway-overlay p{
    margin-top:25px;
    font-size:9px;
    letter-spacing:3px;
    text-transform:uppercase;
}

.video-section{
    background:#000;
    color:var(--paper);
    padding:130px 5vw;
}

.video-heading{
    display:flex;
    justify-content:space-between;
    align-items:end;
    border-bottom:1px solid rgba(244,241,225,.3);
    padding-bottom:20px;
    margin-bottom:35px;
}

.video-heading h2{
    font-family:var(--serif);
    font-size:60px;
    font-weight:500;
}

.video-heading span{
    font-size:9px;
    letter-spacing:2px;
    text-transform:uppercase;
}

.cinematic-video{
    position:relative;
    height:650px;
    overflow:hidden;
    border:1px solid rgba(244,241,225,.25);
}

.cinematic-video video{
    width:100%;
    height:100%;
    object-fit:cover;
    filter:grayscale(100%) contrast(1.08) brightness(.58);
}

.video-overlay{
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    pointer-events:none;
}

.video-overlay h3{
    font-family:var(--serif);
    font-size:100px;
    line-height:.78;
    font-weight:500;
    color:#fff;
}

.video-overlay h3 em{
    font-style:italic;
}

.quote{
    padding:140px 5vw;
    text-align:center;
}

.quote-label{
    font-size:9px;
    letter-spacing:3px;
    text-transform:uppercase;
}

.quote h2{
    max-width:1050px;
    margin:35px auto 0;
    font-family:var(--serif);
    font-size:78px;
    font-weight:500;
    line-height:.9;
}

.quote h2 em{
    font-style:italic;
}

footer{
    background:#000;
    color:var(--paper);
    padding:80px 5vw 30px;
}

.footer-grid{
    display:grid;
    grid-template-columns:1.3fr 1fr 1fr;
    gap:70px;
    padding-bottom:60px;
}

.footer-logo{
    font-family:var(--serif);
    font-size:50px;
    line-height:.8;
}

.footer-desc{
    max-width:350px;
    margin-top:25px;
    color:#bdb9ac;
    font-size:12px;
    line-height:1.8;
}

.footer-title{
    font-size:9px;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:20px;
}

.footer-link{
    display:block;
    text-decoration:none;
    color:#d0ccc0;
    font-size:12px;
    margin-bottom:11px;
    transition:.3s;
}

.footer-link:hover{
    color:#fff;
    transform:translateX(5px);
}

.footer-bottom{
    border-top:1px solid rgba(244,241,225,.25);
    padding-top:25px;
    display:flex;
    justify-content:space-between;
    font-size:8px;
    text-transform:uppercase;
    letter-spacing:2px;
}

.booking-modal{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.75);
    backdrop-filter:blur(8px);
    z-index:10000;
    display:none;
    align-items:center;
    justify-content:center;
    padding:20px;
}

.booking-modal.active{
    display:flex;
    animation:modalFade .35s ease;
}

@keyframes modalFade{
    from{
        opacity:0;
    }
    to{
        opacity:1;
    }
}

.booking-box{
    width:min(850px,100%);
    max-height:90vh;
    overflow:auto;
    background:var(--paper);
    border:1px solid #000;
    padding:45px;
    position:relative;
    animation:modalUp .5s cubic-bezier(.2,.8,.2,1);
}

@keyframes modalUp{
    from{
        opacity:0;
        transform:translateY(40px) scale(.97);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}

.booking-close{
    position:absolute;
    top:18px;
    right:20px;
    width:35px;
    height:35px;
    border:1px solid #000;
    background:transparent;
    cursor:pointer;
    font-size:18px;
}

.booking-head{
    border-bottom:1px solid #000;
    padding-bottom:25px;
    margin-bottom:30px;
}

.booking-head small{
    font-size:8px;
    letter-spacing:3px;
    text-transform:uppercase;
}

.booking-head h2{
    font-family:var(--serif);
    font-size:55px;
    font-weight:500;
    line-height:.9;
    margin-top:12px;
}

.booking-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}

.field{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.field.full{
    grid-column:1/-1;
}

.field label{
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:1.5px;
    font-weight:700;
}

.field input,
.field select{
    height:48px;
    background:transparent;
    border:1px solid #000;
    padding:0 13px;
    outline:none;
}

.field input:focus,
.field select:focus{
    box-shadow:inset 0 0 0 1px #000;
}

.booking-submit{
    grid-column:1/-1;
    margin-top:10px;
    height:52px;
    background:#000;
    color:var(--paper);
    border:1px solid #000;
    cursor:pointer;
    font-size:10px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}

.booking-message{
    display:none;
    margin-top:20px;
    padding:15px;
    border:1px solid #000;
    font-size:12px;
    line-height:1.6;
}

.reveal{
    opacity:0;
    transform:translateY(45px);
    transition:
        opacity 1s ease,
        transform 1s cubic-bezier(.2,.8,.2,1);
}

.reveal.visible{
    opacity:1;
    transform:translateY(0);
}

@media(max-width:1000px){

    .nav-links{
        display:none;
    }

    .hero{
        grid-template-columns:1fr;
    }

    .hero-content{
        border-right:0;
        min-height:650px;
    }

    .hero-image{
        min-height:550px;
    }

    .collection-grid{
        grid-template-columns:1fr;
    }

    .meeting-layout,
    .sustainability-grid{
        grid-template-columns:1fr;
    }

    .video-overlay h3{
        font-size:75px;
    }

}

@media(max-width:700px){

    .top-bar{
        font-size:7px;
        letter-spacing:2px;
    }

    .nav{
        height:75px;
        padding:0 20px;
    }

    .brand-mark{
        width:35px;
        height:35px;
    }

    .brand-main{
        font-size:21px;
    }

    .brand-sub{
        font-size:6px;
    }

    .book-btn{
        padding:11px 13px;
        font-size:8px;
    }

    .hero-content{
        padding:55px 20px 65px;
    }

    .hero-title{
        font-size:72px;
        letter-spacing:-4px;
    }

    .hero-title em{
        margin-left:25px;
    }

    .hero-description{
        margin-top:35px;
    }

    .hero-actions{
        flex-direction:column;
        align-items:flex-start;
    }

    .hero-image{
        min-height:430px;
    }

    .hero-caption{
        left:20px;
        bottom:25px;
    }

    .hero-caption h2{
        font-size:42px;
    }

    .scroll-indicator{
        display:none;
    }

    .ornament:before,
    .ornament:after{
        width:35px;
        margin:0 8px;
    }

    .intro{
        padding:90px 20px;
        grid-template-columns:1fr;
        gap:30px;
    }

    .stats{
        grid-template-columns:1fr 1fr;
    }

    .stat{
        padding:30px 10px;
    }

    .stat-number{
        font-size:45px;
    }

    .collection,
    .rooms,
    .dining,
    .meetings,
    .sustainability,
    .video-section,
    .quote{
        padding:90px 20px;
    }

    .section-heading h2,
    .video-heading h2{
        font-size:45px;
    }

    .feature-small{
        grid-template-columns:1fr;
    }

    .feature-card{
        min-height:430px;
    }

    .room-grid{
        grid-template-columns:1fr;
    }

    .room-image{
        height:400px;
    }

    .dining-intro{
        font-size:48px;
    }

    .dining-row{
        grid-template-columns:35px 1fr 25px;
        gap:10px;
    }

    .dining-type{
        display:none;
    }

    .meeting-image{
        height:400px;
    }

    .meeting-content h2{
        font-size:62px;
    }

    .sustainability-image{
        height:400px;
    }

    .sustainability-content h2{
        font-size:65px;
    }

    .getaway{
        padding:0 20px 90px;
    }

    .getaway-box,
    .getaway-box img{
        min-height:500px;
        height:500px;
    }

    .getaway-overlay h2{
        font-size:62px;
    }

    .cinematic-video{
        height:500px;
    }

    .video-overlay h3{
        font-size:55px;
    }

    .quote h2{
        font-size:55px;
    }

    .footer-grid{
        grid-template-columns:1fr;
        gap:40px;
    }

    .footer-bottom{
        flex-direction:column;
        gap:10px;
    }

    .booking-box{
        padding:30px 20px;
    }

    .booking-head h2{
        font-size:43px;
    }

    .booking-form{
        grid-template-columns:1fr;
    }

    .field.full{
        grid-column:auto;
    }

    .booking-submit{
        grid-column:auto;
    }

}