/* Property & outdoor world: aerial plan and the route. */
.wd-hero--plan .wd-hero-grid { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.wp { position: relative; padding: 10px 0 24px; }
.wp-map { border-radius: 20px; overflow: hidden; border: 1px solid rgba(60,201,168,.25); box-shadow: 0 40px 100px rgba(0,0,0,.5); }
.wp-svg { display: block; width: 100%; height: auto; }
.wp-z { cursor: pointer; transition: opacity .35s; }
.wp-o { fill: transparent; stroke: transparent; stroke-width: 3; transition: stroke .3s, fill .3s; }
.wp-edge { stroke: rgba(242,184,75,.35); stroke-dasharray: 10 8; stroke-width: 2; }
.wp-map[data-on] .wp-z { opacity: .62; }
.wp-map[data-on="lawn"] .wp-z[data-z="lawn"], .wp-map[data-on="trees"] .wp-z[data-z="trees"], .wp-map[data-on="pool"] .wp-z[data-z="pool"],
.wp-map[data-on="edge"] .wp-z[data-z="edge"], .wp-map[data-on="drive"] .wp-z[data-z="drive"], .wp-map[data-on="house"] .wp-z[data-z="house"] { opacity: 1; }
.wp-map[data-on="lawn"] .wp-z[data-z="lawn"] .wp-o, .wp-map[data-on="trees"] .wp-z[data-z="trees"] .wp-o, .wp-map[data-on="pool"] .wp-z[data-z="pool"] .wp-o,
.wp-map[data-on="drive"] .wp-z[data-z="drive"] .wp-o, .wp-map[data-on="house"] .wp-z[data-z="house"] .wp-o { stroke: #3CC9A8; fill: rgba(60,201,168,.08); filter: drop-shadow(0 0 10px rgba(60,201,168,.6)); }
.wp-map[data-on="edge"] .wp-z[data-z="edge"] .wp-o { stroke: #F2B84B; stroke-width: 3; filter: drop-shadow(0 0 8px rgba(242,184,75,.6)); animation: wpMarch 1.2s linear infinite; }
@keyframes wpMarch { to { stroke-dashoffset: -36; } }
.wp-lbls text { fill: rgba(238,241,246,.4); transition: fill .3s; pointer-events: none; }
.wp-map[data-on="lawn"] text[data-z="lawn"], .wp-map[data-on="trees"] text[data-z="trees"], .wp-map[data-on="pool"] text[data-z="pool"], .wp-map[data-on="edge"] text[data-z="edge"], .wp-map[data-on="drive"] text[data-z="drive"], .wp-map[data-on="house"] text[data-z="house"] { fill: #fff; }
.wp-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.wp-tab { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border-radius: 99px; border: 1px solid rgba(238,241,246,.12); background: rgba(238,241,246,.04); color: #C4D0DD; font-family: var(--font-heading); font-size: .76rem; font-weight: 600; cursor: pointer; }
.wp-tab em { font-style: normal; font-family: var(--font-mono); font-size: .6rem; color: #9AA8BC; }
.wp-tab.on { background: #3CC9A8; border-color: #3CC9A8; color: #0B1220; }
.wp-tab.on em { color: #0B1220; }
.wp-card { margin-top: 12px; padding: 16px 18px; border-radius: 16px; background: rgba(11,18,32,.9); border: 1px solid rgba(60,201,168,.28); min-height: 132px; }
.wp-card-h { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.wp-card-h b { font-family: var(--font-heading); font-size: 1rem; color: #fff; }
.wp-card-h span { font-family: var(--font-mono); font-size: .58rem; letter-spacing: .12em; text-transform: uppercase; color: #3CC9A8; }
.wp-card ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px; }
.wp-card li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid rgba(238,241,246,.07); }
.wp-card li a.wp-l, .wp-card li a { font-family: var(--font-heading); font-size: .84rem; font-weight: 700; color: #EEF1F6; text-decoration: none; }
.wp-card li a:hover { color: #3CC9A8; }
.wp-card li span { font-family: var(--font-heading); font-size: .76rem; font-weight: 700; color: #6ACDE0; white-space: nowrap; }

/* route */
.wp-rt { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 56px; align-items: center; }
.wp-rt-copy h2 { font-family: var(--font-heading); font-size: clamp(1.9rem, 3.4vw, 2.6rem); font-weight: 800; line-height: 1.1; letter-spacing: -.035em; color: #fff !important; margin: 16px 0 18px; }
.wp-rt-copy > p { margin: 0 0 20px; font-size: 1rem; line-height: 1.7; color: #C4D0DD; }
.wp-rt-l { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.wp-rt-l li { padding-left: 18px; border-left: 2px solid #3CC9A8; }
.wp-rt-l b { display: block; font-family: var(--font-heading); font-size: .96rem; color: #fff; }
.wp-rt-l span { font-size: .86rem; color: #9AA8BC; }
.wp-rt-map { margin: 0; padding: 16px; border-radius: 22px; background: #08111B; border: 1px solid rgba(238,241,246,.08); }
.wp-rt-map svg { display: block; width: 100%; height: auto; }
.wp-rt-grid path { stroke: rgba(238,241,246,.06); stroke-width: 10; }
.wp-rt-rad { fill: rgba(60,201,168,.05); stroke: rgba(60,201,168,.35); stroke-width: 1.5; stroke-dasharray: 6 8; }
.wp-rt-line { fill: none; stroke: #34A3BC; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1400; stroke-dashoffset: 1400; }
.wp-rt-map.in .wp-rt-line { animation: wpLine 2.8s cubic-bezier(.4,0,.2,1) .3s forwards; }
@keyframes wpLine { to { stroke-dashoffset: 0; } }
.wp-stop circle { fill: #0B1220; stroke: #6ACDE0; stroke-width: 3; }
.wp-stop--new circle { fill: #3CC9A8; stroke: #fff; }
.wp-stop text { fill: #C4D0DD; font-family: var(--font-heading); font-size: 13px; font-weight: 700; }
.wp-stop--new text { fill: #3CC9A8; }
.wp-rt-map .wp-stop { opacity: 0; }
.wp-rt-map.in .wp-stop { animation: wpFade .4s ease forwards; animation-delay: calc(.4s + var(--i) * .3s); }
@keyframes wpFade { to { opacity: 1; } }
.wp-rt-van rect { fill: #EEF1F6; }
.wp-rt-van .wp-rt-win { fill: #19728A; }
.wp-rt-map figcaption { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-top: 10px; font-size: .74rem; color: #9AA8BC; }
.wp-rt-map figcaption span { display: inline-flex; align-items: center; gap: 7px; }
.wp-rt-map figcaption i { width: 12px; height: 12px; border-radius: 50%; }
.wp-rt-map i.k { border: 3px solid #6ACDE0; } .wp-rt-map i.n { background: #3CC9A8; } .wp-rt-map i.r { border: 1.5px dashed #3CC9A8; }
.wp-rt-map figcaption em { margin-left: auto; font-style: normal; font-size: .68rem; }

@media (max-width: 1100px) {
    .wd-hero--plan .wd-hero-grid { grid-template-columns: minmax(0, 1fr); }
    .wp { max-width: 760px; }
    .wp-rt { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
@media (max-width: 760px) {
    .wp-card ul { grid-template-columns: minmax(0, 1fr); }
    .wp-tab { font-size: .7rem; padding: 7px 10px; }
    .wp-lbls { display: none; }
    .wp-stop text { font-size: 20px; }
    .wp-rt-map figcaption em { margin-left: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .wp-rt-line { stroke-dashoffset: 0; } .wp-rt-map .wp-stop { opacity: 1; } .wp-map .wp-o { animation: none !important; } }
.wp-stop--base circle { opacity: 0; }
.wp-stop--base text { fill: #9AA8BC; font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
