/* 해뜰부동산 · 라이브 장치 스타일 */
/* ① ④ 첫 화면 날씨 · 마감 */
.hero-live{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 6px}
.hero-live > span{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.78);border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--ink2);white-space:nowrap;font-variant-numeric:tabular-nums;animation:hlIn .5s cubic-bezier(.2,.8,.2,1) both}
.hero-live b{color:var(--ink);font-weight:800}
.hl-wx em{font-style:normal;color:var(--pine);font-weight:700;padding-left:8px;border-left:1px solid var(--line)}
.hl-cd i{width:7px;height:7px;border-radius:50%;background:#B8C0C8;flex:none}
.hl-cd.on i{background:#E5484D;animation:lampPulseR 1.8s infinite}
@keyframes lampPulseR{0%{box-shadow:0 0 0 0 rgba(229,72,77,.5)}70%{box-shadow:0 0 0 6px rgba(229,72,77,0)}100%{box-shadow:0 0 0 0 rgba(229,72,77,0)}}
@keyframes hlIn{from{opacity:0;transform:translateY(4px)}}

/* ② 지금 이 시간 */
.hrow.is-now{position:relative}
.hrow.is-now > span:first-child{font-weight:800;color:var(--ink)}
.hrow.is-now .bar{box-shadow:0 0 0 3px rgba(212,175,55,.22)}
.hrow.is-now .bar i{position:relative;overflow:hidden}
.hrow.is-now .bar i::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.75),transparent);transform:translateX(-100%);animation:nowSweep 2.4s 1s ease-in-out infinite}
@keyframes nowSweep{60%,100%{transform:translateX(100%)}}
.now-tag{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;background:#D4AF37;color:#fff;font-size:10.5px;font-weight:800;vertical-align:1px;white-space:nowrap;animation:nowBlink 2s ease-in-out infinite}
@keyframes nowBlink{50%{opacity:.55}}
.hrow{grid-template-columns:auto minmax(0,1fr) 40px}
.hrow > span:first-child{min-width:44px;white-space:nowrap}

/* ③ 하늘색 */
.illu-wrap .sky{position:absolute;inset:0;z-index:0;pointer-events:none;mix-blend-mode:multiply;transition:background 1.5s ease;opacity:.9}
.illu-wrap .illu{position:relative;z-index:0}
.illu-wrap .sky{z-index:1}
.illu-wrap .glow,.illu-wrap .sign-glow,.illu-wrap .open-tag{z-index:2}
.illu-wrap[data-sky="dawn"] .sky{background:linear-gradient(180deg,rgba(255,190,170,.55),rgba(255,236,210,.15) 55%,transparent 75%)}
.illu-wrap[data-sky="day"] .sky{background:linear-gradient(180deg,rgba(150,200,255,.35),transparent 60%)}
.illu-wrap[data-sky="dusk"] .sky{background:linear-gradient(180deg,rgba(255,130,80,.55),rgba(255,180,110,.3) 50%,rgba(120,80,140,.15))}
.illu-wrap[data-sky="night"] .sky{background:linear-gradient(180deg,rgba(20,30,70,.75),rgba(40,50,100,.45) 55%,rgba(30,40,80,.35))}
.sky-tag{position:absolute;left:14px;top:14px;z-index:2;line-height:1;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.88);font-size:12px;font-weight:700;color:var(--ink2);box-shadow:var(--sh-1)}

