/* KOLUMBUS — Unified Brand Styles (Teal + Gold) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&family=Raleway:wght@700;800;900&display=swap');

:root{
  --teal:#00b5c8;
  --teal-2:#0097ab;
  --gold:#f0a500;
  --gold-2:#ffbe3c;

  --bg:#071421;
  --bg-2:#0b1d2e;
  --card: rgba(255,255,255,0.06);
  --card-2: rgba(255,255,255,0.08);
  --line: rgba(255,255,255,0.14);
  --text:#eaf4ff;
  --muted: rgba(234,244,255,0.68);

  --radius:18px;
  --radius-sm:14px;
  --shadow: 0 18px 60px rgba(0,0,0,0.35);
  --shadow-soft: 0 10px 30px rgba(0,0,0,0.25);

  --glass: rgba(10, 24, 38, 0.55);
  --glass-2: rgba(10, 24, 38, 0.70);
  --blur: 18px;

  --container: 1180px;
  --transition: 260ms cubic-bezier(.2,.8,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{

  margin:0;
  font-family:Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:
    radial-gradient(800px 500px at 12% 12%, rgba(0,181,200,0.22), transparent 55%),
    radial-gradient(700px 420px at 86% 18%, rgba(240,165,0,0.16), transparent 58%),
    radial-gradient(900px 650px at 50% 110%, rgba(0,151,171,0.12), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg-2));
  min-height:100vh;
  overflow-x:hidden;
  padding-top: 72px;
}
img{max-width:100%;display:block}
a{color:inherit}
.container{
  width:min(var(--container), calc(100% - 40px));
  margin:0 auto;
}

/* ===== Header (Transparent → Glass on scroll) ===== */
.site-header{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  padding: 0;
  display: flex;
  align-items: center;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background var(--transition), backdrop-filter var(--transition), border-color var(--transition), box-shadow var(--transition);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.site-header::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,181,200,0.16), rgba(240,165,0,0.08), rgba(0,181,200,0.16));
  opacity: .35;
  pointer-events:none;
}
.site-header.is-scrolled{
  background: rgba(7, 20, 33, 0.62);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom-color: rgba(255,255,255,0.08);
  box-shadow: 0 10px 30px rgba(0,0,0,0.25);
}
.site-header.is-scrolled::before{ opacity: .14; }

.site-header .bar{
  position: relative;
  min-height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.brand{
  display:flex;
  align-items:center;
  text-decoration:none;
  gap: 0;
}
.brand-logo{
    height: 100px;
    width: 180px;
    display: block;
    object-fit: contain;
    transform: translateZ(0);
    image-rendering: -webkit-optimize-contrast;
}
.nav{
  display:flex; align-items:center; gap:6px;
}
.nav a{
  position:relative;
  padding:8px 12px;
  text-decoration:none;
  font-weight:700;
  font-size:12px;
  letter-spacing:1.3px;
  text-transform:uppercase;
  color:rgba(234,244,255,0.80);
  border-radius:999px;
  transition: background var(--transition), color var(--transition), transform var(--transition);
}
.nav a:hover{
  background: rgba(255,255,255,0.08);
  color:var(--text);
  transform: translateY(-1px);
}
.nav a.active{
  background: rgba(0,181,200,0.14);
  border: 1px solid rgba(0,181,200,0.22);
  color:var(--text);
}
.nav a::after{
  content:"";
  position:absolute; left:14px; right:14px; bottom:6px;
  height:2px;
  background: linear-gradient(90deg, var(--teal), var(--gold));
  border-radius:2px;
  transform: scaleX(0);
  transform-origin:left;
  transition: transform var(--transition);
  opacity:.9;
}
.nav a:hover::after{ transform: scaleX(1); }

.header-right{
  display:flex; align-items:center; gap:10px;
  flex-shrink:0;
}
/* Messengers in header */
.social{
  display:flex;
  align-items:center;
  gap:8px;
}
.social-btn{
  width:40px; height:40px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.14);
  transition: transform var(--transition), background var(--transition), border-color var(--transition);
  text-decoration:none;
}
.social-btn:hover{
  transform: translateY(-1px);
  background: rgba(0,181,200,0.12);
  border-color: rgba(0,181,200,0.28);
}
.social-btn svg{
  width:18px; height:18px;
  fill: rgba(234,244,255,0.9);
}
@media (max-width: 820px){
  .social{ display:none; }
}

