/*
 * Hlavní stylesheet motivu.
 * Obsahuje: @font-face, reset, base typografii, layout helpery, base styly headeru/footeru.
 * Sekce mají vlastní soubory v assets/css/sections/ (přidáme až s každou sekcí ve Fázi 3+).
 */

/* ──────────────────────────────────────────────────────────
   Manrope (lokálně) — soubory očekávané v /assets/fonts/manrope/
   ────────────────────────────────────────────────────────── */
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/manrope/Manrope-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('../fonts/manrope/Manrope-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/manrope/Manrope-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'Manrope';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/manrope/Manrope-Bold.woff2') format('woff2');
}

/* ──────────────────────────────────────────────────────────
   Reset / normalizace (lehká, ne plný Eric Meyer)
   ────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: var(--rp-font-sans);
	font-size: var(--rp-fs-sm);
	line-height: var(--rp-lh-normal);
	letter-spacing: var(--rp-tracking-normal);
	color: var(--rp-color-text);
	background: var(--rp-color-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, svg, video { max-width: 100%; height: auto; display: block; }

a {
	color: var(--rp-color-accent);
	text-decoration: none;
	transition: color var(--rp-transition-fast);
}
@media (hover: hover) and (pointer: fine) {
	a:hover { color: var(--rp-color-accent-light); }
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 var(--rp-space-4);
	letter-spacing: var(--rp-tracking-tight);   /* -3 % */
	line-height: var(--rp-lh-tight);            /* 110 % */
	font-weight: var(--rp-fw-medium);           /* 500 — všechny nadpisy */
	color: var(--rp-color-text);
}

h1 { font-size: var(--rp-fs-3xl); }
h2 { font-size: var(--rp-fs-2xl); }
h3 { font-size: var(--rp-fs-xl); }

p { margin: 0 0 var(--rp-space-4); color: var(--rp-color-text); }

/* Eyebrow — defaultní podoba: NE uppercase, NE zelený, NE tučný. Plně bílý text se stejným trackingem jako body. */
.eyebrow {
	display: inline-block;
	font-size: var(--rp-fs-sm);
	font-weight: var(--rp-fw-regular);
	letter-spacing: var(--rp-tracking-normal);
	color: var(--rp-color-text);
	margin-bottom: var(--rp-space-3);
}

/* ──────────────────────────────────────────────────────────
   Layout helpery
   ────────────────────────────────────────────────────────── */
.container {
	width: 100%;
	max-width: var(--rp-content-max);
	margin-inline: auto;
	padding-inline: var(--rp-space-5);
}
.container--narrow { max-width: 800px; }
.container--wide   { max-width: var(--rp-content-wide); }

/* Sekce — marginy řízené ACF subfields přes --rp-section-mt/mb (viz inc/acf-helpers.php).
   Klient zadává desktop margins (margin_top/_bottom) i mobile (margin_top_mobile/_bottom_mobile).
   Default: žádné marginy (pro sekce, které nemají margin pole — fallback). */
.section {
	margin-top:    var(--rp-section-mt, 0);
	margin-bottom: var(--rp-section-mb, 0);
}

/* Mobil — používej explicitní mobile hodnoty pokud jsou zadané. */
@media (max-width: 767px) {
	.section {
		margin-top:    var(--rp-section-mt-mobile, var(--rp-section-mt, 0));
		margin-bottom: var(--rp-section-mb-mobile, var(--rp-section-mb, 0));
	}
}

/* ───────────────────────────────────────────────────────────
   Scroll animace (GSAP) — initial hidden state.
   .js class přidává inline script v header.php před první framou.
   Bez JS sekce zůstávají viditelné — žádný blackout pro vyhledávače
   ani uživatele s vypnutým JS. Reduced motion handluje animations.js
   (přidá .is-revealed okamžitě).
   ─────────────────────────────────────────────────────────── */
.js .section[data-rp-animate]:not(.is-revealed) {
	opacity: 0;
	transform: translateY(24px);
	will-change: opacity, transform;
}
.section[data-rp-animate].is-revealed {
	will-change: auto;
}

.text-center { text-align: center; }

