/* ==========================================================================
   landing-reclama-scheda.css — Landing /reclama-scheda/
   038b — Scope: .nia-rec (BEM prefix, zero collisione con il resto)
   Tutti i colori/typo/spacing da nia-base.css (--nia-*). Niente re-dichiarazioni.
   Mobile-first, breakpoint unico 768px.
   ========================================================================== */

/* === ASTRA OVERRIDE: full-width landing layout =============================
   Stesso pattern di homepage.css (.home #content .ast-container) e
   test-archive.css (.post-type-archive-test ...). Neutralizza la colonna
   boxed di Astra così i background delle sezioni (hero teal, sand, CTA teal)
   arrivano bordo-bordo. Scoping su .nia-page-reclama-scheda (aggiunta via
   body_class filter in landing-reclama-scheda.php) — zero leak su altre URL.
   ========================================================================== */
.nia-page-reclama-scheda #content .ast-container {
	display: block;
	max-width: 100%;
	padding: 0;
	margin: 0;
}

.nia-page-reclama-scheda #content .ast-container > #primary,
.nia-page-reclama-scheda #primary.content-area {
	max-width: 100%;
	width: 100%;
	padding: 0;
	margin: 0;
}

/* ---------- Base / Reset ---------- */
.nia-rec {
	font-family: var(--nia-font-body);
	font-size: 16px;
	line-height: 1.65;
	color: var(--nia-text-primary);
	-webkit-font-smoothing: antialiased;
	background: var(--nia-bg);
}

.nia-rec *,
.nia-rec *::before,
.nia-rec *::after {
	box-sizing: border-box;
}

