/* ============================================
   KAISERWÄNDE — Upratovanie domácností (/upratovanie-domacnosti, web 2.14.0)
   Štýl kampane „Upratané po cisársky.“ (leták), nie kópia tlačoviny: žltá, tmavohnedá a krémová, nadpisy a ceny
   ťažkým groteskom letáka (Bricolage Grotesque 800 s optickou veľkosťou), text písmom webu Outfit.
   Mobil prvý: základné pravidlá platia od 320 px, širšie rozloženia pridávajú @media (min-width) pri sekciách.
   Kontrast (WCAG AA): tmavohnedá na žltej 7,6 : 1, na krémovej 12 : 1, krémová na tmavohnedej 12 : 1, žltá
   na tmavohnedej 7,6 : 1; tlmený text (--upr-ink-soft) len na krémovej a bielej (≥ 6 : 1).
   Načítava sa len na tejto podstránke (isset/upratovanie/views/layout-start.php), za css/style.css.
   ============================================ */

/* ---------- TOKENY ---------- */
/* Farby letáka prevedené z profilu displeja tlačového súboru do sRGB (surové pixely #DEC159 by na webe boli bledšie),
   výšky lišty webu pre tmavý pás a cieľ kotvy:
   --upr-nav-top — navrchu: padding spolu 40 px + tlačidlá 44 px (do 768 px riadok drží logo, viď nižšie),
   --upr-nav-scrolled — po posunutí 24 px + 44 px; rovnaké výpočty ako css/odevy.css (--odevy-nav-*). */
:root {
    --upr-yellow: #F4BD3C;
    --upr-brown: #3E2C2C;
    --upr-brown-deep: #241D1C;
    --upr-cream: #FBF4E2;
    --upr-white: #FFFFFF;
    --upr-ink: #3E2C2C;
    --upr-ink-soft: rgba(62, 44, 44, 0.78);
    --upr-line: rgba(62, 44, 44, 0.16);
    /* Hranica polí a volieb — 3 : 1 voči bielej (WCAG 1.4.11) */
    --upr-line-strong: rgba(62, 44, 44, 0.62);
    --upr-on-dark: #FBF4E2;
    --upr-on-dark-soft: rgba(251, 244, 226, 0.8);
    --upr-line-dark: rgba(251, 244, 226, 0.22);
    --upr-error: #A61B1B;
    --upr-error-bg: #FDECEC;
    --upr-display: 'Bricolage Grotesque', 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
    /* Písmo textu webu so zálohami ako css/style.css (body) — podnadpis H1 a poznámky v nadpisoch formulára */
    --upr-text: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;
    /* Tiene a pozadie dialógu z --upr-brown-deep (36, 29, 28), neaktívne dni a šípky kalendára z --upr-ink */
    --upr-shadow: rgba(36, 29, 28, 0.22);
    --upr-shadow-sheet: rgba(36, 29, 28, 0.25);
    --upr-backdrop: rgba(36, 29, 28, 0.5);
    --upr-ink-disabled: rgba(62, 44, 44, 0.32);
    --upr-radius: 14px;
    --upr-radius-sm: 8px;
    --upr-nav-top: 84px;
    --upr-nav-scrolled: 68px;
}

@media (max-width: 768px) {
    :root {
        --upr-nav-top: calc(40px + max(var(--nav-logo-top), 24.5px));
        --upr-nav-scrolled: calc(24px + max(var(--nav-logo-scrolled), 24.5px));
    }
}

/* ---------- ZÁKLAD ---------- */
.upr-body { background: var(--upr-cream); }
.upr { color: var(--upr-ink); font-weight: 400; }
/* Prvky s vlastným display (flex, grid) musia atribút hidden rešpektovať — skrýva ich JS pri skončenej akcii
   a pri podmienených častiach formulára */
.upr [hidden] { display: none !important; }
/* :where — nulová špecificita, aby okraje tried (.upr-hero__lead, .upr-promo__note…) mali prednosť */
:where(.upr) a { color: inherit; }
:where(.upr) p { margin: 0; }

/* Cieľ kotvy (#jednorazove, #pausal…), pole formulára zo súhrnu chýb a voľba služby z predvýberu nesmú skončiť pod
   lištou webu — po skoku je stránka posunutá, lišta má teda výšku po posunutí. Z týchto hodnôt počíta polohu skoku
   aj js/upratovanie.js (jumpTo). Sekcia objednávky (#objednavka z hero, lišty a QR kódu letáka) začína tesne pod
   lištou — vzduch nad nadpisom dáva jej vlastný padding. */
.upr [id],
.upr-fieldset,
.upr-field,
.upr-choice { scroll-margin-top: calc(var(--upr-nav-scrolled) + 16px); }
.upr .upr-order { scroll-margin-top: var(--upr-nav-scrolled); }

/* Tmavý pás pod priehľadnou lištou webu (ako .odevy-band): drží biele logo a odkazy lišty navrchu čitateľné nad žltým
   hero; lepí sa k hornému okraju, kým lišta nezbelie, potom zmizne. z-index pod lištou webu (1000). Pás je súčasť
   lišty webu, preto má farbu webu (--dark ako pätička a .odevy-band), nie letáka — tmavé sekcie kampane (pás akcie,
   predvianočné) s ním ani s pätičkou nesusedia. */
.upr-band {
    position: sticky;
    top: 0;
    z-index: 950;
    height: var(--upr-nav-top);
    background: var(--dark);
    transition: opacity var(--transition), visibility var(--transition);
}
.navbar.scrolled ~ .upr-band { opacity: 0; visibility: hidden; }

/* Tlačidlo lišty „Objednať upratovanie“ (225 px) sa vedľa loga, ikon a hamburgera zmestí až od ~830 px okna
   (s klasickým posuvníkom ~850 px; pri 850 px medzera logo ↔ akcie 59 px, merané v 2.15.0), dovtedy krátky text
   „Objednať“; podstránka pre firmy má vlastné pásmo pre „Obhliadka zadarmo“ (css/firmy.css) */
@media (min-width: 769px) and (max-width: 849px) {
    .upr-body--domacnosti .navbar__cta-long { display: none; }
    .upr-body--domacnosti .navbar__cta-short { display: inline; }
}
/* Lišta s menu od 1200 px (rozpočet v css/style.css). Domácnosti aj firmy majú od 1200 px krátky text „Objednať“ /
   „Obhliadka“ (125 / 132 px). Menu 2.15.1 (Pre domácnosti … Kontakt, 536 px) sa však s logom navrchu (346 px), ikonami
   a ani s krátkym tlačidlom do 1140 px nezmestí — akcie by pretiekli o 54 / 62 px za okraj obsahu a pri 1200 px by
   okno tlačidlo orezalo (merané v 2.15.1). Navrchu preto tlačidlo lišty od 1200 px chýba — hlavnú akciu nesie tlačidlo
   hero v prvej obrazovke — a objaví sa po posunutí (.scrolled z js/main.js), keď je logo o 50 px užšie: okraj
   logo ↔ menu ↔ akcie navrchu 80 px ako na ostatných stránkach, po posunutí 38 / 34 px (najmenší okraj gap 32 px).
   Tlačidlo sa rozbalí z nulovej šírky prechodom .btn (var(--transition) — rovnako dlho ako zmenšenie loga), menu sa
   tak posunie plynulo. Skryté má aj nulový obrys, vodorovný padding a záporný okraj = medzera akcií (10 px), aby po
   ňom v lište neostalo miesto; visibility: hidden ho vyradí aj z poradia klávesnice. Bez JS ostáva skryté (hero má
   vlastné tlačidlo). Stránka 404 webu v tom istom rozložení (404.php, bez modifikátora) tlačidlo lišty nemá. */
