/*
Theme Name: Navigoza
Theme URI: https://navigoza.com
Author: Navigoza
Author URI: https://navigoza.com
Description: A premium, dark-themed travel-magazine WordPress theme built for Navigoza — a global travel blog and travel information platform. Includes Destination and Travel Tool custom post types, magazine-style archives, a full single-article template with table of contents and ad placements, and monetization-ready affiliate and advertisement blocks.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: navigoza
Tags: blog, news, custom-colors, custom-logo, custom-menu, featured-images, full-width-template, threaded-comments, translation-ready, travel

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* =========================================================================
   1. DESIGN TOKENS
   ========================================================================= */
:root {
  /* Color */
  --nv-surface: #10151c;
  --nv-surface-raised: #161d27;
  --nv-surface-sunken: #0a0d12;
  --nv-line: #2a3542;
  --nv-ink: #f1ede4;
  --nv-ink-muted: #9aa7b4;
  --nv-horizon: #e6b155;
  --nv-horizon-soft: #2c2011;
  --nv-on-horizon: #1a1206;
  --nv-compass: #5fd0c4;
  --nv-compass-soft: #132623;
  --nv-on-compass: #08211d;
  --nv-trail: #5fcdae;
  --nv-trail-soft: #1c2b16;
  --nv-coral: #f0897b;
  --nv-coral-soft: #2e1815;
  --nv-link: var(--nv-horizon);

  /* Type */
  --nv-font-display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --nv-font-sans: 'Work Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Spacing (4px base) */
  --nv-space-1: 4px;
  --nv-space-2: 8px;
  --nv-space-3: 12px;
  --nv-space-4: 16px;
  --nv-space-5: 24px;
  --nv-space-6: 32px;
  --nv-space-8: 48px;
  --nv-space-10: 64px;

  /* Radius */
  --nv-radius-sm: 6px;
  --nv-radius-md: 12px;
  --nv-radius-lg: 20px;
  --nv-radius-full: 9999px;

  /* Shadow */
  --nv-shadow-sm: 0 1px 2px #00000066, 0 1px 4px #00000080;
  --nv-shadow-lg: 0 20px 48px -12px #000000cc;
  --nv-focus-ring: 0 0 0 2px #10151c, 0 0 0 4px #e6b155;

  --nv-header-h: 76px;
  --nv-container: 1200px;
}

/* =========================================================================
   2. RESET & BASE
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--nv-surface);
  color: var(--nv-ink);
  font-family: var(--nv-font-sans);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}
img, svg { max-width: 100%; height: auto; display: block; }
a { color: var(--nv-link); text-decoration: none; }
h1, h2, h3, h4 { font-family: var(--nv-font-display); font-weight: 600; line-height: 1.2; margin: 0 0 var(--nv-space-3); color: var(--nv-ink); }
h1 { font-size: 40px; line-height: 1.15; letter-spacing: -0.01em; }
h2 { font-size: 26px; }
h3 { font-size: 19px; }
p { margin: 0 0 var(--nv-space-4); }
ul, ol { margin: 0 0 var(--nv-space-4); padding-left: 1.25em; }
button { font-family: inherit; }
:focus-visible { outline: 2px solid transparent; box-shadow: var(--nv-focus-ring); border-radius: var(--nv-radius-sm); }
.skip-link { position: absolute; left: -9999px; top: 0; background: var(--nv-horizon); color: var(--nv-on-horizon); padding: var(--nv-space-2) var(--nv-space-4); z-index: 1000; }
.skip-link:focus-visible { left: var(--nv-space-2); top: var(--nv-space-2); }
.nv-container { max-width: var(--nv-container); margin: 0 auto; padding: 0 var(--nv-space-5); }
.nv-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.screen-reader-text { position: absolute !important; left: -9999px; }

/* =========================================================================
   3. LABELS, BADGES, BUTTONS
   ========================================================================= */
.nv-label { display: inline-block; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--nv-compass); }
.nv-label-on-dark { color: var(--nv-horizon); }