/* ⑥ 사진 넘김 */
.lthumb{position:relative}
.lthumb .ph-next{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease;pointer-events:none}
.lthumb .ph-next.in{opacity:1}
.ph-dots{position:absolute;left:50%;top:14px;transform:translateX(-50%);display:flex;gap:4px;z-index:2;opacity:0;transition:opacity .3s}
.lcard:hover .ph-dots,.ph-dots:has(i.on:not(:first-child)){opacity:1}
.ph-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:0 0 2px rgba(0,0,0,.4)}
.ph-dots i.on{background:#fff;width:14px;border-radius:3px}

@media (max-width:640px){.hero-live > span{font-size:12px;white-space:normal}.hl-wx em{display:none}}
@media (prefers-reduced-motion:reduce){.hl-cd.on i,.now-tag,.hrow.is-now .bar i::after{animation:none}}

/* ===== 차분하게 · 깜빡임 · 반짝임 모두 끔 (눈 피로 줄이기) ===== */
.lamp.on,.lamp,.seen-chip i,.seen-chip.fresh i,.live-dot,.live-dot.open,.hl-cd i,.hl-cd.on i,.now-tag,.vcol.top i::before,.pin{animation:none!important;box-shadow:none!important}
.hrow.is-now .bar i::after{display:none!important}
.hrow.is-now .bar{box-shadow:none}
.now-tag{background:none;color:var(--pine);padding:0;margin-left:6px;font-size:11px}
/* 사무실 불: 깜빡임 없이 천천히 켜짐 */
.lit .glow,.lit .sign-glow{animation:none!important;opacity:.7;transition:opacity 1.6s ease}
.lit .g2{transition-delay:.3s}.lit .g3{transition-delay:.6s}.lit .sign-glow{transition-delay:.9s}
/* 첫 화면 시계 · 날씨: 칩 대신 조용한 한 줄 */
.hero-clock,.hero-live > span{background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;padding:0!important;font-size:13px;font-weight:500;color:var(--ink3);animation:none!important}
.hero-live{gap:14px;margin:6px 0 10px}
.hero-live b{font-weight:700;color:var(--ink2)}
.hl-wx svg{display:none}
.hl-wx em{color:var(--ink3);font-weight:500;padding-left:10px}
.hero-clock .lamp,.hl-cd i{width:6px;height:6px}
.illu{animation:none!important}
.hl-wx{display:none!important}

/* ===== 히어로 배경 · 해뜰 매장 입구 사진 (아주 천천히 흐름) ===== */
.hero{overflow:hidden;isolation:isolate;background:transparent!important}
.hero::before{content:"";position:absolute;inset:-4% -6%;z-index:-2;background:url("img/office_front2.jpg") 70% 55%/cover no-repeat;animation:heroDrift 48s ease-in-out infinite alternate;will-change:transform}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.92) 36%,rgba(255,255,255,.55) 60%,rgba(255,255,255,.18) 100%),
    linear-gradient(180deg,rgba(255,255,255,.2) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0) 62%,#fff 92%)}
