/* ========== FULL-WIDTH SECTION BACKGROUND STRETCH ========== */

/* Blow out the main container — sections must reach the viewport edges */
main,
main#main-content,
#content,
#main-content {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Sections: full-width backgrounds, content stays in a centred 1200px column */
main section,
main#content section,
main#main-content section,
#content section,
body > main section {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: max(2rem, calc(50% - 600px)) !important;
  padding-right: max(2rem, calc(50% - 600px)) !important;
}

/* Hero section — transparent, full-width */
main section.hero {
  background: transparent !important;
  padding-left: max(2rem, calc(50% - 600px)) !important;
  padding-right: max(2rem, calc(50% - 600px)) !important;
}

/* Trust bar — full-width band inside the hero section */
.trust-bar {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: max(2rem, calc(50% - 600px)) !important;
  padding-right: max(2rem, calc(50% - 600px)) !important;
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.95) 0%, rgba(10, 14, 26, 0.98) 100%);
  border-top: 1px solid rgba(42, 82, 152, 0.25);
  border-bottom: 1px solid rgba(42, 82, 152, 0.25);
}

/* FAQ + Partners row wrapper — full-width */
.faq-partners-row {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: max(2rem, calc(50% - 600px)) !important;
  padding-right: max(2rem, calc(50% - 600px)) !important;
  padding-top: 1.25rem !important;
  padding-bottom: 1.25rem !important;
  background:
    linear-gradient(180deg, #0a0e1a 0%, #0d1220 50%, #0a0e1a 100%);
  border-top: 1px solid rgba(42, 82, 152, 0.20);
  border-bottom: 1px solid rgba(42, 82, 152, 0.20);
}

/* CTA section — high-impact gradient band (it's <section class="cta-section">) */
.cta-section {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: max(2rem, calc(50% - 600px)) !important;
  padding-right: max(2rem, calc(50% - 600px)) !important;
}

/* Responsive mobile padding */
@media(max-width:900px){
  main section,
  .trust-bar,
  .faq-partners-row,
  .cta-section {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* ========== DISTINCT SECTION BACKGROUNDS ========== */

section#destinations {
  background:
    radial-gradient(ellipse at 80% 20%, rgba(42, 82, 152, 0.18) 0%, transparent 50%),
    linear-gradient(180deg, #0b1220 0%, #0a0e1a 100%) !important;
  border-bottom: 1px solid rgba(42, 82, 152, 0.30);
}

section#how {
  background:
    linear-gradient(180deg, rgba(30, 58, 95, 0.12) 0%, transparent 8px),
    linear-gradient(180deg, #111726 0%, #0d1220 100%) !important;
}

section#compare {
  background:
    linear-gradient(135deg, rgba(42, 82, 152, 0.15) 0%, rgba(10, 14, 26, 0.95) 50%, rgba(34, 197, 94, 0.06) 100%) !important;
  border-top: 1px solid rgba(42, 82, 152, 0.18);
  border-bottom: 1px solid rgba(42, 82, 152, 0.18);
}

section#quick-answers {
  background:
    radial-gradient(ellipse at 10% 50%, rgba(42, 82, 152, 0.12) 0%, transparent 45%),
    linear-gradient(180deg, #0c101c 0%, #090d18 100%) !important;
}

section#what-is {
  background:
    linear-gradient(180deg, #0f172a 0%, #0a0e1a 100%) !important;
  border-top: 1px solid rgba(42, 82, 152, 0.28);
  border-bottom: 1px solid rgba(42, 82, 152, 0.28);
}

section#glossary {
  background:
    linear-gradient(180deg, #131b2d 0%, #0e1424 100%) !important;
}

section#faq,
section#hotel-partners {
  background: transparent !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

section#news {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(42, 82, 152, 0.10) 0%, transparent 50%),
    linear-gradient(180deg, #10182a 0%, #0a0e1a 100%) !important;
}

section#also-from {
  background:
    linear-gradient(180deg, #0d1322 0%, #0a0e1a 100%) !important;
  border-top: 1px solid rgba(42, 82, 152, 0.15);
}

.cta-section {
  background:
    radial-gradient(ellipse at center, rgba(42, 82, 152, 0.22) 0%, transparent 65%),
    linear-gradient(180deg, #0c1221 0%, #0a0e1a 100%) !important;
}

/* ========== CARDS ========== */

.step,
.stat-card,
.compare-card,
.faq-item,
.cta-box {
  background: rgba(13, 19, 34, 0.82) !important;
  backdrop-filter: blur(10px);
  border: 1px solid rgba(42, 82, 152, 0.25) !important;
}

.dest-card {
  border: 1px solid rgba(42, 82, 152, 0.25) !important;
}

.step:hover,
.stat-card:hover,
.compare-card:hover,
.faq-item:hover,
.dest-card:hover {
  border-color: rgba(42, 82, 152, 0.50) !important;
  background: rgba(19, 27, 45, 0.88) !important;
}

.trust-stat {
  background: transparent !important;
  border: none !important;
}