/**
 * SDAweb Value Cards – Public Styles
 * Built with care by sdaweb.no
 */

/* ---- Section ---- */
.sdaweb-vc-section {
    position: relative;
    padding: 35px 24px 35px;
    max-width: 1200px;
    margin: 0 auto;
}

/* ---- Intro ---- */
.sdaweb-vc-intro {
    text-align: center;
    margin-bottom: 52px;
    animation: sdawebVcFadeUp 0.8s ease both;
}

.sdaweb-vc-eyebrow {
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: #6b6b6b;
    margin-bottom: 12px;
}

.sdaweb-vc-heading {
    font-weight: 500;
    font-size: clamp(1.8rem, 4vw, 2.6rem);
    color: #a81010;
    line-height: 1.2;
    max-width: 600px;
    margin: 0 auto;
}

.sdaweb-vc-divider {
    width: 48px;
    height: 3px;
    background: #5b3000;
    margin: 20px auto 0;
    border-radius: 2px;
}

/* ---- Grid ---- */
.sdaweb-vc-grid {
    display: grid;
    gap: 28px;
}

@media (max-width: 1024px) {
    .sdaweb-vc-grid {
        gap: 24px;
    }
}

@media (max-width: 680px) {
    .sdaweb-vc-grid {
        gap: 20px;
    }
}

/* ---- Base Card ---- */
.sdaweb-vc-card {
    border-radius: var(--sdaweb-vc-radius, 12px);
    padding: 40px 34px 36px;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    animation: sdawebVcFadeUp 0.8s ease both;
}

/* ---- Card Padding Variants ---- */
.sdaweb-vc-pad-tight { padding: 24px 20px 22px; }
.sdaweb-vc-pad-spacious { padding: 56px 48px 48px; }

/* ---- Horizontal Layout ---- */
.sdaweb-vc-layout-horizontal {
    flex-direction: row;
    gap: 24px;
}
.sdaweb-vc-layout-horizontal .sdaweb-vc-card-image {
    flex: 0 0 40%;
    max-width: 40%;
}
@media (max-width: 680px) {
    .sdaweb-vc-layout-horizontal { flex-direction: column; }
    .sdaweb-vc-layout-horizontal .sdaweb-vc-card-image { flex: none; max-width: 100%; }
}

/* ---- Icon Size Variants ---- */
.sdaweb-vc-icon-sz-small .sdaweb-vc-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
}
.sdaweb-vc-icon-sz-small .sdaweb-vc-icon svg,
.sdaweb-vc-icon-sz-small .sdaweb-vc-icon img,
.sdaweb-vc-icon-sz-small .sdaweb-vc-icon .dashicons {
    width: 18px;
    height: 18px;
    font-size: 18px;
}
.sdaweb-vc-icon-sz-large .sdaweb-vc-icon {
    width: 72px;
    height: 72px;
    border-radius: 16px;
}
.sdaweb-vc-icon-sz-large .sdaweb-vc-icon svg,
.sdaweb-vc-icon-sz-large .sdaweb-vc-icon img,
.sdaweb-vc-icon-sz-large .sdaweb-vc-icon .dashicons {
    width: 36px;
    height: 36px;
    font-size: 36px;
}

/* ---- Clickable Card ---- */
.sdaweb-vc-clickable {
    cursor: pointer;
}
.sdaweb-vc-card-overlay-link {
    position: absolute;
    inset: 0;
    z-index: 3;
}
.sdaweb-vc-clickable .sdaweb-vc-card-link {
    position: relative;
    z-index: 4;
}

