<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Polivia Vie — Where Wellness Meets Wonder</title>
<link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Jost:wght@200;300;400;500;600&display=swap" rel="stylesheet">
<style>
:root {
  --ivory: #F8F4EE;
  --ivory2: #EFE9DE;
  --deep: #0E0E0C;
  --deep2: #1A1A16;
  --deep3: #252520;
  --gold: #B8943F;
  --gold2: #D4AF6A;
  --gold3: #EDD9A3;
  --sage: #7B8C72;
  --sage2: #A3B49A;
  --muted: #8A8578;
  --text: #2C2C26;
  --white: #FFFFFF;
  --border: rgba(184,148,63,0.2);
  --border2: rgba(184,148,63,0.4);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: 'Jost', sans-serif; background: var(--ivory); color: var(--text); overflow-x: hidden; }
h1,h2,h3,h4,h5 { font-family: 'Cormorant Garamond', serif; }
img { max-width: 100%; display: block; }
a { text-decoration: none; }

/* ─── NAVIGATION ─── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.4rem 5%;
  transition: all 0.4s ease;
}
nav.scrolled {
  background: rgba(14,14,12,0.97);
  padding: 1rem 5%;
  backdrop-filter: blur(10px);
}
.logo {
  display: flex; align-items: baseline; gap: 0.2rem;
}
.logo-mark {
  font-family: 'Cormorant Garamond', serif;
  font-size: 1.8rem; font-weight: 600;
  letter-spacing: 0.04em; color: var(--gold2);
  line-height: 1;
}
.logo-vie {
  font-family: 'Jost', sans-serif;
  font-size: 0.65rem; font-weight: 300;
  letter-spacing: 0.35em; text-transform: uppercase;
  color: var(--gold3); opacity: 0.8;
  align-self: center; margin-left: 0.3rem;
}
.nav-center { display: flex; gap: 2.5rem; list-style: none; }
.nav-center a {
  font-size: 0.75rem; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(255,255,255,0.75); font-weight: 300;
  transition: color 0.3s;
}
.nav-center a:hover { color: var(--gold2); }
.nav-right { display: flex; align-items: center; gap: 1.5rem; }
.nav-lang {
  font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(255,255,255,0.5); cursor: pointer;
  border: 1px solid rgba(255,255,255,0.2); padding: 0.3rem 0.7rem;
  border-radius: 2px; transition: all 0.3s; background: none;
  font-family: 'Jost', sans-serif;
}
.nav-lang.active { color: var(--gold2); border-color: var(--gold2); }
.nav-lang:hover { color: var(--gold2); border-color: var(--gold2); }
.nav-cta {
  font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase;
  background: var(--gold); color: var(--deep); padding: 0.6rem 1.4rem;
  border-radius: 1px; font-weight: 500; transition: background 0.3s;
}
.nav-cta:hover { background: var(--gold2); }

/* ─── HERO ─── */
.hero {
  position: relative; height: 100vh; min-height: 700px;
  display: flex; align-items: center; overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0;
  background: url('https://images.unsplash.com/photo-1584132967334-10e028bd69f7?w=1800&q=85') center/cover no-repeat;
  animation: kbz 18s ease-in-out infinite alternate;
}
@keyframes kbz { from { transform: scale(1.04); } to { transform: scale(1.1) translateX(-1%); } }
.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(105deg, rgba(14,14,12,0.82) 0%, rgba(14,14,12,0.45) 50%, rgba(14,14,12,0.2) 100%);
}
/* Medical accent panel — right side */
.hero-med-panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: 42%; z-index: 3;
  display: flex; flex-direction: column;
}
.hero-med-panel::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(14,14,12,1) 0%, rgba(14,14,12,0.6) 20%, rgba(14,14,12,0.0) 46%);
  z-index: 2; pointer-events: none;
}
.hero-med-img {
  flex: 1; object-fit: cover; object-position: center; width: 100%; height: 50%;
  filter: brightness(0.72) saturate(0.85);
  display: block;
}
.hero-med-divider {
  height: 2px;
  background: linear-gradient(to right, var(--gold), var(--gold2), transparent);
  position: relative; z-index: 2; flex-shrink: 0;
}
.hero-med-label {
  position: absolute; z-index: 4;
  bottom: 6rem; left: -1.5rem;
  background: rgba(14,14,12,0.92);
  border-left: 2px solid var(--gold);
  padding: 1rem 1.25rem;
  max-width: 220px;
}
.hero-med-label-cat { font-size: 0.58rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--gold2); margin-bottom: 0.3rem; }
.hero-med-label-text { font-family: 'Cormorant Garamond', serif; font-size: 0.95rem; color: rgba(255,255,255,0.85); font-style: italic; line-height: 1.4; }
@media (max-width: 900px) { .hero-med-panel { display: none; } }
.hero-content {
  position: relative; z-index: 2;
  padding: 0 5%; max-width: 760px;
  animation: riseIn 1.2s ease both;
}
@keyframes riseIn { from { opacity:0; transform:translateY(40px); } to { opacity:1; transform:translateY(0); } }
.hero-eyebrow {
  display: inline-flex; align-items: center; gap: 0.75rem;
  font-size: 0.68rem; letter-spacing: 0.35em; text-transform: uppercase;
  color: var(--gold2); font-weight: 400; margin-bottom: 1.5rem;
}
.hero-eyebrow::before, .hero-eyebrow::after { content: ''; display: block; height: 1px; width: 30px; background: var(--gold2); opacity: 0.6; }
.hero h1 {
  font-size: clamp(3rem, 6.5vw, 5.8rem); font-weight: 300; line-height: 1.05;
  color: var(--white); margin-bottom: 0.5rem; letter-spacing: -0.01em;
}
.hero h1 em { font-style: italic; color: var(--gold3); }
.hero-tagline {
  font-family: 'Jost', sans-serif; font-size: 0.8rem; letter-spacing: 0.3em;
  text-transform: uppercase; color: rgba(255,255,255,0.5);
  margin-bottom: 1.75rem; font-weight: 300;
}
.hero p {
  font-family: 'Jost', sans-serif; font-size: 1rem; line-height: 1.8;
  color: rgba(255,255,255,0.72); max-width: 480px; margin-bottom: 2.5rem; font-weight: 300;
}
.hero-btns { display: flex; gap: 1rem; flex-wrap: wrap; }
.btn-gold {
  display: inline-flex; align-items: center; gap: 0.5rem;
  background: var(--gold); color: var(--deep);
  font-family: 'Jost', sans-serif; font-size: 0.72rem; letter-spacing: 0.2em;
  text-transform: uppercase; font-weight: 500;
  padding: 0.85rem 2rem; border-radius: 1px; transition: background 0.3s;
}
.btn-gold:hover { background: var(--gold2); }
.btn-outline-white {
  display: inline-flex; align-items: center; gap: 0.5rem;
  border: 1px solid rgba(255,255,255,0.35); color: rgba(255,255,255,0.85);
  font-family: 'Jost', sans-serif; font-size: 0.72rem; letter-spacing: 0.2em;
  text-transform: uppercase; font-weight: 300;
  padding: 0.85rem 2rem; border-radius: 1px; transition: all 0.3s;
}
.btn-outline-white:hover { border-color: var(--gold2); color: var(--gold2); }
.hero-scroll {
  position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%);
  z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
  color: rgba(255,255,255,0.35); font-size: 0.6rem; letter-spacing: 0.3em; text-transform: uppercase;
  cursor: pointer;
}
.scroll-line { width: 1px; height: 50px; background: linear-gradient(to bottom, rgba(184,148,63,0.6), transparent); animation: lineDown 2s ease-in-out infinite; }
@keyframes lineDown { 0%,100%{opacity:0;transform:scaleY(0);transform-origin:top;} 50%{opacity:1;transform:scaleY(1);transform-origin:top;} }

/* ─── TRUST BAR ─── */
.trust-bar {
  background: var(--deep2);
  padding: 1.5rem 5%;
  border-bottom: 1px solid rgba(184,148,63,0.15);
}
.trust-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  flex-wrap: wrap;
}
.trust-item {
  display: flex; align-items: center; gap: 0.75rem;
  font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(255,255,255,0.45); font-weight: 300;
}
.trust-item span { color: var(--gold2); font-size: 0.85rem; }
.trust-divider { width: 1px; height: 24px; background: rgba(255,255,255,0.1); }

/* ─── SECTION UTILITIES ─── */
section { padding: 6rem 5%; }
.sec-header { text-align: center; margin-bottom: 4rem; }
.sec-eyebrow {
  display: inline-flex; align-items: center; gap: 0.75rem;
  font-family: 'Jost', sans-serif; font-size: 0.68rem; letter-spacing: 0.35em;
  text-transform: uppercase; color: var(--gold); font-weight: 400; margin-bottom: 1rem;
}
.sec-eyebrow::before, .sec-eyebrow::after { content: ''; display: block; height: 1px; width: 24px; background: var(--gold); opacity: 0.5; }
.sec-title { font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 300; line-height: 1.15; color: var(--deep); }
.sec-title em { font-style: italic; color: var(--gold); }
.sec-title.light { color: var(--white); }
.sec-sub { font-size: 0.95rem; color: var(--muted); max-width: 520px; margin: 1rem auto 0; line-height: 1.8; font-weight: 300; }
.sec-sub.light { color: rgba(255,255,255,0.55); }
.max-w { max-width: 1200px; margin: 0 auto; }

/* ─── LOGO MARK LARGE ─── */
.brand-seal {
  width: 90px; height: 90px; border-radius: 50%;
  border: 1px solid var(--gold); display: flex; align-items: center; justify-content: center;
  font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; color: var(--gold2);
  letter-spacing: 0.05em; background: transparent; flex-shrink: 0;
}

/* ─── ABOUT / INTRO ─── */
.intro { background: var(--deep); padding: 6rem 5%; }
.intro-grid {
  max-width: 1200px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1.6fr; gap: 5rem; align-items: center;
}
.intro-left { display: flex; flex-direction: column; gap: 2rem; }
.intro-logo-large {
  font-family: 'Cormorant Garamond', serif; font-size: 5rem; font-weight: 300;
  color: var(--gold2); letter-spacing: 0.04em; line-height: 1;
}
.intro-logo-sub {
  font-family: 'Jost', sans-serif; font-size: 0.65rem; letter-spacing: 0.4em;
  text-transform: uppercase; color: var(--gold3); opacity: 0.7;
}
.intro-tagline-large {
  font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; font-weight: 300; font-style: italic;
  color: rgba(255,255,255,0.6); line-height: 1.7; border-left: 2px solid var(--gold); padding-left: 1.25rem;
}
.intro-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.intro-stat { }
.intro-stat-n { font-family: 'Cormorant Garamond', serif; font-size: 2.8rem; font-weight: 300; color: var(--gold2); line-height: 1; }
.intro-stat-l { font-size: 0.7rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-top: 0.3rem; }
.intro-right { }
.intro-right h2 { font-size: clamp(2rem, 3.5vw, 2.8rem); font-weight: 300; color: var(--white); margin-bottom: 1.5rem; line-height: 1.2; }
.intro-right h2 em { font-style: italic; color: var(--gold3); }
.intro-right p { font-size: 0.95rem; line-height: 1.9; color: rgba(255,255,255,0.6); font-weight: 300; margin-bottom: 1rem; }
.intro-features { display: flex; flex-direction: column; gap: 0.75rem; margin: 1.75rem 0; }
.intro-feature {
  display: flex; align-items: center; gap: 1rem;
  font-size: 0.82rem; color: rgba(255,255,255,0.65); letter-spacing: 0.05em;
}
.feature-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold2); flex-shrink: 0; }

