:root{--bg:#090a0a;--panel:#121412;--gold:#e4c36b;--gold2:#c39a43;--ivory:#f3eee3;--text:#f5f3ed;--muted:#a3a29c;--line:#2d2d27}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif;line-height:1.72;letter-spacing:-.2px}
a{color:inherit;text-decoration:none}.wrap{max-width:1120px;margin:auto;padding:0 22px}
header{position:sticky;top:0;z-index:30;background:rgba(9,10,10,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(228,195,107,.18)}
.nav{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-weight:950;font-size:22px}.brand b{color:var(--gold)}
.nav a.cta{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#111;padding:10px 15px;border-radius:999px;font-weight:950}
.hero{padding:64px 0 46px;background:radial-gradient(circle at 80% 10%,rgba(228,195,107,.15),transparent 28%)}
.kicker{color:var(--gold);font-size:12px;font-weight:900;letter-spacing:.12em}.hero h1{font-size:44px;line-height:1.18;margin:10px 0 15px;letter-spacing:-2px}.hero p{color:#b9b8b2;max-width:780px}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.badge{border:1px solid #3b382f;background:#121310;color:#d8d5cd;padding:7px 10px;border-radius:999px;font-size:12px}
section{padding:52px 0;border-top:1px solid #1d1e1b}.light{background:var(--ivory);color:#171713}.head h2{font-size:28px;margin:0 0 8px}.head p{margin:0;color:#777168}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}.card{border:1px solid var(--line);background:linear-gradient(145deg,#151714,#0f100f);padding:18px;min-height:128px}.card strong{display:block;color:var(--gold);font-size:18px}.card p{color:#999;font-size:12px;margin:7px 0 0}
.light .card{background:#fff;border-color:#ded7c8}.light .card p{color:#6f6a61}.light .card strong{color:#8f6c2e}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}.compare>div{padding:22px;border:1px solid #ddd5c6;background:#fff}.compare h3{margin:0 0 8px;font-size:20px}.compare p{color:#6d685f;margin:0}
.mapbox{height:360px;border:1px solid #34342e;background:#151713;margin-top:22px}.mapnote{font-size:11px;color:#8e8d87;margin-top:8px}
.area-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.area-links a{border:1px solid #d9d0bf;background:#fff;padding:9px 11px;font-size:12px;font-weight:800}
.faq details{background:#fff;color:#171713;border:1px solid #ddd4c4;margin:8px 0;padding:0 16px}.faq summary{font-weight:900;padding:14px 0;cursor:pointer}.faq p{color:#6e685f;margin:0;padding:0 0 14px;font-size:13px}
.cta-band{background:linear-gradient(120deg,#151713,#0c0d0c);padding:34px 0}.cta-row{display:flex;justify-content:space-between;gap:18px;align-items:center}.cta-row h2{margin:0;font-size:25px}.actions{display:flex;gap:8px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 15px;border-radius:999px;font-weight:950}.btn.gold{background:linear-gradient(135deg,var(--gold),var(--gold2));color:#111}.btn.ghost{border:1px solid #3a3933;background:#141514}
footer{padding:28px 0 60px;color:#777;font-size:12px}
.notice{margin-top:20px;padding:15px;border-left:4px solid var(--gold2);background:rgba(228,195,107,.07);color:#c8c4ba;font-size:13px}
@media(max-width:760px){.hero h1{font-size:34px}.grid{grid-template-columns:1fr 1fr}.compare{grid-template-columns:1fr}.cta-row{display:block}.actions{margin-top:14px}.mapbox{height:300px}}
@media(max-width:460px){.grid{grid-template-columns:1fr}.hero{padding-top:46px}.hero h1{font-size:30px}.brand{font-size:19px}.nav .sub{display:none}}

/* 2026-08 actual bin map + contrast fix */
.real-bin-map{height:520px!important;background:#fff!important}
.map-fallback{background:#fff;color:#171713;border:1px solid #d8cfbd;padding:14px 16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.map-fallback strong,.map-fallback span{color:#171713!important}.map-fallback span{font-size:12px}.map-fallback a{margin-left:auto;background:#d6ad4b;color:#111!important;padding:10px 14px;font-weight:900;text-decoration:none}
.compare-card,.compare-card *,.compare-grid>div,.compare-grid>div *,.card,.card *{color:#222!important}
@media(max-width:700px){.real-bin-map{height:430px!important}.map-fallback a{margin-left:0;width:100%;text-align:center}}


/* 2026-08-20 final visual harmony + readability */
section{background:#f3eee3;color:#171713;border-top:1px solid #ded7c8}
section .head h2{color:#171713}
section .head p{color:#6f695f}
section .grid .card{background:#fff;border:1px solid #d8cfbd;box-shadow:0 5px 16px rgba(37,31,20,.04)}
section .grid .card strong{color:#8a6725!important;font-size:17px}
section .grid .card p{color:#4e4a43!important;font-size:13px;line-height:1.65}
section .notice{background:#fff8e8;color:#514a3f;border-left-color:#c89c3d}
section .compare>div{box-shadow:0 5px 16px rgba(37,31,20,.04)}
section .compare h3{color:#171713}
section .compare p{color:#514d46}
.real-bin-map{border:1px solid #cfc4af;box-shadow:0 8px 24px rgba(35,29,19,.08);margin-bottom:16px}
.bin-visit-cta{background:#171713;border:1px solid #292820;box-shadow:0 8px 22px rgba(0,0,0,.08)}
.bin-visit-cta strong{color:#fff!important}
.bin-visit-cta span{color:#d8d5cc!important}
.bin-visit-cta a{background:linear-gradient(135deg,#e4c36b,#c39a43);color:#111!important;border-radius:4px}
.area-links a{color:#171713!important;background:#fff;border-color:#d9d0bf}
.faq details,.faq summary,.faq p{color:#171713}
.faq p{color:#514d46}
@media(max-width:760px){section{padding:38px 0}.head h2{font-size:24px}.real-bin-map{height:430px!important}}


.real-bin-map iframe{
  position:absolute;
  left:0;
  top:-118px;
  width:100%!important;
  height:690px!important;
  border:0!important;
}
@media(max-width:760px){
  .real-bin-map{height:500px!important}
  .real-bin-map iframe{top:-108px;height:620px!important}
}


/* 2026-08-21 SAFE MAP VISIBILITY FIX
   Do not crop or reposition the cross-origin embedded map page. */
.real-bin-map{
  position:relative!important;
  overflow:visible!important;
  height:620px!important;
  background:#fff!important;
}
.real-bin-map iframe{
  position:static!important;
  display:block!important;
  width:100%!important;
  height:620px!important;
  min-height:620px!important;
  border:0!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
}
@media(max-width:760px){
  .real-bin-map{height:560px!important}
  .real-bin-map iframe{height:560px!important;min-height:560px!important}
}

.source-map-note{margin:8px 0 0;padding:9px 11px;background:#fff8e8;border:1px solid #e6d4a8;color:#4b4539;font-size:11px;line-height:1.55}
.source-map-note strong{color:#8d691f}