/*=================================================================
    THE STORY SPACE — ADVANCED FOOTER
    Brand-new footer build. Uses the site's existing tokens
    (--gold / --dark / --card / --text / --grey) plus a few
    footer-local tokens for the aurora + frame-line motif.
=================================================================*/

.ss-footer{
    --ss-line: rgba(212,175,55,.16);
    --ss-line-soft: rgba(255,255,255,.08);
    --ss-glass: rgba(255,255,255,.035);

    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: var(--dark);
    padding: 130px 0 0;
}

/* ---------- Ambient backdrop: aurora glow + viewfinder grid ---------- */

.ss-footer-aurora{
    position: absolute;
    z-index: 0;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    opacity: .55;
}

.ss-footer-aurora-a{
    top: -180px;
    left: -140px;
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(212,175,55,.30), transparent 70%);
}

.ss-footer-aurora-b{
    bottom: -220px;
    right: -160px;
    width: 560px;
    height: 560px;
    background: radial-gradient(circle, rgba(255,255,255,.06), transparent 70%);
}

.ss-footer-grid-lines{
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .5;
    background-image:
        linear-gradient(var(--ss-line-soft) 1px, transparent 1px),
        linear-gradient(90deg, var(--ss-line-soft) 1px, transparent 1px);
    background-size: 3.333% 100%, 100% 120px;
    mask-image: linear-gradient(180deg, rgba(0,0,0,.55), transparent 55%);
    -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.55), transparent 55%);
}

.ss-footer .container{
    position: relative;
    z-index: 1;
}

/*=================================================================
    BOOKING PANEL
=================================================================*/

.ss-booking{
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.3fr);
    gap: 0;
    margin-top: 10px;
    margin-bottom: 70px;
    border: 1px solid var(--ss-line);
    border-radius: 28px;
    overflow: hidden;
    background: linear-gradient(155deg, rgba(212,175,55,.06), rgba(255,255,255,.015) 45%, rgba(0,0,0,.2));
    box-shadow: 0 40px 90px rgba(0,0,0,.45);
}

.ss-booking-info{
    position: relative;
    padding: 50px 44px;
    border-right: 1px solid var(--ss-line);
    background: rgba(255,255,255,.015);
}

.ss-booking-info::before{
    content: "";
    position: absolute;
    left: 0;
    top: 40px;
    bottom: 40px;
    width: 3px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--gold), transparent);
}

.ss-booking-tag{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--gold);
    padding: 8px 16px;
    border: 1px solid rgba(212,175,55,.35);
    border-radius: 999px;
    background: rgba(212,175,55,.08);
    margin-bottom: 22px;
}

.ss-booking-info h3{
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: 36px;
    color: var(--text);
    margin-bottom: 16px;
    line-height: 1.25;
}

.ss-booking-info p{
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    line-height: 1.85;
    color: var(--grey);
    margin-bottom: 30px;
    max-width: 40ch;
}

.ss-booking-pills{
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 30px;
}

.ss-pill{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 14px;
    background: rgba(255,255,255,.03);
    color: var(--text);
    text-decoration: none;
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    font-weight: 500;
    transition: .35s ease;
}

.ss-pill i{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex: none;
    border-radius: 50%;
    color: var(--gold);
    background: rgba(212,175,55,.1);
    font-size: 15px;
    transition: .35s ease;
}

.ss-pill:hover{
    border-color: rgba(212,175,55,.4);
    background: rgba(212,175,55,.07);
    transform: translateX(4px);
    color: var(--text);
}

.ss-pill:hover i{
    background: var(--gold);
    color: #111;
}

.ss-booking-hours{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding-top: 24px;
    border-top: 1px dashed rgba(255,255,255,.12);
}

.ss-booking-hours i{
    width: 38px;
    height: 38px;
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--gold);
    background: rgba(212,175,55,.1);
    font-size: 15px;
}

.ss-booking-hours h6{
    font-family: 'Cormorant Garamond', serif;
    color: var(--text);
    font-size: 17px;
    margin-bottom: 4px;
}

.ss-booking-hours p{
    font-family: 'Cormorant Garamond', serif;
    font-size: 13.5px;
    color: var(--grey);
    margin: 0;
}

/* ---- Form ---- */

.ss-form{
    padding: 50px 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ss-form-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 22px;
    margin-bottom: 26px;
}

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

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

.ss-field label{
    font-family: 'Cormorant Garamond', serif;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .5px;
    color: var(--grey);
}

.ss-field input,
.ss-field select,
.ss-field textarea{
    width: 100%;
    background: rgb(255 255 255 / 30%);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    padding: 14px 16px;
    color: #909090;
    font-family: 'Cormorant Garamond', serif;
    font-size: 14.5px;
    outline: none;
    transition: .3s ease;
}

