/*
 * Cuori Pelosi — stili che theme.json non copre.
 * Riferimento visivo: blog Shopify zampecuori.it/blogs/cuori-pelosi (Dawn, layout collage).
 */

:root {
	--cp-radius-sm: 8px;
	--cp-radius: 12px;
	--cp-radius-lg: 18px;
	--cp-ease: 240ms cubic-bezier(.2, .7, .2, 1);
	--cp-shadow: 0 10px 30px -18px color-mix(in srgb, var(--wp--preset--color--contrast) 35%, transparent);
}

/* Occhiello: categoria / etichetta sopra i titoli */
.cp-eyebrow {
	font-size: var(--wp--preset--font-size--micro);
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	margin: 0;
}

em, i { font-style: italic; }
h1 em, h2 em, h3 em { color: var(--wp--preset--color--accent); }

/* ---------- Header ---------- */
.cp-topbar p { margin: 0; letter-spacing: .04em; }
.cp-topbar em { font-family: var(--wp--preset--font-family--display); }
.cp-topbar a { text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--on-accent) 50%, transparent); }

.cp-header { position: sticky; top: 0; z-index: 20; }
/* Sfondo sfocato su uno strato a parte: se il blur stesse sull'header, il menu mobile (fixed) resterebbe chiuso dentro l'header. */
.cp-header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--wp--preset--color--base) 94%, transparent); backdrop-filter: blur(8px); }
.admin-bar .cp-header { top: 32px; }
.cp-brand { align-items: center; }
.cp-brand__mark img { display: block; width: 54px; height: auto; }
.cp-brand__text .wp-block-site-title { line-height: 1; }
.cp-brand__by { margin: 2px 0 0 !important; letter-spacing: .12em; text-transform: uppercase; }

.cp-nav a { text-decoration: none; color: var(--wp--preset--color--contrast); padding: 4px 0; border-bottom: 1px solid transparent; transition: border-color var(--cp-ease), color var(--cp-ease); }
.cp-nav a:hover,
.cp-nav .current-menu-item > a { border-bottom-color: var(--wp--preset--color--contrast); }
.cp-nav .wp-block-navigation-item:last-child a { color: var(--wp--preset--color--highlight); }

.cp-search .wp-block-search__button { background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast); border-radius: 999px; padding: 9px; border: 0; }
.cp-search .wp-block-search__input { border-radius: 999px; border-color: var(--wp--preset--color--line); }
.cp-header__shop .wp-block-button__link { padding: 9px 18px; }
/* Ricerca aperta: il campo scende in una fascia sotto l'header invece di schiacciare logo e menu. */
.cp-header .cp-search:not(.wp-block-search__searchfield-hidden) .wp-block-search__input {
	position: absolute; left: 0; right: 0; top: 100%; z-index: 30;
	width: auto !important; margin: 0; padding: 16px max(20px, calc((100% - 1200px) / 2)) !important;
	border: 0; border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); border-radius: 0;
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast);
	font-size: 17px; box-shadow: 0 12px 24px -16px rgba(31, 67, 80, .35); outline: none;
}
.cp-header .cp-search:not(.wp-block-search__searchfield-hidden) .wp-block-search__button { background: var(--wp--preset--color--contrast); color: var(--wp--preset--color--base); }

@media (max-width: 781px) {
	.cp-brand__mark img { width: 42px; }
	.cp-brand__text .wp-block-site-title { font-size: 22px !important; }
}

/* Header su telefono: tutto su una riga, il bottone diventa una pillola "Shop". */
@media (max-width: 600px) {
	.cp-header > .wp-block-group { gap: 10px; }
	.cp-header > .wp-block-group > .wp-block-group:last-child { gap: 6px; }
	.cp-brand { gap: 8px !important; min-width: 0; }
	.cp-brand__mark img { width: 36px; }
	.cp-brand__text { min-width: 0; }
	.cp-brand__text .wp-block-site-title { font-size: 20px !important; white-space: nowrap; }
	.cp-brand__by { font-size: 9px !important; letter-spacing: .08em; white-space: nowrap; }
	.cp-header__shop .wp-block-button__link { font-size: 0 !important; padding: 8px 14px; white-space: nowrap; line-height: 1; }
	.cp-header__shop .wp-block-button__link::after { content: "Shop"; font-size: 13px; font-weight: 600; letter-spacing: .02em; }
}
/* Menu mobile aperto: voci grandi, allineate a sinistra, facili da toccare. */
.cp-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 20px 24px 32px; }
.cp-nav .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 64px; align-items: flex-start; }
.cp-nav .is-menu-open .wp-block-navigation__container { width: 100%; align-items: stretch; gap: 0 !important; }
.cp-nav .is-menu-open .wp-block-navigation-item { width: 100%; border-bottom: 1px solid var(--wp--preset--color--line); }
.cp-nav .is-menu-open .wp-block-navigation-item a { display: block; width: 100%; padding: 16px 0 !important; border: 0; font-family: var(--wp--preset--font-family--display); font-size: 26px; line-height: 1.2; }
.cp-nav .is-menu-open a:focus:not(:focus-visible) { outline: none; }
.cp-nav .is-menu-open .wp-block-navigation__responsive-container-close { top: 20px; right: 20px; }

