/* Návrh A – „Index of Objects“ · Švajčiarsky index
   Paleta: pozadie = medián nameraných okrajov ateliérových fotiek (manifest pozadie_okraj: #ececec ×3, #f2f2f2 ×2, #e6e3e7, #ecebf0),
   zaokrúhlené na neutrálnu #EDEDED – vystrihnuté fotky (tools/plate.mjs) majú v AVIF presne tú istú farbu, bez hrany
   Jediný akcent: jantár #D4912E (odtieň dubu z fotiek TARA a GOLF, medián ~#B58662 / 26–29°, posunutý k mosadzi vázy TARA ~37° a nasýtený), tokeny --accent / --accent-text / --accent-large / --accent-on-dark */

/* Písmo: Instrument Sans (OFL) – švajčiarska neogroteska, najbližšia k Helvetice / Akzidenz / Neue Haas, ktoré používajú
   BIG-GAME, Gubi, HAY, String a Fritz Hansen; váhy 400–700 (700 = najťažší rez, MAREK).
   Jediné písmo webu: aj čísla a metadáta sú Instrument Sans (tabuľkové číslice, menší rez, mierne prestrkanie). Generuje fonts.sh. */
@font-face {
  font-family: "Instrument Sans";
  src: url("../fonts/instrument-sans-latin.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+2013-2014, U+2018-201A, U+201C-201E, U+2022, U+2026, U+2116, U+2212, U+20AC;
}
@font-face {
  font-family: "Instrument Sans";
  src: url("../fonts/instrument-sans-latin-ext.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-017F;
}
/* metrická náhrada – menší skok pri výmene písma (Instrument Sans: priemerná šírka 104,4 % Arialu, ascent 0,97, descent 0,25) */
@font-face { font-family: "Instrument Sans Fallback"; src: local("Arial"); size-adjust: 104.4%; ascent-override: 92.9%; descent-override: 23.9%; line-gap-override: 0%; }

:root {
  --bg: #EDEDED;
  --plate-macro: #E6E6E6; /* výrezy a detaily: čitateľný rám (tools/plate.mjs T_MACRO) */
  --bg-2: #E4E4E2;
  --ink: #141414;
  --ink-2: #55554F;
  --line: #C9C9C5;
  --line-strong: #141414;
  /* akcent: plocha (filter, tlačidlo, výber, favicon) / drobný text na #EDEDED (AA 4,5:1) /
     veľký text ≥ 24 px alebo tučný ≥ 18,7 px (AA 3:1) / text a plochy na tmavom #141414 */
  --accent: #D4912E;        /* 6,92:1 s #141414 (tmavé písmo na ploche) */
  --accent-text: #875C1C;   /* 5,01:1 na #EDEDED, ≥ 4,61:1 aj na tónovanom páse produktu (#E9E4DC, #E7E9EB) a #E4E4E2 */
  --accent-large: #AB7423;  /* 3,41:1 na #EDEDED, ≥ 3,14:1 na tónovaných plochách */
  --accent-on-dark: #D4912E; /* 6,92:1 na #141414 */
  --accent-ink: #141414;

  --sans: "Instrument Sans", "Instrument Sans Fallback", "Helvetica Neue", Arial, sans-serif;

  --gutter: clamp(16px, 2.2vw, 32px);
  --gap: clamp(12px, 1.4vw, 24px);
  --hdr: 56px;

  --fs-mono: 11.5px;
  --fs-body: 16px;
  --fs-lead: clamp(22px, 2.55vw, 40px);
  /* Marek 10. 10. 2026, bod 2: „zmenšiť h2 nadpisy“ (predtým clamp(28px, 3.4vw, 54px)) */
  --fs-h2: clamp(22px, 2.1vw, 34px);
  --fs-xl: clamp(48px, 9.2vw, 168px);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io: cubic-bezier(0.77, 0, 0.18, 1);
  color-scheme: light;
}
@media (min-width: 900px) { :root { --fs-body: 17px; --fs-mono: 12px; --hdr: 64px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-x: clip; background: var(--bg); scroll-padding-top: calc(var(--hdr) + 16px); -webkit-tap-highlight-color: transparent; }
/* zalomenia: žiadne osamotené slovo na poslednom riadku, nadpisy vyvážené */
p, li, dd, figcaption, .mk__desc, .svc__text { text-wrap: pretty; }
h2, h3, .aw__name, .awt__name, .svc__name { text-wrap: balance; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: var(--fs-body);
  line-height: 1.55;
  font-feature-settings: "kern", "calt";
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
img, picture, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; -webkit-appearance: none; appearance: none; border-radius: 0; }
h1, h2, h3, h4, p, ol, ul, dl, dd, figure, blockquote { margin: 0; padding: 0; }
ol, ul { list-style: none; }
::selection { background: var(--accent); color: var(--accent-ink); }

/* fokus – vlastný, viditeľný, nikdy predvolený */
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--accent-text);outline-offset: 3px; border-radius: 1px; }
.skip {
  position: fixed; left: var(--gutter); top: 8px; z-index: 300;
  background: var(--accent); color: var(--accent-ink);
  font: 500 14px/1 var(--sans); padding: 12px 14px;
  transform: translateY(-160%); transition: transform .35s var(--ease-out);
}
.skip:focus-visible { transform: none; outline-color: var(--ink); }
.sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------- mriežka ---------- */
.wrap { padding-left: var(--gutter); padding-right: var(--gutter); }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }
/* metadáta a čísla: to isté písmo ako text, menší rez 500, tabuľkové a verzálkové číslice, mierne prestrkanie */
.mono { font-family: var(--sans); font-size: var(--fs-mono); font-weight: 500; line-height: 1.5; letter-spacing: 0.025em; font-variant-numeric: tabular-nums lining-nums; }
.up { text-transform: uppercase; letter-spacing: 0.07em; }
.accent { color: var(--accent-text); }
.muted { color: var(--ink-2); }
.rule { height: 1px; background: var(--line); transform-origin: 0 50%; }
.rule--ink { background: var(--ink); }
.tnum { font-variant-numeric: tabular-nums; }

/* ---------- hlavička ---------- */
.hdr {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  height: var(--hdr);
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: center;
  padding: 0 var(--gutter);
  background: color-mix(in srgb, var(--bg) 0%, transparent);
  transition: background-color .5s var(--ease-out);
}
.hdr::after { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); bottom: 0; height: 1px; background: var(--line); transform: scaleX(0); transform-origin: 0 50%; transition: transform .8s var(--ease-out); }
.hdr.is-solid, .hdr--solid, html:not(.js) .hdr { background: var(--bg); }
.hdr.is-solid::after, .hdr--solid::after, html:not(.js) .hdr::after { transform: scaleX(1); }
/* logo designmarek (Marek 10. 10. 2026, bod 20) namiesto nápisu MAREK; SVG 500 × 66, atrament od okraja po okraj */
.logo { display: block; width: 100%; height: auto; aspect-ratio: 500 / 66; overflow: visible; }
.hdr > * { grid-row: 1; }
.hdr__logo { grid-column: 1 / 4; justify-self: start; display: block; width: 128px; padding: 10px 0; }
@media (min-width: 900px) { .hdr__logo { width: 150px; } }
/* päť položiek (Work, Studio, References, Awards, Contact) – v strede hlavičky, nezávisle od šírky stĺpcov */
.hdr__nav { grid-column: 1 / 13; justify-self: center; display: flex; gap: clamp(16px, 2vw, 36px); }
.hdr__nav a, .hdr__lang { position: relative; font-size: 14px; font-weight: 500; letter-spacing: 0.005em; padding: 10px 0; }
.hdr__nav a::after, .lnk::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 6px; height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: 100% 50%; transition: transform .5s var(--ease-out);
}
.lnk { position: relative; }
.lnk::after { bottom: -2px; }
.hdr__nav a:hover::after, .lnk:hover::after { transform: scaleX(1); transform-origin: 0 50%; }
.hdr__nav a[aria-current="page"] { color: var(--accent-text); }
.hdr__nav a[aria-current="page"]::after { transform: scaleX(1); background: var(--accent-text); }
.hdr__nav .n { font-size: 10px; font-weight: 500; font-variant-numeric: tabular-nums; vertical-align: super; margin-left: 3px; color: var(--ink-2); }
.hdr__nav a[aria-current="page"] .n { color: var(--accent-text); }
.hdr__lang { grid-column: 12 / 13; justify-self: end; display: inline-flex; gap: 6px; font-size: 12px; font-weight: 500; letter-spacing: 0.04em; }
.lang .is-on { color: var(--ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.lang .is-off { color: var(--ink-2); transition: color .3s var(--ease-out); }
.lang .lang__sep { color: var(--line); }
.lang:hover .is-off { color: var(--accent-text); }
.ftr__col .ftr__lang { display: inline-flex; gap: 6px; font-size: 13px; font-weight: 500; letter-spacing: 0.04em; }
.hdr__menu { display: none; grid-column: 12 / 13; justify-self: end; width: 44px; height: 44px; margin-right: -10px; align-items: center; justify-content: center; }
.hdr__menu svg { width: 22px; height: 22px; }
.hdr__menu line { stroke: currentColor; stroke-width: 1.5; transition: transform .5s var(--ease-out); transform-origin: 50% 50%; }
@media (max-width: 899px) {
  .hdr__nav, .hdr .hdr__lang { display: none; }
  .hdr__menu { display: inline-flex; }
  html:not(.js) .hdr__menu { display: none; }
  html:not(.js) .hdr__nav { display: flex; grid-column: 4 / 13; justify-self: end; flex-wrap: wrap; justify-content: flex-end; gap: 0 10px; font-size: 12px; }
  html:not(.js) .hdr__nav a { padding: 2px 0; }
  html:not(.js) .hdr__nav a { font-size: 12px; }
  html:not(.js) .hdr__nav .n { display: none; }
}
html:not(.js) [data-filter], html:not(.js) .ctrl__views { display: none; }
html:not(.js) .hdr--home .hdr__logo { visibility: hidden; }
/* domov s pohybom: malé logo skryté od prvého vykreslenia – v hlavičke ho nahradí veľký MAREK (app.js) */
.motion .hdr--home .hdr__logo:not(:focus-visible) { opacity: 0; }
/* domov bez pohybu: malé logo až po odrolovaní veľkého (app.js prepína .wm-out), nikdy dve logá naraz */
.wm-watch:not(.motion):not(.wm-out) .hdr--home .hdr__logo:not(:focus-visible) { opacity: 0; }
/* oprava vibrovania 4. 11. 2026: po dokovaní stojí v hlavičke pevné malé logo, veľké zmizne (záložná cesta cez JS);
   pri scroll-driven animácii (.wm-sda) to isté robia kľúčové snímky z app.js na časovej osi scroll(root) */
.motion.wm-docked .hdr--home .hdr__logo { opacity: 1; }
.motion.wm-docked .wm__t { visibility: hidden; }
.hdr--home .hdr__logo:focus-visible { animation: none !important; opacity: 1; }
/* korektúry 05 (K05-03, K05-09): úvod pri príchode = fotka až po horný okraj okna, na nej len logo v strede a hamburger
   z dvoch čiarok vpravo hore (farba zmeraná pre jeho plochu na fotke, data-ml / data-mp nižšie). Po začatí rolovania (app.js .is-solid po 8 px)
   sa hlavička s položkami a EN / SK vysunie zhora, logo prejde zo stredu doľava do hlavičky (app.js) a hamburger na
   počítači zmizne; na telefóne ostáva hlavička s logom vľavo a hamburgerom. Na vrchu sa všetko vráti. */
.js .hdr--home, .js .hdr--home.is-solid { background: transparent; }
.js .hdr--home::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bg); transform: translate3d(0, -101%, 0); transition: transform .6s var(--ease-out); }
.js .hdr--home.is-solid::before { transform: none; }
.js .hdr--home .hdr__nav, .js .hdr--home .hdr__lang { transition: transform .6s var(--ease-out), opacity .45s var(--ease-out), visibility 0s; }
.js .hdr--home:not(.is-solid) .hdr__nav, .js .hdr--home:not(.is-solid) .hdr__lang { transform: translate3d(0, calc(-1 * var(--hdr)), 0); opacity: 0; visibility: hidden; transition: transform .5s var(--ease-out), opacity .3s var(--ease-out), visibility 0s linear .5s; }
.hdr--home .hdr__menu { transition: color .6s var(--ease-out), opacity .4s var(--ease-out), visibility 0s; }
@media (min-width: 900px) {
  .js .hdr--home .hdr__menu { display: inline-flex; }
  .js .hdr--home.is-solid .hdr__menu { opacity: 0; visibility: hidden; transition: color .6s var(--ease-out), opacity .3s var(--ease-out), visibility 0s linear .3s; }
  .hdr--home .hdr__menu svg { width: 30px; height: 30px; }
}
/* farba hamburgera na fotke: vlastné meranie plochy čiarok pre každú fotku a okno (oprava K05-03 po kontrole 8. 11. 2026,
   tools/hamburger-citatelnost.mjs). Farba loga sa meria v strede fotky, hamburger leží vpravo hore, preto má vlastné
   data-ml (na šírku) a data-mp (na výšku); rovnaká ako logo je tam, kde je pri nej čitateľný (aspoň 3 : 1). */
