/* ==========================================================================
   ИНЖГЕОДРИЛЛИНГ — Индустриальная премиальная дизайн-система (IngGeoDrill 2.0)
   Стиль: Современный инженерный минимализм, графитовый сланец и фирменный буровой оранжевый
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@500;600;700;800;900&display=swap');

:root {
    --font-main: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --font-heading: 'Outfit', 'Inter', -apple-system, sans-serif;
    
    /* Core Brand Colors */
    --color-dark: #0f172a;
    --color-dark-surface: #1e293b;
    --color-dark-elevated: #334155;
    --color-dark-border: #e2e8f0;
    
    --color-accent: #ea580c;
    --color-accent-hover: #c2410c;
    --color-accent-light: #fb923c;
    --color-accent-glow: rgba(234, 88, 12, 0.25);
    --color-accent-subtle: rgba(234, 88, 12, 0.08);

    --color-blue-accent: #ea580c;
    --color-blue-subtle: rgba(234, 88, 12, 0.06);

    --color-text: #1e293b;
    --color-text-light: #64748b;
    --color-text-muted: #94a3b8;
    --color-text-white: #ffffff;
    
    --color-bg-light: #f8fafc;
    --color-bg-gray: #f1f5f9;
    --color-bg-warm: #fafaf9;
    --color-white: #ffffff;
    --color-border: #e2e8f0;
    --color-border-hover: #cbd5e1;

    --color-success: #10b981;
    --color-success-subtle: rgba(16, 185, 129, 0.1);

    /* Shadows & Radii */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
    --shadow-md: 0 6px 20px rgba(0, 0, 0, 0.05), 0 2px 6px rgba(0, 0, 0, 0.02);
    --shadow-lg: 0 14px 36px rgba(15, 23, 42, 0.06), 0 4px 12px rgba(15, 23, 42, 0.03);
    --shadow-xl: 0 20px 48px rgba(15, 23, 42, 0.08);
    --shadow-orange: 0 8px 24px rgba(234, 88, 12, 0.25);

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --radius-xl: 20px;
    --radius-full: 9999px;

    --transition: 0.22s cubic-bezier(0.16, 1, 0.3, 1);
    --transition-slow: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    
    --container-width: 1220px;
}

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

html {
    font-family: var(--font-main);
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-text);
    background-color: var(--color-bg-light);
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    overflow-x: hidden;
    width: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    width: 100%;
    color: var(--color-text);
    background: #ffffff;
}

img, svg {
    display: block;
    max-width: 100%;
    height: auto;
}

a {
    color: var(--color-accent);
    text-decoration: none;
    transition: color var(--transition), opacity var(--transition);
}

a:hover {
    color: var(--color-accent-hover);
}

ul, ol {
    list-style: none;
}

/* ────────────────────────────────────────
   CONTAINER & LAYOUT
   ──────────────────────────────────────── */

.container {
    width: min(calc(100% - 36px), var(--container-width));
    margin-inline: auto;
}

.section {
    padding: 72px 0;
    position: relative;
}

.section--gray {
    background-color: var(--color-bg-light);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.section--dark {
    background: var(--color-bg-light);
    color: var(--color-text);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
}

.section-header {
    margin-bottom: 44px;
    text-align: center;
    max-width: 840px;
    margin-inline: auto;
}

.section-header--left {
    text-align: left;
    margin-inline: 0;
    max-width: 100%;
}

.section-tag {
    display: inline-block;
    padding: 5px 14px;
    background: var(--color-accent-subtle);
    color: var(--color-accent);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: var(--radius-full);
    margin-bottom: 12px;
    border: 1px solid rgba(234, 88, 12, 0.18);
}

.section-title {
    font-family: var(--font-heading);
    font-size: clamp(1.8rem, 3.2vw, 2.5rem);
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.22;
    letter-spacing: -0.02em;
    margin-bottom: 14px;
}

.section-subtitle {
    font-size: 1.05rem;
    color: var(--color-text-light);
    line-height: 1.65;
}

/* ────────────────────────────────────────
   ADVANTAGES & TRUST STRIP
   ──────────────────────────────────────── */

.advantages-strip {
    background: #ffffff;
    border-bottom: 1px solid var(--color-border);
    padding: 22px 0;
    position: relative;
    z-index: 10;
}

.advantages-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
}

.advantage-card {
    background: var(--color-bg-light);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 16px 14px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    transition: all var(--transition);
}

.advantage-card:hover {
    background: #ffffff;
    border-color: var(--color-accent);
    box-shadow: var(--shadow-sm);
    transform: translateY(-2px);
}

