/* 7visas.com — generated by 7visas/tools/build.mjs from 7visas/tools/css/*.css. Do not edit by hand. */
/* ——— 00-fonts.css ——— */
/* 00-fonts — self-hosted OFL faces (Google Fonts sources, downloaded 2026-10-14; no request leaves 7visas.com).
   Noto Serif Display (display, Latin/Greek; italic for accents) · IBM Plex Sans (text, Latin/Greek) · IBM Plex Sans Arabic ·
   IBM Plex Sans Hebrew. unicode-range keeps every script off pages that do not use it; the Latin Extended files were
   trimmed to Latin Extended-A (+ Romanian) with fontTools for Turkish. Simplified Chinese uses the system CJK fonts. */
@font-face{font-family:'Noto Serif Display';font-style:italic;font-weight:300 400;font-display:swap;src:url(/assets/fonts/noto-serif-display-greek-italic-300-400.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Noto Serif Display';font-style:italic;font-weight:300 400;font-display:swap;src:url(/assets/fonts/noto-serif-display-latin-ext-italic-300-400.woff2) format('woff2');unicode-range:U+0100-017F, U+0218-021B}
@font-face{font-family:'Noto Serif Display';font-style:italic;font-weight:300 400;font-display:swap;src:url(/assets/fonts/noto-serif-display-latin-italic-300-400.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Noto Serif Display';font-style:normal;font-weight:300 500;font-display:swap;src:url(/assets/fonts/noto-serif-display-greek-normal-300-500.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'Noto Serif Display';font-style:normal;font-weight:300 500;font-display:swap;src:url(/assets/fonts/noto-serif-display-latin-ext-normal-300-500.woff2) format('woff2');unicode-range:U+0100-017F, U+0218-021B}
@font-face{font-family:'Noto Serif Display';font-style:normal;font-weight:300 500;font-display:swap;src:url(/assets/fonts/noto-serif-display-latin-normal-300-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/plex-sans-greek-normal-400-600.woff2) format('woff2');unicode-range:U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/plex-sans-latin-ext-normal-400-600.woff2) format('woff2');unicode-range:U+0100-017F, U+0218-021B}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/plex-sans-latin-normal-400-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/plex-sans-arabic-arabic-normal-400.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/plex-sans-arabic-arabic-normal-500.woff2) format('woff2');unicode-range:U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1}
@font-face{font-family:'IBM Plex Sans Hebrew';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/plex-sans-hebrew-hebrew-normal-400.woff2) format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'IBM Plex Sans Hebrew';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/plex-sans-hebrew-hebrew-normal-500.woff2) format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}
@font-face{font-family:'IBM Plex Sans Hebrew';font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/plex-sans-hebrew-hebrew-normal-600.woff2) format('woff2');unicode-range:U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F}

/* ——— 01-tokens.css ——— */
/* 01-tokens — the 7visas design tokens (docs/7visas/7visas-design-system.md; direction A "editorial private bank",
   with the data-visual and card grafts of direction C). Contrast ratios are computed WCAG 2.2 values.
   One accent only (deep sea-green); ivory paper; crisp 2px radii; almost no shadow: paper does not float. */
:root {
  color-scheme: light;
  /* surfaces */
  --c-paper:          #F5F1E8;  /* page ground, ivory */
  --c-paper-raised:   #FBF9F4;  /* cards, panels, inputs */
  --c-limestone:      #ECE6D9;  /* bands, table heads, footer */
  --c-limestone-deep: #E2DACA;  /* chart track, pressed states (no ink-3 text on it) */
  --c-mount:          #FFFFFF;  /* behind plan drawings only */
  /* ink */
  --c-ink:   #13201F;  /* text 14.86:1 on paper */
  --c-ink-2: #3B4846;  /* secondary text 8.46:1 */
  --c-ink-3: #58625F;  /* captions, meta 5.60:1 on paper, 5.08:1 on limestone */
  /* rules */
  --c-rule:        #D6CDBC;  /* decorative hairline */
  --c-rule-strong: #857D70;  /* UI boundaries (inputs, choices) 3.61:1 */
  /* the single accent */
  --c-accent:       #0E4D45;  /* links, primary buttons, focus 8.60:1 on paper */
  --c-accent-hover: #0A3A34;  /* 11.17:1 */
  --c-accent-tint:  #DDE8E2;  /* selected choice, info callout, "available" ground */
  /* the dark band */
  --c-dark:           #0F2321;
  --c-on-dark:        #F3EFE6;  /* 14.27:1 on dark */
  --c-on-dark-2:      #AFBAB6;  /* 8.20:1 on dark */
  --c-accent-on-dark: #8FCDBB;  /* 9.06:1 on dark */
  --c-rule-on-dark:   rgba(243, 239, 230, 0.18);
  /* signals: always with an icon and words */
  --c-warn:          #8C3A16;  /* 6.82:1 on paper */
  --c-warn-tint:     #F6E6DA;
  --c-neutral-badge: #E6E1D6;  /* "Reserved" ground; ink-2 on it 7.32:1 */
  --c-focus:         var(--c-accent);
  --c-focus-on-dark: var(--c-on-dark);
  /* charts: emphasis encoding (the one bar the story is about), never categorical rainbow */
  --c-chart-highlight: var(--c-accent);
  --c-chart-context:   #857D70;
  --c-chart-grid:      var(--c-rule);

  /* type families */
  --font-display: "Noto Serif Display", "Noto Serif", Georgia, "Times New Roman", serif;
  --font-sans: "IBM Plex Sans", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --font-sans-ar: "IBM Plex Sans Arabic", "IBM Plex Sans", "Noto Sans Arabic", "Geeza Pro", "Segoe UI", Tahoma, sans-serif;
  --font-sans-he: "IBM Plex Sans Hebrew", "IBM Plex Sans", "Noto Sans Hebrew", "Arial Hebrew", "Segoe UI", Arial, sans-serif;
  --font-cjk: "IBM Plex Sans", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Source Han Sans SC", "Microsoft YaHei", sans-serif;
  --ff-display: var(--font-display);
  --ff-text: var(--font-sans);
  /* weights */
  --fw-display-light: 300;
  --fw-display: 400;
  --fw-display-strong: 500;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  /* fluid scale, 360 → 1440 px */
  --fs-display-xl: clamp(2.5rem, 1.75rem + 3.333vw, 4.75rem);
  --fs-display-l:  clamp(2rem, 1.583rem + 1.852vw, 3.25rem);
  --fs-display-m:  clamp(1.5rem, 1.333rem + 0.741vw, 2rem);
  --fs-display-s:  clamp(1.25rem, 1.167rem + 0.37vw, 1.5rem);
  --fs-lead:       clamp(1.125rem, 1.0625rem + 0.278vw, 1.3125rem);
  --fs-body:       clamp(1rem, 0.979rem + 0.093vw, 1.0625rem);
  --fs-ui:         0.9375rem;
  --fs-small:      0.875rem;
  --fs-micro:      0.8125rem;
  --fs-eyebrow:    0.75rem;
  --lh-display-xl: 1.04;
  --lh-display-l:  1.08;
  --lh-display-m:  1.16;
  --lh-display-s:  1.25;
  --lh-lead: 1.5;
  --lh-body: 1.6;
  --lh-ui:   1.35;
  --lh-small: 1.5;
  --ls-display-xl: -0.014em;
  --ls-display-l:  -0.01em;
  --ls-display-m:  -0.004em;
  --ls-eyebrow:    0.14em;
  --ls-ui:         0.005em;
  --measure-text: 40rem;
  --measure-lead: 36rem;
  /* space, 4 px base */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem; --space-5: 1.5rem;
  --space-6: 2rem; --space-7: 3rem; --space-8: 4rem; --space-9: 6rem; --space-10: 8rem;
  --space-section: clamp(3.5rem, 2.4rem + 4.9vw, 7rem);
  /* layout */
  --container-max: 77.5rem;
  --grid-gap: clamp(1rem, 0.75rem + 1.11vw, 1.5rem);
  --page-pad: clamp(1rem, -0.6rem + 4.4vw, 4rem);
  --header-h: 4.5rem;
  --header-h-compact: 3.75rem;
  --target-min: 2.75rem;
  /* shape */
  --radius-1: 2px;
  --radius-2: 4px;
  --border-strong: 2px;
  --shadow-1: 0 1px 0 rgba(19, 32, 31, 0.06);
  --shadow-2: 0 12px 28px -16px rgba(19, 32, 31, 0.28);
  /* motion */
  --dur-1: 120ms; --dur-2: 200ms; --dur-3: 320ms; --dur-4: 640ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  /* direction helper for transforms that logical properties cannot express */
  --dir: 1;
  /* z */
  --z-header: 30; --z-mbar: 40; --z-menu: 50; --z-skip: 100;
}
[dir="rtl"] { --dir: -1; }

/* script companions: same roles, other families and metrics */
:lang(ar) {
  --ff-display: var(--font-sans-ar);
  --ff-text: var(--font-sans-ar);
  --fw-display-light: 500; --fw-display: 500; --fw-display-strong: 500; --fw-semibold: 500;
  --fs-display-xl: clamp(2.125rem, 1.6rem + 2.3vw, 3.75rem);
  --fs-display-l:  clamp(1.75rem, 1.4rem + 1.56vw, 2.625rem);
  --fs-body: clamp(1.0625rem, 1.04rem + 0.093vw, 1.125rem);
  --lh-display-xl: 1.4; --lh-display-l: 1.4; --lh-display-m: 1.45; --lh-display-s: 1.5;
  --lh-lead: 1.75; --lh-body: 1.85; --lh-ui: 1.55; --lh-small: 1.7;
  --ls-display-xl: 0; --ls-display-l: 0; --ls-display-m: 0; --ls-eyebrow: 0; --ls-ui: 0;
}
:lang(he) {
  --ff-display: var(--font-sans-he);
  --ff-text: var(--font-sans-he);
  --fw-display-light: 400; --fw-display: 500;
  --lh-display-xl: 1.15; --lh-display-l: 1.2; --lh-body: 1.7;
  --ls-display-xl: 0; --ls-display-l: 0; --ls-eyebrow: 0.02em;
}
:lang(zh-Hans) {
  --ff-display: var(--font-cjk);
  --ff-text: var(--font-cjk);
  --fw-display-light: 500; --fw-display: 500;
  --fs-display-xl: clamp(2.125rem, 1.6rem + 2.3vw, 3.5rem);
  --fs-display-l:  clamp(1.75rem, 1.45rem + 1.3vw, 2.5rem);
  --lh-display-xl: 1.25; --lh-display-l: 1.3; --lh-display-m: 1.35; --lh-body: 1.85; --lh-lead: 1.75;
  --ls-display-xl: 0; --ls-display-l: 0; --ls-display-m: 0; --ls-eyebrow: 0.06em;
}
/* a Latin run inside an RTL or CJK page keeps the Latin faces (brand names, IDs, numbers) */
:lang(en), :lang(el), :lang(tr) { --ff-display: var(--font-display); --ff-text: var(--font-sans); }

/* ——— 02-base.css ——— */
/* 02-base — reset, type roles, links, focus, icons. Logical properties only: the same rules lay out LTR and RTL. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-block-start: calc(var(--header-h) + var(--space-4)); }
body {
  margin: 0; background: var(--c-paper); color: var(--c-ink);
  font-family: var(--ff-text); font-size: var(--fs-body); line-height: var(--lh-body); font-weight: var(--fw-regular);
  font-synthesis: none; font-kerning: normal; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-wrap: break-word;
}
img, svg, picture, video { display: block; max-inline-size: 100%; }
img { block-size: auto; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
main { display: block; }
main:focus { outline: none; }
a { color: var(--c-accent); text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: 0.22em; transition: color var(--dur-1) var(--ease-out), text-decoration-thickness var(--dur-1) var(--ease-out); }
a:hover { color: var(--c-accent-hover); text-decoration-thickness: 2px; }
:focus-visible { outline: var(--border-strong) solid var(--c-focus); outline-offset: 3px; }
.sec--dark :focus-visible, .ftr--dark :focus-visible { outline-color: var(--c-focus-on-dark); }
::selection { background: var(--c-accent-tint); color: var(--c-ink); }
bdi { unicode-bidi: isolate; }
strong, b { font-weight: var(--fw-semibold); }

/* headings: the display face, light and balanced */
h1, h2, h3 { font-family: var(--ff-display); color: var(--c-ink); text-wrap: balance; font-variant-numeric: lining-nums proportional-nums; }
h1 { font-size: var(--fs-display-xl); line-height: var(--lh-display-xl); letter-spacing: var(--ls-display-xl); font-weight: var(--fw-display-light); }
h2 { font-size: var(--fs-display-l); line-height: var(--lh-display-l); letter-spacing: var(--ls-display-l); font-weight: var(--fw-display-light); }
h3 { font-size: var(--fs-display-s); line-height: var(--lh-display-s); font-weight: var(--fw-display); }
h4 { font-family: var(--ff-text); font-size: var(--fs-body); font-weight: var(--fw-semibold); }
h1 em, h2 em { font-style: italic; }
:lang(ar) em, :lang(he) em, :lang(zh-Hans) em { font-style: normal; }

/* icons: inline SVG, 1.5 px strokes, currentColor; directional ones mirror in RTL */
.i { inline-size: 1.25rem; block-size: 1.25rem; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.i--dir { transform: scaleX(var(--dir)); }
.i--wa { stroke-width: 1.4; }

.skip { position: absolute; z-index: var(--z-skip); inset-inline-start: var(--space-4); inset-block-start: var(--space-4); padding: var(--space-3) var(--space-4); background: var(--c-ink); color: var(--c-on-dark); translate: 0 -300%; text-decoration: none; }
.skip:focus { translate: 0 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@media (forced-colors: active) {
  .btn, .choice, .media__label, .badge { border: 1px solid CanvasText; }
  .tier__bar::before, .ms__dot { forced-color-adjust: none; }
}

/* ——— 03-layout.css ——— */
/* 03-layout — the container, sections, the 12-column rhythms, prose measure, article layout. */
.wrap { inline-size: 100%; max-inline-size: calc(var(--container-max) + 2 * var(--page-pad)); margin-inline: auto; padding-inline: var(--page-pad); }
.sec { padding-block: var(--space-section); }
.sec + .sec { padding-block-start: 0; }
.sec--tight { padding-block: var(--space-5); }
.sec + .sec--tight, .sec--tight + .sec { padding-block-start: 0; }
.sec--stone { background: var(--c-limestone); }
.sec--stone, .sec--dark, .sec--band { padding-block: var(--space-section); }
.sec--stone + .sec, .sec--dark + .sec, .sec--band + .sec { padding-block-start: var(--space-section); }
.sec + .sec--stone, .sec + .sec--dark, .sec + .sec--band { padding-block-start: var(--space-section); }
.sec--dark { background: var(--c-dark); color: var(--c-on-dark); }
.sec--dark h2, .sec--dark h3 { color: var(--c-on-dark); }
.sec--dark a { color: var(--c-accent-on-dark); }
.sec--dark .sec__intro, .sec--dark p { color: var(--c-on-dark-2); }

/* section opener: a hairline rule above, kicker, h2, intro */
.sec__h { margin-block-end: var(--space-5); max-inline-size: 22ch; }
.kicker { display: flex; align-items: center; gap: var(--space-3); padding-block-start: var(--space-3); margin-block-end: var(--space-4); border-block-start: 1px solid var(--c-ink); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink); }
.kicker::before { content: ""; inline-size: 0.5rem; block-size: 0.5rem; background: var(--c-accent); flex: none; }
.sec--dark .kicker { border-color: var(--c-on-dark); color: var(--c-on-dark); }
.sec--dark .kicker::before { background: var(--c-accent-on-dark); }
:lang(ar) .kicker, :lang(he) .kicker, :lang(zh-Hans) .kicker { text-transform: none; font-size: var(--fs-small); }
.sec__intro { max-inline-size: var(--measure-lead); font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--c-ink-2); margin-block-end: var(--space-6); }
.sec__intro p + p { margin-block-start: var(--space-3); }
.sec__note { margin-block-start: var(--space-5); max-inline-size: var(--measure-text); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); }
.sec__note p + p { margin-block-start: var(--space-2); }

/* prose: the reading column */
.prose { display: grid; gap: var(--space-7); }
.prose__body { max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.prose__body > * + * { margin-block-start: var(--space-4); }
.prose__body > .kicker + .sec__h, .prose__body > .sec__h { margin-block-start: 0; }
.prose__body h3 { margin-block-start: var(--space-6); color: var(--c-ink); }
.prose__body ul, .prose__body ol, .split__copy ul, .split__copy ol, .card__body ul, .faq__a ul, .faq__a ol, .step__body ul, .callout ul, .callout ol { padding-inline-start: 1.25rem; display: grid; gap: var(--space-2); }
.prose__body li::marker, .split__copy li::marker { color: var(--c-accent); }
.prose__body blockquote { padding-inline-start: var(--space-5); border-inline-start: 2px solid var(--c-accent); font-family: var(--ff-display); font-size: var(--fs-display-s); color: var(--c-ink); }
@media (min-width: 1120px) {
  .prose--media { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 3); align-items: start; }
  .prose--media > .media { position: sticky; inset-block-start: calc(var(--header-h) + var(--space-5)); }
}

/* split: copy beside a figure */
.split { display: grid; gap: var(--space-7); align-items: center; }
.split__copy { max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.split__copy > * + * { margin-block-start: var(--space-4); }
@media (min-width: 960px) {
  .split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: calc(var(--grid-gap) * 3); }
  .split--rev > :first-child { order: 2; }
}

/* article: on-this-page navigation beside the reading column */
.article { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-6); padding-block-start: var(--space-5); }
.article__main > .sec:first-child { padding-block-start: var(--space-5); }
.article__main .sec { padding-block: var(--space-7); }
.article__main .sec + .sec { padding-block-start: 0; }
.article__main .sec--band { padding-block: var(--space-7); }
.article__main .wrap { padding-inline: 0; max-inline-size: none; }
@media (min-width: 1120px) {
  .article { grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); column-gap: calc(var(--grid-gap) * 2); align-items: start; }
  .article__aside { position: sticky; inset-block-start: calc(var(--header-h) + var(--space-5)); }
}

.ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-block-start: var(--space-5); }
@media (max-width: 479.98px) { .ctas .btn { flex: 1 1 100%; } }

/* ——— 10-chrome.css ——— */
/* 10-chrome — header, language menu, menu sheet, breadcrumbs, footer, mobile action bar, WhatsApp, language bar. */

/* ——— header ——— */
.hdr { position: sticky; inset-block-start: 0; z-index: var(--z-header); background: var(--c-paper); border-block-end: 1px solid var(--c-rule); transition: box-shadow var(--dur-2) var(--ease-out); }
.hdr.is-scrolled { box-shadow: var(--shadow-2); }
.hdr__in { display: flex; align-items: center; gap: var(--space-3); min-block-size: var(--header-h-compact); }
.hdr__logo { display: inline-flex; flex: none; align-items: center; min-block-size: var(--target-min); margin-inline-end: auto; color: var(--c-ink); }
.logo { flex: none; block-size: 24px; inline-size: auto; fill: currentColor; }
.hdr__nav { display: none; }
.hdr__nav ul { display: flex; align-items: center; gap: 0.125rem; }
.hdr__nav a { display: inline-flex; align-items: center; min-block-size: var(--target-min); padding-inline: 0.75rem; color: var(--c-ink); text-decoration: none; font-size: var(--fs-ui); font-weight: var(--fw-medium); }
.hdr__nav a:hover, .hdr__nav a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; text-underline-offset: 0.55em; }
.hdr__tools { display: flex; align-items: center; gap: var(--space-2); }
/* .btn comes later in the cascade, so the header CTA rules carry the header's specificity; below 768 px the mobile
   action bar carries the same call to action */
