/*
Theme Name: Koralle Beauty
Theme URI: https://koralle.beauty/
Author: A.M.
Description: Luxus Beauty, ultraschnelles und SEO-optimiertes Theme für Koralle Beauty.
Version: 2.0
License: MIT
*/

/* =============================================
   CSS CUSTOM PROPERTIES
   ============================================= */
:root {
  --gold: #cdb28e;
  --gold-light: #fffbe6;
  --gold-dark: #b89b6d;
  --gold-medium: #e5d8c1;
  --bg-dark: #181818;
  --bg-mid: #232323;
  --bg-card: #222021;
  --text-cream: #fffbe6;
  --text-light: #e5d8c1;
  --green-wa: #25D366;
  --border-gold: rgba(205,178,142,0.3);
  --shadow-gold: 0 6px 24px 0 rgba(205,178,142,0.4),0 2px 8px 0 rgba(255,251,230,0.29);
  --trans: all 0.2s ease;
}

/* RESET */
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }
body { margin:0; padding:0; font-family:system-ui,-apple-system,sans-serif; font-size:1rem; line-height:1.6; color:#fff; background:var(--bg-dark); min-height:100vh; }
a { color:var(--gold); text-decoration:none; }
a:hover { text-decoration:underline; }
img { max-width:100%; height:auto; display:block; }
h1,h2,h3,h4,h5,h6 { margin:0; }
ul,ol { margin:0; padding:0; }
button { cursor:pointer; }

/* =============================================
   SITE HEADER
   ============================================= */
.site-header {
  position:sticky; top:0; z-index:50; width:100%;
  background:rgba(22,21,21,0.9); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--bg-mid);
}
.site-header .inner {
  max-width:64rem; margin:0 auto; display:flex;
  align-items:center; justify-content:space-between;
  padding:1rem 1.5rem;
}
.header-logo img { height:60px; width:80px; object-fit:contain; display:block; }