.advantage-card__icon-box {
    width: 42px;
    height: 42px;
    border-radius: var(--radius-md);
    background: var(--color-accent-subtle);
    color: var(--color-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid rgba(234, 88, 12, 0.15);
}

.advantage-card__icon-box svg {
    width: 22px;
    height: 22px;
}

.advantage-card__text {
    display: flex;
    flex-direction: column;
}

.advantage-card__tag {
    font-size: 0.68rem;
    font-weight: 800;
    color: var(--color-accent);
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.advantage-card__title {
    font-family: var(--font-heading);
    font-size: 0.88rem;
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.25;
    margin-bottom: 4px;
}

.advantage-card__desc {
    font-size: 0.76rem;
    color: var(--color-text-light);
    line-height: 1.35;
    margin: 0;
}

/* ────────────────────────────────────────
   GEOLOGY STRATIGRAPHY SIMULATOR
   ──────────────────────────────────────── */

.geo-profile-layout {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 36px;
    align-items: center;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 36px;
    box-shadow: var(--shadow-md);
}

.geo-column-wrapper {
    display: flex;
    height: 420px;
    position: relative;
    border-radius: var(--radius-md);
    overflow: hidden;
    border: 2px solid var(--color-border);
    box-shadow: var(--shadow-sm);
}

.geo-depth-scale {
    width: 68px;
    background: var(--color-bg-gray);
    color: var(--color-dark);
    font-size: 0.76rem;
    font-weight: 700;
    position: relative;
    border-right: 1px solid var(--color-border);
    flex-shrink: 0;
}

.geo-depth-scale .depth-tick {
    position: absolute;
    right: 8px;
    transform: translateY(-50%);
    white-space: nowrap;
    line-height: 1;
}

.geo-depth-scale .depth-tick--top {
    top: 8px !important;
    transform: none !important;
}

.geo-depth-scale .depth-tick--bottom {
    bottom: 8px !important;
    top: auto !important;
    transform: none !important;
}

.geo-layers-stack {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    position: relative;
}

.geo-layer {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0 18px;
    transition: all var(--transition);
    border-bottom: 1px dashed rgba(0, 0, 0, 0.15);
}

.geo-layer:hover {
    filter: brightness(1.06);
}

.geo-layer.active {
    box-shadow: inset 0 0 0 3px var(--color-accent);
}

.geo-layer--fill { background: #d7ccc8; }
.geo-layer--loam { background: #bcaaa4; }
.geo-layer--sand { background: #ffe082; }
.geo-layer--clay { background: #a1887f; }
.geo-layer--rock { background: #90a4ae; }

.geo-layer__content {
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 2;
}

.geo-layer__code {
    background: var(--color-dark);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: var(--radius-sm);
}

.geo-layer__name {
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--color-dark);
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.6);
}

.geo-water-marker {
    position: absolute;
    left: 0;
    right: 0;
    height: 2px;
    background: #0284c7;
    z-index: 5;
    pointer-events: none;
}

.geo-water-tag {
    position: absolute;
    right: 12px;
    top: -20px;
    background: #0284c7;
    color: #ffffff;
    font-size: 0.7rem;
    font-weight: 800;
    padding: 2px 8px;
    border-radius: var(--radius-sm);
}

.geo-spec-card {
    background: var(--color-bg-light);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: 28px;
}

.geo-spec-header {
    margin-bottom: 14px;
}

.geo-spec-ige {
    display: inline-block;
    background: var(--color-accent);
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: var(--radius-sm);
    margin-bottom: 6px;
}

.geo-spec-title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.25;
}

.geo-spec-depth {
    font-size: 0.84rem;
    color: var(--color-text-light);
    font-weight: 600;
    margin-top: 4px;
}

.geo-spec-desc {
    font-size: 0.9rem;
    line-height: 1.6;
    color: var(--color-text);
    margin-bottom: 20px;
}

.geo-metrics-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.geo-metric-item {
    background: #ffffff;
    padding: 10px 14px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
}

.geo-metric-lbl {
    display: block;
    font-size: 0.74rem;
    color: var(--color-text-light);
    font-weight: 600;
}

.geo-metric-val {
    font-family: var(--font-heading);
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-dark);
}

/* ────────────────────────────────────────
   FOOTER ORDER BOX & QUICK BAR
   ──────────────────────────────────────── */

.footer-order-box {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid var(--color-border);
    border-top: 4px solid var(--color-accent);
    border-radius: var(--radius-xl);
    padding: 40px;
    margin-bottom: 48px;
    box-shadow: var(--shadow-md);
}

.footer-order-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 40px;
    align-items: center;
}

.footer-order-text h2 {
    color: var(--color-dark);
    font-size: clamp(1.5rem, 2.5vw, 2.2rem);
    margin-bottom: 14px;
    line-height: 1.25;
}

.footer-order-text p {
    color: var(--color-text-light);
    font-size: 1.05rem;
    line-height: 1.5;
}

.footer-order-form {
    background: #ffffff;
    padding: 28px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    color: var(--color-dark);
    box-shadow: var(--shadow-sm);
}

.footer-order-inputs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

@media (max-width: 900px) {
    .footer-order-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

@media (max-width: 600px) {
    .footer-order-box {
        padding: 24px 16px;
    }
    .footer-order-inputs {
        grid-template-columns: 1fr;
    }
    .footer-order-form {
        padding: 20px 16px;
    }
}

.mobile-quick-bar {
    display: none;
}

@media (max-width: 768px) {
    .mobile-quick-bar {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 990;
        background: rgba(255, 255, 255, 0.96);
        backdrop-filter: blur(10px);
        border-top: 1px solid var(--color-border);
        box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
        padding: 6px 12px;
    }

    .mobile-quick-bar__grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }

    .mobile-quick-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        font-size: 0.72rem;
        font-weight: 700;
        color: var(--color-dark);
        padding: 4px 0;
        border-radius: var(--radius-sm);
        transition: color var(--transition);
        text-decoration: none;
    }

    .mobile-quick-btn svg {
        width: 20px !important;
        height: 20px !important;
        margin-bottom: 2px;
    }

    .mobile-quick-btn:hover {
        color: var(--color-accent);
    }

    body {
        padding-bottom: 60px;
    }

    .geo-profile-layout {
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .geo-column-wrapper {
        height: 360px;
    }

    .geo-depth-scale {
        width: 56px;
        font-size: 0.7rem;
    }

    .geo-layer {
        padding: 0 10px;
    }

    .geo-layer__name {
        font-size: 0.76rem;
        line-height: 1.2;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .geo-layer__code {
        font-size: 0.68rem;
        padding: 2px 6px;
    }
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: var(--font-main);
    font-weight: 600;
    font-size: 0.95rem;
    line-height: 1.2;
    padding: 12px 24px;
    border-radius: var(--radius-md);
    border: 1px solid transparent;
    cursor: pointer;
    text-decoration: none;
    transition: all var(--transition);
    text-align: center;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
    max-width: 100%;
}

.btn:active {
    transform: scale(0.98);
}

.btn--primary {
    background: linear-gradient(135deg, var(--color-accent) 0%, var(--color-accent-hover) 100%);
    color: #ffffff;
    box-shadow: 0 4px 14px var(--color-accent-glow);
}

.btn--primary:hover {
    background: linear-gradient(135deg, var(--color-accent-hover) 0%, #9a3412 100%);
    color: #ffffff;
    box-shadow: 0 6px 20px var(--color-accent-glow);
    transform: translateY(-1px);
}

.btn--dark {
    background: var(--color-dark);
    color: #ffffff;
}

.btn--dark:hover {
    background: var(--color-dark-surface);
    color: #ffffff;
    transform: translateY(-1px);
}

.btn--outline {
    background: #ffffff;
    color: var(--color-dark);
    border: 1px solid var(--color-border);
}

.btn--outline:hover {
    border-color: var(--color-accent);
    color: var(--color-accent);
    background: var(--color-bg-light);
}

.btn--sm {
    padding: 8px 16px;
    font-size: 0.86rem;
    border-radius: var(--radius-sm);
}

.btn--lg {
    padding: 16px 32px;
    font-size: 1.05rem;
    border-radius: var(--radius-lg);
    font-weight: 700;
}

.btn--full {
    width: 100%;
}

/* ────────────────────────────────────────
   BREADCRUMBS
   ──────────────────────────────────────── */

.breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.86rem;
    color: var(--color-text-light);
    margin-bottom: 24px;
}

.bc-link {
    color: var(--color-text-light);
    transition: color var(--transition);
}

.bc-link:hover {
    color: var(--color-accent);
}

.bc-sep {
    color: var(--color-border-hover);
}

.bc-current {
    color: var(--color-dark);
    font-weight: 500;
}

/* ────────────────────────────────────────
   HEADER & NAVIGATION
   ──────────────────────────────────────── */

.site-header {
    background: #ffffff;
    position: relative;
    z-index: 100;
    border-bottom: 1px solid var(--color-border);
}

.site-header__top {
    padding: 14px 0;
    border-bottom: 1px solid rgba(226, 232, 240, 0.7);
}

.site-header__top-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.site-header__brand-group {
    display: flex;
    align-items: center;
    gap: 24px;
}

.site-branding {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.site-branding__logo {
    height: 44px;
    width: auto;
    object-fit: contain;
}

.site-branding__text {
    display: flex;
    flex-direction: column;
}

.site-branding__name {
    font-family: var(--font-heading);
    font-size: 1.28rem;
    font-weight: 900;
    color: var(--color-dark);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.site-branding__name span {
    color: var(--color-accent);
}

.site-branding__desc {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--color-text-light);
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

/* City Button */
.city-select-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--color-bg-light);
    border: 1px solid var(--color-border);
    padding: 6px 14px;
    border-radius: var(--radius-full);
    font-family: var(--font-main);
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--color-dark);
    cursor: pointer;
    transition: all var(--transition);
}

.city-select-btn:hover {
    background: #ffffff;
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.city-select-btn svg {
    color: var(--color-accent);
}

.city-arrow {
    font-size: 0.75rem;
    color: var(--color-text-light);
}

/* Actions & Contacts */
.site-header__actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-messengers {
    display: flex;
    align-items: center;
    gap: 8px;
}

.msg-badge {
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    transition: transform var(--transition), opacity var(--transition);
}

.msg-badge:hover {
    transform: translateY(-2px);
    opacity: 0.9;
}

.msg-badge--tg { background: #229ED9; }
.msg-badge--tg svg {
    position: relative;
    left: -1px;
}
.msg-badge--wa { background: #25D366; }
.msg-badge--max { background: #6366f1; }

.header-contacts {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    flex-shrink: 0;
    white-space: nowrap;
}

.header-phone {
    font-family: var(--font-heading);
    font-size: 1.18rem;
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.15;
    white-space: nowrap;
    transition: color var(--transition);
}

.header-phone:hover {
    color: var(--color-accent);
}

.header-contacts__meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
    font-size: 0.76rem;
    color: var(--color-text-muted);
    white-space: nowrap;
}

.header-email {
    color: var(--color-text-light);
    font-weight: 500;
    white-space: nowrap;
    transition: color var(--transition);
}

.header-email:hover {
    color: var(--color-accent);
}

.header-meta-sep {
    color: #cbd5e1;
    font-size: 0.65rem;
}

.header-schedule {
    font-size: 0.74rem;
    color: var(--color-text-muted);
    white-space: nowrap;
}

/* Navigation Bar */
.site-header__nav {
    background: #ffffff;
}

.main-menu {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
}

.main-menu > li {
    position: relative;
}

.main-menu > li > a {
    display: block;
    padding: 14px 14px;
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-dark);
    transition: color var(--transition);
}

.main-menu > li:hover > a {
    color: var(--color-accent);
}

/* Dropdown */
.main-menu > li > ul {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 280px;
    background: #ffffff;
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    border: 1px solid var(--color-border);
    padding: 8px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all var(--transition);
    z-index: 100;
}

.main-menu > li:hover > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.main-menu > li > ul > li > a {
    display: block;
    padding: 10px 18px;
    font-size: 0.88rem;
    font-weight: 500;
    color: var(--color-text);
    transition: background var(--transition), color var(--transition);
}

.main-menu > li > ul > li > a:hover {
    background: var(--color-bg-light);
    color: var(--color-accent);
}

.burger-btn {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    flex-direction: column;
    gap: 5px;
}

.burger-btn span {
    display: block;
    width: 24px;
    height: 2.5px;
    background: var(--color-dark);
    border-radius: 2px;
    transition: all var(--transition);
}

/* ────────────────────────────────────────
   MOBILE DRAWER NAVIGATION (Cleaned up)
   ──────────────────────────────────────── */

.mobile-drawer-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(4px);
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all var(--transition);
}

.mobile-drawer-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.mobile-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 320px;
    max-width: 85vw;
    background: #ffffff;
    z-index: 1001;
    padding: 24px;
    box-shadow: var(--shadow-xl);
    transform: translateX(100%);
    visibility: hidden;
    pointer-events: none;
    transition: transform var(--transition-slow), visibility var(--transition-slow);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.mobile-drawer.open {
    transform: translateX(0);
    visibility: visible;
    pointer-events: auto;
}

.mobile-drawer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--color-border);
    padding-bottom: 14px;
}

.mobile-drawer__title {
    font-family: var(--font-heading);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-dark);
}

.mobile-drawer__close {
    background: none;
    border: none;
    font-size: 1.8rem;
    line-height: 1;
    color: var(--color-text-light);
    cursor: pointer;
}

.mobile-drawer__nav ul li a {
    display: block;
    padding: 12px 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-dark);
    border-bottom: 1px solid var(--color-bg-light);
}

.mobile-drawer__footer {
    margin-top: auto;
    padding-top: 24px;
}

.mobile-drawer__phone {
    display: block;
    text-align: center;
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--color-dark);
}

/* ────────────────────────────────────────
   HOMEPAGE HERO SECTION
   ──────────────────────────────────────── */

.hero-home {
    position: relative;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 40%, #f1f5f9 100%);
    padding: 70px 0 80px 0;
    color: var(--color-text);
    border-bottom: 1px solid var(--color-border);
    overflow: hidden;
}

.hero-home::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(#cbd5e1 1.2px, transparent 1.2px);
    background-size: 28px 28px;
    opacity: 0.45;
    pointer-events: none;
}