.pill{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 14px;
  border-radius:999px;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.14);
  text-decoration:none;
  transition: transform var(--transition), background var(--transition), border-color var(--transition);
  white-space:nowrap;
  max-width: 44vw;
  overflow:hidden;
  text-overflow:ellipsis;
}
.pill:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,0.09);
  border-color: rgba(0,181,200,0.28);
}
.pill .dot{
  width:8px; height:8px; border-radius:50%;
  background: var(--teal);
  box-shadow: 0 0 0 6px rgba(0,181,200,0.12);
  flex:0 0 auto;
}
.pill .label{
  font-weight:800;
  letter-spacing:.3px;
  font-size:14px;
}
.burger{
  display:none;
  width:44px; height:44px;
  border-radius:12px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  cursor:pointer;
}
.burger span{
  display:block;
  width:20px; height:2px;
  background: rgba(234,244,255,0.9);
  margin:6px auto;
  border-radius:2px;
  transition: transform var(--transition), opacity var(--transition);
}

/* Mobile nav drawer */

.drawer-social{
  display:flex;
  gap:10px;
  margin-top:18px;
}
@media (min-width: 821px){
  .drawer-social{ display:none; }
}

body.nav-open{ overflow:hidden; }

.nav-drawer{
  display:none;
  position:fixed; inset:78px 0 auto 0;
  background: rgba(7,20,33,0.9);
  backdrop-filter: blur(var(--blur));
  border-bottom: 1px solid rgba(0,181,200,0.18);
}
.nav-drawer.open{ display:block; }
.nav-drawer .inner{
  padding:12px 0 18px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.nav-drawer a{
  margin:0 10px;
  padding:12px 14px;
  border-radius:14px;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.05);
}

/* ===== Sections ===== */
.section{padding:52px 0}
.section.sm{padding:44px 0}
.kicker{
  display:inline-flex; align-items:center; gap:10px;
  padding:8px 14px;
  border-radius:999px;
  background: rgba(0,181,200,0.12);
  border: 1px solid rgba(0,181,200,0.22);
  color: rgba(234,244,255,0.86);
  font-weight:800;
  letter-spacing:1.5px;
  text-transform:uppercase;
  font-size:11px;
}
.h1{
  font-family:Raleway, sans-serif;
  font-weight:900;
  font-size: clamp(34px, 5vw, 54px);
  line-height:1.05;
  margin:16px 0 14px;
}
.h2{
  font-family:Raleway, sans-serif;
  font-weight:900;
  font-size: clamp(26px, 3.2vw, 38px);
  line-height:1.12;
  margin:0 0 10px;
}
.lead{
  color: var(--muted);
  font-size: 16px;
  line-height:1.8;
  max-width: 720px;
}

/* Hero */
.hero{
  padding: 54px 0 34px;
  position: relative;
  overflow: hidden;
  --mx: 0px;
  --my: 0px;
}

/* tighter stacking right after booking */
.features.section{ padding-top: 12px; padding-bottom: 44px; }
.features.section .lead{ max-width: 760px; }

/* Animated glow background */
.hero::before,
.hero::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  filter: blur(40px);
  opacity:.75;
  transform: translate3d(var(--mx), var(--my), 0);
  transition: transform .25s ease;
}
.hero::before{
  background:
    radial-gradient(closest-side, rgba(0,181,200,.28), transparent 60%),
    radial-gradient(closest-side, rgba(240,165,0,.18), transparent 55%),
    radial-gradient(closest-side, rgba(0,151,171,.18), transparent 60%);
  animation: heroFloat 10s ease-in-out infinite;
}
.hero::after{
  background:
    radial-gradient(closest-side, rgba(255,190,60,.14), transparent 55%),
    radial-gradient(closest-side, rgba(0,181,200,.16), transparent 60%);
  animation: heroFloat2 14s ease-in-out infinite;
  opacity:.6;
}

@keyframes heroFloat{
  0%{ transform: translate3d(calc(var(--mx) - 18px), calc(var(--my) - 10px), 0) scale(1); }
  50%{ transform: translate3d(calc(var(--mx) + 22px), calc(var(--my) + 14px), 0) scale(1.03); }
  100%{ transform: translate3d(calc(var(--mx) - 18px), calc(var(--my) - 10px), 0) scale(1); }
}
@keyframes heroFloat2{
  0%{ transform: translate3d(calc(var(--mx) + 14px), calc(var(--my) - 18px), 0) scale(1); }
  50%{ transform: translate3d(calc(var(--mx) - 18px), calc(var(--my) + 22px), 0) scale(1.04); }
  100%{ transform: translate3d(calc(var(--mx) + 14px), calc(var(--my) - 18px), 0) scale(1); }
}


