/* spoki_tokens.css */
/* ============================================================
   SpOki.ro - stratul de tokeni. Singurul loc unde traiesc
   culorile, fonturile si scara de spatiere.
   ============================================================ */

/* Fonturi variabile, subseturi latin + latin-ext (diacritice romanesti). */

@font-face {
	font-family: 'Fredoka';
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url('../fonts/fredoka-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Fredoka';
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url('../fonts/fredoka-latin-ext.woff2') format('woff2');
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Nunito Sans';
	font-style: normal;
	font-weight: 200 1000;
	font-display: swap;
	src: url('../fonts/nunito-sans-latin.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Nunito Sans';
	font-style: normal;
	font-weight: 200 1000;
	font-display: swap;
	src: url('../fonts/nunito-sans-latin-ext-ro.woff2') format('woff2');
	/* Subset: doar diacriticele romanesti plus literele central-europene care apar in
	   nume de marci. Fisierul complet avea 43 KB si intra in fereastra LCP la prioritate
	   VeryHigh, adica lua latime de banda chiar de la fotografia produsului.
	   Masurat pe site: din tot Latin Extended se folosesc doar a-breve, s-virgula si
	   t-virgula. Ce nu este in interval cade pe fontul de sistem, nu pe patratele goale. */
	unicode-range: U+0100-0107, U+010C-0113, U+0118-011B, U+012A-012B, U+0139-013A, U+013D-013E, U+0141-0144, U+0147-0148, U+0150-0151, U+0158-015B, U+015E-0165, U+016A-016B, U+016E-0171, U+017B-017E, U+0218-021B;
}

:root {
	/* Paleta SpOki - aprobata in design system, nu se improvizeaza. */
	/* Turcoazul marcii, luat din logo (#01A8AE) si coborat un ton pentru
	   contrast: text alb pe #018287 = 4.62:1, trece WCAG AA. */
	--spoki-primary: #018287;
	--spoki-primary-dark: #016A6E;
	--spoki-primary-soft: #E3F4F5;
	--spoki-logo-teal: #01A8AE;
	--spoki-text: #1F2937;
	--spoki-text-soft: #4B5563;
	/* Fundalul paginii. A fost crem (#FFFDF8) pana la 07.09.2026; proprietarul l-a
	   vrut alb. Numele tokenului ramane, ca sa nu se rupa nimic care il foloseste. */
	--spoki-bg-warm: #FFFFFF;
	--spoki-bg-neutral: #F1F5F9;
	--spoki-promo: #C2410C;
	--spoki-accent: #F59E0B;
	--spoki-accent-soft: #FEF3C7;
	--spoki-white: #FFFFFF;

	--spoki-success: #15803D;
	--spoki-warning: #B45309;
	--spoki-error: #B91C1C;

	--spoki-font-display: 'Fredoka', 'Segoe UI', system-ui, sans-serif;
	--spoki-font-body: 'Nunito Sans', 'Segoe UI', system-ui, sans-serif;

	--spoki-space-1: 4px;
	--spoki-space-2: 8px;
	--spoki-space-3: 16px;
	--spoki-space-4: 24px;
	--spoki-space-5: 40px;
	--spoki-space-6: 64px;
	--spoki-space-7: 96px;

	--spoki-radius: 14px;
	--spoki-radius-lg: 22px;
	--spoki-radius-pill: 999px;
	/* Semnatura "squish": raza organica, moale, ca un squishy adevarat. */
	--spoki-radius-blob: 46% 54% 57% 43% / 45% 42% 58% 55%;
	--spoki-shadow: 0 1px 2px rgba(31, 41, 55, 0.06), 0 6px 20px -8px rgba(31, 41, 55, 0.12);
	--spoki-shadow-lift: 0 2px 4px rgba(31, 41, 55, 0.08), 0 14px 32px -10px rgba(31, 41, 55, 0.18);
}

/* Bazele: corp de text citet si pentru bunica. */
body {
	background-color: var(--spoki-bg-warm);
	color: var(--spoki-text);
	font-family: var(--spoki-font-body);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

@media (max-width: 689px) {
	body { font-size: 16px; }
}

h1, h2, h3, h4 {
	font-family: var(--spoki-font-display);
	font-weight: 600;
	color: var(--spoki-text);
	line-height: 1.15;
	letter-spacing: -0.01em;
}

a { color: var(--spoki-primary); }
a:hover { color: var(--spoki-primary-dark); }

::selection { background: var(--spoki-accent-soft); }

/* Fundalul cald castiga peste tema. */
html body { background-color: var(--spoki-bg-warm); }

/* spoki_components.css */
/* ============================================================
   SpOki.ro - componente refolosibile. Toate selectoarele sunt
   scoped cu prefixul .spoki- . Nimic global, nimic distructiv.
   ============================================================ */

/* ---------- Sectiuni ---------- */
.spoki-section {
	padding-top: var(--spoki-space-6);
	padding-bottom: var(--spoki-space-6);
}
.spoki-section--neutral { background-color: var(--spoki-bg-neutral); }
.spoki-section--soft { background-color: var(--spoki-primary-soft); }

.spoki-section .spoki-eyebrow {
	font-family: var(--spoki-font-body);
	font-weight: 800;
	font-size: 13px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--spoki-primary);
	margin-bottom: var(--spoki-space-2);
}

.spoki-section h2 { font-size: clamp(26px, 4vw, 36px); margin-bottom: var(--spoki-space-2); }
.spoki-section .spoki-lead { color: var(--spoki-text-soft); max-width: 62ch; }

/* ---------- Container ---------- */
.spoki-container { max-width: 1200px; margin-inline: auto; padding-inline: 20px; }

/* ---------- Butoane (peste blocul core, doar in zonele spoki) ---------- */
.spoki-section .wp-block-button__link {
	font-family: var(--spoki-font-body);
	font-weight: 800;
	font-size: 17px;
	min-height: 48px;
	padding: 12px 28px;
	border-radius: var(--spoki-radius-pill);
	background-color: var(--spoki-primary);
	color: var(--spoki-white);
	transition: transform 0.12s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}
.spoki-section .wp-block-button__link:hover {
	background-color: var(--spoki-primary-dark);
	box-shadow: var(--spoki-shadow);
	color: var(--spoki-white);
}
.spoki-section .wp-block-button__link:active { transform: scale(0.96); }
.spoki-section .is-style-outline .wp-block-button__link {
	background: transparent;
	border: 2px solid var(--spoki-primary);
	color: var(--spoki-primary);
}
.spoki-section .is-style-outline .wp-block-button__link:hover {
	background: var(--spoki-primary-soft);
	color: var(--spoki-primary-dark);
}
.spoki-section .wp-block-button__link:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: 2px;
}

@media (max-width: 689px) {
	.spoki-section .wp-block-buttons .wp-block-button { width: 100%; }
	.spoki-section .wp-block-button__link { width: 100%; text-align: center; }
}

/* ---------- Semnatura "squish": forma blob + apasare moale ---------- */
.spoki-blob {
	border-radius: var(--spoki-radius-blob);
	overflow: hidden;
}
.spoki-blob img { display: block; width: 100%; height: 100%; object-fit: cover; }

.spoki-squish {
	transition: transform 0.15s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spoki-squish:hover { transform: scale(1.02); }
.spoki-squish:active { transform: scale(0.95); }

@media (prefers-reduced-motion: reduce) {
	.spoki-squish, .spoki-section .wp-block-button__link { transition: none; }
	.spoki-squish:hover, .spoki-squish:active { transform: none; }
}

/* ---------- Bara de incredere ---------- */
.spoki-trust {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--spoki-space-3);
}
.spoki-trust-item {
	display: flex;
	align-items: flex-start;
	gap: var(--spoki-space-2);
	background: var(--spoki-white);
	border-radius: var(--spoki-radius);
	padding: var(--spoki-space-3);
	box-shadow: var(--spoki-shadow);
}
.spoki-trust-item .spoki-trust-icon {
	flex: none;
	width: 42px;
	height: 42px;
	display: grid;
	place-items: center;
	background: var(--spoki-primary-soft);
	border-radius: var(--spoki-radius-blob);
	font-size: 20px;
	margin: 0;
}
.spoki-trust-item h3 {
	font-family: var(--spoki-font-body);
	font-weight: 800;
	font-size: 16px;
	margin: 0 0 2px;
}
.spoki-trust-item p { font-size: 14.5px; color: var(--spoki-text-soft); margin: 0; line-height: 1.45; }

@media (max-width: 999px) { .spoki-trust { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 479px) { .spoki-trust { grid-template-columns: 1fr; } }

/* ---------- FAQ (Details) ---------- */
.spoki-faq .wp-block-details {
	background: var(--spoki-white);
	border: 1px solid rgba(31, 41, 55, 0.08);
	border-radius: var(--spoki-radius);
	padding: var(--spoki-space-3) var(--spoki-space-4);
	margin-bottom: var(--spoki-space-2);
	box-shadow: var(--spoki-shadow);
}
.spoki-faq .wp-block-details summary {
	font-family: var(--spoki-font-body);
	font-weight: 800;
	font-size: 17px;
	cursor: pointer;
	color: var(--spoki-text);
}
.spoki-faq .wp-block-details summary:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: 2px;
	border-radius: 6px;
}
.spoki-faq .wp-block-details[open] summary { color: var(--spoki-primary); margin-bottom: var(--spoki-space-2); }
.spoki-faq .wp-block-details p { color: var(--spoki-text-soft); margin: 0; }

/* ---------- Carduri de varsta ---------- */
.spoki-age-grid {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: var(--spoki-space-3);
}
.spoki-age-card {
	text-align: center;
	background: var(--spoki-white);
	border-radius: var(--spoki-radius-lg);
	padding: var(--spoki-space-4) var(--spoki-space-2);
	box-shadow: var(--spoki-shadow);
	border: 2px solid transparent;
}
.spoki-age-card:hover { border-color: var(--spoki-primary); box-shadow: var(--spoki-shadow-lift); }
.spoki-age-card .spoki-age-label {
	font-family: var(--spoki-font-display);
	font-weight: 600;
	font-size: 21px;
	margin: 0;
}
.spoki-age-card .spoki-age-label a { color: var(--spoki-primary); text-decoration: none; }
.spoki-age-card .spoki-age-hint {
	font-size: 13.5px;
	color: var(--spoki-text-soft);
	margin: 4px 0 0;
}
@media (max-width: 999px) {
	.spoki-age-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 479px) {
	.spoki-age-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---------- Pasii "Cum alegi" ---------- */
.spoki-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--spoki-space-4); }
.spoki-step {
	background: var(--spoki-white);
	border-radius: var(--spoki-radius);
	padding: var(--spoki-space-4);
	box-shadow: var(--spoki-shadow);
}
.spoki-step .spoki-step-n {
	display: inline-grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: var(--spoki-radius-blob);
	background: var(--spoki-accent-soft);
	color: var(--spoki-warning);
	font-family: var(--spoki-font-display);
	font-weight: 600;
	font-size: 20px;
	margin: 0 0 var(--spoki-space-2);
}
.spoki-step h3 { font-size: 19px; margin: 0 0 6px; }
.spoki-step p { font-size: 15.5px; color: var(--spoki-text-soft); margin: 0; }
@media (max-width: 767px) { .spoki-steps { grid-template-columns: 1fr; } }