.hero-home .container {
    position: relative;
    z-index: 2;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.95fr;
    gap: 50px;
    align-items: center;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    background: var(--color-accent-subtle);
    border: 1px solid rgba(234, 88, 12, 0.25);
    border-radius: var(--radius-full);
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--color-accent);
    margin-bottom: 20px;
}

.hero-title {
    font-family: var(--font-heading);
    font-size: clamp(2rem, 3.8vw, 3.1rem);
    font-weight: 900;
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin-bottom: 18px;
    color: var(--color-dark);
}

.hero-title span {
    color: var(--color-accent);
}

.hero-tags-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.hero-tag-badge {
    background: #ffffff;
    color: var(--color-dark);
    padding: 6px 14px;
    border-radius: var(--radius-sm);
    font-size: 0.84rem;
    font-weight: 600;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-xs);
    transition: all var(--transition);
}

.hero-tag-badge:hover {
    border-color: var(--color-accent);
    color: var(--color-accent);
    transform: translateY(-1px);
}

.hero-subtitle {
    font-size: 1.08rem;
    color: var(--color-text-light);
    line-height: 1.65;
    margin-bottom: 32px;
}

.hero-counters {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    padding-top: 24px;
    border-top: 1px solid var(--color-border);
}

.hero-counter {
    display: flex;
    flex-direction: column;
}

.hero-counter__val {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 900;
    color: var(--color-accent);
    line-height: 1;
    margin-bottom: 4px;
}

.hero-counter__lbl {
    font-size: 0.8rem;
    color: var(--color-text-light);
    line-height: 1.25;
}

/* Hero Lead Form Card */
.lead-card {
    background: #ffffff;
    border-radius: var(--radius-xl);
    padding: 36px;
    border: 1px solid var(--color-border);
    border-top: 4px solid var(--color-accent);
    box-shadow: var(--shadow-xl);
    color: var(--color-text);
}

.lead-card__title {
    font-family: var(--font-heading);
    font-size: 1.45rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 6px;
}

.lead-card__desc {
    font-size: 0.88rem;
    color: var(--color-text-light);
    margin-bottom: 20px;
}

/* Forms Common */
.form-group {
    margin-bottom: 16px;
}

.form-label {
    display: block;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--color-dark);
    margin-bottom: 6px;
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: 12px 16px;
    font-family: var(--font-main);
    font-size: 0.95rem;
    color: var(--color-text);
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    transition: all var(--transition);
    outline: none;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px var(--color-accent-subtle);
}

.form-privacy {
    font-size: 0.74rem;
    color: var(--color-text-muted);
    line-height: 1.35;
    margin-top: 10px;
    text-align: center;
}

.form-privacy a {
    color: var(--color-text-light);
    text-decoration: underline;
}

/* ────────────────────────────────────────
   FAST CTA RIBBON
   ──────────────────────────────────────── */

.cta-ribbon-bar {
    background: var(--color-bg-gray);
    border-top: 1px solid var(--color-border);
    border-bottom: 1px solid var(--color-border);
    padding: 18px 0;
}

.cta-ribbon-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}

.cta-ribbon-bar__info {
    display: flex;
    align-items: center;
    gap: 16px;
}

.cta-ribbon-bar__icon {
    font-size: 1.8rem;
}

.cta-ribbon-bar__text h4 {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 2px;
}

.cta-ribbon-bar__text p {
    font-size: 0.88rem;
    color: var(--color-text-light);
    margin: 0;
}

.cta-ribbon-bar__actions {
    display: flex;
    align-items: center;
    gap: 14px;
}

.cta-ribbon-phone {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--color-dark);
}

/* ────────────────────────────────────────
   SERVICE LANDING PAGE (single-service.php)
   ──────────────────────────────────────── */

.service-hero {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 40%, #f1f5f9 100%);
    color: var(--color-text);
    padding: 40px 0 60px 0;
    position: relative;
    border-bottom: 1px solid var(--color-border);
}

.service-hero .breadcrumbs .bc-link,
.service-hero .breadcrumbs .bc-sep {
    color: var(--color-text-light);
}

.service-hero .breadcrumbs .bc-current {
    color: var(--color-dark);
    font-weight: 600;
}

.service-hero__grid {
    display: grid;
    grid-template-columns: 1.25fr 0.95fr;
    gap: 44px;
    align-items: center;
}

.service-hero__badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 14px;
    background: var(--color-accent-subtle);
    border: 1px solid rgba(234, 88, 12, 0.25);
    border-radius: var(--radius-full);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--color-accent);
    margin-bottom: 16px;
}

.service-hero__title {
    font-family: var(--font-heading);
    color: var(--color-dark);
    margin-bottom: 20px;
    letter-spacing: -0.02em;
}

.service-hero__title-main {
    display: block;
    font-size: clamp(1.85rem, 3.2vw, 2.75rem);
    font-weight: 900;
    line-height: 1.18;
    color: var(--color-dark);
    margin-bottom: 12px;
}

.service-hero__title-geo {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: clamp(0.95rem, 1.3vw, 1.15rem);
    font-weight: 600;
    line-height: 1.4;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 6px 14px;
    border-radius: 9999px;
    box-shadow: var(--shadow-sm);
}

.service-hero__title-geo svg {
    color: var(--color-accent);
    flex-shrink: 0;
}

.service-hero__title-geo strong {
    color: var(--color-accent);
    font-weight: 800;
}

.service-hero__desc {
    font-size: 1.05rem;
    color: var(--color-text-light);
    line-height: 1.65;
    margin-bottom: 28px;
}

.service-hero__props {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}

.hero-prop-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 12px 14px;
    box-shadow: var(--shadow-xs);
}

.hero-prop-icon {
    font-size: 1.4rem;
    line-height: 1;
}

.hero-prop-text strong {
    display: block;
    color: var(--color-dark);
    font-size: 0.92rem;
    font-weight: 700;
}

.hero-prop-text span {
    font-size: 0.8rem;
    color: var(--color-text-light);
}

.service-hero__actions {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
}

.service-hero__form-card {
    background: #ffffff;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    border-top: 4px solid var(--color-accent);
    padding: 32px;
    box-shadow: var(--shadow-xl);
    color: var(--color-text);
}

.form-card-header {
    margin-bottom: 18px;
}

.form-card-badge {
    display: inline-block;
    padding: 3px 10px;
    background: var(--color-accent-subtle);
    color: var(--color-accent);
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: var(--radius-full);
    margin-bottom: 6px;
}

.form-card-title {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--color-dark);
}

.form-card-desc {
    font-size: 0.84rem;
    color: var(--color-text-light);
}

/* Service Metrics Strip */
.service-metrics-strip {
    background: #ffffff;
    border-bottom: 1px solid var(--color-border);
    padding: 24px 0;
}

.service-metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.metric-item {
    display: flex;
    align-items: center;
    gap: 14px;
}

.metric-item__icon {
    font-size: 1.8rem;
}

.metric-item__label {
    display: block;
    font-size: 0.78rem;
    color: var(--color-text-light);
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.04em;
}

.metric-item__value {
    font-family: var(--font-heading);
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-dark);
}

/* Overview Section & Interleaved SEO Blocks */
.landing-overview-section {
    padding: 64px 0;
}

.overview-grid {
    display: grid;
    grid-template-columns: 1.35fr 0.85fr;
    gap: 44px;
    align-items: start;
}

.overview-highlight-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 32px;
    box-shadow: var(--shadow-md);
    position: sticky;
    top: 24px;
    border-top: 4px solid var(--color-accent);
}

.overview-badge {
    display: inline-block;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--color-accent);
    margin-bottom: 8px;
}

.overview-highlight-card__title {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 18px;
}

.overview-highlight-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.overview-highlight-list li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.highlight-check {
    width: 22px;
    height: 22px;
    border-radius: var(--radius-full);
    background: var(--color-accent-subtle);
    color: var(--color-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.85rem;
    flex-shrink: 0;
    margin-top: 2px;
}

.overview-highlight-list strong {
    display: block;
    font-size: 0.95rem;
    color: var(--color-dark);
}

.overview-highlight-list p {
    font-size: 0.84rem;
    color: var(--color-text-light);
    margin: 2px 0 0 0;
    line-height: 1.4;
}

.landing-seo-section {
    padding: 64px 0;
}

/* WYSIWYG Content Polish */
.wysiwyg-content h2 {
    font-family: var(--font-heading);
    font-size: clamp(1.5rem, 2.4vw, 2rem);
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.25;
    margin-top: 28px;
    margin-bottom: 14px;
}

.wysiwyg-content h2:first-child {
    margin-top: 0;
}

.wysiwyg-content h3 {
    font-family: var(--font-heading);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-dark);
    margin-top: 24px;
    margin-bottom: 10px;
}

.wysiwyg-content p {
    font-size: 1rem;
    line-height: 1.7;
    color: #334155;
    margin-bottom: 16px;
}

.wysiwyg-content ul {
    margin-bottom: 20px;
    padding-left: 0;
}

.wysiwyg-content ul li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 10px;
    line-height: 1.6;
    color: #334155;
}

.wysiwyg-content ul li::before {
    content: '▪';
    position: absolute;
    left: 6px;
    color: var(--color-accent);
    font-size: 1.1rem;
}

.table-responsive {
    width: 100%;
    overflow-x: auto;
    margin: 24px 0;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-xs);
}