/* ─── SERVICES PILLARS ─── */
.services { background: var(--ivory); }
/* Responsive collapse for pillar body grids */
@media (max-width: 900px) {
  .pillar-body { grid-template-columns: 1fr !important; }
}
.svc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; max-width: 1100px; margin: 0 auto; align-items: start; }
.svc-img-wrap { position: relative; }
.svc-img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.svc-img-caption {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1.5rem; background: linear-gradient(to top, rgba(14,14,12,0.8), transparent);
  font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold2);
}
.svc-content { }
.svc-category {
  font-family: 'Jost', sans-serif; font-size: 0.65rem; letter-spacing: 0.35em; text-transform: uppercase;
  color: var(--gold); font-weight: 400; margin-bottom: 0.75rem;
}
.svc-content h3 { font-size: 2.2rem; font-weight: 300; line-height: 1.2; color: var(--deep); margin-bottom: 1.2rem; }
.svc-content h3 em { font-style: italic; color: var(--gold); }
.svc-content p { font-size: 0.92rem; line-height: 1.9; color: var(--muted); font-weight: 300; margin-bottom: 1.5rem; }
.pkg-list { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2rem; }
.pkg-item {
  display: flex; align-items: flex-start; gap: 1rem;
  padding: 1.2rem; background: var(--ivory2);
  border: 1px solid var(--border); border-left: 3px solid var(--gold);
  cursor: pointer; transition: all 0.3s;
}
.pkg-item:hover { background: var(--white); border-color: var(--gold2); }
.pkg-item-body { flex: 1; }
.pkg-item-name { font-family: 'Cormorant Garamond', serif; font-size: 1.1rem; color: var(--deep); font-weight: 600; margin-bottom: 0.2rem; }
.pkg-item-desc { font-size: 0.8rem; color: var(--muted); line-height: 1.6; }
.pkg-item-price { font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; color: var(--gold); white-space: nowrap; }
.btn-gold-outline {
  display: inline-flex; align-items: center; gap: 0.5rem;
  border: 1px solid var(--gold); color: var(--gold);
  font-family: 'Jost', sans-serif; font-size: 0.72rem; letter-spacing: 0.2em;
  text-transform: uppercase; font-weight: 400; padding: 0.75rem 2rem;
  border-radius: 1px; transition: all 0.3s;
}
.btn-gold-outline:hover { background: var(--gold); color: var(--deep); }

/* ─── DESTINATIONS ─── */
.destinations { background: var(--deep); padding: 6rem 5%; }
.dest-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; max-width: 1200px; margin: 0 auto; }
.dest-card {
  position: relative; overflow: hidden; cursor: pointer;
  aspect-ratio: 3/4;
}
.dest-card:first-child { grid-column: span 2; aspect-ratio: auto; }
.dest-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; display: block; }
.dest-card:hover .dest-img { transform: scale(1.06); }
.dest-over {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(14,14,12,0.85) 0%, transparent 60%);
  transition: opacity 0.4s;
}
.dest-info { position: absolute; bottom: 1.5rem; left: 1.5rem; right: 1.5rem; }
.dest-region { font-size: 0.65rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--gold2); margin-bottom: 0.3rem; }
.dest-name { font-family: 'Cormorant Garamond', serif; font-size: 1.6rem; font-weight: 300; color: var(--white); }
.dest-card:first-child .dest-name { font-size: 2.4rem; }
.dest-tag {
  display: inline-block; margin-top: 0.5rem;
  font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase;
  background: rgba(184,148,63,0.2); color: var(--gold2); border: 1px solid rgba(184,148,63,0.35);
  padding: 0.25rem 0.6rem;
}

/* ─── CONCIERGE ─── */
.concierge { background: var(--ivory2); }
.concierge-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 4rem; max-width: 1100px; margin: 0 auto; align-items: center; }
.concierge-img-wrap { position: relative; }
.concierge-img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.concierge-badge {
  position: absolute; bottom: -1.5rem; right: -1.5rem;
  width: 130px; height: 130px; border-radius: 50%;
  background: var(--deep); border: 1px solid var(--gold);
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  padding: 1rem;
}
.concierge-badge-n { font-family: 'Cormorant Garamond', serif; font-size: 2rem; color: var(--gold2); line-height: 1; }
.concierge-badge-t { font-size: 0.58rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-top: 0.2rem; }
.concierge-right h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 300; color: var(--deep); margin-bottom: 1.2rem; line-height: 1.2; }
.concierge-right h2 em { font-style: italic; color: var(--gold); }
.concierge-right p { font-size: 0.9rem; line-height: 1.9; color: var(--muted); margin-bottom: 1.2rem; font-weight: 300; }
.lang-pills { display: flex; gap: 0.75rem; margin: 1.25rem 0; }
.lang-pill {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.75rem; letter-spacing: 0.1em;
  border: 1px solid var(--border2); color: var(--gold); padding: 0.45rem 1rem;
  border-radius: 1px; background: transparent;
}
.concierge-steps { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1.75rem; }
.cstep { display: flex; gap: 1.25rem; align-items: flex-start; }
.cstep-num {
  width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--gold);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Cormorant Garamond', serif; font-size: 0.9rem; color: var(--gold);
  flex-shrink: 0;
}
.cstep-body {}
.cstep-title { font-family: 'Cormorant Garamond', serif; font-size: 1rem; font-weight: 600; color: var(--deep); margin-bottom: 0.2rem; }
.cstep-desc { font-size: 0.8rem; color: var(--muted); line-height: 1.6; }

/* ─── PRIVACY ─── */
.privacy { background: var(--deep); }
.privacy-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; max-width: 1100px; margin: 0 auto; align-items: start; }
.privacy-left { }
.privacy-left h2 { font-size: clamp(2rem, 3.5vw, 2.8rem); font-weight: 300; color: var(--white); margin-bottom: 1.2rem; line-height: 1.2; }
.privacy-left h2 em { font-style: italic; color: var(--gold3); }
.privacy-left p { font-size: 0.9rem; line-height: 1.9; color: rgba(255,255,255,0.55); font-weight: 300; margin-bottom: 1.2rem; }
.privacy-cards { display: flex; flex-direction: column; gap: 1rem; }
.privacy-card {
  display: flex; gap: 1.25rem;
  padding: 1.25rem; background: rgba(255,255,255,0.03);
  border: 1px solid rgba(184,148,63,0.15); border-left: 2px solid var(--gold);
  align-items: flex-start;
}
.privacy-icon { font-size: 1.2rem; flex-shrink: 0; margin-top: 0.1rem; }
.privacy-card-title { font-family: 'Cormorant Garamond', serif; font-size: 1.05rem; color: var(--gold3); margin-bottom: 0.3rem; font-weight: 600; }
.privacy-card-desc { font-size: 0.8rem; color: rgba(255,255,255,0.45); line-height: 1.65; }
.platform-rec {
  background: rgba(184,148,63,0.08); border: 1px solid var(--border2);
  padding: 1.75rem; margin-top: 1.5rem;
}
.platform-rec-title { font-family: 'Cormorant Garamond', serif; font-size: 1.3rem; color: var(--gold2); margin-bottom: 0.75rem; }
.platform-rec p { font-size: 0.82rem; color: rgba(255,255,255,0.55); line-height: 1.75; margin-bottom: 0.5rem; }
.platform-item { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.78rem; color: rgba(255,255,255,0.5); margin-bottom: 0.4rem; }
.platform-item::before { content: '›'; color: var(--gold2); font-size: 1rem; line-height: 1.2; }

/* ─── PARTNER ─── */
.partner { background: var(--ivory2); }
.partner-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; max-width: 1100px; margin: 0 auto; align-items: center; }
.partner-right h2 { font-size: clamp(1.8rem, 3vw, 2.5rem); font-weight: 300; color: var(--deep); margin-bottom: 1rem; }
.partner-right h2 em { font-style: italic; color: var(--gold); }
.partner-right p { font-size: 0.9rem; line-height: 1.9; color: var(--muted); margin-bottom: 1rem; font-weight: 300; }
.partner-logo-area {
  background: var(--white); border: 1px solid var(--border2); padding: 2rem;
  display: flex; flex-direction: column; align-items: center; gap: 1rem; text-align: center;
}
.partner-logo-name { font-family: 'Cormorant Garamond', serif; font-size: 1.8rem; color: var(--deep); font-weight: 600; }
.partner-logo-sub { font-size: 0.7rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--gold); }
.partner-services { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 1.25rem; }
.partner-svc { display: flex; align-items: center; gap: 0.75rem; font-size: 0.82rem; color: var(--muted); }
.partner-svc::before { content: ''; display: block; width: 18px; height: 1px; background: var(--gold); flex-shrink: 0; }
.hotel-logos { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1px; background: var(--border); }
.hotel-logo {
  background: var(--ivory); padding: 1.25rem 0.75rem; text-align: center;
  font-family: 'Cormorant Garamond', serif; font-size: 0.9rem; color: var(--text);
  font-weight: 600; letter-spacing: 0.05em;
}

/* ─── RESEARCH SECTION ─── */
.research { background: var(--deep2); padding: 6rem 5%; }
.research-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; max-width: 1100px; margin: 0 auto; }
.research-card {
  background: rgba(255,255,255,0.03); border: 1px solid rgba(184,148,63,0.15);
  padding: 2rem; transition: border-color 0.3s;
}
.research-card:hover { border-color: rgba(184,148,63,0.4); }
.research-icon { font-size: 1.5rem; margin-bottom: 1rem; }
.research-title { font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; color: var(--gold2); margin-bottom: 0.75rem; font-weight: 600; }
.research-body { font-size: 0.82rem; line-height: 1.75; color: rgba(255,255,255,0.5); }
.research-stat { font-family: 'Cormorant Garamond', serif; font-size: 2.2rem; color: var(--gold3); margin-bottom: 0.25rem; line-height: 1; }

/* ─── GALLERY ─── */
.gallery { background: var(--ivory); padding: 6rem 5%; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 240px; gap: 1px; max-width: 1200px; margin: 0 auto; }
.gallery-item { position: relative; overflow: hidden; cursor: pointer; }
.gallery-item.tall { grid-row: span 2; }
.gallery-item.wide { grid-column: span 2; }
.gallery-img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.gallery-item:hover .gallery-img { transform: scale(1.07); }
.gallery-label {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1rem; background: linear-gradient(to top, rgba(14,14,12,0.75), transparent);
  font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold2);
  opacity: 0; transition: opacity 0.3s;
}
.gallery-item:hover .gallery-label { opacity: 1; }

/* ─── ENQUIRY ─── */
.enquiry { background: var(--deep); padding: 6rem 5%; }
.enquiry-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 5rem; max-width: 1100px; margin: 0 auto; align-items: start; }
.enquiry-left h2 { font-size: clamp(2rem, 3.5vw, 2.8rem); font-weight: 300; color: var(--white); margin-bottom: 1rem; line-height: 1.2; }
.enquiry-left h2 em { font-style: italic; color: var(--gold3); }
.enquiry-left p { font-size: 0.9rem; line-height: 1.9; color: rgba(255,255,255,0.5); margin-bottom: 1.5rem; font-weight: 300; }
.enq-contact { display: flex; flex-direction: column; gap: 1rem; }
.enq-item { display: flex; align-items: flex-start; gap: 1rem; }
.enq-icon { font-size: 1rem; margin-top: 0.1rem; flex-shrink: 0; }
.enq-label { font-size: 0.65rem; letter-spacing: 0.15em; text-transform: uppercase; color: rgba(255,255,255,0.3); margin-bottom: 0.2rem; }
.enq-val { font-size: 0.88rem; color: rgba(255,255,255,0.7); }
.enq-form { background: rgba(255,255,255,0.03); border: 1px solid rgba(184,148,63,0.2); padding: 2.5rem; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; margin-bottom: 1.25rem; }
.form-row.full { grid-template-columns: 1fr; }
.field { display: flex; flex-direction: column; gap: 0.4rem; }
.field label { font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.35); }
.field input, .field select, .field textarea {
  background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.1);
  border-bottom-color: rgba(184,148,63,0.3); border-radius: 0;
  color: rgba(255,255,255,0.8); padding: 0.8rem 1rem;
  font-family: 'Jost', sans-serif; font-size: 0.88rem; font-weight: 300;
  outline: none; transition: border-color 0.3s; resize: vertical;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--gold); }
