/* The site's typeface is the system's: system-ui (Segoe UI on Windows, Roboto on
   Android, San Francisco on Apple). Served UI fonts were measured twice and dropped:
   Inter on the blog (v0.16, Lighthouse mobile 97 -> 81-83) and Plus Jakarta Sans for
   the availability redesign (v0.17: 94 -> 80 on the homepage, 84 -> 67 on a property
   page). A local() face, ArkadiaUI = local("Inter"),local("Segoe UI"), went too
   (2026-10-01): matching it doubled the layout time of every page on load, and it
   failed on phones anyway. It made Windows draw every bold as a synthetic bold of
   Segoe UI Regular; the weights stop at 600 (Semibold), the closest real face, so
   Windows keeps that look: 500 is drawn as 400 and 650-900 as 600. */
/* What every page shares: the tokens, the base, the header, the footer, the cookie
   banner and dialog, the floating WhatsApp button and the mobile bar, and the small
   pieces several page types use (breadcrumbs, notices, the legal and error pages, the
   Google map band of the collection page and a flat's page, the guests' review card).
   Each page type's own rules live in its own file, loaded after this one:
   home-v2.css, hub.css, apartment.css, availability.css, reviews.css and blog.css. Until 2026-10-09 this file held them
   all: 118 KB of render-blocking CSS on every page, about 90% of it unused on the home
   page (PageSpeed Insights, 2026-10-08). */
