:root{--brand-black:#111;--brand-white:#FFF;--brand-gray:#F5F5F7;--glass-border:rgba(255,255,255,0.5);--glass-bg:rgba(255,255,255,0.7);--glass-shadow:0 4px 20px rgba(0,0,0,0.05);--text-main:#111;--text-sub:#666;--text-muted:#888;--container-width:1200px}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;color:var(--brand-black);background:var(--brand-white);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-weight:700;letter-spacing:-0.02em;margin-bottom:1rem}
.glass-card{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:16px;box-shadow:var(--glass-shadow)}
.content-wrapper{max-width:var(--container-width);margin:0 auto;padding:0 20px;width:100%}
.text-center{text-align:center}.text-muted{color:var(--text-muted)}
.section{padding:80px 0}.section--gray{background:var(--brand-gray)}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 28px;background:var(--brand-black);color:var(--brand-white);border:1px solid var(--brand-black);border-radius:8px;font-family:'Pretendard',sans-serif;font-weight:600;font-size:16px;text-decoration:none;cursor:pointer;transition:all .2s cubic-bezier(.25,.8,.25,1)}
.btn:hover{background:#333;transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.1)}
.site-header{padding:16px 0;border-bottom:1px solid rgba(0,0,0,0.05);background:rgba(255,255,255,0.8);backdrop-filter:blur(12px);position:sticky;top:0;z-index:50}
.site-header .content-wrapper{display:flex;align-items:center;justify-content:space-between}
.site-header__logo{font-size:20px;font-weight:800;color:var(--brand-black);text-decoration:none;letter-spacing:-0.03em}
.site-header__nav a{font-size:14px;color:var(--text-sub);text-decoration:none;margin-left:20px}
.site-header__nav a:hover{color:var(--brand-black)}
.map-hero{padding:60px 0 40px;background:var(--brand-gray)}
.map-hero__title{font-size:2rem;margin-bottom:.5rem}
.map-hero__count{font-size:1.25rem;color:var(--text-sub);margin-bottom:.5rem}
.map-hero__count strong{color:var(--brand-black)}
.map-hero__desc{font-size:1rem;max-width:500px;margin:0 auto}
.map-hero__desc strong{color:var(--brand-black);font-weight:600}
.map-section{padding:40px 0}
.bin-map__container{width:100%;height:350px;border-radius:16px;overflow:hidden;border:1px solid rgba(0,0,0,0.08);background:var(--brand-gray)}
.comparison-section{padding:60px 0}
.comparison{text-align:center}
.comparison__heading{font-size:1.5rem;margin-bottom:.5rem}
.comparison__subtext{color:#666;margin-bottom:2rem}
.comparison__table{display:grid;grid-template-columns:1fr;gap:16px;margin-bottom:2rem}
.comparison__column{padding:24px 20px;text-align:left}
.comparison__column--bin{opacity:.7}
.comparison__column--hohn{border:2px solid #111}
.comparison__column-header{display:flex;align-items:center;gap:8px;margin-bottom:16px}
.comparison__badge{padding:2px 10px;background:#111;color:#fff;font-size:12px;font-weight:600;border-radius:100px}
.comparison__label{font-size:18px;font-weight:700}
.comparison__list{list-style:none}
.comparison__item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid rgba(0,0,0,0.06)}
.comparison__item:last-child{border-bottom:none}
.comparison__item-label{font-size:14px;color:#888}
.comparison__item-value{font-size:15px;font-weight:500;color:#333;text-align:right}
.comparison__item-value--highlight{color:#111;font-weight:700}
.comparison__cta{text-align:center}
.comparison__cta-btn{width:100%;max-width:320px;font-size:17px;padding:16px 32px}
.comparison__cta-note{margin-top:12px;font-size:14px;color:#888}
.bin-list__heading{font-size:1.5rem;margin-bottom:.5rem}
.bin-list__desc{margin-bottom:1.5rem}
.bin-search{margin-bottom:1rem;position:relative}
.bin-search__input{width:100%;padding:12px 40px 12px 16px;border:1px solid #E5E5E5;border-radius:8px;font-size:15px;font-family:'Pretendard',sans-serif;background:var(--brand-white);color:var(--text-main);box-sizing:border-box;transition:border-color .2s}
.bin-search__input:focus{outline:none;border-color:var(--brand-black)}
.bin-search__input::placeholder{color:var(--text-muted)}
.bin-search__clear{position:absolute;top:22px;right:8px;transform:translateY(-50%);width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:50%;color:var(--text-muted);font-size:18px;line-height:1;cursor:pointer;padding:0;font-family:'Pretendard',sans-serif}
.bin-search__clear:hover{background:var(--brand-gray);color:var(--text-main)}
.bin-search__clear:focus-visible{outline:2px solid var(--brand-black);outline-offset:2px}
.bin-search__clear[hidden]{display:none}
.bin-search__empty{padding:24px 0;text-align:center;color:var(--text-muted);font-size:14px}
.bin-search__empty--cta{padding:32px 16px}
.bin-search__empty-msg{color:var(--text-main);font-size:15px;font-weight:600;margin-bottom:8px}
.bin-search__empty-sub{color:var(--text-muted);font-size:13px;margin-bottom:16px}
.bin-search__empty-btn{display:inline-flex;font-size:14px;padding:10px 20px}
.bin-search__count{margin-top:6px;font-size:13px;color:var(--text-muted);text-align:right}
.bin-search__count[hidden]{display:none}
.bin-list__toggle{display:inline-flex;align-items:center;padding:12px 24px;background:var(--brand-white);color:var(--brand-black);border:1px solid #E5E5E5;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;font-family:'Pretendard',sans-serif}
.bin-list__toggle:hover{background:var(--brand-gray)}
.bin-list__content{margin-top:1.5rem}
.bin-list__items{list-style:none;display:grid;grid-template-columns:1fr;gap:0}
.bin-list__item{display:flex;align-items:baseline;gap:12px;padding:12px 8px;border-bottom:1px solid rgba(0,0,0,0.06);font-size:14px;border-radius:6px;transition:background-color .15s}
.bin-list__item[data-bin-index]{cursor:pointer}
.bin-list__item[data-bin-index]:hover{background:var(--brand-gray)}
.bin-list__item[data-bin-index]:focus-visible{outline:2px solid var(--brand-black);outline-offset:-2px}
.bin-list__item-num{flex-shrink:0;width:28px;text-align:right;color:var(--text-muted);font-size:13px}
.bin-list__item-detail{color:var(--text-sub);font-size:13px}
.bin-list__item-detail::before{content:"· "}
.bin-share{margin-top:8px;padding:6px 12px;background:var(--brand-white);color:var(--brand-black);border:1px solid #E5E5E5;border-radius:6px;font-size:12px;font-family:'Pretendard',sans-serif;cursor:pointer;transition:background-color .15s}
.bin-share:hover{background:var(--brand-gray)}
.bin-directions{display:inline-block;margin-top:8px;margin-left:6px;padding:6px 12px;background:var(--brand-black);color:var(--brand-white);border:1px solid var(--brand-black);border-radius:6px;font-size:12px;font-family:'Pretendard',sans-serif;text-decoration:none;cursor:pointer;transition:background-color .15s}
.bin-directions:hover{background:#333}
.bin-directions:focus-visible{outline:2px solid var(--brand-black);outline-offset:2px}
.bin-iw{padding:12px 16px;max-width:260px;line-height:1.5}
.bin-iw__address{margin:0 0 4px;font-size:14px;font-weight:600;color:var(--text-main)}
.bin-iw__detail{margin:0;font-size:13px;color:var(--text-sub)}
.bin-iw__manager{margin:0;font-size:12px;color:var(--text-muted)}
.cta-section{background:linear-gradient(180deg,rgba(245,245,247,0.6),rgba(255,255,255,0.9))}
.cta-card{text-align:center;padding:2.5rem}.cta-card p{margin-bottom:1.5rem}
.adsense-banner{padding:24px 0}
.sticky-bottom-cta{position:fixed;bottom:20px;left:20px;right:20px;z-index:100;box-shadow:0 10px 30px rgba(0,0,0,.2);display:flex;padding:12px;background:rgba(255,255,255,.95);border-radius:16px;border:1px solid rgba(0,0,0,.08);animation:slideUp .5s ease-out forwards}
.sticky-bottom-cta .btn{flex:1}
@keyframes slideUp{from{transform:translateY(100px);opacity:0}to{transform:translateY(0);opacity:1}}
.site-footer{padding:40px 0;background:var(--brand-gray);text-align:center;font-size:13px;color:var(--text-muted)}
@media(min-width:768px){.map-hero{padding:80px 0 60px}.map-hero__title{font-size:2.5rem}.bin-map__container{height:500px}.comparison__heading{font-size:2rem}.comparison__table{grid-template-columns:1fr 1fr;gap:24px}.comparison__column{padding:32px 28px}.comparison__cta-btn{width:auto}.bin-list__items{grid-template-columns:1fr 1fr;gap:0 40px}}
@media(min-width:769px){.sticky-bottom-cta{display:none!important}}
@media(prefers-reduced-motion:reduce){.sticky-bottom-cta{animation:none}.btn{transition:none}.btn:hover{transform:none;box-shadow:none}}
@media(max-width:768px){.section{padding:60px 0}h1{font-size:2rem}h2{font-size:1.5rem}}
/* 도봉구 (수거함 없음) & 랜딩 페이지 */
.hero{padding:60px 0 40px;background:var(--brand-gray);text-align:center}
.hero h1{font-size:2.2rem;font-weight:700;letter-spacing:-0.02em;margin-bottom:1rem}
.hero p{color:var(--text-sub);font-size:1.1rem;max-width:500px;margin:0 auto}
.notice{padding:60px 0;text-align:center}
.notice-card{padding:3rem 2rem}
.notice-card h2{font-size:1.5rem;margin-bottom:1rem}
.notice-card p{color:var(--text-sub);margin-bottom:2rem;font-size:1rem;line-height:1.8}
.notice-card .highlight{color:var(--brand-black);font-weight:600}
.benefits{display:grid;grid-template-columns:1fr;gap:12px;text-align:left;max-width:360px;margin:0 auto 2rem}
.benefits li{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:15px;list-style:none}
.benefits li::before{content:"✓";color:var(--brand-black);font-weight:700;font-size:14px}
.district-list{padding:40px 0}
.district-list ul{list-style:none}
.district-list__item{padding:12px 0;border-bottom:1px solid rgba(0,0,0,0.06)}
.district-list__link{text-decoration:none;color:var(--brand-black);font-weight:500}
.district-list__count{color:var(--text-muted);font-size:14px}
.district-list__count--unavailable{color:#C00;font-size:14px}
.district-list__badge{font-size:12px;padding:2px 8px;background:var(--brand-black);color:var(--brand-white);border-radius:100px;margin-left:8px}
.map-loading,.map-error{display:flex;align-items:center;justify-content:center;height:100%;font-size:15px;color:#888}
.map-error{color:#c33}
@media(min-width:768px){.hero h1{font-size:2.5rem}}
.breadcrumb{padding:14px 0 0;background:var(--brand-gray);font-size:13px;color:var(--text-sub)}
.breadcrumb__list{list-style:none;display:flex;flex-wrap:wrap;gap:6px;max-width:var(--container-width);margin:0 auto;padding:0 20px}
.breadcrumb__item{display:inline-flex;align-items:center}
.breadcrumb__item + .breadcrumb__item::before{content:"›";margin:0 6px;color:var(--text-muted)}
.breadcrumb__item a{color:var(--text-sub);text-decoration:none}
.breadcrumb__item a:hover{color:var(--brand-black);text-decoration:underline}
.breadcrumb__item[aria-current="page"]{color:var(--brand-black);font-weight:600}