.hdr .hdr__cta { display: none; }
@media (min-width: 768px) { .hdr .hdr__cta { display: inline-flex; } }
@media (min-width: 1180px) {
  .hdr__in { min-block-size: var(--header-h); gap: var(--space-5); }
  .logo { block-size: 26px; }
  .hdr__nav { display: block; }
  .menu { display: none; }
}

/* ——— disclosures: language menu and the menu sheet (native <details>, work without JS) ——— */
.lang, .menu { position: relative; }
.lang > summary, .menu__btn { display: inline-flex; align-items: center; justify-content: center; gap: 0.375rem; min-inline-size: var(--target-min); min-block-size: var(--target-min); padding-inline: 0.625rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: transparent; color: var(--c-ink); font-size: var(--fs-ui); font-weight: var(--fw-medium); cursor: pointer; list-style: none; }
.lang > summary::-webkit-details-marker, .menu__btn::-webkit-details-marker { display: none; }
.lang > summary:hover, .menu__btn:hover { border-color: var(--c-ink); }
.lang__list { position: absolute; z-index: var(--z-menu); inset-inline-end: 0; inset-block-start: calc(100% + var(--space-2)); min-inline-size: 12rem; padding: var(--space-2); background: var(--c-paper-raised); border: 1px solid var(--c-rule-strong); box-shadow: var(--shadow-2); }
.lang__list a { display: flex; align-items: center; min-block-size: var(--target-min); padding-inline: var(--space-3); color: var(--c-ink); text-decoration: none; }
.lang__list a:hover { background: var(--c-limestone); }
.lang__list a[aria-current="true"] { font-weight: var(--fw-semibold); text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; text-underline-offset: 0.4em; }
.menu__btn .i + .i { display: none; }
.menu[open] .menu__btn .i:first-child { display: none; }
.menu[open] .menu__btn .i + .i { display: block; }
.menu__sheet { position: fixed; z-index: var(--z-menu); inset-inline: 0; inset-block: var(--header-h-compact) 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--space-5) var(--page-pad) calc(var(--space-8) + env(safe-area-inset-bottom)); background: var(--c-paper); border-block-start: 1px solid var(--c-rule); }
.menu__groups { display: grid; gap: var(--space-6); }
.menu__title { font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink-3); margin-block-end: var(--space-2); }
:lang(ar) .menu__title, :lang(he) .menu__title, :lang(zh-Hans) .menu__title { text-transform: none; font-size: var(--fs-small); }
.menu__group a { display: flex; align-items: center; min-block-size: 3.25rem; border-block-end: 1px solid var(--c-rule); font-family: var(--ff-display); font-size: var(--fs-display-s); color: var(--c-ink); text-decoration: none; }
.menu__foot { display: grid; gap: var(--space-3); margin-block-start: var(--space-6); }
html.menu-open { overflow: hidden; }
@media (min-width: 768px) { .menu__groups { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gap); } .menu__foot { grid-template-columns: repeat(2, max-content); } }

/* ——— breadcrumbs ——— */
.crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; font-size: var(--fs-small); color: var(--c-ink-3); }
.crumbs li { display: inline-flex; align-items: center; gap: 0.5rem; }
.crumbs li + li::before { content: "/"; color: var(--c-rule-strong); }
.crumbs a { color: var(--c-ink-2); text-decoration: none; }
.crumbs a:hover { color: var(--c-accent); text-decoration: underline; }
.crumbs [aria-current] { color: var(--c-ink-3); }

/* ——— footer ——— */
.ftr { background: var(--c-limestone); color: var(--c-ink-2); font-size: var(--fs-small); padding-block: var(--space-8) calc(var(--space-6) + 4.5rem); }
@media (min-width: 768px) { .ftr { padding-block-end: var(--space-6); } }
.ftr a { color: var(--c-ink); }
.ftr__top { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6) var(--grid-gap); padding-block-end: var(--space-7); border-block-end: 1px solid var(--c-rule-strong); }
.ftr__brand { grid-column: 1 / -1; display: grid; gap: var(--space-4); align-content: start; }
.ftr__logo { color: var(--c-ink); inline-size: max-content; }
.ftr__logo .logo { block-size: 28px; }
.ftr__brand p { max-inline-size: 36ch; }
.ftr__contact { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.ftr__contact a { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); padding-inline: 0.75rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); text-decoration: none; font-weight: var(--fw-medium); }
.ftr__contact a:hover { border-color: var(--c-ink); }
.ftr__title { font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink); margin-block-end: var(--space-2); }
:lang(ar) .ftr__title, :lang(he) .ftr__title, :lang(zh-Hans) .ftr__title { text-transform: none; font-size: var(--fs-small); }
.ftr__col a { display: inline-flex; align-items: center; min-block-size: 2.25rem; text-decoration: none; }
.ftr__col a:hover { text-decoration: underline; }
@media (min-width: 768px) { .ftr__top { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1180px) { .ftr__top { grid-template-columns: minmax(0, 4fr) repeat(4, minmax(0, 2fr)); } .ftr__brand { grid-column: auto; } }
.ftr__legal { display: grid; gap: var(--space-3); padding-block-start: var(--space-5); }
.ftr__legal p { max-inline-size: 110ch; line-height: 1.6; }
.ftr__disclaimer { color: var(--c-ink-2); }
.ftr__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-5); padding-block-start: var(--space-4); margin-block-start: var(--space-2); border-block-start: 1px solid var(--c-rule-strong); font-size: var(--fs-micro); color: var(--c-ink-3); }
.ftr__langs { display: flex; flex-wrap: wrap; gap: 0 var(--space-2); }
.ftr__langs a { display: inline-flex; align-items: center; min-block-size: var(--target-min); padding-inline: 0.5rem; text-decoration: none; }
.ftr__langs a[aria-current="true"] { text-decoration: underline; text-decoration-color: var(--c-accent); text-decoration-thickness: 2px; text-underline-offset: 0.45em; }
.ftr__privacy { min-block-size: var(--target-min); padding-inline: 0.5rem; border: 0; background: none; color: var(--c-ink-2); text-decoration: underline; cursor: pointer; }

/* ——— mobile action bar: one contextual action + WhatsApp ——— */
.mbar { position: fixed; z-index: var(--z-mbar); inset-inline: 0; inset-block-end: 0; display: flex; gap: var(--space-2); padding: var(--space-2) var(--page-pad) calc(var(--space-2) + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--c-paper) 94%, transparent); border-block-start: 1px solid var(--c-rule); backdrop-filter: saturate(1.2) blur(8px); }
.mbar .btn { flex: 1; }
.mbar__wa { display: inline-flex; align-items: center; justify-content: center; inline-size: 3rem; min-block-size: 3rem; border: 1px solid var(--c-ink); border-radius: var(--radius-1); color: var(--c-ink); }
.mbar__wa .i { inline-size: 1.4rem; block-size: 1.4rem; }
@media (min-width: 768px) { .mbar { display: none; } }

/* ——— the floating WhatsApp action (desktop): quiet, framed, never a green bubble ——— */
.wa-fab { display: none; }
@media (min-width: 768px) {
  .wa-fab { position: fixed; z-index: var(--z-mbar); inset-inline-end: var(--space-5); inset-block-end: var(--space-5); display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); padding-inline: 0.875rem 1rem; background: var(--c-paper-raised); color: var(--c-ink); border: 1px solid var(--c-ink); border-radius: var(--radius-1); box-shadow: var(--shadow-2); font-size: var(--fs-ui); font-weight: var(--fw-medium); text-decoration: none; }
  .wa-fab:hover { background: var(--c-ink); color: var(--c-on-dark); }
}

/* ——— language suggestion (core.js, never a redirect) ——— */
.langbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-2) var(--space-4); padding: var(--space-2) var(--page-pad); background: var(--c-limestone); font-size: var(--fs-small); }
.langbar .btn { --btn-h: 2.25rem; }
.langbar__x { inline-size: var(--target-min); block-size: var(--target-min); border: 0; background: none; font-size: 1.25rem; cursor: pointer; color: var(--c-ink-2); }

/* ——— 20-components.css ——— */
/* 20-components — buttons, badges, media with honest labels, cards, steps, FAQ, tables, callouts, bands, facts,
   sources, related links, link lists, trust rows, on-this-page navigation, the review line. */

/* ——— buttons: crisp, never pills ——— */
.btn { --btn-h: 3rem; display: inline-flex; align-items: center; justify-content: center; gap: 0.625rem; min-block-size: var(--btn-h); min-inline-size: var(--target-min); padding-inline: 1.375rem; border: 1px solid transparent; border-radius: var(--radius-1); font-family: var(--ff-text); font-size: var(--fs-ui); font-weight: var(--fw-medium); line-height: 1.2; letter-spacing: var(--ls-ui); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background-color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out); }
.btn--primary { background: var(--c-accent); color: var(--c-on-dark); }
.btn--primary:hover { background: var(--c-accent-hover); color: var(--c-on-dark); }
.btn--secondary { background: transparent; color: var(--c-ink); border-color: var(--c-ink); }
.btn--secondary:hover { background: var(--c-limestone); color: var(--c-ink); }
.btn--ghost { background: transparent; color: var(--c-ink); border-color: var(--c-rule-strong); }
.btn--ghost:hover { border-color: var(--c-ink); color: var(--c-ink); }
.btn--text { min-block-size: var(--target-min); padding-inline: 0; color: var(--c-accent); }
.btn--text span { text-decoration: underline; text-underline-offset: 0.25em; }
.btn .i { transition: transform var(--dur-2) var(--ease-out); }
.btn:hover .i--dir { transform: translateX(calc(3px * var(--dir))) scaleX(var(--dir)); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
.sec--dark .btn--primary, .band--dark .btn--primary { background: var(--c-on-dark); color: var(--c-dark); }
.sec--dark .btn--primary:hover { background: #fff; }
.sec--dark .btn--secondary { color: var(--c-on-dark); border-color: var(--c-on-dark); }
.sec--dark .btn--secondary:hover { background: rgba(243, 239, 230, 0.08); }
.link-arrow { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); font-weight: var(--fw-medium); font-size: var(--fs-ui); text-decoration: none; color: var(--c-accent); }
.link-arrow:hover { text-decoration: underline; }

/* ——— eyebrow (page header) ——— */
.eyebrow { display: inline-flex; align-items: center; gap: var(--space-3); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-accent); line-height: 1.3; }
.eyebrow::before { content: ""; inline-size: 0.5rem; block-size: 0.5rem; background: currentColor; }
:lang(ar) .eyebrow, :lang(he) .eyebrow, :lang(zh-Hans) .eyebrow { text-transform: none; font-size: var(--fs-small); }

/* ——— badges: status always in words, with a mark ——— */
.badge { display: inline-flex; align-items: center; gap: 0.375rem; min-block-size: 1.5rem; padding: 0.125rem 0.5rem; border-radius: var(--radius-1); font-size: var(--fs-micro); font-weight: var(--fw-semibold); line-height: 1.2; white-space: nowrap; }
.badge::before { content: ""; inline-size: 0.5rem; block-size: 0.5rem; border-radius: 50%; background: currentColor; }
.badge--available { background: var(--c-accent-tint); color: var(--c-accent); }
.badge--reserved, .badge--sold { background: var(--c-neutral-badge); color: var(--c-ink-2); }
.badge--reserved::before { background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }
.badge--ph { background: transparent; color: var(--c-ink); border: 1px solid var(--c-ink); }
.badge--ph::before { display: none; }

/* ——— media: framed plates, honest labels, CSS crops ——— */
.media { position: relative; }
.media__frame { position: relative; overflow: hidden; background: var(--c-limestone); padding: 0; }
.media img { inline-size: 100%; block-size: auto; }
.media--crop .media__frame { aspect-ratio: var(--ratio, 4 / 3); }
.media--crop .media__frame img, .media--crop .media__frame picture { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; }
.media--crop .media__frame img { object-fit: cover; object-position: var(--focus, 50% 50%); }
.media__label { position: absolute; z-index: 1; inset-block-start: var(--space-2); inset-inline-start: var(--space-2); display: inline-flex; align-items: center; max-inline-size: calc(100% - 2 * var(--space-2)); padding: 0.3125rem 0.5rem; background: var(--c-paper); color: var(--c-ink); border-radius: var(--radius-1); font-size: var(--fs-micro); font-weight: var(--fw-medium); line-height: 1.2; text-wrap: balance; }
.media__label[data-kind="plan"], .media__label[data-kind="key"] { background: var(--c-limestone); }
.media figcaption { display: flex; gap: var(--space-3); margin-block-start: var(--space-3); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); max-inline-size: 60ch; }
.media figcaption::before { content: ""; flex: none; inline-size: 1.5rem; block-size: 1px; margin-block-start: 0.72em; background: var(--c-ink-3); }
.media--plan .media__frame { background: var(--c-mount); border: 1px solid var(--c-rule); }
.media--plan.media--crop .media__frame img { object-fit: contain; padding: var(--space-3); }
.media--plan:not(.media--crop) .media__frame { padding: var(--space-3); }
.media--plan:not(.media--crop) img { max-block-size: 70vh; inline-size: auto; margin-inline: auto; }
.media--wide .media__frame { aspect-ratio: var(--ratio, 21 / 9); }

/* ——— cards ——— */
.cards { display: grid; gap: var(--grid-gap); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .cards--2, .cards--3, .cards--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1120px) { .cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.card { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); background: var(--c-paper-raised); border: 1px solid var(--c-rule); box-shadow: var(--shadow-1); }
.card__icon { color: var(--c-accent); }
.card__n { font-family: var(--font-display); font-weight: 300; font-size: 2rem; line-height: 1; color: var(--c-accent); font-variant-numeric: lining-nums tabular-nums; }
.card__tag { font-size: var(--fs-micro); font-weight: var(--fw-semibold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-ink-3); }
:lang(ar) .card__tag, :lang(he) .card__tag, :lang(zh-Hans) .card__tag { text-transform: none; letter-spacing: 0; }
.card__h { font-size: var(--fs-display-s); }
.card__h a { color: inherit; text-decoration: none; }
.card__h a:hover { color: var(--c-accent); text-decoration: underline; text-decoration-thickness: 1px; }
.card__body { color: var(--c-ink-2); font-size: var(--fs-ui); }
.card__body > * + * { margin-block-start: var(--space-2); }
.card__more { margin-block-start: auto; padding-block-start: var(--space-3); border-block-start: 1px solid var(--c-rule); }
.card__more a { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); text-decoration: none; font-weight: var(--fw-medium); }
.cards--plain .card { background: transparent; border-width: 1px 0 0; border-color: var(--c-ink); box-shadow: none; padding-inline: 0; }
.cards--checklist .card { border-inline-start: 2px solid var(--c-accent); }
.sec--dark .card { background: transparent; border-color: var(--c-rule-on-dark); box-shadow: none; }
.sec--dark .card__h, .sec--dark .card__h a { color: var(--c-on-dark); }
.sec--dark .card__body { color: var(--c-on-dark-2); }
.sec--dark .card__icon, .sec--dark .card__n { color: var(--c-accent-on-dark); }

/* ——— steps: numbered process ——— */
.steps { counter-reset: none; border-block-start: 1px solid var(--c-ink); }
.step { display: grid; grid-template-columns: 3rem minmax(0, 1fr); column-gap: var(--space-4); padding-block: var(--space-5); border-block-end: 1px solid var(--c-rule); }
.step__n { font-family: var(--font-display); font-weight: 300; font-size: 2rem; line-height: 0.95; color: var(--c-accent); font-variant-numeric: lining-nums tabular-nums; }
.step__h { font-family: var(--ff-text); font-size: var(--fs-body); font-weight: var(--fw-semibold); line-height: 1.35; }
.step__meta { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-block: var(--space-1) var(--space-2); }
.step__meta span { display: inline-flex; padding: 0.125rem 0.5rem; background: var(--c-limestone); border-radius: var(--radius-1); font-size: var(--fs-micro); color: var(--c-ink-2); }
.step__body { color: var(--c-ink-2); font-size: var(--fs-ui); }
.step__body > p + p { margin-block-start: var(--space-2); }
.step__more a { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); font-weight: var(--fw-medium); text-decoration: none; }
@media (min-width: 900px) {
  .step { grid-template-columns: 4rem minmax(0, 16rem) minmax(0, 1fr); align-items: baseline; }
  .step__body { display: contents; }
  .step__h { grid-column: 2; }
  .step__body > :not(.step__h) { grid-column: 3; }
  .step__meta { grid-column: 2; grid-row: 2; }
}
.steps--compact .step { padding-block: var(--space-4); }

/* ——— FAQ ——— */
.faq { border-block-start: 1px solid var(--c-ink); }
.faq__item { border-block-end: 1px solid var(--c-rule); }
.faq__item > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); min-block-size: 3.5rem; padding-block: var(--space-4); cursor: pointer; list-style: none; }
.faq__item > summary::-webkit-details-marker { display: none; }
.faq__q { font-family: var(--ff-text); font-size: var(--fs-body); font-weight: var(--fw-semibold); line-height: 1.4; }
.faq__item > summary .i { color: var(--c-accent); transition: transform var(--dur-2) var(--ease-out); }
.faq__item[open] > summary .i { transform: rotate(45deg); }
.faq__item > summary:hover .faq__q { color: var(--c-accent); }
.faq__a { padding-block-end: var(--space-5); max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.faq__a > * + * { margin-block-start: var(--space-3); }
.faq__more a { display: inline-flex; align-items: center; gap: 0.5rem; font-weight: var(--fw-medium); text-decoration: none; }

/* ——— tables ——— */
.table { overflow-x: auto; overscroll-behavior-inline: contain; border-block-start: 1px solid var(--c-ink); }
.table:focus-visible { outline-offset: 2px; }
.table table { inline-size: 100%; border-collapse: collapse; font-size: var(--fs-small); line-height: 1.45; font-variant-numeric: lining-nums tabular-nums; }
.table caption { caption-side: bottom; text-align: start; padding-block-start: var(--space-3); font-size: var(--fs-micro); color: var(--c-ink-3); }
.table th, .table td { padding: 0.75rem var(--space-3); text-align: start; vertical-align: top; border-block-end: 1px solid var(--c-rule); font-weight: var(--fw-regular); }
.table th:first-child, .table td:first-child { padding-inline-start: 0; }
.table thead th { padding-block: var(--space-3) 0.5rem; border-block-end-color: var(--c-ink); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-ink-3); white-space: nowrap; }
:lang(ar) .table thead th, :lang(he) .table thead th, :lang(zh-Hans) .table thead th { text-transform: none; letter-spacing: 0; font-size: var(--fs-micro); }
.table tbody th { color: var(--c-ink); font-weight: var(--fw-medium); }
.table .n { text-align: end; white-space: nowrap; }
.table tfoot th, .table tfoot td { border-block-start: 1px solid var(--c-ink); border-block-end: 0; font-weight: var(--fw-semibold); color: var(--c-ink); }
@media (max-width: 699.98px) { .table table { min-inline-size: 34rem; } }

/* ——— callouts ——— */
.callout { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-3); padding: var(--space-4) var(--space-5); border-inline-start: var(--border-strong) solid; font-size: var(--fs-small); line-height: 1.6; color: var(--c-ink-2); max-inline-size: 52rem; }
.callout > div > * + * { margin-block-start: var(--space-2); }
.callout__h { font-weight: var(--fw-semibold); font-size: var(--fs-ui); color: var(--c-ink); }
.callout--info { background: var(--c-accent-tint); border-color: var(--c-accent); }
.callout--info .i { color: var(--c-accent); }
.callout--warning { background: var(--c-warn-tint); border-color: var(--c-warn); }
.callout--warning .i { color: var(--c-warn); }
.callout--legal, .callout--note { background: var(--c-limestone); border-color: var(--c-ink); }
p.callout { display: block; }

