/*
Theme Name: VI Obituaries
Theme URI: https://vancouverislandobituaries.com/
Description: A custom GeneratePress child theme for Vancouver Island Obituaries.
Author: Victoria Buzz
Author URI: https://victoriabuzz.com/
Template: generatepress
Version: 1.1.0
Text Domain: vi-obituaries
*/

:root {
    --vio-green: #17352d;
    --vio-green-soft: #315c4e;
    --vio-cream: #f7f3ec;
    --vio-sand: #e7ddcc;
    --vio-gold: #b99549;
    --vio-charcoal: #272b29;
    --vio-muted: #6f736f;
    --vio-white: #ffffff;
    --vio-radius: 24px;
    --vio-shadow: 0 18px 50px rgba(23, 53, 45, 0.10);
}

body {
    background: #fff;
    color: var(--vio-charcoal);
    font-family: Inter, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.site-branding .main-title {
    font-family: "Playfair Display", Georgia, serif;
}

.site-header {
    background: rgba(255,255,255,.97);
    border-bottom: 1px solid #eee8df;
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: blur(12px);
}

.inside-header {
    padding-top: 18px;
    padding-bottom: 18px;
}

.site-logo img {
    max-height: 58px;
    width: auto;
}

.main-title a {
    color: var(--vio-green);
    font-size: 30px;
    letter-spacing: -.02em;
}

.site-description {
    color: var(--vio-muted);
    font-size: 13px;
}

.main-navigation {
    background: transparent;
}

.main-navigation .main-nav ul li a {
    color: var(--vio-green);
    font-weight: 700;
    font-size: 15px;
    padding-left: 16px;
    padding-right: 16px;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
    color: var(--vio-gold);
    background: transparent;
}

.main-navigation .menu-bar-item > a {
    color: var(--vio-green);
}

.site-content {
    padding: 0;
}

body.home .site-content,
body.page-template-page-full-width .site-content {
    max-width: none;
}

body.home .content-area,
body.page-template-page-full-width .content-area {
    width: 100%;
}

body.home .site-main,
body.page-template-page-full-width .site-main {
    margin: 0;
}

body.home article.page,
body.page-template-page-full-width article.page {
    margin: 0;
    padding: 0;
}

body.home .entry-header,
body.page-template-page-full-width .entry-header {
    display: none;
}

body.home .entry-content,
body.page-template-page-full-width .entry-content {
    margin: 0;
}

.vio-header-cta {
    display: inline-flex;
    align-items: center;
    background: var(--vio-green);
    color: #fff !important;
    border-radius: 999px;
    padding: 11px 18px !important;
    margin-left: 8px;
    line-height: 1;
}

.vio-header-cta:hover {
    background: var(--vio-green-soft) !important;
    color: #fff !important;
}

.vio-trust-bar {
    background: var(--vio-green);
    color: rgba(255,255,255,.9);
    text-align: center;
    font-size: 13px;
    padding: 8px 15px;
    letter-spacing: .01em;
}

.vio-trust-bar strong {
    color: #fff;
}

.vio-page-hero {
    background: linear-gradient(135deg, var(--vio-cream), #fff);
    border-bottom: 1px solid #e9e2d8;
    padding: 80px 20px 52px;
    text-align: center;
}

.vio-page-hero .vio-eyebrow {
    color: var(--vio-gold);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .17em;
    font-weight: 800;
    margin-bottom: 10px;
}

.vio-page-hero h1 {
    color: var(--vio-green);
    font-size: clamp(44px, 7vw, 76px);
    line-height: 1;
    margin: 0 0 16px;
}

.vio-page-hero p {
    color: var(--vio-muted);
    font-size: 18px;
    max-width: 720px;
    margin: 0 auto;
    line-height: 1.65;
}

.vio-content-wrap {
    max-width: 980px;
    margin: 0 auto;
    padding: 60px 20px 90px;
}

.vio-content-card {
    background: #fff;
    border: 1px solid #e8e1d7;
    border-radius: var(--vio-radius);
    padding: 34px;
    box-shadow: var(--vio-shadow);
}

.site-footer {
    background: var(--vio-green);
    color: rgba(255,255,255,.75);
}

.footer-widgets {
    background: var(--vio-green);
    color: rgba(255,255,255,.78);
    border-top: 0;
}

.footer-widgets .widget-title,
.site-footer h2,
.site-footer h3 {
    color: #fff;
}

.footer-widgets a,
.site-footer a {
    color: #fff;
}

.inside-site-info {
    border-top: 1px solid rgba(255,255,255,.12);
    padding-top: 24px;
    padding-bottom: 24px;
}

.vio-footer-brand {
    max-width: 1180px;
    margin: 0 auto;
    padding: 54px 20px 30px;
    display: grid;
    grid-template-columns: 1.3fr .7fr .7fr;
    gap: 40px;
}

.vio-footer-brand h2 {
    font-size: 34px;
    margin: 0 0 14px;
}

.vio-footer-brand p {
    max-width: 520px;
    line-height: 1.7;
}

.vio-footer-brand ul {
    margin: 0;
    list-style: none;
}

.vio-footer-brand li {
    margin-bottom: 9px;
}

.vio-mobile-actions {
    display: none;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.wp-block-button__link {
    border-radius: 999px;
}

a {
    transition: color .2s ease, background .2s ease, transform .2s ease;
}

@media (max-width: 1024px) {
    .vio-header-cta {
        display: none;
    }

    .inside-header {
        padding-left: 18px;
        padding-right: 18px;
    }
}

@media (max-width: 768px) {
    .site-header {
        position: relative;
    }

    .inside-header {
        padding-top: 14px;
        padding-bottom: 14px;
    }

    .site-logo img {
        max-height: 48px;
    }

    .vio-page-hero {
        padding-top: 58px;
    }

    .vio-content-card {
        padding: 24px;
    }

    .vio-footer-brand {
        grid-template-columns: 1fr;
        padding-bottom: 90px;
    }

    .vio-mobile-actions {
        position: fixed;
        left: 12px;
        right: 12px;
        bottom: 12px;
        z-index: 999;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        background: rgba(255,255,255,.97);
        border: 1px solid #ded7cd;
        border-radius: 18px;
        padding: 8px;
        box-shadow: 0 14px 40px rgba(23,53,45,.18);
    }

    .vio-mobile-actions a {
        text-align: center;
        text-decoration: none;
        border-radius: 13px;
        padding: 12px 8px;
        font-size: 13px;
        font-weight: 800;
    }

    .vio-mobile-actions a:first-child {
        background: var(--vio-green);
        color: #fff;
    }

    .vio-mobile-actions a:last-child {
        background: var(--vio-cream);
        color: var(--vio-green);
    }
}


/* v1.1 mobile-first visual upgrade */
.vio-header-scrolled { box-shadow: 0 8px 28px rgba(23,53,45,.09); }

@media (max-width: 768px) {
    html { scroll-padding-top: 70px; }
    body { padding-bottom: 76px; }

    .vio-trust-bar { display:none; }

    .site-header {
        position: sticky;
        top: 0;
        border-bottom: 1px solid rgba(23,53,45,.08);
        box-shadow: 0 5px 20px rgba(23,53,45,.07);
    }

    .inside-header {
        min-height: 66px;
        padding: 9px 15px;
        align-items: center;
    }

    .site-branding-container,
    .site-logo { margin-right:auto; }

    .site-logo img { max-height: 44px; }
    .main-title a { font-size: 23px; line-height:1; }
    .site-description { display:none; }
    .menu-toggle { border-radius: 50%; width:44px; height:44px; padding:0; background:var(--vio-cream); color:var(--vio-green); }

    .main-navigation.toggled .main-nav {
        position:absolute;
        top:100%;
        left:12px;
        right:12px;
        background:#fff;
        border:1px solid #e5ded4;
        border-radius:18px;
        padding:10px;
        box-shadow:0 20px 50px rgba(23,53,45,.16);
    }
    .main-navigation.toggled .main-nav ul li a { border-radius:12px; padding:13px 14px; }

    /* Full-bleed mobile homepage */
    body.home .grid-container,
    body.home .site.grid-container,
    body.home .site-content,
    body.home #primary,
    body.home .content-area { max-width:none; width:100%; padding:0; margin:0; }

    .ims-homepage { overflow:hidden; background:#fff; }

    .ims-home-hero {
        min-height: 520px !important;
        align-items:flex-end !important;
        text-align:left !important;
        background:
            linear-gradient(180deg,rgba(11,31,25,.05) 0%,rgba(11,31,25,.36) 50%,rgba(11,31,25,.92) 100%),
            radial-gradient(circle at 72% 18%,rgba(224,187,104,.42),transparent 27%),
            linear-gradient(145deg,#456b60,#17352d) !important;
    }

    .ims-home-hero:after {
        content:"VANCOUVER ISLAND";
        position:absolute;
        top:24px;
        left:20px;
        z-index:2;
        font-size:10px;
        font-weight:800;
        letter-spacing:.22em;
        color:rgba(255,255,255,.82);
    }

    .ims-home-hero-inner {
        width:100%;
        max-width:none !important;
        padding:86px 18px 28px !important;
    }

    .ims-home-hero .ims-eyebrow { display:none; }
    .ims-home-hero h1 {
        font-size:46px !important;
        line-height:.96 !important;
        max-width:340px;
        margin:0 0 14px !important;
        text-wrap:balance;
    }
    .ims-hero-copy {
        margin:0 0 22px !important;
        max-width:360px !important;
        font-size:16px !important;
        line-height:1.55 !important;
        color:rgba(255,255,255,.85) !important;
    }

    .ims-advanced-search {
        grid-template-columns:1fr 1fr !important;
        padding:8px !important;
        gap:7px !important;
        border-radius:18px !important;
        background:rgba(255,255,255,.98) !important;
        box-shadow:0 14px 36px rgba(0,0,0,.25) !important;
    }
    .ims-search-name { grid-column:1/-1; }
    .ims-search-field label { display:none !important; }
    .ims-search-field input,
    .ims-search-field select { height:45px !important; border-radius:11px !important; font-size:13px !important; }
    .ims-advanced-search button { grid-column:1/-1; height:46px !important; border-radius:11px !important; font-size:13px; letter-spacing:.04em; }

    .ims-section { padding:44px 16px !important; }
    .ims-section-heading { text-align:left !important; margin:0 0 22px !important; }
    .ims-section-heading h2 { font-size:36px !important; line-height:1.02 !important; }
    .ims-eyebrow { font-size:10px !important; }

    .ims-featured-section { padding-top:28px !important; }
    .ims-featured-memorial {
        display:block !important;
        border-radius:24px !important;
        background:#fff !important;
        box-shadow:0 16px 38px rgba(23,53,45,.12) !important;
        border:1px solid #e9e1d6;
        overflow:hidden;
    }
    .ims-featured-image { min-height:0 !important; aspect-ratio:1.12/1; }
    .ims-featured-content { padding:24px !important; }
    .ims-featured-content h2 { font-size:39px !important; margin-bottom:13px !important; }
    .ims-featured-tribute { font-size:19px !important; margin:8px 0 12px !important; }
    .ims-featured-content > p:not(.ims-featured-meta):not(.ims-featured-tribute) { display:none; }

    .ims-memorial-grid {
        display:flex !important;
        gap:14px !important;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        padding:2px 2px 15px;
        margin-right:-16px;
        scrollbar-width:none;
    }
    .ims-memorial-grid::-webkit-scrollbar { display:none; }
    .ims-memorial-card {
        flex:0 0 78%;
        scroll-snap-align:start;
        border-radius:20px !important;
    }
    .ims-memorial-photo { aspect-ratio:1.18/1 !important; }
    .ims-memorial-card-body { padding:18px !important; }
    .ims-memorial-card h3 { font-size:27px !important; margin-bottom:13px !important; }

    .ims-services-band { position:relative; }
    .ims-services-band:before {
        content:"";
        position:absolute; inset:0;
        background:radial-gradient(circle at 100% 0,rgba(185,149,73,.18),transparent 40%);
        pointer-events:none;
    }
    .ims-service-grid { grid-template-columns:1fr !important; gap:10px !important; }
    .ims-service-card {
        display:grid !important;
        grid-template-columns:78px 1fr;
        align-items:center;
        column-gap:14px;
        padding:17px !important;
        border-radius:17px !important;
    }
    .ims-service-card .ims-service-date { grid-row:1/3; }
    .ims-service-card strong { font-size:23px !important; margin:0 !important; }

    .ims-community-grid {
        display:grid !important;
        grid-template-columns:1fr 1fr !important;
        gap:10px !important;
    }
    .ims-community-grid a {
        min-height:125px;
        display:flex;
        flex-direction:column;
        justify-content:flex-end;
        padding:16px !important;
        border-radius:18px !important;
        background:linear-gradient(145deg,#eff1eb,#e4ddcf) !important;
        position:relative;
        overflow:hidden;
    }
    .ims-community-grid a:before {
        content:"";
        position:absolute;
        width:90px;height:90px;
        border:1px solid rgba(23,53,45,.08);
        border-radius:50%;
        right:-28px;top:-28px;
    }
    .ims-community-grid strong { font-size:22px !important; position:relative; }
    .ims-community-grid span { position:relative; }

    .ims-funeral-grid {
        display:flex !important;
        overflow-x:auto;
        gap:14px !important;
        margin-right:-16px;
        padding-bottom:12px;
        scroll-snap-type:x mandatory;
        scrollbar-width:none;
    }
    .ims-funeral-grid::-webkit-scrollbar { display:none; }
    .ims-funeral-card { flex:0 0 82%; scroll-snap-align:start; border-radius:20px !important; }

    .ims-submit-cta {
        margin:28px 14px 40px !important;
        padding:44px 22px !important;
        border-radius:25px !important;
        text-align:left !important;
        background:linear-gradient(145deg,#17352d,#315c4e) !important;
        color:#fff;
    }
    .ims-submit-cta h2 { color:#fff !important; font-size:40px !important; }
    .ims-submit-cta p:not(.ims-eyebrow) { color:rgba(255,255,255,.78) !important; font-size:16px !important; }
    .ims-submit-cta .ims-primary-button { background:#fff !important; color:var(--vio-green) !important; }

    .vio-mobile-actions {
        left:10px;
        right:10px;
        bottom:9px;
        border-radius:19px;
        padding:7px;
        gap:7px;
        background:rgba(255,255,255,.94);
        backdrop-filter:blur(16px);
    }
    .vio-mobile-actions a {
        min-height:48px;
        display:flex;
        align-items:center;
        justify-content:center;
        gap:7px;
        padding:10px !important;
        font-size:14px !important;
    }
    .vio-mobile-actions span { font-size:20px; line-height:1; }

    .site-footer { margin-bottom:0; }
}

@media (max-width: 390px) {
    .ims-home-hero h1 { font-size:41px !important; }
    .ims-memorial-card { flex-basis:84%; }
    .ims-community-grid { grid-template-columns:1fr !important; }
    .ims-community-grid a { min-height:105px; }
}