.nia-rec a {
	color: var(--nia-accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.nia-rec a:hover,
.nia-rec a:focus-visible {
	color: var(--nia-accent-dark);
}

/* ---------- Container ---------- */
.nia-rec-container {
	max-width: var(--nia-max-w);
	margin-inline: auto;
	padding-inline: var(--nia-sp-4);
}

.nia-rec-container--narrow {
	max-width: 760px;
}

/* ---------- Sezione base (ritmo verticale) ---------- */
.nia-rec-section {
	padding-block: var(--nia-sp-12);
}

@media (min-width: 768px) {
	.nia-rec-section {
		padding-block: var(--nia-sp-16);
	}
}

/* Alternanza colori (10 sezioni post-040d):
   S1 hero teal -> S2 manifesto sand-light -> S3 modello bianco ->
   S4 benefici sand -> S5 prezzo bianco -> S6 prova sand ->
   S7 config bianco -> S8 come-funziona sand-light -> S9 faq sand ->
   S10 cta teal-deeper.
   Sand-light (#faf5ee) è una variante warm leggermente più chiara di
   --nia-bg (#f5f0eb), riservata a S2/S8 per dare ritmo editoriale al
   testo lungo (manifesto) e alla procedura (come funziona). */
.nia-rec-section--hero          { background: var(--nia-teal); color: #fff; }
.nia-rec-section--manifesto     { background: #faf5ee; }
.nia-rec-section--modello       { background: var(--nia-card-bg); }
.nia-rec-section--benefici      { background: var(--nia-bg); }
.nia-rec-section--prezzo        { background: var(--nia-card-bg); }
.nia-rec-section--prova-sociale { background: var(--nia-bg); }
.nia-rec-section--config        { background: var(--nia-card-bg); }
.nia-rec-section--come-funziona { background: #faf5ee; }
.nia-rec-section--faq           { background: var(--nia-bg); }
.nia-rec-section--cta           { background: var(--nia-teal-deeper); color: #fff; }

/* ---------- Tipografia ---------- */
.nia-rec-h2 {
	font-family: var(--nia-font-heading);
	font-size: clamp(1.6rem, 3.2vw, 2.2rem);
	line-height: 1.2;
	font-weight: 700;
	margin: 0 0 var(--nia-sp-4);
	color: var(--nia-text-primary);
}

.nia-rec-h2--on-dark {
	color: #fff;
}

.nia-rec-lead {
	font-size: 1.05rem;
	max-width: 68ch;
	margin: 0 0 var(--nia-sp-8);
	color: var(--nia-text-secondary);
}

.nia-rec-section--hero .nia-rec-lead,
.nia-rec-section--cta  .nia-rec-lead {
	color: rgba(255, 255, 255, 0.9);
}

.nia-rec-eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: 0.78rem;
	font-weight: 600;
	margin: 0 0 var(--nia-sp-4);
	color: rgba(255, 255, 255, 0.82);
}

/* ---------- S1 Hero ---------- */
.nia-rec-hero__title {
	font-family: var(--nia-font-heading);
	font-size: clamp(1.9rem, 5.2vw, 3rem);
	line-height: 1.15;
	font-weight: 700;
	margin: 0 0 var(--nia-sp-5);
	color: #fff;
	max-width: 22ch;
}

.nia-rec-hero__sub {
	font-size: 1.05rem;
	line-height: 1.6;
	max-width: 58ch;
	margin: 0 0 var(--nia-sp-5);
	color: rgba(255, 255, 255, 0.92);
}

/* 040c — riga prezzo prima del city checker. */
.nia-rec-hero__price {
	font-size: 1.1rem;
	line-height: 1.55;
	max-width: 58ch;
	margin: 0 0 var(--nia-sp-7);
	padding: var(--nia-sp-3) 0;
	color: #fff;
	border-top: 1px solid rgba(255, 255, 255, 0.18);
	border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

.nia-rec-hero__price strong {
	color: var(--nia-cta);
	font-weight: 700;
}

.nia-rec-hero__scroll {
	margin: var(--nia-sp-6) 0 0;
}

.nia-rec-link-secondary {
	display: inline-block;
	color: #fff;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, 0.5);
	text-underline-offset: 4px;
	font-weight: 500;
	min-height: 44px;
	line-height: 44px;
}

.nia-rec-section--config .nia-rec-link-secondary {
	color: var(--nia-accent);
	text-decoration-color: var(--nia-accent-light);
}

.nia-rec-link-secondary:hover,
.nia-rec-link-secondary:focus-visible {
	text-decoration-color: currentColor;
}

/* ---------- City checker ---------- */
.nia-rec-checker {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: var(--nia-radius);
	padding: var(--nia-sp-5);
	margin-block: var(--nia-sp-6);
	max-width: 560px;
	backdrop-filter: blur(4px);
}

.nia-rec-checker__label {
	display: block;
	font-weight: 600;
	font-size: 1rem;
	margin-bottom: var(--nia-sp-3);
	color: #fff;
}

.nia-rec-checker__form {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-2);
}

@media (min-width: 560px) {
	.nia-rec-checker__form {
		flex-direction: row;
	}
}

.nia-rec-checker__input {
	flex: 1 1 auto;
	min-height: 48px;
	padding: 0 var(--nia-sp-4);
	font-family: inherit;
	font-size: 1rem;
	color: var(--nia-text-primary);
	background: #fff;
	border: 1px solid rgba(255, 255, 255, 0.35);
	border-radius: var(--nia-radius-sm);
	outline: none;
}

.nia-rec-checker__input::placeholder {
	color: var(--nia-text-muted);
}

.nia-rec-checker__input:focus-visible {
	border-color: var(--nia-cta);
	box-shadow: 0 0 0 3px rgba(240, 211, 81, 0.35);
}

.nia-rec-checker__submit {
	min-height: 48px;
	padding: 0 var(--nia-sp-6);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 600;
	color: var(--nia-cta-text);
	background: var(--nia-cta);
	border: 1px solid var(--nia-cta);
	border-radius: var(--nia-radius-sm);
	cursor: pointer;
	transition: background var(--nia-transition), border-color var(--nia-transition);
}

.nia-rec-checker__submit:hover,
.nia-rec-checker__submit:focus-visible {
	background: var(--nia-cta-hover);
	border-color: var(--nia-cta-hover);
}

.nia-rec-checker__help {
	margin: var(--nia-sp-3) 0 0;
	font-size: 0.82rem;
	color: rgba(255, 255, 255, 0.7);
}

.nia-rec-checker__help kbd {
	font-family: inherit;
	background: rgba(255, 255, 255, 0.18);
	padding: 1px 6px;
	border-radius: 4px;
	font-size: 0.78rem;
}

.nia-rec-checker__result {
	margin-top: var(--nia-sp-4);
	padding: var(--nia-sp-3) var(--nia-sp-4);
	border-radius: var(--nia-radius-sm);
	background: rgba(255, 255, 255, 0.95);
	color: var(--nia-text-primary);
	font-size: 0.95rem;
}

/* ---------- Trust bar ---------- */
.nia-rec-trustbar {
	list-style: none;
	margin: var(--nia-sp-8) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nia-sp-4);
}

@media (min-width: 560px) {
	.nia-rec-trustbar {
		grid-template-columns: repeat(3, 1fr);
	}
}

.nia-rec-trustbar__item {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: var(--nia-sp-2);
	padding-left: var(--nia-sp-4);
	border-left: 2px solid var(--nia-cta);
}

/* 040c — trustbar restyling: check + statement flat (no più kpi/label). */
.nia-rec-trustbar__check {
	flex: 0 0 auto;
	color: var(--nia-cta);
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.45;
}

.nia-rec-trustbar__text {
	font-size: 0.95rem;
	line-height: 1.45;
	color: rgba(255, 255, 255, 0.92);
}

/* ---------- S2 Modello — compare cards ---------- */
.nia-rec-compare {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nia-sp-5);
	margin-top: var(--nia-sp-6);
}

@media (min-width: 768px) {
	.nia-rec-compare {
		grid-template-columns: 1fr 1fr;
		gap: var(--nia-sp-8);
	}
}

.nia-rec-compare__card {
	background: var(--nia-bg);
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius);
	padding: var(--nia-sp-6);
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-4);
}

.nia-rec-compare__card--new {
	background: var(--nia-accent-xlight);
	border-color: var(--nia-accent-light);
}

.nia-rec-compare__head {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-2);
}

