/**
 * @package     b4m Template — Custom Styles
 * @version     2.0.0
 */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&display=swap');

:root {
    --navy: #0B1F3A;
    --navy-mid: #122848;
    --navy-light: #1A3660;
    --gold: #C9922E;
    --gold-light: #E5AE4C;
    --gold-pale: #F5E9D0;
    --cream: #FAF7F2;
    --white: #FFFFFF;
    --gray-100: #F2EFE9;
    --gray-300: #C8C4BB;
    --gray-500: #7A7670;
    --gray-700: #3D3A35;
    --gray-900: #737F8D;
    --label-font: 0.9rem;
    --sm-font: 0.7rem;
    --tt-font: 3.18rem;
    --border:     #e2ddd4;
    --font-serif: 'Cormorant Garamond', Georgia, serif;
    --font-sans: 'Verdana', system-ui, sans-serif;
    --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --shadow-sm: 0 2px 12px rgba(11, 31, 58, 0.08);
    --shadow-md: 0 8px 32px rgba(11, 31, 58, 0.14);
    --shadow-lg: 0 24px 64px rgba(11, 31, 58, 0.20);
    --gray-900: #858F9D;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-sans);
    background: var(--cream);
    color: var(--gray-700);
    line-height: 1.7;
    font-size: var(--label-font);
    overflow-x: hidden;
}

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

a {
    color: inherit;
    text-decoration: none;
}
/* HERO-NAV */
#header {background: var(--navy);border-bottom: 1px solid var(--navy-light);}
#header .wrap {display: flex;align-items: center; justify-content: space-between; padding: 10px 20px;max-width: 1200px; margin: 0 auto;position: relative;}
.header-logo {flex-shrink: 0; }
.header-logo img {display: block;height: auto;}
.nav-links {flex-grow: 1; display: flex;justify-content: center; }
.header-cta {flex-shrink: 0;}
.nav-toggle {display: none;}
.mod-menu {list-style: none;margin: 0;padding: 0;display: flex;gap: 20px; }
.nav-item {position: relative; }
.nav-item a, .nav-item button {text-decoration: none;color: var(--gray-300);font-weight: 500;background: none;border: none;cursor: pointer;display: flex;align-items: center;}
.nav-item a:hover,.nav-header:hover,.nav-item.current a{color: var(--gold);}
.mod-menu__sub {position: absolute;top: 100%;left: 0;background: var(--navy);box-shadow: 0 4px 6px rgba(0,0,0,0.1);min-width: 300px;display: none; list-style: none;padding: 10px 0;z-index: 1000;}
.nav-item:hover > .mod-menu__sub {display: block;}
.mod-menu__sub li a {padding: 8px 20px;display: block;width: 100%;}
.mod-menu__sub li a:hover {background-color: var(--navy-light);}
.nav-cta {
    background: var(--gold);
    color: var(--white) !important;
    padding: 10px 22px;
    border-radius: 6px;
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: 0.04em;
    transition: background var(--transition), transform var(--transition) !important;
}

.nav-cta:hover {
    background: var(--gold-light) !important;
    transform: translateY(-1px);
}

/* ============================================================
       UTILITY CLASSES
    ============================================================ */
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
}
.section-label {
    font-family: var(--font-sans);
    font-size: var(--sm-font) !important;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gold-light) !important;
    margin-bottom: 0.75rem;
}


.section-title span {
    font-style: italic;
    color: var(--gold);
}

.section-title {
    font-family: var(--font-serif);
    font-size: var(--tt-font);
    font-weight: 600;
    color: var(--navy);
    line-height: 1.15;
}

.section-title span {
    font-style: italic;
    color: var(--gold);
}

.section-title.light {
    color: var(--white);
}
.section-subtitle{
	font-size: var(--label-font);
	max-width: 570px;
}
	
.divider {
    width: 48px;
    height: 2px;
    background: var(--gold);
    margin: 1.5rem 0;
}

.divider.center {
    margin: 1.5rem auto;
}

/* Buttons */
.btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--gold);
    color: var(--white);
    font-family: var(--font-sans);
    font-size: var(--label-font);
    font-weight: 600;
    padding: 16px 32px;
    border-radius: 8px;
    transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
    box-shadow: 0 4px 20px rgba(201, 146, 46, 0.35);
    border: none;
    cursor: pointer;
}

.btn-primary:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(201, 146, 46, 0.45);
}
.convertforms .cf-btn {
    
    align-items: center !important;
    gap: 10px;
    background: var(--gold) !important;
    color: var(--white);
    font-family: var(--font-sans);
    font-size: var(--label-font);
    font-weight: 600;
    padding: 16px 32px;
    border-radius: 8px;
    transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
    box-shadow: 0 4px 20px rgba(201, 146, 46, 0.35);
    border: none;
    cursor: pointer;
}
.cf-btn-text{
	text-align: center !important;
}
.convertforms .cf-btn:hover {
    background: var(--gold-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 32px rgba(201, 146, 46, 0.45);
}

.btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: transparent;
    color: var(--white);
    font-family: var(--font-sans);
    font-size: var(--label-font);
    font-weight: 500;
    padding: 16px 32px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    transition: border-color var(--transition), background var(--transition);
    cursor: pointer;
}

.btn-outline:hover {
    border-color: var(--gold-light);
    background: rgba(201, 146, 46, 0.08);
}

.how-card h3 {
    font-family: var(--font-sans);
    font-size: var(--label-font);
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.4rem;
}

/* ============================================================
       HERO SECTION
    ============================================================ */
.hero {
    min-height: 100vh;
    background: var(--navy);
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    padding-top: 72px;
}

.hero-MP {
    min-height: 80vh;
    background-color: var(--navy);
    background-image: url("https://asebb.com/images/Asebb-bg-26-1.jpg");
    background-repeat: no-repeat;
    background-position: right center;
    background-size: contain;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    padding-top: 50px;
}

/* Geometric background decoration */
.hero-bg-circle {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(201, 146, 46, 0.12);
}

.hero-bg-circle.c1 {
    width: 600px;
    height: 600px;
    right: -100px;
    top: -120px;
}

.hero-bg-circle.c2 {
    width: 900px;
    height: 900px;
    right: -280px;
    top: -300px;
}

.hero-bg-circle.c3 {
    width: 1200px;
    height: 1200px;
    right: -500px;
    top: -500px;
}

/* Gold bar accent */
.hero-accent-bar {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(to bottom, transparent 0%, var(--gold) 30%, var(--gold) 70%, transparent 100%);
}

.hero-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
    width: 100%;
}

.hero-content {
    position: relative;
    z-index: 2;
    padding: 20px 0
}

.hero-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(201, 146, 46, 0.15);
    border: 1px solid rgba(201, 146, 46, 0.35);
    padding: 6px 16px;
    border-radius: 100px;
    margin-bottom: 2rem;
}

.hero-eyebrow span {
    font-size: var(--sm-font);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold-light);
}

.hero-eyebrow::before {
    content: '';
    width: 6px;
    height: 6px;
    background: var(--gold);
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.5;
        transform: scale(0.8);
    }
}

.hero-title {
    font-family: var(--font-serif);
    font-size: var(--tt-font);
    font-weight: 700;
    color: var(--white);
    line-height: 1.06;
    margin-bottom: 1.5rem;
}

.hero-title em {
    font-style: italic;
    color: var(--gold-light);
}

.hero-subtitle {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.65);
    line-height: 1.7;
    max-width: 460px;
    margin-bottom: 2.5rem;
}

.hero-actions {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 3rem;
    margin-top: 3rem;
}



/* Trust badges row */
.hero-trust {
    display: flex;
    align-items: center;
    gap: 2rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.trust-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.trust-item strong {
    font-family: var(--font-serif);
    font-size: 22px;
    font-weight: 700;
    color: var(--gold-light);
    line-height: 1;
}

.trust-item small {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.5);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-top: 4px;
}

.trust-divider {
    width: 1px;
    height: 36px;
    background: rgba(255, 255, 255, 0.15);
}

/* Hero right panel */
.hero-panel {
    position: relative;
    z-index: 2;
}

.hero-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(201, 146, 46, 0.25);
    border-radius: 16px;
    padding: 2.5rem;
    backdrop-filter: blur(8px);
}

.hero-card-title {
    font-family: var(--font-serif);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--white);
    margin-bottom: 1.5rem;
}

.contact-line {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.contact-line:last-child {
    border-bottom: none;
}

.contact-icon {
    width: 36px;
    height: 36px;
    background: rgba(201, 146, 46, 0.15);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.contact-icon svg {
    width: 16px;
    height: 16px;
    stroke: var(--gold-light);
    fill: none;
}

.contact-info strong {
    display: block;
    font-size: var(--label-font);
    color: var(--white);
    margin-bottom: 2px;
}

.contact-info small {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.45);
}

.emergency-banner {
    margin-top: 1.5rem;
    background: rgba(201, 146, 46, 0.12);
    border: 1px solid rgba(201, 146, 46, 0.3);
    border-radius: 10px;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.emergency-dot {
    width: 8px;
    height: 8px;
    background: var(--gold);
    border-radius: 50%;
    flex-shrink: 0;
    animation: pulse 1.5s infinite;
}

.emergency-banner p {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.7);
}

.emergency-banner strong {
    color: var(--gold-light);
}

/* ============================================================
       SERVICES SECTION
    ============================================================ */
.services {
    background: var(--white);
    padding: 7rem 0;
}

.services-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: end;
    margin-bottom: 4rem;
}

.services-intro {
    color: var(--gray-500);
    line-height: 1.8;
    max-width: 560px;
    margin: 10px auto;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

.service-card {
    background: var(--cream);
    border: 1px solid transparent;
    border-radius: 14px;
    padding: 2rem 1.75rem;
    transition: border-color var(--transition), transform var(--transition), box-shadow var(--transition);
    cursor: default;
}

.service-card:hover {
    border-color: var(--gold);
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.service-icon-wrap {
    width: 52px;
    height: 52px;
    background: var(--navy);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.service-icon-wrap svg {
    width: 22px;
    height: 22px;
    stroke: var(--gold-light);
    fill: none;
}

.service-card h3 {
    font-family: var(--font-serif);
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 0.75rem;
}

.service-card p {
    font-size: var(--label-font);
    color: var(--gray-500);
    line-height: 1.7;
}

/* ============================================================
       WHY US SECTION
    ============================================================ */
.whyus {
    background: var(--navy);
    padding: 7rem 0;
    position: relative;
    overflow: hidden;
}

.whyus::before {
    content: '46';
    position: absolute;
    right: -2rem;
    top: 50%;
    transform: translateY(-50%);
    font-family: var(--font-serif);
    font-size: 28rem;
    font-weight: 700;
    color: rgba(201, 146, 46, 0.04);
    line-height: 1;
    pointer-events: none;
    user-select: none;
}

.whyus-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
    align-items: center;
}

.whyus-content .section-title {
    color: var(--white);
}

.whyus-content .section-label {
    color: var(--gold-light);
}

.whyus-lead {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.8;
    margin-bottom: 2rem;
}

.features-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.features-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.75);
}

.feat-check {
    width: 20px;
    height: 20px;
    background: rgba(201, 146, 46, 0.15);
    border: 1px solid rgba(201, 146, 46, 0.4);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 3px;
}

.feat-check svg {
    width: 10px;
    height: 10px;
    stroke: var(--gold-light);
    fill: none;
}

/* Stats grid */
.stats-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}

.stat-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(201, 146, 46, 0.2);
    border-radius: 14px;
    padding: 1.75rem 1.5rem;
    transition: border-color var(--transition), background var(--transition);
}

.stat-card:hover {
    border-color: rgba(201, 146, 46, 0.5);
    background: rgba(201, 146, 46, 0.06);
}

.stat-num {
    font-family: var(--font-serif);
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--gold-light);
    line-height: 1;
    margin-bottom: 0.4rem;
}

.stat-label {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.5);
    line-height: 1.4;
}

/* ============================================================
       DISCOUNT SECTION
    ============================================================ */



/* ============================================================
       CONTACT / CTA SECTION
    ============================================================ */
.contact {
    background: var(--cream);
    padding: 7rem 0;
}

.contact-header {
    text-align: center;
    margin-bottom: 4rem;
}

.contact-header .divider {
    margin: 1.5rem auto;
}

.contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: start;
}

.contact-info-block h3 {
    font-family: var(--font-serif);
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 1.5rem;
}

.contact-detail {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    padding: 1rem 0;
    border-bottom: 1px solid var(--gray-100);
}

.contact-detail:last-child {
    border-bottom: none;
}

.detail-icon {
    width: 38px;
    height: 38px;
    background: var(--navy);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.detail-icon svg {
    width: 16px;
    height: 16px;
    stroke: var(--gold-light);
    fill: none;
}

.detail-label {
    font-size: var(--sm-font);
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gray-300);
    margin-bottom: 4px;
}

.detail-value {
    font-size: 16px;
    font-weight: 500;
    color: var(--navy);
}

.detail-value a {
    color: var(--navy);
    transition: color var(--transition);
}

.detail-value a:hover {
    color: var(--gold);
}

/* Call card */
.call-card {
    background: var(--navy);
    border-radius: 16px;
    padding: 3rem 2.5rem;
    text-align: center;
}

