:root {
  --cream: #F3EFE9;
  --sand: #E0D2C2;
  --beige: #CCBCA8;
  --sage-light: #A8B39F;
  --sage: #7D9778;
  --olive: #5B6C5B;
  --dark: #4A4F4B;
  --brown: #8A6B54;
  --white: #FFFFFF;
  --text: #3E403D;
  --max: 1180px;
  --serif: Georgia, "Times New Roman", serif;
  --heading: "Poppins", Arial, sans-serif;
  --sans: "Inter", Arial, Helvetica, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--cream); color:var(--text); font-family:var(--sans); line-height:1.7; }
img { display:block; width:100%; height:100%; object-fit:cover; }
a { color:inherit; }
.container { width:min(calc(100% - 40px), var(--max)); margin-inline:auto; }
.narrow { max-width:800px; margin-inline:auto; }
.section { padding:90px 0; }
.section-light { background:var(--cream); }
.section-sand { background:linear-gradient(135deg, #E8DED1, #D8C7B4); }
.section-olive { background:var(--sage); color:#fff; }
.section-dark { background:var(--dark); color:#fff; }
.center { text-align:center; }
.eyebrow { font-size:.72rem; letter-spacing:.14em; font-weight:700; margin:0 0 14px; opacity:.82; }
h1,h2,h3 { font-family:var(--heading); font-weight:600; line-height:1.15; }
h1 { font-size:clamp(2.4rem,5vw,5.2rem); font-weight:700; margin:0 0 28px; }
h2 { font-size:clamp(2rem,4vw,3.4rem); font-weight:600; margin:0 0 25px; }
h3 { font-size:1.65rem; font-weight:600; margin:8px 0 12px; }
p { margin:0 0 18px; }
em { font-style:italic; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(243,239,233,.96); border-bottom:1px solid rgba(74,79,75,.12); backdrop-filter:blur(10px); }
.nav-wrap { min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.brand { font-family:var(--serif); text-decoration:none; letter-spacing:.08em; font-size:1.05rem; }
.brand span { color:var(--sage); }
.main-nav { display:flex; gap:28px; }
.main-nav a { text-decoration:none; text-transform:uppercase; font-size:.68rem; letter-spacing:.08em; }
.main-nav a:hover { color:var(--sage); }
.menu-toggle { display:none; border:0; background:none; font-size:1.5rem; color:var(--dark); }
.hero { min-height:680px; padding:0; position:relative; overflow:hidden; display:grid; place-items:center; }
.hero-image { position:absolute; inset:0; }
.hero-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(243,239,233,.96) 0%, rgba(243,239,233,.68) 38%, rgba(243,239,233,.05) 72%); }
.hero-overlay { position:relative; z-index:1; width:min(calc(100% - 40px), var(--max)); margin:auto; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 22px; background:var(--sage); color:#fff; text-decoration:none; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; border:1px solid var(--sage); transition:.2s ease; }
.button:hover { transform:translateY(-1px); background:var(--olive); }
.button-light { background:transparent; border-color:rgba(255,255,255,.7); }
.media-placeholder { background:linear-gradient(135deg, #DED6CB, #A8B39F); min-height:300px; overflow:hidden; }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.portrait { min-height:0; }
.copy { max-width:650px; }
.quote-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:45px auto; }
.quote-grid div { padding:28px 15px; border-top:1px solid rgba(62,64,61,.35); text-align:center; font-family:var(--serif); }
.quote-grid strong, .quote-grid span { display:block; }
.quote-grid strong { font-size:1.2rem; }
.schedule { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin:45px auto 35px; }
.schedule-card { padding:32px; background:rgba(255,255,255,.5); border:1px solid rgba(62,64,61,.12); text-align:center; }
.schedule-card span { display:block; font-size:.7rem; letter-spacing:.12em; }
.schedule-card strong { display:block; font-family:var(--heading); font-size:1.55rem; font-weight:600; margin-top:8px; }
.schedule-card p { margin:5px 0 0; }
.rounded { border-radius:4px; }
.text-link { font-weight:700; text-decoration:none; border-bottom:1px solid currentColor; }
.closing-line { font-family:var(--heading); font-weight:500; font-size:1.55rem; padding-top:50px; }
.treatments { display:grid; gap:35px; }
.treatment-card { display:grid; grid-template-columns:38% 1fr; background:#fff; box-shadow:0 8px 35px rgba(62,64,61,.07); }
.treatment-image { min-height:0; height:auto; }
.treatment-body { padding:50px; }
.treatment-body .lead { font-family:var(--heading); font-weight:500; font-size:1.35rem; }
.treatment-body blockquote { margin:25px 0; padding:18px 22px; border-left:2px solid var(--sage); font-family:var(--sans); font-style:italic; }
.duration { display:inline-block; margin-top:8px; padding:8px 14px; background:var(--sand); font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.service-list { display:grid; gap:14px; }
.service-list > div { display:grid; grid-template-columns:45px 1fr auto; align-items:center; gap:14px; padding:18px 0; border-bottom:1px solid rgba(62,64,61,.2); }
.service-list span { width:40px; height:40px; border:1px solid currentColor; border-radius:50%; display:grid; place-items:center; font-size:1.1rem; }
.service-list strong { font-family:var(--heading); font-size:1.15rem; font-weight:600; }
.service-list small { opacity:.7; }
.contact { text-align:center; max-width:720px; }
.small-note { font-size:.75rem; opacity:.65; margin-top:18px; }
.site-footer { background:#353936; color:#eee; padding:45px 0 25px; font-size:.82rem; }
.footer-grid { display:flex; justify-content:space-between; gap:30px; }
.footer-grid nav { display:flex; gap:22px; flex-wrap:wrap; justify-content:flex-end; }
.footer-grid a { opacity:.8; text-decoration:none; }
.footer-grid a:hover { opacity:1; }
.copyright { border-top:1px solid rgba(255,255,255,.15); margin-top:30px; padding-top:20px; opacity:.55; }
.skip-link { position:absolute; left:-9999px; top:10px; background:#fff; padding:10px; z-index:100; }
.skip-link:focus { left:10px; }
@media (max-width: 800px) {
  .section { padding:65px 0; }
  .main-nav { display:none; position:absolute; left:0; right:0; top:70px; padding:18px 20px 25px; background:var(--cream); flex-direction:column; gap:16px; border-bottom:1px solid rgba(74,79,75,.12); }
  .main-nav.open { display:flex; }
  .menu-toggle { display:block; }
  .hero { min-height:620px; }
  .hero-image::after { background:linear-gradient(90deg, rgba(243,239,233,.92), rgba(243,239,233,.45)); }
  .two-col, .treatment-card { grid-template-columns:1fr; gap:35px; }
  .reverse-mobile .media-placeholder { order:0; }
  .portrait { min-height:0; }
  .schedule, .quote-grid { grid-template-columns:1fr; }
  .treatment-image { min-height:0; height:auto; }
  .treatment-body { padding:30px 25px; }
  .footer-grid { flex-direction:column; }
  .footer-grid nav { justify-content:flex-start; }
}
@media (max-width: 480px) {
  .container { width:min(calc(100% - 28px), var(--max)); }
  .hero { min-height:590px; }
  h1 { font-size:2.45rem; }
  .hero-overlay { align-self:end; padding-bottom:45px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  * { transition:none !important; }
}

/* ===== KÉPCAROUSEL =====
   A carousel képei teljes egészében jelennek meg.
   Nem használunk fix magasságot és "cover"-t, mert ezek levághatják a fejet/lábat.
   Az aktív kép természetes magassága határozza meg a carousel magasságát. */
.carousel {
  position:relative;
  height:auto;
  min-height:0;
  background:transparent;
  overflow:hidden;
}

.carousel-track {
  position:relative;
  inset:auto;
  width:100%;
}

.carousel-slide {
  position:absolute;
  inset:0;
  width:100%;
  height:auto;
  opacity:0;
  visibility:hidden;
  transition:opacity .35s ease;
}

.carousel-slide.is-active {
  position:relative;
  inset:auto;
  opacity:1;
  visibility:visible;
}

.carousel-slide img {
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  max-height:none;
  object-fit:contain;
  background:transparent;
  -webkit-user-drag:none;
  user-select:none;
  -webkit-user-select:none;
  pointer-events:none;
}

.carousel-arrow {
  position:absolute; z-index:4; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border:1px solid rgba(255,255,255,.75);
  border-radius:50%; background:rgba(62,64,61,.42); color:#fff;
  font:400 30px/1 Georgia,serif; cursor:pointer; display:grid; place-items:center;
  backdrop-filter:blur(4px);
}
.carousel-arrow:hover { background:rgba(62,64,61,.68); }
.carousel-prev { left:14px; } .carousel-next { right:14px; }
.carousel-dots {
  position:absolute; z-index:4; left:50%; bottom:16px; transform:translateX(-50%);
  display:flex; gap:8px;
}
.carousel-dot {
  width:9px; height:9px; padding:0; border:1px solid #fff;
  border-radius:50%; background:rgba(255,255,255,.45); cursor:pointer;
}
.carousel-dot.is-active { background:#fff; }
.carousel-note {
  max-width:800px; margin:0 auto 30px; padding:12px 16px;
  background:rgba(125,151,120,.10); font-size:.82rem; text-align:center;
}
.carousel-note code { font-size:.78rem; background:rgba(0,0,0,.05); padding:2px 5px; }
.media-protected, .media-protected * { -webkit-touch-callout:none; }


/* ===== SEO / GYIK ===== */
.faq-list{display:grid;gap:10px;margin-top:30px}.faq-list details{background:#fff;border:1px solid rgba(62,64,61,.12);padding:0 22px}.faq-list summary{cursor:pointer;list-style:none;padding:21px 30px 21px 0;font-family:var(--heading);font-weight:600;font-size:1.2rem;position:relative}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:"+";position:absolute;right:2px;top:17px;font-size:1.4rem;color:var(--sage)}.faq-list details[open] summary::after{content:"–"}.faq-list details p{padding:0 0 18px;margin:0;max-width:850px}


/* ===== TELJES KÉP – VÉGSŐ CAROUSEL BEÁLLÍTÁS =====
   Minden carouselnél a teljes eredeti fotó látszik, háttérszín-kitöltés nélkül.
   A kép magassága automatikusan követi a saját képarányát. */
.carousel,
.treatment-image.carousel,
[data-carousel="portrait"],
[data-carousel="balance"] {
  height:auto;
  min-height:0;
  background:transparent;
}

.carousel .carousel-track,
.treatment-image.carousel .carousel-track {
  position:relative;
  inset:auto;
  width:100%;
}

.carousel .carousel-slide,
.treatment-image.carousel .carousel-slide {
  position:absolute;
  inset:0;
  width:100%;
  height:auto;
}

.carousel .carousel-slide.is-active,
.treatment-image.carousel .carousel-slide.is-active {
  position:relative;
  inset:auto;
}

.carousel .carousel-slide img,
.treatment-image.carousel .carousel-slide img {
  width:100%;
  height:auto;
  max-width:100%;
  max-height:none;
  object-fit:contain;
  background:transparent;
}

@media (max-width:800px) {
  .carousel,
  .treatment-image.carousel,
  [data-carousel="portrait"],
  [data-carousel="balance"] {
    height:auto;
    min-height:0;
  }
}

/* ===== KEZELÉSI CAROUSELEK – VERTIKÁLIS KÖZÉPRE IGAZÍTÁS =====
   A kép-carousel igazodjon függőlegesen a hozzá tartozó kezelési szöveghez. */
.treatment-card > .treatment-image.carousel {
  align-self: center;
}

@media (max-width:800px) {
  .treatment-card > .treatment-image.carousel {
    align-self: start;
  }
}

/* ===== TIPOGRÁFIA – 6. KOMBINÁCIÓ: POPPINS + INTER =====
   Poppins: címek és kiemelt vizuális elemek.
   Inter: törzsszöveg, navigáció, árak, időpontok és UI-elemek.
   A BAMBOO márkanév szándékosan megtartja a serif karakterét. */

body { font-family:var(--sans); }

h1, h2, h3 {
  font-family:var(--heading);
  line-height:1.15;
}
h1 { font-weight:700; }
h2, h3 { font-weight:600; }

.brand { font-family:var(--serif); }

.eyebrow,
.main-nav a,
.button,
.duration,
.schedule-card span {
  font-family:var(--sans);
}

.schedule-card strong {
  font-family:var(--heading);
  font-weight:600;
}

.treatment-body .lead {
  font-family:var(--heading);
  font-weight:500;
}

.treatment-body blockquote {
  font-family:var(--sans);
  font-style:italic;
}

.service-list strong {
  font-family:var(--heading);
  font-weight:600;
}

.faq-list summary {
  font-family:var(--heading);
  font-weight:600;
}
