/* ==========================================================================
   COMUN — ce apare pe MAI MULTE tipuri de pagină, nu doar pe prima
   ==========================================================================
   ⭐ 09.09.2026 — DE CE EXISTĂ ACEST FIȘIER (un bug real, vizibil pentru clienți)

   Banda „Nu ești sigur ce aparat îți trebuie?" + caseta de newsletter apar pe
   PRACTIC TOATE paginile site-ului, dar stilurile lor stăteau în `home.css`, iar
   `home.css` se încarcă DOAR pe prima pagină (`is_front_page()`). Rezultatul,
   măsurat în browser real pe /despre-noi/: `.dph-cta-in` avea fundal transparent,
   `padding: 0px`, `border-radius: 0px` — adică fără casetă, cu butoanele lipite ca
   două linkuri simple și câmpul de email întins pe toată lățimea.

   Marius l-a semnalat din print-ul de pe iPhone („blocul «nu ești sigur ce aparat
   îți trebuie» arată prost"), fără să știe de unde vine. Cauza e asta.

   ⭐ Lecția, valabilă la ORICE site: un fișier CSS numit după o pagină („home")
   ajunge, în timp, să conțină și lucruri care nu sunt ale acelei pagini. Cum
   descoperi: iei selectorii fiecărui fișier CSS și îi cauți cu `querySelector` pe
   fiecare tip de pagină. Ce se potrivește într-un loc unde fișierul nu se încarcă
   e un bug care nu dă nicio eroare — doar arată prost.

   ⛔ Regulile de aici sunt MUTATE din home.css, nu copiate. Dacă le găsești în
   ambele fișiere, una dintre ele e moartă.
   ⛔ `comun.css` se încarcă PE TOATE paginile (nu e în lista `$doar_daca` din
   themes/diagpro/functions.php). Nu pune aici nimic specific unei pagini.
   ⚠️ Ordinea contează: fișierele se încarcă alfabetic, deci `comun` vine ÎNAINTEA
   lui `home` — la specificitate egală câștigă `home.css`, ca înainte.
   ========================================================================== */

/* --- culorile din machetă: hex de rezervă, oklch acolo unde browserul poate ---
   Stau aici pentru că `.dph-btn` și banda finală le folosesc pe orice pagină;
   dacă rămâneau în home.css, butoanele de pe restul site-ului n-aveau culoare. */
.dph {
	--dph-blue:     #2A5FB7;   /* oklch(0.5 0.15 260)  */
	--dph-blue-d:   #234E96;   /* oklch(0.43 0.15 260) */
	--dph-red:      #C24A3F;   /* oklch(0.52 0.16 25)  */
	--dph-red-d:    #A33A30;   /* oklch(0.45 0.16 25)  */
	--dph-ico-bg:   #E3EAFB;   /* oklch(0.94 0.03 258) */
	--dph-save-bg:  #FDE7E1;   /* oklch(0.95 0.03 25)  */
	/* ⭐ 09.09.2026 — contrast. Verdele era #2F8B55 = 4,25:1 pe alb și portocaliul #B2760F
	   = 3,82:1: amândouă sub pragul de 4,5:1, semnalate de Google, la 11px bold (textul
	   „● În stoc" / „stoc limitat" de pe cardurile de produs). Nuanțele noi păstrează
	   exact aceeași culoare, doar mai închisă: 5,78:1 și 5,51:1.
	   ⚠️ Sunt folosite DOAR pentru text pe fundal deschis (`.dph-stock--in/--low`,
	   `.dph-nl-msg--ok`) — verificat cu grep pe tot CSS-ul temei înainte de a le schimba;
	   dacă apar vreodată ca FUNDAL cu text alb, valorile astea trebuie regândite. */
	--dph-green:    #277348;   /* oklch(0.497 0.102 155) */
	--dph-green-d:  #1F5C3A;   /* oklch(0.42 0.09 155)   */
	--dph-orange:   #8F5F0B;   /* oklch(0.525 0.108 73.5) */
}
@supports (color: oklch(0.5 0.15 260)) {
	.dph {
		--dph-blue:    oklch(0.5 0.15 260);
		--dph-blue-d:  oklch(0.43 0.15 260);
		--dph-red:     oklch(0.52 0.16 25);
		--dph-red-d:   oklch(0.45 0.16 25);
		--dph-ico-bg:  oklch(0.94 0.03 258);
		--dph-save-bg: oklch(0.95 0.03 25);
		/* aceleași culori ca hexurile de mai sus, convertite exact (nu aproximate din ochi) */
		--dph-green:   oklch(0.497 0.102 155);
		--dph-green-d: oklch(0.42 0.09 155);
		--dph-orange:  oklch(0.525 0.108 73.5);
	}
}

