/* ==========================================================================
   Staff Hisab – Full Modern UI Theme (2026)
   Loaded after bootstrap.css + style.css + responsive.css so it wins cascade.
   ========================================================================== */

:root {
    --sh-primary: #4F46E5;
    --sh-primary-600: #4338CA;
    --sh-primary-700: #3730A3;
    --sh-primary-50: #EEF2FF;
    --sh-primary-100: #E0E7FF;
    --sh-accent: #06B6D4;
    --sh-accent-2: #8B5CF6;
    --sh-success: #10B981;
    --sh-warn: #F59E0B;
    --sh-danger: #EF4444;
    --sh-text: #0F172A;
    --sh-text-muted: #475569;
    --sh-text-soft: #64748B;
    --sh-bg: #FFFFFF;
    --sh-surface: #F8FAFC;
    --sh-surface-2: #F1F5F9;
    --sh-border: #E2E8F0;
    --sh-border-strong: #CBD5E1;
    --sh-gradient-hero: linear-gradient(135deg, #EEF2FF 0%, #ECFEFF 50%, #F5F3FF 100%);
    --sh-gradient-primary: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    --sh-gradient-accent: linear-gradient(135deg, #06B6D4 0%, #4F46E5 100%);
    --sh-gradient-warm: linear-gradient(135deg, #FB923C 0%, #EF4444 100%);
    --sh-gradient-cta: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #312E81 100%);
    --sh-shadow-xs: 0 1px 2px rgba(15,23,42,0.06);
    --sh-shadow-sm: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04);
    --sh-shadow: 0 4px 6px -1px rgba(15,23,42,0.08), 0 2px 4px -2px rgba(15,23,42,0.05);
    --sh-shadow-md: 0 10px 15px -3px rgba(15,23,42,0.08), 0 4px 6px -4px rgba(15,23,42,0.05);
    --sh-shadow-lg: 0 20px 25px -5px rgba(15,23,42,0.1), 0 8px 10px -6px rgba(15,23,42,0.05);
    --sh-shadow-xl: 0 25px 50px -12px rgba(15,23,42,0.18);
    --sh-shadow-glow: 0 10px 40px -10px rgba(79,70,229,0.45);
    --sh-radius-sm: 10px;
    --sh-radius: 16px;
    --sh-radius-lg: 24px;
    --sh-radius-xl: 32px;
    --sh-transition: 200ms cubic-bezier(0.4, 0, 0.2, 1);
    --sh-transition-slow: 400ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; overflow-x: hidden; line-height: 1.6; color: var(--sh-text); background: #fff; }
*, *::before, *::after { box-sizing: border-box; }
img, svg { max-width: 100%; height: auto; }
input, select, textarea { font-size: 16px; }
a { color: var(--sh-primary-600); }
a:hover { color: var(--sh-primary); }

a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid var(--sh-primary);
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(79,70,229,0.2);
}

/* ---------- Typography ---------- */
h1, h2, h3, h4, h5, h6 { font-weight: 800; letter-spacing: -0.02em; color: var(--sh-text); line-height: 1.15; }
h1 { font-size: clamp(32px, 5.5vw, 58px); }
h2 { font-size: clamp(28px, 4vw, 42px); letter-spacing: -0.025em; }
h3 { font-size: clamp(22px, 2.6vw, 30px); }
h4 { font-size: clamp(18px, 1.8vw, 22px); font-weight: 700; }
p { color: var(--sh-text-muted); font-size: 16px; line-height: 1.65; }

.lead-lg { font-size: clamp(17px, 1.8vw, 20px); line-height: 1.6; color: var(--sh-text-muted); }

/* Gradient text utility */
.grad-text { background: var(--sh-gradient-primary); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.grad-text-accent { background: var(--sh-gradient-accent); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }

/* ---------- Container ---------- */
.container { width: min(92%, 1200px); max-width: 1200px; }

/* ---------- Buttons ---------- */
.btn, .c-btn-primary, .c-btn-secondary, .c-btn-danger, .sh-btn {
    min-height: 48px;
    padding: 12px 28px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 999px;
    border: none;
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), background var(--sh-transition), color var(--sh-transition);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
}
.c-btn-primary, .sh-btn-primary {
    background: var(--sh-gradient-primary);
    color: #fff !important;
    box-shadow: var(--sh-shadow-glow);
    border: none;
}
.c-btn-primary:hover, .sh-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 20px 50px -10px rgba(79,70,229,0.55); color: #fff !important; background: var(--sh-gradient-primary); filter: brightness(1.08); }
.c-btn-secondary, .sh-btn-secondary {
    background: #fff;
    color: var(--sh-text) !important;
    border: 2px solid var(--sh-border-strong);
    box-shadow: var(--sh-shadow-xs);
}
.c-btn-secondary:hover, .sh-btn-secondary:hover { border-color: var(--sh-text); transform: translateY(-2px); box-shadow: var(--sh-shadow); color: var(--sh-text) !important; background: #fff; }
.sh-btn-ghost { background: transparent; color: var(--sh-primary) !important; border: 2px solid var(--sh-primary); }
.sh-btn-ghost:hover { background: var(--sh-primary-50); color: var(--sh-primary-700) !important; }

.btn-lg { min-height: 56px; padding: 16px 36px; font-size: 17px; }

/* Stack CTAs on small screens */
@media (max-width: 575px) {
    .hero-sec .btn, .hero-sec .c-btn-primary, .hero-sec .c-btn-secondary, .sh-hero .btn {
        width: 100%; margin: 0 0 10px 0 !important;
    }
}

/* ---------- Header ---------- */
header {
    padding: 12px 0;
    background: rgba(255,255,255,0.85);
    backdrop-filter: saturate(1.4) blur(20px);
    -webkit-backdrop-filter: saturate(1.4) blur(20px);
    border-bottom: 1px solid rgba(226, 232, 240, 0.7);
    box-shadow: none;
}
.min-height { height: 72px; }
header .navbar-brand img { width: 148px; height: auto; }
header .navbar-light .navbar-nav .nav-link {
    padding: 8px 14px !important;
    font-size: 15px;
    font-weight: 600;
    color: var(--sh-text-muted) !important;
    border-radius: 10px !important;
    border: none !important;
    transition: color var(--sh-transition), background var(--sh-transition);
    position: relative;
}
header .navbar-light .navbar-nav .nav-link:hover,
header .navbar-light .navbar-nav .nav-link.active,
header .navbar-light .navbar-nav .active > .nav-link { color: var(--sh-primary) !important; background: var(--sh-primary-50); }
header .navbar-light .navbar-nav .download .nav-link {
    background: var(--sh-gradient-primary) !important;
    color: #fff !important;
    padding: 10px 24px !important;
    font-weight: 700 !important;
    box-shadow: var(--sh-shadow-glow);
    margin-left: 8px;
}
header .navbar-light .navbar-nav .download .nav-link:hover { color: #fff !important; filter: brightness(1.08); transform: translateY(-1px); }

.navbar-toggler {
    border: 1px solid var(--sh-border-strong) !important;
    border-radius: 12px !important;
    padding: 0 !important;
    width: 44px; height: 44px;
    background: #fff !important;
    display: inline-flex; align-items: center; justify-content: center;
}
.navbar-toggler .fa-bars { color: var(--sh-text); font-size: 18px; }

@media (max-width: 991px) {
    header .navbar-collapse {
        background: #fff;
        margin: 12px -12px 0;
        padding: 14px 18px;
        border: 1px solid var(--sh-border);
        box-shadow: var(--sh-shadow-lg);
        border-radius: var(--sh-radius);
    }
    header .navbar-light .navbar-nav .nav-link { text-align: left; padding: 12px 14px !important; font-size: 16px; margin: 2px 0; }
    header .navbar-light .navbar-nav .download .nav-link { text-align: center; justify-content: center; margin: 10px 0 4px !important; }
    header .dropdown-menu { position: static !important; box-shadow: none !important; padding: 0 0 0 14px !important; border: none !important; }
}

/* ---------- Hero (modern) ---------- */
.sh-hero, .hero-sec {
    padding: 72px 0 56px;
    background: var(--sh-gradient-hero);
    position: relative;
    overflow: hidden;
}
.sh-hero::before {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(600px 300px at 20% 0%, rgba(79,70,229,0.12), transparent 60%),
        radial-gradient(500px 240px at 85% 20%, rgba(6,182,212,0.12), transparent 60%);
    z-index: 0;
    pointer-events: none;
}
.sh-hero > .container { position: relative; z-index: 1; }
.hero-sec .detail, .sh-hero .detail { padding: 12px 0; }
.hero-sec h1, .sh-hero h1 { font-weight: 800; line-height: 1.1; margin-bottom: 20px; }
.hero-sec p, .sh-hero .lead-lg { margin-bottom: 28px; color: var(--sh-text-muted); }
.hero-image { margin: 0; text-align: right; }
.hero-image img { max-width: 100%; border-radius: var(--sh-radius-lg); box-shadow: var(--sh-shadow-xl); }

@media (max-width: 991px) {
    .sh-hero, .hero-sec { padding: 48px 0 32px; text-align: center; }
    .hero-sec .detail, .sh-hero .detail { text-align: center; padding: 0; }
    .hero-image { text-align: center; margin: 0 auto 24px; }
    .hero-image img { max-width: 460px; }
}

/* ---------- Trust badges (above/below hero) ---------- */
.sh-trust { display: inline-flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; align-items: center; }
.sh-trust-pill {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 16px;
    background: #ffffff;
    border: 1px solid var(--sh-border);
    border-radius: 999px;
    font-size: 13px; font-weight: 600; color: var(--sh-text-muted);
    box-shadow: var(--sh-shadow-xs);
}
.sh-trust-pill .star { color: #F59E0B; }
.sh-trust-pill strong { color: var(--sh-text); font-weight: 800; }

/* ---------- Stats strip ---------- */
.sh-stats {
    padding: 0;
    margin: 0 auto;
    max-width: 1100px;
}
.sh-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 24px; background: #fff; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-lg); box-shadow: var(--sh-shadow-md); margin-top: -36px; position: relative; z-index: 2; }
.sh-stat { text-align: center; padding: 8px; }
.sh-stat-val { font-size: clamp(22px, 3vw, 32px); font-weight: 800; color: var(--sh-text); letter-spacing: -0.02em; margin: 0; line-height: 1.1; }
.sh-stat-val .grad-text { font-weight: 800; }
.sh-stat-lbl { font-size: 13px; color: var(--sh-text-muted); margin: 4px 0 0; font-weight: 600; }
@media (max-width: 720px) {
    .sh-stats-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; padding: 16px; }
    .sh-stat { padding: 10px 4px; border-bottom: 1px solid var(--sh-border); }
    .sh-stat:nth-last-child(-n+2) { border-bottom: 0; }
}

/* ---------- Section shell ---------- */
.easy-sec, .count-sec, .touch_sec, .sh-section { padding: 80px 0; }
.easy-sec.pt-0 { padding-top: 0; }
.easy-sec.pb-0 { padding-bottom: 0; }
.sh-section-alt { background: var(--sh-surface); }

@media (max-width: 767px) {
    .easy-sec, .count-sec, .touch_sec, .sh-section { padding: 56px 0; }
}

/* Section eyebrow + title */
.sh-eyebrow { display: inline-block; padding: 6px 14px; background: var(--sh-primary-50); color: var(--sh-primary-700); border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 16px; }
.bg-button { display: inline-block; background: var(--sh-primary-50); color: var(--sh-primary-700); padding: 6px 14px; border-radius: 999px; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }

/* ---------- Bento grid (modern feature grid) ---------- */
.sh-bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 18px; }
.sh-bento > .sh-card { padding: 28px; background: #fff; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-lg); box-shadow: var(--sh-shadow-sm); transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition); }
.sh-bento > .sh-card:hover { transform: translateY(-4px); box-shadow: var(--sh-shadow-lg); border-color: var(--sh-primary); }
.sh-bento .sh-card-lg { grid-column: span 4; }
.sh-bento .sh-card-sm { grid-column: span 2; }
.sh-bento .sh-card-md { grid-column: span 3; }
@media (max-width: 991px) {
    .sh-bento { grid-template-columns: repeat(2, 1fr); }
    .sh-bento .sh-card-lg, .sh-bento .sh-card-md, .sh-bento .sh-card-sm { grid-column: span 2; }
}
@media (max-width: 575px) {
    .sh-bento { grid-template-columns: 1fr; gap: 12px; }
    .sh-bento .sh-card-lg, .sh-bento .sh-card-md, .sh-bento .sh-card-sm { grid-column: span 1; }
}

.sh-card-icon {
    width: 52px; height: 52px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 14px;
    background: var(--sh-primary-50);
    color: var(--sh-primary);
    font-size: 24px;
    margin-bottom: 18px;
}
.sh-card-icon.green { background: #D1FAE5; color: #047857; }
.sh-card-icon.orange { background: #FFEDD5; color: #C2410C; }
.sh-card-icon.pink { background: #FCE7F3; color: #BE185D; }
.sh-card-icon.cyan { background: #CFFAFE; color: #0E7490; }
.sh-card-icon.purple { background: #EDE9FE; color: #6D28D9; }
.sh-card h4, .sh-card h3 { margin: 0 0 10px; font-size: 20px; font-weight: 700; color: var(--sh-text); line-height: 1.3; }
.sh-card p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--sh-text-muted); }

/* ---------- Classic feature grid (cards) ---------- */
.easy-sec .shadow-sm.border.rounded, .sh-feature-card {
    border-radius: var(--sh-radius-lg) !important;
    border-color: var(--sh-border) !important;
    box-shadow: var(--sh-shadow-sm) !important;
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition);
    background: #fff;
    height: 100%;
    padding: 28px !important;
}
.easy-sec .shadow-sm.border.rounded:hover, .sh-feature-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--sh-shadow-lg) !important;
    border-color: var(--sh-primary) !important;
}
.easy-sec .shadow-sm.border.rounded h4,
.easy-sec .shadow-sm.border.rounded h5 { font-size: 18px; line-height: 1.3; margin-bottom: 10px; font-weight: 700; color: var(--sh-text); }
.easy-sec .shadow-sm.border.rounded p { font-size: 15px; line-height: 1.6; margin: 0; color: var(--sh-text-muted); }

/* Feature image rows */
.easy-sec img.rounded, .sh-feature-img { border-radius: var(--sh-radius-lg) !important; box-shadow: var(--sh-shadow-md); }

/* ---------- Logos / clients strip ---------- */
.our-clients-logo { padding: 14px; filter: grayscale(1); opacity: 0.55; transition: opacity var(--sh-transition), filter var(--sh-transition); }
.our-clients-logo:hover { filter: none; opacity: 1; }
.our-clients { text-align: center; font-size: 14px; font-weight: 600; color: var(--sh-text-soft); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 24px; }

/* ---------- Reviews (legacy classes kept for any other page) ---------- */
.reviews .slick-slide { padding: 12px; }
.reviews-slider {
    border-radius: var(--sh-radius-lg) !important;
    box-shadow: var(--sh-shadow-sm);
    border: 1px solid var(--sh-border) !important;
    background: #fff !important;
    padding: 24px !important;
    height: 100%;
    transition: transform var(--sh-transition), box-shadow var(--sh-transition);
}
.reviews-slider::before { display: none !important; }
.reviews-slider:hover { transform: translateY(-3px); box-shadow: var(--sh-shadow-md); }
.reviews-slider .avatar { border-radius: 50%; }
.reviews-slider p { color: var(--sh-text-muted); }
.reviews-slider b { color: var(--sh-text); }

/* ---------- Reviews (modern card) ---------- */
.sh-rating-summary {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    padding: 10px 20px;
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: 999px;
    box-shadow: var(--sh-shadow-xs);
    margin-top: 4px;
}
.sh-rating-stars { color: #F59E0B; font-size: 18px; letter-spacing: 2px; line-height: 1; }
.sh-rating-summary strong { font-size: 16px; color: var(--sh-text); font-weight: 800; }
.sh-rating-sub { font-size: 14px; color: var(--sh-text-muted); }

.sh-reviews .slick-slide { padding: 12px; height: auto; }
.sh-reviews .slick-track { display: flex; align-items: stretch; }
.sh-reviews .slick-slide > div { height: 100%; }

.sh-review {
    position: relative;
    height: 100%;
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-lg);
    padding: 28px;
    box-shadow: var(--sh-shadow-sm);
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition);
    display: flex;
    flex-direction: column;
}
.sh-review::before {
    content: "\201C";
    position: absolute;
    top: -12px;
    left: 22px;
    width: 44px; height: 44px;
    background: var(--sh-gradient-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    font-family: Georgia, serif;
    font-weight: 700;
    line-height: 1;
    padding-top: 10px;
    box-shadow: 0 6px 16px rgba(79,70,229,0.35);
}
.sh-review:hover { transform: translateY(-4px); box-shadow: var(--sh-shadow-lg); border-color: var(--sh-primary); }

.sh-review-stars {
    color: #F59E0B;
    font-size: 16px;
    letter-spacing: 2px;
    margin: 8px 0 14px;
    line-height: 1;
}
.sh-review-stars .dim { color: #E2E8F0; }

.sh-review-quote {
    font-size: 18px;
    font-weight: 700;
    color: var(--sh-text);
    line-height: 1.35;
    margin: 0 0 12px;
    letter-spacing: -0.01em;
}
.sh-review-body {
    font-size: 15px;
    line-height: 1.6;
    color: var(--sh-text-muted);
    margin: 0 0 20px;
    flex: 1;
}
.sh-review-author {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px solid var(--sh-border);
    margin-top: auto;
}
.sh-review-author img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--sh-primary-50);
    flex: 0 0 auto;
}
.sh-review-author strong {
    display: block;
    font-size: 15px;
    color: var(--sh-text);
    font-weight: 700;
}
.sh-review-author span {
    display: block;
    font-size: 13px;
    color: var(--sh-text-muted);
    margin-top: 1px;
}

/* Slick dots */
.sh-dots { bottom: -38px !important; }
.sh-dots li { margin: 0 3px; width: 10px; height: 10px; }
.sh-dots li button { width: 10px; height: 10px; padding: 0; }
.sh-dots li button:before {
    font-size: 10px;
    width: 10px; height: 10px;
    color: var(--sh-border-strong);
    opacity: 1;
    content: "";
    background: var(--sh-border-strong);
    border-radius: 50%;
    transition: all var(--sh-transition);
    display: block;
    line-height: 10px;
}
.sh-dots li.slick-active button:before {
    background: var(--sh-primary);
    transform: scale(1.4);
}
.sh-dots li button:hover:before { background: var(--sh-primary); }

/* Extra bottom room so dots don't collide with next section */
.sh-reviews { padding-bottom: 48px; }

@media (max-width: 575px) {
    .sh-review { padding: 24px 20px; }
    .sh-review-quote { font-size: 17px; }
}

/* ---------- FAQ ---------- */
.accordion { border-radius: var(--sh-radius-lg); border: 1px solid var(--sh-border) !important; box-shadow: var(--sh-shadow-sm); overflow: hidden; background: #fff; }
.accordion-item { border-bottom: 1px solid var(--sh-border); }
.accordion-item:last-child { border-bottom: 0; }
.faq-sec .card-header .btn-link { padding: 20px 64px 20px 24px; font-size: 16px; font-weight: 600; color: var(--sh-text); background: #fff !important; }
.faq-sec .card-header .btn-link:hover { background: var(--sh-primary-50) !important; color: var(--sh-primary-700); }
.faq-sec .card-header .btn-link.collapsed { background: #fff !important; }
.faq-sec .card-body { padding: 4px 24px 22px; color: var(--sh-text-muted); font-size: 15px; line-height: 1.7; }

/* ---------- Inner / secondary banner ---------- */
.inner-banner {
    padding: 64px 0 56px;
    margin-bottom: 40px;
    background: var(--sh-gradient-hero);
    min-height: auto;
    position: relative;
    overflow: hidden;
}
.inner-banner::before { display: none !important; }
.inner-banner::after {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(500px 200px at 15% 0%, rgba(79,70,229,0.1), transparent 60%),
        radial-gradient(500px 200px at 85% 100%, rgba(6,182,212,0.12), transparent 60%);
    z-index: 0; pointer-events: none;
}
.inner-banner > .container { position: relative; z-index: 1; }
.inner-banner figure { margin: 0; }
.about-banner h1 { margin-bottom: 16px; }

/* ---------- Pricing card ---------- */
.price-plan .card { border-radius: var(--sh-radius-xl); box-shadow: var(--sh-shadow-xl); border: 1px solid var(--sh-border); padding: 24px !important; background: #fff; }
.card-border-shadow-primary { border-top: 4px solid var(--sh-primary) !important; }
.price-bg-color { background: var(--sh-gradient-cta); border-radius: var(--sh-radius); color: #fff; padding: 18px; }
.price-bg-color h2, .price-bg-color h3 { color: #fff; }
.price-plan h1 { font-size: clamp(42px, 6vw, 64px); color: var(--sh-primary); font-weight: 800; }
.rupee-icon { font-size: 22px; top: -8px; position: relative; color: #fff; }
.smmal_text { font-size: 13px; color: #cbd5e1; }
.price-bg-color p.text-white { color: #cbd5e1 !important; font-size: 13px; }
.custom-range { width: 100%; height: 8px; appearance: none; background: linear-gradient(to right, var(--sh-primary) 0%, var(--sh-primary) var(--percent), #E2E8F0 var(--percent), #E2E8F0 100%); border-radius: 999px; outline: none; }
.custom-range::-webkit-slider-thumb { appearance: none; height: 22px; width: 22px; background: var(--sh-primary); border-radius: 50%; cursor: pointer; border: 3px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.18); margin-top: -7px; }
.custom-range::-moz-range-thumb { height: 22px; width: 22px; background: var(--sh-primary); border-radius: 50%; cursor: pointer; border: 3px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.18); }
.range-labels { display: flex; justify-content: space-between; padding: 10px 0 0; font-size: 12px; color: var(--sh-text-muted); flex-wrap: wrap; gap: 4px; }
.custom-switch .custom-control-label::before { border-radius: 999px; }

/* ---------- Pricing page (modern) ---------- */
.sh-price-card {
    max-width: 720px;
    margin: -60px auto 0;
    padding: 36px;
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-xl);
    box-shadow: var(--sh-shadow-xl);
    position: relative;
    z-index: 2;
}
@media (max-width: 575px) { .sh-price-card { padding: 22px 18px; margin-top: -40px; border-radius: var(--sh-radius-lg); } }

/* Billing toggle — tab style */
.sh-billing-toggle {
    display: inline-flex;
    gap: 4px;
    padding: 6px;
    background: var(--sh-surface);
    border: 1px solid var(--sh-border);
    border-radius: 999px;
    margin: 0 auto 32px;
    width: 100%;
    max-width: 380px;
    justify-content: center;
}
.sh-billing-toggle { display: flex; }
.sh-billing-btn {
    flex: 1;
    padding: 10px 16px;
    border: none;
    background: transparent;
    color: var(--sh-text-muted);
    font-weight: 600;
    font-size: 14px;
    border-radius: 999px;
    cursor: pointer;
    transition: all var(--sh-transition);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    white-space: nowrap;
}
.sh-billing-btn:hover { color: var(--sh-text); }
.sh-billing-btn.active {
    background: var(--sh-gradient-primary);
    color: #fff;
    box-shadow: 0 4px 12px rgba(79,70,229,0.3);
}
.sh-billing-btn.active:hover { color: #fff; }
.sh-save-pill {
    background: rgba(16,185,129,0.15);
    color: #065F46;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}
.sh-billing-btn.active .sh-save-pill { background: rgba(255,255,255,0.25); color: #fff; }
@media (max-width: 420px) {
    .sh-billing-btn { padding: 10px 12px; font-size: 13px; }
    .sh-save-pill { display: none; }
}

/* Employee count display */
.sh-count-display { text-align: center; margin: 0 0 28px; }
.sh-count-label { font-size: 15px; font-weight: 600; color: var(--sh-text-muted); margin: 0 0 12px; }
.sh-count-num {
    font-size: clamp(56px, 9vw, 88px);
    font-weight: 800;
    background: var(--sh-gradient-primary);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    line-height: 1;
    letter-spacing: -0.03em;
    margin: 0;
}
.sh-count-hint { font-size: 13px; color: var(--sh-text-soft); margin: 6px 0 0; }

/* Range slider */
.sh-range-wrap { margin: 0 0 32px; }
.sh-range { width: 100%; }
.sh-range-labels {
    display: flex;
    justify-content: space-between;
    padding: 10px 0 0;
    font-size: 11px;
    color: var(--sh-text-soft);
    font-weight: 600;
    flex-wrap: nowrap;
    overflow: hidden;
}
.sh-range-labels span:not(:first-child):not(:last-child) { display: none; }
@media (min-width: 480px) {
    .sh-range-labels span { display: inline !important; }
}

/* Price summary panel */
.sh-price-summary {
    background: var(--sh-gradient-cta);
    border-radius: var(--sh-radius-lg);
    padding: 24px 20px;
    margin: 0 0 24px;
    color: #fff;
    position: relative;
    overflow: hidden;
}
.sh-price-summary::before {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(400px 200px at 10% 0%, rgba(79,70,229,0.4), transparent 60%),
        radial-gradient(400px 200px at 90% 100%, rgba(6,182,212,0.25), transparent 60%);
    pointer-events: none;
}
.sh-price-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    position: relative;
    z-index: 1;
}
.sh-price-cell { text-align: center; }
.sh-price-cell-lbl { display: block; font-size: 12px; color: #CBD5E1; font-weight: 600; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.08em; }
.sh-price-cell-val { display: block; font-size: clamp(20px, 2.4vw, 26px); font-weight: 800; color: #fff; letter-spacing: -0.02em; line-height: 1.1; }
.sh-price-cell-val small { font-size: 0.55em; color: #CBD5E1; font-weight: 600; margin-left: 2px; }
.sh-price-cell-val .sh-rupee { font-size: 0.7em; margin-right: 1px; }
.sh-price-divider { color: #64748B; font-size: 24px; font-weight: 400; opacity: 0.6; }
.sh-price-total .sh-price-cell-val { background: linear-gradient(135deg, #06B6D4, #8B5CF6); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; font-weight: 900; }
.sh-price-total .sh-price-cell-val small, .sh-price-total .sh-price-cell-val .sh-rupee { -webkit-text-fill-color: transparent; }

@media (max-width: 575px) {
    .sh-price-row { grid-template-columns: 1fr; gap: 14px; }
    .sh-price-divider { display: none; }
    .sh-price-cell { padding: 10px 0; border-top: 1px solid rgba(255,255,255,0.1); }
    .sh-price-cell:first-child { border-top: 0; padding-top: 0; }
    .sh-price-total { padding-top: 16px !important; border-top: 1px solid rgba(255,255,255,0.25) !important; }
}

/* CTA */
.sh-price-cta { text-align: center; }
.sh-price-note { font-size: 13px; color: var(--sh-text-soft); margin: 12px 0 0; }

/* What's included grid */
.sh-included { margin: 80px 0 0; }
.sh-included-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px 24px;
    max-width: 960px;
    margin: 0 auto;
}
.sh-included-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    color: var(--sh-text);
    font-weight: 500;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-sm);
    transition: border-color var(--sh-transition), transform var(--sh-transition), box-shadow var(--sh-transition);
}
.sh-included-item:hover { border-color: var(--sh-primary); transform: translateY(-2px); box-shadow: var(--sh-shadow-sm); }
.sh-included-item .check {
    flex: 0 0 auto;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--sh-success);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 800;
}
@media (max-width: 991px) { .sh-included-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .sh-included-grid { grid-template-columns: 1fr; gap: 10px; } .sh-included { margin-top: 60px; } }

/* ---------- Download page ---------- */
.sh-download-pills {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 28px;
}
.sh-download-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    color: var(--sh-text-muted);
    box-shadow: var(--sh-shadow-xs);
}
.sh-download-pill strong { color: var(--sh-text); font-weight: 700; }

.sh-download-cta { margin: 0; }
.sh-download-btn {
    padding: 16px 32px !important;
    min-height: 66px !important;
    gap: 14px;
    font-size: 16px;
}
.sh-download-btn .sh-dl-icon {
    font-size: 28px;
    line-height: 1;
    width: 36px; height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.15);
    border-radius: 10px;
}
.sh-download-btn span span { display: block; text-align: left; }
.sh-download-btn .sh-dl-main { font-size: 17px; font-weight: 700; line-height: 1.2; }
.sh-download-btn .sh-dl-sub { font-size: 12px; font-weight: 500; opacity: 0.85; margin-top: 2px; letter-spacing: 0; }

.sh-download-note {
    margin: 16px 0 0;
    font-size: 14px;
    color: var(--sh-text-muted);
}
.sh-rating-inline { color: #F59E0B; font-weight: 700; margin-right: 6px; }

@media (max-width: 575px) {
    .sh-download-btn { min-height: auto !important; padding: 14px 20px !important; width: 100%; }
    .sh-download-btn .sh-dl-icon { width: 32px; height: 32px; font-size: 22px; }
    .sh-download-btn .sh-dl-main { font-size: 16px; }
    .sh-download-btn .sh-dl-sub { display: none !important; }
}

/* 3-step install guide */
.sh-steps {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto 1fr;
    gap: 20px;
    align-items: stretch;
    max-width: 1100px;
    margin: 0 auto;
}
.sh-step {
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-lg);
    padding: 32px 24px 24px;
    box-shadow: var(--sh-shadow-sm);
    text-align: left;
    position: relative;
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition);
}
.sh-step:hover { transform: translateY(-4px); box-shadow: var(--sh-shadow-lg); border-color: var(--sh-primary); }
.sh-step-num {
    position: absolute;
    top: -20px;
    left: 24px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--sh-gradient-primary);
    color: #fff;
    font-size: 20px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px rgba(79,70,229,0.4);
}
.sh-step h4 { margin: 6px 0 10px; font-size: 19px; font-weight: 700; color: var(--sh-text); }
.sh-step p { color: var(--sh-text-muted); font-size: 15px; line-height: 1.6; margin: 0 0 14px; }
.sh-step p code { background: var(--sh-surface); padding: 2px 6px; border-radius: 4px; font-size: 13px; color: var(--sh-primary-700); font-weight: 600; }
.sh-step-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--sh-border); padding-top: 14px; }
.sh-step-list li { font-size: 14px; color: var(--sh-text-muted); margin-bottom: 6px; }
.sh-step-list li:last-child { margin-bottom: 0; }
.sh-step-list li strong { color: var(--sh-text); font-weight: 700; }

.sh-step-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    color: var(--sh-border-strong);
    font-weight: 400;
}

@media (max-width: 991px) {
    .sh-steps { grid-template-columns: 1fr; gap: 36px 0; }
    .sh-step-arrow { transform: rotate(90deg); font-size: 24px; height: 20px; }
}

/* Info cards (system reqs + support) */
.sh-info-card {
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-lg);
    padding: 32px;
    box-shadow: var(--sh-shadow-sm);
    height: 100%;
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition);
}
.sh-info-card:hover { transform: translateY(-2px); box-shadow: var(--sh-shadow); border-color: var(--sh-primary); }
.sh-info-icon {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--sh-primary-50);
    color: var(--sh-primary);
    font-size: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}
.sh-info-card h3 { font-size: 22px; margin: 0 0 14px; color: var(--sh-text); font-weight: 700; }

.sh-check-list { list-style: none; padding: 0; margin: 0; }
.sh-check-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    color: var(--sh-text);
    padding: 8px 0;
    border-bottom: 1px solid var(--sh-border);
}
.sh-check-list li:last-child { border-bottom: 0; }
.sh-check-list li .check {
    flex: 0 0 auto;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: var(--sh-success);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 800;
    margin-top: 1px;
}
.sh-check-list li a { color: var(--sh-primary-700); }

/* ---------- Contact page ---------- */
.sh-contact-methods {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: 1050px;
    margin: -40px auto 0;
    position: relative;
    z-index: 2;
}
.sh-contact-method {
    display: block;
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-lg);
    padding: 28px 26px;
    text-align: left;
    text-decoration: none !important;
    color: inherit !important;
    box-shadow: var(--sh-shadow-sm);
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition);
}
.sh-contact-method:hover { transform: translateY(-4px); box-shadow: var(--sh-shadow-lg); border-color: var(--sh-primary); color: inherit !important; }
.sh-contact-method h4 { margin: 0 0 8px; font-size: 19px; font-weight: 700; color: var(--sh-text); }
.sh-contact-method p { margin: 0 0 14px; font-size: 14px; line-height: 1.55; color: var(--sh-text-muted); }
.sh-contact-value {
    display: inline-block;
    padding-top: 12px;
    border-top: 1px solid var(--sh-border);
    width: 100%;
    font-size: 15px;
    font-weight: 700;
    color: var(--sh-primary-700);
    word-break: break-word;
}
.sh-contact-method:hover .sh-contact-value { color: var(--sh-primary); }

@media (max-width: 991px) { .sh-contact-methods { grid-template-columns: 1fr; margin-top: -24px; } }

/* Contact side panel (office details) */
.sh-contact-side {
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-lg);
    padding: 36px 32px;
    box-shadow: var(--sh-shadow-sm);
    height: 100%;
}
.sh-contact-side > p { margin-bottom: 24px; }
.sh-contact-detail {
    display: flex;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px solid var(--sh-border);
}
.sh-contact-detail:last-child { border-bottom: 0; padding-bottom: 0; }
.sh-contact-detail-icon {
    flex: 0 0 auto;
    width: 40px; height: 40px;
    border-radius: 10px;
    background: var(--sh-primary-50);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}
.sh-contact-detail strong {
    display: block;
    font-size: 13px;
    color: var(--sh-text-soft);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 4px;
}
.sh-contact-detail span {
    display: block;
    font-size: 15px;
    color: var(--sh-text);
    line-height: 1.55;
}
.sh-contact-detail a { color: var(--sh-primary-700); font-weight: 600; }
.sh-contact-detail a:hover { color: var(--sh-primary); }

/* Contact form card */
.sh-contact-form-card {
    background: #fff;
    border: 1px solid var(--sh-border);
    border-radius: var(--sh-radius-lg);
    padding: 36px 32px;
    box-shadow: var(--sh-shadow-sm);
    height: 100%;
}
.sh-form-error {
    background: #FEE2E2;
    color: #991B1B;
    padding: 12px 16px;
    border-radius: var(--sh-radius-sm);
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 16px;
}
.sh-form-note {
    margin: 14px 0 0;
    font-size: 13px;
    color: var(--sh-text-soft);
    text-align: center;
}

/* Success state */
.sh-form-success { text-align: center; padding: 20px 0; }
.sh-form-success-icon {
    width: 80px; height: 80px;
    margin: 0 auto 20px;
    background: var(--sh-gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 30px rgba(79,70,229,0.4);
    animation: sh-pop 400ms cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes sh-pop {
    0% { transform: scale(0.5); opacity: 0; }
    60% { transform: scale(1.1); }
    100% { transform: scale(1); opacity: 1; }
}
.sh-form-success h2 { font-size: 28px; color: var(--sh-text); margin: 0 0 12px; }
.sh-form-success p { color: var(--sh-text-muted); max-width: 420px; margin: 0 auto; font-size: 16px; line-height: 1.6; }

@media (max-width: 575px) {
    .sh-contact-side, .sh-contact-form-card { padding: 24px 20px; }
}

/* Validation messages tighter spacing */
.srv-validation-message {
    color: #DC2626;
    font-size: 13px;
    font-weight: 600;
    margin-top: 6px;
    display: block;
}

/* ---------- Forms ---------- */
.form-control, select.form-control {
    min-height: 48px;
    border-radius: 12px;
    border: 1.5px solid var(--sh-border-strong);
    padding: 12px 16px;
    font-size: 15px;
    transition: border-color var(--sh-transition), box-shadow var(--sh-transition);
    background: #fff;
}
.form-control:focus { border-color: var(--sh-primary); box-shadow: 0 0 0 4px rgba(79,70,229,0.12); }
.form-label { font-weight: 600; color: var(--sh-text); margin-bottom: 6px; font-size: 14px; }

/* Modal */
.modal-content { border-radius: var(--sh-radius-lg); border: none; box-shadow: var(--sh-shadow-xl); }
.modal-header { border-bottom: 1px solid var(--sh-border); padding: 20px 24px; }
.modal-title { font-weight: 700; color: var(--sh-text); }
.modal-body { padding: 24px; }

/* ---------- Industry grid (mini cards) ---------- */
.sh-industries { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.sh-industry { padding: 22px 16px; background: #fff; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); text-align: center; transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition); cursor: default; }
.sh-industry:hover { transform: translateY(-3px); box-shadow: var(--sh-shadow); border-color: var(--sh-primary); }
.sh-industry .emoji { font-size: 32px; display: block; margin-bottom: 8px; }
.sh-industry h5 { font-size: 15px; font-weight: 700; margin: 0 0 4px; color: var(--sh-text); }
.sh-industry small { font-size: 12px; color: var(--sh-text-muted); line-height: 1.45; }
@media (max-width: 991px) { .sh-industries { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575px) { .sh-industries { grid-template-columns: repeat(2, 1fr); gap: 10px; } }

/* ---------- CTA band (dark gradient) ---------- */
.sh-cta {
    padding: 80px 0;
    background: var(--sh-gradient-cta);
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden;
}
.sh-cta::before {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(600px 300px at 10% 0%, rgba(79,70,229,0.35), transparent 60%),
        radial-gradient(600px 300px at 90% 100%, rgba(6,182,212,0.25), transparent 60%);
    pointer-events: none;
}
.sh-cta > .container { position: relative; z-index: 1; }
.sh-cta h2 { color: #fff; font-size: clamp(28px, 4vw, 44px); margin-bottom: 16px; }
.sh-cta p { color: #cbd5e1; font-size: clamp(16px, 1.6vw, 18px); max-width: 620px; margin: 0 auto 28px; }
.sh-cta .sh-btn-primary { background: #fff; color: var(--sh-primary) !important; box-shadow: 0 10px 30px rgba(0,0,0,0.25); }
.sh-cta .sh-btn-primary:hover { background: #fff; color: var(--sh-primary-700) !important; }
.sh-cta .sh-btn-ghost { color: #fff !important; border-color: rgba(255,255,255,0.4); background: transparent; }
.sh-cta .sh-btn-ghost:hover { background: rgba(255,255,255,0.1); color: #fff !important; }

@media (max-width: 767px) { .sh-cta { padding: 56px 0; } }

/* ---------- Pricing teaser ---------- */
.sh-pricing-teaser { text-align: center; max-width: 720px; margin: 0 auto; padding: 40px 28px; background: #fff; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-xl); box-shadow: var(--sh-shadow-lg); position: relative; }
.sh-pricing-teaser .price { font-size: clamp(44px, 6vw, 64px); font-weight: 800; color: var(--sh-text); line-height: 1; }
.sh-pricing-teaser .price .grad-text { font-weight: 800; }
.sh-pricing-teaser .price-sub { color: var(--sh-text-muted); font-size: 15px; margin: 6px 0 20px; }
.sh-pricing-teaser ul { list-style: none; padding: 0; margin: 18px 0 24px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; text-align: left; }
.sh-pricing-teaser li { font-size: 15px; color: var(--sh-text-muted); display: flex; gap: 8px; align-items: start; }
.sh-pricing-teaser li::before { content: "✓"; color: var(--sh-success); font-weight: 800; flex: 0 0 auto; }
@media (max-width: 575px) { .sh-pricing-teaser ul { grid-template-columns: 1fr; } }

/* ---------- Blog list cards ---------- */
section.easy-sec .card {
    border-radius: var(--sh-radius-lg) !important;
    border: 1px solid var(--sh-border) !important;
    overflow: hidden;
    transition: transform var(--sh-transition), box-shadow var(--sh-transition), border-color var(--sh-transition);
    box-shadow: var(--sh-shadow-xs);
}
section.easy-sec .card:hover { transform: translateY(-4px); box-shadow: var(--sh-shadow-lg); border-color: var(--sh-primary) !important; }
section.easy-sec .card img { height: 200px; object-fit: cover; background: var(--sh-surface); transition: transform var(--sh-transition); }
section.easy-sec .card:hover img { transform: scale(1.03); }
section.easy-sec .card .card-body { padding: 22px; }
section.easy-sec .card h4 { font-size: 18px; line-height: 1.35; margin-bottom: 12px; font-weight: 700; color: var(--sh-text); }
section.easy-sec .card .text-muted { font-size: 13px; color: var(--sh-text-soft) !important; font-weight: 600; }
section.easy-sec .card p { font-size: 14px; line-height: 1.6; color: var(--sh-text-muted); margin-bottom: 16px; }

/* ---------- Blog post content ---------- */
.blog-content { font-size: 17px; line-height: 1.8; color: var(--sh-text); max-width: 760px; }
.blog-content h2 { font-size: clamp(22px, 2.6vw, 30px); margin-top: 44px; margin-bottom: 14px; color: var(--sh-text); letter-spacing: -0.02em; }
.blog-content h3 { font-size: clamp(18px, 2.2vw, 22px); margin-top: 28px; margin-bottom: 12px; color: var(--sh-text); }
.blog-content p { margin-bottom: 18px; color: #1E293B; }
.blog-content ul, .blog-content ol { margin: 6px 0 22px 22px; padding-left: 6px; }
.blog-content li { list-style-position: outside; margin-bottom: 8px; color: #1E293B; }
.blog-content ul li { list-style-type: disc; }
.blog-content ol li { list-style-type: decimal; }
.blog-content strong { color: var(--sh-text); font-weight: 700; }
.blog-content a { color: var(--sh-primary-600); text-decoration: underline; text-underline-offset: 3px; }
.blog-content a:hover { color: var(--sh-primary-700); }
.blog-content blockquote { margin: 22px 0; padding: 18px 24px; background: var(--sh-primary-50); border-left: 4px solid var(--sh-primary); border-radius: var(--sh-radius-sm); font-size: 16px; color: var(--sh-text); }
.blog-content blockquote p { margin: 0; color: var(--sh-text); }
.blog-content pre { background: #0F172A; color: #E2E8F0; padding: 14px 18px; border-radius: var(--sh-radius-sm); overflow-x: auto; font-size: 14px; line-height: 1.6; margin: 18px 0; }
.blog-content code { background: var(--sh-surface); padding: 2px 6px; border-radius: 4px; font-size: 0.92em; color: #BE185D; }
.blog-content pre code { background: transparent; color: inherit; padding: 0; font-size: inherit; }
.blog-content .btn { text-decoration: none; color: #fff; }
.blog-content table { max-width: 100%; border-collapse: collapse; }
@media (max-width: 720px) {
    .blog-content table { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; border: 1px solid var(--sh-border); border-radius: var(--sh-radius-sm); }
    .blog-content table th, .blog-content table td { white-space: normal; }
}

/* ---------- Site Footer (scoped to .site-footer) ---------- */
.site-footer { background: var(--sh-text); color: #CBD5E1; padding-top: 0; }
.site-footer::before { display: none !important; }
.site-footer .footer-top { padding: 56px 0 24px; background: var(--sh-text); }
.site-footer .footer-top h3 { font-size: 14px; font-weight: 700; color: #fff; margin-bottom: 18px; letter-spacing: 0.08em; text-transform: uppercase; }
.site-footer .footer-links li { margin: 0 0 10px; font-size: 15px; }
.site-footer .footer-links li a { color: #CBD5E1; transition: color var(--sh-transition), padding-left var(--sh-transition); }
.site-footer .footer-links li a:hover { color: #fff; padding-left: 6px; }
.site-footer .footer-links li a::after { display: none !important; }
.site-footer .add-info { font-size: 14px; color: #CBD5E1; line-height: 1.7; }
.site-footer .add-info b { color: #fff; font-weight: 600; }
.site-footer .copyright { padding: 18px 0; font-size: 13px; color: #94A3B8; background: #020617; border-top: 1px solid #1E293B; }

/* Footer logo is already white-wordmark (logo-white.svg) — no filter needed */

@media (max-width: 767px) {
    .site-footer .footer-top { padding: 40px 0 16px; text-align: left; }
    .site-footer .footer-top h3 { margin-top: 24px; margin-bottom: 12px; }
    .site-footer .footer-top > .container > .row > div:first-child { text-align: center; margin-bottom: 16px; }
}

/* ---------- Row padding fix ---------- */
.container, .row { max-width: 100%; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
    * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* ---------- Very small screens ---------- */
@media (max-width: 480px) {
    .hero-sec h1, .sh-hero h1 { font-size: 32px; }
    .hero-sec p, .sh-hero .lead-lg { font-size: 16px; }
    h2 { font-size: 26px; }
    .sh-bento, .sh-industries { gap: 10px; }
}

/* ---------- Scroll-margin for anchored sections ---------- */
section[id] { scroll-margin-top: 80px; }

/* ---------- Print ---------- */
@media print {
    header, footer, .modal, .sh-cta { display: none; }
    .blog-content { font-size: 12pt; line-height: 1.5; }
    a { color: #000; text-decoration: underline; }
}