.nv-badge { display: inline-flex; align-items: center; font-size: 12px; line-height: 20px; padding: 0 var(--nv-space-2); border-radius: var(--nv-radius-sm); background: var(--nv-line); color: var(--nv-ink); }
.nv-badge-horizon { background: var(--nv-horizon-soft); color: var(--nv-horizon); }
.nv-badge-compass { background: var(--nv-compass-soft); color: var(--nv-compass); }
.nv-badge-trail { background: var(--nv-trail-soft); color: var(--nv-trail); }
.nv-badge-coral { background: var(--nv-coral-soft); color: var(--nv-coral); }

.nv-btn { font: inherit; font-weight: 600; font-size: 14px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; gap: var(--nv-space-2); height: 46px; padding: 0 var(--nv-space-5); border-radius: var(--nv-radius-full); border: 1px solid transparent; cursor: pointer; white-space: nowrap; transition: filter .15s ease-out, border-color .15s ease-out, color .15s ease-out, transform .15s ease-out; }
.nv-btn-sm { height: 38px; padding: 0 var(--nv-space-4); font-size: 13px; }
.nv-btn-primary { background: var(--nv-horizon); border-color: var(--nv-horizon); color: var(--nv-on-horizon); }
.nv-btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.nv-btn-secondary { background: transparent; border-color: var(--nv-line); color: var(--nv-ink); }
.nv-btn-secondary:hover { border-color: var(--nv-horizon); color: var(--nv-horizon); }
.nv-btn-quiet { background: transparent; border-color: transparent; color: var(--nv-ink); text-decoration: underline; text-decoration-color: var(--nv-line); text-underline-offset: 3px; padding: 0 var(--nv-space-2); height: auto; }
.nv-btn-block { width: 100%; }
.nv-btn:disabled { opacity: .5; cursor: not-allowed; }

/* =========================================================================
   4. HEADER
   ========================================================================= */
.nv-header { position: sticky; top: 0; z-index: 500; background: rgba(16,21,28,.9); backdrop-filter: saturate(140%) blur(10px); border-bottom: 1px solid var(--nv-line); transition: box-shadow .2s ease-out, background .2s ease-out; }
.nv-header.is-stuck { background: rgba(10,13,18,.96); box-shadow: var(--nv-shadow-lg); }
.nv-header-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--nv-space-5); height: var(--nv-header-h); }
.nv-logo { display: flex; align-items: center; gap: var(--nv-space-2); color: var(--nv-ink); flex-shrink: 0; }
.nv-logo svg, .nv-logo img { height: 30px; width: auto; }
.nv-logo-word { font-family: var(--nv-font-display); font-size: 21px; font-weight: 600; letter-spacing: .01em; color: var(--nv-ink); }

.nv-nav { display: none; }
.nv-nav ul { display: flex; align-items: center; gap: var(--nv-space-5); margin: 0; padding: 0; list-style: none; }
.nv-nav a { font-size: 15px; font-weight: 500; color: var(--nv-ink); padding: var(--nv-space-2) 0; position: relative; }
.nv-nav > ul > li > a:hover, .nv-nav > ul > li.current-menu-item > a, .nv-nav > ul > li.current-menu-ancestor > a { color: var(--nv-horizon); }
.nv-nav li { position: relative; }
.nv-nav .menu-item-has-children > a::after { content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-3px) rotate(45deg); opacity: .7; }
.nv-nav .sub-menu { position: absolute; top: 100%; left: 0; min-width: 220px; background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-md); box-shadow: var(--nv-shadow-lg); padding: var(--nv-space-2); margin: var(--nv-space-2) 0 0; list-style: none; opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .15s ease-out, transform .15s ease-out; z-index: 20; }
.nv-nav li:hover > .sub-menu, .nv-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.nv-nav .sub-menu li { width: 100%; }
.nv-nav .sub-menu a { display: block; padding: var(--nv-space-2) var(--nv-space-3); border-radius: var(--nv-radius-sm); font-size: 14px; }
.nv-nav .sub-menu a:hover { background: var(--nv-surface-sunken); color: var(--nv-horizon); }

