/**
 * Shynova 2.0 — Skin
 * Theme-specific visual overrides on top of _core/assets/css/core.css
 */

/* ── Typography ──────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--npc-font-heading);
}

.btn,
.npc-navbar .navbar-nav .nav-link,
.npc-faq__question::after,
.npc-footer__menu a,
.npc-footer__contact-item,
.npc-footer__sub-inner {
    font-family: 'Yantramanav', sans-serif;
}

body {
    font-family: 'Yantramanav', sans-serif;
}

.btn-primary, .npc-navbar .navbar-nav .nav-cta .nav-link {
    border-radius: 0;
    border: 1px solid var(--sn-white);
    box-shadow: 0px 0px 0px 2px var(--sn-primary);
}
.btn-primary:hover, .npc-navbar .navbar-nav .nav-cta .nav-link:hover {
    color: var(--sn-white);
}

/* ── CSS Variables ───────────────────────────────────────────────── */
:root {
    /* These alias Kirki-controlled values so ALL sn-primary/dark usages
       update automatically when the user changes the primary color picker */
    --sn-primary:       var(--npc-btn-bg);
    --sn-primary-dark:  var(--npc-primary-hover);

    --sn-navy:          #2b2b23;
    --sn-navy-rgb:      43, 43, 35;
    --sn-navy-light:    #3e3e33;
    --sn-text:          #2b2b23;
    --sn-text-light:    #717375;
    --sn-bg-light:      #f7f5f2;
    --sn-white:         #ffffff;

    /* Semantic slots — consumed by _core/assets/css/core.css */
    --npc-heading:        var(--sn-navy);
    --npc-text-muted:     var(--sn-text-light);
    --npc-card-bg:        var(--sn-white);
    --npc-bg-alt:         var(--sn-bg-light);
    --npc-subheader-text: var(--sn-navy);

    /* Sparkle mask shape — used with background-color + mask-image */
    --sn-sparkle-mask: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.0497398 20.0539C17.4839 21.2891 18.7192 22.5244 19.9461 39.9503C19.9461 40.0166 20.0456 40.0166 20.0539 39.9503C21.2891 22.5161 22.5244 21.2808 39.9503 20.0539C40.0166 20.0539 40.0166 19.9544 39.9503 19.9461C22.5161 18.7109 21.2808 17.4756 20.0539 0.0497409C20.0539 -0.0165803 19.9544 -0.0165803 19.9461 0.0497409C18.7109 17.4839 17.4756 18.7192 0.0497398 19.9461C-0.0165825 19.9461 -0.0165825 20.0456 0.0497398 20.0539Z' fill='black'/%3E%3C/svg%3E");
}

/* ── Navbar ──────────────────────────────────────────────────────── */
.npc-navbar .navbar-nav .nav-link:hover,
.npc-navbar .navbar-nav .active:not(.nav-cta) > .nav-link {
    color: var(--sn-primary);
}

.npc-navbar .dropdown-menu {
    border-radius: 0;
}

.npc-navbar .dropdown-item {
    font-family: 'Yantramanav', sans-serif;
    color: var(--npc-heading);
}

.npc-navbar .dropdown-item:hover,
.npc-navbar .dropdown-item:focus {
    background-color: rgba(var(--sn-navy-rgb), 0.07);
    color: var(--npc-btn-bg);
}

/* ── Subheader ───────────────────────────────────────────────────── */
.npc-subheader {
    background-color: var(--sn-navy);
}

.npc-subheader__overlay {
    background: linear-gradient(135deg, rgba(var(--sn-navy-rgb), .65) 0%, rgba(var(--sn-navy-rgb), .25) 100%);
}

.npc-subheader--search {
    background-color: var(--sn-bg-light);
}

.npc-subheader--search .text-primary {
    color: var(--npc-btn-bg) !important;
}

/* ── Hero ────────────────────────────────────────────────────────── */

/* Arch transition + decorative offset line + sparkle at the hero bottom */
.npc-hero {
    position: relative;
    padding: 170px 0 220px;
}