.nia-rec-compare__badge {
	display: inline-block;
	align-self: flex-start;
	font-size: 0.72rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 4px 10px;
	border-radius: 999px;
}

.nia-rec-compare__badge--old {
	color: var(--nia-text-secondary);
	background: var(--nia-border);
}

.nia-rec-compare__badge--new {
	color: #fff;
	background: var(--nia-accent);
}

.nia-rec-compare__title {
	font-family: var(--nia-font-heading);
	font-size: 1.15rem;
	margin: 0;
	color: var(--nia-text-primary);
}

.nia-rec-compare__caption {
	margin: 0;
	font-size: 0.9rem;
	color: var(--nia-text-secondary);
	font-style: italic;
}

/* 040c — riga riferimento prezzi competitor sotto il confronto. */
.nia-rec-compare__price-ref {
	margin: var(--nia-sp-6) auto 0;
	max-width: 720px;
	padding-top: var(--nia-sp-4);
	font-size: 0.98rem;
	line-height: 1.55;
	text-align: center;
	color: var(--nia-text-secondary);
	border-top: 1px solid var(--nia-border);
}

.nia-rec-compare__more {
	margin: 0;
	font-size: 0.85rem;
	color: var(--nia-text-muted);
	text-align: center;
}

/* Mock list (directory tradizionale) */
.nia-rec-mock-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.nia-rec-mock-list__row {
	display: flex;
	gap: var(--nia-sp-3);
	align-items: center;
	padding: 10px;
	background: var(--nia-card-bg);
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius-sm);
}

.nia-rec-mock-list__row--highlight {
	opacity: 0.45;
	filter: grayscale(0.3);
}

.nia-rec-mock-list__avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--nia-border);
	flex: 0 0 auto;
}

.nia-rec-mock-list__lines {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.nia-rec-mock-list__line {
	display: block;
	height: 6px;
	border-radius: 3px;
	background: var(--nia-border);
	width: 90%;
}

.nia-rec-mock-list__line--thick {
	height: 8px;
	background: var(--nia-border-light);
	width: 65%;
	background: #c9c3bd;
}

.nia-rec-mock-list__line--short {
	width: 40%;
}

/* Mock profile (NIA) */
.nia-rec-mock-profile {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-4);
	align-items: center;
	text-align: center;
	padding: var(--nia-sp-4);
	background: var(--nia-card-bg);
	border: 1px solid var(--nia-accent-light);
	border-radius: var(--nia-radius-sm);
}

.nia-rec-mock-profile__avatar {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--nia-accent) 0%, var(--nia-accent-dark) 100%);
}

.nia-rec-mock-profile__bio {
	display: flex;
	flex-direction: column;
	gap: 6px;
	width: 100%;
	align-items: center;
}

.nia-rec-mock-profile__bio .nia-rec-mock-list__line {
	width: 85%;
}

.nia-rec-mock-profile__form {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding-top: var(--nia-sp-3);
	border-top: 1px dashed var(--nia-border);
}

.nia-rec-mock-profile__field {
	display: block;
	height: 28px;
	border-radius: var(--nia-radius-sm);
	background: var(--nia-bg);
	border: 1px solid var(--nia-border);
}

.nia-rec-mock-profile__cta {
	display: block;
	height: 32px;
	border-radius: var(--nia-radius-sm);
	background: var(--nia-cta);
}

/* ---------- S4 Benefici (040c: 4 card 4×1 desktop / 2×2 tablet / 1×N mobile) ---------- */
.nia-rec-benefits {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nia-sp-5);
	margin-top: var(--nia-sp-4);
}

@media (min-width: 768px) {
	.nia-rec-benefits {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--nia-sp-5);
	}
}

@media (min-width: 980px) {
	.nia-rec-benefits {
		grid-template-columns: repeat(4, 1fr);
		gap: var(--nia-sp-5);
	}
}

.nia-rec-benefit {
	background: var(--nia-card-bg);
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius);
	padding: var(--nia-sp-6);
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-3);
	transition: border-color var(--nia-transition), box-shadow var(--nia-transition);
}

