
  * { margin: 0; padding: 0; box-sizing: border-box; }
  :root {
    --navy: #06142B; --navy2: #092042; --navy3: #0E2A52;
    --gold: #FFCC5E; --gold-deep: #E8A93D; --blue: #2E7CF6; --blue2: #1B5FD9;
    --ink: #12233D; --muted: #5A6B84; --pale: #F5F7FA; --line: #E3E9F2; --white: #FFFFFF;
  }
  html { scroll-behavior: smooth; }
  body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; color: var(--ink); background: var(--white); line-height: 1.6; }
  a { text-decoration: none; }
  .wrap { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
  @keyframes fadeUp { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
  .anim { animation: fadeUp .8s ease both; }
  .anim-2 { animation: fadeUp .8s .15s ease both; }
  .anim-3 { animation: fadeUp .8s .3s ease both; }

  /* ---- alert banner ---- */
.tt-banner { background: #0E2A52; color: #D7E2F2; text-align: center; font-size: 13.5px; padding: 9px 16px; line-height: 1.5; }
  .tt-banner b { color: #fff; }
  .tt-banner a { color: var(--gold); font-weight: 700; text-decoration: underline; }
  .tt-banner a:hover { color: #FFE1A1; }
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 36px; }
  .photo-tile { border-radius: 16px; overflow: hidden; border: 1px solid var(--line); box-shadow: 0 4px 18px rgba(6,20,43,.06); }
  .photo-tile .ph { height: 180px; display: flex; align-items: flex-end; padding: 16px; color: #fff; font-size: 40px; }
  .photo-tile .cap { padding: 14px 18px; font-weight: 700; font-size: 15px; }
  .photo-tile .cap small { display: block; font-weight: 600; color: var(--muted); font-size: 13px; margin-top: 2px; }
  .map-frame { width: 100%; height: 220px; border: 0; border-radius: 12px; margin-top: 18px; }
  .photo-hero { height: 150px; border-radius: 14px; background: linear-gradient(135deg, #0E2A52, #1B5FD9 55%, #FFCC5E); display: flex; align-items: flex-end; padding: 16px; color: #fff; font-weight: 700; margin-bottom: 18px; }
  @media (max-width: 900px) { .gallery { grid-template-columns: 1fr; } }
  .alert { background: var(--gold); color: #3A2A00; text-align: center; font-size: 14px; font-weight: 700; padding: 10px 16px; letter-spacing: .01em; }
  .alert span { font-weight: 600; }

  /* ---- header ---- */
  header { position: sticky; top: 0; z-index: 50; background: var(--navy); border-bottom: 1px solid rgba(255,255,255,.08); }
  .head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 24px; max-width: 1180px; margin: 0 auto; }
  .brand { color: #fff; font-weight: 800; font-size: 20px; letter-spacing: -.01em; white-space: nowrap; }
  .brand em { font-style: normal; color: var(--gold); }
  .brand small { display: block; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #9DB4D4; }
  .head nav { display: flex; gap: 26px; }
  .head nav a { color: #C9D6E8; font-size: 14.5px; font-weight: 600; }
  .head nav a:hover { color: #fff; }
  .head-cta { display: flex; align-items: center; gap: 10px; }
  .pill { display: inline-block; border-radius: 999px; padding: 11px 20px; font-weight: 700; font-size: 14.5px; border: 0; cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; white-space: nowrap; }
  .pill:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.25); }
  .pill-gold { background: var(--gold); color: #231A00; }
  .pill-blue { background: linear-gradient(135deg, #3B8BFF, var(--blue2)); color: #fff; }
  .pill-outline { background: transparent; color: #fff; border: 1.5px solid rgba(255,255,255,.55); }
  .pill-dark { background: var(--navy); color: #fff; }

  /* ---- hero ---- */
  .hero { background: linear-gradient(180deg, var(--navy) 0%, var(--navy2) 62%, #0B2547 100%); color: #fff; position: relative; overflow: hidden; }
  .hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 120px; background:
    linear-gradient(180deg, transparent, rgba(255,204,94,.06)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 120 L0 70 L60 70 L60 45 L110 45 L110 70 L180 70 L180 30 L210 30 L210 15 L230 15 L230 70 L330 70 L330 50 L400 50 L400 70 L520 70 L520 25 L560 25 L560 70 L700 70 L700 55 L760 55 L760 70 L880 70 L880 35 L920 35 L920 70 L1040 70 L1040 50 L1120 50 L1120 70 L1200 70 L1200 120 Z' fill='%23FFCC5E' fill-opacity='0.10'/%3E%3C/svg%3E") bottom/cover no-repeat; pointer-events: none; }
  .hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; padding: 72px 24px 96px; max-width: 1180px; margin: 0 auto; position: relative; z-index: 2; }
  .eyebrow { display: inline-block; background: rgba(255,204,94,.14); border: 1px solid rgba(255,204,94,.45); color: var(--gold); font-size: 12.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; border-radius: 999px; padding: 8px 16px; margin-bottom: 22px; }
  .hero h1 { font-size: clamp(42px, 5.2vw, 64px); line-height: 1.04; font-weight: 800; letter-spacing: -.02em; }
  .hero h1 .gold { background: linear-gradient(90deg, #FFE1A1, var(--gold) 55%, #F5B93F); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .hero p.lede { color: #B9CBE4; font-size: 18px; margin: 20px 0 28px; max-width: 540px; }
  .hero-ctas { display: flex; gap: 12px; flex-wrap: wrap; }
  .hero-checks { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 26px; color: #D7E2F2; font-size: 14.5px; font-weight: 600; }
  .hero-checks span::before { content: "✓ "; color: var(--gold); font-weight: 800; }
  .hero-meta { margin-top: 18px; color: #9DB4D4; font-size: 14.5px; }
  .hero-meta b { color: #fff; }
  .hero-card { background: #fff; color: var(--ink); border-radius: 20px; padding: 28px; box-shadow: 0 30px 60px rgba(0,0,0,.45); animation: floaty 6s ease-in-out infinite; }
  .hero-card .mini-nav { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line); padding-bottom: 14px; margin-bottom: 18px; }
  .hero-card .mini-nav b { font-size: 15px; }
  .hero-card .mini-nav span { font-size: 12px; font-weight: 700; color: var(--blue); background: #EAF2FE; padding: 5px 10px; border-radius: 999px; }
  .hero-card h3 { font-size: 24px; line-height: 1.25; letter-spacing: -.01em; }
  .hero-card h3 span { color: var(--gold-deep); }
  .hero-card p { color: var(--muted); font-size: 15px; margin: 10px 0 18px; }
  .chip-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
  .chip { background: var(--pale); border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; font-size: 13px; font-weight: 700; color: var(--navy2); }
  .hero-card .card-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-top: 1px solid var(--line); padding-top: 16px; }
  .hero-card .card-foot b { font-size: 17px; }
  .hero-card .card-foot small { display: block; color: var(--muted); font-size: 12.5px; font-weight: 600; }

  /* ---- trust strip ---- */
  .strip { background: var(--pale); border-bottom: 1px solid var(--line); }
  .strip .wrap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 20px; padding-bottom: 20px; }
  .strip div { font-weight: 800; font-size: 15px; color: var(--navy2); }
  .strip div span { color: var(--gold-deep); }
  .strip div small { display: block; font-weight: 600; color: var(--muted); font-size: 13px; }

  /* ---- sections ---- */
  section { padding: 72px 0; }
  .eyebrow-dark { color: var(--gold-deep); font-size: 12.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
  h2 { font-size: clamp(28px, 3.4vw, 40px); line-height: 1.15; letter-spacing: -.02em; font-weight: 800; margin: 10px 0 12px; }
  .sub { color: var(--muted); font-size: 17px; max-width: 640px; }
  .cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 36px; }
  .card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 26px; box-shadow: 0 4px 18px rgba(6,20,43,.05); transition: transform .18s ease, box-shadow .18s ease; }
  .card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(6,20,43,.12); }
  .icon { width: 48px; height: 48px; border-radius: 12px; background: linear-gradient(135deg, #FFF3D6, #FFE9B8); display: flex; align-items: center; justify-content: center; font-size: 24px; margin-bottom: 16px; }
  .card h3 { font-size: 19px; margin-bottom: 8px; }
  .card p { color: var(--muted); font-size: 15px; }
  .fine { color: var(--muted); font-size: 13.5px; margin-top: 22px; }

  /* ---- booking ---- */
  .book { background: var(--pale); }
  .book-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; margin-top: 36px; align-items: start; }
  .form-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 30px; box-shadow: 0 10px 30px rgba(6,20,43,.07); }
  .form-card h3 { font-size: 22px; margin-bottom: 6px; }
  .form-card > p { color: var(--muted); font-size: 14.5px; margin-bottom: 20px; }
  label { display: block; font-size: 13.5px; font-weight: 700; margin: 14px 0 6px; }
  input, select, textarea { width: 100%; border: 1.5px solid #D5DEEA; border-radius: 10px; padding: 12px 14px; font: inherit; font-size: 15px; background: #fff; }
  input:focus, select:focus, textarea:focus { outline: 2px solid var(--blue); border-color: var(--blue); }
  .radio-row { display: flex; gap: 8px; flex-wrap: wrap; }
  .radio-row label { margin: 0; }
  .radio-row input { position: absolute; opacity: 0; }
  .radio-row span { display: inline-block; border: 1.5px solid #D5DEEA; border-radius: 999px; padding: 8px 16px; font-size: 14px; font-weight: 700; cursor: pointer; }
  .radio-row input:checked + span { background: var(--navy); color: #fff; border-color: var(--navy); }
  .form-note { font-size: 13.5px; color: var(--muted); margin-top: 14px; }
  .thanks { display: none; background: #EAF7EE; border: 1px solid #BFE6C8; color: #1E6B34; border-radius: 10px; padding: 14px; font-weight: 600; margin-top: 16px; }
  .visit { background: var(--navy); color: #fff; border-radius: 18px; padding: 30px; }
  .visit h3 { font-size: 22px; margin-bottom: 14px; }
  .visit p { color: #B9CBE4; font-size: 15px; margin-bottom: 8px; }
  .visit p b { color: #fff; }
  .visit .pill { margin-top: 18px; }
  .svc-list { margin-top: 22px; border-top: 1px solid rgba(255,255,255,.14); padding-top: 18px; }
  .svc-list li { list-style: none; padding: 9px 0; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 15px; color: #D7E2F2; }
  .svc-list li::before { content: "✓ "; color: var(--gold); font-weight: 800; }

  /* ---- what happened ---- */
  .steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 36px; counter-reset: step; }
  .step { border: 1px solid var(--line); border-radius: 16px; padding: 26px; background: #fff; }
  .step .num { font-size: 13px; font-weight: 800; letter-spacing: .12em; color: var(--gold-deep); text-transform: uppercase; }
  .step h3 { font-size: 19px; margin: 10px 0 8px; }
  .step p { color: var(--muted); font-size: 15px; }

  /* ---- why ---- */
  .why { background: var(--pale); }
  .why .card { text-align: left; }

  /* ---- reviews placeholder ---- */
  .reviews { text-align: center; max-width: 680px; margin: 0 auto; }
  .stars { color: var(--gold-deep); font-size: 26px; letter-spacing: 4px; margin-bottom: 10px; }

  /* ---- claim ---- */
  .claim { background: linear-gradient(180deg, var(--navy), var(--navy2)); color: #fff; }
  .claim-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
  .claim h2 { color: #fff; }
  .claim p { color: #B9CBE4; font-size: 17px; }
  .price-line { margin: 22px 0; font-size: 15px; color: #D7E2F2; }
  .price-line b { color: var(--gold); font-size: 34px; }
  .price-line small { display: block; color: #9DB4D4; font-size: 13.5px; margin-top: 4px; }
  .claim .form-card { color: var(--ink); }

  footer { background: var(--navy); color: #9DB4D4; padding: 44px 0 30px; font-size: 14.5px; }
  footer .wrap { display: flex; justify-content: space-between; gap: 28px; flex-wrap: wrap; }
  footer b { color: #fff; font-size: 17px; }
  footer b em { font-style: normal; color: var(--gold); }
  footer a { color: #C9D6E8; }
  footer .disc { margin-top: 26px; border-top: 1px solid rgba(255,255,255,.1); padding-top: 18px; font-size: 13px; color: #7E93B3; }

  @media (max-width: 900px) {
    .hero-grid, .book-grid, .claim-grid { grid-template-columns: 1fr; }
    .cards, .steps { grid-template-columns: 1fr; }
    .head nav { display: none; }
    section { padding: 52px 0; }
  }
