/* Nikol Kurik – hodnoty (barvy, velikosti, rozestupy) přesně podle
   Dodavka_web_V9a_cislo05, artboardy 9a (1440) a 9b (390). Nevylepšovat. */

:root {
	--nk-bg: #F9F8F6;
	--nk-text: #1E1C1B;
	--nk-muted: #6B6663;
	--nk-muted2: #4A4644;
	--nk-border: rgba(30, 28, 27, .15);
	--nk-red: #B82E3C;
	--nk-red-dark: #9C2733;
	--nk-dot: #B5B1AD;
	/* Barva odkazu při najetí – vlastnost plochy, ne pravidla. Výchozí
	   předpokládá světlý podklad; červené plochy (patička, dlaždice
	   portfolia) si ji přenastaví na var(--nk-bg), jinak by text splynul
	   s vlastním pozadím (nález 14. 9. 2026 – ".nk-btn" bylo opraveno
	   minule, tohle je stejná chyba mimo tlačítka). */
	--nk-link-hover: var(--nk-red);
	--nk-serif: 'Instrument Serif', Georgia, serif;
	--nk-sans: 'Jost', Helvetica, sans-serif;
	/* Dodatek 18, bod 51 (27. 9. 2026): kolik řádků recenze ukázat sbalená,
	   jedna hodnota na jednom místě – přehodit se dá bez nového balíčku. */
	--nk-review-lines: 4;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--nk-bg);
	color: var(--nk-text);
	font-family: var(--nk-sans);
	font-weight: 300;
	font-size: 16px;
	line-height: 1.6;
	max-width: 100vw;
	overflow-x: hidden;
}
/* aspect-ratio v pravidlech níž potřebuje volnou výšku – HTML width/height
   atributy (kvůli rezervaci místa při načítání) by jinak vyhrály nad ním. */
img { max-width: 100%; display: block; height: auto; }
a { color: var(--nk-text); text-decoration-thickness: 1px; text-underline-offset: 4px; }
/* Tlačítka (.nk-btn) mají vlastní hover stav o pár řádků níž – tohle
   pravidlo by jim jinak obarvilo text na --nk-red, což u .nk-btn--red
   znamená červený text na červeném pozadí (nález 14. 9. 2026). */
a:not(.nk-btn):hover { color: var(--nk-link-hover); }
input, textarea, select, button { font-family: inherit; font-weight: 300; }
h1, h2 { margin: 0; font-weight: 400; }
p { margin: 0; }

.nk-eyebrow { font-weight: 400; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--nk-muted); }
.nk-serif { font-family: var(--nk-serif); }
/* Nadpis sekce (64px/40px) – dřív byl třikrát zadrátovaný inline stylem
   v šabloně, takže na něj mobilní zlom nedosáhl (nález 13. 9. 2026). */
.nk-section-title { font-family: var(--nk-serif); font-size: 64px; line-height: 1; margin-top: 28px; }
.nk-btn { display: inline-block; border-radius: 999px; padding: 17px 30px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; text-decoration: none; border: 0; cursor: pointer; min-height: 44px; transition: background-color .15s ease, color .15s ease; }
.nk-btn--red { background: var(--nk-red); color: var(--nk-bg); }
.nk-btn--red:hover { background: var(--nk-red-dark); color: var(--nk-bg); }
.nk-btn--outline-dark { border: 1px solid var(--nk-text); color: var(--nk-text); background: transparent; }
.nk-btn--outline-dark:hover { background: var(--nk-text); color: var(--nk-bg); }
.nk-btn--outline-light { border: 1px solid var(--nk-bg); color: var(--nk-bg); background: transparent; }
.nk-btn--outline-light:hover { background: var(--nk-bg); color: var(--nk-red); }

/* ---------- Kontejner ---------- */
.nk-page { width: 100%; max-width: 1440px; margin: 0 auto; }
.nk-section { padding: 144px 64px; }
.nk-section--tight { padding-top: 0; padding-bottom: 144px; }

/* ---------- Hlavička ---------- */
.nk-header {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	padding: 20px 64px;
	border-bottom: 1px solid var(--nk-border);
}
.nk-logo { display: inline-flex; align-items: center; gap: .2em; min-height: 44px; font-family: var(--nk-serif); font-size: 32px; line-height: 1; letter-spacing: .02em; text-decoration: none; color: var(--nk-text); }
.nk-logo span { color: var(--nk-red); }
.nk-nav { display: flex; gap: 36px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; }
.nk-nav a { text-decoration: none; }
.nk-nav a.is-active { text-decoration: underline; text-underline-offset: 6px; }
.nk-nav__lang-mobile { display: none; }
.nk-header__right { display: flex; justify-content: flex-end; align-items: center; gap: 28px; }
.nk-lang { display: flex; gap: 10px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; }
.nk-lang a { text-decoration: none; color: var(--nk-muted); }
.nk-lang a.is-active { text-decoration: underline; text-underline-offset: 6px; color: var(--nk-text); }
.nk-header__cta { border: 1px solid var(--nk-text); border-radius: 999px; padding: 11px 22px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; text-decoration: none; color: var(--nk-text); }
.nk-mobile-toggle { display: none; }