.field input::placeholder, .field textarea::placeholder { color: rgba(255,255,255,0.2); }
.field select option { background: var(--deep2); color: white; }
.consent-row { display: flex; align-items: flex-start; gap: 0.75rem; margin-bottom: 1.5rem; }
.consent-row input[type=checkbox] { accent-color: var(--gold); width: 14px; height: 14px; margin-top: 2px; flex-shrink: 0; }
.consent-row label { font-size: 0.75rem; color: rgba(255,255,255,0.35); line-height: 1.6; }
.consent-row a { color: var(--gold2); text-decoration: underline; }
.btn-submit-gold {
  width: 100%; background: var(--gold); color: var(--deep);
  font-family: 'Jost', sans-serif; font-size: 0.78rem; letter-spacing: 0.25em;
  text-transform: uppercase; font-weight: 500; padding: 1rem;
  border: none; cursor: pointer; transition: background 0.3s;
  border-radius: 0;
}
.btn-submit-gold:hover { background: var(--gold2); }

/* ─── FOOTER ─── */
footer { background: var(--deep); border-top: 1px solid rgba(184,148,63,0.15); padding: 5rem 5% 2rem; }
.footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; max-width: 1200px; margin: 0 auto 4rem; }
.footer-brand {}
.footer-logo-text { font-family: 'Cormorant Garamond', serif; font-size: 2rem; font-weight: 300; color: var(--gold2); letter-spacing: 0.04em; }
.footer-logo-vie { font-family: 'Jost', sans-serif; font-size: 0.6rem; letter-spacing: 0.4em; text-transform: uppercase; color: var(--gold3); opacity: 0.5; margin-top: 0.1rem; }
.footer-tagline { font-family: 'Cormorant Garamond', serif; font-size: 0.95rem; font-style: italic; color: rgba(255,255,255,0.35); line-height: 1.7; max-width: 220px; margin-top: 1rem; }
.footer-social { display: flex; gap: 0.75rem; margin-top: 1.5rem; }
.soc-btn {
  width: 34px; height: 34px; border: 1px solid rgba(184,148,63,0.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.75rem; color: rgba(255,255,255,0.4); text-decoration: none;
  transition: all 0.3s;
}
.soc-btn:hover { border-color: var(--gold2); color: var(--gold2); }
.footer-col h5 { font-family: 'Jost', sans-serif; font-size: 0.65rem; letter-spacing: 0.25em; text-transform: uppercase; color: rgba(255,255,255,0.3); margin-bottom: 1.25rem; font-weight: 400; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 0.6rem; }
.footer-col ul a { font-size: 0.82rem; color: rgba(255,255,255,0.4); transition: color 0.3s; font-weight: 300; }
.footer-col ul a:hover { color: var(--gold2); }
.footer-bottom { max-width: 1200px; margin: 0 auto; border-top: 1px solid rgba(255,255,255,0.06); padding-top: 2rem; display: flex; align-items: center; justify-content: space-between; flex-wrap: gap: 1rem; }
.footer-legal { display: flex; gap: 2rem; }
.footer-legal a { font-size: 0.72rem; color: rgba(255,255,255,0.25); transition: color 0.3s; letter-spacing: 0.08em; }
.footer-legal a:hover { color: var(--gold2); }
.footer-copy { font-size: 0.72rem; color: rgba(255,255,255,0.2); letter-spacing: 0.05em; }
.popia-badge {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-size: 0.62rem; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--gold); border: 1px solid rgba(184,148,63,0.3); padding: 0.35rem 0.8rem;
}

/* ─── MODAL ─── */
.modal-bg { display: none; position: fixed; inset: 0; background: rgba(14,14,12,0.9); z-index: 500; align-items: center; justify-content: center; padding: 1.5rem; }
.modal-bg.open { display: flex; }
.modal-box {
  background: var(--deep2); border: 1px solid var(--border2);
  max-width: 560px; width: 100%; padding: 0;
  animation: mIn 0.3s ease;
  position: relative; overflow: hidden;
}
@keyframes mIn { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.modal-header { background: var(--deep3); padding: 1.75rem 2rem 1.5rem; border-bottom: 1px solid var(--border); }
.modal-title { font-family: 'Cormorant Garamond', serif; font-size: 1.6rem; color: var(--white); font-weight: 300; }
.modal-subtitle { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold2); margin-top: 0.25rem; }
.modal-close { position: absolute; top: 1.25rem; right: 1.5rem; background: none; border: none; color: rgba(255,255,255,0.3); font-size: 1.2rem; cursor: pointer; }
.modal-body { padding: 2rem; }
.modal-price { font-family: 'Cormorant Garamond', serif; font-size: 2rem; color: var(--gold2); margin-bottom: 1rem; }
.modal-price-note { font-size: 0.75rem; color: rgba(255,255,255,0.35); }
.modal-desc { font-size: 0.85rem; line-height: 1.8; color: rgba(255,255,255,0.55); margin-bottom: 1.5rem; }
.modal-includes { margin-bottom: 1.5rem; }
.modal-inc-title { font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.3); margin-bottom: 0.75rem; }
.modal-inc-list { display: flex; flex-direction: column; gap: 0.4rem; }
.modal-inc-item { display: flex; gap: 0.6rem; font-size: 0.82rem; color: rgba(255,255,255,0.55); }
.modal-inc-item::before { content: '—'; color: var(--gold2); flex-shrink: 0; }
.modal-footer { padding: 0 2rem 2rem; display: flex; gap: 1rem; }
.btn-enquire-modal {
  flex: 1; background: var(--gold); color: var(--deep); border: none;
  font-family: 'Jost', sans-serif; font-size: 0.72rem; letter-spacing: 0.2em;
  text-transform: uppercase; font-weight: 500; padding: 0.85rem 1rem;
  cursor: pointer; transition: background 0.3s; border-radius: 0;
}
.btn-enquire-modal:hover { background: var(--gold2); }
.btn-close-modal {
  background: transparent; color: rgba(255,255,255,0.4); border: 1px solid rgba(255,255,255,0.15);
  font-family: 'Jost', sans-serif; font-size: 0.72rem; letter-spacing: 0.15em;
  text-transform: uppercase; font-weight: 300; padding: 0.85rem 1.25rem;
  cursor: pointer; transition: all 0.3s; border-radius: 0;
}
.btn-close-modal:hover { border-color: var(--gold); color: var(--gold); }

/* ─── TOAST ─── */
.toast { position: fixed; bottom: 2rem; right: 2rem; z-index: 600; background: var(--deep2); border: 1px solid var(--border2); padding: 1.25rem 1.75rem; max-width: 340px; opacity: 0; transform: translateY(20px); transition: all 0.4s; pointer-events: none; }
.toast.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.toast-head { font-family: 'Cormorant Garamond', serif; font-size: 1rem; color: var(--gold2); margin-bottom: 0.2rem; }
.toast-body { font-size: 0.8rem; color: rgba(255,255,255,0.5); line-height: 1.5; }

/* ─── RESPONSIVE ─── */
@media (max-width: 1024px) {
  .intro-grid { grid-template-columns: 1fr; gap: 3rem; }
  .svc-grid { grid-template-columns: 1fr; }
  .dest-grid { grid-template-columns: 1fr 1fr; }
  .dest-card:first-child { grid-column: span 2; }
  .concierge-grid { grid-template-columns: 1fr; }
  .concierge-img-wrap { max-width: 500px; }
  .concierge-badge { display: none; }
  .privacy-inner { grid-template-columns: 1fr; }
  .partner-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .enquiry-grid { grid-template-columns: 1fr; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .research-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .nav-center { display: none; }
  .nav-lang { display: none; }
  .hero h1 { font-size: 2.8rem; }
  .dest-grid { grid-template-columns: 1fr; }
  .dest-card:first-child { grid-column: span 1; }
  .gallery-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 180px; }
  .gallery-item.tall { grid-row: span 1; }
  .gallery-item.wide { grid-column: span 2; }
  .footer-top { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; gap: 1rem; text-align: center; }
  .footer-legal { justify-content: center; }
  .form-row { grid-template-columns: 1fr; }
  .trust-inner { justify-content: center; }
  .trust-divider { display: none; }
  .research-grid { grid-template-columns: 1fr; }
  /* Pillar body grids collapse on mobile */
  #services [style*="grid-template-columns:1fr 1fr"] { grid-template-columns: 1fr !important; }
}
</style>
</head>
<body>

<!-- ══ NAVIGATION ══ -->
<nav id="navbar">
  <a href="#" class="logo">
    <span class="logo-mark">Polivia</span>
    <span class="logo-vie">Vie</span>
  </a>
  <ul class="nav-center">
    <li><a href="#about">About</a></li>
    <li><a href="#services">Services</a></li>
    <li><a href="#packages">Packages</a></li>
    <li><a href="#destinations">Destinations</a></li>
    <li><a href="#privacy">Privacy</a></li>
    <li><a href="#enquiry">Contact</a></li>
  </ul>
  <div class="nav-right">
    <button class="nav-lang active" onclick="setLang('EN')">EN</button>
    <button class="nav-lang" onclick="setLang('FR')">FR</button>
    <a href="#enquiry" class="nav-cta">Begin Consultation</a>
  </div>
</nav>