.nv-header-actions { display: flex; align-items: center; gap: var(--nv-space-3); }
.nv-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--nv-radius-full); border: 1px solid var(--nv-line); background: transparent; color: var(--nv-ink); cursor: pointer; }
.nv-icon-btn:hover { border-color: var(--nv-horizon); color: var(--nv-horizon); }
.nv-hamburger { display: inline-flex; }
.nv-hamburger span { display: block; width: 18px; height: 1.5px; background: currentColor; position: relative; }
.nv-hamburger span::before, .nv-hamburger span::after { content: ''; position: absolute; left: 0; width: 18px; height: 1.5px; background: currentColor; transition: transform .2s; }
.nv-hamburger span::before { top: -6px; }
.nv-hamburger span::after { top: 6px; }

.nv-search-panel { position: absolute; left: 0; right: 0; top: 100%; background: var(--nv-surface-raised); border-bottom: 1px solid var(--nv-line); box-shadow: var(--nv-shadow-lg); padding: var(--nv-space-5); display: none; }
.nv-search-panel.is-open { display: block; }
.nv-search-panel form { max-width: var(--nv-container); margin: 0 auto; display: flex; gap: var(--nv-space-2); }

.nv-mobile-nav { position: fixed; inset: var(--nv-header-h) 0 0 0; background: var(--nv-surface); z-index: 490; padding: var(--nv-space-5); overflow-y: auto; transform: translateX(100%); transition: transform .22s ease-out; }
.nv-mobile-nav.is-open { transform: translateX(0); }
.nv-mobile-nav ul { list-style: none; margin: 0; padding: 0; }
.nv-mobile-nav > ul > li { border-bottom: 1px solid var(--nv-line); }
.nv-mobile-nav a { display: block; padding: var(--nv-space-4) 0; font-size: 17px; color: var(--nv-ink); }
.nv-mobile-nav .sub-menu { list-style: none; padding: 0 0 var(--nv-space-3) var(--nv-space-3); display: none; }
.nv-mobile-nav .sub-menu.is-open { display: block; }
.nv-mobile-nav .sub-menu a { padding: var(--nv-space-2) 0; font-size: 15px; color: var(--nv-ink-muted); }
.nv-mobile-toggle { background: none; border: none; color: var(--nv-ink); float: right; font-size: 20px; line-height: 1; padding: var(--nv-space-4) 0; }
.nv-mobile-cta { margin-top: var(--nv-space-5); }

@media (min-width: 960px) {
  .nv-nav { display: block; }
  .nv-hamburger, .nv-mobile-nav { display: none !important; }
}

/* =========================================================================
   5. HERO
   ========================================================================= */
.nv-hero { position: relative; min-height: 560px; display: flex; align-items: center; overflow: hidden; background: linear-gradient(180deg, #0d1219 0%, #10151c 60%, #10151c 100%); border-bottom: 1px solid var(--nv-line); }
.nv-hero-media { position: absolute; inset: 0; background: var(--nv-surface-sunken); }
.nv-hero-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16,21,28,.15) 0%, rgba(16,21,28,.55) 55%, rgba(16,21,28,.94) 100%); }
.nv-hero-pattern { position: absolute; inset: 0; opacity: .5; color: var(--nv-compass-soft); }
.nv-hero-body { position: relative; z-index: 2; max-width: 720px; padding: var(--nv-space-10) 0; }
.nv-hero .nv-label { margin-bottom: var(--nv-space-3); display: inline-block; }
.nv-hero h1 { font-size: 44px; margin-bottom: var(--nv-space-4); }
.nv-hero p { font-size: 17px; color: var(--nv-ink-muted); max-width: 560px; margin-bottom: var(--nv-space-5); }
.nv-hero-actions { display: flex; gap: var(--nv-space-3); flex-wrap: wrap; }

@media (min-width: 720px) {
  .nv-hero h1 { font-size: 56px; }
}

/* =========================================================================
   6. SECTIONS
   ========================================================================= */
.nv-section { padding: var(--nv-space-8) 0; }
.nv-section-sunken { background: var(--nv-surface-sunken); }
.nv-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--nv-space-4); margin-bottom: var(--nv-space-6); flex-wrap: wrap; }
.nv-section-head .nv-label { margin-bottom: var(--nv-space-2); display: block; }
.nv-section-head h2 { margin: 0; }
.nv-section-head p { color: var(--nv-ink-muted); margin: var(--nv-space-2) 0 0; max-width: 640px; }
.nv-section-link { flex-shrink: 0; }

