/* MIJUONE 1.20.2 — title banner consistency and higher-resolution hero assets.
   Align 뉴스, 중고거래, 구인구직, 자동차 마켓 with the same top spacing, full-width rhythm,
   and dedicated high-resolution imagery while keeping the Community-inspired header system.
*/
/* Tighten GA dropdown; width must be content-based instead of a large blank pill. */
.top-header .header-main > .location-switch{
  display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto!important;width:max-content!important;min-width:0!important;
  max-width:154px!important;min-height:36px;height:36px!important;
  padding:0 10px!important;gap:7px!important;margin:0;
  border:1px solid #d7e4f8;border-radius:11px;
  background:linear-gradient(180deg,#fff,#f5f9ff);
  box-shadow:0 2px 6px rgba(26,71,138,.035);
  transition:background .2s,border-color .2s,box-shadow .2s,transform .2s;
}
.top-header .header-main > .location-switch:hover{background:#ebf4ff;border-color:#a3c6fa;box-shadow:0 7px 17px rgba(24,86,165,.1);transform:translateY(-1px)}
.top-header .header-main > .location-switch:focus-visible{outline:2px solid #1674e8;outline-offset:3px}
.top-header .header-main > .location-switch .icon{width:16px;height:16px;flex:0 0 16px;stroke-width:2.1;color:#236de9}
.top-header .header-main > .location-switch #currentLocation{display:block;min-width:0!important;width:auto!important;max-width:72px;flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#244269;font-size:12px;font-weight:850;letter-spacing:0}
.top-header .header-main > .location-switch .chevron-icon{width:13px;height:13px;flex:0 0 13px;color:#607d9f;transition:transform .22s}
.top-header .header-main > .location-switch[aria-expanded="true"] .chevron-icon{transform:rotate(180deg)}
@media(max-width:1080px){.top-header .header-main > .location-switch{display:none!important}}
@media(min-width:1081px) and (max-width:1220px){.top-header .header-main > .location-switch{padding:0 7px!important;gap:5px!important}}

/* Cross-page shared design tokens: match Community's 280px photo banner. */
body .mi-title-unified{--mi-hero-navy:#0c2857;--mi-hero-blue:#1169e9;--mi-hero-outline:#dce9fa;--mi-hero-side-pad:max(24px,calc((100vw - 1490px)/2));
  position:relative;isolation:isolate;overflow:hidden;
  box-sizing:border-box;min-height:280px!important;max-height:none;
  border-radius:0!important;border:0!important;border-bottom:1px solid #dce9fa!important;
  box-shadow:0 15px 35px rgba(49,95,167,.08)!important;
  background-color:#edf5ff!important;color:var(--mi-hero-navy);
}
/* Existing parent containers vary; pull those banners to full viewport width like 커뮤니티. */
body :is(.mj-news-shell,.mm-market-app,.cj-app,.ma-app) > .mi-title-unified,
body .mh-app .mi-title-unified{
  width:100vw!important;max-width:none!important;
  margin-left:calc(50% - 50vw)!important;margin-right:0!important;
  margin-top:0!important;margin-bottom:22px!important;
}
body .mn-app > .mi-title-unified{width:100%;margin:0 0 22px!important}
body .mi-title-unified h1{font-size:clamp(31px,3vw,49px)!important;font-weight:950!important;letter-spacing:-.074em!important;line-height:1.16!important;color:var(--mi-hero-navy)!important;text-wrap:balance;margin-top:14px!important;margin-bottom:12px!important}
body .mi-title-unified h1 em{font-style:normal!important;background:linear-gradient(120deg,#0d57c9,#289feb)!important;background-clip:text!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
body .mi-title-unified :is(.mj-news-eyebrow,.mn-eyebrow,.mm-overline,.cj-hero-eyebrow,.mh-hero-overline,.ma-eyebrow){font-size:10px!important;letter-spacing:.145em!important;font-weight:900!important;color:#1a65bc!important;line-height:1.45}
body .mi-title-unified p{font-size:13px!important;line-height:1.72!important;font-weight:650!important;color:#4f6d96!important}
body .mi-title-unified :is(.mc-btn,.mm-main-action,.mm-soft-action,.cj-primary-btn,.cj-secondary-btn,.ma-btn,.mh-primary-link){border-radius:12px!important;min-height:42px;transition:transform .24s ease,box-shadow .24s ease,background .24s ease}
body .mi-title-unified a:hover{transform:translateY(-2px)}
body .mi-title-unified .icon{flex:none}
@keyframes miUnifiedHeroIn{from{opacity:.25;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference){body .mi-title-unified :is(.mj-news-hero-copy,.mn-hero-copy,.mm-head-copy,.cj-hero-copy,.mh-intro-copy,.ma-hero-copy){animation:miUnifiedHeroIn .65s cubic-bezier(.22,.8,.28,1) both}}

/* NEWS: change the isolated dark blue infographic to Community-like photographic editorial header. */
body .mj-news-hero.mi-title-unified{display:flex;align-items:center;justify-content:flex-start;
  background:linear-gradient(90deg,rgba(245,249,255,.997) 0%,rgba(242,248,255,.98) 35%,rgba(236,245,255,.81) 52%,rgba(224,240,255,.18) 82%),url('../img/hero-city.jpg') right 43% /cover no-repeat!important;
  padding:32px var(--mi-hero-side-pad)!important;
}
body .mi-title-news .mj-news-hero-copy{width:min(740px,68%);max-width:none}
body .mi-title-news :is(.mj-news-hero-art,.mj-news-orbit,.mj-news-globe,.mj-news-float){display:none!important}
body .mi-title-news .mj-news-hero-tags{margin-top:18px;gap:8px}
body .mi-title-news .mj-news-hero-tags span{border:1px solid #c4daf9;color:#3667ac;background:rgba(255,255,255,.72);padding:7px 10px;border-radius:999px;font-size:10px}
body .mi-title-news::before{display:none!important}

/* NEIGHBORHOOD: keep the actual city picture and writing composer; share dimensions and type. */
body .mn-hero.mi-title-unified{min-height:280px!important}
body .mi-title-neighborhood .mn-hero-inner{min-height:280px;padding-block:26px 28px}
body .mi-title-neighborhood .mn-hero-main{margin-top:14px;gap:24px}
body .mi-title-neighborhood .mn-hero-chips{gap:8px}
body .mi-title-neighborhood .mn-hero-chips span{border-radius:999px;padding:7px 10px;font-size:10px}
body .mi-title-neighborhood .mn-hero-action{max-width:330px}

/* MARKET: full-width photo banner, copy and original working seller actions. */
body .mm-head.mi-title-unified{padding:28px var(--mi-hero-side-pad)!important;display:flex;align-items:center;gap:20px}
body .mi-title-market .mm-hero-photo{inset:0 0 0 34%}
body .mi-title-market .mm-hero-wash{background:linear-gradient(90deg,rgba(245,249,255,.997) 0%,rgba(242,248,255,.98) 36%,rgba(236,245,255,.82) 54%,rgba(224,240,255,.18) 84%)}
body .mi-title-market .mm-head-copy{width:min(690px,67%);max-width:690px;min-width:0}
body .mi-title-market .mm-hero-pills{gap:8px;margin-top:18px}
body .mi-title-market .mm-head-actions{flex:0 0 205px;max-width:215px;padding:15px;border-radius:18px}
body .mi-title-market .mm-action-eyebrow{font-size:9px}

/* CAREERS: centered photo strip with the same height and Community title scale. */
body .cj-hero.mi-title-unified{min-height:280px!important;padding:32px var(--mi-hero-side-pad)!important;display:flex;align-items:center}
body .mi-title-careers .cj-hero-copy{flex:0 1 730px;max-width:68%;min-width:0}
body .mi-title-careers .cj-hero-cta{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:10px;margin-top:18px}
body .mi-title-careers :is(.cj-primary-btn,.cj-secondary-btn){min-height:43px;font-size:11px;padding:11px 15px}
body .mi-title-careers .cj-hero-picture-label{right:var(--mi-hero-side-pad);bottom:20px}

/* HOMES: keep actual housing photo and original links, Community copy rhythm. */
body .mh-intro-surface.mi-title-unified{min-height:280px!important;display:flex;flex-direction:column;justify-content:center}
body .mi-title-homes .mh-intro-photo{inset:0 0 0 39%;background-position:center 56%}
body .mi-title-homes .mh-intro-surface::after{background:linear-gradient(90deg,rgba(245,249,255,.997) 0%,rgba(242,248,255,.97) 36%,rgba(236,245,255,.78) 54%,rgba(224,240,255,.12) 83%)}
body .mi-title-homes .mh-topline,
body .mi-title-homes .mh-heading-row{width:min(1490px,calc(100% - 48px))!important;max-width:1490px!important;margin-inline:auto;padding:0!important}
body .mi-title-homes .mh-topline{position:absolute;right:var(--mi-hero-side-pad);top:19px;width:auto!important;max-width:none!important;z-index:6;margin:0!important;padding:0!important}
body .mi-title-homes .mh-brandline{display:none}
body .mi-title-homes .mh-heading-row{min-height:280px;align-items:center;padding-block:26px!important}
body .mi-title-homes .mh-intro-copy{max-width:745px;width:min(100%,68%)}
body .mi-title-homes .mh-intro-highlights{margin-top:18px}

/* AUTO: same Community typography and height, preserve vehicle photography. */
body .ma-hero.mi-title-unified{min-height:280px!important;align-items:center}
body .mi-title-auto .ma-hero-copy{width:min(730px,65%);padding:32px 20px 32px var(--mi-hero-side-pad)!important}
body .mi-title-auto::before{background:linear-gradient(90deg,rgba(245,249,255,.997) 0%,rgba(242,248,255,.98) 36%,rgba(236,245,255,.82) 54%,rgba(224,240,255,.15) 84%)}
body .mi-title-auto .ma-hero-photo{width:65%}
body .mi-title-auto .ma-hero-actions{margin-top:17px;gap:10px}
body .mi-title-auto :is(.ma-btn-primary,.ma-btn-light){min-height:43px;font-size:11px}

/* Responsive: keep existing three-column content untouched; only hero composition changes. */
@media(max-width:1024px){
  body .mi-title-unified{--mi-hero-side-pad:24px;min-height:255px!important}
  body .mi-title-unified h1{font-size:clamp(29px,4.4vw,41px)!important}
  body .mi-title-unified p{font-size:12px!important}
  body .mi-title-market .mm-head-actions{flex-basis:175px}
  body .mi-title-careers .cj-hero-copy{max-width:73%}
  body .mi-title-homes .mh-intro-copy{width:min(100%,74%)}
}
@media(max-width:700px){
  body .mi-title-unified{--mi-hero-side-pad:20px;min-height:245px!important}
  body .mi-title-unified h1{font-size:clamp(27px,6vw,33px)!important;margin-top:10px!important}
  body .mi-title-unified p{font-size:11px!important;line-height:1.64!important}
  body .mj-news-hero.mi-title-unified{padding:28px 20px!important;background-position:60% center!important}
  body .mi-title-news .mj-news-hero-copy{width:100%;max-width:590px}
  body .mi-title-neighborhood .mn-hero-inner{padding-block:22px 24px}
  body .mi-title-neighborhood .mn-hero-main{flex-direction:column;align-items:stretch}
  body .mi-title-neighborhood .mn-hero-action{max-width:100%;width:100%}
  body .mm-head.mi-title-unified{padding:24px 20px!important;flex-direction:column;align-items:stretch}
  body .mi-title-market .mm-head-copy{width:100%;max-width:100%}
  body .mi-title-market .mm-head-actions{max-width:none;flex:0 0 auto;width:100%;flex-direction:row;flex-wrap:wrap;align-items:center}
  body .mi-title-market .mm-action-eyebrow{flex-basis:100%;text-align:left}
  body .mi-title-market .mm-head-actions a{flex:1;min-width:120px}
  body .cj-hero.mi-title-unified{padding:25px 20px!important}
  body .mi-title-careers .cj-hero-copy{max-width:100%;flex:1}
  body .mi-title-careers .cj-hero-picture-label{display:none}
  body .mi-title-homes .mh-topline,body .mi-title-homes .mh-heading-row{width:calc(100% - 40px)!important}
  body .mi-title-homes .mh-intro-copy{width:100%}
  body .mi-title-homes .mh-topline{position:relative;right:auto;top:auto;width:calc(100% - 40px)!important;margin:0 auto!important;padding-top:18px!important}
  body .mi-title-homes .mh-heading-row{min-height:0;padding-block:12px 25px!important}
  body .mi-title-homes .mh-top-actions{justify-content:flex-start;flex-wrap:wrap}
  body .mi-title-auto .ma-hero-copy{width:100%;padding:27px 20px!important}
  body .mi-title-auto .ma-hero-photo{width:100%;opacity:.33}
  body .mi-title-auto::before{background:linear-gradient(90deg,rgba(245,249,255,.985),rgba(238,247,255,.87) 76%,rgba(226,242,255,.74))}
}
@media(prefers-reduced-motion:reduce){body .mi-title-unified *,body .mi-title-unified::before,body .mi-title-unified::after{animation:none!important;transition:none!important}}
:root[data-theme="dark"] body .mi-title-unified{background-color:#132b48!important}


/* 1.20.2 consistency fixes: remove uneven top gaps and keep the same full-bleed width across banners. */
body .mj-news-shell,
body .mm-market-app,
body .page-careers .cj-app,
body .page-auto .ma-app{padding-top:0!important}
body .mj-news-shell > .mi-title-unified,
body .mm-market-app > .mi-title-unified,
body .page-careers .cj-app > .mi-title-unified,
body .page-auto .ma-app > .mi-title-unified{margin-top:0!important;margin-bottom:24px!important}
body .mj-news-shell,
body .mm-market-app,
body .page-careers .cj-app,
body .page-auto .ma-app{overflow-x:clip}

/* Sharper, page-specific, non-duplicated hero imagery. */
body .mj-news-hero.mi-title-unified{background:linear-gradient(90deg,rgba(245,249,255,.997) 0%,rgba(242,248,255,.98) 35%,rgba(236,245,255,.81) 52%,rgba(224,240,255,.18) 82%),url('../img/hero-city.jpg') right 44%/cover no-repeat!important}
body .page-careers .cj-hero.cj-hero-refined.mi-title-unified::before{background-image:linear-gradient(90deg,rgba(247,251,255,.985) 0%,rgba(244,249,255,.965) 35%,rgba(237,246,255,.82) 56%,rgba(225,239,255,.26) 88%),url('../img/hero-careers-recruitment-v1202.jpg')!important;background-size:cover!important;background-position:center center!important}
:root[data-theme="dark"] body .page-careers .cj-hero.cj-hero-refined.mi-title-unified::before{background-image:linear-gradient(90deg,rgba(18,33,54,.97),rgba(20,37,58,.95) 35%,rgba(20,44,71,.78) 58%,rgba(18,35,55,.28) 88%),url('../img/hero-careers-recruitment-v1202.jpg')!important}
body .mi-title-auto .ma-hero-photo img{object-position:center center!important;filter:saturate(.96) contrast(1.03)!important}
body .mi-title-market .mm-hero-photo{background-position:center center!important}

@media(max-width:700px){
  body .mj-news-shell > .mi-title-unified,
  body .mm-market-app > .mi-title-unified,
  body .page-careers .cj-app > .mi-title-unified,
  body .page-auto .ma-app > .mi-title-unified{margin-bottom:18px!important}
  body .page-careers .cj-hero.cj-hero-refined.mi-title-unified::before{background-image:linear-gradient(90deg,rgba(248,252,255,.985),rgba(242,248,255,.9) 70%,rgba(234,243,255,.74)),url('../img/hero-careers-recruitment-v1202.jpg')!important;background-position:center center!important}
}
