/* ============================================================
   visa-country.css
   Destination To Plan | destinationtoplan.com
   Universal shared stylesheet for all country visa hub pages
   (non-Schengen: Australia, UK, Canada, Japan, UAE, etc.)

   Parallel to schengen-visa.css — same component library,
   neutral of any single country's visa system.

   Load via:
     $extra_css_files = [
         '/css/style.css',
         '/css/visa-country.css',
         '/css/country-visa.css',   ← country-specific additions
     ];

   Critical above-the-fold CSS (hero, quick-nav, :root, body)
   remains in $critical_css inline in each visa page for LCP.
   ============================================================ */

/* ============================================================
   WRAPPER
   ============================================================ */
.vp-wrap { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
@media (max-width: 600px) { .vp-wrap { padding: 0 12px; } }

/* ============================================================
   2026 UPDATES BAR
   ============================================================ */
.updates-2026-bar { background: #fff; border-bottom: 1px solid var(--border); padding: 18px 0; }
.updates-2026-header { display: flex; align-items: center; justify-content: center; gap: 8px; margin-bottom: 14px; }
@media (max-width: 768px) {
    .updates-2026-header { gap: 8px !important; flex-wrap: nowrap !important; }
    .updates-2026-header > div:first-child { width: 22px !important; height: 22px !important; }
    .updates-2026-header > div:first-child svg { width: 11px !important; height: 11px !important; }
    .updates-2026-header strong { font-size: 0.78rem !important; white-space: nowrap; }
    .updates-2026-header span { font-size: 0.6rem !important; padding: 2px 7px !important; white-space: nowrap; flex-shrink: 0; }
}
.updates-2026-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; }
.u26-card { border-radius: 10px; padding: 12px 15px; display: flex; gap: 10px; align-items: flex-start; }
.u26-icon { width: 28px; height: 28px; border-radius: 7px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.u26-title { font-size: 0.78rem; font-weight: 700; margin-bottom: 3px; }
.u26-text  { font-size: 0.77rem; line-height: 1.6; }
.u26-card.green { background: #ECFDF5; border: 1px solid #A7F3D0; }
.u26-card.green .u26-icon  { background: #059669; }
.u26-card.green .u26-title { color: #059669; }
.u26-card.green .u26-text  { color: #065F46; }
.u26-card.blue  { background: #E6F1FB; border: 1px solid #B5D4F4; }
.u26-card.blue  .u26-icon  { background: #002395; }
.u26-card.blue  .u26-title { color: #0C447C; }
.u26-card.blue  .u26-text  { color: #185FA5; }
.u26-card.amber { background: #FAEEDA; border: 1px solid #c8a96e; }
.u26-card.amber .u26-icon  { background: #c8a96e; }
.u26-card.amber .u26-title { color: #854F0B; }
.u26-card.amber .u26-text  { color: #633806; }
.u26-card.dark  { background: #F0F3FA; border: 1px solid var(--border); }
.u26-card.dark  .u26-icon  { background: #1a1a2e; }
.u26-card.dark  .u26-title { color: #1a1a2e; }
.u26-card.dark  .u26-text  { color: var(--text-secondary); }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn {
    display: inline-flex; align-items: center; justify-content: center;
    gap: 7px; padding: 11px 26px; border: none; border-radius: var(--radius-sm);
    font-size: 0.88rem; font-weight: 600; font-family: inherit;
    cursor: pointer; text-decoration: none; white-space: nowrap; transition: opacity 0.18s;
}
.btn:hover   { opacity: 0.88; }
.btn-primary { background: #c8a96e; color: #ffffff; }
.btn-ghost   { background: transparent; color: var(--text-secondary); border: 1px solid var(--border); }
.btn-primary.btn-apply-now {
    width: auto; max-width: 100%; box-sizing: border-box;
    white-space: normal; text-align: center; word-break: break-word; padding: 11px 20px;
    background: #07090e !important;
    color: #ffffff !important;
    border: 1px solid #c8a96e !important;
}
.btn-primary.btn-apply-now svg { stroke: #c8a96e; }
.btn-primary.btn-apply-now:hover { background: #1a1a2e !important; }
@media (max-width: 480px) {
    .btn { width: 100%; max-width: 320px; }
    .btn-primary.btn-apply-now { width: 100%; max-width: 100%; padding: 13px 16px; font-size: 0.84rem; }
}

/* ============================================================
   LAYOUT
   ============================================================ */
.results-section { display: block; }
.content-section { margin-bottom: 36px; }

/* ============================================================
   SECTION HEADER
   ============================================================ */
.sec-head  { margin-bottom: 18px; text-align: center; }
.sec-title { font-size: clamp(1.05rem, 2.5vw, 1.35rem); font-weight: 700; color: var(--text-primary); line-height: 1.3; }
.sec-sub   { font-size: 0.83rem; color: var(--text-muted); margin-top: 5px; line-height: 1.55; }

/* ============================================================
   CARDS BASE
   ============================================================ */
.card { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 26px; box-shadow: var(--shadow-md); }
.card p, .card li { color: var(--text-secondary); font-size: 0.9rem; line-height: 1.8; text-align: justify; hyphens: auto; text-align-last: left; }

/* ============================================================
   ABOUT VISA
   ============================================================ */
.about-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
@media (max-width: 768px) { .about-layout { grid-template-columns: 1fr; } }
.about-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; justify-content: center; }
@media (min-width: 992px) {
    .about-chips { flex-wrap: nowrap; justify-content: flex-start; }
}
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 13px; border-radius: 9999px; font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; white-space: nowrap; }
.chip-blue  { background: #FAEEDA; color: #854F0B; border: 1px solid #c8a96e; }
.chip-cream { background: #FAF6EE; color: #6B5530; border: 1px solid #e8d9c0; }
.chip-dark  { background: rgba(26,26,46,0.08); color: var(--dark); }
.about-desc h2, .about-desc h3 { font-size: 1.15rem; font-weight: 800; color: var(--text-primary); margin-bottom: 12px; line-height: 1.35; }
.about-desc p { font-size: 0.9rem; color: var(--text-secondary); line-height: 1.8; margin-bottom: 14px; text-align: justify; hyphens: auto; text-align-last: left; }
.about-desc p:last-child { margin-bottom: 0; }
.facts-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.fact-card  { background: #FAF6EE; border: none; border-radius: var(--radius-md); padding: 22px 18px; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.fact-icon  { width: 48px; height: 48px; background: #c8a96e; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 14px; flex-shrink: 0; }
.fact-value { font-size: 1.9rem; font-weight: 800; color: var(--text-primary); line-height: 1.1; }
.fact-label { font-size: 0.68rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; margin-top: 6px; }
.about-who  { margin-top: 22px; padding: 18px 22px; background: #FAF6EE; border: 1px solid #e8d9c0; border-radius: var(--radius-md); }
.about-who h4 { font-size: 0.88rem; font-weight: 700; color: var(--text-primary); margin-bottom: 10px; display: flex; align-items: center; justify-content: center; gap: 8px; text-align: center; }
.about-who ul { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 5px 16px; }
.about-who ul li { font-size: 0.84rem; color: var(--text-secondary); padding-left: 15px; position: relative; line-height: 1.7; }
.about-who ul li::before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; background: #a8894e; border-radius: 50%; }
@media (max-width: 600px) { .about-who ul { grid-template-columns: 1fr; } }

/* ============================================================
   PROCESSING TIME
   ============================================================ */
.proc-highlight { display: flex; align-items: center; gap: 24px; padding: 20px 22px; background: #ffffff; border-radius: var(--radius-sm); border: 1px solid var(--border); margin-bottom: 20px; }
@media (max-width: 600px) { .proc-highlight { flex-direction: column; text-align: center; gap: 10px; } }
.proc-days       { display: flex; flex-direction: column; align-items: center; flex-shrink: 0; line-height: 1; }
.proc-days-num   { font-size: 2.4rem; font-weight: 800; color: var(--text-primary); line-height: 1; white-space: nowrap; text-align: center; }
.proc-days-label { font-size: 0.82rem; font-weight: 600; color: var(--text-secondary); margin-top: 4px; white-space: nowrap; }
.proc-note       { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.7; text-align: justify; hyphens: auto; text-align-last: left; }

/* ============================================================
   TABLES
   ============================================================ */
.table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius-md); border: 1px solid var(--border); }
.mobile-cards { display: none; }
@media (max-width: 640px) { .table-wrap { display: none; } .opt-table-wrap { display: none; } .mobile-cards { display: flex; flex-direction: column; gap: 10px; } }
.m-card      { background: var(--bg-white); border-radius: var(--radius-md); box-shadow: 0 2px 10px rgba(0,35,149,0.08); overflow: hidden; }
.m-card-head { background: #a8894e; color: #fff; padding: 10px 14px; font-size: 0.88rem; font-weight: 700; }
.m-card-row  { display: flex; align-items: flex-start; gap: 8px; padding: 9px 14px; border-bottom: 1px solid var(--border); font-size: 0.83rem; }
.m-card-row:last-child { border-bottom: none; }
.m-card-label { font-weight: 600; color: var(--text-primary); min-width: 80px; flex-shrink: 0; }
.m-card-val   { color: var(--text-secondary); line-height: 1.55; }
.m-badge       { display: inline-block; padding: 3px 10px; border-radius: 9999px; font-size: 0.72rem; font-weight: 700; }
.m-badge-blue  { background: var(--primary-light); color: var(--primary); border: 1px solid rgba(0,35,149,0.2); }
.m-badge-dark  { background: rgba(26,26,46,0.08); color: var(--dark); border: 1px solid rgba(26,26,46,0.15); }
.m-fee         { font-weight: 700; color: var(--primary); }
.data-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 0.85rem; }
.data-table thead tr { background: linear-gradient(135deg, #c8a96e 0%, #a8894e 100%); color: #fff; }
.data-table thead th { padding: 12px 15px; text-align: center; font-size: 0.79rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.data-table tbody tr:nth-child(even) { background: #ffffff; }
.data-table tbody tr:hover           { background: #FAF6EE; }
.data-table tbody td { padding: 11px 15px; color: var(--text-secondary); border-bottom: 1px solid var(--border); vertical-align: middle; text-align: center; }
.data-table tbody td:first-child { font-weight: 600; color: var(--text-primary); }
.t-badge         { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 9999px; font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.t-badge-primary { background: #F1EFE8; color: #5F5E5A; border: 1px solid #D3D1C7; }
.t-badge-dark    { background: rgba(26,26,46,0.08); color: var(--dark); border: 1px solid rgba(26,26,46,0.15); }
.table-note { font-size: 0.8rem; color: var(--text-secondary); margin: 12px 0 0; padding: 12px 16px; background: #FAEEDA; border: 1px solid #FAC775; border-radius: var(--radius-md); display: block; width: 100%; box-sizing: border-box; text-align: center; }
.table-note-inner  { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.table-note-header { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; }
.table-note-label  { color: #854F0B; font-weight: 700; font-size: 0.82rem; }
.table-note-body   { width: 100%; text-align: center; font-size: 0.8rem; color: #633806; line-height: 1.65; }
@media (max-width: 640px) { .proc-col-3 { display: none; } }

/* ============================================================
   TRENDS / INFO BOX
   ============================================================ */
.trends-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
@media (max-width: 600px) { .trends-grid { grid-template-columns: 1fr; } }
.trend-card    { padding: 18px 20px; border-radius: var(--radius-md); background: var(--bg-white); box-shadow: 0 2px 12px rgba(0,35,149,0.08); border: 0.5px solid var(--border); }
.trend-months  { font-size: 0.76rem; font-weight: 700; letter-spacing: 0.04em; margin-bottom: 5px; }
.trend-card h4 { font-size: 0.9rem; font-weight: 700; margin-bottom: 8px; color: var(--text-primary); }
.trend-card p  { font-size: 0.84rem; color: var(--text-secondary); line-height: 1.7; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }
.info-box      { display: flex; flex-direction: column; gap: 8px; padding: 18px 22px; background: var(--primary-light); border: 1px solid rgba(0,35,149,0.2); border-radius: var(--radius-md); }
.info-box-head { display: flex; align-items: center; justify-content: center; gap: 8px; }
.info-box strong { display: inline; font-size: 0.9rem; color: var(--primary); font-weight: 700; }
.info-box p { font-size: 0.84rem; color: var(--text-secondary); line-height: 1.75; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }
.info-box p strong { display: inline; color: var(--text-primary); font-size: inherit; }
.info-box a { color: var(--primary); text-decoration: underline; }

/* ============================================================
   REQUIREMENTS
   ============================================================ */
.req-wrapper  { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); overflow: hidden; padding: 0; }
.req-cat-head { background: linear-gradient(135deg, #c8a96e 0%, #a8894e 100%); color: #ffffff; padding: 14px 22px; font-size: 0.95rem; font-weight: 700; border-radius: 0; margin: 0; }
.req-wrapper .req-cat-head:first-child { border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
.req-list + .req-cat-head { margin-top: 8px; border-top: 1px solid var(--border); }
.req-list { list-style: none; padding: 12px 14px; }
.req-list li { padding: 12px 14px; margin-bottom: 6px; background: var(--bg-white); border-radius: var(--radius-sm); box-shadow: 0 2px 8px rgba(0,35,149,0.07); font-size: 0.87rem; color: var(--text-secondary); line-height: 1.72; text-align: justify; hyphens: auto; text-align-last: left; }
.req-list li:last-child { margin-bottom: 0; }
.req-list li strong { color: var(--text-primary); }
.req-num { display: inline-flex; align-items: center; justify-content: center; width: 21px; height: 21px; background: #a8894e; color: #fff; border-radius: 50%; font-size: 0.68rem; font-weight: 700; margin-right: 8px; vertical-align: middle; flex-shrink: 0; }

/* ============================================================
   WHAT TO BRING
   ============================================================ */
.bring-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 600px) { .bring-grid { grid-template-columns: 1fr; } }
.bring-card { display: flex; align-items: flex-start; gap: 14px; background: var(--bg-white); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 16px; }
.bring-icon { width: 42px; height: 42px; background: #c8a96e; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.bring-text h5 { font-size: 0.87rem; font-weight: 700; color: var(--text-primary); margin-bottom: 5px; }
.bring-text p  { font-size: 0.78rem; color: var(--text-secondary); line-height: 1.6; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }
.bring-dont      { margin-top: 20px; border-radius: var(--radius-md); box-shadow: 0 2px 12px rgba(0,35,149,0.08); overflow: hidden; }
.bring-dont-head { background: #1a1a2e; padding: 13px 20px; font-size: 0.82rem; font-weight: 700; color: #ffffff; display: flex; align-items: center; justify-content: center; gap: 9px; text-align: center; letter-spacing: 0.06em; text-transform: uppercase; }
.bring-dont-head svg { flex-shrink: 0; }
.bring-dont-head-text { text-align: center; }
.bring-dont-cols { display: grid; grid-template-columns: 1fr; }
.bring-dont-col  { background: #ffffff; padding: 10px 24px; }
.bring-dont-col:first-child { border-right: none; border-bottom: 1px solid #FEE2E2; }
.bring-dont-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; }
.bring-dont-col ul li { font-size: 0.84rem; color: #7B1020; font-weight: 500; line-height: 1.5; display: flex; align-items: center; gap: 10px; padding: 10px 4px; border-bottom: 1px solid #FEE2E2; text-align: left; }
.bring-dont-col ul li:last-child { border-bottom: none; }
.bring-dont-col ul li::before { content: ''; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; min-width: 22px; background: #C0152A; border-radius: 50%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: center; flex-shrink: 0; }

/* ============================================================
   STEPS TIMELINE
   ============================================================ */
.steps-timeline { display: flex; flex-direction: column; gap: 12px; }
.step-item { display: flex; align-items: stretch; position: relative; }
.step-item:not(:last-child)::after { content: ''; position: absolute; left: 22px; top: 46px; bottom: -12px; width: 2px; background: linear-gradient(to bottom, #c8a96e, #a8894e); z-index: 0; }
.step-dot  { width: 44px; height: 44px; min-width: 44px; border-radius: 50%; background: #a8894e; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 0.88rem; font-weight: 800; flex-shrink: 0; box-shadow: 0 3px 10px rgba(168,137,78,0.25); position: relative; z-index: 1; align-self: flex-start; margin-top: 10px; }
.step-body { flex: 1; background: var(--bg-white); border-radius: var(--radius-md); padding: 16px 20px; margin-left: 14px; box-shadow: 0 2px 12px rgba(0,35,149,0.08); }
.step-body h4 { font-size: 0.97rem; font-weight: 700; color: var(--text-primary); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.step-tag  { font-size: 0.63rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; padding: 3px 9px; border-radius: 9999px; background: #FAF6EE; color: #6B5530; border: 1px solid #e8d9c0; white-space: nowrap; }
.step-body p { font-size: 0.87rem; color: var(--text-secondary); line-height: 1.77; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }
.step-body p strong { color: var(--text-primary); }
.steps-cta { text-align: center; margin-top: 26px; }
@media (max-width: 480px) { .step-dot { width: 36px; min-width: 36px; height: 36px; font-size: 0.78rem; margin-top: 12px; } .step-item:not(:last-child)::after { left: 17px; top: 50px; } .step-body { padding: 13px 14px; margin-left: 12px; } }

/* ============================================================
   AT THE CENTRE GRID
   ============================================================ */
.centre-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 900px) { .centre-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .centre-grid { grid-template-columns: 1fr; } }
.centre-card      { background: var(--bg-white); border: 0.5px solid var(--border); border-radius: var(--radius-md); padding: 18px 16px; }
.centre-card-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.centre-num  { width: 30px; height: 30px; min-width: 30px; background: #c8a96e; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.78rem; font-weight: 800; flex-shrink: 0; }
.centre-card h4 { font-size: 0.9rem; font-weight: 700; color: var(--text-primary); margin: 0; }
.centre-card p  { font-size: 0.82rem; color: var(--text-secondary); line-height: 1.72; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }
.duration-note   { margin-top: 18px; padding: 14px 18px; background: #FAEEDA; border: 1px solid #c8a96e; border-radius: var(--radius-sm); display: flex; align-items: flex-start; gap: 10px; }
.duration-note h4 { font-size: 0.88rem; font-weight: 700; color: #854F0B; margin-bottom: 6px; }
.duration-note p  { font-size: 0.84rem; color: #633806; line-height: 1.7; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }

/* ============================================================
   FEES
   ============================================================ */
.fee-info   { background: var(--primary-light); border: 1px solid rgba(0,35,149,0.18); border-radius: var(--radius-md); padding: 16px 20px; margin-top: 14px; }
.fee-info h4 { font-size: 0.88rem; font-weight: 700; color: var(--primary); margin-bottom: 6px; }
.fee-info p  { font-size: 0.84rem; color: var(--text-secondary); line-height: 1.72; margin: 0; text-align: justify; hyphens: auto; text-align-last: left; }
.fee-info p strong { color: var(--text-primary); }
.consular-fee-wrap   { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; margin-bottom: 16px; }
.consular-fee-header { background: #07090e; padding: 12px 20px; display: flex; align-items: center; justify-content: flex-start; gap: 10px; }
.consular-fee-header svg  { flex-shrink: 0; width: 16px; height: 16px; }
.consular-fee-header span { font-size: 0.78rem; font-weight: 700; color: #c8a96e; text-transform: uppercase; letter-spacing: 0.07em; line-height: 1.3; }
.consular-fee-grid { display: grid; grid-template-columns: 1fr 1fr; background: #FAEEDA; }
.consular-fee-cell  { padding: 20px 12px; text-align: center; border-right: 1px solid rgba(200,169,110,0.3); display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.consular-fee-cell:last-child { border-right: none; }
.consular-fee-label { font-size: 0.74rem; color: #854F0B; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; min-height: 2.5em; display: flex; align-items: center; justify-content: center; text-align: center; line-height: 1.3; }
.consular-fee-value { font-size: 1.9rem; font-weight: 800; color: #633806; line-height: 1.1; }
@media (max-width: 400px) { .consular-fee-value { font-size: 1.5rem; } .consular-fee-cell { padding: 16px 8px; } }
.addons-head    { text-align: center; margin: 24px 0 4px; font-size: 1rem; font-weight: 700; color: var(--text-primary); }
.addons-sub     { text-align: justify; hyphens: auto; text-align-last: center; font-size: 0.81rem; color: var(--text-muted); margin-bottom: 14px; line-height: 1.55; padding: 0 4px; }
.addons-divider { border: 0; border-top: 1px solid var(--border); margin: 22px 0; }
.opt-table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--radius-md); border: 1px solid var(--border); }
.opt-table { width: 100%; min-width: 460px; border-collapse: collapse; font-size: 0.86rem; }
.opt-table thead tr { background: linear-gradient(135deg, #c8a96e 0%, #a8894e 100%); color: #fff; }
.opt-table thead th { padding: 12px 15px; text-align: left; font-size: 0.79rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.opt-table thead th:last-child { text-align: right; }
.opt-table tbody tr:nth-child(even) { background: #ffffff; }
.opt-table tbody tr:hover { background: #FAF6EE; }
.opt-table tbody td { padding: 11px 15px; font-size: 0.86rem; color: var(--text-secondary); border-bottom: 1px solid var(--border); vertical-align: middle; }
.opt-table tbody td:first-child { font-weight: 600; color: var(--text-primary); }
.opt-table tbody td:last-child { text-align: right; font-weight: 700; color: #854F0B; white-space: nowrap; }
.svc-wrap { position: relative; display: inline-flex; align-items: center; }
.svc-btn  { display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; background: var(--dark); color: #fff; border-radius: 50%; font-size: 0.63rem; font-weight: 700; cursor: pointer; margin-left: 5px; border: none; flex-shrink: 0; }
.svc-tip  { display: none !important; }
#svc-tip-portal { position: fixed; z-index: 999999; background: var(--dark); color: #fff; font-size: 0.82rem; line-height: 1.65; padding: 14px 16px; border-radius: var(--radius-md); width: 300px; max-width: calc(100vw - 24px); box-shadow: 0 8px 32px rgba(0,0,0,0.35); pointer-events: auto; white-space: normal; display: none; border: 1px solid rgba(255,255,255,0.08); text-align: justify; hyphens: auto; }
#svc-tip-portal strong:has(+ br) { display: block; text-align: center; font-weight: 700; margin-bottom: 8px; }
#svc-tip-portal strong:has(+ br) + br,
#svc-tip-portal strong:has(+ br) + br + br { display: none; }
#svc-tip-portal.visible { display: block; }
#svc-tip-portal::before { content: ''; position: absolute; bottom: 100%; left: 20px; border: 7px solid transparent; border-bottom-color: var(--dark); }
.nonrefund-box      { background: #FFF5F5; border: 1px solid #FECACA; border-radius: var(--radius-sm); padding: 12px 16px; margin-top: 12px; }
.nonrefund-box-head { display: flex; align-items: center; justify-content: center; gap: 6px; margin-bottom: 6px; }
.nonrefund-box-head svg { flex-shrink: 0; }
.nonrefund-label { color: #C0152A; font-weight: 700; font-size: 0.84rem; }
.nonrefund-body  { font-size: 0.84rem; color: #7B1020; line-height: 1.65; text-align: justify; hyphens: auto; text-align-last: left; }
.nonrefund-body strong { color: #C0152A; }

/* ============================================================
   REJECTION / APPROVAL
   ============================================================ */
.rejection-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }
@media (max-width: 640px) { .rejection-cols { grid-template-columns: 1fr; } }
.rej-col { border-radius: var(--radius-md); padding: 18px 20px; box-shadow: 0 2px 12px rgba(0,35,149,0.08); }
.rej-col.bad  { background: #FFF0F0; }
.rej-col.good { background: #ECFDF5; }
.rej-col h4   { font-size: 0.93rem; font-weight: 700; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid rgba(0,0,0,0.07); }
.rej-col.bad  h4 { color: #B91C1C; }
.rej-col.good h4 { color: #065F46; }
.rej-col ul   { list-style: none; padding: 0; margin: 0; }
.rej-col ul li { font-size: 0.85rem; line-height: 1.72; padding-left: 20px; position: relative; margin-bottom: 6px; text-align: justify; hyphens: auto; text-align-last: left; }
.rej-col.bad  ul li { color: #7F1D1D; }
.rej-col.good ul li { color: #065F46; }
.rej-col.bad  ul li::before { content: '✕'; position: absolute; left: 0; color: #DC2626; font-weight: 700; font-size: 0.73rem; top: 4px; }
.rej-col.good ul li::before { content: '✓'; position: absolute; left: 0; color: #059669; font-weight: 700; top: 2px; }
.finance-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 16px 0; }
@media (max-width: 768px) { .finance-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .finance-grid { grid-template-columns: 1fr; } }
.fin-card   { background: #FAEEDA; border: 1px solid #c8a96e; border-radius: var(--radius-md); padding: 15px 14px; text-align: center; }
.fin-label  { font-size: 0.74rem; font-weight: 600; color: #854F0B; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 8px; }
.fin-amount { font-size: 1.1rem; font-weight: 800; color: #633806; line-height: 1.2; }
.fin-note   { font-size: 0.74rem; color: #854F0B; margin-top: 4px; }
.mindset-box    { background: var(--bg-white); border-radius: var(--radius-md); padding: 18px 22px; margin-top: 16px; box-shadow: 0 2px 12px rgba(0,35,149,0.08); }
.mindset-box h4 { font-size: 0.9rem; font-weight: 700; color: #a8894e; margin-bottom: 10px; }
.mindset-box p  { font-size: 0.85rem; color: var(--text-secondary); line-height: 1.77; margin-bottom: 8px; text-align: justify; hyphens: auto; text-align-last: left; }
.mindset-box p:last-child { margin-bottom: 0; }
.mindset-box strong { color: var(--text-primary); }
.alert-card { border-radius: var(--radius-md); padding: 15px 18px; background: var(--bg-white); box-shadow: 0 2px 12px rgba(0,35,149,0.08); margin-bottom: 16px; }
.alert-card.dark { background: #1a1a2e; }
.alert-card.dark h5 { color: #c8a96e; }
.alert-card.dark ul li { color: rgba(255,255,255,0.75); }
.alert-card.dark ul li strong { color: #ffffff; }
.alert-card h5  { font-size: 0.87rem; font-weight: 700; margin-bottom: 8px; color: var(--text-primary); }
.alert-card ul  { list-style: none; padding: 0; margin: 0; }
.alert-card ul li { font-size: 0.83rem; line-height: 1.7; padding-left: 14px; position: relative; margin-bottom: 4px; color: var(--text-secondary); text-align: justify; hyphens: auto; text-align-last: left; }
.alert-card ul li::before { content: '•'; position: absolute; left: 0; font-weight: 700; color: #a8894e; }
.alert-card ul li strong { color: var(--text-primary); }

/* ============================================================
   LEGAL ELIGIBILITY
   ============================================================ */
.two-col-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
@media (max-width: 640px) { .two-col-cards { grid-template-columns: 1fr; } }
.mini-card    { background: var(--bg-white); border-radius: var(--radius-md); padding: 15px 17px; box-shadow: 0 2px 12px rgba(0,0,0,0.04); }
.mini-card h5 { font-size: 0.87rem; font-weight: 700; color: #a8894e; margin-bottom: 10px; }
.mini-card ul { list-style: none; padding: 0; margin: 0; }
.mini-card ul li { font-size: 0.82rem; color: var(--text-secondary); padding-left: 16px; position: relative; margin-bottom: 6px; line-height: 1.7; text-align: justify; hyphens: auto; text-align-last: left; }
.mini-card ul li::before { content: '•'; position: absolute; left: 0; color: #a8894e; font-weight: 700; }
.mini-card ul li.check::before { content: '✓'; color: #a8894e; }
.legal-three-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin: 16px 0; }
@media (max-width: 767px) { .legal-three-grid { grid-template-columns: 1fr; } }

/* ============================================================
   VAC CARDS
   ============================================================ */
.vac-grid { display: flex; flex-wrap: wrap; gap: 18px; justify-content: center; }
.vac-card { background: var(--bg-white); border: 2px solid #e8d9c0; border-radius: var(--radius-lg); padding: 0; box-shadow: var(--shadow-md); width: calc(33.333% - 12px); min-width: 280px; display: flex; flex-direction: column; overflow: hidden; }
@media (max-width: 1024px) { .vac-card { width: calc(50% - 10px); } }
@media (max-width: 640px)  { .vac-card { width: 100%; min-width: unset; } }
.vac-card h4 { font-size: 0.97rem; font-weight: 700; color: #fff; margin: 0; padding: 14px 20px; background: #c8a96e; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center; text-align: center; }
.vac-card-body { padding: 0 20px 20px; display: flex; flex-direction: column; flex: 1; }
.vac-badge { font-size: 0.59rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; background: rgba(255,255,255,0.25); color: #fff; padding: 3px 8px; border-radius: 9999px; border: 1px solid rgba(255,255,255,0.4); }
.vac-timing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 12px 0 10px; }
.vac-timing-cell { background: #FAF6EE; border: 1px solid #e8d9c0; border-radius: 8px; padding: 7px 10px; display: flex; align-items: center; justify-content: center; gap: 7px; }
.vac-timing-icon  { width: 24px; height: 24px; background: #a8894e; border-radius: 6px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.vac-timing-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #854F0B; }
.vac-timing-val   { font-size: 11px; font-weight: 600; color: #4a3a1f; }
.vac-timing-cell > div:not(.vac-timing-icon) { text-align: center; }
.vac-detail { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 7px; font-size: 0.84rem; }
.vac-detail:last-child { margin-bottom: 0; }
.vac-label { min-width: 52px; font-weight: 600; color: var(--text-primary); flex-shrink: 0; }
.vac-value { color: var(--text-secondary); }
.vac-value a { color: #a8894e; text-decoration: none; word-break: break-all; }
.vac-value a:hover { text-decoration: underline; }
.vac-map    { margin-top: auto; overflow: hidden; height: 180px; flex-shrink: 0; }
.vac-map iframe { width: 100%; height: 100%; border: 0; display: block; }
.vac-card-footer { background: #FAF6EE; border-top: 1px solid #e8d9c0; padding: 0; text-align: center; }
.vac-card-footer a { display: flex; align-items: center; justify-content: center; gap: 6px; background: #07090e; color: #ffffff; font-size: 0.78rem; font-weight: 700; text-decoration: none; padding: 13px 16px; border-radius: 0; border: none; border-top: 1px solid #c8a96e; width: 100%; box-sizing: border-box; letter-spacing: 0.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background 0.18s; }
.vac-card-footer a:hover { background: #1a1a2e; text-decoration: none; }

/* ============================================================
   EMBASSY CARDS
   ============================================================ */
.embassy-grid { display: flex; flex-wrap: wrap; gap: 18px; justify-content: center; }
.embassy-card { background: var(--bg-white); border: 2px solid #e8d9c0; border-radius: var(--radius-lg); padding: 0; box-shadow: var(--shadow-md); width: calc(33.333% - 12px); min-width: 280px; display: flex; flex-direction: column; overflow: hidden; }
@media (max-width: 1024px) { .embassy-card { width: calc(50% - 10px); } }
@media (max-width: 640px)  { .embassy-card { width: 100%; min-width: unset; } }
.embassy-card h4 { font-size: 0.97rem; font-weight: 700; color: #fff; margin: 0; padding: 14px 20px; background: #c8a96e; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center; text-align: center; min-height: 76px; }
.embassy-card-body { padding: 0 20px 20px; display: flex; flex-direction: column; flex: 1; }
.embassy-timing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin: 12px 0 10px; }
.embassy-timing-cell { background: #FAF6EE; border: 1px solid #e8d9c0; border-radius: 8px; padding: 7px 10px; display: flex; align-items: center; justify-content: center; gap: 7px; }
.embassy-timing-icon  { width: 24px; height: 24px; background: #a8894e; border-radius: 6px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.embassy-timing-label { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #854F0B; }
.embassy-timing-val   { font-size: 11px; font-weight: 600; color: #4a3a1f; }
.embassy-timing-cell > div:not(.embassy-timing-icon) { text-align: center; }
.em-detail { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 7px; font-size: 0.84rem; }
.em-detail:last-child { margin-bottom: 0; }
.em-label { min-width: 52px; font-weight: 600; color: var(--text-primary); flex-shrink: 0; }
.em-value { color: var(--text-secondary); }
.em-value a { color: #a8894e; text-decoration: none; word-break: break-all; }
.em-value a:hover { text-decoration: underline; }
.em-map    { margin-top: auto; overflow: hidden; height: 180px; flex-shrink: 0; }
.em-map iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ============================================================
   APPOINTMENT / SUBMISSION TIMING BOXES
   ============================================================ */
.slots-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-bottom: 18px; }
@media (max-width: 768px) { .slots-grid { grid-template-columns: repeat(2, 1fr); } }
.slot-time { font-size: 0.81rem; color: #4a3a1f; padding: 5px 0; border-bottom: 1px dashed var(--border); font-variant-numeric: tabular-nums; text-align: center; }
.slot-time:last-child { border-bottom: none; }
.slots-note    { background: #FFFBEB; border: 1px solid #FDE68A; border-radius: var(--radius-sm); padding: 14px 16px; margin-top: 14px; }
.slots-note p  { font-size: 0.84rem; color: #78350F; line-height: 1.7; margin-bottom: 6px; }
.slots-note p:last-child { margin-bottom: 0; }

/* ============================================================
   FAQ
   ============================================================ */
.faq-list { display: flex; flex-direction: column; gap: 9px; }
.faq-item { background: var(--bg-white); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.faq-q    { padding: 15px 18px; display: flex; align-items: flex-start; gap: 11px; }
.faq-num  { width: 27px; height: 27px; min-width: 27px; background: #a8894e; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.73rem; font-weight: 700; }
.faq-q-text { font-size: 0.91rem; font-weight: 600; color: var(--text-primary); line-height: 1.5; }
.faq-a { padding: 13px 18px 15px 56px; font-size: 0.87rem; color: var(--text-secondary); line-height: 1.8; border-top: 1px solid var(--border); text-align: justify; hyphens: auto; text-align-last: left; }
@media (max-width: 480px) { .faq-a { padding-left: 18px; } }

/* ============================================================
   SEO CARD
   ============================================================ */
.seo-card-heading-box { display: block; border: none; border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding: 16px 30px; text-align: center; margin: -24px -30px 22px -30px; background: linear-gradient(135deg, #c8a96e 0%, #a8894e 100%); box-shadow: none; }
.seo-card { border: 1px solid #e8d9c0; box-shadow: 0 2px 16px rgba(0,0,0,0.04); overflow: hidden; padding: 24px 30px; }
.seo-card-heading-box h2 { font-size: clamp(1.05rem, 2.5vw, 1.3rem); font-weight: 700; color: #ffffff; margin: 0; line-height: 1.4; }
.seo-card h3 { font-size: 1.05rem; font-weight: 700; color: #a8894e; margin: 22px 0 9px; padding-left: 13px; border-left: 4px solid #a8894e; }
.seo-card p  { font-size: 0.9rem; color: var(--text-secondary); line-height: 1.85; margin-bottom: 10px; text-align: justify; hyphens: auto; text-align-last: left; }
.seo-card p strong { color: var(--text-primary); }
.seo-card ul { margin: 0 0 12px; list-style: none; padding: 0; }
.seo-card li { position: relative; padding-left: 16px; margin-bottom: 7px; font-size: 0.9rem; color: var(--text-secondary); line-height: 1.72; text-align: justify; hyphens: auto; text-align-last: left; }
.seo-card li::before { content: ''; position: absolute; left: 0; top: 10px; width: 5px; height: 5px; background: var(--primary); border-radius: 50%; }

/* ============================================================
   BOOKING FORM OVERRIDES
   ============================================================ */
.booking-page-wrap .booking-grid { min-height: 500px; grid-template-columns: 1fr 1fr !important; }
.booking-page-wrap .booking-info { padding: 48px 36px 48px 60px !important; }
@media (max-width: 768px) { .booking-page-wrap .booking-grid { grid-template-columns: 1fr !important; } .booking-page-wrap .booking-info { padding: 32px 24px !important; } }
.vsc-section { margin-bottom: 0; }
.booking-page-wrap { margin-top: 0; }
.booking-page-wrap .booking-section { padding: 60px 0; }

/* ============================================================
   TRANSIT VISA — banner + two-column yes/no cards
   ============================================================ */
.transit-update-banner { background: #07090e; padding: 13px 18px; border-radius: var(--radius-md); display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.tub-icon { width: 36px; height: 36px; background: rgba(255,255,255,0.15); border-radius: 9px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 2px; }
.tub-tag  { font-size: 0.82rem; font-weight: 700; color: #6ee7b7; margin-bottom: 6px; text-transform: uppercase; letter-spacing: 0.07em; }
.transit-update-banner p { font-size: 0.9rem; color: rgba(255,255,255,0.92); line-height: 1.75; margin: 0; }
.transit-update-banner p strong { color: #fff; }
.transit-update-banner p a { color: #c8a96e; text-decoration: underline; }
.transit-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
@media (max-width: 640px) { .transit-two-col { grid-template-columns: 1fr; } }

/* ============================================================
   TRANSIT SCENARIOS GRID
   ============================================================ */
.scenarios-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; margin: 14px 0; }
@media (max-width: 768px) { .scenarios-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .scenarios-grid { grid-template-columns: 1fr; } }
.scenario      { border-radius: var(--radius-md); padding: 12px 14px; font-size: 0.84rem; line-height: 1.68; box-shadow: 0 2px 12px rgba(0,0,0,0.04); }
.scenario.ok   { background: #ECFDF5; color: var(--text-secondary); }
.scenario.warn { background: #FFF0F0; color: var(--text-secondary); }
.sc-label { font-weight: 700; font-size: 0.73rem; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 5px; display: flex; align-items: center; gap: 5px; }
.scenario.ok   .sc-label { color: #059669; }
.scenario.warn .sc-label { color: #DC2626; }

/* ============================================================
   JURISDICTION DARK GRID
   ============================================================ */
.jurisdiction-dark-wrap { background: #07090e; border-radius: 16px; padding: 20px; position: relative; overflow: hidden; }
.jurisdiction-dark-wrap::before { content: ''; position: absolute; top: 0; left: 8%; right: 8%; height: 1px; background: linear-gradient(90deg, transparent, rgba(200,169,110,0.5), transparent); }
.jurisdiction-dark-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; align-items: stretch; }
@media (max-width: 900px) { .jurisdiction-dark-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 540px) { .jurisdiction-dark-grid { grid-template-columns: repeat(2, 1fr); } .jurisdiction-dark-grid .jd-card:last-child:nth-child(odd) { grid-column: 1 / -1; max-width: 50%; margin: 0 auto; width: 100%; } }
.jd-card    { background: rgba(200,169,110,0.05); border: 1px solid rgba(200,169,110,0.2); border-radius: 12px; padding: 16px 12px; text-align: center; display: flex; flex-direction: column; align-items: center; height: 100%; transition: border-color 0.2s, background 0.2s; }
.jd-card:hover { border-color: rgba(200,169,110,0.45); background: rgba(200,169,110,0.09); }
.jd-icon    { width: 36px; height: 36px; background: rgba(200,169,110,0.12); border: 1px solid rgba(200,169,110,0.22); border-radius: 9px; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; }
.jd-city    { font-size: 0.62rem; font-weight: 700; color: #c8a96e; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 4px; }
.jd-name    { font-size: 0.78rem; font-weight: 600; color: #ffffff; margin-bottom: 10px; line-height: 1.35; }
.jd-divider { width: 24px; height: 1px; background: rgba(200,169,110,0.25); margin: 0 auto 10px; }
.jd-pills   { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; }
.jd-pill    { background: rgba(200,169,110,0.08); border: 1px solid rgba(200,169,110,0.18); border-radius: 9999px; font-size: 0.62rem; font-weight: 500; color: rgba(200,169,110,0.8); padding: 3px 8px; line-height: 1; white-space: nowrap; }

/* ============================================================
   UNIVERSAL HOVER
   ============================================================ */
.card, .trend-card, .bring-card, .fact-card, .fin-card, .mindset-box,
.mini-card, .duration-note, .alert-card, .faq-item, .req-list li,
.step-body, .vac-card, .embassy-card, .info-box, .fee-info,
.slots-note, .seo-card, .rej-col, .centre-card, .scenario {
    transition: box-shadow 0.2s;
}
.card:hover, .trend-card:hover, .bring-card:hover, .fact-card:hover,
.fin-card:hover, .mindset-box:hover, .mini-card:hover, .duration-note:hover,
.alert-card:hover, .faq-item:hover, .req-list li:hover, .step-body:hover,
.vac-card:hover, .embassy-card:hover, .info-box:hover, .fee-info:hover,
.slots-note:hover, .seo-card:hover, .rej-col:hover, .centre-card:hover, .scenario:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.10), 0 0 0 1.5px #e8d9c0;
}