/* ============================================================
   Logo. Blocksy scaleaza logo-ul dupa inaltime, nu dupa latime.
   Fixam inaltimea, latimea urmeaza raportul 430:154, iar pagina
   nu mai sare la incarcare.
   ============================================================ */

.site-logo-container {
	--logo-max-height: 58px; /* ~162px latime pe desktop */
}

@media (max-width: 999px) {

	.site-logo-container {
		--logo-max-height: 44px; /* ~123px latime pe telefon */
	}
}

/* Logo-ul sta pe mijlocul randului, la fel ca butonul de meniu
   si cosul de langa el. */
.site-branding {
	align-items: center;
}

/* Numele magazinului este deja scris in logo. Nu il repetam
   inca o data sub el, ca sa nu ingrosam degeaba antetul. */
.site-branding:has(.site-logo-container) .site-title-container {
	display: none;
}


/* ============================================================
   Cosul din antet.
   ============================================================ */

/* Bulina cu numarul de produse: portocaliul vulpitei, nu albastrul temei. */
.ct-cart-item .ct-dynamic-count-cart {
	background: var(--spoki-promo);
	color: var(--spoki-white);
}

/* Fara suma langa iconita raman 15 px de apasat, cat gamalia unui ac.
   Le dam o suprafata de apasat de 44 px, cat cere degetul mare. */
.ct-header-cart .ct-cart-item,
.ct-header-search.ct-toggle {
	display: grid;
	place-items: center;
	min-width: 44px;
	min-height: 44px;
}
/* Cosul mic care se deschide sub iconita. Tema ii da 310 px si colturi de
   2 px; noi il facem putin mai lat, ca numele lungi de produse sa incapa pe
   un rand, si il agatam de marginea din dreapta ca sa nu iasa din ecran. */
[data-id="cart"].ct-header-cart .ct-cart-content {
	left: auto;
	right: 0;
	width: min(340px, calc(100vw - 40px));
}
/* Tema il picta gri inchis, ca pe un panou de administrare. Il aducem
   la culorile magazinului. Selectorul are o clasa in plus fata de al temei,
   pentru ca stilul ei se scrie in pagina, dupa fisierele noastre. */
[data-header] [data-id="cart"].ct-header-cart .ct-cart-content {
	--mini-cart-background-color: var(--spoki-white);
	--theme-text-color: var(--spoki-text);
	border: 1px solid rgba(31, 41, 55, 0.08);
	border-radius: var(--spoki-radius);
	box-shadow: var(--spoki-shadow-lift);
}

[data-header] [data-id="cart"].ct-header-cart .ct-cart-content .total {
	--theme-text-color: var(--spoki-text);
}

/* ---------- Galerie produs (single) ---------- */
/* Blocksy scrie inline `aspect-ratio` pe imaginea mare a galeriei si o taie cu
   `object-fit: cover` (main.min.css: `.ct-media-container img`). Cu raportul
   temei pus pe `original`, panza urmeaza fiecare imagine in parte; variabila de
   mai jos este plasa de siguranta: chiar daca un raport nu se potriveste,
   imaginea se incadreaza in loc sa fie taiata. Prioritatea este produsul
   intreg, nu rama plina. Doar imaginea mare: thumbnails (.flexy-pills) raman
   neatinse. */
.single-product .ct-product-gallery-container > .ct-media-container,
.single-product .ct-product-gallery-container .flexy-view .ct-media-container {
	--theme-object-fit: contain;
}

