/* ============================================================
   WATER VALLEY WATER PARK — STYLE.CSS v3.0
   Aesthetic: Sunlit Water · light sections with deep-ocean anchors
   Fonts: Exo 2 (display) · Nunito (body) · Space Grotesk (ui)

   THEMING: colours come from semantic tokens (--page, --surface,
   --ink, --text, --line, --accent). They default to the light
   palette; .dark-section / .hero / .footer redefine them, so every
   component below is written once and adapts to its section.
   ============================================================ */

/* ===== VARIABLES ===== */
:root {
  /* brand */
  --cyan:        #00d4ff;
  --cyan2:       #00b8e6;
  --teal:        #00c9b1;
  --teal2:       #009e8a;
  --blue:        #0077b6;
  --aqua:        #48cae4;
  --coral:       #ff6b35;
  --gold:        #f0a500;
  --lime:        #00a878;

  /* deep ocean (dark sections) */
  --bg:          #041426;
  --bg2:         #071d33;
  --bg3:         #0b2947;
  --navy:        #0a1f3c;
  --navy2:       #061523;

  /* absolute whites (text on coloured fills) */
  --white:       #ffffff;
  --white80:     rgba(255,255,255,.80);
  --white50:     rgba(255,255,255,.50);
  --white20:     rgba(255,255,255,.20);
  --white10:     rgba(255,255,255,.10);
  --white05:     rgba(255,255,255,.05);

  /* ---- semantic tokens: LIGHT (default) ---- */
  --page:        #f6fbfd;
  --page-alt:    #e9f4fa;

  /* fixed light values for wave dividers, which live inside dark
     sections and must not inherit the dark overrides */
  --page-light:  #f6fbfd;
  --alt-light:   #e9f4fa;
  --surface:     #ffffff;
  --surface2:    #f1f8fc;
  --line:        rgba(9,60,92,.13);
  --line-strong: rgba(0,140,190,.45);

  --ink:         #082a45;
  --text:        #3c6076;
  --text2:       #557c93;
  --text3:       #7d9aab;

  --accent:      #0b7fa8;
  --accent-soft: rgba(11,127,168,.07);
  --accent-line: rgba(11,127,168,.22);

  --shadow:      0 14px 34px rgba(9,60,92,.10);
  --shadow-lg:   0 28px 60px rgba(9,60,92,.16);
  --glow-cyan:   0 8px 28px rgba(0,150,200,.22);
  --glow-teal:   0 8px 28px rgba(0,180,160,.22);
  --glow-coral:  0 8px 28px rgba(255,107,53,.30);

  --font-d:      'Exo 2', sans-serif;
  --font-b:      'Nunito', sans-serif;
  --font-ui:     'Space Grotesk', sans-serif;

  --r:           12px;
  --r2:          20px;
  --r3:          32px;
  --t:           all .3s cubic-bezier(.4,0,.2,1);
  --max:         1200px;
  --pad:         0 24px;
}

/* ---- semantic tokens: DARK contexts ---- */
.dark-section,
.hero,
.footer,
.topbar,
.modal-box,
.popup-box,
.lightbox,
.navbar:not(.scrolled) {
  --page:        var(--bg2);
  --page-alt:    var(--bg3);
  --surface:     rgba(255,255,255,.045);
  --surface2:    rgba(255,255,255,.075);
  --line:        rgba(0,212,255,.13);
  --line-strong: rgba(0,212,255,.38);

  --ink:         #ffffff;
  --text:        rgba(214,238,250,.86);
  --text2:       rgba(190,224,242,.70);
  --text3:       rgba(160,200,220,.50);

  --accent:      var(--cyan);
  --accent-soft: rgba(0,212,255,.08);
  --accent-line: rgba(0,212,255,.22);

  --shadow:      0 20px 44px rgba(0,0,0,.38);
  --shadow-lg:   0 34px 70px rgba(0,0,0,.5);
  --glow-cyan:   0 0 36px rgba(0,212,255,.32);
  --glow-teal:   0 0 36px rgba(0,201,177,.32);
}

/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-b);background:var(--page);color:var(--text);overflow-x:hidden;line-height:1.7}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit;transition:var(--t)}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}

/* ===== PRELOAD (prevent flash) ===== */
body.preload *{animation-duration:.01ms!important;transition-duration:.01ms!important}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:var(--page-alt)}
::-webkit-scrollbar-thumb{background:var(--accent);border-radius:4px;opacity:.7}

/* ===== CONTAINER ===== */
.container{max-width:var(--max);margin:0 auto;padding:var(--pad)}

/* ===== TYPOGRAPHY ===== */
h1,h2,h3,h4,h5{font-family:var(--font-d);line-height:1.15;color:var(--ink)}
h1{font-size:clamp(2.8rem,7vw,5.5rem);font-weight:900;font-style:italic}
h2{font-size:clamp(2rem,4vw,3.2rem);font-weight:700}
h3{font-size:1.5rem;font-weight:700}
h4{font-size:1.1rem;font-weight:600}
.sec-title{color:var(--ink);margin-bottom:14px}
.sec-title.light{color:var(--ink)}
.sec-desc{color:var(--text2);font-size:1.05rem;max-width:580px}
.sec-desc.light{color:var(--text2)}
.eyebrow{
  display:inline-block;
  font-family:var(--font-ui);
  font-size:.78rem;font-weight:700;
  letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent);
  background:var(--accent-soft);
  border:1px solid var(--accent-line);
  padding:5px 16px;border-radius:100px;
  margin-bottom:14px;
}
.eyebrow.light{color:var(--accent);background:var(--accent-soft);border-color:var(--accent-line)}
.sec-header{margin-bottom:52px}
.sec-header.center{text-align:center}
.sec-header.center .sec-desc{margin:0 auto}

/* ===== SECTION BASE ===== */
.section{padding:100px 0;position:relative;background:var(--page)}
.dark-section{background:var(--bg2)}
.tint-section{background:var(--page-alt)}

