/*
Theme Name: drenchev.bg
Theme URI: https://drenchev.bg
Description: Child тема на Hello Elementor за drenchev.bg — брандови цветове, локален шрифт Onest с кирилица, брандиран хедър и футър, лого и favicon. Стиловете на страниците са в Elementor (глобални класове dr-* и променливи).
Author: drenchev.bg
Author URI: https://drenchev.bg
Template: hello-elementor
Version: 2.0.1
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: drenchev
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* ---------------------------------------------------------------
 * Brand tokens
 * ------------------------------------------------------------- */
:root {
	--dr-red: #FF3C0B;        /* brand — logo, accents */
	--dr-red-ink: #D93100;    /* red for small text on light bg (AA) */
	--dr-ink: #111113;
	--dr-text: #2B2A2F;
	--dr-muted: #6B6A70;
	--dr-line: #E5E4E1;
	--dr-paper: #F6F4F0;
	--dr-white: #FFFFFF;

	--dr-font: 'Onest', system-ui, sans-serif;

	--dr-header-h: 76px;
	--dr-ease: cubic-bezier(.2, .7, .2, 1);
}

/* ---------------------------------------------------------------
 * Base
 * ------------------------------------------------------------- */
html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body { background-color: var(--dr-white); }

::selection {
	background: var(--dr-red);
	color: var(--dr-ink);
}

:focus-visible {
	outline: 2px solid var(--dr-red);
	outline-offset: 3px;
}

h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }

/* Anchored sections land below the sticky header. */
section[id] { scroll-margin-top: calc(var(--dr-header-h) + 12px); }

/* ---------------------------------------------------------------
 * Header
 * ------------------------------------------------------------- */
.dr-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background-color: rgba(255, 255, 255, .94);
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid transparent;
	transition: border-color .25s var(--dr-ease);
}

.admin-bar .dr-header { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .dr-header { top: 46px; }
}

@media (max-width: 600px) {
	.admin-bar .dr-header { top: 0; }
}

.dr-header.is-scrolled { border-bottom-color: var(--dr-line); }

.dr-header__inner {
	display: flex;
	align-items: center;
	gap: 2rem;
	max-width: 1240px;
	height: var(--dr-header-h);
	margin: 0 auto;
	padding: 0 2rem;
	box-sizing: content-box;
}

.dr-header__logo {
	display: inline-flex;
	flex: none;
}

.dr-header__logo img {
	display: block;
	width: auto;
	height: 28px;
}

.dr-nav {
	display: flex;
	align-items: center;
	gap: 2rem;
	margin-left: auto;
}

.dr-nav__list {
	display: flex;
	align-items: center;
	gap: 2rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.dr-header .dr-nav__list a {
	font-family: var(--dr-font);
	font-size: 15px;
	font-weight: 500;
	color: var(--dr-ink);
	text-decoration: none;
	transition: color .2s var(--dr-ease);
}

.dr-header .dr-nav__list a:hover,
.dr-header .dr-nav__list .current-menu-item > a {
	color: var(--dr-red-ink);
}

.dr-header .dr-header__cta {
	display: inline-flex;
	align-items: center;
	padding: .75rem 1.1rem;
	font-family: var(--dr-font);
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	color: var(--dr-white);
	background-color: var(--dr-ink);
	border-radius: 4px;
	text-decoration: none;
	transition: background-color .2s var(--dr-ease), color .2s var(--dr-ease);
}

.dr-header .dr-header__cta:hover {
	color: var(--dr-ink);
	background-color: var(--dr-red);
}

.dr-header .dr-header__cta:active { transform: translateY(1px); }

/* One page, three links: on phones only the contact button stays. */
@media (max-width: 767px) {
	:root { --dr-header-h: 64px; }

	.dr-header__inner { padding: 0 1.25rem; }
	.dr-header__logo img { height: 24px; }
	.dr-nav__list { display: none; }
}

/* ---------------------------------------------------------------
 * Footer
 * ------------------------------------------------------------- */
.dr-footer {
	background-color: var(--dr-white);
	border-top: 1px solid var(--dr-line);
}

.dr-footer__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem 2rem;
	max-width: 1240px;
	margin: 0 auto;
	padding: 1.75rem 2rem;
	box-sizing: content-box;
}

.dr-footer__logo {
	display: inline-flex;
	flex: none;
}

.dr-footer__logo img {
	display: block;
	width: auto;
	height: 22px;
}

.dr-footer__meta {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-family: var(--dr-font);
	font-size: 14px;
	line-height: 1.5;
	color: var(--dr-muted);
}

.dr-footer .dr-footer__meta a {
	color: inherit;
	text-decoration: none;
	transition: color .2s var(--dr-ease);
}

.dr-footer .dr-footer__meta a:hover { color: var(--dr-ink); }

@media (max-width: 767px) {
	.dr-footer__inner { padding: 1.5rem 1.25rem; }
}

/* ---------------------------------------------------------------
 * Page details that Elementor V4 styles can't express
 * ------------------------------------------------------------- */

/* Text links (V4 classes dr-link, dr-link-big): Elementor wraps the text in an <a>
 * and unsets its styles with `.elementor .e-paragraph-link-base`, hence the prefix. */
.elementor .dr-link a,
.elementor .dr-link-big a {
	text-decoration-line: underline;
	text-underline-offset: 4px;
	transition: text-decoration-color .2s var(--dr-ease);
}

.elementor .dr-link a {
	text-decoration-thickness: 1px;
	text-decoration-color: rgba(17, 17, 19, .28);
}

.elementor .dr-link:hover a { text-decoration-color: currentColor; }

.elementor .dr-link-big a {
	text-decoration-thickness: 2px;
	text-decoration-color: var(--dr-red);
	text-underline-offset: .2em;
}

.dr-lead strong {
	font-weight: 600;
	color: var(--dr-ink);
}