<!-- ══ HERO ══ -->
<section class="hero" id="home">
  <div class="hero-bg"></div>
  <div class="hero-overlay"></div>
  <div class="hero-content">
    <span class="hero-eyebrow">Exclusive Medical Travel · South Africa</span>
    <h1>Renew. Revive.<br><em>Rediscover.</em></h1>
    <p class="hero-tagline">Where Excellence in Medicine Meets the Art of Living</p>
    <p>Polivia Vie unites world-class South African medical specialists with bespoke luxury travel experiences — crafted for discerning professionals who demand the finest in aesthetic refinement and preventative wellness.</p>
    <div class="hero-btns">
      <a href="#services" class="btn-gold">Explore Our Services</a>
      <a href="#enquiry" class="btn-outline-white">Private Consultation</a>
    </div>
  </div>
  <!-- Medical accent panel: right side — dramatic clinical diptych to immediately signal world-class medical travel -->
  <div class="hero-med-panel">
    <!-- Strong left-side fade so panel blends into hero copy -->
    <div style="position:absolute;inset:0;background:linear-gradient(to right,rgba(14,14,12,1) 0%,rgba(14,14,12,0.55) 18%,rgba(14,14,12,0.0) 42%);z-index:2;pointer-events:none;"></div>
    <!-- Top 58%: Patient draped and prepared in theatre — unmistakably surgical, medical -->
    <div style="flex:1.2;position:relative;overflow:hidden;display:flex;min-height:0;">
      <img src="https://images.unsplash.com/photo-1631217868264-e5b90bb7e133?w=900&q=88"
           alt="Patient in Theatre — Surgical Preparation"
           style="width:100%;height:100%;object-fit:cover;object-position:center 35%;display:block;filter:brightness(0.6) saturate(0.72);">
      <div style="position:absolute;inset:0;background:linear-gradient(to bottom,rgba(14,14,12,0.3) 0%,transparent 30%,rgba(14,14,12,0.72) 100%);"></div>
      <div style="position:absolute;top:1.25rem;right:1.25rem;z-index:3;">
        <div style="background:rgba(14,14,12,0.82);border:1px solid rgba(184,148,63,0.55);padding:0.45rem 0.9rem;">
          <div style="font-family:'Jost',sans-serif;font-size:0.5rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.15rem;">Pillar I</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:0.92rem;font-style:italic;color:rgba(255,255,255,0.85);">Aesthetic Surgery</div>
        </div>
      </div>
      <div style="position:absolute;bottom:1.2rem;left:0;right:0;padding:0 1.25rem;">
        <div style="font-size:0.55rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold3);font-family:'Jost',sans-serif;margin-bottom:0.2rem;">Theatre Preparation</div>
        <div style="font-family:'Cormorant Garamond',serif;font-size:1rem;font-style:italic;color:rgba(255,255,255,0.88);line-height:1.3;">World-class surgical excellence — crafted with precision</div>
      </div>
    </div>
    <!-- Gold divider with cross -->
    <div class="hero-med-divider" style="position:relative;z-index:3;">
      <div style="position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:24px;height:24px;background:var(--deep);border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:0.75rem;color:var(--gold);z-index:3;">✚</div>
    </div>
    <!-- Bottom 42%: Executive warmly shaking hands with doctor — trust, satisfaction, preventative confidence -->
    <div style="flex:0.8;position:relative;overflow:hidden;display:flex;min-height:0;">
      <img src="https://images.unsplash.com/photo-1651008376811-b90baee60c1f?w=900&q=88"
           alt="Executive Shaking Hands with Doctor — Preventative Wellness Satisfaction"
           style="width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;filter:brightness(0.68) saturate(0.85);">
      <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.88) 0%,rgba(14,14,12,0.15) 55%,transparent 100%);"></div>
      <div style="position:absolute;bottom:1.25rem;right:1.25rem;z-index:3;">
        <div style="background:rgba(14,14,12,0.82);border:1px solid rgba(184,148,63,0.55);padding:0.45rem 0.9rem;">
          <div style="font-family:'Jost',sans-serif;font-size:0.5rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.15rem;">Pillar II</div>
          <div style="font-family:'Cormorant Garamond',serif;font-size:0.92rem;font-style:italic;color:rgba(255,255,255,0.85);">Preventative Wellness</div>
        </div>
      </div>
      <div style="position:absolute;bottom:1.2rem;left:1.25rem;">
        <div style="font-size:0.52rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold3);font-family:'Jost',sans-serif;margin-bottom:0.15rem;">Clinical Assurance</div>
        <div style="font-family:'Cormorant Garamond',serif;font-size:0.9rem;font-style:italic;color:rgba(255,255,255,0.85);">Your health, confirmed by experts</div>
      </div>
    </div>
    <!-- Floating label bridging the two panels -->
    <div class="hero-med-label" style="bottom:44%;top:auto;left:-1.75rem;">
      <div class="hero-med-label-cat">Polivia Vie · Two Pillars</div>
      <div class="hero-med-label-text">Aesthetic mastery meets preventative precision — both delivered in South Africa's finest private facilities.</div>
    </div>
    <!-- Gold accent rule at right edge -->
    <div style="position:absolute;top:0;right:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,var(--gold) 20%,var(--gold2) 80%,transparent 100%);z-index:4;"></div>
  </div>

  <div class="hero-scroll" onclick="document.getElementById('trust').scrollIntoView({behavior:'smooth'})">
    <span>Discover</span>
    <div class="scroll-line"></div>
  </div>
</section>

<!-- ══ TRUST BAR ══ -->
<div class="trust-bar" id="trust">
  <div class="trust-inner">
    <div class="trust-item"><span>🏥</span> HPCSA-Registered Specialists</div>
    <div class="trust-divider"></div>
    <div class="trust-item"><span>🔒</span> POPIA-Compliant · Data Sovereign</div>
    <div class="trust-divider"></div>
    <div class="trust-item"><span>🇫🇷</span> English & French Concierge</div>
    <div class="trust-divider"></div>
    <div class="trust-item"><span>✈️</span> Private Airport Transfers</div>
    <div class="trust-divider"></div>
    <div class="trust-item"><span>🤝</span> Vivari Aesthetics Partner</div>
  </div>
</div>

<!-- ══ BRAND INTRO ══ -->
<section class="intro" id="about">
  <div class="intro-grid">
    <div class="intro-left">
      <div>
        <div class="intro-logo-large">Polivia<br><em>Vie</em></div>
        <div class="intro-logo-sub">Aesthetic & Lifestyle Medical Travel</div>
      </div>
      <div class="intro-tagline-large">
        "Where the precision of South African medicine meets the beauty of her landscapes — and every journey is a transformation."
      </div>
      <div class="intro-stats">
        <div class="intro-stat"><div class="intro-stat-n">$31B</div><div class="intro-stat-l">Global Medical Tourism Market</div></div>
        <div class="intro-stat"><div class="intro-stat-n">11.6%</div><div class="intro-stat-l">Forecast Industry CAGR to 2032</div></div>
        <div class="intro-stat"><div class="intro-stat-n">500k+</div><div class="intro-stat-l">Intl. Patients Treated in SA Annually</div></div>
        <div class="intro-stat"><div class="intro-stat-n">#1</div><div class="intro-stat-l">Africa's Premier Medical Destination</div></div>
      </div>
      <!-- Pillar preview images: patient in theatre (Aesthetic) + executive shaking hands with doctor (Preventative) -->
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;margin-top:0.5rem;">

        <!-- Pillar I: Patient in theatre, fully draped, under preparation for aesthetic procedure -->
        <div style="position:relative;overflow:hidden;border:1px solid var(--border);">
          <img src="https://images.unsplash.com/photo-1630693765398-42e14a94cafd?w=700&q=85"
               alt="Patient Prepared in Theatre — Aesthetic Procedure"
               style="width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 30%;display:block;filter:brightness(0.62) saturate(0.75);">
          <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.94) 0%,rgba(14,14,12,0.08) 55%);"></div>
          <div style="position:absolute;bottom:0.6rem;left:0.75rem;right:0.4rem;">
            <div style="font-size:0.5rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.2rem;font-family:'Jost',sans-serif;">Aesthetic Surgery</div>
            <div style="font-family:'Cormorant Garamond',serif;font-size:0.82rem;color:rgba(255,255,255,0.92);font-style:italic;line-height:1.3;">Theatre preparation · World-class precision</div>
          </div>
          <div style="position:absolute;top:0.6rem;left:0.6rem;background:rgba(184,148,63,0.15);border:1px solid rgba(184,148,63,0.45);padding:0.25rem 0.5rem;font-size:0.48rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold2);font-family:'Jost',sans-serif;">Pillar I</div>
        </div>

        <!-- Pillar II: Well-dressed executive shaking hands with doctor — health satisfaction -->
        <div style="position:relative;overflow:hidden;border:1px solid var(--border);">
          <img src="https://images.unsplash.com/photo-1666214280577-5b2e1e9f5aca?w=700&q=85"
               alt="Executive Shaking Hands with Doctor — Preventative Wellness Satisfaction"
               style="width:100%;aspect-ratio:4/3;object-fit:cover;object-position:center 20%;display:block;filter:brightness(0.68) saturate(0.82);">
          <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.94) 0%,rgba(14,14,12,0.08) 55%);"></div>
          <div style="position:absolute;bottom:0.6rem;left:0.75rem;right:0.4rem;">
            <div style="font-size:0.5rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.2rem;font-family:'Jost',sans-serif;">Preventative Travel</div>
            <div style="font-family:'Cormorant Garamond',serif;font-size:0.82rem;color:rgba(255,255,255,0.92);font-style:italic;line-height:1.3;">Clinical confidence · Your health, confirmed</div>
          </div>
          <div style="position:absolute;top:0.6rem;left:0.6rem;background:rgba(184,148,63,0.15);border:1px solid rgba(184,148,63,0.45);padding:0.25rem 0.5rem;font-size:0.48rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold2);font-family:'Jost',sans-serif;">Pillar II</div>
        </div>

      </div>
    </div>
    <div class="intro-right">
      <div class="sec-eyebrow" style="justify-content:flex-start;margin-bottom:1rem;">Our Philosophy</div>
      <h2>South Africa's <em>Medical Excellence,</em><br>Delivered in Absolute Privacy</h2>
      <p>Polivia Vie is not simply a travel facilitator — we are a bespoke medical concierge service, connecting high-net-worth individuals and discerning professionals with South Africa's foremost aesthetic surgeons, preventative health specialists, and luxury hospitality partners.</p>
      <p>Our curated journeys seamlessly integrate world-class clinical outcomes with extraordinary experiences across the Cape Winelands, the Kruger corridor, the KwaZulu-Natal coast, and the Drakensberg escarpment — all within an envelope of absolute discretion.</p>
      <div class="intro-features">
        <div class="intro-feature"><div class="feature-dot"></div>All consultations conducted by HPCSA-registered medical professionals</div>
        <div class="intro-feature"><div class="feature-dot"></div>Patient data managed under POPIA-compliant, South Africa-hosted platforms</div>
        <div class="intro-feature"><div class="feature-dot"></div>Private luxury transfers from O.R. Tambo, Cape Town & King Shaka airports</div>
        <div class="intro-feature"><div class="feature-dot"></div>Bilingual (EN/FR) personal concierge assigned to every client</div>
        <div class="intro-feature"><div class="feature-dot"></div>Strategic partner: Vivari Aesthetics Clinic & Tours</div>
        <div class="intro-feature"><div class="feature-dot"></div>Post-procedure recovery retreat options at 4 & 5-star partner properties</div>
      </div>
      <a href="#enquiry" class="btn-gold-outline" style="display:inline-flex;margin-top:0.5rem;">Request Private Consultation →</a>
    </div>
  </div>
</section>