.nia-rec-benefit:hover {
	border-color: var(--nia-accent-light);
	box-shadow: var(--nia-shadow-md);
}

.nia-rec-benefit__icon {
	width: 44px;
	height: 44px;
	border-radius: var(--nia-radius-sm);
	background: var(--nia-accent-xlight);
	color: var(--nia-accent);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.nia-rec-benefit__icon svg {
	width: 24px;
	height: 24px;
}

.nia-rec-benefit__title {
	font-family: var(--nia-font-heading);
	font-size: 1.2rem;
	margin: 0;
	color: var(--nia-text-primary);
}

.nia-rec-benefit__body {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.55;
	color: var(--nia-text-secondary);
}

/* ---------- S5 Configuratore (shell 038d) ---------- */
.nia-rec-configurator {
	margin-top: var(--nia-sp-6);
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius);
	padding: var(--nia-sp-6) var(--nia-sp-5);
	background: var(--nia-card-bg);
	min-height: 200px;
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-4);
}

.nia-rec-configurator[data-nia-empty="true"] {
	border-style: dashed;
	background: var(--nia-bg);
}

/* Placeholder legacy 038b — non più renderizzato dal JS 038d ma lasciato
   come fallback no-JS. */
.nia-rec-configurator__placeholder {
	text-align: center;
	max-width: 440px;
	margin-inline: auto;
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-3);
}

.nia-rec-configurator__placeholder-title {
	font-family: var(--nia-font-heading);
	font-size: 1.15rem;
	margin: 0;
	color: var(--nia-text-primary);
}

.nia-rec-configurator__placeholder-body {
	margin: 0;
	font-size: 0.95rem;
	color: var(--nia-text-secondary);
}

.nia-rec-configurator__placeholder-cta {
	margin: var(--nia-sp-2) 0 0;
}

/* Header */
.nia-rec-configurator__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--nia-sp-3);
	border-bottom: 1px solid var(--nia-border-light);
	padding-bottom: var(--nia-sp-3);
}

.nia-rec-configurator__title {
	font-family: var(--nia-font-heading);
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0;
	color: var(--nia-text-primary);
}

.nia-rec-configurator__clear {
	background: transparent;
	border: none;
	color: var(--nia-text-muted);
	font-size: 0.88rem;
	font-weight: 500;
	cursor: pointer;
	padding: 6px 10px;
	border-radius: var(--nia-radius-sm);
	min-height: 32px;
	transition: color var(--nia-transition), background var(--nia-transition);
}
.nia-rec-configurator__clear:hover,
.nia-rec-configurator__clear:focus-visible {
	color: var(--nia-accent-dark);
	background: var(--nia-accent-xlight);
}

/* Autocomplete add */
.nia-rec-configurator__add {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-2);
}

.nia-rec-configurator__add-label {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--nia-text-secondary);
	letter-spacing: 0.02em;
}

.nia-rec-configurator__search {
	position: relative;
}

.nia-rec-configurator__search-input {
	width: 100%;
	min-height: 44px;
	padding: 10px 14px;
	font: inherit;
	font-size: 1rem;
	color: var(--nia-text-primary);
	background: #fff;
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius-sm);
	box-shadow: none;
	transition: border-color var(--nia-transition), box-shadow var(--nia-transition);
}
.nia-rec-configurator__search-input:focus-visible {
	outline: none;
	border-color: var(--nia-accent);
	box-shadow: 0 0 0 3px var(--nia-accent-xlight);
}
.nia-rec-configurator__search-input::placeholder {
	color: var(--nia-text-muted);
}

.nia-rec-configurator__add-help {
	margin: 0;
	font-size: 0.82rem;
	color: var(--nia-text-muted);
}

/* Dropdown suggerimenti */
.nia-rec-configurator__suggest {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	list-style: none;
	margin: 0;
	padding: 4px;
	background: #fff;
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius-sm);
	box-shadow: var(--nia-shadow-md);
	max-height: 280px;
	overflow-y: auto;
	z-index: 20;
}

.nia-rec-configurator__suggest-item {
	display: flex;
	align-items: center;
	gap: var(--nia-sp-3);
	padding: 10px 12px;
	min-height: 44px;
	border-radius: var(--nia-radius-sm);
	cursor: pointer;
	color: var(--nia-text-primary);
	font-size: 0.96rem;
	transition: background var(--nia-transition);
}
.nia-rec-configurator__suggest-item.is-active,
.nia-rec-configurator__suggest-item:hover {
	background: var(--nia-accent-xlight);
}
.nia-rec-configurator__suggest-item.is-disabled {
	cursor: not-allowed;
	opacity: 0.6;
}
.nia-rec-configurator__suggest-city {
	flex: 1;
	font-weight: 500;
}
.nia-rec-configurator__suggest-price {
	font-size: 0.88rem;
	color: var(--nia-accent-dark);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.nia-rec-configurator__suggest-badge {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--nia-text-muted);
	background: var(--nia-bg);
	padding: 2px 8px;
	border-radius: 999px;
}
.nia-rec-configurator__suggest-empty {
	padding: 12px;
	font-size: 0.9rem;
	color: var(--nia-text-muted);
	text-align: center;
	cursor: default;
}