.call-card-label {
    font-size: var(--sm-font);
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--gold-light);
    margin-bottom: 1rem;
}

.call-card h3 {
    font-family: var(--font-serif);
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--white);
    margin-bottom: 0.5rem;
}

.call-card p {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.55);
    margin-bottom: 2rem;
}

.call-number {
    display: block;
    font-family: var(--font-serif);
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--gold-light);
    margin-bottom: 0.5rem;
    transition: color var(--transition);
}

.call-number:hover {
    color: var(--gold);
}

.call-card .btn-primary {
    margin: 0 auto;
    display: inline-flex;
}

.call-availability {
    margin-top: 1.5rem;
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.35);
}

/* ============================================================
       FOOTER
    ============================================================ */
footer {
    background: var(--navy);
    border-top: 1px solid rgba(201, 146, 46, 0.15);
    padding: 4rem 0 2.5rem;
    
}

.footer-inner {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 4rem;
    margin-bottom: 3rem;
}

.footer-brand strong {
    font-family: var(--font-serif);
    font-size: 1.3rem;
    font-weight: 600;
    color: var(--white);
    display: block;
    margin-bottom: 0.75rem;
}

.footer-brand p {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.7;
    max-width: 300px;
    margin-bottom: 1.25rem;
}

.bbb-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(201, 146, 46, 0.1);
    border: 1px solid rgba(201, 146, 46, 0.25);
    padding: 8px 14px;
    border-radius: 8px;
    font-size: var(--sm-font);
    font-weight: 600;
    color: var(--gold-light);
}

.footer-col h4 {
    font-size: var(--sm-font);
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 1rem;
}

.footer-col ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.footer-col li a {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.6);
    transition: color var(--transition);
}

.footer-col li a:hover {
    color: var(--gold-light);
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    padding-top: 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer-bottom p {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.3);
}

.social-links {
    display: flex;
    gap: 12px;
}

.social-link {
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition), border-color var(--transition);
}

.social-link:hover {
    background: rgba(201, 146, 46, 0.15);
    border-color: rgba(201, 146, 46, 0.4);
}

.social-link svg {
    width: 15px;
    height: 15px;
    stroke: rgba(255, 255, 255, 0.5);
    fill: none;
    transition: stroke var(--transition);
}

.social-link:hover svg {
    stroke: var(--gold-light);
}

/* ============================================================
       FLOATING CALL BUTTON (mobile hint on desktop too)
    ============================================================ */
.float-call {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    background: var(--gold);
    color: var(--white);
    font-family: var(--font-sans);
    font-size: var(--label-font);
    font-weight: 600;
    padding: 14px 24px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 8px 30px rgba(201, 146, 46, 0.5);
    z-index: 998;
    transition: transform var(--transition), box-shadow var(--transition);
}

.float-call:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 40px rgba(201, 146, 46, 0.6);
}

.float-call svg {
    width: 16px;
    height: 16px;
    stroke: var(--white);
    fill: none;
}


/* Page Hero Banner */
.page-hero {
    background: var(--navy);
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-bb {
    background-color: var(--navy);
    min-height: 750px;
    background-image: url("https://asebb.com/images/Asebb-bg-26-1.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}

.page-hero-imm {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/in-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: contain;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-dv {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/dv-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
        background-size: contain;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-dui {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/dui-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-wa {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/ser-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-cbb {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/cbb-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-ser {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/ser-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: contain;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-con {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/con-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-ab {
    background-color: var(--navy);
        min-height: 750px;
    background-image: url("https://asebb.com/images/ab-Asebb-bg.jpg");
    background-repeat: no-repeat;
    background-position: right bottom;
    padding: 9rem 0 5rem;
    position: relative;
    overflow: hidden;
}
.page-hero-bg-circle {
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(201, 146, 46, 0.1);
    pointer-events: none;
}

.page-hero-bg-circle.c1 {
    width: 500px;
    height: 500px;
    right: -80px;
    top: -100px;
}

.page-hero-bg-circle.c2 {
    width: 800px;
    height: 800px;
    right: -260px;
    top: -280px;
}

.page-hero-accent {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(to bottom, transparent 0%, var(--gold) 30%, var(--gold) 70%, transparent 100%);
}

.page-hero-label {
    font-size: var(--sm-font);
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--gold-light);
    margin-bottom: 0.75rem;
}

.page-hero-title {
    font-family: var(--font-serif);
    font-size: var(--tt-font);
    font-weight: 700;
    color: var(--white);
    line-height: 1.08;
    margin-bottom: 1.25rem;
}

.page-hero-title em {
    font-style: italic;
    color: var(--gold-light);
}

.page-hero-sub {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.6);
    max-width: 560px;
    line-height: 1.7;
}

.breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 1.5rem;
}

.breadcrumb a {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.45);
    transition: color var(--transition);
}

.breadcrumb a:hover {
    color: var(--gold-light);
}

.breadcrumb span {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.25);
}

.breadcrumb .current {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.7);
}



.bbb-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(201, 146, 46, 0.1);
    border: 1px solid rgba(201, 146, 46, 0.25);
    padding: 8px 14px;
    border-radius: 8px;
    font-size: var(--sm-font);
    font-weight: 600;
    color: var(--gold-light);
}

.footer-col h4 {
    font-size: var(--sm-font);
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 1rem;
}

.footer-col ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.footer-col li a {
    font-size: var(--label-font);
    color: rgba(255, 255, 255, 0.6);
    transition: color var(--transition);
}

.footer-col li a:hover {
    color: var(--gold-light);
}



.social-links {
    display: flex;
    gap: 12px;
}

.social-link {
    width: 34px;
    height: 34px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background var(--transition), border-color var(--transition);
}

.social-link:hover {
    background: rgba(201, 146, 46, 0.15);
    border-color: rgba(201, 146, 46, 0.4);
}

.social-link svg {
    width: 15px;
    height: 15px;
    stroke: rgba(255, 255, 255, 0.5);
    fill: none;
    transition: stroke var(--transition);
}

.social-link:hover svg {
    stroke: var(--gold-light);
}

 /* Bottom urgency bar */
  .urgency-bar {
    position: relative;
    z-index: 10;
    padding: 12px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }

  .urgency-bar svg {
    width: 14px;
    height: 14px;
    fill: #fff;
    flex-shrink: 0;
  }

  .urgency-text {
    font-size: var(--sm-font);
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #fff;
    text-transform: uppercase;
  }

  .urgency-text span {
    font-weight: 300;
    letter-spacing: 0.05em;
    text-transform: none;
    opacity: 0.9;
    margin-left: 6px;
  }
/* ============================================================
       BAIL BONDS PAGE — Additional Styles
    ============================================================ */

/* Quick info bar just below hero */
.quick-info {
    background: var(--gold);
    padding: 1rem 0;
}

.quick-info-inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
}

.quick-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--label-font);
    font-weight: 600;
    color: var(--white);
}

.quick-item svg {
    width: 16px;
    height: 16px;
    stroke: rgba(255, 255, 255, 0.8);
    fill: none;
}

/* What is a bail bond */
.explainer-section {
    padding: 7rem 0;
    background: var(--cream);
}

.explainer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6rem;
    align-items: start;
}

.explainer-content h2 {
    margin-bottom: 0.5rem;
}

.explainer-content .lead-text {
    font-family: var(--font-serif);
    font-size: 1.15rem;
    font-style: italic;
    color: var(--navy);
    line-height: 1.7;
    padding-left: 1.25rem;
    border-left: 3px solid var(--gold);
    margin-bottom: 1.5rem;
}

.explainer-content p {
    font-size: var(--label-font);
    color: var(--gray-500);
    line-height: 1.85;
    margin-bottom: 1rem;
}

/* Key terms card */
.terms-card {
    background: var(--white);
    border-radius: 16px;
    border: 1px solid var(--gray-100);
    overflow: hidden;
}

.terms-card-header {
    background: var(--navy);
    padding: 1.5rem;
}

.terms-card-header h3 {
    font-family: var(--font-sans);
    font-size: var(--label-font);
    font-weight: 600;
    color: var(--white);
}

.term-row {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--gray-100);
}

.term-row:last-child {
    border-bottom: none;
}

.term-name {
    font-size: var(--label-font);
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 4px;
}

.term-def {
    font-size: var(--label-font);
    color: var(--gray-500);
    line-height: 1.6;
}

/* How bail works — visual steps */
.how-section {
    background: var(--white);
    padding: 7rem 0;
}

.how-header {
    margin-bottom: 4rem;
}

.how-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.how-card {
    display: flex;
    gap: 1.5rem;
    background: var(--cream);
    border-radius: 14px;
    border: 1px solid var(--gray-100);
    padding: 1.75rem;
    transition: border-color var(--transition), box-shadow var(--transition);
}

.how-card:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-sm);
}

.how-num {
    width: 44px;
    height: 44px;
    background: var(--navy);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-sans);
    font-size: 1.2rem;
    font-weight: 700;
    color: var(--gold-light);
    flex-shrink: 0;
}


.how-card p {
    font-size: var(--label-font);
    color: var(--gray-500);
    line-height: 1.7;
}

/* Cost breakdown */
.cost-section {
    background: var(--navy);
    padding: 7rem 0;
}

.cost-header {
    text-align: center;
    margin-bottom: 4rem;
}

.cost-header .divider {
    margin: 1.5rem auto;
}

.cost-header .section-label {
    color: var(--gold-light);
}

.cost-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 3rem;
}

.cost-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(201, 146, 46, 0.2);
    border-radius: 16px;
    padding: 2rem;
    text-align: center;
    transition: border-color var(--transition), background var(--transition);
}

.cost-card:hover {
    border-color: rgba(201, 146, 46, 0.5);
    background: rgba(201, 146, 46, 0.05);
}

.cost-figure {
    font-family: var(--font-serif);
    font-size: 3rem;
    font-weight: 700;
    color: var(--gold-light);
    line-height: 1;
    margin-bottom: 0.5rem;
}

.cost-label {
    font-size: var(--label-font);
    font-weight: 600;
    color: var(--white);
    margin-bottom: 0.5rem;
}

.cost-desc {
    font-size: var(--sm-font);
    color: rgba(255, 255, 255, 0.4);
    line-height: 1.6;
}

.cost-example {
    background: rgba(201, 146, 46, 0.08);
    border: 1px solid rgba(201, 146, 46, 0.2);
    border-radius: 14px;
    padding: 2rem 2.5rem;
}

.cost-example h3 {
    font-family: var(--font-serif);
    font-size: 1.4rem;
    font-weight: 600;
    color: var(--white);
    margin-bottom: 1.25rem;
}

.example-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: var(--label-font);
}

.example-row:last-child {
    border-bottom: none;
}

.example-row span {
    color: rgba(255, 255, 255, 0.55);
}

.example-row strong {
    color: var(--white);
}

.example-row.total strong {
    color: var(--gold-light);
    font-size: 1.1rem;
}

/* Jails served */
.jails-section {
    background: var(--cream);
    padding: 6rem 0;
}

.jails-header {
    text-align: center;
    margin-bottom: 3.5rem;
}

.jails-header .divider {
    margin: 1.5rem auto;
}

.jails-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.jail-card {
    background: var(--white);
    border-radius: 12px;
    border: 1px solid var(--gray-100);
    padding: 1.25rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: border-color var(--transition), box-shadow var(--transition);
}

.jail-card:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-sm);
}

.jail-dot {
    width: 8px;
    height: 8px;
    background: var(--gold);
    border-radius: 50%;
    flex-shrink: 0;
}