.header-nav { display:none; gap:2rem; font-size:1rem; font-weight:500; align-items:center; }
.header-nav a { color:#fff; transition:color .2s; }
.header-nav a:hover { color:var(--gold); text-decoration:none; }

.btn-book {
  display:none; margin-left:1rem; padding:.5rem 1rem;
  border-radius:1rem; background:linear-gradient(to top right,var(--gold),#fff);
  color:var(--bg-dark); font-weight:700; font-size:.875rem;
  border:1px solid var(--gold); white-space:nowrap;
  transition:var(--trans); text-decoration:none;
}
.btn-book:hover { transform:scale(1.05); text-decoration:none; color:var(--bg-dark); }

.mobile-icons { display:flex; align-items:center; gap:.75rem; }

.btn-book-mobile {
  display:inline-block; padding:.5rem 1rem; border-radius:.75rem;
  background:linear-gradient(to top right,var(--gold),#fff);
  color:var(--bg-dark); font-weight:700; font-size:.875rem;
  border:1px solid var(--gold); white-space:nowrap;
  transition:var(--trans); text-decoration:none;
}
.btn-book-mobile:hover { transform:scale(1.05); color:var(--bg-dark); text-decoration:none; }

.menu-toggle-btn { background:none; border:none; color:var(--gold); font-size:1.875rem; padding:.25rem; cursor:pointer; }

/* MOBILE MENU */
.mobile-menu {
  display:none; position:fixed; inset:0; z-index:40;
  background:rgba(0,0,0,0.95); backdrop-filter:blur(8px);
  flex-direction:column; align-items:center; justify-content:center;
  gap:2rem; font-size:1.25rem; font-weight:600;
}
.mobile-menu.is-open { display:flex; }
.mobile-menu a { color:var(--gold); text-decoration:none; }
.mobile-menu a:hover { text-decoration:underline; }
.mobile-menu-close { position:absolute; top:1.5rem; right:2rem; background:none; border:none; color:var(--gold); font-size:2rem; cursor:pointer; }
.btn-book-menu {
  padding:.75rem 2rem; background:linear-gradient(to top right,var(--gold),#fff);
  color:var(--bg-dark); border-radius:1rem; font-weight:700; font-size:1.125rem; text-decoration:none;
}

/* SEARCH OVERLAY */
.search-overlay { display:none; position:fixed; inset:0; z-index:50; background:rgba(0,0,0,0.95); backdrop-filter:blur(8px); align-items:center; justify-content:center; }
.search-overlay.is-open { display:flex; }
.search-form { display:flex; align-items:center; width:91.666%; max-width:24rem; position:relative; }
.search-input { border-radius:1rem; padding:1rem 1.25rem; background:rgba(35,35,35,0.9); border:1px solid var(--gold); outline:none; color:var(--text-cream); font-size:1.25rem; width:100%; }
.search-input::placeholder { color:#b9a98c; }
.search-submit { position:absolute; right:.5rem; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--gold); cursor:pointer; }
.search-close-btn { position:absolute; left:100%; margin-left:1rem; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--gold); font-size:2rem; cursor:pointer; }

/* =============================================
   HERO
   ============================================= */
.hero-section {
  position:relative; width:100%; min-height:70vh;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; background-color:var(--bg-dark);
  background-size:cover; background-position:center;
}
.hero-overlay { position:absolute; inset:0; background:rgba(0,0,0,0.8); z-index:0; }
.hero-svg { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:10; mix-blend-mode:lighten; }
.hero-accent { position:absolute; left:50%; top:18%; width:11rem; height:.5rem; border-radius:9999px; background:linear-gradient(to right,var(--gold),var(--text-cream)); filter:blur(12px); opacity:.7; transform:translateX(-50%); z-index:20; }
.hero-content { position:relative; z-index:30; display:flex; flex-direction:column; align-items:center; text-align:center; padding:4rem 1.25rem 0; width:100%; }
.hero-title { color:#fff; font-weight:900; font-size:1.875rem; line-height:1.25; letter-spacing:-2px; margin-bottom:1.5rem; }
.hero-title .gold-glow { color:var(--gold); filter:drop-shadow(0 2px 32px rgba(205,178,142,.53)); }
.hero-subtitle { color:var(--gold); font-size:1rem; margin-bottom:2rem; font-weight:300; padding:0 1rem; max-width:36rem; }

/* =============================================
   BUTTONS
   ============================================= */
.btn-primary {
  display:inline-block; padding:.75rem 2rem; border-radius:1rem;
  background:linear-gradient(to right,var(--gold),var(--text-cream));
  color:var(--bg-dark); font-weight:700; font-size:1rem;
  border:1px solid var(--gold); transition:var(--trans); text-decoration:none;
}
.btn-primary:hover { transform:scale(1.05); text-decoration:none; color:var(--bg-dark); }

.btn-primary-lg { padding:1rem 2.5rem; font-size:1.125rem; }

.btn-outline {
  display:inline-block; padding:.75rem 1.5rem; border-radius:1rem;
  border:2px solid var(--gold); color:var(--gold); font-weight:700;
  font-size:.875rem; transition:var(--trans); text-decoration:none; background:transparent;
}
.btn-outline:hover { background:rgba(205,178,142,.1); text-decoration:none; color:var(--gold); }

.btn-round {
  display:inline-block; padding:.5rem 1.5rem; border-radius:9999px;
  background:linear-gradient(to top right,var(--gold),#fff3c5);
  color:var(--bg-dark); font-weight:700; border:none;
  transition:var(--trans); text-decoration:none;
}
.btn-round:hover { transform:scale(1.05); text-decoration:none; color:var(--bg-dark); }

.btn-instagram {
  display:inline-block; padding:1.25rem 4rem; border-radius:1rem;
  color:#fff; font-weight:800; font-size:1.5rem;
  background:linear-gradient(90deg,#f58529 0%,#dd2a7b 35%,#8134af 65%,#515bd4 100%);
  border:0; transition:var(--trans); text-decoration:none;
  animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite;
}
.btn-instagram:hover { transform:scale(1.05); text-decoration:none; color:#fff; }

.btn-whatsapp {
  flex:1; display:flex; align-items:center; justify-content:center;
  gap:.75rem; padding:.75rem 1.5rem; border-radius:1rem;
  background:var(--green-wa); color:#fff; font-weight:700;
  border:1px solid var(--green-wa); font-size:1.125rem;
  transition:var(--trans); text-decoration:none;
}
.btn-whatsapp:hover { transform:scale(1.05); text-decoration:none; color:#fff; }

.btn-insta-dm {
  flex:1; display:flex; align-items:center; justify-content:center;
  gap:.75rem; padding:.75rem 1.5rem; border-radius:1rem;
  background:linear-gradient(90deg,#f58529,#dd2a7b 50%,#8134af);
  color:#fff; font-weight:700; border:1px solid #E1306C;
  font-size:1.125rem; transition:var(--trans); text-decoration:none;
}
.btn-insta-dm:hover { transform:scale(1.05); text-decoration:none; color:#fff; }

/* =============================================
   CARDS & SECTIONS
   ============================================= */
.card-dark {
  background:var(--bg-card); border-radius:1rem; padding:1.5rem;
  border:1px solid var(--border-gold);
}

.card-gold-border {
  background:linear-gradient(to bottom right,var(--bg-mid),var(--bg-dark));
  border-radius:1.5rem; border:1px solid rgba(205,178,142,.6);
  box-shadow:0 25px 50px rgba(0,0,0,.5);
}

.bestseller-card {
  background:linear-gradient(to bottom right,var(--bg-mid),#1a1a1a);
  border-radius:1.5rem; box-shadow:0 25px 50px rgba(0,0,0,.5);
  border:1px solid var(--gold);
  display:flex; flex-direction:column; align-items:center;
  overflow:hidden; position:relative;
}

/* Price cards */
.price-card {
  background:var(--bg-dark); border-radius:1.5rem;
  border:1px solid rgba(205,178,142,.6);
  box-shadow:0 25px 50px rgba(0,0,0,.5);
  padding:2rem; display:flex; flex-direction:column;
  align-items:center; position:relative; overflow:hidden;
  transition:transform .2s;
}
.price-card:hover { transform:scale(1.05); }
.price-card-badge {
  position:absolute; top:1rem; right:1rem;
  background:var(--gold); color:#000; font-size:.75rem;
  font-weight:700; padding:.25rem 1rem; border-radius:9999px;
  transition:transform .2s;
}
.price-card:hover .price-card-badge { transform:scale(1.1); }
.price-img-wrap { width:7rem; height:7rem; border-radius:50%; border:4px solid var(--gold); overflow:hidden; margin-bottom:1.5rem; }
.price-img-wrap img { width:100%; height:100%; object-fit:cover; }
.price-card h3 { font-size:1.5rem; font-weight:800; color:#fff; margin-bottom:.5rem; text-align:center; }
.price-card .price-sub { color:var(--gold); font-weight:500; margin-bottom:1rem; text-align:center; }
.price-card ul { color:#eee; margin-bottom:1.5rem; font-size:.875rem; width:100%; list-style:none; padding:0; }
.price-card ul li { margin-bottom:.5rem; }

/* Treatment grid cards (beandlungen.php) */
.treatment-card {
  position:relative; background:var(--bg-dark); border-radius:1.5rem;
  overflow:hidden; border:1px solid rgba(205,178,142,.2);
  transition:border-color .5s, transform .5s;
  display:flex; flex-direction:column;
}
.treatment-card:hover { border-color:rgba(205,178,142,.5); transform:translateY(-.5rem); }

.treatment-img-wrap { position:relative; overflow:hidden; }
.treatment-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.treatment-card:hover .treatment-img-wrap img { transform:scale(1.1); }
.treatment-img-wrap .grad-overlay { position:absolute; inset:0; background:linear-gradient(to top,var(--bg-dark),transparent,transparent); opacity:.6; }

.treatment-badge-top { position:absolute; top:1rem; left:1rem; }
.treatment-tag-hover { position:absolute; top:1rem; right:1rem; opacity:0; transition:opacity .3s; }
.treatment-card:hover .treatment-tag-hover { opacity:1; }

.badge-gold { display:inline-block; padding:.25rem .75rem; background:var(--gold); color:var(--bg-dark); font-size:.75rem; font-weight:700; border-radius:9999px; }
.badge-glass { display:inline-block; padding:.25rem .75rem; background:rgba(255,255,255,.1); backdrop-filter:blur(8px); color:#fff; font-size:.75rem; border-radius:9999px; border:1px solid rgba(255,255,255,.2); }

.treatment-body { padding:1.5rem; flex:1; display:flex; flex-direction:column; }
.treatment-body h3 { font-size:1.25rem; font-weight:700; color:#fff; margin-bottom:.5rem; transition:color .2s; }
.treatment-card:hover .treatment-body h3 { color:var(--gold); }
.treatment-body p { color:var(--text-light); font-size:.875rem; margin-bottom:1rem; flex:1; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.treatment-actions { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }

.btn-treat {
  display:block; padding:.625rem 1rem; border-radius:.75rem;
  background:var(--gold); color:var(--bg-dark); font-size:.875rem;
  font-weight:600; text-align:center; transition:var(--trans); text-decoration:none;
}
.btn-treat:hover { background:var(--gold-dark); text-decoration:none; color:var(--bg-dark); }

.btn-treat-outline {
  display:block; padding:.625rem 1rem; border-radius:.75rem;
  border:1px solid rgba(205,178,142,.5); color:var(--gold);
  font-size:.875rem; font-weight:600; text-align:center;
  transition:var(--trans); text-decoration:none; background:transparent;
}
.btn-treat-outline:hover { background:rgba(205,178,142,.1); text-decoration:none; color:var(--gold); }

/* =============================================
   FILTER BUTTONS
   ============================================= */
.filter-btn {
  padding:.5rem 1.5rem; border-radius:9999px;
  border:1px solid rgba(205,178,142,.3); font-size:.875rem;
  color:var(--gold); background:transparent; cursor:pointer;
  transition:background-color .3s, color .3s;
}
.filter-btn.active, .filter-btn:hover { background:var(--gold); color:var(--bg-dark); border-color:var(--gold); }

/* =============================================
   REVIEW SLIDER
   ============================================= */
.review-slider-wrap { position:relative; }
.review-slider-container { overflow:hidden; }
.review-slider-track { display:flex; transition:transform .5s ease; }
.review-slide { min-width:100%; padding:0 .5rem; }

.review-card { background:var(--bg-mid); border-radius:1rem; box-shadow:0 20px 25px rgba(0,0,0,.4); padding:2rem; display:flex; flex-direction:column; height:100%; }
.review-name { font-weight:700; color:#fff; font-size:1.125rem; margin-bottom:.25rem; }
.review-stars { display:flex; align-items:center; gap:.25rem; margin-bottom:.25rem; }
.review-source { font-size:.75rem; color:var(--gold); display:flex; align-items:center; gap:.25rem; margin-bottom:.75rem; }
.review-text { color:#ececec; font-size:1rem; margin-bottom:.75rem; flex:1; }
.review-verify { font-size:.75rem; color:#aaa; margin-top:auto; }

.slider-dots { display:flex; justify-content:center; gap:.5rem; margin-top:1.5rem; }
.slider-dot { width:.75rem; height:.75rem; border-radius:50%; background:rgba(205,178,142,.6); border:none; cursor:pointer; transition:background .2s; }
.slider-dot.active, .slider-dot:hover { background:var(--gold); }

/* =============================================
   BEFORE/AFTER SLIDER
   ============================================= */
.slider-container { position:relative; width:100%; max-width:400px; margin:auto; }
.slider-img { display:block; width:100%; border-radius:1rem; }
.slider-overlay { position:absolute; top:0; left:0; height:100%; width:50%; overflow:hidden; border-radius:1rem; }
.slider-handle { position:absolute; top:0; left:50%; width:4px; height:100%; background:var(--gold); cursor:ew-resize; z-index:10; border-radius:2px; transition:background .2s; }
.slider-handle:hover { background:var(--text-light); }
.slider-circle { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:32px; height:32px; background:var(--gold); border-radius:50%; box-shadow:0 2px 8px rgba(0,0,0,.2); display:flex; align-items:center; justify-content:center; color:var(--bg-dark); font-weight:bold; }

/* =============================================
   VIDEO
   ============================================= */
.video-play-btn {
  position:absolute; inset:0; margin:auto; width:3.5rem; height:3.5rem;
  border-radius:50%; background:rgba(205,178,142,.8);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 15px rgba(0,0,0,.4); transition:transform .2s;
  border:none; cursor:pointer;
}
.video-play-btn:hover { transform:scale(1.05); }

/* =============================================
   CONTENT (Blog/Single)
   ============================================= */
.content-single { color:var(--text-light); line-height:1.8; font-size:1.125rem; }
.content-single > * { margin-bottom:1.5rem; }
.content-single h2 { color:var(--gold); font-size:1.875rem; font-weight:700; margin-top:2.5rem; margin-bottom:1rem; }
.content-single h3 { color:var(--text-cream); font-size:1.5rem; font-weight:600; margin-top:2rem; margin-bottom:.75rem; }
.content-single p { margin-bottom:1.5rem; }
.content-single a { color:var(--gold); font-weight:600; }
.content-single a:hover { text-decoration:underline; }
.content-single strong, .content-single b { color:var(--gold); }
.content-single ul, .content-single ol { margin-bottom:1.5rem; padding-left:1.5rem; }
.content-single li { margin-bottom:.5rem; }
.content-single ul li { list-style-type:disc; }
.content-single ol li { list-style-type:decimal; }
.content-single li::marker { color:var(--gold); }
.content-single blockquote { border-left:4px solid var(--gold); padding:1.5rem 1rem 1.5rem 2rem; margin:2rem 0; background:rgba(35,32,33,.5); border-radius:0 1rem 1rem 0; font-style:italic; color:var(--gold); }
.content-single img { border-radius:1rem; margin:2rem 0; box-shadow:0 20px 25px rgba(0,0,0,.3); }
.content-single hr { border:none; border-top:1px solid rgba(205,178,142,.3); margin:2.5rem 0; }

/* Page prose */
.prose-koralle { color:var(--text-light); line-height:1.8; font-size:1.125rem; }
.prose-koralle h2 { color:var(--gold); font-size:1.875rem; font-weight:700; margin:2rem 0 1rem; }
.prose-koralle h3 { color:var(--text-cream); font-size:1.5rem; font-weight:600; margin:1.5rem 0 .75rem; }
.prose-koralle p { margin-bottom:1.5rem; }
.prose-koralle a { color:var(--gold); font-weight:600; }
.prose-koralle a:hover { text-decoration:underline; }
.prose-koralle strong { color:var(--gold); }
.prose-koralle ul, .prose-koralle ol { margin-bottom:1.5rem; padding-left:1.5rem; }
.prose-koralle li { margin-bottom:.5rem; list-style-type:disc; }
.prose-koralle li::marker { color:var(--gold); }
.prose-koralle blockquote { border-left:4px solid var(--gold); padding:1rem 1rem 1rem 1.5rem; margin:2rem 0; background:rgba(35,35,35,.5); border-radius:0 .75rem .75rem 0; font-style:italic; color:rgba(205,178,142,.9); }
.prose-koralle img { border-radius:1rem; margin:2rem 0; box-shadow:0 20px 25px rgba(0,0,0,.3); }
.prose-koralle hr { border:none; border-top:1px solid rgba(205,178,142,.3); margin:3rem 0; }

/* =============================================
   WHATSAPP CHATHEAD
   ============================================= */
#koralle-whatsapp-chathead { position:fixed; bottom:32px; right:32px; z-index:9999; display:flex; align-items:center; text-decoration:none; background:none; }
.chathead-pic { position:relative; width:64px; height:64px; min-width:64px; border-radius:50%; overflow:hidden; box-shadow:0 6px 32px rgba(0,0,0,.67); border:3px solid var(--gold); background:var(--text-cream); display:flex; align-items:center; justify-content:center; transition:transform .2s, box-shadow .2s; }
.chathead-bg { width:100%; height:100%; object-fit:cover; filter:brightness(.88) contrast(1.03); }
.chathead-logo { position:absolute; bottom:7px; right:7px; width:24px; height:24px; background:rgba(255,251,230,.8); border-radius:50%; padding:2px; z-index:2; }
.chathead-text { margin-left:18px; background:rgba(35,35,35,.88); color:var(--gold); font-weight:700; font-size:1.12rem; border-radius:18px; padding:12px 20px; letter-spacing:.02em; white-space:nowrap; transition:background .2s, color .2s; }
#koralle-whatsapp-chathead:hover .chathead-text { background:var(--gold); color:#232323; }
#koralle-whatsapp-chathead:hover .chathead-pic { box-shadow:0 2px 16px var(--gold),0 8px 32px rgba(24,24,24,.63); transform:scale(1.06); }

/* =============================================
   COOKIE BANNER
   ============================================= */
#kb { display:none; position:fixed; bottom:0; left:0; right:0; z-index:999999; background:#1a1610; border-top:2px solid #c49c56; padding:20px 30px; font-family:sans-serif; }
.kb-inner { max-width:1200px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.kb-text { flex:1; min-width:260px; }
.kb-title { color:#f5efe0; font-weight:700; font-size:15px; margin-bottom:6px; }
.kb-desc { color:rgba(245,239,224,.55); font-size:13px; line-height:1.6; margin:0; }
.kb-desc a { color:#c49c56; }
.kb-btns { display:flex; gap:10px; flex-wrap:wrap; }
.kb-accept { background:linear-gradient(135deg,#c49c56,#e8c87a); color:#0d0d0b; border:none; padding:12px 24px; font-weight:700; font-size:13px; cursor:pointer; border-radius:3px; letter-spacing:.05em; }
.kb-necessary { background:transparent; color:rgba(245,239,224,.6); border:1px solid rgba(196,156,86,.3); padding:12px 24px; font-weight:600; font-size:13px; cursor:pointer; border-radius:3px; letter-spacing:.05em; }

/* =============================================
   PAGINATION
   ============================================= */
.pagination-wrap { display:flex; justify-content:center; margin-top:4rem; }
.pagination-wrap ul { display:flex; gap:1rem; list-style:none; padding:0; margin:0; }
.page-numbers { min-width:42px; height:42px; display:flex; align-items:center; justify-content:center; border-radius:14px; font-weight:700; font-size:14px; border:1px solid rgba(205,178,142,.3); transition:all .2s ease; background:var(--bg-mid); color:var(--gold); text-decoration:none; }
.page-numbers:hover { transform:scale(1.08); background:linear-gradient(to right,var(--gold),var(--text-cream)); color:var(--bg-dark); text-decoration:none; }
.page-numbers.current { background:linear-gradient(to right,var(--gold),var(--text-cream)); color:var(--bg-dark); border-color:var(--gold); box-shadow:0 10px 30px rgba(205,178,142,.25); }
.page-numbers.dots { cursor:default; pointer-events:none; }
.page-numbers.prev,.page-numbers.next { font-size:18px; font-weight:900; }

/* =============================================
   ANIMATIONS
   ============================================= */
@keyframes glow {
  0%,100% { text-shadow:0 0 32px rgba(205,178,142,.53),0 0 2px #fffbe6; }
  50% { text-shadow:0 0 80px rgba(205,178,142,.6),0 0 8px #fffbe6; }
}
.animate-glow { animation:glow 2.6s ease-in-out infinite alternate; }

@keyframes pulse {
  0%,100% { opacity:1; }
  50% { opacity:.5; }
}
.animate-pulse { animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite; }

/* =============================================
   UTILITIES
   ============================================= */
.shadow-gold { box-shadow:var(--shadow-gold); }
.pointer-events-none { pointer-events:none; }
.overflow-hidden { overflow:hidden; }
.relative { position:relative; }
.absolute { position:absolute; }
.fixed { position:fixed; }
.inset-0 { top:0; right:0; bottom:0; left:0; }
.w-full { width:100%; }
.h-full { height:100%; }
.max-w-full { max-width:100%; }
.mx-auto { margin-left:auto; margin-right:auto; }
.text-center { text-align:center; }
.text-left { text-align:left; }
.hidden { display:none !important; }
.flex { display:flex; }
.flex-col { flex-direction:column; }
.flex-1 { flex:1; }
.flex-wrap { flex-wrap:wrap; }
.items-center { align-items:center; }
.items-start { align-items:flex-start; }
.justify-center { justify-content:center; }
.justify-between { justify-content:space-between; }
.justify-start { justify-content:flex-start; }
.gap-3 { gap:.75rem; }
.gap-4 { gap:1rem; }
.gap-6 { gap:1.5rem; }
.gap-8 { gap:2rem; }
.grid { display:grid; }
.min-h-screen { min-height:100vh; }
.sticky { position:sticky; }
.top-0 { top:0; }
.z-50 { z-index:50; }
.whitespace-nowrap { white-space:nowrap; }
.line-through { text-decoration:line-through; }
body.menu-open { overflow:hidden; }
.shrink-0 { flex-shrink:0; }
.block { display:block; }
.inline-block { display:inline-block; }
.inline-flex { display:inline-flex; }
.mix-blend-lighten { mix-blend-mode:lighten; }
.aspect-video { aspect-ratio:16/9; }
.object-cover { object-fit:cover; }
.italic { font-style:italic; }
.uppercase { text-transform:uppercase; }
.backdrop-blur { backdrop-filter:blur(8px); }
.backdrop-blur-lg { backdrop-filter:blur(16px); }

/* =============================================
   RESPONSIVE
   ============================================= */
@media (min-width:768px) {
  .header-nav { display:flex; }
  .btn-book { display:inline-block; }
  .mobile-icons { display:none; }
  .hero-section { min-height:100vh; }
  .hero-content { padding-top:0; }
  .hero-title { font-size:4.5rem; }
  .hero-accent { top:23%; }
  .hero-subtitle { font-size:1.5rem; }
  .btn-primary { font-size:1.125rem; padding:1rem 2.5rem; }

  .md-flex { display:flex !important; }
  .md-hidden { display:none !important; }
  .md-inline-block { display:inline-block !important; }
  .md-flex-row { flex-direction:row !important; }
  .md-flex-col { flex-direction:column !important; }
  .md-grid-2 { grid-template-columns:repeat(2,1fr) !important; }
  .md-grid-3 { grid-template-columns:repeat(3,1fr) !important; }
  .md-text-left { text-align:left !important; }
  .md-items-start { align-items:flex-start !important; }
  .md-w-half { width:50% !important; }
  .md-w-third { width:33.333% !important; }
  .md-w-two-thirds { width:66.666% !important; }
  .md-min-h-screen { min-height:100vh !important; }
}

@media (min-width:1024px) {
  .lg-grid-3 { grid-template-columns:repeat(3,1fr) !important; }
  .hero-title { font-size:5rem; }
}

@media (min-width:1280px) {
  .xl-grid-4 { grid-template-columns:repeat(4,1fr) !important; }
}

@media (max-width:700px) {
  #koralle-whatsapp-chathead { bottom:16px; right:16px; }
  .chathead-pic { width:48px; height:48px; min-width:48px; }
  .chathead-logo { width:17px; height:17px; bottom:4px; right:4px; }
  .chathead-text { font-size:.98rem; padding:10px 16px; margin-left:12px; }
}