/* Creative splash styles for Rus 'n Bietjie Resort */
:root{
  --accent:#ff7a59;
  --accent-2:#ffd27f;
  --bg:#0b3a47;
  --muted:#f4f4f4;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Poppins,system-ui,Segoe UI,Arial,sans-serif;color:var(--bg);background:linear-gradient(180deg,#f8fafc 0%,#fff 100%)}
.hero{position:relative;height:78vh;min-height:480px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(0.6) saturate(1.05);transform:scale(1.05)}
.overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(11,58,71,0.2) 0%, rgba(255,122,89,0.12) 60%)}
.hero-content{position:relative;z-index:2;text-align:center;color:white;padding:2rem;max-width:980px}
.brand{font-family:Lora,serif;font-size:clamp(2.2rem,5vw,4rem);margin:0 0 .25rem 0;letter-spacing:0.6px}
.tagline{font-size:1.1rem;margin:0 0 1.25rem 0;opacity:0.95}
.cta-row{display:flex;gap:1rem;justify-content:center;margin-bottom:0.75rem}
.btn{display:inline-block;padding:0.65rem 1.25rem;border-radius:999px;text-decoration:none;font-weight:600}
.btn-primary{background:linear-gradient(90deg,var(--accent),var(--accent-2));color:white;box-shadow:0 6px 18px rgba(12,40,55,0.18);transform:translateY(0);transition:transform .18s ease,box-shadow .18s ease}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 18px 32px rgba(12,40,55,0.22)}
.btn-ghost{background:rgba(255,255,255,0.12);border:1px solid rgba(255,255,255,0.18);color:white}
.meta{font-size:0.85rem;opacity:0.92}
.wave{position:absolute;left:0;right:0;bottom:-1px;height:80px;z-index:2}

.panel{padding:4rem 1.25rem;max-width:900px;margin:0 auto;text-align:center}
.panel h2{font-family:Lora,serif;margin:0 0 .5rem 0;color:var(--bg)}
.panel p{color:#334e52;line-height:1.6}
.panel.alt{background:linear-gradient(180deg,#fff 0%,#fbfbfb 100%)}
.site-footer{text-align:center;padding:2rem 1rem;color:#6b6b6b}

.contact-number{margin-top:1rem;font-weight:600;color:#204244}
.contact-number a{color:var(--accent);text-decoration:none}

/* small decorative animations */
@keyframes floatY{0%{transform:translateY(0)}50%{transform:translateY(-6px)}100%{transform:translateY(0)}}
.brand{animation:floatY 6s ease-in-out infinite}

/* responsive tweaks */
@media(min-width:980px){.hero{height:82vh}.hero-content{text-align:left;padding-left:8vw;max-width:56%}}
@media(max-width:560px){.cta-row{flex-direction:column}.btn{width:100%}}