/* ——— CTA band ——— */
.sec--band { background: var(--c-dark); color: var(--c-on-dark); }
.band { display: grid; gap: var(--space-5); align-items: end; }
.band .sec__h, .band h2 { color: var(--c-on-dark); margin-block-end: var(--space-3); }
.band__copy p { color: var(--c-on-dark-2); max-inline-size: var(--measure-lead); font-size: var(--fs-lead); line-height: var(--lh-lead); }
.band .ctas { margin-block-start: 0; }
.band .btn--primary { background: var(--c-on-dark); color: var(--c-dark); }
.band .btn--primary:hover { background: #fff; color: var(--c-dark); }
.band .btn--secondary { color: var(--c-on-dark); border-color: var(--c-on-dark); }
.band .btn--secondary:hover { background: rgba(243, 239, 230, 0.08); color: var(--c-on-dark); }
.band :focus-visible { outline-color: var(--c-focus-on-dark); }
@media (min-width: 960px) { .band { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 2); } .band .ctas { justify-content: flex-end; } }

/* ——— stats and facts ——— */
.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-4); border-block: 1px solid var(--c-ink); }
.stat { padding: var(--space-4) 0 var(--space-5); border-block-end: 1px solid var(--c-rule); }
.stat dt { font-size: var(--fs-small); color: var(--c-ink-3); }
.stat dd { font-family: var(--ff-display); font-weight: var(--fw-display-light); font-size: var(--fs-display-m); line-height: 1.1; color: var(--c-ink); font-variant-numeric: lining-nums; }
.stat__note { display: block; font-family: var(--ff-text); font-weight: var(--fw-regular); font-size: var(--fs-micro); line-height: 1.5; color: var(--c-ink-3); margin-block-start: var(--space-2); }
@media (min-width: 900px) { .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-4); border-block: 1px solid var(--c-ink); }
.facts > div { padding-block: var(--space-3) var(--space-4); border-block-end: 1px solid var(--c-rule); }
.facts dt { font-size: var(--fs-micro); color: var(--c-ink-3); margin-block-end: 0.125rem; }
.facts dd { font-size: var(--fs-ui); font-weight: var(--fw-medium); line-height: 1.4; color: var(--c-ink); font-variant-numeric: lining-nums tabular-nums; }
@media (min-width: 900px) { .facts { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-5); } }

/* ——— sources, related, link lists, trust ——— */
.sources { border-block-start: 1px solid var(--c-ink); padding-block-start: var(--space-4); max-inline-size: 52rem; }
.sources__h { font-family: var(--ff-text); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink); margin-block-end: var(--space-3); }
:lang(ar) .sources__h, :lang(he) .sources__h, :lang(zh-Hans) .sources__h { text-transform: none; font-size: var(--fs-small); }
.sources__list { counter-reset: src; display: grid; gap: var(--space-2); font-size: var(--fs-small); color: var(--c-ink-2); }
.sources__list li { counter-increment: src; display: grid; grid-template-columns: 2rem minmax(0, 1fr); }
.sources__list li::before { content: counter(src) "."; color: var(--c-ink-3); font-variant-numeric: tabular-nums; }
.sources__date { grid-column: 2; color: var(--c-ink-3); }   /* under its link, not in the counter column */
.related { display: grid; gap: 0; border-block-start: 1px solid var(--c-ink); }
@media (min-width: 900px) { .related { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--grid-gap); } }
.related__item a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-1) var(--space-3); align-items: start; padding-block: var(--space-4); border-block-end: 1px solid var(--c-rule); color: var(--c-ink); text-decoration: none; }
.related__t { font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: 1.25; }
.related__d { grid-column: 1; font-size: var(--fs-small); color: var(--c-ink-2); }
.related__item .i { grid-column: 2; grid-row: 1; color: var(--c-accent); }
.related__item a:hover .related__t { color: var(--c-accent); text-decoration: underline; text-decoration-thickness: 1px; }
.linklist { display: grid; border-block-start: 1px solid var(--c-ink); }
@media (min-width: 900px) { .linklist { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gap); } }
.linklist a { display: grid; gap: 0.25rem; padding-block: var(--space-4); border-block-end: 1px solid var(--c-rule); text-decoration: none; color: var(--c-ink); }
.linklist__t { font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: 1.25; }
.linklist__d { font-size: var(--fs-small); color: var(--c-ink-2); }
.linklist a:hover .linklist__t { color: var(--c-accent); text-decoration: underline; text-decoration-thickness: 1px; }
.trust { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-block: 1px solid var(--c-ink); }
.trust li { display: flex; gap: var(--space-2); align-items: flex-start; padding: var(--space-4) var(--space-3) var(--space-4) 0; border-block-end: 1px solid var(--c-rule); font-size: var(--fs-small); line-height: 1.4; color: var(--c-ink); }
.trust .i { color: var(--c-accent); margin-block-start: 0.05rem; }
@media (min-width: 900px) { .trust { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-4); } }

/* ——— on-this-page navigation ——— */
.toc { padding-block-start: var(--space-3); border-block-start: 1px solid var(--c-ink); font-size: var(--fs-small); }
.toc__h { font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink); margin-block-end: var(--space-2); }
:lang(ar) .toc__h, :lang(he) .toc__h, :lang(zh-Hans) .toc__h { text-transform: none; font-size: var(--fs-small); }
.toc ol { display: grid; gap: 0; }
.toc a { display: block; padding-block: 0.4rem; color: var(--c-ink-2); text-decoration: none; border-inline-start: 2px solid transparent; padding-inline-start: var(--space-3); }
.toc a:hover, .toc a[aria-current="true"] { color: var(--c-accent); border-inline-start-color: var(--c-accent); }
@media (max-width: 1119.98px) { .toc { display: none; } }

/* ——— the review line: sources checked · legal review status · not advice ——— */
.review { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; margin-block-start: var(--space-4); font-size: var(--fs-micro); color: var(--c-ink-3); }
.review .i { inline-size: 1rem; block-size: 1rem; color: var(--c-ink-3); }
.review span + span::before { content: "·"; margin-inline-end: 0.75rem; color: var(--c-rule-strong); }

/* ——— 30-heroes.css ——— */
/* 30-heroes — the home hero (Golden-Visa-first; imagery framed, never a dark full-bleed photo with white text),
   the page header of hub/article/tool pages, and the residence hero. */
.hero { padding-block: var(--space-6) var(--space-7); }
.hero__grid { display: grid; gap: var(--space-6); }
.hero__copy { display: grid; gap: var(--space-4); align-content: start; }
.hero__h1 { margin-block-start: var(--space-1); }
.hero__sub { font-family: var(--ff-display); font-size: var(--fs-display-m); line-height: var(--lh-display-m); color: var(--c-accent); font-weight: var(--fw-display); }
.hero__lead { font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--c-ink-2); max-inline-size: var(--measure-lead); }
.hero__lead p + p { margin-block-start: var(--space-3); }
.hero .ctas { margin-block-start: var(--space-2); }
.hero__trust { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-4); margin-block-start: var(--space-5); border-block-start: 1px solid var(--c-ink); }
.hero__trust li { display: flex; gap: var(--space-2); align-items: flex-start; padding-block: var(--space-3); border-block-end: 1px solid var(--c-rule); font-size: var(--fs-small); font-weight: var(--fw-medium); line-height: 1.35; color: var(--c-ink); }
.hero__trust .i { color: var(--c-accent); inline-size: 1.1rem; block-size: 1.1rem; margin-block-start: 0.05rem; }
.hero__note { font-size: var(--fs-micro); line-height: 1.5; color: var(--c-ink-3); max-inline-size: 56ch; }
.hero__media { min-inline-size: 0; }
.hero__media .media__frame { border: 1px solid var(--c-rule); }
@media (min-width: 768px) { .hero__trust { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1120px) {
  .hero { padding-block: var(--space-8); }
  .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 2.5); align-items: start; }
}
@media (max-width: 767.98px) { .hero__media { order: -1; } .hero__media.media--crop .media__frame { aspect-ratio: 16 / 11; } }

/* horizon (home): one reading column, then the Patras panorama as a wide band between the promise and the proof.
   The copy wrapper dissolves (display: contents) so the band can sit between the calls to action and the trust row. */
.hero--horizon .hero__grid { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-4); }
.hero--horizon .hero__copy { display: contents; }
.hero--horizon .hero__h1 { max-inline-size: 18ch; }
.hero--horizon .hero__media { order: 1; margin-block-start: var(--space-4); }
.hero--horizon .hero__trust { order: 2; margin-block-start: var(--space-2); }
.hero--horizon .hero__note { order: 3; }
.hero--horizon .hero__media.media--crop .media__frame { aspect-ratio: var(--ratio); }
@media (max-width: 767.98px) {
  .hero--horizon { padding-block-start: 0; }
  .hero--horizon .hero__media { order: -1; inline-size: calc(100% + 2 * var(--page-pad)); margin-block: 0 var(--space-3); margin-inline: calc(-1 * var(--page-pad)); }
  .hero--horizon .hero__media.media--crop .media__frame { aspect-ratio: 5 / 2; border-inline: 0; border-block-start: 0; }
}
/* wide screens: the promise (h1) on the left, the explanation and the calls to action on the right, the band below */
@media (min-width: 1120px) {
  .hero--horizon .hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 2.5); row-gap: var(--space-4); align-items: start; }
  .hero--horizon .eyebrow { grid-column: 1 / -1; grid-row: 1; }
  .hero--horizon .hero__h1 { grid-column: 1; grid-row: 2 / span 3; max-inline-size: 15ch; }
  .hero--horizon .hero__sub { grid-column: 2; grid-row: 2; padding-block-start: var(--space-3); }
  .hero--horizon .hero__lead { grid-column: 2; grid-row: 3; font-size: var(--fs-body); line-height: var(--lh-body); }
  .hero--horizon .ctas { grid-column: 2; grid-row: 4; margin-block-start: 0; }
  .hero--horizon .hero__media { grid-column: 1 / -1; grid-row: 5; margin-block-start: var(--space-5); }
  .hero--horizon .hero__trust { grid-column: 1 / -1; grid-row: 6; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero--horizon .hero__note { grid-column: 1 / -1; grid-row: 7; }
}

/* page header (hub, article, tool, legal) */
.phead { padding-block: var(--space-6) var(--space-6); border-block-end: 1px solid var(--c-rule); }
.phead__grid { display: grid; gap: var(--space-6); }
.phead__copy { display: grid; gap: var(--space-3); align-content: start; }
.phead__copy > .crumbs { margin-block-end: var(--space-3); }
.phead__h1 { max-inline-size: 20ch; }
.phead__lead { font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--c-ink-2); max-inline-size: var(--measure-lead); margin-block-start: var(--space-2); }
.phead__lead p + p { margin-block-start: var(--space-3); }
.phead--compact .phead__h1 { font-size: var(--fs-display-l); line-height: var(--lh-display-l); max-inline-size: 24ch; }
@media (min-width: 1120px) {
  .phead { padding-block: var(--space-7); }
  .phead--media .phead__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 2.5); align-items: end; }
}

/* residence hero */
.uhero { padding-block: var(--space-6) var(--space-7); border-block-end: 1px solid var(--c-rule); }
.uhero__grid { display: grid; gap: var(--space-6); }
.uhero__copy { display: grid; gap: var(--space-3); align-content: start; }
.uhero__copy > .crumbs { margin-block-end: var(--space-2); }
.uhero__h1 { font-size: var(--fs-display-l); line-height: var(--lh-display-l); max-inline-size: 22ch; }
.uhero__top { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.uhero__project { font-size: var(--fs-small); color: var(--c-ink-3); margin-inline-start: var(--space-2); }
.uhero__layout { font-family: var(--ff-display); font-size: var(--fs-display-s); color: var(--c-accent); }
.uhero__lead { font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--c-ink-2); max-inline-size: var(--measure-lead); }
.uhero__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2) var(--space-4); padding-block: var(--space-4) var(--space-2); border-block-start: 1px solid var(--c-ink); margin-block-start: var(--space-3); }
.uhero__price-v { font-family: var(--font-display); font-size: var(--fs-display-m); font-weight: 400; line-height: 1; color: var(--c-ink); font-variant-numeric: lining-nums; }
:lang(ar) .uhero__price-v, :lang(he) .uhero__price-v, :lang(zh-Hans) .uhero__price-v { font-family: var(--ff-display); }
.uhero__price-n { font-size: var(--fs-small); color: var(--c-ink-3); }
.uhero__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-4); border-block-start: 1px solid var(--c-rule-strong); }
.uhero__facts > div { padding-block: var(--space-3); border-block-end: 1px solid var(--c-rule); }
.uhero__facts dt { font-size: var(--fs-micro); color: var(--c-ink-3); }
.uhero__facts dd { font-size: var(--fs-ui); font-weight: var(--fw-medium); color: var(--c-ink); font-variant-numeric: lining-nums tabular-nums; }
@media (min-width: 600px) { .uhero__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.uhero__route { display: flex; gap: var(--space-2); align-items: flex-start; font-size: var(--fs-small); color: var(--c-ink-3); max-inline-size: 60ch; }
.uhero__route .i { inline-size: 1rem; block-size: 1rem; margin-block-start: 0.2rem; }
@media (min-width: 1120px) {
  .uhero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 2.5); align-items: start; }
  .uhero__media { position: sticky; inset-block-start: calc(var(--header-h) + var(--space-5)); }
}
@media (max-width: 1119.98px) { .uhero__media.media--crop .media__frame { aspect-ratio: 16 / 11; } }

/* ——— 40-data.css ——— */
/* 40-data — the €800k/€400k/€250k threshold chart, project progress, residence cards, filters and comparison. */

/* ——— thresholds: one highlighted bar (the €250,000 route), the others as context ——— */
.tiers { display: grid; border-block-start: 1px solid var(--c-ink); }
.tier { display: grid; gap: var(--space-3); padding-block: var(--space-5); border-block-end: 1px solid var(--c-rule); }
.tier__bar { position: relative; block-size: 2.75rem; background-image: linear-gradient(var(--c-chart-grid), var(--c-chart-grid)), linear-gradient(var(--c-chart-grid), var(--c-chart-grid)), linear-gradient(var(--c-chart-grid), var(--c-chart-grid)), linear-gradient(var(--c-chart-grid), var(--c-chart-grid)), linear-gradient(var(--c-chart-grid), var(--c-chart-grid)); background-size: 1px 100%; background-repeat: no-repeat; background-position: 0 0, 25% 0, 50% 0, 75% 0, 100% 0; }
[dir="rtl"] .tier__bar { background-position: 100% 0, 75% 0, 50% 0, 25% 0, 0 0; }
.tier__bar::before { content: ""; position: absolute; inset-block: 0.75rem; inset-inline-start: 0; inline-size: var(--w); background: var(--c-chart-context); border-start-end-radius: var(--radius-2); border-end-end-radius: var(--radius-2); }
.tier--focus .tier__bar::before { background: var(--c-chart-highlight); }
.tier__v { position: absolute; inset-block-start: 50%; inset-inline-start: calc(var(--w) + var(--space-3)); translate: 0 -50%; font-family: var(--font-display); font-size: clamp(1.25rem, 1.1rem + 0.7vw, 1.75rem); font-weight: 400; line-height: 1; color: var(--c-ink); font-variant-numeric: lining-nums; white-space: nowrap; }
.tier--focus .tier__v { color: var(--c-accent); }
.tier[style*="--w:100%"] .tier__v { inset-inline-start: auto; inset-inline-end: var(--space-3); color: var(--c-on-dark); }
.tier__h { font-size: var(--fs-body); font-weight: var(--fw-semibold); color: var(--c-ink); }
.tier__where { font-size: var(--fs-ui); color: var(--c-ink-2); }
.tier__rule { font-size: var(--fs-small); color: var(--c-ink-3); }
.tier--focus .tier__h::after { content: ""; display: inline-block; inline-size: 0.6rem; block-size: 0.6rem; margin-inline-start: 0.5rem; background: var(--c-chart-highlight); vertical-align: middle; }
@media (min-width: 900px) {
  .tier { grid-template-columns: minmax(0, 0.58fr) minmax(0, 0.42fr); column-gap: var(--space-6); align-items: center; }
  .tier__bar { grid-column: 1; grid-row: 1; }
  .tier__txt { grid-column: 2; }
}

/* ——— project progress ——— */
.ms__updated { font-size: var(--fs-small); color: var(--c-ink-3); margin-block-end: var(--space-4); }
.milestones { position: relative; display: grid; gap: 0; border-block-start: 1px solid var(--c-ink); }
.ms { position: relative; display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); column-gap: var(--space-4); padding-block: var(--space-5); border-block-end: 1px solid var(--c-rule); }
.ms__dot { position: relative; inline-size: 0.875rem; block-size: 0.875rem; margin-block-start: 0.35rem; border: 2px solid var(--c-rule-strong); border-radius: 50%; background: var(--c-paper); }
.ms--completed .ms__dot { background: var(--c-accent); border-color: var(--c-accent); }
.ms--current .ms__dot, .ms--open .ms__dot { border-color: var(--c-accent); box-shadow: 0 0 0 4px var(--c-accent-tint); }
.ms__meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-3); align-items: center; margin-block-end: var(--space-1); font-size: var(--fs-micro); }
.ms__status { display: inline-flex; padding: 0.125rem 0.5rem; border-radius: var(--radius-1); background: var(--c-neutral-badge); color: var(--c-ink-2); font-weight: var(--fw-semibold); }
.ms--completed .ms__status, .ms--current .ms__status, .ms--open .ms__status { background: var(--c-accent-tint); color: var(--c-accent); }
.ms__when { color: var(--c-ink-3); font-variant-numeric: lining-nums tabular-nums; }
.ms__h { font-family: var(--ff-text); font-size: var(--fs-body); font-weight: var(--fw-semibold); }
.ms__body > p, .ms__body > ul { margin-block-start: var(--space-2); color: var(--c-ink-2); font-size: var(--fs-ui); max-inline-size: var(--measure-text); }
@media (min-width: 900px) { .ms { grid-template-columns: 1.5rem minmax(0, 14rem) minmax(0, 1fr); } .ms__meta { grid-column: 2; grid-row: 1 / span 2; flex-direction: column; align-items: flex-start; } .ms__body { display: contents; } .ms__h, .ms__body > p, .ms__body > ul { grid-column: 3; } }

/* ——— residences: cards, filters, comparison ——— */
.rgrid { display: grid; gap: var(--grid-gap); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px) { .rgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1120px) { .rgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .rgrid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rgrid > li[hidden] { display: none; }
.rcard { block-size: 100%; display: flex; flex-direction: column; background: var(--c-paper-raised); border: 1px solid var(--c-rule); box-shadow: var(--shadow-1); transition: border-color var(--dur-1) var(--ease-out); }
.rcard:hover { border-color: var(--c-rule-strong); }
.rcard__media { display: block; padding: var(--space-2) var(--space-2) 0; }
.rcard__body { flex: 1; display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); }
.rcard__top { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.rcard__h { font-family: var(--font-display); font-weight: 400; font-size: 1.75rem; line-height: 1.05; }
:lang(ar) .rcard__h, :lang(he) .rcard__h, :lang(zh-Hans) .rcard__h { font-family: var(--ff-display); font-size: 1.5rem; }
.rcard__h a { color: var(--c-ink); text-decoration: none; }
.rcard__h a::after { content: ""; position: absolute; inset: 0; }
.rcard { position: relative; }
.rcard__h a:hover { color: var(--c-accent); }
.rcard__layout { font-size: var(--fs-small); color: var(--c-ink-2); }
.rcard__facts { display: flex; flex-wrap: wrap; gap: 0.25rem var(--space-3); font-size: var(--fs-ui); font-weight: var(--fw-medium); color: var(--c-ink); font-variant-numeric: lining-nums tabular-nums; }
.rcard__facts li + li::before { content: "·"; margin-inline-end: var(--space-3); color: var(--c-rule-strong); }
.rcard__extras { font-size: var(--fs-small); color: var(--c-ink-3); }
.rcard__price { margin-block-start: auto; padding-block-start: var(--space-3); border-block-start: 1px solid var(--c-ink); font-family: var(--font-display); font-size: 1.5rem; line-height: 1.1; color: var(--c-ink); font-variant-numeric: lining-nums; }
:lang(ar) .rcard__price, :lang(he) .rcard__price, :lang(zh-Hans) .rcard__price { font-family: var(--ff-display); font-size: 1.25rem; }
.rcard--reserved .rcard__price, .rcard--sold .rcard__price { color: var(--c-ink-3); }
.rcard__cmp { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); font-size: var(--fs-small); font-weight: var(--fw-medium); cursor: pointer; }
.rcard__cmp input { inline-size: 1.125rem; block-size: 1.125rem; accent-color: var(--c-accent); }
.rcard .media__label { font-size: 0.75rem; }

.filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3) var(--space-4); margin-block-end: var(--space-5); padding-block: var(--space-4); border-block: 1px solid var(--c-rule); }
.filters[hidden] { display: none; }
.filters .chk { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); font-size: var(--fs-ui); font-weight: var(--fw-medium); cursor: pointer; }
.filters .chk input { inline-size: 1.125rem; block-size: 1.125rem; accent-color: var(--c-accent); }
.filters .sel { display: grid; gap: 0.25rem; font-size: var(--fs-micro); color: var(--c-ink-3); }
.filters select { min-block-size: var(--target-min); min-inline-size: 9rem; padding-inline: 0.75rem 2rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); color: var(--c-ink); font-size: var(--fs-ui); }
.filters__count { margin-inline-start: auto; font-size: var(--fs-small); color: var(--c-ink-3); }
.compare { margin-block-start: var(--space-7); padding: var(--space-5); background: var(--c-paper-raised); border: 1px solid var(--c-ink); }
.compare[hidden] { display: none; }
.compare__hint { margin-block-start: var(--space-3); font-size: var(--fs-small); color: var(--c-ink-3); }
.avail-status { display: flex; align-items: center; gap: var(--space-3); margin-block-end: var(--space-3); }

/* ——— residence cards lead with the residence's own plan, on a white mount ——— */
.rcard .media--plan .media__frame { border: 0; border-block-end: 1px solid var(--c-rule); }

/* ——— 41-unit.css ——— */
/* 41-unit — residence-page sections: plan figures, room table, storage, outdoor, distances, mini-timeline. */
.plan { display: grid; gap: var(--space-6); }
.plan__copy { max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.plan__copy > * + * { margin-block-start: var(--space-3); }
.plan__figs { display: grid; gap: var(--space-5); }
@media (min-width: 1120px) {
  .plan { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: calc(var(--grid-gap) * 2); align-items: start; }
  .plan__figs { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: start; }
}
.plan__main .media__frame img { max-block-size: 78vh; inline-size: auto; margin-inline: auto; }
.sec .split > .media--plan { max-inline-size: 30rem; }
.lead-num { font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: 1.3; color: var(--c-ink); }
.dist { display: grid; border-block-start: 1px solid var(--c-ink); align-self: start; }
.dist li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--space-4); align-items: baseline; padding-block: 0.75rem; border-block-end: 1px solid var(--c-rule); font-size: var(--fs-small); }
.dist__name { color: var(--c-ink); font-weight: var(--fw-medium); }
.dist__v { color: var(--c-ink-2); text-align: end; font-variant-numeric: lining-nums tabular-nums; }
.mini-ms { display: grid; border-block-start: 1px solid var(--c-ink); align-self: start; }
.mini-ms li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0.125rem var(--space-3); padding-block: 0.75rem; border-block-end: 1px solid var(--c-rule); }
.mini-ms__s { grid-row: span 2; align-self: start; padding: 0.125rem 0.5rem; border-radius: var(--radius-1); background: var(--c-neutral-badge); font-size: var(--fs-micro); font-weight: var(--fw-semibold); color: var(--c-ink-2); }
.mini-ms .ms--open .mini-ms__s, .mini-ms .ms--current .mini-ms__s, .mini-ms .ms--completed .mini-ms__s { background: var(--c-accent-tint); color: var(--c-accent); }
.mini-ms__h { font-weight: var(--fw-semibold); font-size: var(--fs-ui); }
.mini-ms__w { font-size: var(--fs-small); color: var(--c-ink-3); }
.facts--unit { margin-block-start: var(--space-2); }
.sec--avail { background: var(--c-limestone); }
.sec--avail + .sec { padding-block-start: var(--space-section); }
.sec--avail .callout { margin-block-start: var(--space-5); background: var(--c-paper-raised); }
.sec--plan .media__frame { background: var(--c-mount); }

/* ——— 51-checker.css ——— */
/* 51-checker — the eligibility checker (tools/blocks/checker.mjs + assets/js/checker.js): the static overview shown
   without JavaScript, the six-step card, the country combobox, the summary and the optional e-mail copy.
   Logical properties only (the same rules lay out RTL); every control at least 44 px; the one accent marks the chosen
   answer and the €250,000 route, never decoration; motion only when the visitor has not asked for less. */

.chk { max-inline-size: 52rem; }
.chk__p { max-inline-size: var(--measure-text); }
.chk__fine { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); max-inline-size: var(--measure-text); }
.chk__disc { padding: var(--space-4) var(--space-5); background: var(--c-limestone); border-inline-start: var(--border-strong) solid var(--c-ink); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); max-inline-size: 52rem; }

/* ——— without JavaScript: the questions, the routes and the family rules, as reading matter ——— */
.chk__static { color: var(--c-ink-2); }
.chk__static > * + * { margin-block-start: var(--space-4); }
.chk__static > .chk__sh { margin-block-start: var(--space-7); }
.chk__lead { font-size: var(--fs-lead); line-height: var(--lh-lead); max-inline-size: var(--measure-lead); }
.chk__sh { font-size: var(--fs-display-m); line-height: var(--lh-display-m); }
.chk__qlist { border-block-start: 1px solid var(--c-ink); }
.chk__qi { display: grid; grid-template-columns: 3rem minmax(0, 1fr); column-gap: var(--space-4); padding-block: var(--space-5); border-block-end: 1px solid var(--c-rule); }
.chk__qn { font-family: var(--font-display); font-weight: 300; font-size: 2rem; line-height: 0.95; color: var(--c-accent); font-variant-numeric: lining-nums tabular-nums; }
.chk__qb { display: grid; gap: var(--space-2); font-size: var(--fs-ui); max-inline-size: var(--measure-text); }
.chk__qh { font-family: var(--ff-text); font-size: var(--fs-body); font-weight: var(--fw-semibold); line-height: 1.35; color: var(--c-ink); }
.chk__ql { font-weight: var(--fw-semibold); color: var(--c-ink); }
.chk__qo { font-size: var(--fs-small); color: var(--c-ink-3); }

/* ——— the routes (overview and summary): the amount as a figure, the €250,000 route in the accent ——— */
.chk__routes { border-block-start: 1px solid var(--c-ink); }
.chk__route { display: grid; grid-template-columns: minmax(8.5rem, auto) minmax(0, 1fr); column-gap: var(--space-5); align-items: baseline; padding-block: var(--space-4); border-block-end: 1px solid var(--c-rule); }
.chk__amt { font-family: var(--font-display); font-weight: 400; font-size: clamp(1.375rem, 1.2rem + 0.6vw, 1.75rem); line-height: 1.1; color: var(--c-ink); font-variant-numeric: lining-nums; white-space: nowrap; }
:lang(ar) .chk__amt, :lang(he) .chk__amt, :lang(zh-Hans) .chk__amt { font-family: var(--ff-display); }
.chk__route--focus .chk__amt { color: var(--c-accent); }
.chk__rtx { display: grid; gap: 0.25rem; }
.chk__rt { font-size: var(--fs-ui); font-weight: var(--fw-semibold); color: var(--c-ink); }
.chk__rd { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
@media (max-width: 559.98px) { .chk__route { grid-template-columns: minmax(0, 1fr); row-gap: var(--space-2); } }

/* ——— the card ——— */
.chk__form, .chk__out { background: var(--c-paper-raised); border: 1px solid var(--c-rule); box-shadow: var(--shadow-1); padding: clamp(1.25rem, 0.9rem + 1.6vw, 2.5rem); }
.chk__step { margin: 0; padding: 0; border: 0; min-inline-size: 0; }
.chk__legend { float: left; inline-size: 100%; padding: 0; margin-block-end: var(--space-3); }
.chk__legend + * { clear: both; }
.chk__bar { display: block; block-size: 2px; margin-block-end: var(--space-5); background: var(--c-limestone-deep); }
.chk__bar > span { display: block; block-size: 100%; background: var(--c-accent); }
.chk__q { display: grid; gap: var(--space-3); font-size: var(--fs-display-m); line-height: var(--lh-display-m); font-weight: var(--fw-display-light); }
.chk__q:focus, .chk__rtitle:focus, .chk__mh:focus, .chk__ok:focus { outline: none; }
.chk__count { font-family: var(--ff-text); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); line-height: 1.3; text-transform: uppercase; color: var(--c-ink-3); }
:lang(ar) .chk__count, :lang(he) .chk__count, :lang(zh-Hans) .chk__count { text-transform: none; letter-spacing: 0; font-size: var(--fs-small); }
.chk__qt { display: block; }
.chk__hint { margin-block-end: var(--space-5); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); max-inline-size: var(--measure-text); }

/* answers: the native control stays visible (honest state in every mode), the whole chip is the target */
.chk__opts { display: grid; gap: var(--space-2); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .chk__opts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.chk__opts--solo { grid-template-columns: minmax(0, auto); justify-content: start; margin-block-start: var(--space-4); }
.chk__opt { display: flex; align-items: center; gap: var(--space-3); min-block-size: 3rem; padding: 0.625rem 0.875rem; background: var(--c-paper); border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); font-size: var(--fs-ui); font-weight: var(--fw-medium); line-height: 1.3; color: var(--c-ink); cursor: pointer; transition: border-color var(--dur-1) var(--ease-out), background-color var(--dur-1) var(--ease-out); }
.chk__opt:hover { border-color: var(--c-ink); }
.chk__opt input { flex: none; inline-size: 1.125rem; block-size: 1.125rem; margin: 0; accent-color: var(--c-accent); }
.chk__opt.is-on, .chk__opt:has(input:checked) { border-color: var(--c-accent); background: var(--c-accent-tint); box-shadow: inset 0 0 0 1px var(--c-accent); }
@supports selector(:has(*)) {
  .chk__opt input:focus-visible { outline: none; }
  .chk__opt:has(input:focus-visible) { outline: var(--border-strong) solid var(--c-focus); outline-offset: 2px; }
}
.chk__step.is-invalid .chk__opt:not(.is-on) { border-color: var(--c-warn); }
.chk__err { font-size: var(--fs-small); font-weight: var(--fw-medium); line-height: var(--lh-small); color: var(--c-warn); }
.chk__err:not(:empty) { display: flex; align-items: baseline; gap: var(--space-2); margin-block-start: var(--space-3); }
.chk__err:not(:empty)::before { content: ""; flex: none; inline-size: 0.5rem; block-size: 0.5rem; background: currentColor; }

/* ——— the country combobox ——— */
.chk__combo { position: relative; max-inline-size: 30rem; }
.chk__lbl { display: block; margin-block-end: var(--space-2); font-size: var(--fs-small); font-weight: var(--fw-semibold); color: var(--c-ink); }
.chk__cbx { position: relative; }
.chk__input, .chk__finput { inline-size: 100%; min-block-size: 3rem; padding: 0.625rem 0.875rem; background: var(--c-paper); border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); font-size: 1rem; line-height: 1.4; color: var(--c-ink); }
.chk__input { padding-inline-end: 3rem; }
.chk__input::placeholder, .chk__finput::placeholder { color: var(--c-ink-3); opacity: 1; }
.chk__input:hover, .chk__finput:hover { border-color: var(--c-ink); }
.chk__input:focus-visible, .chk__finput:focus-visible { border-color: var(--c-ink); outline: var(--border-strong) solid var(--c-focus); outline-offset: 2px; }
.chk__input[aria-invalid="true"], .chk__finput[aria-invalid="true"] { border-color: var(--c-warn); box-shadow: inset 0 0 0 1px var(--c-warn); }
.chk__cbtn { position: absolute; inset-block: 0; inset-inline-end: 0; display: grid; place-items: center; inline-size: 3rem; padding: 0; background: none; border: 0; color: var(--c-ink-2); cursor: pointer; }
.chk__cbtn .i { transition: transform var(--dur-2) var(--ease-out); }
.chk__combo.is-open .chk__cbtn .i { transform: rotate(180deg); }
.chk__lb { position: absolute; z-index: 6; inset-inline: 0; inset-block-start: calc(100% + 4px); max-block-size: min(18rem, 45vh); margin: 0; padding: 0.25rem 0; overflow-y: auto; overscroll-behavior: contain; list-style: none; background: var(--c-paper-raised); border: 1px solid var(--c-ink); box-shadow: var(--shadow-2); }
.chk__lb:focus { outline: none; }
.chk__lb [role="option"] { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); min-block-size: 2.75rem; padding: 0.5rem 0.875rem; font-size: var(--fs-ui); line-height: 1.3; color: var(--c-ink); cursor: pointer; }
.chk__lb [role="option"]:hover { background: var(--c-limestone); }
.chk__lb .is-active, .chk__lb .is-active:hover { background: var(--c-accent-tint); box-shadow: inset calc(2px * var(--dir)) 0 0 var(--c-accent); }
.chk__lb .is-chosen { font-weight: var(--fw-semibold); }
/* a tick drawn as a glyph: physical sides on purpose, a tick does not mirror in RTL */
.chk__lb .is-chosen::after { content: ""; flex: none; inline-size: 0.75rem; block-size: 0.4rem; margin-block-start: -0.2rem; border-left: 2px solid var(--c-accent); border-bottom: 2px solid var(--c-accent); transform: rotate(-45deg); }
.chk__none { margin-block-start: var(--space-2); font-size: var(--fs-small); color: var(--c-ink-3); }

/* ——— Back / Next ——— */
.chk__nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-block-start: var(--space-6); padding-block-start: var(--space-5); border-block-start: 1px solid var(--c-rule); }
.chk__next { margin-inline-start: auto; }
.chk__back .i { transform: scaleX(calc(-1 * var(--dir))); }
.chk__back:hover .i--dir { transform: translateX(calc(-3px * var(--dir))) scaleX(calc(-1 * var(--dir))); }
@media (max-width: 479.98px) { .chk__nav .btn { flex: 1 1 0; padding-inline: 1rem; } }

/* ——— the summary ——— */
.chk__out > * + * { margin-block-start: var(--space-7); }
.chk__res > * + * { margin-block-start: var(--space-6); }
.chk__rh { display: grid; gap: var(--space-4); }
.chk__rtitle { display: flex; align-items: center; gap: var(--space-3); font-family: var(--ff-text); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); line-height: 1.3; text-transform: uppercase; color: var(--c-ink); }
.chk__rtitle::before { content: ""; flex: none; inline-size: 0.5rem; block-size: 0.5rem; background: var(--c-accent); }
:lang(ar) .chk__rtitle, :lang(he) .chk__rtitle, :lang(zh-Hans) .chk__rtitle { text-transform: none; letter-spacing: 0; font-size: var(--fs-small); }
.chk__verdict { max-inline-size: 30ch; font-family: var(--ff-display); font-size: var(--fs-display-m); line-height: var(--lh-display-m); font-weight: var(--fw-display-light); color: var(--c-ink); text-wrap: pretty; }
.chk__verdict strong { font-weight: var(--fw-display-strong); color: var(--c-accent); }
.chk__sub { max-inline-size: var(--measure-text); font-size: var(--fs-ui); color: var(--c-ink-2); }
.chk__part { padding-block-start: var(--space-5); border-block-start: 1px solid var(--c-ink); }
.chk__part > * + * { margin-block-start: var(--space-4); }
.chk__part > .chk__fine--top { margin-block-start: var(--space-2); }
.chk__ph { font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: var(--lh-display-s); font-weight: var(--fw-display); color: var(--c-ink); }
.chk__costs { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-3); font-size: var(--fs-ui); color: var(--c-ink-2); }
.chk__em { padding-inline-start: var(--space-4); border-inline-start: var(--border-strong) solid var(--c-accent); font-weight: var(--fw-medium); color: var(--c-ink); }
.chk__marks { border-block-start: 1px solid var(--c-rule); }
.chk__mark { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-3); align-items: start; padding-block: var(--space-3); border-block-end: 1px solid var(--c-rule); font-size: var(--fs-ui); color: var(--c-ink); }
.chk__mark .i { margin-block-start: 0.05rem; color: var(--c-accent); }
.chk__mark--no .i { color: var(--c-warn); }
.chk__mark--info .i { color: var(--c-ink-3); }
.chk__goals { border-block-start: 1px solid var(--c-rule); }
.chk__goals > div { display: grid; gap: 0.25rem; padding-block: var(--space-3); border-block-end: 1px solid var(--c-rule); }
.chk__goals dt { font-size: var(--fs-ui); font-weight: var(--fw-semibold); color: var(--c-ink); }
.chk__goals dd { margin: 0; font-size: var(--fs-ui); color: var(--c-ink-2); }
@media (min-width: 760px) { .chk__goals > div { grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); column-gap: var(--space-5); } }
.chk__qs { counter-reset: chkq; border-block-start: 1px solid var(--c-rule); }
.chk__qs li { counter-increment: chkq; display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--space-3); padding-block: var(--space-3); border-block-end: 1px solid var(--c-rule); font-size: var(--fs-ui); color: var(--c-ink); }
.chk__qs li::before { content: counter(chkq, decimal-leading-zero); font-family: var(--font-display); font-size: 1.25rem; line-height: 1.15; color: var(--c-accent); font-variant-numeric: lining-nums tabular-nums; }
.chk__acts > * + * { margin-block-start: var(--space-3); }
.chk__acts .ctas { margin-block-start: 0; }
.chk__multi { max-inline-size: none; }

/* ——— "E-mail me this summary" ——— */
.chk__mail { padding-block-start: var(--space-5); border-block-start: 1px solid var(--c-ink); }
.chk__mbtn[aria-expanded="true"] { background: var(--c-limestone); }
.chk__mpanel { margin-block-start: var(--space-4); padding: clamp(1rem, 0.8rem + 1vw, 1.5rem); background: var(--c-paper); border: 1px solid var(--c-rule); }
.chk__mpanel > * + *, .chk__mform > * + * { margin-block-start: var(--space-4); }
.chk__mh { font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: var(--lh-display-s); color: var(--c-ink); }
.chk__mintro { max-inline-size: var(--measure-text); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.chk__fields { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .chk__fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.chk__field { display: grid; gap: 0.375rem; align-content: start; }
.chk__flbl { font-size: var(--fs-small); font-weight: var(--fw-semibold); color: var(--c-ink); }
.chk__ftag { font-weight: var(--fw-regular); color: var(--c-ink-3); }
.chk__finput { background: var(--c-paper-raised); }
[dir="rtl"] .chk__finput[dir="ltr"] { text-align: right; }
.chk__fhint { font-size: var(--fs-micro); color: var(--c-ink-3); }
.chk__ferr { font-size: var(--fs-small); font-weight: var(--fw-medium); color: var(--c-warn); }
.chk__ferr:empty { display: none; }
.chk__hp { position: absolute !important; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.chk__checks { display: grid; gap: 0; }
.chk__check { display: flex; align-items: flex-start; gap: var(--space-3); min-block-size: var(--target-min); padding-block: 0.625rem; font-size: var(--fs-small); line-height: 1.5; color: var(--c-ink-2); cursor: pointer; }
.chk__check input { flex: none; inline-size: 1.125rem; block-size: 1.125rem; margin: 0.15rem 0 0; accent-color: var(--c-accent); }
.chk__check input[aria-invalid="true"] { outline: var(--border-strong) solid var(--c-warn); outline-offset: 2px; }
.chk__privacy a { display: inline-flex; align-items: center; min-block-size: var(--target-min); font-size: var(--fs-small); }
.chk__send .btn[aria-disabled="true"] { opacity: 0.6; cursor: progress; }
.chk__fstatus { font-size: var(--fs-small); color: var(--c-ink-2); }
.chk__mform > .chk__fstatus:empty, .chk__mform > .chk__ferr:empty { margin-block-start: 0; }
.chk__fcontact { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--space-4); font-size: var(--fs-small); color: var(--c-ink-2); }
.chk__fcontact a { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); font-weight: var(--fw-medium); }
.chk__ok { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-3); padding: var(--space-4) var(--space-5); background: var(--c-accent-tint); border-inline-start: var(--border-strong) solid var(--c-accent); font-size: var(--fs-ui); color: var(--c-ink-2); }
.chk__ok .i { color: var(--c-accent); }
.chk__ok-h { font-weight: var(--fw-semibold); color: var(--c-ink); }