.jail-card span {
    font-size: var(--label-font);
    font-weight: 500;
    color: var(--navy);
}
   /* ============================================================
       CONTACT PAGE — Additional Styles
    ============================================================ */

    /* Main content grid */
    .contact-section { padding: 6rem 0; background: var(--cream); }

    .contact-grid {
      display: grid;
      grid-template-columns: 1fr 1.1fr;
      gap: 4rem;
      align-items: start;
    }

    /* Left: info blocks */
    .contact-info-col h2 {
      font-family: var(--font-serif);
      font-size: var(--tt-font);
      font-weight: 600;
      color: var(--navy);
      margin-bottom: 0.5rem;
    }

    .contact-info-col .intro {
      font-size: var(--label-font);
      color: var(--gray-500);
      line-height: 1.8;
      margin-bottom: 2.5rem;
    }

    /* Info cards */
    .info-card {
      background: var(--white);
      border-radius: 14px;
      border: 1px solid var(--gray-100);
      padding: 1.5rem;
      display: flex;
      gap: 16px;
      margin-bottom: 1rem;
      transition: border-color var(--transition), box-shadow var(--transition);
    }

    .info-card:hover { border-color: var(--gold); box-shadow: var(--shadow-sm); }

    .info-card-icon {
      width: 48px;
      height: 48px;
      background: var(--navy);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .info-card-icon svg { width: 20px; height: 20px; stroke: var(--gold-light); fill: none; }

    .info-card-label {
      font-size: var(--sm-font);
      font-weight: 600;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--gray-300);
      margin-bottom: 4px;
    }

    .info-card-value {
      font-size: var(--label-font);
      font-weight: 600;
      color: var(--navy);
      line-height: 1.3;
    }

    .info-card-value a { color: var(--navy); transition: color var(--transition); }
    .info-card-value a:hover { color: var(--gold); }

    .info-card-sub {
      font-size: var(--label-font);
      color: var(--gray-500);
      margin-top: 3px;
    }

    /* Availability badge */
    .availability-badge {
      background: var(--navy);
      border-radius: 14px;
      padding: 1.5rem;
      display: flex;
      align-items: center;
      gap: 14px;
      margin-bottom: 1rem;
    }

    .avail-dot-wrap {
      width: 48px;
      height: 48px;
      background: rgba(201, 146, 46, 0.12);
      border: 1px solid rgba(201, 146, 46, 0.3);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
    }

    .avail-dot {
      width: 10px;
      height: 10px;
      background: var(--gold);
      border-radius: 50%;
      animation: pulse 1.5s infinite;
    }

    .availability-badge strong { display: block; font-size: var(--label-font); color: var(--white); margin-bottom: 2px; }
    .availability-badge small { font-size: var(--label-font); color: rgba(255,255,255,0.5); }

    /* Languages */
    .lang-pills { display: flex; gap: 8px; margin-top: 1.5rem; flex-wrap: wrap; }

    .lang-pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: var(--gold-pale);
      border: 1px solid rgba(201, 146, 46, 0.3);
      color: var(--gray-700);
      font-size: var(--label-font);
      font-weight: 500;
      padding: 6px 14px;
      border-radius: 100px;
    }

    /* Right: Contact form */
    .contact-form-wrap {
      background: var(--white);
      border-radius: 20px;
      border: 1px solid var(--gray-100);
      padding: 2.75rem;
      box-shadow: var(--shadow-sm);
    }
  
    .form-title {
      font-family: var(--font-serif);
      font-size: var(--tt-font);
      font-weight: 600;
      color: var(--navy);
      margin-bottom: 0.4rem;
    }

    .form-sub {     font-size: var(--label-font); color: var(--gray-500); margin-bottom: 2rem; }

    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }

    .form-group { margin-bottom: 1.25rem; }

    .convertforms .cf-label {
      display: block;
      font-size: var(--sm-font) !important;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--gray-500);
      margin-bottom: 6px;
    }

    .convertforms .cf-input,
    .form-group select,
    .form-group textarea {
      width: 100%;
      background: var(--cream);
      border: 1px solid var(--gray-100);
      border-radius: 10px;
      padding: 12px 16px;
      font-family: var(--font-sans);
      font-size: var(--label-font);
      color: var(--gray-700);
      transition: border-color var(--transition), box-shadow var(--transition);
      outline: none;
      appearance: none;
    }

    .form-group input:focus,
    .form-group select:focus,
    .form-group textarea:focus {
      border-color: var(--gold);
      box-shadow: 0 0 0 3px rgba(201, 146, 46, 0.12);
    }

    .form-group textarea { resize: vertical; min-height: 130px; }
    .convertforms .cf-input{
	    font-size: var(--label-font) !important;
    }
    .convertforms .small{
	    font-size: var(--sm-font) !important;
    }
    .form-group select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237A7670' fill='none' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 36px; }

    .form-disclaimer { font-size: var(--sm-font); color: var(--gray-300); line-height: 1.6; margin-top: 1rem; }

    /* Success message */
    .form-success {
      display: none;
      text-align: center;
      padding: 2rem 0;
    }

    .success-icon {
      width: 64px; height: 64px;
      background: rgba(201, 146, 46, 0.12);
      border: 2px solid var(--gold);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1.25rem;
    }

    .success-icon svg { width: 28px; height: 28px; stroke: var(--gold); fill: none; }
    .form-success h3 { font-family: var(--font-serif); font-size: 1.6rem; color: var(--navy); margin-bottom: 0.5rem; }
    .form-success p {     font-size: var(--label-font); color: var(--gray-500); }
  
    
    /* Map placeholder */
    .map-section { padding: 5rem 0; background: var(--white); }
    .map-header { text-align: center; margin-bottom: 3rem; }
    .map-header .divider { margin: 1.5rem auto; }

    .map-placeholder {
    background-color: var(--navy);
    background-image: url("https://asebb.com/2026/images/map-Asebb-bg-4.jpg");
    background-repeat: no-repeat;
    background-position: center center;
      border-radius: 20px;
      height: 360px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 1rem;
      position: relative;
      overflow: hidden;
    }

    .map-placeholder::before {
      content: '';
      position: absolute;
      width: 300px; height: 300px;
      border-radius: 50%;
      border: 1px solid rgba(201, 146, 46, 0.12);
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
    }

    .map-placeholder::after {
      content: '';
      position: absolute;
      width: 500px; height: 500px;
      border-radius: 50%;
      border: 1px solid rgba(201, 146, 46, 0.07);
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
    }

    .map-pin {
      width: 56px; height: 56px;
      background: var(--gold);
      border-radius: 50% 50% 50% 0;
      transform: rotate(-45deg);
      display: flex; align-items: center; justify-content: center;
      position: relative; z-index: 2;
      box-shadow: 0 8px 24px rgba(201, 146, 46, 0.5);
    }

    .map-pin svg { width: 24px; height: 24px; stroke: white; fill: none; transform: rotate(45deg); }
    .map-label { font-family: var(--font-serif); font-size: 1.4rem; color: var(--white); font-weight: 600; position: relative; z-index: 2; }
    .map-sublabel { font-size: var(--label-font); color: rgba(255,255,255,0.5); position: relative; z-index: 2; }

    .map-links {
      display: flex; gap: 1rem; justify-content: center; margin-top: 2rem; flex-wrap: wrap;
    }

    .map-link {
      display: inline-flex; align-items: center; gap: 8px;
      background: var(--navy);
      border: 1px solid rgba(201, 146, 46, 0.3);
      color: var(--gold-light);
      font-size: var(--label-font); font-weight: 500;
      padding: 10px 20px;
      border-radius: 8px;
      transition: background var(--transition), border-color var(--transition);
    }

    .map-link:hover { background: rgba(201, 146, 46, 0.1); border-color: var(--gold); }
    .map-link svg { width: 14px; height: 14px; stroke: currentColor; fill: none; }
    
        /* ============================================================
       ABOUT PAGE — Additional Styles
    ============================================================ */

    /* Story section */
    .story-section { padding: 7rem 0; background: var(--cream); }

    .story-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6rem;
      align-items: center;
    }

    /* Decorative "Since 1989" block */
    .year-block {
      position: relative;
    }

    .year-block-bg {
      background: var(--navy);
      border-radius: 24px;
      padding: 3.5rem;
      position: relative;
      overflow: hidden;
    }

    .year-block-bg::before {
      content: '1989';
      position: absolute;
      bottom: -20px;
      right: -10px;
      font-family: var(--font-serif);
      font-size: 10rem;
      font-weight: 700;
      color: rgba(201, 146, 46, 0.07);
      line-height: 1;
      pointer-events: none;
      user-select: none;
    }

    .year-badge {
      display: inline-flex;
      align-items: baseline;
      gap: 6px;
      margin-bottom: 2rem;
    }

    .year-num {
      font-family: var(--font-serif);
      font-size: 5rem;
      font-weight: 700;
      color: var(--gold-light);
      line-height: 1;
    }

    .year-suffix {
      font-family: var(--font-serif);
      font-size: 2rem;
      color: rgba(201, 146, 46, 0.6);
    }

    .year-block-bg h3 {
      font-family: var(--font-sans);
      font-size: var(--label-font);
      font-weight: 600;
      color: var(--white);
      margin-bottom: 1rem;
    }

    .year-block-bg p {
      font-size: var(--label-font);
      color: rgba(255,255,255,0.55);
      line-height: 1.8;
    }

    .year-stats {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-top: 1.5rem;
    }

    .year-stat {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(201, 146, 46, 0.15);
      border-radius: 10px;
      padding: 1rem;
      text-align: center;
    }

    .year-stat strong {
      display: block;
      font-family: var(--font-serif);
      font-size: 1.8rem;
      font-weight: 700;
      color: var(--gold-light);
      line-height: 1;
    }

    .year-stat small { font-size: var(--sm-font); color: rgba(255,255,255,0.4); margin-top: 4px; display: block; }

    /* Story content */
    .story-content .section-lead {
      font-family: var(--font-serif);
      font-size: 1.25rem;
      font-style: italic;
      color: var(--navy);
      line-height: 1.7;
      margin-bottom: 1.5rem;
      padding-left: 1.25rem;
      border-left: 3px solid var(--gold);
    }

    .story-content p {
      font-size: var(--label-font);
      color: var(--gray-500);
      line-height: 1.85;
      margin-bottom: 1.25rem;
    }

    /* Values section */
    .values-section { background: var(--white); padding: 7rem 0; }

    .values-header { text-align: center; margin-bottom: 4rem; }
    .values-header .divider { margin: 1.5rem auto; }

    .values-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 1.5rem;
    }

    .value-card {
      text-align: center;
      padding: 2.5rem 1.5rem;
      border-radius: 16px;
      border: 1px solid var(--gray-100);
      transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
    }

    .value-card:hover {
      border-color: var(--gold);
      box-shadow: var(--shadow-md);
      transform: translateY(-4px);
    }

    .value-icon {
      width: 64px; height: 64px;
      background: var(--navy);
      border-radius: 16px;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1.5rem;
    }

    .value-icon svg { width: 26px; height: 26px; stroke: var(--gold-light); fill: none; }

    .value-card h3 {
      font-family: var(--font-sans);
      font-size: var(--label-font);;
      font-weight: 600;
      color: var(--navy);
      margin-bottom: 0.6rem;
    }

    .value-card p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.7; }

    /* Timeline section */
    .timeline-section { background: var(--navy); padding: 7rem 0; }

    .timeline-header { text-align: center; margin-bottom: 4.5rem; }
    .timeline-header .divider { margin: 1.5rem auto; }
    .timeline-header .section-label { color: var(--gold-light); }

    .timeline {
      position: relative;
      max-width: 700px;
      margin: 0 auto;
    }

    /* Center line */
    .timeline::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 0; bottom: 0;
      width: 1px;
      background: rgba(201, 146, 46, 0.25);
      transform: translateX(-50%);
    }

    .timeline-item {
      display: flex;
      justify-content: flex-end;
      padding-right: calc(50% + 2.5rem);
      margin-bottom: 3rem;
      position: relative;
    }

    .timeline-item:nth-child(even) {
      justify-content: flex-start;
      padding-right: 0;
      padding-left: calc(50% + 2.5rem);
    }

    .timeline-dot {
      position: absolute;
      left: 50%;
      top: 18px;
      transform: translate(-50%, -50%);
      width: 12px; height: 12px;
      background: var(--gold);
      border-radius: 50%;
      border: 2px solid var(--navy);
      box-shadow: 0 0 0 3px rgba(201, 146, 46, 0.3);
      z-index: 2;
    }

    .timeline-card {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(201, 146, 46, 0.15);
      border-radius: 12px;
      padding: 1.25rem 1.5rem;
      max-width: 260px;
    }

    .timeline-year {
      font-size: var(--sm-font);
      font-weight: 600;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--gold-light);
      margin-bottom: 4px;
    }

    .timeline-card h4 {
      font-family: var(--font-sans);
      font-size: var(--label-font);
      font-weight: 600;
      color: var(--white);
      margin-bottom: 4px;
    }

    .timeline-card p { font-size: var(--label-font); color: rgba(255,255,255,0.45); line-height: 1.6; }

    /* Team section */
    .team-section { background: var(--cream); padding: 7rem 0; }

    .team-header { text-align: center; margin-bottom: 4rem; }
    .team-header .divider { margin: 1.5rem auto; }

    .team-feature {
      display: grid;
      grid-template-columns: 1fr 1.3fr;
      gap: 5rem;
      align-items: center;
      background: var(--white);
      border-radius: 24px;
      border: 1px solid var(--gray-100);
      overflow: hidden;
    }

    .team-portrait {
      background: var(--navy);
      min-height: 480px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 1.5rem;
      padding: 3rem;
      position: relative;
      overflow: hidden;
    }

    .team-portrait::before {
      content: '';
      position: absolute;
      width: 300px; height: 300px;
      border-radius: 50%;
      border: 1px solid rgba(201, 146, 46, 0.12);
      left: 50%; top: 50%;
      transform: translate(-50%, -50%);
    }

    .portrait-avatar {
      width: 120px; height: 120px;
      background: rgba(201, 146, 46, 0.15);
      border: 2px solid rgba(201, 146, 46, 0.4);
      border-radius: 50%;
      display: flex; align-items: center; justify-content: center;
      font-family: var(--font-serif);
      font-size: 3rem;
      font-weight: 700;
      color: var(--gold-light);
      position: relative; z-index: 2;
    }

    .portrait-name {
      font-family: var(--font-sans);
      font-size: var(--label-font);
      font-weight: 600;
      color: var(--white);
      text-align: center;
      position: relative; z-index: 2;
    }

    .portrait-title {
      font-size: var(--sm-font);
      font-weight: 600;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--gold-light);
      text-align: center;
      position: relative; z-index: 2;
    }

    .portrait-license {
      background: rgba(201, 146, 46, 0.1);
      border: 1px solid rgba(201, 146, 46, 0.25);
      border-radius: 8px;
      padding: 8px 16px;
      font-size: var(--sm-font);
      color: rgba(255,255,255,0.5);
      text-align: center;
      position: relative; z-index: 2;
    }

    .team-bio { padding: 3rem 4rem 3rem 0; }

    .team-bio .section-lead {
      font-family: var(--font-serif);
      font-size: 1.15rem;
      font-style: italic;
      color: var(--navy);
      line-height: 1.7;
      margin-bottom: 1.5rem;
      padding-left: 1.25rem;
      border-left: 3px solid var(--gold);
    }

    .team-bio p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.85; margin-bottom: 1rem; }

    .credentials {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin-top: 1.75rem;
    }

    .credential {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: var(--label-font);
      color: var(--gray-700);
    }

    .credential-dot {
      width: 6px; height: 6px;
      background: var(--gold);
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* BBB Section */
    .bbb-section {
      background: var(--gold-pale);
      padding: 5rem 0;
      text-align: center;
    }

    .bbb-inner { max-width: 640px; margin: 0 auto; }

    .bbb-logo-area {
      width: 80px; height: 80px;
      background: var(--navy);
      border-radius: 16px;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1.5rem;
    }

    .bbb-logo-area svg { width: 36px; height: 36px; stroke: var(--gold-light); fill: none; }

    .bbb-inner h2 { font-family: var(--font-serif); font-size: 2rem; font-weight: 600; color: var(--navy); margin-bottom: 0.75rem; }
    .bbb-inner p { font-size: var(--label-font); color: var(--gray-500); margin-bottom: 2rem; line-height: 1.7; }

    .bbb-rating-display {
      display: inline-flex;
      align-items: center;
      gap: 16px;
      background: var(--navy);
      border-radius: 12px;
      padding: 1.25rem 2rem;
      margin-bottom: 1.5rem;
    }

    .rating-letter {
      font-family: var(--font-serif);
      font-size: 4rem;
      font-weight: 700;
      color: var(--gold-light);
      line-height: 1;
    }

    .rating-info strong { display: block; font-size: var(--label-font); color: var(--white); }
    .rating-info small { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }


    /* Process Section */
    .process-section {
      background: var(--navy);
      padding: 7rem 0;
      position: relative;
      overflow: hidden;
    }

    .process-section::before {
      content: '';
      position: absolute;
      width: 600px; height: 600px;
      border-radius: 50%;
      border: 1px solid rgba(201, 146, 46, 0.08);
      left: -200px; top: -200px;
    }

    .process-header { text-align: center; margin-bottom: 4rem; }
    .process-header .divider { margin: 1.5rem auto; }
    .process-header .section-label { color: var(--gold-light); }

    .steps-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 2rem;
      position: relative;
    }

    /* Connecting line between steps */
    .steps-grid::before {
      content: '';
      position: absolute;
      top: 28px;
      left: calc(12.5% + 24px);
      right: calc(12.5% + 24px);
      height: 1px;
      background: linear-gradient(to right, rgba(201,146,46,0.3), rgba(201,146,46,0.6), rgba(201,146,46,0.3));
    }

    .step-item { text-align: center; position: relative; }

    .step-number {
      width: 56px; height: 56px;
      border-radius: 50%;
      background: var(--gold);
      color: var(--white);
      font-family: var(--font-serif);
      font-size: 1.4rem;
      font-weight: 700;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto 1.5rem;
      position: relative;
      z-index: 2;
      box-shadow: 0 0 0 6px rgba(201, 146, 46, 0.15);
    }

    .step-item h4 {
      font-family: var(--font-serif);
      font-size: 1.15rem;
      font-weight: 600;
      color: var(--white);
      margin-bottom: 0.5rem;
    }

    .step-item p { font-size: var(--label-font); color: rgba(255,255,255,0.5); line-height: 1.6; }

    /* Payment Options */
    .payment-section { background: var(--gold-pale); padding: 6rem 0; }

    .payment-inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 5rem;
      align-items: center;
    }

    .payment-content .section-label { color: var(--gray-500); }

    .payment-options-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 1rem;
      margin-top: 2rem;
    }

    .payment-option {
      background: var(--white);
      border-radius: 12px;
      border: 1px solid rgba(201, 146, 46, 0.2);
      padding: 1.25rem;
      display: flex;
      align-items: center;
      gap: 12px;
      transition: border-color var(--transition), box-shadow var(--transition);
    }

    .payment-option:hover { border-color: var(--gold); box-shadow: var(--shadow-sm); }

    .payment-icon {
      width: 40px; height: 40px;
      background: var(--navy);
      border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
    }

    .payment-icon svg { width: 18px; height: 18px; stroke: var(--gold-light); fill: none; }

    .payment-option strong { display: block; font-size: var(--label-font); font-weight: 600; color: var(--navy); }
    .payment-option small { font-size: var(--sm-font); color: var(--gray-500); }

    .discount-highlight {
      background: var(--navy);
      border-radius: 16px;
      padding: 2.5rem;
      text-align: center;
    }

    .discount-pct-text {
      font-family: var(--font-serif);
      font-size: 5rem;
      font-weight: 700;
      color: var(--gold-light);
      line-height: 1;
      margin-bottom: 0.25rem;
    }

    .discount-highlight h3 { font-family: var(--font-serif); font-size: 1.5rem; font-weight: 600; color: var(--white); margin-bottom: 0.75rem; }
    .discount-highlight p { font-size: var(--label-font); color: rgba(255,255,255,0.55); margin-bottom: 1.5rem; line-height: 1.7; }

    .qualifier-tags { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 1.5rem; }
    .qualifier-tag { background: rgba(201, 146, 46, 0.12); border: 1px solid rgba(201, 146, 46, 0.3); color: var(--gold-light); font-size: var(--sm-font); font-weight: 500; padding: 5px 12px; border-radius: 100px; }


    .imm-bilingual-bar { background: var(--navy-mid); border-bottom: 1px solid rgba(201,146,46,0.2); padding: 1rem 0; }
    .imm-bilingual-bar-inner { display: flex; align-items: center; justify-content: center; gap: 2.5rem; flex-wrap: wrap; }
    .imm-bil-item { display: flex; align-items: center; gap: 10px; font-size: var(--label-font); font-weight: 600; color: rgba(255,255,255,0.8); }
    .imm-intro { padding: 6rem 0; background: var(--cream); }
    .imm-intro-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 5rem; align-items: start; }
    .imm-intro-content .lead-text { font-family: var(--font-serif); font-size: 1.15rem; font-style: italic; color: var(--navy); line-height: 1.7; padding-left: 1.25rem; border-left: 3px solid var(--gold); margin-bottom: 1.5rem; }
    .imm-intro-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.85; margin-bottom: 1rem; }
    .imm-intro-sidebar { position: sticky; top: 96px; }
    .imm-sidebar-card { background: var(--navy); border-radius: 18px; overflow: hidden; }
    .imm-sidebar-header { background: var(--gold); padding: 1.5rem 1.75rem; }
    .imm-sidebar-header h3 { font-family: var(--font-serif); font-size: 1.35rem; font-weight: 600; color: var(--white); margin-bottom: 0.2rem; }
    .imm-sidebar-header p { font-size: var(--sm-font); color: rgba(255,255,255,0.75); }
    .imm-sidebar-body { padding: 1.75rem; }
    .imm-sidebar-line { display: flex; align-items: center; gap: 12px; padding: 0.85rem 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .imm-sidebar-line:last-of-type { border-bottom: none; }
    .imm-sidebar-icon { width: 36px; height: 36px; background: rgba(201,146,46,0.14); border: 1px solid rgba(201,146,46,0.3); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .imm-sidebar-icon svg { width: 15px; height: 15px; stroke: var(--gold-light); fill: none; }
    .imm-sidebar-line strong { display: block; font-size: var(--label-font); color: var(--white); }
    .imm-sidebar-line small { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }
    .imm-avail { display: flex; align-items: center; gap: 8px; background: rgba(201,146,46,0.1); border: 1px solid rgba(201,146,46,0.25); border-radius: 8px; padding: 0.75rem 1rem; margin-top: 1.25rem; font-size: var(--label-font); color: rgba(255,255,255,0.65); }
    .imm-avail-dot { width: 8px; height: 8px; background: var(--gold); border-radius: 50%; flex-shrink: 0; animation: pulse 1.8s infinite; }
    .imm-compare { padding: 6rem 0; background: var(--white); }
    .imm-compare-header { text-align: center; margin-bottom: 3.5rem; }
    .imm-table-wrap { overflow-x: auto; }
    .imm-table { width: 100%; border-collapse: separate; border-spacing: 0; border-radius: 16px; overflow: hidden; border: 1px solid var(--gray-100); }
    .imm-table thead tr { background: var(--navy); }
    .imm-table th { padding: 1.25rem 1.5rem; text-align: left; font-size: var(--sm-font); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.6); }
    .imm-table th:first-child { color: var(--white); }
    .imm-table th.gold-col { color: var(--gold-light); }
    .imm-table tbody tr { background: var(--white); border-bottom: 1px solid var(--gray-100); }
    .imm-table tbody tr:nth-child(even) { background: var(--cream); }
    .imm-table td { padding: 1.1rem 1.5rem; font-size: var(--label-font); color: var(--gray-700); vertical-align: top; }
    .imm-table td:first-child { font-weight: 600; color: var(--navy); }
    .imm-table td.highlight { color: var(--navy); font-weight: 500; }
    .tag-fed { display: inline-block; background: rgba(201,146,46,0.12); border: 1px solid rgba(201,146,46,0.3); color: var(--gold); font-size: var(--sm-font); font-weight: 600; padding: 2px 8px; border-radius: 100px; margin-left: 6px; }
    .imm-facilities { padding: 6rem 0; background: var(--navy); }
    .imm-facilities-header { text-align: center; margin-bottom: 4rem; }
    .imm-fac-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .imm-fac-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(201,146,46,0.15); border-radius: 14px; padding: 1.5rem; transition: border-color var(--transition), background var(--transition); }
    .imm-fac-card:hover { border-color: rgba(201,146,46,0.45); background: rgba(201,146,46,0.06); }
    .imm-fac-tag { font-size: 10px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 0.5rem; display: block; }
    .imm-fac-card h4 { font-family: var(--font-serif); font-size: 1.05rem; font-weight: 600; color: var(--white); margin-bottom: 0.35rem; }
    .imm-fac-card p { font-size: var(--sm-font); color: rgba(255,255,255,0.42); line-height: 1.5; }
    .imm-process { padding: 6rem 0; background: var(--cream); }
    .imm-process-header { text-align: center; margin-bottom: 4rem; }
    .imm-steps { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; position: relative; }
    .imm-steps::before { content: ''; position: absolute; top: 28px; left: calc(10% + 20px); right: calc(10% + 20px); height: 2px; background: linear-gradient(to right, var(--gold), rgba(201,146,46,0.3)); }
    .imm-step { text-align: center; padding: 0 0.75rem; position: relative; }
    .imm-step-num { width: 56px; height: 56px; border-radius: 50%; background: var(--white); border: 2px solid var(--gold); color: var(--navy); font-family: var(--font-serif); font-size: 1.3rem; font-weight: 700; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; position: relative; z-index: 2; box-shadow: 0 0 0 5px var(--cream); }
    .imm-step h4 { font-family: var(--font-serif); font-size: 1rem; font-weight: 600; color: var(--navy); margin-bottom: 0.4rem; }
    .imm-step p { font-size: var(--sm-font); color: var(--gray-500); line-height: 1.6; }
    .imm-testimonial { background: var(--navy-mid); padding: 6rem 0; }
    .imm-testimonial-inner { max-width: 760px; margin: 0 auto; text-align: center; }
    .imm-testi-stars { display: flex; gap: 5px; justify-content: center; margin-bottom: 1.5rem; }
    .imm-testi-stars svg { width: 18px; height: 18px; fill: var(--gold); }
    .imm-testi-lang { display: inline-flex; align-items: center; gap: 8px; background: rgba(201,146,46,0.12); border: 1px solid rgba(201,146,46,0.25); padding: 4px 14px; border-radius: 100px; font-size: var(--sm-font); font-weight: 600; color: var(--gold-light); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 1.25rem; }
    .imm-testi-quote { font-family: var(--font-serif); font-size: clamp(1.3rem, 2.5vw, 1.8rem); font-style: italic; color: var(--white); line-height: 1.65; margin-bottom: 2rem; }
    .imm-testi-author { display: inline-flex; align-items: center; gap: 12px; }
    .imm-testi-avatar { width: 44px; height: 44px; background: rgba(201,146,46,0.15); border: 1px solid rgba(201,146,46,0.35); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: var(--label-font); font-weight: 600; color: var(--gold-light); }
    .imm-testi-name { font-size: var(--label-font); font-weight: 600; color: var(--white); }
    .imm-testi-location { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }

    .imm-spanish { background: var(--gold-pale); padding: 5rem 0; }
    .imm-spanish-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
    .imm-spanish-content h2 { font-family: var(--font-serif); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 600; color: var(--navy); margin-bottom: 1rem; line-height: 1.15; }
    .imm-spanish-content h2 em { font-style: italic; color: var(--gold); }
    .imm-spanish-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.8; margin-bottom: 1rem; }
    .imm-spanish-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 1.5rem; }
    .imm-spanish-badge { display: inline-flex; align-items: center; gap: 6px; background: var(--navy); color: var(--gold-light); font-size: var(--sm-font); font-weight: 600; padding: 6px 14px; border-radius: 100px; }
    .imm-spanish-visual { background: var(--navy); border-radius: 20px; padding: 2.5rem; }
    .imm-lang-row { display: flex; align-items: flex-start; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .imm-lang-row:last-child { border-bottom: none; }
    .imm-lang-flag { font-size: 1.5rem; flex-shrink: 0; margin-top: 2px; }
    .imm-lang-row strong { display: block; font-size: var(--label-font); color: var(--white); margin-bottom: 3px; }
    .imm-lang-row span { font-size: var(--label-font); color: rgba(255,255,255,0.45); line-height: 1.5; }
    
     /* DV page: empathy-first, dark warm tone, conditions explainer */
    .dv-empathy-bar { background: var(--navy-mid); padding: 1rem 0; border-bottom: 1px solid rgba(201,146,46,0.15); }
    .dv-empathy-bar-inner { display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap; }
    .dv-emp-item { font-size: var(--label-font); font-weight: 600; color: rgba(255,255,255,0.7); }

    /* Intro split */
    .dv-intro { padding: 6rem 0; background: var(--cream); }
    .dv-intro-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 5rem; align-items: start; }
    .dv-intro-content .lead-text { font-family: var(--font-serif); font-size: 1.15rem; font-style: italic; color: var(--navy); line-height: 1.7; padding-left: 1.25rem; border-left: 3px solid var(--gold); margin-bottom: 1.5rem; }
    .dv-intro-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.85; margin-bottom: 1rem; }
    .dv-sidebar { position: sticky; top: 96px; }
    .dv-sidebar-card { background: var(--navy); border-radius: 18px; overflow: hidden; }
    .dv-sidebar-top { background: var(--gold); padding: 1.5rem 1.75rem; }
    .dv-sidebar-top h3 { font-family: var(--font-serif); font-size: 1.35rem; font-weight: 600; color: var(--white); }
    .dv-sidebar-top p { font-size: var(--sm-font); color: rgba(255,255,255,0.78); margin-top: 2px; }
    .dv-sidebar-body { padding: 1.75rem; }
    .dv-conf-badge { display: flex; align-items: center; gap: 10px; background: rgba(201,146,46,0.1); border: 1px solid rgba(201,146,46,0.25); border-radius: 10px; padding: 0.85rem 1rem; margin-bottom: 1.25rem; font-size: var(--label-font); color: var(--gold-light); font-weight: 600; }
    .dv-conf-badge svg { width: 16px; height: 16px; stroke: var(--gold-light); fill: none; flex-shrink: 0; }
    .dv-sidebar-line { display: flex; align-items: center; gap: 12px; padding: 0.85rem 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .dv-sidebar-line:last-of-type { border-bottom: none; }
    .dv-sidebar-icon { width: 36px; height: 36px; background: rgba(201,146,46,0.14); border: 1px solid rgba(201,146,46,0.3); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .dv-sidebar-icon svg { width: 15px; height: 15px; stroke: var(--gold-light); fill: none; }
    .dv-sidebar-line strong { display: block; font-size: var(--label-font); color: var(--white); }
    .dv-sidebar-line small { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }

    /* What to expect: 3 horizontal cards on navy */
    .dv-expect { background: var(--navy); padding: 6rem 0; }
    .dv-expect-header { text-align: center; margin-bottom: 4rem; }
    .dv-expect-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
    .dv-expect-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(201,146,46,0.15); border-radius: 16px; padding: 2rem 1.75rem; transition: border-color var(--transition), background var(--transition); }
    .dv-expect-card:hover { border-color: rgba(201,146,46,0.5); background: rgba(201,146,46,0.05); }
    .dv-expect-num { font-family: var(--font-serif); font-size: 3rem; font-weight: 700; color: rgba(201,146,46,0.3); line-height: 1; margin-bottom: 0.75rem; }
    .dv-expect-card h3 { font-family: var(--font-serif); font-size: 1.2rem; font-weight: 600; color: var(--white); margin-bottom: 0.5rem; }
    .dv-expect-card p { font-size: var(--label-font); color: rgba(255,255,255,0.5); line-height: 1.7; }

    /* Bond conditions accordion — unique to this page */
    .dv-conditions { padding: 6rem 0; background: var(--white); }
    .dv-conditions-header { text-align: center; margin-bottom: 3.5rem; }
    .dv-conditions-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: start; }
    .dv-conditions-intro p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.85; margin-bottom: 1rem; }
    .dv-acc-list { display: flex; flex-direction: column; gap: 0; }
    .dv-acc-item { border-bottom: 1px solid var(--gray-100); }
    .dv-acc-item:first-child { border-top: 1px solid var(--gray-100); }
    .dv-acc-btn { width: 100%; background: none; border: none; padding: 1.1rem 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; cursor: pointer; font-family: var(--font-sans); font-size: var(--label-font); font-weight: 600; color: var(--navy); text-align: left; transition: color var(--transition); }
    .dv-acc-btn:hover { color: var(--gold); }
    .dv-acc-chevron { width: 20px; height: 20px; background: var(--cream); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background var(--transition), transform var(--transition); }
    .dv-acc-chevron svg { width: 10px; height: 10px; stroke: var(--navy); fill: none; }
    .dv-acc-item.open .dv-acc-chevron { background: var(--gold); transform: rotate(180deg); }
    .dv-acc-item.open .dv-acc-chevron svg { stroke: var(--white); }
    .dv-acc-body { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.35s ease; font-size: var(--label-font); color: var(--gray-500); line-height: 1.75; }
    .dv-acc-item.open .dv-acc-body { max-height: 300px; padding-bottom: 1rem; }

    /* Rights strip */
    .dv-rights { background: var(--gold-pale); padding: 4rem 0; }
    .dv-rights-inner { display: grid; grid-template-columns: auto 1fr; gap: 3rem; align-items: start; }
    .dv-rights-label { writing-mode: vertical-rl; text-orientation: mixed; font-size: 10px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); transform: rotate(180deg); }
    .dv-rights-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .dv-right-item { padding: 1.25rem; background: var(--white); border-radius: 12px; border: 1px solid rgba(201,146,46,0.2); }
    .dv-right-item h4 { font-family: var(--font-serif); font-size: 1.05rem; font-weight: 600; color: var(--navy); margin-bottom: 0.4rem; }
    .dv-right-item p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.6; }

    /* Testimonial on cream */
    .dv-testimonial { background: var(--cream); padding: 5rem 0; }
    .dv-testimonial-inner { max-width: 700px; margin: 0 auto; }
    .dv-testi-open { font-family: var(--font-serif); font-size: 6rem; color: var(--gold); line-height: 0.6; margin-bottom: 1rem; display: block; }
    .dv-testi-quote { font-family: var(--font-serif); font-size: clamp(1.2rem, 2.5vw, 1.6rem); font-style: italic; color: var(--navy); line-height: 1.7; margin-bottom: 1.75rem; }
    .dv-testi-author { display: flex; align-items: center; gap: 12px; }
    .dv-testi-avatar { width: 44px; height: 44px; background: var(--navy); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: var(--label-font); font-weight: 600; color: var(--gold-light); }
    .dv-testi-stars { display: flex; gap: 3px; margin-bottom: 4px; }
    .dv-testi-stars svg { width: 13px; height: 13px; fill: var(--gold); }
    .dv-testi-name { font-size: var(--label-font); font-weight: 600; color: var(--navy); }
    .dv-testi-loc { font-size: var(--sm-font); color: var(--gray-500); }

    /* Why us: vertical checklist + stat column */
    .dv-whyus { background: var(--white); padding: 6rem 0; }
    .dv-whyus-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
    .dv-check-list { display: flex; flex-direction: column; gap: 1rem; margin-top: 1.5rem; }
    .dv-check-item { display: flex; align-items: flex-start; gap: 14px; padding: 1rem 1.25rem; background: var(--cream); border-radius: 10px; border: 1px solid var(--gray-100); transition: border-color var(--transition); }
    .dv-check-item:hover { border-color: var(--gold); }
    .dv-check-mark { width: 22px; height: 22px; background: var(--navy); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
    .dv-check-mark svg { width: 11px; height: 11px; stroke: var(--gold-light); fill: none; }
    .dv-check-item strong { display: block; font-size: var(--label-font); color: var(--navy); margin-bottom: 2px; }
    .dv-check-item span { font-size: var(--label-font); color: var(--gray-500); line-height: 1.5; }
    .dv-stat-col { background: var(--navy); border-radius: 20px; padding: 3rem 2.5rem; text-align: center; }
    .dv-stat-big { font-family: var(--font-serif); font-size: 5.5rem; font-weight: 700; color: var(--gold-light); line-height: 1; }
    .dv-stat-sub { font-size: var(--label-font); color: rgba(255,255,255,0.45); margin-top: 0.4rem; margin-bottom: 2rem; }
    .dv-stat-mini-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; }
    .dv-stat-mini { background: rgba(255,255,255,0.05); border: 1px solid rgba(201,146,46,0.15); border-radius: 10px; padding: 1rem; }
    .dv-stat-mini strong { display: block; font-family: var(--font-serif); font-size: 1.7rem; font-weight: 700; color: var(--gold-light); line-height: 1; }
    .dv-stat-mini small { font-size: var(--sm-font); color: rgba(255,255,255,0.38); display: block; margin-top: 4px; }
    
    
      /* DUI page unique sections */

    /* Urgency bar */
    .dui-urgency { background: var(--gold); padding: 0.85rem 0; }
    .dui-urgency-inner { display: flex; align-items: center; justify-content: center; gap: 2.5rem; flex-wrap: wrap; }
    .dui-urg-item { display: flex; align-items: center; gap: 8px; font-size: var(--label-font); font-weight: 600; color: var(--white); }
    .dui-urg-item svg { width: 15px; height: 15px; stroke: rgba(255,255,255,0.9); fill: none; }

    /* Intro */
    .dui-intro { padding: 6rem 0; background: var(--cream); }
    .dui-intro-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 5rem; align-items: start; }
    .dui-intro-content .lead-text { font-family: var(--font-serif); font-size: 1.15rem; font-style: italic; color: var(--navy); line-height: 1.7; padding-left: 1.25rem; border-left: 3px solid var(--gold); margin-bottom: 1.5rem; }
    .dui-intro-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.85; margin-bottom: 1rem; }
    .dui-sidebar { position: sticky; top: 96px; }
    .dui-sidebar-card { background: var(--navy); border-radius: 18px; overflow: hidden; }
    .dui-sidebar-header { background: var(--gold); padding: 1.5rem 1.75rem; }
    .dui-sidebar-header h3 { font-family: var(--font-serif); font-size: 1.35rem; font-weight: 600; color: var(--white); }
    .dui-sidebar-header p { font-size: var(--sm-font); color: rgba(255,255,255,0.75); margin-top: 2px; }
    .dui-sidebar-body { padding: 1.75rem; }
    .dui-sidebar-line { display: flex; align-items: center; gap: 12px; padding: 0.85rem 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .dui-sidebar-line:last-of-type { border-bottom: none; }
    .dui-sidebar-icon { width: 36px; height: 36px; background: rgba(201,146,46,0.14); border: 1px solid rgba(201,146,46,0.3); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .dui-sidebar-icon svg { width: 15px; height: 15px; stroke: var(--gold-light); fill: none; }
    .dui-sidebar-line strong { display: block; font-size: var(--label-font); color: var(--white); }
    .dui-sidebar-line small { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }
    .dui-avail { display: flex; align-items: center; gap: 8px; background: rgba(201,146,46,0.1); border: 1px solid rgba(201,146,46,0.25); border-radius: 8px; padding: 0.75rem 1rem; margin-top: 1.25rem; font-size: var(--label-font); color: rgba(255,255,255,0.65); }
    .dui-avail-dot { width: 8px; height: 8px; background: var(--gold); border-radius: 50%; flex-shrink: 0; animation: pulse 1.8s infinite; }

    /* Timeline: arrest to home */
    .dui-timeline { padding: 6rem 0; background: var(--white); }
    .dui-timeline-header { text-align: center; margin-bottom: 4rem; }
    .dui-timeline-wrap { max-width: 820px; margin: 0 auto; position: relative; }
    .dui-timeline-wrap::before { content: ''; position: absolute; left: 28px; top: 0; bottom: 0; width: 2px; background: linear-gradient(to bottom, var(--gold), rgba(201,146,46,0.15)); }
    .dui-tl-item { display: flex; gap: 2rem; margin-bottom: 2.5rem; position: relative; }
    .dui-tl-item:last-child { margin-bottom: 0; }
    .dui-tl-dot { width: 56px; height: 56px; border-radius: 50%; background: var(--navy); border: 2px solid var(--gold); display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; z-index: 2; }
    .dui-tl-dot svg { width: 20px; height: 20px; stroke: var(--gold-light); fill: none; }
    .dui-tl-dot.highlight { background: var(--gold); }
    .dui-tl-dot.highlight svg { stroke: var(--white); }
    .dui-tl-content { padding-top: 0.85rem; flex: 1; }
    .dui-tl-tag { font-size: 10px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--gold); margin-bottom: 0.3rem; display: block; }
    .dui-tl-content h3 { font-family: var(--font-serif); font-size: 1.2rem; font-weight: 600; color: var(--navy); margin-bottom: 0.4rem; }
    .dui-tl-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.7; }

    /* Jail speed grid */
    .dui-speed { padding: 6rem 0; background: var(--navy); }
    .dui-speed-header { text-align: center; margin-bottom: 4rem; }
    .dui-speed-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
    .dui-speed-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(201,146,46,0.15); border-radius: 14px; padding: 1.5rem 1.25rem; text-align: center; transition: border-color var(--transition), background var(--transition); }
    .dui-speed-card:hover { border-color: rgba(201,146,46,0.5); background: rgba(201,146,46,0.06); }
    .dui-speed-name { font-size: var(--label-font); font-weight: 600; color: var(--white); margin-bottom: 0.5rem; }
    .dui-speed-time { font-family: var(--font-serif); font-size: 2rem; font-weight: 700; color: var(--gold-light); line-height: 1; margin-bottom: 0.3rem; }
    .dui-speed-sub { font-size: var(--sm-font); color: rgba(255,255,255,0.35); }

    /* What happens next */
    .dui-next { padding: 6rem 0; background: var(--cream); }
    .dui-next-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: start; }
    .dui-next-content h2 { margin-bottom: 0.5rem; }
    .dui-next-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.8; margin-bottom: 1.5rem; }
    .dui-next-list { display: flex; flex-direction: column; gap: 0; }
    .dui-next-item { display: flex; align-items: flex-start; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid var(--gray-100); }
    .dui-next-item:last-child { border-bottom: none; }
    .dui-next-num { font-family: var(--font-serif); font-size: 1.6rem; font-weight: 700; color: var(--gold); line-height: 1; flex-shrink: 0; width: 32px; }
    .dui-next-item h4 { font-family: var(--font-serif); font-size: 1rem; font-weight: 600; color: var(--navy); margin-bottom: 3px; }
    .dui-next-item p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.6; margin: 0; }
    .dui-next-sidebar { background: var(--white); border-radius: 16px; border: 1px solid var(--gray-100); overflow: hidden; }
    .dui-cost-header { background: var(--navy); padding: 1.5rem; }
    .dui-cost-header h3 { font-family: var(--font-serif); font-size: 1.2rem; font-weight: 600; color: var(--white); }
    .dui-cost-body { padding: 1.5rem; }
    .dui-cost-row { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 0; border-bottom: 1px solid var(--gray-100); font-size: var(--label-font); }
    .dui-cost-row:last-child { border-bottom: none; }
    .dui-cost-row span { color: var(--gray-500); }
    .dui-cost-row strong { color: var(--navy); }
    .dui-cost-row.total strong { color: var(--gold); font-size: 1.05rem; }
    .dui-calc-note { font-size: var(--sm-font); color: var(--gray-300); line-height: 1.6; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--gray-100); }

    /* Dual testimonials */
    .dui-testi { padding: 6rem 0; background: var(--white); }
    .dui-testi-header { text-align: center; margin-bottom: 4rem; }
    .dui-testi-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
    .dui-testi-card { background: var(--cream); border-radius: 16px; padding: 2rem; border: 1px solid var(--gray-100); }
    .dui-testi-stars { display: flex; gap: 4px; margin-bottom: 1rem; }
    .dui-testi-stars svg { width: 14px; height: 14px; fill: var(--gold); }
    .dui-testi-card blockquote { font-family: var(--font-serif); font-size: 1.05rem; font-style: italic; color: var(--navy); line-height: 1.7; margin-bottom: 1.25rem; }
    .dui-testi-author { display: flex; align-items: center; gap: 10px; }
    .dui-testi-avatar { width: 36px; height: 36px; background: var(--navy); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: var(--sm-font); font-weight: 600; color: var(--gold-light); }
    .dui-testi-name { font-size: var(--label-font); font-weight: 600; color: var(--navy); }
    .dui-testi-loc { font-size: var(--sm-font); color: var(--gray-500); }


    /* WARRANT page unique layout: risk-focused, dark urgent feel */
    .wa-risk-bar { background: var(--navy-mid); border-bottom: 1px solid rgba(201,146,46,0.2); padding: 0.9rem 0; }
    .wa-risk-bar-inner { display: flex; align-items: center; justify-content: center; gap: 2.5rem; flex-wrap: wrap; }
    .wa-risk-item { font-size: var(--label-font); font-weight: 600; color: rgba(255,255,255,0.75); }

    .wa-intro { padding: 6rem 0; background: var(--cream); }
    .wa-intro-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 5rem; align-items: start; }
    .wa-intro-content .lead-text { font-family: var(--font-serif); font-size: 1.15rem; font-style: italic; color: var(--navy); line-height: 1.7; padding-left: 1.25rem; border-left: 3px solid var(--gold); margin-bottom: 1.5rem; }
    .wa-intro-content p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.85; margin-bottom: 1rem; }
    .wa-sidebar { position: sticky; top: 96px; }
    .wa-sidebar-card { background: var(--navy); border-radius: 18px; overflow: hidden; }
    .wa-sidebar-header { background: var(--gold); padding: 1.5rem 1.75rem; }
    .wa-sidebar-header h3 { font-family: var(--font-sans); font-size: var(--label-font); font-weight: 600; color: var(--white); }
    .wa-sidebar-header p { font-size: var(--sm-font); color: rgba(255,255,255,0.75); margin-top: 2px; }
    .wa-sidebar-body { padding: 1.75rem; }
    .wa-sidebar-line { display: flex; align-items: center; gap: 12px; padding: 0.85rem 0; border-bottom: 1px solid rgba(255,255,255,0.07); }
    .wa-sidebar-line:last-of-type { border-bottom: none; }
    .wa-sidebar-icon { width: 36px; height: 36px; background: rgba(201,146,46,0.14); border: 1px solid rgba(201,146,46,0.3); border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .wa-sidebar-icon svg { width: 15px; height: 15px; stroke: var(--gold-light); fill: none; }
    .wa-sidebar-line strong { display: block; font-size: var(--label-font); color: var(--white); }
    .wa-sidebar-line small { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }
    .wa-avail { display: flex; align-items: center; gap: 8px; background: rgba(201,146,46,0.1); border: 1px solid rgba(201,146,46,0.25); border-radius: 8px; padding: 0.75rem 1rem; margin-top: 1.25rem; font-size: var(--label-font); color: rgba(255,255,255,0.65); }
    .wa-avail-dot { width: 8px; height: 8px; background: var(--gold); border-radius: 50%; flex-shrink: 0; animation: pulse 1.8s infinite; }

    /* Proactive vs Reactive comparison */
    .wa-compare { padding: 6rem 0; background: var(--white); }
    .wa-compare-header { text-align: center; margin-bottom: 4rem; }
    .wa-compare-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
    .wa-comp-col { border-radius: 16px; overflow: hidden; }
    .wa-comp-head { padding: 1.5rem; }
    .wa-comp-head.bad { background: var(--gray-700); }
    .wa-comp-head.good { background: var(--navy); }
    .wa-comp-head h3 { font-family: var(--font-sans); font-size: var(--label-font); font-weight: 600; color: var(--white); margin-bottom: 0.2rem; }
    .wa-comp-head p { font-size: var(--sm-font); color: rgba(255,255,255,0.55); }
    .wa-comp-body { border: 1px solid var(--gray-100); border-top: none; border-radius: 0 0 16px 16px; }
    .wa-comp-item { display: flex; align-items: flex-start; gap: 12px; padding: 1rem 1.25rem; border-bottom: 1px solid var(--gray-100); }
    .wa-comp-item:last-child { border-bottom: none; }
    .wa-comp-icon { width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 1px; }
    .wa-comp-icon.x { background: rgba(220,50,50,0.1); }
    .wa-comp-icon.x svg { width: 10px; height: 10px; stroke: #dc3232; fill: none; }
    .wa-comp-icon.check { background: rgba(201,146,46,0.12); }
    .wa-comp-icon.check svg { width: 10px; height: 10px; stroke: var(--gold); fill: none; }
    .wa-comp-item p { font-size: var(--label-font); color: var(--gray-700); line-height: 1.5; margin: 0; }

    /* Warrant types */
    .wa-types { padding: 6rem 0; background: var(--navy); }
    .wa-types-header { text-align: center; margin-bottom: 4rem; }
    .wa-types-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
    .wa-type-card { background: rgba(255,255,255,0.05); border: 1px solid rgba(201,146,46,0.15); border-radius: 14px; padding: 1.75rem; transition: border-color var(--transition), background var(--transition); }
    .wa-type-card:hover { border-color: rgba(201,146,46,0.5); background: rgba(201,146,46,0.06); }
    .wa-type-icon { width: 48px; height: 48px; background: rgba(201,146,46,0.12); border: 1px solid rgba(201,146,46,0.25); border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; }
    .wa-type-icon svg { width: 20px; height: 20px; stroke: var(--gold-light); fill: none; }
    .wa-type-card h3 { font-family: var(--font-sans); font-size: var(--label-font); font-weight: 600; color: var(--white); margin-bottom: 0.4rem; }
    .wa-type-card p { font-size: var(--label-font); color: rgba(255,255,255,0.48); line-height: 1.65; }

    /* Our process for warrants */
    .wa-process { padding: 6rem 0; background: var(--white); }
    .wa-process-header { text-align: center; margin-bottom: 4rem; }
    .wa-process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; position: relative; }
    .wa-process-grid::before { content: ''; position: absolute; top: 26px; left: calc(12.5% + 20px); right: calc(12.5% + 20px); height: 1px; background: rgba(201,146,46,0.3); }
    .wa-proc-item { text-align: center; }
    .wa-proc-num { width: 52px; height: 52px; border-radius: 50%; background: var(--white); border: 2px solid var(--gold); color: var(--navy); font-family: var(--font-sans); font-size: var(--label-font); font-weight: 700; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.25rem; position: relative; z-index: 2; box-shadow: 0 0 0 5px var(--cream); }
    .wa-proc-item h4 { font-family: var(--font-sans); font-size: var(--label-font); font-weight: 600; color: var(--navy); margin-bottom: 0.4rem; }
    .wa-proc-item p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.6; }

    /* Testimonial navy panel */
    .wa-testimonial { background: var(--navy-mid); padding: 6rem 0; }
    .wa-testi-inner { max-width: 760px; margin: 0 auto; text-align: center; }
    .wa-testi-stars { display: flex; gap: 5px; justify-content: center; margin-bottom: 1.5rem; }
    .wa-testi-stars svg { width: 18px; height: 18px; fill: var(--gold); }
    .wa-testi-quote { font-family: var(--font-serif); font-size: clamp(1.3rem, 2.5vw, 1.8rem); font-style: italic; color: var(--white); line-height: 1.65; margin-bottom: 2rem; }
    .wa-testi-author { display: inline-flex; align-items: center; gap: 12px; }
    .wa-testi-avatar { width: 44px; height: 44px; background: rgba(201,146,46,0.15); border: 1px solid rgba(201,146,46,0.35); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: var(--label-font); font-weight: 600; color: var(--gold-light); }
    .wa-testi-name { font-size: var(--label-font); font-weight: 600; color: var(--white); }
    .wa-testi-loc { font-size: var(--sm-font); color: rgba(255,255,255,0.4); }

    /* Benefits section */
    .wa-benefits { padding: 6rem 0; background: var(--white); }
    .wa-benefits-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
    .wa-benefits-list { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1.5rem; }
    .wa-benefit-item { display: flex; align-items: flex-start; gap: 1rem; }
    .wa-benefit-icon { width: 42px; height: 42px; background: var(--navy); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
    .wa-benefit-icon svg { width: 18px; height: 18px; stroke: var(--gold-light); fill: none; }
    .wa-benefit-item h4 { font-family: var(--font-serif); font-size: 1.1rem; font-weight: 600; color: var(--navy); margin-bottom: 3px; }
    .wa-benefit-item p { font-size: var(--label-font); color: var(--gray-500); line-height: 1.6; margin: 0; }
    .wa-benefits-visual { background: var(--navy); border-radius: 20px; padding: 3rem; text-align: center; }
    .wa-big-num { font-family: var(--font-serif); font-size: 5.5rem; font-weight: 700; color: var(--gold-light); line-height: 1; }
    .wa-big-sub { font-size: var(--label-font); color: rgba(255,255,255,0.45); margin-top: 0.4rem; margin-bottom: 2rem; }
    .wa-mini-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2rem; }
    .wa-mini { background: rgba(255,255,255,0.05); border: 1px solid rgba(201,146,46,0.15); border-radius: 10px; padding: 1rem; }
    .wa-mini strong { display: block; font-family: var(--font-serif); font-size: 1.5rem; font-weight: 700; color: var(--gold-light); line-height: 1; }
    .wa-mini small { font-size: var(--sm-font); color: rgba(255,255,255,0.38); display: block; margin-top: 4px; }
    
     .calc-section {

    margin: 32px auto 0;
    background: var(--navy-mid);
    border-radius: 8px;
    padding: 28px;
    border: 0.5px solid rgba(201,168,76,0.2);
  }

  .calc-section h3 {
    font-size: var(--label-font);
    font-weight: 600;
    color: #C9A84C;
    margin-bottom: 18px;
    letter-spacing: 0.05em;
  }

  .calc-row {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
  }

  .calc-row label {
    font-size: var(--label-font);
    color: rgba(255,255,255,0.6);
    min-width: 100px;
  }

  .calc-row input[type="range"] {
    flex: 1;
    accent-color: #C9A84C;
  }

  .calc-row span {
    font-size: var(--label-font);
    font-weight: 600;
    color: #fff;
    min-width: 80px;
    text-align: right;
  }

  .calc-result {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 0.5px solid rgba(201,168,76,0.3);
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }

  .calc-result .result-label {
    font-size: var(--label-font);
    color: rgba(255,255,255,0.5);
  }

  .calc-result .result-val {
    font-family: 'Playfair Display', serif;
    font-size: 30px;
    color: #C9A84C;
    font-weight: 600;
  }
  /* =============================================
       INTRO SECTION (What is Criminal Bail Bond)
       ============================================= */
    .intro-section {
      background: var(--warm-white);
    }

    .intro-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 64px;
      align-items: start;
    }

    .intro-text{
      line-height: 1.85;
      color: var(--text-body);
      margin-bottom: 20px;
      max-width:480px;
    }
    .center-text-intro{
	 font-size: var(--label-font);
      color: var(--gray-900); 
      max-width: 480px;  
      margin:0 auto; 
    }
     .sm-text {
      line-height: 1.85;
      font-size: var(--sm-font);
      color: var(--gray-900);
      margin: 20px 0;
      text-align: center;
    }

    .intro-highlight {
      background: var(--navy);
      background-image: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
      border-left: 4px solid var(--gold);
      padding: 28px 32px;
      border-radius: 0 4px 4px 0;
      margin-top: 32px;
    }
    .intro-highlight p {
      color: var(--cream);
      margin: 0;
      font-style: italic;
      font-weight: 300;
    }
    .intro-highlight strong {
      color: var(--gold-light);
      font-style: normal;
      font-weight: 600;
    }
 /* =============================================
       TYPES OF CRIMINAL CHARGES SECTION
       ============================================= */
