/* Lomas de Serena — styl wg docs/markets/LOMAS-KSIEGA-STYLU-v1.md (paleta AA, Cormorant Garamond + Plus Jakarta Sans lokalnie,
   siatka 12 kol. / 1440 px, marginesy 32/16 px, sekcje 120/64 px). Rozwiązania z Alcory (fokus SVG L02, karty na telefonie L07,
   formularz L15, akordeony z +/− L16, kolumny minmax(0,1fr) i min-width:0 w polach — 320 px bez przewijania także przed fontem). */
:root {
  --bg: #f7f6f2; --surface: #fff; --ink: #1c1c1a; --mut: #666560; --line: #e2dfd7;
  --accent-line: #b39264; --accent: #8a6a3e; --ok: #2f4f38; --res: #8c5a23; --sold: #666560;
  --d-bg: #0e0e0d; --d-surface: #181816; --d-ink: #f4f4f0; --d-mut: #a3a29b; --d-line: #2a2a27; --d-accent: #c9a878;
  --serif: 'Cormorant Garamond', 'Cormorant', Garamond, 'Times New Roman', serif;
  --sans: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --gut: 32px; --sec: 120px; --r: 4px; --shadow: 0 4px 24px rgba(0, 0, 0, .04);
  --hdr: 72px;
}
@media (max-width: 760px) { :root { --gut: 16px; --sec: 64px; --hdr: 60px; } }