@media (max-width: 350px) {
	.cp-brand__mark { display: none; }
	.cp-brand__text .wp-block-site-title { font-size: 19px !important; }
	.cp-search .wp-block-search__button { padding: 7px; }
}

/* ---------- Griglia articoli (home, categorie, mesi, ricerca) ---------- */
/* Card tutte uguali, due per riga. */
.cp-collage .wp-block-post-template.is-layout-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--wp--preset--spacing--50);
	row-gap: var(--wp--preset--spacing--60);
}

/* Solo in cima alla home (pagina 1): l'ultimo articolo in evidenza,
   immagine a sinistra e testo a destra. */
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child {
	grid-column: 1 / -1;
	padding-bottom: var(--wp--preset--spacing--60);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card {
	display: grid;
	grid-template-columns: 7fr 5fr;
	column-gap: var(--wp--preset--spacing--50);
	align-content: center;
	align-items: center;
}
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card > * { grid-column: 2; margin: 0; }
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__media { grid-column: 1; grid-row: 1 / span 5; margin: 0; }
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__media img { aspect-ratio: 4 / 3 !important; }
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__title { font-size: var(--wp--preset--font-size--xxx-large) !important; line-height: 1.1; }
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__excerpt { font-size: var(--wp--preset--font-size--medium); }
body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__terms::before { content: "Ultimo articolo · "; color: var(--wp--preset--color--muted); }

@media (max-width: 781px) {
	.cp-collage .wp-block-post-template.is-layout-grid { grid-template-columns: 1fr; row-gap: var(--wp--preset--spacing--50); }
	body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card { display: flex; align-items: flex-start; }
	body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__media img { aspect-ratio: 3 / 2 !important; }
	body.home:not(.paged) .cp-collage .wp-block-post-template > li:first-child .cp-card__title { font-size: var(--wp--preset--font-size--xx-large) !important; }
}

/* ---------- Card ---------- */
.cp-card { gap: 10px; }
.cp-card__media { overflow: hidden; border-radius: var(--cp-radius); width: 100%; margin: 0 0 10px; }
.cp-card__media img { width: 100%; display: block; border-radius: var(--cp-radius); transition: transform 600ms cubic-bezier(.2, .7, .2, 1); }
.cp-card:hover .cp-card__media img { transform: scale(1.03); }
.cp-card__title { margin: 0; line-height: 1.25; }
.cp-card__title a { text-decoration: none; color: inherit; background-image: linear-gradient(currentColor, currentColor); background-size: 0 1px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size var(--cp-ease); }
.cp-card:hover .cp-card__title a { background-size: 100% 1px; }
.cp-card__date, .cp-card__excerpt { margin: 0; }
.cp-card__excerpt p { margin: 0; }
.cp-card__terms { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.cp-card__terms a { color: var(--wp--preset--color--highlight); text-decoration: none; }

/* Paginazione */
.cp-pagination a, .cp-pagination .page-numbers { text-decoration: none; color: var(--wp--preset--color--contrast); padding: 6px 12px; border-radius: 999px; }
.cp-pagination .page-numbers.current { background: var(--wp--preset--color--surface); }

/* ---------- Articolo ---------- */
.cp-article__meta p, .cp-article__meta .wp-block-post-date { margin: 0; }
.cp-article__meta a { text-decoration: none; color: var(--wp--preset--color--contrast); font-weight: 500; }
.cp-article__hero img { border-radius: var(--cp-radius-lg); }

.cp-article__content { font-size: 17px; }
.cp-article__content > * + h2 { margin-top: 2.4em; }
.cp-article__content > * + h3 { margin-top: 1.8em; }
.cp-article__content h2 { font-size: clamp(26px, 2.8vw, 32px); }
.cp-article__content h3 { font-size: 22px; }
.cp-article__content ul, .cp-article__content ol { padding-left: 1.2em; }
.cp-article__content li + li { margin-top: .4em; }
.cp-article__content li::marker { color: var(--wp--preset--color--highlight); }
.cp-article__content img { border-radius: var(--cp-radius); }
.cp-article__content .wp-block-image figcaption { text-align: center; }
.cp-article__content a:not(.wp-element-button) { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.cp-article__content > p:first-child { font-size: 19px; line-height: 1.65; color: var(--wp--preset--color--muted); }

/* FAQ con il blocco Dettagli */
.cp-article__content .wp-block-details summary { font-family: var(--wp--preset--font-family--display); font-size: 19px; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.cp-article__content .wp-block-details summary::-webkit-details-marker { display: none; }
.cp-article__content .wp-block-details summary::after { content: "+"; color: var(--wp--preset--color--accent); font-family: var(--wp--preset--font-family--body); }
.cp-article__content .wp-block-details[open] summary::after { content: "−"; }

/* Box verso lo shop */
.cp-cta { margin-top: var(--wp--preset--spacing--50); margin-bottom: var(--wp--preset--spacing--50); }
.cp-cta > * { margin-top: 0; }
.cp-cta h3 { margin-top: 0; }

/* Box autore */
.cp-author .wp-block-post-author { align-items: flex-start; gap: 18px; }
.cp-author .wp-block-post-author__avatar img { border-radius: 999px; }
.cp-author .wp-block-post-author__name { font-family: var(--wp--preset--font-family--display); font-size: 22px; margin: 0 0 4px; }
.cp-author .wp-block-post-author__name a { color: inherit; text-decoration: none; }
.cp-author .wp-block-post-author__bio { color: var(--wp--preset--color--muted); font-size: 15px; margin: 0; }

/* Correlati */
.cp-related__grid { list-style: none; padding: 0; margin: var(--wp--preset--spacing--40) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--40); }
.cp-related__grid .cp-card { display: flex; flex-direction: column; }
.cp-related__grid .cp-card__media img { aspect-ratio: 3 / 2; width: 100%; height: auto; object-fit: cover; }
.cp-related__grid .cp-card__title { font-size: 20px; }
@media (max-width: 781px) { .cp-related__grid { grid-template-columns: 1fr; } }

.cp-back a { text-decoration: none; }

/* ---------- Footer ---------- */
.cp-footer__brand { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; font-family: var(--wp--preset--font-family--display); font-size: 26px; }
.cp-footer__brand img { width: 54px; height: auto; }
.cp-footer__heading { font-family: var(--wp--preset--font-family--body); font-size: 12px !important; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--on-accent-muted) !important; opacity: .8; }
.cp-footer__list { list-style: none; padding: 0; font-size: 14px; }
.cp-footer__list li + li { margin-top: 8px; }
.cp-footer a { text-decoration: none; }
.cp-footer a:hover { text-decoration: underline; }

/* Accessibilità */
:where(a, button, summary):focus-visible { outline: 2px solid var(--wp--preset--color--link); outline-offset: 3px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) {
	.cp-card__media img, .cp-card__title a { transition: none; }
	.cp-card:hover .cp-card__media img { transform: none; }
}

/* Sottotitolo (estratto) sotto il titolo dell'articolo */
.cp-article__dek { max-width: 640px; margin-inline: auto !important; }
.cp-article__dek p { margin: 0; }

/* ---------- Archivio ---------- */
.cp-rubriche { list-style: none; padding: 0; margin: var(--wp--preset--spacing--30) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--40); }
.cp-rubrica { display: flex; margin: 0; }
.cp-rubrica a { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: var(--wp--preset--spacing--40); background: var(--wp--preset--color--surface); border: 1px solid var(--wp--preset--color--line); border-radius: var(--cp-radius-lg); color: var(--wp--preset--color--contrast); text-decoration: none; transition: border-color var(--cp-ease), transform var(--cp-ease); }
.cp-rubrica a:hover { border-color: var(--wp--preset--color--subtle); transform: translateY(-2px); }
.cp-rubrica__name { font-family: var(--wp--preset--font-family--display); font-size: 26px; line-height: 1.2; }
.cp-rubrica__desc { font-size: 14px; color: var(--wp--preset--color--muted); flex: 1; }
.cp-rubrica__count { font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--highlight); }
.cp-rubrica--per-sempre a { background: transparent; border-color: var(--wp--preset--color--subtle); }