/* ——— your answers, each with a way back to its question ——— */
.chk__end { padding-block-start: var(--space-5); border-block-start: 1px solid var(--c-ink); }
.chk__end > * + * { margin-block-start: var(--space-4); }
.chk__recap { border-block-start: 1px solid var(--c-rule); }
.chk__rc { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--space-4); row-gap: 0.25rem; align-items: center; padding-block: var(--space-2); border-block-end: 1px solid var(--c-rule); }
.chk__rc dt { font-size: var(--fs-micro); color: var(--c-ink-3); }
.chk__rv { grid-column: 1; margin: 0; display: flex; flex-wrap: wrap; gap: 0.25rem 0.375rem; }
.chk__ra { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
@media (min-width: 760px) {
  .chk__rc { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr) auto; }
  .chk__rv { grid-column: 2; grid-row: 1; }
  .chk__ra { grid-column: 3; grid-row: 1; }
}
.chk__tag { display: inline-flex; padding: 0.125rem 0.5rem; background: var(--c-limestone); border-radius: var(--radius-1); font-size: var(--fs-small); line-height: 1.45; color: var(--c-ink); }
.chk__chg { min-block-size: var(--target-min); min-inline-size: var(--target-min); padding-inline: var(--space-3); background: none; border: 0; border-radius: var(--radius-1); font-size: var(--fs-small); font-weight: var(--fw-medium); color: var(--c-accent); text-decoration: underline; text-underline-offset: 0.22em; cursor: pointer; }
.chk__chg:hover { color: var(--c-accent-hover); text-decoration-thickness: 2px; }
.chk__tools { display: flex; flex-wrap: wrap; gap: var(--space-3); }
@media (max-width: 479.98px) { .chk__tools .btn { flex: 1 1 100%; } }

/* ——— if checker.js cannot load (core.js marks the block data-module-failed), the reading version comes back ——— */
.js .sec--checker[data-module-failed] .chk__static { display: block; }
.js .sec--checker[data-module-failed] .chk__app { display: none; }

/* ——— motion: a step or the summary settles in, after the visitor's own action only ——— */
@media (prefers-reduced-motion: no-preference) {
  .chk-anim .chk__step:not([hidden]), .chk-anim .chk__res { animation: chk-in var(--dur-3) var(--ease-out); }
}
@keyframes chk-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media (forced-colors: active) {
  .chk__opt { border: 1px solid CanvasText; }
  .chk__opt.is-on, .chk__opt:has(input:checked) { outline: 2px solid Highlight; outline-offset: -2px; }
  .chk__lb .is-active { outline: 2px solid Highlight; outline-offset: -2px; }
  .chk__bar > span { forced-color-adjust: none; background: Highlight; }
}

@media print {
  .chk__mail, .chk__tools, .chk__ra, .chk__acts, .chk__static { display: none !important; }
  .chk__out { padding: 0; border: 0; box-shadow: none; }
  .chk__res > *, .chk__part { break-inside: avoid; }
}

/* ——— 52-forms.css ——— */
/* 52-forms — the lead forms, the consultation time picker and the contact block (blocks/form.mjs, booking.mjs,
   contact.mjs; assets/js/form.js, booking.js). Tokens only, logical properties only (RTL by construction),
   44 px targets, visible focus, no layout shift when the enhancements render. */

/* ——— section layout: the copy beside the form ——— */
.lf-layout { display: grid; gap: var(--space-6); align-items: start; }
.lf-copy { max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.lf-copy > .sec__h { margin-block-end: var(--space-4); }
.lf-copy .sec__intro { margin-block-end: var(--space-5); }
@media (min-width: 1120px) {
  .lf-layout { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: calc(var(--grid-gap) * 3); }
  .lf-copy { position: sticky; inset-block-start: calc(var(--header-h) + var(--space-5)); }
}

/* ——— the form card ——— */
.lf-card { min-inline-size: 0; padding: var(--space-5) var(--space-4); background: var(--c-paper-raised); border: 1px solid var(--c-rule); border-block-start-color: var(--c-ink); }
@media (min-width: 700px) { .lf-card { padding: var(--space-6); } }
.lf-card > .callout { margin-block-end: var(--space-5); }
.lf-req { margin-block-end: var(--space-5); font-size: var(--fs-small); color: var(--c-ink-3); }
.lf-grid { display: grid; gap: var(--space-5) var(--space-4); }
@media (min-width: 700px) { .lf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lf-field--full { grid-column: 1 / -1; }
.lf-field { display: grid; gap: 0.375rem; align-content: start; min-inline-size: 0; }
.lf-label { display: block; padding: 0; font-size: var(--fs-ui); font-weight: var(--fw-semibold); line-height: var(--lh-ui); color: var(--c-ink); }
.lf-opt { font-weight: var(--fw-regular); font-size: var(--fs-small); color: var(--c-ink-3); }
.lf-hint { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); }

/* inputs: 48 px tall, 16 px text (no zoom on iOS), hairline that turns accent on focus and warning on error */
.lf-input { inline-size: 100%; min-block-size: 3rem; padding: 0.625rem 0.75rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper); color: var(--c-ink); font-size: 1rem; line-height: 1.4; transition: border-color var(--dur-1) var(--ease-out); }
.lf-input:hover { border-color: var(--c-ink-2); }
.lf-input:focus { border-color: var(--c-accent); outline: var(--border-strong) solid var(--c-focus); outline-offset: 1px; }
.lf-select { padding-inline-end: 2rem; cursor: pointer; }
.lf-textarea { min-block-size: 7.5rem; resize: vertical; }
.lf-input[aria-invalid="true"] { border-color: var(--c-warn); box-shadow: inset 0 0 0 1px var(--c-warn); }
[dir="rtl"] .lf-input[dir="ltr"] { text-align: end; }
.lf-err { display: flex; align-items: baseline; gap: 0.5rem; font-size: var(--fs-small); font-weight: var(--fw-semibold); line-height: var(--lh-small); color: var(--c-warn); }
.lf-err::before { content: ""; flex: none; inline-size: 0.75rem; block-size: 2px; background: currentColor; translate: 0 -0.2em; }

/* choice groups: radios and checkboxes as chips (the native control stays visible) */
.lf-group { display: grid; gap: 0.5rem; min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.lf-group > legend { margin-block-end: 0.375rem; }
.lf-choices { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.lf-choice { display: inline-flex; align-items: center; gap: 0.625rem; min-block-size: var(--target-min); padding: 0.5rem 0.875rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper); font-size: var(--fs-ui); line-height: 1.3; cursor: pointer; transition: border-color var(--dur-1) var(--ease-out), background-color var(--dur-1) var(--ease-out); }
.lf-choice:hover { border-color: var(--c-ink); }
.lf-choice input { flex: none; inline-size: 1.125rem; block-size: 1.125rem; margin: 0; accent-color: var(--c-accent); }
.lf-choice:has(input:checked) { background: var(--c-accent-tint); border-color: var(--c-accent); }
.lf-choice:has(input:focus-visible) { outline: var(--border-strong) solid var(--c-focus); outline-offset: 2px; }
.lf-choice input:focus-visible { outline: none; }

/* consent rows */
.lf-consent { display: grid; gap: 0.375rem; }
.lf-check { display: flex; align-items: flex-start; gap: 0.75rem; min-block-size: var(--target-min); padding-block: 0.25rem; font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.lf-check input { flex: none; inline-size: 1.25rem; block-size: 1.25rem; margin: 0.1rem 0 0; accent-color: var(--c-accent); cursor: pointer; }
.lf-check label { cursor: pointer; }
.lf-check input[aria-invalid="true"] { outline: var(--border-strong) solid var(--c-warn); outline-offset: 2px; }
.lf-grid > .lf-consent + .lf-consent { margin-block-start: calc(-1 * var(--space-4)); }

/* the residence a form is about */
.lf-fixed { display: grid; gap: 0.25rem; padding: var(--space-3) var(--space-4); background: var(--c-limestone); border-inline-start: var(--border-strong) solid var(--c-ink); }
.lf-fixed__k { font-size: var(--fs-micro); color: var(--c-ink-3); }
.lf-fixed__v { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); font-weight: var(--fw-medium); color: var(--c-ink); }

/* the honeypot: off screen, out of the tab order, hidden from assistive technology */
.lf-hp { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* Turnstile's box is 65 px tall: reserve it so nothing moves when it renders */
.lf-ts { min-block-size: 65px; margin-block-start: var(--space-5); }

.lf-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-block-start: var(--space-5); }
.lf-submit[disabled] { opacity: 0.7; cursor: progress; }
@media (max-width: 479.98px) { .lf-submit { flex: 1 1 100%; } }
.lf-who { margin-block-start: var(--space-4); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); }
.lf-noscript { margin-block-start: var(--space-5); padding: var(--space-3) var(--space-4); background: var(--c-limestone); font-size: var(--fs-small); color: var(--c-ink); }

/* the status line: always present for screen readers, visible only when it speaks */
.lf-status { margin-block-start: var(--space-4); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.lf-status:empty { margin: 0; }
.lf-status--error, .lf-status--turnstile { padding: var(--space-3) var(--space-4); background: var(--c-warn-tint); border-inline-start: var(--border-strong) solid var(--c-warn); color: var(--c-ink); }
.lf-status--busy { color: var(--c-ink-3); }
.lf-status a { font-weight: var(--fw-semibold); white-space: nowrap; }
.lf-status:focus { outline: none; }
.lf-status:focus-visible { outline: var(--border-strong) solid var(--c-focus); outline-offset: 2px; }

/* success: the reference, focused */
.lf-done { display: grid; gap: var(--space-3); padding: var(--space-5); background: var(--c-accent-tint); border-inline-start: var(--border-strong) solid var(--c-accent); color: var(--c-ink); }
.lf-done[hidden] { display: none; }
.lf-done__h { display: flex; align-items: center; gap: var(--space-2); font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: var(--lh-display-s); color: var(--c-ink); }
.lf-done__h .i { color: var(--c-accent); inline-size: 1.5rem; block-size: 1.5rem; }
.lf-done__ref { font-size: var(--fs-body); }
.lf-done__ref:focus { outline: none; }
.lf-done__ref:focus-visible { outline: var(--border-strong) solid var(--c-focus); outline-offset: 4px; }
.lf-ref { display: inline-block; padding: 0.125rem 0.5rem; background: var(--c-paper-raised); border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); font-family: var(--font-sans); font-weight: var(--fw-semibold); letter-spacing: 0.03em; font-variant-numeric: lining-nums tabular-nums; unicode-bidi: isolate; }
.lf-files { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.lf-file { white-space: normal; text-align: start; }
.lf-done__quote { font-size: var(--fs-small); color: var(--c-ink-2); }

/* ——— consultation: hours, the time picker ——— */
.bk-when { margin-block: var(--space-5); padding-block-start: var(--space-3); border-block-start: 1px solid var(--c-rule); }
.bk-when__k { margin-block-end: var(--space-2); font-size: var(--fs-small); font-weight: var(--fw-semibold); color: var(--c-ink); }
.bk-hours { display: grid; gap: 0.25rem; font-size: var(--fs-small); line-height: var(--lh-small); }
.bk-hours__athens { color: var(--c-ink); }
.bk-hours__tz { color: var(--c-ink-3); }
.bk-hours__local { color: var(--c-ink-2); }
.js .bk-hours__local { min-block-size: calc(2 * var(--lh-small) * 1em); }   /* reserved: the line lands without a shift */

.bk-static > * + * { margin-block-start: var(--space-3); }
.bk-static > p:first-child { font-size: var(--fs-small); color: var(--c-ink-2); }
.bk-times { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.bk-times li { padding: 0.25rem 0.5rem; border: 1px solid var(--c-rule); border-radius: var(--radius-1); font-size: var(--fs-small); font-variant-numeric: tabular-nums; color: var(--c-ink-2); }
.bk-ui { display: grid; gap: var(--space-4); min-inline-size: 0; }
/* the picker's height is reserved before booking.js renders it: the slot grid has a fixed column count per layout
   (3 · 6 · 4 for a day's 16 slots → 6 · 3 · 4 rows), so the reservation matches what lands */
.js .bk-ui { min-block-size: 34.5rem; }
@media (min-width: 700px) { .js .bk-ui { min-block-size: 22rem; } }
@media (min-width: 1120px) { .js .bk-ui { min-block-size: 25.25rem; } }
.bk-tz { font-size: var(--fs-small); color: var(--c-ink-2); }

.bk-days { display: flex; gap: var(--space-2); overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline proximity; padding-block: 0.25rem 0.5rem; padding-inline: 0.25rem; margin-inline: -0.25rem; scrollbar-width: thin; }
.bk-day { position: relative; flex: none; display: grid; justify-items: center; align-content: center; gap: 0.125rem; min-inline-size: 4.5rem; min-block-size: 3.5rem; padding: 0.375rem 0.625rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper); color: var(--c-ink); font-size: var(--fs-small); line-height: 1.2; cursor: pointer; scroll-snap-align: start; }
.bk-day:hover { border-color: var(--c-ink); }
.bk-day__wd { font-weight: var(--fw-semibold); }
.bk-day__d { color: var(--c-ink-3); font-variant-numeric: tabular-nums; }
.bk-day[aria-selected="true"] { background: var(--c-ink); border-color: var(--c-ink); color: var(--c-on-dark); }
.bk-day[aria-selected="true"] .bk-day__d { color: var(--c-on-dark-2); }
.bk-day__dot { position: absolute; inset-block-start: 0.3125rem; inset-inline-end: 0.3125rem; inline-size: 0.4375rem; block-size: 0.4375rem; border-radius: 50%; background: var(--c-accent); opacity: 0; }
.bk-day.has-pick .bk-day__dot { opacity: 1; }
.bk-day[aria-selected="true"] .bk-day__dot { background: var(--c-accent-on-dark); }

.bk-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
@media (min-width: 700px) { .bk-slots { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1120px) { .bk-slots { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.bk-slot { display: inline-flex; align-items: center; justify-content: center; gap: 0.375rem; min-block-size: var(--target-min); padding-inline: 0.5rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper); color: var(--c-ink); font-size: var(--fs-ui); font-variant-numeric: lining-nums tabular-nums; cursor: pointer; transition: background-color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out); }
.bk-slot:hover { border-color: var(--c-ink); }
.bk-slot[aria-pressed="true"] { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-on-dark); font-weight: var(--fw-semibold); }
.bk-slot[aria-pressed="true"]::before { content: ""; inline-size: 0.625rem; block-size: 0.3125rem; border-inline-start: 2px solid currentColor; border-block-end: 2px solid currentColor; rotate: -45deg; translate: 0 -0.1rem; }
[dir="rtl"] .bk-slot[aria-pressed="true"]::before { rotate: 45deg; }
.bk-slot[aria-disabled="true"] { opacity: 0.45; cursor: not-allowed; }
.bk-slot[aria-disabled="true"]:hover { border-color: var(--c-rule-strong); }
.bk-note { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.bk-panel > .bk-note { margin-block-start: var(--space-3); padding-inline-start: var(--space-3); border-inline-start: var(--border-strong) solid var(--c-warn); }

.bk-picks { padding-block-start: var(--space-3); border-block-start: 1px solid var(--c-rule); }
.bk-picks__h { font-size: var(--fs-small); font-weight: var(--fw-semibold); color: var(--c-ink); }
.bk-picks__h:focus { outline: none; }
.bk-picks__none { margin-block-start: 0.25rem; font-size: var(--fs-small); color: var(--c-ink-3); }
.bk-picks__list { display: grid; margin-block-start: 0.25rem; }
.bk-pick { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: var(--space-3); padding-block: 0.375rem; border-block-end: 1px solid var(--c-rule); }
.bk-pick__when { grid-column: 1; font-weight: var(--fw-medium); color: var(--c-ink); font-variant-numeric: tabular-nums; }
.bk-pick__ath { grid-column: 1; font-size: var(--fs-small); color: var(--c-ink-3); }
.bk-pick__x { grid-column: 2; grid-row: 1 / span 2; min-block-size: var(--target-min); min-inline-size: var(--target-min); padding-inline: 0.5rem; border: 0; background: none; color: var(--c-accent); font-size: var(--fs-small); font-weight: var(--fw-medium); text-decoration: underline; text-underline-offset: 0.2em; cursor: pointer; }
@media (min-width: 700px) { .bk-pick__ath { grid-column: auto; grid-row: 1; } .bk-pick { grid-template-columns: auto minmax(0, 1fr) auto; } .bk-pick__x { grid-column: 3; grid-row: 1; } }
.bk-pick__x:hover { color: var(--c-accent-hover); text-decoration-thickness: 2px; }

/* external booking provider */
.bk-ext { display: grid; gap: var(--space-4); align-content: start; }
.bk-ext .callout { margin: 0; }
.bk-ext__go .btn { white-space: normal; }

/* ——— the contact block ——— */
.ct-grid { display: grid; gap: 0 var(--grid-gap); border-block-start: 1px solid var(--c-ink); }
@media (min-width: 960px) { .ct-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ct-col { display: grid; gap: var(--space-3); align-content: start; min-inline-size: 0; padding-block: var(--space-5); }
.ct-col + .ct-col { border-block-start: 1px solid var(--c-ink); }
@media (min-width: 960px) { .ct-col + .ct-col { border-block-start: 0; } }
.ct-h { font-family: var(--ff-text); font-size: var(--fs-body); font-weight: var(--fw-semibold); line-height: 1.35; }
.ct-lead { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.ct-chans { display: grid; gap: var(--space-2); }
.ct-chan { display: flex; align-items: center; gap: 0.625rem; min-block-size: 3rem; padding-inline: 0.875rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); color: var(--c-ink); font-weight: var(--fw-medium); text-decoration: none; overflow-wrap: anywhere; }
.ct-chan:hover { border-color: var(--c-ink); color: var(--c-ink); }
.ct-chan .i { color: var(--c-accent); }
.ct-alt { font-size: var(--fs-small); color: var(--c-ink); }
.ct-dl { display: grid; }
.ct-dl > div { display: grid; gap: 0.125rem; padding-block: 0.625rem; border-block-end: 1px solid var(--c-rule); }
.ct-dl > div:first-child { border-block-start: 1px solid var(--c-rule); }
.ct-dl dt { font-size: var(--fs-micro); color: var(--c-ink-3); }
.ct-dl dd { margin: 0; font-size: var(--fs-ui); font-weight: var(--fw-medium); color: var(--c-ink); overflow-wrap: anywhere; }
.ct-dl dd a { font-weight: var(--fw-semibold); }
.ct-dl dd a[dir="ltr"] { white-space: nowrap; }
.ct-note { display: block; margin-block-start: 0.125rem; font-size: var(--fs-small); font-weight: var(--fw-regular); line-height: var(--lh-small); color: var(--c-ink-3); }
.ct-dl .bk-hours { font-weight: var(--fw-regular); }
.ct-dl .bk-hours__athens { font-weight: var(--fw-medium); font-size: var(--fs-ui); }
.ct-safety { margin-block-start: var(--space-6); }
.ct-safety .callout__h { font-size: var(--fs-body); }
.ct-safety ul { margin-block: var(--space-1) var(--space-2); }
.ct-verify a { font-weight: var(--fw-semibold); white-space: nowrap; }

@media (forced-colors: active) {
  .lf-choice:has(input:checked), .bk-day[aria-selected="true"], .bk-slot[aria-pressed="true"] { border-width: 3px; border-style: double; }
  .bk-day__dot { forced-color-adjust: none; background: Highlight; }
}
@media print { .lf-card, .bk-ui, .lf-ts { display: none !important; } }

/* ——— 53-residences.css ——— */
/* 53-residences — the residence explorer (filters, result line, the table of every residence, the comparison dialog,
   the phone filter sheet and the compare bar) and the building selector diagram. Blocks: residences (mode explorer) in
   tools/lib/blocks.mjs, building in tools/blocks/building.mjs; script: assets/js/residences.js.
   Logical properties only (RTL by construction); status is words + a mark + a fill, never colour alone; targets ≥ 44 px;
   motion only under prefers-reduced-motion: no-preference. */

/* ——— residence cards: the price and the compare control share the foot ——— */
.rcard__foot { margin-block-start: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-3); padding-block-start: var(--space-3); border-block-start: 1px solid var(--c-ink); }
.rcard__foot .rcard__price { margin: 0; padding: 0; border: 0; }
.rcard__cmp { padding-inline: 0.625rem 0.875rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper); color: var(--c-ink); transition: border-color var(--dur-1) var(--ease-out), background-color var(--dur-1) var(--ease-out); }
.rcard__cmp:hover { border-color: var(--c-ink); }
.rcard__cmp:has(input:checked) { border-color: var(--c-accent); background: var(--c-accent-tint); color: var(--c-accent); }
.rcard__cmp input { margin: 0; }
.rx--nocompare .rcard__cmp { display: none; }   /* no <dialog> support: the table of every residence remains */
@media (max-width: 699.98px) { .rcard .media--crop .media__frame { aspect-ratio: 4 / 3; } }

/* ——— explorer: the filters (inline from 768 px; in the sheet on phones) ——— */
.rx__filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-4) var(--space-6); padding-block: var(--space-4); border-block-start: 1px solid var(--c-ink); }
.rx__fs { margin: 0; padding: 0; border: 0; min-inline-size: 0; }
.rx__lg { padding: 0; margin-block-end: var(--space-2); font-size: var(--fs-micro); font-weight: var(--fw-semibold); line-height: 1.3; color: var(--c-ink-3); }
.rx__opts { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.rx__opt { position: relative; display: inline-flex; }
.rx__opt input { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; margin: 0; opacity: 0; cursor: pointer; }
.rx__opt > span { display: inline-flex; align-items: center; justify-content: center; min-block-size: var(--target-min); min-inline-size: var(--target-min); padding-inline: 0.875rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); color: var(--c-ink); font-size: var(--fs-small); font-weight: var(--fw-medium); line-height: 1.2; white-space: nowrap; font-variant-numeric: lining-nums; transition: background-color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out); }
.rx__opt:hover > span { border-color: var(--c-ink); }
.rx__opt input:checked + span { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-on-dark); }
.rx__opt input:focus-visible + span { outline: var(--border-strong) solid var(--c-focus); outline-offset: 2px; }
.rx__chk { display: inline-flex; align-items: center; gap: 0.625rem; min-block-size: var(--target-min); font-size: var(--fs-ui); font-weight: var(--fw-medium); line-height: 1.3; cursor: pointer; }
.rx__chk input { flex: none; inline-size: 1.25rem; block-size: 1.25rem; margin: 0; accent-color: var(--c-accent); }