/* Micro-interactions */
.card, .country-card, .route-card, .glass{
  will-change: transform;
}
.card:hover, .country-card:hover, .route-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
}

.btn{
  position: relative;
  overflow: hidden;
}
.btn::after{
  content:"";
  position:absolute;
  top:-40%;
  left:-60%;
  width:40%;
  height:180%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.22), transparent);
  opacity:0;
  transition: opacity .25s ease, left .65s ease;
}
.btn:hover::after{
  opacity:1;
  left:120%;
}
@media (prefers-reduced-motion: reduce){
  .btn::after{ display:none; }
}

@media (prefers-reduced-motion: reduce){
  .hero::before, .hero::after{ animation:none; transition:none; }
}

.hero-grid{
  display:grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 28px;
  align-items:center;
}
.hero-card{
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--radius);
  padding: 22px;
  box-shadow: var(--shadow-soft);
}
.hero-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding: 13px 18px;
  border-radius: 14px;
  text-decoration:none;
  font-weight:900;
  letter-spacing:.4px;
  border:1px solid transparent;
  transition: transform var(--transition), background var(--transition), border-color var(--transition);
}
.btn:hover{ transform: translateY(-2px); }
.btn.primary{
  background: linear-gradient(135deg, var(--teal), var(--teal-2));
  box-shadow: 0 14px 40px rgba(0,181,200,0.25);
}
.btn.primary:hover{ box-shadow: 0 20px 50px rgba(0,181,200,0.35); }
.btn.gold{
  color:#071421;
  background: linear-gradient(135deg, var(--gold), var(--gold-2));
  box-shadow: 0 14px 40px rgba(240,165,0,0.18);
}
/* Hero messengers */
.hero-messengers{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.m-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
  letter-spacing:.6px;
  text-transform:uppercase;
  text-decoration:none;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  color: rgba(234,244,255,0.92);
  transition: transform var(--transition), background var(--transition), border-color var(--transition);
}
.m-btn:hover{
  transform: translateY(-1px);
  background: rgba(0,181,200,0.12);
  border-color: rgba(0,181,200,0.28);
}
.m-btn.wa:hover{ background: rgba(37,211,102,0.12); border-color: rgba(37,211,102,0.35); }
.m-btn.viber:hover{ background: rgba(115,96,242,0.14); border-color: rgba(115,96,242,0.35); }
.m-btn.tg:hover{ background: rgba(34,158,217,0.14); border-color: rgba(34,158,217,0.35); }

.btn.ghost{
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.14);
}
.chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; }
.chip{
  padding:10px 12px;
  border-radius:999px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  color: rgba(234,244,255,0.9);
  font-weight:800;
  font-size:13px;
}

/* Cards & grids */
.grid{
  display:grid;
  gap:16px;
}
.grid.cols-3{ grid-template-columns: repeat(3, 1fr); }
.grid.cols-2{ grid-template-columns: repeat(2, 1fr); }

.card{
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: var(--shadow-soft);
}
.card:hover{ border-color: rgba(0,181,200,0.22); }
.card .title{
  font-weight:900; letter-spacing:.2px; margin:0 0 6px;
}
.card .text{ color: var(--muted); margin:0; line-height:1.7; }
.badges{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.badge{
  padding:7px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
}
.badge.teal{ border-color: rgba(0,181,200,0.25); background: rgba(0,181,200,0.12); }
.badge.gold{ border-color: rgba(240,165,0,0.22); background: rgba(240,165,0,0.10); }

/* Schedule page */
.tabs{ display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }
.tab{
  cursor:pointer;
  padding:10px 14px;
  border-radius:999px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  font-weight:900;
  letter-spacing:.4px;
}
.tab.active{
  background: rgba(0,181,200,0.14);
  border-color: rgba(0,181,200,0.25);
}
.day-pills{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.day{ padding:7px 10px; border-radius:999px; font-weight:900; font-size:12px;
  background: rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.14);
}

/* Forms */
.form{
  background: var(--card);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: var(--radius);
  padding: 22px;
}
.field{ display:flex; flex-direction:column; gap:8px; }
label{ font-size:12px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color: rgba(234,244,255,0.72); }
input, select, textarea{
  width:100%;
  padding:14px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  color: var(--text);
  outline:none;
  transition: border-color var(--transition), background var(--transition);
  font-family:inherit;
  font-size:14px;
}

select{
  -webkit-appearance: none;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(255,255,255,.75) 50%),
    linear-gradient(135deg, rgba(255,255,255,.75) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 34px;
}
select option{
  background: #071421;
  color: #ffffff;
}

input::placeholder, textarea::placeholder{ color: rgba(234,244,255,0.35); }
input:focus, select:focus, textarea:focus{
  border-color: rgba(0,181,200,0.45);
  background: rgba(0,181,200,0.10);
}
textarea{ min-height:120px; resize:vertical; }

.form-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}
.form-grid .full{ grid-column:1 / -1; }