/* ===== BUTTONS ===== */
.btn-primary{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 36px;border-radius:100px;
  font-family:var(--font-ui);font-size:1rem;font-weight:700;
  background:linear-gradient(135deg,var(--cyan2),var(--blue));
  color:var(--white);
  box-shadow:0 6px 22px rgba(0,119,182,.32);
  transition:var(--t);
}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,119,182,.45);color:var(--white)}
.btn-primary.btn-block{width:100%;justify-content:center}
.btn-ghost{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 36px;border-radius:100px;
  font-family:var(--font-ui);font-size:1rem;font-weight:700;
  border:2px solid rgba(255,255,255,.5);
  color:var(--white);transition:var(--t);
}
.btn-ghost:hover{background:var(--white);color:var(--navy)}
.btn-whatsapp{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 28px;border-radius:100px;
  font-family:var(--font-ui);font-size:1rem;font-weight:700;
  background:#25d366;color:var(--white);
  box-shadow:0 6px 20px rgba(37,211,102,.30);
  transition:var(--t);
}
.btn-whatsapp:hover{background:#1da851;transform:translateY(-2px);color:var(--white)}
.btn-wave{
  display:inline-flex;align-items:center;gap:8px;
  padding:16px 40px;border-radius:100px;
  font-family:var(--font-ui);font-size:1.05rem;font-weight:700;
  background:linear-gradient(135deg,var(--cyan),var(--teal));
  color:#03202e;box-shadow:0 10px 34px rgba(0,212,255,.4);transition:var(--t);
}
.btn-wave:hover{transform:translateY(-3px);box-shadow:0 14px 44px rgba(0,212,255,.6)}

/* ===== ANIMATED BUBBLES BG ===== */
.bubbles{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
}
.bubble{
  position:absolute;bottom:-100px;
  background:rgba(0,150,200,.045);
  border:1px solid rgba(0,150,200,.09);
  border-radius:50%;animation:riseUp linear infinite;
}
.bubble:nth-child(1){left:5%;width:60px;height:60px;animation-duration:18s;animation-delay:0s}
.bubble:nth-child(2){left:12%;width:30px;height:30px;animation-duration:12s;animation-delay:2s}
.bubble:nth-child(3){left:20%;width:80px;height:80px;animation-duration:22s;animation-delay:4s}
.bubble:nth-child(4){left:30%;width:40px;height:40px;animation-duration:14s;animation-delay:1s}
.bubble:nth-child(5){left:38%;width:20px;height:20px;animation-duration:10s;animation-delay:6s}
.bubble:nth-child(6){left:48%;width:70px;height:70px;animation-duration:20s;animation-delay:3s}
.bubble:nth-child(7){left:55%;width:35px;height:35px;animation-duration:15s;animation-delay:8s}
.bubble:nth-child(8){left:62%;width:55px;height:55px;animation-duration:17s;animation-delay:2s}
.bubble:nth-child(9){left:70%;width:25px;height:25px;animation-duration:11s;animation-delay:5s}
.bubble:nth-child(10){left:78%;width:90px;height:90px;animation-duration:25s;animation-delay:0s}
.bubble:nth-child(11){left:85%;width:45px;height:45px;animation-duration:16s;animation-delay:7s}
.bubble:nth-child(12){left:91%;width:30px;height:30px;animation-duration:13s;animation-delay:3s}
.bubble:nth-child(13){left:96%;width:60px;height:60px;animation-duration:19s;animation-delay:1s}
.bubble:nth-child(14){left:8%;width:42px;height:42px;animation-duration:21s;animation-delay:9s}
.bubble:nth-child(15){left:25%;width:18px;height:18px;animation-duration:9s;animation-delay:4s}
.bubble:nth-child(16){left:42%;width:100px;height:100px;animation-duration:28s;animation-delay:6s}
.bubble:nth-child(17){left:66%;width:28px;height:28px;animation-duration:12s;animation-delay:2s}
.bubble:nth-child(18){left:88%;width:50px;height:50px;animation-duration:18s;animation-delay:5s}
@keyframes riseUp{0%{transform:translateY(0) scale(1);opacity:0}10%{opacity:.9}90%{opacity:.4}100%{transform:translateY(-110vh) scale(.5);opacity:0}}

/* ===== TOPBAR ===== */
.topbar{
  position:relative;z-index:1100;
  background:linear-gradient(90deg,#04182c,#0d3a63,#04182c);
  border-bottom:1px solid rgba(0,212,255,.18);
  display:flex;align-items:center;justify-content:center;
  padding:9px 48px 9px 24px;
  font-family:var(--font-ui);font-size:.85rem;font-weight:600;
}
.topbar-inner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.topbar-dot{width:8px;height:8px;border-radius:50%;background:#00ff88;flex-shrink:0;animation:topDot 2s infinite}
@keyframes topDot{0%,100%{box-shadow:0 0 0 0 rgba(0,255,136,.6)}70%{box-shadow:0 0 0 8px rgba(0,255,136,0)}}
.topbar-text{color:rgba(212,236,250,.88)}
.topbar-cta{
  background:linear-gradient(135deg,var(--cyan),var(--teal));
  color:#03202e;padding:4px 16px;border-radius:100px;
  font-weight:800;font-size:.8rem;white-space:nowrap;
}
.topbar-cta:hover{opacity:.9}
.topbar-close{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);
  color:var(--white50);font-size:1rem;padding:4px 8px;transition:var(--t);
}
.topbar-close:hover{color:var(--white)}

/* ===== NAVBAR =====
   Transparent glass over the dark hero, white glass once scrolled. */
.navbar{
  position:fixed;left:0;right:0;z-index:1000;
  top:0;margin-top:40px;
  background:rgba(4,20,38,.55);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:var(--t);
}
.navbar.scrolled{
  margin-top:0;
  background:rgba(255,255,255,.92);
  border-bottom-color:var(--line);
  box-shadow:0 6px 28px rgba(9,60,92,.10);
}
.nav-wrap{
  max-width:var(--max);margin:0 auto;padding:0 24px;
  display:flex;align-items:center;gap:24px;height:68px;
}
.nav-logo{display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1}
.nav-logo img{height:50px;width:auto;transition:var(--t)}
.navbar:not(.scrolled) .nav-logo img{filter:drop-shadow(0 2px 10px rgba(0,0,0,.5))}
.nav-unit{
  font-family:var(--font-ui);font-size:.62rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;
  color:rgba(255,255,255,.62);transition:var(--t);
}
.navbar.scrolled .nav-unit{color:var(--text2)}
.nav-list{display:flex;align-items:center;gap:4px;flex:1}
.nav-list>li>a{
  font-family:var(--font-ui);font-size:.9rem;font-weight:600;
  color:var(--white80);padding:8px 14px;border-radius:8px;
  display:flex;align-items:center;gap:6px;transition:var(--t);
}
.nav-list>li>a:hover{color:var(--white);background:rgba(255,255,255,.12)}
.nav-list>li>a.active{color:var(--cyan)}
.navbar.scrolled .nav-list>li>a{color:var(--ink)}
.navbar.scrolled .nav-list>li>a:hover{color:var(--accent);background:var(--accent-soft)}
.navbar.scrolled .nav-list>li>a.active{color:var(--accent)}

/* Dropdown */
.has-drop{position:relative}
.dropdown{
  display:none;position:absolute;
  top:calc(100%+8px);left:0;
  background:rgba(255,255,255,.98);
  border:1px solid var(--line);
  border-radius:var(--r);min-width:210px;padding:8px;
  box-shadow:var(--shadow-lg);
  animation:ddIn .2s ease;
}
.has-drop:hover .dropdown{display:block}
@keyframes ddIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.dropdown li a{
  display:block;padding:9px 14px;
  color:#3c6076;font-size:.88rem;border-radius:6px;
  font-family:var(--font-ui);transition:var(--t);
}
.dropdown li a:hover{background:rgba(11,127,168,.08);color:#0b7fa8}

.nav-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.nav-book-btn{
  display:flex;align-items:center;gap:8px;
  padding:10px 22px;border-radius:100px;
  font-family:var(--font-ui);font-size:.9rem;font-weight:700;
  background:linear-gradient(135deg,var(--cyan2),var(--blue));
  color:var(--white);box-shadow:0 6px 18px rgba(0,119,182,.35);
  transition:var(--t);
}
.nav-book-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,119,182,.5);color:var(--white)}
.burger{display:none;flex-direction:column;gap:5px;padding:4px}
.burger span{display:block;width:24px;height:2px;background:var(--white80);border-radius:2px;transition:var(--t)}
.navbar.scrolled .burger span{background:var(--ink)}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ===== HERO (dark) ===== */
.hero{
  position:relative;min-height:100vh;overflow:hidden;
  padding-top:108px;display:flex;flex-direction:column;
  background:var(--bg);
}
.hero-slides{position:absolute;inset:0;z-index:0}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .8s ease}
.slide.active{opacity:1}
.slide-img{width:100%;height:100%;object-fit:cover}
.slide-overlay{
  position:absolute;inset:0;
  background:linear-gradient(
    115deg,
    rgba(4,20,38,.90) 0%,
    rgba(7,29,51,.72) 42%,
    rgba(0,119,182,.38) 100%
  );
}
.slide-content{
  position:absolute;inset:0;display:flex;flex-direction:column;
  justify-content:center;padding:0 5vw;max-width:850px;z-index:2;
}
.slide-eyebrow{
  display:inline-block;font-family:var(--font-ui);
  font-size:.82rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--aqua);border:1px solid rgba(72,202,228,.4);
  background:rgba(72,202,228,.10);padding:7px 20px;border-radius:100px;
  margin-bottom:18px;width:fit-content;
}
.slide-title{
  font-family:var(--font-d);font-weight:900;font-style:italic;
  font-size:clamp(3rem,8vw,6rem);color:var(--white);
  text-shadow:0 6px 44px rgba(0,0,0,.5);
  margin-bottom:28px;line-height:1;
}
.slide-btns{display:flex;gap:16px;flex-wrap:wrap}
.slider-nav{
  position:absolute;bottom:140px;left:50%;transform:translateX(-50%);
  z-index:10;display:flex;align-items:center;gap:16px;
}
.snav-btn{
  width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);
  color:var(--white);font-size:1rem;transition:var(--t);display:flex;align-items:center;justify-content:center;
}
.snav-btn:hover{background:var(--cyan);border-color:var(--cyan);color:#03202e}
.slider-dots{display:flex;gap:8px;align-items:center}
.sdot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.35);border:none;cursor:pointer;transition:var(--t);
}
.sdot.active{width:24px;border-radius:4px;background:var(--cyan)}

