/* ads1.vikathai.com — the page, design system v4 (Unique Design/design-system/GUIDELINES.md).
   Tokens: Standard desk "Mossy Green", three theme states like vikathai.com. Nothing here is Tilda's. */

:root {
  color-scheme: light;
  --canvas: #f3f4ef; --canvas-deep: #eef2ea; --surface: #ffffff; --surface-2: #f9faf6;
  --line: #e1e5de; --line-int: #ccd3cb;
  --ink: #0f1a14; --ink-2: #4f5f56; --ink-3: #6f7f76;
  --accent: #22382c; --accent-2: #2e4a3a; --accent-soft: #f1ead3; --on-accent: #f3efe0;
  --band: #22382c; --lux: #7f6a2c; --gold: #d9c58a; --metal-hi: #f6eecb; --metal-deep: #a58a3c; --focus: #22382c;
  --danger: #8f2417; --danger-soft: #fbe4de; --ok: #10614a; --ok-soft: #dcf0e4;
  --scrim: rgba(6, 18, 15, 0.55);
  --shade: 0 1px 2px rgba(15, 26, 20, 0.06), 0 8px 24px rgba(15, 26, 20, 0.08);
  --glass: rgba(255, 255, 255, 0.72);
  --photo-ink: #ffffff; --photo-ink-2: rgba(255, 255, 255, 0.82);
  --photo-scrim: linear-gradient(to top, rgba(6, 18, 15, 0.88) 0%, rgba(6, 18, 15, 0.62) 24%, rgba(6, 18, 15, 0.22) 58%, rgba(6, 18, 15, 0) 100%);
  --metal: linear-gradient(135deg, var(--metal-hi) 0%, var(--gold) 46%, var(--metal-deep) 100%);
  --on-gold: #15200f;
  --font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-display: 'Inter Tight', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --r1: 11px; --r2: 16px; --r3: 20px; --r4: 26px; --pill: 999px;
  --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 40px; --sp-9: 56px; --sp-10: 80px;
  --tap: max(44px, 2.75rem); --tap-hero: max(56px, 3.5rem);
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1); --dur: 220ms;
  --fs-h1: clamp(40px, 6.2vw, 74px); --fs-h2: clamp(28px, 3.8vw, 46px); --fs-h3: 18px; --fs-body: 16px; --fs-ui: 13.5px; --fs-caption: 12.5px; --fs-label: 11px;
  --edge: max(16px, env(safe-area-inset-left, 0px)); --wrap: 1200px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --canvas: #0b120e; --canvas-deep: #0f1712; --surface: #131c16; --surface-2: #182219;
    --line: #22302a; --line-int: #2f3f36; --ink: #edf0e9; --ink-2: #a3b0a6; --ink-3: #87958c;
    --accent: #dccb93; --accent-2: #e6d7a6; --accent-soft: #2a3120; --on-accent: #15200f;
    --band: #2e4a3a; --lux: #dcc98d; --gold: #e4d4a0; --metal-hi: #faf3d6; --metal-deep: #b59c53; --focus: #e4d4a0;
    --danger: #f2a08f; --danger-soft: #3a1c17; --ok: #74cf95; --ok-soft: #14291d;
    --scrim: rgba(0, 0, 0, 0.62); --shade: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.35); --glass: rgba(19, 28, 22, 0.72);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #0b120e; --canvas-deep: #0f1712; --surface: #131c16; --surface-2: #182219;
  --line: #22302a; --line-int: #2f3f36; --ink: #edf0e9; --ink-2: #a3b0a6; --ink-3: #87958c;
  --accent: #dccb93; --accent-2: #e6d7a6; --accent-soft: #2a3120; --on-accent: #15200f;
  --band: #2e4a3a; --lux: #dcc98d; --gold: #e4d4a0; --metal-hi: #faf3d6; --metal-deep: #b59c53; --focus: #e4d4a0;
  --danger: #f2a08f; --danger-soft: #3a1c17; --ok: #74cf95; --ok-soft: #14291d;
  --scrim: rgba(0, 0, 0, 0.62); --shade: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px rgba(0, 0, 0, 0.35); --glass: rgba(19, 28, 22, 0.72);
}

/* ── ground ─────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--canvas); color: var(--ink); font-family: var(--font-ui); font-size: var(--fs-body); line-height: 1.5; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body.is-locked { overflow: hidden; }
img, picture, svg, video { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }
.wrap { width: min(var(--wrap), 100% - 2 * var(--edge)); margin-inline: auto; }
.sec { padding-block: var(--sp-10); }
@media (max-width: 720px) { .sec { padding-block: var(--sp-9); } }
.sec--band { background: var(--canvas-deep); }

/* type */
h1, h2, h3, .display { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.02em; line-height: 1.08; margin: 0; text-wrap: balance; color: var(--ink); }
h1, .h1 { font-size: var(--fs-h1); font-weight: 700; letter-spacing: -0.035em; line-height: 1.03; }
h2, .h2 { font-size: var(--fs-h2); font-weight: 700; letter-spacing: -0.03em; line-height: 1.05; }
h3, .h3 { font-size: var(--fs-h3); font-weight: 600; letter-spacing: -0.01em; line-height: 1.25; }
p { margin: 0; }
.lead { font-size: clamp(16px, 1.6vw, 19px); color: var(--ink-2); max-width: 60ch; }
.muted { color: var(--ink-2); } .faint { color: var(--ink-3); }
.label { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3); }
.num { font-family: var(--font-display); font-variant-numeric: lining-nums tabular-nums; }
.sec-head { display: grid; gap: var(--sp-4); margin-bottom: var(--sp-8); max-width: 62ch; }
.sec-head--center { margin-inline: auto; text-align: center; }
.sec-head--center .lead { margin-inline: auto; }
@media (max-width: 720px) { .sec-head { margin-bottom: var(--sp-6); } }