.service-table,
.price-table {
    width: 100%;
    border-collapse: collapse;
    background: #ffffff;
    font-size: 0.92rem;
    text-align: left;
}

.service-table th,
.price-table th {
    background: var(--color-bg-light);
    color: var(--color-dark);
    font-weight: 700;
    padding: 14px 18px;
    border-bottom: 2px solid var(--color-border);
}

.service-table td,
.price-table td {
    padding: 14px 18px;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text);
}

.service-table tr:last-child td,
.price-table tr:last-child td {
    border-bottom: none;
}

/* PDF Download Card & Document Download Box */
.pdf-download-card,
.document-download-box {
    display: flex;
    align-items: center;
    gap: 18px;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-left: 4px solid var(--color-accent);
    border-radius: var(--radius-lg);
    padding: 16px 22px;
    margin: 20px 0;
    text-decoration: none;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition);
}

.pdf-download-card:hover,
.document-download-box:hover {
    border-color: var(--color-accent);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.pdf-download-icon,
.document-download-icon {
    font-size: 1.8rem;
    flex-shrink: 0;
}

.pdf-download-info,
.document-download-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.pdf-download-info strong,
.document-download-title {
    display: block;
    color: var(--color-dark);
    font-family: var(--font-heading);
    font-size: 0.96rem;
    font-weight: 800;
    line-height: 1.3;
}

.pdf-download-info small,
.document-download-meta {
    color: var(--color-text-light);
    font-size: 0.8rem;
}

.pdf-download-arrow {
    margin-left: auto;
    color: var(--color-accent);
    font-weight: 800;
    font-size: 1.3rem;
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    background: rgba(234, 88, 12, 0.08);
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-download-card:hover .pdf-download-arrow {
    background: var(--color-accent);
    color: #ffffff;
}

/* Feature grid and timeline inside content */
.wysiwyg-feature-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin: 24px 0;
}

@media (max-width: 768px) {
    .wysiwyg-feature-grid {
        grid-template-columns: 1fr !important;
        gap: 14px;
    }
}

.wysiwyg-feature-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    padding: 22px;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    transition: all var(--transition);
}

.wysiwyg-feature-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.wysiwyg-timeline {
    margin: 24px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.wysiwyg-step-item {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 18px 22px;
    box-shadow: var(--shadow-sm);
    border-left: 4px solid var(--color-accent);
}

/* ────────────────────────────────────────
   SERVICES CATALOG & FILTER TABS
   ──────────────────────────────────────── */

.services-filter-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 36px;
}

.filter-tab-btn {
    background: #ffffff;
    border: 1px solid var(--color-border);
    padding: 9px 20px;
    border-radius: var(--radius-full);
    font-family: var(--font-main);
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--color-dark);
    cursor: pointer;
    transition: all var(--transition);
}

.filter-tab-btn:hover {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.filter-tab-btn.active {
    background: var(--color-accent);
    border-color: var(--color-accent);
    color: #ffffff;
    box-shadow: 0 4px 12px var(--color-accent-glow);
}

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

.service-card {
    background: #ffffff;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    transition: all var(--transition);
}

.service-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
    border-color: var(--color-border-hover);
}

.service-card__media {
    position: relative;
    height: 190px;
    overflow: hidden;
    background: #f1f5f9;
}

.service-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.service-card:hover .service-card__media img {
    transform: scale(1.06);
}

.service-card__cat-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #ffffff;
    color: var(--color-accent);
    padding: 3px 10px;
    border-radius: var(--radius-full);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border: 1px solid rgba(234, 88, 12, 0.25);
    box-shadow: var(--shadow-sm);
    z-index: 2;
}

.service-card__price-badge {
    position: absolute;
    bottom: 12px;
    left: 12px;
    background: #ffffff;
    color: var(--color-dark);
    padding: 4px 12px;
    border-radius: var(--radius-full);
    font-size: 0.84rem;
    font-weight: 800;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    z-index: 2;
}

.service-card__term-badge {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background: var(--color-accent);
    color: #ffffff;
    padding: 4px 10px;
    border-radius: var(--radius-full);
    font-size: 0.78rem;
    font-weight: 700;
    z-index: 2;
}

.service-card__content {
    padding: 22px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.service-card__title {
    font-family: var(--font-heading);
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 10px;
}

.service-card__title a {
    color: var(--color-dark);
}

.service-card__title a:hover {
    color: var(--color-accent);
}

.service-card__desc {
    font-size: 0.88rem;
    color: var(--color-text-light);
    line-height: 1.55;
    margin-bottom: 18px;
    flex-grow: 1;
}

.service-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 14px;
    border-top: 1px solid var(--color-bg-gray);
}

.service-card__btn {
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--color-dark);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.service-card__btn span {
    transition: transform var(--transition);
}

.service-card:hover .service-card__btn span {
    transform: translateX(4px);
    color: var(--color-accent);
}

.service-card__calc-btn {
    background: none;
    border: none;
    font-family: var(--font-main);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--color-accent);
    cursor: pointer;
    text-decoration: underline;
}

.services-cta-banner {
    background: var(--color-bg-gray);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 36px 40px;
    margin-top: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    flex-wrap: wrap;
}

.services-cta-banner__text h3 {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 6px;
}

.services-cta-banner__text p {
    font-size: 0.92rem;
    color: var(--color-text-light);
    margin: 0;
}

.services-cta-banner__actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* Risks Block Conversion Action Box */
.risks-cta-box {
    background: #ffffff;
    border: 1px solid #fed7aa;
    border-left: 6px solid #ea580c;
    border-radius: 16px;
    padding: 28px 32px;
    box-shadow: 0 4px 12px rgba(234, 88, 12, 0.06);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
}

.risks-cta-box__content {
    max-width: 680px;
}

.risks-cta-box__actions {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
}

.risks-cta-phone {
    color: #ea580c;
    font-weight: 700;
    font-size: 1.15rem;
    text-decoration: none;
    white-space: nowrap;
}

/* Responsive Table Wrapper */
.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.prices-action-box,
.works-action-box {
    width: 100%;
    text-align: center;
}

/* ────────────────────────────────────────
   PRICES BLOCK & COTTAGE GRID
   ──────────────────────────────────────── */

.prices-subheading {
    font-family: var(--font-heading);
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 24px;
    text-align: center;
}

.cottage-pricing-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 44px;
}

.cottage-card {
    background: #ffffff;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: 28px 20px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    text-align: center;
    transition: all var(--transition);
    position: relative;
}

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

.cottage-card--hit {
    border-color: var(--color-accent);
    box-shadow: 0 8px 24px rgba(234, 88, 12, 0.12);
}

.cottage-card--hit .hit-badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-accent);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 3px 14px;
    border-radius: var(--radius-full);
    box-shadow: 0 2px 8px var(--color-accent-glow);
}

.cottage-card__img {
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.cottage-card__img img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}

.cottage-card__title {
    font-family: var(--font-heading);
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 14px;
}

.cottage-card__price-list {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cottage-card__price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.86rem;
    padding: 6px 0;
    border-bottom: 1px dashed var(--color-border);
}

.cottage-card__price-row span {
    color: var(--color-text-light);
}

.cottage-card__price-row strong {
    color: var(--color-dark);
    font-weight: 800;
}

/* Tabs Navigation */
.price-tabs-nav,
.fleet-tabs-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 30px;
}

.price-tab-btn,
.fleet-tab-btn {
    background: #ffffff;
    border: 1px solid var(--color-border);
    padding: 10px 22px;
    border-radius: var(--radius-full);
    font-family: var(--font-main);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--color-dark);
    cursor: pointer;
    transition: all var(--transition);
}

.price-tab-btn:hover,
.fleet-tab-btn:hover {
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.price-tab-btn.active,
.fleet-tab-btn.active {
    background: var(--color-dark);
    border-color: var(--color-dark);
    color: #ffffff;
    box-shadow: var(--shadow-sm);
}

.price-tab-content,
.fleet-tab-content {
    display: none;
}

.price-tab-content.active,
.fleet-tab-content.active {
    display: block;
}

/* Pricing Table Card */
.pricing-table-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-md);
    overflow: hidden;
    max-width: 960px;
    margin: 0 auto;
}

.pricing-table-card__header {
    background: var(--color-bg-light);
    padding: 20px 28px;
    border-bottom: 1px solid var(--color-border);
}

.pricing-table-card__header h3 {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--color-dark);
    margin: 0;
}

.cost-table {
    width: 100%;
    border-collapse: collapse;
}

.cost-table td {
    padding: 14px 28px;
    border-bottom: 1px solid var(--color-border);
    font-size: 0.92rem;
    color: var(--color-text);
}

.cost-table tr:last-child td {
    border-bottom: none;
}

.cost-table tr:hover td {
    background: #f8fafc;
}

.cost-price-val {
    text-align: right;
    font-family: var(--font-heading);
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-accent);
    white-space: nowrap;
}

/* ────────────────────────────────────────
   INTERACTIVE CALCULATOR
   ──────────────────────────────────────── */

.calc-wrapper {
    display: grid;
    grid-template-columns: 1.35fr 0.85fr;
    gap: 36px;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 40px;
    box-shadow: var(--shadow-lg);
}

.calc-group {
    margin-bottom: 28px;
}

.calc-label {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--color-dark);
    margin-bottom: 12px;
}

.calc-type-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.calc-type-card {
    background: var(--color-bg-light);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 14px 10px;
    text-align: center;
    cursor: pointer;
    transition: all var(--transition);
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    overflow: hidden;
}

