/*
Theme Name:  HealthPro.group Theme
Theme URI:   https://healthpro.group/
Author:      HealthPro.group
Author URI:  https://healthpro.group/
Description: Vlastná téma pre web HealthPro.group. Obsahuje hlavičku, pätičku a výpisy dynamických častí (Funkcie, Referencie, Partneri). Zvyšok obsahu sa skladá cez WPBakery (vlastné elementy v inc/wpbakery.php).
Version:     1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License:     GPLv2 or later
Text Domain: healthpro-group-theme
Update URI: false
*/

/* =========================================================================
   Dizajnové premenné – presné hodnoty doplníme podľa Figma dizajnu.
   ========================================================================= */
:root {
	--hpg-color-primary: #0a7d6b;
	--hpg-color-secondary: #103a5a;
	--hpg-color-accent: #2b9bf4;
	--hpg-color-text: #1d2733;
	--hpg-color-muted: #5b6b7b;
	--hpg-color-bg: #ffffff;
	--hpg-color-bg-alt: #f4f7f8;
	--hpg-color-border: #e2e8ec;

	--hpg-font-base: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--hpg-font-heading: var(--hpg-font-base);

	--hpg-container: 1200px;
	--hpg-gap: 24px;
	--hpg-radius: 10px;
}

/* =========================================================================
   Základná typografia a layout (neutrálny základ, dolaďuje sa podľa Figmy).
   ========================================================================= */
*,
*::before,
*::after { box-sizing: border-box; }

body {
	margin: 0;
	font-family: var(--hpg-font-base);
	color: var(--hpg-color-text);
	background: var(--hpg-color-bg);
	line-height: 1.6;
}

a { color: var(--hpg-color-primary); }

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

.hpg-container {
	width: 100%;
	max-width: var(--hpg-container);
	margin-inline: auto;
	padding-inline: 20px;
}

