/* Read-only landlord illustration: visual language and geometry from Mobilise's programme timeline. */
.ml-landlord-occupation-demo{margin:35px 0 0;transform:none}
.ml-landlord-occupation{padding:19px 22px 21px}
.ml-landlord-occupation .ml-demo-heading--programme{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.ml-landlord-occupation .ml-demo-heading--programme h2{margin:4px 0 0;color:var(--ml-ink);font:600 18px/1.25 var(--ml-display);letter-spacing:-.45px}
.ml-landlord-occupation .ml-demo-label{font-size:8px;letter-spacing:1px}
.ml-landlord-timeline-note{flex:none;padding:6px 8px;border:1px solid #e2d9e9;border-radius:3px;background:#f7f3fa;color:#66508f;font-size:8px;font-weight:750;letter-spacing:.06em;text-transform:uppercase}
.ml-landlord-occupation .ml-programme-intro{margin:8px 0 12px;color:#7b7586;font-size:10px;line-height:1.5}
.ml-landlord-timeline{overflow:hidden;border:1px solid #e4e1eb;border-radius:9px;background:#fff;box-shadow:0 9px 26px #3023420b}
.ml-landlord-timeline .timeline-topline{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1rem .15rem;color:#807c90;font-size:.72rem}
.ml-landlord-timeline .timeline-topline span{display:flex;align-items:center;gap:.4rem}
.ml-landlord-timeline .timeline-topline span>i{width:7px;height:7px;border-radius:50%;background:#77a792}
.ml-landlord-timeline .timeline-topline strong{color:#514a63;font-size:.69rem}
.ml-landlord-timeline .timeline-top-end{justify-content:flex-end}
.ml-landlord-timeline .timeline-viewport{overflow-x:auto;overscroll-behavior-x:contain;scrollbar-color:#c7bdd7 #f2eff5;scrollbar-width:thin}
.ml-landlord-timeline .timeline-viewport::-webkit-scrollbar{height:7px}
.ml-landlord-timeline .timeline-viewport::-webkit-scrollbar-thumb{border-radius:9px;background:#c7bdd7}
.ml-landlord-timeline .timeline-canvas{position:relative;box-sizing:border-box;width:100%;min-width:680px;padding:0 16px .9rem}
.ml-landlord-timeline .timeline-ruler{position:relative;height:47px;border-bottom:1px solid #e9e5ee}
.ml-landlord-timeline .ruler-months{position:relative;height:100%}
.ml-landlord-timeline .ruler-month{position:absolute;bottom:7px;transform:translateX(-50%);color:#8c8798;font-size:.63rem;white-space:nowrap}
.ml-landlord-timeline .ruler-month:before{position:absolute;left:50%;bottom:18px;height:7px;border-left:1px solid #d7d1e0;content:""}
.ml-landlord-timeline .ruler-month.is-start{transform:none}
.ml-landlord-timeline .ruler-month.is-start:before{left:0}
.ml-landlord-timeline .ruler-month.is-end{transform:translateX(-100%)}
.ml-landlord-timeline .ruler-month.is-end:before{left:100%}
.ml-landlord-timeline .phase-capsule{position:relative;display:flex;height:60px;margin:14px 0 0;overflow:hidden;border-radius:12px;background:#f1eef5}
.ml-landlord-timeline .capsule-phase{position:absolute;top:0;bottom:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:hidden;padding:0 7px;border-right:1px solid #ffffff70;color:#fff;text-align:center;background:linear-gradient(135deg,#a38ed2,#9179c6)}
.ml-landlord-timeline .capsule-phase span{overflow:hidden;color:#fff;font-size:clamp(.55rem,.78vw,.7rem);font-weight:800;letter-spacing:.025em;line-height:1.15;text-overflow:ellipsis;text-shadow:0 1px 2px #39285c70;white-space:nowrap}
.ml-landlord-timeline .capsule-phase[data-phase-key="procurement"]{background:linear-gradient(135deg,#b5a3de,#a38ed2)}
.ml-landlord-timeline .capsule-phase[data-phase-key="legal"]{background:linear-gradient(135deg,#a38ed2,#9179c6)}
.ml-landlord-timeline .capsule-phase[data-phase-key="design"]{background:linear-gradient(135deg,#9179c6,#7f64ba)}
.ml-landlord-timeline .capsule-phase[data-phase-key="fitout"]{background:linear-gradient(135deg,#7f64ba,#6d4fae)}
.ml-landlord-timeline .capsule-phase[data-phase-key="move-in"]{background:linear-gradient(135deg,#6d4fae,#5b3a9f)}
.ml-landlord-timeline .capsule-phase.parallel-phase{top:0;bottom:auto;height:50%;min-height:30px;border-bottom:1px solid #ffffff88}
.ml-landlord-timeline .capsule-phase.parallel-design{top:50%;border-bottom:0}
.ml-landlord-timeline .capsule-phase-key{position:relative;display:block;height:42px;margin-top:.65rem;padding:0}
.ml-landlord-timeline .capsule-phase-key-item{position:absolute;top:0;display:flex;width:max-content;max-width:180px;align-items:flex-start;justify-content:center;gap:.38rem;transform:translateX(-50%);text-align:center}
.ml-landlord-timeline .capsule-phase-key-item>i{display:none}
.ml-landlord-timeline .capsule-phase-key-item>span{display:grid;justify-items:center;gap:.08rem;min-width:0}
.ml-landlord-timeline .capsule-phase-key-item strong{color:#514a63;font-size:.64rem;font-weight:750;line-height:1.15;white-space:normal}
.ml-landlord-timeline .capsule-phase-key-item small{color:#898496;font-size:.61rem;white-space:nowrap}
.ml-landlord-timeline .timeline-markers{position:relative;height:76px;min-height:76px;overflow:visible}
.ml-landlord-timeline .timeline-date-marker{position:absolute;z-index:4;top:0;height:100%;border-left:2px solid #8d8797}
.ml-landlord-timeline .timeline-date-marker[hidden]{display:none!important}
.ml-landlord-timeline .timeline-date-marker>span{position:absolute;top:0;left:0;display:block;width:max-content;max-width:220px;padding:4px 6px;border:1px solid #e3dfe9;border-radius:4px;background:#fbfafc;color:#5e586a;font-size:.59rem;font-weight:800;line-height:1.25;white-space:nowrap;box-shadow:0 1px 3px #3023420a}
.ml-landlord-timeline .timeline-date-marker:before{position:absolute;top:-180px;left:-2px;height:180px;border-left:1px dashed #8d8797;content:"";opacity:.34;pointer-events:none}
.ml-landlord-timeline .timeline-date-marker>i{position:absolute;top:48px;left:-5px;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:#8d8797;box-shadow:0 0 0 1px #8d8797}
.ml-landlord-timeline .target-marker{border-color:#c28e34}
.ml-landlord-timeline .target-marker:before{border-left-color:#c28e34}
.ml-landlord-timeline .target-marker>span{border-color:#ead8b2;background:#fffaf0;color:#76551f}
.ml-landlord-timeline .target-marker>i{background:#c28e34;box-shadow:0 0 0 1px #c28e34}
.ml-landlord-timeline .recommended-marker{border-color:#568c76}
.ml-landlord-timeline .recommended-marker:before{border-left-color:#568c76}
.ml-landlord-timeline .recommended-marker>span{border-color:#c8dfd2;background:#f4faf6;color:#3e705b}
.ml-landlord-timeline .recommended-marker>i{background:#568c76;box-shadow:0 0 0 1px #568c76}
.ml-landlord-timeline .lease-marker{border-color:#7860ad}
.ml-landlord-timeline .lease-marker:before{border-left-color:#7860ad}
.ml-landlord-timeline .lease-marker>span{border-color:#7860ad;border-radius:20px;background:#7860ad;color:#fff;box-shadow:0 2px 6px #44345b20}
.ml-landlord-timeline .lease-marker>i{background:#7860ad;box-shadow:0 0 0 1px #7860ad}
.ml-landlord-timeline .today-marker{border-left-style:dashed}
.ml-landlord-timeline .timeline-legend{display:flex;flex-wrap:wrap;gap:.65rem 1.2rem;padding:0 0 .1rem;color:#858092;font-size:.62rem}
.ml-landlord-timeline .timeline-legend>span{display:flex;align-items:center;gap:.35rem}
.ml-landlord-timeline .legend-swatch{width:8px;height:8px;flex:none;border-radius:50%;background:#9a86c0}
.ml-landlord-timeline .target-swatch{background:#c28e34}
.ml-landlord-timeline .recommended-swatch{background:#568c76}
.ml-landlord-timeline .lease-swatch{background:#7860ad}
.ml-landlord-timeline .today-swatch{background:#8d8797}
.ml-landlord-timeline-disclaimer{margin:0;padding:10px 16px;border-top:1px solid #ece8f0;background:#faf9fb;color:#7b7586;font-size:9px;line-height:1.5}
@media(max-width:760px){
 .ml-landlord-occupation-demo{margin-top:25px}
 .ml-landlord-occupation{padding:15px 12px 13px}
 .ml-landlord-timeline .timeline-topline{align-items:flex-start;flex-direction:column;gap:.35rem}
 .ml-landlord-timeline .timeline-top-end{justify-content:flex-start}
 .ml-landlord-timeline .timeline-canvas{min-width:680px}
 .ml-landlord-timeline .capsule-phase-key-item strong{font-size:.68rem}
 .ml-landlord-occupation .ml-demo-heading--programme{align-items:flex-start}
}
@media(max-width:460px){
 .ml-landlord-occupation .ml-demo-heading--programme{flex-wrap:wrap}
 .ml-landlord-timeline-note{margin-top:2px}
 .ml-landlord-occupation .ml-programme-intro{font-size:9px}
 .ml-landlord-timeline .timeline-legend{gap:.5rem .9rem}
}