.calc-type-card input {
    display: none;
}

.calc-type-card:hover {
    border-color: var(--color-accent);
    background: #ffffff;
    box-shadow: var(--shadow-sm);
}

.calc-type-card.active {
    background: rgba(234, 88, 12, 0.08);
    border-color: var(--color-accent);
    box-shadow: 0 0 0 2px var(--color-accent);
}

.calc-type-icon {
    font-size: 1.6rem;
    margin-bottom: 4px;
}

.calc-type-name {
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--color-dark);
    line-height: 1.2;
    word-break: normal;
    overflow-wrap: break-word;
    hyphens: auto;
}

.calc-type-card.active .calc-type-name {
    color: var(--color-accent);
}

.calc-type-hint {
    font-size: 0.72rem;
    color: var(--color-text-light);
    margin-top: 2px;
    word-break: normal;
    overflow-wrap: break-word;
}

.calc-stepper-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    gap: 8px;
}

.calc-badge-val {
    background: var(--color-accent);
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 800;
    padding: 3px 12px;
    border-radius: var(--radius-full);
    white-space: nowrap;
}

.calc-range-slider {
    width: 100%;
    height: 8px;
    border-radius: 4px;
    background: var(--color-border);
    outline: none;
    -webkit-appearance: none;
}

.calc-range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--color-accent);
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(234, 88, 12, 0.4);
}

.calc-slider-ticks {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    color: var(--color-text-muted);
    margin-top: 6px;
}

.calc-pills-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.calc-pill {
    background: var(--color-bg-light);
    border: 1px solid var(--color-border);
    color: var(--color-text);
    font-family: var(--font-main);
    font-size: 0.86rem;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: var(--radius-full);
    cursor: pointer;
    transition: all var(--transition);
}

.calc-pill:hover {
    border-color: var(--color-accent);
    background: #ffffff;
}

.calc-pill.active {
    background: var(--color-accent);
    border-color: var(--color-accent);
    color: #ffffff;
}

.calc-addons-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.calc-addon-check {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--color-bg-light);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 10px 12px;
    cursor: pointer;
    transition: all var(--transition);
}

.calc-addon-check:hover {
    border-color: var(--color-accent);
    background: #ffffff;
}

.calc-addon-check input {
    accent-color: var(--color-accent);
    width: 18px;
    height: 18px;
}

.calc-addon-info strong {
    display: block;
    font-size: 0.82rem;
    color: var(--color-dark);
}

.calc-addon-info small {
    font-size: 0.74rem;
    color: var(--color-accent);
    font-weight: 600;
}

/* Calculator Right Summary Card */
.calc-summary {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.calc-summary-card {
    background: #f8fafc;
    border: 1px solid var(--color-border);
    border-top: 4px solid var(--color-accent);
    border-radius: var(--radius-xl);
    padding: 36px 32px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-between;
}

.calc-summary-tag {
    font-size: 0.82rem;
    font-weight: 800;
    color: var(--color-text-light);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: block;
    margin-bottom: 8px;
}

.calc-total-box {
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--color-border);
}

.calc-total-lbl {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-dark);
    display: block;
    margin-bottom: 6px;
}

.calc-total-price {
    font-family: var(--font-heading);
    font-size: clamp(2.1rem, 4.5vw, 2.8rem);
    font-weight: 900;
    color: var(--color-accent);
    line-height: 1.1;
    margin-bottom: 8px;
    letter-spacing: -0.02em;
    word-break: normal;
}

.calc-price-prefix {
    font-size: 0.55em;
    font-weight: 700;
    color: var(--color-text-light);
    margin-right: 4px;
    vertical-align: baseline;
}

.calc-total-note {
    font-size: 0.84rem;
    color: var(--color-text-light);
    display: block;
    line-height: 1.4;
}

.calc-details-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px dashed var(--color-border);
}

.calc-detail-item {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    font-size: 0.92rem;
    color: var(--color-text);
}

.calc-detail-item strong {
    color: var(--color-dark);
    font-weight: 700;
    text-align: right;
    word-break: break-word;
}

.calc-includes-box {
    margin-bottom: 28px;
}

.calc-includes-box span {
    font-size: 0.82rem;
    font-weight: 800;
    color: #64748b !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    display: block;
    margin-bottom: 12px;
}

.calc-includes-box ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.calc-includes-box li {
    font-size: 0.9rem;
    color: var(--color-dark);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.calc-lead-form {
    margin-top: auto;
}

/* ────────────────────────────────────────
   4-STEP PROCESS
   ──────────────────────────────────────── */

.steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.step-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 32px 24px;
    position: relative;
    box-shadow: var(--shadow-sm);
    transition: all var(--transition);
}

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

.step-card__num {
    font-family: var(--font-heading);
    font-size: 2.2rem;
    font-weight: 900;
    color: var(--color-accent);
    line-height: 1;
    margin-bottom: 14px;
    opacity: 0.9;
}

.step-card__title {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 10px;
}

.step-card__desc {
    font-size: 0.88rem;
    color: var(--color-text-light);
    line-height: 1.55;
    margin: 0;
}

/* ────────────────────────────────────────
   FLEET & LAB SHOWCASE
   ──────────────────────────────────────── */

.fleet-showcase-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.fleet-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.fleet-card__media {
    position: relative;
    height: 200px;
    background: #f1f5f9;
}

.fleet-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fleet-card__tag {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #ffffff;
    color: var(--color-accent);
    padding: 3px 10px;
    border-radius: var(--radius-full);
    font-size: 0.74rem;
    font-weight: 800;
    border: 1px solid rgba(234, 88, 12, 0.25);
    box-shadow: var(--shadow-sm);
}

.fleet-card__body {
    padding: 22px;
}

.fleet-card__title {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 8px;
}

.fleet-card__desc {
    font-size: 0.86rem;
    color: var(--color-text-light);
    line-height: 1.5;
    margin-bottom: 14px;
}

.fleet-card__specs {
    font-size: 0.82rem;
    background: var(--color-bg-light);
    padding: 10px 14px;
    border-radius: var(--radius-md);
}

.fleet-card__specs li {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
}

/* ────────────────────────────────────────
   LICENSES & SRO DOCUMENTS (Realistic A4 Preview)
   ──────────────────────────────────────── */

.licenses-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-bottom: 40px;
}

.license-card {
    background: #ffffff;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    cursor: pointer;
    transition: all var(--transition);
    display: flex;
    flex-direction: column;
}

.license-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
    border-color: var(--color-accent);
}

.license-card__preview {
    position: relative;
    background: #f1f5f9;
    padding: 24px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--color-border);
}

.license-card__badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #ffffff;
    color: var(--color-accent);
    padding: 3px 10px;
    border-radius: var(--radius-full);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    border: 1px solid rgba(234, 88, 12, 0.25);
    box-shadow: var(--shadow-sm);
    z-index: 2;
}

.license-card__sheet {
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.06);
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    overflow: hidden;
    width: 160px;
    height: 226px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--transition);
}

.license-card:hover .license-card__sheet {
    transform: scale(1.04);
}

.license-card__sheet img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.license-card__overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity var(--transition);
}

.license-card:hover .license-card__overlay {
    opacity: 1;
}

.license-card__zoom-btn {
    background: var(--color-accent);
    color: #ffffff;
    font-size: 0.84rem;
    font-weight: 700;
    padding: 8px 16px;
    border-radius: var(--radius-full);
    box-shadow: var(--shadow-md);
}

.license-card__info {
    padding: 20px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.license-card__title {
    font-family: var(--font-heading);
    font-size: 1rem;
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.35;
    margin-bottom: 8px;
}

.license-card__desc {
    font-size: 0.82rem;
    color: var(--color-text-light);
    line-height: 1.45;
    margin-bottom: 14px;
    flex-grow: 1;
}

.license-card__link {
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--color-accent);
}

.licenses-trust-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 20px 24px;
}

.trust-pill {
    display: flex;
    align-items: center;
    gap: 12px;
}

.trust-icon {
    font-size: 1.6rem;
}

.trust-pill strong {
    display: block;
    font-size: 0.92rem;
    color: var(--color-dark);
}

.trust-pill small {
    display: block;
    font-size: 0.78rem;
    color: var(--color-text-light);
    line-height: 1.2;
}

/* ────────────────────────────────────────
   INTERACTIVE MAP & COMPLETED OBJECTS
   ──────────────────────────────────────── */

.map-interactive-wrapper {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 24px;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 24px;
    box-shadow: var(--shadow-md);
}

.map-objects-sidebar {
    display: flex;
    flex-direction: column;
}

.map-objects-scroll {
    height: 480px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-right: 8px;
}

.map-objects-scroll::-webkit-scrollbar {
    width: 5px;
}

.map-objects-scroll::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.map-object-card {
    background: var(--color-bg-light);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 12px 14px;
    cursor: pointer;
    transition: all var(--transition);
    border-left: 3px solid transparent;
}

.map-object-card:hover {
    background: #ffffff;
    border-color: var(--color-accent);
    transform: translateX(3px);
}

.map-object-card.active {
    background: rgba(234, 88, 12, 0.08);
    border-color: var(--color-accent);
    border-left: 3px solid var(--color-accent);
    box-shadow: 0 2px 8px rgba(234, 88, 12, 0.12);
}

.map-object-card__city {
    display: block;
    font-size: 0.72rem;
    font-weight: 800;
    color: var(--color-accent);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 2px;
}