@keyframes heroDrift{from{transform:scale(1.04) translate3d(-1.5%,0,0)}to{transform:scale(1.1) translate3d(1.5%,-1%,0)}}
.hero .ai-card{background:rgba(255,255,255,.8);backdrop-filter:blur(10px) saturate(1.1);box-shadow:0 20px 50px -24px rgba(0,27,77,.35)}
.hero .hstat{background:transparent}
@media (max-width:940px){
  .hero::before{background-position:60% 40%}
  .hero::after{background:linear-gradient(180deg,rgba(255,255,255,.86),rgba(255,255,255,.94) 45%,#fff 100%)}
}
@media (prefers-reduced-motion:reduce){.hero::before{animation:none}}

.hero-label,.hero-clock,.hero-live > span{white-space:nowrap}
.hero-clock{width:auto!important;max-width:none!important}

/* ===== 매물 더 보기 · 네이버 부동산 바로가기 ===== */
.more-card{gap:18px}
.nland{display:grid;grid-template-columns:96px minmax(0,1fr) 28px;align-items:center;gap:14px;padding:12px;border-radius:14px;background:#fff;border:1px solid var(--line);color:inherit;text-decoration:none;box-shadow:var(--sh-1);transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,border-color .2s;margin-top:auto}
.nland:hover{transform:translateY(-2px);box-shadow:var(--sh-2);border-color:#03C75A}
.nland-map{position:relative;width:96px;height:72px;border-radius:10px;overflow:hidden;background:#EEF3F8}
.nland-map img{width:100%;height:100%;object-fit:cover;transform:scale(1.25)}
.nl-pin{position:absolute;width:10px;height:10px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:#03C75A;box-shadow:0 0 0 2px #fff}
.nl-pin.p1{left:30%;top:28%}.nl-pin.p2{left:58%;top:46%}.nl-pin.p3{left:44%;top:62%;background:var(--pine)}
.nland-txt b{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:800;color:var(--ink)}
.nland-txt b::before{content:"N";display:inline-grid;place-items:center;width:18px;height:18px;border-radius:4px;background:#03C75A;color:#fff;font-size:11px;font-weight:900}
.nland-txt small{display:block;margin-top:4px;font-size:12.5px;line-height:1.5;color:var(--ink3)}
.nland-go{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--bg2);color:var(--ink2);font-weight:800}
.nland:hover .nland-go{background:#03C75A;color:#fff}
/* 네이버 부동산 카드: 좋은 칸에 맞게 세로형 */
.more-card .nland{grid-template-columns:minmax(0,1fr) 30px;grid-template-areas:"map map" "txt go";gap:12px 10px;padding:10px 10px 14px}
.more-card .nland-map{grid-area:map;width:100%;height:120px}
.more-card .nland-map img{transform:scale(1.05)}
.more-card .nland-txt{grid-area:txt;padding-left:6px;min-width:0}
.more-card .nland-txt b{white-space:nowrap;font-size:15.5px}
.more-card .nland-go{grid-area:go;align-self:center}
.nl-pin{width:14px;height:14px}
.nl-pin.p1{left:24%;top:30%}.nl-pin.p2{left:62%;top:40%}.nl-pin.p3{left:44%;top:60%}
/* 네이버 부동산 카드: 빈 자리를 지도로 꽉 채우고, 어디를 눌러도 열림 */
.more-card{position:relative}
.more-card .nland{flex:1 1 auto;grid-template-rows:minmax(160px,1fr) auto;min-height:260px;margin-top:4px}
.more-card .nland-map{height:100%;min-height:160px}
.more-card .nland-map img{transform:scale(1.15)}
.more-card .nland-map::after{content:"지도 열기";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:8px 14px;border-radius:999px;background:rgba(3,199,90,.95);color:#fff;font-size:13px;font-weight:800;box-shadow:0 6px 16px -6px rgba(0,0,0,.35);opacity:0;transition:opacity .2s}
.more-card .nland:hover .nland-map::after{opacity:1}
@media (hover:none){.more-card .nland-map::after{opacity:1}}

/* ===== 대표 소개 · B tv 뉴스 영상 ===== */
.agent-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.agent-video{position:relative;border-radius:var(--r-lg,20px);overflow:hidden;background:#0b1626;aspect-ratio:16/9;box-shadow:0 20px 50px -24px rgba(0,27,77,.45)}
.agent-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#0b1626}
.av-play{position:absolute;inset:0;border:0;padding:0;cursor:pointer;display:flex;align-items:flex-end;justify-content:flex-start;gap:12px;padding:18px;background:linear-gradient(180deg,rgba(0,27,77,0) 45%,rgba(0,27,77,.78) 100%);color:#fff;text-align:left;font-family:inherit}
.av-play[hidden]{display:none}
.av-btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:68px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.95);color:var(--navy-900,#001B4D);box-shadow:0 10px 30px -8px rgba(0,0,0,.5);transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.av-btn svg{margin-left:3px}
.av-play:hover .av-btn{transform:translate(-50%,-50%) scale(1.06)}
.av-cap b{display:block;font-size:15px;font-weight:800;letter-spacing:-.01em}
.av-cap small{display:block;margin-top:2px;font-size:12.5px;color:rgba(255,255,255,.8)}
.agent-card-v{position:static!important;box-shadow:none!important;border:1px solid var(--line);border-radius:14px;padding:16px 18px}
@media (max-width:940px){.av-btn{width:58px;height:58px}}

/* 모바일 · 오시는 길 사무실 그림 높이 복구 */
.illu-wrap .illu{display:block;width:100%;height:auto}
@media (max-width:940px){
  .visit-illu .illu-wrap{aspect-ratio:4/3;width:100%}
  .visit-illu .illu-wrap .illu{position:absolute;inset:0;height:100%;object-fit:cover}
  .lthumb .ph-tag{font-size:11.5px}
}
