/* Ingatlaneladás aloldal: a /styles.css-re épül */

/* Hero */
.ie-hero .hero-copy h1 { font-size: clamp(40px, 5.3vw, 68px); }
.ie-hero .hero-lead { margin: 24px 0 28px; }
.ie-hero .hero-lead a { color: var(--coral); font-weight: 600; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.ie-price {
  display: grid; grid-template-columns: auto auto; gap: 10px;
  width: fit-content; max-width: 100%;
  margin: 0 0 30px; padding: 12px;
  background: var(--paper); border-radius: 22px; box-shadow: var(--shadow);
}
.ie-price strong, .ie-price .ie-nulla {
  font-family: var(--serif); font-weight: 600; font-style: normal; font-size: clamp(26px, 3vw, 34px); line-height: 1;
  padding: 14px 18px; border-radius: 16px; white-space: nowrap; text-align: center;
}
.ie-price strong { color: var(--coral); background: var(--blush); }
.ie-price .ie-nulla { color: #fff; background: #3d7559; box-shadow: 0 10px 22px -12px rgba(47, 95, 71, .9); }
.ie-price span { grid-column: 1 / -1; padding: 0 6px 2px; font-size: 14.5px; line-height: 1.45; color: var(--muted); }
.ie-price b { color: var(--ink); }

/* Telefon-mockup */
.ie-visual { position: relative; justify-self: center; width: 100%; max-width: 500px; padding: 12px 0 28px; }
.phone {
  position: relative; width: 304px; margin: 0 auto;
  background: #1f2d2f; border-radius: 48px; padding: 11px;
  box-shadow: 0 2px 4px rgba(38, 56, 59, .06), 0 40px 80px -28px rgba(38, 56, 59, .5);
}
.phone::before {
  content: ""; position: absolute; top: 22px; left: 50%; width: 84px; height: 22px; margin-left: -42px;
  border-radius: 999px; background: #1f2d2f; z-index: 2;
}
.phone-screen { background: #eef0f3; border-radius: 38px; overflow: hidden; padding-top: 50px; }
.phone svg { width: 18px; height: 18px; }
.fb-group {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px 12px; background: #fff;
  font-size: 11.5px; line-height: 1.3; color: #65676b; border-bottom: 1px solid #e4e6eb;
}
.fb-group strong { display: block; font-size: 13.5px; color: #1c1e21; }
.fb-group-ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--sage); color: #3d7559; }
.fb-post { background: #fff; margin-top: 8px; padding-bottom: 2px; }
.fb-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px 8px; font-size: 11.5px; line-height: 1.3; color: #65676b; }
.fb-head img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; }
.fb-head strong { display: block; font-size: 13.5px; color: #1c1e21; }
.fb-text { margin: 0; padding: 0 14px 10px; font-size: 13px; line-height: 1.45; color: #1c1e21; }
.fb-video { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #cfd8d3; }
.fb-video img { width: 100%; height: 100%; object-fit: cover; object-position: 46% 50%; }
.fb-play {
  position: absolute; left: 50%; top: 46%; width: 62px; height: 62px; margin: -31px 0 0 -31px;
  border-radius: 50%; display: grid; place-items: center;
  background: rgba(255, 255, 255, .9); color: var(--coral); box-shadow: 0 10px 30px -8px rgba(0, 0, 0, .45);
}
.phone .fb-play svg { width: 26px; height: 26px; margin-left: 4px; }
.fb-tag {
  position: absolute; left: 10px; bottom: 20px; padding: 7px 11px 7px 9px; border-radius: 8px;
  background: rgba(31, 45, 47, .82); color: #fff; font-size: 11.5px; font-weight: 600; line-height: 1.2;
  border-left: 3px solid #e9b949;
}
.fb-tag b { display: block; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: #f3cf7a; }
.fb-time { position: absolute; right: 10px; bottom: 20px; padding: 3px 7px; border-radius: 6px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 11px; font-weight: 700; }
.fb-progress { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(255, 255, 255, .35); }
.fb-progress i { display: block; width: 34%; height: 100%; background: var(--coral-accent); }
.fb-actions { display: flex; justify-content: space-between; padding: 6px 8px; border-top: 1px solid #e4e6eb; margin-top: 0; }
.fb-actions span { display: inline-flex; align-items: center; gap: 5px; padding: 7px 6px; border-radius: 8px; font-size: 11.5px; font-weight: 600; color: #65676b; }
.fb-actions svg { width: 16px; height: 16px; }
.fb-actions .on { color: var(--coral); background: var(--blush); }

/* Lebegő kártyák a telefon körül */
.ie-visual .float-card { z-index: 3; }
.fc-moms { top: -6px; left: -24px; }
.fc-moms .avatars { display: flex; flex: none; }
.fc-moms .avatars img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; border: 2px solid #fff; }
.fc-moms .avatars img + img { margin-left: -12px; }
.fc-groups { top: 46%; right: -22px; animation-delay: -2s; max-width: 200px; }
.fc-groups .chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.fc-groups .chips i { font-style: normal; font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--cream-2); color: var(--slate); }
.fc-fee { bottom: 6px; left: 4px; animation-delay: -4s; }
.fc-fee .ic { background: var(--blush); color: var(--coral); }

/* Miért működik */
.ie-why { background: var(--paper); }
.ie-why .work-card { background: var(--cream); box-shadow: none; border-color: transparent; }
.ie-why .work-card:hover { box-shadow: var(--shadow); }

/* Lépések: 4 oszlop */
.steps-head .eyebrow { margin-bottom: 14px; }
.steps-head h2 { font-size: clamp(32px, 4.4vw, 50px); }
.steps.steps-4 { grid-template-columns: repeat(4, 1fr); }

/* Anyukák szekció */
.ie-moms .clients-photo img { object-position: 50% 40%; }

/* Díj + kalkulátor */
.ie-price-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: stretch; }
.calc { background: var(--paper); border-radius: 32px; padding: clamp(26px, 4vw, 44px); box-shadow: var(--shadow); }
.calc h3 { font-size: clamp(24px, 2.6vw, 30px); margin-bottom: 26px; }
.calc-field { margin-bottom: 24px; }
.calc-field label, .calc-label { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; font-weight: 700; font-size: 15.5px; margin-bottom: 10px; }
.calc-field output { font-family: var(--serif); font-size: 26px; font-weight: 600; color: var(--ink); }
.calc input[type="range"] { width: 100%; margin: 4px 0 0; accent-color: var(--coral); height: 28px; cursor: pointer; }
.range-ends { display: flex; justify-content: space-between; font-size: 13px; color: var(--muted); }
.pct { display: flex; flex-wrap: wrap; gap: 8px; }
.pct button {
  min-width: 64px; min-height: 44px; padding: 0 16px; border-radius: 999px; cursor: pointer;
  border: 1.5px solid var(--line); background: var(--cream); color: var(--ink);
  font: 700 15px/1 var(--sans); transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.pct button:hover { border-color: rgba(191, 79, 58, .45); }
.pct button[aria-pressed="true"] { background: var(--coral); border-color: var(--coral); color: #fff; }
.pct button:focus-visible { border-radius: 999px; }
.bars { display: grid; gap: 18px; margin-top: 8px; }
.bar-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 15px; color: var(--muted); margin-bottom: 7px; }
.bar-top strong { color: var(--ink); font-size: 16px; white-space: nowrap; }
.bar { height: 14px; border-radius: 999px; background: var(--cream-2); overflow: hidden; }
.bar i { display: block; height: 100%; border-radius: inherit; background: var(--coral); transition: width .45s cubic-bezier(.2, .7, .2, 1); }
.bar-row.anyu i { background: #4f8a6c; min-width: 8px; }
.calc-result {
  margin-top: 26px; padding: 18px 22px; border-radius: 18px; background: var(--sage);
  font-weight: 600; color: #2f5f47; font-size: 15.5px;
}
.calc-result strong { display: block; font-family: var(--serif); font-size: clamp(30px, 3.6vw, 40px); font-weight: 600; color: var(--deep); line-height: 1.15; margin-top: 4px; }
.calc-note { margin: 14px 0 0; font-size: 13px; color: var(--muted); line-height: 1.5; }

.ie-offer {
  position: relative; overflow: hidden; display: flex; flex-direction: column;
  background: linear-gradient(145deg, var(--deep) 0%, var(--deep-2) 100%);
  color: #fff; border-radius: 32px; padding: clamp(28px, 4vw, 48px);
}
.ie-offer::after { content: ""; position: absolute; right: -80px; top: -80px; width: 280px; height: 280px; border-radius: 50%; background: radial-gradient(circle, rgba(246, 223, 174, .28), transparent 70%); pointer-events: none; }
.ie-offer .eyebrow { color: #f3b7a7; }
.offer-big { font-family: var(--serif); font-weight: 600; font-size: clamp(48px, 6vw, 72px); line-height: 1; letter-spacing: -.02em; white-space: nowrap; }
.offer-big small { display: block; font-family: var(--sans); font-size: 16px; font-weight: 600; color: #c9d6d3; letter-spacing: 0; margin-top: 12px; }
.offer-list { list-style: none; padding: 0; margin: 30px 0 34px; display: grid; gap: 14px; }
.offer-list li { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; font-weight: 500; line-height: 1.45; }
.offer-list svg { width: 22px; height: 22px; flex: none; color: #9fd1b4; margin-top: 1px; }
.ie-offer .btn { margin-top: auto; align-self: flex-start; }

/* GYIK */
.ie-faq { background: var(--cream-2); }

/* Záró CTA */
.final { padding-top: clamp(72px, 10vw, 120px); }
.final-card h2 { margin-bottom: 14px; }
.final-card .final-lead { font-size: clamp(18px, 1.8vw, 21px); color: var(--slate); max-width: 640px; margin-bottom: 34px; }
.final-card .final-lead strong { color: var(--ink); white-space: nowrap; }
.final-card .btn svg { transition: none; }
.final-card .btn:hover svg { transform: none; }

/* Reszponzív */
@media (max-width: 1080px) {
  .steps.steps-4 { grid-template-columns: repeat(2, 1fr); }
  .fc-groups { right: -8px; }
  .fc-moms { left: -6px; }
  .nav-right .btn-sm svg { display: none; }
}

@media (max-width: 920px) {
  .ie-visual { max-width: 460px; margin-top: 8px; }
  .ie-price-grid { grid-template-columns: 1fr; max-width: 640px; margin: 0 auto; }
  .steps.steps-4 { max-width: none; }
}

@media (max-width: 600px) {
  .ie-price { padding: 10px; gap: 8px; }
  .ie-price strong, .ie-price .ie-nulla { font-size: 25px; padding: 12px 12px; }
  .ie-price span { font-size: 13.5px; }
  .phone { width: 268px; border-radius: 42px; padding: 10px; margin-left: 6px; }
  .fb-actions { justify-content: space-between; padding: 6px; }
  .fb-actions span { font-size: 11px; padding: 6px 6px; gap: 4px; }
  .fb-actions svg { width: 14px; height: 14px; }
  .phone-screen { border-radius: 33px; padding-top: 44px; }
  .phone::before { top: 19px; width: 74px; height: 20px; margin-left: -37px; }
  .fc-moms { top: -8px; left: -4px; padding: 10px 12px; }
  .nav-right .btn-sm { padding: 0 16px; }
  .fc-moms .avatars img { width: 28px; height: 28px; }
  .fc-groups { right: -4px; top: 49%; max-width: 160px; padding: 10px 12px; }
  .fc-fee { left: -4px; bottom: 10px; padding: 10px 14px; }
  .steps.steps-4 { grid-template-columns: 1fr; }
  .steps-head .legal-pill { font-size: 13px; }
  .bar-top { font-size: 14px; }
  .offer-big { font-size: 52px; }
  .final-card .btn { padding: 0 22px; font-size: 16px; gap: 8px; }
}

/* Keskeny telefonok: a "Megrendelem" szélesebb a főoldali "Belépés"-nél, a fejléc ne lógjon ki (2026-11-09) */
@media (max-width: 380px) {
  .brand img { width: 120px; }
  .nav-right .btn-sm { padding: 0 13px; font-size: 14px; }
}

@media (max-width: 360px) {
  .fc-groups { display: none; }
}

@media (max-width: 340px) {
  .nav { gap: 8px; }
  .nav-right { gap: 6px; }
  .brand img { width: 104px; }
  .nav-right .btn-sm { padding: 0 12px; font-size: 13.5px; }
}

/* Megrendelő ablak */
html.ablak-nyitva { overflow: hidden; }
.rendeles {
  width: min(640px, calc(100% - 24px)); max-height: calc(100dvh - 24px);
  margin: auto; padding: 0; border: 0; border-radius: 28px;
  background: var(--paper); color: var(--ink); box-shadow: var(--shadow-lg);
  overflow: auto; overscroll-behavior: contain;
}
.rendeles::backdrop { background: rgba(34, 57, 60, .55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.rendeles[open] { animation: ablak-be .22s ease-out; }
@keyframes ablak-be { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.rendeles-form { padding: clamp(22px, 4vw, 36px); }
.rendeles-fej { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.rendeles-fej .eyebrow { margin-bottom: 10px; }
.rendeles-fej h2 { font-size: clamp(24px, 3.2vw, 30px); }
.rendeles-ar { margin: 8px 0 0; color: var(--muted); font-size: 15px; }
.rendeles-ar strong { color: var(--coral); font-size: 17px; }
.rendeles-bezar {
  flex: none; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
  display: grid; place-items: center; background: var(--cream-2); color: var(--ink);
}
.rendeles-bezar:hover { background: var(--line); }
.rendeles-bezar svg { width: 22px; height: 22px; }
.rendeles-uzenet { margin: 0 0 16px; padding: 14px 16px; border-radius: 14px; background: var(--blush); color: #8a3422; font-weight: 600; font-size: 15px; }
.rendeles-uzenet.info { background: var(--sun); color: #6b4a0c; }
.rendeles fieldset { border: 0; padding: 0; margin: 0 0 18px; min-width: 0; }
.rendeles legend { padding: 0; margin-bottom: 10px; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--slate); }
.mezo { margin-bottom: 12px; }
.mezo-sor { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.mezo label { display: block; font-weight: 600; font-size: 15px; margin-bottom: 6px; }
.mezo .opc { font-weight: 500; color: var(--muted); font-size: 13.5px; }
.rendeles input[type="text"], .rendeles input:not([type]), .rendeles input[type="tel"], .rendeles input[type="email"],
.rendeles input[type="url"], .rendeles select, .rendeles textarea {
  width: 100%; min-height: 50px; padding: 12px 14px; border-radius: 14px;
  border: 1.5px solid var(--line); background: var(--cream); color: var(--ink);
  font: 500 16px/1.4 var(--sans); transition: border-color .15s ease, background-color .15s ease;
}
.rendeles textarea { resize: vertical; min-height: 84px; }
.rendeles select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer;
  background: var(--cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23435457' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 14px center / 18px no-repeat; }
.rendeles input:focus, .rendeles select:focus, .rendeles textarea:focus { outline: none; border-color: var(--coral-accent); background-color: #fff; box-shadow: 0 0 0 3px rgba(210, 86, 63, .15); }
.rendeles [aria-invalid="true"] { border-color: var(--coral) !important; background-color: #fff6f3 !important; }
.mezo small { display: block; font-size: 13.5px; margin-top: 5px; line-height: 1.4; }
.mezo .tipp { color: var(--muted); }
.rendeles .hiba { display: none; color: var(--coral); font-weight: 600; font-size: 13.5px; }
.rendeles .hiba.lathato { display: block; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pipa { display: flex; gap: 12px; align-items: flex-start; font-size: 15px; cursor: pointer; padding: 4px 0; }
.pipa input { width: 22px; height: 22px; margin: 1px 0 0; flex: none; accent-color: var(--coral); cursor: pointer; }
.pipa a { color: var(--coral); font-weight: 600; }
.pipa-hiba { margin: 2px 0 0 34px; }
.rendeles-kuld { width: 100%; margin-top: 20px; }
.rendeles-kuld[disabled] { opacity: .75; cursor: wait; transform: none; }
.rendeles-kuld .porgo { width: 18px; height: 18px; border-radius: 50%; border: 2.5px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: porog .8s linear infinite; }
@keyframes porog { to { transform: rotate(360deg); } }
.rendeles-lab { margin: 14px 0 0; font-size: 13.5px; color: var(--muted); text-align: center; line-height: 1.5; }

@media (max-width: 600px) {
  .rendeles { width: 100%; max-width: none; max-height: 100dvh; height: 100dvh; border-radius: 0; }
  .mezo-sor { grid-template-columns: 1fr; }
  .rendeles-form { padding: 18px 16px 28px; }
}
@media (prefers-reduced-motion: reduce) {
  .rendeles[open] { animation: none; }
}