<!-- ══ SERVICES / PACKAGES ══ -->
<section class="services" id="services" style="background:var(--ivory);padding:6rem 5%;">
  <div class="sec-header">
    <div class="sec-eyebrow">Our Two Pillars</div>
    <h2 class="sec-title">Curated <em>Medical Journeys</em></h2>
    <p class="sec-sub">Two distinct paths to transformation — explore both below. Click any package for full details.</p>
  </div>

  <div class="max-w" id="packages">

    <!-- ════ PILLAR I: AESTHETIC ════ -->
    <div style="background:var(--white);border:1px solid var(--border);padding:0;margin:0 auto 2.5rem;max-width:1100px;overflow:hidden;">
      <!-- Pillar header bar -->
      <div style="background:var(--deep);padding:1.1rem 2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;">
        <div style="display:flex;align-items:center;gap:1.25rem;">
          <div style="width:36px;height:36px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:0.95rem;color:var(--gold);flex-shrink:0;">I</div>
          <div>
            <div style="font-family:'Cormorant Garamond',serif;font-size:1.25rem;font-weight:300;color:var(--white);line-height:1;">Aesthetic Travel</div>
            <div style="font-family:'Jost',sans-serif;font-size:0.6rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--gold2);margin-top:0.2rem;">Surgical & Non-Surgical Aesthetic Excellence</div>
          </div>
        </div>
        <div style="font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.3);font-family:'Jost',sans-serif;">Vivari Aesthetics Partner</div>
      </div>
      <!-- Body -->
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;">
        <!-- LEFT: stacked images -->
        <div style="display:flex;flex-direction:column;gap:0;">
          <!-- Top: patient in theatre, draped and prepared for procedure -->
          <div style="position:relative;overflow:hidden;flex:1;min-height:220px;">
            <img src="https://images.unsplash.com/photo-1631217868264-e5b90bb7e133?w=900&q=85"
                 alt="Patient in Theatre — Pre-Procedure Preparation"
                 style="width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;filter:brightness(0.6) saturate(0.72);">
            <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.9) 0%,rgba(14,14,12,0.05) 55%);"></div>
            <div style="position:absolute;top:1rem;left:1rem;background:rgba(184,148,63,0.15);border:1px solid var(--gold2);padding:0.35rem 0.75rem;font-size:0.52rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold2);font-family:'Jost',sans-serif;">Theatre Preparation</div>
            <div style="position:absolute;bottom:1rem;left:1.1rem;right:1rem;">
              <div style="font-size:0.55rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold3);margin-bottom:0.25rem;font-family:'Jost',sans-serif;">Aesthetic Surgery Suite</div>
              <div style="font-family:'Cormorant Garamond',serif;font-size:1rem;font-style:italic;color:rgba(255,255,255,0.9);line-height:1.3;">Patient preparation — world-class precision in every procedure</div>
            </div>
          </div>
          <!-- Bottom: Vivari clinic / aesthetic consultation -->
          <div style="position:relative;overflow:hidden;flex:1;min-height:180px;border-top:2px solid var(--gold);">
            <img src="https://images.unsplash.com/photo-1612349317150-e413f6a5b16d?w=900&q=80" alt="Aesthetic Consultation — Vivari Partner Clinic" style="width:100%;height:100%;object-fit:cover;object-position:center;display:block;filter:brightness(0.72);">
            <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.78) 0%,transparent 55%);"></div>
            <div style="position:absolute;bottom:1rem;left:1.1rem;font-size:0.58rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold2);font-family:'Jost',sans-serif;">Vivari Aesthetics Clinic & Tours · Partner Facility</div>
          </div>
        </div>
        <!-- RIGHT: content + packages -->
        <div style="padding:2rem 2rem 2rem 2.25rem;border-left:1px solid var(--border);display:flex;flex-direction:column;justify-content:space-between;">
          <div>
            <h3 style="font-family:'Cormorant Garamond',serif;font-size:1.9rem;font-weight:300;color:var(--deep);margin-bottom:0.75rem;line-height:1.15;">The Art of<br><em style="color:var(--gold);">Refined Beauty</em></h3>
            <p style="font-size:0.88rem;line-height:1.85;color:var(--muted);margin-bottom:1.5rem;font-weight:300;">In partnership with Vivari Aesthetics Clinic, Polivia Vie offers access to South Africa's most accomplished aesthetic surgeons — delivering outcomes that rival the world's finest clinics at a fraction of the European or North American cost.</p>
            <div class="pkg-list">
              <div class="pkg-item" onclick="openModal('prestige')"><div class="pkg-item-body"><div class="pkg-item-name">The Prestige Aesthetic Journey</div><div class="pkg-item-desc">Surgical procedures + 7-night luxury Cape Town recovery + Winelands experience</div></div><div class="pkg-item-price">from R 109,500 <span style="font-size:0.75em;opacity:0.65;">($5,920)</span></div></div>
              <div class="pkg-item" onclick="openModal('renewal')"><div class="pkg-item-body"><div class="pkg-item-name">The Renewal Retreat</div><div class="pkg-item-desc">Non-surgical aesthetics (Botox, fillers, laser, skin resurfacing) + 4-night spa retreat</div></div><div class="pkg-item-price">from R 36,800 <span style="font-size:0.75em;opacity:0.65;">($1,990)</span></div></div>
              <div class="pkg-item" onclick="openModal('signature')"><div class="pkg-item-body"><div class="pkg-item-name">Signature Body Contouring Programme</div><div class="pkg-item-desc">Liposuction / body sculpting + 10-night recovery with safari extension</div></div><div class="pkg-item-price">from R 167,000 <span style="font-size:0.75em;opacity:0.65;">($9,030)</span></div></div>
              <div class="pkg-item" onclick="openModal('dental')"><div class="pkg-item-body"><div class="pkg-item-name">The Smile & Wellness Collection</div><div class="pkg-item-desc">Cosmetic dentistry (veneers, implants, whitening) + city & coastal experience</div></div><div class="pkg-item-price">from R 55,200 <span style="font-size:0.75em;opacity:0.65;">($2,985)</span></div></div>
            </div>
          </div>
          <a href="#enquiry" class="btn-gold-outline" style="display:inline-flex;margin-top:1.5rem;align-self:flex-start;">Begin Your Aesthetic Journey →</a>
        </div>
      </div>
    </div>

    <!-- ════ PILLAR II: PREVENTATIVE ════ -->
    <div style="background:var(--white);border:1px solid var(--border);padding:0;margin:0 auto;max-width:1100px;overflow:hidden;">
      <!-- Pillar header bar -->
      <div style="background:var(--deep2);padding:1.1rem 2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:2px solid var(--gold);">
        <div style="display:flex;align-items:center;gap:1.25rem;">
          <div style="width:36px;height:36px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:0.95rem;color:var(--gold);flex-shrink:0;">II</div>
          <div>
            <div style="font-family:'Cormorant Garamond',serif;font-size:1.25rem;font-weight:300;color:var(--white);line-height:1;">Lifestyle & Preventative Travel</div>
            <div style="font-family:'Jost',sans-serif;font-size:0.6rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--gold2);margin-top:0.2rem;">Executive Health Screening · Wellness Packages</div>
          </div>
        </div>
        <div style="font-size:0.7rem;letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.3);font-family:'Jost',sans-serif;">HPCSA-Registered Physicians</div>
      </div>
      <!-- Body: content LEFT, images RIGHT -->
      <div style="display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;">
        <!-- LEFT: content + packages -->
        <div style="padding:2rem 2.25rem 2rem 2rem;border-right:1px solid var(--border);display:flex;flex-direction:column;justify-content:space-between;">
          <div>
            <h3 style="font-family:'Cormorant Garamond',serif;font-size:1.9rem;font-weight:300;color:var(--deep);margin-bottom:0.75rem;line-height:1.15;">Know Your Health.<br><em style="color:var(--gold);">Own Your Future.</em></h3>
            <p style="font-size:0.88rem;line-height:1.85;color:var(--muted);margin-bottom:1.5rem;font-weight:300;">Designed for forward-thinking young professionals, our Lifestyle Travel programmes combine comprehensive medical screening with South Africa's most extraordinary experiences. Know your numbers, understand your body, and return home with clarity and vitality.</p>
            <div class="pkg-list">
              <div class="pkg-item" onclick="openModal('vitality')"><div class="pkg-item-body"><div class="pkg-item-name">The Executive Vitality Screen</div><div class="pkg-item-desc">Full-body MOT (blood panel, cardiac, metabolic, imaging) + 3-night city hotel</div></div><div class="pkg-item-price">from R 32,800 <span style="font-size:0.75em;opacity:0.65;">($1,773)</span></div></div>
              <div class="pkg-item" onclick="openModal('premier')"><div class="pkg-item-body"><div class="pkg-item-name">The Premier Wellness & Safari</div><div class="pkg-item-desc">Advanced health screen + genetic risk profiling + 5-night Kruger/Sabi Sands safari</div></div><div class="pkg-item-price">from R 89,700 <span style="font-size:0.75em;opacity:0.65;">($4,850)</span></div></div>
              <div class="pkg-item" onclick="openModal('coastal')"><div class="pkg-item-body"><div class="pkg-item-name">The Coastal Wellness Escape</div><div class="pkg-item-desc">Preventative health screen + nutrition consult + 5-night Durban/Garden Route stay</div></div><div class="pkg-item-price">from R 59,800 <span style="font-size:0.75em;opacity:0.65;">($3,230)</span></div></div>
              <div class="pkg-item" onclick="openModal('winelands')"><div class="pkg-item-body"><div class="pkg-item-name">Winelands Wellness Immersion</div><div class="pkg-item-desc">Comprehensive health screen + mindfulness programme + 4-night Stellenbosch estate</div></div><div class="pkg-item-price">from R 50,600 <span style="font-size:0.75em;opacity:0.65;">($2,735)</span></div></div>
            </div>
          </div>
          <a href="#enquiry" class="btn-gold-outline" style="display:inline-flex;margin-top:1.5rem;align-self:flex-start;">Begin Your Wellness Journey →</a>
        </div>
        <!-- RIGHT: three-image stack — handshake + blood draw + DNA lab -->
        <div style="display:flex;flex-direction:column;gap:0;">

          <!-- TOP: executive shaking hands with doctor — satisfaction, confidence -->
          <div style="position:relative;overflow:hidden;flex:1.4;min-height:200px;">
            <img src="https://images.unsplash.com/photo-1651008376811-b90baee60c1f?w=900&q=85"
                 alt="Executive and Doctor Shaking Hands — Clinical Satisfaction"
                 style="width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;filter:brightness(0.68) saturate(0.85);">
            <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.85) 0%,rgba(14,14,12,0.05) 60%);"></div>
            <div style="position:absolute;top:1rem;right:1rem;background:rgba(184,148,63,0.15);border:1px solid var(--gold2);padding:0.35rem 0.75rem;font-size:0.52rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold2);font-family:'Jost',sans-serif;">HPCSA Registered</div>
            <div style="position:absolute;bottom:1rem;left:1.1rem;right:1rem;">
              <div style="font-size:0.55rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold3);margin-bottom:0.25rem;font-family:'Jost',sans-serif;">Clinical Confidence</div>
              <div style="font-family:'Cormorant Garamond',serif;font-size:1rem;font-style:italic;color:rgba(255,255,255,0.9);line-height:1.3;">Executive wellness — confirmed by specialists you can trust</div>
            </div>
          </div>

          <!-- BOTTOM ROW: blood draw left + DNA/lab right -->
          <div style="display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:2px solid var(--gold);">

            <!-- Executive blood draw in upmarket private clinic -->
            <div style="position:relative;overflow:hidden;min-height:200px;">
              <img src="https://images.unsplash.com/photo-1584820927498-cfe5211fd8bf?w=600&q=85"
                   alt="Executive Blood Draw — Private Clinic Diagnostics"
                   style="width:100%;height:100%;object-fit:cover;object-position:center top;display:block;filter:brightness(0.68) saturate(0.82);">
              <div style="position:absolute;inset:0;background:linear-gradient(to top,rgba(14,14,12,0.9) 0%,rgba(14,14,12,0.08) 55%);"></div>
              <div style="position:absolute;bottom:0;left:0;right:0;padding:0.75rem 0.9rem;">
                <div style="font-size:0.5rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.2rem;font-family:'Jost',sans-serif;">Precision Diagnostics</div>
                <div style="font-family:'Cormorant Garamond',serif;font-size:0.85rem;font-style:italic;color:rgba(255,255,255,0.9);line-height:1.3;">Private clinic, expert hands</div>
              </div>
            </div>

            <!-- DNA + lab science fusion — advanced genomic profiling -->
            <div style="position:relative;overflow:hidden;min-height:200px;background:var(--deep3);border-left:1px solid rgba(184,148,63,0.2);">
              <img src="https://images.unsplash.com/photo-1532187863486-abf9dbad1b69?w=600&q=85"
                   alt="Lab Analysis — DNA Strands, Biomarkers and Genomic Profiling"
                   style="width:100%;height:100%;object-fit:cover;object-position:center;display:block;filter:brightness(0.5) saturate(1.4) hue-rotate(8deg);">
              <!-- gold tint science overlay -->
              <div style="position:absolute;inset:0;background:linear-gradient(145deg,rgba(184,148,63,0.2) 0%,rgba(14,14,12,0.0) 40%,rgba(14,14,12,0.88) 100%);"></div>
              <!-- subtle lab grid lines -->
              <div style="position:absolute;inset:0;background-image:linear-gradient(rgba(184,148,63,0.06) 1px,transparent 1px),linear-gradient(90deg,rgba(184,148,63,0.06) 1px,transparent 1px);background-size:26px 26px;"></div>
              <div style="position:absolute;top:0.75rem;right:0.75rem;font-size:1.1rem;opacity:0.45;">🧬</div>
              <div style="position:absolute;bottom:0;left:0;right:0;padding:0.75rem 0.9rem;">
                <div style="font-size:0.5rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.2rem;font-family:'Jost',sans-serif;">Genomic & Lab Analysis</div>
                <div style="font-family:'Cormorant Garamond',serif;font-size:0.85rem;font-style:italic;color:rgba(255,255,255,0.9);line-height:1.3;">DNA · Biomarkers · Advanced Profiling</div>
              </div>
            </div>

          </div>
        </div>
      </div>
    </div>

  </div>