/* Hero stats bar */
.hero-stats-bar{
  position:absolute;bottom:40px;left:0;right:0;z-index:10;
  display:flex;justify-content:center;gap:0;
}
.hero-stats-bar{
  background:rgba(4,20,38,.72);backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r2);padding:18px 40px;
  max-width:800px;margin:0 auto;
  display:flex;align-items:center;gap:0;
}
.hsb-item{
  flex:1;text-align:center;
}
.hsb-item strong{
  display:block;font-family:var(--font-d);font-size:1.8rem;font-weight:900;
  color:var(--cyan);line-height:1;font-style:italic;
}
.hsb-item span{
  display:block;font-size:.75rem;font-weight:600;
  color:var(--white50);text-transform:uppercase;letter-spacing:.1em;
  margin-top:4px;
}
.hsb-sep{width:1px;background:rgba(255,255,255,.18);height:40px;margin:0 24px}
.hero-wave{position:absolute;bottom:0;left:0;right:0;z-index:5}
.hero-wave svg{display:block;width:100%}

/* ===== ABOUT (light) ===== */
.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.media-stack{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:12px}
.ms-main{grid-column:1/-1;height:260px;object-fit:cover;border-radius:var(--r2);box-shadow:var(--shadow-lg)}
.ms-tl,.ms-tr{height:160px;object-fit:cover;border-radius:var(--r);box-shadow:var(--shadow)}
.ms-tl{border-radius:var(--r) 0 0 var(--r)}
.ms-tr{border-radius:0 var(--r) var(--r) 0}
.about-badge{
  position:absolute;bottom:-20px;right:-20px;
  background:linear-gradient(135deg,#0b2947,var(--navy));
  border:2px solid rgba(0,212,255,.35);border-radius:var(--r2);
  padding:18px 22px;text-align:center;
  box-shadow:0 18px 44px rgba(9,40,70,.35);
}
.ab-glow{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at 50% 0%,rgba(0,212,255,.18),transparent 70%)}
.ab-icon{display:block;font-size:2rem;margin-bottom:4px}
.about-badge strong{display:block;color:var(--cyan);font-size:.95rem;font-family:var(--font-d);font-weight:700}
.about-badge span{display:block;color:rgba(255,255,255,.6);font-size:.8rem}

.about-text-col .sec-title{margin-bottom:16px}
.about-text-col p{color:var(--text);margin-bottom:14px;font-size:1.02rem}
.about-feats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0 32px}
.feat-item{display:flex;align-items:center;gap:8px;font-size:.92rem;font-weight:600;color:var(--ink)}
.fi-icon{color:var(--accent);font-size:1rem;flex-shrink:0}