/* Empty state (nessuna città selezionata) */
.nia-rec-configurator__empty {
	text-align: center;
	padding: var(--nia-sp-5) var(--nia-sp-3);
	color: var(--nia-text-secondary);
}
.nia-rec-configurator__empty p {
	margin: 0 0 var(--nia-sp-2);
}
.nia-rec-configurator__empty-hint {
	font-size: 0.9rem;
	color: var(--nia-text-muted);
}

/* Items list */
.nia-rec-configurator__items {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.nia-rec-configurator__item {
	display: grid;
	grid-template-columns: 1fr auto auto;
	align-items: center;
	gap: var(--nia-sp-3);
	padding: 10px 12px;
	background: #fff;
	border: 1px solid var(--nia-border-light);
	border-radius: var(--nia-radius-sm);
	transition: background var(--nia-transition), box-shadow var(--nia-transition);
}

.nia-rec-configurator__item.is-pulse {
	background: var(--nia-accent-xlight);
	box-shadow: 0 0 0 2px var(--nia-accent-light);
}

.nia-rec-configurator__item-city {
	font-weight: 500;
	color: var(--nia-text-primary);
}

.nia-rec-configurator__item-price {
	font-size: 0.95rem;
	color: var(--nia-accent-dark);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.nia-rec-configurator__item-remove {
	background: transparent;
	border: 1px solid transparent;
	color: var(--nia-text-muted);
	font-size: 1.35rem;
	line-height: 1;
	width: 44px;
	height: 44px;
	border-radius: 999px;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: color var(--nia-transition), background var(--nia-transition), border-color var(--nia-transition);
}
.nia-rec-configurator__item-remove:hover,
.nia-rec-configurator__item-remove:focus-visible {
	color: #b71c1c;
	background: #fdecea;
	border-color: #f5c0bb;
	outline: none;
}

/* Footer: total + CTA + warning */
.nia-rec-configurator__footer {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-3);
	padding-top: var(--nia-sp-3);
	border-top: 1px solid var(--nia-border-light);
}

.nia-rec-configurator__total {
	font-size: 1.02rem;
	color: var(--nia-text-secondary);
}
.nia-rec-configurator__total-count {
	font-weight: 600;
	color: var(--nia-text-primary);
}
.nia-rec-configurator__total-amount {
	font-weight: 700;
	color: var(--nia-accent-dark);
	font-variant-numeric: tabular-nums;
}

.nia-rec-configurator__cta {
	min-height: 52px;
	width: 100%;
	font-size: 1rem;
	font-weight: 600;
}
.nia-rec-configurator__cta[disabled],
.nia-rec-configurator__cta[aria-disabled="true"] {
	opacity: 0.5;
	cursor: not-allowed;
}

.nia-rec-configurator__warning {
	margin: 0;
	font-size: 0.88rem;
	color: var(--nia-text-muted);
	text-align: center;
}

/* Notice (toast inline, success/error) */
.nia-rec-configurator__notice {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-2);
	align-items: flex-start;
	padding: 12px 14px;
	border-radius: var(--nia-radius-sm);
	font-size: 0.92rem;
	background: var(--nia-bg);
	border: 1px solid var(--nia-border-light);
	color: var(--nia-text-secondary);
}
.nia-rec-configurator__notice--error {
	background: #fdecea;
	border-color: #f5c0bb;
	color: #8a1f1a;
}
.nia-rec-configurator__notice--success {
	background: var(--nia-accent-xlight);
	border-color: var(--nia-accent-light);
	color: var(--nia-accent-dark);
}
.nia-rec-configurator__notice-msg {
	margin: 0;
}

@media (min-width: 768px) {
	.nia-rec-configurator {
		padding: var(--nia-sp-8) var(--nia-sp-6);
	}
	.nia-rec-configurator__footer {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		justify-content: space-between;
	}
	.nia-rec-configurator__total {
		order: 1;
	}
	.nia-rec-configurator__cta {
		order: 2;
		width: auto;
		min-width: 280px;
	}
	.nia-rec-configurator__warning {
		order: 3;
		flex-basis: 100%;
		text-align: right;
	}
}

/* ---------- S6 FAQ ---------- */
.nia-rec-faq {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-3);
	margin-top: var(--nia-sp-4);
}

.nia-rec-faq__item {
	background: var(--nia-card-bg);
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius-sm);
	transition: border-color var(--nia-transition), box-shadow var(--nia-transition);
}