/* ── pills, chips, buttons ──────────────────────────────────────────────── */
.pill { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2); min-block-size: var(--tap); padding-inline: var(--sp-5); border: 1px solid transparent; border-radius: var(--pill); background: transparent; color: var(--ink); font-size: var(--fs-ui); font-weight: 500; line-height: 1; white-space: nowrap; text-decoration: none; cursor: pointer; transition: translate 180ms var(--ease), background-color var(--dur), border-color var(--dur), box-shadow var(--dur); }
.pill svg { inline-size: 18px; block-size: 18px; flex: none; }
@media (hover: hover) and (pointer: fine) { .pill:hover { translate: 0 -1px; } }
.pill:active { translate: 0 1px; }
.pill:disabled { opacity: 0.45; cursor: default; translate: none; }
.pill--line { border-color: var(--line-int); background: var(--surface); }
.pill--glass { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.26); color: #fff; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.pill--glass:hover { background: rgba(255, 255, 255, 0.22); }
.pill--primary { background: var(--accent); color: var(--on-accent); font-weight: 600; }
.pill--primary:hover { background: var(--accent-2); }
.pill--accent { position: relative; isolation: isolate; background: var(--metal); border-color: color-mix(in srgb, var(--metal-deep) 55%, transparent); color: var(--on-gold); font-weight: 600; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 color-mix(in srgb, var(--metal-deep) 60%, transparent), var(--shade); }
.pill--accent::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; border-radius: inherit; opacity: 0.35; background: linear-gradient(115deg, transparent 42%, #fff 50%, transparent 58%); background-size: 240% 240%; animation: vtSheen 11s ease-in-out infinite alternate; }
@media (prefers-reduced-motion: reduce) { .pill--accent::after { animation: none; } html { scroll-behavior: auto; } }
.pill--big { min-block-size: var(--tap-hero); padding-inline: var(--sp-7); font-size: 16px; }
.pill--icon { inline-size: var(--tap); padding-inline: 0; aspect-ratio: 1; }
.pill--icon.pill--sm, .pill--sm { min-block-size: 38px; }
.pill--icon.pill--sm { inline-size: 38px; }
.chip { display: inline-flex; align-items: center; gap: var(--sp-2); padding: 6px var(--sp-3); border: 1px solid var(--line); border-radius: var(--pill); background: var(--surface-2); color: var(--ink-2); font-size: var(--fs-caption); line-height: 1.2; white-space: nowrap; }
.chip svg { inline-size: 14px; block-size: 14px; }
.chip--photo { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.22); color: #fff; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.chip--accent { background: var(--accent-soft); border-color: transparent; color: var(--ink); }
.chip--alert { background: #d9412f; border-color: transparent; color: #fff; font-weight: 600; }
.dot { inline-size: 6px; block-size: 6px; border-radius: 50%; background: var(--gold); flex: none; }

/* ── cards ──────────────────────────────────────────────────────────────── */
.card { border: 1px solid var(--line); border-radius: var(--r2); background: var(--surface); box-shadow: var(--shade); }
.panel { border: 1px solid var(--line); border-radius: var(--r4); background: var(--surface); box-shadow: var(--shade); }
.well { display: grid; place-items: center; inline-size: 48px; block-size: 48px; border-radius: 14px; background: var(--accent-soft); color: var(--accent); flex: none; }
.well svg { inline-size: 24px; block-size: 24px; }
:root[data-theme="dark"] .well, :root:not([data-theme="light"]) .well { color: var(--gold); }
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) .well { color: var(--accent); } }
:root[data-theme="light"] .well { color: var(--accent); }
.grid { display: grid; gap: var(--sp-4); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 960px) { .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .grid--3, .grid--2 { grid-template-columns: 1fr; } }

/* photos */
.photo { position: relative; overflow: hidden; border-radius: var(--r2); background: var(--canvas-deep); }
.photo > picture, .hero__bg > picture, .consult__bg > picture, .step__pic > picture, .insta__pic > picture { display: block; inline-size: 100%; block-size: 100%; }
.photo img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.photo--scrim::after { content: ""; position: absolute; inset: 0; background: var(--photo-scrim); pointer-events: none; }

