/* ========================================
   THE GEORGE OF STAMFORD
   MAIN PAGE
   ======================================== */

.george-page {
    width: 84% !important;
    max-width: 1170px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 10px !important;
}


/* ========================================
   HEADER
   ======================================== */

/* Upper three-column header */
header.wp-block-template-part > .george-header-columns {
    width: calc(100% - 100px) !important;
    max-width: none !important;
    margin-left: 50px !important;
    margin-right: 50px !important;
}

/* Main navigation */
header.wp-block-template-part > .wp-block-navigation {
    width: calc(100% - 100px) !important;
    max-width: none !important;
    margin-left: 50px !important;
    margin-right: 50px !important;
}

/* Match live George desktop navigation typography */
.george-desktop-nav .wp-block-navigation-item__content {
    font-size: 16px !important;
}

/* Three-column proportions */
.george-header-columns > .header-search {
    flex-basis: 25% !important;
}

.george-header-columns > .header-logo {
    flex-basis: 50% !important;
}

.george-header-columns > .header-contact {
    flex-basis: 25% !important;
}


/* Homepage direct-booking message */
.george-booking-direct {
    font-family: Lato, sans-serif !important;
    font-weight: 400 !important;
    margin-top: 45px !important;
    margin-bottom: 25px !important;
}

/* Homepage event headings */
.george-event-heading {
    font-family: Lato, sans-serif !important;
    font-size: 21.33px !important;
    font-weight: 400 !important;
    line-height: 23px !important;
    color: #f1c40f !important;
    text-align: center;
}

/* Standard George body copy */
.george-body-copy {
    font-family: Lato, Helvetica, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 23px !important;
    color: #000 !important;
    text-align: justify;
}

/* Wider text measure used by selected George homepage copy */
.george-wide-copy {
    width: 1000px !important;
    max-width: none !important;
    margin-left: 50% !important;
    transform: translateX(-50%);
}

/* Centred read-more text */
.george-read-more {
    text-align: center !important;
}


/* Homepage feature headings */
.george-feature-heading {
    font-family: Lato, Helvetica, Arial, sans-serif !important;
    font-size: 22px !important;
    font-weight: 400 !important;
    line-height: 31px !important;
    color: #cc00ff !important;
    text-align: center !important;
}


/* Spoiling Sundays images */
.george-spoiling-image img {
    border: 1px solid #000;
    width: 250px !important;
    height: 188px !important;
}

/* Parking heading */
.george-parking-heading {
    color: #00cc00 !important;
}

/* Memorial heading */
.george-memorial-heading {
    font-family: Lato, Helvetica, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 23px !important;
    color: #000 !important;
    text-align: center !important;
}

/* ========================================
   REGISTER FORM LINK
   ======================================== */
   
.george-subscribe a {
    color: #ff00ff !important;
} 