/* --- Butonul "inapoi sus" ----------------------------------------------------
   Componenta nativa a temei (Blocksy -> Scroll to Top), imbracata in culorile
   SpOki. Este ancora <a href="#main-container">, deci functioneaza si fara
   JavaScript; tema doar ii scoate atributul hidden dupa ce pagina este derulata.
   Sta in stanga jos ca sa lase coltul din dreapta liber pentru chat. */
a.ct-back-to-top[data-shape],
.ct-back-to-top{
	z-index:60;
	width:46px;
	height:46px;
	min-width:46px;
	min-height:46px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	background:var(--spoki-primary,#018287);
	color:#fff;
	box-shadow:0 6px 18px rgba(38,50,88,.20);
	transition:background-color .18s ease, transform .18s ease;
}
.ct-back-to-top .ct-icon{fill:currentColor;width:15px;height:15px}
.ct-back-to-top:hover,
.ct-back-to-top:focus-visible{
	background:var(--spoki-primary-dark,#016a6e);
	color:#fff;
	transform:translateY(-2px);
}
.ct-back-to-top:focus-visible{
	outline:3px solid var(--spoki-accent,#f59e0b);
	outline-offset:3px;
}
@media (prefers-reduced-motion:reduce){
	.ct-back-to-top{transition:none}
	.ct-back-to-top:hover,.ct-back-to-top:focus-visible{transform:none}
}
/* Tema isi pune culoarea prin CSS-ul ei dinamic; il egalam ca precizie. */
a.ct-back-to-top[data-shape]{background-color:var(--spoki-primary,#018287);color:#fff}
a.ct-back-to-top[data-shape]:hover,
a.ct-back-to-top[data-shape]:focus-visible{background-color:var(--spoki-primary-dark,#016a6e);color:#fff}

/* spoki_menu.css */
/* ============================================================
   SpOki.ro - meniul mobil (panoul off-canvas).

   Trei niveluri de ierarhie, ca la magazinele mari:
     1. Sectiune  - Fredoka 20px, negru       (Jucării, Personaje)
     2. Grup      - 13.5px MAJUSCULE, turcoaz  (CUMPĂRĂ DUPĂ VÂRSTĂ)
     3. Element   - 16.5px normal, negru       (0-12 luni)

   Si sectiunile, si grupurile se deschid si se inchid.
   Acordeon nativ <details>, zero JavaScript, zero imagini.
   ============================================================ */

/* Panoul: alb curat. */
#offcanvas .ct-panel-inner {
	background-color: var(--spoki-white) !important;
}
#offcanvas .ct-toggle-close {
	color: var(--spoki-text);
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Iconita este un SVG cu fill alb, pus de tema pentru panoul ei intunecat.
   Panoul nostru este alb, deci trebuie schimbat fill-ul, nu color: altfel
   butonul exista, dar se vede alb pe alb. Acelasi lucru la panoul de filtre. */
#offcanvas .ct-toggle-close svg,
#woo-filters-panel .ct-toggle-close svg {
	fill: var(--spoki-text);
}

#offcanvas .ct-toggle-close:hover svg,
#offcanvas .ct-toggle-close:focus-visible svg,
#woo-filters-panel .ct-toggle-close:hover svg,
#woo-filters-panel .ct-toggle-close:focus-visible svg {
	fill: var(--spoki-primary-dark);
}

#offcanvas .ct-toggle-close:focus-visible,
#woo-filters-panel .ct-toggle-close:focus-visible {
	outline: 2px solid var(--spoki-primary);
	outline-offset: 2px;
	border-radius: 4px;
}

.spoki-mm {
	font-family: var(--spoki-font-body);
	padding: 0 2px 28px;
	text-align: left;
}

/* ---------- Cautare ---------- */
.spoki-mm-search {
	display: flex;
	align-items: center;
	gap: 6px;
	background: var(--spoki-bg-neutral);
	border: 1.5px solid transparent;
	border-radius: var(--spoki-radius-pill);
	padding: 0 6px 0 18px;
	margin: 4px 0 22px;
	height: 52px;
}
.spoki-mm-search:focus-within {
	border-color: var(--spoki-primary);
	background: var(--spoki-white);
}
.spoki-mm-search input[type="search"] {
	flex: 1;
	min-width: 0;
	border: 0;
	background: transparent;
	font-family: var(--spoki-font-body);
	font-size: 16px;
	color: var(--spoki-text);
	padding: 0;
	box-shadow: none;
	outline: none;
}
.spoki-mm-search input::placeholder { color: var(--spoki-text-soft); opacity: 1; }
.spoki-mm-search button {
	flex: none;
	width: 40px;
	height: 40px;
	display: grid;
	place-items: center;
	border: 0;
	border-radius: 50%;
	background: var(--spoki-primary);
	color: var(--spoki-white);
	cursor: pointer;
	padding: 0;
}

/* ---------- Nivelul 1: sectiuni ---------- */
.spoki-mm-sec { border-top: 1px solid rgba(31, 41, 55, 0.12); }

.spoki-mm-sec > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 64px;
	padding: 8px 4px;
	font-family: var(--spoki-font-display);
	font-weight: 600;
	font-size: 20px;
	color: var(--spoki-text);
	cursor: pointer;
	list-style: none;
}
.spoki-mm-sec > summary::-webkit-details-marker { display: none; }
.spoki-mm-sec > summary::after {
	content: '';
	flex: none;
	width: 10px;
	height: 10px;
	margin-right: 8px;
	border-right: 2.6px solid var(--spoki-text);
	border-bottom: 2.6px solid var(--spoki-text);
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform 0.18s ease;
}
.spoki-mm-sec[open] > summary::after {
	transform: rotate(-135deg) translate(-2px, -2px);
}
.spoki-mm-sec > summary:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: 2px;
	border-radius: 8px;
}
.spoki-mm-corp { padding: 0 0 16px; }

/* ---------- Nivelul 2: grupuri, tot acordeon ---------- */
.spoki-mm-grup { border-bottom: 1px solid rgba(31, 41, 55, 0.07); }
.spoki-mm-corp > .spoki-mm-grup:last-child { border-bottom: 0; }

.spoki-mm-grup > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 52px;
	padding: 6px 4px;
	font-family: var(--spoki-font-body);
	font-weight: 800;
	font-size: 13.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--spoki-primary);
	cursor: pointer;
	list-style: none;
}
.spoki-mm-grup > summary::-webkit-details-marker { display: none; }
.spoki-mm-grup > summary::after {
	content: '';
	flex: none;
	width: 8px;
	height: 8px;
	margin-right: 10px;
	border-right: 2.2px solid var(--spoki-primary);
	border-bottom: 2.2px solid var(--spoki-primary);
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform 0.18s ease;
}
.spoki-mm-grup[open] > summary::after {
	transform: rotate(-135deg) translate(-2px, -2px);
}
.spoki-mm-grup > summary:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: 2px;
	border-radius: 6px;
}

/* ---------- Nivelul 3: elemente, greutate normala ---------- */
.spoki-mm-grid { display: block; padding-bottom: 8px; }

.spoki-mm-chip {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 7px 8px 7px 14px;
	border: 0;
	border-left: 3px solid transparent;
	border-radius: 0;
	background: none;
	font-size: 16.5px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--spoki-text);
	text-decoration: none;
	transition: background-color 0.12s ease, color 0.12s ease;
}
.spoki-mm-chip:hover { color: var(--spoki-primary-dark); }
.spoki-mm-chip:active { background: var(--spoki-bg-neutral); }
.spoki-mm-chip:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: -3px;
}