.nv-grid { display: grid; gap: var(--nv-space-5); grid-template-columns: 1fr; }
.nv-grid-2 { grid-template-columns: repeat(2, 1fr); }
.nv-grid-3 { grid-template-columns: repeat(3, 1fr); }
.nv-grid-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 720px) { .nv-grid-2, .nv-grid-3, .nv-grid-4 { grid-template-columns: 1fr; } }
@media (min-width: 721px) and (max-width: 1024px) { .nv-grid-3, .nv-grid-4 { grid-template-columns: repeat(2, 1fr); } }

/* =========================================================================
   7. PHOTO PLACEHOLDER (used until real photography is uploaded)
   ========================================================================= */
.nv-photo { background: var(--nv-surface-sunken); position: relative; overflow: hidden; }
.nv-photo img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.nv-photo:not(.has-image)::after { content: attr(data-placeholder); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: var(--nv-space-3); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--nv-ink-muted); }
.nv-photo:not(.has-image)::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, var(--nv-line) 0 1px, transparent 1px 22px); opacity: .35; }

/* =========================================================================
   8. CARDS
   ========================================================================= */
.nv-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-md); overflow: hidden; box-shadow: var(--nv-shadow-sm); transition: transform .18s ease-out, box-shadow .18s ease-out, border-color .18s ease-out; height: 100%; }
.nv-card:hover { transform: translateY(-3px); box-shadow: var(--nv-shadow-lg); border-color: #3a4757; }
.nv-card-body { padding: var(--nv-space-4); display: flex; flex-direction: column; gap: var(--nv-space-2); flex: 1; }
.nv-card-title { margin: 0; font-size: 19px; line-height: 26px; }
.nv-card-text { margin: 0; font-size: 14px; line-height: 21px; color: var(--nv-ink-muted); flex: 1; }
.nv-card-meta { display: flex; align-items: center; gap: var(--nv-space-2); font-size: 12px; color: var(--nv-ink-muted); margin-top: auto; }
.nv-dot { opacity: .6; }
.nv-card-count { font-size: 12px; color: var(--nv-compass); font-weight: 600; }

.nv-article-card .nv-photo { aspect-ratio: 16/10; }
.nv-destination-card .nv-photo { aspect-ratio: 4/3; }

.nv-tool-card { flex-direction: row; align-items: flex-start; gap: var(--nv-space-4); padding: var(--nv-space-4); }
.nv-tool-icon { width: 46px; height: 46px; flex: 0 0 46px; border-radius: var(--nv-radius-md); background: var(--nv-compass-soft); color: var(--nv-compass); display: flex; align-items: center; justify-content: center; }
.nv-tool-card .nv-card-body { padding: 0; }

.nv-affiliate-card { flex-direction: row; }
.nv-affiliate-card .nv-photo { width: 40%; flex: 0 0 40%; aspect-ratio: auto; }
.nv-affiliate-row { display: flex; align-items: center; justify-content: space-between; gap: var(--nv-space-3); margin-top: var(--nv-space-2); flex-wrap: wrap; }
.nv-affiliate-price { font-size: 13px; font-weight: 600; color: var(--nv-ink); }
@media (max-width: 560px) { .nv-affiliate-card { flex-direction: column; } .nv-affiliate-card .nv-photo { width: 100%; aspect-ratio: 16/9; } }

.nv-inspiration-card { position: relative; border-radius: var(--nv-radius-md); overflow: hidden; aspect-ratio: 3/4; display: flex; }
.nv-inspiration-card .nv-photo { position: absolute; inset: 0; }
.nv-inspiration-card .nv-inspiration-label { position: relative; z-index: 2; margin-top: auto; padding: var(--nv-space-4); background: linear-gradient(180deg, transparent, rgba(10,13,18,.9) 80%); width: 100%; }
.nv-inspiration-card .nv-inspiration-label span { font-family: var(--nv-font-display); font-size: 18px; font-weight: 600; color: var(--nv-ink); }
.nv-inspiration-card .nv-inspiration-label small { display: block; color: var(--nv-ink-muted); font-size: 12px; margin-top: 2px; }

/* =========================================================================
   9. CTA / NEWSLETTER
   ========================================================================= */
.nv-cta { background: var(--nv-surface-sunken); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-lg); padding: var(--nv-space-8) var(--nv-space-6); }
.nv-cta-body { max-width: 620px; }
.nv-cta-title { margin: 0 0 var(--nv-space-3); }
.nv-cta-text { color: var(--nv-ink-muted); margin: 0 0 var(--nv-space-5); }
.nv-cta-actions { display: flex; gap: var(--nv-space-3); flex-wrap: wrap; }