*, *::before, *::after { box-sizing: border-box; font-variant-numeric: lining-nums; font-feature-settings: 'lnum' 1; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--hdr) + 8px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 16px/1.6 var(--sans); overflow-x: hidden; }
[hidden] { display: none !important; }
img, svg, picture { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; margin: 0; overflow-wrap: break-word; hyphens: manual; }
h1 { font-size: clamp(2.4rem, 5.4vw, 4.6rem); line-height: 1.06; letter-spacing: -.02em; font-weight: 400; }
h2 { font-size: clamp(2rem, 3.4vw, 3rem); line-height: 1.12; letter-spacing: -.01em; }
h3 { font-size: clamp(1.35rem, 1.8vw, 1.6rem); line-height: 1.25; }
p { margin: 0 0 1em; }
.num, td, .price { font-variant-numeric: tabular-nums lining-nums; }
.wrap { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 var(--gut); }
.sec { padding: var(--sec) 0; }
.small { font-size: 13px; line-height: 1.5; }
.mut { color: var(--mut); }
.lead { font-size: 18px; line-height: 1.65; }
@media (max-width: 760px) { body { font-size: 15px; line-height: 1.55; } .lead { font-size: 16px; } }
.eyebrow { font: 600 11px/1.4 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--accent); margin: 0 0 18px; display: flex; align-items: center; gap: 12px; }
.eyebrow::before { content: ''; width: 28px; height: 1px; background: currentColor; flex: none; }
.eyebrow--light { color: #e3cba4; }
.sr, .hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 8px; top: -60px; z-index: 100; background: var(--ink); color: #fff; padding: 10px 16px; }
.skip:focus { top: 8px; }

/* fokus: tylko klawiatura (L02: bez obrysu po kliknięciu w SVG) */
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
svg *:focus { outline: none; }
.plot:focus-visible .plot__shape { stroke: var(--ink); stroke-width: 5; }

/* przyciski: promień 4, główny wypełniony, drugorzędny obrysowany, 16/32 */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 14px 30px; border-radius: var(--r); border: 1px solid var(--ink); background: var(--ink); color: #fff; font: 600 13px/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .2s, color .2s, border-color .2s; text-align: center; }
.btn:hover { background: #33332f; }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: #fff; }
.btn--light { background: var(--d-ink); color: var(--ink); border-color: var(--d-ink); }
.btn--light:hover { background: #fff; }
.btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .7); }
.btn--ghost-light:hover { background: rgba(255, 255, 255, .12); }
.btn--s { min-height: 44px; padding: 10px 18px; font-size: 12px; }
.btn[disabled] { opacity: .55; cursor: not-allowed; }
.lnk { background: none; border: 0; padding: 0; color: var(--accent); font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.tag { display: inline-block; font: 600 10.5px/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--accent); border: 1px solid var(--accent-line); border-radius: 2px; padding: 3px 7px; vertical-align: middle; white-space: nowrap; }
.dark .tag { color: var(--d-accent); border-color: #5a4a33; }
.pill { display: inline-flex; align-items: center; gap: 7px; font: 600 12px/1.3 var(--sans); letter-spacing: .04em; }
.pill::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.pill.available { color: var(--ok); } .pill.reserved { color: var(--res); } .pill.sold { color: var(--sold); }
.pill small { font-weight: 400; color: var(--mut); letter-spacing: 0; }

/* pasek demo (poziom 1) + nagłówek */
.demo-strip { margin: 0; background: var(--d-bg); color: var(--d-mut); font-size: 12px; line-height: 1.45; text-align: center; padding: 7px var(--gut); border-bottom: 1px solid var(--d-line); }
.hdr { position: sticky; top: 0; z-index: 50; height: var(--hdr); background: rgba(14, 14, 13, .0); color: #fff; transition: background .3s, color .3s, box-shadow .3s; margin-bottom: calc(-1 * var(--hdr)); }
.hdr.is-solid, .hdr.is-open { background: rgba(247, 246, 242, .97); color: var(--ink); box-shadow: 0 1px 0 var(--line); }
.hdr__in { max-width: 1440px; margin: 0 auto; height: 100%; padding: 0 var(--gut); display: flex; align-items: center; gap: 24px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.brand svg { width: 34px; height: 34px; flex: none; }
.brand__t { font: 500 20px/1 var(--serif); letter-spacing: .14em; text-transform: uppercase; display: flex; flex-direction: column; gap: 5px; white-space: nowrap; }
.brand__t small { font: 500 9.5px/1 var(--sans); letter-spacing: .24em; opacity: .75; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 28px; }
.nav a { text-decoration: none; font: 500 13px/1 var(--sans); letter-spacing: .06em; padding: 10px 0; position: relative; }
.nav a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 4px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s; }
.nav a:hover::after { transform: scaleX(1); }
.nav__cta { border: 1px solid currentColor; padding: 11px 16px !important; border-radius: var(--r); }
.nav__cta::after { display: none; }
.lang { display: flex; gap: 2px; }
.lang button { background: none; border: 0; color: inherit; font: 600 12px/1 var(--sans); letter-spacing: .08em; padding: 12px 8px; min-width: 40px; min-height: 44px; cursor: pointer; opacity: .6; }
.lang button[aria-pressed="true"] { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }
.menu-btn { display: none; background: none; border: 0; color: inherit; width: 44px; height: 44px; cursor: pointer; padding: 0; }
.menu-btn__i, .menu-btn__i::before, .menu-btn__i::after { display: block; width: 22px; height: 1.5px; background: currentColor; margin: 0 auto; position: relative; transition: transform .2s; }
.menu-btn__i::before, .menu-btn__i::after { content: ''; position: absolute; left: 0; }
.menu-btn__i::before { top: -7px; } .menu-btn__i::after { top: 7px; }
.hdr.is-open .menu-btn__i { background: transparent; }
.hdr.is-open .menu-btn__i::before { transform: translateY(7px) rotate(45deg); }
.hdr.is-open .menu-btn__i::after { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 1080px) {
  .menu-btn { display: block; }
  .lang { margin-left: auto; }
  .nav { display: none; position: fixed; left: 0; right: 0; top: var(--hdr); bottom: 0; background: var(--bg); color: var(--ink); flex-direction: column; align-items: stretch; gap: 0; padding: 16px var(--gut) 32px; overflow-y: auto; margin: 0; }
  .hdr.is-open .nav { display: flex; }
  .nav a { font: 400 28px/1.2 var(--serif); padding: 16px 0; border-bottom: 1px solid var(--line); }
  .nav a::after { display: none; }
  .nav__cta { border: 0 !important; padding: 16px 0 !important; color: var(--accent); }
}
@media (max-width: 420px) { .brand__t { font-size: 16px; letter-spacing: .1em; } .brand__t small { font-size: 8.5px; letter-spacing: .18em; } .brand svg { width: 28px; height: 28px; } .hdr__in { gap: 8px; } .lang button { min-width: 36px; padding: 12px 4px; } }
@media (max-width: 340px) { .brand__t small { display: none; } }

/* hero */
.hero { position: relative; min-height: max(640px, 100svh); display: flex; align-items: flex-end; color: #fff; background: var(--d-bg); overflow: hidden; }
.hero__img, .hero__img img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__img img { object-fit: cover; object-position: 60% 50%; }
.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 14, 13, .55) 0%, rgba(14, 14, 13, 0) 22%, rgba(14, 14, 13, 0) 42%, rgba(14, 14, 13, .78) 100%), linear-gradient(90deg, rgba(14, 14, 13, .5) 0%, rgba(14, 14, 13, .18) 45%, rgba(14, 14, 13, 0) 65%); pointer-events: none; }
.hero__in { position: relative; z-index: 1; padding-top: calc(var(--hdr) + 48px); padding-bottom: 48px; }
.hero h1 { max-width: 15ch; text-shadow: 0 1px 30px rgba(0, 0, 0, .25); }
.hero__p { max-width: 560px; font-size: 18px; line-height: 1.6; margin: 24px 0 32px; color: rgba(255, 255, 255, .9); }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 56px; }
.hero__facts { display: grid; grid-template-columns: repeat(3, minmax(0, max-content)); gap: 0; margin: 0; border-top: 1px solid rgba(255, 255, 255, .28); padding-top: 20px; }
.hero__facts div { padding-right: 48px; margin-right: 48px; border-right: 1px solid rgba(255, 255, 255, .28); }
.hero__facts div:last-child { border: 0; margin: 0; padding: 0; }
.hero__facts dt { font: 400 34px/1.1 var(--serif); }
.hero__facts dd { margin: 4px 0 0; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
@media (max-width: 760px) {
  .hero { min-height: max(540px, 82svh); }
  .hero h1 { font-size: clamp(2rem, 9vw, 2.5rem); }
  .hero__in { padding-top: calc(var(--hdr) + 24px); padding-bottom: 24px; }
  .eyebrow { margin-bottom: 12px; }
  .hero::after { background: linear-gradient(180deg, rgba(14, 14, 13, .5) 0%, rgba(14, 14, 13, .2) 25%, rgba(14, 14, 13, .45) 50%, rgba(14, 14, 13, .86) 100%); }
  .hero__img img { object-position: 50% 30%; }
  .hero__p { font-size: 15px; line-height: 1.5; margin: 12px 0 18px; }
  .hero__cta { margin-bottom: 20px; gap: 8px; }
  .hero__cta .btn { flex: 1 1 0; padding: 12px 10px; min-width: 0; }
  .hero__facts { padding-top: 12px; }
  .hero__facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero__facts div { padding-right: 10px; margin-right: 10px; }
  .hero__facts dt { font-size: 21px; }
  .hero__facts dd { font-size: 10px; letter-spacing: .08em; }
}

/* intro */
.intro__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 48px 96px; }
.intro__body { padding-top: 40px; }
.facts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 32px 0 0; border-top: 1px solid var(--line); }
.facts div { padding: 28px 24px 0 0; }
.facts dt { font: 400 48px/1 var(--serif); color: var(--accent); }
.facts dd { margin: 10px 0 0; color: var(--mut); font-size: 14px; max-width: 22ch; }
@media (max-width: 900px) { .intro__grid { grid-template-columns: minmax(0, 1fr); gap: 24px; } .intro__body { padding-top: 0; } .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 8px; } .facts dt { font-size: 38px; } }