/* ---------- Hero ---------- */
.nk-hero-eyebrow { padding: 26px 64px 22px; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; font-weight: 400; color: var(--nk-muted); }
.nk-hero-img { width: 100%; height: 600px; object-fit: cover; }
.nk-hero-row { display: grid; grid-template-columns: 1fr auto; gap: 64px; align-items: start; padding: 22px 64px 0; }
.nk-hero-row p { font-size: 22px; line-height: 1.4; max-width: 560px; }

/* ---------- Marquee ---------- */
/* Pás s klíčovými slovy jede jako smyčka dvou stejných kopií vedle sebe –
   při translateX(-50%) začíná druhá kopie přesně tam, kde na startu byla
   první, takže se to při opakování nevidí. Klientka a majitelka si tenhle
   pohyb výslovně přály (12. 9. 2026) – návrh v9a žádnou animaci nemá, tohle
   je u NĚJ vědomá odchylka od návrhu. Velký pás „Portfolio" níž (viz sekce
   Portfolio) měl stejnou smyčku, ale klientka se 14. 9. 2026 vrátila k
   návrhu – u toho pásu smyčka i pohyb zmizely, tahle poznámka se ho už
   netýká. */
.nk-marquee { margin-top: 96px; border-top: 1px solid var(--nk-border); border-bottom: 1px solid var(--nk-border); padding: 14px 0; overflow: hidden; white-space: nowrap; font-weight: 200; font-size: 15px; letter-spacing: .18em; color: var(--nk-muted); text-transform: uppercase; }
.nk-marquee .dot { padding: 0 22px; font-size: 8px; vertical-align: middle; color: var(--nk-dot); }
.nk-marquee__track { display: inline-flex; width: max-content; animation: nk-marquee-scroll 26s linear infinite; }
.nk-marquee__group { padding-left: 64px; white-space: nowrap; }
@keyframes nk-marquee-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.nk-marquee:hover .nk-marquee__track, .nk-marquee:focus-within .nk-marquee__track { animation-play-state: paused; }

/* ---------- Služby ---------- */
.nk-services-list { margin-top: 64px; border-top: 1px solid var(--nk-text); }
.nk-service { display: grid; grid-template-columns: 64px 1fr 220px 110px; gap: 32px; align-items: start; padding: 40px 0; border-bottom: 1px solid var(--nk-border); }
.nk-service__n { font-weight: 300; font-size: 20px; letter-spacing: .12em; line-height: 1.6; color: var(--nk-muted); }
.nk-service__name { font-weight: 300; font-size: 20px; letter-spacing: .18em; text-transform: uppercase; line-height: 1.3; padding-top: 4px; }
.nk-service__text { margin: 10px 0 0; font-size: 15px; color: var(--nk-muted); max-width: 560px; }
.nk-service__sub { margin-top: 14px; font-size: 14px; letter-spacing: .04em; color: var(--nk-muted2); }
.nk-service__price { font-size: 17px; text-align: right; white-space: nowrap; padding-top: 6px; }
.nk-service__dur { font-size: 13px; letter-spacing: .1em; color: var(--nk-muted); text-align: right; white-space: nowrap; padding-top: 8px; }
.nk-service__meta, .nk-service__n-mobile { display: none; }

/* ---------- Červený blok ---------- */
.nk-manifesto { background: var(--nk-red); color: var(--nk-bg); padding: 144px 64px; }
.nk-manifesto h2 { font-family: var(--nk-serif); font-size: 104px; line-height: .95; max-width: 1100px; }
.nk-manifesto p { margin: 64px 0 0; font-size: 24px; line-height: 1.4; max-width: 900px; }
.nk-manifesto .nk-btn { margin-top: 72px; }

/* ---------- Podtón ---------- */
.nk-podton { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; padding: 144px 64px; align-items: center; }
.nk-podton__img { grid-column: 1 / 6; }
.nk-podton__img img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.nk-podton__body { grid-column: 7 / 13; }
.nk-podton__body h2 { font-family: var(--nk-serif); font-size: 48px; line-height: 1.05; margin-top: 28px; }
.nk-podton__body > p { margin-top: 36px; max-width: 460px; font-size: 16px; }
.nk-podton__card { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--nk-border); max-width: 460px; }
.nk-podton__card-title { font-family: var(--nk-serif); font-size: 28px; line-height: 1.1; }
.nk-podton__card p { margin-top: 12px; color: var(--nk-muted); font-size: 15px; }
.nk-podton__link { display: inline-block; margin-top: 40px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; }

/* ---------- Portfolio ---------- */
/* Vráceno k návrhu v9a (14. 9. 2026) – tenhle pás byl krátce (od 12. 9.) taky
   animovaná smyčka dvou kopií jako `.nk-marquee` výš, ale klientka se u
   tohohle konkrétního pásu rozhodla vrátit k původnímu, statickému návrhu.
   Proto tu není `.nk-portfolio-marquee__track`, žádná animace a jen jeden
   `<span>` v šabloně – ne dva kvůli bezešvé smyčce. */