/* Unde te afli: bara turcoaz in stanga, fara umplere. */
.spoki-mm-chip.is-current {
	border-left-color: var(--spoki-primary);
	color: var(--spoki-primary);
	font-weight: 700;
}

/* ---------- Rand simplu (element fara copii) ---------- */
.spoki-mm-rand {
	display: flex;
	align-items: center;
	min-height: 64px;
	padding: 8px 4px;
	border-top: 1px solid rgba(31, 41, 55, 0.12);
	font-family: var(--spoki-font-display);
	font-weight: 600;
	font-size: 20px;
	color: var(--spoki-text);
	text-decoration: none;
}

/* ---------- Cartela de ajutor ---------- */
.spoki-mm .spoki-mega-ajutor { margin: 24px 0 4px; }

/* ---------- Panglica de jos ---------- */
.spoki-mm-utile {
	display: flex;
	flex-direction: column;
	border-top: 1px solid rgba(31, 41, 55, 0.12);
	margin-top: 20px;
	padding-top: 6px;
}
.spoki-mm-utile a {
	display: flex;
	align-items: center;
	min-height: 46px;
	padding: 4px;
	font-size: 15.5px;
	color: var(--spoki-text-soft);
	text-decoration: none;
}
.spoki-mm-utile a:hover { color: var(--spoki-primary); }

.spoki-mm-tel {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 52px;
	margin-top: 12px;
	padding: 0 18px;
	background: var(--spoki-primary-soft);
	border-radius: var(--spoki-radius-pill);
	font-weight: 800;
	font-size: 16.5px;
	color: var(--spoki-primary);
	text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
	.spoki-mm-chip,
	.spoki-mm-sec > summary::after,
	.spoki-mm-grup > summary::after { transition: none; }
}

/* ---------- Antetul mobil: tinte de atingere reale ---------- */
/* Tema livreaza butonul la 18px. Sub degetul mamei si al bunicii asta e prea
   mic: minimul recomandat este 44x44. Marim zona de atingere, nu pictograma. */
@media (max-width: 999px) {
	header [data-id="trigger"] {
		min-width: 46px;
		min-height: 46px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		margin-left: -12px;
	}
	header [data-id="trigger"] .ct-icon { width: 22px; height: 22px; }
	header [data-id="cart"] > a {
		min-height: 46px;
		display: inline-flex;
		align-items: center;
	}
}

/* ============================================================
   Tema impune --theme-font-size: 20px si --theme-font-weight: 700
   pe tot ce este in [data-id="mobile-menu"], inclusiv pe linkurile
   noastre. Asta inversa ierarhia: elementele pareau mai importante
   decat titlurile lor. Redefinim variabilele CHIAR in meniul nostru,
   plus reguli directe cu specificitate suficienta.
   ============================================================ */

#offcanvas .spoki-mm {
	--theme-font-size: 16.5px;
	--theme-font-weight: 400;
	--theme-link-initial-color: var(--spoki-text);
	--theme-link-hover-color: var(--spoki-primary-dark);
	font-size: 16.5px;
	font-weight: 400;
}

/* Nivelul 1: sectiunea */
#offcanvas .spoki-mm .spoki-mm-sec > summary {
	font-family: var(--spoki-font-display);
	font-size: 20px;
	font-weight: 600;
	color: var(--spoki-text);
}

/* Nivelul 2: grupul */
#offcanvas .spoki-mm .spoki-mm-grup > summary {
	font-family: var(--spoki-font-body);
	font-size: 13.5px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--spoki-primary);
}

/* Nivelul 3: elementul */
#offcanvas .spoki-mm a.spoki-mm-chip {
	font-family: var(--spoki-font-body);
	font-size: 16.5px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--spoki-text);
}
#offcanvas .spoki-mm a.spoki-mm-chip:hover { color: var(--spoki-primary-dark); }
#offcanvas .spoki-mm a.spoki-mm-chip.is-current {
	color: var(--spoki-primary);
	font-weight: 700;
}

/* Randul simplu si panglica de jos */
#offcanvas .spoki-mm a.spoki-mm-rand {
	font-family: var(--spoki-font-display);
	font-size: 20px;
	font-weight: 600;
	color: var(--spoki-text);
}
#offcanvas .spoki-mm .spoki-mm-utile a {
	font-size: 15.5px;
	font-weight: 400;
	color: var(--spoki-text-soft);
}
#offcanvas .spoki-mm a.spoki-mm-tel {
	font-size: 16.5px;
	font-weight: 800;
	color: var(--spoki-primary);
}


/* ---------- Randul de cautare din antet ---------- */

/* Se scrie mereu in pagina, dar se vede doar pe telefon si tableta.
   Pe desktop cautarea sta deja in bara de sus, langa meniu. */
.spoki-cauta-rand {
	display: none;
}

@media (max-width: 999px) {

	.spoki-cauta-rand {
		display: block;
		background: var(--spoki-white);
		padding-bottom: 10px;
		border-bottom: 1px solid rgba(31, 41, 55, 0.07);
	}

	.spoki-cauta {
		margin: 0;
		height: 52px;
		padding: 0 4px 0 16px;
	}

	/* CHG-0063: 36 px era sub pragul de atingere. Bara creste cu 8 px ca butonul
	   sa incapa la 44 fara sa se lipeasca de marginea campului. */
	.spoki-cauta input[type="search"] {
		min-height: 44px;
	}

	.spoki-cauta button {
		width: 44px;
		height: 44px;
		min-height: 44px;
	}
}
/* spoki_mega.css */
/* ============================================================
   SpOki.ro - meniul principal pe desktop: bara scurta,
   panouri mega cu coloane. Acordeon nativ, un singur
   fragment mic de JavaScript pentru inchidere.
   ============================================================ */

.spoki-mega {
	display: flex;
	align-items: center;
	gap: 4px;
	font-family: var(--spoki-font-body);
}

/* ---------- Bara ---------- */
.spoki-mega-sec { position: static; }

.spoki-mega summary,
.spoki-mega-link {
	display: flex;
	align-items: center;
	gap: 7px;
	height: 46px;
	padding: 0 16px;
	border-radius: var(--spoki-radius-pill);
	font-size: 16.5px;
	font-weight: 700;
	color: var(--spoki-text);
	text-decoration: none;
	cursor: pointer;
	list-style: none;
	white-space: nowrap;
	transition: background-color 0.14s ease, color 0.14s ease;
}
.spoki-mega summary::-webkit-details-marker { display: none; }

.spoki-mega summary:hover,
.spoki-mega-link:hover,
.spoki-mega details[open] > summary {
	background: var(--spoki-primary-soft);
	color: var(--spoki-primary-dark);
}

.spoki-mega summary:focus-visible,
.spoki-mega-link:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: 2px;
}

/* Sageata */
.spoki-mega summary::after {
	content: '';
	width: 7px;
	height: 7px;
	margin-top: -3px;
	border-right: 2.2px solid currentColor;
	border-bottom: 2.2px solid currentColor;
	transform: rotate(45deg);
	transition: transform 0.18s ease;
	opacity: 0.75;
}
.spoki-mega details[open] > summary::after {
	transform: rotate(-135deg);
	margin-top: 2px;
}

/* ---------- Panoul ---------- */
.spoki-mega-panou {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 60;
	padding: 10px 20px 0;
	animation: spoki-mega-in 0.16s ease;
}
@keyframes spoki-mega-in {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: none; }
}

