/* HilltopHomes – közös réteg a Tailwind fölött (az immobridge design nyelvén) */

:root{
  --hh-accent:  #1E5B45;
  --hh-accent2: #2FA36B;
  --hh-accent-l:#8FE3B8;
  --hh-ink:     #15181A;
  --hh-line:    #E8E5DC;
  --hh-num-font:'Poppins','Google Sans Flex',system-ui,sans-serif;
}

html{scroll-behavior:smooth}
body{font-family:'Google Sans Flex',sans-serif;background:#FCFBF8;color:#15181A}

/* dőlt kiemelés helyett szín + súly */
em, cite{ font-style:normal !important; color:var(--hh-accent); font-weight:600; }
.text-white em, header em, .bg-pine em, [class*="text-white"] em{ color:var(--hh-accent-l); }
.font-display em{ font-weight:480; }

/* márkajel: "Hilltop" örökli a színt, "Homes" smaragd átmenet */
.brandmark{
  font-style:normal !important; font-weight:700;
  background:linear-gradient(92deg,#34D399 0%,#10B981 52%,#059669 100%);
  -webkit-background-clip:text; background-clip:text;
  color:transparent; -webkit-text-fill-color:transparent;
}

/* táblázatos számok */
table td, table th, .font-mono, .price{
  font-family:var(--hh-num-font);
  font-variant-numeric:tabular-nums;
  font-feature-settings:'tnum' 1;
}

input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible,summary:focus-visible{
  outline:2px solid #1E5B45; outline-offset:2px;
}

.no-scrollbar::-webkit-scrollbar{display:none}
.no-scrollbar{scrollbar-width:none}

/* ===== egyedi, stílusos legördülő (a natív select-et váltja a hero keresőben) ===== */
.ibdd{ position:relative; width:100%; }
.ibdd-trigger{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:8px;
  background:transparent; border:none; padding:0; margin:0; cursor:pointer;
  font-family:'Google Sans Flex',sans-serif; font-weight:500; font-size:14.5px;
  color:inherit; text-align:left; line-height:1.35;
}
.ibdd-trigger .chev{ flex-shrink:0; color:currentColor; opacity:.55; transition:transform .2s ease; }
.ibdd.open .ibdd-trigger .chev{ transform:rotate(180deg); opacity:.9; }
.ibdd-panel{
  position:absolute; left:-8px; top:calc(100% + 14px); z-index:220;
  min-width:max(100%,230px); max-width:min(320px,86vw);
  background:#fff; border:1px solid var(--hh-line); border-radius:18px;
  box-shadow:0 26px 64px rgba(21,24,26,.24); padding:7px;
  max-height:340px; overflow:auto;
  opacity:0; transform:translateY(-8px) scale(.97); transform-origin:top left; pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}
.ibdd.open .ibdd-panel{ opacity:1; transform:none; pointer-events:auto; }
.ibdd-opt{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:11px 13px; border-radius:12px; cursor:pointer; color:#15181A;
  font-family:'Google Sans Flex',sans-serif; font-size:14px; font-weight:500; white-space:nowrap;
}
.ibdd-opt:hover{ background:#F3F1EA; }
.ibdd-opt.sel{ color:#1E5B45; font-weight:700; background:#E9F1EC; }
.ibdd-opt .tick{ flex-shrink:0; opacity:0; }
.ibdd-opt.sel .tick{ opacity:1; }

.hero-fade{background:linear-gradient(180deg,rgba(10,14,12,.42) 0%,rgba(10,14,12,.18) 40%,rgba(10,14,12,.45) 100%)}

/* kártyák */
.card-img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.lcard:hover .card-img{transform:scale(1.05)}
#cards .lcard{
  background:#fff; border:1px solid #E8E5DC; border-radius:24px; padding:12px;
  box-shadow:0 6px 22px rgba(21,24,26,.05);
  transition:box-shadow .2s ease, border-color .2s ease;
}
#cards .lcard:hover{ box-shadow:0 14px 40px rgba(21,24,26,.12); }
#cards .lcard.flash{box-shadow:0 0 0 2px rgba(30,91,69,.5),0 16px 40px rgba(21,24,26,.14);border-color:transparent}

/* felfedő animáció */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){.reveal{opacity:1;transform:none;transition:none}.card-img{transition:none}}

details summary::-webkit-details-marker{display:none}
details[open] .faq-chev{transform:rotate(45deg)}
.faq-chev{transition:transform .25s ease}

/* térkép ár-pill markerek */
.mpill{background:#fff;border:1px solid #E8E5DC;border-radius:999px;padding:5px 11px;
  font-family:var(--hh-num-font);font-weight:700;font-size:12px;color:#15181A;
  box-shadow:0 4px 14px rgba(21,24,26,.14);white-space:nowrap;cursor:pointer;
  transition:transform .15s,background .15s,color .15s}
.mpill:hover,.mpill.active{background:#15181A;color:#fff;transform:scale(1.08);z-index:999}
.leaflet-marker-icon{background:transparent;border:none}
.leaflet-container{font-family:'Google Sans Flex',sans-serif}

/* dupla csúszka az ársávhoz */
.range-wrap{position:relative;height:28px}
.range-wrap input[type=range]{position:absolute;inset:0;width:100%;-webkit-appearance:none;appearance:none;background:none;pointer-events:none;height:28px;margin:0}
.range-wrap input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid #15181A;box-shadow:0 2px 8px rgba(0,0,0,.18);cursor:grab;margin-top:0}
.range-wrap input[type=range]::-moz-range-thumb{pointer-events:auto;width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid #15181A;box-shadow:0 2px 8px rgba(0,0,0,.18);cursor:grab}
.range-track{position:absolute;top:50%;left:0;right:0;height:4px;transform:translateY(-50%);background:#E8E5DC;border-radius:99px}
.range-fill{position:absolute;top:50%;height:4px;transform:translateY(-50%);background:#15181A;border-radius:99px}
.modal-open{overflow:hidden}
.chip{display:inline-flex;align-items:center;gap:5px;border:1px solid #E8E5DC;border-radius:999px;padding:4px 11px;background:#fff;white-space:nowrap}

/* galéria + lightbox */
.gimg{cursor:pointer;transition:filter .25s}
.gimg:hover{filter:brightness(.92)}
#lightbox{background:rgba(18,16,15,.94);backdrop-filter:blur(10px)}
#lightbox .lb-main{max-height:100%;max-width:100%;border-radius:20px;object-fit:contain;
  box-shadow:0 34px 90px rgba(0,0,0,.55);transition:opacity .28s ease}
.lb-arrow{position:absolute;z-index:10;width:50px;height:50px;border-radius:999px;
  border:1px solid rgba(255,255,255,.18);cursor:pointer;background:rgba(255,255,255,.12);
  color:#fff;display:grid;place-items:center;backdrop-filter:blur(6px);
  transition:background .15s ease,transform .15s ease}
.lb-arrow:hover{background:rgba(255,255,255,.26);transform:scale(1.07)}
#lbThumbs{scrollbar-width:none}
#lbThumbs::-webkit-scrollbar{height:0;display:none}
.lb-thumb{flex:0 0 auto;width:82px;height:58px;padding:0;border:none;border-radius:12px;
  overflow:hidden;cursor:pointer;background:#333;opacity:.5;
  transition:opacity .18s ease,box-shadow .18s ease}
.lb-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.lb-thumb:hover{opacity:.9}
.lb-thumb.active{opacity:1;box-shadow:inset 0 0 0 2px rgba(255,255,255,.9)}

@media (max-width:640px){
  #lightbox .lb-main{border-radius:14px}
  .lb-arrow{width:42px;height:42px}
  .lb-thumb{width:64px;height:46px}
  #cards .lcard{padding:10px;border-radius:20px}
}