.nk-portfolio-marquee { overflow: hidden; white-space: nowrap; font-family: var(--nk-serif); font-size: 200px; line-height: .9; text-transform: uppercase; padding: 0 0 48px; border-top: 1px solid var(--nk-border); }
.nk-portfolio-marquee .nk-marquee__group { padding-left: 64px; }
.nk-portfolio-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; align-items: stretch; padding: 0 64px 144px; }
.nk-portfolio-grid img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.nk-portfolio-cta { --nk-link-hover: var(--nk-bg); text-decoration: none; background: var(--nk-red); color: var(--nk-bg); display: flex; flex-direction: column; justify-content: space-between; padding: 40px; aspect-ratio: 4/5; align-self: start; transition: background-color .15s ease; }
.nk-portfolio-cta:hover { background: var(--nk-red-dark); }
.nk-portfolio-cta__label { font-weight: 400; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; }
.nk-portfolio-cta__title { font-family: var(--nk-serif); font-size: 64px; line-height: 1; }
.nk-portfolio-page-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding: 0 64px 144px; }
.nk-portfolio-page-grid figure { margin: 0; }
.nk-portfolio-page-grid img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.nk-portfolio-page-grid figcaption { margin-top: 12px; font-size: 12px; color: var(--nk-muted); }
.nk-portfolio-header { padding: 0 64px; }

/* ---------- O mně ---------- */
.nk-about-head { padding: 0 64px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; align-items: end; }
.nk-about-head__col { grid-column: 1 / 8; }
.nk-about-head h1, .nk-about-head h2 { font-family: var(--nk-serif); font-size: 56px; line-height: 1.05; margin-top: 28px; }
.nk-about-body { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; margin-top: 64px; align-items: start; padding: 0 64px; }
.nk-about-body__text { grid-column: 1 / 9; column-count: 2; column-gap: 32px; }
.nk-about-body__img { grid-column: 9 / 13; }
.nk-about-body p { font-size: 16px; line-height: 1.65; text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.nk-about-body p + p { margin-top: 20px; }
.nk-about-body img { width: 100%; aspect-ratio: 2/3; object-fit: cover; }
.nk-about-projects { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; margin: 72px 64px 144px; padding-top: 32px; border-top: 1px solid var(--nk-border); }
.nk-about-projects__label { grid-column: 1 / 3; }
.nk-about-projects p { grid-column: 3 / 9; font-size: 16px; line-height: 1.65; text-align: justify; hyphens: auto; -webkit-hyphens: auto; }

/* ---------- Recenze ---------- */
.nk-reviews { padding: 0 64px 144px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; border-top: 1px solid var(--nk-border); }
.nk-reviews__summary { grid-column: 1 / 4; padding-top: 64px; }
.nk-reviews__rating { font-family: var(--nk-serif); font-size: 140px; line-height: .85; margin-top: 28px; white-space: nowrap; }
.nk-reviews__rating .star { font-size: 72px; vertical-align: top; line-height: 1.4; }
/* Dodatek 12, bod 34 (26. 9. 2026): počet recenzí je teď sám odkaz na Google
   (dřív samostatný řádek "Nikol Kurik na Googlu →" pod ním, smazaný ze
   šablony úplně) – podtržení a červená při najetí přijdou samy z globálního
   `a` pravidla nahoře, jakmile je element `<a>`; `:hover` tu je jen pro
   jistotu, kdyby specificita jinde v souboru globální pravidlo přebila. */
.nk-reviews__count { margin-top: 32px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--nk-muted); display: inline-block; }
.nk-reviews__count:hover { color: var(--nk-red); }
.nk-reviews__meta { min-width: 0; }
.nk-reviews__list { grid-column: 5 / 12; min-width: 0; }
/* Posuvník: čtenář ho ovládá sám (dotyk, trackpad, klávesnice na focusnutém
   .nk-reviews__scroller, nebo tlačítka) – nic se nehýbe samo od sebe. Bez
   JS zůstává čitelný jako obyčejný vodorovně rolovatelný seznam.
   `align-items: flex-start` (ne výchozí `stretch`) – bez toho by každá
   položka dostala výšku podle té nejvyšší z dvaceti (843px), i když je
   vidět jen jedna najednou. Skutečnou výšku podle PRÁVĚ zobrazené recenze
   nastavuje `reviews-carousel.js` (`scroller.style.height`) – `flex-start`
   je nutná podmínka, aby šla výška každé položky změřit nezávisle na
   ostatních, samotnou opravu dělá až JS (nález 15. 9. 2026, dřív 843px
   „prázdna" pod krátkými recenzemi).

   Dodatek 8, bod 25, varianta B (25. 9. 2026): karusel při svislém
   scrollování stránky na mobilu chytal i vodorovný dotyk (`flex: 0 0
   100%` položky + `scroll-snap-type: x`), takže prst občas omylem
   přepnul recenzi místo posunu stránky. Řešení nemazat kontejner ani
   swipe úplně, jen `touch-action: pan-y` – dotyk teď vždycky posouvá
   stránku svisle, karusel se přepíná výhradně šipkami (`scrollLeft`
   v JS beze změny). `overscroll-behavior-x: contain` navíc brání tomu,
   aby vodorovné přetažení „přeteklo" do sousedního prvku prohlížeče.

   Dodatek 18, bod 51 (27. 9. 2026), obrat proti bodům 35/44: klientka
   sama zvolila ořez s rozbalením místo celých recenzí (viz zadání –
   „poskočení" při zachování celých recenzí jí vadilo víc). `line-clamp`
   je tu teď ZÁMĚRNĚ, ne regrese oproti dřívějším kritériím. Řídí ho
   jedna hodnota `--nk-review-lines` – a `.nk-review__text` má navíc
   pevnou `height` (ne jen `max-height` z line-clampu samotného), aby
   měly všechny sbalené karty STEJNOU výšku i s krátkými recenzemi,
   které by se do 4 řádků samy neroztáhly (měřitelné kritérium: rozdíl
   nejvýš 2 px). Bod 44 (`Math.max` při rolování) zůstává beze změny –
   se stejně vysokými kartami nemá co dorovnávat, takže poskakování
   zmizí samo, bez zásahu do té logiky. */