/* ── header ─────────────────────────────────────────────────────────────── */
.hdr { position: sticky; top: 0; z-index: 100; padding-block: var(--sp-3); background: var(--glass); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transition: box-shadow var(--dur); }
.hdr.is-solid { box-shadow: 0 1px 0 var(--line); }
.hdr__row { display: flex; align-items: center; gap: var(--sp-3); }
.hdr__logo { display: inline-flex; align-items: center; color: var(--ink); text-decoration: none; margin-inline-end: var(--sp-3); }
.hdr__logo svg { block-size: 40px; inline-size: auto; }
.hdr.is-solid .hdr__logo, .hdr--ink .hdr__logo { color: var(--ink); }
.hdr__spacer { flex: 1; }
.hdr__contacts { display: flex; gap: var(--sp-2); align-items: center; }
.hdr__contacts .pill--compact { display: none; }
@media (max-width: 760px) { .hdr__contacts .pill--text { display: none; } .hdr__contacts .pill--compact { display: inline-flex; } .hdr__logo svg { block-size: 32px; } .hdr__contacts .pill--accent { padding-inline: var(--sp-4); } }
@media (max-width: 380px) { .hdr__logo svg { block-size: 26px; } }
/* language menu, top right */
.lang { position: relative; }
.lang summary { list-style: none; cursor: pointer; }
.lang summary::-webkit-details-marker { display: none; }
.lang summary span { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em; }
.lang__list { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); z-index: 210; margin: 0; padding: 6px; list-style: none; min-inline-size: 190px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r2); box-shadow: var(--shade); display: grid; }
.lang__list a { display: block; padding: 9px 12px; border-radius: var(--r1); text-decoration: none; font-size: 15px; }
.lang__list a:hover { background: var(--surface-2); }
.lang__list a[aria-current] { background: var(--accent-soft); font-weight: 600; }
@media (max-width: 760px) { .lang summary { padding-inline: var(--sp-3); } }