/* ===== ATTRACTIONS (dark) ===== */
.attractions-sec{padding:120px 0}
.atc-wave-top,.atc-wave-bot{overflow:hidden;line-height:0}
.atc-wave-top{margin-bottom:60px}.atc-wave-bot{margin-top:60px}
.atc-wave-top svg,.atc-wave-bot svg{display:block;width:100%}
.atc-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:24px;
}
.atc-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--r2);overflow:hidden;
  transition:var(--t);position:relative;
  box-shadow:var(--shadow);
}
.atc-card:hover{
  transform:translateY(-10px);
  border-color:var(--line-strong);
  box-shadow:var(--shadow-lg);
}
.atc-featured{
  grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;
  border-color:var(--accent-line);
}
.atc-featured .atc-img-wrap{height:100%}
.atc-img-wrap{position:relative;height:230px;overflow:hidden}
.atc-img-wrap img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.atc-card:hover .atc-img-wrap img{transform:scale(1.1)}
.atc-img-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(4,20,38,.85) 0%,transparent 55%);
}
.atc-badge{
  position:absolute;top:14px;left:14px;
  font-family:var(--font-ui);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 14px;border-radius:100px;
  background:rgba(0,212,255,.22);border:1px solid rgba(0,212,255,.45);color:#9fe9ff;
  backdrop-filter:blur(6px);
}
.badge-hot{background:rgba(255,107,53,.25);border-color:rgba(255,107,53,.5);color:#ffb99e}
.badge-pop{background:rgba(240,165,0,.22);border-color:rgba(240,165,0,.5);color:#ffd98a}
.atc-thrill{
  position:absolute;bottom:12px;left:14px;
  display:flex;align-items:center;gap:6px;
}
.thrill-label{font-size:.7rem;color:var(--white50);font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.1em}
.thrill-stars{font-size:.85rem;color:#ffc93c}
.atc-body{padding:24px}
.atc-icon{font-size:2.2rem;margin-bottom:12px}
.atc-body h3{color:var(--ink);margin-bottom:10px;font-size:1.3rem}
.atc-desc{color:var(--text2);font-size:.93rem;line-height:1.65;margin-bottom:16px}
.atc-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:18px}
.atc-tags span{
  font-size:.74rem;font-weight:700;font-family:var(--font-ui);
  padding:3px 12px;border-radius:100px;
  background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--accent);
}
.atc-more-btn{
  font-family:var(--font-ui);font-size:.88rem;font-weight:700;
  color:var(--accent);display:flex;align-items:center;gap:6px;
  padding:0;background:none;border:none;cursor:pointer;transition:var(--t);
}
.atc-more-btn:hover{gap:10px;color:var(--ink)}

/* ===== GALLERY (light) ===== */
.gal-filters{display:flex;gap:10px;margin-bottom:36px;flex-wrap:wrap;justify-content:center}
.gf-btn{
  font-family:var(--font-ui);font-size:.85rem;font-weight:700;
  padding:9px 22px;border-radius:100px;border:1px solid var(--line);
  color:var(--text2);background:var(--surface);cursor:pointer;transition:var(--t);
}
.gf-btn:hover,.gf-btn.active{
  background:linear-gradient(135deg,var(--cyan2),var(--blue));
  color:var(--white);border-color:transparent;
  box-shadow:0 6px 20px rgba(0,119,182,.30);
}
.gal-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:220px;
  gap:14px;
}
.gal-item{position:relative;overflow:hidden;border-radius:var(--r);cursor:pointer;background:var(--page-alt);box-shadow:var(--shadow)}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.gal-item:hover img{transform:scale(1.08)}
.gal-wide{grid-column:span 2}
.gal-tall{grid-row:span 2}
.gal-over{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(4,20,38,.85) 0%,transparent 60%);
  opacity:0;transition:var(--t);
  display:flex;align-items:flex-end;justify-content:space-between;
  padding:16px;
}
.gal-item:hover .gal-over{opacity:1}
.gal-title{color:var(--white);font-weight:700;font-size:.95rem}
.gal-zoom{
  width:36px;height:36px;border-radius:50%;
  background:rgba(0,212,255,.25);border:1px solid rgba(0,212,255,.5);
  color:#bff2ff;font-size:1.2rem;
  display:flex;align-items:center;justify-content:center;
  transition:var(--t);
}
.gal-zoom:hover{background:var(--cyan);color:#03202e;transform:scale(1.1)}
.gal-item.hidden{display:none}

/* ===== TICKET PRICING (light tint) ===== */
.tickets-sec{background:var(--page-alt)}
.tickets-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:20px;margin-bottom:24px;
}
.ticket-card{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r2);padding:30px 24px;text-align:center;
  position:relative;transition:var(--t);overflow:hidden;
  box-shadow:var(--shadow);
  /* keep the CTA aligned across cards of differing content length */
  display:flex;flex-direction:column;
}
.ticket-card .btn-ticket{margin-top:auto}
.ticket-card .tk-desc{min-height:2.6em}
.ticket-card::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 50% 0%,rgba(0,150,200,.07),transparent 70%);
  opacity:0;transition:var(--t);
}
.ticket-card:hover{transform:translateY(-8px);border-color:var(--line-strong);box-shadow:var(--shadow-lg)}
.ticket-card:hover::before{opacity:1}
.ticket-pop{border-color:var(--line-strong);box-shadow:var(--shadow-lg)}
.pop-ribbon{
  position:absolute;top:16px;right:-28px;
  background:linear-gradient(135deg,var(--cyan2),var(--blue));
  color:var(--white);font-size:.72rem;font-weight:800;font-family:var(--font-ui);
  padding:6px 40px;transform:rotate(35deg);text-transform:uppercase;letter-spacing:.08em;
}
.tk-type{
  font-family:var(--font-ui);font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;
  color:var(--accent);margin-bottom:10px;
}
.tk-name{font-size:1.2rem;color:var(--ink);margin-bottom:16px}
.tk-price{margin-bottom:16px;line-height:1}
.tk-currency{font-size:1.5rem;color:var(--accent);font-family:var(--font-d);vertical-align:super}
.tk-amount{font-size:3.5rem;color:var(--ink);font-family:var(--font-d);font-weight:900;font-style:italic}
.tk-free{font-size:2.5rem;color:var(--lime);font-family:var(--font-d);font-weight:900;font-style:italic}
/* weekday / weekend split rate */
.tk-rates{display:flex;flex-direction:column;gap:6px}
.tk-rate{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:7px 12px;border-radius:10px;background:var(--surface2);
}
.tk-rate-label{
  font-family:var(--font-ui);font-size:.7rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--text3);
}
.tk-rate .tk-amount{font-size:1.9rem}
.tk-rate .tk-currency{font-size:1rem}
.tk-desc{color:var(--text2);font-size:.9rem;margin-bottom:24px}
.btn-ticket{
  display:block;width:100%;padding:12px;border-radius:100px;
  font-family:var(--font-ui);font-size:.9rem;font-weight:700;
  border:2px solid var(--accent-line);color:var(--accent);
  transition:var(--t);
}
.btn-ticket:hover{background:linear-gradient(135deg,var(--cyan2),var(--blue));border-color:transparent;color:var(--white)}
.tickets-note{text-align:center;color:var(--text3);font-size:.88rem}

