
/* ==================== RESET & BASE ==================== */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
  font-family:'Inter',system-ui,sans-serif;
  background:#F8FAFB; color:#1a1a2e;
  line-height:1.6; min-height:100vh;
  display:flex; flex-direction:column;
}
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button,input,select,textarea { font:inherit; border:none; outline:none; }
button { cursor:pointer; }

/* ==================== TYPOGRAPHY ==================== */
h1 {
  font-family:'Playfair Display',Georgia,serif;
  font-size:2.5rem; font-weight:700;
  line-height:1.15; letter-spacing:-0.02em;
}
h2 {
  font-family:'Playfair Display',Georgia,serif;
  font-size:1.75rem; font-weight:700; line-height:1.25;
}
h3 { font-size:1.05rem; font-weight:600; }

/* ==================== COLORS ==================== */
:root {
  --navy: #1B2A4A;
  --navy-light: #2D3F5E;
  --navy-dark: #0F1D35;
  --green: #34D399;
  --green-light: #6EE7B7;
  --green-dark: #059669;
  --green-bg: #ECFDF5;
  --accent: #F59E0B;
  --text: #1a1a2e;
  --text-soft: #4B5563;
  --text-muted: #9CA3AF;
  --bg: #F8FAFB;
  --card-bg: #fff;
  --border: #E5E7EB;
  --border-light: #F3F4F6;
  --shadow: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 10px 40px rgba(0,0,0,0.12);
  --radius: 10px;
  --radius-lg: 14px;
  --max-width: 1240px;
}

/* ==================== LAYOUT ==================== */
.container { max-width:var(--max-width); margin:0 auto; padding:0 1.5rem; }
.main-content { flex:1; }