@media (min-width: 1200px) {
    .upr-body--domacnosti .navbar__cta-long,
    .upr-body--firmy .navbar__cta-long { display: none; }
    .upr-body--domacnosti .navbar__cta-short,
    .upr-body--firmy .navbar__cta-short { display: inline; }
    .upr-body--domacnosti .navbar__cta,
    .upr-body--firmy .navbar__cta { max-width: 140px; overflow: hidden; }
    .upr-body--domacnosti .navbar:not(.scrolled) .navbar__cta,
    .upr-body--firmy .navbar:not(.scrolled) .navbar__cta {
        max-width: 0;
        margin-left: -10px;
        padding-left: 0;
        padding-right: 0;
        border-width: 0;
        opacity: 0;
        visibility: hidden;
    }
    .upr-body--domacnosti .navbar.scrolled .navbar__inner,
    .upr-body--firmy .navbar.scrolled .navbar__inner { gap: 32px; }
}

/* ---------- TYPOGRAFIA ---------- */
.upr-h2,
.upr-h3,
.upr-h4 {
    font-family: var(--upr-display);
    font-weight: 800;
    font-optical-sizing: auto;
    color: inherit;
    margin: 0;
}
.upr-h2 { font-size: clamp(2.1rem, 7.5vw, 3.6rem); line-height: 1; letter-spacing: -0.035em; }
.upr-h2--yellow { color: var(--upr-yellow); }
.upr-h3 { font-size: clamp(1.6rem, 5.6vw, 2.2rem); line-height: 1.05; letter-spacing: -0.02em; }
.upr-h4 { font-size: 1.2rem; line-height: 1.2; letter-spacing: -0.01em; }
.upr-muted { color: var(--upr-ink-soft); }
/* Bez osamotených slov: nadpisy vyvážene, krátke texty „pretty“ (prehliadač bez podpory zalomí bežne) */
.upr-h2,
.upr-h3,
.upr-legend { text-wrap: balance; }
.upr p,
.upr-choice__hint,
.upr-choice__title,
.upr-field__hint,
.upr .faq-item__question { text-wrap: pretty; }

/* ---------- TLAČIDLÁ A ODKAZY ---------- */
/* Hlavná akcia stránky — tmavohnedé tlačidlo (na žltej aj krémovej); oranžové tlačidlo webu ostáva len v lište */
.upr-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 12px 28px;
    border: 0;
    border-radius: 999px;
    background: var(--upr-brown);
    color: var(--upr-cream);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.2;
    text-align: center;
    cursor: pointer;
    transition: background var(--transition), transform var(--transition);
}
.upr .upr-btn { color: var(--upr-cream); }
.upr-btn:hover { background: var(--upr-brown-deep); transform: translateY(-1px); }
.upr-btn:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 3px; }
.upr-btn--block { width: 100%; }
/* Počas odosielania (js/upratovanie.js) — ostáva fokusovateľné, len vyzerá neaktívne */
.upr-btn[aria-disabled="true"] { opacity: 0.7; cursor: progress; transform: none; }

/* Textové odkazy cenníka (predvyberú službu vo formulári) — šípka ostane pri zalomenom texte (320 px) za posledným
   slovom, lebo ikona je inline (nie inline-block — pred atomickým inline prvkom sa riadok smie zalomiť aj bez medzery)
   a v HTML je bez medzery; odstup dáva okraj, podčiarknutie nejde pod medzeru. Zvislý okraj dáva dotykovú plochu
   aspoň 44 px. */
.upr-link {
    display: inline-block;
    padding: 10px 0;
    font-weight: 600;
    line-height: 1.5;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}
.upr-link i { display: inline; margin-left: 0.4em; font-size: 0.8em; }
/* Odkaz so šípkou pred textom (Späť na …) — šípka ako atomický inline prvok sa nepodčiarkne (podčiarknutie by bolo
   prerušené medzerou za ňou); dôvod pre display: inline (zalomenie pred šípkou) platí len pre šípku za textom */
.upr-link--back i { display: inline-block; margin: 0 0.4em 0 0; }
.upr-link:hover { text-decoration-thickness: 3px; }
.upr-link:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; border-radius: 2px; }
.upr-links { display: flex; flex-wrap: wrap; gap: 0 24px; margin-top: 12px; }

/* ---------- HERO ---------- */
/* Žltá plocha cez celú šírku, obsah v .container ako ostatné sekcie, výška podľa obsahu. Mobil: text a hlavná akcia
   hore, blok ponuky pod nimi; od 1024 px dva stĺpce (text vľavo, blok ponuky vpravo). */
.upr-hero {
    background: var(--upr-yellow);
    color: var(--upr-ink);
    padding: 28px 0 32px;
    overflow: hidden;
}
.upr-hero__inner { display: grid; gap: 28px; }
/* Kľúčová fráza je v DOM pred claimom (vyhľadávače, čítačky) — vizuálne ide pod claim (order) */
.upr-hero__title { display: flex; flex-direction: column; margin: 0; font-size: inherit; color: inherit; font-weight: inherit; line-height: inherit; }
/* Claim letáka: Bricolage 800 (optická veľkosť sa pri veľkom písme nastaví sama), prestrkanie −0,045 em,
   riadkovanie 0,89; šírka 8,6 em drží zalomenie „Upratané / po cisársky.“ ako na letáku */
.upr-hero__claim {
    display: block;
    max-width: 8.6em;
    font-family: var(--upr-display);
    font-weight: 800;
    font-optical-sizing: auto;
    font-size: clamp(2.6rem, 12vw, 5rem);
    line-height: 0.89;
    letter-spacing: -0.045em;
}
/* Kľúčová fráza stránky — podnadpis v bežnom písme webu, súčasť H1; vyvážené riadky (bez osamoteného „a okolí“) */
.upr-hero__sub {
    display: block;
    order: 1;
    margin-top: 14px;
    text-wrap: balance;
    font-family: var(--upr-text);
    font-size: clamp(1.15rem, 3.4vw, 1.45rem);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0;
}
.upr-hero__lead { max-width: 30em; margin-top: 14px; font-size: 1.05rem; line-height: 1.6; }
.upr-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 22px; }
.upr-hero__call { font-size: 1rem; }
.upr-hero__call a { font-weight: 700; white-space: nowrap; text-decoration: underline; text-underline-offset: 3px; }
/* Telefón a e-mail ako textové odkazy — dotyková plocha 44 px bez zmeny výšky riadka (záporný okraj vyrovná
   vnútorný); v hero medzi tlačidlom a riadkom s telefónom je medzera 12 px, plocha tlačidlo neprekryje */
.upr-hero__call a,
.upr-order__call a,
.upr-terms a[href^="mailto:"],
.upr-thanks__text a { display: inline-block; padding: 12px 0; margin: -12px 0; }
.upr-hero__call a:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 2px; }

/* Blok ponuky — krémová karta na žltej (ako zadná strana letáka): akcie s pečiatkou, ceny „od“ a doprava */
.upr-offer {
    min-width: 0;
    max-width: 560px;
    padding: 4px 16px 14px;
    border-radius: var(--upr-radius);
    background: var(--upr-cream);
}
/* Mikulášsky bonus nad cenami: veta, ku ktorej službe bonus patrí, a vpravo pečiatka ako na letáku — akcie prvé
   za polovicu a piate zadarmo sú v páse pod hero. Telefón (360 – 699 px): pečiatka (v DOM prvá) pláva vpravo a veta
   ju obteká po obryse kruhu — čiapka, ktorá presahuje nad blok, vetu neprekryje. Pod 360 px by sa vedľa 136 px kruhu
   nezmestilo ani slovo a veta by prešla celá pod pečiatku s prázdnym rohom vľavo — pečiatka je preto na stred nad
   vetou. Od 700 px flex: veta (order) pred pečiatkou. */