:root{--ink:#102131;--muted:#607181;--navy:#0d1d29;--green:#187b58;--green2:#0f6547;--blue:#5e78a8;--paper:#f7f8f6;--white:#fff;--line:#dfe6e3;--soft:#edf3f0;--shadow:0 22px 60px rgba(15,29,41,.11);--r:28px;--wrap:1180px;--ink-2:#4d5f70;--line-2:#e1e8e4;--green-soft:#e3f1ea;--green-text:#0f5f41;--ok-bg:#e6f4ec;--ok-dot:#1a9a64;--warn-bg:#fdf1dc;--warn-text:#7a4b00;--warn-dot:#c27a00;--warn-box-bg:#fff8ec;--warn-box-line:#f1dcb2;--busy-bg:#eef1f4;--busy-text:#3d4f60;--chip-bg:#f1f5f3;--shadow-bar:0 18px 50px rgba(15,29,41,.08);--shadow-card:0 1px 2px rgba(15,29,41,.04);--shadow-card-hover:0 14px 40px rgba(15,29,41,.09);--bar-h:65px}
*{box-sizing:border-box}b,strong,th,h1,h2,h3,h4,h5,h6{font-weight:600}html{scroll-behavior:smooth;scrollbar-gutter:stable}body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.wrap{width:min(var(--wrap),calc(100% - 36px));margin:auto}.skip{position:fixed;z-index:100;top:8px;left:8px;transform:translateY(-150%);padding:10px 14px;background:#fff;border-radius:10px}.skip:focus{transform:none}.header{position:sticky;top:0;z-index:50;background:rgba(247,248,246,.93);backdrop-filter:blur(18px);border-bottom:1px solid rgba(16,33,49,.08)}.nav{height:76px;display:flex;align-items:center;gap:28px}.brand img{width:126px;height:58px;object-fit:contain}.navlinks{display:flex;align-items:center;gap:15px;margin-left:auto;font-size:.9rem;font-weight:600}.navlinks a:hover{color:var(--green)}.nav-actions{display:flex;gap:8px}.navlinks a,.nav-actions .btn{white-space:nowrap}.btn{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:0 20px;font-weight:600;cursor:pointer}.btn-primary{background:var(--green);color:#fff}.btn-primary:hover{background:var(--green2)}.btn-dark{background:var(--navy);color:#fff}.btn-light{background:#fff;color:var(--ink);border:1px solid var(--line)}.hero{position:relative;min-height:720px;display:grid;align-items:end;background:#0c1c28;color:#fff;overflow:hidden}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,15,22,.88) 0%,rgba(5,15,22,.63) 50%,rgba(5,15,22,.16) 100%),linear-gradient(0deg,rgba(5,15,22,.75),transparent 55%)}.eyebrow{text-transform:uppercase;letter-spacing:.17em;font-size:.75rem;font-weight:600;color:#9bd6bd;margin:0 0 14px}.hero h1,.section h2,.property-hero h1{font-size:clamp(2.7rem,6vw,5.8rem);line-height:1.01;letter-spacing:-.035em;margin:0;text-wrap:balance}.hero p{max-width:680px;color:#d8e3e7;font-size:1.08rem}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.field{display:grid;gap:5px;padding:6px 12px}.field label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;color:var(--muted)}.field input,.field select{border:0;background:transparent;outline:0;color:var(--ink);min-width:0}.section{padding:96px 0}.section h2{font-size:clamp(2.2rem,4vw,4rem);max-width:800px;letter-spacing:-.02em}.kicker{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:600;color:var(--green)}.panel{border-radius:var(--r);padding:42px;background:#fff;border:1px solid var(--line)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.step{padding:26px;border-radius:20px;border:1px solid var(--line);background:#fff}.faq{display:grid;gap:8px}.faq summary{font-weight:600;cursor:pointer}.mobile-bar{display:none}.wa-float{position:fixed;z-index:40;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:#167c58;color:#fff;display:grid;place-items:center;font-weight:600;box-shadow:0 12px 30px rgba(0,0,0,.2)}
/* A WhatsApp link standing in for the booking request on a property page has
   no href, so it gets back what a link or a button has: the hand, and no text
   selection on a double tap. */
[data-whatsapp-request]{cursor:pointer;-webkit-user-select:none;user-select:none}
.page-hero{padding:78px 0 54px;background:#fff}.page-hero h1{font-size:clamp(2.8rem,5vw,5rem);letter-spacing:-.035em;line-height:1;margin:0}.page-hero p{max-width:680px;color:var(--muted);font-size:1.05rem}.status.available{background:#e5f4ec;color:#116243}.status.needs_confirmation{background:#fff3d8;color:#775313}.notice{padding:14px 16px;border-radius:14px;background:#eef3f1;color:#345064;font-size:.9rem}.error{background:#fff0ee;color:#8d3329}
/* <picture> must not become a layout box: .property-photo img and .hero-media img
   use height:100%, which would resolve against the picture instead of the grid
   item and collapse to intrinsic height. The mosaic tiles give theirs a box of
   its own instead (.gallery-tile picture). */
picture{display:contents}
@media(max-width:980px){.navlinks{display:none}}
@media(max-width:680px){.wrap{width:min(100% - 24px,var(--wrap))}.nav{height:66px}.brand img{width:106px}.nav-actions .btn-light{display:none}.hero{min-height:680px}.hero h1{font-size:3.2rem}.section{padding:68px 0}.steps{grid-template-columns:1fr}.wa-float{display:none}.mobile-bar{position:fixed;z-index:60;left:0;right:0;bottom:0;display:grid;grid-template-columns:1.4fr 1fr;gap:8px;padding:9px 10px;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);border-top:1px solid var(--line)}.mobile-bar .btn{min-height:46px;padding:0 10px;font-size:.78rem}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.lang-switch{font-size:.8rem;font-weight:600;padding:8px 10px;border-radius:999px;border:1px solid var(--line);background:#fff}.cookie-banner{position:fixed;z-index:95;left:18px;right:18px;bottom:18px;margin:auto;max-width:960px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:20px;padding:18px;display:flex;align-items:center;justify-content:space-between;gap:20px;max-height:calc(100vh - 36px);max-height:calc(100svh - 36px);overflow-y:auto;overscroll-behavior:contain}.cookie-banner p{margin:5px 0 0;color:var(--muted);font-size:.88rem;max-width:600px}.cookie-actions{display:flex;gap:8px;flex-wrap:wrap}.cookie-actions .btn{min-height:42px;padding:0 14px;font-size:.78rem}.cookie-link{display:inline;min-height:0;border:0;background:none;padding:0;margin:0;font:inherit;font-weight:600;color:var(--green);text-decoration:underline;cursor:pointer}.cookie-banner p a,.cookie-link{position:relative;white-space:nowrap}.cookie-banner p a::after,.cookie-link::after{content:"";position:absolute;inset:-7px -3px}:root.cookie-open{scroll-padding-bottom:calc(var(--cookie-h,140px) + 26px)}html.cookie-open .site-footer::after{content:"";display:block;height:calc(var(--cookie-h,140px) + 26px)}.cookie-dialog{border:0;border-radius:22px;width:min(520px,calc(100vw - 28px));padding:26px;box-shadow:var(--shadow)}.cookie-dialog::backdrop{background:rgba(13,29,41,.55)}.cookie-dialog h2{margin-top:0}.dialog-x{position:absolute;right:14px;top:12px;border:0;background:transparent;font-size:28px;cursor:pointer}.consent-row{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-top:1px solid var(--line)}.consent-row input{width:20px;height:20px}
@media(max-width:680px){.cookie-banner{bottom:calc(var(--bar-h) + 13px);display:block}.cookie-banner{left:8px;right:8px;padding:12px;border-radius:16px;max-height:calc(100vh - var(--bar-h) - 87px);max-height:calc(100svh - var(--bar-h) - 87px)}.cookie-banner.cookie-low{bottom:8px}.cookie-banner .cookie-title{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.cookie-banner p{margin:0;color:var(--ink);max-width:none}.cookie-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin-top:10px}.cookie-actions .btn{min-height:44px;padding:6px 10px;font-size:.875rem;line-height:1.2;white-space:normal;text-align:center;overflow-wrap:break-word}:root.cookie-open{scroll-padding-bottom:calc(var(--cookie-h,140px) + var(--bar-h) + 21px)}html.cookie-open .site-footer::after{height:calc(var(--cookie-h,140px) + var(--bar-h) + 21px)}.lang-switch{margin-left:auto}.nav-actions{gap:5px}}

/* ---- v0.14: accessibility, navigation, booking states, property & legal pages ---- */
:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.hero :focus-visible,.lightbox :focus-visible,.faq2-help :focus-visible{outline-color:#9bd6bd}
.field{border-radius:14px}
.field:has(:focus-visible){box-shadow:inset 0 0 0 2px var(--green)}
.field input:focus-visible,.field select:focus-visible{outline:2px solid var(--green);outline-offset:4px;border-radius:6px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.btn:disabled,.btn[aria-busy=true]{opacity:.65;cursor:progress}
.nav{position:relative}
.navlinks a[aria-current=page]{color:var(--green)}
.nav-toggle{display:none;min-height:40px;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:0 14px;font-weight:600;font-size:.82rem;cursor:pointer}
.lang-switch:hover{border-color:var(--green);color:var(--green)}
.notice a{font-weight:600;text-decoration:underline}
.notice.ok{background:#e5f4ec;color:#116243}
.notice.warn{background:#fff3d8;color:#775313}
.lead-status{margin-top:10px}
.alt-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.alt-list li{display:flex;flex-direction:column;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fff}
.alt-list a{font-weight:600}.alt-list span{font-size:.82rem;color:var(--muted)}
.breadcrumbs{background:#fff;padding-top:20px;font-size:.84rem;color:var(--muted)}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0}
.breadcrumbs li:not(:last-child)::after{content:"\203A";margin-left:6px;color:#9aa8b2}
.breadcrumbs a{color:var(--green);font-weight:600}
.legal-doc{max-width:820px}
.section .legal-doc h2{font-size:1.45rem;letter-spacing:-.02em;margin:38px 0 10px}
.legal-doc h3{font-size:1.08rem;margin:22px 0 6px}
.legal-doc p,.legal-doc li{color:#34495a}
.legal-doc ul{padding-left:20px}.legal-doc li{margin:4px 0}
.legal-doc a{color:var(--green);font-weight:600;text-decoration:underline}
.legal-doc a.btn{text-decoration:none;color:#fff}
.legal-doc code{background:var(--soft);padding:2px 6px;border-radius:6px;font-size:.88em}
/* The space above a legal document, under its heading (was an inline style, B10). */
.section.legal-section{padding-top:34px}
/* The home page's links out (2026-10-04, docs/redesign/analiza-seo-prelansare-2026-10-04.md §3.1):
   a section head's link to the collection page or the blog, the guides' cards
   (the title, then the figure the guide leads with), the business panel's
   tagline under its heading, the medical panel's two actions (the guide, then
   the search) and the FAQ panel's heading. */
.guides{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.guide{display:flex;flex-direction:column;gap:10px;height:100%;padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--paper);transition:border-color .2s}
.guide:hover{border-color:var(--green)}
@media(max-width:980px){.guides{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.guides{grid-template-columns:1fr}}
.table-wrap{overflow-x:auto;margin:14px 0}
.legal-doc table{width:100%;border-collapse:collapse;font-size:.9rem;background:#fff}
.legal-doc th,.legal-doc td{border-bottom:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top}
.legal-doc th{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.draft-banner{padding:16px 18px;border-radius:16px;background:#fff3d8;color:#5d420f;border:1px solid #f0dca8;margin:0 0 26px}
.draft-banner b{display:block}
.doc-meta{color:var(--muted);font-size:.88rem}
.error-page .hero-actions{margin-top:22px}
.error-alt{margin-top:44px;padding-top:26px;border-top:1px solid var(--line);max-width:680px}
.error-alt h2{font-size:1.6rem;margin:0 0 6px}
.error-links{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:10px}.error-links a{color:var(--green);font-weight:600}
.cookie-title{font-size:1rem;margin:0}
.cookie-banner p a,.consent-intro a{color:var(--green);font-weight:600;text-decoration:underline}
.consent-intro{color:var(--muted);font-size:.9rem}
.consent-row{align-items:flex-start;gap:16px}
.consent-row label{cursor:pointer}
.consent-row p{margin:4px 0 0;font-size:.84rem;color:var(--muted)}
.consent-row input{flex:none;margin-top:3px}
.consent-meta{font-size:.78rem;color:var(--muted);margin:4px 0 0}.consent-meta:empty{display:none}
.dialog-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:14px;padding-top:16px;border-top:1px solid var(--line)}
.btn-call{white-space:nowrap}.btn-call svg{flex:none;color:var(--green)}
@media(max-width:1200px){.nav{gap:18px}.navlinks{gap:16px}.nav-actions .btn-light{display:none}}
@media(min-width:681px) and (max-width:1200px){.nav-actions .btn-call{display:inline-flex;width:48px;padding:0}.btn-call .btn-call-num{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}}
@media(max-width:1040px){.navlinks{gap:12px}}
@media(max-width:980px){.nav-toggle{display:inline-flex;margin-left:auto}.header.nav-open .navlinks{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;margin:0;padding:6px 18px 12px;background:#fff;border:1px solid var(--line);border-top:0;border-radius:0 0 18px 18px;box-shadow:var(--shadow)}.header.nav-open .navlinks a{padding:13px 2px;border-bottom:1px solid var(--line)}.header.nav-open .navlinks a:last-child{border-bottom:0}}
@media(max-width:680px){.nav{gap:10px}.nav-actions{display:none}.lang-switch{margin-left:0}.dialog-actions .btn{flex:1}}
@media(min-width:681px){.cookie-banner>div:first-child{flex:1;min-width:0}.cookie-actions{flex:none;flex-wrap:nowrap}}
/* On computers the banner sits bottom left, at most 600px wide (52% of the screen on narrower ones), the buttons
   under the words: centred and 960px wide, it covered a flat's booking card, its price and dates, on 1280-1920px
   screens (owner, 2026-10-11). Phones keep their own layout. */
@media(min-width:681px){.cookie-banner{right:auto;margin:0;max-width:min(600px,52vw);display:block}.cookie-actions{margin-top:12px}}
.field:has(input[type=date]:focus-within){box-shadow:inset 0 0 0 2px var(--green)}
/* ---- header brand lockup: logo mark + ARKADIA / Apartments wordmark ---- */
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:75px;height:40px}
.brand-word{display:grid;line-height:1}
.brand-word b{font-size:1.1rem;font-weight:600;letter-spacing:.15em;color:var(--ink)}
.brand-word span{margin-top:4px;font-size:.62rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
@media(max-width:680px){.brand{gap:8px}.brand img{width:60px;height:32px}.brand-word b{font-size:.98rem;letter-spacing:.12em}.brand-word span{margin-top:3px;font-size:.55rem;letter-spacing:.18em}}
.eyebrow.on-light{color:var(--green)}
/* A link to a section of the page (the home page's #zone, #business, #despre)
   lands with room above it: a phone's header is as tall as the section's top
   padding, which left the eyebrow touching it. :where() keeps the rules above. */
:where(main>section[id]){scroll-margin-top:24px}
/* Guest review excerpts; absent until real ones are entered in /admin. */
.reviews{border:1px solid var(--line);border-radius:20px;padding:18px;background:#fbfcfb}

/* ---- v0.16: Footer v2 ---- */
/* One footer for every page, the blog's included (Shell, partials/footer.php):
   a closing call to action, then the brand, the apartments, "explore" and contact,
   the legal bar, and a large faded ARKADIA as a signature. It takes over from the
   dark "Rezervare directă" panel that used to end the collection page. It starts
   square, straight under the section above.
   Everything is prefixed .ft-, apart from .site-footer itself. */
.site-footer{--ft-line:rgba(255,255,255,.10);--ft-text:#c9d5da;--ft-muted:#8ea2ad;--ft-accent:#9bd6bd;position:relative;isolation:isolate;overflow:hidden;padding:76px 0 0;background:radial-gradient(900px 420px at 8% -12%,rgba(24,123,88,.30),transparent 62%),radial-gradient(700px 380px at 100% 0%,rgba(94,120,168,.16),transparent 65%),var(--navy,#0d1d29);color:var(--ft-text);font-size:15px;line-height:1.55}
.site-footer a{color:inherit;text-decoration:none}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer :focus-visible{outline:2px solid var(--ft-accent);outline-offset:3px;border-radius:8px}
.site-footer svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
/* 1. The closing call to action; not on the availability page (footerCta:false). */
.ft-cta{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:end;padding-bottom:56px;border-bottom:1px solid var(--ft-line)}
.ft-cta .eyebrow{margin:0 0 16px}
.ft-title{margin:0 0 16px;color:#fff;font-size:clamp(2rem,3.7vw,3.3rem);line-height:1.02;letter-spacing:-.02em;font-weight:600;text-wrap:balance}
.ft-title span{display:block;color:var(--ft-accent)}
.ft-lead{margin:0;max-width:50ch;color:var(--ft-text);font-size:1rem}
.ft-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:12px}
/* .site-footer a would pass the footer's grey to the button: 3.5:1 on green. */
.ft-actions .btn{min-height:56px;padding:0 28px;color:#fff}
.ft-btn-ghost{display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:0 24px;border:1px solid rgba(255,255,255,.24);border-radius:999px;color:#fff!important;font-weight:600;transition:background .2s,border-color .2s}
.ft-btn-ghost:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45)}
.ft-btn-ghost svg{color:var(--ft-accent)}
.ft-note{flex-basis:100%;margin:4px 0 0;text-align:right;font-size:.875rem;color:var(--ft-muted)}
.ft-note a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.3)}
.ft-note a:hover{border-color:#fff}
/* 2. The grid: brand, apartments, explore, contact. */
.ft-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.4fr;gap:40px;padding:56px 0 52px}
.site-footer>.wrap>.ft-grid:first-child{padding-top:0}
.ft-brand-link{display:inline-flex;align-items:center;gap:12px;margin-bottom:18px}
.ft-brand-link img{width:58px;height:auto;filter:brightness(1.45) saturate(1.1)}
.ft-word-b{display:block;color:#fff;font-weight:600;font-size:1.15rem;letter-spacing:.16em;line-height:1}
.ft-word-s{display:block;margin-top:5px;color:var(--ft-muted);font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;line-height:1}
.ft-about{margin:0;max-width:34ch}
.ft-trust{display:grid;gap:10px;margin-top:22px!important}
.ft-trust li{display:flex;align-items:flex-start;gap:10px;font-size:.875rem}
.ft-trust svg{margin-top:2px;color:var(--ft-accent)}
.ft-h{margin:4px 0 18px;color:var(--ft-muted);font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.ft-links{display:grid;gap:2px}
.ft-links a{display:inline-flex;align-items:center;gap:6px;padding:5px 0;transition:color .15s}
.ft-links a:hover{color:#fff;text-decoration:underline;text-underline-offset:5px;text-decoration-color:rgba(255,255,255,.35)}
.ft-links svg{width:14px;height:14px;opacity:.7}
.ft-links .ft-more{margin-top:8px;color:var(--ft-accent);font-weight:600}
.ft-links .ft-more:hover{color:#fff}
.ft-contact{display:grid;gap:6px}
.ft-contact a{display:flex;align-items:center;gap:12px;margin:0 -12px;padding:9px 12px;border-radius:16px;transition:background .15s}
.ft-contact a:hover{background:rgba(255,255,255,.06)}
.ft-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.07);color:#fff;flex:none}
.ft-ic.is-wa{background:var(--green,#187b58)}
.ft-k{display:block;font-size:.75rem;line-height:1.25;color:var(--ft-muted)}
.ft-v{display:block;color:#fff;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.ft-lang{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:8px 14px;border:1px solid var(--ft-line);border-radius:999px;font-size:.8125rem;font-weight:600;color:#fff;transition:border-color .15s}
.ft-lang:hover{border-color:rgba(255,255,255,.4)}
.ft-lang svg{width:16px;height:16px;color:var(--ft-accent)}
/* 3. The legal bar. */
.ft-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding:22px 0;border-top:1px solid var(--ft-line);font-size:.8125rem;color:var(--ft-muted)}
.ft-id{margin:0;line-height:1.6}
.ft-id strong{color:var(--ft-text);font-weight:600}
.ft-legal{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px}
.ft-legal a:hover{color:#fff}
/* The official ANPC pictogram, white with its own navy border. */
.ft-anpc{display:inline-flex;border-radius:12px;transition:opacity .15s}
.ft-anpc img{display:block;width:165px;height:auto}
.ft-anpc:hover{opacity:.9}
/* 4. The signature, decorative (aria-hidden). */
.ft-sign{display:block;margin:-.06em 0 -.24em;text-align:center;font-weight:600;font-size:clamp(84px,21vw,262px);line-height:.9;letter-spacing:-.055em;background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,0) 80%);-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none;pointer-events:none}
@media(max-width:980px){.ft-cta{grid-template-columns:1fr;align-items:start;gap:28px}.ft-actions{justify-content:flex-start}.ft-note{text-align:left}.ft-grid{grid-template-columns:1fr 1fr 1.4fr;gap:40px 28px}.ft-brand{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 32px;align-items:start}.ft-trust{grid-column:2;grid-row:1/span 2;margin-top:4px!important}}
/* On phones every target is at least 44px tall; the phone number inline in the
   note is exempt as text, and is also the contact list's second row. Without
   script the fixed .mobile-bar (65px) never steps aside, and the signature leaves
   only 50px under the legal bar at its 84px minimum: 16px more keeps the ANPC
   pictogram clear of it. */
@media(max-width:680px){.site-footer{padding-top:56px;padding-bottom:16px}.ft-cta{padding-bottom:40px}.ft-actions{flex-direction:column;align-items:stretch}.ft-actions .btn,.ft-btn-ghost{width:100%;justify-content:center}.ft-grid{grid-template-columns:1fr 1fr;gap:36px 20px;padding:40px 0}.ft-brand{display:block}.ft-trust{margin-top:22px!important}.ft-col-contact{grid-column:1/-1}.ft-links a{padding:10px 0;min-height:44px}.ft-brand-link,.ft-lang,.ft-anpc{min-height:44px}.ft-bottom{flex-direction:column;align-items:flex-start;gap:14px}.ft-legal{gap:4px 18px}.ft-legal a{display:inline-flex;align-items:center;min-height:44px;padding:8px 0}.ft-legal .ft-anpc{padding:0}}
/* The fixed bar on phones repeats the footer's calls to action, so it steps aside
   while the footer is on screen (site.js wireFooter). visibility follows once it
   has slid away, so its links also leave the tab order. */
.mobile-bar{transition:transform .3s ease,opacity .3s ease,visibility 0s}
.mobile-bar.is-hidden{transform:translateY(110%);opacity:0;visibility:hidden;pointer-events:none;transition:transform .3s ease,opacity .3s ease,visibility 0s .3s}
.av-sprite{position:absolute;width:0;height:0;overflow:hidden}
.av-ic{flex:none;display:block}
.btn-wa svg{flex:none}

/* Sections below the first two, and the footer, are laid out only when they come
   near the screen: on load that cuts the layout time of the home and property
   pages by about 40 % (Chrome trace, CPU 4x, 2026-10-02). auto keeps the measured size once a
   section has been shown, so scrolling back does not jump. Not a section with a
   dark panel, nor the one after it: axe, in Lighthouse, read the colours of
   skipped text against the wrong background there and failed the hub's contrast. */
main>section:nth-of-type(n+3):not(:has(.dark)):not(section:has(.dark)+section):not(.faq2),.site-footer{content-visibility:auto;contain-intrinsic-size:auto 900px}
/* A skipped section is 900px tall, but axe still measures its contents at their real
   size, spilling into the next section: on a phone the property page's "see all
   amenities" button landed on the FAQ's questions and Lighthouse failed target-size
   (2026-10-04). The browser already clips a skipped section (paint containment), so
   overflow:hidden changes nothing on screen and tells axe the same. The FAQ is laid out
   from the start instead: its aside is sticky on a wide screen, which overflow:hidden
   would stop, and the compare block after it then starts where the FAQ really ends. */
main>section.pa,main>section.compare-section{overflow:hidden}
.btn-wa{background:#fff;color:var(--green-text);border:1px solid #bfe0cf}
/* The Google map under the cards (site.js). Compact until it loads, and nothing
   reaches Google before the visitor asks; .is-open gives it the map's height. */
.hub-gmap{position:relative;height:160px;margin-top:20px;border:1px solid var(--line);border-radius:24px;overflow:hidden;background:var(--navy);scroll-margin-top:96px;transition:height .3s ease}
.hub-gmap.is-open{height:460px}
.hub-gmap:focus{outline:none}
.hub-gmap-canvas{position:absolute;inset:0}
.hub-gmap-canvas[hidden],.hub-gmap-facade[hidden]{display:none}
.hub-gmap-facade{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;text-align:center;background:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px) 0 0/40px 40px,linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px) 0 0/40px 40px,var(--navy)}
.hub-gmap-load{border:0;border-radius:999px;padding:14px 26px;font:inherit;font-weight:600;background:#2fbf86;color:var(--navy);cursor:pointer}
.hub-gmap-load:hover{background:#46cf98}
.hub-gmap-load:focus-visible{outline:3px solid #fff;outline-offset:3px}
.hub-gmap-load:disabled{opacity:.7;cursor:progress}
.hub-gmap-note{margin:0;font-size:13px;color:#b9cad3}
/* A flat's own page ("Pe hartă"): one pin and a shorter band. Without the script the
   band's button is a link to the same place on Google Maps. */
.hub-gmap--single.is-open{height:360px}
a.hub-gmap-load{display:inline-block;text-decoration:none}
/* The price pins: the tip sits on the flat's coordinates. .hub-gpin, not .hub-pin (the SVG map's, gone). */
.hub-gpin{position:relative;margin-bottom:7px;padding:7px 10px;border-radius:999px;background:#fff;color:var(--navy);font:600 13px/1 system-ui,-apple-system,"Segoe UI",sans-serif;white-space:nowrap;cursor:pointer;filter:drop-shadow(0 1px 3px rgba(13,29,41,.45));transform-origin:50% 100%;transition:transform .15s,background-color .15s,color .15s}
.hub-gpin::after{content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:10px;border-radius:2px;background:inherit;transform:translateX(-50%) rotate(45deg)}
.hub-gpin:hover,.hub-gpin.is-on{background:var(--navy);color:#fff;transform:scale(1.08)}
.hub-gpin-count{position:relative;z-index:1;margin-left:6px;padding:2px 6px;border-radius:999px;background:#2fbf86;color:var(--navy);font-size:11px;font-weight:700}
/* A pin's window: a small card a flat, read from its card on the page; several flats on one pin are compact rows. */
.hub-pop{width:292px;max-width:100%;padding:0 4px 6px 0;font:13px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink)}
.hub-pop-ap{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;margin:0 0 4px;padding:6px;border-radius:14px;color:inherit;text-decoration:none}
.hub-pop-ap:hover{background:var(--soft)}
.hub-pop-ap img{display:block;width:72px;height:72px;border-radius:12px;object-fit:cover;background:var(--soft)}
.hub-pop-txt{display:grid;gap:1px;min-width:0;color:var(--muted)}
.hub-pop-name{font-size:15px;color:var(--ink)}
.hub-pop-rate::before{content:"★ ";color:#d98a00}
.hub-pop-price{font-weight:600;color:var(--ink)}
.hub-pop.is-multi .hub-pop-ap{grid-template-columns:72px 1fr auto}
.hub-pop.is-multi .hub-pop-ap::after{content:"›";font-size:22px;line-height:1;color:var(--muted)}
.hub-pop-cta{display:block;margin:4px 6px 10px;padding:10px 14px;border-radius:999px;background:var(--navy);color:#fff;font-weight:600;text-align:center;text-decoration:none}
.hub-pop-cta:hover{background:var(--green)}
.hub-pop-dir{display:inline-block;margin:4px 0 0 6px;font-weight:600;color:var(--green)}
.hub-pop-dir--ap{display:table;margin:-2px 0 10px 90px}
.hub-pop--place{display:grid;gap:2px;padding:2px 4px 6px 2px}
.hub-pop--place .hub-pop-name,.hub-pop--place .hub-pop-addr{margin-left:6px}
.hub-pop-addr{color:var(--muted)}
@media(max-width:680px){.hub-gmap.is-open{height:360px}.hub-gmap--single.is-open{height:300px}}
@media(prefers-reduced-motion:reduce){.hub-gmap,.hub-gpin{transition:none}}
/* The guests' review card (templates/partials/review-card.php) and the host's rating
   bar: the same on the home page, the reviews page and a flat's page (owner's brief,
   2026-10-11). Their colours are their own, the home page's design, so a card looks
   the same whatever the page's tokens; each page lays the cards out in its own file.
   The links name .rev or .rev-trust, so the home page's ".hp2 a" (green, underlined)
   does not reach them, nor ".hp2 p" the bar's line. A flat's reviews block
   (apartment.css) draws its score and its links in the same colours. */
.rev,.rev-trust,.rev-block{--rv-ink:#0e1f2b;--rv-ink-2:#36495b;--rv-mute:#5d6f7d;--rv-line:#e2e8e4;--rv-mist:#edf4f0;--rv-green:#0b6b4d;--rv-gold:#c3912f}
.rev-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;padding:1.1rem clamp(1.1rem,2.5vw,1.5rem);background:#fff;border:1px solid var(--rv-line);border-radius:18px;color:var(--rv-ink)}
.rev-trust__score{display:flex;align-items:center;gap:.9rem}
.rev-trust .big{font-size:clamp(2.4rem,4vw,3rem);font-weight:600;line-height:1;letter-spacing:-.03em;color:var(--rv-ink)}
.rev-trust .stars{display:block;color:var(--rv-gold);font-size:1rem;line-height:1.2;letter-spacing:.14em}
/* The bar's stars filled to its rating, the last one to its tenth (owner, 2026-10-13; PublicCatalog::starFills()). */
.rev-trust__star{color:#d5dcd8}
.rev-trust__star.is-full{color:var(--rv-gold)}
.rev-trust__star[class*=" is-p"]{background:linear-gradient(90deg,var(--rv-gold) var(--fill),#d5dcd8 var(--fill));-webkit-background-clip:text;background-clip:text;color:transparent}
.rev-trust__star.is-p1{--fill:10%}.rev-trust__star.is-p2{--fill:20%}.rev-trust__star.is-p3{--fill:30%}.rev-trust__star.is-p4{--fill:40%}.rev-trust__star.is-p5{--fill:50%}
.rev-trust__star.is-p6{--fill:60%}.rev-trust__star.is-p7{--fill:70%}.rev-trust__star.is-p8{--fill:80%}.rev-trust__star.is-p9{--fill:90%}
.rev-trust .rev-trust__meta p{margin:.2rem 0 0;color:var(--rv-ink-2);font-size:.95rem;line-height:1.4}
.rev-trust .rev-trust__link{display:inline-flex;align-items:center;gap:.4rem;color:var(--rv-green);font-weight:600;font-size:.94rem;text-decoration:underline;white-space:nowrap}
.rev-grid{display:grid;align-items:start;gap:clamp(1rem,1.8vw,1.35rem)}
.rev{margin:0;display:grid;gap:.8rem;padding:clamp(1.25rem,2vw,1.5rem);background:#fff;border:1px solid var(--rv-line);border-radius:18px;color:var(--rv-ink)}
.rev__top{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .7rem}
.rev__stars{color:var(--rv-gold);font-size:.95rem;line-height:1;letter-spacing:.12em}
.rev__stars-off{color:#d5dcd8}
.rev__badge{padding:.22rem .55rem;border-radius:999px;background:var(--rv-mist);color:var(--rv-green);font-size:.72rem;font-weight:600;letter-spacing:.01em;line-height:1.4}
.rev blockquote{margin:0;font-size:1.0625rem;line-height:1.55;color:var(--rv-ink);text-wrap:pretty}
.rev figcaption{display:grid;gap:.85rem}
.rev__by{display:flex;align-items:center;gap:.7rem}
.rev__thumb{flex:none;width:40px;height:40px;border-radius:10px;overflow:hidden;background:var(--rv-mist)}
.rev__thumb img{display:block;width:100%;height:100%;object-fit:cover}
.rev__who b{display:block;font-size:.9rem;line-height:1.3}
.rev__who time{font-size:.8rem;color:var(--rv-mute)}
.rev .rev__apt{display:flex;align-items:center;gap:.4rem;padding-top:.85rem;border-top:1px solid var(--rv-line);color:var(--rv-green);font-size:.875rem;font-weight:600;text-decoration:none}
.rev .rev__apt:hover{text-decoration:underline}
.rev__apt svg{flex:none;transition:translate .18s ease}
.rev__apt:hover svg{translate:2px 0}
.rev-source{max-width:70ch;margin:0;font-size:.875rem;line-height:1.55;color:#5d6f7d}
.rev-cta{display:flex;flex-wrap:wrap;gap:.75rem}
@media(max-width:640px){.rev-trust{flex-direction:column;align-items:flex-start;gap:.9rem}.rev-trust .rev-trust__link{white-space:normal}}
@media(prefers-reduced-motion:reduce){.rev__apt svg{transition:none}}