.cp-mesi { display: grid; gap: var(--wp--preset--spacing--40); margin-top: var(--wp--preset--spacing--30); }
.cp-mesi__list li { margin: 0; }
.cp-mesi__anno { display: grid; grid-template-columns: 120px 1fr; gap: var(--wp--preset--spacing--40); align-items: start; padding-top: var(--wp--preset--spacing--30); border-top: 1px solid var(--wp--preset--color--line); }
.cp-mesi__year { margin: 0; font-size: var(--wp--preset--font-size--xx-large); color: var(--wp--preset--color--accent); }
.cp-mesi__list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
.cp-mesi__list a { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border: 1px solid var(--wp--preset--color--line); border-radius: 999px; color: var(--wp--preset--color--contrast); text-decoration: none; transition: background var(--cp-ease); }
.cp-mesi__list a:hover { background: var(--wp--preset--color--surface); }
.cp-mesi__n { font-size: 12px; font-weight: 600; min-width: 26px; height: 26px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--muted); }

@media (max-width: 781px) {
	.cp-rubriche { grid-template-columns: 1fr; }
	.cp-mesi__anno { grid-template-columns: 1fr; }
}

/* Link "Sfoglia l'archivio" sotto le griglie */
.cp-browse a { text-decoration: none; font-weight: 600; font-size: 14px; letter-spacing: .04em; }