/* the bar: the phone's Filter button, the result line, Clear */
.rx__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-4); min-block-size: 3.5rem; padding-block: var(--space-2); margin-block-end: var(--space-5); border-block: 1px solid var(--c-rule); }
.rx__fbtn { display: none; --btn-h: var(--target-min); gap: 0.5rem; padding-inline: 0.875rem 1rem; }
.rx__nact { display: inline-flex; align-items: center; justify-content: center; min-inline-size: 1.375rem; block-size: 1.375rem; padding-inline: 0.3125rem; border-radius: var(--radius-1); background: var(--c-accent); color: var(--c-on-dark); font-size: var(--fs-micro); font-weight: var(--fw-semibold); font-variant-numeric: lining-nums tabular-nums; }
.rx__count { font-size: var(--fs-small); line-height: 1.4; color: var(--c-ink-2); font-variant-numeric: lining-nums; }
.rx__clear { margin-inline-start: auto; font-size: var(--fs-small); }
@media (max-width: 767.98px) {
  .rx__fbtn { display: inline-flex; }
  .rx > .wrap > .rx__filters { display: none; }
  .rx__bar { border-block-start-color: var(--c-ink); }
  /* no <dialog> support: the filters stay inline */
  .rx--inline > .wrap > .rx__filters { display: flex; }
  .rx--inline .rx__fbtn { display: none; }
}
.rx__empty { display: grid; justify-items: start; gap: var(--space-4); max-inline-size: 40rem; padding: var(--space-6) var(--space-5); border: 1px dashed var(--c-rule-strong); background: var(--c-paper-raised); color: var(--c-ink-2); }

/* ——— every residence side by side (complete without JavaScript; the target of #compare) ——— */
.rx__all { margin-block-start: var(--space-8); }
.rx__all-h { margin-block-end: var(--space-4); font-size: var(--fs-display-m); line-height: var(--lh-display-m); }
.rx__table table { min-inline-size: 52rem; }
.rx__table thead th + th { inline-size: 8.5rem; }
.rx__table thead a, .rx__ctable thead a { font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; line-height: 1.1; letter-spacing: 0; text-transform: none; color: var(--c-ink); text-decoration: none; }
.rx__table thead a:hover, .rx__ctable thead a:hover { color: var(--c-accent); text-decoration: underline; text-decoration-thickness: 1px; }
.rx__table th[scope="row"], .rx__table thead th:first-child { position: sticky; inset-inline-start: 0; z-index: 1; min-inline-size: 9rem; background: var(--c-paper); }
.rx__table td { color: var(--c-ink-2); }

/* ——— the compare bar: fixed while the explorer is in view; above the action bar on phones ——— */
.rx__tray { position: fixed; z-index: calc(var(--z-mbar) - 1); inset-inline: 0; inset-block-end: var(--space-4); pointer-events: none; }
.rx__tray-in { pointer-events: auto; display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); inline-size: fit-content; max-inline-size: min(46rem, 100% - 11rem); min-block-size: 3.75rem; padding: 0.5rem; padding-inline-start: 1rem; background: var(--c-dark); color: var(--c-on-dark); border-radius: var(--radius-1); box-shadow: var(--shadow-2); }
.rx__tray-h { font-size: var(--fs-small); font-weight: var(--fw-semibold); }
.rx__chips { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.rx__chip { display: inline-flex; align-items: center; gap: 0.25rem; min-block-size: var(--target-min); min-inline-size: var(--target-min); padding-inline: 0.75rem 0.5rem; border: 1px solid var(--c-rule-on-dark); border-radius: var(--radius-1); background: transparent; color: var(--c-on-dark); font-family: var(--font-display); font-size: 1.0625rem; line-height: 1; cursor: pointer; }
.rx__chip .i { inline-size: 1rem; block-size: 1rem; color: var(--c-on-dark-2); }
.rx__chip:hover { border-color: var(--c-on-dark); }
.rx__chip:hover .i { color: var(--c-on-dark); }
.rx__tray-hint, .rx__tray-msg { max-inline-size: 24rem; font-size: var(--fs-small); line-height: 1.4; color: var(--c-on-dark-2); }
.rx__tray-msg { color: var(--c-on-dark); }
.rx__go { --btn-h: var(--target-min); margin-inline-start: auto; background: var(--c-on-dark); color: var(--c-dark); border-color: var(--c-on-dark); }
.rx__go:hover { background: #fff; color: var(--c-dark); }
.rx__go-s { display: none; }
.rx__tray :focus-visible { outline-color: var(--c-focus-on-dark); }
@media (max-width: 767.98px) {
  /* the action bar (10-chrome.css .mbar) is 4rem + 1px + the safe area tall */
  .rx__tray { inset-block-end: calc(4rem + 1px + env(safe-area-inset-bottom, 0px) + var(--space-2)); }
  .rx__tray-in { inline-size: 100%; max-inline-size: 100%; padding-inline-start: 0.5rem; }
  .rx__tray-h { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .rx__go-l { display: none; }
  .rx__go-s { display: inline; }
}

/* ——— dialogs: the comparison (centred; a bottom sheet on phones) and the phone filter sheet ——— */
html.rx-lock { overflow: hidden; }
.rx__dlg, .rx__sheet { padding: 0; border: 0; background: transparent; color: var(--c-ink); max-inline-size: none; max-block-size: none; overflow: visible; }
.rx__dlg::backdrop, .rx__sheet::backdrop { background: rgb(15 35 33 / 0.55); }
.rx__x { display: inline-flex; flex: none; align-items: center; justify-content: center; inline-size: var(--target-min); block-size: var(--target-min); padding: 0; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: transparent; color: var(--c-ink); cursor: pointer; }
.rx__x:hover { border-color: var(--c-ink); }
.rx__dlg-in { display: grid; gap: var(--space-4); inline-size: min(60rem, 100vw - 2 * var(--page-pad)); max-block-size: min(90vh, 56rem); overflow: auto; overscroll-behavior: contain; padding: var(--space-5) var(--space-6) var(--space-6); background: var(--c-paper-raised); border: 1px solid var(--c-ink); border-radius: var(--radius-1); box-shadow: var(--shadow-2); }
.rx__dlg-hd, .rx__sheet-hd { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); }
.rx__dlg-h, .rx__sheet-h { font-size: var(--fs-display-m); line-height: var(--lh-display-m); }
.rx__dlg-h:focus { outline: none; }
.rx__dlg-note { margin: 0; }
.rx__ctable table { min-inline-size: 0; table-layout: fixed; }
.rx__ctable thead th:first-child { inline-size: 27%; }
.rx__ctable thead th { vertical-align: bottom; white-space: normal; }
.rx__ctable tbody th { color: var(--c-ink-2); }
.rx__ctable td { color: var(--c-ink); font-weight: var(--fw-medium); }
.rx__ctable tr.is-same td { color: var(--c-ink-3); font-weight: var(--fw-regular); }
.rx__sheet-in { display: flex; flex-direction: column; inline-size: 100%; max-block-size: 88vh; max-block-size: 88dvh; background: var(--c-paper); border-block-start: 1px solid var(--c-ink); }
.rx__sheet-hd { padding: var(--space-3) var(--page-pad); border-block-end: 1px solid var(--c-rule); }
.rx__sheet-h { font-size: var(--fs-display-s); line-height: var(--lh-display-s); }
.rx__sheet-bd { flex: 1 1 auto; min-block-size: 0; overflow-y: auto; overscroll-behavior: contain; padding: var(--space-5) var(--page-pad); }
.rx__sheet-ft { display: flex; gap: var(--space-3); padding: var(--space-3) var(--page-pad) calc(var(--space-3) + env(safe-area-inset-bottom, 0px)); border-block-start: 1px solid var(--c-rule); background: var(--c-paper-raised); }
.rx__sheet-ft .btn--primary { flex: 1; }
.rx__sheet .rx__filters { display: grid; gap: var(--space-5); padding: 0; border: 0; }
.rx__sheet .rx__opt > span { min-inline-size: 3rem; }
@media (max-width: 767.98px) {
  .rx__dlg, .rx__sheet { margin: auto 0 0; inline-size: 100%; max-inline-size: 100%; }
  .rx__dlg-in { inline-size: 100%; max-block-size: 90vh; max-block-size: 90dvh; padding: var(--space-4) var(--page-pad) calc(var(--space-5) + env(safe-area-inset-bottom, 0px)); border-inline: 0; border-block-end: 0; }
  .rx__dlg-h { font-size: var(--fs-display-s); line-height: var(--lh-display-s); }
  .rx__ctable thead a { font-size: 1.0625rem; }
  .rx__ctable table { font-size: var(--fs-micro); }
  .rx__ctable th, .rx__ctable td { padding-inline: 0.375rem; }
}
@media (prefers-reduced-motion: no-preference) {
  .rx__tray-in { animation: rx-rise var(--dur-2) var(--ease-out); }
  .rx__dlg[open] .rx__dlg-in, .rx__sheet[open] .rx__sheet-in { animation: rx-rise var(--dur-3) var(--ease-out); }
}
@keyframes rx-rise { from { opacity: 0; transform: translateY(0.75rem); } }

/* ——— the building selector: an elevation drawn as a diagram, floors from the top down ——— */
.bld { display: grid; gap: var(--space-6); }
.bld__copy { max-inline-size: var(--measure-text); }
.bld__hint { margin-block-start: var(--space-4); padding: var(--space-3) var(--space-4); border-inline-start: var(--border-strong) solid var(--c-accent); background: var(--c-accent-tint); font-size: var(--fs-small); line-height: 1.5; color: var(--c-ink-2); }
@media (min-width: 960px) { .bld { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: calc(var(--grid-gap) * 3); align-items: start; } }
.bld__fig { min-inline-size: 0; }
.bld__frame { position: relative; padding: 3rem var(--space-3) var(--space-4); background: var(--c-paper-raised); border: 1px solid var(--c-rule); }
.media__label[data-kind="diagram"] { background: var(--c-limestone); }
.bld__rows { --bld-lab: 5.25rem; display: grid; }
@media (min-width: 600px) { .bld__frame { padding-inline: var(--space-5); } .bld__rows { --bld-lab: 7rem; } }
.bld__row { display: grid; grid-template-columns: var(--bld-lab) minmax(0, 1fr); column-gap: var(--space-3); }
.bld__lab { align-self: center; font-size: var(--fs-micro); font-weight: var(--fw-semibold); line-height: 1.3; letter-spacing: 0.06em; text-transform: uppercase; color: var(--c-ink-3); }
:lang(ar) .bld__lab, :lang(he) .bld__lab, :lang(zh-Hans) .bld__lab { letter-spacing: 0; text-transform: none; }
/* a floor: a link to the filtered explorer, or (residences.js) a toggle button that filters the explorer on this page */
.bld__floor { align-self: center; display: flex; align-items: center; justify-content: space-between; gap: 0.375rem; min-block-size: var(--target-min); margin: 0; padding: 0.375rem 0.625rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper); color: var(--c-ink); font: inherit; font-size: var(--fs-small); font-weight: var(--fw-medium); line-height: 1.25; text-align: start; text-decoration: none; cursor: pointer; transition: background-color var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out); }
.bld__floor:hover { border-color: var(--c-ink); color: var(--c-ink); }
.bld__floor[aria-pressed]::after { content: ""; flex: none; inline-size: 0.625rem; block-size: 0.625rem; border: 1.5px solid currentColor; border-radius: 1px; }
.bld__floor[aria-pressed="true"] { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-on-dark); }
.bld__floor[aria-pressed="true"]::after { background: currentColor; }
/* the residences of a floor, side by side, widths in proportion to their areas */
.bld__units { display: flex; border-inline: 1.5px solid var(--c-ink); border-block-start: 1.5px solid var(--c-ink); }
.bld__unit { display: flex; flex: var(--area, 1) 1 0%; min-inline-size: 6.25rem; container-type: inline-size; }
.bld__unit + .bld__unit { border-inline-start: 1px solid var(--c-ink); }
.bld__link { flex: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 0.25rem; min-block-size: 5.75rem; padding: 0.625rem 0.75rem; color: var(--c-ink); text-decoration: none; }
.bld__unit--available .bld__link { background: var(--c-accent-tint); }
.bld__unit--reserved .bld__link, .bld__unit--sold .bld__link { background: repeating-linear-gradient(135deg, var(--c-neutral-badge) 0 7px, var(--c-rule) 7px 8px); }
.bld__id { font-family: var(--font-display); font-size: 1.5rem; line-height: 1; font-variant-numeric: lining-nums; }
.bld__meta { display: flex; flex-wrap: wrap; column-gap: 0.375rem; font-size: var(--fs-micro); line-height: 1.35; color: var(--c-ink-2); font-variant-numeric: lining-nums tabular-nums; }
.bld__sep { color: var(--c-ink-3); }
/* a narrow residence (phones) stacks its bedrooms over its area instead of breaking the line anywhere */
@container (max-width: 10rem) { .bld__meta { flex-direction: column; } .bld__sep { display: none; } }
.bld__tags { display: flex; flex-wrap: wrap; gap: 0.25rem; margin-block-start: auto; padding-block-start: 0.25rem; }
.bld__link .badge { background: var(--c-paper-raised); }
.bld__link .badge--ph { background: transparent; }
.bld__link:hover .bld__id { color: var(--c-accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
.bld__link:focus-visible { outline-offset: -4px; }
.bld__row.is-on .bld__units { position: relative; z-index: 1; outline: 3px solid var(--c-accent); outline-offset: 2px; }
@media (max-width: 599.98px) { .bld__link { padding: 0.5rem 0.5rem 0.625rem; } .bld__id { font-size: 1.25rem; } .bld__link .badge { padding-inline: 0.375rem; gap: 0.25rem; } }
/* the roof garden above the top floor: a railing and planting, drawn lighter */
.bld__roof { display: flex; align-items: center; min-block-size: 3.25rem; margin-inline: 0.75rem; padding: 0.5rem 0.625rem; border: 1px dashed var(--c-ink-3); border-block-end: 0; background-color: var(--c-paper-raised); background-image: radial-gradient(circle, rgb(14 77 69 / 0.3) 1.1px, transparent 1.7px); background-size: 9px 9px; font-size: var(--fs-micro); line-height: 1.35; color: var(--c-ink-2); }
.bld__roof span { padding: 0.125rem 0.375rem; background: var(--c-paper-raised); }
/* the ground line (it runs the full width), then the basement with its storage rooms */
.bld__row--base { border-block-start: 3px solid var(--c-ink); }
.bld__base { padding: 0.625rem 0.625rem 0.75rem; border-inline: 1.5px solid var(--c-ink); border-block-end: 1.5px solid var(--c-ink); background: repeating-linear-gradient(45deg, transparent 0 6px, rgb(133 125 112 / 0.2) 6px 7px), var(--c-paper); }
.bld__base-t { display: inline-block; margin-block-end: 0.5rem; padding: 0.125rem 0.375rem; background: var(--c-paper); font-size: var(--fs-micro); line-height: 1.35; color: var(--c-ink-2); }
.bld__stores { display: grid; grid-template-columns: repeat(auto-fit, minmax(1.5rem, 1fr)); gap: 0.25rem; }
.bld__stores li { display: grid; justify-items: center; gap: 0.0625rem; padding-block: 0.25rem; border: 1px solid var(--c-rule-strong); background: var(--c-paper-raised); font-size: 0.6875rem; line-height: 1.2; color: var(--c-ink-2); font-variant-numeric: lining-nums tabular-nums; }
.bld__sno { font-weight: var(--fw-semibold); color: var(--c-ink); }

@media (forced-colors: active) {
  .rx__opt input:checked + span, .bld__floor[aria-pressed="true"] { forced-color-adjust: none; background: Highlight; border-color: Highlight; color: HighlightText; }
  .bld__units, .bld__unit + .bld__unit, .bld__base, .bld__row--base { border-color: CanvasText; }
  .bld__row.is-on .bld__units { outline-color: Highlight; }
  .rx__tray-in, .rx__dlg-in, .rx__sheet-in { border: 1px solid CanvasText; }
}
@media print {
  .rx__bar, .rx__filters, .rx__tray, .rcard__cmp, .rx__sheet, .rx__dlg, .bld__hint { display: none !important; }
}

/* ——— 54-calculator.css ——— */
/* 54-calculator — the investment calculator (tools/blocks/calculator.mjs + assets/js/calculator.js): the inputs beside
   a raised result panel; totals in display numerals; a stacked bar of the taxes and fees; the line-by-line table; the
   announced 15% scenario (shown only when its box is ticked: CSS :has() does it, so it works without JavaScript too).
   The bar is emphasis encoding (design system §6): the transfer tax in the accent, the professional fees and the
   permit fees in two neutral steps, the scenario's extra tax in a light step of the accent; 2 px paper gaps, a 4 px
   rounded end. Checked with the dataviz validator on #FBF9F4: worst adjacent pair ΔE 18.4 under CVD, 19.2 normal;
   the light scenario step is under 3:1, so its value is always written in the legend and the table.
   Logical properties only (RTL mirrors by itself); the result is server-rendered and only its text changes. */

.calc {
  --calc-tax: var(--c-chart-highlight);
  --calc-extra: #9DC0B5;
  --calc-fees: var(--c-chart-context);
  --calc-gv: #3B4846;
  display: grid; gap: var(--space-6); align-items: start;
}
@media (min-width: 1120px) {
  .calc { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: calc(var(--grid-gap) * 2); }
}
/* on a tool page the calculator follows the compact header closely */
.phead--compact + .sec--calculator { padding-block-start: var(--space-6); }
@media (min-width: 1120px) and (min-height: 820px) {
  .calc__form { position: sticky; inset-block-start: calc(var(--header-h) + var(--space-5)); }
}

/* ——— the inputs ——— */
.calc__form { display: grid; gap: var(--space-5); min-inline-size: 0; container-type: inline-size; }
.calc__inputs { display: grid; gap: var(--space-5); align-items: start; }
@container (min-width: 40rem) { .calc__inputs { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-6); } }
.no-js .calc__inputs { display: none; }
.calc__nojs { padding: var(--space-4) var(--space-5); background: var(--c-limestone); border-inline-start: var(--border-strong) solid var(--c-ink); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.js .calc__nojs { display: none; }
.calc__field { display: grid; gap: var(--space-2); min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.calc__label { padding: 0; font-size: var(--fs-ui); font-weight: var(--fw-semibold); line-height: var(--lh-ui); color: var(--c-ink); }
.calc__hint { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); }
.calc__err { display: flex; align-items: flex-start; gap: 0.5rem; font-size: var(--fs-small); line-height: var(--lh-small); font-weight: var(--fw-medium); color: var(--c-warn); }
.calc__err::before { content: "!"; flex: none; display: grid; place-items: center; inline-size: 1.125rem; block-size: 1.125rem; margin-block-start: 0.1rem; border-radius: 50%; background: var(--c-warn); color: var(--c-paper-raised); font-size: 0.75rem; font-weight: var(--fw-semibold); line-height: 1; }

.calc__select, .calc__input, .calc__num { font-size: 1rem; color: var(--c-ink); }   /* 16 px: no zoom on focus in iOS */
.calc__select { inline-size: 100%; min-block-size: 3rem; padding-inline: 0.75rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background-color: var(--c-paper-raised); cursor: pointer; }
.calc__money { display: flex; align-items: stretch; min-block-size: 3rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); }
.calc__money:focus-within { outline: var(--border-strong) solid var(--c-focus); outline-offset: 3px; }
.calc__money .calc__input:focus-visible { outline: none; }
.calc__cur { flex: none; display: grid; place-items: center; padding-inline: 0.875rem; background: var(--c-limestone); border-inline-end: 1px solid var(--c-rule); color: var(--c-ink-2); font-weight: var(--fw-medium); }
.calc__cur:last-child { border-inline-end: 0; border-inline-start: 1px solid var(--c-rule); }
.calc__input { flex: 1; min-inline-size: 0; padding-inline: 0.875rem; border: 0; background: transparent; font-size: 1.125rem; font-weight: var(--fw-medium); font-variant-numeric: lining-nums tabular-nums; }
.calc__money:has(.calc__input[readonly]) { background: var(--c-limestone); border-color: var(--c-rule); }
.calc__money:has(.calc__input[readonly]) .calc__cur { background: transparent; }
.calc__money:has(.calc__input[aria-invalid="true"]) { border-color: var(--c-warn); box-shadow: inset 0 0 0 1px var(--c-warn); }

/* the household: one row per kind of applicant, label at the start, stepper at the end */
.calc__steppers { border-block-start: 1px solid var(--c-rule); }
.calc__step { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding-block: var(--space-2); border-block-end: 1px solid var(--c-rule); }
.calc__slabel { font-size: var(--fs-ui); font-weight: var(--fw-medium); color: var(--c-ink); }
.calc__stepper { flex: none; display: inline-flex; align-items: stretch; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); }
.calc__sbtn { display: grid; place-items: center; inline-size: var(--target-min); block-size: var(--target-min); padding: 0; border: 0; background: transparent; color: var(--c-accent); cursor: pointer; transition: background-color var(--dur-1) var(--ease-out); }
.calc__sbtn:hover { background: var(--c-limestone); }
.calc__sbtn[aria-disabled="true"] { color: var(--c-rule-strong); background: transparent; cursor: not-allowed; }
.calc__sbtn:focus-visible, .calc__num:focus-visible { outline-offset: -2px; }
.calc__num { inline-size: 3rem; padding: 0; border: 0; border-inline: 1px solid var(--c-rule); background: transparent; text-align: center; font-weight: var(--fw-semibold); font-variant-numeric: lining-nums tabular-nums; -moz-appearance: textfield; appearance: textfield; }
.calc__num::-webkit-inner-spin-button, .calc__num::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* the years: two choices, native radios inside framed chips */
.calc__chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.calc__chip { display: inline-flex; align-items: center; gap: 0.5rem; min-block-size: var(--target-min); padding-inline: 0.875rem 1rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); font-size: var(--fs-ui); font-weight: var(--fw-medium); color: var(--c-ink); cursor: pointer; transition: border-color var(--dur-2) var(--ease-out), background-color var(--dur-2) var(--ease-out); }
.calc__chip input, .calc__toggle input { flex: none; inline-size: 1.125rem; block-size: 1.125rem; margin: 0; accent-color: var(--c-accent); }
.calc__chip:has(input:checked) { border-color: var(--c-accent); background: var(--c-accent-tint); box-shadow: inset 0 0 0 1px var(--c-accent); }