.spoki-mega-inner {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 8px 28px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 26px 30px 30px;
	background: var(--spoki-white);
	border: 1px solid rgba(31, 41, 55, 0.08);
	border-radius: var(--spoki-radius-lg);
	box-shadow: var(--spoki-shadow-lift);
}

/* ---------- Coloane ---------- */
.spoki-mega-col { display: flex; flex-direction: column; }

.spoki-mega-col-t {
	margin-bottom: 8px;
	padding: 0 10px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: var(--spoki-primary);
}

.spoki-mega-item {
	display: flex;
	align-items: center;
	min-height: 40px;
	padding: 6px 10px;
	border-radius: 10px;
	font-size: 16px;
	line-height: 1.3;
	color: var(--spoki-text);
	text-decoration: none;
	transition: background-color 0.12s ease, color 0.12s ease;
}
.spoki-mega-item:hover {
	background: var(--spoki-bg-neutral);
	color: var(--spoki-primary-dark);
}
.spoki-mega-item:focus-visible {
	outline: 3px solid var(--spoki-accent);
	outline-offset: -2px;
}
.spoki-mega-item.is-current {
	background: var(--spoki-primary);
	color: var(--spoki-white);
	border-radius: var(--spoki-radius-blob);
	font-weight: 700;
}

/* ---------- Cardul de ajutor (pentru bunica) ---------- */
.spoki-mega-col--ajutor { justify-content: center; }
.spoki-mega-ajutor {
	background: var(--spoki-primary-soft);
	border-radius: var(--spoki-radius);
	padding: 20px;
}
.spoki-mega-ajutor-t {
	margin: 0 0 6px;
	font-family: var(--spoki-font-display);
	font-weight: 600;
	font-size: 17px;
	color: var(--spoki-text);
}
.spoki-mega-ajutor-p {
	margin: 0 0 14px;
	font-size: 14.5px;
	line-height: 1.45;
	color: var(--spoki-text-soft);
}
.spoki-mega-ajutor-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 20px;
	border-radius: var(--spoki-radius-pill);
	background: var(--spoki-primary);
	color: var(--spoki-white);
	font-weight: 800;
	font-size: 15px;
	text-decoration: none;
}
.spoki-mega-ajutor-cta:hover { background: var(--spoki-primary-dark); color: var(--spoki-white); }
.spoki-mega-ajutor-tel {
	display: block;
	margin-top: 12px;
	font-weight: 800;
	font-size: 16px;
	color: var(--spoki-primary);
	text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
	.spoki-mega-panou { animation: none; }
	.spoki-mega summary::after,
	.spoki-mega-item,
	.spoki-mega summary { transition: none; }
}

/* Sub 1000px bara nu se foloseste: intra panoul mobil. */
@media (max-width: 999px) {
	.spoki-mega { display: none; }
}

/* ---------- Grup lung: doua coloane, ca panoul sa ramana scund ---------- */
.spoki-mega-col--lat {
	grid-column: span 2;
	display: block;
	/* Latimea decide numarul de coloane, cel mult 4. Lista de 16 categorii
	   iese pe 2 coloane, cea de 11 personaje pe 4. */
	columns: 220px 4;
	column-gap: 28px;
}
.spoki-mega-col--lat > .spoki-mega-col-t {
	column-span: all;
}
.spoki-mega-col--lat .spoki-mega-item {
	break-inside: avoid;
}

/* spoki-footer.css */
#footer{background:#27345a;color:#fff}#footer [data-row]{background:transparent;border:0}#footer [data-row="middle"]>.ct-container{padding-top:52px;padding-bottom:0}#footer .spoki-footer-grid{display:grid;grid-template-columns:1.3fr .9fr .9fr .95fr;gap:clamp(36px,5vw,78px);padding-bottom:48px;text-align:left}#footer .spoki-footer-brand{max-width:340px}#footer .spoki-footer-logo{display:inline-block;background:#fff;border-radius:13px;padding:8px;line-height:0}#footer .spoki-footer-logo img{display:block;width:135px;height:auto}#footer .spoki-footer-brand p{margin:18px 0 0;max-width:320px;font-size:15.5px;line-height:1.5;color:#eaeff8}#footer .spoki-footer-nav h2{margin:0 0 14px;font-size:16px;font-weight:800;line-height:1.3;color:#fff;letter-spacing:0}#footer .spoki-footer-nav ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}#footer .spoki-footer-nav li{margin:0}#footer .spoki-footer-nav a{display:inline-block;color:#eaeff8;font-size:15.5px;line-height:1.35;text-decoration:none;padding:3px 0}#footer .spoki-footer-nav a:hover{color:#ffd84a;text-decoration:underline;text-underline-offset:3px}#footer a:focus-visible{outline:2px solid #ffd84a;outline-offset:3px;border-radius:4px;color:#ffd84a}#footer [data-row="bottom"]>.ct-container{border-top:1px solid rgba(255,255,255,.16);padding-top:24px;padding-bottom:24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;row-gap:10px}#footer [data-row="bottom"] [data-column]{margin:0}#footer .ct-footer-copyright,#footer .spoki-footer-vat{margin:0;font-size:13.5px;line-height:1.45;color:#c3cde3}#footer .spoki-footer-vat{text-align:right}@media (max-width:1100px){#footer .spoki-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 44px}#footer .spoki-footer-brand{max-width:none}}@media (max-width:767px){#footer [data-row="middle"]>.ct-container{padding-top:40px}#footer .spoki-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;padding-bottom:34px}#footer .spoki-footer-brand{grid-column:1/-1}#footer .spoki-footer-brand p{max-width:none}}@media (max-width:420px){#footer .spoki-footer-grid{grid-template-columns:1fr;gap:28px}#footer [data-row="bottom"]>.ct-container{flex-direction:column;align-items:flex-start;gap:8px}#footer .spoki-footer-vat{text-align:left}}#footer .spoki-footer-sal{display:inline-block;margin-top:20px;border-radius:10px;overflow:hidden;line-height:0}#footer .spoki-footer-sal img{display:block;width:150px;height:auto}@media (max-width:767px){#footer .spoki-footer-sal img{width:132px}}
/* Placheta are acum si o sursa WebP, deci <picture> trebuie sa fie bloc. */
#footer .spoki-footer-sal picture{display:block;line-height:0}

/* --- Banda de jos: metode de plata si nota de finantare ---------------------
   Sta sub cele patru coloane, deasupra randului de copyright. Nota de
   finantare este cea mai discreta bucata din subsol: text mic, culoare
   stinsa. Emblema si sigla stau pe placi albe, pentru ca fundalul
   subsolului este inchis, iar emblema europeana are nevoie de contur alb. */