.nk-reviews__scroller { display: flex; align-items: flex-start; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; touch-action: pan-y; overscroll-behavior-x: contain; }
.nk-reviews__scroller::-webkit-scrollbar { display: none; }
.nk-review { flex: 0 0 100%; scroll-snap-align: start; padding: 64px 0; border-bottom: 1px solid var(--nk-border); }
.nk-review__text { font-weight: 300; font-size: 19px; line-height: 1.6; color: var(--nk-muted2); white-space: pre-line; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--nk-review-lines); overflow: hidden; height: calc(1.6em * var(--nk-review-lines)); }
.nk-review.is-expanded .nk-review__text { -webkit-line-clamp: unset; overflow: visible; height: auto; }
/* Tlačítko drží místo v layoutu i když se pro tuhle recenzi nepoužije
   (`visibility`, ne `display`/`hidden` atribut) – jinak by recenze bez
   tlačítka byly o jeho výšku nižší než recenze s tlačítkem, a sbalené
   karty by zase neměly stejnou výšku, přesně to, co má bod 51 opravit.
   Vzhled jako ostatní vnitřní textové odkazy na webu – žádný nový styl. */
.nk-review__more { display: inline-block; margin-top: 16px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; font-family: inherit; color: var(--nk-text); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; visibility: hidden; }
.nk-review__more.is-visible { visibility: visible; }
.nk-review__more:hover { color: var(--nk-red); }
.nk-review__who { margin-top: 28px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; color: var(--nk-muted); }
.nk-reviews__nav { display: flex; align-items: center; gap: 24px; margin-bottom: 8px; }
/* Šipky u recenzí. Žádné kolečko — rozměr 44×44 zůstává jako dotyková plocha,
   ne jako viditelný tvar (WCAG 2.5.8, stejný důvod jako u .nk-contact__links a).
   `color` tu musí být napsaná: bez ní si znak ← → obarví prohlížeč a na Safari
   a iOS vyjde systémová modrá (nález 1. 10. 2026, klientka ho našla na telefonu
   dřív než my na desktopu). `appearance: none` je tam ze stejného důvodu. */
.nk-reviews__navbtn { width: 44px; height: 44px; padding: 0; border: 0; background: none; appearance: none; -webkit-appearance: none; color: var(--nk-text); font-size: 22px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.nk-reviews__navbtn:hover { color: var(--nk-red); }
.nk-reviews__navbtn:focus-visible { outline: 2px solid var(--nk-red); outline-offset: 2px; }
.nk-reviews__counter { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--nk-muted); }
.nk-reviews__caption { margin-top: 28px; font-size: 13px; color: var(--nk-muted); max-width: 560px; }
@media (prefers-reduced-motion: reduce) {
	.nk-reviews__scroller { scroll-behavior: auto; }
	/* Ne pomaleji – stát. Pohybující se text dělá lidem s vestibulárními
	   potížemi fyzicky zle a mají to proto vypnuté v systému. Jen
	   `.nk-marquee__track` (pás s klíčovými slovy) – portfoliový pás už
	   žádnou animaci nemá vůbec, viz sekce Portfolio výš. */
	.nk-marquee__track { animation: none; }
}

/* ---------- Kontakt / formulář ---------- */
.nk-contact { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; padding: 0 64px 144px; }
.nk-contact__info { grid-column: 1 / 6; }
.nk-contact__info h1, .nk-contact__info h2 { font-family: var(--nk-serif); font-size: 64px; line-height: 1; margin-top: 28px; }
.nk-contact__info > p { margin-top: 28px; max-width: 400px; font-size: 16px; }
.nk-contact__links { margin-top: 40px; display: flex; flex-direction: column; gap: 12px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; }
.nk-contact__links a { display: inline-flex; align-items: center; min-height: 44px; }
.nk-form { grid-column: 7 / 13; display: grid; grid-template-columns: 1fr 1fr; gap: 36px 32px; }
.nk-field { display: block; }
.nk-field--wide { grid-column: 1 / 3; }
.nk-field__label { display: block; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-weight: 400; color: var(--nk-muted); margin-bottom: 4px; }
.nk-field input, .nk-field textarea { display: block; width: 100%; border: 0; border-bottom: 1px solid var(--nk-text); background: transparent; padding: 12px 0; font-size: 17px; outline: none; color: var(--nk-text); resize: none; min-height: 44px; }
/* Návrh chce pole bez rámečku, ale "outline: none" bez náhrady znamená, že
   focus není vidět vůbec (nález 13. 9. 2026 – jen honeypot měl rozdíl proti
   klávesnici). Výraznější spodní linka místo obrysu kolem dokola. */