.upr-offer__promo {
    display: flow-root;
    padding: 12px 0 14px;
    border-bottom: 2px solid var(--upr-ink);
}
/* Obrys obtekania = viditeľný kruh (border-box), nie kruh okolo okraja 12 px — pri 360 px sa tak prvé slovo vety
   („K predvianočnému“) zmestí vedľa hornej časti kruhu */
.upr-offer__promo .upr-stamp { float: right; margin: 0 0 6px 12px; shape-outside: circle(50%) border-box; shape-margin: 6px; }
.upr-offer__promo-text { min-width: 0; padding-top: 4px; font-weight: 600; line-height: 1.4; text-wrap: pretty; }
@media (max-width: 359px) {
    .upr-offer__promo .upr-stamp { float: none; width: fit-content; margin: 0 auto 8px; }
}
@media (min-width: 700px) {
    .upr-offer__promo { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; }
    .upr-offer__promo .upr-stamp { float: none; margin: 0; }
    .upr-offer__promo-text { flex: 1 1 9em; order: -1; padding-top: 0; }
}
/* Odznak dopravy ako na letáku v2 — tmavý obdĺžnik: „Doprava“, žltá suma v strede, „v BA a okolí“; široký aj vysoký
   len na text (ako bunka mriežky na tablete nerastie do šírky ani na výšku riadka) */
.upr-offer__transport {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-self: start;
    align-self: start;
    gap: 0 8px;
    width: fit-content;
    max-width: 100%;
    margin-top: 10px;
    padding: 6px 14px 7px;
    background: var(--upr-brown);
    color: var(--upr-on-dark);
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.35;
}
.upr-offer__transport strong {
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 1.3rem;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--upr-yellow);
}

/* Mikulášsky odznak — biely kruh s prerušovaným vnútorným krúžkom, text natočený ako na letáku. Kruh je kontajner
   (container-type), písmo rastie s jeho šírkou (cqi) a neklesne pod čitateľnú veľkosť; rem hodnoty sú pre prehliadače
   bez kontajnerových jednotiek. Celý odznak je odkaz na predvianočné upratovanie, ku ktorému bonus patrí.
   Rozmery: najdlhší riadok „Mikulášsky bonus“ (12 px, ≈ 91 px) musí mať od vnútorného okraja prerušovaného krúžku
   aspoň 2 px — telefón 136 px a okraj 14 px, od 600 px 140 px a 12 px, od 1024 px 144 px; prerušovaný krúžok
   −7 px od okraja (na desktope −9 px). Bližšie ako −7 px by sa zlepil s plným okrajom (inset 2 px). */
.upr-stamp { display: block; flex-shrink: 0; margin: 0; color: inherit; text-decoration: none; }
.upr-stamp:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 4px; border-radius: 50%; }
.upr-stamp__ring {
    position: relative;
    container-type: inline-size;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 136px;
    aspect-ratio: 1;
    padding: 14px;
    border-radius: 50%;
    background: var(--upr-white);
    box-shadow: inset 0 0 0 2px var(--upr-brown);
    outline: 2px dashed var(--upr-line-strong);
    outline-offset: -7px;
    text-align: center;
    line-height: 1;
    transform: rotate(-12deg);
}
/* Mikulášska čiapka na odznaku ako na letáku — leží na hornom okraji kruhu vpravo a otáča sa s ním; presahuje hore,
   doprava len málo (blok ponuky má vpravo vnútorný okraj, stránka sa nesmie rozšíriť) */
.upr-stamp__cap {
    position: absolute;
    top: -40%;
    right: -12%;
    width: 86%;
    height: auto;
    pointer-events: none;
}
/* Na mobile je odznak v pravom hornom rohu bloku ponuky a čiapka presahuje nad blok — väčší odstup od telefónu nad
   ním (tablet a desktop to rušia nižšie) */
.upr-offer:has(.upr-stamp) { margin-top: 12px; }
/* Drobné riadky („Mikulášsky bonus“, „do 6. 12.“ — termín akcie) aspoň 12 px, aby boli čitateľné aj natočené */
.upr-stamp__small { font-size: 0.75rem; font-size: max(12px, 9.5cqi); font-weight: 600; letter-spacing: -0.01em; }
.upr-stamp__mid {
    margin-top: 2px;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 0.78rem;
    font-size: max(12.5px, 12.5cqi);
    letter-spacing: -0.02em;
}
.upr-stamp__big {
    margin: 1px 0 2px;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 1rem;
    font-size: 17cqi;
    letter-spacing: -0.02em;
    text-transform: uppercase;
}

/* Ceny „od“ — riadok názov a popis vľavo, cena vpravo; celý riadok je odkaz na časť cenníka */
.upr-cards { margin: 0; padding: 0; list-style: none; }
.upr-cards li + li .upr-card { border-top: 1px solid var(--upr-line); }
.upr-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 2px 16px;
    padding: 12px 0;
    text-decoration: none;
}
.upr-card__name { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
/* Stromček pri predvianočnej cene ako na letáku (ozdoba vedľa názvu); pod 360 px sa vedľa názvu nezmestí a sám
   by sa zalomil na ďalší riadok, preto sa skryje */
.upr-card__tree { display: inline-block; width: auto; height: 1.6em; margin: -0.4em 0 -0.2em 0.5em; vertical-align: -0.1em; }
@media (max-width: 359px) {
    .upr-card__tree { display: none; }
}
.upr-card__price {
    grid-column: 2;
    grid-row: 1 / span 2;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: clamp(1.6rem, 6vw, 1.9rem);
    line-height: 1;
    letter-spacing: -0.035em;
    white-space: nowrap;
}
.upr-card__desc { font-size: 0.95rem; color: var(--upr-ink-soft); }
.upr-card:hover .upr-card__price { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.upr-card:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 4px; border-radius: 2px; }

@media (min-width: 600px) {
    .upr-hero { padding: 40px 0 44px; }
    .upr-offer { padding: 8px 28px 18px; }
    .upr-stamp__ring { width: 140px; padding: 12px; }
}

/* Tablet: blok ponuky na celú šírku, veta bonusu s pečiatkou pod ňou ako ľavý stĺpec vedľa cien (kým Mikulášsky
   bonus platí) */
@media (min-width: 700px) and (max-width: 1023px) {
    .upr-offer:has(.upr-offer__promo:not([hidden])) {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
        column-gap: 28px;
        max-width: none;
        padding-top: 18px;
    }
    .upr-offer__promo {
        grid-row: 1 / span 2;
        flex-direction: column;
        justify-content: center;
        padding: 0 24px 0 0;
        border-bottom: 0;
        border-right: 2px solid var(--upr-ink);
    }
    /* Veta nad pečiatkou — v stĺpci nerastie do výšky (flex-basis by platil zvislo) */
    .upr-offer__promo-text { flex: none; }
    /* Miesto pre čiapku nad odznakom (pod vetou) — čiapka vetu neprekryje a nad blok ponuky nepresahuje */
    .upr-offer__promo .upr-stamp { margin-top: 56px; }
    .upr-offer:has(.upr-stamp) { margin-top: 0; }
    .upr-offer:has(.upr-offer__promo:not([hidden])) .upr-cards,
    .upr-offer:has(.upr-offer__promo:not([hidden])) .upr-offer__transport { grid-column: 2; }
}

/* Dva stĺpce: blok ponuky vpravo v pevnej šírke, zvislo na stred voči textu */
@media (min-width: 1024px) {
    .upr-hero { padding: 48px 0 56px; }
    .upr-hero__inner { grid-template-columns: minmax(0, 1fr) minmax(360px, 420px); gap: 56px; align-items: center; }
    .upr-hero__lead { font-size: 1.1rem; }
    .upr-hero__actions { margin-top: 28px; }
    .upr-offer { max-width: none; }
    .upr-offer:has(.upr-stamp) { margin-top: 0; }
    .upr-stamp__ring { width: 144px; outline-offset: -9px; }
}

/* ---------- PÁS AKCIE ---------- */
.upr-promo { background: var(--upr-brown); color: var(--upr-on-dark); padding: 44px 0 40px; }
/* Menší ako claim H1 v hero v každej šírke — na letáku je „Upratané po cisársky.“ zreteľne dominantný */
.upr-promo__title {
    margin: 0;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: clamp(1.8rem, 6.6vw, 3.2rem);
    line-height: 0.95;
    letter-spacing: -0.04em;
    color: var(--upr-yellow);
}
.upr-promo__title span { display: block; }
/* Päť krúžkov v jednom riadku aj na 320 px — veľkosť písma rastie so šírkou displeja */
.upr-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    max-width: 720px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
}
/* Krúžok hore, popis pod ním; krúžky v jednej výške aj pri popise na viac riadkov (justify-content: flex-end je
   pri column-reverse horný okraj). V DOM je medzi popisom a krúžkom medzera (text bez CSS) — vo flex kontajneri
   sa nevykreslí. */