.nia-rec-faq__item[open] {
	border-color: var(--nia-accent-light);
	box-shadow: var(--nia-shadow-sm);
}

.nia-rec-faq__q {
	list-style: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--nia-sp-3);
	padding: var(--nia-sp-4) var(--nia-sp-5);
	min-height: 56px;
	font-family: var(--nia-font-body);
	font-size: 1rem;
	font-weight: 600;
	color: var(--nia-text-primary);
}

.nia-rec-faq__q::-webkit-details-marker {
	display: none;
}

.nia-rec-faq__q-text {
	flex: 1 1 auto;
}

.nia-rec-faq__chevron {
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	border-right: 2px solid var(--nia-accent);
	border-bottom: 2px solid var(--nia-accent);
	transform: rotate(45deg);
	transition: transform var(--nia-transition);
	margin-top: -4px;
}

.nia-rec-faq__item[open] .nia-rec-faq__chevron {
	transform: rotate(-135deg);
	margin-top: 4px;
}

.nia-rec-faq__a {
	padding: 0 var(--nia-sp-5) var(--nia-sp-5);
}

.nia-rec-faq__a p {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.6;
	color: var(--nia-text-secondary);
}

/* ---------- S7 CTA finale ---------- */
.nia-rec-cta-final {
	text-align: center;
}

.nia-rec-cta-final__body {
	font-size: 1.05rem;
	margin: 0 0 var(--nia-sp-6);
	color: rgba(255, 255, 255, 0.92);
	max-width: 58ch;
	margin-inline: auto;
}

.nia-rec-cta-final__actions {
	margin: 0;
}

.nia-rec-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 var(--nia-sp-8);
	font-family: inherit;
	font-size: 1rem;
	font-weight: 600;
	border-radius: var(--nia-radius-sm);
	text-decoration: none;
	cursor: pointer;
	transition: background var(--nia-transition), color var(--nia-transition), transform var(--nia-transition);
}

.nia-rec-btn--primary {
	background: var(--nia-cta);
	color: var(--nia-cta-text);
	border: 1px solid var(--nia-cta);
}

.nia-rec-btn--primary:hover,
.nia-rec-btn--primary:focus-visible {
	background: var(--nia-cta-hover);
	border-color: var(--nia-cta-hover);
	color: var(--nia-cta-text);
	transform: translateY(-1px);
}

/* 040c — variante CTA finale più prominente (bottone unico S10). */
.nia-rec-btn--xl {
	min-height: 56px;
	padding: 0 var(--nia-sp-9, var(--nia-sp-8));
	font-size: 1.1rem;
	letter-spacing: 0.01em;
}

/* ============================================================
 * S2 Manifesto (040d)
 * ------------------------------------------------------------
 * Container narrow per leggibilità testo lungo, padding-block
 * più generoso del default (respiro editoriale), line-height
 * aumentato. Avatar-slot pre-progettato 80x80 con display:none
 * finché non c'è asset (l'inserimento futuro di una <img> non
 * richiede riprogettazione del layout firma).
 * ============================================================ */
.nia-rec-section--manifesto {
	padding-block: 4rem;
}

@media (min-width: 768px) {
	.nia-rec-section--manifesto {
		padding-block: 5rem;
	}
}

.nia-rec-manifesto__p {
	max-width: 720px;
	margin: 0 0 var(--nia-sp-5);
	font-size: 1.05rem;
	line-height: 1.7;
	color: var(--nia-text-primary);
}

.nia-rec-manifesto__sign {
	display: flex;
	align-items: center;
	gap: var(--nia-sp-4);
	margin-top: var(--nia-sp-8);
	padding-top: var(--nia-sp-5);
	border-top: 1px solid var(--nia-border);
	max-width: 720px;
}

/* 040d — slot avatar pre-progettato. display:none finché vuoto;
   quando Antonio fornirà l'immagine, sostituire il <div> con
   <img class="nia-rec-manifesto__avatar"> e rimuovere display:none
   (le altre dimensioni restano valide per il futuro <img>). */
.nia-rec-manifesto__avatar-slot,
.nia-rec-manifesto__avatar {
	flex: 0 0 auto;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: var(--nia-accent-xlight);
	border: 2px solid var(--nia-accent-light);
	object-fit: cover;
}

.nia-rec-manifesto__avatar-slot:empty {
	display: none;
}

.nia-rec-manifesto__signature {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.55;
	color: var(--nia-text-secondary);
	font-style: italic;
}

/* ============================================================
 * S5 Prezzo trasparente (040d)
 * ------------------------------------------------------------
 * Tabella semantica desktop con header teal + righe dense.
 * Mobile (<=768px): table/thead/tr/th/td collassano in cards
 * (display:block sul tbody). thead nascosto in cards mode
 * perché ogni th[scope=row] è già auto-descrittivo.
 * ============================================================ */