/* per-language type: Arabic and Hebrew self-hosted Noto faces, Chinese the system CJK families */
html[lang="ar"] { --font-ui: 'Noto Sans Arabic', 'Segoe UI', Tahoma, Arial, sans-serif; --font-display: 'Noto Sans Arabic', 'Segoe UI', Tahoma, Arial, sans-serif; }
html[lang="he"] { --font-ui: 'Noto Sans Hebrew', 'Segoe UI', Arial, sans-serif; --font-display: 'Noto Sans Hebrew', 'Segoe UI', Arial, sans-serif; }
html[lang="zh"] { --font-ui: 'Inter', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans CJK SC', 'Noto Sans SC', sans-serif; --font-display: 'Inter Tight', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif; }
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3, html[lang="he"] h1, html[lang="he"] h2, html[lang="he"] h3, html[lang="zh"] h1, html[lang="zh"] h2, html[lang="zh"] h3 { letter-spacing: 0; }
html[lang="ar"] h1, html[lang="he"] h1 { line-height: 1.15; }
html[lang="ar"] body, html[lang="he"] body, html[lang="zh"] body { line-height: 1.65; }
[dir="rtl"] .opt__check { left: auto; right: 10px; }
[dir="rtl"] .prop__badge { left: auto; right: 10px; }
[dir="rtl"] .select { background-position: 20px 50%, 15px 50%; padding-inline-end: var(--sp-4); padding-inline-start: 40px; }
[dir="rtl"] .ticker__track { animation-direction: reverse; }
[dir="rtl"] .lang__list a, [dir="rtl"] .faq summary { text-align: start; }

/* ── hero — the site's inset panel: a photograph under four blending layers (kit.css §5): a desk fill in
   Multiply tints the picture into the desk, a black gradient in Multiply carries legibility, grain in Soft Light,
   the metal sheen in Screen drifting for 11 s. `isolation: isolate` keeps the blending inside the panel. ── */
.hero { position: relative; isolation: isolate; overflow: clip; inline-size: min(var(--wrap), 100% - 2 * var(--edge)); margin: var(--sp-3) auto 0; border-radius: var(--r4); min-block-size: min(78vh, 720px); display: grid; align-items: end; color: var(--photo-ink); background: var(--accent); }
.hero__bg { position: absolute; inset: 0; z-index: -5; overflow: hidden; }
.hero__bg img { inline-size: 100%; block-size: 100%; object-fit: cover; object-position: 60% 50%; animation: vtSettle 1.6s cubic-bezier(0.2, 0.7, 0.2, 1) both; }
.hero__tint { position: absolute; inset: 0; z-index: -4; background: var(--accent); mix-blend-mode: multiply; opacity: 0.58; }
.hero__scrim { position: absolute; inset: 0; z-index: -3; mix-blend-mode: multiply; opacity: 0.78; background: linear-gradient(180deg, #000 0%, transparent 38%, transparent 56%, #000 100%); }
.hero__grain { position: absolute; inset: 0; z-index: -2; pointer-events: none; opacity: 0.05; mix-blend-mode: soft-light; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); background-size: 180px 180px; }
.hero__sheen { position: absolute; inset: -20%; z-index: -1; pointer-events: none; opacity: 0.32; mix-blend-mode: screen; background: linear-gradient(115deg, transparent 40%, var(--gold) 50%, transparent 60%); background-size: 240% 240%; animation: vtSheen 11s ease-in-out infinite alternate; }
@keyframes vtSheen { 0% { background-position: 0% 0%; } 100% { background-position: 100% 100%; } }
@keyframes vtSettle { from { transform: scale(1.05); opacity: 0.4; } to { transform: scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .hero__sheen { animation: none; } .hero__bg img { animation: none; } }
.hero__inner { padding: clamp(56px, 12vh, 140px) clamp(20px, 4vw, 56px) clamp(56px, 8vh, 88px); display: grid; gap: var(--sp-6); max-width: 760px; }
.hero h1 { color: #fff; }
.hero h1 em { font-style: normal; color: var(--gold); }
.hero__sub { font-size: clamp(16px, 1.7vw, 19px); color: var(--photo-ink-2); max-width: 58ch; }
.hero__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-2); font-size: clamp(15px, 1.5vw, 18px); color: var(--photo-ink-2); }
.hero__list li { display: flex; align-items: flex-start; gap: var(--sp-3); }
.hero__list svg { inline-size: 16px; block-size: 16px; margin-top: 5px; color: var(--gold); flex: none; }
.hero__cta { display: flex; gap: var(--sp-3); flex-wrap: wrap; align-items: center; }
.feats { position: relative; z-index: 2; margin-top: calc(-1 * var(--sp-8)); }
.feat { display: flex; gap: var(--sp-4); padding: var(--sp-5); align-items: flex-start; }
.feat .h3 { margin-bottom: 4px; }
.feat p { color: var(--ink-2); font-size: 15px; }
@media (max-width: 720px) { .hero { min-block-size: 0; border-radius: var(--r3); } .feats { margin-top: var(--sp-4); } }

/* ── quiz ───────────────────────────────────────────────────────────────── */
.quiz { overflow: hidden; }
.quiz__bar { block-size: 4px; background: var(--line); }
.quiz__bar i { display: block; block-size: 100%; inline-size: 0; background: var(--accent); transition: inline-size 300ms var(--ease); }
.quiz__body { padding: clamp(20px, 3.5vw, 40px); display: grid; gap: var(--sp-6); }
.quiz__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--sp-4); }
.quiz__foot { display: flex; justify-content: flex-end; align-items: center; gap: var(--sp-3); }
.opts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); }
.opts--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.opts--list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 720px) { .opts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .opts--list { grid-template-columns: 1fr; } }
.opt { position: relative; cursor: pointer; display: grid; gap: var(--sp-2); }
.opt input { position: absolute; opacity: 0; inset: 0; }
.opt .photo { aspect-ratio: 4 / 3; border: 2px solid transparent; transition: border-color var(--dur), box-shadow var(--dur); }
.opt span { font-size: 15px; font-weight: 500; }
.opt:hover .photo { border-color: var(--line-int); }
.opt input:checked ~ .photo { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); }
.opt input:focus-visible ~ .photo { outline: 2px solid var(--focus); outline-offset: 2px; }
.opt__check { position: absolute; top: 10px; inset-inline-start: 10px; inline-size: 26px; block-size: 26px; border-radius: 50%; background: var(--accent); color: var(--on-accent); display: grid; place-items: center; opacity: 0; scale: 0.6; transition: opacity var(--dur), scale var(--dur); }
.opt__check svg { inline-size: 14px; block-size: 14px; }
.opt input:checked ~ .photo .opt__check { opacity: 1; scale: 1; }
.opt--row { grid-template-columns: auto 1fr; align-items: center; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--line-int); border-radius: var(--r1); background: var(--surface); }
.opt--row .radio { inline-size: 20px; block-size: 20px; border-radius: 50%; border: 2px solid var(--line-int); display: grid; place-items: center; transition: border-color var(--dur); }
.opt--row .radio::after { content: ""; inline-size: 10px; block-size: 10px; border-radius: 50%; background: var(--accent); scale: 0; transition: scale var(--dur); }
.opt--row input:checked ~ .radio { border-color: var(--accent); }
.opt--row input:checked ~ .radio::after { scale: 1; }
.opt--row input:checked ~ span { color: var(--ink); }
.opt--row:has(input:checked) { border-color: var(--accent); }
.is-error > .opts .opt .photo, .is-error .opt--row { border-color: var(--danger); }
.field-hint { font-size: var(--fs-caption); color: var(--danger); display: none; }
.is-error .field-hint { display: block; }