/* ===== BOOKING (dark) ===== */
.booking-sec{background:var(--bg);position:relative;overflow:hidden}
.booking-bg-glow{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,212,255,.07) 0%,transparent 70%);
  pointer-events:none;
}
.booking-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.booking-left .sec-title{margin-bottom:14px}
.booking-left>p{color:var(--text2);margin-bottom:28px;font-size:1.02rem}
.booking-options{display:flex;flex-direction:column;gap:14px;margin-bottom:28px}
.bk-option{
  display:flex;align-items:center;gap:14px;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:16px 20px;transition:var(--t);
}
.bk-option:hover{border-color:var(--line-strong);background:var(--surface2)}
.bk-coming{border-style:dashed;opacity:.7}
.bk-ico{font-size:1.8rem;flex-shrink:0}
.bk-option strong{display:block;color:var(--ink);font-size:.95rem;margin-bottom:2px}
.bk-option p{color:var(--text2);font-size:.85rem;margin:0}
.pkg-highlights{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:20px;
}
.pkg-highlights h4{color:var(--accent);margin-bottom:12px;font-size:.92rem;font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.1em}
.ph-row{display:flex;align-items:center;gap:10px;color:var(--text2);font-size:.9rem;padding:6px 0;border-bottom:1px solid var(--line)}
.ph-row:last-child{border:none}
.ph-row span{font-size:1.1rem}

/* Notify card */
.notify-card{
  background:rgba(7,29,51,.92);
  border:1px solid rgba(0,212,255,.22);
  border-radius:var(--r3);padding:40px;
  position:relative;overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.nc-glow{
  position:absolute;top:-60px;right:-60px;
  width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,212,255,.14),transparent 70%);
}
.nc-badge{
  display:inline-block;
  background:linear-gradient(135deg,var(--cyan),var(--teal));
  color:#03202e;font-family:var(--font-ui);font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  padding:6px 18px;border-radius:100px;margin-bottom:18px;
}
.notify-card h3{color:var(--white);font-size:1.7rem;margin-bottom:12px}
.notify-card>p{color:rgba(200,230,245,.75);margin-bottom:28px;font-size:.98rem}
.notify-form .fg{margin-bottom:12px}
/* Inputs are token-driven so the same rules work on light pages
   (contact form) and inside dark sections (notify / booking). */