.notice{
  color: rgba(234,244,255,0.55);
  font-size:13px;
  line-height:1.6;
  margin-top:12px;
}

/* Footer */
.footer{
  padding:40px 0;
  border-top: 1px solid rgba(255,255,255,0.10);
  background: rgba(0,0,0,0.12);
}
.footer .cols{
  display:grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  gap: 18px;
  align-items:start;
}
.footer a{ color: rgba(234,244,255,0.75); text-decoration:none; }
.footer a:hover{ color: var(--text); }
.small{ color: rgba(234,244,255,0.52); font-size:13px; line-height:1.7; }

/* Animations */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity 700ms ease, transform 700ms ease; }
.reveal.visible, .reveal.is-visible{ opacity:1; transform: translateY(0); }

@media (max-width: 1024px){
  .hero-grid{ grid-template-columns: 1fr; }
  .grid.cols-3{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px){
  .form-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 820px){
  body{ padding-top: 68px; }
  .site-header .bar{ min-height: 56px; }
  .nav{ display:none; }
  .burger{ display:inline-block; }
  .brand-logo{ height: 100px; width: 180px; }
  .pill .label{ font-size:13px; }
}
@media (max-width: 560px){
  body{ padding-top: 64px; }
  .site-header .bar{ min-height: 56px; }
  .brand-logo{ height: 100px; width: 180px; }

  .header-right .pill{ max-width: 55vw; }
  .grid.cols-2, .grid.cols-3{ grid-template-columns: 1fr; }
  .form-grid{ grid-template-columns: 1fr; }
  .section{ padding:52px 0; }
  .section.sm{ padding:40px 0; }
  .hero{ padding: 44px 0 28px; }
}


/* Messenger CTA buttons */
.messenger-cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
}
.msg-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 16px;
  border-radius:14px;
  font-weight:800;
  letter-spacing:.2px;
  text-decoration:none;
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(14px);
  background: rgba(255,255,255,.06);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  transition: transform .25s ease, filter .25s ease, background .25s ease;
}
.msg-btn:hover{ transform: translateY(-2px); filter: brightness(1.05); }
.msg-btn .dot{
  width:10px;height:10px;border-radius:50%;
  background: currentColor;
  box-shadow: 0 0 0 6px rgba(255,255,255,.07);
}
.msg-btn.viber{ color:#7360F2; border-color: rgba(115,96,242,.35); }
.msg-btn.whatsapp{ color:#25D366; border-color: rgba(37,211,102,.35); }
.msg-btn.telegram{ color:#229ED9; border-color: rgba(34,158,217,.35); }
.msg-btn.viber:hover{ background: rgba(115,96,242,.10); }
.msg-btn.whatsapp:hover{ background: rgba(37,211,102,.10); }
.msg-btn.telegram:hover{ background: rgba(34,158,217,.10); }

/* Feature grid */
.feature-grid{
  margin-top:22px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:16px;
}
.feature-card{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(14px);
  padding:18px;
  box-shadow: 0 14px 34px rgba(0,0,0,.22);
}
.feature-ic{
  width:46px;height:46px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background: rgba(0,181,200,.14);
  border:1px solid rgba(0,181,200,.25);
  margin-bottom:12px;
  font-size:20px;
}
.feature-title{ font-weight:900; letter-spacing:.3px; margin-bottom:6px; }
.feature-text{ opacity:.8; font-size: .95rem; line-height:1.55; }

@media (max-width: 1024px){
  .feature-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px){
  .feature-grid{ grid-template-columns: 1fr; }
}


/* ====== HOME HERO + BOOKING (v4) ====== */
.hero .hero-grid{
  display:grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap:28px;
  align-items:start;
}
@media (max-width: 980px){
  .hero .hero-grid{ grid-template-columns: 1fr; }
}
.booking-card{
  position:relative;
  border-radius: 20px;
  padding:18px;
  margin-top: 28px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(0,181,200,0.22);
  backdrop-filter: blur(16px);
  box-shadow: 0 18px 60px rgba(0,0,0,0.35);
  overflow:hidden;
}
.booking-card:before{
  content:"";
  position:absolute; inset:-2px;
  background: radial-gradient(1200px 300px at 20% 0%, rgba(0,181,200,0.22), transparent 60%),
              radial-gradient(800px 240px at 90% 10%, rgba(240,165,0,0.18), transparent 55%);
  pointer-events:none;
}
.booking-card > *{ position:relative; }
.booking-card .bc-title{
  font-family: Raleway, system-ui, sans-serif;
  font-weight:900;
  letter-spacing: .5px;
  font-size: 1.15rem;
  margin: 2px 0 4px;
}
.booking-card .bc-sub{ opacity:.72; font-size:.9rem; margin-bottom:12px; }
.form-mini{ display:grid; gap:10px; }
.form-mini label{ font-size:.72rem; letter-spacing:1.4px; text-transform:uppercase; opacity:.75; }
.form-mini input, .form-mini select, .form-mini textarea{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  background: rgba(255,255,255,0.07);
  border:1px solid rgba(255,255,255,0.14);
  color: rgba(255,255,255,0.92);
  outline:none;
}
.form-mini input::placeholder, .form-mini textarea::placeholder{ color: rgba(255,255,255,0.35); }
.form-mini input:focus, .form-mini select:focus, .form-mini textarea:focus{
  border-color: rgba(0,181,200,0.75);
  box-shadow: 0 0 0 3px rgba(0,181,200,0.15);
}
.form-mini .row2{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
@media (max-width: 520px){ .form-mini .row2{ grid-template-columns:1fr; } }
.form-mini .btn{ width:100%; justify-content:center; }

/* Messenger buttons on home (brand colors, clearly clickable) */
.hero-messengers{
  display:flex; gap:10px; flex-wrap:wrap;
  margin-top:14px;
}
.m-btn{
  display:inline-flex; align-items:center; gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 800;
  letter-spacing:.2px;
  text-decoration:none;
  color:#fff;
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: 0 10px 26px rgba(0,0,0,0.25);
  transition: transform .25s ease, filter .25s ease, box-shadow .25s ease;
}
.m-btn:before{
  content:"";
  width:10px;height:10px;border-radius:50%;
  background: rgba(255,255,255,0.85);
  box-shadow: 0 0 0 3px rgba(255,255,255,0.18);
}
.m-btn:hover{ transform: translateY(-2px); filter: brightness(1.05); box-shadow: 0 16px 34px rgba(0,0,0,0.35); }
.m-btn.viber{ background: #7360f2; }
.m-btn.wa{ background: #25d366; color:#052b12; }
.m-btn.wa:before{ background: rgba(0,0,0,0.35); box-shadow: 0 0 0 3px rgba(0,0,0,0.12); }
.m-btn.tg{ background: #229ed9; }

/* Features cards (fix 'block to edges') */
.features{
  margin-top: 18px;
}
.features .grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:12px;
}
@media (max-width: 980px){ .features .grid{ grid-template-columns: repeat(2,1fr);} }
@media (max-width: 560px){ .features .grid{ grid-template-columns: 1fr;} }
.feature-card{
  border-radius: 18px;
  padding: 14px 14px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  backdrop-filter: blur(14px);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.feature-card:hover{
  transform: translateY(-6px);
  border-color: rgba(0,181,200,0.35);
  background: rgba(255,255,255,0.07);
}
.feature-card .ic{
  width:40px;height:40px;border-radius:12px;
  display:grid;place-items:center;
  background: rgba(0,181,200,0.16);
  border:1px solid rgba(0,181,200,0.22);
  margin-bottom:10px;
}
.feature-card .t{ font-weight:900; margin-bottom:6px; }
.feature-card .d{ opacity:.74; font-size:.92rem; line-height:1.55; }

/* Compact sections on home */
.section.features .lead{ margin-top: 6px; }
.section.sm .lead{ margin-top: 6px; }

/* Schedule cards visibility */
.schedule-card{ opacity:1 !important; transform:none !important; }

.grad{background:linear-gradient(135deg,var(--teal),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}



/* Routes page */
.routes-page .routes-hero{
  position:relative;
  padding: 6px 0 10px;
}
.routes-page .routes-cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
}

.routes-block{ margin-top: 26px; }

.routes-grid{
  display:grid;
  gap:16px;
}
.routes-grid--big{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.routes-grid--all{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.route-card{
  border: 1px solid var(--line);
  background: var(--card);
  border-radius: 18px;
  padding: 16px 16px 14px;
  box-shadow: var(--shadow);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
  overflow:hidden;
  position:relative;
}
.route-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(600px 180px at 30% 0%, rgba(0,181,200,.18), transparent 60%),
              radial-gradient(500px 160px at 80% 20%, rgba(240,165,0,.12), transparent 55%);
  opacity:.9;
  pointer-events:none;
}
.route-card > *{ position:relative; z-index:1; }

.route-card:hover{
  transform: translateY(-3px);
  border-color: rgba(0,181,200,.38);
  background: var(--card-2);
}

.route-card--big{
  padding: 18px 18px 16px;
  border-radius: 20px;
}
.route-card--big:hover{
  border-color: rgba(240,165,0,.35);
}

.route-head{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.route-flag{
  width:42px; height:42px;
  display:grid;
  place-items:center;
  font-size: 22px;
  border-radius: 14px;
  background: rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.09);
}
.route-title{
  margin:0;
  font-weight: 800;
  letter-spacing: .2px;
  font-size: 18px;
}
.route-sub{
  margin:4px 0 0;
  color: var(--muted);
  font-size: 13.5px;
  line-height:1.55;
}

.route-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top: 12px;
}
.tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.88);
  font-size: 12.5px;
  line-height: 1;
}

.route-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top: 14px;
}
.btn.sm{
  padding: 10px 14px;
  font-size: 13px;
}

.routes-help{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.routes-help__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* Responsive */
@media (max-width: 980px){
  .routes-grid--big{ grid-template-columns: 1fr; }
  .routes-grid--all{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .routes-grid--all{ grid-template-columns: 1fr; }
  .routes-help{ flex-direction:column; align-items:flex-start; }
}


/* === Country SEO pages === */
.country-hero{
  position:relative;
  padding: 92px 0 56px;
  background:
    radial-gradient(900px 420px at 20% 10%, rgba(0,187,204,.26), transparent 55%),
    radial-gradient(700px 380px at 85% 20%, rgba(240,165,0,.18), transparent 60%),
    linear-gradient(180deg, rgba(7,20,33,.72), rgba(7,20,33,.92));
  overflow:hidden;
}
.country-hero::before{
  content:"";
  position:absolute; inset:0;
  background-image: var(--hero-image);
  background-size: cover;
  background-position: center;
  filter: saturate(1.05) contrast(1.05);
  opacity:.55;
  transform: scale(1.02);
}
.country-hero::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(7,20,33,.50), rgba(7,20,33,.92));
}
.country-hero .container{ position:relative; z-index:1; }
.country-kicker{
  display:inline-flex;
  gap:10px;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(10px);
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.country-hero h1{
  margin: 14px 0 10px;
  font-size: clamp(30px, 4.6vw, 54px);
  line-height:1.05;
}
.country-hero .lead{
  max-width: 820px;
  opacity:.92;
  font-size: 16px;
}
.country-hero .hero-actions{ margin-top: 18px; }
.country-grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 22px;
  align-items: start;
}
.country-card{
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 18px 46px rgba(0,0,0,.28);
  padding: 18px;
}
.country-card h2{
  font-size: 18px;
  margin-bottom: 10px;
}
.country-card p{ color: rgba(255,255,255,.88); }
.chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.chip{
  padding:8px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  font-size: 13px;
  color: rgba(255,255,255,.90);
}
.country-features{
  margin-top: 22px;
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap: 14px;
}
.feature{
  border-radius: 16px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  padding: 14px;
}
.feature b{ display:block; margin-bottom:6px; }
.faq details{
  border-radius: 14px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  padding: 12px 14px;
}
.faq details + details{ margin-top: 10px; }
.faq summary{
  cursor:pointer;
  font-weight:700;
}
.faq p{ margin-top:8px; color: rgba(255,255,255,.88); }

@media (max-width: 980px){
  .country-grid{ grid-template-columns:1fr; }
  .country-features{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 560px){
  /* header sizes are defined above; keep country layouts only */

  .country-hero{ padding-top: 78px; }
  .country-features{ grid-template-columns: 1fr; }
}


/* === Animated background (subtle, brand colors) === */
body{

  position: relative;
  overflow-x: hidden;
}
body::before,
body::after{
  content:"";
  position: fixed;
  inset: -20vh -20vw;
  z-index: -1;
  pointer-events: none;
  opacity: .85;
  filter: blur(40px);
  transform: translateZ(0);
}
body::before{
  background:
    radial-gradient(700px 520px at 18% 22%, rgba(0, 204, 220, .20), transparent 60%),
    radial-gradient(520px 420px at 82% 18%, rgba(240, 181, 37, .15), transparent 62%),
    radial-gradient(520px 520px at 70% 78%, rgba(0, 204, 220, .12), transparent 58%);
  animation: bgFloat1 18s ease-in-out infinite alternate;
}
body::after{
  background:
    radial-gradient(600px 460px at 28% 78%, rgba(240, 181, 37, .10), transparent 60%),
    radial-gradient(520px 520px at 90% 62%, rgba(0, 204, 220, .10), transparent 60%);
  animation: bgFloat2 22s ease-in-out infinite alternate;
  opacity: .7;
}
@keyframes bgFloat1{
  0%{ transform: translate3d(0,0,0) scale(1); }
  100%{ transform: translate3d(2vw,-2vh,0) scale(1.03); }
}
@keyframes bgFloat2{
  0%{ transform: translate3d(0,0,0) scale(1); }
  100%{ transform: translate3d(-2vw,2vh,0) scale(1.04); }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  body::before, body::after{ animation: none !important; }
}


/* === Premium hover animations (site-wide) === */
.btn, .pill, .social-btn{
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease, color .25s ease;
  will-change: transform;
}
.btn:hover, .pill:hover, .social-btn:hover{
  transform: translateY(-2px);
}
.btn:active, .pill:active, .social-btn:active{
  transform: translateY(0);
}

.glass, .card, .country-card, .route-card, .panel, .feature-card{
  position: relative;
  overflow: hidden;
}
.glass::after,
.card::after,
.country-card::after,
.route-card::after,
.panel::after,
.feature-card::after{
  content:"";
  position:absolute;
  inset:-40%;
  background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.14) 50%, transparent 60%);
  transform: translateX(-30%) rotate(8deg);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events:none;
}
.glass:hover::after,
.card:hover::after,
.country-card:hover::after,
.route-card:hover::after,
.panel:hover::after,
.feature-card:hover::after{
  opacity: 1;
  animation: shineSweep .9s ease forwards;
}
@keyframes shineSweep{
  0%{ transform: translateX(-40%) rotate(8deg); }
  100%{ transform: translateX(40%) rotate(8deg); }
}

.reveal{
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.is-visible{
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .btn, .pill, .social-btn, .reveal{ transition:none !important; }
  .glass::after, .card::after, .country-card::after, .route-card::after, .panel::after, .feature-card::after{ display:none !important; }
}

/* Form hint */
.form-hint{
  margin: 10px 0 0;
  font-size: 13px;
  line-height: 1.35;
  color: rgba(255,255,255,.68);
}


/* === Compact spacing (booking -> features -> popular) === */
.section.features{ padding-top: 28px; padding-bottom: 46px; }
.section.popular{ padding-top: 28px; padding-bottom: 54px; }

.feature-card{ padding: 14px; }
.feature-card .t{ font-size: 16px; line-height: 1.25; margin-bottom: 4px; }
.feature-card .d{ font-size: 13px; line-height: 1.35; opacity: .88; }

@media (max-width: 720px){
  .section.features{ padding-top: 22px; padding-bottom: 40px; }
  .section.popular{ padding-top: 22px; padding-bottom: 44px; }
}


/* Popular cards actions */
.card .actions{ margin-top: 12px; display:flex; gap:10px; flex-wrap:wrap; }
.card.low-priority{ opacity: .9; }


/* Booking card vertical position tweak */
@media (max-width: 720px){
  .booking-card{ margin-top: 16px; }
}