.nv-newsletter { background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-lg); padding: var(--nv-space-6); text-align: center; }
.nv-newsletter-title { margin: 0 0 var(--nv-space-2); }
.nv-newsletter-text { color: var(--nv-ink-muted); max-width: 520px; margin: 0 auto var(--nv-space-5); }
.nv-newsletter-form { display: flex; gap: var(--nv-space-2); max-width: 440px; margin: 0 auto; flex-wrap: wrap; justify-content: center; }
.nv-input { flex: 1; min-width: 200px; height: 46px; border-radius: var(--nv-radius-full); border: 1px solid var(--nv-line); background: var(--nv-surface-sunken); color: var(--nv-ink); padding: 0 var(--nv-space-4); font: inherit; font-size: 14px; }
.nv-input::placeholder { color: var(--nv-ink-muted); }
.nv-newsletter-note { font-size: 12px; color: var(--nv-ink-muted); margin-top: var(--nv-space-3); }
.nv-form-msg { margin-top: var(--nv-space-3); font-size: 13px; }
.nv-form-msg.is-success { color: var(--nv-trail); }
.nv-form-msg.is-error { color: var(--nv-coral); }

/* =========================================================================
   10. AD SLOTS
   ========================================================================= */
.nv-ad { border: 1px dashed var(--nv-line); border-radius: var(--nv-radius-sm); background: var(--nv-surface-sunken); display: flex; align-items: center; justify-content: center; margin: var(--nv-space-6) auto; overflow: hidden; }
.nv-ad-label { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--nv-ink-muted); }
.nv-ad-leaderboard { width: 100%; max-width: 728px; min-height: 90px; }
.nv-ad-rectangle { width: 300px; height: 250px; }
.nv-ad-sidebar { width: 100%; max-width: 300px; height: 600px; }
.nv-ad-incontent { width: 100%; min-height: 100px; }
.nv-ad code { display: none; }

/* =========================================================================
   11. BREADCRUMBS
   ========================================================================= */
.nv-breadcrumbs { font-size: 13px; color: var(--nv-ink-muted); margin-bottom: var(--nv-space-5); }
.nv-breadcrumbs a { color: var(--nv-ink-muted); }
.nv-breadcrumbs a:hover { color: var(--nv-horizon); }
.nv-breadcrumbs .sep { margin: 0 var(--nv-space-1); opacity: .5; }

/* =========================================================================
   12. ARTICLE (single.php)
   ========================================================================= */
.nv-article-hero { position: relative; }
.nv-article-hero .nv-photo { aspect-ratio: 16/8; }
.nv-article-head { padding: var(--nv-space-6) 0; max-width: 760px; margin: 0 auto; }
.nv-article-head .nv-label { margin-bottom: var(--nv-space-3); display: inline-block; }
.nv-article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--nv-space-3); font-size: 13px; color: var(--nv-ink-muted); margin-top: var(--nv-space-4); }
.nv-article-meta .nv-author-link { color: var(--nv-ink); font-weight: 600; }
.nv-article-layout { display: grid; grid-template-columns: 1fr; gap: var(--nv-space-8); max-width: 1100px; margin: 0 auto; padding-bottom: var(--nv-space-10); }
@media (min-width: 980px) { .nv-article-layout { grid-template-columns: 760px 1fr; } }

.nv-toc { background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-md); padding: var(--nv-space-4) var(--nv-space-5); margin-bottom: var(--nv-space-6); }
.nv-toc summary { cursor: pointer; font-family: var(--nv-font-display); font-weight: 600; font-size: 15px; }
.nv-toc ol { list-style: decimal; margin: var(--nv-space-3) 0 0; padding-left: 1.25em; }
.nv-toc a { color: var(--nv-ink-muted); font-size: 14px; }
.nv-toc a.is-active, .nv-toc a:hover { color: var(--nv-horizon); }

