:root {
    --red: #A71B1C;
    --red-dark: #7e1112;
    --red-soft: #fff1f1;
    --green: #61A71B;
    --teal: #1BA7A7;
    --purple: #611BA7;
    --ink: #171516;
    --ink-soft: #4f494b;
    --paper: #fffdf9;
    --soft: #f7f4ef;
    --line: #e9e2dc;
    --white: #ffffff;
    --shadow-sm: 0 12px 30px rgba(40, 27, 27, 0.08);
    --shadow-lg: 0 28px 80px rgba(40, 27, 27, 0.14);
    --radius-sm: 14px;
    --radius-md: 24px;
    --radius-lg: 36px;
    --shell: min(1180px, calc(100% - 40px));
    --font-heading: "Plus Jakarta Sans", system-ui, sans-serif;
    --font-body: "DM Sans", system-ui, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--ink);
    background: var(--paper);
    font-family: var(--font-body);
    font-size: 17px;
    line-height: 1.68;
    -webkit-font-smoothing: antialiased;
}
body.menu-is-open { overflow: hidden; }
body {
  top: 0 !important;
  position: static !important;
}
 
.goog-te-banner-frame,
.skiptranslate,
#goog-gt-tt,
.goog-te-balloon-frame {
  display: none !important;
}
 
