/* Realty in Costa Rica — consolidated site styles, 18 October 2026.
   Source precedence is represented by order, not artificial IDs.
   :where() keeps selectors easy to override. Responsive states stay explicit. */
:where(html body) { --button-top: #366c59; --button-bottom: #123d31; --button-base: #08291f; }
:where(html body)::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(rgba(241,245,235,.64),rgba(232,240,228,.60)),url("/assets/cloud-forest-20261018.webp") center center/cover no-repeat; }
@media (max-width:800px) {
:where(html body)::before { background-position: center,52% center; }
}
:where(:root) { --forest-surface: radial-gradient(ellipse at 8% 0%,rgba(91,151,126,.18),transparent 56%),linear-gradient(145deg,#153e35,#0b2b26 78%); --forest-edge: rgba(224,199,143,.2); --forest-shadow: 0 12px 30px rgba(10,36,28,.13),inset 0 1px 0 rgba(255,255,255,.09); }
:where(html body :is(a.facebook-link,.property-facebook-visit)) { --button-top: #2c75c8; --button-bottom: #19549b; --button-base: #123c75; }
:where(html body #properties button[data-property-filter][aria-pressed="true"]) { --button-top: #e9d3a0; --button-bottom: #cab078; --button-base: #8d794e; }
:where(html body :is(.hero a[data-t="zoneVolcano"],.property-actions>a.btn:not(.wa),.catalog-menu>a,#sell-property .owner-whatsapp,#contact a#contactWa)) { --button-top: #ce423e; --button-bottom: #a51f27; --button-base: #711c23; }
:where(*) { box-sizing: border-box; }
:where(.share-dialog)::backdrop { background: rgba(3,26,24,.55); }
:where(.photo-viewer)::backdrop { background: rgba(0,0,0,.88); }
:where(html) { scrollbar-gutter: stable; scroll-behavior: smooth; }
:where(body) { margin: 0; color: var(--ink); font: 16px/1.65 Arial,sans-serif; }
:where(a) { color: inherit; }
:where(button) { font: inherit; }
:where(select) { font: inherit; }
:where(h2) { font-family: Georgia,serif; font-weight: normal; line-height: 1.08; }
:where(h3) { font-family: Georgia,serif; font-weight: normal; line-height: 1.08; }
:where(h1) { margin: 24px 0; }
:where(h2) { font-size: clamp(34px,4vw,48px); margin: 12px 0 25px; }
:where(h3) { font-size: 28px; margin: 20px 0 8px; }
:where(section) { padding: 80px 6%; scroll-margin-top: 20px; }
:where(footer) { padding: 30px 6%; display: flex; justify-content: space-between; gap: 20px; color: #d6e2dc; font-size: 14px; }
@media (max-width:800px) {
:where(section) { padding: 55px 5%; }
}
@media (max-width:800px) {
:where(footer) { flex-direction: column; }
}
@media (prefers-reduced-motion:reduce) {
:where(html) { scroll-behavior: auto; }
}
@media (max-width:1100px) {
:where(nav) { flex-wrap: wrap; }
}
@media (max-width:800px) {
:where(nav) { flex-shrink: 0; }
}
@media (max-width:600px) {
:where(body) { padding-bottom: 74px; }
}
:where(header nav) { justify-content: flex-end; }
@media (max-width:800px) {
:where(header nav) { flex-wrap: wrap; justify-content: stretch; grid-template-columns: repeat(5,minmax(0,1fr)); }
}
@media (max-width:800px) {
:where(header nav>*) { max-width: 100%; box-sizing: border-box; }
}
@media (max-width:800px) {
:where(header nav) { box-sizing: border-box; }
}
@media (max-width:800px) {
:where(header nav a) { overflow-wrap: normal; }
}
:where(.property-load-error) { margin: 0; padding: 12px 5%; background: #0d302b; color: white; }
:where(:root) { --ink: #0d302b; --gold: #debc76; --paper: #f7f8f5; }
:where(.brand) { font-family: Georgia,serif; font-size: 24px; text-decoration: none; line-height: 1.3; }
:where(.hero) { background: #173f39; color: white; }
:where(.eyebrow) { font-size: 14px; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); }
:where(.btn) { display: inline-block; text-decoration: none; text-align: center; }
:where(.strip) { font-size: 15px; }
:where(.intro) { display: flex; justify-content: space-between; gap: 30px; align-items: end; margin-bottom: 36px; }
:where(.grid) { grid-template-columns: repeat(3,1fr); }
:where(.card) { overflow: hidden; }
:where(.place) { display: grid; grid-template-columns: 1fr 1fr; gap: 65px; align-items: center; }
:where(.facts) { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; margin-top: 32px; }
:where(.contact) { background: #e8efea; display: grid; grid-template-columns: 1fr 1fr; gap: 65px; }
:where(.contact-box) { padding: 32px; }
:where(.contact-links) { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 22px; }
:where(.note) { font-size: 14px; color: #5b7269; }
@media (max-width:800px) {
:where(.brand) { font-size: 20px; }
}
@media (max-width:800px) {
:where(.intro) { display: block; }
}
@media (max-width:800px) {
:where(.grid) { grid-template-columns: 1fr; }
}
@media (max-width:800px) {
:where(.place) { grid-template-columns: 1fr; }
}
@media (max-width:800px) {
:where(.contact) { grid-template-columns: 1fr; }
}
@media (max-width:800px) {
:where(.place) { gap: 30px; }
}
@media (max-width:800px) {
:where(.contact) { gap: 25px; }
}
:where(.house-layout) { grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); gap: 40px; align-items: start; }
@media (max-width:800px) {
:where(.house-layout) { grid-template-columns: 1fr; gap: 25px; }
}
:where(.brand-logo) { align-items: center; }
:where(.about) { grid-template-columns: 1.3fr 1fr; gap: 65px; align-items: center; }
:where(.about-person) { border: 1px solid #d8e0db; border-radius: 5px; }
@media (max-width:800px) {
:where(.about) { grid-template-columns: 1fr; gap: 25px; }
}
:where(.zone-buttons) { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 24px; }
@media (max-width:800px) {
:where(.zone-buttons) { flex-direction: column; }
}
:where(.catalog-menu) { background: linear-gradient(90deg,rgba(3,26,24,.78),rgba(3,26,24,.42)),url("assets/volcano.jpg") center 38%/cover; color: white; padding: 36px 6%; }
:where(.property-share) { cursor: pointer; }
:where(.share-dialog) { width: min(420px,90vw); padding: 28px; border: 1px solid #cbd8ce; border-radius: 8px; color: var(--ink); background: var(--paper); }
:where(.owner-invitation) { padding: 64px 6%; background: #f5f3eb; }
:where(.owner-invitation-box) { max-width: 1100px; margin: auto; padding: 40px; }
:where(.owner-actions) { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 26px; }
@media (max-width:800px) {
:where(.owner-invitation) { padding: 44px 5%; }
}
@media (max-width:800px) {
:where(.owner-invitation-box) { padding: 26px 22px; }
}
@media (max-width:800px) {
:where(.owner-actions) { flex-direction: column; }
}
:where(.hero) { overflow: hidden; }
:where(.video-about-layout) { display: grid; padding: 55px 6%; background: #f7f8f5; }
:where(.dual-price) { flex-direction: column; gap: 3px; line-height: 1.35; }
:where(.exchange-rate-note) { font: 12px/1.6 Arial,sans-serif; color: #536c61; max-width: 900px; }
@media (max-width:600px) {
:where(.dual-price) { max-width: 100%; overflow-wrap: anywhere; }
}
:where(.property-type-filter) { margin: 0 0 26px; padding: 18px 20px; }
:where(.property-filter-label) { display: block; font-weight: 700; margin-bottom: 10px; }
:where(.property-filter-buttons) { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width:600px) {
:where(.property-type-filter) { padding: 15px; }
}
@media (max-width:600px) {
:where(.property-filter-buttons) { gap: 6px; }
}
:where(.nature-section) { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(30px,5vw,70px); align-items: center; }
:where(.nature-photo-frame) { width: 100%; aspect-ratio: 1; padding: clamp(36px,5vw,64px); display: grid; place-items: center; background: transparent; border-radius: 0; }
:where(.nature-copy) { max-width: 550px; }
@media (max-width:800px) {
:where(.nature-section) { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width:800px) {
:where(.nature-copy) { max-width: 100%; }
}
:where(.family-landscape) { margin: 22px 0 28px; }
:where(.video-about-layout) { grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; }
@media (max-width:800px) {
:where(.video-about-layout) { grid-template-columns: 1fr; padding: 36px 0; }
}
:where(.video-about-layout) { margin-top: 6px; }
@media (max-width:800px) {
:where(.video-about-layout) { margin-top: 5px; }
}
:where(.video-about-layout) { position: relative; }
:where(.persistent-wa) { align-items: center; justify-content: center; min-height: 48px; }
@media (max-width:600px) {
:where(.persistent-wa) { min-height: 48px; }
}
:where(.property-number) { font: 700 13px/1.4 Arial,sans-serif; color: #38604d; margin: 0 0 10px; }
:where(.facebook-mark) { font: bold 22px/18px Arial,sans-serif; }
:where(.desktop-paragliding-photo) { display: none; }
:where(.desktop-catalog-range-copy) { display: none; }
:where(.property-load-error button) { margin-left: 12px; padding: 6px 12px; cursor: pointer; }
:where(a.btn) { cursor: pointer; }
:where(.hero):after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(3,26,24,.88),rgba(3,26,24,.33) 65%,rgba(3,26,24,.1)); }
:where(.hero p) { max-width: 510px; font-size: 19px; }
:where(.strip span) { display: block; }
:where(.intro p) { max-width: 410px; }
:where(.card p) { color: #5b7269; }
:where(.place p) { color: #d6e2dc; }
:where(.place img) { width: 100%; height: 450px; object-fit: cover; }
:where(.facts b) { display: block; color: var(--gold); font-weight: normal; font-size: 20px; }
:where(.facts span) { font-size: 14px; }
:where(.contact p) { max-width: 480px; }
:where(.contact-box label) { display: block; margin-bottom: 8px; }
:where(.contact-box select) { width: 100%; margin-bottom: 18px; }
@media (max-width:800px) {
:where(.hero p) { font-size: 17px; }
}
@media (max-width:800px) {
:where(.place img) { height: 300px; }
}
:where(.about p) { max-width: 650px; }
:where(.about-person h3) { margin-top: 0; }
:where(.other-properties p) { max-width: 650px; }
:where(.attractions p) { font-size: 18px; line-height: 1.8; }
:where(.attractions h2) { margin: 12px 0 18px; }
:where(.share-dialog h3) { margin-top: 0; }
:where(.share-dialog button) { display: block; width: 100%; margin-top: 12px; padding: 12px; cursor: pointer; }
:where(.owner-invitation-box h2) { font-size: clamp(30px,4vw,44px); margin: 14px 0 20px; }
:where(.owner-invitation-box p) { max-width: 900px; color: #e4eee7; font-size: 18px; }
@media (max-width:800px) {
:where(.owner-invitation-box p) { font-size: 16px; }
}
:where(header .site-menu-row) { justify-content: flex-end; }
:where(.hero):before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg,#092b28e8,#092b2845); z-index: 1; }
:where(header .header-control) { cursor: pointer; }
:where(.property-filter-buttons button) { cursor: pointer; }
@media (max-width:600px) {
:where(.property-filter-buttons button) { flex: 1 1 auto; }
}
:where(.nature-section figure) { margin: 0; min-width: 0; max-width: 520px; width: 100%; justify-self: center; }
:where(.nature-section img) { display: block; width: 100%; height: auto; border: 0; }
:where(.nature-photo-frame img) { aspect-ratio: 1; object-fit: contain; }
:where(.nature-section figcaption) { font-size: 13px; line-height: 1.5; padding-top: 12px; }
:where(.nature-copy h2) { line-height: 1.15; }
:where(.nature-copy p) { font-size: 18px; line-height: 1.85; margin-bottom: 0; }
:where(.family-landscape img) { display: block; width: 100%; height: auto; object-fit: contain; max-height: none; background: transparent; }
:where(.video-about-layout)::before { content: ""; position: absolute; left: 0; right: 0; top: -6px; height: 6px; background: linear-gradient(90deg,#d0af73 0%,#e5ca91 28%,#f3e3bd 50%,#e5ca91 72%,#d0af73 100%); pointer-events: none; }
:where(.video-about-layout)::after { content: ""; position: absolute; left: calc(50% - 3px); top: 0; bottom: 55px; width: 6px; background: linear-gradient(180deg,#d0af73 0%,#e5ca91 30%,#f3e3bd 50%,#e5ca91 70%,#d0af73 100%); pointer-events: none; }
@media (max-width:800px) {
:where(.video-about-layout)::before { top: -5px; height: 5px; }
}
@media (max-width:800px) {
:where(.video-about-layout)::after { display: none; }
}
:where(button[aria-pressed="true"]) { outline: 2px solid #debc76; outline-offset: 2px; }
:where(header .brand-logo img) { mix-blend-mode: normal; }
:where(header a:focus-visible) { outline: 3px solid #b88a3e; outline-offset: 3px; }
@media (min-width:801px) {
:where(html body .catalog-menu) { display: flex; }
}
:where(.contact-box .btn) { width: 100%; }
:where(.catalog-menu .btn) { margin: 0; }
@media (max-width:800px) {
:where(.zone-buttons .btn) { width: 100%; margin-top: 0; }
}
:where(.share-dialog .btn) { display: block; width: 100%; margin-top: 12px; }
@media (max-width:800px) {
:where(.owner-actions .btn) { width: 100%; }
}
:where(.video-about-layout .video-section) { text-align: left; min-width: 0; }
:where(.video-about-layout .about) { display: block; min-width: 0; }
:where(.video-about-layout .about-person) { margin-top: 24px; padding: 22px; }
:where(.video-about-layout .note) { margin-top: 12px; }
:where(.dual-price .currency-primary) { font-size: inherit; font-weight: 700; }
:where(.dual-price .currency-secondary) { font-size: 14px; font-weight: 400; color: #536c61; }
:where(.nature-copy .eyebrow) { font-size: 13px; }
:where(.video-about-layout .video-section) { padding: 28px; }
:where(.hero .zone-buttons) { padding-bottom: 6px; }
:where(body[data-view="home"] .catalog-menu) { display: none; }
:where(body[data-view="volcano"] .video-section) { display: none; }
:where(body[data-view="other"] .video-section) { display: none; }
:where(.video-about-layout .video-section h2) { font-size: 36px; margin: 12px 0 22px; }
:where(.video-about-layout .video-section video) { display: block; margin: 0; }
:where(.video-about-layout .about h2) { font-size: 36px; margin: 12px 0 20px; }
:where(.video-about-layout .about h3) { font-size: 25px; }
:where(body[data-view="volcano"] .video-about-layout) { display: none; }
:where(body[data-view="other"] .video-about-layout) { display: none; }
:where(.video-about-layout .video-section video) { width: 100%; max-width: none; max-height: none; height: auto; aspect-ratio: 512/910; object-fit: contain; background: transparent; border-radius: 6px; }
:where(.estate-media details[open] summary) { margin-bottom: 14px; }
:where(body .catalog-menu>a[data-t="backHome"]) { align-items: center; justify-content: center; }
:where(html[lang="en"] .dual-price .currency-usd) { order: -1; font-size: inherit; font-weight: 700; color: inherit; }
:where(html[lang="en"] .dual-price .currency-crc) { font-size: 14px; font-weight: 400; color: #536c61; }
@media (max-width:600px) {
:where(html[lang="en"] .dual-price .currency-crc) { font-size: 13px; }
}
:where(body .catalog-menu .zone-buttons>a.btn) { align-items: center; justify-content: center; }
:where(html body[data-view="home"] .video-about-layout .video-section) { position: relative; }
:where(#siteMenuPanel) { z-index: 30; }
:where(#attractions) { min-height: 350px; border-top: 1px solid #debc7666; }
@media (max-width:800px) {
:where(#attractions) { min-height: 360px; }
}
:where(#properties) { padding-top: 42px; padding-bottom: 45px; }
@media (max-width:600px) {
:where(#properties) { padding: 30px 5%; }
}
:where(#siteMenuPanel) { position: absolute; width: min(370px,88vw); padding: 8px; }
:where(#propertyFilterCount) { color: #5b7269; }
:where(#area) { margin-top: 6px; }
:where(#attractions) { margin-top: 6px; }
:where(#nature) { margin-top: 6px; }
@media (max-width:800px) {
:where(#area) { margin-top: 5px; }
}
@media (max-width:800px) {
:where(#attractions) { margin-top: 5px; }
}
@media (max-width:800px) {
:where(#nature) { margin-top: 5px; }
}
:where(#area) { position: relative; }
:where(#attractions) { position: relative; }
:where(#nature) { position: relative; }
:where(#attractions p) { text-shadow: 0 1px 3px #0004; }
:where(#properties p) { font-size: 14px; line-height: 1.55; margin: 8px 0; }
:where(header #siteMenuToggle) { cursor: pointer; }
:where(#area)::before { content: ""; position: absolute; left: 0; right: 0; top: -6px; height: 6px; background: linear-gradient(90deg,#d0af73 0%,#e5ca91 28%,#f3e3bd 50%,#e5ca91 72%,#d0af73 100%); pointer-events: none; }
:where(#attractions)::before { content: ""; position: absolute; left: 0; right: 0; top: -6px; height: 6px; background: linear-gradient(90deg,#d0af73 0%,#e5ca91 28%,#f3e3bd 50%,#e5ca91 72%,#d0af73 100%); pointer-events: none; }
:where(#nature)::before { content: ""; position: absolute; left: 0; right: 0; top: -6px; height: 6px; background: linear-gradient(90deg,#d0af73 0%,#e5ca91 28%,#f3e3bd 50%,#e5ca91 72%,#d0af73 100%); pointer-events: none; }
@media (max-width:800px) {
:where(#area)::before { top: -5px; height: 5px; }
}
@media (max-width:800px) {
:where(#attractions)::before { top: -5px; height: 5px; }
}
@media (max-width:800px) {
:where(#nature)::before { top: -5px; height: 5px; }
}
:where(body #property-range-summary b) { display: block; }
:where(header #siteMenuPanel nav a) { text-decoration: none; }
:where(#siteMenuPanel .site-menu-icon) { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; border: 1px solid #debc7644; border-radius: 8px; background: #debc7610; font-size: 21px; }
:where(#siteMenuPanel .site-menu-arrow) { margin-left: auto; font-size: 21px; }
:where(#properties>.grid) { display: flex; flex-direction: column; }
:where(#properties .card) { border-radius: 9px; width: 100%; scroll-margin-top: 130px; }
:where(#properties .property-expand) { display: grid; grid-template-columns: 340px minmax(0,1fr); gap: 0; margin: 0; align-items: start; }
:where(#properties .property-row-summary) { min-width: 0; margin: 0; }
:where(#properties .property-photo-facts) { border-top: 2px solid #debc76; }
:where(#properties .property-expanded-content) { min-width: 0; }
:where(#properties .house-description) { padding: 0; }
:where(#properties .meta) { font-size: 12px; margin: 4px 0 10px; color: #63746a; }
:where(#properties .btn) { display: inline-flex; align-items: center; justify-content: center; width: auto; margin: 10px 8px 0 0; vertical-align: middle; }
:where(#properties .property-share) { vertical-align: middle; }
@media (max-width:800px) {
:where(#properties .property-expand) { grid-template-columns: 240px minmax(0,1fr); }
}
@media (max-width:600px) {
:where(#properties .property-expand) { grid-template-columns: 1fr; }
}
:where(#properties .property-actions) { display: flex; flex-wrap: wrap; align-items: center; }
@media (max-width:800px) {
:where(#properties .mobile-property-photo-title) { background: #fff; border-bottom: 1px solid #d8e0db; }
}
:where(#about .about-person) { background: #ffffff55; border-color: #72947b66; }
@media (max-width:800px) {
:where(.video-about-layout #about) { position: relative; }
}
:where(body[data-view="home"] #properties) { display: none; }
:where(body[data-view="home"] #house) { display: none; }
:where(body[data-view="home"] #land9050) { display: none; }
:where(body[data-view="home"] #tudor) { display: none; }
:where(body[data-view="home"] #other-properties) { display: none; }
:where(body[data-view="volcano"] #other-properties) { display: none; }
:where(body[data-view="volcano"] #area) { display: none; }
:where(body[data-view="volcano"] #about) { display: none; }
:where(body[data-view="other"] #properties) { display: none; }
:where(body[data-view="other"] #house) { display: none; }
:where(body[data-view="other"] #land9050) { display: none; }
:where(body[data-view="other"] #tudor) { display: none; }
:where(body[data-view="other"] #area) { display: none; }
:where(body[data-view="other"] #about) { display: none; }
:where(body[data-view="volcano"] #attractions) { display: none; }
:where(body[data-view="other"] #attractions) { display: none; }
:where(body[data-view="volcano"] #sell-property) { display: none; }
:where(body[data-view="other"] #sell-property) { display: none; }
:where(#properties .property-photo-facts strong) { display: block; font-size: 17px; }
:where(body[data-view="volcano"] #nature) { display: none; }
:where(body[data-view="other"] #nature) { display: none; }
@media (max-width:800px) {
:where(#properties .mobile-property-photo-title br) { display: initial; }
}
@media (max-width:800px) {
:where(.video-about-layout #about)::before { content: ""; position: absolute; top: -5px; height: 5px; background: linear-gradient(90deg,#d0af73 0%,#e5ca91 28%,#f3e3bd 50%,#e5ca91 72%,#d0af73 100%); pointer-events: none; }
}
:where(body #contact a.facebook-link) { align-items: center; justify-content: center; gap: 9px; max-width: 100%; margin-top: 18px; text-decoration: none; }
:where(#properties .property-photo-facts .price) { font-weight: bold; font-size: 23px; color: #0d302b; }
:where(#properties .property-actions>.btn) { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; margin: 0; font: 13px/1.65 Arial,sans-serif; text-align: center; text-decoration: none; max-width: 100%; }
:where(#properties .property-actions>.property-share) { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; margin: 0; font: 13px/1.65 Arial,sans-serif; text-align: center; text-decoration: none; max-width: 100%; }
:where(#properties .property-actions>.wa) { width: 200px; }
:where(#properties .property-actions>.property-share) { width: 90px; }
:where(#properties .card-copy .meta) { margin: 0 0 18px; }
:where(html body[data-view="volcano"] #properties>.intro) { padding: 20px; }
:where(html body[data-view="home"] .video-about-layout #about) { position: relative; }
:where(html body[data-view="home"] #sell-property .owner-invitation-box) { position: relative; }
:where(#properties .property-actions>.btn:not(.wa)) { width: 160px; }
:where(#siteMenuPanel #shareHomepage) { cursor: pointer; }
:where(#siteMenuPanel #shareHomepageStatus) { display: block; font-size: 12px; padding: 6px 14px; color: var(--ink); }
:where(#siteMenuPanel #shareHomepage .site-menu-icon) { flex-shrink: 0; }
:where(.photo-viewer-footer:has(>#photoViewerPrev[hidden]):has(>#photoViewerNext[hidden])) { grid-template-columns: minmax(0,1fr); }
:where(.photo-viewer-footer:has(>#photoViewerPrev[hidden]):has(>#photoViewerNext[hidden])>.photo-viewer-caption) { grid-column: 1; }
@media (max-width:800px) {
:where(html body #lang):after { content: "🌐 E"; font: 700 10px/18px Arial,sans-serif; color: #fff; }
}
@media (max-width:800px) {
:where(html[lang="en"] body #lang):after { content: "🌐 ES"; }
}
:where(header) { box-shadow: 0 1px 0 #d8cbb0 !important; }
:where(footer) { padding-bottom: 90px !important; }
@media (max-width:800px) {
:where(header nav>*) { min-width: 0 !important; width: 100% !important; }
}
:where(body>header) { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; height: auto !important; max-height: none !important; min-height: 100px !important; padding: 8px 4% !important; position: sticky !important; top: 0 !important; z-index: 50 !important; background: linear-gradient(90deg,#f6f4ed 0%,#f6f4ed 22%,#d5e5ef 36%,#83b3d4 58%,#397fae 80%,#286b99 100%) !important; border-bottom: 6px solid transparent !important; border-image: linear-gradient(90deg,#d0af73 0%,#e5ca91 28%,#f3e3bd 50%,#e5ca91 72%,#d0af73 100%) 1 !important; }
@media (max-width:800px) {
:where(body>header) { border-bottom-width: 5px !important; }
}
@media (max-width: 800px) {
:where(html body) { padding-top: 70px !important; }
}
@media (max-width: 800px) {
:where(html body > header) { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; }
}
@media (min-width:801px) {
:where(html body footer) { padding-left: 6% !important; padding-right: 6% !important; box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body>header) { padding-right: 6% !important; }
}
:where([hidden]) { display: none !important; }
:where(.hero) { position: relative !important; display: flex !important; align-items: center !important; }
:where(.hero-copy) { position: relative !important; z-index: 2 !important; background: transparent !important; color: white !important; padding: 0 !important; }
:where(.hero) { min-height: 440px !important; padding: 40px 7% !important; }
@media (max-width:550px) {
:where(.hero) { min-height: 0 !important; padding: 30px 24px !important; }
}
:where(.hero-copy) { max-width: 1000px !important; }
:where(.strip) { color: #0d302b !important; }
:where(.dual-price) { display: flex !important; white-space: normal !important; }
:where(.currency-en) { display: none !important; }
:where(.video-about-layout) { padding-top: 0 !important; }
@media (max-width:800px) {
:where(.video-about-layout) { padding-top: 0 !important; }
}
:where(.video-about-layout) { gap: 6px !important; }
:where(.persistent-wa) { position: fixed !important; right: 20px !important; bottom: calc(20px + env(safe-area-inset-bottom,0px)) !important; z-index: 45 !important; display: inline-flex !important; padding: 12px 18px !important; font-size: 14px !important; text-decoration: none !important; animation: none !important; }
@media (max-width:600px) {
:where(.persistent-wa) { right: 12px !important; bottom: calc(12px + env(safe-area-inset-bottom,0px)) !important; padding: 10px 14px !important; font-size: 13px !important; }
}
@media (max-width:800px) {
:where(.persistent-wa) { display: none !important; }
}
:where(.desktop-costa-rica-flag) { display: none !important; }
:where(.hero>img) { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; z-index: 0 !important; }
:where(.hero-copy h1) { font: normal clamp(40px,5vw,68px)/1.08 Georgia,serif !important; color: white !important; }
:where(.hero-copy p) { color: #f6f4ed !important; }
@media (max-width:550px) {
:where(.hero-copy h1) { font-size: 38px !important; margin: 18px 0 !important; }
}
@media (max-width:550px) {
:where(.hero-copy p) { margin: 16px 0 !important; }
}
:where(body>header .brand-logo) { display: flex !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; }
:where(body>header .site-menu-row) { display: flex !important; flex: 0 0 auto !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
:where(body>header .brand-logo) { flex: 0 1 300px !important; width: 300px !important; max-width: 300px !important; height: auto !important; overflow: visible !important; }
:where(body>header .site-menu-row) { gap: 8px !important; align-items: center !important; }
:where(body>header .header-control) { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important; min-width: 88px !important; margin: 0 !important; text-decoration: none !important; white-space: nowrap !important; }
@media (min-width:801px) {
:where(html body .hero) { padding-left: 6% !important; padding-right: 6% !important; box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout) { padding-left: 6% !important; padding-right: 6% !important; box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body .hero) { min-height: 340px !important; padding-top: 36px !important; padding-bottom: 36px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout) { flex-direction: column !important; margin-top: 0 !important; padding-top: 0 !important; display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; gap: 24px !important; align-items: stretch !important; padding-bottom: 0 !important; }
}
@media (min-width:801px) {
:where(html body .catalog-menu) { align-items: center !important; justify-content: space-between !important; gap: 32px !important; padding: 24px 6% !important; }
}
:where(html body .catalog-menu) { position: relative !important; top: auto !important; z-index: 1 !important; background-blend-mode: normal !important; background-image: linear-gradient(90deg,#092b28e8,#092b2845),linear-gradient(90deg,rgba(3,26,24,.88),rgba(3,26,24,.33) 65%,rgba(3,26,24,.1)),url("/assets/banner-bosque-continuacion-20261017.png") !important; background-size: 100% 100%,100% 100%,cover !important; background-position: center,center,center 38% !important; background-repeat: no-repeat !important; background-color: #173f39 !important; }
@media (max-width:800px) {
:where(html body .catalog-menu) { background-position: center,center,72% center !important; }
}
@media (max-width:800px) {
:where(html body .video-about-layout) { gap: 5px !important; padding-bottom: 0 !important; margin-bottom: 0 !important; }
}
:where(html[data-property-opening] body>main) { display: none !important; }
:where(html[data-property-opening] body>footer) { display: none !important; }
:where(body>header .brand-logo img) { display: block !important; object-position: left center !important; width: 100% !important; height: auto !important; max-height: none !important; object-fit: contain !important; transform: scale(1.4) !important; transform-origin: left center !important; }
@media (max-width:800px) {
:where(body>header>div.site-menu-row) { position: static !important; max-width: 100% !important; }
}
@media (min-width:801px) {
:where(html body .hero-copy>h1) { grid-column: 1 !important; grid-row: 2 !important; font-size: clamp(38px,4vw,54px) !important; line-height: 1.08 !important; margin: 14px 0 12px !important; }
}
@media (min-width:801px) {
:where(html body .hero-copy>p) { grid-column: 1 !important; grid-row: 3 !important; max-width: 540px !important; font-size: 17px !important; line-height: 1.6 !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout):before { display: none !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout):after { display: none !important; }
}
@media (min-width:801px) {
:where(html body header .site-menu-row) { margin-left: auto !important; }
}
:where(html body .hero>img) { object-position: center 38% !important; }
@media (max-width:800px) {
:where(html body .hero>img) { object-position: 72% center !important; }
}
@media (min-width:801px) {
:where(html body header>img.desktop-costa-rica-flag) { display: block !important; width: 70.4px !important; height: 49.92px !important; object-fit: contain !important; flex: 0 0 70.4px !important; margin-left: -21px !important; margin-right: auto !important; align-self: center !important; }
}
@media (min-width:801px) {
:where(html body header>a.brand) { margin-right: 0 !important; width: 420px !important; min-width: 420px !important; max-width: 420px !important; flex: 0 0 420px !important; }
}
@media (min-width:801px) {
:where(html body header>a.brand img) { width: 420px !important; min-width: 420px !important; max-width: 420px !important; height: 140px !important; transform: none !important; object-fit: contain !important; }
}
:where(.discovery-card[hidden]) { display: none !important; }
:where(.hero-copy .zone-buttons) { margin-top: 20px !important; }
@media (max-width:550px) {
:where(.hero-copy .zone-buttons) { gap: 12px !important; margin-top: 20px !important; }
}
:where(.realty-photo-description[hidden]) { display: none !important; }
@media (max-width:800px) {
:where(body[data-view="home"] .strip) { color: #0d302b !important; }
}
:where(body[data-view="volcano"] .hero) { display: none !important; }
:where(html[lang="en"] .currency-en) { display: inline !important; }
:where(html[lang="en"] .currency-es) { display: none !important; }
:where(body .video-section>.mobile-video-copy) { display: none !important; }
@media (max-width:800px) {
:where(body .video-about-layout>.video-section) { display: flow-root !important; padding: 36px 6% !important; text-align: left !important; }
}
:where(html[data-property-opening] body>.persistent-wa) { display: none !important; }
:where(body .catalog-menu>a[data-t="backHome"]) { display: inline-flex !important; text-decoration: none !important; }
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>h2) { padding-left: 0 !important; padding-right: 0 !important; font-size: 25px !important; line-height: 1.15 !important; margin: 0 0 14px !important; }
}
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>video) { float: left !important; display: block !important; width: 40% !important; max-width: 145px !important; min-width: 0 !important; height: auto !important; max-height: none !important; aspect-ratio: 512/910 !important; object-fit: contain !important; margin: 0 16px 10px 0 !important; border-radius: 5px !important; background: #0d302b !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section) { min-width: 0 !important; }
}
@media (min-width:801px) {
:where(html body .hero>.hero-copy) { display: grid !important; grid-template-columns: minmax(0,1.15fr) minmax(300px,.85fr) !important; column-gap: clamp(36px,5vw,80px) !important; row-gap: 0 !important; align-items: start !important; width: 100% !important; max-width: none !important; }
}
@media (min-width:801px) {
:where(html body .hero-copy>.eyebrow) { grid-column: 1 !important; grid-row: 1 !important; }
}
@media (min-width:801px) {
:where(html body .hero-copy>.zone-buttons) { grid-column: 2 !important; display: flex !important; flex-direction: column !important; width: 100% !important; max-width: 460px !important; justify-self: end !important; margin: 0 !important; grid-row: 2/4 !important; align-self: stretch !important; justify-content: space-between !important; padding-top: 14px !important; padding-bottom: 0 !important; gap: 16px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section) { grid-column: 1 !important; grid-row: 2 !important; align-self: stretch !important; max-width: none !important; width: 100% !important; padding: 28px !important; display: grid !important; grid-template-columns: 240px minmax(0,1fr) !important; column-gap: 20px !important; row-gap: 10px !important; align-content: start !important; align-items: start !important; }
}
@media (min-width:801px) {
:where(html body .catalog-menu>.zone-buttons) { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 14px !important; width: 460px !important; max-width: 48% !important; margin: 0 0 0 auto !important; }
}
:where(html body[data-view="home"] .video-about-layout) { background: transparent !important; background-image: none !important; background-color: transparent !important; }
:where(html body[data-view="volcano"] .video-about-layout) { background: transparent !important; background-image: none !important; background-color: transparent !important; }
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section>video) { grid-column: 1 !important; grid-row: 1/5 !important; width: 240px !important; min-width: 240px !important; max-width: 240px !important; height: 350px !important; max-height: 350px !important; object-fit: contain !important; margin: 0 !important; background: #0d302b !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section>h2) { font-size: 28px !important; line-height: 1.15 !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .catalog-contact-intro>h2) { font-size: 34px !important; line-height: 1.1 !important; margin: 0 0 16px !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .catalog-contact-intro>p) { font-size: 16px !important; line-height: 1.6 !important; margin: 0 0 18px !important; }
}
@media (min-width:801px) {
:where(html body .catalog-menu>a[data-t="backHome"]) { align-self: center !important; }
}
:where(html body[data-view="volcano"] .catalog-contact-intro :is(h2,p,b)) { color: #fff !important; }
:where(html body .video-about-layout>section.video-section :is(h2,h3,p)) { color: #fff !important; text-shadow: none !important; }
:where(.hero .zone-buttons .btn) { margin-top: 0 !important; }
:where(.catalog-menu.property-active>.property-band-return) { grid-column: 1 !important; grid-row: 2 !important; justify-self: start !important; align-self: start !important; }
:where(.catalog-menu.property-active>.zone-buttons) { grid-column: 2 !important; grid-row: 1 / span 2 !important; width: 100% !important; max-width: none !important; min-width: 0 !important; justify-self: stretch !important; }
:where(.catalog-menu.property-active>a:not(.property-band-return)) { grid-column: 1 !important; grid-row: 1 !important; justify-self: start !important; align-self: end !important; }
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>.eyebrow) { padding-left: 0 !important; padding-right: 0 !important; }
}
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>.note) { padding-left: 0 !important; padding-right: 0 !important; }
}
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>.eyebrow) { font-size: 11px !important; line-height: 1.4 !important; margin: 0 0 7px !important; }
}
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>.mobile-video-copy) { display: block !important; font-size: 15px !important; line-height: 1.65 !important; margin: 0 !important; }
}
@media (max-width:800px) {
:where(body .video-about-layout>.video-section>.note) { clear: both !important; font-size: 11px !important; line-height: 1.4 !important; margin: 12px 0 0 !important; }
}
:where(body .catalog-menu .zone-buttons>a.btn) { display: inline-flex !important; }
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section>:is(.eyebrow,h2,.mobile-video-copy,.note)) { grid-column: 2 !important; margin: 0 !important; padding: 0 !important; max-width: none !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section>.eyebrow) { font-size: 11px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section>.mobile-video-copy) { display: block !important; font-size: 14px !important; line-height: 1.6 !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>.video-section>.note) { font-size: 11px !important; line-height: 1.4 !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .video-about-layout>.video-section) { grid-row: 1 !important; grid-column: 1 !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .video-about-layout>.catalog-contact-intro) { grid-row: 1 !important; grid-column: 2 !important; min-width: 0 !important; padding: 28px !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .catalog-contact-intro>.eyebrow) { font-size: 12px !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .catalog-contact-intro .contact-links) { display: flex !important; flex-wrap: wrap !important; gap: 10px 18px !important; margin-top: 16px !important; overflow-wrap: anywhere !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] .catalog-contact-intro .facebook-link) { display: inline-flex !important; align-items: center !important; gap: 9px !important; margin-top: 18px !important; }
}
@media (min-width:801px) {
:where(html body .hero-copy>.zone-buttons>a.btn) { width: 100% !important; margin: 0 !important; text-align: center !important; flex: 0 0 auto !important; }
}
@media (min-width:801px) {
:where(html body .catalog-menu>.zone-buttons>a.btn) { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; margin: 0 !important; text-align: center !important; }
}
:where(html body[data-view="volcano"] .catalog-contact-intro .contact-links a) { color: #fff !important; }
@media (max-width:800px) {
:where(body>header>div.site-menu-row>a.header-control.header-home) { flex: 0 0 auto !important; margin: 0 !important; white-space: nowrap !important; }
}
:where(html body .video-about-layout>section.video-section>p.mobile-video-copy) { color: #fff !important; text-shadow: none !important; }
:where(html body .video-about-layout>section.video-section>p.note) { color: #fff !important; text-shadow: none !important; }
:where(html body[data-view="home"] .video-about-layout>section.video-section>p.mobile-video-copy) { display: block !important; visibility: visible !important; opacity: 1 !important; }
:where(#about) { scroll-margin-top: 140px !important; }
:where(#attractions) { background: linear-gradient(90deg,rgba(5,31,29,.68) 0%,rgba(5,31,29,.43) 55%,rgba(5,31,29,.08) 100%),url("IMG_7241.jpeg") center 48%/cover no-repeat !important; color: white !important; padding: 60px 6% !important; }
@media (max-width:800px) {
:where(#attractions) { padding: 42px 6% !important; background-position: 58% center !important; }
}
:where(#properties) { scroll-margin-top: 130px !important; background: #f2f3ef !important; }
:where(#other-properties) { background: #f2f3ef !important; }
:where(#about) { padding: 28px !important; }
:where(#attractions h2) { color: #fff !important; }
:where(#attractions p) { color: #f4f7f5 !important; max-width: 700px !important; }
@media (max-width:800px) {
:where(#attractions p) { font-size: 16px !important; }
}
:where(#other-properties h2) { color: #0d302b !important; }
:where(#other-properties p) { color: #344b40 !important; }
@media (max-width:600px) {
:where(body #property-range-summary) { grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; }
}
:where(body #property-range-summary) { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: nowrap !important; gap: 12px !important; padding: 8px 5% !important; }
@media (max-width:600px) {
:where(body #property-range-summary) { padding: 8px 3% !important; }
}
:where(header #siteMenuPanel nav) { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 0 !important; width: 100% !important; margin: 0 !important; padding: 0 !important; border: 0 !important; }
:where(body>header #siteMenuPanel) { top: calc(100% + 6px) !important; right: 14px !important; max-width: calc(100vw - 28px) !important; }
:where(body>header #siteMenuToggle) { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important; min-width: 88px !important; margin: 0 !important; text-decoration: none !important; white-space: nowrap !important; }
@media (max-width:800px) {
:where(body #nature>figure) { float: left !important; width: 40% !important; max-width: 145px !important; margin: 0 16px 10px 0 !important; }
}
@media (max-width:800px) {
:where(body #nature figcaption) { font-size: 10px !important; line-height: 1.35 !important; padding: 6px 0 0 !important; }
}
@media (max-width:800px) {
:where(body #area>div) { display: contents !important; }
}
@media (max-width:800px) {
:where(body #area h2) { font-size: 25px !important; line-height: 1.15 !important; margin: 0 0 12px !important; }
}
@media (max-width:800px) {
:where(body #area p) { font-size: 15px !important; line-height: 1.65 !important; margin: 0 !important; text-align: left !important; }
}
@media (max-width:800px) {
:where(body #about h2) { font-size: 25px !important; line-height: 1.15 !important; margin: 0 0 12px !important; }
}
:where(body #property-range-summary>div) { display: flex !important; align-items: center !important; gap: 6px !important; min-width: 0 !important; }
:where(body #property-range-summary b) { line-height: 1.3 !important; }
:where(body #property-range-summary span) { line-height: 1.3 !important; }
@media (min-width:801px) {
:where(html body #area) { box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body #nature) { box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body #attractions) { box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body #contact) { padding-left: 6% !important; padding-right: 6% !important; box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body #sell-property) { padding-left: 6% !important; padding-right: 6% !important; box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body :is(#area,#attractions,#nature)) { margin: 24px 6% !important; width: auto !important; padding: 28px !important; border: 0 !important; }
}
@media (min-width:801px) {
:where(html body #attractions) { background: linear-gradient(90deg,rgba(5,31,29,.78) 0%,rgba(5,31,29,.52) 55%,rgba(5,31,29,.12) 100%),url("IMG_7241.jpeg") center 48%/cover no-repeat !important; color: #fff !important; min-height: 260px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }
}
:where(header #siteMenuPanel nav a) { align-items: center !important; justify-content: flex-start !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; min-width: 0 !important; min-height: 50px !important; height: auto !important; text-align: left !important; font-weight: 400 !important; line-height: 1.35 !important; border-radius: 0 !important; display: flex !important; padding: 10px 12px !important; background: transparent !important; font-size: 14px !important; border: 0 !important; box-shadow: none !important; white-space: normal !important; }
@media (min-width:801px) {
:where(html body #area>div) { display: contents !important; }
}
@media (min-width:801px) {
:where(html body #area h2) { font-size: 34px !important; line-height: 1.1 !important; margin: 0 0 14px !important; }
}
@media (min-width:801px) {
:where(html body #area p) { font-size: 16px !important; line-height: 1.6 !important; margin: 0 !important; max-width: none !important; }
}
@media (min-width:801px) {
:where(html body #nature>figure) { float: left !important; width: 240px !important; max-width: 28% !important; margin: 0 28px 0 0 !important; justify-self: start !important; }
}
@media (min-width:801px) {
:where(html body #nature figcaption) { font-size: 11px !important; line-height: 1.4 !important; padding: 7px 0 0 !important; }
}
@media (min-width:801px) {
:where(html body #about h2) { font-size: 34px !important; line-height: 1.1 !important; margin: 0 0 12px !important; }
}
@media (min-width:801px) {
:where(html body :is(#area,#attractions,#nature)):before { display: none !important; }
}
@media (min-width:801px) {
:where(html body :is(#area,#attractions,#nature)):after { display: none !important; }
}
@media (min-width:801px) {
:where(html body #attractions>h2) { font-size: 34px !important; line-height: 1.1 !important; margin: 0 0 14px !important; }
}
@media (min-width:801px) {
:where(html body #attractions>p) { font-size: 16px !important; line-height: 1.6 !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(html body #contact):before { display: none !important; }
}
@media (min-width:801px) {
:where(html body #contact):after { display: none !important; }
}
@media (min-width:801px) {
:where(html body #contact>div) { margin: 0 !important; min-width: 0 !important; box-sizing: border-box !important; }
}
@media (min-width:801px) {
:where(html body #contact h2) { font-size: 34px !important; line-height: 1.1 !important; margin: 0 0 16px !important; }
}
@media (min-width:801px) {
:where(html body #contact p) { font-size: 16px !important; line-height: 1.6 !important; max-width: none !important; }
}
:where(html body #nature figcaption) { color: #d6e2dc !important; }
@media (min-width:801px) {
:where(html body #attractions>h2) { color: #fff !important; }
}
@media (min-width:801px) {
:where(html body #attractions>p) { color: #f4f7f5 !important; max-width: 700px !important; text-shadow: 0 1px 3px #0004 !important; }
}
:where(html body #about :is(h2,h3,p,li,a)) { color: #fff !important; text-shadow: none !important; }
:where(#attractions .eyebrow) { color: #edd8a9 !important; }
:where(#other-properties .eyebrow) { color: #536047 !important; }
:where(#properties .card) { background: #fff !important; border: 1px solid #dce2db !important; box-shadow: 0 3px 12px rgba(13,48,43,.07) !important; margin: 0 !important; padding: 0 !important; }
@media (max-width:800px) {
:where(#properties .mobile-property-photo-title) { font: 700 16px/1.4 Arial,sans-serif !important; color: #0d302b !important; }
}
@media (max-width:800px) {
:where(.video-about-layout #about) { margin: 0 !important; }
}
:where(#properties .mobile-property-photo-title) { display: block !important; }
:where(#properties .property-row-summary) { padding: 16px !important; }
:where(#properties .property-expanded-content) { align-self: center !important; padding: 16px 24px !important; }
:where(#properties .card-copy) { padding: 0 !important; }
:where(#properties .property-photo-facts) { padding: 12px 0 0 !important; }
:where(#properties>.intro h2) { color: #0d302b !important; }
:where(#properties>.intro p) { color: #344b40 !important; }
:where(#properties article[hidden]) { display: none !important; }
@media (max-width:800px) {
:where(.video-about-layout #about)::before { left: 0 !important; right: 0 !important; }
}
@media (max-width:800px) {
:where(body #nature .nature-photo-frame) { display: block !important; width: 100% !important; aspect-ratio: 1 !important; padding: 0 !important; }
}
@media (max-width:800px) {
:where(body #nature .nature-copy) { display: contents !important; }
}
@media (max-width:800px) {
:where(body #area .eyebrow) { font-size: 11px !important; line-height: 1.4 !important; margin: 0 0 7px !important; }
}
@media (max-width:800px) {
:where(body #area .facts) { clear: both !important; display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 16px !important; margin-top: 20px !important; }
}
@media (max-width:800px) {
:where(body #about .family-landscape) { float: left !important; width: 40% !important; max-width: 145px !important; margin: 0 16px 10px 0 !important; }
}
@media (max-width:800px) {
:where(body #about .about-person) { clear: both !important; margin-top: 24px !important; }
}
:where(body #contact a.facebook-link) { display: inline-flex !important; width: auto !important; }
@media (max-width:800px) {
:where(body section#nature.nature-section) { display: flow-root !important; padding: 36px 6% !important; }
}
@media (max-width:800px) {
:where(body #nature .nature-photo-frame>img) { display: block !important; width: 100% !important; height: auto !important; aspect-ratio: 1 !important; object-fit: cover !important; }
}
@media (max-width:800px) {
:where(body #nature .nature-copy h2) { font-size: 25px !important; line-height: 1.15 !important; margin: 0 0 12px !important; }
}
@media (max-width:800px) {
:where(body #nature .nature-copy p) { font-size: 15px !important; line-height: 1.65 !important; margin: 0 !important; text-align: left !important; }
}
@media (max-width:800px) {
:where(body section#area.place) { display: flow-root !important; padding: 36px 6% !important; }
}
@media (max-width:800px) {
:where(body #area>img:not(.mobile-area-photo)) { display: none !important; }
}
@media (max-width:800px) {
:where(body section#about.about) { display: block !important; }
}
@media (max-width:800px) {
:where(body #about>div:first-child) { display: flow-root !important; }
}
@media (max-width:800px) {
:where(body #about .family-landscape>img) { display: block !important; width: 100% !important; height: auto !important; max-height: none !important; aspect-ratio: 1 !important; object-fit: cover !important; }
}
@media (max-width:800px) {
:where(body #about h3[data-t="historyTitle"]) { font-size: 20px !important; line-height: 1.25 !important; margin: 0 0 14px !important; }
}
:where(body #property-range-summary .entry-lot-price span) { color: #b71c1c !important; }
:where(body #property-range-summary .entry-lot-price b) { color: #0d302b !important; }
:where(body #property-range-summary>div:last-child) { justify-content: flex-end !important; }
@media (min-width:801px) {
:where(html body .video-about-layout>#about) { min-width: 0 !important; }
}
@media (min-width:801px) {
:where(html body #sell-property .owner-invitation-box) { max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
}
@media (min-width:801px) {
:where(html body #area .eyebrow) { font-size: 12px !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body #area .facts) { clear: both !important; display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 20px !important; margin-top: 18px !important; padding-top: 14px !important; border-top: 1px solid #ffffff20 !important; }
}
@media (min-width:801px) {
:where(html body #nature .nature-photo-frame) { display: block !important; width: 100% !important; height: 205px !important; aspect-ratio: auto !important; padding: 0 !important; }
}
@media (min-width:801px) {
:where(html body #nature .nature-copy) { display: contents !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#about) { order: -1 !important; width: 100% !important; }
}
@media (min-width:801px) {
:where(html body #about .eyebrow) { font-size: 12px !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body #about .about-person) { margin-top: 24px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#about) { padding: 28px !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(html body #attractions>.desktop-paragliding-photo) { float: left !important; width: 240px !important; max-width: 28% !important; height: 205px !important; object-fit: cover !important; object-position: center !important; margin: 0 28px 0 0 !important; border-radius: 5px !important; }
}
@media (min-width:801px) {
:where(html body #attractions>.eyebrow) { font-size: 12px !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#about) { grid-column: 1/-1 !important; grid-row: 1 !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#sell-property) { grid-column: 2 !important; grid-row: 2 !important; padding: 0 !important; margin: 0 !important; width: 100% !important; min-width: 0 !important; background: transparent !important; border: 0 !important; }
}
@media (min-width:801px) {
:where(html body #contact .eyebrow) { font-size: 12px !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body #contact .contact-links) { gap: 10px 18px !important; margin-top: 16px !important; overflow-wrap: anywhere !important; }
}
:where(html body[data-view="volcano"] #properties) { background: transparent !important; }
@media (min-width:801px) {
:where(html body #attractions>.desktop-paragliding-photo) { display: none !important; }
}
@media (min-width:801px) {
:where(html body #attractions>.eyebrow) { color: #edd8a9 !important; }
}
@media (max-width:800px) {
:where(body #about>div:first-child>p) { font-size: 15px !important; line-height: 1.65 !important; max-width: none !important; margin: 0 !important; text-align: left !important; }
}
@media (min-width:801px) {
:where(html body section#area.place) { display: flow-root !important; padding-top: 32px !important; padding-bottom: 32px !important; min-height: 0 !important; }
}
@media (min-width:801px) {
:where(html body #area>img:not(.mobile-area-photo)) { display: none !important; }
}
@media (min-width:801px) {
:where(html body #area .facts b) { font-size: 18px !important; }
}
@media (min-width:801px) {
:where(html body #area .facts span) { font-size: 13px !important; }
}
@media (min-width:801px) {
:where(html body section#nature.nature-section) { display: flow-root !important; padding-top: 32px !important; padding-bottom: 32px !important; min-height: 0 !important; }
}
@media (min-width:801px) {
:where(html body #nature .nature-photo-frame>img) { display: block !important; width: 100% !important; height: 205px !important; aspect-ratio: auto !important; object-fit: cover !important; object-position: center !important; }
}
@media (min-width:801px) {
:where(html body #nature .nature-copy h2) { font-size: 34px !important; line-height: 1.1 !important; margin: 0 0 14px !important; }
}
@media (min-width:801px) {
:where(html body #nature .nature-copy p) { font-size: 16px !important; line-height: 1.6 !important; margin: 0 !important; max-width: none !important; }
}
@media (min-width:801px) {
:where(html body #about>div:first-child) { display: grid !important; grid-template-columns: 240px minmax(0,1fr) !important; column-gap: 28px !important; row-gap: 0 !important; align-items: start !important; }
}
@media (min-width:801px) {
:where(html body #about .family-landscape>img) { display: block !important; width: 100% !important; height: 205px !important; max-height: none !important; object-fit: cover !important; object-position: center 40% !important; }
}
@media (min-width:801px) {
:where(html body #about h3[data-t="historyTitle"]) { font-size: 21px !important; line-height: 1.2 !important; margin: 0 0 12px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#sell-property h2) { font-size: 32px !important; line-height: 1.15 !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#sell-property p) { font-size: 16px !important; line-height: 1.6 !important; }
}
@media (min-width:801px) {
:where(html body section#contact.contact) { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; gap: 24px !important; align-items: stretch !important; margin-top: 24px !important; padding-top: 0 !important; padding-bottom: 32px !important; background: #f7f8f5 !important; border: 0 !important; min-height: 0 !important; }
}
@media (min-width:801px) {
:where(html body #contact>.contact-box>label) { font: normal 28px/1.2 Georgia,serif !important; margin: 0 0 20px !important; }
}
@media (min-width:801px) {
:where(html body #contact>.contact-box>select) { width: 100% !important; min-width: 0 !important; max-width: 100% !important; font-size: 14px !important; }
}
:where(html body #nature .nature-copy h2) { color: #fff !important; }
:where(html body #nature .nature-copy p) { color: #d6e2dc !important; text-shadow: none !important; }
@media (max-width:800px) {
:where(html body section#sell-property.owner-invitation) { padding-top: 0 !important; padding-bottom: 0 !important; margin-bottom: 0 !important; }
}
@media (max-width:800px) {
:where(html body section#sell-property .owner-invitation-box) { margin-top: 0 !important; margin-bottom: 0 !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact) { row-gap: 5px !important; padding-top: 0 !important; margin-top: 5px !important; }
}
@media (max-width:800px) {
:where(html body section#sell-property.owner-invitation) { margin-top: 55px !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact) { padding-bottom: 55px !important; }
}
@media (max-width:800px) {
:where(body>header>div.site-menu-row>button#siteMenuToggle) { flex: 0 0 auto !important; margin: 0 !important; white-space: nowrap !important; }
}
@media (max-width:800px) {
:where(body>header>div.site-menu-row>button#lang) { flex: 0 0 auto !important; margin: 0 !important; white-space: nowrap !important; }
}
@media (min-width:801px) {
:where(html body #about>div:first-child>p) { font-size: 16px !important; line-height: 1.6 !important; max-width: none !important; margin: 0 !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact>div) { margin-top: 0 !important; margin-bottom: 0 !important; }
}
:where(#properties .property-group-title[hidden]) { display: none !important; }
:where(#properties .card-copy .meta) { display: block !important; }
:where(#properties .property-photo-facts .price) { margin: 6px 0 !important; }
:where(#properties .property-photo-facts>p:not([data-t="fincaFrom"])) { display: none !important; }
@media (max-width:800px) {
:where(body #nature .nature-copy .eyebrow) { font-size: 11px !important; line-height: 1.4 !important; margin: 0 0 7px !important; }
}
@media (min-width:801px) {
:where(html body #nature .nature-copy .eyebrow) { font-size: 12px !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#sell-property .owner-invitation-box) { height: 100% !important; margin: 0 !important; padding: 28px !important; max-width: none !important; width: 100% !important; }
}
@media (min-width:801px) {
:where(html body .video-about-layout>#sell-property .owner-actions) { flex-direction: column !important; align-items: stretch !important; gap: 16px !important; }
}
@media (min-width:801px) {
:where(html body #contact>.contact-box>.note) { font-size: 14px !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] #contact>.contact-box) { width: 100% !important; min-height: 0 !important; display: grid !important; grid-template-columns: minmax(0,1fr) minmax(220px,.6fr) !important; gap: 14px 24px !important; align-items: center !important; }
}
:where(html body #properties>.intro>.catalog-title-row) { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; width: 100% !important; min-width: 0 !important; }
@media (max-width:800px) {
:where(html body #properties>.intro>.catalog-title-row) { gap: 12px !important; }
}
:where(body section#area.place>img.mobile-area-photo) { display: none !important; }
@media (max-width:800px) {
:where(body section#area.place>img.mobile-area-photo) { display: block !important; float: left !important; width: 40% !important; max-width: 145px !important; height: auto !important; aspect-ratio: 1 !important; object-fit: cover !important; margin: 0 16px 10px 0 !important; }
}
@media (min-width:801px) {
:where(html body #about>div:first-child>.family-landscape) { grid-column: 1 !important; grid-row: 1/5 !important; width: 240px !important; max-width: 100% !important; margin: 0 !important; float: none !important; }
}
@media (min-width:801px) {
:where(html body #about>div:first-child>:is(.eyebrow,h2,h3,p)) { grid-column: 2 !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] section#contact.contact) { display: block !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] #contact>.contact-box>label) { grid-column: 1/-1 !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] #contact>.contact-box>select) { margin: 0 !important; }
}
:where(html body[data-view="home"] section#sell-property.owner-invitation) { background: transparent !important; background-image: none !important; }
:where(html body[data-view="home"] section#contact.contact) { background: transparent !important; background-image: none !important; }
:where(html body[data-view="volcano"] section#contact.contact) { background: transparent !important; background-image: none !important; background-color: transparent !important; }
:where(html body[data-view="volcano"] section#sell-property.owner-invitation) { background: transparent !important; background-image: none !important; background-color: transparent !important; }
:where(html body #properties>.intro>.catalog-title-row>h2) { order: 0 !important; margin: 0 !important; text-align: left !important; flex: 1 1 auto !important; }
@media (max-width:800px) {
:where(html body #properties>.intro>.catalog-title-row>h2) { font-size: clamp(25px,6vw,34px) !important; line-height: 1.12 !important; }
}
@media (min-width:801px) {
:where(html body section#area.place>img.mobile-area-photo) { display: block !important; float: left !important; width: 240px !important; max-width: 28% !important; height: 205px !important; object-fit: cover !important; object-position: center 40% !important; margin: 0 28px 14px 0 !important; }
}
@media (min-width:801px) {
:where(html body section#contact.contact>div:first-child) { padding: 28px !important; }
}
@media (min-width:801px) {
:where(html body section#contact.contact>div.contact-box) { padding: 28px !important; }
}
@media (min-width:801px) {
:where(html body section#contact.contact>div :is(h2,h3,p,b,label,.note)) { color: #fff !important; text-shadow: none !important; }
}
@media (min-width:801px) {
:where(html body section#contact.contact .contact-links a) { color: #fff !important; text-shadow: none !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact>div:first-child) { padding: 24px !important; min-width: 0 !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact>div:first-child :is(h2,p,b)) { color: #fff !important; text-shadow: none !important; }
}
@media (min-width:801px) {
:where(html body[data-view="volcano"] #contact>.contact-box>.note) { grid-column: 1/-1 !important; margin: 0 !important; }
}
:where(html body #properties>.intro>.catalog-title-row>.eyebrow) { order: 1 !important; margin: 0 !important; font: 500 13px/1.4 Arial,sans-serif !important; letter-spacing: .6px !important; text-align: right !important; color: #526c54 !important; flex: 0 1 auto !important; }
@media (max-width:800px) {
:where(html body #properties>.intro>.catalog-title-row>.eyebrow) { max-width: 36% !important; font-size: 10px !important; letter-spacing: .2px !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact>div:first-child .contact-links) { overflow-wrap: anywhere !important; }
}
@media (max-width:800px) {
:where(html body section#contact.contact>div:first-child .contact-links a) { color: #fff !important; text-shadow: none !important; }
}
@media (max-width:800px) {
:where(html body[data-view="volcano"] section#contact.contact>.contact-box :is(label,p,.note)) { color: #fff !important; }
}
@media (max-width:800px) {
:where(html body[data-view="home"] section#contact.contact>.contact-box :is(label,p,.note)) { color: #fff !important; }
}
:where(#properties #land9050) { background: #fff !important; border: 1px solid #dce2db !important; box-shadow: 0 3px 12px rgba(13,48,43,.07) !important; }
:where(#properties #tudor) { background: #fff !important; border: 1px solid #dce2db !important; box-shadow: 0 3px 12px rgba(13,48,43,.07) !important; }
:where(html body #property-range-summary) { padding-left: 6% !important; padding-right: 6% !important; }
@media (max-width:800px) {
:where(html body #property-range-summary) { padding-left: 6% !important; padding-right: 6% !important; gap: 8px !important; }
}
@media (min-width:801px) {
:where(html body #properties) { padding-bottom: 28px !important; padding-top: 20px !important; }
}
:where(html body #property-range-summary b) { font-weight: 700 !important; }
:where(html body #property-range-summary span) { font-weight: 700 !important; }
:where(html body #property-range-summary b) { font-size: 16px !important; }
:where(html body #property-range-summary span) { font-size: 16px !important; }
@media (max-width:800px) {
:where(html body #property-range-summary>div) { min-width: 0 !important; }
}
@media (max-width:800px) {
:where(html body #property-range-summary b) { line-height: 1.35 !important; }
}
@media (max-width:800px) {
:where(html body #property-range-summary span) { line-height: 1.35 !important; }
}
:where(html body #property-range-summary>div) { flex-wrap: nowrap !important; flex: 0 1 auto !important; }
:where(html body #property-range-summary b) { white-space: nowrap !important; }
:where(html body #property-range-summary span) { white-space: nowrap !important; }
@media (max-width:800px) {
:where(html body #property-range-summary>div) { gap: 4px !important; }
}
@media (max-width:800px) {
:where(html body #property-range-summary b) { font-size: clamp(9px,2.65vw,14px) !important; letter-spacing: -.2px !important; }
}
@media (max-width:800px) {
:where(html body #property-range-summary span) { font-size: clamp(9px,2.65vw,14px) !important; letter-spacing: -.2px !important; }
}
@media (min-width:801px) {
:where(#properties>.grid) { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}
@media (min-width:801px) {
:where(#properties .property-row-summary) { width: 100% !important; }
}
@media (min-width:801px) {
:where(#properties .property-expanded-content) { width: 100% !important; align-self: stretch !important; margin-top: auto !important; }
}
@media (min-width:801px) {
:where(#properties .house-description) { padding: 0 !important; }
}
@media (min-width:801px) {
:where(#properties .property-actions) { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; width: 100% !important; margin: 0 !important; }
}
:where(#properties :is(#lot625,#lot1056,#lot1000,#lot1250,#land5034,#land9050,#fincaTurrialba,#house,#tudor) .property-row-summary>img) { object-position: center !important; }
:where(html body:not([data-view="home"]) #property-range-summary) { display: none !important; }
@media (min-width:801px) {
:where(html body #properties .property-type-filter) { margin-bottom: 20px !important; }
}
@media (min-width:801px) {
:where(html body #properties .meta) { font-size: 12px !important; min-height: 34px !important; line-height: 1.4 !important; margin: 0 0 8px !important; }
}
@media (min-width:801px) {
:where(html body #properties>.intro) { display: block !important; margin-bottom: 16px !important; }
}
@media (min-width:801px) {
:where(html body #properties .property-type-filter) { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; column-gap: 24px !important; row-gap: 6px !important; align-items: center !important; padding: 16px 20px !important; }
}
@media (min-width:801px) {
:where(html body #properties .property-filter-label) { grid-column: 1 !important; grid-row: 1 !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(html body #properties .property-filter-buttons) { grid-column: 1 !important; grid-row: 2 !important; }
}
@media (min-width:801px) {
:where(html body #properties .desktop-catalog-range-copy) { display: block !important; grid-column: 2 !important; grid-row: 1/4 !important; text-align: right !important; justify-self: end !important; max-width: 420px !important; margin: 0 !important; color: #0d302b !important; font-size: 15px !important; line-height: 1.5 !important; }
}
@media (max-width:800px) {
:where(html body #property-range-summary>div:last-child) { text-align: right !important; justify-content: flex-end !important; }
}
@media (min-width:801px) {
:where(html body #properties>.intro>div) { display: flex !important; align-items: baseline !important; flex-wrap: nowrap !important; gap: 20px !important; }
}
@media (min-width:801px) {
:where(html body #properties>.intro h2) { font-size: 30px !important; line-height: 1.15 !important; white-space: nowrap !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(html body #properties>.intro>p) { display: none !important; }
}
:where(#properties :is(#land9050,#tudor) .property-expanded-content>.house-layout) { display: block !important; }
@media (min-width:801px) {
:where(#properties .property-actions>.wa) { grid-column: 1/-1 !important; }
}
@media (min-width:801px) {
:where(#properties .property-actions>.btn) { width: 100% !important; min-width: 0 !important; }
}
@media (min-width:801px) {
:where(#properties .property-actions>.property-share) { width: 100% !important; min-width: 0 !important; }
}
@media (min-width:801px) {
:where(#properties article.card[data-property-type]) { width: 100% !important; min-width: 0 !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
}
@media (min-width:801px) {
:where(html body #properties>.intro .eyebrow) { font-size: 13px !important; letter-spacing: 1px !important; white-space: nowrap !important; margin: 0 !important; }
}
:where(html body[data-view="volcano"] #properties .property-number) { margin-top: 0 !important; margin-bottom: 3px !important; }
:where(html body[data-view="volcano"] #properties .property-photo-facts) { padding-top: 6px !important; padding-bottom: 2px !important; }
:where(html body[data-view="volcano"] #properties .meta) { min-height: 0 !important; margin-top: 0 !important; margin-bottom: 5px !important; }
:where(html body[data-view="volcano"] #properties .property-expanded-content) { padding-top: 0 !important; padding-bottom: 8px !important; margin-top: 0 !important; align-self: stretch !important; }
:where(html body[data-view="volcano"] #properties .property-actions) { margin: 0 !important; }
:where(html body[data-view="volcano"] #properties>.intro) { color: #fff !important; }
@media (min-width:801px) {
:where(html body #properties article.card[data-property-type]) { padding: 7px !important; }
}
:where(html body[data-view="volcano"] #properties>.intro>p) { color: #fff !important; }
@media (min-width:801px) {
:where(#properties article.card[data-property-type]>.property-expand) { grid-template-columns: none !important; }
}
:where(html body[data-view="volcano"] #properties .property-photo-facts .price) { margin-top: 0 !important; margin-bottom: 0 !important; }
:where(html body[data-view="volcano"] #properties .property-actions>:is(a.btn,button.property-share)) { margin: 0 !important; }
:where(html body[data-view="volcano"] #properties>.intro>.catalog-title-row>h2) { color: #fff !important; }
@media (min-width:801px) {
:where(#properties article.card[data-property-type]~article.card[data-property-type]) { width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
}
:where(html body[data-view="volcano"] #properties>.intro>.catalog-title-row>.eyebrow) { color: #fff !important; }
@media (min-width:801px) {
:where(html body #properties #propertyFilterCount) { grid-column: 1 !important; grid-row: 3 !important; margin: 0 !important; }
}
:where(html body[data-view="volcano"] #properties .property-row-summary) { color: #fff !important; }
:where(html body[data-view="volcano"] #properties .property-expanded-content) { color: #fff !important; }
:where(html body[data-view="volcano"] #properties .card-copy) { color: #fff !important; }
:where(html body[data-view="volcano"] #properties .house-description) { color: #fff !important; }
:where(html body[data-view="volcano"] #properties .mobile-property-photo-title) { background: transparent !important; }
:where(html body[data-view="volcano"] #properties .property-photo-facts) { background: transparent !important; }
:where(html body[data-view="volcano"] #properties :is(.property-number,.mobile-property-photo-title,.property-photo-facts,.property-photo-facts strong,.price,.price span,.meta,.property-row-title)) { color: #fff !important; }
:where(html body[data-view="volcano"] #properties article.card[data-property-type]) { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }
:where(html body[data-view="volcano"] #properties article.card>.property-expand) { color: #fff !important; }
:where(html body[data-view="volcano"] #properties article.card[data-property-type]~article.card[data-property-type]) { background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; padding: 0 !important; border-radius: 0 !important; }
:where(body :is(a.btn,button.property-share,a.property-return,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a[data-t="backHome"])) { padding: 6px 14px !important; min-height: 34px !important; height: auto !important; font-size: 13px !important; line-height: 1.4 !important; box-sizing: border-box !important; }
@media (max-width:800px) {
:where(html body>header) { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; flex-wrap: nowrap !important; gap: 5px !important; height: 70px !important; min-height: 70px !important; max-height: 70px !important; padding: 2px 2% !important; }
}
@media (max-width:800px) {
:where(html body>header>a.brand-logo) { display: flex !important; align-items: center !important; justify-content: flex-start !important; flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; max-width: none !important; height: 66px !important; min-height: 66px !important; max-height: 66px !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; }
}
@media (max-width:800px) {
:where(html body>header>div.site-menu-row) { justify-content: flex-end !important; margin: 0 !important; padding: 0 !important; }
}
@media (max-width:800px) {
:where(html body>header>a.brand-logo>img) { display: block !important; width: 100% !important; height: 100px !important; min-height: 0 !important; max-height: 100px !important; object-fit: contain !important; object-position: left center !important; transform: none !important; }
}
@media (max-width:800px) {
:where(html body .header-home>span[data-t]) { display: none !important; }
}
@media (max-width:800px) {
:where(html body .header-home>span[aria-hidden]) { display: inline !important; }
}
:where(html body[data-view="volcano"] #properties #fincaTurrialba .property-photo-facts>p[data-t="fincaFrom"]) { color: #fff !important; }
@media (max-width:800px) {
:where(html body #lang>span) { display: none !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuToggle>span[data-t]) { display: none !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuToggle>span[aria-hidden]) { display: inline !important; }
}
@media (max-width:800px) {
:where(html body>header>div.site-menu-row) { display: flex !important; flex-direction: row !important; align-items: center !important; gap: 4px !important; flex: 0 0 auto !important; width: auto !important; }
}
@media (max-width:800px) {
:where(html body .header-home>span[aria-hidden]) { font-size: 17px !important; line-height: 20px !important; }
}
@media (max-width:800px) {
:where(html body #lang):after { font-size: 11px !important; line-height: 20px !important; }
}
@media (max-width:800px) {
:where(html body>header #siteMenuPanel) { position: absolute !important; top: calc(100% + 5px) !important; right: calc(2% + 44px) !important; left: auto !important; width: max-content !important; min-width: 0 !important; max-width: calc(100vw - 16px) !important; margin: 0 !important; padding: 6px !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuPanel nav) { display: flex !important; flex-direction: column !important; align-items: stretch !important; width: max-content !important; max-width: 100% !important; gap: 0 !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuPanel nav a) { display: flex !important; width: 100% !important; min-width: 0 !important; min-height: 34px !important; height: auto !important; margin: 0 !important; padding: 6px 8px !important; font-size: 13px !important; line-height: 1.4 !important; gap: 6px !important; white-space: nowrap !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuPanel .site-menu-icon) { width: 19px !important; height: 19px !important; flex: 0 0 19px !important; font-size: 15px !important; border: 0 !important; background: none !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuPanel :is(.site-menu-arrow,.menu-arrow)) { display: none !important; }
}
@media (max-width:800px) {
:where(html body #siteMenuToggle>span[aria-hidden]) { font-size: 17px !important; line-height: 20px !important; }
}
@media (max-width:800px) {
:where(html body>header>div.site-menu-row>:is(a.header-home,button#siteMenuToggle,button#lang)) { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 30px !important; min-width: 30px !important; max-width: 30px !important; height: 30px !important; min-height: 30px !important; max-height: 30px !important; padding: 3px !important; font-size: 0 !important; line-height: 20px !important; gap: 0 !important; }
}
@media (max-width:800px) {
:where(html body>header>div.site-menu-row>button#lang) { width: 40px !important; min-width: 40px !important; max-width: 40px !important; }
}
:where(html body :is(button.photo-zoom-trigger,button[id$="Prev"],button[id$="Next"],a.video-direct-link,a.btn,button.property-share,a.property-return,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a, .gallery-controls button,.gallery-arrows button,.persistent-wa,dialog button,dialog a[id*="Whats"],#catalogBackTop)) { touch-action: manipulation !important; }
:where(html body :is(button.photo-zoom-trigger,button[id$="Prev"],button[id$="Next"],a.video-direct-link,a.btn,button.property-share,a.property-return,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a, .gallery-controls button,.gallery-arrows button,.persistent-wa,dialog button,dialog a[id*="Whats"],#catalogBackTop):focus-visible) { outline: 2px solid #debc76 !important; outline-offset: 3px !important; }
:where(html body>header) { background-color: #f3eddb !important; background-image: url("/assets/banner-volcan-ilustrado-20261017.png") !important; background-size: cover !important; background-position: center 23% !important; background-repeat: no-repeat !important; }
:where(.catalog-menu.property-active) { display: grid !important; grid-template-columns: minmax(0,1fr) minmax(0,460px) !important; gap: 10px 32px !important; }
:where(.catalog-menu>.property-band-return) { display: inline-flex !important; align-items: center !important; justify-content: center !important; box-sizing: border-box !important; width: max-content !important; max-width: 100% !important; height: 34px !important; padding: 6px 14px !important; font: 700 13px/1.4 Arial,sans-serif !important; text-decoration: none !important; }
@media (max-width:800px) {
:where(.catalog-menu.property-active) { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 12px 8px !important; padding-top: 18px !important; padding-bottom: 18px !important; align-items: start !important; }
}
@media (max-width:800px) {
:where(.catalog-menu.property-active>a) { align-self: start !important; justify-self: start !important; max-width: 100% !important; width: max-content !important; height: 34px !important; padding: 6px 10px !important; font: 700 clamp(10px,3vw,12px)/1.4 Arial,sans-serif !important; white-space: nowrap !important; }
}
:where(.catalog-menu>.property-band-return[hidden]) { display: none !important; }
@media (max-width:800px) {
:where(.catalog-menu.property-active>.property-band-return) { grid-column: 2 !important; grid-row: 2 !important; justify-self: end !important; }
}
@media (max-width:800px) {
:where(.catalog-menu.property-active>.zone-buttons) { grid-column: 1 / -1 !important; grid-row: 1 !important; margin-top: 0 !important; gap: 12px !important; }
}
@media (max-width:800px) {
:where(.catalog-menu.property-active>a:not(.property-band-return)) { grid-column: 1 !important; grid-row: 2 !important; }
}
:where(#properties .grid) { gap: 20px !important; align-items: start !important; }
:where(#properties .mobile-property-photo-title) { font-size: 18px !important; line-height: 1.25 !important; padding: 0 !important; margin: 0 !important; min-height: 0 !important; }
:where(#properties .property-row-summary) { gap: 10px !important; padding-top: 12px !important; }
:where(#properties .property-actions) { gap: 8px !important; margin-top: 10px !important; }
:where(#properties .property-row-summary>img) { display: block !important; width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; aspect-ratio: 4/3 !important; object-fit: contain !important; background: #082620 !important; }
@media (min-width:801px) {
:where(#properties>.grid) { gap: 16px !important; align-items: stretch !important; }
}
@media (min-width:801px) {
:where(#properties .property-row-summary) { padding: 10px 10px 4px !important; }
}
@media (min-width:801px) {
:where(#properties .property-number) { font-size: 10px !important; line-height: 1.2 !important; margin: 0 0 3px !important; }
}
@media (min-width:801px) {
:where(#properties .mobile-property-photo-title) { font-size: 17px !important; line-height: 1.2 !important; min-height: 41px !important; margin: 0 0 7px !important; }
}
@media (min-width:801px) {
:where(#properties .property-photo-facts) { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; padding: 7px 0 2px !important; min-height: 48px !important; }
}
@media (min-width:801px) {
:where(#properties .property-expanded-content) { padding: 0 10px 10px !important; flex: 1 !important; display: flex !important; flex-direction: column !important; }
}
@media (min-width:801px) {
:where(#properties .card-copy) { display: flex !important; flex-direction: column !important; flex: 1 !important; }
}
@media (min-width:801px) {
:where(#properties .property-actions) { gap: 6px !important; margin-top: auto !important; padding-top: 3px !important; }
}
@media (max-width:800px) {
:where(#properties>.grid) { gap: 14px !important; }
}
@media (max-width:800px) {
:where(#properties .property-row-summary) { padding: 10px 10px 4px !important; }
}
@media (max-width:800px) {
:where(#properties .property-number) { font-size: 11px !important; line-height: 1.3 !important; margin: 0 0 3px !important; }
}
@media (max-width:800px) {
:where(#properties .mobile-property-photo-title) { font-size: 18px !important; line-height: 1.2 !important; margin: 0 0 7px !important; min-height: 0 !important; }
}
@media (max-width:800px) {
:where(#properties .property-photo-facts) { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; padding: 7px 0 2px !important; min-height: 44px !important; }
}
@media (max-width:800px) {
:where(#properties .property-expanded-content) { padding: 0 10px 10px !important; }
}
@media (max-width:800px) {
:where(#properties .property-actions) { gap: 6px !important; margin-top: 4px !important; }
}
@media (min-width:801px) {
:where(#properties .property-row-summary>img) { aspect-ratio: 16/9 !important; object-fit: contain !important; width: 100% !important; height: auto !important; }
}
@media (min-width:801px) {
:where(#properties .property-photo-facts>strong) { font-size: 14px !important; line-height: 1.2 !important; flex: 1 1 auto !important; }
}
@media (min-width:801px) {
:where(#properties .property-photo-facts>p) { font-size: 15px !important; line-height: 1.25 !important; margin: 0 !important; text-align: right !important; }
}
@media (min-width:801px) {
:where(#properties .property-actions>a) { height: 30px !important; min-height: 30px !important; padding: 4px 8px !important; font-size: 12px !important; line-height: 1.15 !important; }
}
@media (min-width:801px) {
:where(#properties .property-actions>button) { height: 30px !important; min-height: 30px !important; padding: 4px 8px !important; font-size: 12px !important; line-height: 1.15 !important; }
}
@media (max-width:800px) {
:where(#properties .property-row-summary>img) { aspect-ratio: 16/9 !important; object-fit: contain !important; width: 100% !important; height: auto !important; }
}
@media (max-width:800px) {
:where(#properties .property-photo-facts>strong) { font-size: 14px !important; line-height: 1.2 !important; flex: 1 1 36% !important; min-width: 0 !important; width: auto !important; }
}
@media (max-width:800px) {
:where(#properties .property-photo-facts>p) { font-size: 15px !important; line-height: 1.25 !important; margin: 0 !important; text-align: right !important; flex: 0 1 60% !important; }
}
@media (max-width:800px) {
:where(#properties .property-actions>a) { height: auto !important; min-height: 38px !important; padding: 7px 10px !important; font-size: 13px !important; line-height: 1.2 !important; }
}
@media (max-width:800px) {
:where(#properties .property-actions>button) { height: auto !important; min-height: 38px !important; padding: 7px 10px !important; font-size: 13px !important; line-height: 1.2 !important; }
}
@media (min-width:801px) {
:where(#properties .property-photo-facts>.price) { font-size: 18px !important; line-height: 1.2 !important; text-align: right !important; flex: 0 1 auto !important; margin: 0 !important; }
}
@media (min-width:801px) {
:where(#properties .card-copy>.meta) { font-size: 11px !important; line-height: 1.3 !important; margin: 0 0 5px !important; }
}
@media (max-width:800px) {
:where(#properties .property-photo-facts>.price) { font-size: 18px !important; line-height: 1.2 !important; text-align: right !important; flex: 0 1 64% !important; min-width: 0 !important; width: auto !important; margin: 0 !important; }
}
@media (max-width:800px) {
:where(#properties .card-copy>.meta) { font-size: 11px !important; line-height: 1.3 !important; margin: 0 0 5px !important; }
}
@media (min-width:801px) {
:where(#properties article.card>.property-expand) { height: 100% !important; display: flex !important; flex-direction: column !important; }
}
@media (min-width:801px) {
:where(#properties .property-photo-facts>.price .currency-secondary) { font-size: 11px !important; line-height: 1.3 !important; }
}
@media (max-width:800px) {
:where(#properties .property-photo-facts>.price .currency-primary) { white-space: normal !important; }
}
@media (max-width:800px) {
:where(#properties .property-photo-facts>.price .currency-secondary) { font-size: 11px !important; line-height: 1.3 !important; white-space: normal !important; }
}
:where(html body) { position: relative !important; isolation: isolate !important; background: #e9eee4 !important; min-height: 100vh !important; }
:where(html body footer) { background: linear-gradient(120deg,#153c32,#09271f) !important; border-top: 1px solid rgba(224,199,143,.35) !important; }
:where(html body .hero .zone-buttons>.btn) { min-height: 44px !important; font-size: 14px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 10px 16px !important; }
@media (max-width:800px) {
:where(html body .hero .zone-buttons>.btn) { font-size: 13px !important; padding: 9px 12px !important; }
}
:where(html body #attractions) { border-radius: 14px !important; box-shadow: var(--forest-shadow) !important; }
:where(html body :is(a.btn,button.property-share,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a,.persistent-wa,#catalogBackTop,dialog button,dialog .btn)) { background: linear-gradient(155deg,var(--button-top),var(--button-bottom)) !important; color: #fff !important; border: 1px solid #ccb37c !important; border-radius: 8px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.24),0 3px 0 var(--button-base),0 6px 14px rgba(3,22,15,.24) !important; font-family: Arial,sans-serif !important; font-weight: 600 !important; text-shadow: 0 1px 1px rgba(0,0,0,.14) !important; transform: translateY(0) !important; filter: none !important; transition: background .18s ease,box-shadow .18s ease,transform .18s ease,border-color .18s ease !important; }
:where(html body #siteMenuPanel) { border: 1px solid rgba(207,182,126,.45) !important; border-radius: 12px !important; background: #102f28 !important; box-shadow: 0 18px 42px rgba(0,20,14,.28) !important; }
:where(html body #property-range-summary) { background: linear-gradient(100deg,#f6f5ed 0%,#e8d7ab 48%,#b18c48 100%) !important; border-top: 1px solid #e4d2a8 !important; border-bottom: 1px solid #bfa467 !important; }
@media (prefers-reduced-motion:reduce) {
:where(html body :is(a.btn,button.property-share,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a,.persistent-wa,#catalogBackTop)) { transition: none !important; transform: none !important; }
}
:where(html body :is(#area,#nature,#about) img) { border-radius: 8px !important; }
:where(html body #siteMenuPanel nav) { background: transparent !important; }
:where(html body #contact select) { color: #fff !important; background: #173e34 !important; border: 1px solid #6f8e78 !important; border-radius: 8px !important; padding: 12px !important; min-height: 46px !important; }
:where(html body #siteMenuPanel nav a) { color: #f2f7ef !important; border-bottom-color: rgba(255,255,255,.12) !important; }
:where(html body #contact select option) { background: #173e34 !important; color: #fff !important; }
:where(html body :is(#area,#nature,#about,.video-section,.owner-invitation-box,.catalog-contact-intro) .eyebrow) { letter-spacing: .14em !important; color: #e3c995 !important; }
:where(html body #area .facts) { border-top-color: rgba(224,199,143,.22) !important; }
:where(html body #properties :is(.property-row-summary,.property-expanded-content,.card-copy,.house-description)) { background: transparent !important; }
:where(html body #properties .property-photo-facts) { border-top-color: rgba(224,199,143,.18) !important; }
:where(html body #properties .property-number) { letter-spacing: .08em !important; }
:where(html body #properties>.intro) { background: var(--forest-surface) !important; border: 0 !important; border-radius: 12px !important; box-shadow: var(--forest-shadow) !important; }
:where(html body #properties .property-type-filter) { background: rgba(246,248,241,.92) !important; border: 1px solid rgba(44,81,61,.12) !important; border-radius: 12px !important; box-shadow: 0 6px 18px rgba(10,36,28,.06) !important; }
:where(html body :is(a.btn,button.property-share,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a,.persistent-wa,#catalogBackTop):focus-visible) { outline: 3px solid #f3d9a2 !important; outline-offset: 4px !important; }
:where(html body :is(a.btn,button.property-share,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a,.persistent-wa,#catalogBackTop):active) { transform: translateY(2px) !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.18),0 1px 0 var(--button-base),0 3px 7px rgba(3,22,15,.16) !important; }
:where(html body #siteMenuPanel .site-menu-icon) { color: #e3c995 !important; }
:where(html body #siteMenuPanel .site-menu-arrow) { color: #e3c995 !important; }
@media (hover:hover) {
:where(html body :is(a.btn,button.property-share,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a,.persistent-wa,#catalogBackTop):hover) { transform: translateY(-1px) !important; border-color: #efd59a !important; filter: brightness(1.055) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.3),0 4px 0 var(--button-base),0 10px 20px rgba(3,22,15,.25) !important; }
}
@media (hover:hover) {
:where(html body :is(a.btn,button.property-share,.header-control,.lang,#siteMenuToggle,button[data-property-filter],.catalog-menu>a,.persistent-wa,#catalogBackTop):active) { transform: translateY(2px) !important; box-shadow: inset 0 1px 2px rgba(0,0,0,.18),0 1px 0 var(--button-base),0 3px 7px rgba(3,22,15,.16) !important; }
}
:where(html body :is(#area,#nature,#about,.video-section,.owner-invitation-box,.catalog-contact-intro,#contact>.contact-box,#contact>div:first-child)) { background: var(--forest-surface) !important; color: #fff !important; border: 0 !important; border-radius: 14px !important; box-shadow: var(--forest-shadow) !important; }
:where(html body :is(#area,#nature,#about,.video-section,.owner-invitation-box,.catalog-contact-intro,#contact>.contact-box) h2) { letter-spacing: -.025em !important; }
:where(html body #properties .property-row-summary>img) { border-radius: 6px !important; }
:where(html body #contact select:focus-visible) { outline: 3px solid #e3c995 !important; outline-offset: 3px !important; }
:where(html body #property-range-summary>div:last-child) { color: #12372e !important; }
@media (max-width:800px) {
:where(html body :is(#area,#nature,#about,.video-section,.owner-invitation-box,.catalog-contact-intro,#contact>.contact-box,#contact>div:first-child)) { border-radius: 12px !important; }
}
:where(html body #siteMenuPanel nav a:hover) { background: #214e3e !important; }
:where(html body #property-range-summary>div:last-child b) { color: #12372e !important; }
:where(html body #properties article.card>.property-expand) { background: var(--forest-surface) !important; border: 0 !important; border-radius: 12px !important; box-shadow: 0 8px 22px rgba(7,33,26,.14),inset 0 1px 0 rgba(255,255,255,.07) !important; overflow: hidden !important; }
:where(html body #properties button[data-property-filter][aria-pressed="true"]) { color: #14382e !important; text-shadow: none !important; }

/* Mobile navigation scrolls the content element, not Safari's root viewport.
   Keeping the root geometry stable avoids a scroll/layout race on entry. */
@media (max-width: 800px) {
  html {
    height: 100% !important;
    overflow: hidden !important;
    scrollbar-gutter: auto;
  }
  html body {
    box-sizing: border-box;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scroll-behavior: auto !important;
    scroll-padding-top: 70px;
    overscroll-behavior-y: contain;
  }
}