.nia-rec-prezzo__table-wrap {
	margin-top: var(--nia-sp-6);
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.nia-rec-prezzo__tabella {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius);
	overflow: hidden;
	font-size: 1rem;
}

.nia-rec-prezzo__tabella thead {
	background: var(--nia-teal);
	color: #fff;
}

.nia-rec-prezzo__tabella thead th {
	padding: var(--nia-sp-4) var(--nia-sp-5);
	text-align: left;
	font-family: var(--nia-font-body);
	font-weight: 600;
	font-size: 0.95rem;
	letter-spacing: 0.02em;
	color: #fff;
}

.nia-rec-prezzo__tabella .nia-rec-prezzo__th-amount {
	text-align: right;
}

.nia-rec-prezzo__tabella tbody tr {
	border-top: 1px solid var(--nia-border-light);
}

.nia-rec-prezzo__tabella tbody tr:nth-child(even) {
	background: var(--nia-bg);
}

.nia-rec-prezzo__tabella tbody th[scope="row"],
.nia-rec-prezzo__tabella tbody td {
	padding: var(--nia-sp-4) var(--nia-sp-5);
	font-weight: 500;
	color: var(--nia-text-primary);
	vertical-align: middle;
	text-align: left;
}

.nia-rec-prezzo__tabella tbody th[scope="row"] {
	font-family: var(--nia-font-body);
	font-weight: 500;
}

.nia-rec-prezzo__tabella tbody .nia-rec-prezzo__amount {
	text-align: right;
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--nia-accent-dark);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

/* Mobile: collasso in cards. Ogni <tr> diventa card. */
@media (max-width: 767px) {
	.nia-rec-prezzo__tabella {
		border: 0;
		background: transparent;
		border-radius: 0;
	}

	.nia-rec-prezzo__tabella thead {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.nia-rec-prezzo__tabella tbody tr {
		display: block;
		background: #fff;
		border: 1px solid var(--nia-border);
		border-radius: var(--nia-radius);
		padding: var(--nia-sp-4) var(--nia-sp-5);
		margin-bottom: var(--nia-sp-3);
	}

	.nia-rec-prezzo__tabella tbody tr:nth-child(even) {
		background: #fff;
	}

	.nia-rec-prezzo__tabella tbody th[scope="row"],
	.nia-rec-prezzo__tabella tbody td {
		display: block;
		padding: 0;
		text-align: left;
	}

	.nia-rec-prezzo__tabella tbody th[scope="row"] {
		font-size: 0.92rem;
		color: var(--nia-text-secondary);
		margin-bottom: 4px;
	}

	.nia-rec-prezzo__tabella tbody .nia-rec-prezzo__amount {
		text-align: left;
		font-size: 1.6rem;
		line-height: 1.2;
	}
}

.nia-rec-prezzo__note {
	margin: var(--nia-sp-4) 0 0;
	font-size: 0.88rem;
	color: var(--nia-text-muted);
}

.nia-rec-prezzo__note a {
	color: var(--nia-accent-dark);
	text-decoration: underline;
}

.nia-rec-prezzo__footer {
	margin: var(--nia-sp-8) 0 0;
	padding: var(--nia-sp-5);
	font-size: 0.98rem;
	line-height: 1.6;
	color: var(--nia-text-secondary);
	background: var(--nia-accent-xlight);
	border-left: 3px solid var(--nia-accent);
	border-radius: 0 var(--nia-radius-sm) var(--nia-radius-sm) 0;
}

.nia-rec-prezzo__footer strong {
	color: var(--nia-text-primary);
}

/* ============================================================
 * S6 Prova sociale (040d)
 * ------------------------------------------------------------
 * Layout 1-col mobile / 2-col desktop (testo + KPI cards).
 * KPI cards: stack mobile, riga su desktop. Numeri grandi
 * teal, label muted.
 * ============================================================ */
.nia-rec-prova-sociale__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nia-sp-8);
	margin-top: var(--nia-sp-4);
}

@media (min-width: 980px) {
	.nia-rec-prova-sociale__layout {
		grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
		gap: var(--nia-sp-10);
		align-items: center;
	}
}

.nia-rec-prova-sociale__copy p {
	margin: 0 0 var(--nia-sp-4);
	font-size: 1.02rem;
	line-height: 1.65;
	color: var(--nia-text-primary);
	max-width: 60ch;
}

.nia-rec-prova-sociale__copy p:last-child {
	margin-bottom: 0;
}

.nia-rec-prova-sociale__kpis {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nia-sp-3);
}