.dph, .dph * { box-sizing: border-box; }
.dph a { text-decoration: none; }
.dph summary::-webkit-details-marker { display: none; }
.dph summary::marker { content: ''; }
.dph input::placeholder { color: #93a0b4; }

/* ============ butoane ============ */
.dph-btn { display: inline-block; border-radius: 10px; font-weight: 700; text-align: center; line-height: normal; }
.dph-btn--lg { font-size: 15px; padding: 14px 28px; }
.dph-btn--md { font-size: 14.5px; padding: 13px 26px; }
.dph-btn--fill  { background: var(--dph-blue); color: #ffffff !important; }
.dph-btn--fill:hover { background: var(--dph-blue-d); color: #ffffff !important; }
.dph-btn--ghost { border: 1.5px solid #b9c7de; color: #16233d !important; }
.dph-btn--ghost:hover { border-color: var(--dph-blue); color: var(--dph-blue) !important; }
.dph-btn--wa    { background: var(--dph-blue); color: #ffffff !important; }
.dph-btn--wa:hover { background: var(--dph-blue-d); color: #ffffff !important; }

/* ============ BANDA FINALĂ („Nu ești sigur…") + NEWSLETTER ============ */
.dph-cta    { max-width: 1280px; margin: 0 auto; padding: 44px 32px 52px; }
.dph-cta-in {
	background: #eef3fb; border: 1px solid #dbe4f2; border-radius: 18px; padding: 44px 48px;
	display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 48px;
}
.dph-cta-in h2 { margin: 0 0 8px; color: #16233d; font-size: 28px; font-weight: 800; line-height: 1.15; letter-spacing: -0.5px; }
.dph-cta-p { margin: 0 0 20px; color: #4a5568; font-size: 15px; line-height: 1.55; }
.dph-cta-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.dph-nl {
	border-left: 1px solid #cdd9ec; padding-left: 48px;
	display: flex; flex-direction: column; justify-content: center; gap: 9px;
}
.dph-nl-t { color: #16233d; font-weight: 800; font-size: 16px; }
.dph-nl-d { color: #4a5568; font-size: 13.5px; }
.dph-nl-form { display: flex; margin-top: 4px; }
.dph-nl-form input[type="email"] {
	flex: 1; min-width: 0; border: 1.5px solid #cdd6e4; border-right: none; padding: 12px 14px;
	border-radius: 10px 0 0 10px; font-size: 13.5px; font-family: inherit; outline: none; background: #ffffff;
}
.dph-nl-form input[type="email"]:focus { border-color: var(--dph-blue); }
.dph-nl-form button {
	background: var(--dph-blue); color: #ffffff; border: none; padding: 0 18px;
	border-radius: 0 10px 10px 0; font-weight: 700; font-size: 13.5px; cursor: pointer; font-family: inherit;
}
.dph-nl-form button:hover { background: var(--dph-blue-d); }
.dph-hp { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
.dph-nl-msg { font-size: 13px; font-weight: 700; line-height: 1.45; }
.dph-nl-msg--ok  { color: var(--dph-green); }
.dph-nl-msg--err { color: var(--dph-red); }

/* ==========================================================================
   MOBIL — aceleași jaloane ca în home.css (1100 / 960 / 640 / 767)
   ========================================================================== */
@media (max-width: 1100px) {
	.dph-cta-in { grid-template-columns: 1fr; gap: 28px; padding: 32px 28px; }
	.dph-nl { border-left: none; border-top: 1px solid #cdd9ec; padding-left: 0; padding-top: 26px; }
}
@media (max-width: 960px) {
	.dph-cta { padding-left: 24px; padding-right: 24px; }
}
@media (max-width: 640px) {
	.dph-btn--lg { padding: 13px 20px; }
	.dph-cta { padding-left: 20px; padding-right: 20px; }
	.dph-cta-in { padding: 26px 20px; border-radius: 14px; }
	.dph-cta-in h2 { font-size: 23px; }
	.dph-cta-btns .dph-btn { flex: 1 0 100%; }
}
@media (max-width: 767px) {
	.dph-btn--lg { font-size: 15px; padding: 14px 12px; }
	.dph-cta { padding: 26px 16px 30px; }
	.dph-cta-in { padding: 22px 18px; border-radius: 16px; gap: 22px; }
	.dph-cta-in h2 { font-size: 19px; margin: 0 0 6px; line-height: 1.2; }
	.dph-cta-p { font-size: 13.5px; line-height: 1.55; margin: 0 0 14px; }
	.dph-cta-btns { flex-direction: column; gap: 9px; }
	/* butoanele trec pe flex ca să poată avea 44px garantați, nu doar „cam atât" */
	.dph-cta-btns .dph-btn {
		flex: 0 0 auto; width: 100%; min-height: 44px;
		display: flex; align-items: center; justify-content: center;
	}
	.dph-btn--md { font-size: 14px; padding: 13px 12px; }
	.dph-nl { padding-top: 20px; gap: 7px; }
	.dph-nl-t { font-size: 15px; }
	.dph-nl-d { font-size: 12.5px; line-height: 1.5; }
	.dph-nl-form input[type="email"] { padding: 12px 14px; font-size: 13.5px; min-height: 44px; }
	.dph-nl-form button { padding: 0 16px; font-size: 13px; min-height: 44px; }
}