/* Stats column */
     .stats-column {display: flex;flex-direction: column;gap: 24px;}
     .stat-card {background: #fff;border: 1px solid var(--border);border-radius: 4px;padding: 28px 32px;box-shadow: var(--shadow-card);display: flex;align-items: flex-start;gap: 20px;transition: border-color 0.2s, box-shadow 0.2s;}
     .stat-card:hover {border-color: var(--gold);box-shadow: 0 12px 40px rgba(10, 22, 40, 0.14);}
     .stat-number {font-family: var(--font-serif);font-weight: 900;font-size: 2.8rem;color: var(--gold);line-height: 1;flex-shrink: 0;}
     .stat-label {font-size: var(--label-font);color: var(--text-body);font-weight: 400;line-height: 1.5;padding-top: 6px;}
     .stat-label strong {display: block;color: var(--navy);font-weight: 600;margin-bottom: 4px;}
/* service-area-section */      
     .service-area-section {background: var(--white);text-align: center;padding: 6rem 0;}
     .service-area-section .section-title,.service-area-section .section-subtitle {margin-left: auto;margin-right: auto;}
     .service-area-section .gold-line {margin: 24px auto;}
     .cities-grid {display: flex;flex-wrap: wrap;gap: 10px;justify-content: center;margin-top: 40px;max-width: 800px;margin-left: auto;margin-right: auto;}
     .city-tag {background: var(--cream);border: 1px solid var(--border);color: var(--text-body);padding: 8px 18px;border-radius: 2px;font-size: 0.875rem;transition: border-color 0.2s, color 0.2s;}
     .city-tag:hover {border-color: var(--gold);color: var(--navy);}      
/* why-section */ 
     .why-section {background: var(--navy);color: var(--cream);position: relative;overflow: hidden;padding: 6rem 0;}
     .why-section::before {content: '"';position: absolute;top: 40px; right: 80px;font-family: var(--font-serif);font-size: 20rem;color: rgba(201, 146, 42, 0.04);line-height: 1;pointer-events: none;}
     .why-header {margin-bottom: 56px;}
     .why-header .section-title {color: #fff;}
     .why-header .section-subtitle {color: rgba(245, 240, 232, 0.7);}
     .why-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 28px;}
     .why-card {background: rgba(255, 255, 255, 0.04);border: 1px solid rgba(201, 146, 42, 0.2);border-radius: 4px;padding: 32px 28px;transition: background 0.2s, border-color 0.2s;}
     .why-card:hover {background: rgba(201, 146, 42, 0.07);border-color: rgba(201, 146, 42, 0.5);}
     .why-card-icon {width: 44px;height: 44px;background: rgba(201, 146, 42, 0.15);border: 1px solid var(--gold);border-radius: 2px;display: flex;align-items: center;justify-content: center;font-size: 1.2rem;margin-bottom: 20px;}
     .why-card-title {font-family: var(--font-sans);font-weight: 700;font-size: var(--label-font);color: var(--gold-light);margin-bottom: 12px;}
     .why-card-text {font-size: var(--label-font);color: rgba(245, 240, 232, 0.75);line-height: 1.75;}  
/* charges-section */   
     .charges-section {background: var(--warm-white);padding: 6rem 0;}
     .charges-layout {display: grid;grid-template-columns: 1fr 2fr;gap: 64px;align-items: start;}
     .charges-intro p {line-height: 1.85;color: var(--text-body);margin-bottom: 16px;font-size: var(--label-font);}
     .charges-grid {display: grid;grid-template-columns: 1fr 1fr;gap: 16px;}
     .charge-card {background: #fff;border: 1px solid var(--border);border-radius: 4px;padding: 22px 24px;box-shadow: var(--shadow-card);transition: border-color 0.2s, transform 0.2s;}
     .charge-card:hover {border-color: var(--gold);transform: translateY(-3px);}
     .charge-icon {font-size: 1.5rem;margin-bottom: 10px;display: block;}
     .charge-title {font-family: var(--font-sans);font-weight: 700;font-size: var(--label-font);color: var(--navy);margin-bottom: 8px;}
     .charge-desc {color: var(--text-muted);line-height: 1.65;}
/* Discount */  
    .discount {background: var(--cream);padding: 6rem 0;}
    .discount-inner {display: grid;grid-template-columns: 1fr 1fr;gap: 5rem;align-items: center;}
    .discount-pct {font-family: var(--font-serif);font-size: clamp(4rem, 10vw, 8rem);font-weight: 700;color: var(--gold);line-height: 1;margin-bottom: 0.5rem;}
    .discount-sub {font-family: var(--font-sans);font-size: var(--label-font);font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: var(--gray-500);margin-bottom: 1.5rem;}
    .discount-content .section-title {margin-bottom: 1rem;}
    .discount-list {list-style: none;display: grid;grid-template-columns: 1fr 1fr;gap: 0.75rem;margin-bottom: 2rem;}
    .discount-list li {display: flex;align-items: center;gap: 8px;font-size: var(--label-font);color: var(--gray-700);}
    .discount-list li::before {content: '';width: 6px;height: 6px;background: var(--gold);border-radius: 50%;flex-shrink: 0;}   
 /* Testimonials */
    .testimonials {background: var(--white);padding: 7rem 0;}
    .testimonials-header {text-align: center;margin-bottom: 4rem;}
    .testimonials-header .divider {margin: 1.5rem auto;}.testimonials-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 1.5rem;}
.testimonials-slider {
    width: 100%;
}

.testimonials-track-wrapper {
    overflow: hidden;
    width: 100%;
}

.testimonials-track {
    display: flex;
    gap: 1.5rem;
    transition: transform 0.5s ease;
}

/* controles abajo */
.testimonial-controls {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 30px;
}

.testimonial-btn {
    width: 50px;
    height: 50px;
    border: none;
    border-radius: 50%;
    background: var(--navy);
    color: var(--gold-light);
    font-size: 22px;
    cursor: pointer;
    transition: 0.3s ease;
}

.testimonial-btn:hover {
    transform: scale(1.05);
}
.testimonial-card {
    background: var(--cream);
    border-radius: 14px;
    padding: 2rem;
    box-sizing: border-box;
    flex: 0 0 calc((100% - 3rem) / 3);
}
    .testimonial-stars {display: flex;gap: 4px;margin-bottom: 1rem;}
    .star-icon {width: 14px;height: 14px;fill: var(--gold);}
    .testimonial-card blockquote {font-family: var(--font-sans);font-size: 0.9rem;font-style: italic;color: var(--navy);line-height: 1.7;margin-bottom: 1.25rem;}
    .testimonial-author {display: flex;align-items: center;gap: 10px;}
    .author-avatar {width: 36px;height: 36px;background: var(--navy);border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: var(--label-font);font-weight: 600;color: var(--gold-light);flex-shrink: 0;}
    .author-name {font-size: var(--label-font);font-weight: 600;color: var(--navy);}
    .author-location {font-size: var(--sm-font);color: var(--gray-500);}    
/* Reasons-section */
    .reasons-section {background: var(--cream);padding: 6rem 0;}
    .reasons-inner {display: grid;grid-template-columns: 1fr 1fr;gap: 4rem;align-items: center;}
    .reasons-content h2 {margin-bottom: 0.5rem;}
    .reasons-content .intro-text {font-size: var(--label-font);color: var(--gray-500);line-height: 1.8;margin-bottom: 2rem;}
    .reason-list {list-style: none;display: flex;flex-direction: column;gap: 1rem;}
    .reason-item {display: flex;gap: 14px;align-items: flex-start;padding: 1rem 1.25rem;background: var(--cream);border-radius: 10px;border: 1px solid var(--gray-100);transition: border-color var(--transition);}
    .reason-item:hover {border-color: var(--gold);}
    .reason-check {width: 22px;height: 22px;background: var(--navy);border-radius: 50%;display: flex;align-items: center;justify-content: center;flex-shrink: 0;margin-top: 2px;}
    .reason-check svg {width: 11px;height: 11px;stroke: var(--gold-light);fill: none;}
    .reason-item strong {display: block;font-size: var(--label-font);color: var(--navy);margin-bottom: 2px;}
    .reason-item p {font-size: var(--label-font);color: var(--gray-500);line-height: 1.6;margin: 0;}
    .reasons-visual {background: var(--navy);border-radius: 20px;padding: 3rem;text-align: center;}
    .big-stat {font-family: var(--font-serif);font-size: 6rem;font-weight: 700;color: var(--gold-light);line-height: 1;}
    .big-stat-sub {font-size: var(--label-font);color: rgba(255, 255, 255, 0.5);margin-top: 0.5rem;margin-bottom: 2rem;}
    .mini-stats {display: grid;grid-template-columns: 1fr 1fr;gap: 1rem;}
    .mini-stat {background: rgba(255, 255, 255, 0.05);border: 1px solid rgba(201, 146, 46, 0.15);border-radius: 10px;padding: 1rem;}
    .mini-stat strong {display: block;font-family: var(--font-serif);font-size: 1.6rem;font-weight: 700;color: var(--gold-light);line-height: 1;}
    .mini-stat small {font-size: var(--sm-font);color: rgba(255, 255, 255, 0.4);margin-top: 4px;display: block;}
/* Services overview */
    .services-overview { padding: 6rem 0; background: var(--cream); }
    .overview-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 1.5rem;margin-top: 3.5rem;}
    .service-feature-card {background: var(--white);border-radius: 16px;border: 1px solid var(--gray-100);overflow: hidden;transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);}
    .service-feature-card:hover {border-color: var(--gold);box-shadow: var(--shadow-md);transform: translateY(-4px);}
    .card-header {background: var(--navy);padding: 2rem 1.75rem 1.5rem;position: relative;overflow: hidden;}
    .card-header::after {content: '';position: absolute;right: -20px; bottom: -20px;width: 100px; height: 100px;border-radius: 50%;border: 1px solid rgba(201, 146, 46, 0.15);}
    .card-icon-wrap {width: 52px; height: 52px;background: rgba(201, 146, 46, 0.15);border: 1px solid rgba(201, 146, 46, 0.3);border-radius: 12px;display: flex; align-items: center; justify-content: center;margin-bottom: 1.25rem;}
    .card-icon-wrap svg { width: 22px; height: 22px; stroke: var(--gold-light); fill: none; }
    .card-header h3 {font-family: var(--font-sans);font-size: var(--label-font);font-weight: 600;color: var(--white);margin-bottom: 0.4rem;}
    .card-header .tag {font-size: var(--sm-font);font-weight: 600;letter-spacing: 0.12em;text-transform: uppercase;color: var(--gold-light);opacity: 0.8;}
    .card-body {padding: 1.75rem;}
    .card-body p {font-size: var(--label-font);color: var(--gray-500);line-height: 1.75;margin-bottom: 1.25rem;}
    .card-features {list-style: none;display: flex;flex-direction: column;gap: 8px;margin-bottom: 1.5rem;}
    .card-features li {display: flex;align-items: flex-start;gap: 10px;font-size: var(--label-font);color: var(--gray-700);}
    .card-features li::before {content: '';width: 5px;height: 5px;background: var(--gold);border-radius: 50%;flex-shrink: 0;margin-top: 7px;}
    .card-cta {display: inline-flex;align-items: center;gap: 8px;font-size: var(--label-font);font-weight: 600;color: var(--gold);transition: gap var(--transition), color var(--transition);}
    .card-cta:hover { gap: 12px; color: var(--gold-light); }
    .card-cta svg { width: 14px; height: 14px; stroke: currentColor; fill: none; }   