/* kolekcja: baner z widokiem ze stoku + plan sytuacyjny */
.coll { padding-bottom: var(--sec); }
.banner { position: relative; margin: 0; min-height: 78vh; display: flex; align-items: flex-end; color: #fff; background: var(--d-bg); overflow: hidden; }
.banner picture, .banner img { position: absolute; inset: 0; width: 100%; height: 100%; }
.banner img { object-fit: cover; object-position: 50% 45%; }
.banner::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14, 14, 13, .1) 30%, rgba(14, 14, 13, .72) 100%); }
.banner__in { position: relative; z-index: 1; padding-bottom: 200px; }
.banner__in h2 { max-width: 14ch; }
.banner__in p { max-width: 560px; margin-top: 18px; color: rgba(255, 255, 255, .88); }
.banner__cap { position: absolute; z-index: 1; right: var(--gut); top: 24px; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .8); }
.coll__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; margin-top: -150px; position: relative; z-index: 2; align-items: start; }
.card { background: var(--surface); border: 1px solid var(--line); border-radius: 6px; box-shadow: var(--shadow); }
.plan { padding: 28px; }
.plan__hd { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px 24px; margin-bottom: 16px; }
.legend { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; font-size: 12px; }
.plan__fig { position: relative; }
#plan-svg { width: 100%; height: auto; touch-action: manipulation; }
.plan__tip { position: absolute; z-index: 3; pointer-events: none; background: var(--ink); color: #fff; padding: 12px 14px; border-radius: var(--r); font-size: 13px; line-height: 1.45; max-width: 260px; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.plan__tip b { font: 500 20px/1 var(--serif); }
.plan__tip .pill { color: #fff; }
.plan__sel { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); margin-top: 12px; padding-top: 14px; }
.plan__sel b { font: 500 24px/1 var(--serif); margin-right: 8px; }
.plot { cursor: pointer; }
.plot__shape { transition: fill .2s, opacity .2s; stroke: #fff; stroke-width: 3; }
.plot.available .plot__shape { fill: #dfe5dc; } .plot.reserved .plot__shape { fill: #eadfcf; } .plot.sold .plot__shape { fill: #e3e1dc; }
.plot:hover .plot__shape, .plot.is-hl .plot__shape { fill: #cfd8cb; }
.plot.reserved:hover .plot__shape, .plot.reserved.is-hl .plot__shape { fill: #e2d1b8; }
.plot.is-sel .plot__shape { stroke: var(--accent); stroke-width: 5; }
.plot.is-out { opacity: .28; }
.plot__house { fill: #f7f6f2; stroke: #8a8578; stroke-width: 1.5; }
.plot__pool { fill: #a9d4d0; stroke: #7fb3ae; stroke-width: 1; }
.plot text { font-family: var(--serif); fill: var(--ink); pointer-events: none; }
.plot .plot__id { font-size: 30px; font-weight: 500; }
.plot .plot__st { font-family: var(--sans); font-size: 15px; letter-spacing: .04em; }
.plot.available .plot__st { fill: var(--ok); } .plot.reserved .plot__st { fill: var(--res); }
.coll__side { padding-top: 168px; }
.filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.filters label, form label { display: flex; flex-direction: column; gap: 6px; min-width: 0; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); }
select, input, textarea { font: 400 15px/1.4 var(--sans); color: var(--ink); background: var(--surface); border: 1px solid #cfcbc1; border-radius: var(--r); padding: 12px 12px; min-height: 48px; width: 100%; min-width: 0; text-transform: none; letter-spacing: 0; }
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--mut) 50%), linear-gradient(135deg, var(--mut) 50%, transparent 50%); background-position: calc(100% - 18px) 21px, calc(100% - 13px) 21px; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 34px; }
.count { margin: 20px 0 8px; font-size: 13px; color: var(--mut); }
.vlist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--line); }
.vlist li { border-bottom: 1px solid var(--line); }
.vcard { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding: 16px 4px; width: 100%; background: none; border: 0; text-align: left; cursor: pointer; color: inherit; font: inherit; transition: background .2s; }
.vcard:hover, .vcard.is-hl { background: #efede7; }
.vcard.is-sel { background: #ebe6dc; }
.vcard__id { font: 500 28px/1 var(--serif); grid-row: span 2; }
.vcard__t { font-weight: 600; font-size: 14px; }
.vcard__t span { font-weight: 400; color: var(--mut); }
.vcard__m { font-size: 13px; color: var(--mut); grid-column: 2; }
.vcard__p { text-align: right; grid-row: 1; grid-column: 3; font-weight: 600; white-space: nowrap; }
.vcard__s { text-align: right; grid-column: 3; }
.vcard__p small { display: block; font-weight: 400; font-size: 11px; color: var(--mut); }
.demo-note { margin-top: 16px; }
@media (max-width: 1080px) {
  .coll__grid { grid-template-columns: minmax(0, 1fr); margin-top: -110px; }
  .coll__side { padding-top: 0; }
  .banner__in { padding-bottom: 150px; }
}
@media (max-width: 760px) {
  .banner { min-height: 72vh; }
  .banner__in { padding-bottom: 110px; }
  .banner__cap { top: auto; bottom: 86px; left: var(--gut); right: auto; font-size: 10px; }
  .coll__grid { margin-top: -64px; gap: 28px; }
  .plan { padding: 16px 12px; }
  .filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .vcard { grid-template-columns: 52px minmax(0, 1fr); padding: 16px 0; }
  .vcard__id { font-size: 24px; }
  .vcard__p, .vcard__s { grid-column: 2; grid-row: auto; text-align: left; }
}

/* karta willi: dwie kolumny z przyklejonym panelem ceny (desktop), pełny ekran z dolnym CTA (telefon) */
.villa { background: var(--surface); border-top: 1px solid var(--line); }
.villa__grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; grid-template-areas: "main aside"; gap: 64px; align-items: stretch; }
.villa__main { grid-area: main; min-width: 0; }
.villa__aside { grid-area: aside; min-width: 0; }
.panel { position: sticky; top: calc(var(--hdr) + 24px); border: 1px solid var(--line); border-radius: 6px; padding: 32px; background: var(--bg); }
.panel__id { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.panel__id h2 { font-size: 56px; line-height: 1; }
.panel__type { font: 400 22px/1.2 var(--serif); color: var(--accent); }
.panel .pill { margin: 14px 0 22px; }
.price { font: 500 40px/1.1 var(--serif); letter-spacing: -.01em; }
.price--range { font-size: 34px; }
.panel__excl { font-size: 13px; color: var(--mut); margin: 6px 0 0; }
.panel__m2 { font-size: 14px; margin: 14px 0 0; }
.panel__tot { display: flex; justify-content: space-between; gap: 12px; padding: 14px 0; margin: 18px 0 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 14px; }
.panel__tot b { white-space: nowrap; }
.kv { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0; margin: 18px 0 24px; font-size: 14px; }
.kv dt, .kv dd { padding: 8px 0; border-bottom: 1px solid var(--line); margin: 0; }
.kv dt { color: var(--mut); }
.kv dd { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.panel .btn { width: 100%; margin-top: 10px; }
.panel__demo { margin: 16px 0 0; }
.vblock { padding: 0 0 72px; margin: 0 0 72px; border-bottom: 1px solid var(--line); }
.vblock:last-child { border: 0; margin: 0; padding: 0; }
.vblock > h3 { font-size: clamp(1.7rem, 2.6vw, 2.25rem); margin-bottom: 12px; }
.vblock > h3 + p { color: var(--mut); max-width: 68ch; }
.vhead { margin-bottom: 32px; }
.vhead h2 { font-size: clamp(2.2rem, 4vw, 3.4rem); }
.gal { margin: 0; }
.gal__main { position: relative; aspect-ratio: 16 / 9; background: #e9e6df; overflow: hidden; border-radius: 2px; }
.gal__main img { width: 100%; height: 100%; object-fit: cover; }
.gal__nav { position: absolute; inset: auto 16px 16px auto; display: flex; gap: 8px; }
.gal__nav button { width: 48px; height: 48px; border-radius: 50%; border: 0; background: rgba(247, 246, 242, .92); color: var(--ink); cursor: pointer; font-size: 20px; line-height: 1; }
.gal__cap { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0 0; font-size: 14px; }
.gal__cap b { font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: 11px; color: var(--accent); display: block; }
.thumbs { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; margin: 16px 0 0; padding: 0; list-style: none; }
.thumbs button { padding: 0; border: 0; background: none; cursor: pointer; opacity: .55; transition: opacity .2s; aspect-ratio: 16 / 10; overflow: hidden; width: 100%; }
.thumbs button[aria-current="true"], .thumbs button:hover { opacity: 1; }
.thumbs button[aria-current="true"] { box-shadow: 0 0 0 2px var(--accent); }
.thumbs img { width: 100%; height: 100%; object-fit: cover; }
.tabs { display: flex; gap: 4px; overflow-x: auto; margin: 24px 0 16px; padding-bottom: 4px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.tabs button { flex: none; background: none; border: 1px solid var(--line); border-radius: 999px; padding: 10px 16px; min-height: 44px; font: 500 13px/1 var(--sans); color: var(--ink); cursor: pointer; white-space: nowrap; }
.tabs button[aria-selected="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.drawing { margin: 0; background: #f6f2ea; border: 1px solid var(--line); padding: 16px; }
.drawing img { width: 100%; height: auto; max-height: 82vh; object-fit: contain; margin: 0 auto; }
.drawing figcaption { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 13px; padding-top: 12px; color: var(--mut); }
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th, .tbl td { text-align: left; padding: 11px 12px 11px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl th { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); font-weight: 600; }
.tbl td.r, .tbl th.r { text-align: right; padding-right: 0; padding-left: 12px; white-space: nowrap; }
.tbl tr.em td { font-weight: 700; border-bottom: 1px solid var(--ink); }
.tbl tr.tot td { font-weight: 700; border-top: 1px solid var(--ink); border-bottom: 0; font-size: 15px; }
.tbl small { display: block; color: var(--mut); font-size: 12px; font-weight: 400; margin-top: 2px; }
.scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.cols2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; }
details.acc { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 24px 0 0; }
details.acc + details.acc { margin-top: -1px; }
details.acc summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; font-weight: 600; font-size: 14px; min-height: 48px; }
details.acc summary::-webkit-details-marker { display: none; }
details.acc summary::after { content: '+'; font: 300 24px/1 var(--sans); color: var(--accent); }
details.acc[open] summary::after { content: '−'; }
details.acc .acc__b { padding: 0 0 20px; font-size: 14px; color: var(--mut); }
details.acc dl { margin: 0; } details.acc dt { color: var(--ink); font-weight: 600; margin-top: 12px; } details.acc dd { margin: 2px 0 0; }
details.acc ul { margin: 0; padding-left: 18px; } details.acc li { margin: 6px 0; }
.chk { display: flex !important; flex-direction: row !important; align-items: flex-start; gap: 10px; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; font-weight: 400 !important; color: inherit !important; cursor: pointer; }
.chk input { width: 20px; height: 20px; min-height: 0; flex: none; margin: 1px 0 0; accent-color: var(--ink); }
.lawyer { margin: 16px 0 0; }
.badge { display: inline-block; font-size: 11px; font-weight: 600; letter-spacing: .04em; color: var(--ok); white-space: nowrap; }
.badge--pre { color: var(--res); }
.views { list-style: none; margin: 16px 0 0; padding: 0; }
.views li { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.views li b { font-weight: 600; }
.compass { display: flex; align-items: center; gap: 20px; margin: 24px 0 0; }
.compass svg { width: 72px; height: 72px; flex: none; }
.grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 40px; margin: 24px 0 0; }
.item h4 { font: 600 15px/1.35 var(--sans); margin: 0 0 6px; }
.item p { font-size: 14px; color: var(--mut); margin: 0 0 8px; }
.dd { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 40px; }
.dd li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.dd li span small { display: block; color: var(--mut); font-size: 12px; font-style: italic; }
.note { font-size: 13px; color: var(--mut); background: var(--bg); border-left: 2px solid var(--accent-line); padding: 12px 16px; margin: 20px 0 0; }
.ranges { margin-top: 8px; }
.sub { font: 600 15px/1.4 var(--sans); margin: 40px 0 8px; }
.price { margin: 0; }
.soon { font: 400 22px/1.45 var(--serif); max-width: 46ch; margin: 24px 0; }
@media (max-width: 1080px) {
  .villa__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "aside" "main"; gap: 40px; }
  .panel { position: static; }
}
@media (max-width: 760px) {
  .villa { padding-top: 48px; }
  .panel { padding: 24px 20px; }
  .panel__id h2 { font-size: 46px; }
  .price { font-size: 34px; } .price--range { font-size: 28px; }
  .vblock { padding-bottom: 48px; margin-bottom: 48px; }
  .thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gal__nav button { width: 44px; height: 44px; }
  .drawing { padding: 8px; }
  .cols2, .grid2, .dd { grid-template-columns: minmax(0, 1fr); gap: 0 0; }
  .grid2 { gap: 20px; }
  .views li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .tbl { font-size: 13px; }
  .tbl.pay .c-when, .tbl.pay .c-iva, .tbl.pay .c-prot { display: none; }
  .tbl.pay .when-m, .tbl.pay .prot-m { display: block; }
}

/* ciemne sekcje */
.dark { background: var(--d-bg); color: var(--d-ink); }
.dark .mut, .dark .small.mut { color: var(--d-mut); }
.arch__head { max-width: 760px; margin-bottom: 64px; }
.arch__head .lead { color: var(--d-mut); margin-top: 24px; }
.mosaic { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: minmax(0, auto); gap: 16px; }
.mosaic figure { margin: 0; position: relative; overflow: hidden; background: var(--d-surface); }
.mosaic picture { height: 100%; }
.mosaic img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 16 / 9; transition: transform .8s ease; }
.mosaic figure:hover img { transform: scale(1.02); }
.mosaic figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 18px 14px; font-size: 13px; background: linear-gradient(transparent, rgba(0, 0, 0, .62)); color: #fff; }
.mosaic figcaption b { display: block; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--d-accent); font-weight: 600; }
.mosaic .m1 { grid-column: span 8; } .mosaic .m2 { grid-column: span 4; } .mosaic .m2 img, .mosaic .m1 img { aspect-ratio: auto; height: 100%; min-height: 0; }
.mosaic .m1 img { aspect-ratio: 16 / 9; }
.mosaic .m3 { grid-column: span 4; } .mosaic .m4 { grid-column: span 4; } .mosaic .m5 { grid-column: span 4; }
.mosaic .m6 { grid-column: span 12; } .mosaic .m6 img { aspect-ratio: 21 / 8; }
.arch__pal { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 48px; margin-top: 96px; padding-top: 48px; border-top: 1px solid var(--d-line); }
.arch__pal h3, .arch__std h3 { margin-bottom: 12px; }
.pals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pal { background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 6px; padding: 22px; }
.pal__sw { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); height: 56px; margin-bottom: 18px; border-radius: 2px; overflow: hidden; }
.pal h4 { font: 400 26px/1.1 var(--serif); margin: 0; }
.pal h4 small { font: 600 10.5px/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--d-accent); margin-left: 8px; }
.pal ul { list-style: none; margin: 14px 0 0; padding: 0; font-size: 13px; color: var(--d-mut); }
.pal li { padding: 6px 0; border-top: 1px solid var(--d-line); }
.arch__std { margin-top: 64px; padding-top: 48px; border-top: 1px solid var(--d-line); display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 48px; }
.arch__std ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.arch__std li { padding: 12px 0; border-bottom: 1px solid var(--d-line); font-size: 15px; }
@media (max-width: 900px) {
  .mosaic { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .mosaic .m1, .mosaic .m6 { grid-column: 1 / -1; } .mosaic .m2, .mosaic .m3, .mosaic .m4, .mosaic .m5 { grid-column: span 1; }
  .mosaic .m2 img { aspect-ratio: 16 / 9; height: auto; }
  .mosaic .m6 img { aspect-ratio: 16 / 9; }
  .mosaic figcaption { padding: 28px 10px 8px; font-size: 11.5px; }
  .arch__pal, .arch__std { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 56px; }
  .pals { grid-template-columns: minmax(0, 1fr); }
  .arch__std ul { grid-template-columns: minmax(0, 1fr); }
}

/* lokalizacja, zakup */
.place__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 96px; align-items: end; }
.place .lead { margin-top: 24px; color: var(--mut); }
.dist { list-style: none; margin: 0 0 16px; padding: 0; border-top: 1px solid var(--ink); }
.dist li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.dist li span:first-child { font: 400 22px/1.25 var(--serif); }
.dist li span:last-child { font-size: 14px; color: var(--mut); white-space: nowrap; }
.buy { background: #efece5; }
.steps { list-style: none; margin: 48px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: s; }
.steps li { counter-increment: s; padding: 28px 28px 0 0; border-top: 1px solid var(--ink); position: relative; }
.steps li::before { content: counter(s, decimal-leading-zero); font: 400 44px/1 var(--serif); color: var(--accent); display: block; margin-bottom: 18px; }
.steps h3 { font-size: 22px; margin-bottom: 8px; }
.steps p { font-size: 14px; color: var(--mut); }
.adfacts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 32px; margin: 56px 0 0; font-size: 14px; }
.adfacts div { padding: 14px 0; border-top: 1px solid #d9d4c9; }
.adfacts dt { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); font-weight: 600; }
.adfacts dd { margin: 4px 0 0; }
@media (max-width: 900px) {
  .place__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .dist li { flex-direction: column; gap: 4px; }
  .dist li span:first-child { font-size: 20px; }
  .dist li span:last-child { white-space: normal; }
  .steps { grid-template-columns: minmax(0, 1fr); }
  .steps li { padding: 20px 0 8px; display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 8px; }
  .steps li::before { grid-row: span 2; font-size: 34px; margin: 0; }
  .adfacts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 16px; }
}