.map-object-card__title {
    display: block;
    font-family: var(--font-heading);
    font-size: 0.92rem;
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.25;
    margin-bottom: 4px;
}

.map-object-card__desc {
    font-size: 0.78rem;
    color: var(--color-text-light);
    line-height: 1.35;
    margin: 0;
}

.map-canvas-container {
    position: relative;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--color-border);
    min-height: 480px;
}

.map-overlay-badge {
    position: absolute;
    bottom: 16px;
    left: 16px;
    background: #ffffff;
    color: var(--color-dark);
    font-size: 0.82rem;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: var(--radius-full);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    z-index: 10;
    pointer-events: none;
}

.pulse-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-accent);
    box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.7);
    animation: pulse 1.8s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.7);
    }
    70% {
        transform: scale(1);
        box-shadow: 0 0 0 8px rgba(234, 88, 12, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(234, 88, 12, 0);
    }
}

/* ────────────────────────────────────────
   PORTFOLIO & WORKS
   ──────────────────────────────────────── */

.works-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.work-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    transition: all var(--transition);
}

.work-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-md);
}

.work-card__media {
    position: relative;
    height: 190px;
    background: #f1f5f9;
}

.work-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.work-card__city-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: #ffffff;
    color: var(--color-dark);
    padding: 4px 10px;
    border-radius: var(--radius-full);
    font-size: 0.74rem;
    font-weight: 800;
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
}

.work-card__body {
    padding: 22px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.work-card__title {
    font-family: var(--font-heading);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 8px;
}

.work-card__meta {
    font-size: 0.86rem;
    color: var(--color-text-light);
    line-height: 1.5;
    margin-bottom: 16px;
}

/* ────────────────────────────────────────
   CLIENT REVIEWS (OFFICIAL LETTERHEAD SCANS)
   ──────────────────────────────────────── */

.reviews-grid,
.reviews-doc-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

.review-doc-card {
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    transition: all var(--transition);
    cursor: pointer;
}

.review-doc-card:hover {
    border-color: var(--color-accent);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
    transform: translateY(-4px);
}

.review-doc-card__sheet-wrapper {
    position: relative;
    background: #f1f5f9;
    padding: 24px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--color-border);
}

.review-doc-card__sheet {
    position: relative;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14), 0 2px 6px rgba(0, 0, 0, 0.06);
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    overflow: hidden;
    width: 175px;
    height: 247px;
    padding: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--transition);
}

.review-doc-card:hover .review-doc-card__sheet {
    transform: scale(1.04);
}

.review-doc-card__sheet img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.review-doc-card__badge {
    position: absolute;
    top: 14px;
    left: 14px;
    background: #ffffff;
    color: var(--color-accent);
    font-size: 0.72rem;
    font-weight: 800;
    padding: 4px 10px;
    border-radius: var(--radius-full);
    border: 1px solid rgba(234, 88, 12, 0.25);
    box-shadow: var(--shadow-sm);
    z-index: 2;
    letter-spacing: 0.02em;
}

.review-doc-card__overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all var(--transition);
}

.review-doc-card:hover .review-doc-card__overlay {
    opacity: 1;
}

.review-doc-card__zoom-btn {
    background: #ffffff;
    color: var(--color-dark);
    font-weight: 800;
    font-size: 0.82rem;
    padding: 9px 18px;
    border-radius: var(--radius-full);
    box-shadow: var(--shadow-md);
}

.review-doc-card__body {
    padding: 24px 26px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.review-doc-card__rating {
    color: var(--color-accent);
    font-size: 1.05rem;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.verified-pill {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: var(--radius-full);
    border: 1px solid rgba(16, 185, 129, 0.2);
}

.review-doc-card__client {
    font-family: var(--font-heading);
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--color-dark);
    margin: 0 0 4px 0;
    line-height: 1.3;
}

.review-doc-card__meta {
    font-size: 0.8rem;
    color: var(--color-text-light);
    margin-bottom: 12px;
    display: block;
    line-height: 1.4;
}

.review-doc-card__quote {
    font-size: 0.88rem;
    color: var(--color-text);
    line-height: 1.55;
    font-style: italic;
    margin: 0 0 16px 0;
    flex-grow: 1;
}

.review-doc-card__btn {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--color-accent);
    font-weight: 800;
    font-size: 0.86rem;
    text-decoration: none;
}

.review-doc-card__btn:hover {
    text-decoration: underline;
}

@media (max-width: 992px) {
    .reviews-grid,
    .reviews-doc-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }
}

@media (max-width: 640px) {
    .reviews-grid,
    .reviews-doc-grid {
        grid-template-columns: 1fr;
    }
}

/* ────────────────────────────────────────
   FAQ ACCORDION
   ──────────────────────────────────────── */

.faq-list {
    width: 100%;
    max-width: 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.faq-item {
    width: 100%;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all var(--transition);
}

.faq-item.open {
    border-color: var(--color-accent);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
}

.faq-trigger {
    width: 100%;
    padding: 22px 28px;
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    font-family: var(--font-main);
    font-size: 1.08rem;
    font-weight: 700;
    color: var(--color-dark);
    cursor: pointer;
    gap: 20px;
}

.faq-trigger:hover {
    color: var(--color-accent);
}

.faq-icon {
    font-size: 1.3rem;
    color: var(--color-accent);
    transition: transform var(--transition);
    flex-shrink: 0;
}

.faq-item.open .faq-icon {
    transform: rotate(45deg);
}

.faq-content {
    display: none;
    padding: 0 28px 24px 28px;
    font-size: 0.98rem;
    line-height: 1.65;
    color: var(--color-text);
}

.faq-item.open .faq-content {
    display: block;
}

/* ────────────────────────────────────────
   FINAL LEAD CTA BANNER
   ──────────────────────────────────────── */

.service-bottom-cta {
    padding: 70px 0;
}

.service-cta-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    border-radius: var(--radius-xl);
    padding: 50px;
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--color-border);
    border-top: 4px solid var(--color-accent);
}

.service-cta-card__grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 50px;
    align-items: center;
}

.cta-features-list {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cta-features-list li {
    font-size: 0.95rem;
    color: var(--color-text);
    font-weight: 500;
}

.lead-form-light {
    background: #ffffff;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    padding: 32px;
    box-shadow: var(--shadow-lg);
}

/* ────────────────────────────────────────
   FOOTER
   ──────────────────────────────────────── */

.site-footer {
    background: #ffffff;
    color: var(--color-text);
    padding: 64px 0 32px 0;
    margin-top: auto;
    border-top: 1px solid var(--color-border);
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr 1.1fr;
    gap: 40px;
    margin-bottom: 48px;
}

.footer-col h4 {
    font-family: var(--font-heading);
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-dark);
    margin-bottom: 18px;
    letter-spacing: -0.01em;
}

.footer-col ul li {
    margin-bottom: 10px;
}

.footer-col ul li a {
    color: var(--color-text-light);
    font-size: 0.88rem;
    transition: color var(--transition);
}

.footer-col ul li a:hover {
    color: var(--color-accent);
}

.footer-contacts-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.footer-phone {
    font-family: var(--font-heading);
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--color-accent);
}

.footer-email {
    font-size: 0.9rem;
    color: var(--color-text-light);
}

.footer-address {
    font-size: 0.84rem;
    color: var(--color-text);
    line-height: 1.4;
}

.footer-bottom {
    border-top: 1px solid var(--color-border);
    padding-top: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.82rem;
    color: var(--color-text-muted);
    flex-wrap: wrap;
    gap: 14px;
}

.footer-bottom a {
    color: var(--color-text-light);
}

.footer-bottom a:hover {
    color: var(--color-accent);
}

/* ────────────────────────────────────────
   MODALS & LIGHTBOXES
   ──────────────────────────────────────── */

.modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all var(--transition);
}

.modal-backdrop.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.modal-window {
    background: #ffffff;
    border-radius: var(--radius-xl);
    width: 100%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 36px;
    position: relative;
    box-shadow: var(--shadow-xl);
    transform: scale(0.95);
    transition: transform var(--transition);
}

.modal-backdrop.open .modal-window {
    transform: scale(1);
}

.modal-close {
    position: absolute;
    top: 18px;
    right: 18px;
    background: var(--color-bg-light);
    border: none;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    line-height: 1;
    color: var(--color-dark);
    cursor: pointer;
    transition: all var(--transition);
}

.modal-close:hover {
    background: var(--color-accent);
    color: #ffffff;
}

/* City Modal Specifics */
.modal-window--large,
.city-modal-window {
    max-width: 860px;
    width: 95%;
    padding: 36px 40px;
}

.city-search-box {
    margin-bottom: 24px;
}

.city-alphabet-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px 12px;
    max-height: 55vh;
    overflow-y: auto;
    padding-right: 8px;
}

.city-alphabet-item {
    padding: 10px 14px;
    border-radius: var(--radius-md);
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--color-dark);
    cursor: pointer;
    background: #f8fafc;
    border: 1px solid var(--color-border);
    transition: all var(--transition);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.city-alphabet-item:hover {
    background: #fff7ed;
    color: var(--color-accent);
    border-color: rgba(234, 88, 12, 0.3);
    transform: translateY(-1px);
}

.city-alphabet-item.active {
    background: var(--color-accent);
    color: #ffffff;
    border-color: var(--color-accent);
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(234, 88, 12, 0.25);
}

/* ────────────────────────────────────────
   RESPONSIVE MEDIA QUERIES
   ──────────────────────────────────────── */