/* the scenario switch (works without JavaScript) */
.calc__toggle { display: flex; align-items: flex-start; gap: 0.75rem; min-block-size: var(--target-min); padding: 0.75rem 1rem; border: 1px solid var(--c-rule-strong); border-radius: var(--radius-1); background: var(--c-paper-raised); font-size: var(--fs-ui); font-weight: var(--fw-medium); line-height: var(--lh-ui); color: var(--c-ink); cursor: pointer; }
.calc__toggle input { margin-block-start: 0.1rem; }
.calc__toggle:has(input:checked) { border-color: var(--c-ink); background: var(--c-limestone); }
@supports selector(:has(*)) {
  .calc__chip:has(input:focus-visible), .calc__toggle:has(input:focus-visible) { outline: var(--border-strong) solid var(--c-focus); outline-offset: 3px; }
  .calc__chip input:focus-visible, .calc__toggle input:focus-visible { outline: none; }
}

/* ——— the result ——— */
.calc__result { display: grid; gap: var(--space-5); min-inline-size: 0; padding: var(--space-5); background: var(--c-paper-raised); border: 1px solid var(--c-rule); border-block-start: var(--border-strong) solid var(--c-ink); container-type: inline-size; transition: opacity var(--dur-2) var(--ease-out); }
.calc__result.is-stale { opacity: 0.5; }
@media (max-width: 479.98px) { .calc__result { padding: var(--space-5) var(--space-4); } }
.calc__head { display: grid; gap: var(--space-1); }
.calc__h { font-size: var(--fs-display-s); }
.calc__ctx { font-size: var(--fs-small); color: var(--c-ink-3); }

.calc__totals { display: grid; gap: var(--space-4); padding-block: var(--space-4); border-block: 1px solid var(--c-ink); }
@container (min-width: 32rem) { .calc__totals { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-5); } }
.calc__total dt { font-size: var(--fs-small); font-weight: var(--fw-medium); line-height: var(--lh-small); color: var(--c-ink-2); margin-block-end: var(--space-1); }
.calc__big { font-family: var(--ff-display); font-weight: var(--fw-display); font-size: var(--fs-display-m); line-height: 1.1; color: var(--c-ink); font-variant-numeric: lining-nums proportional-nums; }
.calc__total:first-child .calc__big { font-size: clamp(2rem, 1.7rem + 1.2vw, 2.75rem); }
.calc__typ { font-size: var(--fs-micro); color: var(--c-ink-3); }
.calc__sub { display: block; margin-block-start: var(--space-1); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.calc__dot { color: var(--c-rule-strong); }
.calc__excl { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); margin-block-start: calc(var(--space-2) - var(--space-5)); }

/* the stacked bar and its legend (the legend is the bar's text: every value is written) */
.calc__fig { display: grid; gap: var(--space-3); }
.calc__figcap { font-size: var(--fs-small); font-weight: var(--fw-medium); color: var(--c-ink-2); }
.calc__bar { display: flex; gap: 2px; block-size: 1.5rem; }
.calc__s { flex: 0 1 0; min-inline-size: 3px; background: var(--calc-fees); forced-color-adjust: none; transition: flex-grow var(--dur-3) var(--ease-out), opacity var(--dur-2) var(--ease-out); }
.calc__s:last-child { border-start-end-radius: var(--radius-2); border-end-end-radius: var(--radius-2); }
.calc__legend { display: grid; font-size: var(--fs-small); border-block-start: 1px solid var(--c-rule); }
.calc__li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); padding-block: 0.5rem; padding-inline: var(--space-1); border-block-end: 1px solid var(--c-rule); transition: background-color var(--dur-1) var(--ease-out); }
.calc__sw { inline-size: 0.75rem; block-size: 0.75rem; border-radius: var(--radius-1); background: var(--calc-fees); forced-color-adjust: none; }
.calc__lt { color: var(--c-ink-2); }
.calc__lv { color: var(--c-ink); font-weight: var(--fw-medium); font-variant-numeric: lining-nums tabular-nums; text-align: end; white-space: nowrap; }
[data-s="tax"].calc__s, [data-s="tax"] > .calc__sw { background: var(--calc-tax); }
[data-s="extra"].calc__s, [data-s="extra"] > .calc__sw { background: var(--calc-extra); }
[data-s="fees"].calc__s, [data-s="fees"] > .calc__sw { background: var(--calc-fees); }
[data-s="gv"].calc__s, [data-s="gv"] > .calc__sw { background: var(--calc-gv); }
@media (hover: hover) {
  .calc__fig:has([data-s]:hover) .calc__s { opacity: 0.3; }
  .calc__fig:has([data-s="tax"]:hover) .calc__s[data-s="tax"], .calc__fig:has([data-s="extra"]:hover) .calc__s[data-s="extra"],
  .calc__fig:has([data-s="fees"]:hover) .calc__s[data-s="fees"], .calc__fig:has([data-s="gv"]:hover) .calc__s[data-s="gv"] { opacity: 1; }
  .calc__fig:has([data-s="tax"]:hover) .calc__li[data-s="tax"], .calc__fig:has([data-s="extra"]:hover) .calc__li[data-s="extra"],
  .calc__fig:has([data-s="fees"]:hover) .calc__li[data-s="fees"], .calc__fig:has([data-s="gv"]:hover) .calc__li[data-s="gv"] { background: var(--c-limestone); }
}

/* the table: item and its basis in the row header, the typical amount at the end */
.calc__table table { min-inline-size: 0; }
.calc__table th[scope="row"] { font-weight: var(--fw-regular); }
.calc__item { display: block; font-weight: var(--fw-medium); color: var(--c-ink); }
.calc__basis { display: block; margin-block-start: 0.125rem; max-inline-size: 48ch; font-size: var(--fs-micro); line-height: 1.45; color: var(--c-ink-3); }
.calc__table td.n { inline-size: 9rem; font-size: var(--fs-ui); font-weight: var(--fw-medium); color: var(--c-ink); }
.calc__table td.calc__txt { font-size: var(--fs-micro); line-height: 1.45; color: var(--c-ink-2); }
.calc__table tfoot th { font-weight: var(--fw-semibold); }
.calc__ft { display: block; font-size: var(--fs-body); }
.calc__rng { display: block; font-size: var(--fs-micro); font-weight: var(--fw-regular); color: var(--c-ink-3); white-space: normal; }
@container (min-width: 36rem) { .calc__table td.n { inline-size: 14rem; } .calc__rng { white-space: nowrap; } }

/* the announced 15% scenario: only when ticked */
.calc__sc, .calc__sc-only { display: none; }
.calc:has([data-calc-scenario-toggle]:checked) .calc__sc, .calc--sc .calc__sc { display: block; }
.calc:has([data-calc-scenario-toggle]:checked) .calc__s.calc__sc-only, .calc--sc .calc__s.calc__sc-only { display: block; }
.calc:has([data-calc-scenario-toggle]:checked) .calc__li.calc__sc-only, .calc--sc .calc__li.calc__sc-only { display: grid; }
.calc__sc { padding: var(--space-4) var(--space-5); background: var(--c-limestone); border-inline-start: var(--border-strong) solid var(--c-ink); }
.calc__sc-h { font-family: var(--ff-text); font-size: var(--fs-ui); font-weight: var(--fw-semibold); line-height: var(--lh-ui); color: var(--c-ink); }
.calc__sc-label { margin-block: var(--space-2) var(--space-3); font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-2); }
.calc__sc-dl > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: var(--space-1) var(--space-4); padding-block: 0.5rem; border-block-start: 1px solid var(--c-rule-strong); font-size: var(--fs-small); }
.calc__sc-dl dt { color: var(--c-ink-2); }
.calc__sc-dl dd { color: var(--c-ink); font-weight: var(--fw-medium); text-align: end; font-variant-numeric: lining-nums tabular-nums; }
.calc__sc-dl dd .calc__rng { font-weight: var(--fw-regular); }
@container (max-width: 32rem) { .calc__sc-dl > div { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* notes and actions inside the panel (the panel's gap spaces them; .fine of 90-utilities loads later, hence the
   two-class selectors) */
.calc__result .calc__fine { margin-block-start: 0; }
.calc__result .calc__updated { margin-block-start: calc(var(--space-2) - var(--space-5)); }
.calc__result .ctas { margin-block-start: 0; }

@media (forced-colors: active) {
  .calc__chip:has(input:checked), .calc__toggle:has(input:checked) { outline: 2px solid Highlight; }
  .calc__sbtn[aria-disabled="true"] { color: GrayText; }
}
@media print {
  .calc__inputs, .calc__toggle, .calc__nojs { display: none !important; }
  .calc { display: block; }
  .calc__result { padding: 0; border: 0; background: none; }
}

/* ——— 55-programmes.css ——— */
/* 55-programmes — the programme comparison (tools/blocks/programmes.mjs, assets/js/compare.js): the mode links that
   become tabs, the filters, the Greek-routes and European-programmes tables (one card per row below 1120 px, never a
   sideways scroll), tags for reported, unverified and non-refundable facts, the list of closed programmes.
   Logical properties only (RTL); motion is colour only (reduced motion is handled in 02-base). */

.pg { display: grid; gap: var(--space-6); }
.pg > *, .pg-panel > * { min-inline-size: 0; }

/* ——— the two modes: jump links without JavaScript, a tablist with it ——— */
.pg-tabs { display: flex; flex-wrap: wrap; gap: 0 var(--space-6); border-block-end: 1px solid var(--c-rule); }
.pg-tabs a { position: relative; display: inline-flex; align-items: center; min-block-size: var(--target-min); padding-block: var(--space-2); color: var(--c-ink-2); font-size: var(--fs-ui); font-weight: var(--fw-medium); text-decoration: none; }
.pg-tabs a::after { content: ""; position: absolute; inset-inline: 0; inset-block-end: -1px; block-size: 2px; background: transparent; transition: background-color var(--dur-1) var(--ease-out); }
.pg-tabs a:hover { color: var(--c-ink); }
.pg-tabs a:hover::after { background: var(--c-rule-strong); }
.pg-tabs a[aria-selected="true"] { color: var(--c-accent); }
.pg-tabs a[aria-selected="true"]::after { background: var(--c-accent); }

.pg-panel { display: grid; gap: var(--space-4); align-content: start; }
/* without JavaScript: the modes stacked */
.no-js .pg-panel + .pg-panel { margin-block-start: var(--space-5); padding-block-start: var(--space-7); border-block-start: 1px solid var(--c-ink); }
/* with JavaScript, until compare.js has run (or if it never does): one mode at a time, switched by the jump links
   through :target, so nothing moves when the module takes over; the filters keep their place */
.js .pg:not(.is-tabs):not(:has(.pg-panel:target)) .pg-panel ~ .pg-panel { display: none; }
.js .pg:not(.is-tabs):has(.pg-panel:target) .pg-panel:not(:target) { display: none; }
.js .pg:not(.is-tabs) .pg-ctl[hidden] { display: flex !important; visibility: hidden; }
.pg-panel__h { font-size: var(--fs-display-m); line-height: var(--lh-display-m); letter-spacing: var(--ls-display-m); font-weight: var(--fw-display-light); }
.pg-panel__intro { max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.pg-asof { margin-block-start: calc(-1 * var(--space-2)); font-size: var(--fs-small); color: var(--c-ink-3); }
.pg-since { max-inline-size: var(--measure-text); font-size: var(--fs-small); color: var(--c-ink-2); }
.pg-disclosure { margin-block-start: 0; }

/* ——— filters and order (the residences explorer's .filters, plus a hint line) ——— */
.pg-ctl { margin-block-end: 0; }
.pg-hint { flex: 1 1 100%; max-inline-size: var(--measure-text); font-size: var(--fs-micro); line-height: var(--lh-small); color: var(--c-ink-3); }
.pg-empty { display: grid; justify-items: start; gap: var(--space-3); padding: var(--space-5); border: 1px dashed var(--c-rule-strong); color: var(--c-ink-2); }

/* ——— tables: shared ——— */
.pg-table table { table-layout: fixed; }
.pg-table thead th { white-space: normal; vertical-align: bottom; }
.pg-table tbody th, .pg-table td { padding-block: var(--space-4); }
.pg-table td { color: var(--c-ink-2); }
.pg-c > p + p, .pg-c > p + ul, .pg-c > ul + p, .pg-c > ul + details, .pg-c > p + details { margin-block-start: var(--space-2); }
.pg-k { display: none; }
.pg-country, .pg-rname { display: block; font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: 1.2; font-weight: var(--fw-display); color: var(--c-ink); }
.pg-rname { margin-block-start: var(--space-1); font-size: 1.0625rem; }
.pg-name { display: block; margin-block-start: var(--space-1); font-size: var(--fs-micro); line-height: 1.4; font-weight: var(--fw-regular); color: var(--c-ink-2); }
.pg-status { display: flex; margin-block-start: var(--space-2); }
.pg-note { display: block; margin-block-start: var(--space-2); font-size: var(--fs-micro); line-height: 1.45; font-weight: var(--fw-regular); color: var(--c-ink-3); }
.pg-amt { display: block; font-family: var(--ff-display); font-size: 1.375rem; line-height: 1.15; font-weight: var(--fw-display); color: var(--c-ink); font-variant-numeric: lining-nums tabular-nums; white-space: nowrap; }
.pg-c > .pg-amt + .pg-lbl { margin-block-start: 0.125rem; }
.pg-lbl { font-size: var(--fs-micro); font-weight: var(--fw-semibold); color: var(--c-ink); }
.pg-none { font-weight: var(--fw-semibold); color: var(--c-ink); }
.pg-na { color: var(--c-ink-3); }
.pg-sub { font-weight: var(--fw-semibold); color: var(--c-ink); }
.pg-strong { font-weight: var(--fw-medium); color: var(--c-ink); }
.pg-jump { display: inline-flex; align-items: center; min-block-size: var(--target-min); font-weight: var(--fw-medium); }
.pg-dl dt { font-weight: var(--fw-semibold); color: var(--c-ink); }
.pg-dl dd { margin: 0; }
.pg-dl dd + dt { margin-block-start: var(--space-2); }
.pg-routes { display: grid; gap: var(--space-3); }
.pg-routes li { display: grid; gap: 0.125rem; }
.pg-ramt { font-weight: var(--fw-semibold); color: var(--c-ink); font-variant-numeric: lining-nums tabular-nums; }
.pg-list { display: grid; gap: var(--space-1); }

/* ——— status badges (words first; colour only repeats them) and fact tags ——— */
.pg-badge--open { background: var(--c-accent-tint); color: var(--c-accent); }
.pg-badge--changed, .pg-badge--closed { background: var(--c-neutral-badge); color: var(--c-ink-2); }
.pg-badge--changed::before { background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }
.pg-badge--closed::before { block-size: 2px; border-radius: 0; }
.pg-tag { display: inline-block; margin-inline-start: 0.375rem; padding: 0 0.375rem; border: 1px solid transparent; border-radius: var(--radius-1); font-size: 0.75rem; font-weight: var(--fw-semibold); line-height: 1.5; white-space: nowrap; vertical-align: 0.0625rem; }
.pg-tag--spent { background: var(--c-limestone); color: var(--c-ink-2); }
.pg-tag--unusable { border-color: var(--c-rule-strong); color: var(--c-ink-2); }
.pg-tag--reported { border-color: var(--c-rule-strong); border-style: dashed; color: var(--c-ink-2); }
.pg-tag--unverified { background: var(--c-warn-tint); color: var(--c-warn); }

/* ——— sources: check date, official links (44 px targets), the rest behind a disclosure ——— */
.pg-checked { font-size: var(--fs-micro); color: var(--c-ink-3); }
.pg-src { display: grid; }
.pg-src a { display: inline-flex; align-items: center; min-block-size: var(--target-min); padding-block: 0.25rem; font-size: var(--fs-micro); line-height: 1.35; }
.pg-more { font-size: var(--fs-micro); }
.pg-more > summary { display: inline-flex; align-items: center; gap: 0.375rem; min-block-size: var(--target-min); color: var(--c-accent); font-weight: var(--fw-medium); cursor: pointer; list-style: none; }
.pg-more > summary::-webkit-details-marker { display: none; }
.pg-more > summary::before { content: "+"; display: inline-grid; place-items: center; inline-size: 1rem; block-size: 1rem; border: 1px solid currentColor; border-radius: var(--radius-1); font-size: 0.8125rem; line-height: 1; }
.pg-more[open] > summary::before { content: "\2212"; }
.pg-more > :not(summary) + :not(summary) { margin-block-start: var(--space-2); }
.pg-more > p { line-height: 1.5; }

/* ——— the rules common to the Greek routes ——— */
.pg-common { max-inline-size: 60rem; }
.pg-common .callout__h { font-family: var(--ff-text); }
.pg-common .pg-sub { font-size: var(--fs-micro); }
.pg-common .pg-src { display: flex; flex-wrap: wrap; gap: 0 var(--space-5); padding-inline-start: 0; }

/* ——— legend and the closed list ——— */
.pg-legend { display: grid; gap: var(--space-2); font-size: var(--fs-small); color: var(--c-ink-3); }
.pg-legend li { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2); }
.pg-legend .pg-tag { margin-inline-start: 0; }
.pg-sub-h { margin-block-start: var(--space-5); font-family: var(--ff-display); font-size: var(--fs-display-s); line-height: var(--lh-display-s); font-weight: var(--fw-display); }
.pg-closed { display: grid; border-block-start: 1px solid var(--c-ink); }
.pg-closed__item { display: grid; gap: var(--space-1); align-content: start; padding-block: var(--space-4) var(--space-2); border-block-end: 1px solid var(--c-rule); font-size: var(--fs-small); color: var(--c-ink-2); }
.pg-closed__country { font-family: var(--ff-display); font-size: 1.0625rem; color: var(--c-ink); }
.pg-closed__name { color: var(--c-ink); font-weight: var(--fw-medium); }
@media (min-width: 900px) { .pg-closed { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: calc(var(--grid-gap) * 2); } }

/* ——— wide screens: real tables with fixed column shares ——— */
@media (min-width: 1120px) {
  .pg-table--eu .pg-col--programme { inline-size: 13%; }
  .pg-table--eu .pg-col--re { inline-size: 15%; }
  .pg-table--eu .pg-col--other { inline-size: 15%; }
  .pg-table--eu .pg-col--permit { inline-size: 12%; }
  .pg-table--eu .pg-col--stay { inline-size: 9%; }
  .pg-table--eu .pg-col--family { inline-size: 11%; }
  .pg-table--eu .pg-col--path { inline-size: 13%; }
  .pg-table--eu .pg-col--checked { inline-size: 12%; }
  .pg-table--gr .pg-col--route { inline-size: 17%; }
  .pg-table--gr .pg-col--where { inline-size: 20%; }
  .pg-table--gr .pg-col--size { inline-size: 14%; }
  .pg-table--gr .pg-col--conditions { inline-size: 32%; }
  .pg-table--gr .pg-col--official { inline-size: 17%; }
  .pg-table tbody tr:hover > * { background: color-mix(in srgb, var(--c-paper-raised) 70%, transparent); }
}

/* ——— below 1120 px: one card per row, each value under its own label ——— */
@media (max-width: 1119.98px) {
  .pg-table { overflow: visible; border-block-start: 0; }
  .pg-table table { display: flex; flex-direction: column; min-inline-size: 0; }
  .pg-table colgroup, .pg-table thead { display: none; }
  .pg-table caption { order: 2; display: block; }
  .pg-table tbody { display: grid; gap: var(--grid-gap); }
  .pg-table tr { display: block; padding: var(--space-4) var(--space-4) var(--space-2); background: var(--c-paper-raised); border: 1px solid var(--c-rule); box-shadow: var(--shadow-1); }
  .pg-table th, .pg-table td { display: block; padding: var(--space-3) 0; border-block-end: 0; }
  .pg-table tbody th { padding-block-start: 0; }
  .pg-table td { border-block-start: 1px solid var(--c-rule); }
  .pg-k { display: block; margin-block-end: var(--space-1); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-ink-3); }
  :lang(ar) .pg-k, :lang(he) .pg-k, :lang(zh-Hans) .pg-k { font-size: var(--fs-micro); letter-spacing: 0; text-transform: none; }
}
@media (min-width: 700px) and (max-width: 1119.98px) {
  .pg-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-5); align-content: start; }
  .pg-table tr > th, .pg-table tr > .pg-c--wide { grid-column: 1 / -1; }
}