.nk-field input:focus-visible, .nk-field textarea:focus-visible { border-bottom: 2px solid var(--nk-red); }
.nk-form__submit { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }
.nk-form__note { font-size: 13px; color: var(--nk-muted); }
.nk-form__note a { color: inherit; }
.nk-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.nk-form-message { grid-column: 1 / 3; padding: 16px 0; font-size: 14px; }
.nk-form-message--ok { color: var(--nk-red); }
.nk-form-message--err { color: var(--nk-red); }

/* ---------- Svatby ---------- */
.nk-wedding-hero { background: var(--nk-red); color: var(--nk-bg); padding: 128px 64px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; align-items: end; }
.nk-wedding-hero__col { grid-column: 1 / 8; }
.nk-wedding-hero h1 { font-family: var(--nk-serif); font-size: 104px; line-height: .95; margin-top: 28px; }
.nk-wedding-hero p { margin-top: 56px; font-size: 24px; line-height: 1.4; max-width: 640px; }
.nk-steps { padding: 144px 64px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; }
.nk-steps__intro { grid-column: 1 / 5; }
.nk-steps__intro h2 { font-family: var(--nk-serif); font-size: 48px; line-height: 1.05; margin-top: 28px; text-wrap: balance; }
.nk-steps__list { grid-column: 6 / 13; border-top: 1px solid var(--nk-text); }
.nk-step { display: grid; grid-template-columns: 240px 1fr; gap: 32px; padding: 32px 0; border-bottom: 1px solid var(--nk-border); }
.nk-step__name { font-family: var(--nk-serif); font-size: 28px; line-height: 1.1; }
.nk-step__text { font-size: 15px; color: var(--nk-muted); max-width: 520px; }
.nk-wedding-pricing { padding: 0 64px 144px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; }
.nk-wedding-pricing__intro { grid-column: 1 / 5; }
.nk-wedding-pricing__intro p { margin-top: 28px; font-size: 14px; color: var(--nk-muted); max-width: 320px; }
.nk-wedding-pricing__tables { grid-column: 6 / 13; border-top: 1px solid var(--nk-text); }
.nk-price-group__title { font-weight: 400; font-size: 11px; letter-spacing: .22em; text-transform: uppercase; color: var(--nk-muted); padding: 20px 0 12px; border-bottom: 1px solid var(--nk-border); }
.nk-price-group__title--first { margin-top: 0; }
/* Dodatek 18, bod 50 (27. 9. 2026): tohle pravidlo řešilo pořadí skupin
   („každá kromě první"), ne to, která skupina je skutečná kategorie –
   vedlejším účinkem dostal nadpis „Svatební doprovod & hosté" stejnou
   plnou čáru jako „Výjezd a příplatky", ačkoli je to podnadpis stejné
   úrovně jako „Nevěsta". `border-bottom` odsud smazán úplně (ne
   přebitý níž), `margin-top` zůstává – ten s hierarchií nesouvisí. */
.nk-price-group + .nk-price-group .nk-price-group__title { margin-top: 56px; }
/* Plnou čáru dostane jen skupina, která je opravdu kategorie (dnes jen
   „Výjezd a příplatky") – přes vlastní modifikátor, ne přes pořadí. */
.nk-price-group__title--kategorie { border-bottom: 1px solid var(--nk-text); }
.nk-price-row { display: grid; grid-template-columns: 1fr 220px; gap: 32px; align-items: baseline; padding: 24px 0; border-bottom: 1px solid var(--nk-border); }
.nk-price-row__name { font-weight: 300; font-size: 18px; letter-spacing: .16em; text-transform: uppercase; line-height: 1.35; }
.nk-price-row__note { font-size: 14px; color: var(--nk-muted); margin-top: 6px; max-width: 520px; }
.nk-price-row__price { text-align: right; font-size: 18px; white-space: nowrap; }
.nk-price-row--guest .nk-price-row__name { font-size: 16px; }
.nk-price-row--travel { padding: 16px 0; font-size: 15px; }
.nk-price-row--travel .nk-price-row__name { font-size: 14px; }
.nk-wedding-cta { border-top: 1px solid var(--nk-border); padding: 96px 64px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 32px; align-items: center; }
.nk-wedding-cta h2 { grid-column: 1 / 8; font-family: var(--nk-serif); font-size: 56px; line-height: 1; }
.nk-wedding-cta .nk-btn { grid-column: 10 / 13; justify-self: end; }

/* ---------- Patička ---------- */
/* Červená, rozhodnuto 14. 9. 2026 (varianta B z návrhu, viz NASAZENI.md).
   Světlá verze se sem vrstvila jako výchozí a červená ji přebíjela o pár
   pravidel níž – zdroj byl přepsán rovnou, ne přebit. Veškerý text i
   odkazy jsou na var(--nk-bg) – na červeném pozadí by --nk-muted
   (kontrast 1,06 podle měření 14. 9. 2026) byl prakticky neviditelný. */