/* Homepage subscription message */
.george-subscribe {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

.george-subscribe {
    /*color: #ff00ff !important;*/
    font-weight: 500 !important;
}




/* ========================================
   BOTTOM FEATURE NAVIGATION
   ======================================== */

.george-bottom-nav p {
    width: 180px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 5px !important;

    font-family: Lato, Helvetica, Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 300 !important;
    line-height: 18px !important;
    color: #000 !important;
    text-align: left !important;
}

.george-bottom-nav p a {
    color: #000 !important;
    text-decoration: none !important;
}

/* Bottom navigation images */
.george-bottom-nav .wp-block-image {
    width: 180px !important;
    height: 134px !important;
    margin: 0 !important;
}

.george-bottom-nav .wp-block-image img {
    width: 180px !important;
    height: 134px !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    display: block;
}

/* Space and centre the four bottom navigation tiles */
.george-bottom-nav {
    width: 810px !important;
    max-width: none !important;
    margin-left: 50% !important;
    margin-right: 0 !important;
    transform: translateX(-50%);

    display: flex !important;
    justify-content: space-between !important;
    gap: 30px !important;
}

.george-bottom-nav > .wp-block-column {
    flex: 0 0 180px !important;
}

/* Bottom navigation caption chevrons */
.george-bottom-nav p::before {
    content: "›";
    display: inline-block;
    margin-right: 5px;
    font-family: Arial, sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    position: relative;
    top: -1px;
}


/* ========================================
   FOOTER
   ======================================== */

.george-footer {
    background-color: #fcfaf3 !important;
    padding-top: 0 !important;
    padding-bottom: 20px !important;
}

.george-footer p {
    font-family: Lato, Helvetica, Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 23px !important;
    color: #000 !important;
    text-align: center !important;
}

/* Footer rule and content width */
.george-footer {
    width: 945px !important;
    max-width: none !important;
    margin-left: 50% !important;
    transform: translateX(-50%);
}

.george-footer .wp-block-separator {
    width: 100% !important;
    max-width: none !important;
}

.george-footer p {
    width: 100% !important;
    max-width: none !important;
}

/* Pull George footer closer to bottom navigation */
.george-footer {
    margin-top: -50px !important;
}

/* ========================================
   RESPONSIVE
   ======================================== */






@media (max-width: 1000px) {
    .george-page {
        width: 94% !important;
    }
}

@media (max-width: 600px) {
    .george-page {
        width: 100% !important;
        margin-top: 0 !important;
    }
}

/* Allow the Header template part itself to use
   the full width of the cream George page */
.george-page > header.wp-block-template-part {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.george-home-hero {
    margin-top: 75px !important;
}

/* Desktop: hide mobile dropdown menu */
.george-mobile-dropdown {
    display: none !important;
}

/* ========================================
   MOBILE
   ======================================== */

/* Desktop: hide mobile-only elements */
.george-header-mobile,
.george-mobile-contact,
.george-mobile-nav {
    display: none !important;
}

/* George mobile navigation above sliders */
@media (max-width: 900px) {
    .george-mobile-dropdown {
        position: relative;
        z-index: 9999;
    }

    .wp-block-navigation__responsive-container {
        z-index: 9999;
    }
}


@media (max-width: 600px) {
    


    /* ========================================
       MOBILE HEADER
       ======================================== */

    /* Hide desktop header */
    .george-header-desktop {
        display: none !important;
    }

    /* Hide desktop navigation */
    .george-desktop-nav {
        display: none !important;
    }

    /* Mobile logo */
    .george-header-mobile {
        display: flex !important;
        width: 100% !important;
        margin: 0 !important;
        justify-content: center !important;
    }

/* Grey mobile navigation/contact bar */
header.wp-block-template-part > div.wp-block-group.george-mobile-bar {
    display: flex !important;

    width: 100vw !important;
    max-width: none !important;
    height: 55px !important;

    margin-left: 50% !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;
    padding: 0 !important;

    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;

    background-color: #deddd6 !important;
}

    /* Mobile menu area */
    .george-mobile-nav {
        display: flex !important;
        flex: 0 0 80px !important;

        width: 80px !important;
        height: 55px !important;

        margin: 0 !important;
        padding: 0 !important;

        align-items: center !important;
        justify-content: center !important;

        background-color: #deddd6 !important;
    }
    
    /* Hamburger with MENU label beneath */
.george-mobile-nav .wp-block-navigation__responsive-container-open {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 1px !important;
}


/* Mobile hamburger with three stripes and MENU label */
.george-mobile-nav .wp-block-navigation__responsive-container-open {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-end !important;

    width: 40px !important;
    height: 45px !important;
    padding: 0 0 3px 0 !important;
}

/* Hide WordPress's original two-stripe SVG */
.george-mobile-nav .wp-block-navigation__responsive-container-open svg {
    display: none !important;
}

/* Three-stripe hamburger */
.george-mobile-nav .wp-block-navigation__responsive-container-open::before {
    content: "";
    display: block;
    width: 20px;
    height: 12px;

    margin-bottom: 3px;

    background:
        linear-gradient(#000, #000) top / 20px 2px no-repeat,
        linear-gradient(#000, #000) center / 20px 2px no-repeat,
        linear-gradient(#000, #000) bottom / 20px 2px no-repeat;
}

/* MENU caption */
.george-mobile-nav .wp-block-navigation__responsive-container-open::after {
    content: "MENU";

    font-family: Lato, Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 13px;
    color: #000;
}

.george-mobile-nav .wp-block-navigation__responsive-container-open::after {
    content: "MENU";
    font-family: Lato, Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 13px;
    color: #000;
}

/* Mobile menu closed by default */
header.wp-block-template-part > nav.george-mobile-dropdown {
    display: none !important;
}

/* Mobile menu open */
header.wp-block-template-part.george-mobile-menu-open > nav.george-mobile-dropdown {
    display: flex !important;
}

/* Mobile submenu toggle: invisible but functional */
.george-mobile-dropdown
.wp-block-navigation__container > .wp-block-navigation-item.has-child {
    position: relative !important;
    padding-right: 35px !important;
}

.george-mobile-dropdown
.wp-block-navigation__container > .wp-block-navigation-item.has-child
> .wp-block-navigation__submenu-icon {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 35px !important;
    height: 35px !important;
    margin: 0 !important;
    opacity: 0 !important;
    z-index: 2 !important;
}

/* Indent mobile submenu links */
.george-mobile-dropdown
.wp-block-navigation__submenu-container
.wp-block-navigation-item__content {
    padding-left: 30px !important;
}

    /* Contact area */
    .george-mobile-contact {
        display: flex !important;
        flex: 1 1 auto !important;

        width: auto !important;
        height: 55px !important;

        margin: 0 !important;
        padding: 0 10px !important;

        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: space-around !important;
        gap: 10px !important;

        background-color: #deddd6 !important;
    }
    
    /* Remove touch/click focus outlines from mobile menu */
.george-mobile-dropdown
.wp-block-navigation-item:focus:not(:focus-visible),
.george-mobile-dropdown
.wp-block-navigation-item__content:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}

    /* Contact typography */
    .george-mobile-contact p {
        margin: 0 !important;
        padding: 0 !important;

        white-space: nowrap !important;

        font-family: Lato, Helvetica, Arial, sans-serif !important;
        font-size: 15px !important;
        font-weight: 300 !important;
        line-height: 16px !important;
    }

    /* Hide desktop separator */
    header.wp-block-template-part > .wp-block-separator {
        display: none !important;
    }

.george-mobile-bar {
    gap: 0 !important;
    background: #deddd6 !important;
}

.george-mobile-bar > .george-mobile-nav {
    margin: 0 !important;
}

.george-mobile-bar > .george-mobile-contact {
    margin: 0 !important;
}

/* Mobile dropdown navigation */
    header.wp-block-template-part > nav.george-mobile-dropdown {
    display: none !important;
    width: 100vw !important;
    max-width: none !important;

    margin-left: 50% !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;

    padding: 0 !important;
    background: #fff !important;
}

/* Full-width vertical mobile menu */
.george-mobile-dropdown .wp-block-navigation__container {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    width: 100% !important;
    max-width: none !important;
    flex: 1 1 100% !important;

    gap: 0 !important;
    padding: 5px 0 7px 0 !important;
}

/* Each top-level item */
.george-mobile-dropdown .wp-block-navigation__container > .wp-block-navigation-item {
    width: auto !important;
}

/* Top-level menu text */
.george-mobile-dropdown .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
    box-sizing: border-box !important;
    width: 100% !important;

    padding: 6px 23px !important;

    font-family: "Raleway", sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 18px !important;

    color: #555 !important;
    text-decoration: none !important;
}

/* Mobile submenu typography */
.george-mobile-dropdown
.wp-block-navigation__submenu-container
.wp-block-navigation-item__content {
    font-family: "Raleway", sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    line-height: 23px !important;
}

/* Mobile submenus: expand within the menu */
.george-mobile-dropdown
.wp-block-navigation__submenu-container {
    position: static !important;
}

.george-mobile-dropdown
.wp-block-navigation__submenu-container {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
}

/* Stack mobile parent headings and submenus vertically */
.george-mobile-dropdown
.wp-block-navigation__container > .wp-block-navigation-item.has-child {
    flex-direction: column !important;
    align-items: flex-start !important;
}









    /* ========================================
       MOBILE CONTENT
       ======================================== */

    .george-wide-copy {
        width: auto !important;
        max-width: none !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        transform: none !important;
    }


    /* ========================================
       MOBILE BOTTOM FEATURE NAVIGATION
       ======================================== */

    .george-bottom-nav {
        width: auto !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 25px !important;
    }

    .george-bottom-nav > .wp-block-column {
        flex: none !important;
        width: 180px !important;
    }


    /* ========================================
       MOBILE FOOTER
       ======================================== */

    .george-footer {
        width: auto !important;
        max-width: none !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        transform: none !important;
    }

}


    /* ========================================
       NAVIGATION OVERVIEW
       ======================================== */


/* Keep desktop navigation on one line */
@media (min-width: 782px) {
    .george-desktop-nav .wp-block-navigation__container {
        width: 100%;
        flex-wrap: nowrap;
    }
}

/* Main navigation typography */
.wp-block-navigation {
    font-family: "Raleway", sans-serif;
    font-size: 16px;
    font-weight: 300;
}

    /* ========================================
       TABLET VIEWPORT TWEAKS
       ======================================== */

/* Tablet: allow wide desktop copy to become responsive */
@media (max-width: 1100px) {
    .george-wide-copy {
        width: calc(100% - 40px) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        transform: none !important;
    }
    
.george-footer {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
    box-sizing: border-box;
}

/* Narrow tablet bottom navigation */
@media (max-width: 900px) {

    .george-bottom-nav {
        width: calc(100% - 40px) !important;
        max-width: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
        transform: none !important;
        gap: 20px !important;
        flex-wrap: nowrap !important;
    }

.george-bottom-nav > .wp-block-column {
    flex: 0 0 calc((100% - 60px) / 4) !important;
    width: calc((100% - 60px) / 4) !important;
    min-width: 0 !important;
}

    
    .george-bottom-nav img {
    max-width: 100% !important;
    height: auto !important;
}
}
    

}

/* Spoiling Sundays images */
.george-spoiling-image {
    float: none !important;
    width: fit-content !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Spoiling Sundays two-image row */
.george-spoiling-images {
    flex-wrap: nowrap !important;
}

.george-spoiling-images > .wp-block-column {
    flex-basis: 50% !important;
}


/* George internal pages: responsive content container */

.george-internal-content {
    box-sizing: border-box;
    width: 100%;
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    background-color: #fcfaf3;
}

@media (max-width: 1199px) {
    .george-internal-content {
        max-width: 970px;
    }
}

@media (max-width: 991px) {
    .george-internal-content {
        max-width: 750px;
    }
}

@media (max-width: 767px) {
    .george-internal-content {
        max-width: 100%;
    }
}


/* ========================================
   HEADER VERTICAL SPACING commented out because it spaced the menu too far down but it may be useful in future
   ======================================== 

 Space between upper header row and navigation 
.george-header-columns {
    margin-bottom: 12px !important;
}

 Remove Gutenberg's default top margin from navigation 
.george-header-nav {
    margin-top: 0 !important;
}*/


/* Internal page content alignment */
.george-internal-content .wp-block-post-content {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

.george-internal-content .wp-block-post-content > * {
    margin-left: 0;
    margin-right: 0;
}

/* Internal pages: outer cream panel */
.george-internal-page {
    box-sizing: border-box;
    width: 84% !important;
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 10px !important;
    background-color: #fcfaf3 !important;
}

/* Prevent desktop header contact details wrapping */
@media (min-width: 782px) {
    .george-header-columns > .header-contact {
        min-width: 210px !important;
    }
}

/* Allow the George content container to use available page width */
.george-page > main.wp-block-group {
    width: 100% !important;
    max-width: none !important;
}

/* George bedroom navigation: mobile layout */
@media (max-width: 767px) {

    .george-bottom-nav {
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
        width: 100% !important;
    }

    .george-bottom-nav > .wp-block-column {
        flex-basis: auto !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #b0aa94;
        position: relative;
    }

    /* Hide desktop thumbnails */
    .george-bottom-nav .wp-block-image {
        display: none !important;
    }

    /* Style each bedroom menu item */
    .george-bottom-nav .wp-block-column > p {
        margin: 0 !important;
        padding: 14px 42px 14px 14px !important;
        font-size: 16px;
        line-height: 20px;
        color: #222;
    }

    /* White navigation arrow */
    .george-bottom-nav .wp-block-column::after {
        content: "❯";
        position: absolute;
        right: 14px;
        top: 50%;
        transform: translateY(-50%);
        color: white;
        font-size: 18px;
        pointer-events: none;
    }
}

/* George text navigation: mobile layout */
@media (max-width: 767px) {

    .george-text-nav {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
    }

    .george-text-nav > p {
        margin: 0 !important;
        text-align: center !important;
        width: 100% !important;
    }
}


@media (min-width: 1001px) {
    .george-page .entry-content > p,
    .george-page .entry-content > h4 {
        max-width: 820px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Standard George content width */
.george-content-standard {
    width: 100%;
    max-width: 760px;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 40px !important;
}

/* George Hotel - Contact page table */

.george-contact-table {
    width: 100%;
    table-layout: auto;
}

.george-contact-table td {
    padding: 5px 8px;
    border: none;
    vertical-align: top;
}

.george-contact-table td:first-child {
    white-space: nowrap;
}

.george-contact-table td:last-child {
    white-space: nowrap;
}

.george-contact-table td:nth-child(2) {
    white-space: nowrap;
}

/* George Hotel - Contact email alignment */

.george-contact-email {
    display: grid !important;
    grid-template-columns: 192px minmax(0, 1fr);
    width: 100%;
    column-gap: 0;
    align-items: start;
}

.george-contact-email > p {
    margin: 0;
    min-width: 0;
}

.george-contact-email > p:last-child {
    white-space: nowrap;
    overflow-wrap: normal;
}


.george-contact-table td {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* George Contact - consistent column alignment */

.george-contact-table {
    width: 100%;
    table-layout: fixed !important;
}

.george-contact-table td:nth-child(1) {
    width: 192px;
}

.george-contact-table td:nth-child(2) {
    width: 175px;
}

.george-contact-table td:nth-child(3) {
    width: auto;
}

.george-contact-email {
    display: grid !important;
    grid-template-columns: 192px minmax(0, 1fr);
    width: 100%;
}

.george-contact-email > p {
    margin: 0;
}

.george-contact-email > p:last-child {
    white-space: nowrap;
    overflow-wrap: normal;
}

/* George Hotel - Postal address alignment */

.george-postal-address {
    padding-left: 29px !important;
    box-sizing: border-box;
}

/* George Hotel - Global bold text weight */

strong,b {
    
    font-weight: 500 !important;
}