/* ── forms ──────────────────────────────────────────────────────────────── */
.form { display: grid; gap: var(--sp-4); }
.form--row { grid-template-columns: 1fr 1fr 1fr auto; align-items: end; }
@media (max-width: 960px) { .form--row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .form--row { grid-template-columns: 1fr; } }
.f { display: grid; gap: 6px; }
.f > label, .f__label { font-size: var(--fs-ui); color: var(--ink-2); }
.input, .select { inline-size: 100%; min-block-size: 52px; padding: 0 var(--sp-4); border: 1px solid var(--line-int); border-radius: var(--r1); background: var(--surface); color: var(--ink); transition: border-color 180ms var(--ease), box-shadow 180ms var(--ease); }
.input::placeholder { color: var(--ink-3); }
.input:focus, .select:focus { border-color: var(--focus); box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 18%, transparent); outline: none; }
.select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-inline-end: 40px; }
.tel { display: grid; grid-template-columns: minmax(96px, 128px) 1fr; gap: var(--sp-2); }
.tel .select { padding-inline-start: var(--sp-3); }
.radios { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.radios label { display: inline-flex; align-items: center; gap: var(--sp-2); padding: 8px var(--sp-4); border: 1px solid var(--line-int); border-radius: var(--pill); background: var(--surface); cursor: pointer; font-size: var(--fs-ui); }
.radios input { position: absolute; opacity: 0; }
.radios label:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); color: var(--ink); }
.radios label:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }
.consent { display: flex; gap: var(--sp-3); align-items: flex-start; font-size: var(--fs-caption); color: var(--ink-2); cursor: pointer; }
.consent input { inline-size: 18px; block-size: 18px; margin: 1px 0 0; accent-color: var(--accent); flex: none; }
.consent a { color: var(--ink); }
.msg { padding: var(--sp-3) var(--sp-4); border-radius: var(--r1); font-size: var(--fs-ui); }
.msg[data-kind="error"] { background: var(--danger-soft); color: var(--danger); }
.msg[data-kind="ok"] { background: var(--ok-soft); color: var(--ok); }
/* the honeypot: hidden by clipping, never by an off-screen offset (a left:-9999px extends an RTL document by 10 000 px) */
.hp { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); opacity: 0; pointer-events: none; }
[data-busy]::after { content: "…"; }
.form__foot { display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap; justify-content: space-between; }

/* ── property cards ─────────────────────────────────────────────────────── */
.slider { position: relative; }
.rail { display: grid; grid-auto-flow: column; grid-auto-columns: min(340px, 82vw); gap: var(--sp-4); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding: 4px 4px var(--sp-4); margin: -4px -4px 0; scrollbar-width: none; }
.rail::-webkit-scrollbar { display: none; }
.rail > * { scroll-snap-align: start; }
.rail--wide { grid-auto-columns: min(560px, 88vw); }
.slider__nav { display: flex; gap: var(--sp-2); justify-content: flex-end; margin-bottom: var(--sp-4); }
.dots { display: flex; gap: 6px; justify-content: center; margin-top: var(--sp-2); }
.dots { gap: 0; }
.dots button { inline-size: 24px; block-size: 24px; border-radius: 50%; border: 0; padding: 0; background: transparent; cursor: pointer; display: grid; place-items: center; }
.dots button::after { content: ""; inline-size: 8px; block-size: 8px; border-radius: 50%; background: var(--line-int); }
.dots button[aria-current="true"]::after { background: var(--accent); }
.prop { display: grid; grid-template-rows: auto 1fr; overflow: hidden; }
.prop__media { position: relative; aspect-ratio: 4 / 3; }
.prop__media .rail { grid-auto-columns: 100%; gap: 0; padding: 0; margin: 0; block-size: 100%; }
.prop__media .rail .photo { border-radius: 0; block-size: 100%; }
.prop__media .slider__nav { position: absolute; inset: 0; margin: 0; align-items: center; justify-content: space-between; padding-inline: var(--sp-2); pointer-events: none; }
.prop__media .slider__nav .pill { pointer-events: auto; }
.prop__media .dots { position: absolute; left: 0; right: 0; bottom: 10px; margin: 0; }
.prop__media .dots button::after { background: rgba(255, 255, 255, 0.55); }
.prop__media .dots button[aria-current="true"]::after { background: #fff; }
.prop__badge { position: absolute; top: 10px; inset-inline-start: 10px; z-index: 2; }
.prop__body { padding: var(--sp-4); display: grid; gap: var(--sp-3); align-content: start; }
.prop__title { display: flex; justify-content: space-between; gap: var(--sp-3); align-items: flex-start; }
.prop__title h3 { font-size: 18px; }
.prop__specs { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); }
.spec { display: flex; align-items: center; gap: var(--sp-2); padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r1); background: var(--surface-2); min-width: 0; }
.spec--wide { grid-column: 1 / -1; }
.spec svg { inline-size: 18px; block-size: 18px; color: var(--lux); flex: none; }
.spec b { display: block; font-size: 12px; font-weight: 500; color: var(--ink-3); line-height: 1.2; }
.spec span { font-size: 13.5px; font-weight: 500; line-height: 1.25; }
.prop__foot { display: grid; grid-template-columns: 1fr auto; gap: var(--sp-2); align-items: center; margin-top: auto; }
.prop__price { font-family: var(--font-display); font-weight: 600; font-size: 18px; letter-spacing: -0.01em; }
.prop__price small { font-family: var(--font-ui); font-weight: 400; font-size: 13px; color: var(--ink-3); display: block; }
.prop--wide { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); grid-template-rows: none; }
.prop--wide .prop__media { aspect-ratio: auto; min-block-size: 100%; }
@media (max-width: 640px) { .prop--wide { grid-template-columns: 1fr; } .prop--wide .prop__media { aspect-ratio: 4 / 3; } }