@media print {
  .pg-tabs, .pg-ctl, .pg-empty { display: none !important; }
  .pg-panel[hidden] { display: grid !important; }
}

/* ——— 56-media.css ——— */
/* 56-media — the before/after slider (blocks/before-after.mjs + assets/js/before-after.js) and the SVG maps
   (blocks/map.mjs). Logical properties throughout; the one physical exception is the map itself, which is geography
   and is never mirrored (east stays right on right-to-left pages, while its labels, list and caption follow the page). */

/* ——— before/after ——— */
.ba-wrap { display: grid; gap: var(--space-6); align-items: center; }
@media (min-width: 960px) { .ba-wrap { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: calc(var(--grid-gap) * 3); } }
.ba-wrap--solo { grid-template-columns: minmax(0, 1fr); }
.ba-wrap--solo .ba { inline-size: 100%; max-inline-size: 42rem; margin-inline: auto; }
.ba-copy { max-inline-size: var(--measure-text); color: var(--c-ink-2); }
.ba-copy > .sec__h { margin-block-end: var(--space-4); }
.ba-copy .sec__intro { margin-block-end: 0; }
.ba { position: relative; margin: 0; }

/* without JavaScript: the two images side by side, each with its own label */
.ba__frame { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.ba__layer { position: relative; overflow: hidden; aspect-ratio: var(--ar); background: var(--c-limestone); }
.ba__layer picture, .ba__img { display: block; inline-size: 100%; block-size: 100%; }
.ba__img { object-fit: cover; -webkit-user-drag: none; user-select: none; }
.ba__chip { pointer-events: none; }
.js .ba__chip { max-inline-size: calc(50% - var(--space-4)); }
.ba__range, .ba__divider, .ba__lbl { display: none; }

/* with JavaScript (the class is set before first paint, so nothing shifts): one frame, the render on top, clipped
   from the divider toward the inline end */
.js .ba__frame { display: block; position: relative; aspect-ratio: var(--ar); overflow: hidden; background: var(--c-limestone); touch-action: pan-y; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
.js .ba__layer { position: absolute; inset: 0; aspect-ratio: auto; }
.js .ba__layer--after { clip-path: inset(0 0 0 var(--pos, 50%)); }
.js[dir="rtl"] .ba__layer--after { clip-path: inset(0 var(--pos, 50%) 0 0); }
.js .ba__layer--after .ba__chip { inset-inline-start: auto; inset-inline-end: var(--space-2); }
.js .ba__divider { display: block; position: absolute; z-index: 2; inset-block: 0; inset-inline-start: var(--pos, 50%); inline-size: 2px; margin-inline-start: -1px; background: var(--c-paper-raised); box-shadow: 0 0 0 1px rgba(19, 32, 31, 0.3); pointer-events: none; }
.ba__handle { position: absolute; inset-block-start: 50%; inset-inline-start: 50%; translate: calc(-50% * var(--dir)) -50%; display: grid; place-items: center; inline-size: var(--target-min); block-size: var(--target-min); background: var(--c-paper-raised); color: var(--c-ink); border: 1px solid var(--c-ink); border-radius: var(--radius-1); box-shadow: var(--shadow-2); }
.ba__handle .i { inline-size: 1.375rem; block-size: 1.375rem; }
/* the input covers the picture for assistive technology; pointers are handled by the frame (before-after.js) */
.js .ba__range { display: block; position: absolute; z-index: 3; inset: 0; inline-size: 100%; block-size: 100%; margin: 0; opacity: 0; pointer-events: none; -webkit-appearance: none; appearance: none; }
.ba__range:focus-visible + .ba__divider .ba__handle { outline: var(--border-strong) solid var(--c-focus); outline-offset: 3px; }
.ba[data-ready] .ba__frame { cursor: ew-resize; }
.js .ba__lbl { display: flex; align-items: center; gap: var(--space-2); min-block-size: var(--target-min); margin-block-start: var(--space-2); font-size: var(--fs-small); font-weight: var(--fw-medium); color: var(--c-ink-2); cursor: pointer; }
.ba__lbl .i { color: var(--c-accent); }
.ba__cap { display: flex; gap: var(--space-3); margin-block-start: var(--space-3); max-inline-size: 60ch; font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); }
.js .ba__cap { margin-block-start: var(--space-1); }
.ba__cap::before { content: ""; flex: none; inline-size: 1.5rem; block-size: 1px; margin-block-start: 0.72em; background: var(--c-ink-3); }

/* ——— maps ——— */
.map { --map-sea: #D9E2E1; --map-coast: #8C9894; display: grid; gap: var(--space-6); align-items: start; }
@media (min-width: 960px) {
  .map--greece { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: calc(var(--grid-gap) * 3); }
}
.map__fig { margin: 0; min-inline-size: 0; }
.map--greece .map__fig { inline-size: 100%; max-inline-size: 40rem; }
.map__frame { position: relative; aspect-ratio: var(--ar); container: map / inline-size; overflow: hidden; background: var(--map-sea); border: 1px solid var(--c-rule); border-radius: var(--radius-1); }
.map__svg { position: absolute; inset: 0; display: block; inline-size: 100%; block-size: 100%; max-inline-size: none; overflow: hidden; }
.map__sea { fill: var(--map-sea); }
.map__land { fill: var(--c-paper); stroke: var(--map-coast); stroke-width: 0.75; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.map__lead { stroke: var(--c-ink-3); stroke-width: 1; }
.map__dot { fill: var(--c-accent); stroke: var(--c-paper-raised); stroke-width: 1.5; }
.map__ring { fill: var(--c-paper-raised); fill-opacity: 0.55; stroke: var(--c-accent); stroke-width: 1.5; }
@container map (max-width: 599.98px) { .map__home { transform: scale(0.8); } }
.map__diamond { fill: var(--c-paper-raised); stroke: var(--c-ink-2); stroke-width: 1.5; }
.map__t { font-family: var(--ff-text); font-size: 12px; font-weight: var(--fw-medium); letter-spacing: 0; fill: var(--c-ink-2); paint-order: stroke fill; stroke: var(--c-paper); stroke-width: 3px; stroke-linejoin: round; }
.map__t--home { font-size: 13px; font-weight: var(--fw-semibold); fill: var(--c-ink); }
/* label sizes and the label set of each width band (blocks/map.mjs BANDS: 320, 343, 600 and 900 px); set 2, the
   phone band, is the one shown where container queries are not supported */
.map__v { display: none; }
.map__v2 { display: inline; }
@container map (max-width: 342.98px) {
  .map__scale { display: none; }
  .map__t { font-size: 11px; }
  .map__t--home { font-size: 12px; }
  .map__v2 { display: none; }
  .map__v1 { display: inline; }
}
@container map (max-width: 319.98px) {
  .map__v1 { display: none; }
  .map__v0 { display: inline; }
}
@container map (min-width: 600px) {
  .map__t { font-size: 13px; }
  .map__t--home { font-size: 14px; }
  .map__v2 { display: none; }
  .map__v3 { display: inline; }
}
@container map (min-width: 900px) {
  .map__v3 { display: none; }
  .map__v4 { display: inline; }
}
.map__scale rect { fill: var(--c-ink-3); }
.map__scale text { font-family: var(--ff-text); font-size: 12px; fill: var(--c-ink-3); paint-order: stroke fill; stroke: var(--map-sea); stroke-width: 3px; stroke-linejoin: round; }

.map__cap { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-2) var(--space-5); margin-block-start: var(--space-3); font-size: var(--fs-micro); line-height: 1.45; color: var(--c-ink-3); }
.map__legend { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.map__legend li { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--c-ink-2); }
.map__credit a { color: inherit; }
.map__sym { flex: none; inline-size: 1rem; block-size: 1rem; overflow: visible; }

.map__side { display: grid; gap: var(--space-5); min-inline-size: 0; }
.map__areas { padding: var(--space-4) var(--space-5); background: var(--c-limestone); border-inline-start: var(--border-strong) solid var(--c-ink); font-size: var(--fs-small); line-height: 1.6; color: var(--c-ink-2); }
.map__areas > * + * { margin-block-start: var(--space-2); }
.map__areas-h { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-ui); font-weight: var(--fw-semibold); color: var(--c-ink); }
.map__key-h { margin-block-end: var(--space-3); font-size: var(--fs-eyebrow); font-weight: var(--fw-semibold); letter-spacing: var(--ls-eyebrow); text-transform: uppercase; color: var(--c-ink); }
:lang(ar) .map__key-h, :lang(he) .map__key-h, :lang(zh-Hans) .map__key-h { text-transform: none; letter-spacing: 0; font-size: var(--fs-small); }
.map__list { display: grid; border-block-start: 1px solid var(--c-ink); }
.map__li { display: grid; grid-template-columns: 1rem minmax(0, 1fr); gap: var(--space-3); align-items: start; padding-block: 0.75rem; border-block-end: 1px solid var(--c-rule); font-size: var(--fs-small); line-height: 1.45; }
.map__li .map__sym { margin-block-start: 0.15em; }
.map__name { display: block; color: var(--c-ink); font-weight: var(--fw-medium); }
.map__note { display: block; color: var(--c-ink-2); font-variant-numeric: lining-nums tabular-nums; }
.map__li--home .map__name { font-weight: var(--fw-semibold); }
@media (min-width: 700px) {
  .map--region .map__list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--grid-gap); }
}
@media (min-width: 1120px) {
  .map--region .map__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* on a dark section (block tone "dark"): the text around the pictures turns light; the framed map keeps its colours */
.sec--dark .map__name, .sec--dark .map__key-h, .sec--dark .map__areas-h { color: var(--c-on-dark); }
.sec--dark .map__note, .sec--dark .map__cap, .sec--dark .map__legend li, .sec--dark .map__areas, .sec--dark .ba__cap, .sec--dark .ba__lbl { color: var(--c-on-dark-2); }
.sec--dark .map__list { border-color: var(--c-on-dark); }
.sec--dark .map__li { border-color: var(--c-rule-on-dark); }
.sec--dark .map__areas { background: transparent; border-color: var(--c-on-dark); }
.sec--dark .map__sym .map__dot, .sec--dark .ba__lbl .i { fill: var(--c-accent-on-dark); color: var(--c-accent-on-dark); }
.sec--dark .map__sym .map__ring { stroke: var(--c-accent-on-dark); fill: none; }
.sec--dark .map__sym .map__diamond { stroke: var(--c-on-dark-2); fill: none; }
.sec--dark .ba__cap::before { background: var(--c-on-dark-2); }

@media (forced-colors: active) {
  .map__svg { forced-color-adjust: none; }
  .ba__handle { border: 1px solid CanvasText; }
}
@media print {
  .js .ba__frame { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4mm; aspect-ratio: auto; }
  .js .ba__layer { position: relative; aspect-ratio: var(--ar); clip-path: none !important; }
  .js .ba__layer--after .ba__chip { inset-inline-start: var(--space-2); inset-inline-end: auto; }
  .ba__divider, .ba__lbl, .ba__range { display: none !important; }
  .map, .ba { break-inside: avoid; }
}

/* ——— 90-utilities.css ——— */
/* 90-utilities — small, single-purpose helpers. */
.sr { position: absolute !important; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.fine { font-size: var(--fs-small); line-height: var(--lh-small); color: var(--c-ink-3); max-inline-size: var(--measure-text); margin-block-start: var(--space-4); }
.tnum { font-variant-numeric: lining-nums tabular-nums; }
.nowrap { white-space: nowrap; }
.js [data-js-hidden] { display: none; }
.no-js [data-no-js-hidden] { display: none; }
[hidden] { display: none !important; }

/* ——— 99-print.css ——— */
/* 99-print — clean print and the investor-pack PDF (headless Chrome): no chrome, black on white, URLs after links. */
@media print {
  @page { size: A4; margin: 16mm 14mm; }
  body { background: #fff; color: #000; font-size: 10.5pt; }
  .hdr, .ftr__top, .ftr__row, .mbar, .wa-fab, .langbar, .toc, .ctas, .filters, .rcard__cmp, .skip, .menu, .lang { display: none !important; }
  .sec, .phead, .uhero, .hero { padding-block: 6mm !important; break-inside: avoid-page; }
  .sec--band, .sec--dark { background: #fff !important; color: #000 !important; }
  .sec--band *, .sec--dark * { color: #000 !important; }
  a { color: #000; text-decoration: none; }
  .prose__body a[href^="http"]::after, .faq__a a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; color: #444; }
  .media, .rcard, .card, .tier, .ms, .step { break-inside: avoid; }
  .faq__item { display: block; }
  .faq__item > :not(summary) { display: block !important; }
}

/* ——— the investor pack (template "print"): a document on screen, a PDF in print ——— */
.doc-hdr { border-block-end: 1px solid var(--c-ink); }
.doc-hdr__in { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--space-2) var(--space-5); padding-block: var(--space-5); }
.doc-hdr__logo .logo { block-size: 26px; color: var(--c-ink); }
.doc-hdr__t { font-family: var(--ff-display); font-size: var(--fs-display-s); }
.doc-hdr__d { margin-inline-start: auto; font-size: var(--fs-small); color: var(--c-ink-3); }
.doc-ftr { border-block-start: 1px solid var(--c-ink); padding-block: var(--space-5); font-size: var(--fs-micro); color: var(--c-ink-2); }
.doc-ftr p + p { margin-block-start: var(--space-2); }
.t-print .sec { padding-block: var(--space-6); }
@media print {
  .t-print .doc-hdr, .t-print .doc-ftr { display: block !important; }
  .t-print .sec { break-before: auto; }
  .t-print .sec--pagebreak { break-before: page; }
}