</section>

<!-- ══ DESTINATIONS GALLERY ══ -->
<section class="destinations" id="destinations">
  <div class="sec-header">
    <div class="sec-eyebrow" style="color:var(--gold2);">Four Extraordinary Regions</div>
    <h2 class="sec-title light">South Africa's <em>Most Magnificent</em> Backdrops</h2>
    <p class="sec-sub light">Every medical journey is paired with an extraordinary experience — whether you recover beside Atlantic surf, beneath Mpumalanga's escarpment, amid Limpopo's bushveld, or in the Cape's ancient winelands.</p>
  </div>
  <div class="dest-grid max-w">
    <div class="dest-card" onclick="showToast('Cape Town & Winelands','The Mother City and her celebrated winelands — home to world-class private hospitals, boutique recovery retreats, and South Africa\'s finest cuisine.')">
      <img class="dest-img" src="https://images.unsplash.com/photo-1580060839134-75a5edca2e99?w=1000&q=80" alt="Cape Town">
      <div class="dest-over"></div>
      <div class="dest-info"><div class="dest-region">Western Cape</div><div class="dest-name">Cape Town &<br>The Winelands</div><div class="dest-tag">Aesthetic Recovery · Wellness</div></div>
    </div>
    <div class="dest-card" onclick="showToast('Kruger & Limpopo','The heart of the African bush — big five safaris, exclusive lodges, and restorative wilderness for the ultimate post-procedure recovery.')">
      <img class="dest-img" src="https://images.unsplash.com/photo-1516426122078-c23e76319801?w=700&q=80" alt="Kruger Safari">
      <div class="dest-over"></div>
      <div class="dest-info"><div class="dest-region">Limpopo</div><div class="dest-name">Kruger &<br>Limpopo</div><div class="dest-tag">Safari · Recovery Lodges</div></div>
    </div>
    <div class="dest-card" onclick="showToast('Mpumalanga','The Panorama Route, Blyde River Canyon, and luxury escarpment lodges — a dramatic backdrop for post-procedure restoration.')">
      <img class="dest-img" src="https://images.unsplash.com/photo-1547471080-7cc2caa01a7e?w=700&q=80" alt="Mpumalanga">
      <div class="dest-over"></div>
      <div class="dest-info"><div class="dest-region">Mpumalanga</div><div class="dest-name">Panorama &<br>Escarpment</div><div class="dest-tag">Nature · Recovery</div></div>
    </div>
    <div class="dest-card" onclick="showToast('KwaZulu-Natal','Durban\'s warm Indian Ocean, the Valley of a Thousand Hills, and Zulu cultural experiences — vibrant and restorative in equal measure.')">
      <img class="dest-img" src="https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=700&q=80" alt="KZN Coast">
      <div class="dest-over"></div>
      <div class="dest-info"><div class="dest-region">KwaZulu-Natal</div><div class="dest-name">Durban &<br>KZN Coast</div><div class="dest-tag">Coastal · Cultural</div></div>
    </div>
  </div>
</section>

<!-- ══ CONCIERGE PROCESS ══ -->
<section class="concierge" id="concierge">
  <div class="concierge-grid">
    <div class="concierge-img-wrap">
      <img class="concierge-img" src="https://images.unsplash.com/photo-1551836022-deb4988cc6c0?w=700&q=80" alt="Concierge Service">
      <div class="concierge-badge">
        <div class="concierge-badge-n">24/7</div>
        <div class="concierge-badge-t">Personal Concierge</div>
      </div>
    </div>
    <div class="concierge-right">
      <div class="sec-eyebrow" style="justify-content:flex-start;margin-bottom:1rem;">Bespoke Care Process</div>
      <h2>Your Journey,<br><em>Guided</em> at Every Step</h2>
      <p>From your first enquiry to your safe return home, your dedicated bilingual concierge manages every detail — coordinating your specialist consultations, accommodation, transfers, and experiences with absolute precision.</p>
      <div class="lang-pills">
        <div class="lang-pill">🇬🇧 English Concierge</div>
        <div class="lang-pill">🇫🇷 Concierge Francophone</div>
      </div>
      <div class="concierge-steps">
        <div class="cstep"><div class="cstep-num">1</div><div class="cstep-body"><div class="cstep-title">Confidential Enquiry</div><div class="cstep-desc">Submit your enquiry via our encrypted portal. All information is processed under POPIA and handled exclusively by trained staff.</div></div></div>
        <div class="cstep"><div class="cstep-num">2</div><div class="cstep-body"><div class="cstep-title">Medical Consultation</div><div class="cstep-desc">A HPCSA-registered medical professional contacts you within 48 hours for a confidential telehealth pre-consultation and needs assessment.</div></div></div>
        <div class="cstep"><div class="cstep-num">3</div><div class="cstep-body"><div class="cstep-title">Bespoke Journey Design</div><div class="cstep-desc">Your concierge crafts a tailored itinerary — clinic appointments, luxury accommodation, transfers, and curated experiences — for your review and approval.</div></div></div>
        <div class="cstep"><div class="cstep-num">4</div><div class="cstep-body"><div class="cstep-title">Arrival & In-Destination Care</div><div class="cstep-desc">Private airport transfer, dedicated in-destination support, clinic coordination, and daily concierge availability throughout your stay.</div></div></div>
        <div class="cstep"><div class="cstep-num">5</div><div class="cstep-body"><div class="cstep-title">Post-Journey Follow-Up</div><div class="cstep-desc">Facilitated specialist follow-up consultations via telehealth, medical report delivery, and aftercare coordination from your home country.</div></div></div>
      </div>
    </div>
  </div>
</section>

<!-- ══ PRIVACY & DATA ══ -->
<section class="privacy" id="privacy">
  <div class="max-w">
    <div class="sec-header">
      <div class="sec-eyebrow" style="color:var(--gold2);">Your Confidentiality, Guaranteed</div>
      <h2 class="sec-title light">Absolute <em>Discretion.</em><br>Uncompromising Security.</h2>
      <p class="sec-sub light">Your health is your most private asset. Polivia Vie operates under South Africa's POPIA framework — the continent's most rigorous data protection law — ensuring your medical information is never compromised.</p>
    </div>
    <div class="privacy-inner">
      <div class="privacy-left">
        <h2>POPIA-Compliant<br><em>End-to-End</em></h2>
        <p>Every piece of patient data processed by Polivia Vie is classified as "Special Personal Information" under POPIA — the highest level of legal protection available in South Africa. Our systems, staff, and partners are all bound by strict data processing agreements and consent protocols.</p>
        <p>We do not transfer patient data beyond South African borders without explicit consent and regulatory authorisation, and all data is stored on locally-hosted, encrypted infrastructure.</p>
        <div class="privacy-cards">
          <div class="privacy-card"><div class="privacy-icon">🔐</div><div><div class="privacy-card-title">Encrypted at Rest & in Transit</div><div class="privacy-card-desc">All patient records and communications are encrypted using AES-256. No third party can access your information without explicit consent.</div></div></div>
          <div class="privacy-card"><div class="privacy-icon">🏛️</div><div><div class="privacy-card-title">POPIA Special Personal Information Protocols</div><div class="privacy-card-desc">Your health data is governed under Section 26–32 of POPIA. Explicit consent is required before any processing, storage, or sharing.</div></div></div>
          <div class="privacy-card"><div class="privacy-icon">👁️</div><div><div class="privacy-card-title">Role-Based Access Control</div><div class="privacy-card-desc">Only your assigned medical professional and concierge can access your records. Administrative staff see only what is strictly necessary.</div></div></div>
          <div class="privacy-card"><div class="privacy-icon">📋</div><div><div class="privacy-card-title">Registered Information Officer</div><div class="privacy-card-desc">A dedicated Information Officer, registered with South Africa's Information Regulator, oversees all data governance practices.</div></div></div>
        </div>
      </div>
      <div>
        <div class="privacy-cards">
          <div class="privacy-card"><div class="privacy-icon">🇿🇦</div><div><div class="privacy-card-title">South Africa-Hosted Data Sovereignty</div><div class="privacy-card-desc">In compliance with the 2024 National Policy on Data and Cloud, patient data is stored exclusively within South African data centres.</div></div></div>
          <div class="privacy-card"><div class="privacy-icon">📞</div><div><div class="privacy-card-title">Telehealth via Secure Channels</div><div class="privacy-card-desc">Pre- and post-procedure consultations conducted via end-to-end encrypted telehealth platforms with no third-party recording.</div></div></div>
          <div class="privacy-card"><div class="privacy-icon">🤐</div><div><div class="privacy-card-title">Staff Confidentiality Agreements</div><div class="privacy-card-desc">Every Polivia Vie staff member and partner institution signs binding confidentiality and data processing agreements aligned to POPIA.</div></div></div>
        </div>
        <div class="platform-rec">
          <div class="platform-rec-title">Recommended Secure Medical Exchange Platforms</div>
          <p>For the secure exchange of medical information between clients, specialists, and Polivia Vie, we recommend POPIA-compliant, South Africa-hosted platforms:</p>
          <div class="platform-item"><strong style="color:var(--gold2);">PrivateHub Online</strong> — SA-hosted, healthcare-specific, no per-user licensing, POPIA-aligned cloud storage and document exchange</div>
          <div class="platform-item"><strong style="color:var(--gold2);">Microsoft Azure (SA North Region)</strong> — Enterprise-grade cloud with SA data residency, ISO 27018 privacy standard, GDPR-aligned</div>
          <div class="platform-item"><strong style="color:var(--gold2);">Altron HealthTech Platform</strong> — South African healthcare-specific EHR with AES encryption, RBAC, and full POPIA compliance framework</div>
          <div class="platform-item"><strong style="color:var(--gold2);">Walla POPIA-Compliant Forms</strong> — Secure patient intake, consent management, and health data collection with POPIA-specific consent workflows</div>
        </div>
      </div>
    </div>
  </div>
</section>

