/* ==========================================================================
   Anmol Digital — Final Modern Design System V2
   Loaded after all legacy styles as a safe visual override layer.
   ========================================================================== */

:root {
    --modern-ink: #101010;
    --modern-ink-soft: #222222;
    --modern-muted: #686868;
    --modern-muted-2: #8b8b8b;
    --modern-paper: #ffffff;
    --modern-canvas: #f5f5f2;
    --modern-canvas-soft: #fafaf8;
    --modern-line: rgba(16, 16, 16, .10);
    --modern-line-strong: rgba(16, 16, 16, .17);
    --modern-dark-line: rgba(255, 255, 255, .13);
    --modern-radius-sm: 12px;
    --modern-radius-md: 18px;
    --modern-radius-lg: 26px;
    --modern-radius-xl: 34px;
    --modern-shadow-xs: 0 1px 2px rgba(0, 0, 0, .035);
    --modern-shadow-sm: 0 12px 34px rgba(0, 0, 0, .055);
    --modern-shadow-md: 0 24px 64px rgba(0, 0, 0, .085);
    --modern-shadow-dark: 0 28px 80px rgba(0, 0, 0, .22);
    --modern-ease: 260ms cubic-bezier(.2, .75, .25, 1);
    --section-space: clamp(72px, 7vw, 108px);
    --container-width: 1360px;
}

html {
    background: var(--modern-canvas-soft);
}

body {
    background:
        radial-gradient(
            circle at 12% 0,
            rgba(0, 0, 0, .025),
            transparent 24%
        ),
        var(--color-background);
    color: var(--modern-ink);
    font-size: 15.5px;
    line-height: 1.68;
}

.site-main {
    overflow: clip;
}

.container-fluid {
    width: min(100% - 52px, var(--container-width));
}

.page-section,
.home-section {
    isolation: isolate;
}

