/*
 Theme Name: Podrška porodici
 Theme URI: https://podrskaporodici.rs/
 Author: Web dizajn Novi Sad
 Description: Custom tema za Centar za edukaciju Podrška porodici — lagana, bez page buildera, identičan dizajn referentnog sajta.
 Version: 1.0.0
 License: GNU General Public License v2 or later
 License URI: https://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: podrska-porodici
*/

*,
*::before,
*::after {
	box-sizing: border-box;
}

:root {
	--pp-font-body: "Source Sans Pro", Helvetica, Arial, Lucida, sans-serif;
	--pp-font-heading: "Playfair Display", Georgia, "Times New Roman", serif;
	--pp-font-size-h3: 30px;
	--pp-line-height-h3: 30px;
	--pp-font-weight-h3: 500;
	--pp-font-size-body: 18px;
	--pp-line-height-body: 22px;
	--pp-font-weight-body: 500;
	--pp-font-weight-bold: 600;
	--pp-color-brown: #bb8c7e;
	--pp-color-brown-dark: #6d625e;
	--pp-color-text: rgb(109, 98, 94);
	--pp-color-accent: #7ebec5;
	--pp-color-white: #ffffff;
	--pp-image-radius: 10px;
	--pp-inset-image-width: 56%;
	--pp-inset-image-offset-start: 8%;
	--pp-inset-image-offset-end: 18%;
	--pp-inset-image-offset-bottom: 6%;
	--pp-inset-image-max: 280px;
	--pp-split-grid-gap: 40px;
	--pp-split-column-image-max: 420px;
	--pp-divider-space: 24px;
	--pp-header-shadow: 0 3px 5px 0 rgba(77, 77, 77, 0.1);
	--pp-layout-width: 95%;
	--pp-transition: 300ms ease;
}

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

body {
	margin: 0;
	font-family: var(--pp-font-body);
	font-size: var(--pp-font-size-body);
	font-weight: var(--pp-font-weight-body);
	font-style: normal;
	line-height: var(--pp-line-height-body);
	color: var(--pp-color-text);
	background-color: var(--pp-color-white);
	-webkit-font-smoothing: antialiased;
}

/* Tekstualni sadržaj — globalna tipografija (Source Sans Pro 500, 18px / 22px) */
.site-main,
.site-main :where(
	p,
	li,
	dd,
	dt,
	blockquote,
	cite,
	label,
	figcaption,
	address,
	em,
	.pp-school-program-list__item-text,
	.pp-school-program-list__lead,
	.pp-school-program-detail__closing-text,
	.pp-school-program-detail__item-text,
	.pp-school-program-detail__subtitle,
	.pp-school-program-about-split__text,
	.pp-school-program-importance__item-text,
	.pp-pd-schools-split__text,
	.pp-tip-schools-split__text,
	.pp-pd-parents-familiar__text,
	.pp-programs__list-item,
	.pp-services__slide-text,
	.pp-about-approach__text,
	.pp-grupe-podrske-content__text,
	.pp-individualna-obuka-about__text,
	.pp-online-konsultacije-main__text,
	.pp-contact__text,
	.pp-workshops__text
),
.pp-school-programs-page :where(
	p,
	li,
	span:not(.pp-list-icon):not(.pp-btn):not([class*="pp-btn"]),
	.pp-school-program-detail__item-text,
	.pp-school-program-detail__subtitle,
	.pp-school-program-list__item-text,
	.pp-school-program-list__lead,
	.pp-school-program-about-split__text p,
	.pp-school-program-importance__item-text,
	.pp-school-program-detail__closing-text,
	.pp-school-programs-cta__text
) {
	font-family: var(--pp-font-body);
	font-size: var(--pp-font-size-body);
	font-weight: var(--pp-font-weight-body);
	font-style: normal;
	line-height: var(--pp-line-height-body);
	color: var(--pp-color-text);
}

/* Globalni paragrafi — pregazi Divi (Source Sans Pro 500, 18px / 22px) */
body #page-container #et-main-area main p {
	font-family: var(--pp-font-body) !important;
	font-size: var(--pp-font-size-body) !important;
	font-weight: var(--pp-font-weight-body) !important;
	font-style: normal !important;
	line-height: var(--pp-line-height-body) !important;
}

.site-main :where(em, .pp-school-program-list__item-text, .pp-school-program-importance__item-text em),
.pp-school-programs-page :where(em, .pp-school-program-list__item-text, .pp-school-program-importance__item-text em) {
	font-style: italic;
}

.site-main :where(p, li) {
	margin-top: 0;
}

/* Bold — referenca: max 600 (Source Sans Pro Semibold) */
strong,
b {
	font-weight: var(--pp-font-weight-bold);
}

/* Globalni h3 — Playfair Display 500, 30px / 30px */
body #page-container h3,
body .site-main h3 {
	font-family: var(--pp-font-heading) !important;
	font-size: var(--pp-font-size-h3) !important;
	font-weight: var(--pp-font-weight-h3) !important;
	font-style: normal !important;
	line-height: var(--pp-line-height-h3) !important;
}

/* Globalni h2 — ista veličina kao h3, boja ostaje iz komponente */
body #page-container h2,
body .site-main h2 {
	font-family: var(--pp-font-heading) !important;
	font-size: var(--pp-font-size-h3) !important;
	font-weight: var(--pp-font-weight-h3) !important;
	font-style: normal !important;
	line-height: var(--pp-line-height-h3) !important;
}

/* Braon naglašeni tekst u sadržaju */
:where(
	.pp-grupe-podrske__accent,
	.pp-tip-schools__accent,
	.pp-tip-parents__accent,
	.pp-pd-schools__accent,
	.pp-pd-parents__accent,
	.pp-individualna-obuka__accent
),
:where(
	.pp-grupe-podrske__accent,
	.pp-tip-schools__accent,
	.pp-tip-parents__accent,
	.pp-pd-schools__accent,
	.pp-pd-parents__accent,
	.pp-individualna-obuka__accent
) strong {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	line-height: inherit;
	font-weight: var(--pp-font-weight-bold);
	color: var(--pp-color-brown);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: var(--pp-image-radius);
}

/* Logotipi — bez zaobljenja */
.pp-header__logo img,
.pp-header__logo-img,
.custom-logo-link img {
	border-radius: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

.site-main {
	min-height: 0;
}

/* Lista — ista ikonica kao u footeru (») */
.pp-list-icon {
	flex: 0 0 24px;
	width: 24px;
	margin-left: 2px;
	margin-top: -2px;
	font-family: var(--pp-font-body);
	font-size: 24px;
	font-weight: 600;
	line-height: 1;
	color: var(--pp-color-brown);
}

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

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: 600;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}