/* ---- Link Style: Underline ---- */
.sdaweb-vc-link-underline .sdaweb-vc-card-link {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ---- Link Style: Button ---- */
.sdaweb-vc-link-button .sdaweb-vc-card-link {
    background: var(--sdaweb-vc-accent, #a81010);
    color: #fff;
    padding: 8px 20px;
    border-radius: 6px;
    font-size: 0.8rem;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}
.sdaweb-vc-link-button .sdaweb-vc-card-link:hover {
    filter: brightness(1.15);
    transform: translateY(-1px);
}

/* ---- Background Gradient ---- */
.sdaweb-vc-card[style*="--sdaweb-vc-bg-gradient"] {
    background: var(--sdaweb-vc-bg-gradient) !important;
}

/* ---- Card Styles ---- */

/* C – Warm Paper */
.sdaweb-vc-style-warm-paper {
    background: var(--sdaweb-vc-bg, #fffdf9);
    border: 1px solid var(--sdaweb-vc-border, #e8e2d8);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

/* A – Clean Minimal */
.sdaweb-vc-style-clean {
    background: var(--sdaweb-vc-bg, #ffffff);
    border: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

/* B – Glassmorphism */
.sdaweb-vc-style-glass {
    background: var(--sdaweb-vc-bg, rgba(255, 255, 255, 0.7));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--sdaweb-vc-border, rgba(255, 255, 255, 0.5));
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}

/* D – Elevated Flat */
.sdaweb-vc-style-elevated {
    background: var(--sdaweb-vc-bg, #ffffff);
    border: 1px solid var(--sdaweb-vc-border, #f0ebe4);
    box-shadow: 0 4px 24px rgba(91, 48, 0, 0.08);
}

/* F – Outlined */
.sdaweb-vc-style-outlined {
    background: var(--sdaweb-vc-bg, #ffffff);
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
    box-shadow: none;
}

/* G – Soft Glow */
.sdaweb-vc-style-soft-glow {
    background: var(--sdaweb-vc-bg, #ffffff);
    border: 1px solid var(--sdaweb-vc-border, rgba(168, 16, 16, 0.15));
    box-shadow: 0 0 20px rgba(168, 16, 16, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
}
.sdaweb-vc-style-soft-glow::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(ellipse at 60% 0%, rgba(168, 16, 16, 0.06) 0%, transparent 65%);
    pointer-events: none;
}

/* H – Ruled */
.sdaweb-vc-style-ruled {
    background: var(--sdaweb-vc-bg, #ffffff);
    border: 1px solid var(--sdaweb-vc-border, #e8e2d8);
    border-left: 4px solid var(--sdaweb-vc-accent, #a81010);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    border-radius: 0 var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 !important;
}

/* ---- Hover Animations ---- */
.sdaweb-vc-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

/* Lift */
.sdaweb-vc-hover-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.sdaweb-vc-style-warm-paper.sdaweb-vc-hover-lift:hover {
    border-color: #d4cbbf;
}

/* F – Outlined hover */
.sdaweb-vc-style-outlined.sdaweb-vc-hover-lift:hover {
    box-shadow: 0 6px 20px rgba(168, 16, 16, 0.15);
}
.sdaweb-vc-style-outlined.sdaweb-vc-hover-glow:hover {
    box-shadow: 0 0 0 3px rgba(168, 16, 16, 0.2), 0 4px 16px rgba(168, 16, 16, 0.1);
}

/* G – Soft Glow hover */
.sdaweb-vc-style-soft-glow.sdaweb-vc-hover-lift:hover {
    box-shadow: 0 0 28px rgba(168, 16, 16, 0.16), 0 8px 20px rgba(0, 0, 0, 0.07);
}
.sdaweb-vc-style-soft-glow.sdaweb-vc-hover-glow:hover {
    box-shadow: 0 0 32px rgba(168, 16, 16, 0.22);
}

/* H – Ruled hover */
.sdaweb-vc-style-ruled.sdaweb-vc-hover-lift:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    border-left-width: 6px;
}

/* Grow */
.sdaweb-vc-hover-grow:hover {
    transform: scale(1.025);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Glow */
.sdaweb-vc-hover-glow:hover {
    border-color: var(--sdaweb-vc-accent, #a81010);
    box-shadow: 0 0 0 2px var(--sdaweb-vc-accent, #a81010), 0 8px 24px rgba(0, 0, 0, 0.06);
}

/* Tilt */
.sdaweb-vc-hover-tilt {
    transition: transform 0.4s ease, box-shadow 0.3s ease;
}
.sdaweb-vc-hover-tilt:hover {
    transform: perspective(800px) rotateY(-2deg) rotateX(1deg) translateY(-3px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

/* None */
.sdaweb-vc-hover-none:hover {
    transform: none;
}

/* ---- Icon ---- */
.sdaweb-vc-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--sdaweb-vc-accent, #a81010) 8%, transparent);
    color: var(--sdaweb-vc-accent, #a81010);
}

.sdaweb-vc-icon .dashicons {
    font-size: 26px;
    width: 26px;
    height: 26px;
    color: inherit;
}

.sdaweb-vc-icon img {
    width: 26px;
    height: 26px;
    object-fit: contain;
}

/* Fallback for browsers without color-mix */
@supports not (background: color-mix(in srgb, red 8%, transparent)) {
    .sdaweb-vc-icon {
        background: rgba(168, 16, 16, 0.08);
    }
}

/* ---- Icon Positions ---- */

/* Inline (side by side) */
.sdaweb-vc-icon-inline .sdaweb-vc-card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

/* Above (stacked) */
.sdaweb-vc-icon-above .sdaweb-vc-icon {
    margin-bottom: 16px;
}
.sdaweb-vc-icon-above .sdaweb-vc-card-title {
    margin-bottom: 18px;
}

/* Left bar */
.sdaweb-vc-icon-left-bar .sdaweb-vc-icon {
    margin-bottom: 16px;
}
.sdaweb-vc-card-title.sdaweb-vc-left-bar {
    padding-left: 14px;
    border-left: 3px solid var(--sdaweb-vc-accent, #a81010);
    margin-bottom: 18px;
}

/* ---- Card Title ---- */
.sdaweb-vc-card-title {
    font-size: 1.15rem;
    font-weight: 500;
    color: var(--sdaweb-vc-heading-color, #5b3000);
    letter-spacing: 0.01em;
    line-height: 1.3;
}

/* ---- Card Intro ---- */
.sdaweb-vc-card-intro {
    font-style: italic;
    color: var(--sdaweb-vc-intro-color, var(--sdaweb-vc-accent));
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 14px;
}

/* ---- Card Body ---- */
.sdaweb-vc-card-body {
    font-size: 0.95rem;
    line-height: 1.75;
    color: var(--sdaweb-vc-body-color, #3a3a3a);
    font-weight: 400;
}

.sdaweb-vc-break {
    display: block;
    margin-top: 10px;
}

/* ---- Card Link ---- */
.sdaweb-vc-card-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: auto;
    padding-top: 14px;
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: 0.03em;
    color: var(--sdaweb-vc-link-color, var(--sdaweb-vc-accent, #a81010));
    transition: gap 0.3s ease, color 0.3s ease;
}

.sdaweb-vc-card-link:hover {
    gap: 10px;
}

.sdaweb-vc-card-link svg {
    width: 16px;
    height: 16px;
    transition: transform 0.3s ease;
}

.sdaweb-vc-card-link:hover svg {
    transform: translateX(2px);
}

/* ---- External Link Icon ---- */
.sdaweb-vc-external-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-left: 3px;
    vertical-align: middle;
}

/* ==== CARD IMAGE STYLES (30 layouts) ==== */

/* ---- Shared image base ---- */
.sdaweb-vc-card-image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}
.sdaweb-vc-card-image {
    overflow: hidden;
}

/* ---- Responsive image height scaling ---- */
@media (max-width: 1024px) {
    [style*="--sdaweb-vc-img-height"] .sdaweb-vc-card-image img,
    [style*="--sdaweb-vc-img-height"] .sdaweb-vc-side-panel-image {
        --sdaweb-vc-img-scale: 0.85;
    }
}
@media (max-width: 680px) {
    [style*="--sdaweb-vc-img-height"] .sdaweb-vc-card-image img,
    [style*="--sdaweb-vc-img-height"] .sdaweb-vc-side-panel-image {
        --sdaweb-vc-img-scale: 0.7;
    }
}

/* Shape styles (circle, diamond, hexagon) scale both dimensions */
@media (max-width: 1024px) {
    [style*="--sdaweb-vc-img-height"] .sdaweb-vc-card-image.sdaweb-vc-img-shape {
        --sdaweb-vc-img-scale: 0.85;
    }
}
@media (max-width: 680px) {
    [style*="--sdaweb-vc-img-height"] .sdaweb-vc-card-image.sdaweb-vc-img-shape {
        --sdaweb-vc-img-scale: 0.7;
    }
}

/* ============ TOP POSITION (12 styles) ============ */

/* 1. top-banner — full-width edge-to-edge */
.sdaweb-vc-img-top-banner > .sdaweb-vc-card-image {
    margin: -40px -34px 24px;
    border-radius: var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 0;
}
.sdaweb-vc-img-top-banner > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 200px) * var(--sdaweb-vc-img-scale, 1)); }

/* 2. top-rounded — padded with rounded corners */
.sdaweb-vc-img-top-rounded > .sdaweb-vc-card-image {
    margin-bottom: 20px;
    border-radius: 10px;
}
.sdaweb-vc-img-top-rounded > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 180px) * var(--sdaweb-vc-img-scale, 1)); }

/* 3. top-circle — circular crop, centered */
.sdaweb-vc-img-top-circle { text-align: center; }
.sdaweb-vc-img-top-circle > .sdaweb-vc-card-image {
    width: calc(var(--sdaweb-vc-img-height, 110px) * var(--sdaweb-vc-img-scale, 1));
    height: calc(var(--sdaweb-vc-img-height, 110px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 50%;
    margin: 0 auto 20px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    border: 3px solid var(--sdaweb-vc-accent, #a81010);
}
.sdaweb-vc-img-top-circle > .sdaweb-vc-card-image img {
    width: 100%;
    height: 100%;
}
.sdaweb-vc-img-top-circle .sdaweb-vc-card-header { justify-content: center; }

/* 4. top-angled — diagonal bottom edge */
.sdaweb-vc-img-top-angled > .sdaweb-vc-card-image {
    margin: -40px -34px 24px;
    position: relative;
    border-radius: var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 0;
}
.sdaweb-vc-img-top-angled > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 200px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-top-angled > .sdaweb-vc-card-image::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 40px;
    background: var(--sdaweb-vc-bg, #fffdf9);
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

/* 5. top-fade — gradient fade into card bg */
.sdaweb-vc-img-top-fade > .sdaweb-vc-card-image {
    margin: -40px -34px 16px;
    position: relative;
    border-radius: var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 0;
}
.sdaweb-vc-img-top-fade > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 200px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-top-fade > .sdaweb-vc-card-image::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(to bottom, transparent 0%, var(--sdaweb-vc-bg, #fffdf9) 100%);
}

/* 6. top-framed — accent border frame */
.sdaweb-vc-img-top-framed > .sdaweb-vc-card-image {
    margin-bottom: 20px;
    padding: 5px;
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
    border-radius: 8px;
}
.sdaweb-vc-img-top-framed > .sdaweb-vc-card-image img {
    height: calc(var(--sdaweb-vc-img-height, 170px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 4px;
}

/* 7. top-cover — full background + dark overlay */
.sdaweb-vc-img-top-cover {
    position: relative;
    min-height: 280px;
}
.sdaweb-vc-card-image-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
    transition: transform 0.4s ease;
}
.sdaweb-vc-img-top-cover:hover .sdaweb-vc-card-image-bg {
    transform: scale(1.04);
}
.sdaweb-vc-card-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.55) 60%, rgba(0,0,0,0.75) 100%);
    z-index: 1;
}
.sdaweb-vc-img-top-cover .sdaweb-vc-card-header,
.sdaweb-vc-img-top-cover .sdaweb-vc-card-title,
.sdaweb-vc-img-top-cover .sdaweb-vc-card-intro,
.sdaweb-vc-img-top-cover .sdaweb-vc-card-body,
.sdaweb-vc-img-top-cover .sdaweb-vc-card-link,
.sdaweb-vc-img-top-cover .sdaweb-vc-icon {
    position: relative;
    z-index: 2;
}
.sdaweb-vc-img-top-cover .sdaweb-vc-card-title { color: #fff; }
.sdaweb-vc-img-top-cover .sdaweb-vc-card-body { color: rgba(255,255,255,0.9); }
.sdaweb-vc-img-top-cover .sdaweb-vc-card-intro { color: rgba(255,255,255,0.85); }
.sdaweb-vc-img-top-cover .sdaweb-vc-card-link { color: #fff; }
.sdaweb-vc-img-top-cover .sdaweb-vc-icon { background: rgba(255,255,255,0.15); color: #fff; }

/* 8. top-arch — curved bottom edge */
.sdaweb-vc-img-top-arch > .sdaweb-vc-card-image {
    margin: -40px -34px 24px;
    position: relative;
    border-radius: var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 0;
}
.sdaweb-vc-img-top-arch > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 200px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-top-arch > .sdaweb-vc-card-image::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 40px;
    background: var(--sdaweb-vc-bg, #fffdf9);
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
}

/* 9. top-polaroid — thick white border, slight tilt */
.sdaweb-vc-img-top-polaroid > .sdaweb-vc-card-image {
    margin: 0 auto 20px;
    max-width: 85%;
    padding: 8px 8px 24px;
    background: #fff;
    border-radius: 2px;
    box-shadow: 0 3px 12px rgba(0,0,0,0.12);
    transform: rotate(-1.5deg);
}
.sdaweb-vc-img-top-polaroid > .sdaweb-vc-card-image img {
    height: calc(var(--sdaweb-vc-img-height, 160px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 1px;
}

/* 10. top-letterbox — wide cinematic crop */
.sdaweb-vc-img-top-letterbox > .sdaweb-vc-card-image {
    margin: -40px -34px 24px;
    border-radius: var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 0;
}
.sdaweb-vc-img-top-letterbox > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 100px) * var(--sdaweb-vc-img-scale, 1)); }

/* 11. top-side — image left, content right */
.sdaweb-vc-img-top-side {
    flex-direction: row;
    padding: 0;
}
.sdaweb-vc-side-panel-image {
    flex: 0 0 40%;
    max-width: 40%;
    overflow: hidden;
}
.sdaweb-vc-side-panel-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.sdaweb-vc-side-panel-content {
    flex: 1;
    padding: 30px 28px;
    display: flex;
    flex-direction: column;
    min-width: 0;
}
@media (max-width: 680px) {
    .sdaweb-vc-img-top-side { flex-direction: column; }
    .sdaweb-vc-side-panel-image { flex: none; max-width: 100%; height: 180px; }
    .sdaweb-vc-side-panel-content { padding: 24px 20px; }
}

/* 12a. top-diamond — 45° rotated square crop */
.sdaweb-vc-img-top-diamond { text-align: center; }
.sdaweb-vc-img-top-diamond > .sdaweb-vc-card-image {
    width: calc(var(--sdaweb-vc-img-height, 120px) * var(--sdaweb-vc-img-scale, 1));
    height: calc(var(--sdaweb-vc-img-height, 120px) * var(--sdaweb-vc-img-scale, 1));
    margin: 10px auto 28px;
    transform: rotate(45deg);
    border-radius: 12px;
    border: 3px solid var(--sdaweb-vc-accent, #a81010);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}
.sdaweb-vc-img-top-diamond > .sdaweb-vc-card-image img {
    width: 100%;
    height: 100%;
    transform: rotate(-45deg) scale(1.42);
}
.sdaweb-vc-img-top-diamond .sdaweb-vc-card-header { justify-content: center; }

/* 12b. top-hexagon — hexagonal clip-path crop */
.sdaweb-vc-img-top-hexagon { text-align: center; }
.sdaweb-vc-img-top-hexagon > .sdaweb-vc-card-image {
    width: calc(var(--sdaweb-vc-img-height, 130px) * var(--sdaweb-vc-img-scale, 1));
    height: calc(var(--sdaweb-vc-img-height, 130px) * var(--sdaweb-vc-img-scale, 1));
    margin: 0 auto 24px;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}
.sdaweb-vc-img-top-hexagon > .sdaweb-vc-card-image img {
    width: 100%;
    height: 100%;
}
.sdaweb-vc-img-top-hexagon .sdaweb-vc-card-header { justify-content: center; }

/* 12c. top-stamp — small image in top-right corner, text wraps */
.sdaweb-vc-img-top-stamp > .sdaweb-vc-card-image {
    float: right;
    width: calc(var(--sdaweb-vc-img-height, 80px) * 1.25 * var(--sdaweb-vc-img-scale, 1));
    height: calc(var(--sdaweb-vc-img-height, 80px) * var(--sdaweb-vc-img-scale, 1));
    margin: 0 0 12px 16px;
    border-radius: 4px;
    border: 3px solid var(--sdaweb-vc-accent, #a81010);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.sdaweb-vc-img-top-stamp > .sdaweb-vc-card-image img {
    width: 100%;
    height: 100%;
}
.sdaweb-vc-img-top-stamp::after {
    content: '';
    display: table;
    clear: both;
}

/* 13. top-overlay — image with accent color wash */
.sdaweb-vc-img-top-overlay > .sdaweb-vc-card-image {
    margin: -40px -34px 24px;
    position: relative;
    border-radius: var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px) 0 0;
}
.sdaweb-vc-img-top-overlay > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 200px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-top-overlay > .sdaweb-vc-card-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--sdaweb-vc-accent, #a81010);
    opacity: 0.25;
    mix-blend-mode: multiply;
}

/* ============ BOTTOM POSITION (7 styles) ============ */

/* Push bottom images to card edge in flex column */
[class*="sdaweb-vc-img-bottom-"] > .sdaweb-vc-card-image {
    margin-top: auto;
}

/* 13. bottom-banner — full-width at bottom */
.sdaweb-vc-img-bottom-banner { padding-bottom: 0 !important; }
.sdaweb-vc-img-bottom-banner > .sdaweb-vc-card-image {
    margin: auto -34px 0;
    border-radius: 0 0 var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px);
}
.sdaweb-vc-img-bottom-banner > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 180px) * var(--sdaweb-vc-img-scale, 1)); }

/* 14. bottom-rounded — padded rounded at bottom */
.sdaweb-vc-img-bottom-rounded > .sdaweb-vc-card-image {
    border-radius: 10px;
}
.sdaweb-vc-img-bottom-rounded > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 160px) * var(--sdaweb-vc-img-scale, 1)); }

/* 15. bottom-angled — diagonal top edge */
.sdaweb-vc-img-bottom-angled { padding-bottom: 0 !important; }
.sdaweb-vc-img-bottom-angled > .sdaweb-vc-card-image {
    margin: auto -34px 0;
    position: relative;
    border-radius: 0 0 var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px);
}
.sdaweb-vc-img-bottom-angled > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 180px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-bottom-angled > .sdaweb-vc-card-image::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 40px;
    background: var(--sdaweb-vc-bg, #fffdf9);
    clip-path: polygon(0 0, 100% 0, 0 100%);
    z-index: 1;
}

/* 16. bottom-fade — fades in from card bg */
.sdaweb-vc-img-bottom-fade { padding-bottom: 0 !important; }
.sdaweb-vc-img-bottom-fade > .sdaweb-vc-card-image {
    margin: auto -34px 0;
    position: relative;
    border-radius: 0 0 var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px);
}
.sdaweb-vc-img-bottom-fade > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 180px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-bottom-fade > .sdaweb-vc-card-image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(to top, transparent 0%, var(--sdaweb-vc-bg, #fffdf9) 100%);
    z-index: 1;
}

/* 17. bottom-framed — accent border at bottom */
.sdaweb-vc-img-bottom-framed > .sdaweb-vc-card-image {
    padding: 5px;
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
    border-radius: 8px;
}
.sdaweb-vc-img-bottom-framed > .sdaweb-vc-card-image img {
    height: calc(var(--sdaweb-vc-img-height, 150px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 4px;
}

/* 18. bottom-peek — half-visible, peeking up */
.sdaweb-vc-img-bottom-peek { padding-bottom: 0 !important; }
.sdaweb-vc-img-bottom-peek > .sdaweb-vc-card-image {
    margin: auto -34px 0;
    height: calc(var(--sdaweb-vc-img-height, 120px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 0 0 var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px);
}
.sdaweb-vc-img-bottom-peek > .sdaweb-vc-card-image img {
    height: calc(var(--sdaweb-vc-img-height, 120px) * var(--sdaweb-vc-img-scale, 1) * 1.67);
    margin-top: calc(var(--sdaweb-vc-img-height, 120px) * var(--sdaweb-vc-img-scale, 1) * -0.33);
}

/* 19. bottom-arch — curved top edge at bottom */
.sdaweb-vc-img-bottom-arch { padding-bottom: 0 !important; }
.sdaweb-vc-img-bottom-arch > .sdaweb-vc-card-image {
    margin: auto -34px 0;
    position: relative;
    border-radius: 0 0 var(--sdaweb-vc-radius, 12px) var(--sdaweb-vc-radius, 12px);
}
.sdaweb-vc-img-bottom-arch > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 180px) * var(--sdaweb-vc-img-scale, 1)); }
.sdaweb-vc-img-bottom-arch > .sdaweb-vc-card-image::before {
    content: '';
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    height: 40px;
    background: var(--sdaweb-vc-bg, #fffdf9);
    border-radius: 0 0 50% 50% / 0 0 100% 100%;
    z-index: 1;
}

/* ============ MID POSITION (3 styles) — below heading ============ */

/* 19. mid-banner — full-width strip */
.sdaweb-vc-img-mid-banner > .sdaweb-vc-card-image {
    margin: 0 -34px 18px;
}
.sdaweb-vc-img-mid-banner > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 140px) * var(--sdaweb-vc-img-scale, 1)); }

/* 20. mid-rounded — rounded, padded */
.sdaweb-vc-img-mid-rounded > .sdaweb-vc-card-image {
    margin-bottom: 18px;
    border-radius: 10px;
}
.sdaweb-vc-img-mid-rounded > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 130px) * var(--sdaweb-vc-img-scale, 1)); }

/* 21. mid-strip — thin decorative landscape strip */
.sdaweb-vc-img-mid-strip > .sdaweb-vc-card-image {
    margin: 0 -34px 18px;
}
.sdaweb-vc-img-mid-strip > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 60px) * var(--sdaweb-vc-img-scale, 1)); }

/* 21a. mid-circle — small circular image below heading */
.sdaweb-vc-img-mid-circle > .sdaweb-vc-card-image {
    width: calc(var(--sdaweb-vc-img-height, 80px) * var(--sdaweb-vc-img-scale, 1));
    height: calc(var(--sdaweb-vc-img-height, 80px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 50%;
    margin: 0 auto 18px;
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
}
.sdaweb-vc-img-mid-circle > .sdaweb-vc-card-image img {
    width: 100%;
    height: 100%;
}

/* ============ SUB POSITION (3 styles) — below subheading ============ */

/* 22. sub-banner — full-width below intro */
.sdaweb-vc-img-sub-banner > .sdaweb-vc-card-image {
    margin: 0 -34px 18px;
}
.sdaweb-vc-img-sub-banner > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 130px) * var(--sdaweb-vc-img-scale, 1)); }

/* 23. sub-circle — small circle below intro */
.sdaweb-vc-img-sub-circle > .sdaweb-vc-card-image {
    width: calc(var(--sdaweb-vc-img-height, 80px) * var(--sdaweb-vc-img-scale, 1));
    height: calc(var(--sdaweb-vc-img-height, 80px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 50%;
    margin: 0 auto 18px;
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
}
.sdaweb-vc-img-sub-circle > .sdaweb-vc-card-image img {
    width: 100%;
    height: 100%;
}

/* 24. sub-framed — framed below intro */
.sdaweb-vc-img-sub-framed > .sdaweb-vc-card-image {
    margin-bottom: 18px;
    padding: 4px;
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
    border-radius: 6px;
}
.sdaweb-vc-img-sub-framed > .sdaweb-vc-card-image img {
    height: calc(var(--sdaweb-vc-img-height, 120px) * var(--sdaweb-vc-img-scale, 1));
    border-radius: 3px;
}

/* 25. sub-strip — thin decorative strip below subheading */
.sdaweb-vc-img-sub-strip > .sdaweb-vc-card-image {
    margin: 0 -34px 18px;
}
.sdaweb-vc-img-sub-strip > .sdaweb-vc-card-image img { height: calc(var(--sdaweb-vc-img-height, 60px) * var(--sdaweb-vc-img-scale, 1)); }

/* ---- Animations ---- */
@keyframes sdawebVcFadeUp {
    from {
        opacity: 0;
        transform: translateY(28px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ---- Stagger Animations ---- */
.sdaweb-vc-anim-stagger .sdaweb-vc-card {
    opacity: 0;
    transition: opacity 0.5s ease, transform 0.5s ease;
    animation: none;
}
.sdaweb-vc-anim-stagger .sdaweb-vc-card.sdaweb-vc-visible {
    opacity: 1;
}
.sdaweb-vc-anim-stagger-slide-up .sdaweb-vc-card {
    transform: translateY(30px);
}
.sdaweb-vc-anim-stagger-slide-up .sdaweb-vc-card.sdaweb-vc-visible {
    transform: translateY(0);
}

/* ---- Accessibility: Reduced Motion ---- */
@media (prefers-reduced-motion: reduce) {
    .sdaweb-vc-card,
    .sdaweb-vc-intro {
        animation: none;
    }
    .sdaweb-vc-card {
        transition: none;
    }
    .sdaweb-vc-anim-stagger .sdaweb-vc-card,
    .sdaweb-vc-anim-stagger-slide-up .sdaweb-vc-card {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* ==== SECTION BACKGROUND ==== */
.sdaweb-vc-section-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.sdaweb-vc-section-has-bg > *:not(.sdaweb-vc-section-overlay) {
    position: relative;
    z-index: 1;
}

/* ==== DARK MODE ==== */

/* Dark mode respects explicit card colors via inline styles (higher specificity) */

/* --- Dark mode: forced --- */

/* Section header */
.sdaweb-vc-mode-dark .sdaweb-vc-eyebrow { color: #a8a099; }
.sdaweb-vc-mode-dark .sdaweb-vc-heading { color: #e8c8a8; }
.sdaweb-vc-mode-dark .sdaweb-vc-divider { background: #8b6b4a; }

/* Card style: Warm Paper */
.sdaweb-vc-mode-dark .sdaweb-vc-style-warm-paper {
    background: var(--sdaweb-vc-bg, #2a2118);
    border-color: var(--sdaweb-vc-border, #3d3228);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.sdaweb-vc-mode-dark .sdaweb-vc-style-warm-paper.sdaweb-vc-hover-lift:hover {
    border-color: #4d4238;
}

/* Card style: Clean Minimal */
.sdaweb-vc-mode-dark .sdaweb-vc-style-clean {
    background: var(--sdaweb-vc-bg, #1e1e1e);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
}

/* Card style: Glassmorphism */
.sdaweb-vc-mode-dark .sdaweb-vc-style-glass {
    background: var(--sdaweb-vc-bg, rgba(255, 255, 255, 0.06));
    border-color: var(--sdaweb-vc-border, rgba(255, 255, 255, 0.1));
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

/* Card style: Elevated Flat */
.sdaweb-vc-mode-dark .sdaweb-vc-style-elevated {
    background: var(--sdaweb-vc-bg, #252525);
    border-color: var(--sdaweb-vc-border, #353028);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
}

/* Card style: Outlined */
.sdaweb-vc-mode-dark .sdaweb-vc-style-outlined {
    background: var(--sdaweb-vc-bg, #1e1e1e);
    border-color: var(--sdaweb-vc-accent, #c94040);
}

/* Card style: Soft Glow */
.sdaweb-vc-mode-dark .sdaweb-vc-style-soft-glow {
    background: var(--sdaweb-vc-bg, #1e1e1e);
    border-color: var(--sdaweb-vc-border, rgba(200, 80, 80, 0.2));
    box-shadow: 0 0 20px rgba(200, 80, 80, 0.1);
}

/* Card style: Ruled */
.sdaweb-vc-mode-dark .sdaweb-vc-style-ruled {
    background: var(--sdaweb-vc-bg, #1e1e1e);
    border-color: var(--sdaweb-vc-border, #333);
    border-left-color: var(--sdaweb-vc-accent, #c94040);
    box-shadow: none;
}

/* Card text colors (dark mode fallbacks) */
.sdaweb-vc-mode-dark .sdaweb-vc-card-title {
    color: var(--sdaweb-vc-heading-color, #e8e0d4);
}
.sdaweb-vc-mode-dark .sdaweb-vc-card-body {
    color: var(--sdaweb-vc-body-color, #c8c0b4);
}
.sdaweb-vc-mode-dark .sdaweb-vc-card-intro {
    color: var(--sdaweb-vc-intro-color, var(--sdaweb-vc-accent));
}
.sdaweb-vc-mode-dark .sdaweb-vc-card-link {
    color: var(--sdaweb-vc-link-color, var(--sdaweb-vc-accent, #a81010));
}

/* Card image overlays (angled, fade, arch) in dark mode */
.sdaweb-vc-mode-dark .sdaweb-vc-img-top-angled > .sdaweb-vc-card-image::after,
.sdaweb-vc-mode-dark .sdaweb-vc-img-top-arch > .sdaweb-vc-card-image::after {
    background: var(--sdaweb-vc-bg, #2a2118);
}
.sdaweb-vc-mode-dark .sdaweb-vc-img-top-fade > .sdaweb-vc-card-image::after {
    background: linear-gradient(to bottom, transparent 0%, var(--sdaweb-vc-bg, #2a2118) 100%);
}
.sdaweb-vc-mode-dark .sdaweb-vc-img-bottom-angled > .sdaweb-vc-card-image::before,
.sdaweb-vc-mode-dark .sdaweb-vc-img-bottom-arch > .sdaweb-vc-card-image::before {
    background: var(--sdaweb-vc-bg, #2a2118);
}
.sdaweb-vc-mode-dark .sdaweb-vc-img-bottom-fade > .sdaweb-vc-card-image::before {
    background: linear-gradient(to top, transparent 0%, var(--sdaweb-vc-bg, #2a2118) 100%);
}

/* Hover animations in dark mode */
.sdaweb-vc-mode-dark .sdaweb-vc-hover-lift:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}
.sdaweb-vc-mode-dark .sdaweb-vc-hover-grow:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}
.sdaweb-vc-mode-dark .sdaweb-vc-hover-tilt:hover {
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
}

/* Button link style in dark mode */
.sdaweb-vc-mode-dark .sdaweb-vc-link-button .sdaweb-vc-card-link {
    color: #fff;
}

/* Polaroid in dark mode */
.sdaweb-vc-mode-dark .sdaweb-vc-img-top-polaroid > .sdaweb-vc-card-image {
    background: #333;
}

/* --- Dark mode: auto (follows OS preference) --- */
@media (prefers-color-scheme: dark) {

    /* Section header */
    .sdaweb-vc-mode-auto .sdaweb-vc-eyebrow { color: #a8a099; }
    .sdaweb-vc-mode-auto .sdaweb-vc-heading { color: #e8c8a8; }
    .sdaweb-vc-mode-auto .sdaweb-vc-divider { background: #8b6b4a; }

    /* Card style: Warm Paper */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-warm-paper {
        background: var(--sdaweb-vc-bg, #2a2118);
        border-color: var(--sdaweb-vc-border, #3d3228);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-style-warm-paper.sdaweb-vc-hover-lift:hover {
        border-color: #4d4238;
    }

    /* Card style: Clean Minimal */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-clean {
        background: var(--sdaweb-vc-bg, #1e1e1e);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
    }

    /* Card style: Glassmorphism */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-glass {
        background: var(--sdaweb-vc-bg, rgba(255, 255, 255, 0.06));
        border-color: var(--sdaweb-vc-border, rgba(255, 255, 255, 0.1));
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    }

    /* Card style: Elevated Flat */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-elevated {
        background: var(--sdaweb-vc-bg, #252525);
        border-color: var(--sdaweb-vc-border, #353028);
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
    }

    /* Card style: Outlined */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-outlined {
        background: var(--sdaweb-vc-bg, #1e1e1e);
        border-color: var(--sdaweb-vc-accent, #c94040);
    }

    /* Card style: Soft Glow */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-soft-glow {
        background: var(--sdaweb-vc-bg, #1e1e1e);
        border-color: var(--sdaweb-vc-border, rgba(200, 80, 80, 0.2));
        box-shadow: 0 0 20px rgba(200, 80, 80, 0.1);
    }

    /* Card style: Ruled */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-ruled {
        background: var(--sdaweb-vc-bg, #1e1e1e);
        border-color: var(--sdaweb-vc-border, #333);
        border-left-color: var(--sdaweb-vc-accent, #c94040);
        box-shadow: none;
    }

    /* Card text colors (dark mode fallbacks) */
    .sdaweb-vc-mode-auto .sdaweb-vc-card-title {
        color: var(--sdaweb-vc-heading-color, #e8e0d4);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-card-body {
        color: var(--sdaweb-vc-body-color, #c8c0b4);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-card-intro {
        color: var(--sdaweb-vc-intro-color, var(--sdaweb-vc-accent));
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-card-link {
        color: var(--sdaweb-vc-link-color, var(--sdaweb-vc-accent, #a81010));
    }

    /* Card image overlays in dark mode */
    .sdaweb-vc-mode-auto .sdaweb-vc-img-top-angled > .sdaweb-vc-card-image::after,
    .sdaweb-vc-mode-auto .sdaweb-vc-img-top-arch > .sdaweb-vc-card-image::after {
        background: var(--sdaweb-vc-bg, #2a2118);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-img-top-fade > .sdaweb-vc-card-image::after {
        background: linear-gradient(to bottom, transparent 0%, var(--sdaweb-vc-bg, #2a2118) 100%);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-img-bottom-angled > .sdaweb-vc-card-image::before,
    .sdaweb-vc-mode-auto .sdaweb-vc-img-bottom-arch > .sdaweb-vc-card-image::before {
        background: var(--sdaweb-vc-bg, #2a2118);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-img-bottom-fade > .sdaweb-vc-card-image::before {
        background: linear-gradient(to top, transparent 0%, var(--sdaweb-vc-bg, #2a2118) 100%);
    }

    /* Hover animations in dark mode */
    .sdaweb-vc-mode-auto .sdaweb-vc-hover-lift:hover {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-hover-grow:hover {
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-hover-tilt:hover {
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
    }

    /* Button link style in dark mode */
    .sdaweb-vc-mode-auto .sdaweb-vc-link-button .sdaweb-vc-card-link {
        color: #fff;
    }

    /* Polaroid in dark mode */
    .sdaweb-vc-mode-auto .sdaweb-vc-img-top-polaroid > .sdaweb-vc-card-image {
        background: #333;
    }

    /* Card style: Editorial Split */
    .sdaweb-vc-mode-auto .sdaweb-vc-style-editorial {
        background: var(--sdaweb-vc-bg, #1e1e1e);
        border-color: var(--sdaweb-vc-border, #2a2a2a);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-style-editorial .sdaweb-vc-card-title {
        color: var(--sdaweb-vc-heading-color, #e8e0d4);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-style-editorial .sdaweb-vc-card-body {
        color: var(--sdaweb-vc-body-color, #c8c0b4);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-style-editorial.sdaweb-vc-editorial-inset .sdaweb-vc-editorial-image::after {
        background: linear-gradient( to right, transparent 60%, var(--sdaweb-vc-bg, #1e1e1e) 100% );
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-style-editorial.sdaweb-vc-editorial-elevated {
        box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
    }
    .sdaweb-vc-mode-auto .sdaweb-vc-editorial-divider .sdaweb-vc-editorial-image {
        border-color: var(--sdaweb-vc-border, #2a2a2a);
    }
}

/* ---- Frontend Filter Bar ---- */
.sdaweb-vc-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin-bottom: 24px;
}

.sdaweb-vc-filter-pill {
    padding: 8px 20px;
    border: 2px solid #e0e0e0;
    border-radius: 24px;
    background: #fff;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #555;
    transition: all 0.2s ease;
    line-height: 1.4;
}

.sdaweb-vc-filter-pill:hover {
    border-color: #999;
    color: #333;
}

.sdaweb-vc-filter-pill.active {
    background: var(--sdaweb-vc-accent, #a81010);
    border-color: var(--sdaweb-vc-accent, #a81010);
    color: #fff;
}

/* Filter animation */
.sdaweb-vc-card[data-groups] {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.sdaweb-vc-card.sdaweb-vc-filter-hidden {
    opacity: 0;
    transform: scale(0.95);
    position: absolute;
    pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
    .sdaweb-vc-card[data-groups] {
        transition: none;
    }
    .sdaweb-vc-card.sdaweb-vc-filter-hidden {
        transform: none;
    }
}

/* ================================================================
   E – EDITORIAL SPLIT STYLE
   Full-width card with 50/50 image + content split.
   Image alternates left/right based on card index or manual setting.
   ================================================================ */

.sdaweb-vc-style-editorial {
    display: flex;
    flex-direction: row;
    padding: 0;
    overflow: hidden;
    min-height: 340px;
    max-height: 460px;
    border-radius: var(--sdaweb-vc-radius, 12px);
    background: var(--sdaweb-vc-bg, #fffdf9);
    border: 1px solid var(--sdaweb-vc-border, #e8e2d8);
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}

/* ---- Image panel ---- */
.sdaweb-vc-editorial-image {
    flex: 0 0 50%;
    max-width: 50%;
    overflow: hidden;
    position: relative;
    min-height: 320px;
    max-height: 460px;
}

.sdaweb-vc-editorial-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

.sdaweb-vc-editorial-image-placeholder {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, var(--sdaweb-vc-accent, #a81010) 0%, rgba(168,16,16,0.4) 100%);
}

/* ---- Content panel ---- */
.sdaweb-vc-card-eyebrow {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 10px;
    padding: 3px 10px;
    border-radius: 4px;
    background-color: color-mix(in srgb, currentColor 12%, transparent);
}

/* On desktop editorial, eyebrow spans full width as a section streak */
.sdaweb-vc-style-editorial .sdaweb-vc-card-eyebrow {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border-radius: 4px 4px 0 0;
    margin-bottom: 14px;
    padding: 5px 12px;
}

.sdaweb-vc-editorial-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 32px 40px;
    min-width: 0;
    box-sizing: border-box;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* ---- Spacing between stacked editorial cards (non-flush mode) ---- */
.sdaweb-vc-style-editorial + .sdaweb-vc-style-editorial {
    margin-top: 20px;
    border-top: none;
}


/* ---- Image LEFT (default for even-index): image first in DOM ---- */
.sdaweb-vc-editorial-image-left {
    flex-direction: row;
}

/* ---- Image RIGHT (odd-index): reverse order ---- */
.sdaweb-vc-editorial-image-right {
    flex-direction: row-reverse;
}

/* ---- Editorial typography ---- */
.sdaweb-vc-style-editorial .sdaweb-vc-card-header {
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.sdaweb-vc-style-editorial .sdaweb-vc-card-title {
    font-size: clamp(1.4rem, 2.5vw, 2rem);
    line-height: 1.25;
    margin-bottom: 16px;
    color: var(--sdaweb-vc-heading-color, #5b3000);
}

.sdaweb-vc-style-editorial .sdaweb-vc-card-body {
    font-size: 1.05rem;
    line-height: 1.65;
    color: var(--sdaweb-vc-body-color, #3a3a3a);
    margin-bottom: 16px;
}

.sdaweb-vc-style-editorial .sdaweb-vc-card-intro {
    font-size: 1.05rem;
    line-height: 1.55;
    color: var(--sdaweb-vc-intro-color, #6b6b6b);
    margin-bottom: 16px;
}

.sdaweb-vc-style-editorial .sdaweb-vc-icon {
    margin-bottom: 18px;
}

.sdaweb-vc-style-editorial .sdaweb-vc-card-link {
    margin-top: auto;
    align-self: flex-start;
}


/* ---- Editorial cards: disable base fade animation, always visible ---- */
/* Large split cards are too important to risk being stuck invisible        */
.sdaweb-vc-style-editorial {
    animation: none !important;
    opacity: 1 !important;
}

/* ---- Hover effect on editorial ---- */
.sdaweb-vc-style-editorial.sdaweb-vc-hover-lift:hover {
    transform: none;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.12);
}

.sdaweb-vc-style-editorial.sdaweb-vc-hover-glow:hover {
    border-color: var(--sdaweb-vc-accent, #a81010);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sdaweb-vc-accent, #a81010) 20%, transparent);
}

/* ---- Accent bar: left edge on image-left, right edge on image-right ---- */
.sdaweb-vc-style-editorial::before {
    content: '';
    position: absolute;
    top: 0;
    width: 4px;
    height: 100%;
    background: var(--sdaweb-vc-accent, #a81010);
    border-radius: 0;
    transition: height 0.3s ease;
}

.sdaweb-vc-editorial-image-left::before {
    left: 0;
}

.sdaweb-vc-editorial-image-right::before {
    right: 0;
    left: auto;
}

/* ---- Dark mode ---- */
.sdaweb-vc-mode-dark .sdaweb-vc-style-editorial {
    background: var(--sdaweb-vc-bg, #1e1a16);
    border-color: var(--sdaweb-vc-border, #3a3228);
}

.sdaweb-vc-mode-dark .sdaweb-vc-style-editorial .sdaweb-vc-card-title {
    color: var(--sdaweb-vc-heading-color, #f0e8d8);
}

.sdaweb-vc-mode-dark .sdaweb-vc-style-editorial .sdaweb-vc-card-body {
    color: var(--sdaweb-vc-body-color, #c8bfb0);
}

/* ---- Responsive: tablet (stack at 768px) ---- */
@media (max-width: 768px) {
    .sdaweb-vc-style-editorial {
        flex-direction: column !important;
        min-height: auto !important;
        max-height: none !important;
    }

    /* On mobile, replace auto-margin link push with a simple top margin */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-link {
        margin-top: 16px !important;
    }

    /* Tighter intro line-height and spacing on mobile */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-intro {
        line-height: 1.5;
        margin-top: 4px;
        margin-bottom: 10px;
    }

    /* Tighter spacing after title on mobile */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-title {
        margin-bottom: 4px !important;
        line-height: 1.2;
    }

    /* Body text tighter on mobile */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-body {
        line-height: 1.6;
        margin-bottom: 0 !important;
    }

    /* Tighter eyebrow margin on mobile */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-eyebrow {
        margin-bottom: 8px !important;
    }

    /* On mobile, eyebrow is compact — full-width streak looks odd when stacked */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-eyebrow {
        display: inline-block;
        width: auto;
        align-self: flex-start;
        border-radius: 4px;
        padding: 3px 10px;
        margin-bottom: 10px;
    }

    .sdaweb-vc-editorial-image {
        flex: 0 0 auto !important;  /* override desktop flex-basis percentage */
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        height: 280px !important;
        min-height: 280px !important;
    }

    .sdaweb-vc-editorial-content {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 16px 20px 22px !important;
    }

    .sdaweb-vc-style-editorial::before {
        width: 100%;
        height: 4px;
        top: 0;
        left: 0;
        right: auto;
    }

    /* On mobile: full gap between stacked cards */
    .sdaweb-vc-style-editorial + .sdaweb-vc-style-editorial {
        margin-top: 24px !important;
        border-top: none !important;
    }
}

/* ---- Editorial: WIDE landscape phones (680–1024px, short viewport) ---- */
/* Keeps the side-by-side layout instead of stacking — optimized for      */
/* iPhone 16 Pro Max landscape (932×430) and similar large phones.        */
@media (min-width: 680px) and (max-width: 1024px) and (orientation: landscape) and (max-height: 500px) {

    /* Section: tighten padding */
    .sdaweb-vc-section {
        padding: 16px 16px 20px !important;
    }

    /* Intro: compact */
    .sdaweb-vc-intro {
        margin-bottom: 20px !important;
    }
    .sdaweb-vc-eyebrow {
        font-size: 0.65rem !important;
        margin-bottom: 4px !important;
    }
    .sdaweb-vc-heading {
        font-size: clamp(1.2rem, 3vw, 1.6rem) !important;
        line-height: 1.15 !important;
    }
    .sdaweb-vc-divider {
        margin: 10px auto 0 !important;
        width: 36px !important;
        height: 2px !important;
    }

    /* Grid: tighter gap */
    .sdaweb-vc-grid {
        gap: 14px !important;
    }

    /* Editorial card: KEEP side-by-side, fit viewport height */
    .sdaweb-vc-style-editorial {
        flex-direction: row !important;
        min-height: 200px !important;
        max-height: 320px !important;
        border-radius: 10px !important;
    }

    /* Override scoped CSS min-height from admin (ID-scoped selectors) */
    .sdaweb-vc-grid .sdaweb-vc-style-editorial {
        min-height: 200px !important;
    }
    .sdaweb-vc-grid .sdaweb-vc-editorial-image {
        min-height: 200px !important;
    }

    /* Preserve row-reverse for image-right cards */
    .sdaweb-vc-editorial-image-right {
        flex-direction: row-reverse !important;
    }

    /* Image panel: 35% width, constrained height */
    .sdaweb-vc-editorial-image {
        flex: 0 0 35% !important;
        max-width: 35% !important;
        width: 35% !important;
        height: auto !important;
        min-height: 200px !important;
        max-height: 320px !important;
    }

    /* Content panel: compact padding, tighter layout */
    .sdaweb-vc-editorial-content {
        width: 65% !important;
        max-width: 65% !important;
        padding: 14px 20px 16px !important;
        box-sizing: border-box !important;
    }

    /* Eyebrow: compact pill */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-eyebrow {
        display: inline-block !important;
        width: auto !important;
        align-self: flex-start !important;
        border-radius: 3px !important;
        padding: 2px 8px !important;
        margin-bottom: 6px !important;
        font-size: 10px !important;
    }

    /* Title: smaller */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-title {
        font-size: 1.1rem !important;
        line-height: 1.2 !important;
        margin-bottom: 6px !important;
    }

    /* Intro: tighter */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-intro {
        font-size: 0.85rem !important;
        line-height: 1.4 !important;
        margin-top: 2px !important;
        margin-bottom: 6px !important;
    }

    /* Body: smaller, tighter, clamp to 3 lines */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-body {
        font-size: 0.82rem !important;
        line-height: 1.5 !important;
        margin-bottom: 8px !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    /* Icon: smaller */
    .sdaweb-vc-style-editorial .sdaweb-vc-icon {
        margin-bottom: 8px !important;
        width: 36px !important;
        height: 36px !important;
        border-radius: 8px !important;
    }
    .sdaweb-vc-style-editorial .sdaweb-vc-icon svg,
    .sdaweb-vc-style-editorial .sdaweb-vc-icon img,
    .sdaweb-vc-style-editorial .sdaweb-vc-icon .dashicons {
        width: 18px !important;
        height: 18px !important;
        font-size: 18px !important;
    }

    /* Link: tighter */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-link {
        margin-top: auto !important;
        padding-top: 8px !important;
        font-size: 0.78rem !important;
    }

    /* Accent bar: thinner */
    .sdaweb-vc-style-editorial::before {
        width: 3px !important;
    }

    /* Card spacing */
    .sdaweb-vc-style-editorial + .sdaweb-vc-style-editorial {
        margin-top: 14px !important;
    }
}

@media (max-width: 480px) {
    .sdaweb-vc-editorial-image {
        height: 220px !important;
        min-height: 220px !important;
    }

    .sdaweb-vc-editorial-content {
        padding: 24px 20px;
    }
}

/* ---- Editorial: NARROW landscape phones (<680px, e.g. iPhone SE landscape) ---- */
/* These phones are too narrow for side-by-side, so we stack vertically.           */
@media (max-width: 679px) and (orientation: landscape) {

    /* Section: tighten */
    .sdaweb-vc-section {
        padding: 14px 14px 18px !important;
    }
    .sdaweb-vc-intro {
        margin-bottom: 16px !important;
    }
    .sdaweb-vc-eyebrow {
        font-size: 0.6rem !important;
        margin-bottom: 4px !important;
    }
    .sdaweb-vc-heading {
        font-size: clamp(1.1rem, 3.5vw, 1.4rem) !important;
        line-height: 1.15 !important;
    }
    .sdaweb-vc-divider {
        margin: 8px auto 0 !important;
        width: 30px !important;
        height: 2px !important;
    }

    /* Grid */
    .sdaweb-vc-grid {
        gap: 12px !important;
    }

    /* Card: stacked vertical */
    .sdaweb-vc-style-editorial {
        flex-direction: column !important;
        min-height: auto !important;
        max-height: none !important;
    }

    /* Image: taller than before (was 180px, now 220px) */
    .sdaweb-vc-editorial-image {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        height: 220px !important;
        min-height: 220px !important;
    }

    /* Content: compact */
    .sdaweb-vc-editorial-content {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 12px 16px 14px !important;
    }

    /* Eyebrow */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-eyebrow {
        display: inline-block !important;
        width: auto !important;
        align-self: flex-start !important;
        border-radius: 3px !important;
        padding: 2px 8px !important;
        margin-bottom: 5px !important;
        font-size: 10px !important;
    }

    /* Title */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-title {
        font-size: 1rem !important;
        line-height: 1.2 !important;
        margin-bottom: 4px !important;
    }

    /* Intro */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-intro {
        font-size: 0.82rem !important;
        line-height: 1.35 !important;
        margin-top: 2px !important;
        margin-bottom: 4px !important;
    }

    /* Body: clamp to 2 lines */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-body {
        font-size: 0.78rem !important;
        line-height: 1.45 !important;
        margin-bottom: 6px !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    /* Icon: smaller */
    .sdaweb-vc-style-editorial .sdaweb-vc-icon {
        margin-bottom: 6px !important;
        width: 32px !important;
        height: 32px !important;
        border-radius: 7px !important;
    }
    .sdaweb-vc-style-editorial .sdaweb-vc-icon svg,
    .sdaweb-vc-style-editorial .sdaweb-vc-icon img,
    .sdaweb-vc-style-editorial .sdaweb-vc-icon .dashicons {
        width: 16px !important;
        height: 16px !important;
        font-size: 16px !important;
    }

    /* Link */
    .sdaweb-vc-style-editorial .sdaweb-vc-card-link {
        margin-top: auto !important;
        padding-top: 6px !important;
        font-size: 0.75rem !important;
    }

    /* Accent bar: horizontal on top when stacked */
    .sdaweb-vc-style-editorial::before {
        width: 100% !important;
        height: 3px !important;
        top: 0 !important;
        left: 0 !important;
        right: auto !important;
    }

    /* Card spacing */
    .sdaweb-vc-style-editorial + .sdaweb-vc-style-editorial {
        margin-top: 12px !important;
    }
}

/* ---- Admin style-preview thumbnail for editorial ---- */
.sdaweb-vc-style-preview.editorial {
    background: linear-gradient(to right, #e0ddd8 50%, #fffdf9 50%);
    border: 1px solid #d4cfc8;
    position: relative;
}

.sdaweb-vc-style-preview.editorial::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 100%;
    background: #a81010;
}

/* ---- Editorial Sub-Styles ---- */

/* ① Clean (default) — no extra rules needed, base editorial handles it */

/* ② Bordered — accent-coloured border around the whole card */
.sdaweb-vc-style-editorial.sdaweb-vc-editorial-bordered {
    border: 2px solid var(--sdaweb-vc-accent, #a81010);
    box-shadow: none;
}
.sdaweb-vc-style-editorial.sdaweb-vc-editorial-bordered::before {
    display: none; /* hide accent bar — the full border replaces it */
}

/* ③ Inset — image has an inner shadow to give a pressed / inset look */
.sdaweb-vc-style-editorial.sdaweb-vc-editorial-inset .sdaweb-vc-editorial-image::after {
    content: '';
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.25);
    pointer-events: none;
}
.sdaweb-vc-style-editorial.sdaweb-vc-editorial-inset .sdaweb-vc-editorial-image {
    position: relative;
}

/* ④ Elevated — prominent drop shadow, slightly lifted */
.sdaweb-vc-style-editorial.sdaweb-vc-editorial-elevated {
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.14), 0 2px 8px rgba(0, 0, 0, 0.06);
}
.sdaweb-vc-style-editorial.sdaweb-vc-editorial-elevated:hover {
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18), 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* Dark mode overrides for editorial sub-styles */
.sdaweb-vc-mode-dark .sdaweb-vc-style-editorial.sdaweb-vc-editorial-inset .sdaweb-vc-editorial-image::after {
    box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.45);
}
.sdaweb-vc-mode-dark .sdaweb-vc-style-editorial.sdaweb-vc-editorial-elevated {
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.4);
}

/* ---- Editorial Split: Image proportion variants ---- */

/* 40% image / 60% text */
.sdaweb-vc-editorial-split-40 .sdaweb-vc-editorial-image {
    flex: 0 0 40%;
    max-width: 40%;
}

/* 60% image / 40% text */
.sdaweb-vc-editorial-split-60 .sdaweb-vc-editorial-image {
    flex: 0 0 60%;
    max-width: 60%;
}

/* 33% image / 67% text */
.sdaweb-vc-editorial-split-33 .sdaweb-vc-editorial-image {
    flex: 0 0 33.333%;
    max-width: 33.333%;
}

/* ---- Editorial Split: Vertical divider between panels ---- */
.sdaweb-vc-editorial-divider .sdaweb-vc-editorial-image {
    border-right: 1px solid var(--sdaweb-vc-divider-line, var(--sdaweb-vc-border, #e8e2d8));
}
.sdaweb-vc-editorial-divider.sdaweb-vc-editorial-image-right .sdaweb-vc-editorial-image {
    border-right: none;
    border-left: 1px solid var(--sdaweb-vc-divider-line, var(--sdaweb-vc-border, #e8e2d8));
}

/* Dark mode */
.sdaweb-vc-mode-dark .sdaweb-vc-editorial-divider .sdaweb-vc-editorial-image {
    border-color: var(--sdaweb-vc-divider-line, var(--sdaweb-vc-border, #3a3228));
}