@media (min-aspect-ratio: 1001/1000) { .js .hdr--home:not(.is-solid)[data-ml="light"] .hdr__menu { color: #F5F5F3; } }
@media (max-aspect-ratio: 1/1) { .js .hdr--home:not(.is-solid)[data-mp="light"] .hdr__menu { color: #F5F5F3; } }

/* menu: jeden panel zľava pre celý web (korektúry 05, K05-05 až K05-08). Predloha prostoria.eu zmeraná 8. 11. 2026:
   panel na polovicu šírky a celú výšku okna, svetlé pozadie, krížik vpravo hore, pravá strana backdrop-filter
   blur(24px) bez stmavenia; pod 1024 px má panel celú šírku a rozostrenie nie je. */
.menu { position: fixed; inset: 0; z-index: 200; visibility: hidden; transition: visibility 0s linear .76s; }
.menu.is-open { visibility: visible; transition: visibility 0s; }
.menu:not(.is-shown) { display: none; }
html.menu-open { overflow: hidden; }
/* .cta BEZ content-visibility: zadržanie kreslenia orezalo spodok tlačidla a textu výzvy na produktoch (padding-bottom 0) */
.mk-sec, .ftr { content-visibility: auto; contain-intrinsic-size: auto 900px; }
/* rozostrenie leží pod celým panelom (aj počas vysúvania nie je medzi panelom a rozostrením ostrý pás) */
.menu__veil { position: absolute; inset: 0; -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); opacity: 0; transition: opacity .6s var(--ease-out); }
.menu.is-open .menu__veil { opacity: 1; }
.menu__panel {
  position: absolute; top: 0; bottom: 0; left: 0; width: 50%;
  display: flex; flex-direction: column; padding: calc(var(--hdr) + 24px) var(--gutter) 28px;
  background: var(--bg); color: var(--ink); overflow-y: auto; overscroll-behavior: contain;
  transform: translate3d(-100%, 0, 0); transition: transform .7s var(--ease-io);
}
.menu.is-open .menu__panel { transform: none; }
@media (max-width: 1023px) { .menu__panel { width: 100%; } .menu__veil { display: none; } }
.menu__close { position: absolute; top: calc((var(--hdr) - 44px) / 2); right: calc(var(--gutter) - 10px); width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; transition: color .3s var(--ease-out); }
.menu__close svg { width: 22px; height: 22px; }
.menu__close line { stroke: currentColor; stroke-width: 1.5; }
@media (hover: hover) { .menu__close:hover { color: var(--accent-text); } }
/* K05-06: položky ako riadky Indexu na úvode (.mkc__w): číslo v akcente, názov verzálkami tučne, tenká linka pod každou,
   aktuálna stránka a položka pod myšou v akcentovej farbe */
.menu__nav { display: flex; flex-direction: column; border-top: 1px solid var(--ink); }
.menu__nav a { display: grid; grid-template-columns: 2.6em minmax(0, 1fr); column-gap: 8px; align-items: baseline; padding: 12px 0 11px; border-bottom: 1px solid var(--line); }
.menu__t { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.35; text-transform: uppercase; transition: color .3s var(--ease-out); }
.menu__nav a[aria-current="page"] .menu__t { color: var(--accent-text); }
@media (hover: hover) { .menu__nav a:hover .menu__t { color: var(--accent-text); } }
/* K05-07, K05-12: dole len prepínač jazykov EN / SK ako doteraz a ako na Prostorii (e-mail a telefón z panela preč,
   ostávajú na stránke Contact); veľkosť a odstup prepínača bez zmeny */
.menu__foot { margin-top: auto; padding-top: 32px; display: grid; gap: 6px; justify-items: start; }
.menu__foot a { font-size: 17px; }
.menu__lang { margin-top: 18px; font-size: 13px; font-weight: 500; letter-spacing: 0.04em; display: inline-flex; gap: 8px; padding: 10px 0; }
/* K05-08: logo designmarek zvislo ako na Prostorii: otočené o 270° (číta sa zdola nahor), pri pravej hrane panelu,
   spodok 14 % nad dolným okrajom okna (Prostoria 32 × 144 px; naše logo je dlhšie, hrúbka podobná) */
.menu__mark { --mk: clamp(170px, 15vw, 230px); position: absolute; right: var(--gutter); bottom: 14%; width: calc(var(--mk) * .1561); height: var(--mk); color: var(--ink); pointer-events: none; }
.menu__mark .logo { position: absolute; left: 0; bottom: 0; width: var(--mk); max-width: none; transform-origin: 0 100%; transform: rotate(-90deg) translateY(100%); }
@media (max-height: 560px) { .menu__mark { display: none; } }
/* po vysunutí panelu položky nabehnú postupne (ako Prostoria) */
.menu__nav a, .menu__foot, .menu__mark { opacity: 0; transform: translate3d(0, 14px, 0); transition: opacity .25s var(--ease-out), transform .25s var(--ease-out); }
.menu.is-open .menu__nav a, .menu.is-open .menu__foot { opacity: 1; transform: none; transition: opacity .6s var(--ease-out) calc(.28s + var(--i, 0) * .06s), transform .8s var(--ease-out) calc(.28s + var(--i, 0) * .06s); }
.menu.is-open .menu__mark { opacity: 1; transform: none; transition: opacity .8s var(--ease-out) .5s, transform .8s var(--ease-out) .5s; }

/* ---------- hero / wordmark ---------- */
.hero { position: relative; padding-top: calc(var(--hdr) + clamp(8px, 2vw, 28px)); }
.hero__guides { position: absolute; inset: 0 var(--gutter); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); pointer-events: none; }
/* jedna čiara na ľavej hrane stĺpca + jedna na pravom okraji mriežky (žiadne zdvojené čiary v medzerách) */
.hero__guides span { border-left: 1px solid color-mix(in srgb, var(--line) 55%, transparent); transform-origin: 50% 0; }
.hero__guides span:last-child { border-right: 1px solid color-mix(in srgb, var(--line) 55%, transparent); }
/* mobil: 6 stĺpcov (každá druhá čiara 12-stĺpcovej mriežky), aby čiary nehustli pod textom */
@media (max-width: 899px) { .hero__guides span:nth-child(even):not(:last-child) { border-left-color: transparent; } }
/* čiary mriežky sú tam od prvého snímku (žiadna prázdna plocha pod navigáciou) – pohyb má len wordmark */

.wm { position: relative; z-index: 120; padding: 0 var(--gutter); pointer-events: none; }
/* logo designmarek cez celú šírku mriežky (SVG s atramentom od okraja po okraj = presne na ľavej a pravej čiare mriežky);
   pri rolovaní sa zmenší do slotu loga v hlavičke (app.js, mierka zo šírok) */
/* Marek 16. 10. 2026 (P01): logo v Instrument Sans asi o polovicu menšie (polovica šírky mriežky, na mobile 64 %) */
/* orezanie len pre nástup zdola; okolo loga je miesto na jemný podklad nad fotkou (kontrola 7. 11. 2026, K04-15) */
.wm__t { display: block; width: 50%; clip-path: inset(-30% -6% -20% -6%); transform-origin: 0 0; will-change: transform; }
@media (max-width: 899px) { .wm__t { width: 64%; } }
.hero { padding-bottom: clamp(28px, 3.4vw, 56px); }
/* bez pásu metadát (P04): linka nad radom filtrov oddeľuje logo od produktov */
.hero + .sec--lead .ctrl--lead { border-top: 1px solid var(--ink); }
.wm__in { display: block; }
/* nástup: logo sa vysunie zdola za 0,8 s; metadáta súbežne */
.motion .wm__in { animation: rise .8s var(--ease-out) both; }
@keyframes rise { from { transform: translateY(122%); } } /* celé pod orezaním (spodok -20 %) */

.strip { position: relative; margin-top: clamp(14px, 2vw, 28px); background: var(--bg); } /* čiary mriežky končia nad pásom metadát */
.strip__row { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--line); }
.strip__cell { padding: 14px 0 15px; display: flex; flex-direction: column; gap: 2px; overflow: clip; }
.strip__cell h1, .strip__cell p { font-size: 15px; line-height: 1.35; font-weight: 500; }
.strip__cell .mono { color: var(--ink-2); }
.strip__c1 { grid-column: 1 / 5; }
.strip__c2 { grid-column: 5 / 9; }
.strip__c3 { grid-column: 9 / 13; }
@media (max-width: 899px) {
  /* mobil: meta v dvoch riadkoch (meno · profesia / ocenenia), bez štítkov – prvý produkt musí byť v prvom okne */
  /* meno a profesia tečú ako jeden text (bodka drží pri mene, zalomí sa až za ňou), ocenenia na vlastnom riadku */
  .strip__row { display: block; padding: 10px 0 11px; font-size: 14px; line-height: 1.35; }
  .strip__cell { padding: 0; }
  .strip__cell > .mono { display: none; }
  .strip__c1, .strip__c2, .strip__c1 h1, .strip__c2 p { display: inline; }
  .strip__c2 p::before { content: "\00a0· "; color: var(--ink-2); }
  .strip__c3 { display: block; margin-top: 2px; }
  .strip__c3 p { color: var(--ink-2); }
  .strip__cell h1, .strip__cell p { font-size: 14px; }
}
/* metadáta pod wordmarkom: len krátky posun (10 px < spodné odsadenie bunky) + prelínanie – nikdy nevyjdú cez linku */
.motion .strip__cell > * { animation: fadeup .7s var(--ease-out) both; animation-delay: .14s; }
.motion .strip__cell > * + * { animation-delay: .2s; }
@keyframes fadeup { from { transform: translateY(10px); opacity: 0; } }

/* ---------- sekcie ---------- */
.sec { padding-top: clamp(72px, 10vw, 160px); }
.sec__head { position: relative; align-items: end; padding-bottom: 14px; }
/* korektúry 04 (K04-14, Marek: „iná hrúbka čiary ako pri ostatných, sprav pri všetkých rovnakú ako pri AWARDS“):
   linka bola 1 px plocha s transform: scaleX, ktorú prehliadač pri zväčšení 125 % a 150 % kreslil podľa polohy raz
   ostro na 1 bod (Awards), inokedy rozmazane cez 2 body. Teraz je to orámovanie (vždy celé body obrazovky, ako ostatné
   linky webu). Nábeh zľava robí clip-path len počas animácie (.ln-anim, app.js); orezanie by inak aj v pokoji
   kreslilo linku rozmazane mimo celých bodov. */
.sec__head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 0; border-bottom: 1px solid var(--ink); }
.sec__head.ln-anim::after { clip-path: inset(0 calc((1 - var(--ln, 1)) * 100%) 0 0); }
.sec__no { grid-column: 1 / 3; color: var(--accent-text); }
.sec__title { grid-column: 3 / 10; font-size: var(--fs-h2); font-weight: 700; letter-spacing: -0.035em; line-height: 0.95; }
.sec__aside { grid-column: 10 / 13; justify-self: end; text-align: right; color: var(--ink-2); white-space: nowrap; }
@media (max-width: 899px) {
  .sec__no { grid-column: 1 / 13; margin-bottom: 10px; }
  .sec__title { grid-column: 1 / 10; }
  .sec__aside { grid-column: 10 / 13; }
}

.intro { padding-top: clamp(56px, 8vw, 132px); }
.intro__label { grid-column: 1 / 3; padding-top: .6em; }
.intro__text { grid-column: 3 / 12; font-size: var(--fs-lead); line-height: 1.16; letter-spacing: -0.022em; font-weight: 500; text-wrap: pretty; }
.intro__perex { grid-column: 3 / 8; margin-top: clamp(24px, 3vw, 44px); color: var(--ink-2); max-width: 46ch; }
.intro__more { grid-column: 9 / 13; align-self: end; justify-self: end; margin-top: clamp(24px, 3vw, 44px); }
@media (max-width: 899px) {
  .intro__label { grid-column: 1 / 13; margin-bottom: 14px; padding: 0; }
  .intro__text { grid-column: 1 / 13; }
  .intro__perex { grid-column: 1 / 13; }
  .intro__more { grid-column: 1 / 13; justify-self: start; margin-top: 18px; }
}