<!-- ══ PARTNER ══ -->
<section class="partner" id="partner">
  <div class="partner-grid max-w">
    <div>
      <div class="partner-logo-area">
        <div style="width:64px;height:64px;border-radius:50%;border:1px solid var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;font-size:1.5rem;color:var(--gold);">V</div>
        <div class="partner-logo-name">Vivari</div>
        <div class="partner-logo-sub">Aesthetics Clinic & Tours</div>
        <div style="height:1px;width:100%;background:var(--border);margin:1rem 0;"></div>
        <div class="partner-services">
          <div class="partner-svc">Facial Aesthetics & Injectables</div>
          <div class="partner-svc">Body Contouring & Sculpting</div>
          <div class="partner-svc">Surgical Aesthetic Procedures</div>
          <div class="partner-svc">Skin Treatments & Laser Therapy</div>
          <div class="partner-svc">Post-Procedure Recovery Tours</div>
          <div class="partner-svc">Concierge Aesthetic Consultations</div>
        </div>
      </div>
      <div style="margin-top:2rem;">
        <p style="font-size:0.75rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--muted);margin-bottom:1rem;">Preferred Hotel Partners</p>
        <div class="hotel-logos">
          <div class="hotel-logo">One&Only<br><span style="font-size:0.7rem;font-weight:300;color:var(--muted);">Cape Town</span></div>
          <div class="hotel-logo">Singita<br><span style="font-size:0.7rem;font-weight:300;color:var(--muted);">Sabi Sands</span></div>
          <div class="hotel-logo">The Saxon<br><span style="font-size:0.7rem;font-weight:300;color:var(--muted);">Johannesburg</span></div>
          <div class="hotel-logo">Delaire Graff<br><span style="font-size:0.7rem;font-weight:300;color:var(--muted);">Stellenbosch</span></div>
          <div class="hotel-logo">Oyster Box<br><span style="font-size:0.7rem;font-weight:300;color:var(--muted);">Durban</span></div>
          <div class="hotel-logo">Protea Hotels<br><span style="font-size:0.7rem;font-weight:300;color:var(--muted);">Nationwide</span></div>
        </div>
      </div>
    </div>
    <div class="partner-right">
      <div class="sec-eyebrow" style="justify-content:flex-start;margin-bottom:1rem;">Exclusive Partnership</div>
      <h2>Vivari Aesthetics<br><em>Clinic & Tours</em></h2>
      <p>Polivia Vie is proud to operate in exclusive partnership with Vivari Aesthetics Clinic & Tours — one of South Africa's most respected aesthetic medicine practices. Together, we deliver an unmatched fusion of clinical excellence and experiential luxury.</p>
      <p>Vivari's team of HPCSA-registered specialists bring decades of combined experience across facial aesthetics, body contouring, and reconstructive procedures. Every Polivia Vie aesthetic client receives a dedicated clinical coordinator at Vivari, ensuring seamless care from pre-operative consultation through to post-procedure aftercare.</p>
      <div style="height:1px;background:var(--border);margin:1.5rem 0;"></div>
      <p style="font-size:0.8rem;color:var(--muted);font-style:italic;line-height:1.75;">"Our partnership with Vivari ensures that every aesthetic client receives not only the finest clinical outcome, but an experience that honours their trust, their time, and their transformation." — Polivia Vie</p>
      <a href="#enquiry" class="btn-gold-outline" style="display:inline-flex;margin-top:1.75rem;">Partner With Us →</a>
    </div>
  </div>
</section>

<!-- ══ SA MEDICAL RESEARCH ══ -->
<section class="research" id="research">
  <div class="sec-header">
    <div class="sec-eyebrow" style="color:var(--gold2);">Industry Intelligence</div>
    <h2 class="sec-title light">Why <em>South Africa</em> Leads</h2>
    <p class="sec-sub light">The data makes a compelling case. South Africa's medical tourism industry is world-class — and Polivia Vie positions you at its most exclusive tier.</p>
  </div>
  <div class="research-grid max-w">
    <div class="research-card">
      <div class="research-stat">500k+</div>
      <div class="research-title">International Patients</div>
      <div class="research-body">South Africa treated nearly 500,000 international patients in 2018 — predominantly for cosmetic surgery, fertility, and cardiology — and numbers have grown substantially since. The country leads Sub-Saharan Africa in both patient volume and medical tourism revenue.</div>
    </div>
    <div class="research-card">
      <div class="research-stat">$3,600</div>
      <div class="research-title">Typical Aesthetic Procedure Cost</div>
      <div class="research-body">A breast augmentation procedure that costs $8,000+ in the UK can be performed for approximately $3,600 in South Africa — by equally qualified surgeons, in world-class facilities, with the added benefit of extraordinary recovery settings.</div>
    </div>
    <div class="research-card">
      <div class="research-stat">11.6%</div>
      <div class="research-title">Global CAGR 2023–2032</div>
      <div class="research-body">The global medical tourism market is forecast to grow at 11.59% CAGR, reaching $346 billion by 2032. South Africa and the broader Africa/GCC region are among the fastest-growing segments, driven by affordability, quality, and destination appeal.</div>
    </div>
    <div class="research-card">
      <div class="research-icon">🏆</div>
      <div class="research-title">Pioneer Medical Heritage</div>
      <div class="research-body">South Africa performed the world's first successful human heart transplant in 1967 at Groote Schuur Hospital, Cape Town. This pioneering spirit defines the country's medical culture — innovative, skilled, and internationally respected.</div>
    </div>
    <div class="research-card">
      <div class="research-icon">🇿🇦</div>
      <div class="research-title">Africa's Highest Healthcare Index</div>
      <div class="research-body">Numbeo's Health Care Index consistently ranks South Africa as having the highest healthcare quality score in Africa, reflecting robust infrastructure, advanced equipment, and highly trained medical professionals across both public and private sectors.</div>
    </div>
    <div class="research-card">
      <div class="research-icon">🔒</div>
      <div class="research-title">Strongest Data Protection in Africa</div>
      <div class="research-body">South Africa's POPIA (2021) is the continent's most comprehensive data protection law, classifying health information as "Special Personal Information" with the highest level of legal safeguard. For high-net-worth clients, this provides unparalleled privacy assurance.</div>
    </div>
  </div>
</section>

<!-- ══ GALLERY ══ -->
<section class="gallery" id="gallery">
  <div class="sec-header">
    <div class="sec-eyebrow">The Experience</div>
    <h2 class="sec-title">South Africa <em>Awaits</em></h2>
    <p class="sec-sub">From the Big Five to the Winelands, from the Drakensberg to the Atlantic Seaboard — your recovery is as extraordinary as your transformation.</p>
  </div>
  <div class="gallery-grid">
    <div class="gallery-item tall">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1523805009345-7448845a9e53?w=600&q=80" alt="Cape Winelands">
      <div class="gallery-label">Cape Winelands</div>
    </div>
    <div class="gallery-item">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1535941339077-2dd1c7963098?w=500&q=80" alt="Safari">
      <div class="gallery-label">Big Five Safari · Limpopo</div>
    </div>
    <div class="gallery-item wide">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1571896349842-33c89424de2d?w=900&q=80" alt="Luxury Hotel">
      <div class="gallery-label">5-Star Recovery Retreat</div>
    </div>
    <div class="gallery-item">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1559827260-dc66d52bef19?w=500&q=80" alt="Fine Dining">
      <div class="gallery-label">Fine Dining · Cape Town</div>
    </div>
    <div class="gallery-item">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1464822759023-fed622ff2c3b?w=500&q=80" alt="Drakensberg">
      <div class="gallery-label">Drakensberg · Mpumalanga</div>
    </div>
    <div class="gallery-item">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?w=500&q=80" alt="Luxury Spa">
      <div class="gallery-label">Luxury Spa & Wellness</div>
    </div>
    <div class="gallery-item tall">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1544551763-46a013bb70d5?w=600&q=80" alt="KZN Ocean">
      <div class="gallery-label">KwaZulu-Natal Coast</div>
    </div>
    <div class="gallery-item">
      <img class="gallery-img" src="https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?w=500&q=80" alt="Restaurant">
      <div class="gallery-label">World-Class Cuisine</div>
    </div>
  </div>
</section>