.nv-article-content { font-size: 17px; line-height: 1.75; color: var(--nv-ink); max-width: 760px; }
.nv-article-content h2 { font-size: 26px; margin-top: var(--nv-space-8); scroll-margin-top: calc(var(--nv-header-h) + 16px); }
.nv-article-content h3 { font-size: 20px; margin-top: var(--nv-space-6); scroll-margin-top: calc(var(--nv-header-h) + 16px); }
.nv-article-content p { margin-bottom: var(--nv-space-4); }
.nv-article-content img { border-radius: var(--nv-radius-md); margin: var(--nv-space-5) 0; }
.nv-article-content figcaption { font-size: 13px; color: var(--nv-ink-muted); text-align: center; margin-top: var(--nv-space-2); }
.nv-article-content blockquote { border-left: 3px solid var(--nv-horizon); margin: var(--nv-space-5) 0; padding: var(--nv-space-2) 0 var(--nv-space-2) var(--nv-space-4); font-style: italic; color: var(--nv-ink-muted); }
.nv-article-content a { text-decoration: underline; text-decoration-color: var(--nv-line); }
.nv-article-content ul, .nv-article-content ol { margin-bottom: var(--nv-space-4); }

.nv-tip-box, .nv-affiliate-box { border-radius: var(--nv-radius-md); padding: var(--nv-space-4) var(--nv-space-5); margin: var(--nv-space-6) 0; }
.nv-tip-box { background: var(--nv-trail-soft); border: 1px solid #274a37; }
.nv-tip-box .nv-tip-label { color: var(--nv-trail); font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: .04em; display: flex; align-items: center; gap: var(--nv-space-2); margin-bottom: var(--nv-space-2); }
.nv-tip-box p:last-child { margin-bottom: 0; }
.nv-warning-box { background: var(--nv-coral-soft); border: 1px solid #4a2620; }
.nv-warning-box .nv-tip-label { color: var(--nv-coral); }

.nv-affiliate-box { background: var(--nv-surface-raised); border: 1px solid var(--nv-line); }
.nv-affiliate-box .nv-label { margin-bottom: var(--nv-space-2); display: block; }
.nv-affiliate-box .nv-affiliate-box-title { margin: 0 0 var(--nv-space-2); font-size: 18px; }
.nv-affiliate-box p { margin-bottom: var(--nv-space-3); color: var(--nv-ink-muted); }

.nv-share { display: flex; align-items: center; gap: var(--nv-space-3); margin: var(--nv-space-8) 0; padding: var(--nv-space-5) 0; border-top: 1px solid var(--nv-line); border-bottom: 1px solid var(--nv-line); }
.nv-share span { font-size: 13px; color: var(--nv-ink-muted); }
.nv-share a { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: var(--nv-radius-full); border: 1px solid var(--nv-line); color: var(--nv-ink); }
.nv-share a:hover { border-color: var(--nv-horizon); color: var(--nv-horizon); }

.nv-author-box { display: flex; gap: var(--nv-space-4); background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-md); padding: var(--nv-space-5); margin: var(--nv-space-6) 0; align-items: flex-start; }
.nv-author-box img { width: 56px; height: 56px; border-radius: var(--nv-radius-full); flex-shrink: 0; }
.nv-author-box h3 { margin: 0 0 var(--nv-space-1); font-size: 16px; }
.nv-author-box p { margin: 0; color: var(--nv-ink-muted); font-size: 14px; }

.nv-related { max-width: 760px; }
.nv-sidebar { display: flex; flex-direction: column; gap: var(--nv-space-6); }
.nv-sidebar-widget { background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-md); padding: var(--nv-space-5); }
.nv-sidebar-widget h3 { font-size: 15px; margin: 0 0 var(--nv-space-4); text-transform: uppercase; letter-spacing: .04em; color: var(--nv-ink-muted); }

.nv-progress { position: fixed; top: 0; left: 0; height: 3px; background: var(--nv-horizon); width: 0%; z-index: 600; transition: width .1s linear; }

/* =========================================================================
   13. DESTINATION TEMPLATE
   ========================================================================= */