.nk-footer { background: var(--nk-red); color: var(--nk-bg); --nk-link-hover: var(--nk-bg); padding: 56px 64px 32px; }
.nk-footer__top { display: flex; justify-content: space-between; align-items: flex-end; gap: 48px; flex-wrap: wrap; }
.nk-footer__logo { font-family: var(--nk-serif); font-size: 72px; line-height: .9; }
.nk-footer__id { font-size: 13px; margin-top: 20px; }
.nk-footer__right { text-align: right; }
/* align-items: center – bez něj mobilní pravidlo níž natáhne odkazy na
   44px box (kvůli dotykovému cíli), ale "English" (span, ne odkaz) zůstane
   na přirozené výšce a jeho text sedí nahoře, ne uprostřed řádku (nález
   14. 9. 2026, změřeno na textu přes Range.getClientRects(), ne na boxu –
   oba boxy jsou 44px vysoké, rozdíl je jen v poloze textu uvnitř). Patří
   to řádku, ne dalšímu selektoru vedle ".nk-footer__social a". */
.nk-footer__social { display: flex; align-items: center; gap: 28px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; justify-content: flex-end; }
.nk-footer__social a { text-decoration: none; color: var(--nk-bg); }
/* "English" je návěští, ne odkaz (verze zatím neběží) – ztlumeno vědomě,
   ale míň než světlá patička dřív dělala se svým --nk-muted (to by tu
   bylo skoro neviditelné). 75 %, ne 60 % – viz MERENI.md, kontrast
   3,83:1 nesplňuje AA (4,5), ale zůstává čitelné; je to vědomá výjimka,
   ne přehlédnutí. */
.nk-footer__social [aria-disabled] { color: rgba(249, 248, 246, .75); }
.nk-footer__credit { margin-top: 16px; font-size: 12px; line-height: 1.8; }
.nk-footer__bottom { display: flex; justify-content: space-between; margin-top: 48px; padding-top: 20px; border-top: 1px solid rgba(249, 248, 246, .5); font-size: 13px; flex-wrap: wrap; gap: 12px; }
.nk-footer__legal { display: flex; gap: 24px; flex-wrap: wrap; }
.nk-footer__legal a { color: var(--nk-bg); }

/* ---------- Cookie lišta ---------- */
.nk-cookie-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 999; background: var(--nk-text); color: var(--nk-bg); padding: 20px 64px; display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.nk-cookie-bar[hidden] { display: none; }
.nk-cookie-bar__text { font-size: 14px; max-width: 760px; margin: 0; }
/* Bod B, zadání „fotka O mně + dvě drobnosti“ (27. 9. 2026): klikací
   plocha odkazu „Cookies“ měřila jen 20,5 px na 390 px šířky – řešeno
   výškou plochy (`min-height` + `inline-flex` na svislé vystředění),
   ne zvětšením písma (`font-size` beze změny) a ne `::after` overlayem
   (ten by přesahoval do sousedního textu ve větě). */
.nk-cookie-bar__text a { color: var(--nk-bg); display: inline-flex; align-items: center; min-height: 44px; }
.nk-cookie-bar__actions { display: flex; gap: 16px; flex-shrink: 0; }
.nk-cookie-bar .nk-btn--outline-dark { border-color: var(--nk-bg); color: var(--nk-bg); }
.nk-cookie-bar .nk-btn--outline-dark:hover { background: var(--nk-bg); color: var(--nk-text); }

/* ---------- Právní stránky ---------- */
.nk-legal { max-width: 760px; margin: 0 auto; padding: 96px 64px 144px; }
.nk-legal h1 { font-family: var(--nk-serif); font-size: 56px; line-height: 1.05; margin-bottom: 48px; }
.nk-legal h2 { font-family: var(--nk-serif); font-size: 28px; margin-top: 48px; margin-bottom: 12px; }
.nk-legal p { font-size: 16px; line-height: 1.7; margin-bottom: 16px; text-align: justify; hyphens: auto; -webkit-hyphens: auto; }
.nk-legal ul { padding-left: 20px; }
.nk-legal table { width: 100%; border-collapse: collapse; margin: 24px 0; font-size: 14px; }
.nk-legal table th, .nk-legal table td { border-bottom: 1px solid var(--nk-border); padding: 8px 12px; text-align: left; }

/* Odsazení nadpisu od hlavičky na samostatných stránkách bez vlastního
   "hero" bloku – stejná hodnota, jakou už dřív používá Portfolio (inline
   styl) a právní stránky (.nk-legal). O mně a Kontakt ji dřív neměly
   vůbec (0 px), takže jim nadpis seděl těsně pod menu (nález 14. 9. 2026).
   Přidáno jako samostatná třída navíc, ne přímo do .nk-about-head/
   .nk-contact – ty se sdílí i s homepage sekcemi, kde tahle mezera navíc
   nepatří. */
.nk-page-top { padding-top: 96px; }

/* =====================================================================
   MOBIL – 390px artboard (9b). Zlom pod 780 px.
   ===================================================================== */