/* ticker */
.ticker { overflow: hidden; background: var(--band); color: #f3efe0; padding-block: var(--sp-3); margin-block: var(--sp-6); }
.ticker__track { display: flex; gap: var(--sp-8); width: max-content; animation: ticker 40s linear infinite; }
.ticker__track span { display: inline-flex; align-items: center; gap: var(--sp-3); white-space: nowrap; font-size: 15px; }
.ticker__track svg { inline-size: 18px; block-size: 18px; color: var(--gold); }
@keyframes ticker { to { translate: -50% 0; } }
@media (prefers-reduced-motion: reduce) { .ticker__track { animation: none; } }

/* ── why us / stats ─────────────────────────────────────────────────────── */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-8); align-items: center; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; gap: var(--sp-6); } }
.split .photo { aspect-ratio: 4 / 3; border-radius: var(--r4); }
.bullets { display: grid; gap: var(--sp-4); }
.bullets li { display: flex; gap: var(--sp-3); align-items: flex-start; list-style: none; color: var(--ink-2); }
.bullets { padding: 0; margin: 0; }
.bullets svg { inline-size: 16px; block-size: 16px; margin-top: 5px; color: var(--lux); flex: none; }
.bullets b { color: var(--ink); font-weight: 600; }
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); }
@media (max-width: 900px) { .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.stat { padding: var(--sp-5); display: grid; gap: var(--sp-2); }
.stat__n { font-family: var(--font-display); font-size: clamp(34px, 3.6vw, 46px); font-weight: 700; letter-spacing: -0.035em; line-height: 1; }
.stat__n small { font-family: var(--font-ui); font-weight: 500; font-size: 14px; letter-spacing: 0; color: var(--ink-3); margin-inline-start: 6px; }
.stat p { color: var(--ink-2); font-size: 15px; }

/* differs */
.vs { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
@media (max-width: 900px) { .vs { grid-template-columns: 1fr; } }
.vs__col { overflow: hidden; display: grid; grid-template-rows: auto 1fr; }
.vs__col .photo { aspect-ratio: 16 / 10; border-radius: 0; }
.vs__col--them .photo img { filter: grayscale(1) contrast(0.95); }
.vs__cap { position: absolute; inset: auto 0 0; padding: var(--sp-4) var(--sp-5); color: #fff; font-family: var(--font-display); font-size: 22px; font-weight: 600; letter-spacing: -0.02em; z-index: 1; }
.vs__list { padding: var(--sp-5); display: grid; gap: var(--sp-4); margin: 0; list-style: none; }
.vs__list li { display: flex; gap: var(--sp-3); font-size: 15px; color: var(--ink-2); }
.vs__list b { color: var(--ink); }
.vs__list svg { inline-size: 18px; block-size: 18px; flex: none; margin-top: 2px; }
.vs__col--them .vs__list svg { color: var(--ink-3); }
.vs__col--us .vs__list svg { color: var(--lux); }

/* steps */
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); counter-reset: step; }
@media (max-width: 900px) { .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .steps { grid-template-columns: 1fr; } }
.step { display: grid; gap: var(--sp-3); padding: var(--sp-5); }
.step__pic { aspect-ratio: 16 / 9; border-radius: var(--r2); overflow: hidden; background: var(--canvas-deep); }
.step__pic img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.step__n { font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: 0.14em; color: var(--lux); }
.step p { color: var(--ink-2); font-size: 15px; }

/* inline form band */
.band-form { padding: clamp(24px, 4vw, 48px); display: grid; gap: var(--sp-6); text-align: center; }
.band-form .form { text-align: start; }
.band-form h2 { font-size: clamp(24px, 3vw, 34px); }
.orn { color: var(--gold); inline-size: 28px; block-size: 28px; margin-inline: auto; }

/* why phuket */
.why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
@media (max-width: 960px) { .why { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .why { grid-template-columns: 1fr; } }
.why__item { display: grid; grid-template-columns: 1fr 120px; gap: var(--sp-4); padding: var(--sp-5); align-items: start; }
.why__item .photo { aspect-ratio: 1; border-radius: var(--r1); }
.why__item p { color: var(--ink-2); font-size: 15px; margin-top: 6px; }
@media (max-width: 400px) { .why__item { grid-template-columns: 1fr 96px; } }

/* consultation on a photo */
.consult { position: relative; isolation: isolate; color: var(--ink); }
.consult__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.consult__bg img { inline-size: 100%; block-size: 100%; object-fit: cover; }
.consult__bg::after { content: ""; position: absolute; inset: 0; background: rgba(6, 18, 15, 0.55); }
.consult__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); gap: var(--sp-8); align-items: center; }
@media (max-width: 900px) { .consult__grid { grid-template-columns: 1fr; } }
.consult__text { color: #fff; display: grid; gap: var(--sp-4); }
.consult__text h2 { color: #fff; }
.consult__text p { color: var(--photo-ink-2); font-size: 17px; }
.consult .panel { padding: clamp(20px, 3vw, 32px); }

/* office */
.office { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: var(--sp-6); align-items: stretch; }
@media (max-width: 900px) { .office { grid-template-columns: 1fr; } }
.office__text { padding: var(--sp-6); display: grid; gap: var(--sp-4); align-content: center; }
.office__addr { display: flex; gap: var(--sp-3); align-items: flex-start; color: var(--ink-2); }
.office__addr svg { inline-size: 18px; block-size: 18px; color: var(--lux); flex: none; margin-top: 3px; }
.map { position: relative; min-block-size: 320px; border-radius: var(--r4); overflow: hidden; border: 1px solid var(--line); background: var(--canvas-deep); cursor: pointer; display: grid; place-items: center; }
.map img { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; }
.map iframe { position: absolute; inset: 0; inline-size: 100%; block-size: 100%; border: 0; }
.map .pill { position: relative; z-index: 1; }
.map.is-live .pill { display: none; }

/* faq */
.faq { display: grid; gap: var(--sp-2); max-width: 820px; margin-inline: auto; }
.faq details { border: 1px solid var(--line); border-radius: var(--r2); background: var(--surface); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: var(--sp-4); align-items: center; padding: var(--sp-4) var(--sp-5); font-weight: 600; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary svg { inline-size: 18px; block-size: 18px; color: var(--ink-3); transition: rotate var(--dur); flex: none; }
.faq details[open] summary svg { rotate: 45deg; }
.faq__body { padding: 0 var(--sp-5) var(--sp-5); color: var(--ink-2); display: grid; gap: var(--sp-2); }

/* instagram */
.insta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 420px); gap: var(--sp-8); align-items: center; padding: clamp(24px, 4vw, 48px); }
@media (max-width: 900px) { .insta { grid-template-columns: 1fr; } }
.insta__text { display: grid; gap: var(--sp-4); }
.insta__pic img { inline-size: 100%; block-size: auto; }

/* footer */
.ftr { padding-block: var(--sp-8) calc(var(--sp-8) + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--line); color: var(--ink-2); font-size: var(--fs-ui); }
.ftr__row { display: flex; flex-wrap: wrap; gap: var(--sp-4); align-items: center; justify-content: space-between; }
.ftr__nav { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); }
.ftr__nav a { text-decoration: none; }
.ftr__nav a:hover { color: var(--ink); }
.ftr__legal { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-5); margin-top: var(--sp-5); color: var(--ink-3); font-size: var(--fs-caption); }
.ftr__legal a { color: var(--ink-3); }