<!-- ══ ENQUIRY ══ -->
<section class="enquiry" id="enquiry">
  <div class="enquiry-grid">
    <div class="enquiry-left">
      <div class="sec-eyebrow" style="color:var(--gold2);justify-content:flex-start;margin-bottom:1rem;">Begin Your Journey</div>
      <h2>Private <em>Consultation</em><br>Awaits</h2>
      <p>All enquiries are treated with absolute confidentiality. Your information is processed under POPIA by a registered Information Officer and accessible only to your assigned medical professional and concierge.</p>
      <p>A HPCSA-registered medical professional will contact you within 48 hours to discuss your requirements in complete privacy.</p>
      <div class="enq-contact">
        <div class="enq-item"><div class="enq-icon">📍</div><div><div class="enq-label">Registered Office</div><div class="enq-val">Sandton, Johannesburg, South Africa</div></div></div>
        <div class="enq-item"><div class="enq-icon">✉️</div><div><div class="enq-label">Confidential Enquiries</div><div class="enq-val"><a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="05666a6b7670697145756a696c736c64736c602b666a2b7f64">[email&#160;protected]</a></div></div></div>
        <div class="enq-item"><div class="enq-icon">📞</div><div><div class="enq-label">Private Line</div><div class="enq-val">+27 11 000 0000</div></div></div>
        <div class="enq-item"><div class="enq-icon">🇫🇷</div><div><div class="enq-label">Ligne Française</div><div class="enq-val">+27 11 000 0001</div></div></div>
        <div class="enq-item"><div class="enq-icon">🕐</div><div><div class="enq-label">Availability</div><div class="enq-val">Mon–Fri 08:00–18:00 · Sat 09:00–13:00 SAST</div></div></div>
      </div>
      <div style="margin-top:2rem;padding:1.5rem;border:1px solid rgba(184,148,63,0.2);background:rgba(184,148,63,0.05);">
        <div style="font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold2);margin-bottom:0.5rem;">Security Assurance</div>
        <p style="font-size:0.78rem;color:rgba(255,255,255,0.4);line-height:1.7;">This form is encrypted end-to-end. Your submission is processed exclusively within South Africa under POPIA. No marketing communications will be sent without your explicit consent.</p>
      </div>
    </div>
    <div class="enq-form">
      <div style="font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--gold2);margin-bottom:0.25rem;">Confidential Enquiry</div>
      <div style="font-size:0.65rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.25);margin-bottom:2rem;">All information protected under POPIA</div>
      <div class="form-row">
        <div class="field"><label>First Name</label><input type="text" placeholder="Your first name"></div>
        <div class="field"><label>Surname</label><input type="text" placeholder="Your surname"></div>
      </div>
      <div class="form-row">
        <div class="field"><label>Email Address</label><input type="email" placeholder="your@email.com"></div>
        <div class="field"><label>Contact Number</label><input type="tel" placeholder="+1 / +33 / +27 ..."></div>
      </div>
      <div class="form-row">
        <div class="field"><label>Country of Residence</label><input type="text" placeholder="Your country"></div>
        <div class="field"><label>Preferred Language</label>
          <select><option>English</option><option>Français</option></select>
        </div>
      </div>
      <div class="form-row full">
        <div class="field"><label>Journey of Interest</label>
          <select>
            <option value="">Select your area of interest...</option>
            <optgroup label="Aesthetic Travel">
              <option>The Prestige Aesthetic Journey</option>
              <option>The Renewal Retreat (Non-Surgical)</option>
              <option>Signature Body Contouring Programme</option>
              <option>The Smile & Wellness Collection</option>
            </optgroup>
            <optgroup label="Lifestyle & Preventative Travel">
              <option>The Executive Vitality Screen</option>
              <option>The Premier Wellness & Safari</option>
              <option>The Coastal Wellness Escape</option>
              <option>Winelands Wellness Immersion</option>
            </optgroup>
            <option>Bespoke / Custom Journey</option>
          </select>
        </div>
      </div>
      <div class="form-row">
        <div class="field"><label>Approximate Travel Window</label><input type="text" placeholder="e.g. Q3 2025 / July 2025"></div>
        <div class="field"><label>Number of Travellers</label>
          <select><option>1 (Solo)</option><option>2 (Couple / Companion)</option><option>3–4 (Small Group)</option></select>
        </div>
      </div>
      <div class="form-row full">
        <div class="field"><label>Confidential Notes (Optional)</label><textarea rows="3" placeholder="Any specific requirements, health considerations, or questions you wish to share confidentially..."></textarea></div>
      </div>
      <div class="consent-row">
        <input type="checkbox" id="popia-consent">
        <label for="popia-consent">I provide explicit consent for Polivia Vie to process my personal information as described in the <a href="#">Privacy Policy</a>, in accordance with POPIA. I understand my information will be held securely and accessible only to my assigned medical professional and concierge.</label>
      </div>
      <button class="btn-submit-gold" onclick="submitEnquiry()">Submit Confidential Enquiry</button>
    </div>
  </div>
</section>

<!-- ══ FOOTER ══ -->
<footer>
  <div class="footer-top">
    <div class="footer-brand">
      <div class="footer-logo-text">Polivia Vie</div>
      <div class="footer-logo-vie">Aesthetic & Lifestyle Medical Travel</div>
      <div class="footer-tagline">"Where wellness meets wonder, and medicine meets the art of living."</div>
      <div class="footer-social">
        <a href="#" class="soc-btn">Li</a>
        <a href="#" class="soc-btn">In</a>
        <a href="#" class="soc-btn">Fb</a>
      </div>
      <div style="margin-top:1.5rem;"><div class="popia-badge">🔒 POPIA Compliant</div></div>
    </div>
    <div class="footer-col">
      <h5>Services</h5>
      <ul>
        <li><a href="#services">Aesthetic Travel</a></li>
        <li><a href="#services">Preventative Wellness</a></li>
        <li><a href="#concierge">Concierge Process</a></li>
        <li><a href="#destinations">Destinations</a></li>
        <li><a href="#partner">Vivari Partnership</a></li>
      </ul>
    </div>
    <div class="footer-col">
      <h5>Destinations</h5>
      <ul>
        <li><a href="#destinations">Cape Town & Winelands</a></li>
        <li><a href="#destinations">Kruger & Limpopo</a></li>
        <li><a href="#destinations">Mpumalanga</a></li>
        <li><a href="#destinations">KwaZulu-Natal</a></li>
      </ul>
    </div>
    <div class="footer-col">
      <h5>Information</h5>
      <ul>
        <li><a href="#about">About Polivia Vie</a></li>
        <li><a href="#privacy">Privacy & POPIA</a></li>
        <li><a href="#research">Industry Research</a></li>
        <li><a href="#enquiry">Begin Consultation</a></li>
        <li><a href="#">English / Français</a></li>
      </ul>
    </div>
  </div>
  <div class="footer-bottom max-w">
    <div class="footer-copy">© 2025 Polivia Vie (Pty) Ltd. All rights reserved. Registered in South Africa.</div>
    <div class="footer-legal">
      <a href="#">Privacy Policy</a>
      <a href="#">POPIA Statement</a>
      <a href="#">Terms of Service</a>
      <a href="#">Medical Disclaimer</a>
    </div>
  </div>
  <div style="text-align:center;padding-top:2rem;font-size:0.7rem;color:rgba(255,255,255,0.15);letter-spacing:0.05em;max-width:700px;margin:0 auto;">
    Polivia Vie facilitates access to HPCSA-registered medical professionals and accredited facilities. We are a medical travel concierge service and do not provide medical advice or diagnoses. All medical decisions are made by qualified healthcare practitioners. Medical outcomes cannot be guaranteed.
  </div>
  <div style="text-align:center;padding-top:0.75rem;padding-bottom:2rem;font-size:0.68rem;color:rgba(255,255,255,0.2);letter-spacing:0.08em;max-width:700px;margin:0 auto;border-top:1px solid rgba(255,255,255,0.05);margin-top:1rem;">
    * USD pricing is indicative only and subject to the prevailing Rand (ZAR) to US Dollar (USD) exchange rate at the time of booking. All packages are priced and invoiced in South African Rand.
  </div>
</footer>

<!-- ══ PACKAGE MODALS ══ -->
<div class="modal-bg" id="modal" onclick="closeModal()">
  <div class="modal-box" onclick="event.stopPropagation()">
    <div class="modal-header">
      <div class="modal-title" id="m-title"></div>
      <div class="modal-subtitle" id="m-cat"></div>
      <button class="modal-close" onclick="closeModal()">✕</button>
    </div>
    <div class="modal-body">
      <div class="modal-price"><span id="m-price"></span> <span class="modal-price-note" id="m-note"></span></div>
      <div class="modal-desc" id="m-desc"></div>
      <div class="modal-includes">
        <div class="modal-inc-title">Package Includes</div>
        <div class="modal-inc-list" id="m-includes"></div>
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn-enquire-modal" onclick="closeModal();document.getElementById('enquiry').scrollIntoView({behavior:'smooth'})">Begin Private Consultation</button>
      <button class="btn-close-modal" onclick="closeModal()">Close</button>
    </div>
  </div>
</div>

<!-- ══ TOAST ══ -->
<div class="toast" id="toast"><div class="toast-head" id="t-head"></div><div class="toast-body" id="t-body"></div></div>

<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script>
const packages = {
  prestige: { title:'The Prestige Aesthetic Journey', cat:'Aesthetic Travel · Vivari Partner Clinic', price:'From R 109,500 (~$5,920)', note:'per person', desc:'Our flagship aesthetic package combines a bespoke surgical procedure at Vivari Aesthetics Clinic with 7 nights of luxury recovery accommodation in Cape Town. Your itinerary is crafted around your clinical programme — ensuring optimal healing in a setting of extraordinary beauty.', includes:['Pre-arrival confidential telehealth consultation with HPCSA specialist','Private airport transfer (return)','7 nights at 5-star partner hotel in Cape Town','All pre- and post-operative clinical appointments','Dedicated bilingual concierge throughout','Guided Cape Winelands recovery experience','Post-departure telehealth follow-up','Encrypted digital medical records delivery'] },
  renewal: { title:'The Renewal Retreat', cat:'Non-Surgical Aesthetics · Vivari Partner Clinic', price:'From R 36,800 (~$1,990)', note:'per person', desc:'For clients seeking aesthetic enhancement without surgery, The Renewal Retreat delivers a curated programme of injectables, laser therapy, or advanced skin treatments at Vivari, paired with a restorative 4-night luxury spa retreat at a partner property.', includes:['Confidential pre-arrival aesthetic consultation','Private airport transfer (return)','4 nights at luxury spa resort (4 or 5-star)','Full non-surgical aesthetic treatment programme at Vivari','Dedicated concierge (EN/FR)','Curated wellness & relaxation itinerary','Post-departure virtual follow-up with aesthetic nurse'] },
  signature: { title:'Signature Body Contouring Programme', cat:'Surgical Aesthetics · Vivari Partner Clinic', price:'From R 167,000 (~$9,030)', note:'per person', desc:'The most comprehensive aesthetic journey Polivia Vie offers — combining advanced body contouring procedures (liposuction, abdominoplasty, or combined sculpting) with a 10-night recovery programme that includes a private safari extension in Limpopo or Mpumalanga.', includes:['Full pre-operative assessment by HPCSA-registered surgeon','Private airport transfer (return)','4 nights post-operative in luxury Cape Town recovery suite','6-night private safari at exclusive bush lodge','24/7 clinical support during recovery phase','All follow-up appointments during stay','Encrypted medical report & post-departure virtual consultations','Bilingual personal concierge for full duration'] },
  dental: { title:'The Smile & Wellness Collection', cat:'Cosmetic Dentistry · Partner Specialists', price:'From R 55,200 (~$2,985)', note:'per person', desc:'World-class cosmetic dentistry — veneers, implants, whitening, and full smile makeovers — performed by HPCSA-registered dental specialists, combined with a curated city and coastal South African experience.', includes:['Dental assessment and treatment plan pre-arrival','Private airport transfer (return)','5 nights at partner city hotel (Johannesburg or Cape Town)','Full cosmetic dental treatment programme','Curated city dining and cultural experience','2-night coastal extension (optional)','Post-departure virtual dental check-in'] },
  vitality: { title:'The Executive Vitality Screen', cat:'Preventative Health · Lifestyle Travel', price:'From R 32,800 (~$1,773)', note:'per person', desc:'Designed for busy professionals who demand to know their health status with precision, The Executive Vitality Screen delivers a comprehensive medical assessment — full blood panel, cardiac screening, metabolic profiling, and imaging — paired with 3 nights in a world-class city hotel.', includes:['Comprehensive blood panel (80+ markers)','Cardiac assessment (ECG, stress test)','Metabolic & hormonal profiling','Full body imaging (where indicated)','Consultation with HPCSA physician — results interpretation','3 nights at 5-star city hotel (JHB or Cape Town)','Private airport transfer (return)','Encrypted digital health report delivery','HPCSA-registered physician post-departure follow-up'] },
  premier: { title:'The Premier Wellness & Safari', cat:'Preventative Health · Lifestyle Travel', price:'From R 89,700 (~$4,850)', note:'per person', desc:'Our most immersive preventative health journey — a state-of-the-art advanced health screen combined with genetic risk profiling, followed by a 5-night private safari in the Kruger/Sabi Sands, where the restorative power of the African bush completes your transformation.', includes:['Advanced health screen (100+ biomarkers, genetic risk panel)','Full cardiac, metabolic, and hormonal assessment','Brain health and cognitive function screening (optional)','Detailed physician consultation + personalised health roadmap','Private airport transfer (return)','5 nights at exclusive Kruger/Sabi Sands private game lodge','Daily game drives & exclusive lodge experiences','Encrypted health data delivery & post-trip follow-up consult'] },
  coastal: { title:'The Coastal Wellness Escape', cat:'Preventative Health · Lifestyle Travel', price:'From R 59,800 (~$3,230)', note:'per person', desc:'Health meets the ocean. A comprehensive preventative health screen combined with a nutrition and fitness consultation, then 5 nights along the KwaZulu-Natal coast or Garden Route — South Africa\'s most beautiful and restorative coastal environments.', includes:['Comprehensive preventative health screen','Nutrition and metabolic assessment','Personalised fitness and lifestyle consultation','HPCSA physician results consultation','Private airport transfer (return)','5 nights at luxury coastal hotel (Durban or Garden Route)','Curated coastal wellness & activity itinerary','Digital health report & remote follow-up'] },
  winelands: { title:'Winelands Wellness Immersion', cat:'Preventative Health · Lifestyle Travel', price:'From R 50,600 (~$2,735)', note:'per person', desc:'Where preventative medicine meets the world\'s most beautiful wine estate landscapes. A thorough health screen combined with a mindfulness and stress management programme, then 4 nights amid the vineyards of Stellenbosch and Franschhoek.', includes:['Preventative health screen (blood panel, metabolic, cardiac)','Mindfulness and stress resilience programme','Sleep quality and HRV assessment','HPCSA physician consultation','Private airport transfer (return)','4 nights at luxury Stellenbosch wine estate','Guided private wine estate experiences','Digital health report & remote follow-up consultation'] }
};

function openModal(id) {
  const p = packages[id];
  document.getElementById('m-title').textContent = p.title;
  document.getElementById('m-cat').textContent = p.cat;
  document.getElementById('m-price').textContent = p.price;
  document.getElementById('m-note').textContent = p.note;
  document.getElementById('m-desc').textContent = p.desc;
  const inc = document.getElementById('m-includes');
  inc.innerHTML = '';
  p.includes.forEach(i => { const d = document.createElement('div'); d.className = 'modal-inc-item'; d.textContent = i; inc.appendChild(d); });
  document.getElementById('modal').classList.add('open');
}
function closeModal() { document.getElementById('modal').classList.remove('open'); }
document.addEventListener('keydown', e => { if(e.key==='Escape') closeModal(); });

function showPanel(type, el) {
  document.querySelectorAll('.svc-tab').forEach(t => t.classList.remove('active'));
  document.querySelectorAll('.svc-panel').forEach(p => p.classList.remove('active'));
  el.classList.add('active');
  document.getElementById('panel-'+type).classList.add('active');
}

window.addEventListener('scroll', () => {
  document.getElementById('navbar').classList.toggle('scrolled', window.scrollY > 60);
});

function showToast(head, body) {
  const t = document.getElementById('toast');
  document.getElementById('t-head').textContent = head;
  document.getElementById('t-body').textContent = body;
  t.classList.add('visible');
  setTimeout(() => t.classList.remove('visible'), 4500);
}

function setLang(l) {
  document.querySelectorAll('.nav-lang').forEach(b => b.classList.remove('active'));
  event.target.classList.add('active');
  if(l==='FR') showToast('Version Française', 'Notre concierge francophone vous contactera dans les 48 heures suivant votre demande.');
}

function submitEnquiry() {
  const c = document.getElementById('popia-consent');
  if (!c.checked) { showToast('Consent Required', 'Please provide POPIA consent bef