/* CTA strip */
    .cta-strip {background: var(--navy);padding: 5rem 0;}
    .cta-strip-inner {display: flex;align-items: center;justify-content: space-between;gap: 3rem;flex-wrap: wrap;}
    .cta-strip h2 {font-family: var(--font-serif);font-size: clamp(1.8rem, 3.5vw, 2.8rem);font-weight: 600;color: var(--white);}
    .cta-strip p {color: rgba(255, 255, 255, 0.55);margin-top: 0.4rem;}
    .cta-strip-actions {display: flex;gap: 1rem;flex-shrink: 0;flex-wrap: wrap;}
 /* FAQ SECTION */
/* ============================================
       TWO COLUMN FAQ GRID
       Each column scrolls independently — opening
       an item in one column does NOT push the other
    ============================================ */
    .faq-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 24px;
      align-items: start; /* columns start at same top, grow independently */
    }

    /* Each column is a self-contained flex stack */
    .faq-column {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    /* ============================================
       FAQ ITEM
    ============================================ */
    .faq-accordion .faq-item {
  border-bottom: 1px solid #ddd;
}

.faq-accordion .faq-question {
  cursor: pointer;
  list-style: none;
}

.faq-accordion .faq-question::-webkit-details-marker {
  display: none;
}

.faq-accordion .accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease;
}