/* popups */
.pop { position: fixed; inset: 0; z-index: 300; background: var(--scrim); display: grid; place-items: center; padding: var(--sp-4); overflow: auto; }
.pop__panel { inline-size: min(560px, 100%); padding: clamp(20px, 3vw, 32px); display: grid; gap: var(--sp-4); position: relative; animation: pop-in 220ms var(--ease); margin: auto; }
@keyframes pop-in { from { opacity: 0; translate: 0 12px; } to { opacity: 1; translate: 0; } }
.pop__close { position: absolute; top: var(--sp-3); right: var(--sp-3); }
.pop__panel h2 { font-size: clamp(22px, 2.6vw, 28px); padding-inline-end: 48px; }

/* theme button */
.theme-btn { position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); bottom: max(16px, env(safe-area-inset-bottom, 0px)); z-index: 150; inline-size: 44px; block-size: 44px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line-int); border-radius: var(--pill); background: var(--surface); color: var(--ink); box-shadow: var(--shade); cursor: pointer; }
.theme-btn svg { inline-size: 20px; block-size: 20px; display: none; }
.theme-btn[data-mode="system"] svg[data-g="system"], .theme-btn[data-mode="light"] svg[data-g="light"], .theme-btn[data-mode="dark"] svg[data-g="dark"] { display: block; }

/* thank-you / privacy */
.page-thanks { min-block-size: 100vh; display: grid; place-items: center; padding: var(--sp-8) var(--edge); }
.thanks { inline-size: min(760px, 100%); padding: clamp(24px, 4vw, 48px); display: grid; gap: var(--sp-5); text-align: center; }
.thanks .bullets { text-align: start; }
.prose { max-width: 76ch; margin-inline: auto; padding-block: var(--sp-8); display: grid; gap: var(--sp-4); }
.prose h2 { font-size: 22px; margin-top: var(--sp-4); }
.prose p, .prose li { color: var(--ink-2); }

/* rtl */
[dir="rtl"] .hero__bg img { object-position: 40% 50%; }
[dir="rtl"] .hero__bg::after { background: linear-gradient(270deg, rgba(6, 18, 15, 0.78) 0%, rgba(6, 18, 15, 0.45) 45%, rgba(6, 18, 15, 0.15) 100%), linear-gradient(to top, rgba(6, 18, 15, 0.85) 0%, rgba(6, 18, 15, 0) 45%); }
[dir="rtl"] .pop__close { right: auto; left: var(--sp-3); }
[dir="rtl"] .theme-btn { right: auto; left: max(16px, env(safe-area-inset-left, 0px)); }