/* šípkový odkaz */
.arrow { display: inline-block; font-weight: 500; font-size: 15px; line-height: 1.4; padding: 6px 0; }
/* posledné slovo + šípka sú nedeliteľné: šípka je vždy hneď za textom, aj pri zalomení */
.arrow .nw { white-space: nowrap; }
.arrow svg { display: inline-block; width: 18px; height: 18px; margin-left: 10px; vertical-align: -4px; transition: transform .5s var(--ease-out); }
.arrow path { stroke: currentColor; stroke-width: 1.5; fill: none; }
.arrow:hover svg { transform: translateX(4px); }
.arrow:hover { color: var(--accent-text); }

/* ---------- ovládanie prác (filter + pohľad) ---------- */
.ctrl { align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); row-gap: 10px; }
.ctrl__bar { display: contents; }
.ctrl__filters { grid-column: 1 / 9; display: flex; flex-wrap: wrap; gap: 6px 4px; }
.ctrl__views { grid-column: 9 / 13; justify-self: end; display: inline-flex; border: 1px solid var(--ink); }
@media (max-width: 899px) {
  /* mobil: filtre + Galéria/Index v jednom vodorovne rolovateľnom páse (vlastný, bez natívneho posuvníka) */
  .ctrl__bar {
    grid-column: 1 / 13; display: flex; align-items: center; gap: 12px;
    margin: 0 calc(-1 * var(--gutter)); padding: 2px var(--gutter);
    overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch;
    /* výrazný fade na okraji = signál „pokračuje do strany“; app.js prepína --fl/--fr podľa polohy posunu */
    --fl: 0px; --fr: 64px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--fl), #000 calc(100% - var(--fr)), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 var(--fl), #000 calc(100% - var(--fr)), transparent 100%);
  }
  .ctrl__bar.is-scrolled { --fl: 40px; }
  .ctrl__bar.is-end { --fr: 0px; }
  .ctrl__bar::-webkit-scrollbar { display: none; }
  .ctrl__bar::after { content: ""; flex: 0 0 12px; }
  .ctrl__filters { flex: 0 0 auto; flex-wrap: nowrap; }
  .ctrl__views { flex: 0 0 auto; }
  .chip, .seg { white-space: nowrap; }
}
.chip {
  position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 34px;
  padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px;
  font-size: 14px; font-weight: 500; line-height: 1;
  transition: border-color .35s var(--ease-out), color .35s var(--ease-out), background-color .35s var(--ease-out);
}
.chip .mono { font-size: 10.5px; color: var(--ink-2); transition: color .35s var(--ease-out); }
.chip:hover { border-color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.chip[aria-pressed="true"] .mono { color: var(--accent-ink); }
.seg { min-height: 34px; padding: 6px 14px; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; transition: background-color .35s var(--ease-out), color .35s var(--ease-out); }
.seg svg { width: 14px; height: 14px; }
.seg rect, .seg line { fill: none; stroke: currentColor; stroke-width: 1.4; }
.seg[aria-pressed="true"] { background: var(--ink); color: var(--bg); }
.seg + .seg { border-left: 1px solid var(--ink); }

/* ---------- galéria (asymetrická mriežka) ---------- */
.gal { row-gap: clamp(48px, 7vw, 120px); padding-top: clamp(28px, 4vw, 64px); align-items: start; }
.card { position: relative; grid-column: 1 / 13; }
.card__link { display: block; }
.fig { position: relative; overflow: hidden; background: var(--plate, var(--bg)); aspect-ratio: var(--ar, 2 / 1); }
.fig .pic, .fig picture { position: absolute; inset: 0; }
.fig img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.pic--frame { transform: scale(1.012); }
/* ateliérové fotky: pozadie zjednotené na --bg už v súbore (tools/plate.mjs) + mäkký okraj, aby nevznikla hrana */
.fig--plate { background: var(--bg); }
.pic--cut img {
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent), linear-gradient(180deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent), linear-gradient(180deg, transparent, #000 8%, #000 92%, transparent);
  mask-composite: intersect;
}
.pic--tara4 { transform: scale(1.045); transform-origin: 50% 100%; }
.pic--tara4 img { object-position: 50% 100% !important; }
.card .fig img { transition: transform 1.1s var(--ease-out); }
@media (hover: hover) { .card__link:hover .fig img { transform: scale(1.035); } }
.card__meta {
  display: grid; grid-template-columns: 3.2em 1fr auto; column-gap: 10px; align-items: baseline;
  padding-top: 12px; margin-top: 12px; border-top: 1px solid var(--line);
}
.card__no { color: var(--accent-text); }
.vt-t { display: inline-block; }
/* pár TT vo veľkých nadpisoch: pri prekrývaní -0,04 em sa horné ťahy dotýkajú, druhé T dostane medzeru */
.kt { margin-left: 0.035em; }
.card__title { font-size: clamp(20px, 1.9vw, 28px); font-weight: 700; letter-spacing: -0.03em; line-height: 1; transition: color .35s var(--ease-out); }
.card__type { color: var(--ink-2); font-size: 14px; text-align: right; }
.card__spec { grid-column: 2 / 4; margin-top: 8px; display: grid; gap: 1px; color: var(--ink-2); }
.card__spec .aw { color: var(--accent-text); }
@media (hover: hover) { .card__link:hover .card__title { color: var(--accent-large); } }

/* rytmus: objekty na stránke (veľká–malá) / KAPITOLA (interiér) / malá–malá–malá / KAPITOLA zrkadlovo.
   Prvý rad = vystrihnuté produkty na #EDEDED (signatúra „Index of Objects“), interiérové scény sú zámerné
   kapitolové prestávky s vlastnou dlaždicou: fotka 8/12 + popis vedľa nej (veľký názov, mono údaje, popisok záberu).
   --u = jeden stĺpec mriežky meraný z šírky galérie (container query) */
.gal { container-type: inline-size; }
.card__cap { display: none; }
@media (min-width: 900px) {
  .gal { --u: calc((100cqw - 11 * var(--gap)) / 12); row-gap: clamp(40px, 5vw, 80px); }
  /* Marek 10. 10. 2026 (body 10, 14 a 15): všetky práce veľké, vždy dva produkty vedľa seba ako WAVE a LUNA
     (7/12 + 5/12, rovnaká výška); posledná nepárna práca (BUTTERFLY) je kapitola cez celú šírku */
  /* Jakub 10. 10. 2026: rad 03 až 05 = tri produkty vedľa seba (TARA, DIAMOND, BUTTERFLY), po 4/12;
     rady 01 až 02 a 06 až 07 ostávajú 7/12 + 5/12 */
  .card--1, .card--6 { grid-column: 1 / 8; }
  .card--2, .card--7 { grid-column: 8 / 13; }
  .card--3 { grid-column: 1 / 5; }
  .card--4 { grid-column: 5 / 9; }
  .card--5 { grid-column: 9 / 13; }
  /* výška = (7 stĺpcov) / 2 -> široká karta presne 2:1 */
  .gal:not(.is-filtered) .card:not(.card--ch) .fig { aspect-ratio: auto; height: calc((7 * var(--u) + 6 * var(--gap)) / 2); }
  /* rad troch: rovnaká výška všetkých troch, pomer 8:5 -> zo zdroja 2:1 ostane stredných 80 % šírky (celý výrobok) */
  .gal:not(.is-filtered) .card--trio:not(.card--ch) .fig { height: calc((4 * var(--u) + 3 * var(--gap)) / 1.6); }
  /* úzka karta (4/12) do 1279 px: typ pod názvom, nie vpravo (dlhý názov a typ sa nezmestia do jedného riadku) */
  @media (max-width: 1279px) {
    .gal:not(.is-filtered) .card--trio .card__meta { grid-template-columns: 3.2em minmax(0, 1fr); }
    .gal:not(.is-filtered) .card--trio .card__type { grid-column: 2 / 3; text-align: left; margin-top: 6px; }
  }

  /* kapitola: celý riadok, vnútri vlastná 12-stĺpcová mriežka */
  .gal:not(.is-filtered) .card--ch { grid-column: 1 / 13; }
  .gal:not(.is-filtered) .card--ch .card__link { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: end; }
  .gal:not(.is-filtered) .card--ch .fig { grid-row: 1; grid-column: 1 / 9; aspect-ratio: auto; height: calc((8 * var(--u) + 7 * var(--gap)) / 2); }
  .gal:not(.is-filtered) .card--ch .card__meta { grid-row: 1; grid-column: 9 / 13; margin-top: 0; padding-top: 14px; border-top: 1px solid var(--ink); grid-template-columns: 3.2em minmax(0, 1fr); row-gap: 0; align-self: end; }
  .gal:not(.is-filtered) .card--ch-r .fig { grid-column: 5 / 13; }
  .gal:not(.is-filtered) .card--ch-r .card__meta { grid-column: 1 / 5; }
  .gal:not(.is-filtered) .card--ch .card__title { grid-column: 1 / 3; grid-row: 2; margin-top: clamp(20px, 2.4vw, 40px); font-size: clamp(44px, 5.2vw, 88px); font-weight: 700; letter-spacing: -0.04em; line-height: 0.82; margin-left: -0.04em; }
  .gal:not(.is-filtered) .card--ch .card__no { grid-column: 1 / 2; grid-row: 1; }
  .gal:not(.is-filtered) .card--ch .card__type { grid-column: 1 / 3; grid-row: 3; text-align: left; margin-top: 14px; font-size: 17px; color: var(--ink); font-weight: 500; }
  .gal:not(.is-filtered) .card--ch .card__spec { grid-column: 1 / 3; grid-row: 4; margin-top: 10px; }
  .gal:not(.is-filtered) .card--ch .card__cap { display: block; grid-column: 1 / 3; grid-row: 5; margin-top: 18px; padding-top: 10px; border-top: 1px solid var(--line); color: var(--ink-2); font-size: 14px; line-height: 1.4; }

  .gal.is-filtered .card { grid-column: span 6; }
  .gal.is-filtered .card .fig { aspect-ratio: 3 / 2; height: auto; }
}
@media (max-width: 899px) {
  .card { --ar: 3 / 2; }
  .gal.is-filtered .card { grid-column: 1 / 13; }
  .card__meta { grid-template-columns: 2.8em 1fr; }
  .card__type { grid-column: 2 / 3; text-align: left; margin-top: 6px; }
  /* kapitola na mobile: interiér cez celú šírku okna (4:3), veľký názov – iná dlaždica než karty objektov */
  .gal:not(.is-filtered) .card--ch .fig { --ar: 4 / 3; margin: 0 calc(-1 * var(--gutter)); }
  .gal:not(.is-filtered) .card--ch .card__title { font-size: clamp(40px, 13vw, 56px); font-weight: 700; letter-spacing: -0.04em; line-height: 0.84; }
  .gal:not(.is-filtered) .card--ch .card__meta { border-top-color: var(--ink); }
  .gal:not(.is-filtered) .card--ch .card__cap { display: block; grid-column: 2 / 3; margin-top: 10px; color: var(--ink-2); font-size: 14px; }
}
.card[hidden], .row[hidden] { display: none; }

/* ---------- index (tabuľka riadkov) ---------- */
.idx { position: relative; padding-top: 8px; }
/* jeden spoločný rozpis stĺpcov v px (nie em – hlavička je mono 12 px, riadok 17 px) */
/* WORK dosť široký pre „CUBANO / POUFFY“ na jednom riadku (aj pri 1024 px – nižšie sa písmo zmenší) */
/* bez stĺpca Material (Marek 10. 10. 2026, bod 1) */
.idx { --idx-cols: 72px minmax(0, 2.6fr) minmax(0, 1.9fr) minmax(0, 1.8fr) minmax(0, 1.5fr) 96px; }
@media (min-width: 900px) { .idx .row__name { white-space: nowrap; font-size: clamp(20px, 2.1vw, 34px); } }
@media (min-width: 900px) and (max-width: 1199px) { .idx .row__name { font-size: clamp(16px, 1.8vw, 22px); } }
/* desktop: každá bunka na jeden riadok -> všetky riadky rovnako vysoké (celý materiál je na stránke práce) */
@media (min-width: 900px) {
  .row__cell, .row__aw { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
  /* bunky pod plávajúcim náhľadom sa stíšia – pod náhľadom nič nevykúka */
  .row__aw, .row__yr { transition: opacity .25s var(--ease-out); }
  /* väčší náhľad (bod 21) zasahuje aj do stĺpca výrobcu – stíši sa aj ten, typ práce ostáva */
  .row__mk { transition: opacity .25s var(--ease-out); }
  .row.is-under .row__aw, .row.is-under .row__yr, .row.is-under .row__mk { opacity: 0; }
}
.idx__head, .row__a { display: grid; grid-template-columns: var(--idx-cols); column-gap: var(--gap); align-items: baseline; }
.idx__head { padding: 12px 0 10px; color: var(--ink-2); border-bottom: 1px solid var(--ink); }
.row { border-bottom: 1px solid var(--line); }
.row__a { position: relative; isolation: isolate; padding: 18px 0 17px; transition: color .3s var(--ease-out); }
/* aktívny riadok: len tučnejšia linka v šírke mriežky (nič nevyčnieva za okraje .wrap) */
.row__a::before { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--ink); transform: scaleX(0); transform-origin: 0 50%; transition: transform .6s var(--ease-out); z-index: 1; }
.row__no { color: var(--accent-text); }
.row__name { font-size: clamp(22px, 2.3vw, 36px); font-weight: 700; letter-spacing: -0.03em; line-height: 1; transition: color .35s var(--ease-out); }
.row__cell { font-size: 15px; }
.row__aw { color: var(--accent-text); }
.row__yr { text-align: right; }
.row__thumb { display: none; }
.row__yl { display: none; }
@media (hover: hover) {
  .row__a:hover::before { transform: scaleX(1); }
  .row__a:hover .row__name { color: var(--accent-large); }
  .idx.is-hovering .row__a:not(:hover) { color: color-mix(in srgb, var(--ink) 42%, transparent); }
  .idx.is-hovering .row__a:not(:hover) .row__cell { color: inherit; }
  .idx.is-hovering .row__a:not(:hover) .row__no, .idx.is-hovering .row__a:not(:hover) .row__aw { color: color-mix(in srgb, var(--accent-text) 45%, transparent); }
}
/* náhľad ukotvený v pevnej zóne nad stĺpcami AWARD + PRODUCED (šírka = tie dva stĺpce), hneď pod aktívnym
   riadkom (pri spodných riadkoch nad ním) – aktívny riadok je celý čitateľný, bunky pod náhľadom sa stíšia (app.js) */
.idx__preview {
  position: absolute; left: 0; top: 0; z-index: 5; width: 520px; aspect-ratio: 2 / 1;
  pointer-events: none; overflow: hidden; background: var(--bg);
  clip-path: inset(50% 50% 50% 50%); transition: clip-path .6s var(--ease-io);
  will-change: transform;
}
.idx__preview.is-on { clip-path: inset(0 0 0 0); }
/* korektúry 03 (K04): náhľad bez pozadia. Fotky majú svetlé ateliérové pozadie (#EFEFEF, svetlejšie než stránka #EDEDED);
   prelnutie „darken“ nechá z fotky len to, čo je tmavšie než stránka (produkt a jeho tieň), pozadie zmizne a linky
   zoznamu prechádzajú popod produkt. Produkt sa nemení, žiadne vystrihovanie. */
.idx__preview { background: transparent; mix-blend-mode: darken; }
.idx__preview .pv { position: absolute; inset: 0; opacity: 0; background: transparent; transition: opacity .35s var(--ease-out); }
.idx__preview .pv.is-on { opacity: 1; }
.idx__preview img { width: 100%; height: 100%; object-fit: cover; }
/* korektúry 04 (K04-02, zrkadlo LUNA): pod náhľadom podklad vo farbe stránky v tvare produktu (maska z
   tools/nahlad-podklad.mjs); linky zoznamu ostanú okolo produktu, cez produkt a sklo zrkadla nie. Ten istý rozmer,
   poloha (app.js) aj odkrytie ako náhľad. */
.idx__plug {
  position: absolute; left: 0; top: 0; z-index: 4; width: 520px; aspect-ratio: 2 / 1;
  pointer-events: none; overflow: hidden;
  clip-path: inset(50% 50% 50% 50%); transition: clip-path .6s var(--ease-io);
  will-change: transform;
}
.idx__plug.is-on { clip-path: inset(0 0 0 0); }
.idx__plug .pl { position: absolute; inset: 0; background: var(--bg); -webkit-mask: var(--m) 0 0 / 100% 100% no-repeat; mask: var(--m) 0 0 / 100% 100% no-repeat; opacity: 0; transition: opacity .35s var(--ease-out); }
.idx__plug .pl.is-on { opacity: 1; }
@media (max-width: 899px) { .idx__plug { display: none; } }
@media (hover: none) { .idx__plug { display: none; } }
@media (max-width: 899px) {
  .idx__head { display: none; }
  /* mobil: miniatúra vystrihnutého produktu vpravo, rok výroby v mono riadku pod typom */
  .row__a { grid-template-columns: 2.6em minmax(0, 1fr) 76px; column-gap: 12px; row-gap: 4px; padding: 14px 0 14px; align-items: start; }
  .row__no { grid-row: 1; grid-column: 1 / 2; padding-top: 4px; }
  .row__name { grid-column: 2 / 3; grid-row: 1; }
  .row__thumb { display: block; grid-column: 3 / 4; grid-row: 1 / span 5; align-self: center; position: relative; width: 76px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--plate, var(--bg)); }
  .row__thumb picture { position: absolute; inset: 0; }
  .row__thumb img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
  .row__type { grid-column: 2 / 3; color: var(--ink-2); font-size: 14px; }
  .row__mk { grid-column: 2 / 3; font-size: 14px; color: var(--ink-2); }
  .row__aw { grid-column: 2 / 3; }
  .row__aw:empty { display: none; }
  .row__yr { grid-column: 2 / 3; text-align: left; color: var(--ink-2); }
  .row__yl { display: inline; }
  .row__yr--none { display: none; }
  .idx__preview { display: none; }
}
@media (hover: none) { .idx__preview { display: none; } }

