/*
 * Carnivellos CMS — Pinned Packages
 * A bold small-business theme based on the supplied navy hero and pinned notes.
 */

:root {
    --color-text: #252525;
    --color-muted: #657184;
    --color-bg: #f5f6f8;
    --color-accent: #2684ff;
    --color-border: #dce2ea;
    --font-body: Arial, Helvetica, sans-serif;
    --font-heading: Arial, Helvetica, sans-serif;
    --max-width: 1180px;
    --heading-color: #081a2f;
    --heading-weight: 800;
    --header-bg: #081a2f;
    --header-text: #ffffff;
    --header-accent: #63a7ff;
    --footer-bg: #061322;
    --footer-text: #d9e4f2;
    --sidebar-bg: #ffffff;
    --sidebar-text: #252525;
    --navy: #081a2f;
    --blue: #2684ff;
    --white: #ffffff;
    --bronze: #f1c27d;
    --silver: #e4e7eb;
    --gold: #ffe36e;
    --paper: #fffdf7;
    --shadow: 0 18px 42px rgba(8, 26, 47, .14);
}

html { scroll-behavior: smooth; }
body { background: var(--color-bg); }
a { color: #1469d4; }
a:hover { color: #064b9e; }

.wrap { width: min(var(--max-width), calc(100% - 40px)); }

/* Header */
.site-header {
    background: rgba(8, 26, 47, .98);
    border-bottom: 1px solid rgba(255,255,255,.1);
    box-shadow: 0 10px 30px rgba(0,0,0,.13);
}
.site-header > .wrap { min-height: 82px; }
.site-title {
    color: #fff;
    font-size: clamp(1.25rem, 2vw, 1.65rem);
    font-weight: 900;
    letter-spacing: -.025em;
}
.site-title:hover { color: #fff; }
.site-logo-icon { max-height: 46px; }
.site-nav a {
    color: #dce9f8;
    border-radius: 8px;
    font-weight: 700;
}
.site-nav a:hover,
.site-nav a.active {
    color: #fff;
    background: rgba(38,132,255,.2);
}
.site-search-form input {
    border-color: rgba(255,255,255,.22);
    background: rgba(255,255,255,.1);
    color: #fff;
}
.site-search-form input::placeholder { color: #c5d1df; }
.site-search-form button { background: var(--blue); }
.nav-toggle { color: #fff; }

.site-banner { background: var(--navy); }
.site-banner img { max-width: 1180px; }
.site-banner-full { background: var(--navy); }
.site-nav-bar { background: #061322; border: 0; }
.site-nav-bar .site-nav a { color: #dce9f8; }

/* Main layout */
.site-main {
    padding-top: 58px;
    padding-bottom: 74px;
}
.site-main > .page,
.site-main > .post,
.site-main > .archive-shell,
.site-main > .search-shell,
.layout-content > .page,
.layout-content > .post,
.layout-content > .archive-shell,
.layout-content > .search-shell {
    background: #fff;
    border: 1px solid #e5eaf0;
    border-radius: 4px 4px 18px 4px;
    box-shadow: var(--shadow);
}
.page,
.post { padding: clamp(28px, 5vw, 58px); }
.page > h1,
.post > h1,
.archive-heading,
.section-title {
    position: relative;
    margin-top: 0;
    padding-bottom: 18px;
    font-size: clamp(2.15rem, 5vw, 4rem);
    line-height: 1.03;
    letter-spacing: -.045em;
}
.page > h1::after,
.post > h1::after,
.archive-heading::after,
.section-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 74px;
    height: 5px;
    border-radius: 999px;
    background: var(--blue);
}
.content { font-size: 1.05rem; line-height: 1.75; }
.content h2, .content h3 { color: var(--navy); }
.content h2 { margin-top: 2em; font-size: clamp(1.6rem, 3vw, 2.25rem); }
.content img { border-radius: 12px; box-shadow: 0 12px 28px rgba(8,26,47,.12); }
.content blockquote {
    margin: 2rem 0;
    padding: 1.25rem 1.5rem;
    border-left: 5px solid var(--blue);
    background: #eef5ff;
    color: #31445b;
}
.content table { border-radius: 10px; overflow: hidden; box-shadow: 0 8px 22px rgba(8,26,47,.08); }
.content th { background: var(--navy); color: #fff; }

/* Homepage hero and price notes */
.home-stage {
    margin-top: 0;
    margin-bottom: -74px;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}
.packages-hero {
    position: relative;
    overflow: hidden;
    padding: 78px 24px 54px;
    background: linear-gradient(180deg, var(--navy) 0, var(--navy) 47%, #f5f6f8 47%);
}
.hero-content {
    max-width: 920px;
    margin: 0 auto 64px;
    text-align: center;
    color: var(--white);
}
.eyebrow {
    margin: 0 0 12px;
    color: #63a7ff;
    font-size: 1.08rem;
    font-weight: 800;
    letter-spacing: .075em;
    text-transform: uppercase;
}
.hero-content h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2.75rem, 6vw, 5.2rem);
    line-height: .98;
    letter-spacing: -.055em;
}
.hero-content h1 span { display: block; color: var(--blue); }
.hero-intro {
    max-width: 720px;
    margin: 24px auto 0;
    color: #dce7f3;
    font-size: 1.15rem;
    line-height: 1.65;
}
.hero-benefits {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px 30px;
    margin-top: 28px;
    font-weight: 800;
}
.hero-benefits span::before {
    content: "✓";
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    border: 2px solid currentColor;
    border-radius: 50%;
    font-size: .8rem;
}
.package-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 34px;
    width: min(1180px, 100%);
    margin: 0 auto;
    align-items: stretch;
}
.package-note {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 600px;
    padding: 54px 34px 34px;
    color: #252525;
    border-radius: 3px 3px 16px 3px;
    box-shadow: 0 22px 35px rgba(0,0,0,.22), 0 6px 12px rgba(0,0,0,.14);
    transform-origin: center top;
    transition: transform .25s ease, box-shadow .25s ease;
}
.package-note::after,
.site-main > .page::after,
.site-main > .post::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 45px;
    height: 45px;
    background: linear-gradient(135deg, rgba(255,255,255,.5) 0 49%, rgba(0,0,0,.1) 50% 100%);
    border-radius: 10px 0 16px 0;
    pointer-events: none;
}
.site-main > .page,
.site-main > .post { position: relative; }
.package-note:hover { z-index: 2; transform: translateY(-10px) rotate(0deg); }
.package-note.bronze { background: linear-gradient(rgba(255,255,255,.12),rgba(0,0,0,.02)),var(--bronze); transform: rotate(-1.4deg); }
.package-note.silver { background: linear-gradient(rgba(255,255,255,.4),rgba(0,0,0,.03)),var(--silver); transform: translateY(8px) rotate(.7deg); }
.package-note.gold { background: linear-gradient(rgba(255,255,255,.16),rgba(0,0,0,.03)),var(--gold); transform: rotate(-.6deg); }
.pin {
    position: absolute;
    top: -15px;
    left: 50%;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    transform: translateX(-50%);
    background: radial-gradient(circle at 35% 30%,#fff 0,#a6a6a6 18%,#565656 70%);
    box-shadow: 0 5px 7px rgba(0,0,0,.35), inset 0 -3px 4px rgba(0,0,0,.25);
}
.bronze .pin { background: radial-gradient(circle at 35% 30%,#ffd19a 0,#b36b2c 35%,#64320e 75%); }
.gold .pin { background: radial-gradient(circle at 35% 30%,#fff6a0 0,#e0a800 35%,#856000 75%); }
.package-note h2 {
    margin: 0;
    text-align: center;
    font-family: "Comic Sans MS", "Segoe Print", cursive;
    font-size: 2.7rem;
}
.package-description { min-height: 76px; margin: 10px 0 20px; padding-bottom: 18px; border-bottom: 3px solid rgba(0,0,0,.35); text-align: center; line-height: 1.45; }
.price { display: flex; align-items: baseline; gap: 8px; }
.price strong { font-size: 3rem; line-height: 1; }
.price span { font-size: .85rem; font-weight: 800; text-transform: uppercase; }
.monthly-price { margin: 12px 0 18px; padding-bottom: 14px; border-bottom: 1px solid rgba(0,0,0,.35); font-size: 1.65rem; font-weight: 800; }
.monthly-price span { font-size: .9rem; font-weight: 500; }
.package-note ul { display: grid; gap: 11px; margin: 0 0 28px; padding: 0; list-style: none; }
.package-note li { position: relative; padding-left: 28px; line-height: 1.35; }
.package-note li::before { content: "✓"; position: absolute; top: 1px; left: 0; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; color: #fff; background: rgba(0,0,0,.55); font-size: .75rem; font-weight: 900; }
.package-button,
.content .button,
.content a.button {
    display: inline-block;
    align-self: center;
    padding: 13px 28px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: #202020;
    box-shadow: 0 5px 0 rgba(0,0,0,.18);
    font-weight: 800;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}
.package-button { margin-top: auto; font-family: "Comic Sans MS", "Segoe Print", cursive; font-size: 1.15rem; }
.package-button:hover, .content a.button:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 7px 0 rgba(0,0,0,.18); }
.popular-label { position: absolute; top: 18px; right: -12px; padding: 8px 18px; color: #fff; background: var(--blue); box-shadow: 0 5px 10px rgba(0,0,0,.22); font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; transform: rotate(5deg); }
.package-footer { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px 38px; width: min(1100px,100%); margin: 55px auto 0; padding-top: 25px; border-top: 1px solid #d1d1d1; font-weight: 800; }
.package-footer span::before { content: "✓"; margin-right: 7px; color: var(--blue); }

/* Inner-page navy title band */
.inner-hero {
    margin: 0 calc(50% - 50vw) 48px;
    padding: 68px max(24px, calc((100vw - 1180px)/2));
    color: #fff;
    background: var(--navy);
}
.inner-hero .eyebrow { text-align: left; }
.inner-hero h1 { max-width: 900px; margin: 0; color: #fff; font-size: clamp(2.5rem,6vw,4.8rem); line-height: 1; letter-spacing: -.05em; }
.inner-hero p { max-width: 720px; margin: 18px 0 0; color: #dce7f3; font-size: 1.1rem; }

/* Blog/search cards */
.archive-shell, .search-shell { padding: clamp(28px,5vw,54px); }
.post-summary {
    position: relative;
    margin: 26px 0;
    padding: 28px 30px;
    border: 1px solid #dde4ed;
    border-radius: 3px 3px 14px 3px;
    background: var(--paper);
    box-shadow: 0 10px 25px rgba(8,26,47,.08);
}
.post-summary:nth-of-type(3n+1) { border-top: 6px solid var(--bronze); }
.post-summary:nth-of-type(3n+2) { border-top: 6px solid #c7cdd5; }
.post-summary:nth-of-type(3n) { border-top: 6px solid var(--gold); }
.post-summary h2 { margin-top: 0; }
.post-summary h2 a { color: var(--navy); text-decoration: none; }
.post-summary h2 a:hover { color: var(--blue); }
.post-meta { color: var(--color-muted); font-size: .92rem; font-weight: 700; }
.post-categories a { display: inline-block; margin: 0 5px 5px 0; padding: 4px 10px; border-radius: 999px; background: #eaf3ff; color: #155fae; font-size: .82rem; font-weight: 700; text-decoration: none; }
.pagination { padding-top: 24px; border-top: 1px solid #e2e7ed; }
.pagination a { padding: 9px 14px; border-radius: 7px; background: var(--navy); color: #fff; text-decoration: none; }

/* Forms */
.content input, .content textarea, .content select,
.site-search-form-large input {
    border: 1px solid #ccd5e0;
    border-radius: 8px;
    background: #fff;
}
.content input:focus, .content textarea:focus, .content select:focus,
.site-search-form-large input:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(38,132,255,.13); outline: 0; }
.content button, .site-search-form-large button { border-radius: 8px; background: var(--blue); font-weight: 800; }

/* Sidebar */
.layout { gap: 34px; }
.layout-sidebar { min-width: 0; }
.sidebar-widget {
    margin-bottom: 24px;
    padding: 24px;
    border: 1px solid #dfe5ec;
    border-radius: 3px 3px 14px 3px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(8,26,47,.08);
}
.sidebar-widget h3 { margin-top: 0; padding-bottom: 10px; border-bottom: 3px solid var(--blue); color: var(--navy); }
.sidebar-widget ul { padding-left: 0; list-style: none; }
.sidebar-widget li { padding: 7px 0; border-bottom: 1px solid #edf0f4; }
.sidebar-widget a { text-decoration: none; font-weight: 700; }

/* Footer */
.site-footer { padding: 44px 0; background: var(--footer-bg); color: var(--footer-text); border: 0; }
.site-footer a { color: #8fc0ff; }
.site-footer .wrap { display: flex; justify-content: space-between; align-items: flex-end; gap: 25px; flex-wrap: wrap; }
.site-footer p { margin: 0; }

/* Utility components for CMS page content */
.feature-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; }
.feature-item { border: 1px solid #dfe5ec; border-top: 6px solid var(--blue); border-radius: 4px 4px 14px 4px; background: #fff; box-shadow: 0 10px 25px rgba(8,26,47,.08); }
.feature-icon { color: var(--blue); }
.hero { border-radius: 4px 4px 18px 4px; overflow: hidden; }
.hero-content .hero-title { color: #fff; }
.faq-item { border: 1px solid #dfe5ec; border-radius: 10px; background: #fff; }
.faq-item summary { color: var(--navy); font-weight: 800; }

/* 404 and maintenance */
.error-page { text-align: center; }
.error-code { margin: 0; color: var(--blue); font-size: clamp(5rem,18vw,11rem); font-weight: 900; line-height: .85; letter-spacing: -.08em; }
.maintenance-page { background: linear-gradient(145deg,#061322,#0d2d50); }
.maintenance-box { max-width: 720px; border-radius: 4px 4px 20px 4px; box-shadow: 0 28px 70px rgba(0,0,0,.35); }
.maintenance-box h1 { color: var(--navy); }

@media (max-width: 950px) {
    .packages-hero { background: linear-gradient(180deg,var(--navy) 0,var(--navy) 28%,#f5f6f8 28%); }
    .package-grid { grid-template-columns: 1fr; max-width: 620px; }
    .package-note, .package-note.bronze, .package-note.silver, .package-note.gold { min-height: auto; transform: none; }
    .feature-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
    .wrap { width: min(100% - 28px, var(--max-width)); }
    .site-header > .wrap { min-height: 72px; }
    .site-nav { background: #061322; border-top: 1px solid rgba(255,255,255,.12); }
    .site-nav a { border-radius: 0; }
    .site-main { padding-top: 38px; padding-bottom: 48px; }
    .home-stage { margin-top: 0; margin-bottom: -48px; }
    .inner-hero { margin-top: 0; }
    .page, .post, .archive-shell, .search-shell { padding: 26px 22px; }
    .feature-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .packages-hero { padding: 54px 15px 36px; background: linear-gradient(180deg,var(--navy) 0,var(--navy) 23%,#f5f6f8 23%); }
    .hero-content { margin-bottom: 48px; }
    .hero-content h1 { font-size: 2.7rem; }
    .hero-intro { font-size: 1rem; }
    .hero-benefits { align-items: center; flex-direction: column; gap: 12px; }
    .package-note { padding: 50px 24px 30px; }
    .package-note h2 { font-size: 2.3rem; }
    .price strong { font-size: 2.5rem; }
    .popular-label { right: -5px; }
    .package-footer { align-items: flex-start; flex-direction: column; }
    .inner-hero { padding-top: 48px; padding-bottom: 48px; }
    .site-footer .wrap { align-items: flex-start; flex-direction: column; }
}

/* ==========================================================
   Explicit inner-page system
   These selectors intentionally avoid reliance on generic CMS classes.
   ========================================================== */
.business-page-shell {
    margin-top: 0;
    margin-bottom: -20px;
}
.business-page-hero {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 72px max(24px, calc((100vw - 1180px) / 2)) 116px;
    color: #fff;
    background:
        radial-gradient(circle at 85% 25%, rgba(38,132,255,.18), transparent 28%),
        linear-gradient(145deg, #061322, #0a2340 65%, #0d3158);
}
.business-page-hero-inner { max-width: 920px; }
.business-kicker {
    margin: 0 0 12px;
    color: #63a7ff;
    font-size: 1rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.business-page-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(2.7rem, 6vw, 5rem);
    font-weight: 900;
    line-height: .98;
    letter-spacing: -.055em;
}
.business-hero-meta {
    margin: 22px 0 0;
    color: #dce7f3;
    font-weight: 700;
}
.business-paper {
    position: relative;
    z-index: 2;
    width: min(1040px, calc(100% - 32px));
    margin: -64px auto 0;
    padding: clamp(32px, 5vw, 64px);
    overflow: hidden;
    border: 1px solid rgba(8,26,47,.1);
    border-radius: 4px 4px 20px 4px;
    background: linear-gradient(180deg, #fffef9, #fffdf7);
    box-shadow: 0 24px 55px rgba(8,26,47,.2);
}
.business-paper::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 54px;
    height: 54px;
    background: linear-gradient(135deg, rgba(255,255,255,.4) 0 49%, rgba(8,26,47,.12) 50% 100%);
    border-radius: 12px 0 20px 0;
    pointer-events: none;
}
.business-pin {
    position: absolute;
    top: 18px;
    left: 50%;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    transform: translateX(-50%);
    background: radial-gradient(circle at 35% 30%, #fff 0, #a6a6a6 18%, #565656 70%);
    box-shadow: 0 5px 7px rgba(0,0,0,.28), inset 0 -3px 4px rgba(0,0,0,.25);
}
.business-content { font-size: 1.06rem; line-height: 1.78; }
.business-content > :first-child { margin-top: 0; }
.business-content h2,
.business-content h3 { color: var(--navy); }
.business-content h2 {
    margin-top: 2em;
    padding-bottom: 10px;
    border-bottom: 4px solid var(--blue);
    font-size: clamp(1.6rem, 3vw, 2.25rem);
}
.business-content h3 { font-size: 1.3rem; }
.business-content ul,
.business-content ol { padding-left: 1.35rem; }
.business-content li { margin-bottom: .45rem; }
.business-content blockquote {
    margin: 2rem 0;
    padding: 1.25rem 1.5rem;
    border-left: 6px solid var(--blue);
    border-radius: 0 10px 10px 0;
    background: #edf5ff;
}
.business-content img { border-radius: 12px; box-shadow: 0 12px 28px rgba(8,26,47,.14); }
.business-title-hidden { margin-top: 0; }

.business-post-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.business-post-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 28px;
    border: 1px solid #dfe5ec;
    border-top: 7px solid var(--blue);
    border-radius: 4px 4px 15px 4px;
    background: #fff;
    box-shadow: 0 11px 25px rgba(8,26,47,.09);
}
.business-post-card:nth-child(3n+1) { border-top-color: #c88647; }
.business-post-card:nth-child(3n+2) { border-top-color: #a8b0bb; }
.business-post-card:nth-child(3n) { border-top-color: #e3bb13; }
.business-card-date {
    margin: 0 0 8px;
    color: #66758a;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.business-post-card h2 { margin: 0 0 12px; font-size: 1.45rem; }
.business-post-card h2 a { color: var(--navy); text-decoration: none; }
.business-post-card h2 a:hover { color: var(--blue); }
.business-read-more { margin-top: auto; padding-top: 10px; font-weight: 900; }
.business-read-more a { text-decoration: none; }
.business-pagination { margin-top: 34px; }
.business-result-count { margin-bottom: 24px; }
.business-empty-message { padding: 30px; text-align: center; border-radius: 12px; background: #eef5ff; }
.business-back-link { margin-top: 42px; padding-top: 22px; border-top: 1px solid #dfe5ec; font-weight: 800; }

.business-search-form {
    display: flex;
    gap: 10px;
    margin: 0 0 34px;
}
.business-search-form input {
    flex: 1;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    font: inherit;
}
.business-search-form input:focus {
    border-color: var(--blue);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(38,132,255,.14);
}
.business-search-form button,
.business-button {
    display: inline-block;
    padding: 14px 24px;
    border: 0;
    border-radius: 9px;
    color: #fff;
    background: var(--blue);
    font: inherit;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
}
.business-search-form button:hover,
.business-button:hover { color: #fff; opacity: .9; }

.business-error-page { text-align: center; }
.business-error-code {
    margin: 0 0 20px;
    color: var(--blue);
    font-size: clamp(6rem, 18vw, 12rem);
    font-weight: 900;
    line-height: .8;
    letter-spacing: -.09em;
}

/* Sidebar adjusted to match the inner-page paper/card language. */
.layout .business-page-shell { margin-bottom: 0; }
.layout .business-paper { width: 100%; }
.layout-sidebar { padding-top: 22px; }
.layout-sidebar .sidebar-widget {
    position: relative;
    overflow: hidden;
    border-top: 6px solid var(--blue);
    background: #fffef9;
}
.layout-sidebar .sidebar-widget:nth-child(3n+1) { border-top-color: #c88647; }
.layout-sidebar .sidebar-widget:nth-child(3n+2) { border-top-color: #a8b0bb; }
.layout-sidebar .sidebar-widget:nth-child(3n) { border-top-color: #e3bb13; }

@media (max-width: 820px) {
    .business-page-shell { margin-top: 0; }
    .business-page-hero { padding-top: 54px; padding-bottom: 94px; }
    .business-paper { margin-top: -50px; }
    .business-post-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .business-page-hero { padding-left: 20px; padding-right: 20px; }
    .business-page-hero h1 { font-size: 2.65rem; }
    .business-paper { width: calc(100% - 20px); padding: 46px 22px 30px; }
    .business-search-form { flex-direction: column; }
    .business-search-form button { width: 100%; }
}

/* ============================================================
   v1.2 compatibility layer
   Styles the CMS's original template markup as well as the
   dedicated Business Theme wrappers. Body view classes are set
   in header.php, so every route receives a dependable selector.
   ============================================================ */

body.cms-theme-business:not(.view-home) {
    background: #eef1f5;
}

body.cms-theme-business:not(.view-home) .site-main {
    width: 100%;
    max-width: none;
    padding: 0 0 76px;
}

body.cms-theme-business:not(.view-home) .site-main > .page,
body.cms-theme-business:not(.view-home) .site-main > .post,
body.cms-theme-business:not(.view-home) .site-main > .archive-shell,
body.cms-theme-business:not(.view-home) .site-main > .search-shell,
body.cms-theme-business:not(.view-home) .site-main > .business-page-shell,
body.cms-theme-business:not(.view-home) .site-main > .business-post-shell,
body.cms-theme-business:not(.view-home) .site-main > .business-archive-shell,
body.cms-theme-business:not(.view-home) .site-main > .business-search-shell,
body.cms-theme-business:not(.view-home) .layout {
    width: min(1180px, calc(100% - 40px));
    margin-left: auto;
    margin-right: auto;
}

/* Default page/post templates: create the navy title treatment even if
   an older page.php or post.php is still being served. */
body.view-page .site-main > article.page,
body.view-post .site-main > article.post,
body.view-page .layout-content > article.page,
body.view-post .layout-content > article.post {
    position: relative;
    margin-top: 54px;
    padding: clamp(34px, 5vw, 62px);
    border: 0;
    border-top: 8px solid var(--blue);
    border-radius: 4px 4px 20px 4px;
    background: var(--paper);
    box-shadow: 0 22px 50px rgba(8, 26, 47, .14);
}

body.view-page article.page > h1,
body.view-post article.post > h1 {
    margin: -62px -62px 42px;
    padding: 64px 62px 38px;
    color: #fff;
    background: var(--navy);
    font-size: clamp(2.5rem, 6vw, 4.8rem);
    line-height: 1;
    letter-spacing: -.05em;
}

body.view-page article.page > h1::after,
body.view-post article.post > h1::after {
    left: 62px;
    bottom: 22px;
    background: var(--blue);
}

body.view-page article.page::before,
body.view-post article.post::before,
body.view-blog article.post-summary::before,
body.view-search .search-result::before {
    content: "";
    position: absolute;
    top: -17px;
    left: 50%;
    z-index: 2;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    transform: translateX(-50%);
    background: radial-gradient(circle at 35% 30%, #fff 0, #a6a6a6 18%, #565656 70%);
    box-shadow: 0 5px 7px rgba(0,0,0,.28), inset 0 -3px 4px rgba(0,0,0,.22);
}

/* Blog/archive original markup */
body.view-blog .site-main,
body.view-category .site-main,
body.view-archive .site-main {
    padding-top: 54px;
}

body.view-blog .archive-heading,
body.view-category .archive-heading,
body.view-archive .archive-heading {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto 34px;
    padding: 56px clamp(26px, 5vw, 58px) 38px;
    color: #fff;
    background: var(--navy);
    border-radius: 4px;
    box-shadow: 0 18px 42px rgba(8,26,47,.18);
}

body.view-blog .post-summary,
body.view-category .post-summary,
body.view-archive .post-summary {
    width: min(1180px, calc(100% - 40px));
    margin: 28px auto;
    padding: clamp(28px, 4vw, 42px);
    border: 0;
    border-top: 8px solid var(--bronze);
    border-radius: 4px 4px 18px 4px;
    background: var(--paper);
    box-shadow: 0 16px 36px rgba(8,26,47,.11);
}

body.view-blog .post-summary:nth-of-type(3n+2),
body.view-category .post-summary:nth-of-type(3n+2),
body.view-archive .post-summary:nth-of-type(3n+2) { border-top-color: #c7cdd5; }
body.view-blog .post-summary:nth-of-type(3n),
body.view-category .post-summary:nth-of-type(3n),
body.view-archive .post-summary:nth-of-type(3n) { border-top-color: var(--gold); }

body.view-blog .pagination,
body.view-category .pagination,
body.view-archive .pagination {
    width: min(1180px, calc(100% - 40px));
    margin: 34px auto 0;
}

/* Search original markup */
body.view-search .site-main {
    padding-top: 54px;
}

body.view-search .site-main > h1,
body.view-search .search-heading {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto 34px;
    padding: 56px clamp(26px, 5vw, 58px) 38px;
    color: #fff;
    background: var(--navy);
    border-radius: 4px;
}

body.view-search .site-main > form,
body.view-search .search-form,
body.view-search .search-results,
body.view-search .site-main > p {
    width: min(1180px, calc(100% - 40px));
    margin-left: auto;
    margin-right: auto;
}

body.view-search .search-result,
body.view-search .post-summary {
    position: relative;
    margin: 26px 0;
    padding: 30px;
    border: 0;
    border-top: 7px solid var(--silver);
    border-radius: 4px 4px 16px 4px;
    background: var(--paper);
    box-shadow: 0 14px 30px rgba(8,26,47,.1);
}

/* Sidebar layouts */
body.cms-theme-business .layout {
    padding-top: 54px;
}

body.cms-theme-business .layout-content > article,
body.cms-theme-business .layout-content > .archive-shell,
body.cms-theme-business .layout-content > .search-shell {
    margin-top: 0;
}

body.cms-theme-business .layout-sidebar {
    align-self: start;
}

body.cms-theme-business .sidebar-section,
body.cms-theme-business .widget {
    margin-bottom: 22px;
    padding: 26px;
    border: 0;
    border-top: 7px solid var(--gold);
    border-radius: 4px 4px 16px 4px;
    background: var(--paper);
    box-shadow: 0 12px 28px rgba(8,26,47,.1);
}

/* 404 and maintenance pages */
body.view-404 .site-main > *,
body.view-not-found .site-main > * {
    width: min(900px, calc(100% - 40px));
    margin-left: auto;
    margin-right: auto;
}

body.view-404 .site-main,
body.view-not-found .site-main {
    padding-top: 54px;
}

body.view-404 .site-main > article,
body.view-not-found .site-main > article,
body.view-404 .site-main > .page,
body.view-not-found .site-main > .page {
    padding: clamp(38px, 6vw, 70px);
    text-align: center;
    border-top: 8px solid var(--blue);
    background: var(--paper);
    box-shadow: var(--shadow);
}

@media (max-width: 760px) {
    body.cms-theme-business:not(.view-home) .site-main > .page,
    body.cms-theme-business:not(.view-home) .site-main > .post,
    body.cms-theme-business:not(.view-home) .site-main > .archive-shell,
    body.cms-theme-business:not(.view-home) .site-main > .search-shell,
    body.cms-theme-business:not(.view-home) .site-main > .business-page-shell,
    body.cms-theme-business:not(.view-home) .site-main > .business-post-shell,
    body.cms-theme-business:not(.view-home) .site-main > .business-archive-shell,
    body.cms-theme-business:not(.view-home) .site-main > .business-search-shell,
    body.cms-theme-business:not(.view-home) .layout,
    body.view-blog .archive-heading,
    body.view-blog .post-summary,
    body.view-category .archive-heading,
    body.view-category .post-summary,
    body.view-archive .archive-heading,
    body.view-archive .post-summary,
    body.view-search .site-main > h1,
    body.view-search .search-heading,
    body.view-search .site-main > form,
    body.view-search .search-form,
    body.view-search .search-results,
    body.view-search .site-main > p {
        width: min(100% - 24px, 1180px);
    }

    body.view-page article.page > h1,
    body.view-post article.post > h1 {
        margin: -34px -24px 34px;
        padding: 46px 24px 32px;
    }

    body.view-page article.page > h1::after,
    body.view-post article.post > h1::after {
        left: 24px;
        bottom: 18px;
    }

    body.view-page .site-main > article.page,
    body.view-post .site-main > article.post,
    body.view-page .layout-content > article.page,
    body.view-post .layout-content > article.post {
        padding: 34px 24px;
    }
}

/* ==========================================================
   Reusable feature cards
========================================================== */
.feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
    margin: 2.5rem 0;
}

.feature-card {
    position: relative;
    overflow: hidden;
    padding: 2rem;
    border: 1px solid #dfe5ec;
    border-top: 6px solid var(--blue);
    border-radius: 4px 4px 14px 4px;
    background: #ffffff;
    box-shadow: 0 10px 25px rgba(8, 26, 47, .08);
    transition: transform .25s ease, box-shadow .25s ease;
}

.feature-card::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 34px;
    height: 34px;
    background: linear-gradient(135deg, transparent 49%, #d4d9df 50%);
    pointer-events: none;
}

.feature-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 38px rgba(8, 26, 47, .14);
}

.feature-card h2,
.feature-card h3,
.feature-card h4 {
    margin-top: 0;
    margin-bottom: 1rem;
    color: var(--navy);
    line-height: 1.2;
}

.feature-card p {
    margin-top: 0;
    color: #4f5d6d;
    line-height: 1.7;
}

.feature-card p:last-child,
.feature-card ul:last-child,
.feature-card ol:last-child {
    margin-bottom: 0;
}

.feature-card ul,
.feature-card ol {
    padding-left: 1.3rem;
}

.feature-card li {
    margin-bottom: .6rem;
}

.feature-card a {
    color: #1469d4;
    font-weight: 700;
    text-decoration: none;
}

.feature-card a:hover {
    color: #064b9e;
    text-decoration: underline;
}

.feature-card .feature-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin-bottom: 1.25rem;
    border-radius: 50%;
    background: var(--navy);
    color: #ffffff;
    font-size: 1.6rem;
}

@media (max-width: 950px) {
    .feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .feature-grid {
        grid-template-columns: 1fr;
    }

    .feature-card {
        padding: 1.6rem;
    }
}

/* ==========================================================
   Feature cards — CMS content override
   Strong selectors prevent generic article/page rules winning.
========================================================== */
.page .feature-grid,
.post .feature-grid,
.content .feature-grid,
main .feature-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 24px !important;
    width: 100% !important;
    margin: 2.5rem 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.page .feature-grid > article.feature-card,
.post .feature-grid > article.feature-card,
.content .feature-grid > article.feature-card,
main .feature-grid > article.feature-card {
    position: relative !important;
    display: block !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 30px !important;
    overflow: hidden !important;
    border: 1px solid #dfe5ec !important;
    border-top: 6px solid #1677d2 !important;
    border-radius: 4px 4px 14px 4px !important;
    background: #ffffff !important;
    box-shadow: 0 10px 25px rgba(8, 26, 47, .10) !important;
    color: #4f5d6d !important;
    text-align: left !important;
    transform: none;
    transition: transform .25s ease, box-shadow .25s ease !important;
}

.page .feature-grid > article.feature-card::before,
.post .feature-grid > article.feature-card::before,
.content .feature-grid > article.feature-card::before,
main .feature-grid > article.feature-card::before {
    content: none !important;
    display: none !important;
}

.page .feature-grid > article.feature-card::after,
.post .feature-grid > article.feature-card::after,
.content .feature-grid > article.feature-card::after,
main .feature-grid > article.feature-card::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    background: linear-gradient(135deg, transparent 49%, #d4d9df 50%) !important;
    pointer-events: none !important;
}

.page .feature-grid > article.feature-card:hover,
.post .feature-grid > article.feature-card:hover,
.content .feature-grid > article.feature-card:hover,
main .feature-grid > article.feature-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 18px 38px rgba(8, 26, 47, .16) !important;
}

.page .feature-card h3,
.post .feature-card h3,
.content .feature-card h3,
main .feature-card h3 {
    margin: 0 0 14px !important;
    padding: 0 !important;
    border: 0 !important;
    color: #0b2847 !important;
    font-size: 1.35rem !important;
    line-height: 1.25 !important;
}

.page .feature-card p,
.post .feature-card p,
.content .feature-card p,
main .feature-card p {
    margin: 0 !important;
    color: #4f5d6d !important;
    line-height: 1.7 !important;
}

@media (max-width: 950px) {
    .page .feature-grid,
    .post .feature-grid,
    .content .feature-grid,
    main .feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    .page .feature-grid,
    .post .feature-grid,
    .content .feature-grid,
    main .feature-grid {
        grid-template-columns: 1fr !important;
    }

    .page .feature-grid > article.feature-card,
    .post .feature-grid > article.feature-card,
    .content .feature-grid > article.feature-card,
    main .feature-grid > article.feature-card {
        padding: 24px !important;
    }
}


/* ==========================================================
   Blog sidebar layout fix
   The blog hero normally uses full-viewport breakout margins.
   Inside .layout-content that causes it to escape its column and
   collide with the sidebar. These rules keep all blog elements
   inside the two-column layout.
   ========================================================== */
body.cms-theme-business .site-main > .layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 280px !important;
    gap: 32px !important;
    align-items: start !important;
    width: min(1180px, calc(100% - 40px)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-top: 54px !important;
}

body.cms-theme-business .site-main > .layout.layout-sidebar-left {
    grid-template-columns: 280px minmax(0, 1fr) !important;
}

body.cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-content {
    grid-column: 2;
}

body.cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-sidebar {
    grid-column: 1;
    grid-row: 1;
}

body.cms-theme-business .layout-content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
}

body.cms-theme-business .layout-sidebar {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 280px !important;
    box-sizing: border-box !important;
    padding-top: 0 !important;
}

body.cms-theme-business .layout-content > .business-page-shell {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

body.cms-theme-business .layout-content .business-page-hero {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 54px clamp(24px, 5vw, 52px) 92px !important;
    border-radius: 4px 4px 0 0;
    box-sizing: border-box !important;
}

body.cms-theme-business .layout-content .business-page-hero-inner {
    width: 100% !important;
    max-width: 100% !important;
}

body.cms-theme-business .layout-content .business-paper {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    margin: -50px auto 0 !important;
    box-sizing: border-box !important;
}

body.cms-theme-business .layout-content .business-post-grid {
    grid-template-columns: 1fr !important;
}

body.cms-theme-business .layout-content .business-post-card {
    width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 900px) {
    body.cms-theme-business .site-main > .layout,
    body.cms-theme-business .site-main > .layout.layout-sidebar-left {
        display: flex !important;
        flex-direction: column !important;
        width: min(100% - 24px, 1180px) !important;
        gap: 26px !important;
    }

    body.cms-theme-business .site-main > .layout > .layout-content,
    body.cms-theme-business .site-main > .layout > .layout-sidebar {
        width: 100% !important;
        max-width: none !important;
    }

    body.cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-sidebar {
        order: 2;
    }
}

@media (max-width: 600px) {
    body.cms-theme-business .layout-content .business-page-hero {
        padding: 44px 20px 82px !important;
    }

    body.cms-theme-business .layout-content .business-paper {
        width: calc(100% - 16px) !important;
        margin-top: -42px !important;
        padding: 44px 20px 28px !important;
    }
}


/* =========================================================
   Carnivellos CMS 1.33.1 compatibility layer
   Supports both header modes and all page/blog sidebar layouts.
========================================================= */

html { overflow-x: hidden; }
body { overflow-wrap: anywhere; }

.cms-theme-business .site-main,
.cms-theme-creative .site-main {
    width: min(calc(100% - 32px), var(--max-width, 1180px));
    max-width: var(--max-width, 1180px);
    margin-inline: auto;
    box-sizing: border-box;
}

/* Header image modes */
.cms-theme-business .site-banner,
.cms-theme-creative .site-banner,
.cms-theme-business .site-banner-full,
.cms-theme-creative .site-banner-full {
    width: 100%;
    margin: 0;
    overflow: hidden;
    background: var(--banner-bg, var(--header-bg, #111827));
}

.cms-theme-business .site-banner img,
.cms-theme-creative .site-banner img,
.cms-theme-business .site-banner-full img,
.cms-theme-creative .site-banner-full img {
    display: block;
    width: 100%;
    max-width: none;
    height: var(--banner-height, auto);
    max-height: none;
    margin: 0 auto;
    object-fit: contain;
    object-position: center;
}

.cms-theme-business .site-banner-full > .wrap,
.cms-theme-creative .site-banner-full > .wrap {
    display: block;
    width: min(100%, var(--max-width, 1180px));
    max-width: var(--max-width, 1180px);
    margin-inline: auto;
    padding: 0;
}

.cms-theme-business .site-nav-bar,
.cms-theme-creative .site-nav-bar {
    position: relative;
    z-index: 20;
}

.cms-theme-business .site-nav-bar > .wrap,
.cms-theme-creative .site-nav-bar > .wrap {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: min(calc(100% - 32px), var(--max-width, 1180px));
    max-width: var(--max-width, 1180px);
    margin-inline: auto;
}

.cms-theme-business .site-nav-bar .site-nav,
.cms-theme-creative .site-nav-bar .site-nav { flex: 1 1 auto; }

/* Exact CMS sidebar structure */
.cms-theme-business .site-main > .layout,
.cms-theme-creative .site-main > .layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
    gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: start;
    width: 100%;
    min-width: 0;
}

.cms-theme-business .site-main > .layout.layout-sidebar-left,
.cms-theme-creative .site-main > .layout.layout-sidebar-left {
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
}

.cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-content,
.cms-theme-creative .site-main > .layout.layout-sidebar-left > .layout-content { grid-column: 2; }
.cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-sidebar,
.cms-theme-creative .site-main > .layout.layout-sidebar-left > .layout-sidebar { grid-column: 1; grid-row: 1; }

.cms-theme-business .layout-content,
.cms-theme-creative .layout-content,
.cms-theme-business .layout-sidebar,
.cms-theme-creative .layout-sidebar {
    min-width: 0;
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
}

.cms-theme-business .layout-content > *,
.cms-theme-creative .layout-content > * { max-width: 100%; box-sizing: border-box; }

.cms-theme-business .layout-content .business-page-shell,
.cms-theme-creative .layout-content .creative-page-shell {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

.cms-theme-business .layout-content .business-page-hero,
.cms-theme-business .layout-content .business-paper,
.cms-theme-creative .layout-content .creative-page-hero,
.cms-theme-creative .layout-content .creative-paper {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    box-sizing: border-box;
}

.cms-theme-business .layout-content .business-post-grid,
.cms-theme-creative .layout-content .creative-post-grid {
    grid-template-columns: minmax(0, 1fr);
}

.cms-theme-business .layout-sidebar img,
.cms-theme-creative .layout-sidebar img,
.cms-theme-business .layout-content img,
.cms-theme-creative .layout-content img { max-width: 100%; height: auto; }

/* Components must shrink safely inside sidebars */
.cms-theme-business .layout-content .feature-grid,
.cms-theme-creative .layout-content .feature-grid,
.cms-theme-business .layout-content .pricing-grid,
.cms-theme-creative .layout-content .pricing-grid,
.cms-theme-business .layout-content .testimonial-grid,
.cms-theme-creative .layout-content .testimonial-grid,
.cms-theme-business .layout-content .team-grid,
.cms-theme-creative .layout-content .team-grid,
.cms-theme-business .layout-content .stats-grid,
.cms-theme-creative .layout-content .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 920px) {
    .cms-theme-business .site-main > .layout,
    .cms-theme-creative .site-main > .layout,
    .cms-theme-business .site-main > .layout.layout-sidebar-left,
    .cms-theme-creative .site-main > .layout.layout-sidebar-left {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
    .cms-theme-business .site-main > .layout > .layout-content,
    .cms-theme-creative .site-main > .layout > .layout-content,
    .cms-theme-business .site-main > .layout > .layout-sidebar,
    .cms-theme-creative .site-main > .layout > .layout-sidebar,
    .cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-content,
    .cms-theme-creative .site-main > .layout.layout-sidebar-left > .layout-content,
    .cms-theme-business .site-main > .layout.layout-sidebar-left > .layout-sidebar,
    .cms-theme-creative .site-main > .layout.layout-sidebar-left > .layout-sidebar {
        grid-column: 1;
        grid-row: auto;
        width: 100%;
    }
    .cms-theme-business .layout-sidebar,
    .cms-theme-creative .layout-sidebar { padding-top: 0; }
}

@media (max-width: 700px) {
    .cms-theme-business .site-main,
    .cms-theme-creative .site-main,
    .cms-theme-business .site-nav-bar > .wrap,
    .cms-theme-creative .site-nav-bar > .wrap { width: min(calc(100% - 22px), var(--max-width, 1180px)); }

    .cms-theme-business .layout-content .feature-grid,
    .cms-theme-creative .layout-content .feature-grid,
    .cms-theme-business .layout-content .pricing-grid,
    .cms-theme-creative .layout-content .pricing-grid,
    .cms-theme-business .layout-content .testimonial-grid,
    .cms-theme-creative .layout-content .testimonial-grid,
    .cms-theme-business .layout-content .team-grid,
    .cms-theme-creative .layout-content .team-grid,
    .cms-theme-business .layout-content .stats-grid,
    .cms-theme-creative .layout-content .stats-grid { grid-template-columns: minmax(0, 1fr); }

    .cms-theme-business .site-banner img,
    .cms-theme-creative .site-banner img,
    .cms-theme-business .site-banner-full img,
    .cms-theme-creative .site-banner-full img { object-fit: contain; }
}


/* Business theme final compatibility refinements */
.cms-theme-business .site-nav-bar { background: var(--navy, #102f50); border-bottom: 4px solid var(--blue, #2f80c8); }
.cms-theme-business .site-nav-bar .site-nav a { color: #fff; }
.cms-theme-business .site-nav-bar .site-nav a:hover,
.cms-theme-business .site-nav-bar .site-nav a.active { color: #fff; background: rgba(255,255,255,.12); }
.cms-theme-business .layout-sidebar .sidebar-widget { width: 100%; box-sizing: border-box; }
.cms-theme-business .layout-content .business-page-hero { transform: none; }

/* =========================================================
   OFFICIAL CARNIVELLOS COMPONENT LIBRARY v1.0
   Business theme
========================================================= */
.cms-theme-business .content .eyebrow,
.cms-theme-business .eyebrow {
    margin: 0 0 .75rem;
    color: var(--blue, #2f6fae);
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.cms-theme-business .content .button-row,
.cms-theme-business .button-row {
    display: flex;
    flex-wrap: wrap;
    gap: .9rem;
    margin: 1.5rem 0 0;
}
.cms-theme-business .content a.button,
.cms-theme-business .content a.button-primary,
.cms-theme-business .content a.button-secondary,
.cms-theme-business a.button,
.cms-theme-business a.button-primary,
.cms-theme-business a.button-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: .75rem 1.15rem;
    border: 2px solid var(--navy, #173d69);
    border-radius: 7px;
    font-weight: 800;
    line-height: 1.1;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.cms-theme-business a.button-primary,
.cms-theme-business .content a.button-primary {
    background: var(--blue, #2f6fae);
    border-color: var(--blue, #2f6fae);
    color: #fff;
}
.cms-theme-business a.button-secondary,
.cms-theme-business .content a.button-secondary,
.cms-theme-business a.button,
.cms-theme-business .content a.button {
    background: #fff;
    color: var(--navy, #173d69);
}
.cms-theme-business a.button:hover,
.cms-theme-business a.button-primary:hover,
.cms-theme-business a.button-secondary:hover,
.cms-theme-business .content a.button:hover,
.cms-theme-business .content a.button-primary:hover,
.cms-theme-business .content a.button-secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(23,61,105,.16);
    text-decoration: none;
}
.cms-theme-business .content .split-section,
.cms-theme-business .split-section {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, .9fr);
    gap: clamp(1.5rem, 4vw, 3.5rem);
    align-items: center;
    margin: 3rem 0;
}
.cms-theme-business .split-media img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0 16px 36px rgba(23,61,105,.16);
}
.cms-theme-business .content .cta,
.cms-theme-business .cta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: center;
    margin: 3rem 0;
    padding: clamp(1.6rem, 4vw, 3rem);
    background: var(--navy, #173d69);
    color: #fff;
    border-radius: 16px;
    box-shadow: 0 18px 40px rgba(23,61,105,.2);
}
.cms-theme-business .cta h2,
.cms-theme-business .cta h3 { margin: 0 0 .65rem; color: #fff; }
.cms-theme-business .cta p { margin: 0; color: #dce8f5; }
.cms-theme-business .cta .eyebrow { color: #9fc4ea; }
.cms-theme-business .content .pricing-grid,
.cms-theme-business .pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 3rem 0;
    align-items: stretch;
}
.cms-theme-business .content article.pricing-card,
.cms-theme-business article.pricing-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 1.8rem;
    background: #fff;
    border: 1px solid #d9e1ea;
    border-top: 5px solid var(--blue, #2f6fae);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(23,61,105,.1);
}
.cms-theme-business article.pricing-card.featured {
    border-color: var(--blue, #2f6fae);
    transform: translateY(-8px);
}
.cms-theme-business .pricing-badge {
    align-self: flex-start;
    margin: -2.25rem 0 1rem;
    padding: .35rem .75rem;
    background: var(--blue, #2f6fae);
    color: #fff;
    border-radius: 999px;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.cms-theme-business .pricing-card h3 { margin-top: 0; color: var(--navy, #173d69); }
.cms-theme-business .pricing-card .price { margin: .25rem 0 .75rem; color: var(--navy, #173d69); font-size: 2.35rem; font-weight: 900; line-height: 1; }
.cms-theme-business .pricing-card ul { margin: 1rem 0 1.5rem; padding-left: 1.2rem; }
.cms-theme-business .pricing-card .button,
.cms-theme-business .pricing-card .button-primary,
.cms-theme-business .pricing-card .button-secondary { margin-top: auto; }
.cms-theme-business .content .testimonial-grid,
.cms-theme-business .testimonial-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 3rem 0;
}
.cms-theme-business .content blockquote.testimonial,
.cms-theme-business blockquote.testimonial {
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 1.8rem;
    background: #fff;
    border: 1px solid #d9e1ea;
    border-left: 5px solid var(--blue, #2f6fae);
    border-radius: 10px;
    box-shadow: 0 10px 26px rgba(23,61,105,.09);
}
.cms-theme-business blockquote.testimonial::before {
    content: "“";
    position: absolute;
    top: .15rem;
    right: 1rem;
    color: #dce8f5;
    font: 700 4rem/1 Georgia, serif;
}
.cms-theme-business .testimonial p { position: relative; margin-top: 0; }
.cms-theme-business .testimonial footer { display: grid; gap: .15rem; margin-top: 1.2rem; color: var(--navy, #173d69); }
.cms-theme-business .testimonial footer span { color: #66788a; font-size: .9rem; }
.cms-theme-business .content .stats-grid,
.cms-theme-business .stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin: 3rem 0;
}
.cms-theme-business .content .stat-card,
.cms-theme-business .stat-card {
    min-width: 0;
    padding: 1.5rem 1rem;
    text-align: center;
    background: #eef4fa;
    border: 1px solid #d9e4ef;
    border-radius: 10px;
}
.cms-theme-business .stat-card strong { display: block; color: var(--navy, #173d69); font-size: clamp(1.8rem, 4vw, 2.75rem); line-height: 1; }
.cms-theme-business .stat-card span { display: block; margin-top: .55rem; color: #5d7083; font-weight: 700; }
.cms-theme-business .content .team-grid,
.cms-theme-business .team-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 3rem 0;
}
.cms-theme-business .content article.team-member,
.cms-theme-business article.team-member {
    min-width: 0;
    overflow: hidden;
    padding: 0 0 1.5rem;
    background: #fff;
    border: 1px solid #d9e1ea;
    border-radius: 12px;
    box-shadow: 0 10px 26px rgba(23,61,105,.09);
}
.cms-theme-business .team-member img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cms-theme-business .team-member h3,
.cms-theme-business .team-member p { margin-left: 1.3rem; margin-right: 1.3rem; }
.cms-theme-business .team-member h3 { margin-top: 1.2rem; margin-bottom: .25rem; color: var(--navy, #173d69); }
.cms-theme-business .team-member .team-role { margin-top: 0; color: var(--blue, #2f6fae); font-weight: 800; }
.cms-theme-business .content .faq,
.cms-theme-business .faq { display: grid; gap: .8rem; margin: 3rem 0; }
.cms-theme-business .content details.faq-item,
.cms-theme-business details.faq-item { overflow: hidden; background: #fff; border: 1px solid #d9e1ea; border-radius: 9px; }
.cms-theme-business .faq-item summary { padding: 1rem 1.2rem; cursor: pointer; color: var(--navy, #173d69); font-weight: 850; }
.cms-theme-business .faq-answer { padding: 0 1.2rem 1.15rem; }
.cms-theme-business .faq-answer > :last-child { margin-bottom: 0; }
.cms-theme-business .content .gallery-grid,
.cms-theme-business .gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 3rem 0;
}
.cms-theme-business .gallery-grid a { display: block; overflow: hidden; border-radius: 10px; }
.cms-theme-business .gallery-grid img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .25s ease; }
.cms-theme-business .gallery-grid a:hover img { transform: scale(1.035); }
.cms-theme-business .content .notice,
.cms-theme-business .notice {
    margin: 1.25rem 0;
    padding: 1rem 1.15rem;
    background: #eef5fc;
    border: 1px solid #cddded;
    border-left: 5px solid var(--blue, #2f6fae);
    border-radius: 7px;
}
.cms-theme-business .notice p { margin: .35rem 0 0; }
.cms-theme-business .notice-success { background: #edf8f2; border-color: #b9dfca; border-left-color: #268454; }
.cms-theme-business .notice-warning { background: #fff7e4; border-color: #ead49f; border-left-color: #c48300; }
.cms-theme-business .content .contact-panel,
.cms-theme-business .contact-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(240px, .8fr);
    gap: 2rem;
    margin: 3rem 0;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    background: #f5f8fb;
    border: 1px solid #d9e4ef;
    border-radius: 14px;
}
.cms-theme-business .contact-callout { padding: 1.5rem; background: var(--navy, #173d69); color: #fff; border-radius: 10px; }
.cms-theme-business .contact-callout h3 { margin-top: 0; color: #fff; }
.cms-theme-business .contact-callout p { color: #dce8f5; }
.cms-theme-business .content .logo-strip,
.cms-theme-business .logo-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.5rem;
    align-items: center;
    margin: 3rem 0;
    padding: 1.5rem;
    background: #f7f9fb;
    border: 1px solid #e0e7ee;
    border-radius: 10px;
}
.cms-theme-business .logo-strip img { display: block; max-width: 100%; max-height: 72px; width: auto; margin: auto; object-fit: contain; filter: grayscale(1); opacity: .78; }
.cms-theme-business .content .timeline,
.cms-theme-business .timeline { position: relative; display: grid; gap: 1.2rem; margin: 3rem 0; padding-left: 2rem; }
.cms-theme-business .timeline::before { content: ""; position: absolute; top: .4rem; bottom: .4rem; left: .45rem; width: 3px; background: #cbd9e7; }
.cms-theme-business .content article.timeline-item,
.cms-theme-business article.timeline-item { position: relative; min-width: 0; padding: 1.25rem 1.4rem; background: #fff; border: 1px solid #d9e1ea; border-radius: 9px; }
.cms-theme-business .timeline-item::before { content: ""; position: absolute; left: -2rem; top: 1.35rem; width: .95rem; height: .95rem; background: var(--blue, #2f6fae); border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 2px var(--blue, #2f6fae); }
.cms-theme-business .timeline-date { margin: 0 0 .25rem; color: var(--blue, #2f6fae); font-weight: 900; }
.cms-theme-business .timeline-item h3 { margin: 0 0 .4rem; color: var(--navy, #173d69); }
.cms-theme-business .timeline-item p:last-child { margin-bottom: 0; }
@media (max-width: 980px) {
    .cms-theme-business .pricing-grid,
    .cms-theme-business .testimonial-grid,
    .cms-theme-business .team-grid,
    .cms-theme-business .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cms-theme-business .stats-grid,
    .cms-theme-business .logo-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .cms-theme-business .split-section,
    .cms-theme-business .cta,
    .cms-theme-business .contact-panel { grid-template-columns: 1fr; }
    .cms-theme-business .pricing-grid,
    .cms-theme-business .testimonial-grid,
    .cms-theme-business .team-grid,
    .cms-theme-business .gallery-grid,
    .cms-theme-business .stats-grid,
    .cms-theme-business .logo-strip { grid-template-columns: 1fr; }
    .cms-theme-business article.pricing-card.featured { transform: none; }
    .cms-theme-business .button-row { align-items: stretch; flex-direction: column; }
    .cms-theme-business .button-row .button,
    .cms-theme-business .button-row .button-primary,
    .cms-theme-business .button-row .button-secondary { width: 100%; }
}


/* =========================================================
   OFFICIAL COMPONENT LIBRARY v1.1 — DIRECT SNIPPET FIXES
   These selectors target the exact markup inserted by the CMS.
========================================================= */
.cms-theme-business :where(.hero,.split-section,.feature-grid,.cta,.pricing-grid,.testimonial-grid,.stats-grid,.team-grid,.faq,.gallery-grid,.button-row,.notice,.contact-panel,.logo-strip,.timeline),
.cms-theme-business :where(.hero,.split-section,.feature-grid,.cta,.pricing-grid,.testimonial-grid,.stats-grid,.team-grid,.faq,.gallery-grid,.button-row,.notice,.contact-panel,.logo-strip,.timeline) * {
    box-sizing: border-box;
}
.cms-theme-business .hero {
    position: relative;
    overflow: hidden;
    margin: 2.5rem 0;
    padding: clamp(2.5rem, 7vw, 5.5rem) clamp(1.5rem, 5vw, 4rem);
    border-radius: 16px;
    background: linear-gradient(135deg, #102f50 0%, #173d69 58%, #2f6fae 100%);
    color: #fff;
    box-shadow: 0 20px 46px rgba(8,26,47,.2);
}
.cms-theme-business .hero .hero-content { position: relative; z-index: 1; max-width: 760px; }
.cms-theme-business .hero h1,
.cms-theme-business .hero h2 { margin: 0 0 1rem; color: #fff; }
.cms-theme-business .hero .hero-text { margin: 0; max-width: 65ch; color: #dce8f5; font-size: 1.08rem; line-height: 1.75; }
.cms-theme-business .hero .button-row { margin-top: 1.5rem; }
.cms-theme-business .split-section > .split-content { min-width: 0; }
.cms-theme-business .split-section > .split-content > :first-child { margin-top: 0; }
.cms-theme-business .split-section > .split-content > :last-child { margin-bottom: 0; }
.cms-theme-business .split-section > .split-media { min-width: 0; }
.cms-theme-business .feature-grid > article.feature-card { margin: 0; width: auto; max-width: none; }
.cms-theme-business .cta > .cta-content { min-width: 0; }
.cms-theme-business .cta > .cta-content > :first-child { margin-top: 0; }
.cms-theme-business .cta > .cta-content > :last-child { margin-bottom: 0; }
.cms-theme-business .cta > .cta-actions { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: flex-end; }
.cms-theme-business .cta > .cta-actions .button { margin: 0; }
.cms-theme-business .pricing-grid > article.pricing-card,
.cms-theme-business .team-grid > article.team-member,
.cms-theme-business .timeline > article.timeline-item { margin: 0; width: auto; max-width: none; }
.cms-theme-business .pricing-card > :first-child,
.cms-theme-business .team-member > :first-child,
.cms-theme-business .timeline-item > :first-child { margin-top: 0; }
.cms-theme-business .pricing-card ul { width: 100%; }
.cms-theme-business .testimonial-grid > blockquote.testimonial { width: auto; max-width: none; }
.cms-theme-business blockquote.testimonial footer { padding: 0; border: 0; background: transparent; }
.cms-theme-business .stats-grid > .stat-card { margin: 0; }
.cms-theme-business .faq > details.faq-item { margin: 0; }
.cms-theme-business .gallery-grid > a { min-width: 0; }
.cms-theme-business .notice.notice-info { background: #eef5fc; border-color: #cddded; border-left-color: var(--blue, #2f6fae); }
.cms-theme-business .notice > strong { display: block; color: var(--navy, #173d69); }
.cms-theme-business .contact-panel > .contact-details { min-width: 0; }
.cms-theme-business .contact-panel > .contact-details > :first-child { margin-top: 0; }
.cms-theme-business .contact-panel > .contact-details > :last-child { margin-bottom: 0; }
.cms-theme-business .contact-panel > .contact-callout { min-width: 0; }
.cms-theme-business .logo-strip > img { justify-self: center; }
.cms-theme-business .timeline > article.timeline-item { overflow: visible; }
@media (max-width: 760px) {
    .cms-theme-business .cta > .cta-actions { justify-content: stretch; }
    .cms-theme-business .cta > .cta-actions .button { width: 100%; }
}


/* =========================================================
   HERO SNIPPET — STANDALONE COMPATIBILITY FIX
   Works even when an older header.php does not add the
   cms-theme-business body class.
========================================================= */
.page-content > section.hero,
.post-content > section.hero,
.business-paper > section.hero,
main section.hero:has(> .hero-content) {
    position: relative;
    overflow: hidden;
    margin: 2.5rem 0;
    padding: clamp(2.5rem, 7vw, 5.5rem) clamp(1.5rem, 5vw, 4rem);
    border-radius: 16px;
    background: linear-gradient(135deg, #102f50 0%, #173d69 58%, #2f6fae 100%);
    color: #fff;
    box-shadow: 0 20px 46px rgba(8,26,47,.2);
}
.page-content > section.hero > .hero-content,
.post-content > section.hero > .hero-content,
.business-paper > section.hero > .hero-content,
main section.hero:has(> .hero-content) > .hero-content {
    position: relative;
    z-index: 1;
    max-width: 760px;
}
.page-content > section.hero :is(h1,h2,h3,.eyebrow),
.post-content > section.hero :is(h1,h2,h3,.eyebrow),
.business-paper > section.hero :is(h1,h2,h3,.eyebrow),
main section.hero:has(> .hero-content) :is(h1,h2,h3,.eyebrow) {
    color: #fff;
}
.page-content > section.hero .hero-text,
.post-content > section.hero .hero-text,
.business-paper > section.hero .hero-text,
main section.hero:has(> .hero-content) .hero-text {
    color: #dce8f5;
}