:root {
    --font-sans: 'Segoe UI', ui-sans-serif, system-ui, sans-serif;
    --mint: #5ca999;
    --mint-dark: #387f73;
    --mint-pale: #e8f3ef;
    --slate: #74858e;
    --ink: #243237;
    --soft-ink: #5f6d72;
    --sand: #f3efe8;
    --line: #dde5e2;
    --white: #fff;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: var(--ink);
    background: #fbfcfb;
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }

.site-header {
    height: 86px;
    padding: 0 clamp(24px, 5vw, 78px);
    display: flex;
    align-items: center;
    gap: 48px;
    background: rgba(255,255,255,.96);
    position: relative;
    z-index: 10;
    border-bottom: 1px solid rgba(116,133,142,.14);
}
.brand img, footer img { width: 155px; height: auto; display: block; }
.desktop-nav { display: flex; gap: 34px; margin: auto; font-size: 14px; font-weight: 600; }
.desktop-nav a:hover, .link-button:hover { color: var(--mint-dark); }
.header-actions { display: flex; align-items: center; gap: 22px; font-size: 14px; font-weight: 600; }
.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 0 25px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 14px;
    transition: transform .2s ease, background .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-small { min-height: 42px; padding: 0 19px; }
.button-primary { background: var(--mint); color: white; }
.button-primary:hover { background: var(--mint-dark); }

