/* Shared styles for the generated NovasasK pages (country, service, demo, 404). */
:root {
    --nsp-red: #e00000;
    --nsp-red-dark: #b80000;
    --nsp-navy: #0b1737;
    --nsp-ink: #1d2433;
    --nsp-muted: #5b6475;
    --nsp-line: #e6e8ef;
    --nsp-soft: #f6f7fb;
    --nsp-radius: 16px;
}

.nsp-hero {
    position: relative;
    color: #fff;
    background: var(--nsp-navy) center/cover no-repeat;
    padding: 84px 0 72px;
    overflow: hidden;
}
.nsp-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, rgba(8, 20, 55, .94) 0%, rgba(8, 20, 55, .82) 55%, rgba(8, 20, 55, .55) 100%);
}
.nsp-hero > .container { position: relative; }
.nsp-hero h1 {
    color: #fff;
    font-weight: 800;
    font-size: clamp(2rem, 4.2vw, 3.2rem);
    line-height: 1.15;
    margin: 18px 0 14px;
}
.nsp-hero h1 span { color: #ff4d4d; }
.nsp-hero .lead { color: rgba(255, 255, 255, .86); max-width: 640px; font-size: 1.1rem; }
.nsp-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 18px;
    border-radius: 50px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    font-size: .9rem;
    font-weight: 600;
}
.nsp-badge img { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
.nsp-hero-points { list-style: none; padding: 0; margin: 22px 0 28px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 22px; max-width: 620px; }
.nsp-hero-points li { display: flex; gap: 10px; align-items: flex-start; color: rgba(255, 255, 255, .92); }
.nsp-hero-points i { color: #4ade80; margin-top: 4px; }
.nsp-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.nsp-btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 13px 24px; border-radius: 50px; font-weight: 600;
    text-decoration: none; transition: transform .15s ease, background .15s ease;
    border: 2px solid transparent;
}
.nsp-btn:hover { transform: translateY(-2px); }
.nsp-btn-red { background: var(--nsp-red); color: #fff; }
.nsp-btn-red:hover { background: var(--nsp-red-dark); color: #fff; }
.nsp-btn-ghost { border-color: rgba(255, 255, 255, .6); color: #fff; }
.nsp-btn-ghost:hover { background: #fff; color: var(--nsp-navy); }
.nsp-btn-green { background: #16a34a; color: #fff; }
.nsp-btn-green:hover { background: #12833c; color: #fff; }
.nsp-btn-outline { border-color: var(--nsp-red); color: var(--nsp-red); }
.nsp-btn-outline:hover { background: var(--nsp-red); color: #fff; }

.nsp-facts { background: #fff; border-radius: var(--nsp-radius); padding: 26px; color: var(--nsp-ink); box-shadow: 0 20px 50px rgba(0, 0, 0, .25); }
.nsp-facts h2 { font-size: 1.15rem; font-weight: 700; margin-bottom: 14px; color: var(--nsp-ink); }
.nsp-facts dl { margin: 0; }
.nsp-facts .row-fact { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px dashed var(--nsp-line); }
.nsp-facts .row-fact:last-child { border-bottom: 0; }
.nsp-facts dt { font-weight: 500; color: var(--nsp-muted); }
.nsp-facts dd { margin: 0; font-weight: 600; text-align: right; }
.nsp-note { font-size: .8rem; color: var(--nsp-muted); margin: 12px 0 0; }

.nsp-subnav { position: sticky; top: 0; z-index: 20; background: #fff; border-bottom: 1px solid var(--nsp-line); }
.nsp-subnav ul { display: flex; gap: 6px; list-style: none; margin: 0; padding: 10px 0; overflow-x: auto; scrollbar-width: none; }
.nsp-subnav ul::-webkit-scrollbar { display: none; }
.nsp-subnav a { display: block; white-space: nowrap; padding: 7px 14px; border-radius: 50px; color: var(--nsp-ink); text-decoration: none; font-size: .92rem; font-weight: 500; }
.nsp-subnav a:hover { background: var(--nsp-soft); color: var(--nsp-red); }

.nsp-section { padding: 72px 0; scroll-margin-top: 70px; }
.nsp-section.alt { background: var(--nsp-soft); }
.nsp-eyebrow { display: inline-block; color: var(--nsp-red); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: .82rem; margin-bottom: 8px; }
.nsp-title { font-weight: 800; color: var(--nsp-ink); font-size: clamp(1.6rem, 3vw, 2.3rem); margin-bottom: 14px; }
.nsp-intro { color: var(--nsp-muted); max-width: 760px; font-size: 1.05rem; }
.nsp-head { margin-bottom: 36px; }
.nsp-head.center { text-align: center; }
.nsp-head.center .nsp-intro { margin-inline: auto; }

.nsp-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.nsp-card {
    background: #fff; border: 1px solid var(--nsp-line); border-radius: var(--nsp-radius);
    padding: 24px; height: 100%; transition: box-shadow .2s ease, transform .2s ease;
}
.nsp-card:hover { box-shadow: 0 14px 34px rgba(16, 24, 40, .08); transform: translateY(-3px); }
.nsp-card h3 { font-size: 1.1rem; font-weight: 700; color: var(--nsp-ink); margin: 14px 0 8px; }
.nsp-card p { color: var(--nsp-muted); margin: 0; }
.nsp-card .nsp-link { display: inline-flex; gap: 6px; align-items: center; margin-top: 14px; font-weight: 600; color: var(--nsp-red); text-decoration: none; }
.nsp-icon { width: 50px; height: 50px; border-radius: 14px; display: grid; place-items: center; background: #fff1f1; color: var(--nsp-red); font-size: 1.25rem; }
a.nsp-card { display: block; text-decoration: none; }

.nsp-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.nsp-list li { display: flex; gap: 12px; align-items: flex-start; color: var(--nsp-ink); }
.nsp-list i { color: var(--nsp-red); margin-top: 5px; }
.nsp-list.two { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }

.nsp-uni { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--nsp-line); border-radius: 12px; padding: 14px 18px; font-weight: 600; color: var(--nsp-ink); }
.nsp-uni i { color: var(--nsp-red); }

.nsp-steps { counter-reset: step; display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.nsp-step { position: relative; background: #fff; border-radius: var(--nsp-radius); padding: 26px 22px 22px; border: 1px solid var(--nsp-line); }
.nsp-step::before {
    counter-increment: step; content: counter(step);
    display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%;
    background: var(--nsp-red); color: #fff; font-weight: 700; margin-bottom: 12px;
}
.nsp-step h3 { font-size: 1.05rem; font-weight: 700; margin-bottom: 6px; color: var(--nsp-ink); }
.nsp-step p { color: var(--nsp-muted); margin: 0; font-size: .95rem; }

.nsp-table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--nsp-line); border-radius: var(--nsp-radius); overflow: hidden; }
.nsp-table th, .nsp-table td { padding: 14px 18px; border-bottom: 1px solid var(--nsp-line); text-align: left; vertical-align: top; }
.nsp-table tr:last-child td { border-bottom: 0; }
.nsp-table th { background: var(--nsp-navy); color: #fff; font-weight: 600; }
.nsp-table td:first-child { font-weight: 600; color: var(--nsp-ink); width: 38%; }
.nsp-table-wrap { overflow-x: auto; }

.nsp-faq details { background: #fff; border: 1px solid var(--nsp-line); border-radius: 12px; margin-bottom: 12px; }
.nsp-faq summary { cursor: pointer; list-style: none; padding: 18px 52px 18px 20px; font-weight: 600; color: var(--nsp-ink); position: relative; }
.nsp-faq summary::-webkit-details-marker { display: none; }
.nsp-faq summary::after { content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); font-size: 1.4rem; color: var(--nsp-red); }
.nsp-faq details[open] summary::after { content: "–"; }
.nsp-faq details p { padding: 0 20px 18px; margin: 0; color: var(--nsp-muted); }

.nsp-cta { background: linear-gradient(120deg, var(--nsp-navy), #23306b); color: #fff; border-radius: 22px; padding: 44px; }
.nsp-cta h2 { color: #fff; font-weight: 800; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.nsp-cta p { color: rgba(255, 255, 255, .85); }

.nsp-countries { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.nsp-country { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--nsp-line); background: #fff; color: var(--nsp-ink); text-decoration: none; font-weight: 600; }
.nsp-country:hover { border-color: var(--nsp-red); color: var(--nsp-red); }
.nsp-country img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }

.nsp-404 { padding: 110px 0; text-align: center; }
.nsp-404 .code { font-size: clamp(5rem, 16vw, 9rem); font-weight: 900; line-height: 1; color: var(--nsp-red); }

@media (max-width: 991px) {
    .nsp-hero { padding: 56px 0 48px; }
    .nsp-facts { margin-top: 32px; }
}
@media (max-width: 575px) {
    .nsp-hero-points { grid-template-columns: 1fr; }
    .nsp-section { padding: 52px 0; }
    .nsp-cta { padding: 28px 22px; }
    .nsp-btn { width: 100%; justify-content: center; }
}

/* ---------- Tours ---------- */
.nsp-region-tiles { display: grid; gap: 22px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.nsp-region {
    position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 300px;
    padding: 30px; border-radius: 22px; overflow: hidden; color: #fff; text-decoration: none;
    background: var(--nsp-navy) center/cover no-repeat;
}
.nsp-region::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(8, 20, 55, .05) 20%, rgba(8, 20, 55, .9)); transition: background .2s; }
.nsp-region:hover::before { background: linear-gradient(180deg, rgba(8, 20, 55, .15) 0%, rgba(8, 20, 55, .95)); }
.nsp-region > * { position: relative; }
.nsp-region h3 { color: #fff; font-weight: 800; font-size: 1.7rem; margin: 6px 0; }
.nsp-region p { color: rgba(255, 255, 255, .85); margin: 0 0 14px; }
.nsp-region .nsp-pill { align-self: flex-start; }
.nsp-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 50px; font-size: .78rem; font-weight: 700; background: rgba(255, 255, 255, .16); color: #fff; }
.nsp-pill.red { background: var(--nsp-red); }
.nsp-pill.light { background: #fff1f1; color: var(--nsp-red); }

.nsp-toolbar { display: grid; gap: 12px; grid-template-columns: 2fr 1fr 1fr 1fr; background: #fff; border: 1px solid var(--nsp-line); border-radius: 16px; padding: 14px; margin-bottom: 26px; }
.nsp-toolbar.three { grid-template-columns: 2fr 1fr 1fr; }
.nsp-field { width: 100%; min-height: 48px; border: 1px solid var(--nsp-line); border-radius: 10px; padding: 10px 14px; font: inherit; color: var(--nsp-ink); background: #fff; }
.nsp-field:focus { outline: none; border-color: var(--nsp-red); box-shadow: 0 0 0 3px rgba(224, 0, 0, .12); }
.nsp-count { color: var(--nsp-muted); font-size: .95rem; margin-bottom: 14px; }

.nsp-tours { display: grid; gap: 24px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.nsp-tour { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--nsp-line); border-radius: 18px; overflow: hidden; text-decoration: none; color: var(--nsp-ink); transition: box-shadow .2s, transform .2s; }
.nsp-tour:hover { box-shadow: 0 18px 40px rgba(16, 24, 40, .1); transform: translateY(-3px); color: var(--nsp-ink); }
.nsp-tour-img { position: relative; aspect-ratio: 16 / 10; background: var(--nsp-soft); overflow: hidden; }
.nsp-tour-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.nsp-tour:hover .nsp-tour-img img { transform: scale(1.05); }
.nsp-tour-img .nsp-pill { position: absolute; top: 14px; left: 14px; text-transform: capitalize; }
.nsp-tour-img .nsp-days { top: auto; bottom: 14px; left: 14px; background: rgba(8, 20, 55, .85); }
.nsp-tour-body { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.nsp-tour-dest { color: var(--nsp-red); font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.nsp-tour-body h3 { font-size: 1.15rem; font-weight: 700; margin: 6px 0 8px; line-height: 1.35; color: var(--nsp-ink); }
.nsp-tour-sub { color: var(--nsp-muted); font-size: .92rem; margin: 0 0 14px; }
.nsp-tour-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--nsp-muted); font-size: .86rem; margin-bottom: 16px; }
.nsp-tour-meta i { color: var(--nsp-red); margin-right: 4px; }
.nsp-tour-foot { margin-top: auto; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; border-top: 1px dashed var(--nsp-line); padding-top: 14px; }
.nsp-price small { display: block; color: var(--nsp-muted); font-size: .76rem; }
.nsp-price strong { font-size: 1.35rem; font-weight: 800; color: var(--nsp-ink); }
.nsp-price s { color: var(--nsp-muted); font-size: .85rem; margin-left: 6px; }
.nsp-tour-cta { font-weight: 700; color: var(--nsp-red); white-space: nowrap; }
.nsp-empty { grid-column: 1 / -1; text-align: center; padding: 50px 20px; background: #fff; border: 1px dashed var(--nsp-line); border-radius: 18px; color: var(--nsp-muted); }

/* tour detail */
.nsp-detail-grid { display: grid; gap: 30px; grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
.nsp-book { position: sticky; top: 80px; background: #fff; border: 1px solid var(--nsp-line); border-radius: 18px; padding: 24px; box-shadow: 0 16px 40px rgba(16, 24, 40, .08); }
.nsp-book .nsp-btn { width: 100%; justify-content: center; margin-top: 10px; }
.nsp-day { position: relative; padding: 0 0 26px 52px; }
.nsp-day::before { content: ""; position: absolute; left: 18px; top: 40px; bottom: 0; width: 2px; background: var(--nsp-line); }
.nsp-day:last-child::before { display: none; }
.nsp-day-num { position: absolute; left: 0; top: 0; width: 38px; height: 38px; border-radius: 50%; background: var(--nsp-red); color: #fff; font-weight: 700; display: grid; place-items: center; font-size: .85rem; }
.nsp-day h3 { font-size: 1.1rem; font-weight: 700; color: var(--nsp-ink); margin: 6px 0 8px; }
.nsp-day p { color: var(--nsp-muted); margin-bottom: 10px; white-space: pre-line; }
.nsp-day-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.nsp-tag { display: inline-flex; gap: 6px; align-items: center; background: var(--nsp-soft); border-radius: 50px; padding: 5px 12px; font-size: .84rem; color: var(--nsp-ink); }
.nsp-inc { columns: 2 280px; column-gap: 24px; }
.nsp-inc-group { break-inside: avoid; background: #fff; border: 1px solid var(--nsp-line); border-radius: 14px; padding: 18px; margin-bottom: 18px; }
.nsp-inc-group h3 { font-size: 1rem; font-weight: 700; margin: 0 0 10px; color: var(--nsp-ink); }
.nsp-inc-group ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.nsp-inc-group li { display: flex; gap: 8px; color: var(--nsp-ink); font-size: .94rem; }
.nsp-inc-group li i { color: #16a34a; margin-top: 4px; }
.nsp-hotel { display: flex; gap: 16px; background: #fff; border: 1px solid var(--nsp-line); border-radius: 14px; padding: 14px; }
.nsp-hotel img { width: 110px; height: 90px; object-fit: cover; border-radius: 10px; flex: none; }
.nsp-hotel h3 { font-size: 1rem; font-weight: 700; margin: 0 0 4px; color: var(--nsp-ink); }
.nsp-hotel p { margin: 0; color: var(--nsp-muted); font-size: .88rem; }
.nsp-stars { color: #f59e0b; font-size: .8rem; }
.nsp-hotels { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }

@media (max-width: 991px) {
    .nsp-toolbar, .nsp-toolbar.three { grid-template-columns: 1fr 1fr; }
    .nsp-toolbar #tourSearch { grid-column: 1 / -1; }
    .nsp-detail-grid { grid-template-columns: 1fr; }
    .nsp-book { position: static; }
}
@media (max-width: 575px) {
    .nsp-toolbar, .nsp-toolbar.three { grid-template-columns: 1fr; }
    .nsp-tours { grid-template-columns: 1fr; }
    .nsp-hotels { grid-template-columns: 1fr; }
}

/* ---------- Verified forms (enrollment, appointment, travel) on light cards ---------- */
.nsp-vform .form-label { color: var(--nsp-ink); }
.nsp-vform .form-control,
.nsp-vform .form-select { background-color: #fff; color: var(--nsp-ink); border: 1px solid #d6dbe6; min-height: 46px; }
.nsp-vform .form-control:focus,
.nsp-vform .form-select:focus { border-color: var(--nsp-red); box-shadow: 0 0 0 3px rgba(224, 0, 0, .12); }
.nsp-vform .form-select option { color: var(--nsp-ink); background: #fff; }
.nsp-vform small.text-muted { color: var(--nsp-muted) !important; }
#enrollModal .modal-content { border-radius: 18px; }