@media (max-width: 780px) {
	.nk-section, .nk-section--tight { padding: 72px 20px; }
	.nk-section-title { font-size: 40px; }
	.nk-header { padding: 12px 20px; position: relative; flex-wrap: wrap; }
	.nk-header__right .nk-lang, .nk-header__cta { display: none; }
	.nk-logo { font-size: 26px; }
	.nk-nav { display: none; flex-direction: column; gap: 0; position: absolute; top: 100%; left: 0; right: 0; background: var(--nk-bg); border-bottom: 1px solid var(--nk-border); padding: 8px 20px 16px; z-index: 20; }
	.nk-nav.is-open { display: flex; }
	.nk-nav a { padding: 12px 0; border-bottom: 1px solid var(--nk-border); min-height: 44px; display: flex; align-items: center; }
	.nk-nav a.nk-nav__lang-mobile { display: flex; color: var(--nk-muted); border-bottom: 0; padding: 12px 0; min-height: 44px; align-items: center; }
	.nk-mobile-toggle { display: flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; padding: 0 4px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; font-weight: 400; background: transparent; border: 0; color: var(--nk-text); cursor: pointer; }
	.nk-header__right { gap: 8px; }

	.nk-hero-eyebrow { padding: 20px 20px 16px; font-size: 11px; }
	.nk-hero-img { height: 520px; }
	.nk-hero-row { grid-template-columns: 1fr; padding: 28px 20px 0; gap: 0; }
	.nk-hero-row p { font-size: 19px; max-width: none; }
	.nk-hero-row .nk-btn { display: block; text-align: center; margin-top: 28px; }

	.nk-marquee { margin-top: 56px; font-size: 13px; }
	.nk-marquee .nk-marquee__group { padding-left: 20px; }
	.nk-marquee .dot { padding: 0 14px; font-size: 7px; }

	.nk-services-list { margin-top: 32px; }
	.nk-service { grid-template-columns: 1fr; padding: 24px 0; gap: 0; }
	.nk-service__n { display: none; }
	.nk-service__body { display: block; }
	/* Dodatek 17, bod 48 (27. 9. 2026): na mobilu se dřív nezmenšovalo vůbec
	   nic – 20px stejně jako na 1440px monitoru, nejdelší nadpis zabíral
	   91 % šířky na 360px displeji. `letter-spacing` (`.18em`/`.12em`,
	   zděděno z pravidla výš/vlastního pravidla) a `line-height` (`1.3`,
	   zděděno) jsou v relativních jednotkách, takže samotná změna
	   `font-size` na 17px přepočítá obojí ve stejném poměru automaticky
	   (3,6→3,06px prostrkání, 26→22px řádkování) – žádné další pravidlo
	   navíc není potřeba. Jediný zlom ve stylopisu zůstává 780px, žádný
	   druhý se nezavádí. */
	.nk-service__name { display: flex; gap: 14px; align-items: baseline; font-size: 17px; padding-top: 0; }
	.nk-service__n-mobile { display: inline; font-family: var(--nk-sans); font-size: 17px; letter-spacing: .12em; color: var(--nk-muted); font-weight: 300; }
	.nk-service__text { font-size: 14px; }
	.nk-service__sub { font-size: 13px; }
	.nk-service__meta { display: flex; justify-content: space-between; margin-top: 14px; font-size: 14px; }
	.nk-service__dur-mobile { color: var(--nk-muted); letter-spacing: .1em; }
	.nk-service__price-mobile { font-size: 16px; }
	/* Bod B, zadání „fotka O mně + dvě drobnosti“ (27. 9. 2026): odkaz
	   „Ceník svateb →“/„Bridal pricing →“ (karta 04) měřil na 390 px jen
	   23 px klikací plochy. Řešeno výškou (`min-height` + `inline-flex`),
	   ne velikostí písma – `.nk-service__price-mobile` sazbu neopouští,
	   jen ta jediná položka bez odkazu (ostatní čtyři služby) zůstává
	   nedotčená, protože se cílí přímo na `a`. */
	.nk-service__price-mobile a { display: inline-flex; align-items: center; min-height: 44px; }
	.nk-service__price, .nk-service__dur { display: none; }

	.nk-manifesto { padding: 72px 20px; }
	.nk-manifesto h2 { font-size: 48px; line-height: .98; }
	.nk-manifesto p { font-size: 18px; margin-top: 28px; }
	.nk-manifesto .nk-btn { display: block; text-align: center; margin-top: 36px; }

	.nk-podton { grid-template-columns: 1fr; padding: 72px 20px; gap: 0; }
	.nk-podton__img, .nk-podton__body { grid-column: 1 / -1; }
	.nk-podton .nk-eyebrow { margin-top: 36px; }
	.nk-podton__body h2 { font-size: 32px; margin-top: 20px; }
	.nk-podton__body > p { margin-top: 24px; font-size: 15px; max-width: none; }
	.nk-podton__card { margin-top: 28px; padding-top: 20px; }
	.nk-podton__card-title { font-size: 24px; }
	.nk-podton__link { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; margin-top: 8px; }

	.nk-portfolio-marquee { font-size: 80px; padding-bottom: 24px; }
	.nk-portfolio-marquee .nk-marquee__group { padding-left: 20px; }
	.nk-portfolio-grid { grid-template-columns: 1fr 1fr; gap: 12px; padding: 0 20px 72px; }
	.nk-portfolio-grid > :nth-child(3) { display: none; }
	.nk-portfolio-cta { padding: 16px; justify-content: flex-end; }
	.nk-portfolio-cta__title { font-size: 28px; }
	/* Rodič .nk-section--tight uz na mobilu nese 20px zleva/zprava sam
	   (sdilene pravidlo .nk-section, .nk-section--tight); tenhle obal tedy
	   na mobilu nema pridavat nic navic, jinak vznikne 20+20=40 (nalez
	   13. 9. 2026 pri vlastnim overovani opravy). */
	.nk-portfolio-header { padding: 0; }
	.nk-portfolio-page-grid { grid-template-columns: 1fr 1fr; gap: 12px; padding: 0 20px 72px; }

	.nk-about-head, .nk-about-body, .nk-about-projects { grid-template-columns: 1fr; padding-left: 20px; padding-right: 20px; margin-left: 0; margin-right: 0; }
	.nk-about-head__col, .nk-about-body__text, .nk-about-body__img, .nk-about-projects__label, .nk-about-projects p { grid-column: 1 / -1; }
	.nk-about-head h1, .nk-about-head h2 { font-size: 36px; }
	/* Dodatek 8, bod 27b (25. 9. 2026): margin-top:0 tu byl schválně kvůli
	   desktopové mezeře 64px, která na mobilu není potřeba – jenže fotka má
	   níž `order:-1` (jde první, před text), takže s nulovou mezerou sedí
	   hned pod nadpisem „O mně“ bez odstupu („nalepená“, nález klientky).
	   Mezera patří jen mobilu – na desktopu je dvousloupcový layout a
	   problém tam není, `margin-top: 64px` z výchozího pravidla zůstává. */
	.nk-about-body { margin-top: 24px; }
	.nk-about-body__text { column-count: 1; }
	.nk-about-body__img { order: -1; width: 64%; margin-bottom: 20px; }
	.nk-about-body__img img { width: 100%; }
	.nk-about-body p { font-size: 15px; }
	.nk-about-body p + p { margin-top: 16px; }
	.nk-about-projects { margin: 0; padding: 36px 20px 72px; border-top: none; }
	.nk-about-projects__label { margin-bottom: 16px; }

	.nk-reviews { grid-template-columns: 1fr; padding: 0 20px 72px; }
	.nk-reviews__summary, .nk-reviews__list { grid-column: 1 / -1; }
	.nk-reviews__summary { padding-top: 44px; }
	/* Návrh (6b) nemá u tohohle řádku mezititulek „Recenze" – jen ve sloupci na 1440. */
	.nk-reviews__summary > .nk-eyebrow { display: none; }
	.nk-reviews__top { display: flex; gap: 20px; align-items: baseline; margin-top: 0; }
	.nk-reviews__rating { font-size: 88px; margin-top: 0; }
	.nk-reviews__rating .star { font-size: 44px; }
	.nk-reviews__count { margin-top: 0; min-height: 44px; display: inline-flex; align-items: center; }
	.nk-review { padding: 40px 0; }
	.nk-review__text { font-size: 17px; }

	.nk-contact { grid-template-columns: 1fr; padding: 0 20px 72px; }
	/* Mobilní pravidlo výš resetuje padding zkratkou (vč. padding-top) a
	   je v souboru později než .nk-page-top, takže by ho na mobilu tiše
	   přebilo – dorovnáno zvlášť, ne přesunem .nk-page-top dolů (to by
	   zase přebilo .nk-about-head, kde tenhle problém není). */
	.nk-contact.nk-page-top { padding-top: 96px; }
	.nk-contact__info, .nk-form { grid-column: 1 / -1; }
	.nk-contact__info h1, .nk-contact__info h2 { font-size: 38px; }
	.nk-contact__info > p { font-size: 15px; }
	.nk-form { grid-template-columns: 1fr; gap: 28px; margin-top: 28px; }
	.nk-field--wide { grid-column: 1 / -1; }
	.nk-form__submit { display: block; }
	.nk-form__submit .nk-btn { display: block; width: 100%; text-align: center; }
	.nk-form__note { display: block; margin-top: 16px; }

	.nk-wedding-hero { padding: 72px 20px; }
	.nk-wedding-hero__col { grid-column: 1 / -1; }
	.nk-wedding-hero h1 { font-size: 52px; }
	.nk-wedding-hero p { font-size: 18px; margin-top: 28px; max-width: none; }
	.nk-steps { grid-template-columns: 1fr; padding: 56px 20px; }
	.nk-steps__intro, .nk-steps__list { grid-column: 1 / -1; }
	.nk-steps__list { margin-top: 28px; }
	.nk-step { grid-template-columns: 1fr; gap: 8px; }
	.nk-wedding-pricing { grid-template-columns: 1fr; padding: 0 20px 56px; }
	.nk-wedding-pricing__intro, .nk-wedding-pricing__tables { grid-column: 1 / -1; }
	.nk-wedding-pricing__tables { margin-top: 24px; }
	.nk-price-row { grid-template-columns: 1fr; gap: 4px; }
	.nk-price-row__price { text-align: left; }
	.nk-wedding-cta { grid-template-columns: 1fr; padding: 56px 20px; text-align: left; }
	.nk-wedding-cta h2 { grid-column: 1 / -1; font-size: 32px; }
	.nk-wedding-cta .nk-btn { grid-column: 1 / -1; justify-self: start; margin-top: 24px; }

	.nk-footer { padding: 36px 20px 24px; }
	.nk-footer__top { display: block; }
	.nk-footer__right { text-align: left; margin-top: 20px; }
	.nk-footer__social { justify-content: flex-start; }
	.nk-footer__bottom { display: block; }
	.nk-footer__legal { margin-top: 8px; }
	.nk-footer__social a, .nk-footer__legal a { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; }

	.nk-cookie-bar { padding: 16px 20px; }

	.nk-legal { padding: 56px 20px 72px; }
	.nk-legal h1 { font-size: 34px; }
}