/* ---------- ocenenia (pripnutá sekcia) – jediná tmavá kapitola: inverz cez lokálne premenné ---------- */
.aw-sec {
  --bg: #141414; --ink: #EDEDED; --ink-2: #A3A39D; --line: #34342F; --accent: var(--accent-on-dark); --accent-text: var(--accent-on-dark); --accent-large: var(--accent-on-dark);
  background: var(--bg); color: var(--ink);
  margin-top: clamp(72px, 10vw, 160px); padding-top: clamp(64px, 8vw, 128px); padding-bottom: clamp(72px, 9vw, 144px);
}
.aw-sec ::selection { background: var(--accent); color: #141414; }
.aw-sec .aw__prod:hover { color: var(--accent-text); }
.aw-sec + .mk-sec { padding-top: clamp(72px, 9vw, 144px); }
.aw { align-items: start; }
.aw__pin { grid-column: 1 / 6; position: sticky; top: calc(var(--hdr) + 24px); padding-top: clamp(20px, 3vw, 40px); }
/* Marek 16. 10. 2026 (P07, P08): číslo o tretinu menšie (340 → 227 px max) a celé, bez orezu (žiadny overflow) */
.aw__big { display: flex; align-items: flex-start; font-size: clamp(80px, 14vw, 227px); font-weight: 700; letter-spacing: -0.05em; line-height: 0.78; font-variant-numeric: tabular-nums; }
.aw__n { display: inline-block; padding-right: 0.04em; }
.odo { display: inline-block; height: 0.78em; overflow: hidden; }
.odo__col { display: flex; flex-direction: column; transition: transform .9s var(--ease-io); }
.odo__col span { display: block; height: 0.78em; }
.aw__x { font-size: 0.32em; color: var(--accent-text); margin: 0.04em 0.06em 0 0.02em; letter-spacing: 0; }
.aw__sum { margin-top: 22px; max-width: 26ch; font-size: 18px; line-height: 1.3; font-weight: 500; }
.aw__list { grid-column: 7 / 13; padding-top: clamp(20px, 3vw, 40px); }
.aw__row { display: grid; grid-template-columns: 4em 1fr; column-gap: var(--gap); padding: 26px 0 28px; border-top: 1px solid var(--line); min-height: clamp(160px, 22vh, 240px); transition: color .5s var(--ease-out); }
.aw__row:last-child { border-bottom: 1px solid var(--line); }
.aw__yr { color: var(--accent-text); padding-top: 4px; }
.aw__name { font-size: clamp(20px, 2vw, 30px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.05; }
.aw__res { margin-top: 10px; color: var(--ink-2); }
.aw__prod { margin-top: 14px; display: inline-block; }
/* viac prác pod jedným ocenením (Design and design 2016, BIG SEE Product Design 2023) */
.aw__prods { margin-top: 14px; display: grid; gap: 8px; }
.aw__prods .aw__prod { margin-top: 0; }
/* práca, ktorá na tomto webe nie je (bez odkazu): to isté písmo ako odkazy, len bez šípky a tlmenejšie */
.aw__prod--t { font-weight: 500; font-size: 15px; line-height: 1.4; padding: 6px 0; color: color-mix(in srgb, var(--ink) 72%, transparent); }
.aw__prods .aw__prod--t { padding: 0; }
.aw__row.is-dim { color: color-mix(in srgb, var(--ink) 38%, transparent); }
@media (max-width: 899px) {
  .aw__pin { position: relative; top: 0; grid-column: 1 / 13; }
  .aw__list { grid-column: 1 / 13; }
  .aw__row { min-height: 0; padding: 20px 0 22px; }
  .aw__row.is-dim { color: inherit; }
}

/* ---------- výrobcovia: každý výrobca má vlastný „regál“ produktov (B2B dôkaz) ----------
   riadok 1: logo + názov + miesto | opis | počet prác (veľké číslo) ; riadok 2: regál vystrihnutých produktov
   na podklade stránky – rovnaká mierka v každom riadku (5 slotov), jediný produkt zaberie dva sloty (2:1) */
.mk__row { align-items: start; padding: clamp(28px, 3vw, 44px) 0 clamp(32px, 3.4vw, 52px); border-bottom: 1px solid var(--line); row-gap: clamp(20px, 2.4vw, 36px); }
.mk__id { grid-column: 1 / 4; display: grid; gap: 0; align-content: start; }
/* Marek 10. 10. 2026: logo výrobcu väčšie, ťahá pozornosť (bod 12); názov firmy a krajina drobne, vo veľkosti
   popiskov diel (bod 13: ako „WAVE / Dining table“ na kartách) */
.mk__logo { height: 64px; display: flex; align-items: center; margin-bottom: 18px; }
.mk__logo img { height: 100%; width: auto; max-width: 100%; object-fit: contain; object-position: left center; }
.mk__logo--anesis { height: 46px; margin-bottom: 26px; }
.mk__name { font-size: 15px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.35; }
.mk__where { display: block; margin-top: 2px; color: var(--ink-2); }
.mk__desc { grid-column: 4 / 9; color: var(--ink-2); font-size: 16px; line-height: 1.5; max-width: 44ch; padding-top: 20px; }
.mk__count { grid-column: 10 / 13; justify-self: end; display: grid; justify-items: end; text-align: right; gap: 4px; }
.mk__n { font-size: clamp(56px, 6.4vw, 112px); font-weight: 700; letter-spacing: -0.06em; line-height: 0.78; font-variant-numeric: tabular-nums; margin-bottom: 8px; }
.mk__count .mono { color: var(--ink-2); }
.mk__count .accent { color: var(--accent-text); }
/* regál výrobcu (stránka References): Marek 16. 10. 2026 (correction 02, P19) chce rozloženie spred 10. 10. 2026
   (commit 90b6cb5): produkty výrobcu v jednom rade v stĺpcoch 4 až 12, 5 slotov rovnakej mierky, jediný produkt
   zaberie 3 sloty; fotky ostávajú produktové bez interiéru (bod 11 z 10. 10.), logo veľké a názov drobne (body 12, 13) */
.mk__prods { grid-column: 4 / 13; container-type: inline-size; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px var(--gap); --cw: calc((100cqw - 4 * var(--gap)) / 5); }
.mk__prods li { min-width: 0; }
.mk__p { display: grid; gap: 10px; }
.mk__th { display: block; aspect-ratio: auto !important; height: calc(var(--cw) * 0.75); }
.mk__th img { transition: transform .9s var(--ease-out); }
.mk__pl { display: grid; grid-template-columns: 2.6em minmax(0, 1fr); column-gap: 0; padding-top: 8px; border-top: 1px solid var(--line); line-height: 1.35; }
.mk__pn { color: var(--ink); font-family: var(--sans); font-size: 15px; font-weight: 700; letter-spacing: -0.01em; transition: color .3s var(--ease-out); }
.mk__pt { grid-column: 2; color: var(--ink-2); font-size: 14px; }
/* 320 px SK: nedeliteľné „konferenčný stôl“ v úzkom stĺpci → užší stĺpec čísla + tesnejšie písmo */
@media (max-width: 359px) { .mk__pl { grid-template-columns: 2.4em minmax(0, 1fr); } .mk__pt { letter-spacing: -0.02em; } }
@media (hover: hover) { .mk__p:hover img { transform: scale(1.04); } .mk__p:hover .mk__pn { color: var(--accent-text); } }
@media (min-width: 900px) and (max-width: 1199px) { .mk__desc { grid-column: 4 / 10; } .mk__count { grid-column: 10 / 13; } }
/* korektúry 03 (K12): všetky fotky v regáli rovnako veľké ako pri Krošláku (5 v rade), aj keď má výrobca 1 produkt */
/* stránka References a Awards: sekcia je prvá na stránke (pod pevnou hlavičkou) */
.sec--first { padding-top: calc(var(--hdr) + clamp(24px, 4vw, 56px)); }
.aw-sec--first { margin-top: 0; padding-top: calc(var(--hdr) + clamp(32px, 4vw, 64px)); }

/* domov: zhustení výrobcovia – tri textové bunky oddelené linkami (ako úvodný riadok indexu) */
.mkc { padding-top: 0; row-gap: 0; }
.mkc__c { grid-column: span 4; display: flex; flex-direction: column; padding: clamp(24px, 2.6vw, 36px) clamp(16px, 1.6vw, 24px) clamp(28px, 3vw, 40px) 0; border-bottom: 1px solid var(--line); }
.mkc__c + .mkc__c { border-left: 1px solid var(--line); padding-left: clamp(16px, 1.6vw, 24px); margin-left: calc(-1 * var(--gap) / 2); }
.mkc__name { margin-top: 2px; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; line-height: 1.35; }
.mkc__where { margin-top: 2px; color: var(--ink-2); }
.mkc__desc { margin-top: 16px; color: var(--ink-2); font-size: 15px; line-height: 1.5; max-width: 38ch; }
.mkc__n { margin-top: auto; padding-top: 22px; color: var(--ink-2); }
.mkc__works { margin-top: 10px; border-top: 1px solid var(--ink); }
.mkc__w { display: grid; grid-template-columns: 2.6em minmax(0, 1fr) auto; column-gap: 8px; align-items: baseline; padding: 9px 0 10px; border-bottom: 1px solid var(--line); }
.mkc__wn { font-weight: 700; font-size: 15px; letter-spacing: -0.01em; transition: color .3s var(--ease-out); }
.mkc__wt { color: var(--ink-2); font-size: 14px; text-align: right; }
@media (hover: hover) { .mkc__w:hover .mkc__wn { color: var(--accent-text); } }
@media (max-width: 899px) {
  .mkc__c { grid-column: 1 / 13; padding-right: 0; }
  .mkc__c + .mkc__c { border-left: 0; padding-left: 0; margin-left: 0; }
  .mkc__n { padding-top: 18px; }
}
/* úzke bunky (mobil aj tri stĺpce do 1440 px): typ práce pod názvom – nikdy sa neprekrýva s dlhým názvom */
@media (max-width: 1439px) {
  .mkc__w { grid-template-columns: 2.6em minmax(0, 1fr); row-gap: 2px; }
  .mkc__wt { grid-column: 2; text-align: left; }
}
@media (max-width: 899px) {
  .mk__id { grid-column: 1 / 9; }
  .mk__logo { height: 52px; margin-bottom: 14px; }
  .mk__logo--anesis { height: 38px; margin-bottom: 20px; }
  .mk__count { grid-column: 9 / 13; grid-row: 1; align-self: end; }
  .mk__n { font-size: 48px; margin-bottom: 4px; }
  .mk__count .accent { display: none; }
  .mk__desc { grid-column: 1 / 13; padding-top: 0; font-size: 15px; }
  .mk__prods { grid-column: 1 / 13; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px var(--gap); --cw: calc((100cqw - var(--gap)) / 2); }
}

/* ---------- výzva ---------- */
.cta { padding-top: clamp(96px, 13vw, 220px); padding-bottom: clamp(56px, 8vw, 120px); }
.cta__no { grid-column: 1 / 3; color: var(--accent-text); padding-top: .8em; }
/* najdlhší nedeliteľný úsek „a new collection?“ (nezlomiteľné medzery) = 7,61 em v Instrument Sans 700 → na mobile písmo z šírky stĺpca / 8,0 (320 px: 36 px) */
/* bod 2 (menšie h2): výzva predtým min(var(--fs-xl), …) = až 168 px */
.cta__title { grid-column: 3 / 13; font-size: min(clamp(34px, 4.6vw, 76px), calc((100vw - 2 * var(--gutter)) / 8)); font-weight: 700; letter-spacing: -0.035em; line-height: 0.96; text-wrap: balance; }
.cta__text { grid-column: 3 / 8; margin-top: clamp(24px, 3vw, 40px); color: var(--ink-2); max-width: 42ch; }
/* Marek 16. 10. 2026 (P09): tlačidlo, e‑mail a telefón POD textom, nie vpravo vedľa neho */
.cta__act { grid-column: 3 / 13; margin-top: clamp(28px, 3vw, 44px); display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.cta__act .btn { margin-bottom: 24px; }
@media (max-width: 899px) {
  .cta__no { grid-column: 1 / 13; margin-bottom: 14px; padding: 0; }
  .cta__title { grid-column: 1 / 13; }
  .cta__text, .cta__act { grid-column: 1 / 13; }
}
.cta--page { padding-top: clamp(80px, 11vw, 180px); padding-bottom: 4px; }
.cta__title--m { font-size: min(clamp(32px, 4vw, 64px), calc((100vw - 2 * var(--gutter)) / 8)); }
.cta--page .cta__act { align-self: start; }
.cta--page .cta__act .btn { margin-bottom: 0; }
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px;
  min-height: 52px; padding: 0 20px; background: var(--ink); color: var(--bg); font-size: 15px; font-weight: 500; overflow: hidden; isolation: isolate;
}
.btn::before { content: ""; position: absolute; inset: 0; background: var(--accent); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .55s var(--ease-io); z-index: -1; }
.btn:hover::before { transform: scaleY(1); }
/* na svetlej jantárovej ploche tmavé písmo (#141414 na akcente = AA) */
.btn { transition: color .55s var(--ease-io); }
.btn:hover { color: var(--accent-ink); }
.btn svg { width: 18px; height: 18px; transition: transform .5s var(--ease-out); }
.btn path { stroke: currentColor; stroke-width: 1.5; fill: none; }
.btn:hover svg { transform: translateX(4px); }
.big-link { font-size: clamp(22px, 2.6vw, 40px); font-weight: 600; letter-spacing: -0.025em; line-height: 1.1; overflow-wrap: anywhere; }
.big-link:hover { color: var(--accent-text); }

/* ---------- päta ---------- */
.ftr { margin-top: clamp(40px, 6vw, 80px); padding-bottom: 22px; }
.ftr__top { border-top: 1px solid var(--ink); padding-top: 22px; row-gap: 28px; }
/* blok „Dalibor Marek / Furniture designer“ v päte zrušený (Marek 10. 10. 2026, bod 5) */
.ftr__col { grid-column: span 2; display: flex; flex-direction: column; gap: 4px; }
.ftr__col .mono { color: var(--ink-2); margin-bottom: 6px; }
.ftr__col a { font-size: 15px; padding: 3px 0; align-self: flex-start; }
.ftr__col a:hover { color: var(--accent-text); }
.ftr__firm { grid-column: 9 / 13; font-size: 15px; }
.ftr__firm .mono { margin-bottom: 6px; }
.ftr__work a .mono { color: var(--accent-text); margin: 0 10px 0 0; font-size: 11px; }
.ftr__work a { display: inline-flex; align-items: baseline; }
/* druhý signature moment: ten istý wordmark MAREK cez celú šírku, písmená sa zdvihnú pri dorolovaní */
.ftr__wm { display: block; container-type: inline-size; margin-top: clamp(48px, 7vw, 112px); user-select: none; color: var(--ink); transition: color .35s var(--ease-out); }
@media (hover: hover) { .ftr__wm:hover { color: var(--accent-large); } }
/* logo designmarek cez celú šírku (Marek 10. 10. 2026, bod 20), vysunie sa zdola pri dorolovaní */
.ftr__wmt { display: block; width: 100%; overflow: clip; }
.motion .ftr__wmt .logo { transform: translateY(101%); transition: transform 1.2s var(--ease-out); }
.motion .ftr__wm.is-in .ftr__wmt .logo { transform: none; }
.ftr__bottom { margin-top: clamp(16px, 2vw, 28px); padding-top: 14px; border-top: 1px solid var(--line); align-items: baseline; row-gap: 8px; color: var(--ink-2); }
.ftr__copy { grid-column: 1 / 7; }
.ftr__vidy { grid-column: 7 / 13; justify-self: end; display: inline-flex; align-items: center; gap: 8px; padding: 4px 0; color: var(--ink-2); }
.ftr__vidy:hover { color: var(--accent-text); }
.ftr__vidy i { width: 6px; height: 6px; background: var(--accent); display: inline-block; }
/* Marek 16. 10. 2026 (P10): päta len so spodným riadkom (copyright a štítok Vidy) */
.ftr--slim { margin-top: clamp(56px, 8vw, 120px); contain-intrinsic-size: auto 60px; }
.ftr--slim .ftr__bottom { margin-top: 0; }
@media (max-width: 899px) {
  .ftr__col { grid-column: span 6; }
  .ftr__firm { grid-column: 1 / 13; }
  .ftr__copy, .ftr__vidy { grid-column: 1 / 13; justify-self: start; }
}

/* ---------- stránka produktu ---------- */
.obj__head { padding-top: calc(var(--hdr) + clamp(24px, 4vw, 56px)); row-gap: 12px; }
.crumbs { grid-column: 1 / 9; display: flex; gap: 8px; color: var(--ink-2); }
.crumbs a:hover { color: var(--accent-text); }
.crumbs svg { width: 10px; height: 10px; align-self: center; }
.crumbs path { stroke: currentColor; stroke-width: 1.4; fill: none; }
.obj__count { grid-column: 9 / 13; justify-self: end; color: var(--ink-2); }
.obj__count b { font-weight: 500;color: var(--accent-text); }
/* korektúry 03 (K14): názov produktu o tretinu menší (× 2/3), aby bol na monitore vidno aj samotný produkt */
.obj__title { grid-column: 1 / 13; margin-top: clamp(12px, 2vw, 28px); font-size: calc(min(30vw, calc((100vw - 2 * var(--gutter)) / var(--em, 4) * 0.97)) * 2 / 3); font-weight: 700; letter-spacing: -0.04em; line-height: 0.8; margin-left: -0.04em; overflow-wrap: anywhere; }
.obj__title--long { line-height: 0.86; }
.obj__sub { grid-column: 1 / 13; margin-top: clamp(16px, 2vw, 28px); padding-top: 14px; border-top: 1px solid var(--ink); display: grid; row-gap: 10px; }
.obj__type { color: var(--ink-2); }
.obj__perex { font-size: clamp(18px, 1.7vw, 24px); line-height: 1.3; letter-spacing: -0.012em; font-weight: 500; }
.obj__aw { justify-self: start; color: var(--accent-text); }
@media (min-width: 900px) {
  /* názov v stĺpcoch 1–7, vpravo typ, perex a ocenenie zarovnané na spodok názvu; žiadna prázdna polovica */
  .obj__head { position: relative; align-items: end; padding-bottom: clamp(20px, 2.4vw, 32px); }
  .obj__head::after { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); bottom: 0; height: 1px; background: var(--ink); }
  /* názov vyplní stĺpce 1–7 (z nameranej šírky slova v em, --em z build.mjs) – mierka nadväzuje na MAREK z domova */
  .obj__title { grid-column: 1 / 8; font-size: calc(min(22vw, 340px, calc(((100vw - 2 * var(--gutter) - 11 * var(--gap)) / 12 * 7 + 6 * var(--gap)) / var(--em, 4) * 0.96)) * 2 / 3); }
  .obj__sub { grid-column: 8 / 13; margin-top: 0; padding-top: 0; border-top: 0; align-self: end; padding-bottom: .1em; }
  .obj__fig .fig { --ar: 2 / 1 !important; }
}
@media (max-width: 899px) {
  .crumbs { grid-column: 1 / 9; }
  .obj__count { grid-column: 9 / 13; }
}
.obj__main { padding-top: clamp(20px, 2.4vw, 32px); align-items: start; row-gap: 28px; }
.obj__fig { grid-column: 1 / 9; }
.obj__fig .fig { --ar: 3 / 2; }
.obj__fig.is-tara .fig { --ar: 3 / 1; }
.motion:not(.vt) .obj__fig .fig { animation: unmask 1.3s var(--ease-io) .15s both; }
.motion:not(.vt) .obj__fig .fig img { animation: unzoom 1.8s var(--ease-out) .15s both; }
/* príchod cez zdieľaný prechod: fotka a názov priletia z karty, úvodné odkrývanie sa vynechá */
.vt .obj__title .rise, .vt .obj__sub .fadein { animation: none !important; }
@keyframes unmask { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes unzoom { from { transform: scale(1.14); } }
.sheet { grid-column: 9 / 13; position: sticky; top: calc(var(--hdr) + 20px); border-top: 1px solid var(--ink); }
.sheet__row { display: grid; grid-template-columns: 9.5em 1fr; column-gap: 12px; padding: 11px 0 12px; border-bottom: 1px solid var(--line); }
.sheet__row dt { color: var(--ink-2); }
.sheet__row dd { font-size: 15px; line-height: 1.4; }
.sheet__row dd ul li + li { margin-top: 4px; }
.sheet__row dd .mono { display: block; color: var(--ink-2); margin-top: 2px; }
.sheet__sub { display: block; font-weight: 600; margin-top: 10px; }
.sheet__sub:first-child { margin-top: 0; }
.sheet__aw { color: var(--accent-text); display: block; }
.sheet__row dd .mono + .sheet__aw, .sheet__aw + .sheet__aw { margin-top: 10px; }
.sheet__cta { margin-top: 22px; }
@media (min-width: 900px) and (max-width: 1199px) { .obj__fig { grid-column: 1 / 8; } .sheet { grid-column: 8 / 13; } }
@media (max-width: 899px) {
  .obj__fig { grid-column: 1 / 13; }
  .obj__fig .fig { --ar: 4 / 3; }
  .sheet { grid-column: 1 / 13; position: relative; top: 0; }
  .sheet__row { grid-template-columns: 8.5em minmax(0, 1fr); }
}
/* GOLF: rozmer „v 84 × š 41 × h 41 cm,“ je nedeliteľný (154 px) → pri 320 px užší stĺpec popisov */
@media (max-width: 359px) { .sheet__row { grid-template-columns: 7em minmax(0, 1fr); } }
.obj__body { padding-top: clamp(64px, 9vw, 150px); row-gap: 20px; }
.obj__label { grid-column: 1 / 3; color: var(--accent-text); padding-top: .5em; }
.obj__text { grid-column: 3 / 10; display: grid; gap: 1.1em; }
.obj__text p:first-child { font-size: var(--fs-lead); line-height: 1.16; letter-spacing: -0.022em; font-weight: 500; }
.obj__text p + p { max-width: 58ch; color: var(--ink); }
.quote { grid-column: 3 / 12; margin-top: clamp(40px, 6vw, 96px); padding-top: 22px; border-top: 1px solid var(--ink); }
/* SK GOLF: nedeliteľné „‚nadýchaného‘ nábytku.“ = 10,47 em v Instrument Sans 700 → pod ~345 px písmo z šírky stĺpca / 10,9 (320 px: 26,4 px) */
.quote blockquote p { font-size: min(clamp(30px, 4.4vw, 72px), calc((100vw - 2 * var(--gutter)) / 10.9)); font-weight: 700; letter-spacing: -0.04em; line-height: 0.98; text-wrap: balance; }
.quote blockquote p::before { content: "\201C"; color: var(--accent-large); }
.quote blockquote p::after { content: "\201D"; color: var(--accent-large); }
.quote__tr { margin-top: 16px; font-size: 18px; color: var(--ink-2); }
/* SK: veľký citát po slovensky so slovenskými úvodzovkami „ “, originál drobne pod ním */
.quote--sk blockquote p::before { content: "\201E"; }
.quote--sk blockquote p::after { content: "\201C"; }
.quote--sk .quote__tr { font-size: 16px; }
.quote figcaption { margin-top: 16px; color: var(--ink-2); }
@media (max-width: 899px) {
  .obj__label { grid-column: 1 / 13; padding: 0; }
  .obj__text, .quote { grid-column: 1 / 13; }
}
/* detail materiálu na celú šírku okna (maskované odkrytie) */
.bleed { margin-top: clamp(72px, 10vw, 160px); }
.bleed__fig { --ar: 2 / 1; width: 100%; }
.bleed__cap { display: flex; gap: 16px; padding-top: 12px; color: var(--ink-2); }
.bleed__cap .accent { min-width: 2.6em; }
/* mobil: zdroje sú 1600×800 – výrez 4:3 (nie portrét), aby sa obraz pri DPR 2–3 nezväčšoval nad zdroj */
@media (max-width: 899px) { .bleed__fig { --ar: 4 / 3; } }
.bleed--solo { margin-top: clamp(20px, 3vw, 48px); }
.bleed__fig.is-tara { --ar: 3 / 1; }
@media (max-width: 899px) { .bleed__fig.is-tara { --ar: 4 / 3; } }
.fig--macro { background: var(--plate-macro); }
.obj__gal { padding-top: clamp(72px, 10vw, 160px); }
.dg { row-gap: clamp(20px, 3vw, 48px); padding-top: clamp(24px, 3vw, 44px); align-items: start; }
.dg__item { grid-column: 1 / 13; }
.dg__item .fig { --ar: 2 / 1; }
.dg__item figcaption { display: flex; gap: 12px; margin-top: 10px; color: var(--ink-2); }
.dg__item figcaption .accent { min-width: 2.6em; }
@media (min-width: 900px) {
  .dg__item--a { grid-column: 1 / 13; }
  .dg__item--b { grid-column: 1 / 7; }
  .dg__item--b .fig { --ar: 4 / 3; }
  .dg__item--c { grid-column: 8 / 13; margin-top: clamp(60px, 9vw, 160px); }
  .dg__item--c .fig { --ar: 1 / 1; }
  .dg__item--d { grid-column: 3 / 11; }
  .dg__item--d .fig { --ar: 16 / 9; }
}
.dg__item.is-tara .fig { --ar: 3 / 1 !important; }
@media (max-width: 899px) { .dg__item:nth-child(even) .fig { --ar: 4 / 3; } }

.next { margin-top: clamp(96px, 13vw, 220px); }
.next__a { display: block; border-top: 1px solid var(--ink); padding-top: 16px; }
.next__top { align-items: baseline; }
.next__lbl { grid-column: 1 / 7; color: var(--ink-2); display: inline-flex; gap: 10px; align-items: center; }
.next__lbl svg { width: 14px; height: 14px; transition: transform .6s var(--ease-out); }
.next__lbl path { stroke: currentColor; stroke-width: 1.5; fill: none; }
.next__no { grid-column: 7 / 13; justify-self: end; color: var(--accent-text); }
/* korektúry 03 (K17): názov ďalšieho produktu o tretinu menší (× 2/3) */
.next__name { display: block; margin-top: 18px; font-size: clamp(32px, calc(min(24vw, calc(140vw / var(--len, 6))) * 2 / 3), 174px); font-weight: 700; letter-spacing: -0.04em; line-height: 0.8; margin-left: -0.04em; transition: color .5s var(--ease-out); overflow-wrap: anywhere; }
.next__name--long { line-height: 0.86; }
.next__body { margin-top: clamp(20px, 3vw, 40px); align-items: end; row-gap: 16px; }
.next__fig { grid-column: 5 / 13; }
.next__fig .fig { --ar: 2 / 1; }
.next__fig.is-tara .fig { --ar: 3 / 1; }
.next__meta { grid-column: 1 / 5; color: var(--ink-2); display: grid; gap: 4px; }
@media (hover: hover) {
  .next__a:hover .next__name { color: var(--accent-large); }
  .next__a:hover .next__lbl svg { transform: translateX(6px); }
  .next__a:hover .fig img { transform: scale(1.03); }
}
.next__a .fig img { transition: transform 1.2s var(--ease-out); }
.prevnext { padding: 18px 0 0; display: flex; justify-content: space-between; gap: 12px; }
@media (max-width: 899px) {
  .next__fig, .next__meta { grid-column: 1 / 13; }
  .next__meta { order: 2; }
}

/* ---------- podstránky (práce, štúdio, kontakt) ---------- */
.ph { padding-top: calc(var(--hdr) + clamp(24px, 4vw, 56px)); }
.ph__top { align-items: baseline; color: var(--ink-2); }
.ph__no { grid-column: 1 / 7; color: var(--accent-text); }
.ph__aside { grid-column: 7 / 13; justify-self: end; }
/* Marek 10. 10. 2026, bod 2: obrovské „Work“ zmenšiť (predtým clamp(64px, 16.5vw, 300px)) */
.ph__title { margin-top: clamp(12px, 2vw, 28px); font-size: clamp(40px, 6vw, 96px); font-weight: 700; letter-spacing: -0.045em; line-height: 0.8; margin-left: -0.045em; }
.ph__lead { margin-top: clamp(24px, 3vw, 44px); padding-top: 16px; border-top: 1px solid var(--ink); }
.ph__lead p { grid-column: 3 / 12; font-size: var(--fs-lead); line-height: 1.16; letter-spacing: -0.022em; font-weight: 500; text-wrap: pretty; }
.ph__lead p + p { margin-top: .5em; }
.ph__lead .mono { grid-column: 1 / 3; padding-top: .7em; }
/* Štúdio: dlhší Marekov odsek (bod 6) – menší rez, kratší riadok */
.ph__lead--text p { grid-column: 3 / 11; font-size: clamp(18px, 1.55vw, 24px); line-height: 1.42; letter-spacing: -0.01em; max-width: 64ch; }
.ph__lead--text .mono { padding-top: .45em; }
@media (max-width: 899px) {
  .ph__lead .mono { grid-column: 1 / 13; padding: 0 0 12px; }
  .ph__lead p { grid-column: 1 / 13; }
}

.person { padding-top: clamp(28px, 4vw, 56px); row-gap: 24px; align-items: start; }
.person + .person { margin-top: clamp(40px, 5vw, 80px); }
.person__body > p:only-child { font-size: 20px; line-height: 1.42; letter-spacing: -0.01em; font-weight: 500; }
/* podstránky (correction 02, P11 a P12): pod hlavičkou s linkou žiadna druhá linka; Studio text bez štítku */
.sec__head + .ph__lead { border-top: 0; }
.ph__lead--plain p { grid-column: 3 / 11; }
.sec--works { padding-top: clamp(16px, 2vw, 28px); }
.hero + .sec--lead { padding-top: 0; }
.hero + .sec--lead .ctrl--lead { padding-top: 14px; }
@media (max-width: 899px) { .ph__lead--plain p { grid-column: 1 / 13; } .person__body > p:only-child { font-size: 17px; line-height: 1.45; } }
.person__ph { grid-column: 1 / 4; }
/* Marek 16. 10. 2026 (P15 až P17): fotka v kruhu */
.person__frame { position: relative; width: 100%; max-width: 260px; aspect-ratio: 1 / 1; border-radius: 50%; background: var(--bg-2); overflow: hidden; }
.person__frame picture { position: absolute; inset: 0; }
.person__ph img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.02); }
.person__cap { display: flex; justify-content: space-between; gap: 10px; padding-top: 10px; margin-top: 10px; border-top: 1px solid var(--line); color: var(--ink-2); }
.person__id { grid-column: 4 / 7; }
.person__name { font-size: clamp(28px, 3vw, 46px); font-weight: 700; letter-spacing: -0.035em; line-height: 0.98; }
.person__role { margin-top: 10px; color: var(--ink-2); }
.person__body { grid-column: 7 / 13; display: grid; gap: 1em; }
.person__body > p { max-width: 54ch; }
.person__body > p:first-child { font-size: 20px; line-height: 1.38; letter-spacing: -0.01em; font-weight: 500; }
.cv { margin-top: 18px; border-top: 1px solid var(--ink); }
.cv__h { padding: 10px 0; color: var(--ink-2); border-bottom: 1px solid var(--line); }
.cv li { display: grid; grid-template-columns: 7.5em 1fr; column-gap: 12px; padding: 11px 0 12px; border-bottom: 1px solid var(--line); font-size: 15px; line-height: 1.4; }
.cv li .mono { color: var(--accent-text); padding-top: 2px; }
@media (max-width: 899px) {
  .person__cap { display: none; } /* meno a titul sú hneď vedľa vo veľkom */
  .person__ph { grid-column: 1 / 6; }
  .person__id { grid-column: 6 / 13; align-self: end; }
  .person__body { grid-column: 1 / 13; }
  .cv li { grid-template-columns: 6.8em 1fr; }
}