/* ───────────────────────────────────────────────────────────
   ACF WYSIWYG inline formátování — odkazy, bold, italic, seznamy.
   Targetuje BEM class patterns používané pro body texty v sekcích:
   __body, __text, __subtitle, __desc.
   ─────────────────────────────────────────────────────────── */

/* Odkazy v body textech — světlá zelená (na tmavém bg) */
[class*="__body"] a,
[class*="__text"] a,
[class*="__subtitle"] a,
[class*="__desc"] a {
	color: var(--rp-color-accent-light);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	transition: color 200ms ease;
}
@media (hover: hover) and (pointer: fine) {
	[class*="__body"] a:hover,
	[class*="__text"] a:hover,
	[class*="__subtitle"] a:hover,
	[class*="__desc"] a:hover {
		color: var(--rp-color-accent);
	}
}

/* Strong / em / seznamy uvnitř body */
[class*="__body"] strong,
[class*="__text"] strong,
[class*="__subtitle"] strong,
[class*="__desc"] strong { font-weight: var(--rp-fw-semibold); }

[class*="__body"] em,
[class*="__text"] em,
[class*="__subtitle"] em,
[class*="__desc"] em { font-style: italic; }

[class*="__body"] ul,
[class*="__text"] ul,
[class*="__body"] ol,
[class*="__text"] ol {
	margin: 0 0 12px;
	padding-left: 24px;
}
[class*="__body"] li,
[class*="__text"] li { margin-bottom: 4px; }

/* Override pro karty/panely s bílým pozadím — tmavá accent barva */
.services-carousel__card-text a,
.reviews-carousel__card-text a,
.contact-form__sidebar-text a,
.process-grid__card-text a,
.process-grid__card-bottom-text a {
	color: var(--rp-color-accent-dark);
}
@media (hover: hover) and (pointer: fine) {
	.services-carousel__card-text a:hover,
	.reviews-carousel__card-text a:hover,
	.contact-form__sidebar-text a:hover,
	.process-grid__card-text a:hover,
	.process-grid__card-bottom-text a:hover {
		color: var(--rp-color-accent);
	}
}

/* Skip link (přístupnost) */
.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 9999;
	background: var(--rp-color-accent);
	color: var(--rp-color-bg);
	padding: var(--rp-space-3) var(--rp-space-5);
	font-weight: var(--rp-fw-semibold);
}
.skip-link:focus { left: var(--rp-space-3); top: var(--rp-space-3); }

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	word-wrap: normal !important;
}

/* ──────────────────────────────────────────────────────────
   Header / Footer (jen base — finální podoba s Figmou v dalších fázích)
   ────────────────────────────────────────────────────────── */
.site-header {
	padding-block: var(--rp-space-5);
}
.site-header__inner {
	max-width: var(--rp-content-max);
	margin-inline: auto;
	padding-inline: var(--rp-space-5);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rp-space-5);
}
.site-header__title {
	font-weight: var(--rp-fw-bold);
	font-size: var(--rp-fs-lg);
	color: var(--rp-color-text);
}
.site-header__title-link { color: inherit; }

.menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: var(--rp-space-5);
}
.menu a {
	color: var(--rp-color-text);
	font-weight: var(--rp-fw-medium);
}
@media (hover: hover) and (pointer: fine) {
	.menu a:hover { color: var(--rp-color-accent); }
}

.site-content { min-height: 60vh; }

.site-footer {
	margin-top: var(--rp-space-9);
	padding-block: var(--rp-space-8);
	background: var(--rp-color-surface);
	border-top: 1px solid var(--rp-color-border);
}
.site-footer__inner {
	max-width: var(--rp-content-max);
	margin-inline: auto;
	padding-inline: var(--rp-space-5);
	display: grid;
	gap: var(--rp-space-5);
}
.site-footer__title { font-weight: var(--rp-fw-bold); font-size: var(--rp-fs-lg); }
.site-footer__desc  { color: var(--rp-color-text); margin: var(--rp-space-2) 0 0; }
.site-footer__copy  { color: var(--rp-color-text); font-size: var(--rp-fs-xs); margin: 0; }

/* ──────────────────────────────────────────────────────────
   Karty (base pro Naše hodnoty / výsledky / recenze atd.)
   ────────────────────────────────────────────────────────── */