.ss-field textarea{
    resize: vertical;
    min-height: 90px;
}

.ss-field input::placeholder,
.ss-field textarea::placeholder{
    color: rgba(255,255,255,.35);
}

.ss-field select{
    color-scheme: dark;
}

.ss-field-hint{
    font-family: 'Cormorant Garamond', serif;
    font-size: 13px;
    color: rgba(255,255,255,.4);
    letter-spacing: .2px;
}

.ss-field-hint.is-limit{
    color: #e07a5f;
}

.ss-field input:focus,
.ss-field select:focus,
.ss-field textarea:focus{
    border-color: var(--gold);
    background: rgba(212,175,55,.05);
    box-shadow: 0 0 0 3px rgba(212,175,55,.12);
}

.ss-submit{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    align-self: flex-start;
    padding: 15px 34px;
    border: none;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--gold), #f2d675);
    color: #111;
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: 17px;
    letter-spacing: .5px;
    cursor: pointer;
    transition: .35s ease;
    box-shadow: 0 14px 32px rgba(212,175,55,.28);
}

.ss-submit i{
    transition: .35s ease;
}

.ss-submit:hover{
    transform: translateY(-3px);
    box-shadow: 0 20px 40px rgba(212,175,55,.4);
}

.ss-submit:hover i{
    transform: translateX(5px);
}

/*=================================================================
    MAIN GRID (brand / links / services / contact)
=================================================================*/

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

.ss-footer-col{
    position: relative;
    padding-left: 6px;
}

.ss-footer-col + .ss-footer-col{
    border-left: 1px solid var(--ss-line);
    padding-left: 40px;
}

.ss-footer-logo{
    max-width: 190px;
    margin-bottom: 22px;
}

.ss-footer-desc{
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    line-height: 1.9;
    color: var(--grey);
    max-width: 34ch;
    margin-bottom: 26px;
}

.ss-footer-social{
    display: flex;
    gap: 12px;
}

.ss-footer-social a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.14);
    color: var(--text);
    font-size: 16px;
    transition: .35s ease;
}

.ss-footer-social a:hover{
    background: var(--gold);
    border-color: var(--gold);
    color: #111;
    transform: translateY(-4px);
}

.ss-footer-heading{
    font-family: 'Cormorant Garamond', serif;
    font-size: 24px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 24px;
    position: relative;
    padding-bottom: 14px;
}

.ss-footer-heading::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 34px;
    height: 2px;
    background: var(--gold);
}

.ss-footer-list{
    list-style: none;
    margin: 0;
    padding: 0;
}

.ss-footer-list li{
    margin-bottom: 13px;
}

.ss-footer-list a{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--grey);
    text-decoration: none;
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    transition: .3s ease;
}

.ss-footer-list a i{
    font-size: 11px;
    color: var(--gold);
    opacity: 0;
    transform: translateX(-6px);
    transition: .3s ease;
}

.ss-footer-list a:hover{
    color: gold;
    padding-left: 2px;
    transform: scale(1.2);
}

.ss-footer-list a:hover i{
    opacity: 1;
    transform: translateX(0);
}

.ss-footer-contact-list{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ss-footer-contact-list li{
    display: grid;
    grid-template-columns: 36px minmax(0,1fr);
    align-items: start;
    column-gap: 16px;
}

.ss-footer-contact-list i{
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--gold);
    background: rgba(212,175,55,.1);
    font-size: 14px;
}

.ss-footer-contact-list h6{
    font-family: 'Cormorant Garamond', serif;
    color: var(--text);
    font-size: 17px;
    margin-bottom: 4px;
}

.ss-footer-contact-list p,
.ss-footer-contact-list a{
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    /* line-height: 1.7; */
    color: var(--grey);
    text-decoration: none;
    margin: 0;
    overflow-wrap: anywhere;
    transition: .3s ease;
}

.ss-footer-contact-list a:hover{
    color: var(--gold);
}

/*=================================================================
    BOTTOM BAR
=================================================================*/

.ss-footer-bottom{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 26px 0;
    border-top: 1px solid var(--ss-line);
}

.ss-footer-copy{
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    color: var(--grey);
    margin: 0;
}

.ss-footer-copy a{
    color: var(--gold);
    font-weight: 600;
    text-decoration: none;
}

.ss-footer-powered{
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Cormorant Garamond', serif;
    font-size: 17px;
    color: var(--grey);
}

.ss-footer-powered a{
    display: inline-flex;
    align-items: center;
}

.ss-footer-powered img{
    height: 32px;
    width: auto;
    /* filter: grayscale(1) brightness(1.6); */
    opacity: .85;
    transition: .3s ease;
}

.ss-footer-powered a:hover img{
    filter: none;
    opacity: 1;
}