.notify-form input,.notify-form select,
.booking-form input,.booking-form select,.booking-form textarea,
.site-form input,.site-form select,.site-form textarea{
  width:100%;padding:13px 18px;
  border:1.5px solid var(--line);border-radius:10px;
  background:var(--surface2);
  color:var(--ink);font-family:var(--font-b);font-size:.95rem;
  transition:var(--t);
}
.notify-form input::placeholder,.booking-form input::placeholder,.site-form input::placeholder,.site-form textarea::placeholder{color:var(--text3)}
.notify-form input:focus,.notify-form select:focus,
.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus,
.site-form input:focus,.site-form select:focus,.site-form textarea:focus{
  outline:none;border-color:var(--accent);
  box-shadow:0 0 0 4px var(--accent-soft);
}
.notify-form select option,.site-form select option{background:var(--surface);color:var(--ink)}
.dark-section .notify-form select option,.dark-section .site-form select option{background:#07203a;color:#fff}
.notify-success{
  background:rgba(0,212,130,.10);border:1px solid rgba(0,212,130,.3);
  border-radius:var(--r);padding:28px;text-align:center;
}
.ns-icon{font-size:2.5rem;margin-bottom:10px}
.notify-success h4{color:#4de3ad;margin-bottom:8px}
.notify-success p{color:rgba(200,230,245,.75);font-size:.92rem}
.fg-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fg label{display:block;font-size:.82rem;font-weight:700;color:rgba(190,224,242,.8);margin-bottom:6px;font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.05em}
.booking-form-card{
  background:rgba(7,29,51,.92);border:1px solid rgba(0,212,255,.22);
  border-radius:var(--r3);padding:36px;
  box-shadow:var(--shadow-lg);
}
.bfc-header h3{color:var(--white);margin-bottom:4px}
.bfc-header p{color:rgba(200,230,245,.7);font-size:.88rem;margin-bottom:24px}
.booking-form textarea{resize:vertical;min-height:70px}

/* ===== TESTIMONIALS (light) ===== */
.testi-sec{position:relative;overflow:hidden}
.testi-bg{position:absolute;bottom:0;left:0;right:0;z-index:0;pointer-events:none}
.testi-bg svg{display:block}
.testi-slider{position:relative;min-height:300px;z-index:1}
.testi-card{
  display:none;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r2);padding:40px;max-width:780px;margin:0 auto;
  animation:fadeInCard .4s ease;
  box-shadow:var(--shadow-lg);
}
.testi-card.active{display:block}
.testi-feat{border-color:var(--line-strong)}
@keyframes fadeInCard{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.testi-stars{font-size:1.3rem;color:#f5a623;margin-bottom:18px;letter-spacing:4px}
.testi-quote{
  font-size:1.12rem;font-style:italic;color:var(--ink);line-height:1.75;
  margin-bottom:28px;position:relative;padding-left:28px;
}
.testi-quote::before{
  content:'"';position:absolute;left:0;top:-10px;
  font-size:4rem;color:var(--accent);line-height:1;opacity:.35;font-family:var(--font-d);
}
.testi-author{display:flex;align-items:center;gap:16px}
.testi-author img{width:54px;height:54px;border-radius:50%;object-fit:cover;border:2px solid var(--accent);box-shadow:var(--shadow)}
.testi-avatar{
  width:54px;height:54px;border-radius:50%;border:2px solid var(--accent);
  background:var(--accent-soft);display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;font-weight:700;color:var(--accent);
}
.testi-author strong{display:block;color:var(--ink);font-size:1rem}
.testi-author span{color:var(--text3);font-size:.85rem}
.testi-dots{display:flex;gap:10px;justify-content:center;margin-top:28px}
.tdot{
  width:10px;height:10px;border-radius:50%;
  background:var(--accent-line);transition:var(--t);
}
.tdot.active{width:28px;border-radius:5px;background:var(--accent)}

/* ===== VISIT (light tint) ===== */
.visit-sec{background:var(--page-alt)}
.visit-wave-top{overflow:hidden;line-height:0;margin-bottom:80px}
.visit-wave-top svg{display:block;width:100%}
.visit-layout{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.visit-items{display:flex;flex-direction:column;gap:20px;margin:24px 0 32px}
.vi{display:flex;align-items:flex-start;gap:14px}
.vi-icon{font-size:1.6rem;flex-shrink:0}
.vi strong{display:block;color:var(--accent);font-size:.82rem;font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.vi p{color:var(--text);font-size:.93rem;margin:0}
.vi em{color:var(--text3);font-style:italic}
.visit-link{color:var(--accent);font-weight:700}
.visit-link:hover{color:var(--blue)}
.visit-btns{display:flex;gap:14px;flex-wrap:wrap}
.map-box{border-radius:var(--r2);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-lg)}
.map-box iframe{display:block}

/* ===== FOOTER (dark) ===== */
.footer{background:var(--navy2)}
.footer-wave{overflow:hidden;line-height:0;background:var(--alt-light)}
.footer-wave svg{display:block;width:100%}
.footer-body{padding:60px 0 36px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.6fr;gap:40px}
.footer-logo{height:55px;margin-bottom:18px}
.footer-about{color:rgba(190,218,236,.65);font-size:.9rem;margin-bottom:8px}
.footer-unit{color:rgba(0,212,255,.6);font-size:.82rem;font-style:italic;margin-bottom:16px}
.footer-socials{display:flex;gap:10px}
.fs-link{
  width:38px;height:38px;border-radius:10px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.6);transition:var(--t);
}
.fs-link:hover{background:var(--cyan);border-color:var(--cyan);color:#03202e;transform:translateY(-2px)}
.footer-col h4{color:var(--white);font-size:.95rem;font-family:var(--font-ui);margin-bottom:16px}
.footer-col ul{display:flex;flex-direction:column;gap:9px}
.footer-col a{color:rgba(190,218,236,.6);font-size:.88rem;transition:var(--t)}
.footer-col a:hover{color:var(--cyan);padding-left:4px}
.footer-contact-col p{color:rgba(190,218,236,.65);font-size:.88rem;margin-bottom:9px}
.footer-contact-col a:hover{color:var(--cyan)}
.footer-alert{
  background:rgba(255,107,53,.08);border:1px solid rgba(255,107,53,.25);
  border-radius:var(--r);padding:14px;margin-top:14px;
}
.footer-alert strong{color:#ff9d80;display:block;font-size:.82rem;margin-bottom:4px}
.footer-alert p{color:rgba(220,200,190,.65);font-size:.8rem;margin:0}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding:20px 0}
.footer-bottom .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.footer-bottom p{color:rgba(190,218,236,.4);font-size:.82rem}
.fb-links{display:flex;gap:18px}
.fb-links a{color:rgba(190,218,236,.4);font-size:.8rem;transition:var(--t)}
.fb-links a:hover{color:var(--cyan)}
.admin-link{color:rgba(0,212,255,.35)!important}
.admin-link:hover{color:var(--cyan)!important}

/* ===== FLOAT CLUSTER ===== */
.float-cluster{
  position:fixed;bottom:24px;right:24px;z-index:900;
  display:flex;flex-direction:column;gap:10px;
  opacity:0;transform:translateX(60px);transition:all .4s ease;
}
.float-cluster.show{opacity:1;transform:translateX(0)}
.float-wa{
  width:50px;height:50px;border-radius:50%;
  background:#25d366;color:var(--white);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 22px rgba(37,211,102,.45);transition:var(--t);
}
.float-wa:hover{transform:scale(1.1);color:var(--white)}
.float-call{
  width:50px;height:50px;border-radius:50%;
  background:linear-gradient(135deg,var(--cyan2),var(--blue));color:var(--white);font-size:1.3rem;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 22px rgba(0,119,182,.45);transition:var(--t);
}
.float-call:hover{transform:scale(1.1)}
.float-book{
  padding:12px 18px;border-radius:100px;
  background:linear-gradient(135deg,var(--coral),#e14a2b);
  color:var(--white);font-family:var(--font-ui);font-size:.9rem;font-weight:700;
  box-shadow:0 6px 22px rgba(255,107,53,.45);transition:var(--t);text-align:center;
}
.float-book:hover{transform:translateY(-2px);color:var(--white)}
.btt{
  position:fixed;bottom:24px;left:24px;z-index:900;
  width:42px;height:42px;border-radius:12px;
  background:var(--white);border:1px solid rgba(9,60,92,.14);
  color:#0b7fa8;font-size:1.2rem;
  box-shadow:0 6px 20px rgba(9,60,92,.14);
  opacity:0;transform:translateY(20px);transition:var(--t);
}
.btt.show{opacity:1;transform:translateY(0)}
.btt:hover{background:#0b7fa8;color:var(--white)}

/* ===== ATTRACTION MODAL ===== */
.modal-backdrop{
  position:fixed;inset:0;z-index:2000;background:rgba(4,20,38,.82);
  backdrop-filter:blur(12px);display:none;align-items:center;justify-content:center;padding:20px;
}
.modal-backdrop.open{display:flex;animation:mbIn .25s ease}
@keyframes mbIn{from{opacity:0}to{opacity:1}}
.modal-box{
  background:var(--white);border:1px solid rgba(9,60,92,.12);
  border-radius:var(--r3);max-width:680px;width:100%;
  max-height:90vh;overflow-y:auto;position:relative;
  box-shadow:0 40px 100px rgba(0,0,0,.35);
  animation:mbSlide .3s ease;
}
@keyframes mbSlide{from{transform:translateY(30px)}to{transform:translateY(0)}}
.modal-close{
  position:absolute;top:16px;right:16px;z-index:10;
  width:36px;height:36px;border-radius:50%;
  background:rgba(4,20,38,.55);color:var(--white);font-size:1rem;
  display:flex;align-items:center;justify-content:center;transition:var(--t);
  backdrop-filter:blur(6px);
}
.modal-close:hover{background:var(--coral);color:var(--white)}
.modal-img{width:100%;height:300px;object-fit:cover;border-radius:var(--r3) var(--r3) 0 0}
.modal-body{padding:28px 32px}
.modal-icon{font-size:2.5rem;margin-bottom:12px}
.modal-body h3{color:#082a45;font-size:1.6rem;margin-bottom:12px}
.modal-body p{color:#3c6076;line-height:1.75;font-size:1rem}

/* ===== LIGHTBOX ===== */
.lightbox{
  position:fixed;inset:0;z-index:3000;background:rgba(4,20,38,.95);
  display:none;align-items:center;justify-content:center;
}
.lightbox.open{display:flex}
.lb-img-wrap{text-align:center;max-width:90vw}
.lb-img-wrap img{max-width:90vw;max-height:85vh;border-radius:var(--r);object-fit:contain}
.lb-img-wrap p{color:var(--white80);font-size:.9rem;margin-top:10px}
.lb-close,.lb-prev,.lb-next{
  position:absolute;
  background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);
  color:var(--white);font-size:1.3rem;
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:var(--t);
}
.lb-close:hover,.lb-prev:hover,.lb-next:hover{background:var(--cyan);color:#03202e}
.lb-close{top:20px;right:20px}
.lb-prev{left:20px;top:50%;transform:translateY(-50%)}
.lb-next{right:20px;top:50%;transform:translateY(-50%)}

/* ===== POPUP ===== */
.popup-overlay{
  position:fixed;inset:0;z-index:4000;background:rgba(4,20,38,.82);
  backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:20px;
}
.popup-overlay.open{display:flex}
.popup-box{
  background:var(--white);border:1px solid rgba(255,107,53,.3);
  border-radius:var(--r2);max-width:500px;width:100%;
  position:relative;overflow:hidden;
  box-shadow:0 40px 80px rgba(0,0,0,.4);
  animation:popIn .4s cubic-bezier(.34,1.56,.64,1);
}
@keyframes popIn{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}
.popup-close{
  position:absolute;top:12px;right:12px;z-index:10;
  width:32px;height:32px;border-radius:50%;
  background:rgba(4,20,38,.55);color:var(--white);font-size:.9rem;
  display:flex;align-items:center;justify-content:center;transition:var(--t);
  backdrop-filter:blur(6px);
}
.popup-close:hover{background:var(--coral);color:var(--white)}
.popup-img{width:100%;height:200px;object-fit:cover}
.popup-title{color:#082a45;font-size:1.3rem;padding:20px 24px 10px;font-family:var(--font-d)}
.popup-content{color:#3c6076;font-size:.95rem;padding:0 24px 20px;line-height:1.65}
.popup-content strong{color:#d1441c;font-weight:700}
.popup-actions{padding:0 24px 24px;display:flex;justify-content:flex-end}

/* ============================================================
   INNER PAGES (about / attractions / gallery / tickets /
   contact / terms / privacy / sitemap)
   ============================================================ */

/* ===== PAGE HERO ===== */
.page-hero{
  position:relative;overflow:hidden;
  padding:150px 0 90px;
  background:var(--bg);
  text-align:center;
}
.page-hero-bg{position:absolute;inset:0;z-index:0}
.page-hero-bg img{width:100%;height:100%;object-fit:cover}
.page-hero-bg::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(115deg,rgba(4,20,38,.93) 0%,rgba(7,29,51,.80) 45%,rgba(0,119,182,.45) 100%);
}
.page-hero .container{position:relative;z-index:2}
.page-hero h1{
  font-size:clamp(2.2rem,5.5vw,3.8rem);color:var(--white);
  font-style:italic;margin-bottom:14px;text-shadow:0 6px 40px rgba(0,0,0,.45);
}
.page-hero p{color:rgba(214,238,250,.85);max-width:640px;margin:0 auto;font-size:1.05rem}
.page-hero-wave{position:absolute;bottom:0;left:0;right:0;z-index:3;line-height:0}
.page-hero-wave svg{display:block;width:100%}
.breadcrumb{
  display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
  font-family:var(--font-ui);font-size:.82rem;font-weight:600;
  color:rgba(214,238,250,.6);margin-bottom:14px;
}
.breadcrumb a{color:var(--cyan)}
.breadcrumb a:hover{color:var(--white)}
.breadcrumb span{opacity:.5}

/* ===== PROSE (terms / privacy) ===== */
.prose{max-width:820px;margin:0 auto}
.prose-meta{
  font-family:var(--font-ui);font-size:.82rem;color:var(--text3);
  padding-bottom:20px;margin-bottom:28px;border-bottom:1px solid var(--line);
}
.prose h2{
  font-size:1.45rem;color:var(--ink);
  margin:36px 0 12px;padding-left:14px;border-left:4px solid var(--accent);
}
.prose h2:first-of-type{margin-top:0}
.prose h3{font-size:1.08rem;color:var(--ink);margin:22px 0 8px}
.prose p{color:var(--text);margin-bottom:14px;font-size:1rem}
.prose ul,.prose ol{margin:0 0 16px 0;padding-left:0}
.prose li{
  color:var(--text);font-size:.98rem;margin-bottom:9px;
  padding-left:26px;position:relative;
}
.prose ul li::before{
  content:'';position:absolute;left:8px;top:11px;
  width:7px;height:7px;border-radius:50%;background:var(--accent);
}
.prose ol{counter-reset:pl}
.prose ol li{counter-increment:pl}
.prose ol li::before{
  content:counter(pl);position:absolute;left:0;top:0;
  font-family:var(--font-ui);font-size:.78rem;font-weight:700;color:var(--accent);
}
.prose strong{color:var(--ink);font-weight:700}
.prose a{color:var(--accent);font-weight:600;text-decoration:underline}
.prose-note{
  background:var(--accent-soft);border:1px solid var(--accent-line);
  border-left:4px solid var(--accent);
  border-radius:var(--r);padding:16px 20px;margin:24px 0;
}
.prose-note p{margin:0;font-size:.94rem}

/* ===== ATTRACTION DETAIL ROWS ===== */
.atc-detail{
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  padding:56px 0;border-bottom:1px solid var(--line);scroll-margin-top:120px;
}
.atc-detail:last-child{border-bottom:none}
.atc-detail:nth-child(even) .atc-detail-media{order:2}
.atc-detail-media img{
  width:100%;height:380px;object-fit:cover;
  border-radius:var(--r2);box-shadow:var(--shadow-lg);
}
.atc-detail-body .atc-icon{font-size:2.6rem;margin-bottom:10px}
.atc-detail-body h2{font-size:2rem;margin-bottom:12px}
.atc-detail-lead{color:var(--text);font-size:1.06rem;font-weight:600;margin-bottom:12px}
.atc-detail-body p{color:var(--text2);margin-bottom:16px;line-height:1.75}
.atc-meta{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.atc-meta-item{
  display:flex;align-items:center;gap:7px;
  background:var(--surface2);border:1px solid var(--line);
  border-radius:100px;padding:6px 16px;
  font-family:var(--font-ui);font-size:.8rem;font-weight:600;color:var(--text);
}
.atc-meta-item strong{color:var(--ink)}

/* ===== CONTACT PAGE ===== */
.contact-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:start}
.contact-cards{display:grid;gap:16px;margin-bottom:28px}
.contact-card{
  display:flex;gap:16px;align-items:flex-start;
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r2);padding:22px;box-shadow:var(--shadow);
  transition:var(--t);
}
.contact-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--line-strong)}
.cc-icon{font-size:1.7rem;flex-shrink:0;line-height:1}
.cc-body strong{
  display:block;font-family:var(--font-ui);font-size:.76rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:5px;
}
.cc-body p{color:var(--text);font-size:.95rem;margin:0;line-height:1.6}
.cc-body a{color:var(--text)}
.cc-body a:hover{color:var(--accent)}
.contact-form-card{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r3);padding:34px;box-shadow:var(--shadow-lg);
}
.contact-form-card h3{margin-bottom:6px}
.contact-form-card>p{color:var(--text2);font-size:.92rem;margin-bottom:24px}
.site-form .fg{margin-bottom:14px}
.site-form label{
  display:block;font-size:.8rem;font-weight:700;color:var(--text2);
  margin-bottom:6px;font-family:var(--font-ui);text-transform:uppercase;letter-spacing:.05em;
}
.site-form textarea{resize:vertical;min-height:120px}
.form-msg{
  border-radius:var(--r);padding:14px 18px;margin-bottom:16px;
  font-size:.92rem;font-weight:600;display:none;
}
.form-msg.show{display:block}
.form-msg.ok{background:rgba(0,168,120,.10);border:1px solid rgba(0,168,120,.35);color:#0a7a58}
.form-msg.err{background:rgba(255,107,53,.10);border:1px solid rgba(255,107,53,.35);color:#c2410c}
.dark-section .form-msg.ok{color:#4de3ad}
.dark-section .form-msg.err{color:#ffb99e}

/* ===== PARK RULES ===== */
.rules-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.rule-card{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r2);padding:24px;box-shadow:var(--shadow);
}
.rule-card .rule-ico{font-size:1.8rem;margin-bottom:10px}
.rule-card h4{color:var(--ink);margin-bottom:8px;font-size:1.02rem}
.rule-card p{color:var(--text2);font-size:.9rem;margin:0;line-height:1.65}

/* ===== SITEMAP ===== */
.sitemap-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
.sitemap-col{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r2);padding:26px;box-shadow:var(--shadow);
}
.sitemap-col h3{
  font-size:1.05rem;color:var(--ink);margin-bottom:16px;
  padding-bottom:12px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:9px;
}
.sitemap-col ul{display:flex;flex-direction:column;gap:10px}
.sitemap-col a{color:var(--text);font-size:.94rem;display:flex;align-items:center;gap:8px}
.sitemap-col a:hover{color:var(--accent);transform:translateX(3px)}
.sitemap-col a::before{content:'→';color:var(--accent);font-size:.85rem}

/* ===== SECTION LINK-OUT CTA ===== */
.sec-more{display:flex;justify-content:center;margin-top:40px}

/* ===== SCROLL REVEAL ===== */
[data-reveal]{opacity:0;transition:opacity .7s ease,transform .7s ease}
[data-reveal="up"]{transform:translateY(40px)}
[data-reveal="left"]{transform:translateX(-40px)}
[data-reveal="right"]{transform:translateX(40px)}
[data-reveal].revealed{opacity:1;transform:none}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  .about-layout,.booking-layout,.visit-layout,.contact-layout{grid-template-columns:1fr;gap:48px}
  .atc-detail{grid-template-columns:1fr;gap:32px;padding:44px 0}
  .atc-detail:nth-child(even) .atc-detail-media{order:0}
  .atc-detail-media img{height:300px}
  .page-hero{padding:130px 0 76px}
  .atc-featured{grid-column:span 1;display:block}
  .atc-featured .atc-img-wrap{height:230px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
  .media-stack{display:none}
  .gal-grid{grid-template-columns:1fr 1fr 1fr;grid-auto-rows:180px}
  .gal-wide{grid-column:span 2}
  .gal-tall{grid-row:span 2}
}
@media(max-width:768px){
  .section{padding:70px 0}
  .nav-list{
    display:none;position:fixed;inset:0;top:0;
    background:rgba(255,255,255,.98);
    flex-direction:column;justify-content:center;align-items:center;gap:20px;z-index:99;
  }
  .nav-list.open{display:flex}
  .nav-list>li>a,.navbar.scrolled .nav-list>li>a{font-size:1.2rem;color:#082a45}
  .nav-list>li>a:hover{background:rgba(11,127,168,.08);color:#0b7fa8}
  .dropdown{position:static;display:none!important}
  .burger{display:flex}
  .navbar{margin-top:36px}
  /* keep the book button on one line beside the burger */
  .nav-book-btn{padding:9px 16px;font-size:.82rem;white-space:nowrap}
  .nav-book-btn svg{display:none}
  .nav-wrap{gap:12px}
  .hero-stats-bar{display:none}
  .slide-title{font-size:clamp(2.2rem,8vw,3.5rem)}
  .gal-grid{grid-template-columns:1fr 1fr;grid-auto-rows:160px}
  .gal-wide{grid-column:span 2}
  .gal-tall{grid-row:span 1}
  .tickets-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom .container{flex-direction:column;text-align:center}
  .about-feats{grid-template-columns:1fr}
  .page-hero{padding:112px 0 64px}
  .page-hero h1{font-size:clamp(1.9rem,7vw,2.6rem)}
  .atc-detail-media img{height:240px}
  .contact-form-card,.sitemap-col,.rule-card{padding:22px}
  .prose h2{font-size:1.25rem}
  .nav-unit{font-size:.55rem;letter-spacing:.1em}
}
@media(max-width:480px){
  .slide-btns{flex-direction:column;align-items:flex-start}
  .btn-wave,.btn-ghost{width:100%;justify-content:center}
  .gal-grid{grid-template-columns:1fr;grid-auto-rows:200px}
  .gal-wide{grid-column:span 1}
  .tickets-grid{grid-template-columns:1fr}
  .hero-stats-bar{display:none}
  .booking-layout{grid-template-columns:1fr}
  /* roomier cards on small screens */
  .notify-card,.booking-form-card,.testi-card{padding:24px}
  .contact-form-card{padding:20px}
  .ticket-card{padding:24px 18px}
  .fg-row{grid-template-columns:1fr}
  .sec-more{flex-direction:column;align-items:stretch}
  .sec-more .btn-primary,.sec-more .btn-wave,.sec-more .btn-ticket{width:100%;justify-content:center;text-align:center}
  .container{padding:0 18px}
  .atc-detail-body h2{font-size:1.5rem}
  .tk-amount{font-size:2.8rem}
  .tk-rate .tk-amount{font-size:1.6rem}
  .visit-btns,.slide-btns{width:100%}
  .visit-btns .btn-primary,.visit-btns .btn-whatsapp{width:100%;justify-content:center}
  .breadcrumb{font-size:.75rem}
  .float-cluster{bottom:16px;right:16px}
  .btt{bottom:16px;left:16px}
}