.card {
	background: var(--rp-color-surface);
	border-radius: var(--rp-radius-lg);
	padding: var(--rp-space-6);
	box-shadow: var(--rp-shadow-card);
}

/* ──────────────────────────────────────────────────────────
   Tlačítka (base)
   ────────────────────────────────────────────────────────── */
.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--rp-space-2);
	padding: var(--rp-space-4) var(--rp-space-6);
	border-radius: var(--rp-radius-pill);
	background: var(--rp-color-accent);
	color: var(--rp-color-bg);
	font-weight: var(--rp-fw-semibold);
	letter-spacing: var(--rp-tracking-normal);
	border: none;
	cursor: pointer;
	transition: background var(--rp-transition-fast), transform var(--rp-transition-fast);
}
@media (hover: hover) and (pointer: fine) {
	.button:hover {
		background: var(--rp-color-accent-light);
		color: var(--rp-color-bg);
		transform: translateY(-1px);
	}
}
.button--ghost {
	background: transparent;
	color: var(--rp-color-accent);
	border: 1px solid var(--rp-color-accent);
}
@media (hover: hover) and (pointer: fine) {
	.button--ghost:hover {
		background: var(--rp-color-accent);
		color: var(--rp-color-bg);
	}
}

/* ──────────────────────────────────────────────────────────
   Statický obsah stránky (page.php fallback — právní texty,
   stránky bez ACF sekcí).
   H1 se renderuje přes the_title() mimo .entry-content.
   ────────────────────────────────────────────────────────── */
.entry-content {
	max-width: 760px;
	margin-top: var(--rp-space-7);        /* 48 px pod H1 stránky */
	color: var(--rp-color-text);
}

/* Nadpisy — výrazně menší než globální h2/h3 */
.entry-content h2 {
	font-size: 1.125rem;                   /* 18 px */
	font-weight: var(--rp-fw-semibold);
	line-height: 1.3;
	letter-spacing: -0.02em;
	margin: var(--rp-space-7) 0 var(--rp-space-3);  /* 48 px nad, 12 px pod */
	color: var(--rp-color-text);
	padding-bottom: var(--rp-space-2);
	border-bottom: 1px solid rgba(243, 244, 246, 0.08);
}
.entry-content h3 {
	font-size: 1rem;                       /* 16 px */
	font-weight: var(--rp-fw-semibold);
	line-height: 1.3;
	letter-spacing: -0.02em;
	margin: var(--rp-space-5) 0 var(--rp-space-2);  /* 24 px nad, 8 px pod */
	color: var(--rp-color-text);
}

/* První h2 bez horního marginu — navazuje na H1 */
.entry-content h2:first-child,
.entry-content h3:first-child {
	margin-top: 0;
}

/* Odstavce, seznamy */
.entry-content p {
	font-size: var(--rp-fs-sm);            /* 16 px */
	line-height: var(--rp-lh-normal);      /* 150 % */
	letter-spacing: -0.02em;
	margin: 0 0 var(--rp-space-4);
	color: var(--rp-color-text);
}
.entry-content p:last-child { margin-bottom: 0; }

.entry-content ul,
.entry-content ol {
	margin: 0 0 var(--rp-space-4);
	padding-left: var(--rp-space-6);      /* 32 px odsazení */
	color: var(--rp-color-text);
}
.entry-content li {
	font-size: var(--rp-fs-sm);
	line-height: var(--rp-lh-normal);
	letter-spacing: -0.02em;
	margin-bottom: var(--rp-space-2);     /* 8 px mezi položkami */
}
.entry-content li:last-child { margin-bottom: 0; }

/* Tučné a kurzíva uvnitř obsahu */
.entry-content strong { font-weight: var(--rp-fw-semibold); }
.entry-content em     { font-style: italic; }

/* Odkazy uvnitř právního textu */
.entry-content a,
.entry-content a:visited {
	color: var(--rp-color-accent-light);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) {
	.entry-content a:hover { color: var(--rp-color-accent); }
}

/* Mobilní padding .section (page.php fallback) */
@media (max-width: 767px) {
	.entry-content { margin-top: var(--rp-space-5); }
	.entry-content h2 { margin-top: var(--rp-space-6); }
}