/* Sparkle centered at the top edge of the arch */
.npc-hero__overlay::after {
    content: '';
    position: absolute;
    bottom: 99px; /* sits on the arch curve */
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 40px;
    background-color: color-mix(in srgb, var(--npc-btn-bg) 50%, transparent);
    mask-image: var(--sn-sparkle-mask);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    pointer-events: none;
    z-index: 4;
}

.npc-hero__trust-item i {
    color: color-mix(in srgb, var(--npc-btn-bg) 50%, transparent);
}

/* White filled arch — more pronounced curve */
.npc-hero::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 120px;
    background: #ffffff;
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    z-index: 3;
    pointer-events: none;
}

/* Decorative arc line — narrower + higher, so it floats above and diverges from the arch */
.npc-hero::before {
    content: '';
    position: absolute;
    bottom: 60px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 70px;
    background: transparent;
    border-top: 1px solid var(--npc-btn-bg);
    border-radius: 50% 50% 0 0 / 100% 100% 0 0;
    z-index: 4;
    pointer-events: none;
}

@media (max-width: 767.98px) {
    .npc-hero::after  { height: 80px; }
    .npc-hero::before { display: none; }
}

.npc-hero__title {
    color: var(--npc-heading);
}

.npc-hero__subtitle {
    color: var(--npc-text-muted);
    opacity: 1;
}

.npc-hero__trust {
    --npc-trust-color: var(--npc-heading);
}

.npc-hero--split .npc-hero__vignette {
    background: linear-gradient(
        to right,
        rgba(var(--npc-overlay-rgb), 0.60) 0%,
        rgba(var(--npc-overlay-rgb), 0.25) 50%,
        rgba(var(--npc-overlay-rgb), 0.05) 75%,
        transparent 100%
    );
}

.npc-hero--fullwidth .npc-hero__vignette {
    background: linear-gradient(
        to top,
        rgba(var(--npc-overlay-rgb), 0.55) 0%,
        rgba(var(--npc-overlay-rgb), 0.20) 45%,
        transparent 75%
    );
}

/* ── Buttons ─────────────────────────────────────────────────────── */
.btn-outline-primary {
    color: var(--npc-btn-bg);
    border-color: var(--npc-btn-bg);
}

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

/* ── Section bottom divider — single rule for all content sections ── */
.npc-how-it-works,
.npc-trust,
.npc-services,
.npc-compare,
.npc-checklist,
.npc-testimonials,
.npc-areas,
.npc-faq,
.npc-widget,
.npc-intro {
    position: relative;
}

.npc-how-it-works::after,
.npc-trust::after,
.npc-services::after,
.npc-compare::after,
.npc-checklist::after,
.npc-testimonials::after,
.npc-areas::after,
.npc-faq::after,
.npc-widget::after,
.npc-intro::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 1px;
    background: linear-gradient(to right, transparent, var(--npc-btn-bg), transparent);
    pointer-events: none;
    opacity: 0.5;
}

/* ── How It Works ─────────────────────────────────────────────── */

.npc-how-it-works {
    padding-top: 30px;
}
.npc-how-it-works__image-wrap {
    overflow: visible;
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
}

