/* Our Doorstep — component presentation.
   Replaces cb-overrides.css; do not load both brand variants together.
   Selectors are based on the supplied CB overrides, not a full starter audit. */

/* Folit headings; a single regular face should not be artificially boldened. */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.cg-grid .card-title {
    font-family: var(--ps-font-heading);
    font-weight: 400;
    font-synthesis: none;
    letter-spacing: normal;
}

/* Header: white with a wide logo, retaining the starter's navigation behaviour. */
.ps-header {
    background: var(--ps-header-bg);
    border-bottom: 1px solid var(--od-line);
}

    .ps-header .ps-navbar .container {
        min-height: 104px;
    }

    .ps-header .ps-navbar-brand {
        min-width: 0;
        max-width: 100%;
    }

    .ps-header .site-logo {
        display: block;
        width: clamp(180px, 25vw, 320px);
        max-width: 100%;
        height: auto;
    }

    .ps-header .navbar-toggler {
        color: var(--od-ivy);
    }

/* Offcanvas */
.ps-offcanvas {
    background: var(--od-white);
    color: var(--ps-ink);
}

    .ps-offcanvas .ps-nav-link {
        color: var(--od-ivy) !important;
        font-weight: 600;
        text-decoration: none;
    }

        .ps-offcanvas .ps-nav-link:hover,
        .ps-offcanvas .ps-nav-link:focus-visible,
        .ps-offcanvas .ps-nav-link.active {
            color: var(--od-orange-text) !important;
            text-decoration: underline;
            text-underline-offset: .2em;
        }

        .ps-offcanvas .ps-nav-link.ps-nav-btn.ps-btn {
            background: var(--od-white);
            border: 2px solid var(--od-ivy);
            color: var(--od-ivy) !important;
        }

            .ps-offcanvas .ps-nav-link.ps-nav-btn.ps-btn:hover,
            .ps-offcanvas .ps-nav-link.ps-nav-btn.ps-btn:focus-visible {
                background: var(--od-soft);
                border-color: var(--od-ivy);
                color: var(--od-ivy) !important;
            }

/* Footer: Ivy with white links. Button components retain their own tokens. */
.ps-footer {
    background: var(--od-ink);
    color: var(--od-white);
}

    .ps-footer a:not(.ps-btn):not(.btn),
    .ps-footer-link:not(.ps-btn):not(.btn) {
        color: var(--ps-footer-link);
        font-weight: 600;
        text-decoration: underline;
        text-underline-offset: .2em;
    }

        .ps-footer a:not(.ps-btn):not(.btn):hover,
        .ps-footer a:not(.ps-btn):not(.btn):focus-visible,
        .ps-footer-link:not(.ps-btn):not(.btn):hover,
        .ps-footer-link:not(.ps-btn):not(.btn):focus-visible {
            color: var(--ps-footer-link-hover);
        }

/* Content grid: green headings and full-colour images.
   The old CB grayscale filter and 800 heading weight are intentionally absent. */
.cg-grid .card-title,
.cg-grid h2,
.cg-grid h3 {
    color: var(--od-ivy);
    font-weight: 400;
    letter-spacing: normal;
}

/* Optional supporting panels, for use on wrappers you control. */
.od-panel--soft {
    background: var(--od-soft);
    color: var(--od-ink);
}

.od-panel--lichen {
    background: var(--od-lichen);
    color: var(--od-ink);
}

    .od-panel--lichen h1, .od-panel--lichen h2, .od-panel--lichen h3,
    .od-panel--lichen h4, .od-panel--lichen h5, .od-panel--lichen h6,
    .od-panel--lichen .card-title {
        color: var(--od-ink);
    }

    .od-panel--lichen a:not(.ps-btn):not(.btn),
    .od-panel--soft a:not(.ps-btn):not(.btn) {
        color: var(--od-ink);
        text-decoration: underline;
        text-underline-offset: .2em;
    }

        .od-panel--lichen a:not(.ps-btn):not(.btn):hover,
        .od-panel--soft a:not(.ps-btn):not(.btn):hover {
            text-decoration-thickness: 2px;
        }

/* Keyboard focus: two colours remain visible on light and dark surfaces. */
.ps-header a:focus-visible,
.ps-header button:focus-visible,
.ps-offcanvas a:focus-visible,
.ps-offcanvas button:focus-visible,
.ps-footer a:focus-visible,
.ps-footer button:focus-visible {
    outline: 2px solid var(--od-white);
    outline-offset: 2px;
    box-shadow: 0 0 0 5px var(--od-ivy);
}

/* OPTIONAL CB-style header: add od-nav-centred to <body> only after confirming
   the toggler opens the existing offcanvas at EVERY viewport size. */
.od-nav-centred .ps-header .ps-navbar .container {
    position: relative;
}

.od-nav-centred .ps-header .ps-navbar-brand {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(340px, calc(100% - 8rem));
    margin: 0 !important;
}