.nv-dest-hero { position: relative; min-height: 420px; display: flex; align-items: flex-end; }
.nv-dest-hero .nv-photo { position: absolute; inset: 0; }
.nv-dest-hero .nv-photo::before { opacity: .5; }
.nv-dest-hero-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(16,21,28,.1), rgba(16,21,28,.96)); }
.nv-dest-hero-body { position: relative; z-index: 2; padding: var(--nv-space-8) 0; width: 100%; }

.nv-dest-facts { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--nv-space-4); margin: var(--nv-space-6) 0; }
@media (min-width: 720px) { .nv-dest-facts { grid-template-columns: repeat(4,1fr); } }
.nv-fact { background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-md); padding: var(--nv-space-4); }
.nv-fact .nv-label { display: block; margin-bottom: var(--nv-space-1); }
.nv-fact strong { font-family: var(--nv-font-display); font-size: 16px; display: block; }

.nv-dest-section { max-width: 820px; margin: 0 auto var(--nv-space-8); }
.nv-dest-section h2 { display: flex; align-items: center; gap: var(--nv-space-2); }
.nv-dest-layout { display: grid; gap: var(--nv-space-8); grid-template-columns: 1fr; }
@media (min-width: 980px) { .nv-dest-layout { grid-template-columns: 1fr 320px; } }

/* =========================================================================
   14. TOOLS
   ========================================================================= */
.nv-tool-hero { padding: var(--nv-space-8) 0 var(--nv-space-5); text-align: center; }
.nv-tool-hero .nv-tool-icon { margin: 0 auto var(--nv-space-4); width: 64px; height: 64px; }
.nv-tool-panel { max-width: 640px; margin: 0 auto; background: var(--nv-surface-raised); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-lg); padding: var(--nv-space-6); }
.nv-tool-panel label { display: block; font-size: 13px; color: var(--nv-ink-muted); margin-bottom: var(--nv-space-2); }
.nv-tool-field { margin-bottom: var(--nv-space-4); }
.nv-tool-panel select, .nv-tool-panel input[type=text], .nv-tool-panel input[type=number], .nv-tool-panel input[type=date] { width: 100%; height: 46px; border-radius: var(--nv-radius-sm); border: 1px solid var(--nv-line); background: var(--nv-surface-sunken); color: var(--nv-ink); padding: 0 var(--nv-space-3); font: inherit; font-size: 14px; }
.nv-tool-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--nv-space-4); }
@media (max-width: 560px) { .nv-tool-row { grid-template-columns: 1fr; } }
.nv-tool-result { margin-top: var(--nv-space-5); padding: var(--nv-space-4); border-radius: var(--nv-radius-md); background: var(--nv-surface-sunken); border: 1px solid var(--nv-line); font-size: 15px; }
.nv-tool-note { display: flex; gap: var(--nv-space-2); align-items: flex-start; background: var(--nv-horizon-soft); border: 1px solid #4a3418; color: var(--nv-horizon); border-radius: var(--nv-radius-md); padding: var(--nv-space-3) var(--nv-space-4); font-size: 13px; margin-top: var(--nv-space-5); }
.nv-integration-note { background: var(--nv-surface-sunken); border: 1px dashed var(--nv-line); border-radius: var(--nv-radius-md); padding: var(--nv-space-4); font-size: 13px; color: var(--nv-ink-muted); margin-top: var(--nv-space-4); }
.nv-integration-note strong { color: var(--nv-ink); }
.nv-checklist { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--nv-space-2); }
.nv-checklist li { display: flex; align-items: center; gap: var(--nv-space-3); padding: var(--nv-space-2) var(--nv-space-3); border-radius: var(--nv-radius-sm); background: var(--nv-surface-sunken); }
.nv-checklist input { width: 18px; height: 18px; accent-color: var(--nv-horizon); }
.nv-checklist li.is-checked span { text-decoration: line-through; color: var(--nv-ink-muted); }
.nv-planner-list { display: flex; flex-direction: column; gap: var(--nv-space-3); margin: var(--nv-space-5) 0; }
.nv-planner-item { display: flex; justify-content: space-between; gap: var(--nv-space-3); background: var(--nv-surface-sunken); border: 1px solid var(--nv-line); border-radius: var(--nv-radius-sm); padding: var(--nv-space-3); align-items: center; }
.nv-planner-item button { background: none; border: none; color: var(--nv-coral); cursor: pointer; font-size: 13px; }

