:root{
      --brand:#165DFF;
      --brand-2:#0B2E87;
      --ink:#0f172a;
      --muted:#64748b;
      --bg:#f6f8ff;
      --card:#ffffff;
      --line:#e8eefc;
      --soft:#eef4ff;
      --shadow: 0 16px 50px rgba(2, 8, 23, .10);
      --shadow2: 0 10px 28px rgba(2, 8, 23, .10);
      --radius: 18px;
    }
    body{ color:var(--ink); background:var(--bg); }
    a{ color:inherit; text-decoration:none; }
    .container-wide{ max-width:1200px; }

    /* Top strip */
    .topbar{
      background:#fff;
      border-bottom:1px solid var(--line);
      font-size:16px;
    }
    .topbar .mini a{ color:var(--muted); }
    .topbar .mini a:hover{ color:var(--ink); }
    .brand{
      display:flex; align-items:center; gap:.6rem;
      font-weight:800; letter-spacing:.2px;
    }
    .brand .logo{
      display:grid; place-items:center;
      color:#fff;
      flex:0 0 auto;
    }
    .nav-pills .nav-link{
      color:var(--muted);
      border-radius:999px;
      padding:.45rem .8rem;
      font-weight:600;
    }
    .nav-pills .nav-link.active{
      background:var(--soft);
      color:var(--brand-2);
    }

    /* Hero */
    .hero{
      background:
        radial-gradient(900px 240px at 15% 15%, rgba(55,183,255,.25), transparent 60%),
        radial-gradient(700px 240px at 85% 20%, rgba(22,93,255,.20), transparent 60%),
        linear-gradient(180deg, #0f3aa9 0%, #0b2f86 50%, #0a2a73 100%);
      color:#fff;
      border-bottom:1px solid rgba(255,255,255,.12);

    }
    .hero-image{
  margin: 20px 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

.hero-image img{
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  border-radius: 20px;
}

    .hero-inner{ padding:18px 0 22px; }
    .hero h1{
      font-size: clamp(22px, 2.2vw, 30px);
      font-weight:850;
      letter-spacing:.2px;
      margin:0;
    }
    .hero p{ margin:0; color:rgba(255,255,255,.78); }

    .search-card{
      background:#fff;
      border-radius: 22px;
      box-shadow: var(--shadow);
      padding: 16px;
      margin-top: 14px;
      position:relative;
    }
    .search-tabs .btn{
      border-radius:999px;
      font-weight:700;
      padding:.4rem .85rem;
      border:1px solid var(--line);
      background:#fff;
      color:var(--muted);
    }
    .search-tabs .btn.active{
      border-color: transparent;
      background: rgba(22,93,255,.12);
      color: var(--brand-2);
    }
    .field{
      background:#fff;
      border:1px solid var(--line);
      border-radius: 16px;
      padding:10px 12px;
      height: 62px;
    }
    .field label{
      font-size:11px;
      color:var(--muted);
      font-weight:700;
      display:block;
      margin-bottom:2px;
      letter-spacing:.2px;
    }
    .field .value{
      display:flex; align-items:center; gap:.6rem;
      font-weight:800;
    }
    .field .value small{ color:var(--muted); font-weight:700; }
    .field select, .field input{
      border:0; outline:0; width:100%;
      font-weight:800;
      background:transparent;
    }
    .field input::placeholder{ color:#94a3b8; font-weight:700; }
    .btn-search{
      height:62px;
      border-radius: 16px;
      font-weight:900;
      letter-spacing:.3px;
      background: #ff6a00;
      border:0;
      box-shadow: 0 12px 30px rgba(255,106,0,.25);
    }
    .btn-search:hover{ filter:brightness(.98); }
    .micro-row{
      margin-top:10px;
      display:flex; flex-wrap:wrap; gap:10px;
      align-items:center;
      color:rgba(255,255,255,.85);
      font-size:13px;
    }
    .chip{
      background: rgba(255,255,255,.14);
      border: 1px solid rgba(255,255,255,.18);
      padding: 7px 10px;
      border-radius: 999px;
      display:flex; align-items:center; gap:8px;
      backdrop-filter: blur(8px);
    }
    .chip input{ accent-color:#fff; }

    /* Sections */
    .section-title{
      font-weight:900;
      letter-spacing:.2px;
      margin: 22px 0 12px;
    }
    .subtabs{
      display:flex; gap:12px; flex-wrap:wrap;
      font-size:13px;
      color:var(--muted);
      margin-bottom:12px;
    }
    .subtabs a{
      padding:.35rem .65rem;
      border-radius:999px;
      border:1px solid transparent;
    }
    .subtabs a.active{
      background:#fff;
      border-color:var(--line);
      box-shadow: 0 10px 20px rgba(2, 8, 23, .05);
      color:var(--ink);
      font-weight:800;
    }

    /* Offer cards */
    .offer-card{
      background:var(--card);
      border:1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow2);
      overflow:hidden;
      height:100%;
    }
    .offer-top{
      padding:14px 14px 0;
      display:flex; justify-content:space-between; gap:12px;
      align-items:flex-start;
    }
    .offer-badge{
      font-size:12px;
      font-weight:900;
      border-radius:999px;
      padding:6px 10px;
      background: rgba(22,93,255,.10);
      color: var(--brand-2);
      display:inline-flex; gap:8px; align-items:center;
    }
    .offer-card h3{
      font-size:15px;
      font-weight:900;
      margin:10px 14px 6px;
    }
    .offer-card p{
      margin:0 14px 14px;
      color:var(--muted);
      font-size:13px;
      line-height:1.5;
    }
    .offer-media{
      height:92px;
      background: rgba(22,93,255,.10);       
      display:flex; align-items:center; justify-content:flex-end;
      padding:12px 14px;
    }
    .offer-icon{
      width:44px; height:44px;
      border-radius:16px;
      background:#fff;
      border:1px solid var(--line);
      display:grid; place-items:center;
      color:var(--brand-2);
      box-shadow: 0 10px 22px rgba(2, 8, 23, .08);
    }

    /* Deals list */
    .deals-wrap{
      background:#fff;
      border:1px solid var(--line);
      border-radius: 22px;
      box-shadow: var(--shadow2);
      overflow:hidden;
    }
    .deals-head{
      padding:14px 16px;
      border-bottom:1px solid var(--line);
      display:flex; flex-wrap:wrap; gap:12px;
      justify-content:space-between;
      align-items:center;
    }
    .deals-head .pill{
      background: var(--soft);
      border:1px solid var(--line);
      border-radius:999px;
      padding:7px 10px;
      font-weight:800;
      color: var(--brand-2);
      font-size:13px;
      display:inline-flex; gap:8px; align-items:center;
    }
    .deals-head .months button{
      border:1px solid var(--line);
      background:#fff;
      border-radius:10px;
      padding:6px 10px;
      font-weight:800;
      color:var(--muted);
      font-size:12px;
    }
    .deals-head .months button.active{
      background: var(--soft);
      color: var(--brand-2);
    }
    .deal-row{
      padding:14px 16px;
      display:grid;
      grid-template-columns: 1.4fr .8fr .6fr;
      gap:12px;
      align-items:center;
      border-bottom:1px solid var(--line);
    }
    .deal-row:last-child{ border-bottom:0; }
    .deal-title{ font-weight:900; }
    .deal-sub{ color:var(--muted); font-size:14px; margin-top:2px; }
    .price{
      font-weight:950;
      color:#ff6a00;
      font-size:18px;
      letter-spacing:.2px;
    }
    .btn-book{
      border-radius: 999px;
      font-weight:900;
      padding:9px 14px;
      background: var(--brand);
      border:0;
      box-shadow: 0 10px 24px rgba(22,93,255,.25);
    }

    /* Content block */
    .content-card{
      background:#fff;
      border:1px solid var(--line);
      border-radius: 22px;
      box-shadow: var(--shadow2);
      padding:18px;
    }
    .content-card p{ color:var(--muted); line-height:1.7; margin-bottom:10px; }
    .facts{
      display:grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap:12px;
      margin-top:12px;
    }
    .fact{
      border:1px solid var(--line);
      background: linear-gradient(180deg, #ffffff, #fbfdff);
      border-radius: 18px;
      padding:12px;
    }
    .fact .k{ font-size:12px; color:var(--muted); font-weight:800; }
    .fact .v{ font-weight:950; margin-top:4px; }
    @media (max-width: 992px){
      .facts{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .deal-row{ grid-template-columns: 1.2fr .8fr; }
      .deal-row .cta{ grid-column:1 / -1; display:flex; justify-content:flex-end; }
    }

    /* Why book */
    .why-card{
      background:#fff;
      border:1px solid var(--line);
      border-radius: 22px;
      box-shadow: var(--shadow2);
      padding: 16px;
    }
    .why-grid{
      display:grid;
      grid-template-columns: repeat(5, minmax(0,1fr));
      gap:10px;
      margin-top:8px;
    }
    .why{
      border:1px solid var(--line);
      border-radius: 18px;
      padding:14px;
      height:100%;
      background: linear-gradient(180deg, #ffffff, #fbfdff);
    }
    .why i{
      font-size:22px;
      color: var(--brand-2);
    }
    .why h4{
      font-size:16px;
      font-weight:950;
      margin:10px 0 6px;
    }
    .why p{
      margin:0;
      font-size:16px;
      color:var(--muted);
      line-height:1.55;
    }
    @media (max-width: 992px){
      .why-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
    }
    @media (max-width: 576px){
      .why-grid{ grid-template-columns: 1fr; }
    }

    /* FAQ */
    .faq-wrap{
      background:#fff;
      border:1px solid var(--line);
      border-radius: 22px;
      box-shadow: var(--shadow2);
      overflow:hidden;
    }
    .faq-title{
      padding:16px;
      border-bottom:1px solid var(--line);
      display:flex; align-items:center; justify-content:space-between; gap:12px;
    }
    .faq-title h3{ margin:0; font-weight:950; }
    .accordion-button{
      font-weight:900;
    }
    .accordion-button:not(.collapsed){
      color:var(--brand-2);
      background: rgba(22,93,255,.08);
    }
    .accordion-body{ color:var(--muted); line-height:1.7; }

    /* Footer */
    footer{
      background:#0b1020;
      color:rgba(255,255,255,.78);
      margin-top:28px;
      border-top:1px solid rgba(255,255,255,.08);
      margin-bottom: 69px;
    }
    footer a{ color:rgba(255,255,255,.78); }
    footer a:hover{ color:#fff; }
    .foot-top{
      padding:28px 0 18px;
    }
    .foot-title{
      color:#fff;
      font-weight:950;
      margin-bottom:10px;
      letter-spacing:.2px;
    }
    .foot-list{ list-style:none; padding:0; margin:0; }
    .foot-list li{ padding:6px 0; }
    .foot-btm{
      border-top:1px solid rgba(255,255,255,.08);
      padding:12px 0;
      font-size:13px;
    }

    /* Modal */
    .modal-content{
      border-radius: 22px;
      border:1px solid var(--line);
      box-shadow: var(--shadow);
    }
    .modal-header{
      border-bottom:1px solid var(--line);
      padding:14px 16px;
    }
    .modal-title{
      font-weight:950;
    }
    .modal-body{ padding:16px; }
    .form-control, .form-select{
      border-radius: 14px;
      border-color: var(--line);
      padding: 10px 12px;
      font-weight:700;
    }
    .form-control:focus, .form-select:focus{
      box-shadow: 0 0 0 .25rem rgba(22,93,255,.14);
      border-color: rgba(22,93,255,.45);
    }
    .btn-primary{
      background: var(--brand);
      border:0;
      border-radius: 14px;
      font-weight:900;
      padding: 10px 14px;
    }
    .btn-outline-light{
      border-radius: 999px;
      font-weight:900;
      padding: 8px 12px;
    }
    .note{
      background: rgba(255,106,0,.10);
      border:1px solid rgba(255,106,0,.20);
      border-radius: 16px;
      padding: 10px 12px;
      font-size: 13px;
      line-height: 1.55;
    }
    .bi-whatsapp{color: #34C457; pad}
    @media (max-width: 768px) {
  .modal-dialog {
    margin: 0;
    align-items: flex-start;
    padding-top: 0;
  }
  .modal-content {
    border-radius: 0;
  }
  .hero{padding: 10px;}
}