/* Componenti Dekkosoft. Usa i colori del tema se ci sono, altrimenti valori propri. */
.dk-elenco, .dk-prodotto, .dk-lavoro, .dk-modulo, .dk-varianti, .dk-griglia {
	--dk-testo: var(--wp--preset--color--testo, #1d1d20);
	--dk-tenue: var(--wp--preset--color--tenue, #5d5d64);
	--dk-sfondo: var(--wp--preset--color--sfondo, #fff);
	--dk-superficie: var(--wp--preset--color--superficie, #f5f4f1);
	--dk-bordo: var(--wp--preset--color--bordo, #e3e1dc);
	--dk-rosso: var(--wp--preset--color--rosso, #c8302b);
	--dk-raggio: 18px;
}
.dk-ico { flex: none; vertical-align: -0.2em; }
.dk-vuoto { color: var(--dk-tenue, #666); font-style: italic; }

/* Filtri */
.dk-filtri { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.dk-filtro {
	font: inherit; font-size: 0.9rem; font-weight: 700; cursor: pointer;
	padding: 8px 16px; border-radius: 999px; border: 1px solid var(--dk-bordo);
	background: var(--dk-sfondo); color: var(--dk-testo); transition: background .15s, color .15s, border-color .15s;
}
.dk-filtro:hover { border-color: var(--dk-testo); }
.dk-filtro[aria-pressed="true"] { background: var(--dk-testo); color: var(--dk-sfondo); border-color: var(--dk-testo); }

/* Griglia e schede */
.dk-griglia { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 20px; }
.dk-griglia [hidden] { display: none !important; }
.dk-card {
	--dk-colore: var(--dk-rosso);
	display: flex; gap: 18px; align-items: flex-start; padding: 22px;
	border-radius: var(--dk-raggio); background: var(--dk-superficie); border: 1px solid var(--dk-bordo);
	color: var(--dk-testo); text-decoration: none; position: relative; overflow: hidden;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s;
}
.dk-card::before {
	content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--dk-colore); opacity: .9;
}
.dk-card:hover, .dk-card:focus-visible { transform: translateY(-3px); box-shadow: 0 14px 32px -18px rgb(0 0 0 / .35); border-color: color-mix(in srgb, var(--dk-colore) 45%, var(--dk-bordo)); }
.dk-card__icona { flex: none; width: 76px; height: 76px; border-radius: 20px; overflow: hidden; background: var(--dk-sfondo); display: grid; place-items: center; box-shadow: 0 1px 0 var(--dk-bordo); }
.dk-card__icona img { width: 100%; height: 100%; object-fit: cover; }
.dk-card__corpo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.dk-card__titolo { font-size: 1.2rem; font-weight: 800; line-height: 1.2; }
.dk-card__testo { color: var(--dk-tenue); font-size: 0.95rem; line-height: 1.45; }
.dk-card--compatta { padding: 16px; align-items: center; }
.dk-card--compatta .dk-card__icona { width: 56px; height: 56px; border-radius: 15px; }
.dk-icona-vuota { font-size: 2rem; font-weight: 800; color: var(--dk-colore, var(--dk-rosso)); }

.dk-stato { align-self: flex-start; font-size: 0.72rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; }
.dk-stato--disponibile { background: color-mix(in srgb, #1f8a4c 14%, transparent); color: #1b7a43; }
.dk-stato--in-arrivo { background: color-mix(in srgb, var(--dk-rosso) 13%, transparent); color: var(--dk-rosso); }
.dk-stato--ritirato { background: var(--dk-bordo); color: var(--dk-tenue); }
.dk-piattaforme { display: flex; flex-wrap: wrap; gap: 10px; color: var(--dk-tenue); font-size: 0.85rem; }
.dk-piattaforma { display: inline-flex; align-items: center; gap: 4px; }
.dk-piattaforma .dk-ico { width: 16px; height: 16px; }

/* Scheda Prodotto */
.dk-prodotto { --dk-colore: var(--dk-rosso); }
.dk-testa { display: flex; gap: 28px; align-items: center; margin-bottom: 20px; }
.dk-testa__icona { flex: none; width: 132px; height: 132px; border-radius: 32px; overflow: hidden; background: var(--dk-superficie); display: grid; place-items: center; box-shadow: 0 18px 40px -22px color-mix(in srgb, var(--dk-colore) 70%, #000); }
.dk-testa__icona img { width: 100%; height: 100%; object-fit: cover; }
.dk-testa__testo { display: flex; flex-direction: column; gap: 8px; }
.dk-testa__titolo { margin: 0; font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: 1.05; }
.dk-testa__tagline { margin: 0; font-size: 1.2rem; color: var(--dk-tenue); }
.dk-sopratitolo { margin: 0; font-size: 0.8rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--dk-colore, var(--dk-rosso)); }
.dk-prodotto__estratto { font-size: 1.15rem; line-height: 1.55; max-width: 62ch; }

.dk-azioni { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0 36px; align-items: center; }
.dk-store {
	display: inline-flex; align-items: center; gap: 10px; padding: 9px 18px 9px 14px; border-radius: 12px;
	background: #111; color: #fff; text-decoration: none; line-height: 1.1; font-weight: 700; border: 1px solid #111;
}
.dk-store small { display: block; font-size: 0.68rem; font-weight: 500; opacity: .8; }
.dk-store .dk-store__etichetta { display: inline; font-size: 0.8rem; opacity: 1; font-weight: 600; }
.dk-store .dk-ico { width: 24px; height: 24px; }
.dk-store:hover { background: #2a2a2a; }
.dk-store--presto { background: transparent; color: var(--dk-tenue); border: 1px dashed var(--dk-bordo); cursor: default; }
.dk-pulsante { display: inline-flex; align-items: center; gap: 8px; }
.dk-pulsante--secondario {
	padding: 0.7em 1.2em; border-radius: 999px; border: 1.5px solid var(--dk-testo); color: var(--dk-testo); text-decoration: none; font-weight: 700;
}
.dk-pulsante--secondario:hover { background: var(--dk-testo); color: var(--dk-sfondo); }

.dk-screenshot {
	display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 4px 18px; margin: 0 -4px 40px;
	scrollbar-width: thin;
}
.dk-screenshot__voce { flex: none; scroll-snap-align: start; border-radius: 16px; overflow: hidden; border: 1px solid var(--dk-bordo); background: var(--dk-superficie); height: 440px; }
.dk-screenshot__voce img { height: 100%; width: auto; display: block; }
.dk-screenshot__voce:not(.dk-screenshot__voce--verticale) { height: 360px; }
@media (max-width: 600px) {
	.dk-screenshot__voce { height: 380px; }
	.dk-screenshot__voce:not(.dk-screenshot__voce--verticale) { height: 200px; }
}

.dk-prodotto__corpo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(240px, 320px); gap: 48px; align-items: start; margin-bottom: 48px; }
.dk-prodotto__descrizione > :first-child { margin-top: 0; }
.dk-prodotto__descrizione p, .dk-documento__testo p, .dk-documento__testo li { line-height: 1.7; }
.dk-funzioni { background: var(--dk-superficie); border-radius: var(--dk-raggio); padding: 24px; border: 1px solid var(--dk-bordo); position: sticky; top: 24px; }
.dk-funzioni h2 { font-size: 1rem; margin: 0 0 12px; text-transform: uppercase; letter-spacing: .06em; }
.dk-funzioni ul, .dk-piano ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.dk-funzioni li, .dk-piano li { display: flex; gap: 10px; align-items: flex-start; line-height: 1.4; }
.dk-funzioni .dk-ico, .dk-piano .dk-ico { color: var(--dk-colore); width: 18px; height: 18px; margin-top: 1px; }
@media (max-width: 800px) {
	.dk-prodotto__corpo { grid-template-columns: 1fr; gap: 24px; }
	.dk-funzioni { position: static; }
	.dk-testa { gap: 18px; align-items: flex-start; flex-direction: column; }
	.dk-testa__icona { width: 96px; height: 96px; border-radius: 24px; }
}

.dk-sezione { margin: 56px 0; scroll-margin-top: 24px; }
.dk-sezione > h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 20px; }
.dk-video iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border-radius: var(--dk-raggio); }

/* Piani */
.dk-piani { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 20px; align-items: stretch; }
.dk-piano { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 28px; border-radius: var(--dk-raggio); border: 1px solid var(--dk-bordo); background: var(--dk-sfondo); }
.dk-piano h3 { margin: 0; font-size: 1.2rem; }
.dk-piano__prezzo { margin: 0; font-size: 2.2rem; font-weight: 800; line-height: 1; }
.dk-piano__prezzo small { font-size: 0.9rem; font-weight: 500; color: var(--dk-tenue); }
.dk-piano__descrizione { margin: 0; color: var(--dk-tenue); }
.dk-piano ul { flex: 1; margin: 8px 0 12px; }
.dk-piano .wp-element-button { text-align: center; }
.dk-piano--evidenza { border: 2px solid var(--dk-colore); box-shadow: 0 20px 40px -26px var(--dk-colore); }
.dk-piano__nastro { position: absolute; top: -12px; left: 24px; background: var(--dk-colore); color: #fff; font-size: 0.72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; padding: 4px 10px; border-radius: 999px; }
.dk-piani__nota { color: var(--dk-tenue); font-size: 0.9rem; margin-top: 16px; }

/* Demo */
.dk-demo__scelte { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; }
.dk-demo__prenota, .dk-demo__modulo { background: var(--dk-superficie); border: 1px solid var(--dk-bordo); border-radius: var(--dk-raggio); padding: 28px; }
.dk-demo h3 { display: flex; gap: 8px; align-items: center; margin-top: 0; }
.dk-demo h3 .dk-ico { color: var(--dk-colore); }

/* Piede della scheda */
.dk-prodotto__piede { display: flex; flex-wrap: wrap; gap: 8px 24px; padding-top: 24px; margin-top: 48px; border-top: 1px solid var(--dk-bordo); font-weight: 700; }
.dk-prodotto__piede a { color: var(--dk-testo); }

/* Documenti (Informativa, Supporto) */
.dk-documento .dk-testa__icona { width: 72px; height: 72px; border-radius: 18px; }
.dk-documento .dk-testa { flex-direction: row; align-items: center; }
.dk-documento__data { color: var(--dk-tenue); }
.dk-documento__testo { max-width: 72ch; }
.dk-documento__testo h2 { font-size: 1.3rem; margin-top: 2em; }
.dk-supporto__email { font-size: 1.3rem; font-weight: 800; display: flex; gap: 10px; align-items: center; }
.dk-supporto__email .dk-ico { color: var(--dk-colore); width: 26px; height: 26px; }

/* Lavori */
.dk-griglia--lavori { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.dk-lavoro-card { display: flex; flex-direction: column; border-radius: var(--dk-raggio); overflow: hidden; border: 1px solid var(--dk-bordo); background: var(--dk-superficie); color: var(--dk-testo); text-decoration: none; transition: transform .18s ease, box-shadow .18s ease; }
.dk-lavoro-card:hover, .dk-lavoro-card:focus-visible { transform: translateY(-3px); box-shadow: 0 14px 32px -18px rgb(0 0 0 / .35); }
.dk-lavoro-card__copertina { aspect-ratio: 16 / 10; background: var(--dk-bordo); display: grid; place-items: center; overflow: hidden; }
.dk-lavoro-card__copertina img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .4s ease; }
.dk-lavoro-card:hover img { transform: scale(1.03); }
.dk-lavoro-card__corpo { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 4px; }
.dk-lavoro-card__meta { font-size: 0.82rem; color: var(--dk-tenue); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.dk-lavoro__dati { display: flex; flex-wrap: wrap; gap: 16px 40px; margin: 24px 0 32px; }
.dk-lavoro__dati dt { font-size: 0.75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--dk-tenue); }
.dk-lavoro__dati dd { margin: 4px 0 0; font-weight: 700; }
.dk-lavoro__copertina { margin: 0 0 32px; border-radius: var(--dk-raggio); overflow: hidden; border: 1px solid var(--dk-bordo); }
.dk-lavoro__copertina img { display: block; width: 100%; height: auto; }

/* Varianti */
.dk-varianti { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.dk-varianti a { display: block; width: 64px; height: 64px; border-radius: 18px; overflow: hidden; background: var(--dk-sfondo); border: 1px solid var(--dk-bordo); transition: transform .2s ease; }
.dk-varianti a:hover { transform: translateY(-4px) rotate(-3deg); }
.dk-varianti img { width: 100%; height: 100%; object-fit: cover; }

/* Modulo */
.dk-modulo { display: grid; gap: 16px; }
.dk-modulo__griglia { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dk-modulo__largo { grid-column: 1 / -1; }
@media (max-width: 600px) { .dk-modulo__griglia { grid-template-columns: 1fr; } }
.dk-modulo label { display: grid; gap: 6px; font-weight: 700; font-size: 0.92rem; }
.dk-modulo input[type="text"], .dk-modulo input[type="email"], .dk-modulo textarea {
	font: inherit; font-weight: 400; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--dk-bordo); background: var(--dk-sfondo); color: var(--dk-testo); width: 100%; box-sizing: border-box;
}
.dk-modulo input:focus, .dk-modulo textarea:focus { outline: 2px solid var(--dk-rosso); outline-offset: 1px; border-color: transparent; }
.dk-modulo__consenso { display: flex !important; grid-template-columns: none; gap: 10px !important; align-items: flex-start; font-weight: 400 !important; }
.dk-modulo__consenso input { margin-top: 4px; accent-color: var(--dk-rosso); }
.dk-modulo button { justify-self: start; cursor: pointer; }
.dk-modulo__trappola { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.dk-modulo__esito { padding: 12px 16px; border-radius: 12px; font-weight: 700; margin: 0; }
.dk-modulo__esito--ok { background: color-mix(in srgb, #1f8a4c 14%, transparent); color: #1b7a43; }
.dk-modulo__esito--errore { background: color-mix(in srgb, var(--dk-rosso) 13%, transparent); color: var(--dk-rosso); }

/* Legale */
.dk-legale { margin: 0; font-size: 0.85rem; }

/* Ingrandimento screenshot */
.dk-zoom { border: 0; padding: 0; background: transparent; max-width: 96vw; max-height: 94vh; }
.dk-zoom::backdrop { background: rgb(10 10 12 / .85); }
.dk-zoom img { max-width: 96vw; max-height: 90vh; display: block; border-radius: 12px; }
.dk-zoom__chiudi { position: fixed; top: 14px; right: 18px; font-size: 2rem; line-height: 1; background: none; border: 0; color: #fff; cursor: pointer; }

@media (prefers-reduced-motion: reduce) {
	.dk-card, .dk-lavoro-card, .dk-lavoro-card img, .dk-varianti a { transition: none; }
}