/* =========================================================================
   15. LEGAL / PLAIN PAGE
   ========================================================================= */
.nv-page-header { padding: var(--nv-space-8) 0 var(--nv-space-5); border-bottom: 1px solid var(--nv-line); margin-bottom: var(--nv-space-8); }
.nv-page-header h1 { margin-bottom: var(--nv-space-2); }
.nv-page-header p { color: var(--nv-ink-muted); margin: 0; }
.nv-legal { max-width: 760px; margin: 0 auto; font-size: 16px; line-height: 1.75; color: var(--nv-ink); padding-bottom: var(--nv-space-10); }
.nv-legal h2 { margin-top: var(--nv-space-8); }
.nv-legal .nv-legal-note { background: var(--nv-coral-soft); border: 1px solid #4a2620; border-radius: var(--nv-radius-md); padding: var(--nv-space-4); font-size: 14px; color: var(--nv-ink-muted); margin-bottom: var(--nv-space-6); }

/* =========================================================================
   16. SEARCH RESULTS / 404
   ========================================================================= */
.nv-search-head { padding: var(--nv-space-8) 0 var(--nv-space-5); }
.nv-search-form-full { display: flex; gap: var(--nv-space-2); max-width: 560px; margin-top: var(--nv-space-4); }
.nv-search-results { padding-bottom: var(--nv-space-10); }
.nv-search-result { padding: var(--nv-space-5) 0; border-bottom: 1px solid var(--nv-line); }
.nv-search-result h2 { font-size: 20px; margin-bottom: var(--nv-space-1); }
.nv-search-result p { color: var(--nv-ink-muted); margin: 0; }
.nv-404 { text-align: center; padding: var(--nv-space-10) 0; }
.nv-404 .nv-404-code { font-family: var(--nv-font-display); font-size: 96px; color: var(--nv-compass); margin: 0; }

/* =========================================================================
   17. FOOTER
   ========================================================================= */
.nv-footer { background: var(--nv-surface-sunken); border-top: 1px solid var(--nv-line); padding: var(--nv-space-10) 0 var(--nv-space-6); margin-top: var(--nv-space-10); }
.nv-footer-top { display: grid; gap: var(--nv-space-8); grid-template-columns: 1fr; margin-bottom: var(--nv-space-8); }
@media (min-width: 860px) { .nv-footer-top { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
.nv-footer-brand .nv-logo { margin-bottom: var(--nv-space-3); }
.nv-footer-brand p { color: var(--nv-ink-muted); font-size: 14px; max-width: 320px; }
.nv-footer-social { display: flex; gap: var(--nv-space-2); margin-top: var(--nv-space-4); }
.nv-footer h4 { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--nv-ink-muted); margin-bottom: var(--nv-space-4); }
.nv-footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--nv-space-2); }
.nv-footer-col a { color: var(--nv-ink); font-size: 14px; }
.nv-footer-col a:hover { color: var(--nv-horizon); }
.nv-footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--nv-space-3); padding-top: var(--nv-space-6); border-top: 1px solid var(--nv-line); font-size: 13px; color: var(--nv-ink-muted); }
.nv-footer-legal { display: flex; gap: var(--nv-space-4); flex-wrap: wrap; }
.nv-footer-legal a { color: var(--nv-ink-muted); }
.nv-footer-legal a:hover { color: var(--nv-horizon); }

/* =========================================================================
   18. MISC / WORDPRESS CORE
   ========================================================================= */
.alignleft { float: left; margin-right: var(--nv-space-5); }
.alignright { float: right; margin-left: var(--nv-space-5); }
.aligncenter { display: block; margin: var(--nv-space-5) auto; }
.wp-caption-text { font-size: 13px; color: var(--nv-ink-muted); text-align: center; }
.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--nv-space-3); }
.nv-pagination { display: flex; gap: var(--nv-space-2); justify-content: center; margin: var(--nv-space-8) 0; }
.nv-pagination a, .nv-pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; border-radius: var(--nv-radius-sm); border: 1px solid var(--nv-line); color: var(--nv-ink); font-size: 14px; padding: 0 var(--nv-space-2); }
.nv-pagination .current { background: var(--nv-horizon); color: var(--nv-on-horizon); border-color: var(--nv-horizon); }