:root {
    --ink: #12141a;
    --cream: #f4efe4;
    --teal: #3fd6c8;
    --teal-dark: #0e8f82;
    --sunset: #e8703f;
    --card-bg: #f1f1f0;
}

body {
    font-family: 'Poppins', Arial, sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.top-heading {
	height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 0 0 50px 50px;
    color: #fff;
    font-size: 30px;
    text-align: center;
    padding: 30px 0 0 0;
    background: linear-gradient(180deg, #0a1412 0%, #000000 100%);
    background-position: center 33%;
    background-size: cover;
}

.top-heading .horizon {
    position: absolute;
    left: -10%;
    right: -10%;
    top: 10%;
    height: 240px;
    background: linear-gradient(90deg, #0c2b27 0%, #12615a 22%, #1f9e8f 46%, #3fd6c8 68%, #9df3ea 88%, #e6fbf7 100%);
    filter: blur(55px);
    opacity: 0.78;
    transform: scaleX(1.1) rotate(-2deg);
    pointer-events: none;
}

.top-heading h1 {
    position: relative;
    z-index: 2;
    color: #fbfaf6;
    font-size: 34px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.top-heading p {
    position: relative;
    z-index: 2;
    color: rgba(251, 250, 246, 0.72);
    font-size: 15.5px;
    margin-top: 14px;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

h1 {
  font-weight: normal;
}

h3 {
  font-size: 24px;
  margin-bottom: 20px;
}

main {
  flex-grow: 1;
}

.section {
  padding: 50px 0;
}

@media only screen and (min-width: 1024px) {
  .section {
    padding: 100px 0;
  }
}
  
  /* ---------- BOOKING HERO (teal) ---------- */
  .book-hero{
    position:relative;
    overflow:hidden;
    background:linear-gradient(180deg,#0a1412 0%, #000000 100%);
    padding:70px 24px 90px;
    text-align:center;
  }
  .book-hero .horizon{
    position:absolute;
    left:-10%; right:-10%; top:50%;
    height:240px;
    background:linear-gradient(90deg, #0c2b27 0%, #12615a 22%, #1f9e8f 46%, #3fd6c8 68%, #9df3ea 88%, #e6fbf7 100%);
    filter:blur(55px);
    opacity:0.78;
    transform:scaleX(1.1) rotate(-2deg);
    pointer-events:none;
  }
  .book-hero h1{position:relative;z-index:2;color:#fbfaf6;font-size:34px;font-weight:700;letter-spacing:0.5px;}
  .book-hero p{position:relative;z-index:2;color:rgba(251,250,246,0.72);font-size:15.5px;margin-top:14px;max-width:520px;margin-left:auto;margin-right:auto;}

  /* ---------- BOOKING FORM ---------- */
  .book-section{max-width:800px;margin:0 auto;padding:70px 24px 110px;}
  .book-card{background:#fff;border:1px solid #ececec;border-radius:18px;padding:46px;box-shadow:0 30px 70px rgba(0,0,0,0.07);}
  .book-card h2{font-size:26px;font-weight:800;text-align:center;margin-bottom:8px;}
  .book-card .sub{text-align:center;color:#6a6d74;font-size:14.5px;margin-bottom:36px;}

  .field-label{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#9a9da4;margin:26px 0 12px;}
  .field-label:first-of-type{margin-top:0;}

  .input-row{position:relative;margin-bottom:14px;}
  .input-row svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:17px;height:17px;stroke:#0e8f82;}
  .input-row input, .input-row textarea{
    width:100%;
    padding:16px 18px 16px 48px;
    border:1.5px solid #e2e0da;
    border-radius:10px;
    font-size:15px;
    font-family:inherit;
    outline:none;
    transition:border-color .2s ease;
  }
  .input-row input:focus, .input-row textarea:focus{border-color:var(--teal);}
  .input-row textarea{resize:vertical;min-height:110px;padding-top:14px;}
  .input-row textarea + svg{top:24px;transform:none;}

  /* package cards */
  .pkg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:8px;}
  .pkg-card{position:relative;border:1.5px solid #e2e0da;border-radius:14px;padding:18px 16px;cursor:pointer;transition:border-color .2s ease, background .2s ease;}
  .pkg-card input{position:absolute;opacity:0;width:1px;height:1px;}
  .pkg-card .pkg-check{position:absolute;top:14px;right:14px;width:18px;height:18px;border-radius:50%;border:1.5px solid #d8d5cd;transition:all .2s ease;}
  .pkg-card.selected{border-color:var(--teal);background:rgba(63,214,200,0.08);}
  .pkg-card.selected .pkg-check{background:var(--teal);border-color:var(--teal);box-shadow:inset 0 0 0 3px #fff;}
  .pkg-card .pkg-name{font-weight:700;font-size:14.5px;margin-bottom:6px;padding-right:22px;}
  .pkg-card .pkg-price{font-size:12.5px;color:#0e8f82;font-weight:700;}
  .pkg-card .pkg-dur{font-size:12px;color:#9a9da4;margin-top:2px;}

  /* city pills */
  .city-grid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:8px;}
  .city-pill{position:relative;border:1.5px solid #e2e0da;border-radius:999px;padding:11px 20px;font-size:13.5px;font-weight:600;cursor:pointer;transition:all .2s ease;}
  .city-pill input{position:absolute;opacity:0;width:1px;height:1px;}
  .city-pill.selected{border-color:var(--teal);background:var(--teal);color:#08312c;}

  /* date/time */
  .dt-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:8px;}
  .dt-col label{display:block;font-size:12px;color:#9a9da4;margin-bottom:8px;font-weight:600;}
  .dt-col input, .dt-col select{
    width:100%;
    padding:14px 16px;
    border:1.5px solid #e2e0da;
    border-radius:10px;
    font-size:14.5px;
    font-family:inherit;
    outline:none;
    color:var(--ink);
    background:#fff;
    transition:border-color .2s ease;
  }
  .dt-col input:focus, .dt-col select:focus{border-color:var(--teal);}

  .consent-row{display:flex;align-items:flex-start;gap:10px;margin:28px 0 26px;}
  .consent-row input{margin-top:3px;}
  .consent-row p{font-size:12.5px;color:#9a9da4;line-height:1.6;}
  .consent-row a{color:#0e8f82;font-weight:600;}

  .send-btn{
    display:block;width:100%;padding:17px;
    background:#0e8f82;color:#fff;border:none;border-radius:999px;
    font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;
    transition:background .2s ease;
  }
  .send-btn:hover{background:#0b756a;}

  .success-panel{display:none;text-align:center;padding:20px 0;}
  .success-panel .check{width:60px;height:60px;border-radius:50%;background:var(--teal);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;}
  .success-panel h3{font-size:21px;font-weight:800;margin-bottom:10px;}
  .success-panel p{font-size:14.5px;color:#6a6d74;max-width:380px;margin:0 auto;}

  @media (max-width:900px){
    .nav-links{display:none;}
    .menu-toggle{display:flex;}
  }
  @media (max-width:640px){
    .pkg-grid{grid-template-columns:1fr;}
    .dt-row{grid-template-columns:1fr;}
    .book-card{padding:30px 22px;}
    .book-section{padding:50px 16px 80px;}
  }