/*
Theme Name: TechPulseMind
Theme URI: https://techpulsemind.com
Description: Child theme di GeneratePress per TechPulseMind. Impostazione moderna e
             minimal: monocromatica con un solo accento, nessuna ombra, separatori
             sottili, molto spazio bianco e dark mode automatica.
Author: TechPulseMind
Template: generatepress
Version: 1.1.0
Text Domain: techpulsemind
*/

/* ---------------------------------------------------------------------------
   Tokens
   Una scala monocromatica più un unico accento. Tutto il resto del foglio usa
   solo queste variabili, così la dark mode è una sola ridefinizione.
   --------------------------------------------------------------------------- */
:root {
	--ink: #0d0f12;
	--ink-2: #3d454f;
	--ink-3: #6b7480;
	--paper: #ffffff;
	--paper-2: #f7f8f9;
	--rule: #e7e9ec;
	--accent: #1266f1;

	--measure: 68ch;
	--gap: clamp(1.5rem, 4vw, 3rem);
}

@media (prefers-color-scheme: dark) {
	:root {
		--ink: #f2f4f7;
		--ink-2: #c2c9d2;
		--ink-3: #8a939e;
		--paper: #0e1013;
		--paper-2: #16191d;
		--rule: #24282e;
		--accent: #5c9dff;
	}
}

/* ---------------------------------------------------------------------------
   Base
   --------------------------------------------------------------------------- */
body {
	background-color: var(--paper);
	color: var(--ink-2);
	font-family: ui-sans-serif, -apple-system, "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
	font-size: 1.0625rem;
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4,
.entry-title,
.site-title {
	color: var(--ink);
	font-weight: 600;
	letter-spacing: -0.022em;
	line-height: 1.2;
}

a {
	color: var(--ink);
	text-decoration: none;
	border-bottom: 1px solid var(--rule);
	transition: border-color .15s ease, color .15s ease;
}

a:hover,
a:focus {
	color: var(--accent);
	border-bottom-color: var(--accent);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
}

/* ---------------------------------------------------------------------------
   Header — nessun bordo pesante, solo una hairline
   --------------------------------------------------------------------------- */
.site-header {
	background-color: var(--paper);
	border-bottom: 1px solid var(--rule);
	padding-block: .5rem;
}

.site-title a,
.main-navigation a {
	border-bottom: 0;
}

.site-title a {
	font-size: 1.15rem;
	font-weight: 650;
	letter-spacing: -0.03em;
}

.site-description {
	color: var(--ink-3);
	font-size: .9rem;
}

.main-navigation,
.main-navigation ul ul {
	background-color: var(--paper);
}

.main-navigation a {
	color: var(--ink-2);
	font-size: .95rem;
	font-weight: 500;
}

.main-navigation .current-menu-item > a,
.main-navigation a:hover {
	color: var(--accent);
}

/* ---------------------------------------------------------------------------
   Article
   Misura di riga corta e spaziatura ampia: gli articoli sono da 1200-2500
   parole, e la leggibilità conta più della densità.
   --------------------------------------------------------------------------- */
.entry-content {
	max-width: var(--measure);
}

.entry-content > * + * {
	margin-top: 1.5em;
}

.entry-content h2 {
	font-size: clamp(1.5rem, 3vw, 1.9rem);
	margin-top: 2.6em;
}

.entry-content h3 {
	font-size: 1.25rem;
	margin-top: 2em;
}

.entry-content p,
.entry-content li {
	color: var(--ink-2);
}

.entry-content strong {
	color: var(--ink);
	font-weight: 600;
}

.entry-content ul,
.entry-content ol {
	padding-left: 1.25em;
}

.entry-content li::marker {
	color: var(--ink-3);
}

.entry-content li + li {
	margin-top: .45em;
}

.entry-content blockquote {
	margin-inline: 0;
	padding-left: 1.25em;
	border-left: 2px solid var(--ink);
	color: var(--ink);
	font-style: normal;
}

.entry-content img {
	border-radius: 4px;
}

/* ---------------------------------------------------------------------------
   Comparison tables — solo righe orizzontali, nessuna griglia
   --------------------------------------------------------------------------- */
.entry-content table {
	display: block;
	width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
	font-size: .95rem;
}

.entry-content table th,
.entry-content table td {
	padding: .75em 1em .75em 0;
	border-bottom: 1px solid var(--rule);
	text-align: left;
	vertical-align: top;
}

.entry-content table th {
	color: var(--ink);
	font-weight: 600;
	font-size: .8rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	white-space: nowrap;
	border-bottom-color: var(--ink);
}

/* ---------------------------------------------------------------------------
   Archive — elenco con separatori, niente card né ombre
   --------------------------------------------------------------------------- */
.blog .inside-article,
.archive .inside-article,
.search .inside-article {
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--rule);
	box-shadow: none;
	padding: var(--gap) 0;
}

