/*
Theme Name: Blindwells TRA
Description: Block theme for the Blindwells Tenants and Residents Association. Colours follow the Blindwells brand palette (sky blue, deep green, near-black).
Version: 0.1.0
Requires at least: 6.5
Requires PHP: 7.4
Text Domain: blindwells-tra
*/
.site-header{border-bottom:4px solid var(--wp--preset--color--sky)}
.site-header a{text-decoration:none}
.wp-block-navigation a:hover,.wp-block-navigation a:focus{color:var(--wp--preset--color--sky)}
.page-banner{min-height:240px}
.image-credit{font-size:.8rem;opacity:.85}
.hero a:not(.wp-block-button__link){color:#fff}
.tile{border-top:4px solid var(--wp--preset--color--sky);border-radius:4px}
.wp-block-button__link:hover,.wp-block-button__link:focus{background:var(--wp--preset--color--green)!important;color:#fff!important}
a:focus-visible,button:focus-visible{outline:3px solid var(--wp--preset--color--sky);outline-offset:2px}
.site-footer a{color:#fff}

/* Hero: solid green with the photo as a right-hand panel that fades in */
.hero{position:relative;overflow:hidden;min-height:460px;display:flex;flex-direction:column;justify-content:center;background:var(--wp--preset--color--green)}
.hero::after{content:"";position:absolute;top:0;right:0;bottom:0;left:60%;background:linear-gradient(90deg,var(--wp--preset--color--green) 0%,rgba(28,56,19,0) 30%),url(assets/hero.jpg) 50% 20%/cover no-repeat}
.hero>*{position:relative;z-index:1}
.hero>p,.hero>h1{padding-right:min(36%,430px)}
@media (max-width:900px){.hero::after{left:0;background:linear-gradient(rgba(28,56,19,.9),rgba(28,56,19,.9)),url(assets/hero.jpg) 50% 20%/cover no-repeat}.hero>p,.hero>h1{padding-right:0}}
.hero>*{box-sizing:border-box;width:100%;max-width:1140px;margin-left:auto!important;margin-right:auto!important;text-align:left}
.hero .wp-block-buttons{justify-content:flex-start}
/* Let page banners span the full window even inside the narrow content column */
.page-banner{width:100vw;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:0!important}
body{overflow-x:clip}

.page-banner,.page-banner.wp-block-cover{min-height:320px!important}
.page-banner img[src*="banner-seton"]{object-position:center 26%}
.page-banner img[src*="banner-john-muir"]{object-position:center 56%}