/* ============================================================
   Cabavet · Veterinaria Equina — Global Stylesheet
   ============================================================ */

/* ── Reset & base ─────────────────────────────────────────── */
* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background: #fbfaf7;
    font-family: 'Hanken Grotesk', sans-serif;
    color: #2a2e2b;
}

a {
    text-decoration: none;
    color: inherit;
}

button {
    font-family: inherit;
    border: none;
    background: none;
    cursor: pointer;
    padding: 0;
}

img {
    max-width: 100%;
    display: block;
}

::selection {
    background: #2a6344;
    color: #fff;
}

:focus-visible {
    outline: 2px solid #2a6344;
    outline-offset: 3px;
}

/* ── RTE typography ───────────────────────────────────────── */
.cab-rte h2 {
    font: 600 clamp(24px, 3vw, 34px) / 1.1 'Hanken Grotesk', sans-serif;
    letter-spacing: -0.02em;
    color: #2a2e2b;
    margin: 40px 0 16px;
}

.cab-rte h3 {
    font: 600 19px / 1.2 'Hanken Grotesk', sans-serif;
    color: #2a2e2b;
    margin: 32px 0 12px;
}

.cab-rte p {
    font: 300 17px / 1.85 'Hanken Grotesk', sans-serif;
    color: #3c423d;
    margin: 0 0 20px;
}

.cab-rte ul,
.cab-rte ol {
    font: 300 16px / 1.8 'Hanken Grotesk', sans-serif;
    color: #3c423d;
    padding-left: 24px;
    margin: 0 0 20px;
}

.cab-rte li {
    margin-bottom: 6px;
}

.cab-rte a {
    color: #2a6344;
    text-decoration: underline;
}

.cab-rte strong {
    font-weight: 600;
}

.cab-rte blockquote {
    border-left: 3px solid #2a6344;
    margin: 32px 0;
    padding: 16px 24px;
    font: 500 18px / 1.6 'Hanken Grotesk', sans-serif;
    color: #2a2e2b;
}

.cab-rte img {
    border-radius: 10px;
    width: 100%;
    height: auto;
    margin: 8px 0;
}

/* ── Layout grid helpers ──────────────────────────────────── */
.cab-r-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
}

.cab-r-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.cab-r-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 36px;
}

.cab-footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 48px;
}

/* ── Nav & hover states ───────────────────────────────────── */
.cab-nav-link:hover {
    opacity: .55;
}

.cab-util-link:hover {
    opacity: .75;
}

.cab-cta-btn:hover {
    background: #2a6344 !important;
}

.cab-mob-link:hover {
    background: #f2f1ea;
}

/* ── Service card image zoom ──────────────────────────────── */
.cab-svc-img-wrap img {
    transition: transform .5s ease;
}

.cab-svc-card:hover .cab-svc-img-wrap img {
    transform: scale(1.04);
}

/* ── Mobile nav panel ─────────────────────────────────────── */
.cab-mobnav {
    display: none;
    flex-direction: column;
    background: #fbfaf7;
    border-top: 1px solid #e5e4dc;
    padding: 16px 0 24px;
}

.cab-mobnav.is-open {
    display: flex;
}

.cab-mob-link {
    padding: 14px 28px;
    font: 500 15px / 1 'Hanken Grotesk', sans-serif;
    color: #2a2e2b;
    letter-spacing: .03em;
    border-bottom: 1px solid #e5e4dc;
}

.cab-mob-cta {
    margin: 16px 28px 0;
    padding: 14px 20px;
    background: #2a6344;
    color: #fbfaf7;
    font: 600 14px / 1 'Hanken Grotesk', sans-serif;
    letter-spacing: .06em;
    border-radius: 6px;
    text-align: center;
}

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 880px) {
    .cab-util-bar {
        display: none !important;
    }

    .cab-desktop-nav {
        display: none !important;
    }

    .cab-menu-btn {
        display: flex !important;
    }

    .cab-r-2 {
        grid-template-columns: 1fr !important;
        gap: 32px !important;
    }

    .cab-r-cards {
        grid-template-columns: 1fr 1fr !important;
    }

    .cab-footer-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 32px !important;
    }

    .cab-nav-wrap {
        padding: 14px 24px !important;
    }

    .cab-page-pad {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}

@media (max-width: 560px) {
    .cab-r-cards {
        grid-template-columns: 1fr !important;
    }

    .cab-footer-grid {
        grid-template-columns: 1fr !important;
    }
}