.upr-step { display: flex; flex-direction: column-reverse; justify-content: flex-end; align-items: center; gap: 10px; text-align: center; }
.upr-step__ring {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 104px;
    aspect-ratio: 1;
    border: 2px dashed var(--upr-line-dark);
    border-radius: 50%;
    color: var(--upr-yellow);
}
.upr-step__crown { width: 52%; height: auto; }
.upr-step__label { font-size: clamp(0.75rem, 3.2vw, 0.92rem); font-weight: 600; line-height: 1.2; color: var(--upr-on-dark); }
.upr-step--half .upr-step__ring {
    border: 0;
    background: var(--upr-yellow);
    color: var(--upr-ink);
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: clamp(0.82rem, 4.2vw, 1.75rem);
    letter-spacing: -0.03em;
    white-space: nowrap;
}
/* Piaty krúžok — slovo „zadarmo“ je v texte stránky raz, v popise (.upr-step__free-label). Na telefóne (do 599 px)
   plný žltý krúžok s korunou a slovo v popise pod ním (v malom krúžku by bolo drobné); od 600 px krémový krúžok
   so slovom ZADARMO ako na letáku — ozdoba z atribútu data-word (alternatívny text "" — čítačky ju vynechajú,
   nie je ani v texte stránky), popis so slovom ostáva vizuálne skrytý pre čítačky (vzor .sr-only v style.css) */
.upr-step--free .upr-step__ring { border: 0; background: var(--upr-yellow); color: var(--upr-ink); }
@media (min-width: 600px) {
    .upr-step--free .upr-step__crown { display: none; }
    .upr-step__free-label {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }
    .upr-step--free .upr-step__ring::after {
        content: attr(data-word);
        content: attr(data-word) / "";
        display: inline-block;
        transform: rotate(-14deg);
    }
    .upr-step--free .upr-step__ring {
        border: 3px solid var(--upr-yellow);
        background: var(--upr-cream);
        font-family: var(--upr-display);
        font-weight: 800;
        font-size: max(13px, 2.25vw);
        text-transform: uppercase;
    }
}
.upr-promo__note { max-width: 46em; margin-top: 24px; font-size: 0.95rem; line-height: 1.6; color: var(--upr-on-dark-soft); }
.upr-promo__note a { color: var(--upr-on-dark); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.upr-promo__note a:focus-visible { outline: 3px solid var(--upr-yellow); outline-offset: 2px; }
/* Od 1024 px jeden riadok cez celú šírku kontajnera: vľavo nadpis s poznámkou, vpravo päť krúžkov — pravá časť pásu
   nesmie ostať prázdna (Roman 6. 11.). Krúžky rastú so stĺpcom až do 132 px, poradie v DOM ostáva (nadpis, krúžky,
   poznámka) a mriežka ho rozloží cez oblasti. */
@media (min-width: 1024px) {
    .upr-promo { padding: 48px 0; }
    .upr-promo .container {
        display: grid;
        /* Ľavý stĺpec podľa nadpisu (riadky nadpisu sa nezalomia), najviac 40 % — poznámka sa zalomí v ňom */
        grid-template-columns: fit-content(40%) minmax(0, 1fr);
        grid-template-areas: "title steps" "note steps";
        grid-template-rows: auto 1fr;
        column-gap: 56px;
        align-items: center;
    }
    .upr-promo__title { grid-area: title; align-self: end; font-size: clamp(2.4rem, 3.4vw, 3.2rem); }
    .upr-promo__title span { white-space: nowrap; }
    .upr-steps { grid-area: steps; max-width: none; margin: 0; gap: 12px; }
    .upr-step__ring { max-width: 132px; }
    .upr-step__label { font-size: 0.95rem; }
    .upr-step--half .upr-step__ring { font-size: clamp(1.45rem, 2.1vw, 2rem); }
    .upr-step--free .upr-step__ring { font-size: clamp(0.85rem, 1.15vw, 1.1rem); }
    .upr-promo__note { grid-area: note; align-self: start; margin-top: 18px; }
}

/* ---------- SEKCIE ---------- */
.upr-section { padding: 56px 0; }
.upr-section--cream { background: var(--upr-cream); color: var(--upr-ink); }
.upr-section--dark { background: var(--upr-brown); color: var(--upr-on-dark); }
.upr-sectionhead { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; margin-bottom: 28px; }
.upr-sectionhead__note { font-size: 0.95rem; color: var(--upr-ink-soft); }

@media (min-width: 900px) {
    .upr-section { padding: 88px 0; }
}

/* Štítok (Doprava 0 € v BA a okolí) a žltý pruh pod tabuľkou */
.upr-tag { display: inline-block; padding: 6px 12px; background: var(--upr-yellow); font-weight: 600; font-size: 0.9rem; }
.upr-strip {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 4px 20px;
    margin-top: 16px;
    padding: 10px 14px;
    background: var(--upr-yellow);
    color: var(--upr-ink);
    font-weight: 600;
    font-size: 0.95rem;
}
/* Pruh Mikulášskeho bonusu v predvianočnej sekcii — cez oba stĺpce mriežky, ale len taký široký ako text (ako na
   letáku); v úzkom okne sa zalomí v šírke stĺpca */
.upr-strip--wide { grid-column: 1 / -1; justify-self: start; justify-content: flex-start; width: fit-content; max-width: 100%; }

/* ---------- CENNÍK ---------- */
.upr-pricehead {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 10px 20px;
    padding-bottom: 16px;
    margin-bottom: 32px;
    border-bottom: 2px solid var(--upr-ink);
}
.upr-pricehead__vat { font-size: 0.95rem; }
/* DPH a doprava spolu v jednom riadku vedľa nadpisu (ako na letáku), v úzkom okne pod nadpisom */
.upr-pricehead__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }

/* Tabuľky cenníka — riadky ako dvojice popis / cena, na 320 px bez vodorovného posuvu */
.upr-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.upr-table th,
.upr-table td { padding: 9px 0; border-bottom: 1px solid var(--upr-line); text-align: left; vertical-align: baseline; }
.upr-table th { font-weight: 400; color: inherit; padding-right: 12px; }
.upr-table td { text-align: right; white-space: nowrap; font-weight: 700; }
.upr-table--lg td { font-family: var(--upr-display); font-weight: 800; font-size: 1.5rem; letter-spacing: -0.02em; }
.upr-table--compact th,
.upr-table--compact td { padding: 7px 0; font-size: 0.95rem; }
/* Poznámka skupiny cez obe bunky — špecificita 0,2,0 prebije .upr-table td aj .upr-table--compact td */
.upr-table .upr-table__note { text-align: left; white-space: normal; font-weight: 400; color: var(--upr-ink-soft); }
.upr-table--dark th,
.upr-table--dark td { border-bottom-color: var(--upr-line-dark); }
.upr-table--dark td { color: var(--upr-on-dark); }