@media (min-width: 560px) {
	.nia-rec-prova-sociale__kpis {
		grid-template-columns: repeat(3, 1fr);
		gap: var(--nia-sp-3);
	}
}

@media (min-width: 980px) {
	.nia-rec-prova-sociale__kpis {
		grid-template-columns: 1fr;
		gap: var(--nia-sp-3);
	}
}

.nia-rec-prova-sociale__kpi {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: var(--nia-sp-4) var(--nia-sp-5);
	background: #fff;
	border: 1px solid var(--nia-border);
	border-left: 3px solid var(--nia-accent);
	border-radius: var(--nia-radius-sm);
	text-align: left;
}

.nia-rec-prova-sociale__kpi-num {
	font-family: var(--nia-font-heading);
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.1;
	color: var(--nia-accent-dark);
	font-variant-numeric: tabular-nums;
}

.nia-rec-prova-sociale__kpi-label {
	font-size: 0.85rem;
	color: var(--nia-text-secondary);
	letter-spacing: 0.02em;
}

/* ============================================================
 * S8 Come funziona (040d)
 * ------------------------------------------------------------
 * <ol> reset numerazione nativa (usiamo numero decorativo
 * a parte, aria-hidden — la <ol> garantisce comunque ordine
 * semantico per screen reader). Cerchio teal a sinistra, body
 * sulla destra. Mobile vertical, desktop ≥980px 2x2 grid.
 * ============================================================ */
.nia-rec-step-list {
	list-style: none;
	margin: var(--nia-sp-4) 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--nia-sp-5);
	counter-reset: nia-rec-step;
}

@media (min-width: 980px) {
	.nia-rec-step-list {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--nia-sp-6);
	}
}

.nia-rec-step {
	display: flex;
	align-items: flex-start;
	gap: var(--nia-sp-4);
	padding: var(--nia-sp-5);
	background: #fff;
	border: 1px solid var(--nia-border);
	border-radius: var(--nia-radius);
}

.nia-rec-step__num {
	flex: 0 0 auto;
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--nia-font-heading);
	font-size: 1.4rem;
	font-weight: 700;
	color: #fff;
	background: var(--nia-teal);
	border-radius: 50%;
	line-height: 1;
}

.nia-rec-step__body {
	flex: 1 1 auto;
	min-width: 0;
}

.nia-rec-step__title {
	font-family: var(--nia-font-heading);
	font-size: 1.15rem;
	font-weight: 700;
	margin: 0 0 var(--nia-sp-2);
	color: var(--nia-text-primary);
	line-height: 1.3;
}

.nia-rec-step__text {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.55;
	color: var(--nia-text-secondary);
}

/* ============================================================
 * 038c — City checker: stati risultato (libera / reclamata / not-found)
 * Popolato dal JS in landing-reclama-scheda.js tramite innerHTML.
 * ============================================================ */
.nia-rec-checker__result[data-state] {
	display: flex;
	flex-direction: column;
	gap: var(--nia-sp-3);
}

.nia-rec-checker__result[data-state="loading"] {
	color: var(--nia-text-secondary, #555);
	font-style: italic;
}

.nia-rec-checker__msg {
	margin: 0;
	line-height: 1.45;
}

.nia-rec-checker__msg--ok { color: var(--nia-accent-dark); }
.nia-rec-checker__msg--info { color: var(--nia-text-primary); }
.nia-rec-checker__msg--muted { color: var(--nia-text-secondary, #666); }
.nia-rec-checker__msg--error { color: #b00020; }

.nia-rec-checker__msg a {
	color: var(--nia-accent-dark);
	text-decoration: underline;
}

.nia-rec-checker__price {
	display: inline-block;
	margin-left: var(--nia-sp-2);
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--nia-accent-xlight);
	color: var(--nia-accent-dark);
	font-size: 0.85rem;
	font-weight: 600;
	white-space: nowrap;
}

.nia-rec-checker__actions {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--nia-sp-2);
}

.nia-rec-checker__chips {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: var(--nia-sp-2);
}

.nia-rec-chip {
	display: inline-flex;
	align-items: center;
	gap: var(--nia-sp-2);
	min-height: 44px;
	padding: 0 var(--nia-sp-4);
	font: inherit;
	font-weight: 600;
	color: var(--nia-accent-dark);
	background: #fff;
	border: 1px solid var(--nia-accent-light);
	border-radius: 999px;
	cursor: pointer;
	transition: background var(--nia-transition), border-color var(--nia-transition), transform var(--nia-transition);
}

.nia-rec-chip:hover,
.nia-rec-chip:focus-visible {
	background: var(--nia-accent-xlight);
	border-color: var(--nia-accent);
	transform: translateY(-1px);
}

.nia-rec-chip__price {
	font-weight: 500;
	font-size: 0.82rem;
	color: var(--nia-text-secondary, #555);
}