/* Hlavička */
.hpg-site-header {
	border-bottom: 1px solid var(--hpg-color-border);
	background: var(--hpg-color-bg);
}
.hpg-site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--hpg-gap);
	padding-block: 16px;
}
.hpg-site-branding a { font-weight: 700; font-size: 1.25rem; text-decoration: none; color: var(--hpg-color-secondary); }
.hpg-nav ul { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.hpg-nav a { text-decoration: none; color: var(--hpg-color-text); }

/* --- Sticky režimy hlavičky --- */
.hpg-site-header--fixed,
.hpg-site-header--fixed_shrink {
	position: sticky;
	top: 0;
	z-index: 1000;
}
.hpg-site-header--fixed_shrink { transition: box-shadow .2s ease; }
.hpg-site-header--fixed_shrink .hpg-site-header__inner { transition: padding .2s ease; }
.hpg-site-header--fixed_shrink .hpg-site-branding img,
.hpg-site-header--fixed_shrink .custom-logo {
	transition: transform .2s ease;
	transform-origin: left center;
}
/* Po skrolovaní – zmenšenie na 65 % */
.hpg-site-header--fixed_shrink.is-scrolled { box-shadow: 0 2px 10px rgba(0, 0, 0, .08); }
.hpg-site-header--fixed_shrink.is-scrolled .hpg-site-header__inner { padding-block: 8px; }
.hpg-site-header--fixed_shrink.is-scrolled .hpg-site-branding img,
.hpg-site-header--fixed_shrink.is-scrolled .custom-logo { transform: scale(.65); }

/* --- Akcie v hlavičke: telefón + CTA --- */
.hpg-site-header__actions { display: flex; align-items: center; gap: 16px; }

.hpg-header-phone {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	font-weight: 600;
	color: var(--hpg-color-text);
	white-space: nowrap;
}
.hpg-header-phone__icon {
	display: inline-grid;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--hpg-color-muted);
	color: #fff;
}
/* Farba ikonky podľa dostupnosti podpory */
.hpg-header-phone.is-available .hpg-header-phone__icon { background: #1faa59; }   /* zelená = dostupné */
.hpg-header-phone.is-unavailable .hpg-header-phone__icon { background: #c0392b; } /* červená = nedostupné */

.hpg-header-cta {
	display: inline-flex;
	align-items: center;
	padding: 10px 18px;
	border-radius: var(--hpg-radius);
	background: var(--hpg-color-secondary);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}
.hpg-header-cta:hover { background: var(--hpg-color-primary); color: #fff; }

@media (max-width: 860px) {
	.hpg-header-phone__number { display: none; }
}

/* Pätička */
.hpg-site-footer {
	margin-top: 48px;
	padding-block: 32px;
	background: var(--hpg-color-bg-alt);
	border-top: 1px solid var(--hpg-color-border);
	color: var(--hpg-color-muted);
}
.hpg-site-footer__inner { display: flex; gap: var(--hpg-gap); justify-content: space-between; flex-wrap: wrap; }

/* =========================================================================
   Výpisy dynamických častí – mriežky a karty.
   ========================================================================= */
.hpg-grid {
	display: grid;
	gap: var(--hpg-gap);
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	margin-block: var(--hpg-gap);
}
.hpg-grid--partners { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }

/* Počet stĺpcov z nastavenia (CSS premenná) + responzívne zmenšenie */
.hpg-grid[style*="--hpg-grid-cols"] { grid-template-columns: repeat(var(--hpg-grid-cols), 1fr); }
@media (max-width: 782px) { .hpg-grid[style*="--hpg-grid-cols"] { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .hpg-grid[style*="--hpg-grid-cols"] { grid-template-columns: repeat(2, 1fr); } }

.hpg-card {
	border: 1px solid var(--hpg-color-border);
	border-radius: var(--hpg-radius);
	background: var(--hpg-color-bg);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.hpg-card__media img { width: 100%; height: auto; object-fit: cover; }
.hpg-card__body { padding: 16px; }
.hpg-card__title { margin: 0 0 8px; font-size: 1.1rem; }
.hpg-card__meta { color: var(--hpg-color-muted); font-size: .9rem; margin: 0 0 8px; }
.hpg-card__text { margin: 0; }

/* Referencia */
.hpg-reference__quote { font-style: normal; }
/* Partner */
.hpg-card--partner .hpg-card__media { background: var(--hpg-color-bg-alt); display: grid; place-items: center; }

/* Blok "HealthPro Partneri" (WPBakery) – vycentrovaný, čisté logá */
.hpg-partners-block { margin-block: var(--hpg-gap); text-align: center; }
.hpg-partners-block__title { margin: 0 0 12px; font-size: 2rem; }
.hpg-partners-block__desc {
	margin: 0 auto 8px;
	color: var(--hpg-color-muted);
	max-width: 64ch;
}
.hpg-partners-block .hpg-grid--partners {
	margin-top: 40px;
	align-items: center;
	justify-items: center;
	row-gap: 44px;
	column-gap: 32px;
}
.hpg-partner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 56px;
	padding: 8px 12px;
}
.hpg-partner__logo,
.hpg-partner img {
	max-height: 46px;
	width: auto;
	max-width: 100%;
	object-fit: contain;
}
.hpg-partner__name { font-weight: 700; color: var(--hpg-color-secondary); }

/* Blok "HealthPro Kontakt box" (WPBakery) */
.hpg-contactbox {
	margin-block: var(--hpg-gap);
	background: linear-gradient( 180deg, #6cbef6 0%, #1f8fee 100% );
	border-radius: 24px;
	padding: 56px 24px;
	text-align: center;
	color: #fff;
	box-shadow: 0 24px 48px rgba( 31, 143, 238, .25 );
}
.hpg-contactbox__inner { max-width: 760px; margin: 0 auto; }
.hpg-contactbox__title { margin: 0 0 14px; color: #fff; font-size: 2rem; line-height: 1.2; }
.hpg-contactbox__text { margin: 0 0 28px; color: rgba( 255, 255, 255, .92 ); line-height: 1.7; }
.hpg-contactbox__text p { margin: 0 0 .5em; }
.hpg-contactbox__text a { color: #fff; text-decoration: underline; }
.hpg-contactbox__btn {
	display: inline-block;
	padding: 14px 28px;
	border-radius: var(--hpg-radius);
	background: #fff;
	color: var(--hpg-color-secondary);
	font-weight: 700;
	font-size: .85rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: 0 8px 18px rgba( 16, 58, 90, .15 );
}
.hpg-contactbox__btn:hover { background: #f1f6fb; color: var(--hpg-color-secondary); }

/* Slider "HealthPro Referencie" (WPBakery) */
.hpg-ref-slider {
	display: flex;
	gap: 56px;
	align-items: flex-start;
	margin-block: var(--hpg-gap);
}
.hpg-ref-slider__head { flex: 0 0 38%; max-width: 440px; }
.hpg-ref-slider__quote {
	display: block;
	margin: -18px 0 -10px;
	color: #bcdcfa;
	font-size: 110px;
	line-height: 1;
	font-weight: 700;
	font-family: Georgia, "Times New Roman", serif;
}
.hpg-ref-slider__title { margin: 0; font-size: 1.9rem; font-weight: 700; line-height: 1.25; }

.hpg-ref-slider__viewport {
	flex: 1 1 auto;
	min-width: 0;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	cursor: grab;
	touch-action: pan-y;
}
.hpg-ref-slider__viewport::-webkit-scrollbar { display: none; }
.hpg-ref-slider.is-dragging .hpg-ref-slider__viewport { cursor: grabbing; }
.hpg-ref-slider__track { display: flex; }
.hpg-ref-slider__track > * { flex: 0 0 100%; scroll-snap-align: start; }

/* Slide referencie */
.hpg-ref-slide { padding-right: 24px; }
.hpg-ref-slide__text {
	margin: 0 0 26px;
	color: var(--hpg-color-muted);
	font-size: 1.05rem;
	line-height: 1.75;
}
.hpg-ref-slide__author { display: flex; align-items: center; gap: 14px; }
.hpg-ref-slide__avatar img {
	width: 48px; height: 48px;
	border-radius: 10px;
	object-fit: cover;
	display: block;
}
.hpg-ref-slide__meta { display: flex; flex-direction: column; }
.hpg-ref-slide__name { font-weight: 700; color: var(--hpg-color-secondary); }
.hpg-ref-slide__role { color: var(--hpg-color-muted); font-size: .9rem; }

@media (max-width: 782px) {
	.hpg-ref-slider { flex-direction: column; gap: 24px; }
	.hpg-ref-slider__head { flex-basis: auto; max-width: none; }
}

/* Blok "HealthPro Funkcie" (WPBakery) */
.hpg-functions-block { margin-block: var(--hpg-gap); }
.hpg-functions-block__title { margin: 0 0 8px; font-size: 2rem; }
.hpg-functions-block__desc { margin: 0 0 32px; color: var(--hpg-color-muted); max-width: 70ch; }
.hpg-functions-block__more { margin-top: 32px; }
.hpg-button-all {
	display: inline-block;
	padding: 14px 26px;
	border-radius: var(--hpg-radius);
	background: var(--hpg-color-secondary);   /* tmavá navy ako v dizajne */
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	text-transform: uppercase;                /* na stránke automaticky veľké písmená */
	letter-spacing: .04em;
	font-size: .85rem;
}
.hpg-button-all:hover { background: #0b2740; color: #fff; }

/* Karta funkcie (štýl podľa dizajnu) */
.hpg-fcard {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 28px 26px;
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 18px 40px rgba( 16, 58, 90, .08 );
}
.hpg-fcard__icon { min-height: 86px; margin-bottom: 14px; }
.hpg-fcard__icon img { width: auto; height: 48px; max-width: 100%; object-fit: contain; }
.hpg-fcard__title { margin: 0 0 14px; font-size: 1.2rem; font-weight: 700; line-height: 1.25; }
.hpg-fcard__title a { color: var(--hpg-color-text); text-decoration: none; }
.hpg-fcard__title a:hover { color: var(--hpg-color-accent); }
.hpg-fcard__dash {
	display: block;
	width: 26px; height: 3px;
	margin: 0 0 16px;
	border-radius: 2px;
	background: var(--hpg-color-accent);
}
.hpg-fcard__text { margin: 0 0 22px; color: var(--hpg-color-muted); }
.hpg-fcard__more {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--hpg-color-text);
	font-weight: 700;
	font-size: .82rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	text-decoration: none;
	width: max-content;
}
.hpg-fcard__more svg { color: var(--hpg-color-accent); }
.hpg-fcard__more:hover { color: var(--hpg-color-accent); }
.hpg-fcard__more:hover svg { transform: translateX(2px); transition: transform .15s ease; }

/* =========================================================================
   Tmavá pätička (Customizer: Pätička + HealthPro Group).
   ========================================================================= */
.hpg-footer {
	--hpg-footer-bg: #0a1a33;
	--hpg-footer-text: #e7edf5;
	--hpg-footer-muted: #9fb0c3;
	--hpg-footer-border: rgba(255, 255, 255, .12);
	--hpg-footer-accent: #1f87f0;

	margin-top: 48px;
	background: var(--hpg-footer-bg);
	color: var(--hpg-footer-text);
	padding-block: 56px 28px;
}
.hpg-footer a { color: var(--hpg-footer-text); text-decoration: none; }
.hpg-footer a:hover { color: #fff; text-decoration: underline; }

/* Horný blok: značka vľavo + stĺpce widgetov vpravo */
.hpg-footer__top {
	display: grid;
	grid-template-columns: minmax(260px, 1.2fr) 2fr;
	gap: 48px;
	padding-bottom: 40px;
}
.hpg-footer__logo img { max-height: 56px; width: auto; }
.hpg-footer__description {
	margin-top: 18px;
	color: var(--hpg-footer-muted);
	max-width: 44ch;
}
.hpg-footer__description p { margin: 0 0 .5em; }

.hpg-footer__widgets {
	display: grid;
	grid-template-columns: repeat(var(--hpg-footer-cols, 3), 1fr);
	gap: 32px;
}
.hpg-footer__widget-title {
	margin: 0 0 16px;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #fff;
}
.hpg-footer__widget ul { list-style: none; margin: 0; padding: 0; }
.hpg-footer__widget li { margin-bottom: 10px; }
.hpg-footer__widget a { color: var(--hpg-footer-text); }

/* Pruh HealthPro Group */
.hpg-footer__family {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 28px 40px;
	padding: 28px 0;
	border-top: 1px solid var(--hpg-footer-border);
	border-bottom: 1px solid var(--hpg-footer-border);
}
.hpg-footer__family-text { font-weight: 700; color: #fff; }
.hpg-footer__family-logo img { max-height: 30px; width: auto; }
.hpg-footer__family-logos {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 28px 40px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.hpg-footer__family-logos img { max-height: 28px; width: auto; }

/* Spodný riadok: copyright + odkazy */
.hpg-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px 32px;
	padding-top: 24px;
	color: var(--hpg-footer-muted);
	font-size: .9rem;
}
.hpg-footer__links {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 32px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.hpg-footer__links a { color: var(--hpg-footer-muted); }
.hpg-footer__links a:hover { color: #fff; }

@media (max-width: 860px) {
	.hpg-footer__top { grid-template-columns: 1fr; gap: 32px; }
	.hpg-footer__widgets { grid-template-columns: repeat(2, 1fr); }
	.hpg-footer__bottom { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
	.hpg-footer__widgets { grid-template-columns: 1fr; }
}