.upr-onetime { display: grid; gap: 24px; }
.upr-onetime__lead { margin-top: 12px; font-size: 1.05rem; line-height: 1.6; }
.upr-onetime__text .upr-muted { margin-top: 10px; line-height: 1.6; }

/* Paušál — tri balíky */
.upr-pausal { margin-top: 56px; }
.upr-pausal__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin-bottom: 26px; }
.upr-pausal__tagline { font-weight: 500; }
/* Časti hesla („bez viazanosti“) sa nezalomia vnútri — riadok sa láme len za „·“ */
.upr-pausal__tagline span { white-space: nowrap; }
/* Poznámka o ploche pod nadpisom ako na letáku v2 — vlastný riadok nad kartami */
.upr-pausal__note { flex-basis: 100%; font-size: 0.95rem; color: var(--upr-ink-soft); }
/* Najužšie telefóny (do 359 px): „pravidelné upratovanie“ je spojené nedeliteľnou medzerou a pri plnej veľkosti
   nadpisu by presahovalo textový stĺpec až k okraju okna (pri 320 px o 19 px) — menší nadpis sa zmestí (2.15.0) */
@media (max-width: 359px) {
    .upr-pausal__head .upr-h3 { font-size: 1.45rem; }
}
.upr-packages { display: grid; gap: 22px; margin: 0; padding: 0; list-style: none; }
.upr-package { position: relative; padding: 24px 20px 20px; border: 2px solid var(--upr-ink); background: var(--upr-white); }
.upr-package--kral { background: var(--upr-yellow); border-color: var(--upr-yellow); }
.upr-package--cisar { background: var(--upr-brown); border-color: var(--upr-brown); color: var(--upr-on-dark); }
.upr-package__flag {
    position: absolute;
    top: -13px;
    left: 18px;
    padding: 4px 10px;
    background: var(--upr-brown);
    color: var(--upr-yellow);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
/* Hlavička karty: názov a frekvencia; dlhšie názvy letáka v2 (KRÁĽOVSKÝ) majú menší rozostup písmen a v úzkej
   karte sa frekvencia zalomí pod názov */
.upr-package__top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 12px; }
.upr-package__name { margin: 0; font-family: inherit; font-size: 0.95rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: inherit; }
.upr-package__freq { font-size: 0.9rem; font-weight: 600; }
.upr-package__price { display: flex; align-items: baseline; gap: 8px; margin: 14px 0 16px; }
.upr-package__price strong { font-family: var(--upr-display); font-weight: 800; font-size: 3rem; line-height: 1; letter-spacing: -0.045em; }
.upr-package__price span { font-weight: 600; }
.upr-package--cisar .upr-package__price strong { color: var(--upr-yellow); }
.upr-package__lines { margin: 0; padding: 12px 0 0; list-style: none; border-top: 1px solid var(--upr-line); line-height: 1.6; }
.upr-package--cisar .upr-package__lines { border-top-color: var(--upr-line-dark); }
/* Úspora („namiesto 79 € · −25 %“) tučne ako na letáku */
.upr-package--princ .upr-package__lines li:last-child,
.upr-package--kral .upr-package__lines li:last-child { font-weight: 700; }