/* ---------- Home e archivi: griglia + colonna archivio ---------- */
.cp-with-aside {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 220px;
	gap: var(--wp--preset--spacing--60);
	align-items: start;
}
.cp-with-aside > * { margin-block-start: 0 !important; }
.cp-with-aside__aside { position: sticky; top: 120px; }
.admin-bar .cp-with-aside__aside { top: 152px; }

/* La colonna stringe la griglia: l'articolo in evidenza passa a 1:1 tra immagine e testo */
body.home:not(.paged) .cp-with-aside .cp-collage .wp-block-post-template > li:first-child .cp-card { grid-template-columns: 1fr 1fr; }
body.home:not(.paged) .cp-with-aside .cp-collage .wp-block-post-template > li:first-child .cp-card__title { font-size: clamp(30px, 3.2vw, 42px) !important; }

.cp-mesi-home { display: flex; flex-direction: column; gap: 18px; padding-left: var(--wp--preset--spacing--40); border-left: 1px solid var(--wp--preset--color--line); }
.cp-mesi-home__title { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--wp--preset--color--highlight); }
.cp-mesi-home__anno { display: flex; flex-direction: column; gap: 8px; }
.cp-mesi-home__year { font-family: var(--wp--preset--font-family--display); font-size: 26px; line-height: 1; color: var(--wp--preset--color--accent); }
.cp-mesi-home ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.cp-mesi-home li { margin: 0; }
.cp-mesi-home li a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 7px 0; font-size: 14px; color: var(--wp--preset--color--contrast); text-decoration: none; border-bottom: 1px solid var(--wp--preset--color--line); }
.cp-mesi-home li a:hover, .cp-mesi-home li a[aria-current] { color: var(--wp--preset--color--highlight); }
.cp-mesi-home__y { display: none; }
.cp-mesi-home__n { font-size: 12px; font-weight: 600; color: var(--wp--preset--color--muted); }
.cp-mesi-home__all { font-size: 13px; font-weight: 600; text-decoration: none; color: var(--wp--preset--color--link); }

/* Tablet e mobile: la colonna sale sopra la griglia e diventa una fila di chip scorrevole */
@media (max-width: 1024px) {
	.cp-with-aside { grid-template-columns: minmax(0, 1fr); gap: var(--wp--preset--spacing--40); }
	.cp-with-aside__aside { order: -1; position: static; margin-inline: calc(-1 * clamp(16px, 4vw, 48px)); }
	.cp-mesi-home {
		flex-direction: row; align-items: center; gap: 8px;
		overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
		padding: 4px clamp(16px, 4vw, 48px); border-left: 0;
	}
	.cp-mesi-home::-webkit-scrollbar { display: none; }
	.cp-mesi-home__title { display: none; }
	.cp-mesi-home__anno { flex-direction: row; flex: none; }
	.cp-mesi-home__year { display: none; }
	.cp-mesi-home__y { display: inline; }
	.cp-mesi-home ul { flex-direction: row; gap: 8px; }
	.cp-mesi-home li a { white-space: nowrap; gap: 8px; padding: 8px 14px; border: 1px solid var(--wp--preset--color--line); border-radius: 999px; background: var(--wp--preset--color--surface); }
	.cp-mesi-home li a[aria-current] { border-color: var(--wp--preset--color--highlight); }
	.cp-mesi-home__all { flex: none; white-space: nowrap; padding: 8px 4px; }
	body.home:not(.paged) .cp-with-aside .cp-collage .wp-block-post-template > li:first-child .cp-card { grid-template-columns: 7fr 5fr; }
}

/* Articolo: testo a 720px + colonna archivio, centrati sotto l'immagine */
.cp-with-aside--article { grid-template-columns: minmax(0, 720px) 220px; justify-content: center; }
.cp-with-aside--article .cp-with-aside__aside { top: 120px; }
@media (max-width: 1024px) {
	.cp-with-aside--article { grid-template-columns: minmax(0, 720px); }
	/* Su mobile l'archivio va in fondo all'articolo, non tra titolo e testo */
	.cp-with-aside--article .cp-with-aside__aside { order: 0; }
	.cp-with-aside--article .cp-mesi-home__title { display: block; flex: none; margin-right: 4px; }
}