.hero {
    min-height: 690px;
    background: linear-gradient(120deg, #eef6f3 0%, #e8f2ee 62%, #dde9e6 100%);
    position: relative;
    display: grid;
    place-items: center;
    overflow: hidden;
    isolation: isolate;
}
.hero-content { width: min(1160px, calc(100% - 48px)); position: relative; z-index: 2; padding: 88px 0 65px; }
.eyebrow {
    text-transform: uppercase;
    letter-spacing: .18em;
    font-size: 11px;
    font-weight: 800;
    color: var(--mint-dark);
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 25px;
}
.eyebrow > span { width: 28px; height: 2px; background: var(--mint); }
.hero h1, .section h2, .professional-section h2 {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: 400;
    letter-spacing: -.04em;
    margin: 0;
}
.hero h1 { font-size: clamp(52px, 6vw, 85px); line-height: .98; max-width: 760px; }
.hero h1 em { color: var(--mint-dark); font-weight: 400; }
.hero-copy { max-width: 530px; color: var(--soft-ink); line-height: 1.7; font-size: 17px; margin: 27px 0 37px; }
.search-panel {
    max-width: 950px;
    display: grid;
    grid-template-columns: 1fr 1.1fr 1.7fr auto;
    align-items: stretch;
    padding: 9px;
    background: white;
    border-radius: 6px;
    box-shadow: 0 22px 55px rgba(48,79,72,.14);
}
.search-panel label { display: flex; flex-direction: column; padding: 10px 20px; border-right: 1px solid var(--line); }
.search-panel label > span { color: #8a9699; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.search-panel input, .search-panel select { border: 0; outline: 0; background: transparent; padding: 7px 0 0; color: var(--ink); font-weight: 600; min-width: 0; }
.search-panel input::placeholder { color: var(--ink); opacity: 1; }
.search-button {
    border: 0;
    background: var(--mint);
    color: white;
    padding: 0 25px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 9px;
    font-weight: 700;
    cursor: pointer;
}
.search-button svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 2; }
.trust-row { display: flex; gap: 45px; margin-top: 45px; }
.trust-row div { display: flex; flex-direction: column; }
.trust-row strong { font-family: Georgia, serif; font-size: 25px; font-weight: 400; }
.trust-row span { color: var(--soft-ink); font-size: 12px; margin-top: 3px; }
.hero-mark { position: absolute; width: 520px; height: 400px; right: -45px; top: 90px; opacity: .17; z-index: 0; transform: scale(1.25); }
.roof { width: 330px; height: 42px; position: absolute; transform-origin: left center; }
.roof-mint { background: var(--mint); transform: rotate(-45deg); left: 0; top: 270px; }
.roof-slate { background: var(--slate); transform: rotate(45deg); left: 230px; top: 37px; }
.chimney { width: 42px; height: 100px; background: var(--slate); position: absolute; left: 75px; top: 30px; }
.hero-orbit { position: absolute; border: 1px solid rgba(92,169,153,.25); border-radius: 50%; }
.hero-orbit-one { width: 750px; height: 750px; right: -300px; bottom: -420px; }
.hero-orbit-two { width: 530px; height: 530px; right: -190px; bottom: -315px; }

.section { max-width: 1200px; margin: 0 auto; padding: 105px 24px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 50px; }
.section h2, .professional-section h2 { font-size: clamp(38px, 4vw, 54px); line-height: 1.1; }
.text-link { color: var(--mint-dark); font-size: 13px; font-weight: 800; display: inline-flex; gap: 9px; align-items: center; }
.text-link span { transition: transform .2s; }
.text-link:hover span { transform: translateX(4px); }
.property-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.property-card { background: white; border: 1px solid #e8edeb; transition: transform .25s, box-shadow .25s; }
.property-card:hover { transform: translateY(-6px); box-shadow: 0 20px 45px rgba(47,72,67,.12); }
.property-visual { height: 250px; position: relative; overflow: hidden; }
.visual-mint { background: linear-gradient(145deg,#adcfc6,#5c998c); }
.visual-slate { background: linear-gradient(145deg,#b6c0c4,#6d808a); }
.visual-sand { background: linear-gradient(145deg,#e6d8c4,#bba184); }
.property-visual:before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(20,35,35,.25),transparent 55%); }
.property-badge { position: absolute; z-index: 2; top: 18px; left: 18px; background: white; padding: 7px 10px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.property-visual button { position: absolute; z-index: 2; right: 17px; top: 13px; width: 38px; height: 38px; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); font-size: 23px; color: var(--ink); }
.building { position: absolute; bottom: 0; left: 14%; width: 72%; height: 70%; background: rgba(240,245,242,.88); box-shadow: 12px -9px 0 rgba(56,67,68,.16); display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; padding: 28px; }
.building span { background: rgba(40,62,62,.42); border: 6px solid rgba(255,255,255,.45); }
.building-1 { clip-path: polygon(0 30%, 45% 0, 100% 25%, 100% 100%, 0 100%); }
.building-2 { width: 80%; left: 10%; height: 82%; }
.building-3 { clip-path: polygon(0 28%, 50% 0, 100% 28%, 100% 100%, 0 100%); }
.property-body { padding: 22px 22px 25px; }
.property-location { margin: 0 0 8px; text-transform: uppercase; color: var(--mint-dark); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.property-card h3 { font-family: Georgia,serif; font-size: 21px; font-weight: 400; margin: 0 0 11px; }
.property-meta { color: var(--soft-ink); font-size: 12px; margin: 0 0 18px; }
.property-price { border-top: 1px solid var(--line); padding-top: 17px; margin: 0; font-weight: 800; }

.professional-section { background: var(--slate); color: white; min-height: 570px; display: grid; grid-template-columns: 1fr 1fr; }
.professional-visual { position: relative; overflow: hidden; background: linear-gradient(140deg,#d9e7e2,#8fb8ac); display: grid; place-items: center; }
.professional-visual:before, .professional-visual:after { content:""; position:absolute; width:430px; height:430px; border:1px solid rgba(255,255,255,.34); border-radius:50%; }
.professional-visual:after { width:300px; height:300px; }
.profile-card { width: min(420px, 75%); padding: 22px; background: rgba(255,255,255,.96); color: var(--ink); display: flex; align-items:center; gap:16px; box-shadow: 0 30px 70px rgba(35,55,55,.22); z-index:1; }
.avatar { width: 58px; height: 58px; display:grid; place-items:center; color:white; background:var(--mint); border-radius:50%; font-family:Georgia,serif; }
.profile-card div:nth-child(2) { display:flex; flex-direction:column; flex:1; }
.profile-card span { color:var(--soft-ink); font-size:11px; margin-top:5px; }
.profile-card b { width:24px; height:24px; display:grid; place-items:center; background:var(--mint); color:white; border-radius:50%; }
.mini-stat { position:absolute; z-index:2; background:white; color:var(--ink); padding:16px 23px; display:flex; flex-direction:column; box-shadow:0 12px 30px rgba(35,55,55,.12); }
.mini-stat strong { font-family:Georgia,serif; font-size:26px; font-weight:400; }
.mini-stat span { color:var(--soft-ink); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.stat-one { left:13%; bottom:16%; }
.stat-two { right:10%; top:18%; }
.professional-copy { padding: 85px clamp(35px, 7vw, 105px); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.eyebrow.light { color:#d9efea; }
.professional-copy > p:not(.eyebrow) { color:#e2e9e9; line-height:1.7; max-width:540px; }
.professional-copy ul { list-style:none; padding:0; margin:13px 0 30px; display:grid; gap:12px; font-size:13px; }
.professional-copy li span { display:inline-grid; place-items:center; width:21px; height:21px; border-radius:50%; background:var(--mint); margin-right:8px; font-size:11px; }
.button-light { background:white; color:var(--ink); }

.section-heading.centered { text-align:center; justify-content:center; }
.section-heading.centered .eyebrow { justify-content:center; }
.plans-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; align-items:stretch; }
.plan-card { position:relative; background:white; border:1px solid var(--line); padding:31px 25px; min-height:245px; display:flex; flex-direction:column; }
.plan-card.featured { border:2px solid var(--mint); transform:translateY(-7px); }
.popular { position:absolute; top:0; right:0; background:var(--mint); color:white; padding:6px 9px; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.plan-card h3 { margin:0 0 25px; font-size:15px; }
.plan-card > strong { font-family:Georgia,serif; font-size:28px; font-weight:400; }
.plan-card > p { color:var(--soft-ink); font-size:12px; line-height:1.6; flex:1; }
.custom-plan { text-align:center; margin-top:34px; color:var(--soft-ink); font-size:13px; }
.custom-plan a { color:var(--mint-dark); font-weight:700; }

footer { padding:55px clamp(24px,5vw,78px) 28px; background:#eef3f1; display:grid; grid-template-columns:1fr auto; align-items:center; gap:18px; }
footer p { margin:0; color:var(--soft-ink); font-size:13px; }
footer div { grid-column:2; grid-row:1 / span 2; display:flex; gap:25px; font-size:12px; font-weight:600; }
footer small { grid-column:1 / -1; border-top:1px solid var(--line); padding-top:20px; color:#899496; font-size:10px; }

@media (max-width: 900px) {
    .desktop-nav { display:none; }
    .site-header { justify-content:space-between; gap:18px; }
    .link-button { display:none; }
    .hero { min-height:auto; }
    .hero-mark { opacity:.09; right:-220px; }
    .search-panel { grid-template-columns:1fr 1fr; }
    .search-panel label { border-bottom:1px solid var(--line); }
    .search-button { min-height:60px; justify-content:center; }
    .property-grid { grid-template-columns:1fr 1fr; }
    .property-card:last-child { display:none; }
    .professional-section { grid-template-columns:1fr; }
    .professional-visual { min-height:440px; }
    .plans-grid { grid-template-columns:1fr 1fr; }
    .plan-card.featured { transform:none; }
}

@media (max-width: 600px) {
    .site-header { height:72px; padding:0 18px; }
    .brand img { width:120px; }
    .button-small { min-height:38px; padding:0 13px; font-size:12px; }
    .hero-content { width:calc(100% - 36px); padding:70px 0 55px; }
    .hero h1 { font-size:49px; }
    .search-panel { grid-template-columns:1fr; }
    .search-panel label { border-right:0; }
    .trust-row { gap:22px; justify-content:space-between; }
    .trust-row strong { font-size:20px; }
    .section { padding:75px 18px; }
    .section-heading { align-items:flex-start; gap:25px; flex-direction:column; }
    .property-grid, .plans-grid { grid-template-columns:1fr; }
    .property-card:last-child { display:block; }
    .professional-copy { padding:70px 25px; }
    .profile-card { width:84%; }
    .mini-stat { padding:12px 16px; }
    footer { grid-template-columns:1fr; }
    footer div { grid-column:1; grid-row:auto; flex-wrap:wrap; }
}