.goog-text-highlight {
  background-color: transparent !important;
  box-shadow: none !important;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
address { font-style: normal; }

h1, h2, h3, h4 {
    margin: 0 0 18px;
    font-family: var(--font-heading);
    line-height: 1.08;
    letter-spacing: -0.035em;
}
h1 { font-size: clamp(2.7rem, 5.3vw, 5.6rem); }
h2 { font-size: clamp(2rem, 3.7vw, 3.85rem); }
h3 { font-size: clamp(1.25rem, 1.7vw, 1.55rem); }
p { margin: 0 0 18px; }

.site-shell { width: var(--shell); margin-inline: auto; }
.section { padding: 108px 0; }
.soft-section { background: var(--soft); }
.section-heading { max-width: 760px; margin-bottom: 52px; }
.centered-heading { margin-left: auto; margin-right: auto; text-align: center; }
.narrow-heading { max-width: 840px; }
.section-heading > p { color: var(--ink-soft); font-size: 1.1rem; }
.section-copy > p { color: var(--ink-soft); font-size: 1.06rem; }
.section-copy strong { color: var(--ink); }

.eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    color: var(--red);
    font-family: var(--font-heading);
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .16em;
    line-height: 1.2;
    text-transform: uppercase;
}
.eyebrow-light { color: rgba(255,255,255,.78); }
.eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--red); }
.material-symbols-rounded { font-size: 1.25em; line-height: 1; font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 16px; top: -80px; z-index: 9999; padding: 10px 16px; background: var(--ink); color: #fff; border-radius: 8px; }
.skip-link:focus { top: 16px; }

.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 50px;
    padding: 14px 22px;
    border: 2px solid transparent;
    border-radius: 999px;
    font-family: var(--font-heading);
    font-size: .86rem;
    font-weight: 800;
    letter-spacing: .04em;
    line-height: 1.2;
    text-decoration: none;
    text-transform: uppercase;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, color .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button:focus-visible, .text-link:focus-visible, a:focus-visible, button:focus-visible { outline: 3px solid rgba(27,167,167,.5); outline-offset: 3px; }
.button-primary { color: #fff; background: var(--red); box-shadow: 0 10px 26px rgba(167,27,28,.22); }
.button-primary:hover { background: var(--red-dark); box-shadow: 0 14px 34px rgba(167,27,28,.3); }
.button-outline { color: var(--ink); background: rgba(255,255,255,.72); border-color: var(--line); }
.button-outline:hover { border-color: var(--red); color: var(--red); }
.button-secondary { color: #fff; background: var(--teal); }
.button-secondary:hover { background: #128a8a; }
.button-dark { color: #fff; background: var(--ink); }
.button-dark:hover { background: #302c2d; }
.button-white { color: var(--red); background: #fff; }
.button-ghost-white { color: #fff; background: transparent; border-color: rgba(255,255,255,.45); }
.button-ghost-white:hover { background: rgba(255,255,255,.09); border-color: #fff; }
.text-link { display: inline-flex; gap: 8px; align-items: center; color: var(--red); font-family: var(--font-heading); font-weight: 800; text-decoration: none; }
.text-link:hover { gap: 13px; }

/* Header */
.site-header { position: sticky; top: 0; z-index: 1000; background: var(--paper); transition: box-shadow .2s ease; }
.site-header.is-scrolled { box-shadow: 0 8px 30px rgba(32,25,25,.09); }
.utility-bar { color: #f9eaea; background: #1d1819; font-size: .82rem; }
.utility-inner { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.utility-inner p, .utility-inner a, .utility-inner span { margin: 0; }
.utility-inner p, .utility-links a { display: flex; align-items: center; gap: 6px; }
.utility-links { display: flex; align-items: center; gap: 22px; }
.utility-links a { text-decoration: none; }
.nav-wrap { border-bottom: 1px solid rgba(75,58,58,.08); }
.nav-inner { min-height: 92px; display: flex; align-items: center; gap: 28px; }
.brand { display: flex; align-items: center; flex: 0 0 auto; text-decoration: none; }
.brand img, .brand .custom-logo { width: 104px; height: auto; max-height: 94px; object-fit: contain; }
.brand .custom-logo-link { display: block; }
.primary-navigation { margin-left: auto; }
.primary-menu { display: flex; align-items: center; gap: 25px; margin: 0; padding: 0; list-style: none; }
.primary-menu > li > a { position: relative; display: inline-flex; align-items: center; min-height: 42px; color: #403a3b; font-family: var(--font-heading); font-size: .76rem; font-weight: 800; letter-spacing: .035em; text-decoration: none; }
.primary-menu > li:not(.menu-item-donate) > a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 5px; height: 2px; background: var(--red); transition: right .2s ease; }
.primary-menu > li:not(.menu-item-donate) > a:hover::after { right: 0; }
.primary-menu .nav-donate, .primary-menu .menu-item-donate > a { min-height: 44px; padding: 0 18px; color: #fff; background: var(--red); border-radius: 999px; }
.menu-toggle { display: none; width: 48px; height: 48px; margin-left: auto; border: 0; border-radius: 50%; color: var(--ink); background: var(--soft); }
.menu-close-icon { display: none; }
.menu-toggle[aria-expanded="true"] .menu-open-icon { display: none; }
.menu-toggle[aria-expanded="true"] .menu-close-icon { display: inline; }
.mobile-quick-actions { display: none; }

/* Hero */
.hero-section { position: relative; overflow: hidden; min-height: 720px; padding: 86px 0 118px; background: linear-gradient(135deg, #fffaf6 0%, #fff 50%, #f6fbf9 100%); }
.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0,1.06fr) minmax(420px,.94fr); gap: 70px; align-items: center; }
.hero-copy h1 { max-width: 770px; font-size: clamp(3.2rem, 5.45vw, 5.45rem); }
.hero-tagline { max-width: 760px; margin-bottom: 22px; color: var(--red); font-family: var(--font-heading); font-size: clamp(1.2rem, 1.7vw, 1.58rem); font-weight: 800; line-height: 1.35; }
.hero-lede { max-width: 770px; color: var(--ink-soft); font-size: 1.08rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 12px 26px; margin-top: 36px; padding-top: 27px; border-top: 1px solid var(--line); }
.hero-trust > div { display: grid; grid-template-columns: auto auto; align-items: center; gap: 0 8px; }
.hero-trust .material-symbols-rounded { grid-row: 1 / 3; color: var(--green); font-size: 1.65rem; }
.hero-trust strong { font-family: var(--font-heading); font-size: .9rem; }
.hero-trust span:last-child { color: #777070; font-size: .78rem; }
.hero-media { position: relative; }
.hero-image-frame { position: relative; min-height: 555px; padding: 20px; border-radius: 180px 180px 34px 34px; background: #f0e9e4; box-shadow: var(--shadow-lg); }
.hero-image-frame > img { width: 100%; height: 515px; object-fit: cover; object-position: center; border-radius: 160px 160px 24px 24px; }
.hero-image-card { position: absolute; left: -38px; bottom: 36px; display: flex; gap: 13px; align-items: center; max-width: 330px; padding: 17px 19px; border: 1px solid rgba(255,255,255,.8); border-radius: 18px; background: rgba(255,255,255,.9); box-shadow: var(--shadow-sm); backdrop-filter: blur(10px); }
.hero-image-card .material-symbols-rounded { color: var(--red); font-size: 2rem; }
.hero-image-card strong, .hero-image-card span { display: block; }
.hero-image-card strong { font-family: var(--font-heading); font-size: .9rem; }
.hero-image-card span { color: var(--ink-soft); font-size: .78rem; }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(1px); opacity: .8; }
.hero-orb-one { width: 360px; height: 360px; right: -110px; top: 90px; background: rgba(27,167,167,.08); }
.hero-orb-two { width: 220px; height: 220px; left: -120px; bottom: 40px; background: rgba(167,27,28,.07); }
.hero-wave { position: absolute; left: -2%; right: -2%; bottom: -77px; height: 135px; border-radius: 50% 50% 0 0; background: var(--paper); }

/* Shared layouts */
.split-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(50px,7vw,95px); align-items: center; }
.section-media { position: relative; }
.media-main, .rounded-media img, .about-visual > img { width: 100%; min-height: 520px; object-fit: cover; border-radius: var(--radius-lg); }
.media-collage .media-main { aspect-ratio: 4/5; min-height: 0; }
.media-note { position: absolute; right: -26px; bottom: 35px; width: min(310px, 75%); padding: 19px; border-radius: 18px; color: #fff; background: var(--teal); box-shadow: var(--shadow-sm); }
.media-note .material-symbols-rounded { float: left; margin-right: 10px; font-size: 1.7rem; }
.media-note strong, .media-note span { display: block; }
.media-note strong { font-family: var(--font-heading); }
.media-note span { font-size: .84rem; opacity: .88; }

/* Services */
.section-services { background: #faf8f4; }
.service-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.service-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; box-shadow: 0 8px 24px rgba(30,25,25,.04); transition: transform .25s ease, box-shadow .25s ease; }
.service-card:hover { transform: translateY(-7px); box-shadow: var(--shadow-sm); }
.service-image { height: 245px; overflow: hidden; background: #eee; }
.service-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.service-card:hover .service-image img { transform: scale(1.035); }
.service-body { position: relative; min-height: 260px; padding: 48px 28px 28px; }
.service-body h3 { margin-bottom: 12px; }
.service-body p { color: var(--ink-soft); }
.service-icon { position: absolute; top: -25px; left: 26px; display: grid; place-items: center; width: 52px; height: 52px; border: 4px solid #fff; border-radius: 50%; color: #fff; font-size: 1.55rem; }
.service-red .service-icon { background: var(--red); }
.service-teal .service-icon { background: var(--teal); }
.service-purple .service-icon { background: var(--purple); }
.centered-action { display: flex; justify-content: center; margin-top: 40px; }

/* Donation */
.donation-feature { position: relative; overflow: hidden; color: #fff; background: linear-gradient(135deg, var(--red-dark), var(--red) 58%, #b92c2d); }
.donation-feature::before { content: ""; position: absolute; inset: auto auto -210px -110px; width: 420px; height: 420px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 45px rgba(255,255,255,.03), 0 0 0 90px rgba(255,255,255,.025); }
.donation-feature-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.08fr .92fr; gap: 75px; align-items: center; }
.donation-copy h2 { max-width: 720px; }
.donation-lede { color: rgba(255,255,255,.84); font-size: 1.08rem; }
.check-list { display: grid; gap: 11px; margin: 26px 0 34px; padding: 0; list-style: none; }
.check-list li { display: flex; gap: 10px; align-items: flex-start; }
.check-list .material-symbols-rounded { margin-top: 4px; color: #d8f0c2; }
.donation-actions, .inline-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.donation-visual { position: relative; }
.donation-visual img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 40px; box-shadow: 0 24px 70px rgba(70,0,0,.28); }
.donation-stamp { position: absolute; left: -35px; bottom: 34px; width: 228px; padding: 19px 20px; border-radius: 18px; color: var(--ink); background: #fff; box-shadow: var(--shadow-sm); transform: rotate(-2deg); }
.donation-stamp span, .donation-stamp strong { display: block; }
.donation-stamp span { color: var(--red); font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.donation-stamp strong { font-family: var(--font-heading); font-size: 1rem; line-height: 1.3; }

/* Impact */
.impact-section { background: var(--paper); }
.impact-flow { display: grid; grid-template-columns: repeat(7, auto); align-items: stretch; }
.impact-flow article { position: relative; width: 245px; padding: 27px 24px; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.impact-flow article .material-symbols-rounded { color: var(--red); font-size: 2.1rem; }
.impact-flow article:nth-of-type(2) .material-symbols-rounded { color: var(--teal); }
.impact-flow article:nth-of-type(3) .material-symbols-rounded { color: var(--purple); }
.impact-flow article:nth-of-type(4) .material-symbols-rounded { color: var(--green); }
.impact-flow h3 { margin: 16px 0 8px; }
.impact-flow p { margin: 0; color: var(--ink-soft); font-size: .93rem; }
.impact-number { position: absolute; top: 18px; right: 20px; color: #cfc7c3; font-family: var(--font-heading); font-size: .74rem; font-weight: 800; letter-spacing: .12em; }
.impact-arrow { display: grid; place-items: center; width: 55px; color: #b9b0ab; font-size: 1.5rem; }
.impact-close { margin-top: 42px; text-align: center; }
.impact-close p { font-size: 1.14rem; }

/* Prevention */
.prevention-section { background: linear-gradient(180deg,#f5fbfb 0%,#fff 100%); }
.prevention-visual { position: relative; max-width: 520px; margin-left: auto; }
.prevention-visual img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: 42px 42px 160px 42px; }
.prevention-badge { position: absolute; left: -50px; bottom: 30px; width: 280px; padding: 18px 20px; border-radius: 18px; background: #fff; box-shadow: var(--shadow-sm); }
.prevention-badge .material-symbols-rounded { float: left; margin: 3px 9px 0 0; color: var(--red); font-size: 1.8rem; }
.prevention-badge strong, .prevention-badge span { display: block; }
.prevention-badge strong { font-family: var(--font-heading); }
.prevention-badge span { color: var(--ink-soft); font-size: .8rem; }

/* Appointment */
.appointment-section { background: #fff; }
.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.steps-grid article { position: relative; min-height: 300px; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; }
.steps-grid article > .material-symbols-rounded { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 34px; border-radius: 16px; color: var(--red); background: var(--red-soft); font-size: 1.6rem; }
.steps-grid article:nth-child(2) > .material-symbols-rounded { color: var(--teal); background: #eafafa; }
.steps-grid article:nth-child(3) > .material-symbols-rounded { color: var(--purple); background: #f2eafa; }
.step-number { position: absolute; top: 26px; right: 26px; color: #c8bfbb; font-family: var(--font-heading); font-size: .82rem; font-weight: 800; }
.steps-grid p { color: var(--ink-soft); }
.steps-grid article > a { color: var(--red); font-weight: 800; text-decoration: none; }

/* Photo CTA */
.photo-cta { position: relative; min-height: 570px; display: flex; align-items: center; overflow: hidden; color: #fff; background-image: var(--photo-cta-image); background-position: center 45%; background-size: cover; }
.photo-cta-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(19,13,14,.84) 0%, rgba(19,13,14,.64) 44%, rgba(19,13,14,.18) 100%); }
.photo-cta-inner { position: relative; z-index: 1; max-width: 720px; margin-left: max(20px, calc((100vw - min(1180px, calc(100% - 40px))) / 2)); margin-right: auto; }
.photo-cta h2 { max-width: 650px; font-size: clamp(2.5rem,4vw,4.4rem); }
.photo-cta p { max-width: 630px; color: rgba(255,255,255,.82); font-size: 1.08rem; }

/* About */
.about-visual { position: relative; }
.about-visual > img { aspect-ratio: 4/3; min-height: 0; }
.year-card { position: absolute; right: -28px; bottom: -26px; padding: 18px 23px; border-radius: 18px; color: #fff; background: var(--purple); box-shadow: var(--shadow-sm); }
.year-card strong, .year-card span { display: block; }
.year-card strong { font-family: var(--font-heading); font-size: 2rem; line-height: 1; }
.year-card span { margin-top: 5px; font-size: .78rem; }

/* Reviews */
.testimonials-section { overflow: hidden; background: #f8f4f2; }
.reviews-heading-row { display: flex; justify-content: space-between; gap: 30px; align-items: end; }
.reviews-heading-row .section-heading { margin-bottom: 36px; }
.review-controls { display: flex; gap: 8px; margin-bottom: 40px; }
.review-controls button { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: #fff; }
.review-controls button:hover { border-color: var(--red); color: var(--red); }
.reviews-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px)/3); gap: 24px; overflow-x: auto; padding: 4px 4px 16px; scroll-snap-type: x mandatory; scrollbar-width: none; }
.reviews-track::-webkit-scrollbar { display: none; }
.review-card { min-height: 300px; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; scroll-snap-align: start; box-shadow: 0 8px 18px rgba(30,20,20,.035); }
.stars { margin-bottom: 20px; color: #d49622; font-size: 1rem; letter-spacing: .1em; }
.review-card p { color: #403a3b; font-size: 1.05rem; }
.review-card strong { color: var(--red); font-family: var(--font-heading); font-size: .9rem; }

/* FAQ */
.faq-section { background: #fff; }
.faq-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 80px; align-items: start; }
.faq-intro { position: sticky; top: 170px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 24px 0; font-family: var(--font-heading); font-size: 1.03rem; font-weight: 800; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary .material-symbols-rounded { flex: 0 0 auto; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--red); background: var(--red-soft); }
.faq-list details > div { padding: 0 55px 24px 0; color: var(--ink-soft); }

/* Partners */
.partners-section { background: #f8f7f4; }
.partner-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.partner-card { min-height: 180px; display: grid; place-items: center; padding: 28px; border: 1px solid #ebe6e2; border-radius: 18px; background: #fff; }
.partner-card img { width: 100%; max-width: 200px; max-height: 110px; object-fit: contain; filter: saturate(.8); opacity: .88; transition: filter .2s ease, opacity .2s ease, transform .2s ease; }
.partner-card:hover img { filter: none; opacity: 1; transform: scale(1.025); }

/* Final CTA */
.final-cta { padding: 72px 0; color: #fff; background: var(--red); }
.final-cta-inner { display: grid; grid-template-columns: 1.2fr .8fr; gap: 50px; align-items: center; }
.final-cta-inner h2 { max-width: 760px; margin-bottom: 0; font-size: clamp(2rem,3.4vw,3.5rem); }
.final-cta-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 12px; }

/* Footer */
.site-footer { color: #ded8da; background: #191516; }
.footer-main { padding: 78px 0 66px; }
.footer-grid { display: grid; grid-template-columns: 1.25fr .62fr .7fr 1.15fr; gap: 48px; }
.footer-brand img { width: 156px; height: auto; margin-bottom: 22px; }
.footer-brand p { max-width: 350px; color: #bdb5b7; }
.footer-give-link { color: #fff; font-family: var(--font-heading); font-weight: 800; text-decoration: none; }
.site-footer h2 { margin-bottom: 18px; color: #fff; font-size: 1.08rem; letter-spacing: -.01em; }
.footer-menu { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.footer-menu a, .site-footer address + p a { color: #c8c1c3; text-decoration: none; }
.footer-menu a:hover, .site-footer a:hover { color: #fff; }
.site-footer address, .site-footer address + p, .site-footer address + p + p { color: #bdb5b7; }
.footer-action { padding: 27px; border: 1px solid rgba(255,255,255,.09); border-radius: 22px; background: rgba(255,255,255,.045); }
.footer-action h2 { font-size: 1.55rem; line-height: 1.22; }
.footer-action p { color: #bbb4b6; font-size: .92rem; }
.footer-action .button { margin-top: 5px; }
.footer-bottom { padding: 18px 0; border-top: 1px solid rgba(255,255,255,.08); font-size: .78rem; }
.footer-bottom-inner { display: flex; justify-content: space-between; gap: 30px; }
.footer-bottom p { margin: 0; color: #9e9698; }
.footer-bottom a { color: #cfc9ca; }

/* Inner pages */
.inner-hero { padding: 78px 0; background: linear-gradient(135deg,#fff5f2 0%,#fff 60%,#f0fbf9 100%); }
.inner-hero-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 70px; align-items: center; }
.inner-hero-content h1 { max-width: 780px; font-size: clamp(2.8rem,5vw,5rem); }
.inner-hero-content > p { max-width: 720px; color: var(--ink-soft); font-size: 1.1rem; }
.inner-hero-media img { width: 100%; height: 420px; object-fit: cover; border-radius: 150px 30px 30px 30px; box-shadow: var(--shadow-sm); }
.simple-inner-hero { text-align: center; }
.simple-inner-hero .inner-hero-content { max-width: 860px; margin: auto; }
.simple-inner-hero .inner-hero-content > p { margin-inline: auto; }
.prose-wrap { max-width: 860px; }
.prose-wrap h2, .prose-wrap h3 { margin-top: 38px; }
.prose-wrap a { color: var(--red); }
.single-featured { margin-bottom: 36px; }
.single-featured img { border-radius: var(--radius-md); }

.about-facts-card { display: grid; gap: 2px; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--line); }
.about-facts-card > div { position: relative; padding: 27px 27px 27px 76px; background: #fff; }
.about-facts-card .material-symbols-rounded { position: absolute; left: 25px; top: 26px; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; color: var(--red); background: var(--red-soft); }
.about-facts-card strong { font-family: var(--font-heading); }
.about-facts-card p { margin: 6px 0 0; color: var(--ink-soft); font-size: .92rem; }

.notice-card { display: flex; gap: 17px; padding: 22px 24px; margin-bottom: 34px; border: 1px solid #f0d7a3; border-radius: 18px; background: #fff9eb; }
.notice-card > .material-symbols-rounded { color: #a86d00; font-size: 1.7rem; }
.notice-card p { margin: 3px 0 0; color: #6b5b3d; }
.pricing-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.price-card { padding: 29px; border: 1px solid var(--line); border-radius: 20px; background: #fff; }
.price-card > .material-symbols-rounded { color: var(--red); font-size: 1.7rem; }
.price-card h2 { margin: 19px 0 8px; font-size: 1.28rem; }
.price-card .price { display: block; margin-bottom: 9px; color: var(--red); font-family: var(--font-heading); font-size: 2.4rem; line-height: 1; }
.price-card p { margin: 0; color: var(--ink-soft); font-size: .9rem; }
.two-column-details { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: start; }
.detail-list { display: grid; gap: 24px; padding: 0; list-style: none; }
.detail-list li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; }
.detail-list li > .material-symbols-rounded { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; color: var(--red); background: var(--red-soft); }
.detail-list strong { font-family: var(--font-heading); }
.detail-list p { margin: 4px 0 0; color: var(--ink-soft); }
.compact-list { gap: 18px; }
.service-table-card { padding: 32px; border: 1px solid var(--line); border-radius: 24px; background: #fff; box-shadow: var(--shadow-sm); }
.service-table-card h2 { margin: 22px 0 8px; font-size: 1.3rem; }
.service-price-list { margin: 0; }
.service-price-list > div { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.service-price-list dt { color: var(--ink-soft); }
.service-price-list dd { margin: 0; font-family: var(--font-heading); font-weight: 800; }
.small-note { color: #777071; font-size: .8rem; }
.schedule-card { padding: 42px; border-radius: 30px; background: #f6fbfb; }
.schedule-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 24px 0 30px; }
.schedule-grid > div { padding: 22px; border: 1px solid #dbeeed; border-radius: 18px; background: #fff; }
.schedule-grid .material-symbols-rounded { color: var(--teal); font-size: 1.6rem; }
.schedule-grid strong { display: block; margin-top: 9px; font-family: var(--font-heading); }
.schedule-grid p { margin: 4px 0 0; color: var(--ink-soft); }

.appointment-layout { display: grid; grid-template-columns: 1fr .9fr; gap: 60px; align-items: start; }
.embed-shell { min-height: 430px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 38px; border: 2px dashed #dacfd0; border-radius: 26px; background: #fff; }
.embed-icon { display: grid; place-items: center; width: 62px; height: 62px; margin-bottom: 22px; border-radius: 18px; color: var(--purple); background: #f2eafa; font-size: 1.9rem; }
.embed-shell p { color: var(--ink-soft); }
.tip-card { padding: 40px; border: 1px solid var(--line); border-radius: 28px; }
.tips-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; margin-top: 30px; }
.tips-grid > div { padding: 18px; border-radius: 16px; background: var(--soft); }
.tips-grid strong { font-family: var(--font-heading); }
.tips-grid p { margin: 6px 0 0; color: var(--ink-soft); font-size: .9rem; }

.care-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.care-panel { padding: 40px; border: 1px solid var(--line); border-radius: 28px; background: #fff; }
.care-panel-icon { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 24px; border-radius: 17px; color: #fff; background: var(--red); font-size: 1.8rem; }
.care-panel:nth-child(2) .care-panel-icon { background: var(--teal); }
.number-list, .bullet-list { display: grid; gap: 12px; padding-left: 22px; color: var(--ink-soft); }
.care-after-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.aftercare-checklist { padding: 32px; border-radius: 24px; background: #fff; box-shadow: var(--shadow-sm); }
.dark-check-list { margin-bottom: 20px; }
.dark-check-list .material-symbols-rounded { color: var(--red); }
.care-detail-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
.care-detail-grid article { padding: 25px; border: 1px solid var(--line); border-radius: 20px; }
.care-detail-grid .material-symbols-rounded { color: var(--teal); font-size: 1.8rem; }
.care-detail-grid h3 { margin: 16px 0 8px; }
.care-detail-grid p { margin: 0; color: var(--ink-soft); font-size: .9rem; }

.faq-page-layout { display: grid; grid-template-columns: 330px 1fr; gap: 70px; align-items: start; }
.faq-page-nav { position: sticky; top: 150px; padding: 30px; border-radius: 24px; background: var(--soft); }
.faq-page-nav h2 { font-size: 1.7rem; }
.faq-page-nav p { color: var(--ink-soft); }
.faq-page-nav a:not(.button) { color: var(--red); }
.faq-list-large summary { font-size: 1.1rem; }

.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 50px; align-items: stretch; }
.contact-info-card { padding: 36px; border: 1px solid var(--line); border-radius: 26px; background: #fff; box-shadow: var(--shadow-sm); }
.contact-row { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 18px 0; border-top: 1px solid var(--line); }
.contact-row > .material-symbols-rounded { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; color: var(--red); background: var(--red-soft); }
.contact-row strong { font-family: var(--font-heading); }
.contact-row p { margin: 4px 0 0; color: var(--ink-soft); }
.contact-row a { color: var(--red); }
.contact-placeholder { min-height: 100%; }

.donate-hero { overflow: hidden; color: #fff; background: linear-gradient(135deg,var(--red-dark),var(--red)); }
.donate-hero-grid { min-height: 610px; display: grid; grid-template-columns: 1fr .9fr; gap: 60px; align-items: center; }
.donate-hero-copy { padding: 70px 0; }
.donate-hero-copy h1 { max-width: 730px; font-size: clamp(3rem,5.2vw,5.3rem); }
.donate-hero-copy p { max-width: 680px; color: rgba(255,255,255,.82); font-size: 1.1rem; }
.donate-hero-media { align-self: end; }
.donate-hero-media img { width: 100%; height: 550px; object-fit: cover; border-radius: 180px 180px 0 0; }
.donation-story-grid { display: grid; grid-template-columns: 1fr .9fr; gap: 65px; align-items: center; }
.donation-impact-card { padding: 34px; border-radius: 24px; background: #f9f5f2; }
.donation-impact-card h3 { margin-bottom: 20px; }
.donor-choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-top: 28px; }
.donor-choice-grid > div { padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.donor-choice-grid .material-symbols-rounded { color: var(--red); font-size: 1.8rem; }
.donor-choice-grid h3 { margin: 12px 0 7px; }
.donor-choice-grid p { margin: 0; font-size: .9rem; }

.post-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.post-card { overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.post-thumb img { width: 100%; height: 230px; object-fit: cover; }
.post-card-body { padding: 25px; }
.post-date { color: var(--red); font-size: .76rem; font-weight: 800; text-transform: uppercase; }
.post-card h2 { margin-top: 9px; font-size: 1.4rem; }
.post-card h2 a { text-decoration: none; }
.pagination { grid-column: 1 / -1; }
.not-found-section { min-height: 65vh; display: grid; place-items: center; text-align: center; }
.not-found-inner { max-width: 720px; }
.not-found-icon { display: grid; place-items: center; width: 86px; height: 86px; margin: 0 auto 24px; border-radius: 28px; color: var(--red); background: var(--red-soft); font-size: 2.7rem; }
.not-found-inner .hero-actions { justify-content: center; }

@media (max-width: 1190px) {
    .primary-menu { gap: 17px; }
    .primary-menu > li > a { font-size: .71rem; }
    .brand img, .brand .custom-logo { width: 96px; }
    .hero-grid { grid-template-columns: 1.08fr .92fr; gap: 45px; }
    .impact-flow { grid-template-columns: repeat(4,1fr); gap: 16px; }
    .impact-flow article { width: auto; }
    .impact-arrow { display: none; }
    .footer-grid { grid-template-columns: 1.1fr .7fr .8fr 1fr; gap: 30px; }
}

@media (max-width: 1099px) {
    :root { --shell: min(100% - 32px, 960px); }
    .section { padding: 86px 0; }
    .utility-bar { display: none; }
    .nav-inner { min-height: 80px; }
    .brand img, .brand .custom-logo { width: 88px; }
    .menu-toggle { display: grid; place-items: center; }
    .primary-navigation { position: fixed; top: 80px; right: 0; bottom: 0; left: 0; display: none; margin: 0; padding: 26px 20px 110px; overflow-y: auto; background: rgba(255,253,249,.98); backdrop-filter: blur(12px); }
    .primary-navigation.is-open { display: block; }
    .primary-menu { width: min(100%, 760px); margin: 0 auto; display: grid; gap: 0; }
    .primary-menu > li { border-bottom: 1px solid var(--line); }
    .primary-menu > li > a { width: 100%; min-height: 62px; justify-content: space-between; font-size: .9rem; }
    .primary-menu > li > a::after { display: none; }
    .primary-menu .nav-donate, .primary-menu .menu-item-donate > a { width: auto; justify-content: center; margin-top: 20px; }
    .mobile-quick-actions { position: fixed; z-index: 1100; left: 10px; right: 10px; bottom: 10px; display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid rgba(255,255,255,.6); border-radius: 16px; background: rgba(255,255,255,.92); box-shadow: 0 16px 45px rgba(20,15,15,.18); backdrop-filter: blur(10px); }
    .mobile-quick-actions a { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 50px; color: var(--ink); font-family: var(--font-heading); font-size: .74rem; font-weight: 800; text-decoration: none; text-transform: uppercase; }
    .mobile-quick-actions a:last-child { color: #fff; background: var(--red); }
    .site-footer { padding-bottom: 68px; }
    .hero-section { padding-top: 65px; }
    .hero-grid { grid-template-columns: 1fr 420px; }
    .hero-copy h1 { font-size: clamp(3rem,6.2vw,4.8rem); }
    .hero-image-frame { min-height: 500px; }
    .hero-image-frame > img { height: 460px; }
    .service-card-grid { gap: 16px; }
    .donation-feature-grid { gap: 45px; }
    .partner-grid { grid-template-columns: repeat(2,1fr); }
    .footer-grid { grid-template-columns: 1.2fr .8fr; }
    .inner-hero-grid { gap: 45px; }
    .pricing-grid { grid-template-columns: repeat(2,1fr); }
    .care-detail-grid { grid-template-columns: repeat(2,1fr); }
    .tips-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 840px) {
    body { font-size: 16px; }
    .section { padding: 74px 0; }
    .hero-section { min-height: 0; padding: 58px 0 110px; }
    .hero-grid, .split-grid, .donation-feature-grid, .inner-hero-grid, .two-column-details, .appointment-layout, .care-after-layout, .contact-grid, .donation-story-grid, .donate-hero-grid { grid-template-columns: 1fr; }
    .hero-copy { text-align: center; }
    .hero-copy .eyebrow { justify-content: center; }
    .hero-lede, .hero-tagline { margin-left: auto; margin-right: auto; }
    .hero-actions, .hero-trust { justify-content: center; }
    .hero-media { width: min(520px, 90%); margin: 20px auto 0; }
    .hero-image-card { left: -18px; }
    .hero-wave { bottom: -85px; }
    .media-collage, .prevention-visual, .about-visual { width: min(560px, 100%); margin-inline: auto; }
    .media-note { right: 15px; }
    .reverse-on-mobile .section-copy { order: 2; }
    .reverse-on-mobile .prevention-visual { order: 1; }
    .service-card-grid, .steps-grid { grid-template-columns: 1fr; }
    .service-card { display: grid; grid-template-columns: 250px 1fr; }
    .service-image { height: 100%; min-height: 270px; }
    .service-body { min-height: 270px; }
    .donation-visual { width: min(520px,90%); margin-inline: auto; }
    .impact-flow { grid-template-columns: 1fr 1fr; }
    .faq-layout { grid-template-columns: 1fr; gap: 35px; }
    .faq-intro { position: static; }
    .reviews-track { grid-auto-columns: calc((100% - 24px)/2); }
    .final-cta-inner { grid-template-columns: 1fr; text-align: center; }
    .final-cta-actions { justify-content: center; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
    .footer-bottom-inner { display: grid; text-align: center; }
    .inner-hero { padding: 60px 0; }
    .inner-hero-content { text-align: center; }
    .inner-hero-content > p { margin-inline: auto; }
    .inner-hero-media { width: min(560px, 100%); margin-inline: auto; }
    .inner-hero-media img { height: 390px; }
    .faq-page-layout { grid-template-columns: 1fr; gap: 35px; }
    .faq-page-nav { position: static; }
    .care-grid { grid-template-columns: 1fr; }
    .donate-hero-copy { padding: 60px 0 0; text-align: center; }
    .donate-hero-copy p { margin-inline: auto; }
    .donate-hero-media { width: min(540px, 92%); margin: 0 auto; }
    .post-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 620px) {
    :root { --shell: calc(100% - 28px); }
    h1 { font-size: clamp(2.45rem,12vw,3.7rem); }
    h2 { font-size: clamp(1.9rem,9vw,2.8rem); }
    .section { padding: 62px 0; }
    .nav-inner { min-height: 72px; }
    .brand img, .brand .custom-logo { width: 78px; }
    .primary-navigation { top: 72px; }
    .hero-section { padding-top: 44px; }
    .hero-copy h1 { font-size: clamp(2.7rem,13vw,4rem); }
    .hero-actions, .inline-actions, .donation-actions { display: grid; grid-template-columns: 1fr; }
    .hero-actions .button, .inline-actions .button, .donation-actions .button { width: 100%; }
    .hero-trust { display: grid; grid-template-columns: 1fr 1fr; text-align: left; }
    .hero-trust > div:last-child { grid-column: 1 / -1; width: 50%; margin-inline: auto; }
    .hero-media { width: 100%; }
    .hero-image-frame { min-height: 420px; padding: 12px; border-radius: 120px 120px 28px 28px; }
    .hero-image-frame > img { height: 396px; border-radius: 110px 110px 20px 20px; }
    .hero-image-card { left: 10px; right: 10px; bottom: 20px; max-width: none; }
    .media-main { min-height: 0; }
    .media-note, .prevention-badge, .year-card, .donation-stamp { position: static; width: 92%; margin: -22px auto 0; transform: none; }
    .service-card { display: block; }
    .service-image { min-height: 0; height: 225px; }
    .service-body { min-height: 0; }
    .donation-visual { width: 100%; }
    .impact-flow { grid-template-columns: 1fr; }
    .reviews-heading-row { align-items: flex-start; }
    .reviews-track { grid-auto-columns: 88%; }
    .partner-grid { grid-template-columns: 1fr 1fr; }
    .partner-card { min-height: 130px; padding: 18px; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-main { padding-top: 60px; }
    .inner-hero-content h1 { font-size: clamp(2.45rem,11.5vw,3.8rem); }
    .inner-hero-media img { height: 330px; border-radius: 100px 24px 24px 24px; }
    .pricing-grid, .schedule-grid, .care-detail-grid, .tips-grid, .donor-choice-grid { grid-template-columns: 1fr; }
    .notice-card { align-items: flex-start; }
    .schedule-card, .tip-card, .care-panel, .embed-shell, .contact-info-card { padding: 27px; }
    .faq-list details > div { padding-right: 0; }
    .donate-hero-media img { height: 410px; }
    .post-grid { grid-template-columns: 1fr; }
    .photo-cta { min-height: 640px; background-position: 62% center; }
    .photo-cta-overlay { background: linear-gradient(90deg, rgba(19,13,14,.87), rgba(19,13,14,.6)); }
    .photo-cta-inner { margin-inline: 14px; }
    .final-cta-actions { display: grid; width: 100%; }
    .final-cta-actions .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* ==========================================================
   v1.2 — Immersive hero, partner constellation & motion layer
   ========================================================== */

/* Global motion system */
html.has-motion-js .reveal-on-scroll {
    opacity: 0;
    transform: translate3d(0, 34px, 0) scale(.985);
    filter: blur(4px);
    transition:
        opacity .82s cubic-bezier(.2,.75,.2,1) var(--reveal-delay, 0ms),
        transform .95s cubic-bezier(.16,1,.3,1) var(--reveal-delay, 0ms),
        filter .82s ease var(--reveal-delay, 0ms);
    will-change: opacity, transform, filter;
}
html.has-motion-js .reveal-on-scroll.is-revealed {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1);
    filter: blur(0);
}

[data-tilt] {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    transform: perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    transform-style: preserve-3d;
    transition: transform .28s cubic-bezier(.2,.7,.2,1), box-shadow .28s ease;
    will-change: transform;
}
[data-tilt]:hover { box-shadow: 0 26px 70px rgba(40,27,27,.14); }

.mission-scroll-progress {
    --page-progress: 0;
    position: fixed;
    z-index: 1300;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    pointer-events: none;
    background: rgba(167,27,28,.08);
}
.mission-scroll-progress__fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: calc(var(--page-progress) * 100%);
    background: linear-gradient(90deg, var(--red), var(--teal));
    box-shadow: 0 0 16px rgba(167,27,28,.25);
}
.mission-scroll-progress__paw {
    position: absolute;
    left: calc(var(--page-progress) * 100%);
    top: 1px;
    display: grid;
    place-items: center;
    width: 22px;
    height: 22px;
    color: var(--red);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 4px 15px rgba(40,27,27,.16);
    transform: translate(-50%, -35%);
    font-size: 13px !important;
}

/* Hero slider */
.hero-section.hero-slider {
    position: relative;
    min-height: calc(100svh - 126px);
    height: max(720px, calc(100svh - 126px));
    padding: 0;
    overflow: hidden;
    color: #fff;
    background: #120e10;
    isolation: isolate;
}
.hero-slider__slides,
.hero-slide,
.hero-slide__media { position: absolute; inset: 0; }
.hero-slider__slides { z-index: 1; }
.hero-slide {
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.025);
    transition: opacity .72s ease, visibility .72s ease, transform 1.2s cubic-bezier(.16,1,.3,1);
    pointer-events: none;
}
.hero-slide.is-active {
    z-index: 2;
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    pointer-events: auto;
}
.hero-slide__media { overflow: hidden; background: #191315; }
.hero-slide__media > img,
.hero-native-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.055);
    transition: transform 7s ease;
}
.hero-slide.is-active .hero-slide__media > img,
.hero-slide.is-active .hero-native-video { transform: scale(1); }
.hero-youtube { position: absolute; inset: 0; z-index: 1; overflow: hidden; }
.hero-youtube iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 56.25vw;
    min-width: 177.78vh;
    min-height: 100%;
    border: 0;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.hero-video-poster { position: absolute; inset: 0; z-index: 0; }
.hero-slide.is-media-ready .hero-video-poster { opacity: 0; }
.hero-slide__scrim {
    position: absolute;
    z-index: 2;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(14,10,12,.91) 0%, rgba(14,10,12,.75) 38%, rgba(14,10,12,.33) 66%, rgba(14,10,12,.18) 100%),
        linear-gradient(0deg, rgba(14,10,12,.72) 0%, transparent 36%, rgba(14,10,12,.18) 100%);
}
.hero-slide__inner {
    position: relative;
    z-index: 4;
    display: flex;
    align-items: center;
    height: 100%;
    padding-top: 28px;
    padding-bottom: 178px;
}
.hero-slide__content { width: min(760px, 65%); }
.hero-slide__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 19px;
    padding: 8px 13px;
    color: rgba(255,255,255,.9);
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 999px;
    background: rgba(255,255,255,.07);
    backdrop-filter: blur(12px);
    font-family: var(--font-heading);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}
.hero-live-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #88d548;
    box-shadow: 0 0 0 5px rgba(97,167,27,.16);
    animation: heroLivePulse 1.9s ease-in-out infinite;
}
.hero-slide__content h1,
.hero-slide__content h2 {
    max-width: 800px;
    margin-bottom: 22px;
    color: #fff;
    font-size: clamp(3.25rem, 5.7vw, 6rem);
    letter-spacing: -.055em;
    text-wrap: balance;
    text-shadow: 0 12px 45px rgba(0,0,0,.26);
}
.hero-slide__tagline {
    max-width: 720px;
    margin-bottom: 16px;
    color: #fff;
    font-family: var(--font-heading);
    font-size: clamp(1.15rem,1.65vw,1.55rem);
    font-weight: 800;
    line-height: 1.38;
}
.hero-slide__lede {
    max-width: 650px;
    color: rgba(255,255,255,.78);
    font-size: 1.08rem;
    line-height: 1.65;
}
.hero-slide__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero-slider .button { min-height: 54px; padding-inline: 24px; }
.hero-slider .button-primary { box-shadow: 0 16px 40px rgba(167,27,28,.34); }
.button-glass {
    color: #fff;
    border-color: rgba(255,255,255,.34);
    background: rgba(255,255,255,.1);
    box-shadow: inset 0 1px rgba(255,255,255,.16);
    backdrop-filter: blur(14px);
}
.button-glass:hover { color: #fff; border-color: rgba(255,255,255,.75); background: rgba(255,255,255,.16); }

.hero-slide__content > * {
    opacity: 0;
    transform: translate3d(0,28px,0);
    transition: opacity .62s ease, transform .8s cubic-bezier(.16,1,.3,1);
}
.hero-slide.is-active .hero-slide__content > * { opacity: 1; transform: translate3d(0,0,0); }
.hero-slide.is-active .hero-slide__content > *:nth-child(1) { transition-delay: .12s; }
.hero-slide.is-active .hero-slide__content > *:nth-child(2) { transition-delay: .2s; }
.hero-slide.is-active .hero-slide__content > *:nth-child(3) { transition-delay: .28s; }
.hero-slide.is-active .hero-slide__content > *:nth-child(4) { transition-delay: .34s; }
.hero-slide.is-active .hero-slide__content > *:nth-child(5) { transition-delay: .4s; }

.hero-slider__chrome {
    position: absolute;
    z-index: 8;
    left: 50%;
    bottom: 92px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    transform: translateX(-50%);
    pointer-events: none;
}
.hero-slider__meta,
.hero-slider__controls { display: flex; align-items: center; gap: 15px; pointer-events: auto; }
.hero-slider__counter { display: inline-flex; align-items: baseline; gap: 7px; min-width: 62px; color: rgba(255,255,255,.58); font-family: var(--font-heading); font-size: .75rem; font-weight: 800; }
.hero-slider__counter strong { color: #fff; font-size: 1rem; }
.hero-slider__line { position: relative; width: 120px; height: 2px; overflow: hidden; background: rgba(255,255,255,.2); }
.hero-slider__line i { position: absolute; inset: 0; width: 0; background: #fff; box-shadow: 0 0 12px rgba(255,255,255,.5); }
.hero-slider__hint { display: inline-flex; align-items: center; gap: 7px; color: rgba(255,255,255,.67); font-family: var(--font-heading); font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.hero-slider__hint .material-symbols-rounded { animation: mouseNudge 1.7s ease-in-out infinite; }
.hero-slider__dots { display: flex; align-items: center; gap: 7px; }
.hero-dot {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    background: transparent;
}
.hero-dot span { display: block; width: 7px; height: 7px; margin: auto; border-radius: 999px; background: rgba(255,255,255,.42); transition: width .28s ease, background .28s ease; }
.hero-dot.is-active span { width: 24px; background: #fff; }
.hero-arrow {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    color: #fff;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 50%;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    transition: background .25s ease, transform .25s ease, opacity .25s ease;
}
.hero-arrow:hover { background: rgba(255,255,255,.16); transform: translateY(-2px); }
.hero-arrow:disabled { opacity: .34; cursor: default; transform: none; }

.hero-trust-rail {
    position: absolute;
    z-index: 8;
    left: 50%;
    bottom: 22px;
    display: flex;
    align-items: center;
    gap: 12px;
    transform: translateX(-50%);
}
.hero-trust-rail > div {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    gap: 0 8px;
    min-height: 54px;
    padding: 8px 14px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    background: rgba(16,12,14,.44);
    backdrop-filter: blur(12px);
}
.hero-trust-rail .material-symbols-rounded { grid-row: 1/3; color: #8ed04c; font-size: 1.4rem; }
.hero-trust-rail strong { color: #fff; font-family: var(--font-heading); font-size: .78rem; }
.hero-trust-rail span:last-child { color: rgba(255,255,255,.57); font-size: .7rem; }

.hero-slider__ambient { position: absolute; z-index: 7; inset: 0; overflow: hidden; pointer-events: none; }
.hero-ambient-paw,
.hero-ambient-heart { position: absolute; color: rgba(255,255,255,.1); filter: blur(.1px); }
.hero-ambient-paw { font-size: 44px !important; }
.paw-one { right: 7%; top: 17%; transform: rotate(18deg); animation: floatPawA 7s ease-in-out infinite; }
.paw-two { right: 23%; bottom: 22%; transform: rotate(-20deg) scale(.72); animation: floatPawB 9s ease-in-out infinite; }
.hero-ambient-heart { right: 13%; bottom: 33%; color: rgba(167,27,28,.22); font-size: 62px !important; animation: heartBreath 3.6s ease-in-out infinite; }
.hero-ambient-ring { position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; }
.ring-one { right: -12vw; top: -18vw; width: 44vw; height: 44vw; animation: orbitSlow 24s linear infinite; }
.ring-two { left: 46%; bottom: -27vw; width: 48vw; height: 48vw; border-color: rgba(27,167,167,.14); animation: orbitSlow 32s linear reverse infinite; }

/* Community partner constellation */
.partners-section.partner-constellation {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 86% 20%, rgba(27,167,167,.10), transparent 30%),
        radial-gradient(circle at 8% 84%, rgba(167,27,28,.08), transparent 32%),
        #f7f5f1;
}
.partner-constellation__layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(55px,7vw,110px); align-items: center; }
.partner-constellation__intro { position: relative; z-index: 3; }
.partner-constellation__intro h2 { max-width: 640px; }
.partner-constellation__intro > p { max-width: 580px; color: var(--ink-soft); font-size: 1.08rem; }
.partner-impact-note {
    display: flex;
    align-items: center;
    gap: 15px;
    max-width: 520px;
    margin-top: 31px;
    padding: 18px 20px;
    border: 1px solid rgba(27,167,167,.18);
    border-radius: 18px;
    background: rgba(255,255,255,.72);
    box-shadow: 0 18px 50px rgba(40,27,27,.06);
    backdrop-filter: blur(10px);
}
.partner-impact-note .material-symbols-rounded { color: var(--teal); font-size: 2rem; }
.partner-impact-note strong,
.partner-impact-note span { display: block; }
.partner-impact-note strong { font-family: var(--font-heading); font-size: .94rem; }
.partner-impact-note span { color: var(--ink-soft); font-size: .82rem; }
.partner-constellation__stage { position: relative; min-height: 560px; }
.partner-orbit {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 1px dashed rgba(97,27,167,.17);
    border-radius: 50%;
    transform: translate(-50%,-50%);
}
.orbit-a { width: 480px; height: 480px; animation: partnerOrbit 34s linear infinite; }
.orbit-b { width: 325px; height: 325px; border-style: solid; border-color: rgba(27,167,167,.14); animation: partnerOrbit 24s linear reverse infinite; }
.partner-center-mark {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    place-items: center;
    width: 88px;
    height: 88px;
    color: #fff;
    border: 9px solid rgba(255,255,255,.88);
    border-radius: 50%;
    background: linear-gradient(135deg, var(--red), #c92a2c);
    box-shadow: 0 24px 60px rgba(167,27,28,.24), 0 0 0 1px rgba(167,27,28,.08);
    transform: translate(-50%,-50%);
}
.partner-center-mark::after { content: ""; position: absolute; inset: -28px; border: 1px solid rgba(167,27,28,.1); border-radius: 50%; animation: missionRipple 2.8s ease-out infinite; }
.partner-center-mark .material-symbols-rounded { font-size: 2.15rem; }
.partner-modern-card {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 235px;
    min-height: 155px;
    padding: 29px 24px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 26px;
    background: rgba(255,255,255,.86);
    box-shadow: 0 24px 60px rgba(48,36,36,.1), inset 0 1px rgba(255,255,255,.9);
    backdrop-filter: blur(18px);
}
.partner-modern-card img { width: 100%; max-width: 180px; max-height: 94px; object-fit: contain; filter: saturate(.9); transition: filter .3s ease, transform .4s cubic-bezier(.16,1,.3,1); }
.partner-modern-card:hover img { filter: saturate(1.05); transform: scale(1.04) translateZ(24px); }
.partner-card__index { position: absolute; top: 12px; left: 15px; color: rgba(23,21,22,.35); font-family: var(--font-heading); font-size: .64rem; font-weight: 800; letter-spacing: .12em; }
.partner-card__shine { position: absolute; inset: -40%; background: linear-gradient(120deg, transparent 38%, rgba(255,255,255,.72) 50%, transparent 62%); transform: translateX(-75%) rotate(8deg); transition: transform .85s ease; pointer-events: none; }
.partner-modern-card:hover .partner-card__shine { transform: translateX(75%) rotate(8deg); }
.partner-card-one { left: 0; top: 42px; }
.partner-card-two { right: 4px; top: 8px; }
.partner-card-three { left: 36px; bottom: 18px; }
.partner-card-four { right: 0; bottom: 60px; }
.partner-constellation__glow { position: absolute; width: 310px; height: 310px; border-radius: 50%; filter: blur(70px); opacity: .22; pointer-events: none; }
.partner-glow-one { right: 12%; top: 4%; background: var(--teal); }
.partner-glow-two { left: -90px; bottom: -80px; background: var(--red); }

@keyframes heroLivePulse { 50% { box-shadow: 0 0 0 9px rgba(97,167,27,0); } }
@keyframes mouseNudge { 50% { transform: translateY(4px); opacity: .55; } }
@keyframes floatPawA { 50% { transform: translate(-12px,16px) rotate(8deg); } }
@keyframes floatPawB { 50% { transform: translate(14px,-12px) rotate(-8deg) scale(.78); } }
@keyframes heartBreath { 50% { transform: scale(1.12); opacity: .55; } }
@keyframes orbitSlow { to { transform: rotate(360deg); } }
@keyframes partnerOrbit { from { transform: translate(-50%,-50%) rotate(0); } to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes missionRipple { 0% { transform: scale(.72); opacity: .55; } 100% { transform: scale(1.28); opacity: 0; } }

@media (max-width: 1099px) {
    .hero-section.hero-slider { min-height: calc(100svh - 80px); height: max(700px, calc(100svh - 80px)); }
    .hero-slide__content { width: min(720px, 74%); }
    .hero-slide__content h1, .hero-slide__content h2 { font-size: clamp(3rem,6vw,5.15rem); }
    .partner-constellation__layout { grid-template-columns: .9fr 1.1fr; gap: 46px; }
    .partner-constellation__stage { min-height: 530px; transform: scale(.9); transform-origin: center; }
}

@media (max-width: 840px) {
    .hero-section.hero-slider { min-height: 760px; height: min(880px, 100svh); }
    .hero-slide__scrim { background: linear-gradient(0deg, rgba(14,10,12,.94) 0%, rgba(14,10,12,.79) 48%, rgba(14,10,12,.28) 100%); }
    .hero-slide__inner { align-items: flex-end; padding-top: 80px; padding-bottom: 184px; }
    .hero-slide__content { width: 100%; text-align: left; }
    .hero-slide__content h1, .hero-slide__content h2 { font-size: clamp(2.8rem,9vw,4.55rem); }
    .hero-slide__lede { max-width: 680px; }
    .hero-slider__chrome { bottom: 93px; }
    .hero-slider__hint { display: none; }
    .hero-slider__line { width: 80px; }
    .hero-trust-rail { gap: 7px; }
    .hero-trust-rail > div { padding: 7px 9px; }
    .partner-constellation__layout { grid-template-columns: 1fr; }
    .partner-constellation__intro { text-align: center; }
    .partner-constellation__intro h2,
    .partner-constellation__intro > p,
    .partner-impact-note { margin-left: auto; margin-right: auto; }
    .partner-constellation__stage { min-height: 0; transform: none; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .partner-orbit, .partner-center-mark { display: none; }
    .partner-modern-card { position: relative; inset: auto; width: auto; min-height: 150px; }
}

@media (max-width: 620px) {
    .hero-section.hero-slider { min-height: 700px; height: calc(100svh - 72px); max-height: 820px; }
    .hero-slide__inner { padding-top: 44px; padding-bottom: 155px; }
    .hero-slide__eyebrow { max-width: 100%; font-size: .62rem; letter-spacing: .09em; }
    .hero-slide__content h1, .hero-slide__content h2 { font-size: clamp(2.35rem,11.8vw,3.65rem); margin-bottom: 16px; }
    .hero-slide__tagline { font-size: 1.02rem; }
    .hero-slide__lede { display: none; }
    .hero-slide__actions { display: grid; grid-template-columns: 1fr; margin-top: 22px; }
    .hero-slider .button { width: 100%; min-height: 50px; }
    .hero-slider__chrome { bottom: 77px; }
    .hero-slider__meta { gap: 9px; }
    .hero-slider__counter { min-width: 48px; }
    .hero-slider__line { width: 62px; }
    .hero-slider__dots { display: none; }
    .hero-arrow { width: 40px; height: 40px; }
    .hero-trust-rail { bottom: 14px; justify-content: space-between; }
    .hero-trust-rail > div { flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 1px; padding: 7px 5px; text-align: center; }
    .hero-trust-rail .material-symbols-rounded { display: none; }
    .hero-trust-rail strong { font-size: .68rem; }
    .hero-trust-rail span:last-child { font-size: .58rem; }
    .hero-ambient-paw, .hero-ambient-heart { opacity: .45; }
    .partner-constellation__stage { grid-template-columns: 1fr; }
    .partner-modern-card { min-height: 132px; }
    .mission-scroll-progress__paw { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    html.has-motion-js .reveal-on-scroll,
    html.has-motion-js .reveal-on-scroll.is-revealed,
    [data-tilt],
    .hero-slide,
    .hero-slide__content > *,
    .hero-slide__media > img,
    .hero-native-video {
        opacity: 1;
        filter: none;
        transform: none;
        transition: none !important;
    }
    .hero-live-dot,
    .hero-slider__hint .material-symbols-rounded,
    .hero-ambient-paw,
    .hero-ambient-heart,
    .hero-ambient-ring,
    .partner-orbit,
    .partner-center-mark::after { animation: none !important; }
}
.hero-media-controls { display: flex; align-items: center; gap: 7px; }
.hero-media-controls.is-hidden { display: none; }
.hero-media-button {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    color: #fff;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 50%;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    transition: background .2s ease, transform .2s ease;
}
.hero-media-button:hover { background: rgba(255,255,255,.16); transform: translateY(-1px); }
.hero-media-button .material-symbols-rounded { font-size: 1.08rem; }
@media (max-width: 620px) {
    .hero-media-button { width: 34px; height: 34px; }
}

/* ==========================================================
   v1.3 — Cinematic first slide, social proof & richer motion
   ========================================================== */

/* Bidirectional reveal. Scroll-up entrances reverse the visual direction. */
html.has-motion-js .reveal-on-scroll.reveal-from-bottom:not(.is-revealed) {
    transform: translate3d(0, 38px, 0) scale(.985);
}
html.has-motion-js .reveal-on-scroll.reveal-from-top:not(.is-revealed) {
    transform: translate3d(0, -38px, 0) scale(.985);
}
html.has-motion-js .reveal-on-scroll.is-revealed {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1);
    filter: blur(0);
}

/* Combine reveal movement with interactive tilt without either animation winning. */
html.has-motion-js .reveal-on-scroll[data-tilt] {
    --reveal-y: 38px;
    --tilt-lift: 0px;
    opacity: 0;
    transform: perspective(1150px) translate3d(0, calc(var(--reveal-y) + var(--tilt-lift)), 0) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));
    filter: blur(4px);
}
html.has-motion-js .reveal-on-scroll.reveal-from-top[data-tilt] { --reveal-y: -38px; }
html.has-motion-js .reveal-on-scroll.is-revealed[data-tilt] { --reveal-y: 0px; opacity: 1; filter: blur(0); }
[data-tilt] {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    --tilt-lift: 0px;
    --glow-x: 50%;
    --glow-y: 50%;
    transform: perspective(1150px) translate3d(0, var(--tilt-lift), 0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    transform-style: preserve-3d;
    transition: transform .34s cubic-bezier(.16,1,.3,1), box-shadow .34s ease, border-color .34s ease;
}
@media (hover:hover) and (pointer:fine) {
    [data-tilt]:hover { --tilt-lift: -8px; box-shadow: 0 30px 78px rgba(40,27,27,.16); }
    html.has-motion-js .reveal-on-scroll.is-revealed[data-tilt]:hover { --tilt-lift: -8px; }
}

/* Cinematic YouTube first slide. */
.hero-slide__scrim {
    opacity: 1;
    transition: opacity .5s ease .42s, background .5s ease .42s;
}
.hero-cinema-hint {
    position: absolute;
    z-index: 12;
    left: 50%;
    bottom: 28px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 14px;
    color: rgba(255,255,255,.82);
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 999px;
    background: rgba(10,8,9,.38);
    box-shadow: 0 12px 34px rgba(0,0,0,.18);
    backdrop-filter: blur(12px);
    font-family: var(--font-heading);
    font-size: .69rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    opacity: 0;
    transform: translate(-50%,12px);
    transition: opacity .35s ease .82s, transform .45s cubic-bezier(.16,1,.3,1) .82s;
    pointer-events: none;
}
.hero-cinema-hint .material-symbols-rounded { font-size: 1rem; animation: cinemaHintNudge 1.6s ease-in-out infinite; }
.hero-slider.is-cinema-mode .hero-cinema-hint { opacity: 1; transform: translate(-50%,0); }

.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__content > * {
    opacity: 0;
    filter: blur(10px);
    transform: translate3d(0,-46px,0) scale(.965);
    transition:
        opacity .46s ease 0s,
        transform .62s cubic-bezier(.4,0,.2,1) 0s,
        filter .46s ease 0s;
}
.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__content > *:nth-child(1) { transition-delay: .20s; }
.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__content > *:nth-child(2) { transition-delay: .14s; }
.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__content > *:nth-child(3) { transition-delay: .09s; }
.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__content > *:nth-child(4) { transition-delay: .04s; }
.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__content > *:nth-child(5) { transition-delay: 0s; }
.hero-slider.is-cinema-mode .hero-slide.is-active .hero-slide__scrim { opacity: 0; }
.hero-slider.is-cinema-mode .hero-slider__ambient,
.hero-slider.is-cinema-mode .hero-trust-rail,
.hero-slider.is-cinema-mode .hero-slider__meta,
.hero-slider.is-cinema-mode .hero-slider__dots,
.hero-slider.is-cinema-mode .hero-arrow {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity .3s ease .2s, transform .4s ease .2s;
}
.hero-slider__ambient,
.hero-trust-rail,
.hero-slider__meta,
.hero-slider__dots,
.hero-arrow { transition: opacity .4s ease .24s, transform .45s cubic-bezier(.16,1,.3,1) .24s; }
.hero-slider.is-cinema-mode .hero-slider__controls { margin-left: auto; }
.hero-slider.is-cinema-mode .hero-media-controls { position: relative; z-index: 3; }
.hero-slider.is-cinema-mode .hero-slider__chrome { justify-content: flex-end; bottom: 28px; }
.hero-slider.is-cinema-mode .hero-media-button { background: rgba(8,7,8,.42); }

/* First-slide video remains full-bleed and sharp after the overlay clears. */
.hero-youtube iframe,
.hero-native-video { filter: saturate(.96) contrast(1.02); transition: filter .6s ease, transform 7s ease; }
.hero-slider.is-cinema-mode .hero-youtube iframe,
.hero-slider.is-cinema-mode .hero-native-video { filter: saturate(1.04) contrast(1.04); }

/* Trust signals are intentionally larger and more prominent in story mode. */
.hero-slider__chrome { bottom: 124px; }
.hero-trust-rail {
    bottom: 20px;
    display: grid;
    grid-template-columns: repeat(3, minmax(170px, 1fr));
    width: min(760px, calc(100% - 48px));
    gap: 10px;
}
.hero-trust-rail > div {
    min-height: 82px;
    padding: 13px 18px;
    border-color: rgba(255,255,255,.2);
    border-radius: 18px;
    background: rgba(16,12,14,.56);
    box-shadow: 0 18px 44px rgba(0,0,0,.18), inset 0 1px rgba(255,255,255,.08);
}
.hero-trust-rail .material-symbols-rounded { font-size: 2rem; }
.hero-trust-rail strong { font-size: clamp(.98rem,1.25vw,1.2rem); letter-spacing: -.02em; }
.hero-trust-rail span:last-child { font-size: .76rem; letter-spacing: .01em; }

/* Site-wide hover polish for cards, content panels and linked visuals. */
.service-card,
.impact-flow article,
.steps-grid article,
.review-card,
.google-rating-card,
.faq-list details,
.price-card,
.schedule-card,
.care-panel,
.tip-card,
.contact-info-card,
.donor-choice-card,
.about-facts-card > div,
.footer-action,
.facebook-community__points > div,
.facebook-feed-shell {
    transition: transform .34s cubic-bezier(.16,1,.3,1), box-shadow .34s ease, border-color .34s ease, background .34s ease;
}
@media (hover:hover) and (pointer:fine) {
    .faq-list details:hover {
        margin-inline: -16px;
        padding-inline: 16px;
        border-color: transparent;
        border-radius: 16px;
        background: #fff9f7;
        box-shadow: 0 15px 36px rgba(40,27,27,.07);
    }
    .service-card:hover .service-image img,
    .about-visual:hover > img,
    .prevention-visual:hover > img,
    .donation-visual:hover > img,
    .section-media:hover > img { transform: scale(1.055); }
    .service-image img,
    .about-visual > img,
    .prevention-visual > img,
    .donation-visual > img,
    .section-media > img { transition: transform .8s cubic-bezier(.16,1,.3,1), filter .45s ease; }
    .text-link:hover span[aria-hidden="true"] { display: inline-block; transform: translateX(6px); }
    .text-link span[aria-hidden="true"] { transition: transform .25s ease; }
}

/* Google review social proof */
.google-reviews-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 92% 6%, rgba(27,167,167,.08), transparent 24%),
        radial-gradient(circle at 8% 94%, rgba(167,27,28,.07), transparent 28%),
        #f8f4f2;
}
.google-reviews-head { display: grid; grid-template-columns: 1fr auto; gap: 48px; align-items: end; margin-bottom: 34px; }
.google-reviews-head .section-heading { margin-bottom: 0; max-width: 760px; }
.google-reviews-head .section-heading p { max-width: 690px; color: var(--ink-soft); }
.google-rating-card {
    min-width: 305px;
    padding: 22px 24px;
    border: 1px solid rgba(42,37,38,.09);
    border-radius: 22px;
    background: rgba(255,255,255,.88);
    box-shadow: 0 18px 48px rgba(40,27,27,.08);
    backdrop-filter: blur(12px);
}
.google-rating-brand { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: #5f6368; font-family: var(--font-heading); font-weight: 800; }
.google-g,
.google-mini {
    display: inline-grid;
    place-items: center;
    color: #4285f4;
    font-family: Arial, sans-serif;
    font-weight: 900;
}
.google-g { width: 26px; height: 26px; font-size: 1.35rem; }
.google-rating-score { display: flex; align-items: center; gap: 13px; }
.google-rating-score > strong { color: var(--ink); font-family: var(--font-heading); font-size: 3rem; line-height: 1; letter-spacing: -.06em; }
.google-rating-score .stars { margin: 0; font-size: .88rem; }
.google-rating-score span { display: block; margin-top: 2px; color: var(--ink-soft); font-size: .78rem; }
.google-rating-note { display: block; margin-top: 11px; color: #777074; font-size: .68rem; }
.reviews-toolbar { align-items: center; margin-bottom: 28px; }
.google-review-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.button-outline-dark { color: var(--ink); border-color: rgba(42,37,38,.16); background: #fff; }
.button-outline-dark:hover { color: var(--red); border-color: rgba(167,27,28,.35); background: #fff7f5; }
.google-reviews-track { grid-auto-columns: calc((100% - 48px)/3); }
.google-review-card { min-height: 350px; position: relative; overflow: hidden; }
.google-review-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg,#4285f4,#34a853,#fbbc05,#ea4335);
    transform: scaleX(.26);
    transform-origin: left;
    transition: transform .5s cubic-bezier(.16,1,.3,1);
}
.google-review-card:hover::before { transform: scaleX(1); }
.review-card__top { display: grid; grid-template-columns: 52px 1fr auto; gap: 13px; align-items: center; margin-bottom: 18px; }
.review-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; box-shadow: 0 6px 16px rgba(40,27,27,.12); }
.review-card__top strong,
.review-card__top span { display: block; }
.review-card__top strong { color: var(--ink); font-size: .92rem; }
.review-card__top span { margin-top: 2px; color: #7a7476; font-size: .72rem; }
.review-card__top .google-mini { width: 28px; height: 28px; margin: 0; border-radius: 50%; background: #f6f8fb; font-size: .95rem; }
.google-review-card .stars { margin-bottom: 14px; }
.google-review-card p { min-height: 142px; }
.review-source { color: #7c7678; font-size: .73rem; font-weight: 700; }
.review-data-note { margin: 16px 0 0; color: #827b7d; font-size: .72rem; }

/* Facebook / Community Voices section */
.facebook-community-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 10% 15%, rgba(24,119,242,.10), transparent 26%),
        radial-gradient(circle at 94% 88%, rgba(167,27,28,.08), transparent 28%),
        #f7faff;
}
.facebook-community__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(50px,7vw,110px); align-items: center; }
.facebook-community__copy { position: relative; z-index: 2; }
.facebook-community__copy h2 { max-width: 650px; font-size: clamp(2.7rem,4.6vw,5rem); }
.facebook-community__lead { max-width: 660px; color: var(--ink-soft); font-size: 1.08rem; line-height: 1.75; }
.facebook-community__points { display: grid; gap: 11px; margin: 29px 0; }
.facebook-community__points > div {
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 2px 14px;
    padding: 15px 17px;
    border: 1px solid rgba(24,119,242,.11);
    border-radius: 16px;
    background: rgba(255,255,255,.7);
}
.facebook-community__points .material-symbols-rounded { grid-row: 1/3; display: grid; place-items: center; width: 44px; height: 44px; color: #1877f2; border-radius: 13px; background: rgba(24,119,242,.09); }
.facebook-community__points strong { font-family: var(--font-heading); font-size: .88rem; }
.facebook-community__points span:last-child { color: var(--ink-soft); font-size: .79rem; }
.facebook-community__actions { display: flex; flex-wrap: wrap; gap: 15px; align-items: center; }
.facebook-button { color: #fff; border-color: #1877f2; background: #1877f2; box-shadow: 0 14px 34px rgba(24,119,242,.22); }
.facebook-button:hover { color: #fff; border-color: #0f67d8; background: #0f67d8; }
.facebook-f { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; color: #fff; background: #1877f2; font-family: Arial,sans-serif; font-size: 1rem; font-weight: 900; }
.facebook-button .facebook-f { background: rgba(255,255,255,.18); }
.facebook-feed-shell {
    position: relative;
    z-index: 2;
    overflow: hidden;
    border: 1px solid rgba(24,119,242,.12);
    border-radius: 30px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 32px 90px rgba(32,53,82,.14);
}
.facebook-feed-shell__top { display: grid; grid-template-columns: 42px 1fr auto; gap: 12px; align-items: center; padding: 17px 20px; border-bottom: 1px solid #edf1f6; }
.facebook-feed-shell__top .facebook-f { width: 42px; height: 42px; font-size: 1.45rem; }
.facebook-feed-shell__top strong,
.facebook-feed-shell__top span { display: block; }
.facebook-feed-shell__top strong { font-family: var(--font-heading); font-size: .9rem; }
.facebook-feed-shell__top span { margin-top: 1px; color: #6f7782; font-size: .7rem; }
.live-chip { display: inline-flex !important; align-items: center; gap: 6px; padding: 6px 9px; color: #24732d !important; border-radius: 999px; background: #edf9ef; font-family: var(--font-heading); font-size: .62rem !important; font-weight: 900; letter-spacing: .08em; }
.live-chip i { width: 6px; height: 6px; border-radius: 50%; background: #3ca34b; box-shadow: 0 0 0 5px rgba(60,163,75,.10); animation: heroLivePulse 1.9s ease-in-out infinite; }
.facebook-feed-frame { min-height: 520px; display: grid; place-items: start center; padding: 0; background: #fff; }
.facebook-feed-frame iframe { display: block; width: 100%; max-width: 500px; height: 640px; }
.facebook-feed-fallback { display: grid; grid-template-columns: 30px 1fr auto; gap: 10px; align-items: center; padding: 13px 17px; border-top: 1px solid #edf1f6; background: #f9fbfe; }
.facebook-feed-fallback .material-symbols-rounded { color: #1877f2; }
.facebook-feed-fallback p { margin: 0; color: #6d747e; font-size: .7rem; line-height: 1.45; }
.facebook-feed-fallback a { color: #1877f2; font-family: var(--font-heading); font-size: .72rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.facebook-community__ambient { position: absolute; inset: 0; pointer-events: none; }
.facebook-community__ambient span { position: absolute; opacity: .12; filter: blur(.1px); animation: socialFloat 7s ease-in-out infinite; }
.facebook-community__ambient span:nth-child(1) { left: 5%; top: 18%; font-size: 3rem; color: var(--red); }
.facebook-community__ambient span:nth-child(2) { left: 44%; top: 9%; font-size: 2.2rem; animation-delay: -1.6s; }
.facebook-community__ambient span:nth-child(3) { right: 6%; top: 16%; font-size: 2.8rem; color: #1877f2; animation-delay: -3s; }
.facebook-community__ambient span:nth-child(4) { right: 40%; bottom: 8%; font-size: 2rem; animation-delay: -4.2s; }

/* Partner logo animation gets its own layer on top of card tilt. */
.partner-modern-card::after {
    content: "🐾";
    position: absolute;
    right: 15px;
    bottom: 11px;
    font-size: 1rem;
    opacity: 0;
    transform: translate3d(0,10px,0) rotate(-18deg) scale(.7);
    transition: opacity .3s ease, transform .5s cubic-bezier(.16,1,.3,1);
}
.partner-modern-card:hover { border-color: rgba(27,167,167,.24); background: rgba(255,255,255,.96); }
.partner-modern-card:hover::after { opacity: .32; transform: translate3d(0,0,0) rotate(9deg) scale(1); }
.partner-modern-card:hover img {
    filter: saturate(1.08) drop-shadow(0 10px 18px rgba(30,30,30,.12));
    animation: partnerLogoHover 1.8s ease-in-out infinite;
}

/* Paw footprints follow mousewheel interaction and disappear behind the cursor. */
.mouse-paw-trail {
    position: fixed;
    z-index: 2100;
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
    display: grid;
    place-items: center;
    color: rgba(167,27,28,.72);
    font-size: 21px !important;
    pointer-events: none;
    user-select: none;
    transform: rotate(var(--paw-rotation,0deg)) scale(.72);
    filter: drop-shadow(0 4px 8px rgba(167,27,28,.14));
    animation: pawTrailFade 1.12s cubic-bezier(.2,.7,.2,1) forwards;
}

@keyframes cinemaHintNudge { 50% { transform: translateY(-3px); opacity: .62; } }
@keyframes partnerLogoHover { 0%,100% { transform: translate3d(0,0,18px) scale(1.055) rotate(-.4deg); } 50% { transform: translate3d(0,-6px,26px) scale(1.075) rotate(.5deg); } }
@keyframes pawTrailFade { 0% { opacity: 0; transform: rotate(var(--paw-rotation,0deg)) scale(.55); } 18% { opacity: .82; transform: rotate(var(--paw-rotation,0deg)) scale(1); } 100% { opacity: 0; transform: translateY(-24px) rotate(var(--paw-rotation,0deg)) scale(.72); filter: blur(2px); } }
@keyframes socialFloat { 50% { transform: translate3d(0,-16px,0) rotate(8deg); opacity: .2; } }

@media (max-width: 1099px) {
    .hero-trust-rail { width: min(690px, calc(100% - 40px)); }
    .hero-trust-rail > div { min-height: 72px; padding: 11px 14px; }
    .google-reviews-head { grid-template-columns: 1fr; gap: 24px; align-items: start; }
    .google-rating-card { min-width: 0; width: min(360px,100%); }
    .facebook-community__grid { grid-template-columns: 1fr 1fr; gap: 45px; }
}

@media (max-width: 840px) {
    .hero-slider__chrome { bottom: 116px; }
    .hero-trust-rail { grid-template-columns: repeat(3,1fr); width: calc(100% - 28px); }
    .hero-trust-rail > div { min-height: 70px; }
    .hero-trust-rail .material-symbols-rounded { font-size: 1.45rem; }
    .hero-trust-rail strong { font-size: .9rem; }
    .google-reviews-track { grid-auto-columns: calc((100% - 20px)/2); gap: 20px; }
    .facebook-community__grid { grid-template-columns: 1fr; }
    .facebook-community__copy { max-width: 720px; }
    .facebook-feed-shell { width: min(560px,100%); margin-inline: auto; }
}

@media (max-width: 620px) {
    .hero-slider__chrome { bottom: 91px; }
    .hero-trust-rail { bottom: 11px; grid-template-columns: repeat(3,1fr); gap: 5px; width: calc(100% - 18px); }
    .hero-trust-rail > div { min-height: 66px; padding: 7px 5px; border-radius: 12px; }
    .hero-trust-rail strong { font-size: .72rem; }
    .hero-trust-rail span:last-child { font-size: .55rem; }
    .hero-cinema-hint { bottom: 18px; width: max-content; max-width: calc(100% - 32px); font-size: .6rem; }
    .hero-slider.is-cinema-mode .hero-slider__chrome { bottom: 58px; }
    .google-reviews-track { grid-auto-columns: 88%; }
    .google-review-actions { display: grid; width: 100%; }
    .google-review-actions .button { width: 100%; }
    .reviews-toolbar { align-items: end; }
    .google-review-card p { min-height: 0; }
    .facebook-community__copy h2 { font-size: clamp(2.45rem,11vw,3.55rem); }
    .facebook-community__actions { align-items: flex-start; flex-direction: column; }
    .facebook-feed-shell { border-radius: 20px; }
    .facebook-feed-frame { min-height: 500px; overflow: hidden; }
    .facebook-feed-frame iframe { min-width: 500px; transform: scale(.72); transform-origin: top center; margin-bottom: -179px; }
    .facebook-feed-fallback { grid-template-columns: 26px 1fr; }
    .facebook-feed-fallback a { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
    .hero-cinema-hint,
    .hero-slider__ambient,
    .hero-trust-rail,
    .hero-slider__meta,
    .hero-slider__dots,
    .hero-arrow,
    .partner-modern-card img,
    .facebook-community__ambient span { animation: none !important; transition: none !important; }
    .mouse-paw-trail { display: none !important; }
    html.has-motion-js .reveal-on-scroll,
    html.has-motion-js .reveal-on-scroll[data-tilt] { opacity: 1; filter: none; transform: none; }
}


/* ==========================================================
   v1.4 — Full-bleed hero fit, scalable partner cloud,
           pointer paw trail & home-to-clinic progress journey
   ========================================================== */

/* Primary navigation: HOME first (PHP) + clear active-page feedback. */
.nav-home-icon { margin-right: 5px; font-size: 1.05rem !important; transition: transform .25s ease; }
.primary-menu > li.current-menu-item:not(.menu-item-donate) > a,
.primary-menu > li.is-active:not(.menu-item-donate) > a { color: var(--red); }
.primary-menu > li.current-menu-item:not(.menu-item-donate) > a::after,
.primary-menu > li.is-active:not(.menu-item-donate) > a::after { right: 0; }
.primary-menu > li.menu-item-home > a:hover .nav-home-icon,
.primary-menu > li.menu-item-home.is-active > a .nav-home-icon { transform: translateY(-2px) scale(1.08); font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.primary-menu > li.menu-item-donate.current-menu-item > a,
.primary-menu > li.menu-item-donate.is-active > a { background: #861416; box-shadow: 0 0 0 4px rgba(167,27,28,.12), 0 10px 24px rgba(167,27,28,.22); }

/* Hero uses one coherent viewport stage below the sticky desktop header. */
.hero-section.hero-slider {
    --hero-header-offset: 126px;
    min-height: 720px;
    height: max(720px, calc(100svh - var(--hero-header-offset)));
    max-height: none;
}
.hero-slide__inner {
    align-items: center;
    padding-top: clamp(34px, 5vh, 68px);
    padding-bottom: clamp(205px, 23vh, 238px);
}
.hero-slide__content { width: min(820px, 68%); }
.hero-slider__chrome { bottom: 128px; }
.hero-trust-rail { bottom: 22px; }

/* Keep the YT API replacement iframe inside a permanent full-bleed wrapper. */
.hero-youtube { position: absolute; inset: 0; z-index: 1; overflow: hidden; background: transparent; }
.hero-youtube__player { position: absolute; inset: 0; }
.hero-youtube iframe,
.hero-youtube__player iframe {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: var(--youtube-cover-width, 100vw) !important;
    height: var(--youtube-cover-height, 56.25vw) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    border: 0 !important;
    transform: translate(-50%, -50%) !important;
    pointer-events: none;
}
.hero-video-poster { width: 100%; height: 100%; object-fit: cover; opacity: 1; transition: opacity .45s ease; }
.hero-slide.is-media-ready .hero-video-poster { opacity: 0; }

/* Home -> clinic page progress journey. */
.mission-scroll-progress {
    position: fixed;
    z-index: 2105;
    top: 0;
    left: 0;
    width: 100%;
    height: 31px;
    background: transparent;
    overflow: visible;
}
.mission-scroll-progress__track {
    position: absolute;
    top: 0;
    left: 17px;
    right: 17px;
    height: 4px;
    border-radius: 0 0 999px 999px;
    background: rgba(167,27,28,.10);
    box-shadow: 0 1px rgba(255,255,255,.65);
}
.mission-scroll-progress__fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: calc(var(--page-progress) * 100%);
    border-radius: inherit;
    background: linear-gradient(90deg, var(--red), var(--teal), var(--green));
    box-shadow: 0 0 14px rgba(27,167,167,.22);
}
.mission-scroll-progress__endpoint {
    position: absolute;
    z-index: 3;
    top: 5px;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 6px 18px rgba(40,27,27,.2);
    font-size: 15px !important;
}
.mission-scroll-progress__home { left: 4px; background: var(--purple); }
.mission-scroll-progress__clinic { right: 4px; background: var(--teal); }
.mission-scroll-progress__paw {
    z-index: 4;
    left: calc(var(--page-progress) * 100%);
    top: 2px;
    width: 24px;
    height: 24px;
    color: var(--red);
    border: 2px solid rgba(167,27,28,.10);
    transform: translate(-50%, -35%);
    font-size: 14px !important;
}

/* Pointer + inverted-wheel paw track. */
.mouse-paw-trail { --paw-drift-x: 0px; --paw-drift-y: -16px; }
.mouse-paw-trail.is-pointer { width: 24px; height: 24px; margin: -12px 0 0 -12px; color: rgba(97,27,167,.50); font-size: 18px !important; animation-duration: .88s; }
@keyframes pawTrailFade {
    0% { opacity: 0; transform: rotate(var(--paw-rotation,0deg)) scale(.5); }
    16% { opacity: .82; transform: rotate(var(--paw-rotation,0deg)) scale(1); }
    100% { opacity: 0; transform: translate(var(--paw-drift-x), var(--paw-drift-y)) rotate(var(--paw-rotation,0deg)) scale(.68); filter: blur(1.5px); }
}

/* Scalable Community Partners logo cloud: 29 items do not rely on absolute positioning. */
.partners-section.partner-constellation { padding-block: clamp(82px, 9vw, 128px); }
.partner-constellation__layout { display: block; }
.partner-constellation__intro { max-width: 880px; margin: 0 auto 46px; text-align: center; }
.partner-constellation__intro h2,
.partner-constellation__intro > p,
.partner-impact-note { margin-left: auto; margin-right: auto; }
.partner-logo-field {
    position: relative;
    z-index: 2;
    padding: clamp(18px, 2.4vw, 30px);
    border: 1px solid rgba(42,37,38,.08);
    border-radius: 32px;
    background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(255,255,255,.68));
    box-shadow: 0 28px 90px rgba(40,27,27,.09), inset 0 1px rgba(255,255,255,.9);
    backdrop-filter: blur(18px);
    overflow: hidden;
}
.partner-logo-field::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at center, rgba(27,167,167,.11) 1px, transparent 1.5px);
    background-size: 26px 26px;
    mask-image: linear-gradient(to bottom, rgba(0,0,0,.65), transparent 82%);
    pointer-events: none;
}
.partner-logo-field__topline {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 20px;
    padding: 0 4px 15px;
    border-bottom: 1px solid rgba(42,37,38,.08);
}
.partner-logo-field__topline > span { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-family: var(--font-heading); font-size: .82rem; font-weight: 800; }
.partner-logo-field__topline > span .material-symbols-rounded { color: var(--teal); font-size: 1.2rem; }
.partner-logo-field__topline small { max-width: 620px; color: #777072; font-size: .72rem; line-height: 1.45; text-align: right; }
.partner-logo-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: clamp(10px, 1.15vw, 16px);
}
.partner-logo-grid .partner-modern-card {
    position: relative;
    inset: auto;
    width: auto;
    min-height: 132px;
    padding: 24px 16px 17px;
    border-radius: 20px;
    background: rgba(255,255,255,.86);
}
.partner-card__logo-wrap { display: grid; place-items: center; width: 100%; min-height: 78px; transform: translateZ(18px); }
.partner-logo-grid .partner-modern-card img { width: 100%; max-width: 170px; height: 78px; max-height: 78px; object-fit: contain; }
.partner-card__test-label { position: absolute; right: 11px; top: 10px; padding: 3px 7px; color: #7a7275; border-radius: 999px; background: #f5f1ef; font-family: var(--font-heading); font-size: .52rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.partner-logo-grid .partner-card__index { top: 11px; left: 12px; }
.partner-logo-grid .partner-modern-card::after { right: 11px; bottom: 8px; }
.partner-logo-grid .partner-modern-card:hover { z-index: 4; --tilt-lift: -9px; border-color: rgba(27,167,167,.28); box-shadow: 0 28px 70px rgba(40,27,27,.15); }
.partner-logo-grid .partner-modern-card:hover img { animation: partnerLogoHover 1.55s ease-in-out infinite; }

@media (max-width: 1099px) {
    .hero-section.hero-slider { --hero-header-offset: 80px; min-height: 710px; height: max(710px, calc(100svh - var(--hero-header-offset))); }
    .hero-slide__inner { padding-bottom: 205px; }
    .partner-constellation__stage { transform: none; }
}
@media (max-width: 840px) {
    .hero-section.hero-slider { --hero-header-offset: 80px; min-height: 760px; height: max(760px, calc(100svh - var(--hero-header-offset))); max-height: none; }
    .hero-slide__inner { align-items: flex-end; padding-top: 62px; padding-bottom: 190px; }
    .hero-slide__content { width: 100%; }
    .hero-slider__chrome { bottom: 111px; }
    .partner-logo-field__topline { align-items: flex-start; flex-direction: column; gap: 8px; }
    .partner-logo-field__topline small { text-align: left; }
    .partner-logo-grid { grid-template-columns: repeat(auto-fit, minmax(138px, 1fr)); }
}
@media (max-width: 620px) {
    .hero-section.hero-slider { --hero-header-offset: 72px; min-height: 710px; height: max(710px, calc(100svh - var(--hero-header-offset))); max-height: none; }
    .hero-slide__inner { padding-top: 40px; padding-bottom: 158px; }
    .hero-slider__chrome { bottom: 91px; }
    .hero-trust-rail { bottom: 11px; }
    .partner-logo-field { padding: 14px; border-radius: 24px; }
    .partner-logo-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
    .partner-logo-grid .partner-modern-card { min-height: 112px; padding: 20px 10px 12px; border-radius: 16px; }
    .partner-logo-grid .partner-modern-card img { height: 64px; max-height: 64px; }
    .partner-card__test-label { display: none; }
    .mission-scroll-progress__paw { display: grid; }
    .mission-scroll-progress__endpoint { width: 23px; height: 23px; top: 5px; font-size: 13px !important; }
    .mission-scroll-progress__home { left: 3px; }
    .mission-scroll-progress__clinic { right: 3px; }
    .mission-scroll-progress__track { left: 14px; right: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .mouse-paw-trail { display: none !important; }
}

/* ==========================================================
   v1.5 — Donation-led typography, restored partner constellation,
          aligned mission journey, arrival modal & CTA paw swarms
   ========================================================== */

:root {
    --font-heading: "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-body: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ink: #211b1d;
    --ink-soft: #5f5558;
    --paper: #fffdfa;
    --soft: #f8f4ef;
}

body {
    font-family: var(--font-body);
    font-size: 16.5px;
    line-height: 1.72;
    letter-spacing: -.006em;
}

h1, h2, h3, h4 {
    font-family: var(--font-heading);
    font-weight: 800;
    letter-spacing: -.045em;
    text-wrap: balance;
}
h1 { line-height: .99; }
h2 { line-height: 1.04; }
h3 { line-height: 1.12; letter-spacing: -.03em; }
p { text-wrap: pretty; }
.section-heading > p,
.section-copy > p { line-height: 1.75; }

.eyebrow {
    position: relative;
    gap: 9px;
    padding: 8px 12px;
    border: 1px solid rgba(167,27,28,.12);
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(167,27,28,.055), rgba(97,27,167,.035));
    font-family: var(--font-heading);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .145em;
}
.eyebrow::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--red), var(--purple));
    box-shadow: 0 0 0 5px rgba(167,27,28,.07);
}
.eyebrow-light {
    color: #fff;
    border-color: rgba(255,255,255,.2);
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(8px);
}
.eyebrow-light::before { background: #fff; box-shadow: 0 0 0 5px rgba(255,255,255,.10); }

.button {
    font-family: var(--font-heading);
    font-weight: 800;
    letter-spacing: .025em;
}
.text-link { font-family: var(--font-heading); letter-spacing: -.01em; }

/* A compact donation bridge directly after the hero keeps the mission visible. */
.mission-giving-bridge {
    position: relative;
    z-index: 8;
    padding: 20px 0;
    color: #fff;
    background:
        radial-gradient(circle at 88% 10%, rgba(97,27,167,.42), transparent 28%),
        radial-gradient(circle at 12% 110%, rgba(27,167,167,.28), transparent 36%),
        linear-gradient(115deg, #281a1d, #47161b 52%, #261925);
    box-shadow: 0 18px 54px rgba(41,24,27,.14);
}
.mission-giving-bridge__inner {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 20px;
}
.mission-giving-bridge__icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 18px;
    background: rgba(255,255,255,.09);
    box-shadow: inset 0 1px rgba(255,255,255,.14);
}
.mission-giving-bridge__icon .material-symbols-rounded { color: #ffb7b7; font-size: 1.9rem; font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }
.mission-giving-bridge__copy { display: grid; gap: 3px; }
.mission-giving-bridge__copy span { color: #f5cacc; font-family: var(--font-heading); font-size: .68rem; font-weight: 800; letter-spacing: .13em; }
.mission-giving-bridge__copy strong { max-width: 760px; font-family: var(--font-heading); font-size: clamp(.98rem,1.35vw,1.18rem); line-height: 1.42; letter-spacing: -.022em; }
.mission-giving-bridge .button-primary { background: #fff; color: var(--red); box-shadow: 0 16px 34px rgba(0,0,0,.18); }
.mission-giving-bridge .button-primary:hover { color: #fff; background: var(--red); }

/* Persistent desktop invitation without duplicating the mobile quick-action bar. */
.floating-donate-tab {
    position: fixed;
    z-index: 1250;
    right: 18px;
    bottom: 24px;
    min-height: 54px;
    padding-inline: 20px;
    color: #fff;
    border-color: rgba(255,255,255,.3);
    background: linear-gradient(135deg, var(--red), #cf2d30 58%, var(--purple));
    box-shadow: 0 18px 48px rgba(167,27,28,.28), 0 0 0 1px rgba(167,27,28,.08);
    text-decoration: none;
}
.floating-donate-tab:hover { color: #fff; box-shadow: 0 24px 58px rgba(167,27,28,.34); }
.floating-donate-tab > .material-symbols-rounded { font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24; }

/* CTA paw swarms: subtle at rest, lively when the visitor engages. */
.button,
.nav-donate,
.floating-donate-tab { position: relative; overflow: visible !important; }
.cta-paw-swarm {
    position: absolute;
    z-index: 3;
    inset: -26px -30px;
    pointer-events: none;
    overflow: visible;
}
.cta-paw-swarm__paw {
    position: absolute;
    left: var(--paw-left, 50%);
    top: var(--paw-top, 50%);
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    color: var(--paw-color, var(--red));
    font-size: 14px !important;
    opacity: .18;
    filter: drop-shadow(0 4px 7px rgba(45,25,28,.08));
    transform: translate(-50%,-50%) rotate(var(--paw-rot)) scale(var(--paw-scale));
    transition: opacity .25s ease, filter .25s ease;
    animation: ctaPawOrbit var(--paw-speed,3.8s) ease-in-out var(--paw-delay,0s) infinite alternate;
}
.button:hover .cta-paw-swarm__paw,
.button:focus-visible .cta-paw-swarm__paw,
.nav-donate:hover .cta-paw-swarm__paw,
.nav-donate:focus-visible .cta-paw-swarm__paw,
.floating-donate-tab:hover .cta-paw-swarm__paw,
.floating-donate-tab:focus-visible .cta-paw-swarm__paw {
    opacity: .88;
    filter: drop-shadow(0 6px 10px rgba(45,25,28,.14));
}
@keyframes ctaPawOrbit {
    0% { transform: translate(-50%,-50%) rotate(var(--paw-rot)) scale(var(--paw-scale)); }
    50% { transform: translate(calc(-50% + var(--paw-dx)), calc(-50% + var(--paw-dy))) rotate(calc(var(--paw-rot) + 14deg)) scale(var(--paw-scale)); }
    100% { transform: translate(calc(-50% - var(--paw-dx)), calc(-50% - var(--paw-dy))) rotate(calc(var(--paw-rot) - 12deg)) scale(var(--paw-scale)); }
}

/* v1.5 mission journey: endpoints and travelling paw share one exact center line. */
.mission-scroll-progress {
    height: 34px;
    overflow: visible;
}
.mission-scroll-progress__track {
    top: 16px;
    left: 18px;
    right: 18px;
    height: 4px;
    transform: translateY(-50%);
}
.mission-scroll-progress__endpoint {
    top: 16px;
    width: 28px;
    height: 28px;
    transform: translateY(-50%);
    font-size: 16px !important;
}
.mission-scroll-progress__home { left: 4px; }
.mission-scroll-progress__clinic { right: 4px; }
.mission-scroll-progress__paw {
    top: 50%;
    left: calc(var(--page-progress) * 100%);
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 5px 15px rgba(44,25,28,.14);
    transform: translate(-50%,-50%);
    font-size: 16px !important;
    font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 24;
    transition: box-shadow .25s ease, color .25s ease, transform .25s ease;
}
.mission-scroll-progress.is-at-clinic .mission-scroll-progress__paw {
    color: var(--teal);
    box-shadow: 0 0 0 7px rgba(27,167,167,.12), 0 6px 18px rgba(27,167,167,.24);
    transform: translate(-50%,-50%) scale(1.08);
}

/* Restore the v1.3 four-logo partner constellation presentation. */
.partners-section.partner-constellation {
    position: relative;
    overflow: hidden;
    padding: 108px 0;
    background:
        radial-gradient(circle at 86% 20%, rgba(27,167,167,.10), transparent 30%),
        radial-gradient(circle at 8% 84%, rgba(167,27,28,.08), transparent 32%),
        #f7f5f1;
}
.partner-constellation__layout {
    display: grid;
    grid-template-columns: .8fr 1.2fr;
    gap: clamp(55px,7vw,110px);
    align-items: center;
}
.partner-constellation__intro {
    position: relative;
    z-index: 3;
    max-width: none;
    margin: 0;
    text-align: left;
}
.partner-constellation__intro h2 { max-width: 640px; margin-left: 0; margin-right: 0; }
.partner-constellation__intro > p { max-width: 580px; margin-left: 0; margin-right: 0; color: var(--ink-soft); font-size: 1.08rem; }
.partner-impact-note { margin-left: 0; margin-right: 0; }
.partner-constellation__stage { position: relative; min-height: 560px; }
.partner-orbit {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 1px dashed rgba(97,27,167,.17);
    border-radius: 50%;
    transform: translate(-50%,-50%);
}
.orbit-a { width: 480px; height: 480px; animation: partnerOrbit 34s linear infinite; }
.orbit-b { width: 325px; height: 325px; border-style: solid; border-color: rgba(27,167,167,.14); animation: partnerOrbit 24s linear reverse infinite; }
.partner-center-mark {
    position: absolute;
    left: 50%;
    top: 50%;
    display: grid;
    place-items: center;
    width: 88px;
    height: 88px;
    color: #fff;
    border: 9px solid rgba(255,255,255,.88);
    border-radius: 50%;
    background: linear-gradient(135deg, var(--red), #c92a2c);
    box-shadow: 0 24px 60px rgba(167,27,28,.24), 0 0 0 1px rgba(167,27,28,.08);
    transform: translate(-50%,-50%);
}
.partner-center-mark::after { content: ""; position: absolute; inset: -28px; border: 1px solid rgba(167,27,28,.1); border-radius: 50%; animation: missionRipple 2.8s ease-out infinite; }
.partner-center-mark .material-symbols-rounded { font-size: 2.15rem; }
.partner-modern-card {
    position: absolute;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 235px;
    min-height: 155px;
    padding: 29px 24px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.9);
    border-radius: 26px;
    background: rgba(255,255,255,.86);
    box-shadow: 0 24px 60px rgba(48,36,36,.1), inset 0 1px rgba(255,255,255,.9);
    backdrop-filter: blur(18px);
}
.partner-modern-card img { width: 100%; max-width: 180px; max-height: 94px; object-fit: contain; }
.partner-card-one { left: 0; right: auto; top: 42px; bottom: auto; }
.partner-card-two { right: 4px; left: auto; top: 8px; bottom: auto; }
.partner-card-three { left: 36px; right: auto; bottom: 18px; top: auto; }
.partner-card-four { right: 0; left: auto; bottom: 60px; top: auto; }

/* Donation arrival modal shown when the journey paw reaches the clinic. */
.donation-arrival-modal[hidden] { display: none !important; }
.donation-arrival-modal {
    position: fixed;
    z-index: 5000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 24px;
}
.donation-arrival-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(24,15,18,.70);
    backdrop-filter: blur(12px);
    animation: donationBackdropIn .32s ease both;
}
.donation-arrival-modal__dialog {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(190px,.62fr) minmax(0,1.38fr);
    width: min(920px, 100%);
    max-height: min(720px, calc(100vh - 48px));
    overflow: auto;
    border: 1px solid rgba(255,255,255,.75);
    border-radius: 34px;
    background: #fffdfb;
    box-shadow: 0 42px 120px rgba(26,14,18,.34);
    animation: donationDialogIn .56s cubic-bezier(.16,1,.3,1) both;
}
.donation-arrival-modal__close {
    position: absolute;
    z-index: 4;
    right: 16px;
    top: 16px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    padding: 0;
    color: var(--ink);
    border: 1px solid rgba(42,37,38,.1);
    border-radius: 50%;
    background: rgba(255,255,255,.9);
}
.donation-arrival-modal__close:hover { color: var(--red); transform: rotate(8deg); }
.donation-arrival-modal__visual {
    position: relative;
    min-height: 100%;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 46%, rgba(255,255,255,.18), transparent 18%),
        radial-gradient(circle at 15% 15%, rgba(27,167,167,.65), transparent 28%),
        radial-gradient(circle at 90% 82%, rgba(97,27,167,.70), transparent 32%),
        linear-gradient(145deg, var(--red), #8c181a 52%, #421a52);
}
.donation-arrival-modal__visual::after {
    content: "SPAY IT FORWARD";
    position: absolute;
    left: 50%;
    bottom: 28px;
    width: 100%;
    color: rgba(255,255,255,.72);
    font-family: var(--font-heading);
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .18em;
    text-align: center;
    transform: translateX(-50%);
}
.donation-arrival-modal__heart {
    position: absolute;
    left: 50%;
    top: 50%;
    color: #fff;
    font-size: 6rem !important;
    transform: translate(-50%,-50%);
    font-variation-settings: "FILL" 1, "wght" 500, "GRAD" 0, "opsz" 48;
    filter: drop-shadow(0 20px 30px rgba(0,0,0,.18));
    animation: donationHeartBeat 2.1s ease-in-out infinite;
}
.donation-arrival-modal__paw { position: absolute; color: rgba(255,255,255,.25); font-size: 2rem !important; }
.donation-arrival-modal__paw.paw-a { left: 18%; top: 20%; transform: rotate(-22deg); }
.donation-arrival-modal__paw.paw-b { right: 14%; top: 31%; transform: rotate(22deg); }
.donation-arrival-modal__paw.paw-c { left: 23%; bottom: 18%; transform: rotate(12deg); }
.donation-arrival-modal__content { padding: clamp(40px,5vw,66px); align-self: center; }
.donation-arrival-modal__content h2 { max-width: 610px; margin-bottom: 20px; font-size: clamp(2.15rem,4vw,3.8rem); color: #271d20; }
.donation-arrival-modal__content > p { max-width: 650px; color: var(--ink-soft); font-size: 1.05rem; }
.donation-arrival-modal__impact { display: flex; flex-wrap: wrap; gap: 9px; margin: 25px 0 28px; }
.donation-arrival-modal__impact > span { display: inline-flex; align-items: center; gap: 7px; padding: 9px 12px; border: 1px solid rgba(27,167,167,.14); border-radius: 999px; color: #433b3d; background: #f8fbfa; font-family: var(--font-heading); font-size: .73rem; font-weight: 700; }
.donation-arrival-modal__impact .material-symbols-rounded { color: var(--teal); }
.donation-arrival-modal__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 15px; }
.donation-arrival-modal__later { padding: 10px 4px; color: #766b6e; border: 0; background: transparent; font-family: var(--font-heading); font-size: .78rem; font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.donation-arrival-modal__later:hover { color: var(--red); }
.donation-arrival-modal__note { margin: 18px 0 0 !important; color: #8a7e81 !important; font-size: .78rem !important; }
body.donation-modal-open { overflow: hidden; }
@keyframes donationBackdropIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes donationDialogIn { from { opacity: 0; transform: translateY(28px) scale(.95); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes donationHeartBeat { 50% { transform: translate(-50%,-50%) scale(1.09); } }

.final-cta-support { max-width: 730px; margin: 12px 0 0; color: rgba(255,255,255,.72); font-size: .98rem; }

@media (max-width: 1100px) {
    .partner-constellation__layout { grid-template-columns: .9fr 1.1fr; gap: 46px; }
    .partner-constellation__stage { min-height: 530px; transform: scale(.9); transform-origin: center; }
    .mission-giving-bridge__inner { grid-template-columns: auto 1fr; }
    .mission-giving-bridge .button { grid-column: 2; justify-self: start; }
}

@media (max-width: 820px) {
    .floating-donate-tab { display: none; }
    .mission-giving-bridge { padding: 24px 0; }
    .mission-giving-bridge__inner { grid-template-columns: auto 1fr; gap: 14px; }
    .mission-giving-bridge__icon { width: 48px; height: 48px; border-radius: 15px; }
    .mission-giving-bridge .button { grid-column: 1 / -1; width: 100%; }

    .partner-constellation__layout { grid-template-columns: 1fr; }
    .partner-constellation__intro { text-align: center; }
    .partner-constellation__intro h2,
    .partner-constellation__intro > p,
    .partner-impact-note { margin-left: auto; margin-right: auto; }
    .partner-constellation__stage { min-height: 0; transform: none; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .partner-orbit, .partner-center-mark { display: none; }
    .partner-modern-card { position: relative; inset: auto; width: auto; min-height: 150px; }

    .donation-arrival-modal__dialog { grid-template-columns: 1fr; }
    .donation-arrival-modal__visual { min-height: 150px; }
    .donation-arrival-modal__heart { font-size: 4.3rem !important; }
    .donation-arrival-modal__visual::after { bottom: 17px; }
    .donation-arrival-modal__content { padding: 34px 28px 30px; }
}

@media (max-width: 560px) {
    body { font-size: 16px; }
    .eyebrow { font-size: .63rem; letter-spacing: .12em; }
    .partner-constellation__stage { grid-template-columns: 1fr; }
    .partner-modern-card { min-height: 132px; }
    .donation-arrival-modal { padding: 12px; }
    .donation-arrival-modal__dialog { max-height: calc(100vh - 24px); border-radius: 24px; }
    .donation-arrival-modal__content h2 { font-size: clamp(2rem,10vw,2.8rem); }
    .donation-arrival-modal__actions .button { width: 100%; }
    .donation-arrival-modal__later { width: 100%; }
    .mission-scroll-progress__endpoint { width: 25px; height: 25px; font-size: 14px !important; }
    .mission-scroll-progress__home { left: 5px; }
    .mission-scroll-progress__clinic { right: 5px; }
    .mission-scroll-progress__track { left: 17px; right: 17px; }
    .mission-scroll-progress__paw { left: calc(var(--page-progress) * 100%); width: 25px; height: 25px; font-size: 14px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .cta-paw-swarm__paw,
    .donation-arrival-modal__heart,
    .donation-arrival-modal__dialog,
    .donation-arrival-modal__backdrop { animation: none !important; }
}


/* ==========================================================
   v1.6 — progress-lane spacing & marker stacking refinement
   ========================================================== */
/* Reserve a dedicated lane above the utility/navigation content so the
   HOME -> paw -> CLINIC journey never overlaps Tulsa/contact/hours text. */
.site-header {
    padding-top: 34px;
}
.mission-scroll-progress {
    z-index: 2205;
    height: 34px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 1px 0 rgba(75,58,58,.08);
}
.mission-scroll-progress__track {
    z-index: 1;
}
.mission-scroll-progress__endpoint {
    z-index: 4;
}
.mission-scroll-progress__paw {
    z-index: 8;
}

@media (max-width: 720px) {
    .site-header { padding-top: 34px; }
}

/* ==========================================================
   v1.7 — intentional hero loading, accessibility, trust,
           donation storytelling & on-demand progress journey
   ========================================================== */

/* The progress journey is fully hidden until the visitor starts moving down
   the page. Once active, the header opens a dedicated 34px lane so the rail
   never overlaps the utility-bar contact information. */
.site-header {
    padding-top: 0;
    transition: padding-top .3s cubic-bezier(.2,.7,.2,1), box-shadow .2s ease;
}
body.progress-journey-active .site-header { padding-top: 34px; }
.mission-scroll-progress {
    opacity: 0;
    visibility: hidden;
    transform: translate3d(0,-110%,0);
    transition: opacity .28s ease, transform .38s cubic-bezier(.16,1,.3,1), visibility 0s linear .38s;
}
.mission-scroll-progress.is-active {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0,0,0);
    transition-delay: 0s;
}

/* Hero keyboard focus should be visible without drawing a permanent box. */
.hero-slider:focus { outline: none; }
.hero-slider:focus-visible::after {
    content: "";
    position: absolute;
    z-index: 15;
    inset: 7px;
    border: 2px solid rgba(255,255,255,.78);
    border-radius: 18px;
    pointer-events: none;
}

/* Expanded credibility rail. The five signals form one premium visual system
   and remain scroll-safe on narrower screens. */
.hero-trust-rail {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    gap: 8px;
}
.hero-trust-rail > div {
    min-height: 66px;
    padding: 10px 12px;
    border-color: rgba(255,255,255,.17);
    background: linear-gradient(145deg, rgba(20,14,17,.58), rgba(20,14,17,.34));
    box-shadow: inset 0 1px rgba(255,255,255,.08);
}
.hero-trust-rail .material-symbols-rounded {
    color: #9bd75b;
    font-size: 1.55rem;
}
.hero-trust-rail .hero-trust-google .material-symbols-rounded { color: #f4c34d; }
.hero-trust-rail strong { font-size: .86rem; letter-spacing: -.01em; }
.hero-trust-rail span:last-child { font-size: .64rem; line-height: 1.25; }

/* A direct escape hatch makes the cinematic hero distinctive without making
   a visitor watch the video before continuing. */
.hero-cinema-hint {
    gap: 10px;
}
.hero-skip-video {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 34px;
    margin-left: 4px;
    padding: 6px 11px;
    color: #fff;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 999px;
    background: rgba(255,255,255,.1);
    font-family: var(--font-heading);
    font-size: .68rem;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    transition: background .2s ease, transform .2s ease, border-color .2s ease;
}
.hero-skip-video:hover,
.hero-skip-video:focus-visible {
    background: rgba(255,255,255,.2);
    border-color: rgba(255,255,255,.58);
    transform: translateY(-1px);
}
.hero-skip-video .material-symbols-rounded { font-size: 1rem; }

/* Make the donor story show the actual mission chain instead of repeating a
   generic donation request. No unverified dollar-to-impact claims are used. */
.donation-outcome-flow {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: stretch;
    gap: 10px;
    margin: 28px 0 30px;
}
.donation-outcome-flow > div {
    display: grid;
    align-content: start;
    gap: 6px;
    min-width: 0;
    padding: 15px 14px;
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 18px;
    background: rgba(255,255,255,.08);
    box-shadow: inset 0 1px rgba(255,255,255,.06);
    backdrop-filter: blur(10px);
}
.donation-outcome-flow > div > .material-symbols-rounded {
    color: #fff;
    font-size: 1.45rem;
}
.donation-outcome-flow strong {
    color: #fff;
    font-family: var(--font-heading);
    font-size: .8rem;
    line-height: 1.25;
}
.donation-outcome-flow > div > span:last-child {
    color: rgba(255,255,255,.7);
    font-size: .69rem;
    line-height: 1.35;
}
.donation-outcome-arrow {
    align-self: center;
    color: rgba(255,255,255,.48);
    font-size: 1.15rem !important;
}

/* Sticky mobile actions now explain the intent of each choice, while safe-area
   padding keeps them clear of modern phone home indicators. */
@media (max-width: 1099px) {
    .mobile-quick-actions {
        bottom: max(10px, env(safe-area-inset-bottom));
        border-radius: 18px;
        box-shadow: 0 18px 52px rgba(20,15,15,.2);
    }
    .mobile-quick-actions a {
        min-height: 58px;
        gap: 8px;
        text-align: left;
    }
    .mobile-quick-actions a > span:last-child {
        display: grid;
        gap: 1px;
        line-height: 1.05;
    }
    .mobile-quick-actions small {
        display: block;
        opacity: .62;
        font-family: var(--font-body);
        font-size: .56rem;
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: none;
    }
    .mobile-action-donate small { color: rgba(255,255,255,.74); opacity: 1; }

    body.progress-journey-active .primary-navigation { top: 114px; }
}

@media (max-width: 840px) {
    .hero-trust-rail {
        grid-template-columns: repeat(5,minmax(142px,1fr));
        width: calc(100% - 28px);
        overflow-x: auto;
        padding: 0 1px 4px;
        scrollbar-width: none;
        overscroll-behavior-x: contain;
    }
    .hero-trust-rail::-webkit-scrollbar { display: none; }
    .hero-trust-rail > div { min-height: 66px; }
    .donation-outcome-flow { grid-template-columns: 1fr; }
    .donation-outcome-arrow { justify-self: center; transform: rotate(90deg); }
}

@media (max-width: 620px) {
    body.progress-journey-active .primary-navigation { top: 106px; }
    .hero-slide__inner { padding-bottom: 172px; }
    .hero-slider__chrome { bottom: 104px; }
    .hero-trust-rail {
        bottom: 12px;
        grid-template-columns: repeat(5,minmax(128px,1fr));
        gap: 6px;
        width: calc(100% - 18px);
    }
    .hero-trust-rail > div {
        display: grid;
        grid-template-columns: auto 1fr;
        min-height: 72px;
        padding: 8px 9px;
        text-align: left;
    }
    .hero-trust-rail .material-symbols-rounded { display: block; grid-row: 1 / 3; font-size: 1.35rem; }
    .hero-trust-rail strong { font-size: .72rem; }
    .hero-trust-rail span:last-child { font-size: .56rem; }
    .hero-cinema-hint {
        display: grid;
        grid-template-columns: auto 1fr;
        row-gap: 7px;
        width: min(330px, calc(100% - 32px));
        white-space: normal;
    }
    .hero-skip-video { grid-column: 1 / -1; justify-self: center; margin-left: 0; }
}

/* Browser-level rendering optimization for heavy sections well below the fold.
   The intrinsic size prevents major jumps while the browser skips off-screen
   paint work. */
@supports (content-visibility: auto) {
    .impact-section,
    .prevention-section,
    .appointment-section,
    .testimonials-section,
    .facebook-community-section,
    .faq-section,
    .partners-section {
        content-visibility: auto;
        contain-intrinsic-size: 900px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .site-header,
    .mission-scroll-progress,
    .hero-skip-video { transition: none !important; }
    .hero-slider:focus-visible::after { border-style: solid; }
}


/* ==========================================================
   v1.8 — black mission-progress lane + contrast polish
   ========================================================== */
/* The progress journey remains hidden until scrolling begins (v1.7), but once
   visible the entire reserved lane is now deliberately solid black. This gives
   the HOME -> paw -> CLINIC story a high-contrast visual frame without leaking
   into the utility-bar content below it. */
.mission-scroll-progress {
    background: #000;
    box-shadow: 0 1px 0 rgba(255,255,255,.08), 0 8px 24px rgba(0,0,0,.18);
}
.mission-scroll-progress__track {
    background: rgba(255,255,255,.20);
    box-shadow: inset 0 1px rgba(255,255,255,.08);
}
.mission-scroll-progress__fill {
    background: linear-gradient(90deg, #A71B1C 0%, #611BA7 36%, #1BA7A7 70%, #61A71B 100%);
    box-shadow: 0 0 13px rgba(27,167,167,.42);
}
.mission-scroll-progress__endpoint {
    border-color: rgba(255,255,255,.92);
    box-shadow: 0 0 0 2px rgba(0,0,0,.78), 0 5px 16px rgba(0,0,0,.42);
}
.mission-scroll-progress__paw {
    z-index: 12;
    color: var(--red);
    border-color: rgba(255,255,255,.92);
    box-shadow: 0 0 0 2px rgba(0,0,0,.88), 0 6px 18px rgba(0,0,0,.45);
}
.mission-scroll-progress.is-near-clinic .mission-scroll-progress__clinic {
    box-shadow: 0 0 0 2px rgba(0,0,0,.82), 0 0 0 7px rgba(27,167,167,.18), 0 0 24px rgba(27,167,167,.34);
}
.mission-scroll-progress.is-at-clinic .mission-scroll-progress__paw {
    box-shadow: 0 0 0 2px rgba(0,0,0,.88), 0 0 0 8px rgba(27,167,167,.20), 0 7px 22px rgba(27,167,167,.36);
}

/* Slightly more deliberate focus treatment across conversion controls. */
.button:focus-visible,
.nav-donate:focus-visible,
.mobile-quick-actions a:focus-visible,
.text-link:focus-visible,
.hero-arrow:focus-visible,
.hero-media-button:focus-visible,
.hero-dot:focus-visible {
    outline: 3px solid rgba(27,167,167,.55);
    outline-offset: 4px;
}

@media (prefers-contrast: more) {
    .mission-scroll-progress__track { background: rgba(255,255,255,.45); }
    .mission-scroll-progress__endpoint,
    .mission-scroll-progress__paw { border-color: #fff; }
}


/* ==========================================================
   v1.9 — responsive hardening + reversible progress journey
   ========================================================== */
/* The mission journey uses the same deep charcoal as the utility bar and is
   removed again when the visitor returns to the absolute top of the page. */
.mission-scroll-progress {
    background: #1D1819;
}

/* Responsive containment: prevent decorative media, embeds, translated
   elements, and long content from creating a document-level horizontal rail. */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}
@supports not (overflow: clip) {
    html,
    body { overflow-x: hidden; }
}
body { overflow-wrap: break-word; }
.site-header,
main,
.site-footer,
.hero-section,
.hero-slider,
.section,
.photo-cta,
.partner-constellation,
.facebook-community { max-width: 100%; }
.site-shell,
.nav-inner,
.footer-grid,
.footer-bottom-inner,
.hero-slide__inner,
.hero-slide__content,
.split-grid > *,
.service-card-grid > *,
.donation-feature-grid > *,
.impact-flow > *,
.steps-grid > *,
.faq-layout > *,
.final-cta-inner > *,
.inner-hero-grid > *,
.two-column-details > *,
.appointment-layout > *,
.care-after-layout > *,
.contact-grid > *,
.donation-story-grid > *,
.donate-hero-grid > *,
.pricing-grid > *,
.schedule-grid > *,
.care-grid > *,
.care-detail-grid > *,
.tips-grid > *,
.post-grid > *,
.google-reviews-head > *,
.facebook-community__grid > *,
.partner-constellation__layout > *,
.partner-constellation__stage > *,
.donation-outcome-flow > * {
    min-width: 0;
}
img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
}
iframe { display: block; }
.button,
.text-link,
.primary-menu a,
.footer-menu a { max-width: 100%; }

/* The YouTube cover is measured by JS after interaction; safe percentage
   fallbacks avoid a 100vw box contributing to mobile overflow beforehand. */
.hero-youtube iframe,
.hero-youtube__player iframe {
    width: var(--youtube-cover-width, 100%) !important;
    height: var(--youtube-cover-height, 100%) !important;
}

/* Facebook's old 500px mobile scaling technique was the main deliberate
   over-width element. Keep the embed inside its actual responsive shell. */
.facebook-feed-shell,
.facebook-feed-frame { width: 100%; max-width: 100%; }
.facebook-feed-frame { overflow: hidden; }
.facebook-feed-frame iframe {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    transform: none !important;
    margin: 0 !important;
}

/* Typography and controls stay readable without forcing wide layouts. */
h1,
h2,
h3,
h4 { text-wrap: balance; }
p,
li,
address { text-wrap: pretty; }
input,
textarea,
select { max-width: 100%; }

@media (max-width: 840px) {
    /* Wrap the five trust signals instead of creating a horizontal scroller. */
    .hero-trust-rail {
        grid-template-columns: repeat(3, minmax(0,1fr));
        width: calc(100% - 24px);
        overflow: visible;
        padding: 0;
    }
    .hero-trust-rail > div { min-width: 0; }
    .hero-trust-rail > div:nth-child(4),
    .hero-trust-rail > div:nth-child(5) { min-height: 62px; }

    .facebook-feed-frame iframe { height: 620px; }
    .footer-bottom-inner { justify-items: center; }
}

@media (max-width: 620px) {
    :root { --shell: calc(100% - 24px); }

    .hero-section.hero-slider {
        min-height: 760px;
        height: max(760px, calc(100svh - 72px));
    }
    .hero-slide__inner {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 250px;
    }
    .hero-slide__content { width: 100%; max-width: 100%; }
    .hero-slider__chrome { bottom: 174px; width: calc(100% - 24px); gap: 10px; }
    .hero-slider__meta { gap: 8px; min-width: 0; }
    .hero-slider__line { width: clamp(52px, 18vw, 88px); }
    .hero-slider__hint { display: none; }
    .hero-slider__controls { gap: 5px; }
    .hero-arrow { width: 40px; height: 40px; }

    .hero-trust-rail {
        bottom: 10px;
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 6px;
        width: calc(100% - 20px);
    }
    .hero-trust-rail > div {
        min-height: 61px;
        padding: 7px 8px;
    }
    .hero-trust-rail > div:last-child { grid-column: 1 / -1; }

    .google-reviews-track,
    .reviews-track { max-width: 100%; }
    .google-review-card,
    .review-card { min-width: 0; }

    .facebook-feed-frame { min-height: 0; }
    .facebook-feed-frame iframe { height: 560px; }

    .footer-action,
    .service-table-card,
    .schedule-card,
    .tip-card,
    .care-panel,
    .embed-shell,
    .contact-info-card { padding-left: clamp(20px, 6vw, 27px); padding-right: clamp(20px, 6vw, 27px); }

    .mobile-quick-actions {
        left: max(8px, env(safe-area-inset-left));
        right: max(8px, env(safe-area-inset-right));
    }
    .mobile-quick-actions a { min-width: 0; padding-inline: 8px; }
    .mobile-quick-actions a > span:last-child { min-width: 0; }
}

@media (max-width: 430px) {
    :root { --shell: calc(100% - 20px); }
    body { font-size: 15.5px; }
    .section { padding: 56px 0; }
    .brand img,
    .brand .custom-logo { width: min(74px, 24vw); }
    .nav-inner { gap: 12px; }
    .menu-toggle { width: 44px; height: 44px; flex: 0 0 44px; }

    .hero-section.hero-slider {
        min-height: 780px;
        height: max(780px, calc(100svh - 72px));
    }
    .hero-slide__inner { padding-top: 26px; padding-bottom: 258px; }
    .hero-slide__content h1,
    .hero-slide__content h2 { font-size: clamp(2.1rem, 10.6vw, 3rem); }
    .hero-slide__lede { font-size: .96rem; line-height: 1.55; }
    .hero-slide__actions { gap: 9px; }
    .hero-slider .button { min-height: 48px; padding-inline: 16px; font-size: .74rem; }
    .hero-slider__counter { min-width: 40px; }
    .hero-slider__dots { gap: 2px; }
    .hero-dot { width: 24px; height: 30px; }
    .hero-dot.is-active span { width: 18px; }

    .partner-modern-card { padding: 22px 18px; }
    .facebook-feed-shell__top { grid-template-columns: 36px minmax(0,1fr); }
    .facebook-feed-shell__top .live-chip { grid-column: 2; justify-self: start; }
    .facebook-feed-frame iframe { height: 520px; }

    .donation-arrival-modal { padding: 8px; }
    .donation-arrival-modal__dialog { border-radius: 20px; }
    .donation-arrival-modal__content { padding: 30px 20px 24px; }
    .donation-arrival-modal__impact { gap: 7px; }

    .footer-bottom { font-size: .74rem; }
    .footer-bottom-inner { gap: 10px; }
}

@media (max-width: 360px) {
    :root { --shell: calc(100% - 16px); }
    .hero-section.hero-slider { min-height: 800px; height: max(800px, calc(100svh - 72px)); }
    .hero-slide__inner { padding-bottom: 268px; }
    .hero-slide__eyebrow { font-size: .62rem; letter-spacing: .09em; }
    .hero-slider__chrome { width: calc(100% - 16px); }
    .hero-slider__counter span { display: none; }
    .hero-trust-rail { width: calc(100% - 14px); }
    .hero-trust-rail strong { font-size: .68rem; }
    .hero-trust-rail span:last-child { font-size: .53rem; }
    .mobile-quick-actions a { font-size: .66rem; }
    .mobile-quick-actions small { font-size: .51rem; }
    .mobile-quick-actions .material-symbols-rounded { font-size: 1.15rem; }
}

@media (orientation: landscape) and (max-height: 520px) and (pointer: coarse) {
    .hero-section.hero-slider { min-height: 620px; height: 620px; }
    .hero-slide__inner { align-items: flex-start; padding-top: 32px; padding-bottom: 190px; }
    .hero-slide__content h1,
    .hero-slide__content h2 { font-size: clamp(2rem, 6vw, 3rem); }
    .hero-trust-rail { grid-template-columns: repeat(5,minmax(0,1fr)); }
}

/* v1.10 brand/photo refresh */
.brand-logo { display: block; flex: 0 0 auto; }
.nav-inner { min-height: 104px; }
@media (max-width: 1099px) {
    .nav-inner { min-height: 86px; }
    .primary-navigation { top: 86px; }
}
@media (max-width: 620px) {
    .nav-inner { min-height: 78px; }
    .primary-navigation { top: 78px; }
}
@media (max-width: 430px) {
    .brand img, .brand .custom-logo { width: 70px; max-height: 70px; }
}

.brand-picture,
.footer-brand-picture { display: block; line-height: 0; }
.footer-brand-picture { width: fit-content; margin-bottom: 22px; padding: 10px; border-radius: 20px; background: #fff; }
.footer-brand-picture img { display: block; margin: 0; }

/* ==========================================================
   v1.11 — warmer pet-friendly surfaces + textured storytelling
   ========================================================== */
:root {
    --pet-cream: #fff8f1;
    --pet-oat: #f7f0e8;
    --pet-blush: #fff3f1;
    --pet-mint: #f1faf7;
    --pet-lilac: #f7f2fb;
    --pet-sky: #f2f9fb;
}

/* Keep the site airy, but replace large blank white fields with soft,
   low-contrast pet motifs and organic brand-color washes. */
.section-intro,
.section-services,
.impact-section,
.prevention-section,
.appointment-section,
.about-section,
.testimonials-section,
.google-reviews-section,
.faq-section,
.inner-page > .section,
.inner-page > .soft-section,
.inner-hero {
    position: relative;
    isolation: isolate;
    overflow: clip;
}
@supports not (overflow: clip) {
    .section-intro,
    .section-services,
    .impact-section,
    .prevention-section,
    .appointment-section,
    .about-section,
    .testimonials-section,
    .google-reviews-section,
    .faq-section,
    .inner-page > .section,
    .inner-page > .soft-section,
    .inner-hero { overflow: hidden; }
}

.section-intro {
    background:
        radial-gradient(circle at 90% 12%, rgba(167,27,28,.075), transparent 27%),
        radial-gradient(circle at 4% 92%, rgba(27,167,167,.07), transparent 24%),
        linear-gradient(145deg, var(--pet-cream) 0%, #fffdf9 46%, var(--pet-mint) 100%);
}
.section-intro::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -46px;
    top: 34px;
    width: min(420px, 42vw);
    aspect-ratio: 1;
    opacity: .78;
    background: url('../images/pet-paw-pattern.svg') center / 230px 230px repeat;
    -webkit-mask-image: radial-gradient(circle, #000 0 54%, transparent 76%);
    mask-image: radial-gradient(circle, #000 0 54%, transparent 76%);
    pointer-events: none;
}

.section-services {
    background:
        linear-gradient(rgba(255,255,255,.54), rgba(255,255,255,.54)),
        url('../images/pet-paw-pattern.svg') 3% 16% / 260px 260px repeat,
        linear-gradient(180deg, #f8f1e9 0%, #fffaf4 100%);
}
.section-services::before,
.appointment-section::before,
.faq-section::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: clamp(230px, 34vw, 520px);
    aspect-ratio: 1.35;
    border-radius: 48% 52% 60% 40% / 47% 38% 62% 53%;
    pointer-events: none;
    filter: blur(.2px);
}
.section-services::before {
    right: -12%;
    bottom: -28%;
    background: linear-gradient(135deg, rgba(97,27,167,.075), rgba(27,167,167,.055));
    transform: rotate(-11deg);
}

.impact-section {
    background:
        url('../images/pet-heart-pattern.svg') right -32px top 18px / min(720px, 72vw) auto no-repeat,
        radial-gradient(circle at 8% 90%, rgba(97,27,167,.07), transparent 28%),
        linear-gradient(180deg, #fffdfa 0%, #f9f3ee 100%);
}
.impact-section .impact-flow article {
    border-color: rgba(94,70,72,.11);
    background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(255,252,248,.88));
    box-shadow: 0 18px 44px rgba(47,33,35,.065), inset 0 1px rgba(255,255,255,.9);
}

.prevention-section {
    background:
        radial-gradient(circle at 8% 18%, rgba(27,167,167,.11), transparent 28%),
        radial-gradient(circle at 91% 83%, rgba(97,27,167,.075), transparent 25%),
        linear-gradient(135deg, #eff9f7 0%, #f8fcfb 44%, #fff8f4 100%);
}
.prevention-section::after {
    content: "";
    position: absolute;
    z-index: -1;
    left: -55px;
    bottom: -82px;
    width: 390px;
    height: 260px;
    background: url('../images/pet-heart-pattern.svg') left bottom / 520px auto no-repeat;
    opacity: .72;
    pointer-events: none;
}

.appointment-section {
    background:
        radial-gradient(circle at 92% 10%, rgba(97,27,167,.075), transparent 24%),
        linear-gradient(165deg, var(--pet-lilac) 0%, #fffaf5 56%, #fffdf9 100%);
}
.appointment-section::before {
    left: -11%;
    bottom: -35%;
    background: linear-gradient(135deg, rgba(167,27,28,.065), rgba(97,167,27,.055));
    transform: rotate(13deg);
}

.about-section {
    background:
        linear-gradient(rgba(255,255,255,.64), rgba(255,255,255,.64)),
        url('../images/pet-paw-pattern.svg') right 5% center / 300px 300px repeat,
        linear-gradient(120deg, #fff8f2, #f5faf7);
}

.testimonials-section,
.google-reviews-section {
    background:
        radial-gradient(circle at 96% 18%, rgba(167,27,28,.075), transparent 27%),
        radial-gradient(circle at 4% 84%, rgba(97,27,167,.06), transparent 25%),
        linear-gradient(180deg, #f7f1ed 0%, #fff9f5 100%);
}
.google-reviews-section::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -70px;
    bottom: -50px;
    width: 430px;
    height: 240px;
    opacity: .7;
    background: url('../images/pet-heart-pattern.svg') right bottom / 520px auto no-repeat;
    pointer-events: none;
}
.google-review-card,
.review-card {
    background: linear-gradient(150deg, rgba(255,255,255,.98), rgba(255,250,246,.93));
    box-shadow: 0 16px 38px rgba(50,36,38,.055);
}

.faq-section {
    background:
        linear-gradient(rgba(255,255,255,.54), rgba(255,255,255,.54)),
        url('../images/pet-paw-pattern.svg') 98% 10% / 250px 250px repeat,
        linear-gradient(145deg, #fffaf4, #f7f4fb 58%, #f1faf8);
}
.faq-section::before {
    left: -15%;
    top: -28%;
    background: linear-gradient(135deg, rgba(27,167,167,.07), rgba(97,167,27,.055));
    transform: rotate(-18deg);
}
.faq-list details {
    border-color: rgba(83,64,67,.13);
}
.faq-list details[open] {
    margin-inline: -18px;
    padding-inline: 18px;
    border-radius: 18px;
    background: rgba(255,255,255,.62);
    box-shadow: 0 14px 34px rgba(46,33,35,.045);
}

/* A gentle brand-color marker beneath major section headings makes the long
   homepage feel designed rather than a sequence of isolated white blocks. */
.section-heading h2,
.section-copy h2 {
    position: relative;
}
.centered-heading h2::after,
.google-reviews-head .section-heading h2::after {
    content: "";
    display: block;
    width: 76px;
    height: 5px;
    margin: 20px auto 0;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--red) 0 35%, var(--purple) 35% 58%, var(--teal) 58% 80%, var(--green) 80%);
    opacity: .82;
}
.google-reviews-head .section-heading h2::after { margin-left: 0; }

/* Inner pages inherit the same warm visual language without forcing every
   content area into the same color. */
.inner-hero {
    background:
        url('../images/pet-heart-pattern.svg') right -70px center / min(680px, 58vw) auto no-repeat,
        radial-gradient(circle at 10% 12%, rgba(167,27,28,.08), transparent 28%),
        linear-gradient(145deg, #fff8f1 0%, #fffdf9 52%, #f0f9f7 100%);
}
.inner-page > .section:nth-of-type(odd) {
    background:
        linear-gradient(rgba(255,255,255,.72), rgba(255,255,255,.72)),
        url('../images/pet-paw-pattern.svg') right 6% top 26px / 280px 280px repeat,
        var(--pet-cream);
}
.inner-page > .section:nth-of-type(even),
.inner-page > .soft-section {
    background:
        radial-gradient(circle at 5% 90%, rgba(27,167,167,.07), transparent 24%),
        radial-gradient(circle at 94% 10%, rgba(97,27,167,.06), transparent 26%),
        linear-gradient(145deg, #f4faf8, #faf6f2 58%, #fffaf6);
}
.inner-page > .section > .site-shell,
.inner-page > .soft-section > .site-shell,
.section-intro > .site-shell,
.section-services > .site-shell,
.impact-section > .site-shell,
.prevention-section > .site-shell,
.appointment-section > .site-shell,
.about-section > .site-shell,
.google-reviews-section > .site-shell,
.faq-section > .site-shell {
    position: relative;
    z-index: 1;
}

/* Content cards sit slightly above the textured surfaces for a premium,
   calm nonprofit feel rather than a busy novelty pattern. */
.service-card,
.service-table-card,
.price-card,
.schedule-card,
.tip-card,
.care-panel,
.contact-info-card,
.embed-shell,
.about-facts-card > div,
.facebook-community__points > div {
    border-color: rgba(86,66,69,.11);
    box-shadow: 0 16px 42px rgba(48,34,36,.055);
}
.service-card,
.service-table-card,
.price-card,
.schedule-card,
.tip-card,
.care-panel,
.contact-info-card,
.embed-shell,
.about-facts-card > div {
    background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,251,247,.92));
}

/* Keep decorative textures quieter on small screens so content stays primary. */
@media (max-width: 840px) {
    .section-intro::after { right: -110px; width: 380px; opacity: .48; }
    .impact-section { background-size: 520px auto, auto, auto; }
    .inner-hero { background-size: 500px auto, auto, auto; }
    .faq-list details[open] { margin-inline: -10px; padding-inline: 10px; }
}
@media (max-width: 620px) {
    .section-services,
    .about-section,
    .faq-section,
    .inner-page > .section:nth-of-type(odd) {
        background-size: auto, 210px 210px, auto;
    }
    .section-intro::after,
    .prevention-section::after,
    .google-reviews-section::after { opacity: .34; }
    .impact-section { background-size: 430px auto, auto, auto; }
    .centered-heading h2::after,
    .google-reviews-head .section-heading h2::after { width: 62px; height: 4px; margin-top: 16px; }
}
@media (prefers-contrast: more) {
    .section-intro,
    .section-services,
    .impact-section,
    .prevention-section,
    .appointment-section,
    .about-section,
    .testimonials-section,
    .google-reviews-section,
    .faq-section,
    .inner-page > .section,
    .inner-hero { background-image: none; }
}

/* ==============================================================
   v1.12 — context-aware pet + animal background storytelling
   ============================================================== */
/* v1.11 introduced a warmer surface system. v1.12 makes those surfaces
   intentional by section: mission = home/heart, clinic = care symbols,
   animal education = pet faces/shields, community = conversation, and
   FAQ = learning cues. Decorative art remains low contrast by design. */

/* Homepage: every major light section now has its own contextual motif. */
.section-intro {
    background:
        url('../images/pattern-mission-love.svg') right clamp(18px,5vw,78px) center / clamp(280px,31vw,440px) auto no-repeat,
        radial-gradient(circle at 90% 12%, rgba(167,27,28,.07), transparent 27%),
        radial-gradient(circle at 4% 92%, rgba(27,167,167,.065), transparent 24%),
        linear-gradient(145deg, #fff8f1 0%, #fffdf9 48%, #f1faf7 100%);
}
.section-intro::after { opacity: 0; }

.section-services {
    background:
        url('../images/pattern-clinic-care.svg') left clamp(10px,3vw,46px) bottom 18px / clamp(270px,29vw,420px) auto no-repeat,
        radial-gradient(circle at 94% 8%, rgba(27,167,167,.08), transparent 25%),
        linear-gradient(180deg, #f8f4ee 0%, #fffaf4 100%);
}
.section-services::before {
    background: linear-gradient(135deg, rgba(27,167,167,.07), rgba(97,27,167,.045));
}

.impact-section {
    background:
        url('../images/pattern-animal-friends.svg') right clamp(12px,4vw,60px) top 38px / clamp(300px,31vw,450px) auto no-repeat,
        radial-gradient(circle at 8% 90%, rgba(97,27,167,.065), transparent 28%),
        linear-gradient(180deg, #fffdfa 0%, #f9f3ee 100%);
}

.prevention-section {
    background:
        url('../images/pattern-prevention.svg') left clamp(12px,4vw,64px) bottom 18px / clamp(285px,29vw,430px) auto no-repeat,
        radial-gradient(circle at 90% 13%, rgba(27,167,167,.105), transparent 28%),
        radial-gradient(circle at 91% 83%, rgba(97,27,167,.065), transparent 25%),
        linear-gradient(135deg, #eff9f7 0%, #f8fcfb 44%, #fff8f4 100%);
}
.prevention-section::after { opacity: 0; }

.appointment-section {
    background:
        url('../images/pattern-clinic-care.svg') right clamp(10px,3vw,48px) center / clamp(280px,30vw,430px) auto no-repeat,
        radial-gradient(circle at 8% 90%, rgba(167,27,28,.055), transparent 26%),
        linear-gradient(165deg, #f7f2fb 0%, #fffaf5 56%, #fffdf9 100%);
}

.about-section {
    background:
        url('../images/pattern-mission-love.svg') left clamp(12px,4vw,58px) top 44px / clamp(270px,29vw,410px) auto no-repeat,
        radial-gradient(circle at 94% 82%, rgba(97,167,27,.075), transparent 24%),
        linear-gradient(120deg, #fff8f2, #f5faf7);
}

.testimonials-section,
.google-reviews-section {
    background:
        url('../images/pattern-community-voices.svg') right clamp(10px,3vw,50px) bottom 24px / clamp(300px,31vw,450px) auto no-repeat,
        radial-gradient(circle at 4% 84%, rgba(97,27,167,.06), transparent 25%),
        linear-gradient(180deg, #f7f1ed 0%, #fff9f5 100%);
}
.google-reviews-section::after { opacity: 0; }

.facebook-community-section {
    isolation: isolate;
    background:
        url('../images/pattern-community-voices.svg') left clamp(10px,3vw,48px) top 30px / clamp(290px,30vw,440px) auto no-repeat,
        radial-gradient(circle at 90% 12%, rgba(24,119,242,.095), transparent 27%),
        radial-gradient(circle at 7% 88%, rgba(167,27,28,.065), transparent 28%),
        linear-gradient(145deg, #f6f9ff 0%, #fbf8ff 48%, #fff8f4 100%);
}

.faq-section {
    background:
        url('../images/pattern-faq-learning.svg') right clamp(12px,4vw,62px) top 32px / clamp(285px,29vw,420px) auto no-repeat,
        radial-gradient(circle at 4% 88%, rgba(27,167,167,.06), transparent 25%),
        linear-gradient(145deg, #fffaf4, #f7f4fb 58%, #f1faf8);
}

.partners-section.partner-constellation {
    background:
        url('../images/pattern-partners.svg') left clamp(12px,4vw,64px) bottom 22px / clamp(290px,30vw,440px) auto no-repeat,
        radial-gradient(circle at 86% 20%, rgba(27,167,167,.10), transparent 30%),
        radial-gradient(circle at 8% 84%, rgba(167,27,28,.075), transparent 32%),
        #f7f5f1;
}

/* Inner-page hero artwork changes with the actual page topic instead of
   repeating a generic heart/paw texture on every route. */
.inner-page-about .inner-hero {
    background:
        url('../images/pattern-mission-love.svg') right clamp(12px,4vw,62px) center / clamp(290px,30vw,450px) auto no-repeat,
        radial-gradient(circle at 10% 12%, rgba(167,27,28,.075), transparent 28%),
        linear-gradient(145deg, #fff8f1 0%, #fffdf9 52%, #f0f9f7 100%);
}
.inner-page-services .inner-hero,
.inner-page-appointments .inner-hero,
.inner-page-contact .inner-hero {
    background:
        url('../images/pattern-clinic-care.svg') right clamp(12px,4vw,62px) center / clamp(285px,29vw,430px) auto no-repeat,
        radial-gradient(circle at 8% 10%, rgba(27,167,167,.075), transparent 27%),
        linear-gradient(145deg, #f2faf8 0%, #fffdf9 54%, #f7f2fb 100%);
}
.inner-page-dog .inner-hero,
.inner-page-cat .inner-hero {
    background:
        url('../images/pattern-animal-friends.svg') right clamp(12px,4vw,62px) center / clamp(300px,31vw,455px) auto no-repeat,
        radial-gradient(circle at 9% 12%, rgba(97,167,27,.075), transparent 26%),
        linear-gradient(145deg, #fff9f2 0%, #fffdf9 55%, #f2faf8 100%);
}
.inner-page-pet-care .inner-hero {
    background:
        url('../images/pattern-pet-care.svg') right clamp(12px,4vw,62px) center / clamp(300px,31vw,455px) auto no-repeat,
        radial-gradient(circle at 8% 12%, rgba(167,27,28,.06), transparent 26%),
        linear-gradient(145deg, #fff8f3 0%, #fffdf9 54%, #f2faf8 100%);
}
.inner-page-faq .inner-hero {
    background:
        url('../images/pattern-faq-learning.svg') right clamp(12px,4vw,62px) center / clamp(285px,29vw,430px) auto no-repeat,
        radial-gradient(circle at 8% 12%, rgba(97,27,167,.065), transparent 26%),
        linear-gradient(145deg, #faf6ff 0%, #fffdf9 56%, #f1faf8 100%);
}
.inner-page-assistance .inner-hero {
    background:
        url('../images/pattern-mission-love.svg') right clamp(12px,4vw,62px) center / clamp(285px,29vw,430px) auto no-repeat,
        radial-gradient(circle at 8% 12%, rgba(97,167,27,.07), transparent 26%),
        linear-gradient(145deg, #fff9f2 0%, #fffdf9 56%, #f3faef 100%);
}
.inner-page-spay-neuter .inner-hero,
.inner-page-prevention .inner-hero {
    background:
        url('../images/pattern-prevention.svg') right clamp(12px,4vw,62px) center / clamp(285px,29vw,430px) auto no-repeat,
        radial-gradient(circle at 8% 12%, rgba(27,167,167,.075), transparent 26%),
        linear-gradient(145deg, #eff9f7 0%, #fffdf9 58%, #fff6f3 100%);
}

/* Contextual inner-page content surfaces. */
.inner-page-about > .section:nth-of-type(1) {
    background:
        url('../images/pattern-mission-love.svg') left 4% bottom 22px / 330px auto no-repeat,
        linear-gradient(145deg, #fffaf4, #f3faf7);
}
.inner-page-about > .section:nth-of-type(2) {
    background:
        url('../images/pattern-animal-friends.svg') right 4% top 26px / 340px auto no-repeat,
        linear-gradient(145deg, #f4faf8, #fff8f3);
}

.inner-page-services > .section:nth-of-type(1),
.inner-page-appointments > .section:nth-of-type(1),
.inner-page-contact > .section:nth-of-type(1) {
    background:
        url('../images/pattern-clinic-care.svg') right 4% bottom 20px / 340px auto no-repeat,
        linear-gradient(145deg, #fffaf5, #f2faf8);
}
.inner-page-services > .section:nth-of-type(2),
.inner-page-appointments > .section:nth-of-type(2) {
    background:
        url('../images/pattern-mission-love.svg') left 4% top 24px / 330px auto no-repeat,
        linear-gradient(145deg, #f7f2fb, #fffaf4 58%, #f3faf7);
}
.inner-page-services > .section:nth-of-type(3),
.inner-page-appointments > .section:nth-of-type(3) {
    background:
        url('../images/pattern-pet-care.svg') right 4% top 22px / 330px auto no-repeat,
        linear-gradient(145deg, #f4faf8, #fffaf5);
}

.inner-page-pet-care > .section:nth-of-type(1),
.inner-page-pet-care > .section:nth-of-type(3) {
    background:
        url('../images/pattern-pet-care.svg') right 4% center / 340px auto no-repeat,
        linear-gradient(145deg, #fff9f4, #f3faf8);
}
.inner-page-pet-care > .section:nth-of-type(2) {
    background:
        url('../images/pattern-animal-friends.svg') left 4% center / 340px auto no-repeat,
        linear-gradient(145deg, #f5f1fa, #fffaf4);
}

.inner-page-dog > .section,
.inner-page-cat > .section {
    background:
        url('../images/pattern-animal-friends.svg') right 4% bottom 22px / 340px auto no-repeat,
        radial-gradient(circle at 7% 88%, rgba(97,167,27,.055), transparent 23%),
        linear-gradient(145deg, #fffaf4, #f2faf8);
}
.inner-page-dog > .soft-section,
.inner-page-cat > .soft-section {
    background:
        url('../images/pattern-pet-care.svg') left 4% top 24px / 330px auto no-repeat,
        linear-gradient(145deg, #f4faf8, #fff8f3);
}

.inner-page-faq > .section {
    background:
        url('../images/pattern-faq-learning.svg') right 4% top 24px / 350px auto no-repeat,
        radial-gradient(circle at 7% 88%, rgba(27,167,167,.055), transparent 23%),
        linear-gradient(145deg, #fffaf4, #f7f3fb 58%, #f2faf8);
}

.inner-page-assistance > .section {
    background:
        url('../images/pattern-mission-love.svg') right 4% bottom 22px / 345px auto no-repeat,
        radial-gradient(circle at 6% 10%, rgba(97,167,27,.06), transparent 24%),
        linear-gradient(145deg, #fff9f2, #f2faf5);
}

.inner-page-spay-neuter > .section,
.inner-page-prevention > .section:nth-of-type(1) {
    background:
        url('../images/pattern-prevention.svg') right 4% bottom 20px / 345px auto no-repeat,
        linear-gradient(145deg, #eff9f7, #fffaf5);
}
.inner-page-prevention > .soft-section {
    background:
        url('../images/pattern-animal-friends.svg') left 4% top 24px / 335px auto no-repeat,
        linear-gradient(145deg, #f7f2fb, #fffaf4);
}

/* Donation page: supportive heart/home motifs rather than generic texture. */
.inner-page-donate .donate-hero {
    position: relative;
    isolation: isolate;
}
.inner-page-donate .donate-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: .28;
    background: url('../images/pattern-mission-love.svg') right 5% center / min(440px,38vw) auto no-repeat;
    filter: brightness(0) invert(1);
    pointer-events: none;
}
.inner-page-donate > .section:nth-of-type(1) {
    background:
        url('../images/pattern-mission-love.svg') right 4% bottom 22px / 350px auto no-repeat,
        linear-gradient(145deg, #fff8f1, #f4faf7);
}
.inner-page-donate > .section:nth-of-type(2) {
    background:
        url('../images/pattern-community-voices.svg') left 4% top 24px / 350px auto no-repeat,
        linear-gradient(145deg, #f7f2fb, #fff8f2 55%, #f2faf7);
}

/* Make the new contextual art read as atmosphere, never as content. */
.section-intro,
.section-services,
.impact-section,
.prevention-section,
.appointment-section,
.about-section,
.google-reviews-section,
.facebook-community-section,
.faq-section,
.partners-section.partner-constellation,
.inner-page > .section,
.inner-page .inner-hero {
    background-blend-mode: normal;
}

@media (max-width: 980px) {
    .section-intro,
    .section-services,
    .impact-section,
    .prevention-section,
    .appointment-section,
    .about-section,
    .testimonials-section,
    .google-reviews-section,
    .facebook-community-section,
    .faq-section,
    .partners-section.partner-constellation,
    .inner-page .inner-hero,
    .inner-page > .section {
        background-size: 310px auto, auto, auto, auto;
    }
}

@media (max-width: 620px) {
    .section-intro,
    .section-services,
    .impact-section,
    .prevention-section,
    .appointment-section,
    .about-section,
    .testimonials-section,
    .google-reviews-section,
    .facebook-community-section,
    .faq-section,
    .partners-section.partner-constellation,
    .inner-page .inner-hero,
    .inner-page > .section {
        background-size: 220px auto, auto, auto, auto;
        background-position: right -58px top 18px, center, center, center;
    }
    .inner-page-donate .donate-hero::before {
        opacity: .18;
        background-size: 230px auto;
        background-position: right -55px top 24px;
    }
}

@media (prefers-contrast: more) {
    .section-intro,
    .section-services,
    .impact-section,
    .prevention-section,
    .appointment-section,
    .about-section,
    .testimonials-section,
    .google-reviews-section,
    .facebook-community-section,
    .faq-section,
    .partners-section.partner-constellation,
    .inner-page > .section,
    .inner-page .inner-hero {
        background-image: none;
    }
    .inner-page-donate .donate-hero::before { display: none; }
}
/* Donation hero motif is an overlay layer above the red field, below copy. */
.inner-page-donate .donate-hero::before { z-index: 0; }
.inner-page-donate .donate-hero > .site-shell { position: relative; z-index: 1; }

/* ========================================================================== 
   v1.13 — live-site inner pages + expanded navigation
   ========================================================================== */

/* Desktop dropdown navigation while retaining the existing compact header. */
@media (min-width: 1100px) {
    .primary-menu { gap: 14px; }
    .primary-menu > li > a { font-size: .69rem; letter-spacing: .025em; white-space: nowrap; }
    .primary-menu > .menu-item-has-children { position: relative; }
    .primary-menu > .menu-item-has-children > a { gap: 3px; }
    .submenu-caret { font-size: 1rem; transition: transform .2s ease; }
    .primary-menu .sub-menu {
        position: absolute;
        z-index: 1200;
        top: calc(100% - 2px);
        left: 50%;
        width: max-content;
        min-width: 230px;
        margin: 0;
        padding: 10px;
        list-style: none;
        border: 1px solid rgba(75,58,58,.1);
        border-radius: 18px;
        background: rgba(255,253,249,.98);
        box-shadow: 0 20px 55px rgba(30,25,25,.15);
        opacity: 0;
        visibility: hidden;
        transform: translate(-50%, 10px);
        transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
        backdrop-filter: blur(14px);
    }
    .primary-menu .menu-item-has-children:hover > .sub-menu,
    .primary-menu .menu-item-has-children:focus-within > .sub-menu {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, 0);
    }
    .primary-menu .menu-item-has-children:hover > a .submenu-caret,
    .primary-menu .menu-item-has-children:focus-within > a .submenu-caret { transform: rotate(180deg); }
    .primary-menu .sub-menu a {
        display: flex;
        align-items: center;
        min-height: 42px;
        padding: 8px 12px;
        border-radius: 11px;
        color: var(--ink);
        font-family: var(--font-heading);
        font-size: .75rem;
        font-weight: 750;
        line-height: 1.25;
        text-decoration: none;
        transition: color .18s ease, background .18s ease, transform .18s ease;
    }
    .primary-menu .sub-menu a:hover,
    .primary-menu .sub-menu .is-active > a,
    .primary-menu .sub-menu .current-menu-item > a {
        color: var(--red);
        background: var(--red-soft);
        transform: translateX(2px);
    }
}

/* Mobile shows submenu choices directly so no hidden interaction is required. */
@media (max-width: 1099px) {
    .primary-menu .menu-item-has-children > a { gap: 8px; }
    .primary-menu .submenu-caret { margin-left: auto; }
    .primary-menu .sub-menu {
        display: grid;
        gap: 4px;
        margin: -6px 0 10px;
        padding: 0 0 10px 20px;
        list-style: none;
    }
    .primary-menu .sub-menu li { border: 0; }
    .primary-menu .sub-menu a {
        display: flex;
        align-items: center;
        min-height: 43px;
        padding: 6px 13px;
        border-left: 2px solid var(--line);
        color: var(--ink-soft);
        font-family: var(--font-heading);
        font-size: .82rem;
        font-weight: 700;
        text-decoration: none;
    }
    .primary-menu .sub-menu .is-active > a,
    .primary-menu .sub-menu .current-menu-item > a { color: var(--red); border-left-color: var(--red); }
}

/* Source-content page systems */
.bundle-prices { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0; }
.bundle-prices > div { padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.86); box-shadow: 0 10px 28px rgba(30,25,25,.05); }
.bundle-prices strong, .bundle-prices span { display: block; font-family: var(--font-heading); }
.bundle-prices strong { font-size: 1.1rem; }
.bundle-prices span { margin: 5px 0; color: var(--red); font-size: 1.6rem; font-weight: 800; }
.bundle-prices p { margin: 0; color: var(--ink-soft); }

.facts-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; counter-reset: fact; }
.fact-card { position: relative; overflow: hidden; min-height: 210px; padding: 28px 25px 24px; border: 1px solid var(--line); border-radius: 24px; background: rgba(255,255,255,.9); box-shadow: 0 10px 30px rgba(30,25,25,.045); }
.fact-card::after { content: "pets"; position: absolute; right: 10px; bottom: -17px; color: rgba(97,27,167,.055); font-family: 'Material Symbols Rounded'; font-size: 6rem; transform: rotate(-12deg); pointer-events: none; }
.fact-number { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 20px; border-radius: 50%; color: #fff; background: var(--red); font-family: var(--font-heading); font-weight: 800; box-shadow: 0 7px 18px rgba(167,27,28,.18); }
.fact-card:nth-child(4n+2) .fact-number { background: var(--teal); }
.fact-card:nth-child(4n+3) .fact-number { background: var(--green); }
.fact-card:nth-child(4n+4) .fact-number { background: var(--purple); }
.fact-card p { position: relative; z-index: 1; margin: 0; color: var(--ink-soft); }

.appointment-page-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 22px; }
.appointment-nav-card { position: relative; overflow: hidden; min-height: 290px; padding: 34px; border: 1px solid var(--line); border-radius: 28px; color: var(--ink); background: rgba(255,255,255,.92); box-shadow: 0 12px 34px rgba(30,25,25,.055); text-decoration: none; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.appointment-nav-card::after { content: "pets"; position: absolute; right: -8px; bottom: -24px; color: rgba(27,167,167,.06); font-family: 'Material Symbols Rounded'; font-size: 7rem; transform: rotate(-18deg); }
.appointment-nav-card > .material-symbols-rounded { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 34px; border-radius: 17px; color: var(--red); background: var(--red-soft); font-size: 1.8rem; }
.appointment-nav-card h2 { font-size: clamp(1.6rem,2.3vw,2.2rem); }
.appointment-nav-card p { max-width: 560px; color: var(--ink-soft); }
.appointment-nav-card strong { color: var(--red); font-family: var(--font-heading); }
.appointment-nav-card:hover { transform: translateY(-7px); border-color: rgba(167,27,28,.2); box-shadow: 0 20px 48px rgba(30,25,25,.1); }
.appointment-nav-card.featured { color: #fff; border-color: transparent; background: linear-gradient(135deg, var(--red), #7f1517); }
.appointment-nav-card.featured p, .appointment-nav-card.featured strong { color: rgba(255,255,255,.9); }
.appointment-nav-card.featured > .material-symbols-rounded { color: #fff; background: rgba(255,255,255,.15); }
.appointment-nav-card.featured::after { color: rgba(255,255,255,.08); }

.tips-stack { display: grid; gap: 8px; margin-bottom: 26px; }
.tips-stack p { margin: 0; padding: 12px 0; border-bottom: 1px solid var(--line); }

.booking-note { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 16px 20px; align-items: center; margin-bottom: 24px; padding: 22px 24px; border: 1px solid rgba(27,167,167,.2); border-radius: 22px; background: linear-gradient(135deg, rgba(27,167,167,.08), rgba(255,255,255,.94)); }
.booking-note > .material-symbols-rounded { color: var(--teal); font-size: 2rem; }
.booking-note p { margin: 4px 0 0; color: var(--ink-soft); }
.booking-note .inline-actions { margin: 0; }
.booking-live-shell { overflow: hidden; width: 100%; border: 1px solid var(--line); border-radius: 28px; background: #fff; box-shadow: 0 18px 55px rgba(30,25,25,.08); }
.booking-live-shell iframe { display: block; width: 100%; height: 1320px; min-width: 0; border: 0; background: #fff; }
.booking-fallback { margin: 18px 0 0; text-align: center; color: var(--ink-soft); }
.booking-fallback a { color: var(--red); font-weight: 750; }

.instruction-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.instruction-panel { padding: 32px; border: 1px solid var(--line); border-radius: 26px; background: rgba(255,255,255,.9); box-shadow: 0 10px 32px rgba(30,25,25,.05); }
.instruction-panel > .material-symbols-rounded { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 24px; border-radius: 16px; color: var(--red); background: var(--red-soft); font-size: 1.65rem; }
.instruction-panel:nth-child(2) > .material-symbols-rounded { color: var(--purple); background: rgba(97,27,167,.08); }
.instruction-panel:nth-child(3) > .material-symbols-rounded { color: var(--teal); background: rgba(27,167,167,.09); }
.instruction-panel:nth-child(4) > .material-symbols-rounded { color: var(--green); background: rgba(97,167,27,.09); }
.instruction-panel ol, .care-panel ol { margin: 0; padding-left: 1.2rem; color: var(--ink-soft); }
.instruction-panel li + li, .care-panel li + li, .roomy li + li { margin-top: 10px; }
.number-list.roomy { display: grid; gap: 6px; max-width: 980px; }

.media-resource-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 28px; align-items: stretch; }
.video-card, .resource-card, .career-card, .additional-give-card, .static-form-card { padding: 30px; border: 1px solid var(--line); border-radius: 28px; background: rgba(255,255,255,.92); box-shadow: 0 12px 38px rgba(30,25,25,.055); }
.video-card { padding: 0 0 28px; overflow: hidden; }
.video-card h2, .video-card p { margin-left: 30px; margin-right: 30px; }
.video-card h2 { margin-top: 26px; }
.video-card p { color: var(--ink-soft); }
.video-embed { aspect-ratio: 16/9; background: #171314; }
.video-embed iframe { width: 100%; height: 100%; border: 0; }
.resource-card > .material-symbols-rounded, .career-card > .material-symbols-rounded { color: var(--red); font-size: 2.4rem; }
.resource-card p, .career-card p { color: var(--ink-soft); }
.career-card { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.career-card .text-link { margin-top: 18px; }

.aftercare-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 24px; padding: 0; list-style: none; }
.aftercare-list li { position: relative; padding: 16px 18px 16px 46px; border: 1px solid rgba(75,58,58,.08); border-radius: 16px; background: rgba(255,255,255,.75); color: var(--ink-soft); }
.aftercare-list li::before { content: "pets"; position: absolute; left: 16px; top: 16px; color: var(--teal); font-family: 'Material Symbols Rounded'; }
.aftercare-sections { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.aftercare-sections > article { padding: 30px; border: 1px solid var(--line); border-radius: 26px; background: rgba(255,255,255,.9); box-shadow: 0 10px 32px rgba(30,25,25,.045); }
.aftercare-sections > article.wide { grid-column: 1 / -1; }
.aftercare-sections ul { color: var(--ink-soft); }
.aftercare-sections li + li { margin-top: 9px; }
.warning-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0; list-style: none; }
.warning-list li { position: relative; padding: 10px 12px 10px 36px; border-radius: 12px; background: var(--red-soft); }
.warning-list li::before { content: "priority_high"; position: absolute; left: 10px; color: var(--red); font-family: 'Material Symbols Rounded'; }
.activity-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px 28px; }

.static-form { display: grid; gap: 18px; margin-top: 26px; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.static-form label { display: grid; gap: 8px; color: var(--ink); font-family: var(--font-heading); font-size: .86rem; font-weight: 750; }
.static-form input, .static-form textarea { width: 100%; min-width: 0; padding: 13px 14px; border: 1px solid var(--line); border-radius: 13px; color: var(--ink); background: rgba(255,255,255,.9); font: inherit; }
.static-form input:focus, .static-form textarea:focus { outline: 3px solid rgba(27,167,167,.15); border-color: var(--teal); }
.static-form button[aria-disabled="true"] { opacity: .75; cursor: not-allowed; }

.give-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 26px 0; }
.give-options > div { display: grid; justify-items: center; gap: 10px; padding: 20px 10px; border: 1px solid var(--line); border-radius: 18px; text-align: center; background: rgba(255,255,255,.72); }
.give-options .material-symbols-rounded { color: var(--red); font-size: 2rem; }
.give-options strong { font-family: var(--font-heading); }

/* v1.13 contextual backgrounds continue the v1.12 visual language. */
.inner-page-facts .inner-hero,
.inner-page-careers .inner-hero {
    background-image:
        url('../images/pattern-animal-friends.svg'),
        linear-gradient(135deg,#fffaf5 0%,#fff 58%,#f0fbf9 100%);
    background-position: right 4% center, center;
    background-size: clamp(300px,31vw,460px) auto, auto;
    background-repeat: no-repeat;
}
.inner-page-before-surgery .inner-hero,
.inner-page-after-surgery .inner-hero,
.inner-page-appointment-details .inner-hero,
.inner-page-book-appointment .inner-hero {
    background-image:
        url('../images/pattern-clinic-care.svg'),
        linear-gradient(135deg,#fff8f5 0%,#fff 58%,#effbfa 100%);
    background-position: right 4% center, center;
    background-size: clamp(290px,30vw,450px) auto, auto;
    background-repeat: no-repeat;
}

@media (max-width: 900px) {
    .facts-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .media-resource-grid, .booking-note { grid-template-columns: 1fr; }
    .booking-note .inline-actions { justify-content: flex-start; }
    .aftercare-list, .aftercare-sections { grid-template-columns: 1fr; }
    .aftercare-sections > article.wide { grid-column: auto; }
    .activity-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 700px) {
    .bundle-prices, .facts-grid, .appointment-page-grid, .instruction-grid, .form-grid, .warning-list, .activity-grid { grid-template-columns: 1fr; }
    .appointment-nav-card { min-height: 0; padding: 28px; }
    .booking-live-shell { border-radius: 20px; }
    .booking-live-shell iframe { height: 1650px; }
    .video-card, .resource-card, .career-card, .additional-give-card, .static-form-card { padding: 24px; border-radius: 22px; }
    .video-card { padding: 0 0 24px; }
    .video-card h2, .video-card p { margin-left: 24px; margin-right: 24px; }
    .give-options { grid-template-columns: 1fr; }
}

@media (prefers-contrast: more) {
    .inner-page-facts .inner-hero,
    .inner-page-careers .inner-hero,
    .inner-page-before-surgery .inner-hero,
    .inner-page-after-surgery .inner-hero,
    .inner-page-appointment-details .inner-hero,
    .inner-page-book-appointment .inner-hero { background-image: none; }
}

/* ==========================================================
   v1.14 — interactive donation page + social media hub/footer
   ========================================================== */

/* Donation page: richer storytelling without sacrificing readability. */
.inner-page-donate {
    --donate-ink: #24191b;
}
.donate-hero-v114 {
    position: relative;
    isolation: isolate;
    background:
        radial-gradient(circle at 8% 18%, rgba(255,255,255,.10), transparent 24%),
        radial-gradient(circle at 83% 18%, rgba(97,27,167,.28), transparent 34%),
        linear-gradient(128deg, #681416 0%, #A71B1C 48%, #7b185f 100%);
}
.donate-hero-v114::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: .19;
    background: url('../images/pattern-mission-love.svg') right 3% center / min(700px, 56vw) auto no-repeat;
    pointer-events: none;
}
.donate-hero-v114 .donate-hero-grid { min-height: 660px; }
.donate-hero-v114 .donate-hero-copy { position: relative; z-index: 3; }
.donate-hero-v114 .donate-hero-copy h1 { max-width: 760px; text-wrap: balance; }
.donate-hero-v114 .donate-hero-copy p { max-width: 690px; }
.donate-hero-actions { display: flex; flex-wrap: wrap; gap: 18px 24px; align-items: center; margin-top: 30px; }
.donate-text-link { display: inline-flex; gap: 8px; align-items: center; color: #fff; font-family: var(--font-heading); font-size: .86rem; font-weight: 800; text-decoration: none; }
.donate-text-link .material-symbols-rounded { font-size: 1rem; transition: transform .2s ease; }
.donate-text-link:hover .material-symbols-rounded { transform: translateY(4px); }
.donate-trust-chips { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.donate-trust-chips > span { display: inline-flex; gap: 7px; align-items: center; padding: 9px 12px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: rgba(255,255,255,.88); background: rgba(30,15,18,.18); backdrop-filter: blur(10px); font-size: .72rem; font-weight: 750; }
.donate-trust-chips .material-symbols-rounded { color: #b7e883; font-size: 1.05rem; }
.donate-photo-frame { position: relative; width: min(520px,100%); margin-inline: auto; padding: 14px 14px 0; border-radius: 230px 230px 32px 32px; background: rgba(255,255,255,.10); box-shadow: 0 30px 80px rgba(31,7,11,.34), inset 0 1px rgba(255,255,255,.18); backdrop-filter: blur(8px); }
.donate-photo-frame::before { content: ""; position: absolute; inset: -14px; z-index: -1; border: 1px solid rgba(255,255,255,.16); border-radius: 250px 250px 44px 44px; }
.donate-photo-frame > img { display: block; width: 100%; height: min(570px,60vw); min-height: 470px; object-fit: cover; object-position: center; border-radius: 210px 210px 24px 24px; }
.donate-photo-card { position: absolute; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 10px; align-items: center; max-width: 230px; padding: 13px 15px; border: 1px solid rgba(255,255,255,.52); border-radius: 18px; color: var(--ink); background: rgba(255,255,255,.92); box-shadow: 0 16px 42px rgba(31,9,12,.22); backdrop-filter: blur(12px); animation: donate-card-float 5s ease-in-out infinite; }
.donate-photo-card .material-symbols-rounded { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 50%; color: #fff; background: var(--red); font-size: 1.2rem; }
.donate-photo-card strong { font-family: var(--font-heading); font-size: .72rem; line-height: 1.3; }
.donate-photo-card-top { top: 16%; left: -44px; }
.donate-photo-card-bottom { right: -42px; bottom: 12%; animation-delay: -2.5s; }
.donate-photo-card-bottom .material-symbols-rounded { background: var(--teal); }
@keyframes donate-card-float { 0%,100% { transform: translateY(0) rotate(-.6deg); } 50% { transform: translateY(-9px) rotate(.6deg); } }

.donate-hero-shapes { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.donate-orbit { position: absolute; display: grid; place-items: center; width: 74px; height: 74px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; color: rgba(255,255,255,.32); background: rgba(255,255,255,.045); box-shadow: 0 0 0 14px rgba(255,255,255,.025); animation: donate-orbit-drift 11s ease-in-out infinite; }
.donate-orbit .material-symbols-rounded { font-size: 1.75rem; }
.donate-orbit-one { left: 5%; top: 18%; }
.donate-orbit-two { left: 43%; bottom: 7%; width: 56px; height: 56px; animation-delay: -4s; }
.donate-orbit-three { right: 4%; top: 9%; width: 96px; height: 96px; animation-delay: -7s; }
@keyframes donate-orbit-drift { 0%,100% { transform: translate3d(0,0,0) rotate(-8deg); } 50% { transform: translate3d(10px,-18px,0) rotate(9deg); } }

.donation-story-section {
    background:
        url('../images/pattern-animal-friends.svg') right 2% center / min(470px,36vw) auto no-repeat,
        linear-gradient(145deg,#fffaf4 0%,#fff 53%,#eef9f7 100%);
}
.donation-visual-story { position: relative; overflow: hidden; min-height: 530px; border: 1px solid rgba(74,52,56,.10); border-radius: 34px; background: #191516; box-shadow: 0 22px 60px rgba(41,29,31,.13); }
.donation-visual-story > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .58; transition: transform .7s cubic-bezier(.2,.8,.2,1), opacity .4s ease; }
.donation-visual-story::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(25,21,22,.05), rgba(25,21,22,.92) 82%); }
.donation-visual-story:hover > img { transform: scale(1.035); opacity: .67; }
.donation-visual-story__content { position: absolute; z-index: 2; inset: auto 0 0; padding: 32px; color: #fff; }
.donation-visual-story__content h3 { margin-bottom: 22px; color: #fff; font-size: clamp(1.5rem,2vw,2.15rem); }
.donation-journey-list { display: grid; gap: 9px; }
.donation-journey-list > span { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; padding: 11px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 15px; background: rgba(255,255,255,.07); backdrop-filter: blur(9px); }
.donation-journey-list b { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; color: #fff; background: var(--red); font-family: var(--font-heading); font-size: .72rem; }
.donation-journey-list > span:nth-child(2) b { background: var(--teal); }
.donation-journey-list > span:nth-child(3) b { background: var(--green); }
.donation-journey-list strong, .donation-journey-list small { display: block; }
.donation-journey-list strong { font-family: var(--font-heading); font-size: .78rem; }
.donation-journey-list small { margin-top: 2px; color: rgba(255,255,255,.7); font-size: .67rem; }

.donation-give-section {
    background:
        radial-gradient(circle at 13% 15%, rgba(97,27,167,.07), transparent 24%),
        radial-gradient(circle at 86% 88%, rgba(27,167,167,.08), transparent 26%),
        linear-gradient(180deg,#f8f2ec 0%,#fffaf6 100%);
}
.donation-give-heading { max-width: 840px; margin-inline: auto; }
.donation-give-heading > p { max-width: 760px; margin-inline: auto; }
.donation-choice-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; max-width: 1040px; margin: 42px auto 0; }
.donation-choice-card { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; min-height: 365px; padding: 36px; border: 1px solid rgba(83,62,66,.11); border-radius: 30px; background: rgba(255,255,255,.92); box-shadow: 0 18px 46px rgba(43,31,33,.07); transition: transform .32s ease, box-shadow .32s ease, border-color .32s ease; }
.donation-choice-card::after { content: "pets"; position: absolute; right: -22px; bottom: -42px; color: rgba(167,27,28,.045); font-family: 'Material Symbols Rounded'; font-size: 10rem; transform: rotate(-15deg); transition: transform .45s ease, color .45s ease; }
.donation-choice-card:hover { transform: translateY(-8px); border-color: rgba(167,27,28,.20); box-shadow: 0 28px 65px rgba(43,31,33,.12); }
.donation-choice-card:hover::after { color: rgba(167,27,28,.075); transform: rotate(-6deg) scale(1.04); }
.donation-choice-icon { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 28px; border-radius: 20px; color: var(--red); background: var(--red-soft); }
.donation-choice-icon .material-symbols-rounded { font-size: 2rem; }
.donation-choice-kicker { color: var(--red); font-family: var(--font-heading); font-size: .69rem; font-weight: 850; letter-spacing: .12em; }
.donation-choice-card h3 { max-width: 430px; margin: 8px 0 12px; font-size: clamp(1.5rem,2.2vw,2.1rem); }
.donation-choice-card p { max-width: 520px; margin-bottom: 28px; color: var(--ink-soft); }
.donation-choice-card .button { margin-top: auto; }
.donation-choice-featured { color: #fff; border-color: transparent; background: linear-gradient(145deg,#741417,#A71B1C 56%,#86154e); }
.donation-choice-featured::after { color: rgba(255,255,255,.06); }
.donation-choice-featured:hover::after { color: rgba(255,255,255,.10); }
.donation-choice-featured .donation-choice-icon { color: #fff; background: rgba(255,255,255,.14); }
.donation-choice-featured .donation-choice-kicker, .donation-choice-featured h3 { color: #fff; }
.donation-choice-featured p { color: rgba(255,255,255,.82); }

.additional-give-section {
    position: relative;
    background:
        url('../images/pattern-community-voices.svg') left -40px bottom -30px / min(520px,45vw) auto no-repeat,
        linear-gradient(145deg,#fff 0%,#f7fbfa 55%,#fbf5ff 100%);
}
.additional-give-intro { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.7fr); gap: 50px; align-items: end; margin-bottom: 38px; }
.additional-give-intro p { margin: 0; color: var(--ink-soft); }
.give-graphic-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.give-graphic-card { position: relative; overflow: hidden; display: grid; grid-template-rows: minmax(230px,1fr) auto; min-width: 0; border: 1px solid rgba(75,56,59,.11); border-radius: 28px; color: var(--ink); background: rgba(255,255,255,.94); box-shadow: 0 16px 42px rgba(40,29,31,.07); text-decoration: none; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.give-graphic-card::before { content: ""; position: absolute; inset: 0; z-index: 1; opacity: 0; background: linear-gradient(120deg, transparent 20%, rgba(255,255,255,.7) 45%, transparent 70%); transform: translateX(-100%); transition: opacity .25s ease, transform .7s ease; pointer-events: none; }
.give-graphic-card__glow { position: absolute; inset: -40% -20% auto; height: 60%; opacity: .7; background: radial-gradient(circle, rgba(167,27,28,.08), transparent 66%); pointer-events: none; }
.give-graphic-card__image { display: grid; place-items: center; min-width: 0; padding: 34px; background: linear-gradient(145deg,rgba(255,255,255,.82),rgba(250,247,244,.72)); }
.give-graphic-card__image img { width: min(240px,100%); max-height: 240px; object-fit: contain; transition: transform .35s ease; }
.give-graphic-card__footer { display: flex; gap: 12px; align-items: center; justify-content: space-between; min-width: 0; padding: 20px 22px; border-top: 1px solid rgba(75,56,59,.09); background: #fff; }
.give-graphic-card__footer strong { font-family: var(--font-heading); font-size: .9rem; }
.give-graphic-card__footer .material-symbols-rounded { color: var(--red); font-size: 1.2rem; transition: transform .25s ease; }
.give-graphic-card:hover { transform: translateY(-8px); border-color: rgba(167,27,28,.18); box-shadow: 0 26px 62px rgba(40,29,31,.12); }
.give-graphic-card:hover::before { opacity: 1; transform: translateX(100%); }
.give-graphic-card:hover .give-graphic-card__image img { transform: scale(1.05); }
.give-graphic-card:hover .give-graphic-card__footer .material-symbols-rounded { transform: translate(3px,-3px); }
.give-method-paypal .give-graphic-card__glow { background: radial-gradient(circle, rgba(27,167,167,.10), transparent 66%); }
.give-method-givebutter .give-graphic-card__glow { background: radial-gradient(circle, rgba(97,27,167,.11), transparent 66%); }
.additional-give-source-note { display: flex; gap: 8px; align-items: center; margin: 24px 0 0; color: var(--ink-soft); font-size: .74rem; }
.additional-give-source-note .material-symbols-rounded { color: var(--teal); font-size: 1.1rem; }

.donation-final-panel { color: #fff; background: linear-gradient(110deg,#181415,#26171d 52%,#42163c); }
.donation-final-grid { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 48px; align-items: center; }
.donation-final-grid h2 { max-width: 780px; color: #fff; font-size: clamp(2rem,3.5vw,3.3rem); }
.donation-final-grid p { max-width: 720px; margin-bottom: 0; color: rgba(255,255,255,.72); }
.donation-final-grid .button { justify-self: end; }

/* Social media hub page. */
.inner-page-social-media .social-media-hero {
    background-image:
        url('../images/pattern-community-voices.svg'),
        linear-gradient(135deg,#fff7f2 0%,#fff 52%,#eef9f7 100%);
    background-position: right 3% center, center;
    background-size: clamp(320px,34vw,520px) auto, auto;
    background-repeat: no-repeat;
}
.social-media-hero-image img { aspect-ratio: 1.25; object-fit: cover; }
.social-platform-section {
    background:
        radial-gradient(circle at 8% 16%, rgba(97,27,167,.07), transparent 24%),
        radial-gradient(circle at 92% 84%, rgba(27,167,167,.08), transparent 24%),
        linear-gradient(180deg,#fff 0%,#fbf8f4 100%);
}
.social-platform-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; max-width: 1080px; margin: 42px auto 0; }
.social-platform-card { position: relative; overflow: hidden; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 18px; align-items: center; min-width: 0; min-height: 155px; padding: 26px 28px; border: 1px solid rgba(77,58,61,.11); border-radius: 26px; color: var(--ink); background: rgba(255,255,255,.92); box-shadow: 0 14px 38px rgba(43,31,33,.06); text-decoration: none; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.social-platform-card::after { content: ""; position: absolute; width: 130px; height: 130px; right: -48px; top: -52px; border-radius: 50%; opacity: .08; background: var(--red); transition: transform .35s ease, opacity .35s ease; }
.social-platform-card__icon { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 19px; color: #fff; background: var(--red); box-shadow: 0 10px 26px rgba(167,27,28,.18); }
.social-platform-card__icon .material-symbols-rounded { font-size: 1.8rem; }
.social-platform-card__copy { display: grid; gap: 3px; min-width: 0; }
.social-platform-card__copy small { color: var(--red); font-family: var(--font-heading); font-size: .62rem; font-weight: 850; letter-spacing: .12em; }
.social-platform-card__copy strong { font-family: var(--font-heading); font-size: 1.18rem; }
.social-platform-card__copy span { color: var(--ink-soft); font-size: .78rem; line-height: 1.55; }
.social-platform-card__arrow { position: relative; z-index: 2; color: var(--red); transition: transform .25s ease; }
.social-platform-card:hover { transform: translateY(-7px); border-color: rgba(167,27,28,.18); box-shadow: 0 24px 54px rgba(43,31,33,.11); }
.social-platform-card:hover::after { opacity: .13; transform: scale(1.12); }
.social-platform-card:hover .social-platform-card__arrow { transform: translate(4px,-4px); }
.social-platform-instagram .social-platform-card__icon { background: var(--purple); }
.social-platform-instagram::after { background: var(--purple); }
.social-platform-instagram .social-platform-card__copy small, .social-platform-instagram .social-platform-card__arrow { color: var(--purple); }
.social-platform-tiktok .social-platform-card__icon { background: var(--teal); }
.social-platform-tiktok::after { background: var(--teal); }
.social-platform-tiktok .social-platform-card__copy small, .social-platform-tiktok .social-platform-card__arrow { color: var(--teal); }
.social-platform-youtube .social-platform-card__icon { background: var(--green); }
.social-platform-youtube::after { background: var(--green); }
.social-platform-youtube .social-platform-card__copy small, .social-platform-youtube .social-platform-card__arrow { color: #4f8d14; }
.social-share-cta { color: #fff; background: linear-gradient(120deg,#A71B1C,#72155a 60%,#351529); }
.social-share-cta__inner { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 28px; align-items: center; }
.social-share-cta__inner > .material-symbols-rounded { display: grid; place-items: center; width: 72px; height: 72px; border: 1px solid rgba(255,255,255,.18); border-radius: 24px; background: rgba(255,255,255,.10); font-size: 2.2rem; }
.social-share-cta h2 { color: #fff; }
.social-share-cta p { margin-bottom: 0; color: rgba(255,255,255,.75); }

/* Footer social layer. */
.footer-social-page-link { margin: 18px 0 0; }
.footer-social-page-link a { display: inline-flex; gap: 7px; align-items: center; color: #d7d0d2; font-family: var(--font-heading); font-size: .78rem; font-weight: 800; text-decoration: none; }
.footer-social-page-link .material-symbols-rounded { color: #9ad85f; font-size: 1rem; }
.footer-social-band { display: grid; grid-template-columns: minmax(220px,.7fr) minmax(0,1.55fr) auto; gap: 28px; align-items: center; margin-top: 38px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,.09); }
.footer-social-band__intro p { max-width: 380px; margin: 7px 0 0; color: #aaa2a4; font-size: .75rem; }
.footer-social-links { display: flex; flex-wrap: wrap; gap: 9px; }
.footer-social-link { display: inline-flex; gap: 8px; align-items: center; min-height: 42px; padding: 9px 12px; border: 1px solid rgba(255,255,255,.11); border-radius: 13px; color: #e6dfe1; background: rgba(255,255,255,.045); font-family: var(--font-heading); font-size: .72rem; font-weight: 800; text-decoration: none; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.footer-social-link > .material-symbols-rounded:first-child { color: #9ad85f; font-size: 1.05rem; }
.footer-social-external { opacity: .55; font-size: .85rem !important; }
.footer-social-link:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.09); }
.footer-social-instagram > .material-symbols-rounded:first-child { color: #b48be0; }
.footer-social-tiktok > .material-symbols-rounded:first-child { color: #61d2d2; }
.footer-social-youtube > .material-symbols-rounded:first-child { color: #f07f80; }
.footer-social-all { display: inline-flex; gap: 7px; align-items: center; justify-content: flex-end; color: #fff; font-family: var(--font-heading); font-size: .75rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.footer-social-all .material-symbols-rounded { font-size: 1rem; transition: transform .2s ease; }
.footer-social-all:hover .material-symbols-rounded { transform: translateX(4px); }

@media (max-width: 1050px) {
    .donate-photo-card-top { left: -14px; }
    .donate-photo-card-bottom { right: -14px; }
    .additional-give-intro { grid-template-columns: 1fr; gap: 14px; }
    .footer-social-band { grid-template-columns: 1fr; gap: 18px; }
    .footer-social-all { justify-content: flex-start; }
}

@media (max-width: 840px) {
    .donate-hero-v114 .donate-hero-grid { min-height: auto; }
    .donate-photo-frame { width: min(560px,92%); }
    .donate-photo-frame > img { height: 520px; min-height: 0; }
    .donation-choice-grid, .give-graphic-grid, .social-platform-grid { grid-template-columns: 1fr; }
    .donation-final-grid, .social-share-cta__inner { grid-template-columns: 1fr; }
    .donation-final-grid .button { justify-self: start; }
    .social-share-cta__inner > .material-symbols-rounded { width: 60px; height: 60px; }
}

@media (max-width: 620px) {
    .donate-hero-actions { justify-content: center; }
    .donate-trust-chips { justify-content: center; }
    .donate-photo-frame { width: min(420px,94%); padding: 9px 9px 0; border-radius: 180px 180px 24px 24px; }
    .donate-photo-frame > img { height: 410px; border-radius: 170px 170px 18px 18px; }
    .donate-photo-card { max-width: 180px; padding: 10px 11px; }
    .donate-photo-card-top { top: 14%; left: -6px; }
    .donate-photo-card-bottom { right: -6px; bottom: 8%; }
    .donation-visual-story { min-height: 560px; border-radius: 26px; }
    .donation-visual-story__content { padding: 24px; }
    .donation-choice-card { min-height: 0; padding: 28px; border-radius: 24px; }
    .give-graphic-card { grid-template-rows: minmax(200px,auto) auto; border-radius: 23px; }
    .give-graphic-card__image { padding: 28px; }
    .social-platform-card { grid-template-columns: auto minmax(0,1fr); padding: 22px; }
    .social-platform-card__arrow { display: none; }
    .footer-social-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .footer-social-link { min-width: 0; }
}

@media (max-width: 390px) {
    .donate-photo-card { position: static; max-width: none; margin: 9px 0 0; animation: none; }
    .donate-photo-frame { padding-bottom: 9px; border-radius: 32px; }
    .donate-photo-frame > img { height: 360px; border-radius: 24px; }
    .footer-social-links { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .donate-photo-card, .donate-orbit { animation: none !important; }
    .give-graphic-card, .give-graphic-card__image img, .social-platform-card { transition: none !important; }
}

@media (prefers-contrast: more) {
    .donation-story-section, .donation-give-section, .additional-give-section,
    .inner-page-social-media .social-media-hero, .social-platform-section { background-image: none; }
}

/* =========================================================
   v1.16 — donation contrast + live social feed hub
   ========================================================= */

/* Explicit high-contrast palette for the donation closing message. */
.donation-final-panel,
.donation-final-panel .donation-final-grid {
    color: #fff;
}
.donation-final-panel .eyebrow,
.donation-final-panel .eyebrow-light {
    color: #9bdc61 !important;
    text-shadow: 0 1px 12px rgba(97,167,27,.16);
}
.donation-final-panel .donation-final-grid h2 {
    color: #fff !important;
    text-shadow: 0 2px 20px rgba(0,0,0,.14);
}
.donation-final-panel .donation-final-grid p {
    color: #f2e9eb !important;
}
.donation-final-panel .button-white {
    color: #391827;
    background: #fff;
}

/* Social hub — each network receives its own content-aware visual section. */
.social-hero-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 24px;
}
.social-hero-chips a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 7px 11px;
    border: 1px solid rgba(65,45,49,.10);
    border-radius: 999px;
    color: var(--ink);
    background: rgba(255,255,255,.72);
    box-shadow: 0 8px 20px rgba(43,31,33,.05);
    font-family: var(--font-heading);
    font-size: .7rem;
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.social-hero-chips a:hover {
    transform: translateY(-2px);
    border-color: rgba(167,27,28,.18);
    box-shadow: 0 12px 26px rgba(43,31,33,.08);
}
.social-hero-chips .material-symbols-rounded { color: var(--red); font-size: 1rem; }

.social-feed-section {
    position: relative;
    overflow: clip;
    isolation: isolate;
}
.social-feed-section::before,
.social-feed-section::after {
    content: "";
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    pointer-events: none;
}
.social-feed-section::before { width: 330px; height: 330px; top: -170px; right: -120px; opacity: .55; }
.social-feed-section::after { width: 250px; height: 250px; bottom: -130px; left: -90px; opacity: .38; }
.social-feed-grid {
    display: grid;
    grid-template-columns: minmax(280px,.78fr) minmax(0,1.22fr);
    gap: clamp(38px,6vw,86px);
    align-items: center;
}
.social-feed-grid-reverse .social-feed-copy { order: 2; }
.social-feed-grid-reverse .social-feed-frame { order: 1; }
.social-feed-copy { min-width: 0; }
.social-feed-copy h2 {
    max-width: 680px;
    margin-top: 15px;
    font-size: clamp(2.05rem,3.8vw,3.9rem);
}
.social-feed-copy p { max-width: 620px; color: var(--ink-soft); }
.social-feed-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border-radius: 999px;
    font-family: var(--font-heading);
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .11em;
    background: #fff;
    box-shadow: 0 8px 24px rgba(42,29,31,.07);
}
.social-feed-badge .material-symbols-rounded { font-size: 1.05rem; }

.social-feed-frame {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 12px;
    border: 1px solid rgba(66,48,51,.11);
    border-radius: 30px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 24px 68px rgba(43,31,33,.11);
}
.social-feed-frame__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 48px;
    padding: 4px 9px 10px;
    color: var(--ink);
    font-family: var(--font-heading);
    font-size: .75rem;
    font-weight: 800;
}
.social-live-dot {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #4d3a3d;
    font-size: .64rem;
    white-space: nowrap;
}
.social-live-dot::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--green);
    box-shadow: 0 0 0 5px rgba(97,167,27,.10);
}
.social-feed-frame iframe {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    border: 0;
    border-radius: 20px;
    background: #fff;
}
.social-feed-frame-facebook iframe { min-height: 680px; }
.social-feed-frame-instagram iframe { min-height: 680px; }
.social-feed-fallback {
    margin: 11px 5px 3px;
    color: var(--ink-soft);
    font-size: .7rem;
    line-height: 1.5;
}
.social-feed-fallback a { color: var(--red); font-weight: 800; }
.social-youtube-player { position: relative; overflow: hidden; aspect-ratio: 16/9; border-radius: 20px; background: #181415; }
.social-youtube-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; }
.tiktok-creator-wrap { width: 100%; min-width: 0; overflow: hidden; border-radius: 20px; background: #fff; }
.tiktok-creator-wrap .tiktok-embed {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 auto !important;
}
.tiktok-creator-wrap iframe { max-width: 100% !important; min-width: 0 !important; }

.social-feed-facebook {
    background:
        url('../images/pattern-community-voices.svg') right -80px bottom -40px / min(520px,40vw) auto no-repeat,
        linear-gradient(135deg,#f6fbff 0%,#fff 48%,#f4f8ff 100%);
}
.social-feed-facebook::before { background: rgba(24,119,242,.11); }
.social-feed-facebook::after { background: rgba(27,167,167,.10); }
.social-feed-facebook .social-feed-badge { color: #1769c2; }
.social-feed-facebook .social-feed-badge .material-symbols-rounded { color: #1877f2; }

.social-feed-instagram {
    background:
        radial-gradient(circle at 92% 10%,rgba(97,27,167,.08),transparent 26%),
        url('../images/pattern-mission-love.svg') left -60px center / min(470px,38vw) auto no-repeat,
        linear-gradient(140deg,#fff8fb 0%,#fff 50%,#f8f2ff 100%);
}
.social-feed-instagram::before { background: rgba(97,27,167,.12); }
.social-feed-instagram::after { background: rgba(167,27,28,.08); }
.social-feed-instagram .social-feed-badge { color: var(--purple); }
.social-feed-instagram .social-feed-badge .material-symbols-rounded { color: var(--purple); }

.social-feed-tiktok {
    color: #fff;
    background:
        radial-gradient(circle at 12% 18%,rgba(27,167,167,.18),transparent 25%),
        radial-gradient(circle at 88% 82%,rgba(167,27,28,.17),transparent 27%),
        #1D1819;
}
.social-feed-tiktok::before { background: rgba(27,167,167,.10); }
.social-feed-tiktok::after { background: rgba(167,27,28,.11); }
.social-feed-tiktok .social-feed-copy h2 { color: #fff; }
.social-feed-tiktok .social-feed-copy p { color: #d8ced0; }
.social-feed-tiktok .social-feed-badge { color: #dff; background: rgba(255,255,255,.08); box-shadow: none; }
.social-feed-tiktok .social-feed-badge .material-symbols-rounded { color: #5fd7d7; }
.social-feed-tiktok .social-feed-frame { border-color: rgba(255,255,255,.10); background: rgba(255,255,255,.97); box-shadow: 0 24px 72px rgba(0,0,0,.25); }
.social-feed-tiktok .button-white-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 50px;
    padding: 12px 20px;
    border: 1px solid rgba(255,255,255,.34);
    border-radius: 999px;
    color: #fff;
    font-family: var(--font-heading);
    font-weight: 800;
    text-decoration: none;
    background: rgba(255,255,255,.06);
    transition: transform .2s ease, background .2s ease;
}
.social-feed-tiktok .button-white-outline:hover { transform: translateY(-2px); background: rgba(255,255,255,.12); }

.social-feed-youtube {
    background:
        url('../images/pattern-pet-care.svg') right -80px center / min(500px,40vw) auto no-repeat,
        linear-gradient(135deg,#fff8f8 0%,#fff 52%,#f8fbf2 100%);
}
.social-feed-youtube::before { background: rgba(167,27,28,.10); }
.social-feed-youtube::after { background: rgba(97,167,27,.10); }
.social-feed-youtube .social-feed-badge { color: var(--red); }
.social-feed-youtube .social-feed-badge .material-symbols-rounded { color: var(--red); }

@media (max-width: 920px) {
    .social-feed-grid { grid-template-columns: 1fr; gap: 30px; }
    .social-feed-grid-reverse .social-feed-copy,
    .social-feed-grid-reverse .social-feed-frame { order: initial; }
    .social-feed-copy { max-width: 760px; }
    .social-feed-frame { max-width: 720px; }
}

@media (max-width: 620px) {
    .social-hero-chips { justify-content: center; }
    .social-feed-section { overflow: hidden; }
    .social-feed-frame { padding: 8px; border-radius: 22px; }
    .social-feed-frame iframe { border-radius: 15px; }
    .social-feed-frame-facebook iframe,
    .social-feed-frame-instagram iframe { min-height: 600px; }
    .social-feed-frame__top { min-height: 44px; padding-inline: 7px; }
    .social-feed-copy h2 { font-size: clamp(2rem,10.5vw,3rem); }
}

@media (max-width: 390px) {
    .social-hero-chips { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .social-hero-chips a { justify-content: center; min-width: 0; }
    .social-feed-frame-facebook iframe,
    .social-feed-frame-instagram iframe { min-height: 560px; }
}

@media (prefers-reduced-motion: reduce) {
    .social-hero-chips a { transition: none !important; }
}

@media (prefers-contrast: more) {
    .social-feed-facebook,
    .social-feed-instagram,
    .social-feed-youtube { background-image: none; }
    .donation-final-panel .donation-final-grid p { color: #fff !important; }
}

/* =========================================================
   v1.17 — donation red CTA + social page contrast correction
   ========================================================= */

/* Match the established solid-red CTA treatment used elsewhere on the site. */
.inner-page-donate .donation-final-panel {
    color: #fff;
    background: var(--red);
}
.inner-page-donate .donation-final-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .16;
    background:
        radial-gradient(circle at 12% 18%, rgba(255,255,255,.34), transparent 24%),
        radial-gradient(circle at 88% 82%, rgba(97,167,27,.28), transparent 22%),
        url('../images/pattern-mission-love.svg') right -70px center / min(470px,38vw) auto no-repeat;
}
.inner-page-donate .donation-final-panel .donation-final-grid {
    position: relative;
    z-index: 1;
    color: #fff;
}
.inner-page-donate .donation-final-panel .eyebrow,
.inner-page-donate .donation-final-panel .eyebrow-light {
    color: #fff !important;
    text-shadow: none;
}
.inner-page-donate .donation-final-panel .eyebrow::before,
.inner-page-donate .donation-final-panel .eyebrow-light::before {
    background: #fff;
}
.inner-page-donate .donation-final-panel h2 {
    color: #fff !important;
}
.inner-page-donate .donation-final-panel p {
    color: #fff7f3 !important;
}
.inner-page-donate .donation-final-panel .button-white {
    color: var(--red-dark) !important;
    background: #fff !important;
    border-color: #fff !important;
}
.inner-page-donate .donation-final-panel .button-white:hover {
    color: var(--red-dark) !important;
    background: #fff8f1 !important;
}

/* Social page: force readable theme colors on every light surface. */
.inner-page-social-media {
    color: var(--ink);
}
.inner-page-social-media .social-media-hero .inner-hero-content,
.inner-page-social-media .social-media-hero .inner-hero-content h1,
.inner-page-social-media .social-media-hero .inner-hero-content h2,
.inner-page-social-media .social-media-hero .inner-hero-content h3 {
    color: var(--ink) !important;
}
.inner-page-social-media .social-media-hero .inner-hero-content > p {
    color: var(--ink-soft) !important;
}
.inner-page-social-media .social-media-hero .eyebrow {
    color: var(--red) !important;
}

.inner-page-social-media .social-platform-section,
.inner-page-social-media .social-feed-facebook,
.inner-page-social-media .social-feed-instagram,
.inner-page-social-media .social-feed-youtube {
    color: var(--ink) !important;
}
.inner-page-social-media .social-platform-section .section-heading h2,
.inner-page-social-media .social-feed-facebook .social-feed-copy h2,
.inner-page-social-media .social-feed-instagram .social-feed-copy h2,
.inner-page-social-media .social-feed-youtube .social-feed-copy h2 {
    color: var(--ink) !important;
}
.inner-page-social-media .social-platform-section .section-heading > p,
.inner-page-social-media .social-feed-facebook .social-feed-copy p,
.inner-page-social-media .social-feed-instagram .social-feed-copy p,
.inner-page-social-media .social-feed-youtube .social-feed-copy p {
    color: #4a4143 !important;
}

.inner-page-social-media .social-platform-card {
    color: var(--ink) !important;
    background: rgba(255,255,255,.98) !important;
}
.inner-page-social-media .social-platform-card__copy strong {
    color: var(--ink) !important;
}
.inner-page-social-media .social-platform-card__copy span {
    color: #51484a !important;
}
.inner-page-social-media .social-feed-frame,
.inner-page-social-media .social-feed-frame__top {
    color: var(--ink) !important;
}
.inner-page-social-media .social-feed-fallback {
    color: #51484a !important;
}
.inner-page-social-media .social-feed-fallback a {
    color: var(--red) !important;
}

/* TikTok intentionally remains a dark section, with explicit high contrast. */
.inner-page-social-media .social-feed-tiktok,
.inner-page-social-media .social-feed-tiktok .social-feed-copy {
    color: #fff !important;
}
.inner-page-social-media .social-feed-tiktok .social-feed-copy h2 {
    color: #fff !important;
}
.inner-page-social-media .social-feed-tiktok .social-feed-copy p {
    color: #f2e9eb !important;
}
.inner-page-social-media .social-feed-tiktok .social-feed-badge {
    color: #fff !important;
}
.inner-page-social-media .social-feed-tiktok .social-feed-frame,
.inner-page-social-media .social-feed-tiktok .social-feed-frame__top {
    color: var(--ink) !important;
}
.inner-page-social-media .social-share-cta,
.inner-page-social-media .social-share-cta h2 {
    color: #fff !important;
}
.inner-page-social-media .social-share-cta p {
    color: #fff5f6 !important;
}
.inner-page-social-media .social-share-cta .eyebrow-light {
    color: #fff !important;
}

@media (max-width: 620px) {
    .inner-page-donate .donation-final-panel::before {
        opacity: .10;
        background-size: 250px auto;
        background-position: right -80px bottom -20px;
    }
}

/* =========================================================
   v1.18 — specificity correction for contextual inner pages
   ========================================================= */
/* The generic `.inner-page > .section:nth-of-type(...)` surface rules carry
   higher specificity than the older page-specific section classes. These
   selectors intentionally match/exceed that specificity. */
.inner-page.inner-page-donate > section.section.donation-final-panel {
    color: #fff;
    background: #A71B1C;
}
.inner-page.inner-page-social-media > section.section.social-feed-tiktok {
    color: #fff;
    background: linear-gradient(135deg,#1D1819,#272123 55%,#151213);
}