.svc { padding-top: 24px; row-gap: 16px; }
.svc__name { grid-column: 3 / 7; font-size: clamp(22px, 2.2vw, 34px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.02; }
.svc__text { grid-column: 7 / 13; color: var(--ink); max-width: 56ch; }
.svc__no { grid-column: 1 / 3; color: var(--accent-text); padding-top: .4em; }
@media (max-width: 899px) { .svc__name, .svc__text { grid-column: 1 / 13; } .svc__no { grid-column: 1 / 13; } }

.awt { padding-top: 8px; }
.awt__head, .awt__row { display: grid; grid-template-columns: 88px 2.4fr 1fr 2fr; column-gap: var(--gap); align-items: baseline; }
.awt__head { padding: 12px 0 10px; color: var(--ink-2); border-bottom: 1px solid var(--ink); }
.awt__row { padding: 18px 0 17px; border-bottom: 1px solid var(--line); }
.awt__yr { color: var(--accent-text); }
.awt__name { font-size: clamp(18px, 1.6vw, 24px); font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; }
.awt__row a:hover { color: var(--accent-text); }
@media (max-width: 899px) {
  .awt__head { display: none; }
  .awt__row { grid-template-columns: 58px 1fr; row-gap: 4px; }
  .awt__res, .awt__prod { grid-column: 2 / 3; font-size: 14px; color: var(--ink-2); }
}

/* stránka Awards: svetlý archív v štýle Indexu (tmavý blok ostáva len na úvode); rok raz pri skupine, medzi rokmi tmavá linka */
.arc { padding-top: calc(var(--hdr) + clamp(32px, 4vw, 64px)); }
.arc { --arc-cols: minmax(0, 1.1fr) minmax(0, 2fr) minmax(0, 2fr) 76px; }
.arc__head, .arc__yr-grp { display: grid; grid-template-columns: 88px minmax(0, 1fr); column-gap: var(--gap); }
.arc__head { grid-template-columns: 88px var(--arc-cols); padding: 22px 0 10px; color: var(--ink-2); border-bottom: 1px solid var(--ink); }
.arc__yr-grp + .arc__yr-grp { border-top: 1px solid var(--ink); }
.arc__yr { padding-top: 19px; font-size: var(--fs-mono); font-weight: 400; color: var(--accent-text); }
.arc__row { display: grid; grid-template-columns: var(--arc-cols); column-gap: var(--gap); align-items: center; padding: 14px 0 13px; }
.arc__row + .arc__row { border-top: 1px solid var(--line); }
.arc__comp { font-size: clamp(18px, 1.6vw, 24px); font-weight: 700; letter-spacing: -0.02em; line-height: 1.1; }
.arc__cat { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.arc__name { font-size: 15px; }
.arc__res { color: var(--accent-text); }
.arc__prod { font-size: 15px; justify-self: start; }
.arc__row a:hover { color: var(--accent-text); }
.arc__th { position: relative; width: 76px; aspect-ratio: 4 / 3; overflow: hidden; background: var(--plate, var(--bg)); }
.arc__th--none { background: none; }
.arc__th picture { position: absolute; inset: 0; }
.arc__th img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
@media (max-width: 899px) {
  .arc__head { display: none; }
  /* mobil: rok nad skupinou, v riadku súťaž, pod ňou kategória a práca, fotka vpravo */
  .arc__yr-grp { grid-template-columns: minmax(0, 1fr); }
  .arc__yr { padding-top: 16px; }
  .arc__row { grid-template-columns: minmax(0, 1fr) 64px; column-gap: 12px; row-gap: 4px; align-items: start; padding: 10px 0 14px; }
  .arc__comp, .arc__cat, .arc__prod { grid-column: 1 / 2; }
  .arc__comp { font-size: 18px; }
  .arc__name, .arc__prod { font-size: 14px; }
  .arc__prod { color: var(--ink-2); }
  .arc__th { grid-column: 2 / 3; grid-row: 1 / span 3; align-self: center; width: 64px; }
}

.ct { padding-top: clamp(28px, 4vw, 56px); }
.ct__row { align-items: baseline; padding: 22px 0 24px; border-bottom: 1px solid var(--line); row-gap: 8px; }
.ct__row:first-child { border-top: 1px solid var(--ink); }
.ct__no { grid-column: 1 / 3; color: var(--accent-text); }
.ct__val { grid-column: 3 / 10; }
.ct__side { grid-column: 10 / 13; justify-self: end; text-align: right; color: var(--ink-2); }
.ct__addr { font-size: clamp(20px, 1.9vw, 28px); font-weight: 600; letter-spacing: -0.02em; line-height: 1.25; }
.ct__addr span { display: block; }
.ct__addr .mono { font-weight: 400; color: var(--ink-2); margin-top: 6px; letter-spacing: 0.01em; }
/* dva kontakty (Marek 10. 10. 2026, bod 3): meno, funkcia, telefón, e-mail */
.ct__person { font-size: 17px; display: grid; gap: 4px; justify-items: start; }
.ct__person .nm { font-size: clamp(20px, 1.9vw, 28px); font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; }
.ct__person .ct__rola { color: var(--accent-text); margin-bottom: 6px; }
.ct__person a { padding: 2px 0; }
.ct__person a:hover { color: var(--accent-text); }
@media (max-width: 899px) {
  .ct__no { grid-column: 1 / 13; }
  .ct__val, .ct__side { grid-column: 1 / 13; justify-self: start; text-align: left; }
}

/* ---------- domov: práce hneď pod pásom ---------- */
.sec--lead { padding-top: clamp(14px, 1.6vw, 24px); }
.ctrl--lead { padding-top: 0; }
.ctrl__lead { grid-column: 1 / 4; display: flex; align-items: baseline; gap: 12px; }
.ctrl__title { font-size: 15px; font-weight: 600; letter-spacing: -0.005em; line-height: 1.2; }
.ctrl--lead .ctrl__filters { grid-column: 4 / 10; }
.ctrl--lead .ctrl__views { grid-column: 10 / 13; }
.ctrl--lead + [data-pane] .gal { padding-top: clamp(16px, 1.8vw, 28px); }
@media (max-width: 899px) {
  .ctrl__lead, .ctrl--lead .ctrl__filters { grid-column: 1 / 13; }
  .ctrl--lead .ctrl__views { grid-column: 1 / 13; }
}

/* ---------- detaily (pripnutá sekcia, makrá odkrývané maskou) ---------- */
.dt { padding-top: clamp(72px, 10vw, 160px); }
.dt__frames { display: grid; gap: clamp(28px, 4vw, 56px); padding-top: clamp(20px, 2.4vw, 36px); }
.dt__f { margin: 0; }
.dt__img { position: relative; overflow: hidden; aspect-ratio: 2 / 1; background: var(--plate, var(--bg)); }
.dt__img .pic, .dt__img picture { position: absolute; inset: 0; }
.dt__img img { width: 100%; height: 100%; object-fit: cover; }
.dt__cap { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline; padding-top: 12px; color: var(--ink-2); }
.dt__word { color: var(--ink); }
.dt__prod { color: var(--ink-2); }
.dt__prod:hover { color: var(--accent-text); }
.dt__lbl { margin-right: 8px; }
.dt__bar { display: none; }
/* mobil: bez pinu – zábery pod sebou (4:3), každý sa odkryje maskou pri dorolovaní, popis pod ním */
@media (max-width: 899px) {
  .dt__img { aspect-ratio: 4 / 3; }
  .dt__cap { display: grid; grid-template-columns: 2.6em minmax(0, 1fr); column-gap: 0; row-gap: 2px; }
  .dt__cap .dt__word, .dt__cap .dt__prod { grid-column: 2; }
  .motion [data-reveal-m] { clip-path: inset(0 0 100% 0); }
}
/* desktop: zdroje detailov majú 1600 px – pódium len v stĺpcoch 2–11 mriežky (~1150 px pri 1440), aby
   zábery neboli pri DPR 2 mäkké; okolo ostáva plocha #EDEDED (originály 3000+ px sú otvorená otázka pre Mareka) */
:root { --side: calc(var(--gutter) + (100vw - 2 * var(--gutter) - 11 * var(--gap)) / 12 + var(--gap)); }
@media (min-width: 900px) {
  .dt__frames { padding-left: var(--side); padding-right: var(--side); }
  .bleed__fig { width: auto; margin-left: var(--side); margin-right: var(--side); }
  .bleed__cap { padding-left: var(--side); padding-right: var(--side); }
  .dg__item--a { grid-column: 2 / 12; }
}
/* desktop s pohybom: pódium pripnuté cez sticky, ďalší záber sa odkryje zdola maskou ako list, ktorý sa vysúva */
@media (min-width: 900px) {
  .motion .dt { height: calc((var(--n) + 0.35) * 100svh); }
  .motion .dt__stage { position: sticky; top: 0; height: 100svh; display: flex; flex-direction: column; padding-top: calc(var(--hdr) + 12px); padding-bottom: 16px; }
  .motion .dt__frames { position: relative; flex: 1; display: block; min-height: 0; }
  /* každý záber leží celý vo vnútornom ráme (overflow: clip) – nič z predošlého nevytŕča za okraj */
  .motion .dt__f { --rv: 0; position: absolute; inset: clamp(20px, 2.4vw, 36px) var(--side) 0; display: flex; flex-direction: column; background: var(--bg); clip-path: inset(calc(var(--rv) * 1%) 0 0 0); overflow: clip; }
  .motion .dt__f + .dt__f { --rv: 100; }
  .motion .dt__img { flex: 1; aspect-ratio: auto; min-height: 0; }
  .motion .dt__cap { display: none; }
  .motion .dt__bar { display: block; position: relative; flex: 0 0 auto; height: calc(1.5em + 14px); overflow: hidden; margin-top: 0; }
  /* neaktívne popisy sú priehľadné (nie visibility: hidden) – Tab prejde všetky 4 odkazy a app.js pri fokuse
     dorovná pódium na ich záber; aktívny je vždy len jeden */
  .dt__bi { position: absolute; left: var(--side); right: var(--side); top: 12px; display: flex; flex-wrap: nowrap; gap: 16px; align-items: baseline; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--ink-2);
    transform: translateY(100%); opacity: 0; pointer-events: none; transition: transform .45s var(--ease-out), opacity .3s var(--ease-out); }
  .dt__bi.is-out { transform: translateY(-100%); }
  .dt__bi.is-on { transform: none; opacity: 1; pointer-events: auto; }
  .dt__bi:focus-within { opacity: 1; transform: none; }
  .dt__bi .dt__word { color: var(--ink); }
}


/* produkt: číslo sekcie je mimo H2 (nadpis = len „About the project“ / „O projekte“) */
.obj__label { font-weight: 400; display: flex; gap: 10px; align-items: baseline; }
.obj__label .obj__n { color: var(--ink-2); }
.obj__h { font: inherit; letter-spacing: inherit; color: var(--accent-text); }


/* ---------- odhaľovanie (len s pohybom) ---------- */
.motion [data-split]:not(.is-split) { clip-path: inset(0 0 100% 0); }
@media (max-width: 899px) { .motion [data-nogate-m]:not(.is-split) { clip-path: none; } }
.motion [data-reveal] { clip-path: inset(0 0 100% 0); }
.motion [data-fade]:not(.is-faded) { opacity: 0; transform: translateY(16px); }
.motion [data-line] { transform: scaleX(0); transform-origin: 0 50%; }
.split-line { display: block; }
/* SplitText mask: 'lines' – rodič .split-line má overflow: clip; rozšíriť o 0,18em hore aj dole (Č, Š, Ž, Ľ, dĺžne, „ľ“, „ť“) */
[data-split] .split-line-mask { padding-top: 0.18em; margin-top: -0.18em; padding-bottom: 0.12em; margin-bottom: -0.12em; }
.mask { padding-top: 0.18em; margin-top: -0.18em; }
.mask { display: block; overflow: hidden; padding-bottom: 0.04em; margin-bottom: -0.04em; }
.rise { display: block; }
.motion .rise { animation: rise-in 1.25s var(--ease-out) .12s both; }
@keyframes rise-in { from { transform: translateY(102%); } }
.motion .fadein { animation: slideup 1s var(--ease-out) both; animation-delay: var(--d, .3s); }

/* nadpis podstránky s veľkým písmenom s diakritikou (Štúdio): miesto pre mäkčeň nad dotažnicou, nič neprekrýva nadtitulok */
.ph__title--acc { margin-top: calc(clamp(12px, 2vw, 28px) + 0.2em); }
.ph__title--acc .mask { padding-top: 0.3em; margin-top: -0.3em; }

/* prvá karta galérie na domove = LCP: odkrytie čisto cez CSS hneď od prvého vykreslenia, bez čakania na GSAP */
.motion .fig--lcp { animation: unmask .95s var(--ease-io) .08s both; }
.motion .fig--lcp img { animation: unzoom 1.4s var(--ease-out) .08s both; }

/* stránka produktu: kontextový tón pásma hero (drevo teplo, kov/sklo chladno) – násobiaca vrstva, mäkko dobieha do #EDEDED */
.obj__band { position: relative; isolation: isolate; background: var(--bg); }
.obj__band::after {
  content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; mix-blend-mode: multiply;
  background: linear-gradient(180deg, var(--tone, #fff) 0, var(--tone, #fff) calc(100% - 180px), #fff 100%);
}
/* text nad vrstvou tónu (nemieša sa – čistá čierna, žiadne farebné lemy písma); tónuje sa len plocha a fotka */
.obj__band .obj__head > *, .obj__band .sheet { position: relative; z-index: 4; }
.obj__band .sheet { position: sticky; }
@media (max-width: 899px) { .obj__band .sheet { position: relative; } }

/* päta: písmená sa zdvihnú rovno v čiernej (len pohyb, žiadna interpolácia farby);
   jantárový akcent len pri prejdení myšou (akcent patrí číslam, filtru a odkazom) */

/* ---------- prechody medzi stránkami (View Transitions) ---------- */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: vt-out .45s var(--ease-io) both; }
::view-transition-new(root) { animation: vt-in .7s var(--ease-out) .12s both; }
::view-transition-group(*) { animation-duration: .8s; animation-timing-function: var(--ease-io); }
@keyframes vt-out { to { opacity: 0; transform: translateY(-24px); } }
@keyframes vt-in { from { opacity: 0; transform: translateY(24px); } }
.hdr { view-transition-name: hdr; }
/* signature prechod karta -> produkt: fotka a názov zdieľajú meno (obj-<slug>, t-<slug>) */
/* mená platia LEN pri prechode z karty / riadku / „Next project“ (html.vt) – inak iba prelínanie */
.vt-on .vt-obj, .vt .obj__fig .vt-obj { view-transition-name: var(--vtn); view-transition-class: obj; }
.vt-on .vt-t, .vt .obj__title .vt-t { view-transition-name: var(--vtn); }
.vt-on .vt-obj[data-reveal] { clip-path: none !important; }
::view-transition-group(.obj) { animation-duration: .9s; animation-timing-function: cubic-bezier(.77, 0, .18, 1); }
::view-transition-old(.obj), ::view-transition-new(.obj) { height: 100%; width: 100%; object-fit: cover; }
::view-transition-old(.obj) { animation: none; opacity: 0; }
::view-transition-new(.obj) { animation: none; }

/* Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  *, *::before, *::after { animation: none !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .wm__t { will-change: auto; }
}
@keyframes slideup { from { transform: translateY(28px); } }

/* ---------- korektúry 03 (Marek 28. 10. 2026) ---------- */
/* K05: text štúdia, prvá veta ako úvodný riadok, potom dva odseky */
.ph__lead--plain .ph__hl { font-size: var(--fs-lead); line-height: 1.12; letter-spacing: -0.022em; font-weight: 600; max-width: 30ch; margin-bottom: .35em; }
.ph__lead--plain p + p { margin-top: .9em; }
/* K12: References má prepínač Gallery / Index ako Products (len prepínač, bez filtrov) */
.ctrl--views { border-bottom: 0; padding: 18px 0 4px; }
.ctrl--views .ctrl__views { grid-column: 1 / 13; justify-self: end; }
.mk-sec--full [data-pane="index"] .mkc { padding-top: clamp(16px, 2vw, 28px); }
@media (max-width: 899px) { .ctrl--views .ctrl__bar { display: flex; justify-content: flex-end; } }
/* K16: galéria fotiek produktu, rovnaké náhľady 4:3, klik otvorí fotku na celú obrazovku */
.gl { padding-top: clamp(24px, 3vw, 44px); row-gap: clamp(24px, 3vw, 44px); list-style: none; margin: 0; }
.gl__item { grid-column: span 4; min-width: 0; }
.gl__a { display: block; cursor: zoom-in; }
.gl__a .fig { --ar: 4 / 3; }
.gl__a .fig img { transition: transform 1.1s var(--ease-out); }
@media (hover: hover) { .gl__a:hover .fig img { transform: scale(1.035); } }
.gl__a:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.gl__cap { margin-top: 10px; color: var(--ink-2); }
@media (max-width: 899px) { .gl__item { grid-column: span 6; } .gl { row-gap: 20px; } }
/* lightbox: plocha stránky, fotka celá (contain),nič netrhá; nábeh a prechod s doznievaním (expo out) */
.lb { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--bg); color: var(--ink); opacity: 0; transition: opacity .4s var(--ease-out); overscroll-behavior: contain; }
.lb.is-open { opacity: 1; }
.lb::backdrop { background: transparent; }
.lb__stage { position: absolute; inset: 72px calc(var(--gutter) + 72px) 72px; display: flex; align-items: center; justify-content: center; touch-action: pan-y; }
.lb__img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; opacity: 0; transform: translate3d(var(--dx, 0px), 0, 0) scale(.975); transition: opacity .5s var(--ease-out), transform .9s var(--ease-out); user-select: none; -webkit-user-drag: none; }
.lb__img.is-in { opacity: 1; transform: none; }
.lb__bar { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 24px; display: flex; gap: 16px; align-items: baseline; color: var(--ink-2); }
.lb__n { color: var(--accent-text); min-width: 4.5em; }
.lb__btn { position: absolute; width: 52px; height: 52px; display: grid; place-items: center; padding: 0; border: 1px solid var(--ink); background: var(--bg); color: var(--ink); cursor: pointer; transition: background-color .45s var(--ease-out), color .45s var(--ease-out); }
.lb__btn:hover { background: var(--ink); color: var(--bg); }
.lb__btn:focus-visible { outline: 2px solid var(--accent-text); outline-offset: 3px; }
.lb__btn svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; }
.lb__btn path, .lb__btn line { stroke: currentColor; stroke-width: 1.5; fill: none; }
.lb__close { top: 12px; right: var(--gutter); }
.lb__prev { left: var(--gutter); top: 50%; margin-top: -26px; }
.lb__next { right: var(--gutter); top: 50%; margin-top: -26px; }
@media (max-width: 899px) {
  .lb__stage { inset: 72px 0 132px; }
  .lb__prev, .lb__next { top: auto; bottom: 16px; margin-top: 0; }
  .lb__bar { bottom: 84px; flex-wrap: wrap; row-gap: 4px; }
}
html.lb-open { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .lb__img { transform: none; } }