@media (min-width: 760px) {
    .upr-packages { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 900px) {
    .upr-onetime { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: start; }
    .upr-pausal { margin-top: 80px; }
}

/* ---------- PREDVIANOČNÉ ---------- */
.upr-xmas { display: grid; gap: 24px; }
.upr-xmas__lead { margin-top: 16px; font-size: 1.05rem; line-height: 1.6; color: var(--upr-on-dark-soft); }
.upr-xmas__gift { display: inline-flex; align-items: center; gap: 10px; margin-top: 18px; font-weight: 600; color: var(--upr-on-dark); }
.upr-xmas__gift i { color: var(--upr-yellow); }
.upr-section--dark .upr-link { color: var(--upr-on-dark); }
.upr-section--dark .upr-link:focus-visible { outline-color: var(--upr-yellow); }

@media (min-width: 900px) {
    .upr-xmas { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 24px 64px; align-items: start; }
}

/* ---------- SLUŽBY NAVYŠE A KARTY ---------- */
.upr-extras { display: grid; gap: 28px; }
.upr-extras__group .upr-h4 { margin-bottom: 6px; }

@media (min-width: 600px) {
    .upr-extras { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
}
@media (min-width: 1100px) {
    .upr-extras { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.upr-benefits { display: grid; gap: 16px; margin: 48px 0 0; padding: 0; list-style: none; }
.upr-benefit { padding: 22px 20px; background: var(--upr-white); border-top: 4px solid var(--upr-yellow); }
.upr-benefit__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--upr-brown);
    color: var(--upr-yellow);
    font-size: 1.05rem;
}
.upr-benefit__title {
    margin: 14px 0 6px;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: inherit;
    line-height: 1.3;
}
.upr-benefit p { line-height: 1.6; }

/* Od 760 px tri karty vedľa seba — ikona, nadpis a text v spoločných riadkoch mriežky (subgrid): texty začínajú
   v rovnakej výške, aj keď sa jeden nadpis („Garancia spokojnosti“) zalomí na dva riadky */
@media (min-width: 760px) {
    .upr-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
    .upr-benefit { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; align-content: start; }
    .upr-benefit__icon { justify-self: start; }
}

/* ---------- OBJEDNÁVKA ---------- */
.upr-order { padding: 56px 0 72px; background: var(--upr-white); }
.upr-order__head { max-width: 40em; margin-bottom: 28px; }
.upr-order__lead { margin-top: 12px; font-size: 1.05rem; line-height: 1.6; }
.upr-order__call { margin-top: 8px; }
.upr-order__call a { font-weight: 700; white-space: nowrap; text-decoration: underline; text-underline-offset: 3px; }

.upr-form__grid { display: grid; gap: 8px; }
.upr-form__main { min-width: 0; }

/* Honeypot — mimo obrazovky aj čítačiek (aria-hidden na obale) */
.upr-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Súhrn chýb nad formulárom */
.upr-form__errors {
    margin-bottom: 24px;
    padding: 16px 18px;
    border-left: 4px solid var(--upr-error);
    background: var(--upr-error-bg);
    color: var(--upr-ink);
}
.upr-form__errors:focus { outline: 3px solid var(--upr-error); outline-offset: 2px; }
.upr-form__errors-title { font-weight: 700; margin-bottom: 6px; }
.upr-form__errors ul { margin: 0; padding-left: 20px; list-style: disc; line-height: 1.6; }
.upr-form__errors a { color: var(--upr-error); font-weight: 600; text-decoration: underline; }

.upr-fieldset { min-width: 0; margin: 0 0 32px; padding: 0; border: 0; }
.upr-fieldset:disabled { display: none; }
.upr-legend {
    display: block;
    width: 100%;
    margin-bottom: 14px;
    padding: 0;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 1.4rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: var(--upr-ink);
}
.upr-legend__hint {
    display: inline-block;
    margin-left: 4px;
    font-family: var(--upr-text);
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--upr-ink-soft);
}
/* Dlhá poznámka služieb navyše — vždy na vlastnom riadku pod nadpisom (zalomená v riadku nadpisu by bola odsadená
   o margin-left a natesno) */
.upr-legend__hint[data-upr-extras-hint] {
    display: block;
    margin: 4px 0 0;
    line-height: 1.35;
}
.upr-subfieldset { min-width: 0; margin: 18px 0 0; padding: 0; border: 0; }

/* Voľby ako karty (služba, balík) — celá karta je cieľ dotyku */
.upr-choices { display: grid; gap: 10px; }
.upr-choice {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-height: 56px;
    padding: 14px 16px;
    border: 1.5px solid var(--upr-line-strong);
    border-radius: 10px;
    background: var(--upr-white);
    cursor: pointer;
    transition: border-color var(--transition), background var(--transition);
}
.upr-choice input,
.upr-check input,
.upr-segment__item input,
.upr-chip input {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin: 1px 0 0;
    accent-color: var(--upr-brown);
    cursor: pointer;
}
.upr-choice:hover { border-color: var(--upr-brown); }
.upr-choice:has(input:checked) { border-color: var(--upr-brown); background: var(--upr-cream); box-shadow: inset 0 0 0 1px var(--upr-brown); }
.upr-choice:has(input:focus-visible),
.upr-check:has(input:focus-visible),
.upr-segment__item:has(input:focus-visible),
.upr-chip:has(input:focus-visible) { outline: 3px solid var(--upr-brown); outline-offset: 2px; }
.upr-choice__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.upr-choice__title { font-weight: 600; line-height: 1.3; }
.upr-choice__title--caps { letter-spacing: 0.06em; text-transform: uppercase; }
.upr-choice__hint { font-size: 0.9rem; color: var(--upr-ink-soft); line-height: 1.35; }

@media (min-width: 560px) {
    .upr-choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 700px) {
    .upr-choices--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Byt / dom — dve rovnaké tlačidlá vedľa seba */
.upr-segment { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; max-width: 360px; }
.upr-segment__item,
.upr-chip {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 50px;
    padding: 10px 14px;
    border: 1.5px solid var(--upr-line-strong);
    border-radius: 10px;
    background: var(--upr-white);
    font-weight: 600;
    cursor: pointer;
}
.upr-segment__item:has(input:checked),
.upr-chip:has(input:checked) { border-color: var(--upr-brown); background: var(--upr-cream); box-shadow: inset 0 0 0 1px var(--upr-brown); }
.upr-chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.upr-chip { font-weight: 500; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Najužšie telefóny (do 379 px): v dvoch stĺpcoch by sa čas „12:00 – 14:00“ do voľby nezmestil — jeden stĺpec */
@media (max-width: 379px) {
    .upr-chips { grid-template-columns: minmax(0, 1fr); }
}
@media (min-width: 560px) {
    .upr-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Polia — písmo 16 px (iOS pri menšom priblíži stránku), výška ≥ 44 px */
.upr-field { margin-top: 16px; min-width: 0; }
/* Prvé pole hneď pod nadpisom skupiny — odstup dáva legenda (14 px) ako pri voľbách */
.upr-legend + .upr-field,
.upr-legend + .upr-row > .upr-field:first-child { margin-top: 0; }
/* Krátke polia (plocha, hodnota poukazu) — úzky je len vstup, nápoveda a chyba majú šírku stĺpca */
.upr-field--short .upr-input,
.upr-field--area .upr-input { max-width: 240px; }
.upr-field--short .upr-field__hint,
.upr-field--area .upr-field__hint { max-width: 34em; }
.upr-label { display: block; margin-bottom: 6px; padding: 0; font-size: 0.95rem; font-weight: 600; color: var(--upr-ink); }
.upr-label__opt { font-weight: 400; color: var(--upr-ink-soft); }
.upr-label__opt::before { content: '· '; }
.upr-input {
    display: block;
    width: 100%;
    min-height: 50px;
    padding: 11px 14px;
    border: 1.5px solid var(--upr-line-strong);
    border-radius: var(--upr-radius-sm);
    background: var(--upr-white);
    color: var(--upr-ink);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.4;
}
.upr-input:focus { outline: 3px solid var(--upr-brown); outline-offset: 1px; border-color: var(--upr-brown); }
.upr-input::placeholder { color: var(--upr-ink-soft); opacity: 1; }
.upr-input--area { min-height: 96px; resize: vertical; }
.upr-input[aria-invalid="true"] { border-color: var(--upr-error); box-shadow: inset 0 0 0 1px var(--upr-error); }
.upr-choice:has(input[aria-invalid="true"]),
.upr-segment__item:has(input[aria-invalid="true"]),
.upr-chip:has(input[aria-invalid="true"]) { border-color: var(--upr-error); }
.upr-field__hint { margin-top: 8px; font-size: 0.9rem; line-height: 1.5; color: var(--upr-ink-soft); }
.upr-field-error { margin-top: 8px; font-size: 0.92rem; font-weight: 600; line-height: 1.4; color: var(--upr-error); }
.upr-field-error:empty { display: none; }
.upr-field-error::before {
    content: '\f06a';
    margin-right: 6px;
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
}
.upr-row { display: grid; gap: 0 16px; }

@media (min-width: 560px) {
    .upr-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* Dve polia vedľa seba pod nadpisom — obe bez horného odstupu (na mobile má druhé pole riadka svojich 16 px) */
    .upr-legend + .upr-row > .upr-field { margin-top: 0; }
    .upr-row--city { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
}

/* Pole dátumu a kalendár — pole je textové v slovenskom tvare „pi 13. 11. 2026“ (bez JS sa píše, návod pod poľom);
   s JS pribudne v poli tlačidlo s ikonou (.upr-date--js) a dialóg kalendára (js/upratovanie.js — createCalendar).
   Desktop: dialóg vyskočí pod poľom, absolútne v .upr-date (predkovia formulára nič neorezávajú), pri pravom okraji
   okna sa zarovná doprava (.upr-cal--end). Do 600 px spodný panel cez showModal() v hornej vrstve, bunky 44 px,
   písmo 16 px. Vybraný deň žltý ako kampaň s tmavým okrajom (samotná žltá má na bielej len 1,77 : 1), preferovaný
   dátum v kalendári náhradného s čiarkovaným obrysom, dnešok (vždy neaktívny — najskôr zajtra) len podčiarknutý,
   aby nepôsobil ako vybraný či fokus; dni mimo rozsahu sivé. */
.upr-date { position: relative; }
.upr-date--js .upr-date__input { padding-right: 54px; }
.upr-date__btn {
    position: absolute;
    top: 3px;
    right: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--upr-ink);
    font-size: 1.15rem;
    cursor: pointer;
    touch-action: manipulation;
}
.upr-date__btn:hover { background: var(--upr-cream); }
.upr-date__btn:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 0; }
.upr-date__btn[aria-expanded="true"] { background: var(--upr-yellow); }

.upr-cal {
    position: absolute;
    inset: calc(100% + 6px) auto auto 0;
    z-index: 40;
    width: max-content;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 1.5px solid var(--upr-brown);
    border-radius: var(--upr-radius);
    background: var(--upr-white);
    color: var(--upr-ink);
    box-shadow: 0 18px 40px var(--upr-shadow);
}
.upr-cal--end { inset: calc(100% + 6px) 0 auto auto; }
.upr-cal__box { padding: 14px 14px 8px; }
.upr-cal__heading { display: none; }
.upr-cal__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.upr-cal__title {
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 1.15rem;
    line-height: 1.2;
    letter-spacing: -0.01em;
    text-align: center;
}
.upr-cal__nav {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1.5px solid var(--upr-line-strong);
    border-radius: var(--upr-radius-sm);
    background: var(--upr-white);
    color: var(--upr-ink);
    font-size: 0.95rem;
    cursor: pointer;
    touch-action: manipulation;
}
.upr-cal__nav:hover:not(:disabled) { border-color: var(--upr-brown); background: var(--upr-cream); }
.upr-cal__nav:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 2px; }
.upr-cal__nav:disabled { border-color: var(--upr-line); color: var(--upr-ink-disabled); cursor: default; }
.upr-cal__grid { border-collapse: separate; border-spacing: 2px; table-layout: fixed; }
.upr-cal__grid th {
    width: 42px;
    height: 32px;
    padding: 0;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--upr-ink-soft);
    text-align: center;
    vertical-align: middle;
}
.upr-cal__day,
.upr-cal__pad { width: 42px; height: 42px; padding: 0; }
.upr-cal__day {
    border-radius: var(--upr-radius-sm);
    font-size: 1rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}
.upr-cal__day:hover { background: var(--upr-cream); }
.upr-cal__day:focus { outline: none; }
.upr-cal__day:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: -2px; }
/* Preferovaný dátum — fokus (0,2,0) ho pri fokuse prebije */
.upr-cal__day--ref { background: var(--upr-cream); outline: 2px dashed var(--upr-brown); outline-offset: -4px; }
.upr-cal__day[aria-current="date"] { font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
/* Vybraný deň — farba letáka a tmavý okraj (13 : 1) */
.upr-cal__day[aria-selected="true"] { background: var(--upr-yellow); box-shadow: inset 0 0 0 2px var(--upr-brown); font-weight: 800; }
.upr-cal__day[aria-disabled="true"] { background: none; color: var(--upr-ink-disabled); cursor: default; }
/* Vynútené farby (Windows) — výplne zmiznú, vybraný deň a preferovaný dátum ostanú odlíšené systémovými farbami */
@media (forced-colors: active) {
    .upr-cal__day[aria-selected="true"] { forced-color-adjust: none; background: Highlight; color: HighlightText; }
    .upr-cal__day--ref { outline-color: CanvasText; }
}
.upr-cal__foot { display: flex; justify-content: flex-end; margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--upr-line); }
.upr-cal__cancel {
    min-height: 44px;
    padding: 0 14px;
    border: 0;
    border-radius: var(--upr-radius-sm);
    background: none;
    color: var(--upr-ink);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.upr-cal__cancel:hover { background: var(--upr-cream); }
.upr-cal__cancel:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 0; }