.blog .entry-title,
.archive .entry-title {
	font-size: clamp(1.3rem, 3vw, 1.6rem);
}

.entry-meta {
	color: var(--ink-3);
	font-size: .85rem;
	letter-spacing: .01em;
}

.entry-meta a {
	color: var(--ink-3);
	border-bottom: 0;
}

.entry-meta a:hover {
	color: var(--accent);
}

.entry-summary p {
	color: var(--ink-2);
}

/* Il tag "read more" non merita l'aspetto di un bottone. */
.read-more,
.more-link {
	font-size: .9rem;
	font-weight: 500;
	color: var(--accent);
	border-bottom: 0;
}

/* ---------------------------------------------------------------------------
   Related reading + avviso affiliazione: contenitori piatti, non riquadri
   --------------------------------------------------------------------------- */
.tpm-related {
	padding: 1.25em 0 0;
	border-top: 1px solid var(--rule);
}

.tpm-related ul {
	padding-left: 1.1em;
}

.tpm-notice {
	margin-top: 3em;
	padding-top: 1.1em;
	border-top: 1px solid var(--rule);
	color: var(--ink-3);
	font-size: .88rem;
}

.tpm-notice p {
	margin: 0;
}

/* ---------------------------------------------------------------------------
   Footer
   --------------------------------------------------------------------------- */
.site-footer,
.footer-widgets {
	background-color: var(--paper);
	border-top: 1px solid var(--rule);
	color: var(--ink-3);
	font-size: .9rem;
}

.site-footer a,
.footer-widgets a {
	color: var(--ink-3);
	border-bottom: 0;
}

.site-footer a:hover,
.footer-widgets a:hover {
	color: var(--accent);
}

.footer-widgets .widget-title {
	color: var(--ink);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.footer-widgets ul {
	list-style: none;
	padding-left: 0;
}

.footer-widgets li {
	padding: .3em 0;
}

/* ---------------------------------------------------------------------------
   Forms & buttons — squadrati, senza gradienti
   --------------------------------------------------------------------------- */
button,
.button,
input[type="submit"] {
	background-color: var(--ink);
	color: var(--paper);
	border: 0;
	border-radius: 4px;
	font-weight: 550;
	letter-spacing: .01em;
}

button:hover,
.button:hover,
input[type="submit"]:hover {
	background-color: var(--accent);
	color: #fff;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
textarea {
	background-color: var(--paper);
	color: var(--ink);
	border: 1px solid var(--rule);
	border-radius: 4px;
}

input::placeholder,
textarea::placeholder {
	color: var(--ink-3);
}

/* ---------------------------------------------------------------------------
   Pagination
   --------------------------------------------------------------------------- */
.paging-navigation .page-numbers {
	border-bottom: 0;
	color: var(--ink-3);
	padding: .3em .7em;
}

.paging-navigation .page-numbers.current {
	color: var(--ink);
	font-weight: 600;
}

/* ---------------------------------------------------------------------------
   Mobile
   --------------------------------------------------------------------------- */
@media (max-width: 768px) {
	body {
		font-size: 1rem;
	}

	.entry-content h2 {
		margin-top: 2.1em;
	}
}

/* Rispetta chi ha chiesto meno animazioni a livello di sistema. */
@media (prefers-reduced-motion: reduce) {
	* {
		transition: none !important;
	}
}