.faq-accordion .faq-item[open] .accordion-content {
  overflow: hidden;
}
     .faq-section {
      background: var(--white);
      padding: 6rem 0 7rem;
    }
        .faq-header {
      text-align: center;
      margin-bottom: 4rem;
    }
        .faq-divider {
      width: 56px;
      height: 3px;
      background: linear-gradient(90deg, var(--gold), var(--gold-light));
      margin: 0 auto 1.25rem;
      border-radius: 2px;
    }
    .faq-item {
      border: 1px solid var(--border);
      border-radius: 6px;
      background: var(--cream);
      overflow: hidden;
      transition: border-color 0.25s, box-shadow 0.25s;
    }

    .faq-item:hover {
      border-color: var(--gold);
    }

    details[open].faq-item {
      border-color: var(--gold);

    }
      .faq-section-subtitle {
      font-size: var(--label-font);
      color: var(--text-muted);
      max-width: 560px;
      margin: 10px auto;
      line-height: 1.8;
    }
.faq-question::-webkit-details-marker {
    display: none;
}
.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}
    /* Question row */
    .faq-question {
      padding: 18px 22px;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 14px;
      font-size: var(--label-font);
      font-weight: 700;
      color: var(--navy);
      list-style: none;
      user-select: none;
      line-height: 1.4;
    }

    /* Hide default marker in all browsers */
    .faq-question::-webkit-details-marker { display: none; }

    /* Plus / X toggle icon */
    .faq-question::after {
      content: '+';
      font-size: 1.4rem;
      font-weight: 300;
      color: var(--gold);
      flex-shrink: 0;
      transition: transform 0.25s;
      line-height: 1;
    }

    details[open] .faq-question::after {
      transform: rotate(45deg);
    }

    /* Answer body */
    .faq-answer {
      padding: 0 22px 20px;
      border-top: 1px solid var(--border);
      padding-top: 16px;
      color: var(--text-body);
          font-size: var(--label-font);
      line-height: 1.85;
    }