@media (min-width: 993px) {
    .mobile-drawer,
    .mobile-drawer-backdrop,
    .burger-btn {
        display: none !important;
    }
}

@media (max-width: 1200px) {
    .site-header__top-inner {
        gap: 12px;
    }

    .site-header__brand-group {
        gap: 12px;
    }

    .site-header__actions {
        gap: 12px;
    }

    .header-phone {
        font-size: 1.08rem;
    }

    .site-branding__name {
        font-size: 1.18rem;
    }

    .city-select-btn {
        padding: 5px 10px;
        font-size: 0.82rem;
    }

    .header-cta-btn {
        padding: 8px 14px;
        font-size: 0.82rem;
    }

    .advantages-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .cottage-pricing-grid,
    .licenses-grid,
    .steps-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .licenses-trust-strip {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 1080px) {
    .site-branding__desc {
        display: none;
    }

    .header-contacts__meta .header-schedule,
    .header-contacts__meta .header-meta-sep {
        display: none;
    }

    .header-cta-btn {
        padding: 7px 12px;
        font-size: 0.8rem;
    }
}

@media (max-width: 992px) {
    .site-header__nav {
        display: none;
    }

    .burger-btn {
        display: flex;
    }

    .site-header__top-inner {
        gap: 10px;
    }

    .site-header__actions {
        gap: 10px;
    }

    .header-messengers {
        gap: 6px;
    }

    .msg-badge {
        width: 30px;
        height: 30px;
    }

    .header-phone {
        font-size: 1.05rem;
    }

    .header-email {
        font-size: 0.72rem;
    }

    .hero-grid,
    .service-hero__grid,
    .overview-grid,
    .calc-wrapper,
    .map-interactive-wrapper,
    .service-cta-card__grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .geo-profile-layout {
        grid-template-columns: 1fr;
        padding: 24px;
        gap: 24px;
    }

    .geo-column-wrapper {
        height: 340px;
    }

    .hero-counters {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .map-objects-scroll {
        height: 280px;
    }

    .services-grid,
    .fleet-showcase-grid,
    .works-grid,
    .reviews-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .service-metrics-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .calc-type-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 860px) {
    .header-cta-btn {
        display: none;
    }

    .site-header__brand-group {
        gap: 8px;
    }

    .header-messengers {
        gap: 4px;
    }
}

@media (max-width: 768px) {
    .section {
        padding: 44px 0;
    }

    .header-contacts,
    .header-messengers,
    .header-cta,
    .header-cta-btn {
        display: none;
    }

    .site-header__top-inner {
        gap: 8px;
    }

    .site-header__brand-group {
        gap: 8px;
        flex-shrink: 1;
        min-width: 0;
    }

    .site-branding__desc {
        display: none;
    }

    .site-branding__name {
        font-size: 1.05rem;
    }

    .city-select-btn {
        padding: 5px 8px;
        font-size: 0.78rem;
    }

    .btn {
        white-space: normal;
        word-wrap: break-word;
        max-width: 100%;
        text-align: center;
    }

    .btn--lg {
        padding: 13px 18px;
        font-size: 0.96rem;
        line-height: 1.3;
    }

    .btn--full {
        width: 100%;
        max-width: 100%;
    }

    .service-hero__title-main {
        font-size: clamp(1.35rem, 5.2vw, 1.85rem);
        line-height: 1.22;
        margin-bottom: 10px;
        word-break: normal;
        overflow-wrap: break-word;
    }

    .service-hero__badge {
        font-size: 0.78rem;
        white-space: normal;
        line-height: 1.35;
        max-width: 100%;
    }

    .service-hero__title-geo {
        font-size: 0.82rem;
        padding: 5px 10px;
        line-height: 1.35;
        white-space: normal;
    }

    .service-hero__desc {
        font-size: 0.92rem;
        line-height: 1.55;
        margin-bottom: 20px;
    }

    .service-hero__actions {
        flex-direction: column;
        width: 100%;
        gap: 10px;
    }

    .service-hero__actions .btn {
        width: 100%;
        white-space: normal;
        text-align: center;
    }

    .service-hero__form-card {
        padding: 22px 16px;
        border-radius: var(--radius-lg);
    }

    .service-hero__form-card .btn {
        white-space: normal;
        padding: 13px 14px;
        font-size: 0.95rem;
        line-height: 1.25;
        width: 100%;
    }

    .hero-prop-item {
        padding: 10px 12px;
        min-width: 0;
        width: 100%;
    }

    .hero-prop-text {
        min-width: 0;
    }

    .hero-prop-text strong {
        font-size: 0.88rem;
        word-break: break-word;
    }

    .hero-prop-text span {
        font-size: 0.78rem;
        word-break: break-word;
    }

    .advantages-grid,
    .services-grid,
    .fleet-showcase-grid,
    .works-grid,
    .reviews-grid,
    .cottage-pricing-grid,
    .licenses-grid,
    .steps-grid,
    .service-props-grid,
    .service-hero__props,
    .calc-addons-grid,
    .city-alphabet-grid,
    .footer-grid {
        grid-template-columns: 1fr;
    }

    .hero-counters {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .licenses-trust-strip {
        grid-template-columns: 1fr;
    }

    /* Calculator Responsive at 768px */
    .calc-wrapper {
        padding: 20px 14px;
        border-radius: var(--radius-lg);
        gap: 24px;
    }

    .calc-stepper-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px;
        margin-bottom: 8px;
    }

    .calc-type-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .calc-type-card {
        padding: 10px 6px;
        min-width: 0;
    }

    .calc-type-icon {
        font-size: 1.35rem;
        margin-bottom: 2px;
    }

    .calc-type-name {
        font-size: 0.78rem;
        overflow-wrap: break-word;
        hyphens: auto;
    }

    .calc-type-hint {
        font-size: 0.68rem;
        overflow-wrap: break-word;
    }

    .calc-pills-row {
        gap: 6px;
    }

    .calc-pill {
        padding: 6px 12px;
        font-size: 0.82rem;
    }

    .calc-addons-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .calc-addon-check {
        padding: 10px 12px;
        min-width: 0;
    }

    .calc-addon-info strong {
        font-size: 0.82rem;
        word-break: break-word;
    }

    .calc-addon-info small {
        font-size: 0.74rem;
    }

    .calc-summary-card {
        padding: 22px 16px;
        border-radius: var(--radius-lg);
    }

    .calc-total-box {
        margin-bottom: 18px;
        padding-bottom: 16px;
    }

    .calc-total-lbl {
        font-size: 0.88rem;
    }

    .calc-total-price {
        font-size: clamp(1.8rem, 6vw, 2.3rem);
        margin-bottom: 6px;
    }

    .calc-total-note {
        font-size: 0.78rem;
        line-height: 1.35;
    }

    .calc-details-list {
        gap: 10px;
        margin-bottom: 18px;
        padding-bottom: 16px;
    }

    .calc-detail-item {
        font-size: 0.86rem;
        gap: 8px;
    }

    .calc-detail-item span {
        font-size: 0.84rem;
    }

    .calc-detail-item strong {
        font-size: 0.86rem;
        text-align: right;
    }

    .calc-includes-box {
        margin-bottom: 20px;
    }

    .calc-includes-box span {
        font-size: 0.76rem;
        margin-bottom: 8px;
    }

    .calc-includes-box li {
        font-size: 0.82rem;
        line-height: 1.35;
        gap: 6px;
        word-break: break-word;
        align-items: flex-start;
    }

    .calc-lead-form .btn {
        white-space: normal;
        padding: 13px 14px;
        font-size: 0.95rem;
        line-height: 1.25;
        width: 100%;
        text-align: center;
    }

    .geo-column-wrapper {
        height: 380px;
    }

    .geo-layer {
        padding: 0 10px;
    }

    .geo-layer__name {
        font-size: 0.72rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 175px;
    }

    .geo-depth-scale {
        width: 58px;
        font-size: 0.7rem;
    }

    .service-cta-card {
        padding: 24px 16px;
        border-radius: var(--radius-lg);
    }

    .service-cta-card .btn {
        width: 100%;
        white-space: normal;
        text-align: center;
    }

    .cta-features-list li {
        word-break: break-word;
        font-size: 0.88rem;
    }

    .services-cta-banner {
        padding: 22px 16px;
        margin-top: 32px;
        border-radius: var(--radius-lg);
    }

    .services-cta-banner__actions {
        width: 100%;
        flex-direction: column;
        gap: 10px;
    }

    .services-cta-banner__actions .btn {
        width: 100%;
        white-space: normal;
        text-align: center;
    }

    .risks-cta-box {
        padding: 20px 16px;
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .risks-cta-box__actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .risks-cta-box__actions .btn {
        width: 100%;
        white-space: normal;
        text-align: center;
    }

    .risks-cta-phone {
        text-align: center;
    }

    .pricing-table-card {
        border-radius: var(--radius-lg);
    }

    .pricing-table-card__header {
        padding: 14px 16px;
    }

    .pricing-table-card__header h3 {
        font-size: 1.05rem;
    }

    .cost-table td {
        padding: 10px 10px;
        font-size: 0.84rem;
    }

    .cost-price-val {
        font-size: 0.88rem;
        white-space: nowrap;
        padding-left: 8px;
    }

    .prices-action-box .btn,
    .works-action-box .btn {
        width: 100%;
        white-space: normal;
        text-align: center;
        padding: 13px 16px;
        font-size: 0.94rem;
    }
}

@media (max-width: 480px) {
    .container {
        width: min(calc(100% - 24px), var(--container-width));
    }

    .calc-wrapper {
        padding: 14px 10px;
    }

    .calc-type-grid {
        gap: 6px;
    }

    .calc-type-card {
        padding: 8px 4px;
    }

    .calc-type-icon {
        font-size: 1.2rem;
    }

    .calc-type-name {
        font-size: 0.74rem;
    }

    .calc-type-hint {
        font-size: 0.65rem;
    }

    .calc-pill {
        padding: 5px 10px;
        font-size: 0.76rem;
    }

    .calc-summary-card {
        padding: 16px 12px;
    }

    .calc-total-price {
        font-size: 1.75rem;
    }

    .calc-slider-ticks {
        font-size: 0.7rem;
    }

    .service-hero__form-card {
        padding: 18px 12px;
    }

    .service-cta-card {
        padding: 18px 12px;
    }

    .hero-prop-item {
        padding: 8px 10px;
    }

    .hero-prop-icon {
        font-size: 1.2rem;
    }

    .btn--lg {
        padding: 12px 14px;
        font-size: 0.92rem;
    }

    .cost-table td {
        padding: 8px 6px;
        font-size: 0.78rem;
    }

    .cost-price-val {
        font-size: 0.82rem;
    }
}

@media (max-width: 360px) {
    .calc-type-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   ARTICLE & WYSIWYG RICH CONTENT STYLES (SEO & LEAD CONVERSION)
   ========================================================================== */

.entry-content {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #2c3e50;
}

.entry-content h2 {
    font-size: 1.55rem;
    font-weight: 700;
    color: #0f172a;
    margin: 36px 0 16px 0;
    line-height: 1.35;
    padding-bottom: 8px;
    border-bottom: 2px solid #e2e8f0;
    position: relative;
}

.entry-content h2::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: #0284c7;
}

.entry-content h3 {
    font-size: 1.25rem;
    font-weight: 600;
    color: #1e293b;
    margin: 28px 0 12px 0;
    line-height: 1.4;
}

.entry-content p {
    margin-bottom: 18px;
}

.entry-content ul, 
.entry-content ol {
    margin: 16px 0 24px 0;
    padding-left: 24px;
}

.entry-content li {
    margin-bottom: 8px;
    line-height: 1.7;
}

.entry-content strong {
    color: #0f172a;
    font-weight: 600;
}

/* Responsive Rich Tables */
.entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 28px 0;
    font-size: 0.95rem;
    background: #ffffff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    border: 1px solid #e2e8f0;
}

.entry-content th {
    background: #f1f5f9;
    color: #0f172a;
    font-weight: 600;
    text-align: left;
    padding: 12px 16px;
    border-bottom: 2px solid #cbd5e1;
}

.entry-content td {
    padding: 12px 16px;
    border-bottom: 1px solid #e2e8f0;
    vertical-align: top;
}

.entry-content tr:last-child td {
    border-bottom: none;
}

.entry-content tr:nth-child(even) {
    background: #f8fafc;
}

/* Callout Info Boxes */
.article-callout {
    background: #f0f9ff;
    border-left: 4px solid #0284c7;
    border-radius: 0 12px 12px 0;
    padding: 20px 24px;
    margin: 28px 0;
    font-size: 0.98rem;
    line-height: 1.7;
}

.article-callout--success {
    background: #f0fdf4;
    border-left-color: #16a34a;
}

.article-callout--warning {
    background: #fffbeb;
    border-left-color: #d97706;
}

.article-callout__title {
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* In-Article CTA Banner */
.article-cta-box {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    border-radius: 16px;
    padding: 32px;
    color: #ffffff;
    margin: 36px 0;
    box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.2);
}

.article-cta-box__title {
    font-size: 1.35rem;
    font-weight: 700;
    color: #ffffff !important;
    margin-bottom: 10px;
    border: none !important;
    padding: 0 !important;
}

.article-cta-box__title::after {
    display: none !important;
}

.article-cta-box__text {
    font-size: 0.98rem;
    color: #94a3b8;
    margin-bottom: 20px;
    line-height: 1.6;
}

.article-cta-box__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
}

.article-cta-box__btn {
    background: #0284c7;
    color: #ffffff !important;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 8px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.article-cta-box__btn:hover {
    background: #0369a1;
    transform: translateY(-1px);
}

.article-cta-box__phone {
    color: #38bdf8;
    font-weight: 700;
    font-size: 1.1rem;
    text-decoration: none;
}

.article-cta-box__phone:hover {
    text-decoration: underline;
}

/* Numbered Step Badges */
.article-steps {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 24px 0;
}

.article-step-item {
    display: flex;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 20px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.article-step-item__num {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #0284c7;
    color: #ffffff;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;
}

.article-step-item__content strong {
    display: block;
    font-size: 1.05rem;
    margin-bottom: 4px;
    color: #0f172a;
}

.article-step-item__content p {
    font-size: 0.92rem;
    color: #475569;
    margin: 0;
    line-height: 1.55;
}

/* ==========================================================================
   INNER PAGES RESPONSIVE GRIDS & TOAST SYSTEM
   ========================================================================== */

/* Single Article Layout */
.single-article-grid {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 40px;
    align-items: start;
}

.single-article-main {
    background: #ffffff;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    padding: 40px;
    box-shadow: var(--shadow-sm);
    min-width: 0;
}

.single-article-aside {
    position: sticky;
    top: 100px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Contacts Layout */
.contacts-grid-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 50px;
}

.requisites-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    font-size: 0.9rem;
}

/* About Us Page Grids */
.about-numbers-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    margin-bottom: 60px;
}