/* ==================== HEADER ==================== */
.site-header { background:var(--navy); position:sticky; top:0; z-index:100; }
.header-inner {
  display:flex; align-items:center; gap:1rem;
  padding:0 1.5rem; height:56px;
  max-width:var(--max-width); margin:0 auto;
}
.logo {
  display:flex; align-items:center; gap:0.5rem;
  font-family:'Playfair Display',serif; font-size:1.25rem;
  color:#fff; font-weight:700; white-space:nowrap;
}
.logo-icon {
  width:28px; height:28px; background:var(--green);
  border-radius:50%; display:flex; align-items:center;
  justify-content:center; font-size:0.85rem;
}
.nav-links {
  display:flex; align-items:center; gap:0.25rem;
  flex:1; justify-content:center;
}
.nav-links a {
  padding:0.4rem 0.85rem; border-radius:8px;
  font-size:0.85rem; font-weight:500;
  color:rgba(255,255,255,0.7); transition:all 0.2s;
  white-space:nowrap;
}
.nav-links a:hover, .nav-links a.active {
  color:#fff; background:rgba(255,255,255,0.1);
}
.header-right {
  display:flex; align-items:center; gap:0.6rem;
  white-space:nowrap; margin-left:auto;
}
.lang-select {
  padding:0.25rem 0.4rem; border:1px solid rgba(255,255,255,0.2);
  border-radius:6px; font-size:0.78rem;
  background:transparent; color:rgba(255,255,255,0.7); cursor:pointer;
}
.lang-select option { background:var(--navy); color:#fff; }
.btn-nav {
  padding:0.38rem 0.9rem; border-radius:20px;
  font-size:0.82rem; font-weight:600; transition:all 0.2s;
}
.btn-signin {
  color:rgba(255,255,255,0.85);
  border:1.5px solid rgba(255,255,255,0.3);
}
.btn-signin:hover {
  background:rgba(255,255,255,0.1);
  border-color:rgba(255,255,255,0.5);
}
.btn-register { background:var(--green); color:var(--navy-dark); }
.btn-register:hover { background:var(--green-light); }
.btn-user {
  display:flex; align-items:center; gap:0.4rem;
  padding:0.35rem 0.7rem; border-radius:20px;
  font-size:0.82rem; color:rgba(255,255,255,0.8);
  background:rgba(255,255,255,0.08);
}
.btn-user:hover { background:rgba(255,255,255,0.15); }
.nav-toggle {
  display:none; background:none; font-size:1.3rem;
  color:#fff; padding:0.25rem;
}
@media(max-width:768px) {
  .nav-toggle { display:block; }
  .nav-links {
    display:none; position:absolute; top:100%;
    left:0; right:0; background:var(--navy);
    flex-direction:column; padding:0.75rem;
  }
  .nav-links.open { display:flex; }
  .header-right .btn-nav:not(.btn-user) { display:none; }
}

/* ==================== HERO ==================== */
.hero {
  position:relative; background:var(--navy);
  color:#fff; padding:4.5rem 0 4rem; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  opacity:0.18;
}
.hero-content {
  position:relative; z-index:2;
  max-width:var(--max-width); margin:0 auto;
  padding:0 1.5rem; text-align:center;
}
.hero h1 { font-size:3.2rem; margin-bottom:0.75rem; color:#fff; }
.hero h1 span { color:var(--green-light); }
.hero-subtitle {
  font-size:1.1rem; opacity:0.7;
  max-width:520px; margin:0 auto 2.25rem;
}
.search-bar {
  display:flex; max-width:520px; margin:0 auto;
  background:rgba(255,255,255,0.1);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.15);
  border-radius:2rem; overflow:hidden; transition:all 0.3s;
}
.search-bar:focus-within {
  background:rgba(255,255,255,0.15);
  border-color:var(--green);
}
.search-bar input {
  flex:1; padding:0.85rem 1.5rem; font-size:0.95rem;
  color:#fff; background:transparent;
}
.search-bar input::placeholder { color:rgba(255,255,255,0.45); }
.search-bar button {
  padding:0.85rem 1.75rem; background:var(--green);
  color:var(--navy-dark); font-weight:700; font-size:0.9rem;
  border-radius:0 2rem 2rem 0; white-space:nowrap;
}
.search-bar button:hover { background:var(--green-light); }
@media(max-width:768px) {
  .hero { padding:3rem 0 2.5rem; }
  .hero h1 { font-size:2.2rem; }
  .hero-subtitle { font-size:0.95rem; }
}

/* ==================== SECTIONS ==================== */
.section { padding:3rem 0; }
.section-header {
  display:flex; align-items:flex-end;
  justify-content:space-between; margin-bottom:1.25rem; gap:1rem;
}
.section-title {
  font-size:1.5rem; display:flex;
  align-items:center; gap:0.5rem;
}
.section-desc {
  color:var(--text-soft); font-size:0.88rem; margin-top:0.1rem;
}

/* ==================== ATMOSPHERE SECTIONS (Home) ==================== */
.atmo-section { padding:2.5rem 0; position:relative; }
.atmo-section + .atmo-section { border-top:1px solid var(--border-light); }
.atmo-header {
  margin-bottom:1.15rem; display:flex;
  align-items:center; justify-content:space-between;
}
.atmo-title {
  font-size:1.35rem; display:flex;
  align-items:center; gap:0.5rem;
}
.atmo-title a { color:var(--navy); }
.atmo-title a:hover { color:var(--green-dark); }
.atmo-desc { color:var(--text-soft); font-size:0.85rem; margin-top:0.05rem; }
.atmo-see-all { font-size:0.82rem; color:var(--green-dark); font-weight:600; }

/* Sub-cards — wrapped flex, uniform size */
.subcard-grid { display:flex; flex-wrap:wrap; gap:0.55rem; }
.subcard {
  background:var(--card-bg); border:1px solid var(--border);
  border-radius:var(--radius); padding:0.75rem 1rem;
  transition:all 0.2s; cursor:pointer;
  display:flex; align-items:center; gap:0.55rem;
  flex:0 0 auto; max-width:250px;
}
.subcard:hover {
  border-color:var(--green); background:var(--green-bg);
  box-shadow:var(--shadow);
}
.subcard-icon { font-size:1.3rem; flex-shrink:0; }
.subcard-info { min-width:0; }
.subcard-name {
  font-weight:600; font-size:0.85rem;
  color:var(--text); white-space:nowrap;
}
.subcard-count { font-size:0.7rem; color:var(--text-muted); }
.subcard-listings {
  display:flex; flex-wrap:wrap; gap:0.25rem; margin-top:0.3rem;
  max-height:2.5rem; overflow:hidden;
}
.subcard-listing-link {
  font-size:0.68rem; color:var(--green-dark);
  padding:0.08rem 0.4rem; background:var(--green-bg);
  border-radius:8px; white-space:nowrap;
}
.subcard-listing-link:hover { background:var(--green); color:#fff; }

/* Destinations with events row */
.dest-events-row { margin-top:1.15rem; }
.dest-events-label {
  font-size:0.85rem; font-weight:600;
  color:var(--navy); margin-bottom:0.55rem;
  display:flex; align-items:center; gap:0.35rem;
}
.dest-scroll {
  display:flex; gap:0.65rem; overflow-x:auto;
  padding-bottom:0.4rem; -webkit-overflow-scrolling:touch;
}
.dest-scroll::-webkit-scrollbar { height:3px; }
.dest-scroll::-webkit-scrollbar-thumb {
  background:var(--border); border-radius:3px;
}
.dest-card {
  flex:0 0 190px; position:relative;
  border-radius:var(--radius); overflow:hidden;
  aspect-ratio:3/2; background:var(--navy);
}
.dest-card img {
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.3s;
}
.dest-card:hover img { transform:scale(1.06); }
.dest-card-overlay {
  position:absolute; inset:0;
  background:linear-gradient(transparent 25%,rgba(0,0,0,0.7));
  display:flex; flex-direction:column;
  justify-content:flex-end; padding:0.65rem;
}
.dest-card-name { color:#fff; font-weight:700; font-size:0.85rem; text-shadow:0 1px 3px rgba(0,0,0,0.4); }
.dest-card-country { color:rgba(255,255,255,0.6); font-size:0.68rem; margin-top:0.05rem; }
.dest-card-count { color:rgba(255,255,255,0.8); font-size:0.72rem; margin-top:0.15rem; }

/* ==================== CARDS ==================== */
.card-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
  gap:1.15rem;
}
.card {
  background:var(--card-bg); border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow); transition:all 0.25s;
}
.card:hover { box-shadow:var(--shadow-lg); transform:translateY(-2px); }
.card-img {
  aspect-ratio:16/10;
  background:linear-gradient(135deg,#E0E7EE,#C8D6DF);
  overflow:hidden; position:relative;
}
.card-img img {
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.3s;
}
.card:hover .card-img img { transform:scale(1.04); }
.card-body { padding:0.85rem 1rem; }
.card-title {
  font-weight:600; font-size:0.93rem; margin-bottom:0.15rem;
  color:var(--navy); display:-webkit-box;
  -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card-type {
  font-size:0.72rem; font-weight:500;
  color:var(--text-muted); text-transform:capitalize;
  margin-bottom:0.2rem;
}
.card-country {
  font-size:0.72rem; color:var(--text-muted);
  margin-bottom:0.1rem;
}
.card-meta {
  font-size:0.76rem; color:var(--text-muted);
  display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap;
}
.card-badge-event {
  display:inline-flex; align-items:center; gap:0.2rem;
  font-size:0.72rem; font-weight:600;
  color:var(--green-dark); background:var(--green-bg);
  padding:0.1rem 0.45rem; border-radius:6px;
}

/* ==================== TRIP CARDS ==================== */
.trip-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
  gap:1.15rem;
}
.trip-card {
  background:var(--card-bg); border-radius:var(--radius-lg);
  overflow:hidden; box-shadow:var(--shadow); transition:all 0.25s;
}
.trip-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-2px); }
.trip-card-img {
  aspect-ratio:2.2/1;
  background:linear-gradient(135deg,#D1E3DD,#B8CFC4);
  overflow:hidden;
}
.trip-card-img img { width:100%; height:100%; object-fit:cover; }
.trip-card-body { padding:0.9rem 1rem; }
.trip-card-title {
  font-weight:600; font-size:0.98rem;
  color:var(--navy); margin-bottom:0.25rem;
}
.trip-card-desc {
  font-size:0.83rem; color:var(--text-soft);
  display:-webkit-box; -webkit-line-clamp:2;
  -webkit-box-orient:vertical; overflow:hidden;
}

/* ==================== DETAIL PAGE ==================== */
.detail-hero {
  position:relative; min-height:380px;
  background:var(--navy); overflow:hidden;
}
.detail-hero img.hero-img {
  width:100%; height:100%; object-fit:cover;
  position:absolute; inset:0;
}
.detail-hero-overlay {
  position:absolute; inset:0;
  background:linear-gradient(transparent 15%, rgba(15,29,53,0.88));
  display:flex; flex-direction:column;
  justify-content:flex-end; padding:2rem 0;
}
.detail-hero-inner {
  max-width:var(--max-width); margin:0 auto; width:100%;
  padding:0 1.5rem; display:flex;
  align-items:flex-end; justify-content:space-between; gap:1.5rem;
}
.detail-hero h1 { color:#fff; font-size:2.4rem; margin-bottom:0.15rem; }
.hero-country {
  color:rgba(255,255,255,0.7); font-size:0.85rem;
  margin-bottom:0.15rem;
}
.detail-hero .subtype-under {
  color:var(--green-light); font-size:0.88rem;
  font-weight:500; margin-bottom:0.25rem; text-transform:capitalize;
}
.detail-hero .location {
  color:rgba(255,255,255,0.7); font-size:0.88rem;
}
.detail-hero .date-info {
  color:rgba(255,255,255,0.8); font-size:0.88rem; margin-top:0.15rem;
}
.hero-actions {
  display:flex; gap:0.5rem; flex-shrink:0;
  align-items:flex-end; padding-bottom:0.2rem;
}
.hero-btn {
  display:inline-flex; align-items:center; gap:0.3rem;
  padding:0.5rem 1rem; border-radius:2rem;
  font-size:0.82rem; font-weight:600;
  backdrop-filter:blur(8px); transition:all 0.2s;
  cursor:pointer; border:none;
}
.hero-btn-save {
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.25); color:#fff;
}
.hero-btn-save:hover { background:rgba(255,255,255,0.2); }
.hero-btn-save.saved {
  background:var(--green); color:var(--navy-dark);
  border-color:var(--green);
}
.hero-btn-share {
  background:rgba(255,255,255,0.1);
  border:1px solid rgba(255,255,255,0.25); color:#fff;
}
.hero-btn-share:hover { background:rgba(255,255,255,0.2); }
.hero-btn-book {
  background:var(--green); color:var(--navy-dark);
  border:1px solid var(--green);
}
.hero-btn-book:hover { background:var(--green-light); }

.detail-body {
  max-width:var(--max-width); margin:0 auto;
  padding:2rem 1.5rem; display:grid;
  grid-template-columns:1fr 320px; gap:2.5rem;
}
.detail-main { min-width:0; }
.detail-sidebar { display:flex; flex-direction:column; gap:1.15rem; }
.detail-section { margin-bottom:2rem; }
.detail-section-title {
  font-size:1.15rem; margin-bottom:0.9rem;
  padding-bottom:0.45rem; border-bottom:2px solid var(--green-bg);
  color:var(--navy); display:flex; align-items:center; gap:0.4rem;
}
.detail-desc {
  color:var(--text-soft); line-height:1.8;
  white-space:pre-wrap; font-size:0.93rem;
}

/* Breadcrumbs */
.breadcrumb {
  display:flex; align-items:center; flex-wrap:wrap;
  gap:0.3rem; margin:1.25rem 0 1rem;
  font-size:0.82rem; color:var(--text-muted);
}
.breadcrumb-link {
  color:var(--green-dark); transition:color 0.15s;
  display:inline-flex; align-items:center;
}
.breadcrumb-link svg { vertical-align:middle; }
.breadcrumb-link:hover { color:var(--navy); text-decoration:underline; }
.breadcrumb-sep { color:var(--border); margin:0 0.1rem; }
.breadcrumb-current { color:var(--text-soft); font-weight:500; }
.children-group { margin-bottom:1.5rem; }
.children-group-title {
  font-size:0.95rem; font-weight:600; color:var(--navy);
  margin-bottom:0.65rem; display:flex;
  align-items:center; gap:0.35rem; text-transform:capitalize;
}
.sidebar-card {
  background:var(--card-bg); border-radius:var(--radius);
  padding:1.1rem; box-shadow:var(--shadow);
  border:1px solid var(--border-light);
}
.sidebar-card h3 {
  font-size:0.92rem; margin-bottom:0.55rem; color:var(--navy);
}
@media(max-width:900px) { .detail-body { grid-template-columns:1fr; } }
@media(max-width:768px) {
  .detail-hero h1 { font-size:1.8rem; }
  .detail-hero-inner {
    flex-direction:column; align-items:flex-start;
  }
  .hero-actions { width:100%; }
}

/* ==================== ATMOSPHERE PAGE ==================== */
.atmo-page-header {
  background:var(--navy); padding:2rem 0 1.5rem; color:#fff;
}
.atmo-page-title {
  font-size:2rem; display:flex;
  align-items:center; gap:0.6rem; margin-bottom:0.2rem;
}
.atmo-page-desc {
  color:rgba(255,255,255,0.6); font-size:0.88rem;
  margin-bottom:1.15rem;
}
.grouping-filters {
  display:flex; flex-wrap:wrap; gap:0.45rem;
  margin-bottom:1.5rem; padding-top:1.15rem;
}
.grouping-tag {
  display:inline-flex; align-items:center; gap:0.3rem;
  padding:0.42rem 0.85rem; border-radius:2rem;
  font-size:0.82rem; font-weight:500;
  color:var(--text-soft); background:var(--card-bg);
  border:1px solid var(--border); transition:all 0.2s;
  white-space:nowrap;
}
.grouping-tag:hover { border-color:var(--green); color:var(--green-dark); }
.grouping-tag.active {
  background:var(--navy); color:#fff; border-color:var(--navy);
}
.results-count {
  font-size:0.82rem; color:var(--text-muted); margin-bottom:0.9rem;
}

/* ==================== SEARCH PAGE ==================== */
.search-page-header { background:var(--navy); padding:2rem 0 1.5rem; }
.search-summary {
  text-align:center; color:rgba(255,255,255,0.6);
  font-size:0.88rem; margin-top:0.65rem;
}
.search-tabs {
  display:flex; flex-wrap:wrap; gap:0.35rem;
  margin-bottom:1.25rem; padding-bottom:0.75rem;
  border-bottom:1px solid var(--border);
}
.search-tab {
  padding:0.4rem 0.85rem; border-radius:2rem;
  font-size:0.78rem; font-weight:500; border:1px solid var(--border);
  background:var(--card-bg); color:var(--text-soft);
  cursor:pointer; transition:all 0.2s; white-space:nowrap;
}
.search-tab:hover { border-color:var(--green); color:var(--green-dark); }
.search-tab.active {
  background:var(--navy); color:#fff; border-color:var(--navy);
}
.search-group { margin-bottom:1.75rem; }
.search-group-header {
  display:flex; align-items:center; gap:0.5rem;
  margin-bottom:0.75rem; padding-bottom:0.35rem;
  border-bottom:1px solid var(--border);
}
.search-group-header h3 {
  font-size:0.95rem; margin:0; color:var(--text); font-weight:600;
}
.search-group-count {
  font-size:0.72rem; color:var(--text-muted); background:var(--bg);
  padding:0.15rem 0.5rem; border-radius:2rem;
}

/* ==================== LISTING PAGE ==================== */
.listing-header {
  background:var(--navy); padding:2.5rem 0; color:#fff;
}
.listing-header h1 { font-size:2rem; margin-bottom:0.3rem; }
.listing-desc {
  color:rgba(255,255,255,0.6); max-width:600px; font-size:0.88rem;
}

/* ==================== PAGINATION ==================== */
.pagination {
  display:flex; justify-content:center;
  gap:0.4rem; margin-top:2rem; padding:1rem 0;
}
.pagination a, .pagination span {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:34px; height:34px; padding:0 0.5rem;
  border-radius:8px; font-size:0.85rem; font-weight:500;
}
.pagination a {
  color:var(--text-soft); background:var(--card-bg);
  border:1px solid var(--border);
}
.pagination a:hover { border-color:var(--green); color:var(--green-dark); }
.pagination .current {
  background:var(--navy); color:#fff;
  border:1px solid var(--navy);
}

/* ==================== TABS ==================== */
.tabs { display:flex; flex-wrap:wrap; gap:0.4rem; margin-bottom:1.5rem; }
.tab {
  padding:0.42rem 0.85rem; border-radius:2rem;
  font-size:0.83rem; font-weight:500;
  color:var(--text-soft); background:var(--card-bg);
  border:1px solid var(--border); white-space:nowrap;
  cursor:pointer; transition:all 0.2s;
}
.tab.active { background:var(--navy); color:#fff; border-color:var(--navy); }
.tab:hover:not(.active) { border-color:var(--green); color:var(--green-dark); }
.empty-state {
  text-align:center; padding:4rem 1rem; color:var(--text-muted);
}
.empty-state h3 {
  font-size:1.1rem; margin-bottom:0.4rem; color:var(--text-soft);
}

/* ==================== FORMS ==================== */
.form-page { max-width:440px; margin:3rem auto; padding:0 1.5rem; }
.form-card {
  background:var(--card-bg); border-radius:var(--radius-lg);
  padding:2rem; box-shadow:var(--shadow-md);
}
.form-title { text-align:center; margin-bottom:1.5rem; }
.form-title h1 {
  font-size:1.7rem; margin-bottom:0.4rem; color:var(--navy);
}
.form-title p { color:var(--text-soft); font-size:0.88rem; }
.form-group { margin-bottom:0.9rem; }
.form-group label {
  display:block; font-size:0.8rem; font-weight:600;
  color:var(--text-soft); margin-bottom:0.2rem;
}
.form-group input {
  width:100%; padding:0.6rem 0.85rem;
  border:1.5px solid var(--border); border-radius:var(--radius);
  font-size:0.9rem; transition:border-color 0.2s;
}
.form-group input:focus { border-color:var(--green); }
.form-submit {
  width:100%; padding:0.7rem; background:var(--green);
  color:var(--navy-dark); border-radius:var(--radius);
  font-weight:700; font-size:0.93rem; margin-top:0.5rem;
}
.form-submit:hover { background:var(--green-light); }
.form-divider {
  text-align:center; color:var(--text-muted);
  font-size:0.8rem; margin:1rem 0; position:relative;
}
.form-divider::before, .form-divider::after {
  content:''; position:absolute; top:50%;
  width:40%; height:1px; background:var(--border);
}
.form-divider::before { left:0; }
.form-divider::after { right:0; }
.btn-google {
  display:flex; align-items:center; justify-content:center;
  gap:0.5rem; width:100%; padding:0.6rem;
  border:1.5px solid var(--border); border-radius:var(--radius);
  font-weight:600; color:var(--text); background:#fff;
  margin-bottom:0.75rem; font-size:0.88rem;
}
.btn-google:hover { border-color:var(--green); background:var(--green-bg); }
.form-footer {
  text-align:center; margin-top:1rem;
  font-size:0.83rem; color:var(--text-soft);
}
.form-footer a { color:var(--green-dark); font-weight:600; }

/* ==================== GENERAL BUTTONS ==================== */
.btn {
  display:inline-flex; align-items:center; gap:0.35rem;
  padding:0.5rem 1.1rem; border-radius:2rem;
  font-size:0.85rem; font-weight:600; transition:all 0.2s;
}
.btn-primary { background:var(--green); color:var(--navy-dark); }
.btn-primary:hover { background:var(--green-light); }
.btn-outline {
  border:1.5px solid var(--border);
  color:var(--text-soft); background:#fff;
}
.btn-outline:hover { border-color:var(--green); color:var(--green-dark); }

/* ==================== FOOTER ==================== */
.site-footer {
  background:var(--navy-dark); color:rgba(255,255,255,0.55);
  padding:3rem 0 1.5rem; margin-top:auto;
}
.footer-inner {
  max-width:var(--max-width); margin:0 auto; padding:0 1.5rem;
  display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:2rem;
}
.footer-brand h3 {
  color:#fff; font-family:'Playfair Display',serif;
  font-size:1.1rem; margin-bottom:0.4rem;
}
.footer-brand p {
  font-size:0.8rem; line-height:1.6; max-width:300px;
}
.footer-col h4 {
  color:var(--green-light); font-size:0.75rem;
  font-weight:700; text-transform:uppercase;
  letter-spacing:0.06em; margin-bottom:0.55rem;
}
.footer-col a {
  display:block; font-size:0.8rem; padding:0.15rem 0;
  color:rgba(255,255,255,0.45); transition:color 0.2s;
}
.footer-col a:hover { color:var(--green-light); }
.footer-bottom {
  max-width:var(--max-width); margin:0 auto;
  padding:1.15rem 1.5rem 0;
  border-top:1px solid rgba(255,255,255,0.07);
  margin-top:1.5rem; text-align:center;
  font-size:0.72rem; color:rgba(255,255,255,0.25);
}
@media(max-width:768px) { .footer-inner { grid-template-columns:1fr; } }

/* ==================== COOKIE BANNER ==================== */
.cookie-banner {
  position:fixed; bottom:0; left:0; right:0;
  background:var(--navy); color:rgba(255,255,255,0.65);
  padding:0.7rem 1.5rem; display:flex; align-items:center;
  justify-content:center; gap:0.75rem; z-index:200;
  font-size:0.8rem;
}
.cookie-banner button {
  padding:0.3rem 0.8rem; background:var(--green);
  color:var(--navy-dark); border-radius:20px;
  font-weight:600; font-size:0.75rem;
}

/* ==================== TRIP GENERATOR ==================== */
.trip-gen-hero {
  background:var(--navy); padding:2.5rem 0 1.5rem; color:#fff; text-align:center;
}
.trip-gen-hero h1 { font-size:2rem; margin-bottom:0.3rem; }
.trip-gen-subtitle { color:rgba(255,255,255,0.6); font-size:0.9rem; }
.trip-form-card {
  background:var(--card-bg); border-radius:12px;
  border:1px solid var(--border); padding:1.5rem;
  box-shadow:0 2px 8px rgba(0,0,0,0.04);
}
.form-group { margin-bottom:1rem; }
.form-label {
  display:block; font-size:0.82rem; font-weight:600;
  color:var(--text-soft); margin-bottom:0.35rem;
}
.form-input {
  width:100%; padding:0.6rem 0.8rem; border-radius:8px;
  border:1px solid var(--border); font-size:0.88rem;
  font-family:'Inter',sans-serif; background:var(--bg);
  transition:border-color 0.2s;
}
.form-input:focus { outline:none; border-color:var(--green); }
.form-row { display:flex; gap:0.75rem; flex-wrap:wrap; }
.form-row .form-group { flex:1; min-width:140px; }
.quick-dests {
  display:flex; flex-wrap:wrap; gap:0.35rem; margin-top:0.5rem;
}
.quick-dest {
  padding:0.3rem 0.7rem; border-radius:2rem; font-size:0.75rem;
  background:var(--bg); border:1px solid var(--border); color:var(--text-soft);
  cursor:pointer; transition:all 0.2s;
}
.quick-dest:hover { background:var(--green-light); border-color:var(--green); color:var(--green-dark); }
.interest-tags { display:flex; flex-wrap:wrap; gap:0.35rem; }
.interest-tag {
  padding:0.35rem 0.8rem; border-radius:2rem; font-size:0.78rem;
  background:var(--bg); border:1px solid var(--border); color:var(--text-soft);
  cursor:pointer; transition:all 0.2s;
}
.interest-tag:hover { border-color:var(--green); }
.interest-tag.active {
  background:var(--green-light); border-color:var(--green-dark); color:var(--green-dark); font-weight:600;
}
.btn-generate {
  display:block; width:100%; padding:0.85rem;
  background:var(--green-dark); color:#fff; border:none;
  border-radius:8px; font-size:1rem; font-weight:600;
  font-family:'Inter',sans-serif; cursor:pointer;
  transition:background 0.2s; margin-top:0.5rem;
}
.btn-generate:hover { background:var(--navy); }
.btn-toggle-dates {
  padding:0.6rem 1rem; border-radius:8px; font-size:0.82rem;
  background:var(--bg); border:1px solid var(--border); color:var(--text-soft);
  cursor:pointer; transition:all 0.2s; font-family:'Inter',sans-serif; white-space:nowrap;
}
.btn-toggle-dates:hover { border-color:var(--green); color:var(--green-dark); }
.trip-loading {
  display:flex; flex-direction:column; align-items:center;
  padding:3rem 1rem; text-align:center;
}
.loading-spinner {
  width:40px; height:40px; border:3px solid var(--border);
  border-top-color:var(--green-dark); border-radius:50%;
  animation:spin 0.8s linear infinite; margin-bottom:1rem;
}
@keyframes spin { to { transform:rotate(360deg); } }
.loading-text { font-size:1.1rem; font-weight:600; color:var(--text); }
.loading-sub { font-size:0.82rem; color:var(--text-muted); margin-top:0.3rem; }
.trip-error {
  background:#FEF2F2; border:1px solid #FECACA; border-radius:12px;
  padding:1.5rem; text-align:center; color:#B91C1C;
}

/* ==================== TRIP DETAIL ==================== */
.trip-hero {
  background:var(--navy); padding:2.5rem 0 1.5rem; color:#fff; text-align:center;
}
.trip-hero h1 { font-size:2rem; margin-bottom:0.3rem; }
.trip-hero-desc { color:rgba(255,255,255,0.6); font-size:0.9rem; }
.trip-meta {
  display:flex; justify-content:center; gap:1rem;
  margin-top:0.6rem; flex-wrap:wrap;
}
.trip-meta span {
  font-size:0.82rem; color:rgba(255,255,255,0.5);
}
.trip-day {
  margin-bottom:2rem; border-left:3px solid var(--green); padding-left:1.25rem;
}
.trip-day-header {
  display:flex; align-items:center; gap:0.6rem; margin-bottom:0.5rem;
}
.trip-day-badge {
  background:var(--green-dark); color:#fff; padding:0.2rem 0.7rem;
  border-radius:2rem; font-size:0.72rem; font-weight:700; white-space:nowrap;
}
.trip-day-header h3 { font-size:1.1rem; margin:0; color:var(--text); }
.trip-day-narrative {
  font-size:0.85rem; color:var(--text-muted); margin-bottom:0.75rem; font-style:italic;
}
.trip-stop {
  display:flex; gap:0.75rem; margin-bottom:0.85rem;
  padding:0.75rem; background:var(--card-bg); border-radius:10px;
  border:1px solid var(--border);
}
.trip-stop-time {
  font-size:0.72rem; font-weight:700; color:var(--green-dark);
  min-width:42px; padding-top:0.15rem;
}
.trip-stop-content { display:flex; gap:0.75rem; flex:1; }
.trip-stop-img {
  width:80px; height:60px; border-radius:6px; overflow:hidden; flex-shrink:0;
}
.trip-stop-img img { width:100%; height:100%; object-fit:cover; }
.trip-stop-body { flex:1; }
.trip-stop-name {
  font-weight:600; font-size:0.88rem; color:var(--text); margin-bottom:0.15rem;
}
a.trip-stop-name { color:var(--green-dark); text-decoration:none; }
a.trip-stop-name:hover { text-decoration:underline; }
.trip-stop-new {
  font-size:0.6rem; background:var(--green-light); color:var(--green-dark);
  padding:0.1rem 0.4rem; border-radius:4px; font-weight:700; vertical-align:middle;
}
.trip-stop-desc { font-size:0.78rem; color:var(--text-muted); margin:0.1rem 0 0.3rem; }
.trip-stop-date {
  font-size:0.72rem; color:var(--green-dark); font-weight:600;
  margin:0.1rem 0 0.2rem;
}
.trip-stop-meta {
  display:flex; gap:0.6rem; flex-wrap:wrap;
}
.trip-stop-meta span { font-size:0.7rem; color:var(--text-muted); }
.trip-stop-type {
  background:var(--bg); padding:0.1rem 0.4rem;
  border-radius:4px; text-transform:capitalize;
}
.trip-result-card {
  background:var(--card-bg); border-radius:12px;
  border:1px solid var(--border); padding:1.5rem;
  box-shadow:0 2px 8px rgba(0,0,0,0.04);
}
.trip-result-header { margin-bottom:1.5rem; }
.trip-result-header h2 { font-size:1.4rem; margin-bottom:0.3rem; }
.trip-result-desc { font-size:0.88rem; color:var(--text-muted); }
.trip-result-actions { margin-top:0.75rem; display:flex; gap:0.5rem; }

/* ==================== AI SEARCH ==================== */
.ai-answer {
  background:linear-gradient(135deg, #E8FFF5 0%, #F0F9FF 100%);
  border:1px solid var(--green); border-radius:12px;
  padding:1rem 1.25rem; margin-bottom:1.25rem;
}
.ai-answer-label {
  font-size:0.7rem; font-weight:700; color:var(--green-dark);
  text-transform:uppercase; letter-spacing:0.05em; margin-bottom:0.35rem;
}
.ai-answer-text { font-size:0.9rem; color:var(--text); line-height:1.55; }

/* ==================== FONTS ==================== */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Inter:wght@400;500;600;700&display=swap');