/* CTA bilingual */
    .bilingual {background: var(--navy-mid);padding: 5rem 0;}
    .bilingual-inner {display: flex;align-items: center;gap: 4rem;}
    .bilingual-flag {flex-shrink: 0;width: 72px;height: 72px;background: rgba(201, 146, 46, 0.12);border: 1px solid rgba(201, 146, 46, 0.3);border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 36px;}
    .bilingual-text p {font-size: var(--label-font);color: rgba(255, 255, 255, 0.6);line-height: 1.7;}
    .bilingual-cta {margin-left: auto;flex-shrink: 0;}
/* Responsive */
@media (max-width: 1024px) {

    .explainer-grid,
    .reasons-inner {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .cost-grid {
        grid-template-columns: 1fr 1fr;
    }

    .jails-grid {
        grid-template-columns: 1fr 1fr;
    }
      .explainer-grid, .reasons-inner { grid-template-columns: 1fr; gap: 3rem; }
      .cost-grid { grid-template-columns: 1fr 1fr; }
      .jails-grid { grid-template-columns: 1fr 1fr; }
      .story-grid, .team-feature { grid-template-columns: 1fr; gap: 3rem; }
      .values-grid { grid-template-columns: 1fr 1fr; }
      .team-portrait { min-height: 260px; flex-direction: row; justify-content: flex-start; }
      .team-bio { padding: 2.5rem; }
            .overview-grid { grid-template-columns: 1fr 1fr; }
      .steps-grid { grid-template-columns: 1fr 1fr; gap: 3rem; }
      .steps-grid::before { display: none; }
      .payment-inner { grid-template-columns: 1fr; gap: 3rem; }
      .faq-grid { grid-template-columns: 1fr; }
            .wa-intro-grid { grid-template-columns: 1fr; gap: 3rem; }
      .wa-sidebar { position: static; }
      .wa-types-grid { grid-template-columns: 1fr 1fr; }
      .wa-process-grid { grid-template-columns: 1fr 1fr; }
      .wa-process-grid::before { display: none; }
      .wa-benefits-grid { grid-template-columns: 1fr; gap: 3rem; }
            .dui-intro-grid { grid-template-columns: 1fr; gap: 3rem; }
      .dui-sidebar { position: static; }
      .dui-speed-grid { grid-template-columns: 1fr 1fr; }
      .dui-next-grid { grid-template-columns: 1fr; gap: 3rem; }
      .dui-testi-grid { grid-template-columns: 1fr; }
            .dv-intro-grid { grid-template-columns: 1fr; gap: 3rem; }
      .dv-sidebar { position: static; }
      .dv-expect-grid { grid-template-columns: 1fr 1fr; }
      .dv-conditions-inner { grid-template-columns: 1fr; gap: 3rem; }
      .dv-rights-grid { grid-template-columns: 1fr 1fr; }
      .dv-whyus-grid { grid-template-columns: 1fr; gap: 3rem; }
      .testimonial-card {flex: 0 0 calc((100% - 1.5rem) / 2);}
      .testimonial-controls {margin-top: 25px;}
      .testimonial-btn {width: 45px;height: 45px;font-size: 20px;}
}



/* Responsive */
@media (max-width: 768px) {

    .charges-layout,.charges-grid,.why-card,.why-grid,.cost-grid,.faq-layout  {grid-template-columns: 1fr;}
    .jails-grid {grid-template-columns: 1fr;}
    .quick-info-inner {gap: 1.5rem;}
    .nav-hamburger {display: flex;}
    .nav-links {display: none;}
    .nav-drawer {display: flex;}
    .services-grid, .testimonials-grid { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: 1fr 1fr; }
    .discount-list, .discount-inner, .services-header,.hero-iner { grid-template-columns: 1fr; }
    .bilingual-inner { flex-direction: column; text-align: center; }
    .bilingual-cta { margin-left: 0; }
    .contact-form-wrap{padding: 10px;}
    .footer-inner {grid-template-columns: 1fr;gap: 2rem;}
    .footer-bottom {flex-direction: column;gap: 1rem;text-align: center;}
    .cta-strip-inner {flex-direction: column;text-align: center;}
    .cta-strip-actions {justify-content: center;}
    .page-hero {padding: 7rem 0 3.5rem;}
     .container {padding: 0 1.25rem;}
      .contact-grid { grid-template-columns: 1fr; }
      .form-row { grid-template-columns: 1fr; }
      .how-grid { grid-template-columns: 1fr; }
      .cost-grid { grid-template-columns: 1fr; }
      .jails-grid { grid-template-columns: 1fr; }
      .quick-info-inner { gap: 1.5rem; }
      .values-grid { grid-template-columns: 1fr; }
      .year-stats { grid-template-columns: 1fr 1fr; }
      .timeline::before { left: 1.5rem; }
      .timeline-item, .timeline-item:nth-child(even) { padding-left: 4rem; padding-right: 0; justify-content: flex-start; }
      .timeline-dot { left: 1.5rem; }
      .team-portrait { flex-direction: column; }
      .overview-grid { grid-template-columns: 1fr; }
      .payment-options-grid { grid-template-columns: 1fr; }
       .imm-fac-grid { grid-template-columns: 1fr; }
      .imm-steps { grid-template-columns: 1fr; }
       .wa-compare-grid { grid-template-columns: 1fr; }
      .wa-types-grid { grid-template-columns: 1fr; }
      .wa-process-grid { grid-template-columns: 1fr; }
      .dui-speed-grid { grid-template-columns: 1fr 1fr; }
       .dv-expect-grid { grid-template-columns: 1fr; }
      .dv-rights-inner { grid-template-columns: 1fr; }
      .dv-rights-label { writing-mode: initial; transform: none; }
      .dv-rights-grid { grid-template-columns: 1fr; }
      .calc-section {padding: 20px;}
      .calc-row {gap: 10px;}
      .calc-row label {min-width: 80px;font-size: var(--sm-font);}
      .calc-row span {min-width: 60px;font-size: var(--label-font);}
      .calc-result .result-val {font-size: 24px;}
      .hero-MP {padding-top: 100px;padding-bottom: 50px;background-position: center; background-size: cover;min-height: auto;}
	.hero-inner {grid-template-columns: 1fr; gap: 3rem;text-align: center;}
	.hero-content {display: flex;flex-direction: column;align-items: center;}
	.hero-subtitle {margin-left: auto;margin-right: auto;}
	.hero-actions {justify-content: center;width: 100%;}
	.hero-actions .btn-primary,.hero-actions .btn-outline {width: 100%;max-width: 320px;justify-content: center;}.
	hero-trust {justify-content: center;flex-wrap: wrap; gap: 1.5rem;}
	.hero-panel {width: 100%;max-width: 500px;margin: 0 auto;}
	#nav-toggle {display: flex !important;flex-direction: column;justify-content: center;gap: 6px;z-index: 10000;background: transparent;border: none;cursor: pointer;padding: 10px;}
	.nav-toggle-bar {width: 28px;height: 3px;background-color: var(--gray-300);transition: 0.3s ease;}
	.nav-links {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100vh;background: #ffffff;z-index: 9999;flex-direction: column !important;align-items: center;justify-content: center;opacity: 0;transition: opacity 0.3s ease;}
	.nav-links.is-visible {display: flex !important;opacity: 1;background-color: var(--navy);}
	.nav-links.is-visible .mod-menu {flex-direction: column !important;align-items: center;gap: 35px;width: 100%;}
	.nav-links.is-visible .nav-item a,.nav-header {color:var(--gold);font-size: 1rem;font-weight: 600;text-transform: uppercase;}
	.header-cta {display: none; }
    .nav-links-is-visible .mod-menu__sub,[id="header-nav"] 
    .mod-menu__sub,:where(.mod-menu__sub[aria-hidden=true]) {display: block !important;visibility: visible !important;opacity: 1 !important;position: relative !important; top: 0 !important;box-shadow: none !important;padding-left: 20px !important; background: transparent !important;}
    .mod-menu_toggle-sub .icon-chevron-down,.mod-menu_toggle-sub::after {display: none !important;}
    .mod-menu__heading.nav-header {font-weight: bold;color: var(--gold-light) !important;pointer-events: none; margin-bottom: 10px;display: block;}
    .mod-menu.mod-list.nav {display: flex !important;flex-direction: column !important;align-items: center !important;justify-content: center !important;text-align: center !important;width: 100% !important;}
    .nav-item {width: 100% !important;display: flex !important;flex-direction: column !important;align-items: center !important;}
    .nav-item a,.nav-item button,.mod-menu__heading {text-align: center !important;justify-content: center !important;width: 100% !important;display: flex !important;align-items: center !important;}
    .mod-menu__sub {width: 100% !important;padding-left: 0 !important; display: flex !important;flex-direction: column !important;align-items: center !important;}
    .mod-menu__sub .nav-item {padding-left: 0 !important;padding-right: 0 !important;}
    #nav-toggle[aria-expanded="true"] 
    .nav-toggle-bar:nth-child(1) {transform: translateY(8px) rotate(45deg) !important;}
    #nav-toggle[aria-expanded="true"] 
    .nav-toggle-bar:nth-child(2) {opacity: 0 !important; }
    #nav-toggle[aria-expanded="true"] 
    .nav-toggle-bar:nth-child(3) {transform: translateY(-8px) rotate(-45deg) !important;}
    .nav-toggle-bar {transition: all 0.3s ease-in-out !important;transform-origin: center;}
    .faq-sidebar{position: inherit;}
    .testimonial-controls {margin-top: 20px;}
    .testimonial-btn {width: 42px;height: 42px;font-size: 18px;}
    .testimonial-card {flex: 0 0 100%;}
     .faq-grid {grid-template-columns: 1fr;}
     .container {padding: 0 20px;}
      .faq-section {padding: 4rem 0 5rem;}
}

#backToTop {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 55px;
  height: 55px;
  border-radius: 50%;
  border: 1px solid #000;
  background: rgba(255, 255, 255, 0.6);
  color: #000;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  
  display: flex;
  align-items: center;
  justify-content: center;

  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.3s ease;
  z-index: 9999;
}

#backToTop.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

#backToTop:hover {
  background: rgba(255, 255, 255, 0.85);
}