/* ── languages: scripts and direction (stage 4) ─────────────────────────── */
:root[lang="ar"] { --font-ui: 'Noto Sans Arabic', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; --font-display: 'Noto Sans Arabic', 'Inter Tight', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; }
:root[lang="he"] { --font-ui: 'Noto Sans Hebrew', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; --font-display: 'Noto Sans Hebrew', 'Inter Tight', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif; }
/* Chinese: no webfont (a CJK subset would eat the first-view budget); Inter for Latin and digits, the platform's CJK face for the rest */
:root[lang="zh"] { --font-ui: 'Inter', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans CJK SC', 'Noto Sans SC', sans-serif; --font-display: 'Inter Tight', 'Inter', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans CJK SC', 'Noto Sans SC', sans-serif; }
/* connected and ideographic scripts take no tracking; Arabic and Hebrew want more leading */
:root[lang="ar"] h1, :root[lang="ar"] h2, :root[lang="ar"] h3, :root[lang="ar"] .display, :root[lang="ar"] .h1, :root[lang="ar"] .h2, :root[lang="ar"] .h3, :root[lang="ar"] .stat__n, :root[lang="ar"] .vs__cap, :root[lang="ar"] .prop__price, :root[lang="ar"] .label, :root[lang="ar"] .step__n,
:root[lang="he"] h1, :root[lang="he"] h2, :root[lang="he"] h3, :root[lang="he"] .display, :root[lang="he"] .h1, :root[lang="he"] .h2, :root[lang="he"] .h3, :root[lang="he"] .stat__n, :root[lang="he"] .vs__cap, :root[lang="he"] .prop__price, :root[lang="he"] .label, :root[lang="he"] .step__n,
:root[lang="zh"] h1, :root[lang="zh"] h2, :root[lang="zh"] h3, :root[lang="zh"] .display, :root[lang="zh"] .h1, :root[lang="zh"] .h2, :root[lang="zh"] .h3, :root[lang="zh"] .vs__cap { letter-spacing: 0; }
:root[lang="ar"] h1, :root[lang="ar"] h2, :root[lang="he"] h1, :root[lang="he"] h2 { line-height: 1.22; }
:root[lang="ar"] h3, :root[lang="he"] h3 { line-height: 1.4; }
:root[lang="ar"] body, :root[lang="he"] body { line-height: 1.7; }
:root[lang="zh"] body { line-height: 1.75; }
/* RTL: the slider arrows keep their visual sides (app.js swaps their meaning); directional icons mirror */
[dir="rtl"] .slider__nav { direction: ltr; }
[dir="rtl"] .ico--dir { transform: scaleX(-1); }
/* the language row of the footer */
.ftr__langs { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-4); margin-top: var(--sp-5); font-size: var(--fs-ui); }
.ftr__langs a { color: var(--ink-2); text-decoration: none; padding-block: 4px; }
.ftr__langs a:hover { color: var(--ink); }
.ftr__langs a[aria-current="page"] { color: var(--ink); font-weight: 600; text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 4px; }

/* ── the project modal (PLAN decision 7: photographs and facts from the catalogue, the request button, no link out) ── */
.pop__panel--wide { inline-size: min(940px, 100%); }
.pop__panel--wide .pop__close { z-index: 1; background: rgba(0, 0, 0, 0.45); border-color: rgba(255, 255, 255, 0.3); color: #fff; }
.pop__project { display: grid; gap: var(--sp-4); }
.pop__gallery { aspect-ratio: 16 / 10; border-radius: var(--r2); overflow: hidden; background: var(--canvas-deep); }
.pop__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); }
.pop__head h2 { padding-inline-end: 0; flex: 1 1 100%; }
.prop__media .photo[data-open] { cursor: zoom-in; }
@media (min-width: 720px) { .pop__project .prop__specs { grid-template-columns: 1fr 1fr 2fr; } .pop__project .spec--wide { grid-column: auto; } }

/* ── the Instagram interstitial: the quiet way on, under the form ── */
.pop__skip { justify-self: center; display: inline-flex; align-items: center; gap: var(--sp-2); color: var(--ink-3); font-size: var(--fs-caption); text-decoration: underline; text-underline-offset: 3px; }
.pop__skip:hover { color: var(--ink); }
.pop__skip svg { inline-size: 16px; block-size: 16px; }

/* Inter, Inter Tight, IBM Plex Mono — SIL OFL 1.1, self-hosted (GUIDELINES §3). Fetched from Google Fonts, subsets latin/latin-ext/cyrillic/cyrillic-ext. */
/* cyrillic-ext */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-400-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-400-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-400-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-500-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-500-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/ibm-plex-mono-500-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-400-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-400-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-400-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-500-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-500-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-500-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-600-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-600-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-600-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-tight-500-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-tight-500-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-tight-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-tight-500-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-tight-600-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-tight-600-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-tight-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-tight-600-latin.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;}
/* cyrillic-ext */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-tight-700-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;}
/* cyrillic */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-tight-700-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
/* latin-ext */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-tight-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
/* latin */
@font-face{font-family: 'Inter Tight';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-tight-700-latin.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;}

/* Noto Sans Arabic, Noto Sans Hebrew — SIL OFL 1.1, self-hosted variable fonts (wght 100–900), fetched from Google Fonts on
   20 Sept 2026. Arabic is subset to the Arabic block (tools/i18n-fonts.sh; 162 -> 66 KB); Latin stays Inter. Loaded by
   unicode-range only: an EN page never requests them. */
/* arabic */
@font-face{font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/noto-sans-arabic-var-arabic.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+200C-200F, U+2010-2011;}
/* hebrew */
@font-face{font-family: 'Noto Sans Hebrew';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(/fonts/noto-sans-hebrew-var-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;}

.m-hi{stop-color:var(--metal-hi)}.m-mid{stop-color:var(--gold)}.m-deep{stop-color:var(--metal-deep)}.m-ink{stop-color:var(--lux)}
.brand{fill:url(#metal-grad)}.hdr.is-solid .brand,.ftr .brand{fill:url(#metal-grad-ink)}