.npc-how-it-works__image {
    border-radius: 50%;
    border: 1px solid var(--npc-btn-bg);
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.npc-how-it-works__image-wrap::before {
    content: '';
    position: absolute;
    inset: -18px -8px -8px -18px; /* top right bottom left */
    border: 1px solid color-mix(in srgb, var(--npc-btn-bg) 30%, transparent);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

.npc-how-it-works__image-wrap::after {
    content: '';
    position: absolute;
    top: -6px;
    left: -6px;
    width: 36px;
    height: 36px;
    background-color: color-mix(in srgb, var(--npc-btn-bg) 50%, transparent);
    mask-image: var(--sn-sparkle-mask);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    pointer-events: none;
    z-index: 2;
}

@media (max-width: 768px) {
    .npc-how-it-works__image-wrap::before, .npc-how-it-works__image-wrap::after {
        display: none;
    }
}

.npc-how-it-works__icon-wrap {
    position: absolute;
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
    z-index: 1;
}

/* Intro section */

.npc-intro__image-wrap {
    overflow: visible;
    position: relative;
    width: 100%;
}

.npc-intro__image {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 9999px 9999px 0 0;
    border: 1px solid var(--npc-btn-bg);
    position: relative;
    z-index: 1;
    object-fit: cover;
    object-position: center top;
}

.npc-intro__image-wrap::before {
    content: '';
    position: absolute;
    inset: -12px;
    border: 1px solid color-mix(in srgb, var(--npc-btn-bg) 30%, transparent);
    border-radius: 9999px 9999px 0 0;
    pointer-events: none;
    z-index: 0;
}

/* Sparkle — parte inferior central, sobre el borde */
.npc-intro__image-wrap::after {
    content: '';
    position: absolute;
    bottom: -24px;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 36px;
    background-color: color-mix(in srgb, var(--npc-btn-bg) 50%, transparent);
    mask-image: var(--sn-sparkle-mask);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    pointer-events: none;
    z-index: 2;
}

/* ── Trust ───────────────────────────────────────────────────────── */
.npc-trust__title { color: var(--npc-heading); }
.npc-trust .npc-section__subtitle { color: var(--npc-text-muted); }

.npc-trust__box-title {
    color: var(--npc-heading);
}

.npc-trust__box-desc {
    color: var(--npc-text-muted);
}

/* ── Services ────────────────────────────────────────────────────── */
.npc-services__card {
    border-radius: 32px 0 32px 0;
    background: var(--npc-card-bg);
    box-shadow: 3px 4px 24px rgba(0, 0, 0, 0.09);
}

.npc-services__card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

/* ── Compare ─────────────────────────────────────────────────────── */
.npc-compare, .npc-checklist, .npc-faq, .npc-trust {
    background-color: color-mix(in srgb, var(--npc-btn-bg) 7%, transparent) !important;
    background-image: none !important;
}
.npc-compare__table-wrap {
    border-radius: 64px 0 64px 0;
    box-shadow: 3px 4px 24px rgba(0, 0, 0, 0.09);
}

.npc-compare__table { border-radius: 64px 0 64px 0; }

.npc-compare__table tbody tr:nth-child(odd) {
    background: linear-gradient(to right, color-mix(in srgb, var(--npc-btn-bg) 15%, transparent), #ffffff);
}

/* ── Checklist ───────────────────────────────────────────────────── */
.npc-checklist__table-wrap {
    border-radius: 64px 0 64px 0;
    box-shadow: 3px 4px 24px rgba(0, 0, 0, 0.09);
}

.npc-checklist__table { border-radius: 64px 0 64px 0; }

.npc-checklist__table tbody tr:nth-child(odd) {
    background: linear-gradient(to right, color-mix(in srgb, var(--npc-btn-bg) 15%, transparent), #ffffff);
}

.npc-checklist__nav .nav-link {
    border-radius: 0;
}

/* ── Check / cross icons — replaced with uploaded SVGs, CSS-only ── */
.npc-compare__icon--check path,
.npc-compare__icon--cross path,
.npc-checklist__icon--check path,
.npc-checklist__icon--cross path {
    display: none; /* hide the inline SVG paths */
}

.npc-compare__icon--check,
.npc-checklist__icon--check {
    color: color-mix(in srgb, var(--npc-btn-bg) 30%, transparent);
    background: url('images/defaults/check.svg') center / contain no-repeat;
}

.npc-compare__icon--cross,
.npc-checklist__icon--cross {
    color: color-mix(in srgb, var(--npc-btn-bg) 30%, transparent);
    background: url('images/defaults/times.svg') center / contain no-repeat;
}

.npc-compare__table tbody tr td, .npc-checklist__table tbody tr td {
    border-bottom: none !important;
}

/* ── Testimonials ────────────────────────────────────────────────── */
.npc-testimonials__title { color: #ffffff; }
.npc-testimonials .npc-section__subtitle { color: rgba(255, 255, 255, .75); }


.npc-testimonials__quote {
    color: #fff;
    font-family: var(--npc-font-heading);
    font-weight: 700;
}

.npc-testimonials__avatar {
    border: 3px solid rgba(255, 255, 255, .3);
}

.npc-testimonials__name  { color: #fff; }
.npc-testimonials__subtitle { color: rgba(255, 255, 255, .8); }

.npc-testimonials .carousel-indicators button       { opacity: .5; }
.npc-testimonials .carousel-indicators button.active { opacity: 1; }
.npc-testimonials .carousel-control-prev,
.npc-testimonials .carousel-control-next            { opacity: .7; }
.npc-testimonials .carousel-control-prev:hover,
.npc-testimonials .carousel-control-next:hover      { opacity: 1; }

/* ── Service Areas ───────────────────────────────────────────────── */
.npc-areas__list-item { color: var(--npc-heading); }

.npc-areas__list-item::before {
    -webkit-mask-image: url('images/defaults/check.svg');
    mask-image: url('images/defaults/check.svg');
}
.npc-areas__map       { box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08); }

/* ── FAQ ─────────────────────────────────────────────────────────── */
.npc-faq__question {
    font-size: 1.125rem;
}
.npc-faq__item, .npc-post-card {
    border-radius: 32px 0 32px 0 !important;
    box-shadow: 3px 4px 24px rgba(0, 0, 0, 0.08);
}
.npc-pagination li > .page-numbers {
    border-radius: 0;
}

/* ── Contact Page ────────────────────────────────────────────────── */
.npc-contact .npc-embed__area, .npc-thankyou__card {
    border-radius: 64px 0 64px 0;
}
.npc-contact__form-col {
    border-right: 1px solid #e5e7eb;
}

.npc-contact__item-link:hover {
    color: var(--sn-primary-dark);
}

.npc-contact__item-number {
    border-radius: 0;
}

/* ── Footer ───────────────────────────────────────────────────────── */

/* Gradient background across both footer bands */
.npc-footer__main {
    background: linear-gradient(to right, var(--npc-footer-bg), var(--npc-footer-bg2)) !important;
    position: relative;
}

.npc-footer__sub {
    background: linear-gradient(to right, var(--npc-footer-bg), var(--npc-footer-bg2)) !important;
}

/* Decorative top border line */
.npc-footer__main::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    height: 1px;
    background: linear-gradient(to right, transparent, var(--npc-btn-bg), transparent);
    pointer-events: none;
}

/* Sparkle inside the footer top-right — no overflow above */
.npc-footer__main::after {
    content: '';
    position: absolute;
    top: 20px;
    right: 5%;
    width: 36px;
    height: 36px;
    background-color: color-mix(in srgb, var(--npc-btn-bg) 50%, transparent);
    mask-image: var(--sn-sparkle-mask);
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    pointer-events: none;
}

/* Typography & colors */
.npc-footer__section-title,
.npc-footer__widget-title {
    font-family: var(--npc-font-heading);
    font-weight: 400;
    color: var(--npc-footer-color);
}

.npc-footer__menu a,
.npc-footer__contact-item,
.npc-footer__contact-item i {
    color: var(--npc-footer-link-color);
}

.npc-footer__menu a:hover,
.npc-footer__contact-item:hover {
    color: var(--npc-footer-link-color);
    opacity: 0.7;
}

.npc-footer__copyright {
    color: var(--npc-footer-color);
    opacity: 0.7;
}

.npc-footer__widget-title {
    font-size: 2rem;
}

.npc-footer__section-title {
    font-size: 1.125rem;
}

.npc-footer__button       { color: var(--npc-footer-link-color); opacity: 0.7; }
.npc-footer__button:hover { color: var(--npc-footer-link-color); opacity: 1; }

/* Social icon borders adapt to dark footer bg */
.npc-footer__sub-social-link {
    border: 1.5px solid color-mix(in srgb, var(--npc-footer-color) 30%, transparent);
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.npc-footer__sub-social-link:hover {
    border-color: color-mix(in srgb, var(--npc-footer-color) 70%, transparent);
    background-color: color-mix(in srgb, var(--npc-footer-color) 8%, transparent);
}

/* ── 404 ─────────────────────────────────────────────────────────── */
.npc-404__heading { opacity: .15; }