/* prywatna wizyta (formularz, ciemny) */
.viewing__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 96px; align-items: start; }
.viewing .lead { color: var(--d-mut); margin-top: 24px; }
.viewing__img { margin: 48px 0 0; }
.viewing__img img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
@media (max-width: 900px) { .viewing__img { display: none; } }
#lead { display: grid; gap: 18px; min-width: 0; }
.dark form label, .dark legend { color: var(--d-mut); }
.dark select, .dark input, .dark textarea { background-color: var(--d-surface); border-color: #3a3a36; color: var(--d-ink); }
.dark select { background-image: linear-gradient(45deg, transparent 50%, var(--d-mut) 50%), linear-gradient(135deg, var(--d-mut) 50%, transparent 50%); }
.dark .chk input { accent-color: var(--d-accent); }
.row2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.tel { display: grid; grid-template-columns: minmax(0, 150px) minmax(0, 1fr); gap: 12px; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 0; margin-bottom: 8px; }
.seg { display: flex; flex-wrap: wrap; gap: 8px; }
.seg legend { width: 100%; }
.seg label { flex-direction: row !important; align-items: center; gap: 8px; border: 1px solid #3a3a36; border-radius: var(--r); padding: 0 14px; min-height: 48px; cursor: pointer; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; font-weight: 500 !important; color: var(--d-ink) !important; }
.seg label:has(input:checked) { border-color: var(--d-accent); }
.seg input { width: 16px; height: 16px; min-height: 0; accent-color: var(--d-accent); margin: 0; }
.vpick > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.vpick label { flex-direction: row !important; align-items: center; gap: 8px; border: 1px solid #3a3a36; border-radius: var(--r); padding: 0 12px; min-height: 48px; cursor: pointer; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; color: var(--d-ink) !important; font-weight: 500 !important; }
.vpick label small { color: var(--d-mut); font-weight: 400; font-size: 12px; }
.vpick label:has(input:checked) { border-color: var(--d-accent); }
.vpick input { width: 16px; height: 16px; min-height: 0; accent-color: var(--d-accent); margin: 0; flex: none; }
.agent-note { margin: -6px 0 0; color: var(--d-accent); }
.consent { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px 14px; font-size: 14px; }
.consent a { color: var(--d-accent); padding: 2px 0; }
.err { color: #f0a77b; min-height: 1.4em; margin: 0; font-size: 14px; }
.ok { font: 400 28px/1.3 var(--serif); padding: 40px 0; }
@media (max-width: 900px) { .viewing__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; } }
@media (max-width: 560px) { .row2 { grid-template-columns: minmax(0, 1fr); } .tel { grid-template-columns: minmax(0, 116px) minmax(0, 1fr); gap: 8px; } .vpick > div { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* stopka (poziom 3 oznaczenia demo) */
.foot { background: var(--d-bg); color: var(--d-mut); border-top: 1px solid var(--d-line); padding: 64px 0 96px; font-size: 13px; }
.foot__grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) minmax(0, 3fr); gap: 48px; }
.foot .brand__t { color: var(--d-ink); }
.foot a { color: var(--d-ink); }
@media (max-width: 900px) { .foot__grid { grid-template-columns: minmax(0, 1fr); gap: 24px; } }

/* dolny pasek CTA karty willi (telefon) */
.mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: rgba(14, 14, 13, .97); color: #fff; padding: 10px var(--gut) calc(10px + env(safe-area-inset-bottom)); }
.mbar[hidden] { display: none; }
.mbar__t { display: flex; flex-direction: column; min-width: 0; font-size: 13px; }
.mbar__t b { font: 500 18px/1.1 var(--serif); }
.mbar .btn { background: var(--d-ink); color: var(--ink); border-color: var(--d-ink); flex: none; }
@media (min-width: 1081px) { .mbar { display: none !important; } }

@media print { .hdr, .demo-strip, .mbar, .viewing, .gal__nav, .thumbs, .tabs { display: none !important; } .hero { min-height: 0; } }

/* Cormorant ma domyślnie cyfry nautyczne (old-style); skrót „font:” zeruje font-variant-numeric, więc cyfry wersalikowe przywracamy po każdym skrócie */
body,
.eyebrow,
.lnk,
.tag,
.pill,
.brand__t,
.brand__t small,
.nav a,
.lang button,
.nav a,
.hero__facts dt,
.facts dt,
.plan__tip b,
.plan__sel b,
select, input, textarea,
.vcard,
.vcard__id,
.panel__type,
.price,
.tabs button,
details.acc summary::after,
.item h4,
.sub,
.soon,
.pal h4,
.pal h4 small,
.dist li span:first-child,
.steps li::before,
.ok,
.mbar__t b { font-variant-numeric: lining-nums; }
.num, td, .price { font-variant-numeric: tabular-nums lining-nums; }

/* v1.1 (recenzja): waluty, nawigacja karty, construida vs útil, pakiet dokumentów, ochrona wpłat, formularz demo, pasek CTA */
.fx-note { margin: 10px 0 0; }
.vcard__p small.fx, .panel__fx { color: var(--accent); }
.panel__fx { font-size: 14px; margin: 8px 0 0; }
.panel__fx small { display: block; color: var(--mut); font-size: 11.5px; margin-top: 2px; }
.panel__cta p { margin: 10px 0 0; }
.vnav { position: sticky; top: var(--hdr); z-index: 5; display: flex; gap: 4px; overflow-x: auto; margin: -8px 0 40px; padding: 10px 0; background: var(--surface); border-bottom: 1px solid var(--line); scrollbar-width: none; }
.vnav::-webkit-scrollbar { display: none; }
.vnav a { flex: none; text-decoration: none; font: 600 12px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; padding: 12px 14px; border-radius: 999px; color: var(--mut); min-height: 40px; display: inline-flex; align-items: center; }
.vnav a.is-on, .vnav a:hover { background: var(--bg); color: var(--ink); }
.vblock { scroll-margin-top: calc(var(--hdr) + 72px); }
.diff { margin: 8px 0 0; }
.diff p { font-size: 14px; color: var(--mut); max-width: 72ch; }
.diff__bar { display: flex; height: 34px; margin: 8px 0 14px; font-size: 12px; font-weight: 600; border: 1px solid var(--line); }
.diff__bar span { display: flex; align-items: center; padding: 0 10px; white-space: nowrap; overflow: hidden; }
.diff__bar span:first-child { background: #e8dfcf; }
.diff__bar span:last-child { flex: 1; background: repeating-linear-gradient(45deg, #f4f1ea 0 6px, #e2dfd7 6px 7px); justify-content: center; }
#outdoor { margin-top: 24px; }
.pack { list-style: none; margin: 16px 0 0; padding: 0; border-top: 1px solid var(--line); }
.pack li { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.pack h4 { font: 600 15px/1.35 var(--sans); margin: 0 0 4px; }
.pack h4 em { font-weight: 400; color: var(--mut); font-size: 13px; }
.pack p { font-size: 14px; color: var(--mut); margin: 0; max-width: 68ch; }
.tbl.pay .c-prot { min-width: 220px; font-size: 12.5px; padding-left: 24px; }
.tbl.pay .c-prot small, .tbl.pay .prot-m small { display: block; }
.tbl.pay .c-prot small, .tbl.pay .prot-m small { color: var(--mut); }
.tbl.pay .when-m, .tbl.pay .prot-m { display: none; }
.form-demo { margin: 0; padding: 14px 16px; border: 1px solid #5a4a33; border-radius: var(--r); color: var(--d-ink); font-size: 14px; background: rgba(201, 168, 120, .08); }
details.more { border-top: 1px solid var(--d-line); border-bottom: 1px solid var(--d-line); }
details.more > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; min-height: 52px; font-weight: 600; font-size: 14px; color: var(--d-ink); }
details.more > summary::-webkit-details-marker { display: none; }
details.more > summary::after { content: '+'; font: 300 24px/1 var(--sans); color: var(--d-accent); }
details.more[open] > summary::after { content: '−'; }
.more__b { display: grid; gap: 18px; padding: 4px 0 20px; }
@media (max-width: 1080px) {
  html { scroll-padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  html.has-mbar body { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .vnav { margin: -8px calc(-1 * var(--gut)) 32px; padding: 8px var(--gut); }
}
@media (max-width: 760px) { .tbl.pay .c-gross { display: none; } .tbl.pay .when-m, .tbl.pay .prot-m { display: block; } .tbl.pay .prot-m { margin-top: 4px; font-size: 12px; } .pack li { flex-direction: column; gap: 8px; } .diff__bar span:last-child { font-size: 11px; } }

/* v1.2: wybór języka na telefonie, porównanie, konfigurator, podsumowanie do wydruku */
.lang-sel { display: none; }
.lang-sel select { min-height: 40px; padding: 6px 28px 6px 10px; width: auto; background-color: transparent; color: inherit; border-color: currentColor; font: 600 12px/1 var(--sans); letter-spacing: .08em; background-position: calc(100% - 14px) 17px, calc(100% - 9px) 17px; }
.hdr:not(.is-solid):not(.is-open) .lang-sel select option { color: var(--ink); }
@media (max-width: 1080px) { .lang { display: none; } .lang-sel { display: block; margin-left: auto; } }
.vlist li { position: relative; }
.vcard { padding-bottom: 18px; }
@media (min-width: 761px) { .vcard__p { grid-row: 1 / span 2; align-self: start; } .vcard__s { grid-column: 2; grid-row: 3; text-align: left; } }
@media (max-width: 760px) { .vcard { padding-bottom: 56px; } .cmp-t { bottom: 14px; } }
.hero__facts dd, .adfacts dt, .adfacts dd, .pack h4, .item h4, form label > span, legend { overflow-wrap: anywhere; hyphens: auto; }
@media (max-width: 420px) { .adfacts { grid-template-columns: minmax(0, 1fr); } }
.cmp-t { position: absolute; right: 4px; bottom: 12px; min-height: 36px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font: 600 11px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.cmp-t[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.cmp-t[disabled] { opacity: .4; cursor: not-allowed; }
.cmp-tray { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 16px 0 0; padding: 14px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; font-size: 13px; }
.cmp-tray span { flex: 1 1 160px; }
.cmp { margin-top: 64px; }
.cmp__hd { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.cmp__t th[scope="row"] { font-weight: 500; color: var(--mut); text-transform: none; letter-spacing: 0; font-size: 13px; white-space: nowrap; padding-right: 24px; }
.cmp__t td { min-width: 150px; }
.cmp__t .cmp__v { font: 500 28px/1 var(--serif); color: var(--ink); text-transform: none; letter-spacing: 0; }
.cmp__t small { display: block; color: var(--mut); font-size: 11.5px; }
.cfg__pal { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 8px 0 8px; }
.cfg__pal legend { color: var(--mut); }
.cfg__pal label { display: flex; flex-direction: column; gap: 8px; border: 1px solid var(--line); border-radius: 6px; padding: 12px; cursor: pointer; font-size: 14px; }
.cfg__pal label.is-on, .cfg__pal label:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.cfg__pal input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.cfg__pal label:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.cfg__pal .pal__sw { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); height: 28px; margin: 0; }
.cfg__pal small { color: var(--mut); }
.cfg__st { display: inline-block; font: 600 11px/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; padding: 4px 8px; border-radius: 2px; }
.cfg__st--inc { background: #e3eae0; color: var(--ok); } .cfg__st--ext { background: #f1e6d4; color: var(--res); } .cfg__st--rev { background: #ebe9e4; color: var(--mut); }
.cfg__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.cfg__list li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 8px 16px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.cfg__inc { color: var(--ok); font-size: 12px; font-weight: 600; white-space: nowrap; }
.cfg__p { white-space: nowrap; color: var(--mut); }
.cfg__list .btn { min-width: 132px; }
.cfg__tot { margin: 24px 0 0; border-top: 1px solid var(--ink); }
.cfg__tot p { display: flex; justify-content: space-between; gap: 16px; margin: 0; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.cfg-sum { background: var(--surface); border-top: 1px solid var(--line); padding: var(--sec) 0; }
.cfg-sum__in { max-width: 900px; }
.cfg-sum h2 { margin-bottom: 8px; }
.cfg-sum__kv { margin-top: 24px; }
@media (max-width: 760px) {
  .cfg__pal { grid-template-columns: minmax(0, 1fr); }
  .cfg__list li { grid-template-columns: minmax(0, 1fr) auto; }
  .cfg__list li > .btn, .cfg__list li > .cfg__inc { grid-column: 1 / -1; justify-self: start; }
  .cmp__t td { min-width: 120px; }
}
@media print {
  html.sum-open body > *:not(main), html.sum-open main > *:not(#cfg-sum) { display: none !important; }
  html.sum-open .cfg-sum { padding: 0; border: 0; }
  .no-print { display: none !important; }
}
.cmp__t .cmp__v { font-variant-numeric: lining-nums; }
@media (max-width: 360px) { .brand { overflow: hidden; } .brand__t { font-size: 14.5px; letter-spacing: .08em; } .brand__t small { display: none; } .brand svg { width: 24px; height: 24px; } }
@media (max-width: 760px) { .tbl.pay { table-layout: fixed; } .tbl.pay th:first-child, .tbl.pay td:first-child { width: 60%; overflow-wrap: anywhere; } .tbl.pay td.num { white-space: normal; } }
.gal__cap small.gal__note { display: block; color: var(--accent); font-size: 12.5px; margin-top: 4px; }