#footer .spoki-footer-extra{
	border-top:1px solid rgba(255,255,255,.16);
	padding:22px 0 26px;
	display:flex;
	flex-direction:column;
	gap:20px;
}
#footer .spoki-pay{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px;
	margin:0;
	padding:0;
	list-style:none;
}
#footer .spoki-pay li{margin:0;line-height:0}
#footer .spoki-pay img{display:block;width:40px;height:25px}
#footer .spoki-pay .spoki-pay-cod{
	line-height:1.35;
	font-size:12.5px;
	color:#c3cde3;
	padding-left:6px;
}
#footer .spoki-eu{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:14px 22px;
}
#footer .spoki-eu-logos{display:flex;align-items:center;gap:12px;flex:none}
#footer .spoki-eu-plate{
	background:#fff;
	border-radius:8px;
	padding:5px 7px;
	line-height:0;
	flex:none;
}
#footer .spoki-eu-plate img{display:block;height:auto}
#footer .spoki-eu-flag img{width:58px}
#footer .spoki-eu-prog img{width:66px}
#footer .spoki-eu-caption{
	font-size:12px;
	line-height:1.25;
	font-weight:600;
	color:#eaeff8;
	flex:none;
}
#footer .spoki-eu-text{
	margin:0;
	flex:1 1 340px;
	min-width:260px;
	font-size:11.5px;
	line-height:1.55;
	color:#9fadc7;
}
@media (max-width:767px){
	#footer .spoki-footer-extra{gap:16px;padding:18px 0 22px}
	#footer .spoki-eu{gap:12px}
	#footer .spoki-eu-text{flex-basis:100%}
}
/* CHG-0060: pe telefon placheta SAL era la fel de mare ca pe desktop si tragea
   ochiul mai mult decat continutul subsolului. 150 -> 104 px. */
@media (max-width: 767px) {
	#footer .spoki-footer-sal img,
	#footer .spoki-footer-sal picture {
		width: 80px;
		height: auto;
	}
}

/* CHG-0068: legaturile din meniul subsolului aveau 27 px inaltime - 21 de text
   si 3 px de padding de fiecare parte.

   Aici NU folosim trucul cu margine negativa, ca la trohe: lista este un grid cu
   gap de 10 px, iar niste cutii de 44 cu margine -9 s-ar suprapune. Doua tinte
   care se suprapun sunt mai rau decat una mica - degetul apasa altceva decat
   vede. Deci crestem padding-ul si scoatem gap-ul: cutia ajunge la 45 px, iar
   spatiul vizibil dintre texte creste de la 16 la 22 px.

   Selectorul este acelasi ca al regulii de mai sus - #footer .spoki-footer-nav a,
   1,1,1 - fiindca aceea foloseste prescurtarea padding:3px 0, pe care un
   padding-block cu specificitate mai mica nu o poate bate. */
#footer .spoki-footer-nav ul {
	gap: 0;
}

#footer .spoki-footer-nav a {
	display: inline-block;
	padding: 12px 0;
}