.section-theme-light {
    background:
        linear-gradient(180deg, #ffffff 0%, #fdfdfc 100%);
}

.section-theme-muted {
    background:
        radial-gradient(
            circle at 8% 4%,
            rgba(0, 0, 0, .035),
            transparent 25%
        ),
        linear-gradient(180deg, #f5f5f2 0%, #f1f1ee 100%);
}

.section-theme-dark {
    background:
        radial-gradient(
            circle at 88% 0,
            rgba(255, 255, 255, .06),
            transparent 26%
        ),
        linear-gradient(160deg, #090909 0%, #151515 100%);
}

.section-heading {
    max-width: 820px;
    margin-bottom: clamp(30px, 3.4vw, 48px);
}

.section-heading--center {
    max-width: 900px;
}

.section-heading--split {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 470px);
    align-items: center;
    gap: clamp(28px, 4vw, 62px);
}

.section-heading__eyebrow,
.page-banner__eyebrow,
.page-cta__eyebrow,
.cta-panel__eyebrow {
    margin-bottom: 12px;
    color: #5c5c5c;
    font-size: 10.5px;
    font-weight: 850;
    letter-spacing: .18em;
}

.section-theme-dark .section-heading__eyebrow,
.section-theme-dark .cta-panel__eyebrow {
    color: rgba(255, 255, 255, .64);
}

.section-heading h2 {
    max-width: 980px;
    font-size: clamp(38px, 4.4vw, 66px);
    font-weight: 860;
    letter-spacing: -.052em;
    line-height: .98;
    text-wrap: balance;
}

.section-heading__description {
    max-width: 680px;
    margin-top: 16px;
    color: var(--modern-muted);
    font-size: clamp(15px, 1.25vw, 18px);
    line-height: 1.68;
    text-wrap: pretty;
}

.button {
    min-height: 48px;
    gap: 10px;
    padding: 12px 19px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 820;
    box-shadow: none;
    transition:
        transform var(--modern-ease),
        background-color var(--modern-ease),
        color var(--modern-ease),
        border-color var(--modern-ease),
        box-shadow var(--modern-ease);
}

.button:hover {
    transform: translateY(-2px);
}

.button--dark {
    background: var(--modern-ink);
    box-shadow: 0 12px 26px rgba(0, 0, 0, .13);
}

.button--dark:hover {
    background: #2b2b2b;
    box-shadow: 0 16px 30px rgba(0, 0, 0, .17);
}

.button--light {
    box-shadow: 0 12px 30px rgba(0, 0, 0, .12);
}

.button--outline-dark,
.button--outline-light {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.text-link {
    gap: 8px;
    font-size: 13px;
    font-weight: 820;
}

.text-link i {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(0, 0, 0, .055);
}

.section-theme-dark .text-link i,
.cta-panel .text-link i {
    background: rgba(255, 255, 255, .10);
}

.alert {
    border-radius: var(--modern-radius-sm);
    box-shadow: var(--modern-shadow-xs);
}

.empty-state {
    min-height: 320px;
    border: 1px solid var(--modern-line);
    border-radius: var(--modern-radius-lg);
    background:
        linear-gradient(145deg, #ffffff, #f5f5f2);
    box-shadow: var(--modern-shadow-sm);
}

.pagination a,
.pagination span,
.pagination-list a,
.pagination-list span {
    min-width: 40px;
    height: 40px;
    border-color: var(--modern-line);
    border-radius: 12px;
    box-shadow: var(--modern-shadow-xs);
}

.rich-content {
    color: #343434;
    font-size: 16.5px;
    line-height: 1.78;
}

.rich-content h2,
.rich-content h3,
.rich-content h4,
.rich-content h5 {
    color: var(--modern-ink);
    letter-spacing: -.035em;
    line-height: 1.15;
}

.rich-content p,
.rich-content li {
    text-wrap: pretty;
}

::selection {
    background: #111111;
    color: #ffffff;
}

:focus-visible {
    outline: 2px solid #111111;
    outline-offset: 4px;
}

/* Form surfaces */
.contact-form,
.search-form {
    border-color: var(--modern-line) !important;
    border-radius: var(--modern-radius-lg) !important;
    background:
        linear-gradient(145deg, #ffffff, #fafaf8) !important;
    box-shadow: var(--modern-shadow-sm) !important;
}

.form-field input,
.form-field select,
.form-field textarea,
.search-form input {
    border-color: var(--modern-line) !important;
    border-radius: 13px !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, .025);
}

.form-field input:hover,
.form-field select:hover,
.form-field textarea:hover,
.search-form input:hover {
    border-color: var(--modern-line-strong) !important;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus,
.search-form input:focus {
    border-color: #111111 !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, .065) !important;
}

.live-search-panel {
    border-color: var(--modern-line) !important;
    border-radius: 16px !important;
    box-shadow: var(--modern-shadow-md) !important;
}

/* Footer refinement without changing its structure */
.site-footer {
    background:
        radial-gradient(
            circle at 92% 0,
            rgba(255, 255, 255, .05),
            transparent 23%
        ),
        #0b0b0b !important;
}

.site-footer__link-column a,
.site-footer__contact-list li,
.site-footer__about {
    color: rgba(255, 255, 255, .67) !important;
}

.site-footer__link-column a:hover,
.site-footer__contact-list a:hover {
    color: #ffffff !important;
}

.cookie-consent {
    border-radius: 18px !important;
    background: rgba(12, 12, 12, .94) !important;
    box-shadow: var(--modern-shadow-dark) !important;
}

/* Motion remains minimal and controlled */
@media (prefers-reduced-motion: no-preference) {
    .service-card,
    .testimonial-card,
    .team-card,
    .partner-card,
    .service-detail-card,
    .search-result-card,
    .contact-detail-card,
    .about-highlight {
        transition:
            transform var(--modern-ease),
            border-color var(--modern-ease),
            box-shadow var(--modern-ease),
            background-color var(--modern-ease);
    }
}