/* gt-home-bundle.css — concatenare deterministă (fix-116) a CSS-urilor front-page-only:
   gt-carousel.css + gt-inspiration.css + gt-prodcar.css, în ORDINEA exactă de enqueue.
   Zero rescriere/minificare/reordonare. Reduce 3 request-uri → 1 pe homepage. */

/* ===== gt-carousel.css ===== */
/* GreenTouch — carusel mobil pentru secțiuni de homepage (Ce poți realiza, Recomandate acum).
   DOAR pe mobil. Desktop rămâne exact grila existentă (.grid-auto.cols-*). Fără biblioteci.
   Specificitate .grid-auto.gt-carousel[data-gt-carousel] (0,3,0) > .grid-auto.cols-4 (0,2,0),
   încărcat după CSS-urile aprobate → override fără !important, fără a le modifica. */

/* Container dots + hint (injectate de JS) — ascunse pe desktop. */
.gt-carousel-nav{display:none}
/* Săgețile există în DOM pe orice viewport unde motorul e activ, dar sunt afișate DOAR pe desktop. */
.gt-carousel-arrow{display:none}

@media (min-width: 1025px){
	/* Desktop: același motor (scroll-snap track) cu 3 carduri vizibile. Tableta 521–1024 rămâne grid. */
	.grid-auto.gt-carousel[data-gt-carousel]{
		display:flex;
		grid-template-columns:none;
		gap:24px;
		overflow-x:auto;
		scroll-snap-type:x mandatory;
		scroll-padding-left:2px;
		padding-bottom:8px;
		scrollbar-width:none;
	}
	.grid-auto.gt-carousel[data-gt-carousel]::-webkit-scrollbar{display:none}
	.grid-auto.gt-carousel[data-gt-carousel] > *{
		flex:0 0 calc((100% - 48px) / 3); /* 3 carduri vizibile (2 gap-uri de 24px) */
		scroll-snap-align:start;
		min-width:0;
	}
	/* Nav desktop: săgeți + dots pe un rând. */
	.gt-carousel-nav{
		display:flex;
		align-items:center;
		justify-content:center;
		gap:14px;
		margin-top:20px;
	}
	.gt-carousel-arrow{
		display:inline-flex;align-items:center;justify-content:center;
		width:44px;height:44px;border-radius:999px;padding:0;cursor:pointer;
		border:1.5px solid rgba(29,32,25,.14);background:#fff;color:var(--green-900,#1C3527);
		font:400 22px/1 var(--font-ui,system-ui,sans-serif);
		transition:border-color .2s ease,background .2s ease,color .2s ease;
	}
	.gt-carousel-arrow:hover{border-color:var(--green-600,#4E6B4A);background:var(--green-pale,#EAF0E2)}
	.gt-carousel-arrow:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}
	.gt-carousel-dots{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
	.gt-carousel-dot{
		width:8px;height:8px;border-radius:999px;padding:0;border:none;cursor:pointer;
		background:rgba(29,32,25,.2);
		transition:background .2s ease, width .2s ease;
	}
	.gt-carousel-dot.is-active{background:var(--green-900,#1C3527);width:22px}
	.gt-carousel-dot:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}
	.gt-carousel-hint{display:none} /* pe desktop, săgețile+dots sunt suficiente */
}

@media (max-width: 520px){
	.grid-auto.gt-carousel[data-gt-carousel]{
		display:flex;
		grid-template-columns:none;      /* anulează grila pe mobil */
		gap:14px;
		overflow-x:auto;
		scroll-snap-type:x mandatory;
		-webkit-overflow-scrolling:touch;
		scroll-padding-left:2px;
		padding-bottom:6px;
		scrollbar-width:none;            /* Firefox */
	}
	.grid-auto.gt-carousel[data-gt-carousel]::-webkit-scrollbar{display:none} /* WebKit */
	.grid-auto.gt-carousel[data-gt-carousel] > *{
		flex:0 0 86%;                    /* un card complet + o parte din următorul */
		scroll-snap-align:center;
		min-width:0;
	}

	/* Indicator de poziție (dots) + hint. */
	.gt-carousel-nav{
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:10px;
		margin-top:16px;
	}
	.gt-carousel-dots{
		display:flex;
		gap:8px;
		align-items:center;
		justify-content:center;
		flex-wrap:wrap;
		max-width:100%;
	}
	.gt-carousel-dot{
		width:8px;height:8px;border-radius:999px;padding:0;border:none;cursor:pointer;
		background:rgba(29,32,25,.2);
		transition:background .2s ease, transform .2s ease, width .2s ease;
	}
	.gt-carousel-dot.is-active{background:var(--green-900,#1C3527);width:22px}
	.gt-carousel-dot:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}
	.gt-carousel-hint{
		display:inline-flex;align-items:center;gap:7px;
		font:500 12.5px var(--font-ui, system-ui, sans-serif);
		color:var(--ink-50, rgba(29,32,25,.5));
	}
}

@media (prefers-reduced-motion: reduce){
	.grid-auto.gt-carousel[data-gt-carousel]{scroll-behavior:auto}
	.gt-carousel-dot{transition:none}
}

/* A11y: mărește DOAR hit-area (invizibil) a punctelor carusel, fără schimbare vizuală.
   14×24px centrat pe punct: nu se suprapune cu punctele adiacente (distanță ≥16px). */
.gt-carousel-dot{position:relative}
.gt-carousel-dot::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:14px;height:24px}

/* ===== gt-inspiration.css ===== */
/* GreenTouch — „Inspirație din atelier": galerie filtrabilă.
   Desktop (≥760px): layout editorial 1 mare + 2 mici, rotire automată a seturilor.
   Mobil (≤520px): carusel swipe 1 card + peek + dots.
   Fallback fără JS: grilă simplă. Namespace .gt-insp-*. Reutilizează tokens. */

.gt-insp{position:relative}

/* Chips filtrare */
.gt-insp-filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:4px;margin-bottom:18px}
.gt-insp-filters::-webkit-scrollbar{display:none}
.gt-insp-chip{flex:0 0 auto;background:#fff;border:1.5px solid rgba(29,32,25,.12);border-radius:var(--r-chip,999px);padding:9px 18px;font:600 14px var(--font-ui,system-ui,sans-serif);color:var(--ink,#1D2019);cursor:pointer;transition:all var(--t-micro,.18s) var(--ease,ease);white-space:nowrap}
.gt-insp-chip:hover{border-color:var(--green-600,#4E6B4A)}
.gt-insp-chip.is-active{background:var(--green-900,#1C3527);color:#fff;border-color:var(--green-900,#1C3527)}
.gt-insp-chip:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}

/* Card */
.gt-insp-item{position:relative;display:block;overflow:hidden;border-radius:var(--r-card,20px);text-decoration:none;color:#fff;background:var(--sage,#8FA382);min-height:220px}
.gt-insp-img{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s var(--ease,ease)}
.gt-insp-item:hover .gt-insp-img{transform:scale(1.04)}
.gt-insp-item::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(20,28,20,.72));z-index:1}
.gt-insp-badge{position:absolute;top:14px;left:14px;z-index:2;background:rgba(250,247,240,.92);color:var(--green-900,#1C3527);border-radius:var(--r-chip,999px);padding:5px 12px;font:700 11.5px var(--font-ui,sans-serif)}
.gt-insp-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 18px 16px;display:flex;flex-direction:column;gap:3px}
.gt-insp-title{font:700 18px var(--font-display,serif);line-height:1.2}
.gt-insp-mats{font-size:13px;opacity:.9}
.gt-insp-more{font:600 13px var(--font-ui,sans-serif);margin-top:8px;opacity:.95}

/* Controls (dots + play) — ascunse implicit; JS le arată doar când e activ modul carusel. */
.gt-insp-controls{display:none;align-items:center;justify-content:center;gap:14px;margin-top:16px}
.gt-insp-dots{display:flex;gap:8px;align-items:center}
.gt-insp-dot{width:8px;height:8px;border-radius:999px;border:none;padding:0;cursor:pointer;background:rgba(29,32,25,.2);transition:background .2s ease,width .2s ease}
.gt-insp-dot.is-active{background:var(--green-900,#1C3527);width:22px}
.gt-insp-dot:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}
.gt-insp-play{display:inline-flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;font:500 12.5px var(--font-ui,sans-serif);color:var(--ink-50,rgba(29,32,25,.5))}
.gt-insp-play-ico{width:20px;height:20px;border-radius:50%;border:1.5px solid currentColor;position:relative;flex:0 0 auto}
.gt-insp-play-ico::before,.gt-insp-play-ico::after{content:"";position:absolute;top:50%;transform:translateY(-50%);width:2px;height:7px;background:currentColor}
.gt-insp-play-ico::before{left:6.5px}.gt-insp-play-ico::after{right:6.5px}
.gt-insp-play.is-paused .gt-insp-play-ico::before{left:6px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:6px solid currentColor;border-top:4px solid transparent;border-bottom:4px solid transparent;background:none}
.gt-insp-play.is-paused .gt-insp-play-ico::after{display:none}

/* ---------- FALLBACK (fără JS, orice lățime): grilă simplă ---------- */
.gt-insp-stage{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.gt-insp-stage > .gt-insp-item{min-height:240px}

/* ---------- DESKTOP: layout editorial 1 mare + 2 mici (activat de JS: .is-featured) ---------- */
@media (min-width:760px){
	.gt-insp-stage.is-featured{
		display:grid;
		grid-template-columns:1.6fr 1fr;   /* ~62% / ~38% */
		grid-template-rows:1fr 1fr;
		gap:16px;
		height:clamp(420px,42vw,560px);
	}
	.gt-insp-stage.is-featured > .gt-insp-item{display:none;min-height:0}
	.gt-insp-stage.is-featured > .gt-insp-item.is-lead{display:block;grid-row:1 / span 2;grid-column:1}
	.gt-insp-stage.is-featured > .gt-insp-item.is-side-1{display:block;grid-column:2;grid-row:1}
	.gt-insp-stage.is-featured > .gt-insp-item.is-side-2{display:block;grid-column:2;grid-row:2}
	.gt-insp-stage.is-featured > .gt-insp-item.is-lead .gt-insp-title{font-size:26px}
	.gt-insp-stage.is-featured{transition:opacity .35s var(--ease,ease)}
	.gt-insp-stage.is-featured.is-swapping{opacity:.35}
	.gt-insp-controls.is-on{display:flex}
}

/* ---------- MOBIL: carusel swipe 1 card + peek ---------- */
@media (max-width:520px){
	.gt-insp-stage.is-carousel{
		display:flex;
		gap:14px;
		overflow-x:auto;
		scroll-snap-type:x mandatory;
		-webkit-overflow-scrolling:touch;
		scrollbar-width:none;
		padding-bottom:6px;
	}
	.gt-insp-stage.is-carousel::-webkit-scrollbar{display:none}
	.gt-insp-stage.is-carousel > .gt-insp-item{flex:0 0 86%;scroll-snap-align:center;min-height:300px}
	.gt-insp-stage.is-carousel > .gt-insp-item[hidden]{display:none}
	.gt-insp-controls.is-on{display:flex}
	.gt-insp-play-tx{display:none} /* pe mobil păstrăm doar iconul + dots, discret */
}

@media (prefers-reduced-motion:reduce){
	.gt-insp-img,.gt-insp-stage.is-featured{transition:none}
	.gt-insp-dot{transition:none}
}

/* ===== gt-prodcar.css ===== */
/* GreenTouch — carusel de produse pe categorie (Tablouri / Materiale).
   O singură componentă, folosită de ambele secțiuni. Reutilizează cardul de produs existent.
   Desktop: 4 carduri vizibile + săgeți laterale + autoplay (fără dots).
   Mobil/tabletă: swipe 1 card + peek (fără săgeți, fără dots). Fără overflow orizontal al paginii. */

.gt-prodcar{position:relative}

/* Track = scroller orizontal cu snap. Cardurile își păstrează designul existent. */
.gt-prodcar-track{
	display:flex;
	gap:16px;
	overflow-x:auto;
	scroll-snap-type:x mandatory;
	-webkit-overflow-scrolling:touch;
	scrollbar-width:none;
	padding:4px 2px 8px;
}
.gt-prodcar-track::-webkit-scrollbar{display:none}
.gt-prodcar-track > *{
	flex:0 0 calc((100% - 3 * 16px) / 4); /* 4 carduri vizibile pe desktop */
	scroll-snap-align:start;
	min-width:0;
}

/* Săgeți (desktop). Ascunse pe mobil (acolo e swipe). */
.gt-prodcar-arrow{
	position:absolute;top:calc(50% - 26px);z-index:5;
	width:44px;height:44px;border-radius:50%;
	background:#fff;border:1.5px solid rgba(29,32,25,.12);
	color:var(--green-900,#1C3527);font-size:22px;line-height:1;
	display:flex;align-items:center;justify-content:center;cursor:pointer;
	box-shadow:0 6px 18px rgba(29,32,25,.12);
	transition:transform var(--t-micro,.18s) var(--ease,ease),border-color var(--t-micro,.18s) var(--ease,ease),opacity var(--t-micro,.18s) var(--ease,ease);
}
.gt-prodcar-arrow:hover{border-color:var(--green-600,#4E6B4A);transform:scale(1.06)}
.gt-prodcar-arrow:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}
.gt-prodcar-arrow[disabled]{opacity:.35;cursor:default}
.gt-prodcar-prev{left:-10px}
.gt-prodcar-next{right:-10px}

/* ---------- TABLETĂ (2-3 carduri) ---------- */
@media (max-width:1024px){
	.gt-prodcar-track > *{flex-basis:calc((100% - 2 * 16px) / 3)} /* 3 vizibile */
}
@media (max-width:760px){
	.gt-prodcar-track > *{flex-basis:calc((100% - 16px) / 2)} /* 2 vizibile */
}

/* ---------- MOBIL: 1 card + peek, fără săgeți ---------- */
@media (max-width:520px){
	.gt-prodcar-track{gap:14px}
	.gt-prodcar-track > *{flex-basis:86%;scroll-snap-align:center}
	.gt-prodcar-arrow{display:none}
}

@media (prefers-reduced-motion:reduce){
	.gt-prodcar-track{scroll-behavior:auto}
	.gt-prodcar-arrow,.gt-prodcar-dot{transition:none}
}

/* „Produse populare" — taburi (Tablouri / Materiale / Kituri DIY). Stil GreenTouch. */
.gt-pop-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.gt-pop-tab{
	flex:0 0 auto;
	background:#fff;border:1.5px solid rgba(29,32,25,.12);
	border-radius:var(--r-chip,999px);
	padding:10px 20px;
	font:600 14px var(--font-ui,system-ui,sans-serif);
	color:var(--ink,#1D2019);
	cursor:pointer;
	transition:background var(--t-micro,.18s) var(--ease,ease),border-color var(--t-micro,.18s) var(--ease,ease),color var(--t-micro,.18s) var(--ease,ease);
	min-height:44px; /* touch target */
}
.gt-pop-tab:hover{border-color:var(--green-600,#4E6B4A)}
.gt-pop-tab.is-active{background:var(--green-900,#1C3527);color:#fff;border-color:var(--green-900,#1C3527)}
.gt-pop-tab:focus-visible{outline:2px solid var(--green-600,#4E6B4A);outline-offset:2px}
.gt-pop-panel[hidden]{display:none}

/* Mobil: taburile rămân pe un rând; dacă nu încap la 360px, scroll orizontal curat (nu al paginii). */
@media (max-width:520px){
	.gt-pop-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-inline:0}
	.gt-pop-tabs::-webkit-scrollbar{display:none}
	.gt-pop-tab{padding:9px 16px;font-size:13.5px}
}