/* spoki-home.css */
.home{--navy:#263258;--ink:#252b3a;--muted:#5f6778;--teal:#0b9ea3;--teal-dark:#087c80;--teal-pale:#e7f8f7;--orange:#ff8500;--orange-dark:#e97a00;--coral:#ff645a;--sky:#dff3ff;--yellow:#ffd84a;--cream:#fff9ee;--paper:#fff;--line:#e8e9ee;--shadow:0 14px 36px rgba(38,50,88,.10);--radius:24px;--wrap:min(1180px,calc(100% - 40px))}.home .entry-header{display:none}.home .entry-content>.spoki-band{max-width:none;margin-inline:0}.home .entry-content{color:var(--ink)}.home .entry-content img{display:block;max-width:100%;height:auto}.home .entry-content a{text-decoration:none}.home .wrap{width:var(--wrap);margin-inline:auto}.home .entry-content h1,.home .entry-content h2,.home .entry-content h3{margin-top:0;line-height:1.12;letter-spacing:-.025em;color:var(--navy)}.home .entry-content a:focus-visible,.home .entry-content button:focus-visible,.home .entry-content summary:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}.home .eyebrow{display:inline-flex;align-items:center;gap:9px;margin:0 0 14px;color:var(--teal-dark);font-size:.82rem;letter-spacing:.09em;text-transform:uppercase;font-weight:900}.home .eyebrow:before{content:"";width:25px;height:5px;background:var(--orange);border-radius:9px;flex:none}.home .entry-content .button{min-height:50px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:0 23px;font-weight:900;border:2px solid transparent;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.home .entry-content .button:hover{transform:translateY(-2px)}.home .entry-content .button-primary{background:var(--orange);color:#252b3a;box-shadow:0 9px 22px rgba(255,133,0,.24)}.home .entry-content .button-primary:hover{background:var(--orange-dark);color:#252b3a}.home .entry-content .button-secondary{background:#fff;color:var(--teal-dark);border-color:var(--teal)}.home .entry-content .button-secondary:hover{background:var(--teal-pale);color:var(--teal-dark)}.home .entry-content .text-link{font-weight:900;color:var(--teal-dark);display:inline-flex;align-items:center;gap:7px;white-space:nowrap;min-height:44px}.home .entry-content .text-link:hover{text-decoration:underline;text-underline-offset:3px}.home .hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#fff9ec 0%,#fffdf8 47%,#e9f9f8 100%)}.home .hero:before,.home .hero:after{content:"";position:absolute;border-radius:999px;pointer-events:none}.home .hero:before{width:270px;height:270px;background:rgba(255,216,74,.33);right:-90px;top:-95px}.home .hero:after{width:150px;height:150px;background:rgba(255,100,90,.13);left:-75px;bottom:-60px}.home .hero-grid{min-height:505px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);align-items:center;gap:58px;padding:54px 0 46px;position:relative;z-index:1}.home .entry-content h1{font-size:clamp(2.55rem,5vw,4.6rem);margin-bottom:19px;max-width:770px}.home h1 .accent{color:var(--teal);position:relative;white-space:nowrap}.home h1 .accent:after{content:"";height:10px;border-radius:999px;background:var(--yellow);opacity:.75;position:absolute;left:0;right:0;bottom:-4px;z-index:-1;transform:rotate(-1.5deg)}.home .hero-copy{font-size:1.16rem;color:#4f5868;max-width:650px;margin:0 0 26px}.home .cta-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.home .hero-note{display:flex;align-items:center;gap:9px;margin-top:22px;margin-bottom:0;font-size:.9rem;color:#535c69;font-weight:800}.home .hero-note .check{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--teal-dark);color:#fff;font-size:.78rem;flex:none}.home .hero-visual{position:relative;justify-self:end;width:min(100%,470px)}.home .hero-image{position:relative;border-radius:42% 58% 43% 57% / 56% 42% 58% 44%;background:#fff;box-shadow:0 25px 65px rgba(38,50,88,.15);overflow:hidden;border:8px solid rgba(255,255,255,.72);margin:0}.home .hero-image img{display:block;width:100%;aspect-ratio:1 / 1;object-fit:cover}.home .float-pill{position:absolute;background:#fff;border-radius:18px;box-shadow:var(--shadow);padding:11px 15px;font-weight:900;font-size:.88rem;display:flex;align-items:center;gap:9px;margin:0;color:var(--ink)}.home .float-pill strong{width:28px;height:28px;border-radius:10px;display:grid;place-items:center;color:#252b3a;background:var(--coral);flex:none}.home .float-one{left:-34px;top:42px;transform:rotate(-3deg)}.home .float-two{right:-22px;bottom:36px;transform:rotate(2deg)}.home .float-two strong{background:var(--teal-dark)}.home .trust{position:relative;margin-top:-1px;background:#fff;border-bottom:1px solid var(--line)}.home .trust-grid{display:grid;grid-template-columns:repeat(4,1fr)}.home .trust-item{min-height:88px;display:flex;align-items:center;gap:13px;padding:18px 20px;border-right:1px solid var(--line)}.home .trust-item:last-child{border-right:0}.home .trust-icon{width:40px;height:40px;flex:0 0 auto;border-radius:14px;background:var(--teal-pale);color:var(--teal-dark);display:grid;place-items:center;font-size:1.05rem;font-weight:900}.home .trust-item strong{display:block;color:var(--navy);line-height:1.25}.home .trust-item span{display:block;color:var(--muted);font-size:.82rem;line-height:1.35;margin-top:3px}.home .section{padding:78px 0}.home .section-soft{background:#f3f7ff}.home .section-cream{background:var(--cream)}.home .section-head{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:32px}.home .section-head h2{font-size:clamp(2rem,3.2vw,3rem);margin-bottom:8px}.home .section-head p{margin:0;color:var(--muted);max-width:650px;font-size:1.03rem}.home .category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.home .category-card{position:relative;background:#fff;border:1px solid #e6e8ee;border-radius:24px;overflow:hidden;box-shadow:0 9px 24px rgba(38,50,88,.08);transition:transform .2s ease,box-shadow .2s ease;display:block;color:inherit}.home .category-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.home .category-image{display:block;height:245px;overflow:hidden;background:#f0f6fa;margin:0}.home .category-image picture,.home .hero-image picture,.home .feature-image picture{display:block;width:100%;height:100%}.home .cat--squishy img{object-position:center 30%}.home .cat--fidget img{object-position:center 28%}.home .cat--pop-it img{object-position:center center}.home .cat--stem img{object-position:center 24%}.home .cat--seturi img{object-position:center 28%}.home .cat--educative img{object-position:center 24%}.home .category-image img{width:100%;height:100%;object-fit:cover;transition:transform .25s ease}.home .category-card:hover img{transform:scale(1.035)}.home .category-body{padding:18px 20px 20px}.home .category-body h3{font-size:1.1rem;line-height:1.2;margin:0 0 5px}.home .category-body span{font-size:.9rem;line-height:1.45;color:var(--muted)}.home .choice-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:32px;align-items:stretch}.home .choice-intro{border-radius:var(--radius);background:var(--navy);color:#fff;padding:38px;position:relative;overflow:hidden}.home .choice-intro:after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;background:var(--coral);right:-55px;bottom:-65px;opacity:.75}.home .choice-intro .eyebrow{color:#fff;position:relative;z-index:1}.home .choice-intro h2{color:#fff;font-size:clamp(2rem,3vw,2.8rem);margin-bottom:15px;position:relative;z-index:1}.home .choice-intro p{margin:0 0 24px;color:#e6ebfa;font-size:1.04rem;position:relative;z-index:1}.home .choice-intro .button{position:relative;z-index:1}.home .choice-options{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.home .choice-card{min-height:172px;border-radius:22px;background:#fff;border:1px solid #e4e8f1;padding:24px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 7px 18px rgba(38,50,88,.06);transition:transform .2s ease,border-color .2s ease;color:inherit}.home .choice-card:hover{transform:translateY(-3px);border-color:var(--teal)}.home .choice-card small{display:inline-flex;width:max-content;padding:5px 9px;border-radius:999px;background:var(--teal-pale);color:var(--teal-dark);font-weight:900}.home .choice-card:nth-child(2) small{background:#fff0d9;color:#a94e00}.home .choice-card:nth-child(3) small{background:#ffe8e5;color:#a13932}.home .choice-card:nth-child(4) small{background:#edf0ff;color:#4153a5}.home .choice-card h3{font-size:1.23rem;margin:13px 0 6px}.home .choice-card p{margin:0;color:var(--muted);font-size:.9rem}.home .choice-card b{margin-top:15px;color:var(--teal-dark);display:block}.home .spoki-products .wc-block-product-template{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:0;padding:0;list-style:none}.home .spoki-products .wc-block-product{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 8px 22px rgba(38,50,88,.07);display:flex;flex-direction:column;margin:0;max-width:none;padding:0}.home .spoki-products .wc-block-components-product-image{position:relative;background:#fff;aspect-ratio:1 / 1;overflow:hidden;margin:0;width:100%}.home .spoki-products .wc-block-components-product-image img{width:100%;height:100%;object-fit:contain;padding:9px;transition:transform .24s ease}.home .spoki-products .wc-block-product:hover .wc-block-components-product-image img{transform:scale(1.04)}.home .spoki-products .wc-block-components-product-sale-badge{position:absolute;top:12px;left:12px;border-radius:999px;padding:6px 10px;color:#252b3a;background:var(--coral);font-size:.72rem;font-weight:900;z-index:2;border:0;margin:0}.home .spoki-products .wp-block-post-title{font-size:1.04rem;line-height:1.3;margin:0 0 13px;min-height:2.7em;padding:0 18px;font-weight:900}.home .spoki-products .wp-block-post-title a{color:var(--navy);display:block;min-height:44px}.home .spoki-products .wp-block-post-title a:hover{color:var(--teal-dark)}.home .spoki-products .wc-block-components-product-price{display:flex;align-items:baseline;gap:7px;margin:auto 0 14px;padding:0 18px;color:var(--navy);font-size:1.2rem;font-weight:900}.home .spoki-products .wc-block-components-product-price del{font-size:.8rem;color:#6f7580;font-weight:700;opacity:1;order:2}.home .spoki-products .wc-block-components-product-price ins{text-decoration:none}.home .spoki-products .wc-block-components-product-button{margin:0;padding:0 18px 18px}.home .spoki-products .wc-block-components-product-button .wp-block-button__link{min-height:44px;width:100%;border-radius:13px;background:var(--teal-dark);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:.95rem;padding:10px 14px}.home .spoki-products .wc-block-components-product-button .wp-block-button__link:hover{background:#065f63;color:#fff}.home .feature{display:grid;grid-template-columns:1fr 1fr;min-height:450px;border-radius:34px;overflow:hidden;background:var(--navy);box-shadow:0 22px 55px rgba(38,50,88,.18)}.home .feature-image{background:#fff4cc;overflow:hidden;margin:0}.home .feature-image img{width:100%;height:100%;object-fit:cover}.home .feature-copy{display:flex;flex-direction:column;justify-content:center;padding:52px;color:#fff;position:relative}.home .feature-copy:after{content:"";position:absolute;width:190px;height:190px;border-radius:50%;background:var(--teal);right:-80px;top:-80px;opacity:.6}.home .feature-copy>*{position:relative;z-index:1}.home .feature-copy .eyebrow{color:#fff}.home .feature-copy h2{font-size:clamp(2rem,3.8vw,3.4rem);color:#fff;margin-bottom:16px}.home .feature-copy p{color:#e7ebf7;font-size:1.06rem;margin:0 0 23px;max-width:520px}.home .feature-list{display:grid;gap:10px;margin:0 0 26px;padding:0;list-style:none}.home .feature-list li{display:flex;align-items:center;gap:10px;font-weight:800;margin:0}.home .feature-list li:before{content:"✓";width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--yellow);color:var(--navy);font-weight:900;flex:none}.home .answer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.home .answer-card{border-radius:22px;padding:26px;background:#fff;border-top:6px solid var(--teal);box-shadow:0 8px 20px rgba(38,50,88,.06)}.home .answer-card:nth-child(2){border-top-color:var(--orange)}.home .answer-card:nth-child(3){border-top-color:var(--coral)}.home .answer-card h3{font-size:1.16rem;margin-bottom:10px}.home .answer-card p{margin:0;color:var(--muted);font-size:.94rem}.home .answer-card a{display:inline-flex;align-items:center;min-height:44px;color:var(--teal-dark);font-weight:900;margin-top:8px}.home .answer-card a:hover{text-decoration:underline;text-underline-offset:3px}.home .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:step}.home .step{counter-increment:step;padding:28px;border-radius:22px;background:#fff;border:1px solid var(--line)}.home .step:before{content:counter(step);width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:var(--yellow);color:var(--navy);font-size:1.1rem;font-weight:900;margin-bottom:17px}.home .step:nth-child(2):before{background:var(--teal-dark);color:#fff}.home .step:nth-child(3):before{background:var(--coral);color:#252b3a}.home .step h3{font-size:1.17rem;margin-bottom:8px}.home .step p{margin:0;color:var(--muted);font-size:.94rem}.home .seo-panel{background:linear-gradient(135deg,var(--teal-dark),#075d64);color:#fff;border-radius:30px;padding:42px;display:grid;grid-template-columns:.8fr 1.2fr;gap:44px;align-items:start}.home .seo-panel .eyebrow{color:#fff}.home .seo-panel h2{color:#fff;font-size:clamp(2rem,3.2vw,3rem);margin-bottom:14px}.home .seo-panel .lead{color:#e8faf9;margin:0;font-size:1.03rem}.home .seo-copy{columns:2;column-gap:34px;color:#edffff;font-size:.93rem}.home .seo-copy p{margin-top:0;break-inside:avoid}.home .seo-copy a{font-weight:900;text-decoration:underline;text-underline-offset:3px;color:#fff}.home .faq{display:grid;grid-template-columns:.72fr 1.28fr;gap:42px;align-items:start}.home .faq h2{font-size:clamp(2rem,3.2vw,3rem);margin-bottom:13px}.home .faq-intro p{color:var(--muted);margin:0 0 20px}.home .faq-list{display:grid;gap:12px}.home .faq-list .wp-block-details{background:#fff;border:1px solid var(--line);border-radius:17px;overflow:hidden;box-shadow:0 5px 15px rgba(38,50,88,.05);margin:0;padding:0}.home .faq-list summary{list-style:none;cursor:pointer;padding:20px 54px 20px 21px;color:var(--navy);font-weight:900;position:relative}.home .faq-list summary::-webkit-details-marker{display:none}.home .faq-list summary:after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--teal-pale);color:var(--teal-dark);font-size:1.2rem}.home .faq-list .wp-block-details[open] summary:after{content:"−"}.home .faq-list .wp-block-details p{margin:0;padding:0 21px 20px;color:var(--muted);font-size:.95rem}.home #header{border-bottom:1px solid var(--line)}.home .ct-header [data-id="menu"] .menu-item>a{font-weight:900}.home .ct-header [data-id="menu"] .menu-item>a:hover{color:var(--teal-dark)}.home .ct-cart-item .ct-dynamic-count-cart{background:var(--orange);color:#fff;font-weight:900}.home .ct-header-search.ct-toggle:hover,.home .ct-header-cart .ct-cart-item:hover{color:var(--teal-dark)}@media (max-width:1020px){.home{--wrap:min(100% - 32px,920px)}.home .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.home .choice-grid{grid-template-columns:1fr}.home .spoki-products .wc-block-product-template{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:780px){.home{--wrap:min(100% - 24px,720px);--radius:20px}.home .hero-grid{grid-template-columns:1fr;gap:28px;padding:42px 0 36px}.home .entry-content h1{font-size:clamp(2.35rem,11vw,3.4rem)}.home .hero-copy{font-size:1.03rem}.home .hero-visual{justify-self:center;width:min(90%,420px)}.home .float-one{left:-15px;top:25px}.home .float-two{right:-8px;bottom:20px}.home .trust-grid{grid-template-columns:repeat(2,1fr)}.home .trust-item:nth-child(2){border-right:0}.home .trust-item:nth-child(-n+2){border-bottom:1px solid var(--line)}.home .section{padding:58px 0}.home .section-head{align-items:start;flex-direction:column;margin-bottom:25px;gap:12px}.home .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.home .feature,.home .seo-panel,.home .faq{grid-template-columns:1fr}.home .choice-intro{padding:30px}.home .feature-copy{padding:35px 29px}.home .feature-image{min-height:330px}.home .answer-grid,.home .steps{grid-template-columns:1fr}.home .seo-panel{padding:31px 27px;gap:24px}.home .seo-copy{columns:1}}@media (max-width:520px){.home .hero-grid{padding-top:34px}.home .entry-content h1{font-size:2.45rem}.home .cta-row{display:grid;grid-template-columns:1fr}.home .entry-content .button{width:100%}.home .float-pill{font-size:.76rem;padding:8px 10px}.home .float-pill strong{width:23px;height:23px}.home .trust-item{padding:14px 10px;gap:9px;align-items:flex-start}.home .trust-icon{width:34px;height:34px;border-radius:11px}.home .trust-item strong{font-size:.86rem}.home .trust-item span{font-size:.72rem}.home .category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.home .category-card{min-height:305px;border-radius:22px}.home .category-image{height:210px}.home .category-body{padding:14px}.home .category-body h3{font-size:1rem}.home .category-body span{font-size:.875rem}.home .choice-options{grid-template-columns:1fr}.home .choice-card{min-height:145px}.home .spoki-products .wc-block-product-template{gap:11px}.home .spoki-products .wp-block-post-title{font-size:.9rem;min-height:3.7em;padding:0 13px}.home .spoki-products .wc-block-components-product-price{font-size:1rem;flex-wrap:wrap;padding:0 13px}.home .spoki-products .wc-block-components-product-button{padding:0 13px 13px}.home .spoki-products .wc-block-components-product-button .wp-block-button__link{font-size:.83rem}.home .section-head .text-link{white-space:normal}}@media (prefers-reduced-motion:reduce){.home .category-card,.home .category-image img,.home .spoki-products .wc-block-components-product-image img,.home .entry-content .button,.home .choice-card{transition:none}.home .category-card:hover,.home .entry-content .button:hover,.home .choice-card:hover{transform:none}.home .category-card:hover img,.home .spoki-products .wc-block-product:hover .wc-block-components-product-image img{transform:none}}
/* --- Mobil: fotografia eroului coboara sub prima vizualizare -----------------
   Masurat pe 08.09: pe telefon fotografia incepea la 703 px pe un ecran de
   823 px, deci se vedea doar o fasie de ~120 px, dar Chrome o alegea drept
   element LCP. Asa, tot randul de octeti al paginii intra in acel numar si
   LCP-ul mobil statea la 4,85 s.
   Cele doua pastile plutitoare devin un rand de pasi, asezat deasupra
   fotografiei: impinge imaginea sub prima vizualizare si, in acelasi timp,
   face cei doi pasi lizibili, in loc sa stea peste chipul copilului.
   Revenire: se sterge acest bloc. */
@media (max-width:780px){
	.home .hero-visual{
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:10px;
		width:min(100%,420px);
	}
	.home .hero-visual .float-pill{
		position:static;
		inset:auto;
		transform:none;
		width:100%;
		justify-content:flex-start;
		font-size:.9rem;
		padding:10px 14px;
		border:1px solid rgba(1,130,135,.16);
		box-shadow:0 2px 10px rgba(38,50,88,.09);
	}
	.home .hero-visual .float-pill strong{width:26px;height:26px}
	.home .hero-visual .float-one{order:1}
	.home .hero-visual .float-two{order:2}
	.home .hero-image{
		order:3;
		width:min(76%,290px);
		margin-top:26px;
	}
}