/* ============================================================
   PRANA HOSPITALS — Organic Wellness Design System (static)
   Palette: #386641 · #6A994E · #A7C957 · #F2E8CF · #FFFFFF
   No animations, transitions or keyframes — instant render.
   ============================================================ */

:root {
  --ink: #386641;
  --moss: #2b5235;
  --leaf: #6A994E;
  --lime: #A7C957;
  --lime-soft: #c8dc8f;
  --cream: #F2E8CF;
  --cream-deep: #e9dcbb;
  --white: #ffffff;
  --sand: #faf6ec;
  --serif: "Fraunces", Georgia, "Times New Roman", serif;
  --sans: "Outfit", "Segoe UI", system-ui, -apple-system, sans-serif;
  --script: "Caveat", cursive;
  --shadow-soft: 0 24px 60px -24px rgba(56, 102, 65, 0.28);
  --shadow-blob: 0 30px 70px -30px rgba(56, 102, 65, 0.4);
}

* { box-sizing: border-box; }

html { scroll-behavior: auto; }

body {
  font-family: var(--sans);
  color: var(--ink);
  background-color: var(--cream);
  line-height: 1.65;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 { font-family: var(--serif); color: var(--ink); line-height: 1.12; }

::selection { background: var(--lime); color: var(--moss); }

img { display: block; }

a { text-decoration: none; color: inherit; }

/* ---------- Container ---------- */
.container-site { width: min(1180px, 92%); margin-inline: auto; }

/* ---------- Typography helpers ---------- */
.display-xl { font-size: clamp(2.5rem, 6vw, 4.6rem); }
.display-lg { font-size: clamp(2rem, 4.5vw, 3.4rem); }
.display-md { font-size: clamp(1.6rem, 3vw, 2.4rem); }
.display-sm { font-size: clamp(1.25rem, 2vw, 1.7rem); }
.eyebrow {
  font-family: var(--script);
  font-size: 1.45rem;
  color: var(--leaf);
  letter-spacing: 0.01em;
}
.overline-tag {
  display: inline-flex; align-items: center; gap: .55rem;
  font-size: .78rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: var(--leaf); padding: .5rem 1.15rem; border-radius: 999px;
  border: 1px solid rgba(106,153,78,.35); background: rgba(255,255,255,.55);
}

/* ---------- Buttons ---------- */
.btn-organic {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  padding: 1rem 2rem; border-radius: 999px;
  background: linear-gradient(135deg, var(--leaf), var(--ink));
  color: #fff; font-weight: 600; font-size: .98rem;
  box-shadow: 0 14px 30px -12px rgba(56,102,65,.55);
  border: none; cursor: pointer; position: relative; overflow: hidden;
}
.btn-organic:hover { background: linear-gradient(135deg, var(--ink), var(--moss)); }

.btn-outline {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  padding: 1rem 2rem; border-radius: 999px;
  border: 1.5px solid var(--leaf); color: var(--ink); font-weight: 600; font-size: .98rem;
  background: rgba(255,255,255,.6); cursor: pointer;
}
.btn-outline:hover { background: var(--leaf); color: #fff; }

.btn-lime {
  display: inline-flex; align-items: center; justify-content: center; gap: .6rem;
  padding: 1rem 2rem; border-radius: 999px;
  background: var(--lime); color: var(--moss); font-weight: 700; font-size: .98rem;
  box-shadow: 0 14px 30px -14px rgba(167,201,87,.8);
  border: none; cursor: pointer;
}
.btn-lime:hover { background: var(--lime-soft); }

.btn-pill {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .65rem 1.4rem; border-radius: 999px; font-weight: 600; font-size: .9rem;
  border: 1px solid rgba(56,102,65,.25); color: var(--ink); background: var(--white);
  cursor: pointer;
}
.btn-pill:hover { background: var(--ink); color: var(--white); }

/* ---------- Organic shapes / blobs ---------- */
.blob-a { border-radius: 62% 38% 55% 45% / 48% 56% 44% 52%; }
.blob-b { border-radius: 42% 58% 63% 37% / 44% 52% 48% 56%; }
.blob-c { border-radius: 55% 45% 38% 62% / 56% 40% 60% 44%; }
.blob-d { border-radius: 40% 60% 58% 42% / 60% 42% 58% 40%; }
.blob-e { border-radius: 60% 40% 47% 53% / 44% 58% 42% 56%; }
.blob-leaf { border-radius: 0 68% 68% 68% / 0 62% 62% 62%; }

.photo-organic { overflow: hidden; position: relative; }
.photo-organic img { width: 100%; height: 100%; object-fit: cover; }

.frame-leaf { position: relative; }
.frame-leaf::after {
  content: ""; position: absolute; inset: -6%; z-index: -1;
  background: linear-gradient(160deg, var(--lime-soft), transparent 65%);
  border-radius: 0 70% 70% 70% / 0 60% 60% 60%;
  transform: rotate(-6deg);
}

/* leaf-shaped decorative mask */
.clip-leaf {
  clip-path: polygon(50% 0%, 78% 12%, 94% 38%, 88% 72%, 58% 96%, 38% 86%, 14% 64%, 8% 32%, 26% 8%);
}

/* ---------- Cards ---------- */
.card-organic {
  background: var(--white); border-radius: 2.2rem;
  box-shadow: var(--shadow-soft);
  position: relative; overflow: hidden;
}

.card-blob {
  background: var(--white); box-shadow: var(--shadow-soft);
}

.chip {
  display: inline-flex; align-items: center; gap: .45rem;
  background: rgba(167,201,87,.22); color: var(--moss);
  font-size: .82rem; font-weight: 600; padding: .4rem .9rem; border-radius: 999px;
}

/* ---------- Section dividers (curved transitions) ---------- */
.wave-top, .wave-bottom { position: relative; }
.wave-top::before, .wave-bottom::after {
  content: ""; position: absolute; left: 0; right: 0; height: 90px; pointer-events: none; z-index: 3;
  background-repeat: no-repeat; background-size: 100% 100%;
}
.wave-top::before { top: -1px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C240,110 480,10 720,34 C960,58 1200,96 1440,46 L1440,90 L0,90 Z' fill='%23F2E8CF'/%3E%3C/svg%3E"); }
.wave-top.above-white::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C240,110 480,10 720,34 C960,58 1200,96 1440,46 L1440,90 L0,90 Z' fill='%23FFFFFF'/%3E%3C/svg%3E"); }
.wave-top.above-cream::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C240,110 480,10 720,34 C960,58 1200,96 1440,46 L1440,90 L0,90 Z' fill='%23F2E8CF'/%3E%3C/svg%3E"); }
.wave-bottom::after { bottom: -1px; transform: rotate(180deg); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0,60 C240,110 480,10 720,34 C960,58 1200,96 1440,46 L1440,90 L0,90 Z' fill='%23F2E8CF'/%3E%3C/svg%3E"); }

.curve-divider { display: block; width: 100%; height: 110px; }

/* ---------- Botanical backgrounds ---------- */
.bg-botanical {
  background-color: var(--cream);
  background-image:
    radial-gradient(circle at 12% 20%, rgba(167,201,87,.22) 0, rgba(167,201,87,.22) 4px, transparent 5px),
    radial-gradient(circle at 82% 70%, rgba(106,153,78,.18) 0, rgba(106,153,78,.18) 3px, transparent 4px),
    radial-gradient(circle at 45% 90%, rgba(167,201,87,.16) 0, rgba(167,201,87,.16) 2px, transparent 3px);
  background-size: 220px 220px;
}

.bg-botanical-white {
  background-color: var(--sand);
  background-image:
    radial-gradient(circle at 15% 25%, rgba(106,153,78,.12) 0, rgba(106,153,78,.12) 3px, transparent 4px),
    radial-gradient(circle at 75% 60%, rgba(167,201,87,.14) 0, rgba(167,201,87,.14) 4px, transparent 5px);
  background-size: 240px 240px;
}

.bg-moss { background-color: var(--moss); }
.text-cream { color: var(--cream); }

.texture-linen {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}

.leaf-watermark {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 6c12 6 18 16 16 28-2 12-10 22-16 24C26 56 18 46 16 34 14 22 20 12 32 6z' fill='%236A994E' opacity='0.08'/%3E%3C/svg%3E");
  background-size: 120px 120px;
}

/* ---------- Marquee (static wrap) ---------- */
.marquee-track {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 1.25rem 2rem;
}

/* ---------- Nav ---------- */
.nav-site { position: fixed; top: 0; left: 0; right: 0; z-index: 60; }
.nav-site.is-scrolled {
  background: rgba(250,246,236,.96);
  box-shadow: 0 12px 40px -20px rgba(56,102,65,.35);
}
.nav-link { position: relative; padding: .35rem .15rem; font-weight: 500; }
.nav-link:hover { color: var(--leaf); }
.nav-link[aria-current="page"] { color: var(--leaf); }

.menu-panel {
  position: fixed; inset: 0; z-index: 55; background: rgba(250,246,236,.98);
  flex-direction: column; align-items: center; justify-content: center; gap: 1.4rem;
  display: none;
}
.menu-panel.is-open { display: flex; }

/* ---------- Hero blobs ---------- */
.hero-sun {
  position: absolute; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, var(--lime-soft), rgba(167,201,87,.15) 60%, transparent 70%);
}

/* ---------- Stats ---------- */
.stat-num { font-family: var(--serif); font-size: clamp(2.2rem, 4.5vw, 3.4rem); font-weight: 600; line-height: 1; color: var(--ink); }

/* ---------- FAQ ---------- */
.faq-item { border: 1px solid rgba(106,153,78,.25); border-radius: 1.6rem; background: var(--white); overflow: hidden; }
.faq-item.is-open { box-shadow: var(--shadow-soft); }
.faq-q { cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.3rem 1.6rem; font-weight: 600; font-size: 1.05rem; color: var(--ink); }
.faq-icon { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--cream); display: grid; place-items: center; color: var(--leaf); }
.faq-item.is-open .faq-icon { background: var(--leaf); color: #fff; }
.faq-a { max-height: 0; overflow: hidden; }
.faq-a-inner { padding: 0 1.6rem 1.4rem; color: #58705e; }

/* ---------- Testimonials ---------- */
.t-track { display: flex; }
.t-slide { flex: 0 0 100%; }
.t-dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(56,102,65,.2); border: none; cursor: pointer; }
.t-dot.is-active { background: var(--leaf); }

/* ---------- Forms ---------- */
.field { position: relative; }
.field-label { display: block; font-size: .82rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--leaf); margin-bottom: .4rem; }
.field-input {
  width: 100%; padding: .95rem 1.2rem; border-radius: 1.1rem;
  border: 1.5px solid rgba(106,153,78,.3); background: rgba(255,255,255,.85);
  font-family: inherit; font-size: .98rem; color: var(--ink);
}
.field-input:focus { outline: none; border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(106,153,78,.15); }
.field-input.has-error { border-color: #c0552f; }
.field-error { color: #c0552f; font-size: .82rem; margin-top: .3rem; display: none; }
.field-input.has-error + .field-error { display: block; }

/* ---------- Footer ---------- */
.footer-link { display: inline-block; }
.footer-link:hover { color: var(--lime); }

/* ---------- Misc ---------- */
.leaf-bullet { list-style: none; padding-left: 0; }
.leaf-bullet li { position: relative; padding-left: 1.9rem; margin-bottom: .6rem; }
.leaf-bullet li::before {
  content: ""; position: absolute; left: 0; top: .35em; width: 15px; height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3c6 3 9 8 8 14-1 6-5 11-8 12C13 28 9 23 8 17 7 11 10 6 16 3z' fill='%236A994E'/%3E%3C/svg%3E");
  background-size: contain; background-repeat: no-repeat;
}

.avatar-leaf { border-radius: 60% 40% 55% 45% / 50% 58% 42% 50%; overflow: hidden; }
.avatar-leaf img { width: 100%; height: 100%; object-fit: cover; }

.divider-stem { height: 2px; width: 70px; background: linear-gradient(90deg, var(--leaf), var(--lime)); border-radius: 999px; }

.mask-leaf-outline { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath d='M100 8C150 40 188 90 184 148c-3 44-34 46-42 46-10 0-42-4-42-46 0-58 38-108 42-140z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cpath d='M100 8C150 40 188 90 184 148c-3 44-34 46-42 46-10 0-42-4-42-46 0-58 38-108 42-140z'/%3E%3C/svg%3E"); mask-size: contain; mask-position: center; mask-repeat: no-repeat; }

/* ---------- Focus ---------- */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--lime); outline-offset: 3px; border-radius: 4px;
}