/* Combined by _source/bundle_assets.py from: assets/fonts/fonts.css, assets/legal.css, assets/site-type.css */
/* The site's text fonts, served from the site itself (3.2.18) instead of Google Fonts: faster (no extra connection to
   another server), private (no request to Google on every page) and still working if Google is blocked or slow.
   Latin characters only (English and Kiswahili). Licences (SIL Open Font License) are in assets/fonts/licenses/.
   Antonio, the headline font, is declared in site-type.css. */
@font-face{font-family:"Inter";font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/inter-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-display:swap;font-weight:300 700;src:url(fonts/cormorant-garamond-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-display:swap;font-weight:300 700;src:url(fonts/cormorant-garamond-latin-wght-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-display:swap;font-weight:300;src:url(fonts/barlow-condensed-latin-300-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-display:swap;font-weight:500;src:url(fonts/barlow-condensed-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-display:swap;font-weight:600;src:url(fonts/barlow-condensed-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* The legal pages (3.2.27): privacy.html, terms.html, cookies.html (_source/build_legal.py). A plain, readable document. */
.lg{max-width:1100px;margin:0 auto;padding:clamp(28px,5vw,64px) clamp(16px,4vw,40px) 72px;display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:start;font-family:Inter,Inter Fallback,Arial,sans-serif;color:#1d1a18}
.lg-nav{position:sticky;top:96px;display:flex;flex-direction:column;gap:4px;padding-top:58px}
.lg-nav a{padding:9px 12px;border-radius:10px;color:#3a332f;text-decoration:none;font-size:14px;font-weight:500}
.lg-nav a:hover{background:#f4efe7}
.lg-nav a[aria-current="page"]{background:#1d1a18;color:#fff}
.lg-nav a:focus-visible,.lg-doc a:focus-visible{outline:2px solid #8E0D20;outline-offset:2px}
.lg-doc{max-width:720px}
.lg-k{margin:0 0 10px;font:600 11px/1.3 Inter,Inter Fallback,Arial,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#8E0D20}
.lg-doc h1{margin:0;font:500 clamp(40px,6vw,64px)/1 "Cormorant Garamond",Cormorant Garamond Fallback,Georgia,serif;color:#1d1a18;text-transform:none;letter-spacing:0}
.lg-date{margin:12px 0 18px;font-size:13px;color:#6a625b}
.lg-draft{margin:0 0 28px;padding:12px 16px;border-left:3px solid #b88a2e;background:#fbf6ea;font-size:13.5px;line-height:1.55;color:#5a4a2a}
.lg-doc h2{margin:34px 0 10px;font:500 28px/1.15 "Cormorant Garamond",Cormorant Garamond Fallback,Georgia,serif;color:#1d1a18;text-transform:none;letter-spacing:0;scroll-margin-top:90px}
.lg-doc p,.lg-doc li{font-size:15.5px;line-height:1.75;color:#3a332f}
.lg-doc p{margin:0 0 14px}
.lg-doc ul{margin:0 0 16px;padding-left:20px}
.lg-doc li{margin:0 0 8px}
.lg-doc a{color:#8E0D20}
.lg-todo{padding:1px 6px;border-radius:5px;background:#fbecc4;color:#5a4a2a;font-size:.92em}
@media(max-width:820px){.lg{grid-template-columns:1fr}.lg-nav{position:static;flex-direction:row;flex-wrap:wrap;padding-top:0}}
@media print{.lg{display:block}.lg-nav,.lg-draft{display:none}.lg-todo{background:none;border:1px dashed #999}}
/* the row of legal links in every footer (finalize_site.py) */
.hv-legal{display:flex;flex-wrap:wrap;gap:4px 16px}
.hv-legal a{color:inherit;font-size:12.5px;text-decoration:underline;text-underline-offset:3px}
.hv-legal a:hover{text-decoration-thickness:2px}

/* ==========================================================================
   Site-wide headings: the same tall, condensed, uppercase lettering and
   crimson > burgundy > oxblood gradient used on the home page.
   (Loaded by every page except the home page, which carries its own copy.)
   ========================================================================== */
@font-face{font-family:"Antonio";src:url("fonts/antonio.woff2") format("woff2");font-weight:100 700;font-style:normal;font-display:swap}
:root{
  --hd-font:"Antonio",Antonio Fallback,"Oswald","Barlow Condensed",Barlow Condensed Fallback,"Arial Narrow",Impact,sans-serif;
  --hd-grad:linear-gradient(180deg,#C31B37 0%,#8E0D20 52%,#4A0005 100%);
}

/* page titles */
h1,h1.h-display{font-family:var(--hd-font);font-weight:500;letter-spacing:.04em;line-height:.92;text-transform:uppercase;text-shadow:none;
  background:var(--hd-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
h1{font-size:clamp(52px,6.2vw,100px)}
/* the "small line over a large line" composition: identical on every page */
h1.h-display:not(.area-title){font-size:clamp(28px,2.9vw,44px)!important;line-height:1!important}
h1.h-display:not(.area-title) strong{display:block;font-size:clamp(52px,6.1vw,96px)!important;font-weight:500;line-height:.92;margin-top:.06em;color:inherit}
h1.area-title{font-size:clamp(60px,8vw,120px)}

/* section headings that sit on white */
.feat-text h2,.t-count h2,h2.section-title,.marketing-intro h2,.t-intro h2,.panel-head h2,.panel-head h3,.intro h2{
  font-family:var(--hd-font);font-weight:500;letter-spacing:.04em;line-height:.95;text-transform:uppercase;text-shadow:none;
  background:var(--hd-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.feat-text h2,.t-count h2,h2.section-title,.marketing-intro h2,.t-intro h2{font-size:clamp(40px,4.6vw,70px)}
.panel-head h2,.panel-head h3{font-size:clamp(38px,4vw,60px);margin-bottom:14px}
.feat-text h2 strong,.band h2 strong,h2 strong{font-weight:500;color:inherit}

/* red bands: same lettering, in white (a gradient would not read on the red) */
.band h2{font-family:var(--hd-font);font-weight:500;letter-spacing:.04em;line-height:.92;text-transform:uppercase;font-size:clamp(44px,5vw,76px)}

/* big numerals */
.stat b,.t-count b,.fact b,.stats b{font-family:var(--hd-font);font-weight:500;letter-spacing:.03em}

/* ----- pages built with their own heading rules: same lettering, applied with the page's own selectors ----- */
html[data-page="contact-us"] .left h1,
html[data-page="gallery"] .hero h1,
html[data-page="office"] :is(.aboutVisual h1,.aboutVisual h2,.listingHead h2,.teamTitle,.galleryTitle),
html[data-page="offices"] .end h2,
html[data-page="agent"] :is(.copy h2,.portfolioHead h2),
html[data-page="listing"] :is(.hero h1,.intro h2,.galleryHead h2),
html[data-page="list-with-us"] :is(.hero h1,.contact h2){
  font-family:var(--hd-font)!important;font-weight:500!important;letter-spacing:.04em!important;text-transform:uppercase!important;line-height:.94!important;text-shadow:none!important;font-style:normal!important;
  background:var(--hd-grad)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important}
/* the same lettering on photographs and dark panels, with the lighter reds so it stays readable */
html[data-page="offices"] .officeCopy h1,
html[data-page="office"] section.contact h2,
html[data-page="listing"] section.contact h2{
  font-family:var(--hd-font)!important;font-weight:500!important;letter-spacing:.04em!important;text-transform:uppercase!important;line-height:.94!important;text-shadow:none!important;font-style:normal!important;
  background:linear-gradient(180deg,#FF6F86 0%,#EC3A54 50%,#C31B37 100%)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important}
html[data-page="agent"] .copy h2{font-size:clamp(34px,3.4vw,50px)}

/* ----- fit: the condensed lettering must always stay inside its column ----- */
.t-hero h1,.t-count h1{font-size:clamp(46px,4.9vw,80px)!important;overflow-wrap:normal;word-break:normal}
h1{max-width:100%}
@media(max-width:600px){
  .t-hero h1,.t-count h1{font-size:clamp(30px,8.6vw,40px)!important;letter-spacing:.03em}
  h1.h-display:not(.area-title){font-size:clamp(22px,6.4vw,30px)!important}
  h1.h-display:not(.area-title) strong{font-size:clamp(40px,12.4vw,58px)!important}
}

/* ----- the shared top menu now has six links: on phones keep Rentals, Invest and Contact ----- */
@media(max-width:700px){
  .top nav a{display:none!important}
  .top nav a:nth-last-child(-n+3){display:inline-block!important}
  .top nav{gap:14px}
  .top .brand{font-size:11px;letter-spacing:.16em}
}

/* stat labels sit on white on these pages (the pale pink is only for the red band) */
.t-intro .stat span,.facts .stat span,.glance .stat span{color:#6a625b}

@media(max-width:360px){.top{padding:0 3%}.top .brand{font-size:10px;letter-spacing:.08em}.top nav{gap:9px}.top nav a{letter-spacing:.06em;font-size:9px}}
/* anchors on sub-pages land below the sticky header */
html:not([data-page]){scroll-padding-top:104px}

@media(max-width:480px){.t-intro{grid-template-columns:minmax(0,1fr)}.t-intro>*{min-width:0}.stat b{overflow-wrap:anywhere}}

/* ----- 3.2.11 readability floor: small type stays small, but never below about 9–10 px ----- */
@media screen{
html[data-page="list-with-us"] .field label{font-size:10px!important}
html[data-page="list-with-us"] .kicker,html[data-page="list-with-us"] .footer span,html[data-page="list-with-us"] .footer a{font-size:9.5px!important}
html[data-page="office"] .photo .badge,html[data-page="office"] .card .loc{font-size:9.5px!important}
html[data-page="office"] .meta span,html[data-page="office"] .meta b{font-size:10px!important}
html[data-page="office"] .teamCardCopy span{font-size:9px!important;letter-spacing:.12em!important}
html[data-page="office"] .sectionViewLink{font-size:9.5px!important;z-index:5!important}
html[data-page="listing"] .ey,html[data-page="listing"] .galleryHead span,html[data-page="listing"] .contact a,html[data-page="listing"] .note{font-size:9.5px!important}
}

/* ----- 3.2.11 no jumping while a page draws itself: room is kept for the parts its script fills in ----- */
#ppCards:is(:empty,:has(> noscript:only-child)){min-height:680px}#ppCmp:empty{min-height:665px}
@media(max-width:1100px){#ppCards:is(:empty,:has(> noscript:only-child)){min-height:750px}}
@media(max-width:820px){#ppCards:is(:empty,:has(> noscript:only-child)){min-height:1600px}#ppCmp:empty{min-height:715px}}
@media(max-width:480px){#ppCards:is(:empty,:has(> noscript:only-child)){min-height:1790px}#ppCmp:empty{min-height:725px}}
html[data-page="office"] #aboutText:empty{min-height:380px}
@media(max-width:1100px){html[data-page="office"] #aboutText:empty{min-height:500px}}
@media(max-width:820px){html[data-page="office"] #aboutText:empty{min-height:300px}}
@media(max-width:480px){html[data-page="office"] #aboutText:empty{min-height:600px}}
#prRoot,#vwRoot{min-height:70vh}

/* ----- 3.2.11 the shared footer, for pages that do not carry the marketing styles ----- */
.hv-foot{padding:28px 4%;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font:400 11px/1.6 Inter,"Inter Fallback",Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#77706a;background:#fff}
.hv-foot .credits{flex:1;text-align:center;font-size:10px;letter-spacing:.08em;text-transform:none;color:#6a625b}
.hv-foot a{color:inherit;text-decoration:none}.hv-foot a:hover{color:#8E0D20}
@media(max-width:700px){.hv-foot{flex-direction:column;align-items:flex-start;text-align:left}.hv-foot .credits{text-align:left}}
/* the floating WhatsApp button and the social button never cover the footer's words */
footer.footer{padding-right:max(4%,250px)!important}
@media(max-width:700px){footer.footer{padding-right:4%!important;padding-bottom:96px!important}}
@media print{footer.hv-foot{display:none!important}}