.od-nav-centred .ps-header .site-logo {
    width: 100%;
    height: auto;
}

.od-nav-centred .ps-header .navbar-toggler {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 0;
    padding: .5rem;
    margin-left: .25rem;
}

.od-nav-centred .ps-header .navbar-collapse,
.od-nav-centred .ps-header .ps-navbar-collapse {
    display: none !important;
}

@media (max-width: 575.98px) {
    .ps-header .ps-navbar .container {
        min-height: 84px;
    }

    .ps-header .site-logo {
        width: min(250px, 60vw);
    }

    .od-nav-centred .ps-header .ps-navbar-brand {
        width: min(260px, calc(100% - 7rem));
    }

    .od-nav-centred .ps-header .site-logo {
        width: 100%;
    }
}

/* =========================================================
   Our Doorstep — larger heading and button text
========================================================= */

h1, .h1 {
    font-size: clamp(2.75rem, 2rem + 3vw, 4rem);
    line-height: 1.1;
}

h2, .h2 {
    font-size: clamp(2.125rem, 1.5rem + 2vw, 3rem);
    line-height: 1.15;
}

h3, .h3 {
    font-size: clamp(1.625rem, 1.25rem + 1.5vw, 2.6rem);
    line-height: 1.2;
}

h4, .h4 {
    font-size: clamp(1.375rem, 1.125rem + 1vw, 1.75rem);
    line-height: 1.25;
}

h5, .h5 {
    font-size: 1.25rem;
    line-height: 1.3;
}

h6, .h6 {
    font-size: 1.125rem;
    line-height: 1.3;
}

.cg-grid .card-title {
    font-size: clamp(1.625rem, 1.25rem + 1.5vw, 2.25rem);
    line-height: 1.2;
}

.ps-btn, .btn {
    font-size: 1.125rem;
    line-height: 1.35;
    padding: .8rem 1.35rem;
}


.ps-nav-link,
.ps-header .nav-link,
.ps-offcanvas .nav-link,
.ps-btn,
.btn {
    font-family: var(--ps-font-heading);
    
}





/*  NAV STYLES */


.ps-nav-link,
.ps-header .nav-link,
.ps-offcanvas .nav-link,
.ps-btn,
.btn {
    font-family: var(--ps-font-heading);
    font-size: 1.7rem;
    font-weight: 600;
    font-style: normal;
    line-height: 1.4;
    letter-spacing: normal;
}




/* Base nav link */
.ps-header .ps-navbar .ps-nav-link {
    font-weight: 600;
    letter-spacing: 0.07em;
    text-decoration: none;
    transition: color .15s ease, background-color .15s ease, border-color .15s ease;
    
}





/* carousel specific updates */
/* Our Doorstep: hero and carousel titles */
.ps-hero .ps-hero__title {
    font-family: var(--ps-font-heading);
    font-size: clamp(2.75rem, 6vw, 5.5rem);
    font-weight: 400;
    line-height: 1.15;
    letter-spacing: normal;
    text-transform: none;
    max-width: 100%;
    margin: 0 0 1rem;
    overflow-wrap: break-word;
    /* Override the !important colour in site.css */
    color: #FE7002 !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.35);
}






/* testimonial text */


.ps-testimonial__body {
    text-align: center;
    position: relative;
    color: var(--ps-ink);
    line-height: 1.55;
    padding: 2.25rem 2.5rem;
    margin: 0;
    font-size: 1.4rem;
}





/* Email sign-up */


.ps-signup {
    max-width: 48rem;
    margin-inline: auto;
}

.ps-signup__introduction {
    margin-bottom: 1.5rem;
    white-space: pre-line;
}

.ps-signup .form-control {
    min-height: 3rem;
}

.ps-signup .form-label,
.ps-signup .form-check-label,
.ps-signup__submit {
    font-family: var(--bs-body-font-family);
}

.ps-signup__submit {
    min-height: 3rem;
    padding-inline: 1.75rem;
}

/* Keep the honeypot outside the visible form. */
.ps-signup__honeypot {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.ps-signup__message {
    margin-bottom: 1.5rem;
}

    .ps-signup__message[hidden],
    .ps-signup__form[hidden] {
        display: none !important;
    }


/* Hide the newsletter spam-trap field. */
.ps-signup .ps-signup__honeypot {
    display: none !important;
}


/* RTE updates */



.ps-rte .rte-display-1 {
    font-size: clamp(3.6rem, 4vw, 5.6rem);

}



.ps-rte .rte-display-2 {

    font-size: 3rem;
}





/*  Video Player hero */

.ps-video-player__overlayTitle {
    margin: 0;
    font-size: 1.6rem;
    line-height: 1.2;
}



/* lightgallery tweaks */



.ps-lg-intro {
    width: min(100%, 72rem);
    margin: 0 auto clamp(1rem, 2vw, 1.5rem);
    font-size:1.6rem;
}

.ps-lg-intro h2{
    
    font-size: 3.8rem;
}