.about-intro-grid {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 50px;
    align-items: center;
    margin-bottom: 70px;
}

/* Archive / Category Posts Grid */
.archive-posts-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* Toast Notifier System */
.site-toast {
    position: fixed;
    bottom: 28px;
    right: 28px;
    max-width: 440px;
    background: #0f172a;
    color: #ffffff;
    padding: 16px 22px;
    border-radius: 12px;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.5;
    z-index: 100000;
    opacity: 0;
    transform: translateY(24px) scale(0.96);
    transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
    border-left: 4px solid var(--color-accent);
}

.site-toast.show {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.site-toast--success {
    border-left-color: #10b981;
}

.site-toast--error {
    border-left-color: #ef4444;
}

/* Responsive Media Queries for Inner Pages */
@media (max-width: 992px) {
    .single-article-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .single-article-aside {
        position: static;
    }

    .contacts-grid-layout {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .about-numbers-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 18px;
    }

    .about-intro-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .archive-posts-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .requisites-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .single-article-main {
        padding: 24px 18px;
    }

    .about-numbers-grid {
        grid-template-columns: 1fr;
        gap: 14px;
        margin-bottom: 36px;
    }

    .archive-posts-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .requisites-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
}

@media (max-width: 540px) {
    .site-toast {
        left: 16px;
        right: 16px;
        bottom: 80px; /* Elevated above mobile quick-bar */
        max-width: none;
    }
}

/* Contacts Layout Classes */
.contacts-cards-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-card {
    background: #ffffff;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: 28px;
    box-shadow: var(--shadow-sm);
}

.contact-card--featured {
    border-left: 4px solid var(--color-accent);
}

.contact-form-card {
    background: #ffffff;
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border);
    padding: 36px;
    box-shadow: var(--shadow-md);
    border-top: 4px solid var(--color-accent);
}

.contacts-requisites-card {
    background: var(--color-bg-gray);
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-border);
    padding: 32px;
    margin-bottom: 40px;
}

@media (max-width: 768px) {
    .contact-card {
        padding: 20px 16px;
    }
    .contact-form-card {
        padding: 22px 16px;
    }
    .contacts-requisites-card {
        padding: 20px 16px;
    }
}

@media (max-width: 480px) {
    .contact-card {
        padding: 16px 12px;
    }
    .contact-form-card {
        padding: 18px 12px;
    }
    .contacts-requisites-card {
        padding: 16px 12px;
    }
}


/* Кастомный чекбокс согласия */
.auto-consents {
    margin: 15px 0;
    font-size: 14px;
    line-height: 1.45;
}

.auto-consents label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    color: #64748b;
}

.auto-consents input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    margin: 1px 0 0;
    border: 2px solid #cbd5e1;
    border-radius: 5px;
    background: #fff;
    cursor: pointer;
    position: relative;
    transition: all 0.2s ease;
}

.auto-consents input[type="checkbox"]:hover {
    border-color: #ea580c;
}

.auto-consents input[type="checkbox"]:focus-visible {
    outline: 3px solid rgba(234, 88, 12, 0.2);
    outline-offset: 2px;
}

.auto-consents input[type="checkbox"]:checked {
    background: #ea580c;
    border-color: #ea580c;
}
.auto-consents input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 2px;
    width: 6px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.auto-consents a {
    color: #ea580c;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.auto-consents a:hover {
    color: #c2410c;
}

/* Yandex SmartCaptcha Anti-Spam Styles */
.smart-captcha-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 84px;
    margin: 12px 0 16px;
    overflow: hidden;
    transition: outline 0.2s ease, box-shadow 0.2s ease;
}

.smart-captcha-wrap.has-error {
    outline: 2px solid #ef4444;
    outline-offset: 4px;
    border-radius: 8px;
    animation: shake 0.3s ease-in-out;
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-6px); }
    40%, 80% { transform: translateX(6px); }
}

.smart-captcha {
    max-width: 100%;
}