/* ---------- korektúry 04 (Marek 6. 11. 2026, „Korektúry WEB_4.11.2027.docx“) ---------- */
/* K04-15: úvod = fotky na celú obrazovku pod panelom s menu a EN/SK (hlavička ostáva na farbe stránky), logo cez fotku,
   striedanie po 3 s (app.js), produkty až pod nimi. Nová fotka nabehne cez starú (stará ostáva plná, kým nová nie je celá). */
/* korektúry 05 (K05-03): fotka až po horný okraj okna, hlavička pri príchode nie je (logo a hamburger ležia na fotke) */
.hero--hs { padding: 0; }
.hs { position: relative; height: 100vh; height: 100svh; min-height: 340px; overflow: hidden; background: var(--bg-2); }
.hs__track { position: absolute; inset: 0; }
.hs__s { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity 1s var(--ease-out), visibility 0s linear 1s; }
.hs__s.is-on { z-index: 2; opacity: 1; visibility: visible; transition: opacity 1s var(--ease-out), visibility 0s; }
.hs__s.is-prev { z-index: 1; opacity: 1; visibility: visible; transition: none; }
.hs__s picture { position: absolute; inset: 0; }
.hs__s img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pl, 50% 50%); }
@media (max-aspect-ratio: 1/1) { .hs__s img { object-position: var(--pp, 50% 50%); } }
/* logo cez fotku: v strede (K05-03), výška a veľkosť ako doteraz; pri rolovaní prejde doľava do hlavičky (app.js) */
.hero--hs .wm { position: absolute; left: 0; right: 0; top: calc(var(--hdr) + clamp(8px, 2vw, 28px)); color: var(--ink); transition: color .6s var(--ease-out); }
.hero--hs .wm__t { margin-inline: auto; }
/* farba loga podľa fotky (zmerané po písmenách v tools/uvod-fotky.mjs): na tmavej ploche svetlé; po odrolovaní vždy
   tmavé (hlavička). K05-10: bez obrysu a bez podkladu, čitateľnosť rieši len farba a výrez fotky. */