@media (max-width: 600px) {
    .upr-cal {
        position: fixed;
        inset: auto 0 0 0;
        width: 100%;
        max-height: 100%;
        overflow-y: auto;
        border: 0;
        border-radius: 18px 18px 0 0;
        box-shadow: 0 -12px 32px var(--upr-shadow-sheet);
        overscroll-behavior: contain;
    }
    /* Záloha pre prehliadače, v ktorých ::backdrop nededí vlastné vlastnosti z :root */
    .upr-cal::backdrop { background: var(--upr-backdrop, rgba(36, 29, 28, 0.5)); }
    .upr-cal__box { max-width: 440px; margin: 0 auto; padding: 14px 6px calc(10px + env(safe-area-inset-bottom)); }
    .upr-cal__heading { display: block; margin: 0 8px 8px; font-size: 1rem; font-weight: 600; color: var(--upr-ink-soft); }
    .upr-cal__head { padding: 0 2px; }
    .upr-cal__grid { width: 100%; border-spacing: 0; }
    .upr-cal__grid th { width: auto; height: 36px; font-size: 1rem; }
    .upr-cal__day,
    .upr-cal__pad { width: auto; height: 46px; }
    .upr-cal__foot { margin: 6px 2px 0; }
}

/* Zaškrtávacie voľby — služby navyše a prvé upratanie */
.upr-check {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 6px 0;
    cursor: pointer;
}
.upr-check__label { flex: 1 1 auto; line-height: 1.35; }
.upr-check__price { display: flex; flex-direction: column; align-items: flex-end; flex-shrink: 0; font-weight: 700; white-space: nowrap; text-align: right; }
.upr-check__incl { flex-shrink: 0; padding: 2px 8px; background: var(--upr-yellow); font-size: 0.8rem; font-weight: 700; }
.upr-check:has(input:disabled) { cursor: default; }
.upr-check:has(input:disabled) .upr-check__label,
.upr-check:has(input:disabled) .upr-check__price { color: var(--upr-ink-soft); }

/* Služba navyše s počtom — riadok (políčko, názov, cena vpravo) vyzerá bez zaškrtnutia ako ostatné; po zaškrtnutí
   (data-upr-on z formulára a js/upratovanie.js) sa pod názvom ukáže výber počtu − 1 + s jednotkou a cena vpravo je
   súčet riadka s drobným rozpisom „3 × 9 €“ (riadok rozpisu je rezervovaný už pri 1 kuse — výška sa nemení). Stĺpce služieb navyše sú úzke (260 – 350 px), preto je výber počtu
   vždy na vlastnom riadku, odsadený na začiatok názvu (políčko 20 px + medzera 10 px). Bez JS ho ukazuje
   css/noscript.css pri každej položke s počtom (tlačidlá − a + skrýva). */
.upr-check__calc { font-size: 0.82rem; font-weight: 500; line-height: 1.3; color: var(--upr-ink-soft); font-variant-numeric: tabular-nums; }
.upr-check__calc:empty { display: none; }
/* Položka s počtom: miesto pre rozpis „2 × 9 €“ je rezervované už pri 1 kuse — ovládanie − 1 + sa pri ťukaní
   neposúva a v dvoch stĺpcoch ostávajú ovládania susedných položiek v jednej línii (0,5,0 prebije pravidlo vyššie) */
.upr-extra[data-upr-on]:has(.upr-qty) .upr-check__calc:empty { display: block; min-height: 1.3em; }
.upr-qty { display: none; align-items: center; gap: 0; margin: 0 0 10px 30px; }
.upr-extra[data-upr-on] .upr-qty { display: flex; }
/* Zaškrtnutý riadok s rozpisom má cenu na dva riadky — políčko, názov a suma ostanú na línii prvého riadka */
.upr-extra[data-upr-on] .upr-check { align-items: flex-start; }
.upr-extra[data-upr-on] .upr-check input { margin-top: 2px; }
.upr-extra .upr-field-error { margin: 0 0 10px 30px; }
.upr-qty__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1.5px solid var(--upr-line-strong);
    background: var(--upr-white);
    color: var(--upr-ink);
    font-size: 0.9rem;
    cursor: pointer;
    transition: background var(--transition), border-color var(--transition);
}
.upr-qty__btn:first-of-type { border-radius: var(--upr-radius-sm) 0 0 var(--upr-radius-sm); }
.upr-qty__btn:last-of-type { border-radius: 0 var(--upr-radius-sm) var(--upr-radius-sm) 0; }
.upr-qty__btn:hover { background: var(--upr-cream); border-color: var(--upr-brown); }
.upr-qty__btn:focus-visible { position: relative; z-index: 1; outline: 3px solid var(--upr-brown); outline-offset: 1px; }
.upr-qty__btn[aria-disabled="true"] { color: var(--upr-ink-soft); background: var(--upr-white); border-color: var(--upr-line-strong); cursor: default; }
.upr-qty__input {
    width: 56px;
    height: 44px;
    margin: 0 -1.5px;
    padding: 0 4px;
    border: 1.5px solid var(--upr-line-strong);
    border-radius: 0;
    background: var(--upr-white);
    color: var(--upr-ink);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: center;
    -moz-appearance: textfield;
    appearance: textfield;
}
/* Šípky poľa type=number nahrádzajú tlačidlá − a + (bez JS ich vracia css/noscript.css) */
.upr-qty__input::-webkit-inner-spin-button,
.upr-qty__input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.upr-qty__input:focus { position: relative; z-index: 1; outline: 3px solid var(--upr-brown); outline-offset: 1px; border-color: var(--upr-brown); }
.upr-qty__input[aria-invalid="true"] { position: relative; z-index: 1; border-color: var(--upr-error); box-shadow: inset 0 0 0 1px var(--upr-error); }
.upr-qty__unit { margin-left: 10px; font-weight: 600; color: var(--upr-ink-soft); }
.upr-check--promo {
    margin-top: 18px;
    padding: 12px 14px;
    background: var(--upr-yellow);
    border-radius: 10px;
}
.upr-check__note { font-size: 0.9rem; }
.upr-checks { margin: 0; padding: 0; list-style: none; }
.upr-checks li + li { border-top: 1px solid var(--upr-line); }
.upr-extras-form { display: grid; gap: 18px; }
/* Viditeľná nápoveda (predvianočné, balík CISÁRSKY) sa nesmie lepiť na nadpis prvej skupiny; skrytá odstup nepridá */
.upr-field__hint:not([hidden]) ~ .upr-extras-form { margin-top: 16px; }
/* Nápoveda minimálnej objednávky pod skupinami — oddelená od nápovedy prádla nad ňou (inak sa čítajú ako jeden odsek) */
.upr-extras-form + .upr-field__hint { margin-top: 18px; }
.upr-extras-form__title { margin-bottom: 2px; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }

@media (min-width: 560px) {
    .upr-extras-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 28px; }
}

/* Súhrn ceny — na mobile pod formulárom pred tlačidlom, na počítači prilepený bočný panel */
.upr-summary { padding: 20px; border-radius: var(--upr-radius); background: var(--upr-cream); color: var(--upr-ink); }
.upr-summary__title {
    margin: 0 0 12px;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 1.35rem;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: inherit;
}
.upr-summary__pending { color: var(--upr-ink-soft); line-height: 1.5; }
.upr-summary__lines { margin: 0; padding: 0; list-style: none; }
.upr-summary__line { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--upr-line); line-height: 1.4; }
/* Zoznam je posledný, keď za ním nejde súčet, termín ani poznámky (bezplatná obhliadka) — bez čiary pod ničím */
.upr-summary__lines:last-child .upr-summary__line:last-child { border-bottom: 0; }
.upr-summary__label { min-width: 0; }
.upr-summary__value { flex-shrink: 0; font-weight: 700; white-space: nowrap; text-align: right; }
.upr-summary__line--discount .upr-summary__value,
.upr-summary__line--bonus .upr-summary__value { color: var(--upr-ink); background: var(--upr-yellow); padding: 0 6px; }
.upr-summary__line--extra .upr-summary__label,
.upr-summary__line--info .upr-summary__label { color: var(--upr-ink-soft); }
.upr-summary__total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 14px; }
.upr-summary__total-label { font-weight: 600; }
.upr-summary__total-value {
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 1.9rem;
    line-height: 1.05;
    letter-spacing: -0.03em;
    text-align: right;
}
/* Súčet bez čísla (paušál na mieru — „po bezplatnej obhliadke“) — text v písme webu, nie veľká suma */
.upr-summary__total-value--text {
    font-family: inherit;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1.35;
}
.upr-summary__when { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--upr-line); line-height: 1.5; }
/* Termín hneď za zoznamom je len pri bezplatnej obhliadke (bez súčtu) — oddelí ho spodná čiara posledného riadka,
   druhá čiara 12 px pod ňou by bola navyše */
.upr-summary__lines + .upr-summary__when { margin-top: 0; border-top: 0; }
.upr-summary__when-label { display: block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.upr-summary__notes { margin: 12px 0 0; padding: 0; list-style: none; font-size: 0.9rem; line-height: 1.5; color: var(--upr-ink-soft); }
.upr-summary__notes li + li { margin-top: 4px; }
.upr-summary__vat { margin-top: 12px; font-size: 0.85rem; color: var(--upr-ink-soft); }
.upr-form__aside .upr-btn { margin-top: 16px; }
.upr-form__privacy { margin-top: 12px; font-size: 0.85rem; line-height: 1.5; color: var(--upr-ink-soft); }
.upr-form__privacy a { color: var(--upr-ink); text-decoration: underline; }

@media (min-width: 1024px) {
    .upr-order { padding: 88px 0 104px; }
    .upr-form__grid { grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: start; }
    /* Pri dlhom zozname služieb navyše sa posúva len súhrn — tlačidlo a veta o zásadách ostávajú v okne */
    .upr-form__aside {
        position: sticky;
        top: calc(var(--upr-nav-scrolled) + 20px);
        display: flex;
        flex-direction: column;
        max-height: calc(100vh - var(--upr-nav-scrolled) - 40px);
    }
    .upr-form__aside .upr-summary { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
}

/* ---------- ČASTÉ OTÁZKY ---------- */
/* Vzhľad otázok preberá .faq-item zo style.css; tu len farby krémovej sekcie */
.upr-faq { max-width: 860px; margin: 0; }
.upr-faq .faq-item { border-color: var(--upr-line); }
.upr-faq .faq-item__question { color: var(--upr-ink); }
.upr-faq .faq-item__question i { color: var(--upr-ink); }
.upr-faq .faq-item__question:focus-visible { outline-color: var(--upr-brown); }
.upr-faq .faq-item__answer p { color: var(--upr-ink-soft); font-size: 1rem; }

/* ---------- PODMIENKY A KONTAKT ---------- */
.upr-terms { padding: 36px 0 44px; background: var(--upr-cream); border-top: 2px solid var(--upr-ink); }
.upr-terms__inner { display: grid; gap: 24px; }
.upr-terms__title { margin: 0 0 8px; font-family: inherit; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: inherit; }
.upr-terms p { font-size: 0.9rem; line-height: 1.6; color: var(--upr-ink-soft); }
.upr-terms p + p { margin-top: 6px; }
/* Nadpis kontaktu — 0,2,0 prebije veľkosť a farbu .upr-terms p */
.upr-terms .upr-terms__label { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--upr-ink); }
.upr-terms__phone a {
    display: inline-block;
    margin: 4px 0;
    font-family: var(--upr-display);
    font-weight: 800;
    font-size: 2rem;
    letter-spacing: -0.03em;
    color: var(--upr-ink);
    white-space: nowrap;
}
.upr-terms a:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 2px; }

@media (min-width: 900px) {
    .upr-terms__inner { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 48px; }
}

/* ---------- POĎAKOVANIE A 404 ---------- */
/* .upr-thanks__inner má šírku .container — ľavý okraj sedí s logom lišty a pätičkou; nadpis a mriežka najviac 960 px,
   úvodný text 40 em */
.upr-thanks__head,
.upr-thanks__grid { max-width: 960px; }
.upr-thanks__head { margin-bottom: 24px; }
.upr-thanks__number { margin-top: 12px; font-size: 1.15rem; }
.upr-thanks__lead { max-width: 40em; font-size: 1.05rem; line-height: 1.6; }
.upr-thanks__grid { display: grid; gap: 28px; }
.upr-thanks__text p { margin-top: 10px; line-height: 1.6; }
/* Telefón a e-mail vo vetách poďakovania (kam zavolať, kam poslať faktúru) — podčiarknuté a tučnejšie, inak by farbou
   aj hrúbkou splývali s textom; dotyková plocha pri .upr-hero__call a */
.upr-thanks__text a { font-weight: 600; white-space: nowrap; text-decoration: underline; text-underline-offset: 3px; }
.upr-thanks__text a:hover { text-decoration-thickness: 2px; }
.upr-thanks__text a:focus-visible { outline: 3px solid var(--upr-brown); outline-offset: 2px; }
.upr-thanks__rows { margin: 20px 0 0; }
.upr-thanks__rows div { display: grid; gap: 2px; padding: 8px 0; border-bottom: 1px solid var(--upr-line); }
.upr-thanks__rows dt { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.upr-thanks__rows dd { margin: 0; }
.upr-thanks .upr-summary { background: var(--upr-white); }
.upr-thanks__actions { margin-top: 28px; align-items: center; }

@media (min-width: 900px) {
    .upr-thanks__grid { grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: start; }
}

/* ---------- OBMEDZENIE POHYBU ---------- */
@media (prefers-reduced-motion: reduce) {
    .upr-btn,
    .upr-choice,
    .upr-band { transition: none; }
    .upr-btn:hover { transform: none; }
}