@media (min-aspect-ratio: 1001/1000) { .hero--hs[data-l="light"] .wm { color: #F5F5F3; } }
@media (max-aspect-ratio: 1/1) { .hero--hs[data-p="light"] .wm { color: #F5F5F3; } }
.hdr.is-solid ~ main .hero--hs .wm { color: var(--ink); }
/* K05-04: popisok produktu a počítadlo s tlačidlom z fotky preč; pauza striedania (WCAG 2.2.2) ostáva pre klávesnicu,
   tlačidlo je vidieť len pri fokuse */
.hs__pause { position: absolute; right: var(--gutter); bottom: clamp(16px, 2vw, 28px); z-index: 3; display: inline-flex; align-items: center; gap: 10px; padding: 11px 14px; background: var(--bg); color: var(--ink); font-size: 13px; font-weight: 500; letter-spacing: 0.01em; line-height: 1.2; }
.hs__pause:not(:focus) { width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.hs__pause svg { width: 14px; height: 14px; flex: none; }
.hs__pause path { stroke: currentColor; stroke-width: 1.6; fill: none; }
.hs__pause .hs__ir { fill: currentColor; stroke: none; display: none; }
.hs.is-paused .hs__ip { display: none; }
.hs.is-paused .hs__ir { display: block; }
html:not(.js) .hs__pause { display: none; }
/* produkty pod fotkou: odstup od spodnej hrany fotky, linka nad filtrami ostáva */
.hero--hs + .sec--lead { padding-top: clamp(24px, 3vw, 48px); }

/* K04-02: podklad náhľadu v Indexe je v bloku Index vyššie (.idx__plug) */

/* K04-01, K04-09, K04-10: bez popisu firmy; v Indexe (úvod aj References) začínajú zoznamy produktov v jednej výške
   (TARA a GOLF zarovno s WAVE) – riadky stĺpcov zdieľajú jednu mriežku (subgrid: logo, názov, miesto, počet, zoznam) */
@media (min-width: 900px) {
  .mkc__c { display: grid; grid-row: span 5; grid-template-rows: subgrid; row-gap: 0; align-content: start; }
  .mkc__n { margin-top: 0; }
}

/* K04-06, K04-07: texty ľudí a text štúdia v rovnakej veľkosti ako riadok pod menom (.person__role = písmo tela) */
.person__body > p, .person__body > p:first-child, .person__body > p:only-child { font-size: var(--fs-body); line-height: 1.55; }
.ph__lead--text p { font-size: var(--fs-body); line-height: 1.55; letter-spacing: 0; }
/* K04-08: nadpis About a „3 people“ preč, ostáva len linka */
.sec__head--bare { padding-bottom: 0; }

/* K04-14: nadpis s linkou je na každej podstránke v tej istej výške ako na Awards (predtým o 1,6 až 8 px vyššie).
   Pri zväčšení 125 % a 150 % padne 1 px linka na tie isté body obrazovky, takže vyzerá všade rovnako ako na Awards. */
.ph, .sec--first { padding-top: calc(var(--hdr) + clamp(32px, 4vw, 64px)); }

/* mozaika galérie, počet produktov 8: rady 2 + 3 + 3 (pravidlo radov, schema/odvodene.mjs) */
@media (min-width: 900px) {
  .card--6 { grid-column: 1 / 5; }
  .card--7 { grid-column: 5 / 9; }
  .card--8 { grid-column: 9 / 13; }
}