/* Portale Esercenti — front-end theme.
   MoviePress visual language, kept on a light palette.
   The client's identifying colour drives --pet-accent (set inline in functions.php). */

:root {
	--pet-accent: #1f6feb;
	--pet-on-accent: #ffffff;

	--pet-bg: #f7f9fc;
	--pet-panel: #ffffff;
	--pet-surface: #eef2f8;
	--pet-surface-2: #e2e8f1;
	--pet-ink: #313846;
	--pet-ink-soft: #616774; /* AA (≥4.5:1) on --pet-bg / --pet-panel / --pet-surface */
	--pet-border: #dde3ec;

	--pet-radius: 6px;
	--pet-maxw: 1160px;
	--pet-font: "Helvetica Neue", Helvetica, Arial, sans-serif;

	--pet-accent-tint: color-mix(in srgb, var(--pet-accent) 9%, #fff);
	--pet-accent-tint-2: color-mix(in srgb, var(--pet-accent) 16%, #fff);
	--pet-accent-dark: color-mix(in srgb, var(--pet-accent) 82%, #000);
	/* accent tone that stays readable as text on a light background */
	--pet-accent-text: color-mix(in srgb, var(--pet-accent) 72%, var(--pet-ink));
}

* { box-sizing: border-box; }

body {
	margin: 0;
	font-family: var(--pet-font);
	font-size: 16px;
	color: var(--pet-ink);
	background: var(--pet-bg);
	line-height: 1.65;
	letter-spacing: .005em;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	/* Keep the sticky header's collapse from nudging scrollY (which fought
	   in-page anchor scrolling and could flicker the header at the top). */
	overflow-anchor: none;
}

h1, h2, h3 { font-weight: 700; line-height: 1.14; letter-spacing: -.018em; }

a { color: var(--pet-accent-text); text-underline-offset: 2px; }

img { max-width: 100%; height: auto; }

.pet-container {
	max-width: var(--pet-maxw);
	margin: 0 auto;
	padding: 0 24px;
}

.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px; height: 1px;
	overflow: hidden;
}
.pet-skip-link { position: absolute; left: -9999px; }
.pet-skip-link:focus {
	left: 8px; top: 8px;
	background: var(--pet-panel); color: var(--pet-accent-text);
	padding: 10px 16px; border-radius: 8px;
	box-shadow: 0 4px 20px rgba(20, 22, 28, .22);
	z-index: 200;
}

/* Visible keyboard focus indicator on every interactive element. Mouse clicks
   (which don't match :focus-visible) stay clean. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--pet-accent);
	outline-offset: 2px;
	border-radius: 3px;
}
/* Where the surface behind the outline is the accent colour or the dark hero
   image, an accent outline would vanish — switch to the contrast colour. */
.pet-site-header a:focus-visible,
.pet-site-header button:focus-visible,
.pet-hero--image .pet-hero__inner a:focus-visible {
	outline-color: var(--pet-on-accent, #fff);
}

/* Shared "kicker" — uppercase micro-label */
.pet-eyebrow,
.pet-film__meta dt,
.pet-download-group__title,
.pet-brand__sub,
.pet-menu a {
	text-transform: uppercase;
	letter-spacing: .16em;
}

/* ---------- Buttons ---------- */
.pet-btn {
	display: inline-block;
	background: var(--pet-accent);
	color: var(--pet-on-accent);
	padding: 13px 24px;
	border: 1px solid var(--pet-accent);
	border-radius: var(--pet-radius);
	text-decoration: none;
	text-align: center;
	font-weight: 700;
	font-size: .95rem;
	letter-spacing: .01em;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.pet-btn:hover { background: var(--pet-accent-dark); border-color: var(--pet-accent-dark); }
.pet-btn--sm { padding: 8px 15px; font-size: .82rem; }
.pet-btn--cta { background: #0076df; border-color: #0076df; color: #fff; }
.pet-btn--cta:hover { background: #0063bd; border-color: #0063bd; }
/* "Accedi" on the default light hero: accent outline */
.pet-btn--hero-ghost {
	background: transparent;
	border-color: var(--pet-accent);
	color: var(--pet-accent-text);
}
.pet-btn--hero-ghost:hover { background: var(--pet-accent-tint); border-color: var(--pet-accent); }
/* on the image hero: translucent glass */
.pet-hero--image .pet-btn--hero-ghost {
	background: rgba(255, 255, 255, .16);
	border-color: rgba(255, 255, 255, .5);
	color: #fff;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.pet-hero--image .pet-btn--hero-ghost:hover { background: rgba(255, 255, 255, .26); border-color: #fff; }
.pet-btn--ghost {
	background: transparent;
	color: var(--pet-accent-text);
}
.pet-btn--ghost:hover { background: var(--pet-accent-tint); border-color: var(--pet-accent); }
.pet-btn--on-accent {
	background: var(--pet-on-accent);
	color: var(--pet-accent);
	border-color: var(--pet-on-accent);
}
.pet-btn--on-accent:hover { background: color-mix(in srgb, var(--pet-on-accent) 88%, #000); border-color: transparent; }
.pet-btn--on-accent-outline {
	background: color-mix(in srgb, var(--pet-on-accent) 12%, transparent);
	color: var(--pet-on-accent);
	border-color: color-mix(in srgb, var(--pet-on-accent) 42%, transparent);
}
.pet-btn--on-accent-outline:hover {
	background: color-mix(in srgb, var(--pet-on-accent) 22%, transparent);
	border-color: var(--pet-on-accent);
}

/* Inline icons */
.pet-icon { flex: none; display: inline-block; vertical-align: -.18em; }
.pet-btn .pet-icon { margin-right: -1px; }
.pet-btn--icon { display: inline-flex; align-items: center; gap: 8px; }
/* Icon-only square button (label kept for the mobile dropdown + screen readers) */
.pet-btn--square {
	align-self: stretch;
	width: auto;
	min-width: 0;
	padding-left: 11px;
	padding-right: 11px;
	gap: 0;
	justify-content: center;
}
.pet-btn--square > span {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ---------- Header ---------- */
.pet-site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--pet-accent);
	color: var(--pet-on-accent);
	transition: background .25s ease, box-shadow .25s ease;
}
.pet-site-header__inner {
	display: flex;
	align-items: center;
	gap: 20px 32px;
	/* Fluid vertical rhythm: the header shrinks smoothly as the window narrows,
	   no single hard breakpoint. */
	padding-top: clamp(14px, 2.6vw, 30px);
	padding-bottom: clamp(14px, 2.6vw, 30px);
	flex-wrap: wrap;
	transition: padding .25s ease;
}
.pet-site-header .pet-brand__logo img,
.pet-site-header .pet-brand__name,
.pet-site-header .pet-brand__sub {
	transition: max-width .25s ease, max-height .25s ease, font-size .25s ease, opacity .2s ease, margin .25s ease;
}

/* Scrolled state: shrink + frosted glass over the content */
.pet-site-header.is-scrolled {
	background: color-mix(in srgb, var(--pet-accent) 78%, transparent);
	-webkit-backdrop-filter: blur(16px) saturate(150%);
	backdrop-filter: blur(16px) saturate(150%);
	box-shadow: 0 4px 24px rgba(20, 22, 28, .16);
}
.pet-site-header.is-scrolled .pet-site-header__inner {
	padding-top: clamp(12px, 1.8vw, 18px);
	padding-bottom: clamp(12px, 1.8vw, 18px);
}
.pet-site-header.is-scrolled .pet-brand__logo img { max-height: clamp(32px, 3.4vw, 40px); max-width: clamp(140px, 20vw, 200px); }
.pet-site-header.is-scrolled .pet-brand__name { font-size: clamp(1.02rem, 1.5vw, 1.12rem); }
.pet-site-header.is-scrolled .pet-brand__sub {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	margin-top: 0;
}
.pet-brand {
	display: flex;
	align-items: center;
	gap: clamp(10px, 1.6vw, 16px);
	text-decoration: none;
	color: inherit;
	margin-right: auto;
}
.pet-brand__logo img {
	display: block;
	/* Scales with the viewport so the header height is fluid, not stepped. */
	max-height: clamp(36px, 5.3vw, 76px);
	max-width: 200px; /* keeps wide/horizontal logos in check */
	width: auto;
	height: auto;
	object-fit: contain;
}
.pet-brand__text { display: flex; flex-direction: column; line-height: 1.2; }
.pet-brand__name {
	font-weight: 700;
	font-size: clamp(1.1rem, 1.6vw, 1.32rem);
	letter-spacing: -.01em;
}
.pet-brand__sub {
	font-size: .64rem;
	font-weight: 600;
	opacity: .85;
	margin-top: 3px;
}

.pet-menu {
	list-style: none;
	display: flex;
	gap: 26px;
	margin: 0; padding: 0;
}
.pet-menu a {
	display: block;
	text-decoration: none;
	color: inherit;
	font-weight: 700;
	font-size: .72rem;
	letter-spacing: .06em;
	opacity: .9;
}
.pet-menu a:hover { opacity: 1; }

/* Mobile menu toggle (hamburger) — shown only ≤930px, when a primary menu exists */
.pet-nav-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid color-mix(in srgb, var(--pet-on-accent) 45%, transparent);
	border-radius: 10px;
	background: color-mix(in srgb, var(--pet-on-accent) 12%, transparent);
	color: var(--pet-on-accent);
	cursor: pointer;
}
.pet-nav-toggle__close { display: none; }
.pet-nav-toggle[aria-expanded="true"] .pet-nav-toggle__open { display: none; }
.pet-nav-toggle[aria-expanded="true"] .pet-nav-toggle__close { display: inline-flex; }

/* Below this width the site name drops, but the "Portale esercenti" line stays
   beside the logo — small and wrapped onto two lines. */
@media (max-width: 1020px) {
	.pet-brand__name { display: none; }
	.pet-brand__sub {
		margin-top: 0;
		max-width: 7em;
		line-height: 1.2;
	}
}

@media (max-width: 930px) {
	.pet-nav-toggle { display: inline-flex; }
	.pet-site-header__inner:has(.pet-nav-toggle) { flex-wrap: nowrap; }
	.pet-site-header__inner:has(.pet-nav-toggle) .pet-brand { min-width: 0; }
	.pet-site-header .pet-nav {
		position: absolute;
		left: 0;
		right: 0;
		top: 100%;
		display: none;
		padding: 8px 0;
		background: var(--pet-panel);
		color: var(--pet-ink);
		box-shadow: 0 18px 40px rgba(20, 22, 28, .18);
		border-top: 1px solid var(--pet-border);
	}
	.pet-site-header .pet-nav.is-open { display: block; }
	.pet-site-header .pet-menu {
		flex-direction: column;
		gap: 0;
	}
	.pet-site-header .pet-menu a {
		padding: 13px 24px;
		font-size: .95rem;
		font-weight: 600;
		letter-spacing: normal;
		text-transform: none;
		opacity: 1;
	}
	.pet-site-header .pet-menu li + li a { border-top: 1px solid var(--pet-border); }
	.pet-site-header .pet-menu a:hover,
	.pet-site-header .pet-menu .current-menu-item > a { background: var(--pet-surface); color: var(--pet-accent-text); }

	/* Account buttons are moved into the dropdown (see main.js) — render them
	   as plain rows like the menu links, not as accent pills. */
	.pet-site-header .pet-nav .pet-account-link {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		margin: 0;
		border-top: 1px solid var(--pet-border);
	}
	.pet-site-header .pet-nav .pet-account-link .pet-btn {
		justify-content: flex-start;
		gap: 10px;
		padding: 13px 24px;
		border: 0;
		border-radius: 0;
		background: transparent;
		color: var(--pet-ink);
		font-size: .95rem;
		font-weight: 600;
	}
	.pet-site-header .pet-nav .pet-account-link .pet-btn + .pet-btn { border-top: 1px solid var(--pet-border); }
	.pet-site-header .pet-nav .pet-account-link .pet-btn:hover { background: var(--pet-surface); color: var(--pet-accent-text); }
	/* The icon-only square button becomes a normal full-width row here. */
	.pet-site-header .pet-nav .pet-account-link .pet-btn--square {
		width: auto;
		min-width: 0;
		padding: 13px 24px;
		gap: 10px;
		justify-content: flex-start;
	}
	/* Inside the dropdown the labels must show, even below 460px where the header
	   version is icon-only. */
	.pet-site-header .pet-nav .pet-account-link .pet-btn span {
		position: static;
		width: auto;
		height: auto;
		overflow: visible;
		clip: auto;
	}
}

.pet-account-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: none;
}
.pet-account-link .pet-btn {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	white-space: nowrap;
}

/* ---------- Main ---------- */
.pet-main { padding: 0 0 96px; }

/* ---------- Hero ---------- */
/* Default (no image): sits flush on the page background, dark text. The copy is
   in a .pet-container so it always lines up with the catalog below. */
.pet-hero {
	position: relative;
	color: var(--pet-ink);
	padding: clamp(40px, 5.5vw, 68px) 0 clamp(20px, 3vw, 32px);
}
.pet-hero__inner { position: relative; z-index: 1; }
.pet-hero__eyebrow {
	margin: 0 0 14px;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--pet-accent-text);
}
.pet-hero__title {
	font-size: clamp(1.8rem, 3.6vw, 2.7rem);
	line-height: 1.12;
	letter-spacing: -.02em;
	margin: 0 0 16px;
	color: var(--pet-ink);
}
.pet-hero__desc {
	font-size: clamp(.94rem, 1.35vw, 1.08rem);
	line-height: 1.3;
	color: var(--pet-ink-soft);
	max-width: 70ch;
	margin: 0 0 28px;
}
.pet-hero__cta { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; }
.pet-hero__or { color: var(--pet-ink-soft); font-size: .95rem; }

/* With a background image: a full-bleed band flush against the header and both
   window edges (no rounded corners), but the copy stays in the 1160 central
   column (aligned with the search bar and catalog). Dark overlay is set inline
   on .pet-hero__bg. */
.pet-hero--image {
	color: #fff;
	margin-top: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: clamp(420px, 42vw, 560px);
	padding: clamp(48px, 7vw, 100px) 0 clamp(60px, 6vw, 84px);
}
/* Full width in the flex column so .pet-container's own max-width + margin:0 auto
   keep the copy aligned with the 1160 central column (not shrink-wrapped/centred). */
.pet-hero--image .pet-hero__inner { width: 100%; }
.pet-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	z-index: 0;
}
/* Frosted-glass blur that fades in toward the bottom of the hero image. */
.pet-hero--image::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 50%;
	z-index: 1;
	pointer-events: none;
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 90%);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 90%);
}
.pet-hero--image .pet-hero__inner { z-index: 2; }
.pet-hero--image .pet-hero__eyebrow { color: rgba(255, 255, 255, .82); }
.pet-hero--image .pet-hero__title { color: #fff; }
.pet-hero--image .pet-hero__desc { color: rgba(255, 255, 255, .9); }
.pet-hero--image .pet-hero__or { color: rgba(255, 255, 255, .72); }
.pet-hero--image .pet-notice { color: var(--pet-ink); }

#pet-catalogo { scroll-margin-top: 96px; }

/* Search pill straddling the hero's lower edge (homepage, image hero only).
   JS sets the exact -50%-of-its-own-height margin; this is the no-JS fallback. */
.pet-catalog.pet-catalog--overlap { position: relative; z-index: 2; padding-top: 0; }
.pet-catalog--overlap .pet-search {
	margin-top: -32px;
	box-shadow: 0 22px 55px rgba(15, 17, 22, .22);
}

/* ---------- Page headers ---------- */
.pet-page-header { padding: 48px 0 8px; margin: 0 0 28px; }
.pet-page-title { font-size: clamp(1.7rem, 3vw, 2.5rem); margin: 0; letter-spacing: -.02em; }
.pet-page--doc .pet-page-header {
	padding-bottom: 22px;
	margin-bottom: 34px;
	border-bottom: 1px solid var(--pet-border);
}
.pet-page-meta { margin: 12px 0 0; font-size: .82rem; color: var(--pet-ink-soft); }
.pet-eyebrow {
	font-size: .7rem;
	font-weight: 700;
	color: var(--pet-accent-text);
	margin: 0 0 10px;
}
.pet-lead { color: var(--pet-ink-soft); font-size: 1.05rem; max-width: 60ch; }
.pet-archive-desc { color: var(--pet-ink-soft); }

/* ---------- Catalog search ---------- */
.pet-catalog { padding-top: 8px; }
.pet-catalog-toolbar { margin: 0 0 32px; }

/* White pill holding the fields inline + circular submit */
.pet-search {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 8px 8px 10px;
	background: var(--pet-panel);
	border-radius: 16px;
	box-shadow: 0 8px 26px rgba(20, 22, 28, .07);
	transition: box-shadow .15s ease;
}
.pet-search:focus-within {
	box-shadow: 0 0 0 3px var(--pet-accent-tint-2), 0 8px 26px rgba(20, 22, 28, .07);
}
.pet-search__field { display: flex; align-items: center; margin: 0; }
.pet-search__field--text { flex: 1 1 auto; min-width: 0; }

.pet-search input[type="search"] {
	width: 100%;
	height: 46px;
	padding: 0 14px;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: .98rem;
	color: var(--pet-ink);
	appearance: none;
	-webkit-appearance: none;
}
.pet-search input[type="search"]:focus { outline: 0; }
.pet-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

.pet-search select {
	height: 46px;
	padding: 0 40px 0 16px;
	border: 0;
	border-radius: 11px;
	background-color: var(--pet-surface);
	color: var(--pet-ink);
	font: inherit;
	font-size: .92rem;
	line-height: 1.2;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23737a86' stroke-width='1.6' stroke-linecap='round' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	background-size: 12px 8px;
	cursor: pointer;
}
.pet-search select:focus { outline: 0; box-shadow: 0 0 0 2px var(--pet-accent-tint-2) inset; }
/* A genre / age filter in effect: outline the control. */
.pet-search select.is-filtered { box-shadow: 0 0 0 2px var(--pet-accent) inset; color: var(--pet-ink); }
.pet-search select.is-filtered:focus { box-shadow: 0 0 0 2px var(--pet-accent) inset; }

.pet-search__submit {
	flex: none;
	width: 54px;
	height: 46px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 10px;
	background: var(--pet-accent);
	color: var(--pet-on-accent);
	cursor: pointer;
	transition: background .15s ease;
}
.pet-search__submit:hover { background: var(--pet-accent-dark); }
.pet-search__submit:focus-visible { outline: 2px solid var(--pet-accent); outline-offset: 2px; }

.pet-search__reset {
	display: inline-block;
	margin: 12px 6px 0;
	font-size: .85rem;
	color: var(--pet-ink-soft);
}

@media (max-width: 560px) {
	.pet-search { flex-wrap: wrap; border-radius: 14px; }
	.pet-search__field--text { flex: 1 1 100%; order: 1; }
	.pet-search__field--genere,
	.pet-search__field--eta { flex: 1 1 auto; order: 2; }
	.pet-search__field--genere select,
	.pet-search__field--eta select { width: 100%; }
	.pet-search__submit { order: 3; }

	/* No dropdown filters: keep the input and the search button on one row. */
	.pet-search:not(:has(.pet-search__field--genere)):not(:has(.pet-search__field--eta)) { flex-wrap: nowrap; }
	.pet-search:not(:has(.pet-search__field--genere)):not(:has(.pet-search__field--eta)) .pet-search__field--text { flex: 1 1 auto; }
}

/* ---------- Catalog view bar ---------- */
.pet-catalog-viewbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	margin: 0 0 20px;
}
.pet-catalog-count {
	margin: 0;
	font-size: .9rem;
	font-weight: 600;
	color: var(--pet-ink-soft);
}
.pet-catalog-viewbar__controls {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 16px;
}
.pet-perpage {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
}
.pet-perpage__go {
	height: 34px;
	padding: 0 12px;
	border: 1px solid var(--pet-border);
	border-radius: 8px;
	background: var(--pet-panel);
	color: var(--pet-ink-soft);
	font: inherit;
	font-size: .8rem;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.pet-perpage__go:hover { color: var(--pet-ink); }
/* With JS the choice applies on its own (see main.js); the button is only the
   no-JS fallback. */
.pet-js .pet-perpage__go { display: none; }
.pet-perpage__label {
	font-size: .8rem;
	font-weight: 700;
	color: var(--pet-ink-soft);
}
.pet-perpage select {
	height: 34px;
	margin: 0;
	padding: 0 30px 0 12px;
	border: 1px solid var(--pet-border);
	border-radius: 8px;
	background-color: var(--pet-panel);
	color: var(--pet-ink);
	font: inherit;
	font-size: .85rem;
	font-weight: 600;
	line-height: 1.2;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23737a86' stroke-width='1.6' stroke-linecap='round' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 11px center;
	background-size: 11px 7px;
	cursor: pointer;
}
.pet-perpage select:focus-visible { outline: 0; box-shadow: 0 0 0 2px var(--pet-accent-tint-2); }
@media (max-width: 560px) {
	.pet-catalog-viewbar { flex-direction: column; align-items: stretch; gap: 10px; }
	.pet-catalog-viewbar__controls { justify-content: space-between; width: 100%; }
	/* Keep the view switch pinned to the right edge on small screens. */
	.pet-catalog-viewbar__controls .pet-view-toggle { margin-left: auto; }
	.pet-catalog-viewbar .pet-view-toggle__btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	/* Dense grid is not offered on small screens — only "allargata" and "lista". */
	.pet-view-toggle__btn[data-cat-view="griglia"] { display: none; }
}

/* ---------- Catalog grid ---------- */
.pet-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px 14px;
}
/* "Griglia allargata" (default) keeps the base layout above. */
.pet-grid--lista { display: flex; flex-direction: column; gap: 10px; }

/* "Griglia": more titles per row. */
.pet-grid--griglia { grid-template-columns: repeat(6, 1fr); gap: 18px 12px; }
@media (max-width: 1200px) { .pet-grid--griglia { grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 1000px) { .pet-grid--griglia { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 760px)  { .pet-grid--griglia { grid-template-columns: repeat(3, 1fr); } }

@media (max-width: 560px) {
	.pet-grid { grid-template-columns: repeat(2, 1fr); }
	.pet-grid--griglia { grid-template-columns: repeat(2, 1fr); }
}
.pet-card { display: flex; flex-direction: column; }

/* Compact cards in the dense grid. */
@media (min-width: 901px) {
	.pet-grid--griglia { gap: 14px; }
	.pet-grid--griglia .pet-card { padding: 8px; border-radius: 12px; }
	.pet-grid--griglia .pet-card__title { font-size: .92rem; }
	.pet-grid--griglia .pet-card__date { font-size: .74rem; padding: 2px 7px; }
	.pet-grid--griglia .pet-card__tags { display: none; }
}

/* List view: poster thumbnail + details in a row. */
.pet-grid--lista .pet-card {
	flex-direction: row;
	align-items: center;
	gap: 16px;
	background: var(--pet-panel);
	border-radius: 14px;
	box-shadow: 0 6px 20px rgba(20, 22, 28, .06);
	padding: 10px 14px;
}
.pet-grid--lista .pet-card:hover { transform: none; box-shadow: 0 10px 26px rgba(20, 22, 28, .1); }
.pet-grid--lista .pet-card__link {
	display: flex;
	align-items: center;
	gap: 16px;
	flex: 1 1 auto;
	min-width: 0;
}
.pet-grid--lista .pet-card__link:hover .pet-card__poster { transform: none; box-shadow: 0 1px 2px rgba(20, 22, 28, .06); }
.pet-grid--lista .pet-card__poster { width: 52px; flex: none; border-radius: 6px; }
.pet-grid--lista .pet-card__body { padding: 0; min-width: 0; }
.pet-grid--lista .pet-card__title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pet-grid--lista .pet-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 5px 12px;
	margin-top: 4px;
}
.pet-grid--lista .pet-card__date { margin-top: 0; }
.pet-grid--lista .pet-card__dl {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: .78rem;
	font-weight: 600;
	color: var(--pet-ink-soft);
}
.pet-grid--lista .pet-card__dl .pet-icon { width: 13px; height: 13px; flex: none; }
.pet-grid--lista .pet-card__tags { margin: 0 0 0 auto; flex: none; justify-content: flex-end; max-width: 45%; }
@media (max-width: 560px) {
	.pet-grid--lista .pet-card__tags { display: none; }
	.pet-grid--lista .pet-card__link { gap: 12px; }
}

/* Desktop: each card sits on a white panel base, matching the search pill */
@media (min-width: 901px) {
	.pet-grid { gap: 18px; }
	.pet-card {
		background: var(--pet-panel);
		border-radius: 16px;
		box-shadow: 0 8px 26px rgba(20, 22, 28, .07);
		padding: 14px;
		transition: box-shadow .2s ease, transform .2s ease;
	}
	.pet-card:hover {
		box-shadow: 0 14px 34px rgba(20, 22, 28, .1);
		transform: translateY(-2px);
	}
	.pet-card:hover .pet-card__poster { transform: none; box-shadow: 0 1px 2px rgba(20, 22, 28, .06); }
	.pet-card__body { padding-left: 0; padding-right: 0; }
}
.pet-card__link { text-decoration: none; color: inherit; display: block; }
.pet-card__poster {
	display: block;
	position: relative;
	aspect-ratio: 2 / 3;
	background: var(--pet-surface-2);
	border-radius: var(--pet-radius);
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(20, 22, 28, .06);
	transition: box-shadow .2s ease, transform .2s ease;
}
.pet-card__link:hover .pet-card__poster {
	box-shadow: 0 18px 40px rgba(20, 22, 28, .16);
	transform: translateY(-3px);
}
.pet-card__poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pet-card__poster--empty::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(135deg, var(--pet-surface-2), color-mix(in srgb, var(--pet-accent) 8%, var(--pet-surface-2)));
}
.pet-card__body { display: block; padding: 12px 2px 0; }
.pet-card__title { display: block; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.pet-card__meta { display: block; }
/* Materials count: shown only in the list view (see .pet-grid--lista). */
.pet-card__dl { display: none; }
.pet-card__date {
	display: inline-block;
	margin: 7px 0 0;
	padding: 3px 9px;
	border: 1px solid color-mix(in srgb, var(--pet-accent) 35%, var(--pet-border));
	border-radius: 4px;
	background: var(--pet-accent-tint);
	color: var(--pet-accent-text);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .01em;
	white-space: nowrap;
}
.pet-card__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
	margin: 8px 0 0;
}
.pet-tag {
	display: inline-block;
	padding: 3px 8px;
	border: 1px solid color-mix(in srgb, var(--pet-border) 70%, transparent);
	border-radius: 3px;
	background: color-mix(in srgb, var(--pet-panel) 55%, transparent);
	-webkit-backdrop-filter: blur(8px) saturate(140%);
	backdrop-filter: blur(8px) saturate(140%);
	color: var(--pet-ink-soft);
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .02em;
	text-decoration: none;
	white-space: nowrap;
}
a.pet-tag:hover { border-color: var(--pet-accent); color: var(--pet-accent-text); }

/* ---------- Pagination ---------- */
.pet-pagination { margin: 44px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pet-pagination .page-numbers {
	display: inline-flex;
	min-width: 40px;
	justify-content: center;
	padding: 8px 12px;
	border: 1px solid var(--pet-border);
	border-radius: var(--pet-radius);
	text-decoration: none;
	color: var(--pet-ink);
	font-size: .9rem;
}
.pet-pagination .page-numbers:hover { border-color: var(--pet-accent); }
.pet-pagination .page-numbers.current {
	background: var(--pet-accent);
	color: var(--pet-on-accent);
	border-color: var(--pet-accent);
}

/* ---------- Notices ---------- */
/* Shared with the plugin's .pe-notice / .pe-form__errors — keep the two in sync. */
.pet-notice {
	padding: 14px 16px;
	background: var(--pet-surface);
	border: 1px solid var(--pet-border);
	border-left: 3px solid var(--pet-accent);
	border-radius: var(--pet-radius);
	font-size: .92rem;
	line-height: 1.55;
	color: var(--pet-ink);
}
.pet-notice + .pet-notice { margin-top: 10px; }
.pet-notice a { color: var(--pet-accent-text); font-weight: 600; }
.pet-notice--warning,
.pet-notice--pending { border-left-color: #dba617; background: #fdf6e6; border-color: #f0dfb3; }
.pet-notice--success,
.pet-notice--approved { border-left-color: #1a9e4b; background: #eaf7ee; border-color: #bfe4cb; }
.pet-notice--error,
.pet-notice--rejected { border-left-color: #d63638; background: #fdecec; border-color: #f2c2c2; }

/* Slim bar under the header inviting an exhibitor to complete their profile. */
.pet-profile-nudge {
	background: var(--pet-accent-tint);
	border-bottom: 1px solid var(--pet-border);
	font-size: .9rem;
	color: var(--pet-ink);
}
.pet-profile-nudge .pet-container {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	padding-top: 10px;
	padding-bottom: 10px;
}
.pet-profile-nudge span { flex: 1 1 auto; min-width: 220px; }
.pet-profile-nudge .pet-btn { flex: 0 0 auto; }
@media (max-width: 560px) {
	.pet-profile-nudge .pet-btn { width: 100%; justify-content: center; text-align: center; }
}

/* One-time overlay nudging a legacy exhibitor to complete their profile. */
.pet-profile-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	opacity: 0;
	transition: opacity .2s ease;
}
.pet-profile-modal.is-open { opacity: 1; }
.pet-profile-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(18, 20, 26, .55);
}
.pet-profile-modal__card {
	position: relative;
	width: 100%;
	max-width: 440px;
	background: var(--pet-surface);
	border-radius: 14px;
	box-shadow: 0 24px 60px rgba(15, 17, 22, .28);
	padding: 30px 28px 26px;
	transform: translateY(8px);
	transition: transform .2s ease;
}
.pet-profile-modal.is-open .pet-profile-modal__card { transform: translateY(0); }
.pet-profile-modal__close {
	position: absolute;
	top: 10px;
	right: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: var(--pet-muted);
	cursor: pointer;
}
.pet-profile-modal__close:hover { background: var(--pet-accent-tint); color: var(--pet-ink); }
.pet-profile-modal__hello {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	font-weight: 700;
	font-size: 1rem;
	color: var(--pet-ink);
}
.pet-profile-modal__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--pet-accent-tint);
	color: var(--pet-accent-text);
}
.pet-profile-modal__card h2 {
	margin: 0 0 8px;
	font-size: 1.2rem;
	line-height: 1.3;
	padding-right: 28px;
}
.pet-profile-modal__card p {
	margin: 0 0 20px;
	font-size: .95rem;
	color: var(--pet-ink);
}
.pet-profile-modal__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.pet-profile-modal__actions .pet-btn { flex: 1 1 auto; justify-content: center; text-align: center; }
@media (prefers-reduced-motion: reduce) {
	.pet-profile-modal,
	.pet-profile-modal__card { transition: none; }
}

/* ---------- Empty states ---------- */
.pet-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 4px;
	padding: 40px 24px;
	background: var(--pet-panel);
	border: 1px solid var(--pet-border);
	border-radius: 14px;
	color: var(--pet-ink-soft);
}
.pet-empty__icon {
	display: inline-flex;
	margin-bottom: 8px;
	color: color-mix(in srgb, var(--pet-accent) 55%, var(--pet-ink-soft));
}
.pet-empty__title { margin: 0; font-size: 1.05rem; font-weight: 700; color: var(--pet-ink); }
.pet-empty__text { margin: 0; max-width: 42ch; }
.pet-empty .pet-btn { margin-top: 14px; }

/* ---------- Film detail ---------- */
[id] { scroll-margin-top: 180px; }
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* Poster in a fixed left column; everything else stacks in one narrower column
   that all blocks share (intro text, details box, download area). */
.pet-film__layout {
	max-width: var(--pet-maxw);
	margin: 0 auto;
	padding: clamp(44px, 6vw, 76px) 24px 0;
	display: grid;
	grid-template-columns: minmax(230px, 330px) minmax(0, 1fr);
	column-gap: clamp(24px, 4vw, 52px);
	align-items: start;
}
.pet-film__layout--no-poster { display: block; }
.pet-film__col { min-width: 0; }
.pet-film__col > * + * { margin-top: clamp(26px, 4vw, 44px); }
.pet-film__col > .pet-film__subnav + * { margin-top: 16px; }

/* In-page section menu (desktop only) */
.pet-film__subnav { display: none; }
@media (min-width: 861px) {
	.pet-film__subnav {
		display: flex;
		flex-wrap: wrap;
		width: fit-content;
		max-width: 100%;
		gap: 3px;
		position: sticky;
		top: 118px;
		z-index: 20;
		margin: 0;
		padding: 5px;
		border-radius: 12px;
		border: 1px solid color-mix(in srgb, var(--pet-border) 55%, transparent);
		background: color-mix(in srgb, var(--pet-bg) 80%, transparent);
		-webkit-backdrop-filter: blur(10px) saturate(140%);
		backdrop-filter: blur(10px) saturate(140%);
		transition: background .2s ease, box-shadow .2s ease, border-color .2s ease;
	}
	.pet-film__subnav.is-stuck {
		background: var(--pet-panel);
		border-color: var(--pet-border);
		box-shadow: 0 8px 24px rgba(20, 22, 28, .1);
	}
}
.pet-film__subnav a {
	padding: 11px 19px;
	border-radius: 9px;
	font-size: .9rem;
	font-weight: 700;
	letter-spacing: .01em;
	color: var(--pet-ink-soft);
	text-decoration: none;
	white-space: nowrap;
	transition: background .15s ease, color .15s ease;
}
.pet-film__subnav a:hover { background: var(--pet-panel); color: var(--pet-ink); }
.pet-film__subnav a.is-active { background: var(--pet-accent); color: var(--pet-on-accent); }

.pet-film__poster { position: sticky; top: 118px; }
.pet-film__poster img {
	display: block;
	border-radius: var(--pet-radius);
	width: 100%;
	box-shadow: 0 20px 50px rgba(20, 22, 28, .2);
}
.pet-breadcrumb { margin: 0 0 16px; font-size: .74rem; text-transform: uppercase; letter-spacing: .14em; }
.pet-breadcrumb a { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: var(--pet-ink-soft); font-weight: 700; }
.pet-breadcrumb a:hover { color: var(--pet-accent-text); }
.pet-film__title { font-size: clamp(1.9rem, 4.4vw, 3rem); margin: 0 0 14px; }
.pet-film__tags { margin: 0 0 22px; }
.pet-film__actions { margin: 22px 0 0; display: flex; flex-wrap: wrap; gap: 10px 12px; }
.pet-film__actions .pet-btn { flex: 0 0 auto; }

/* Quick spec line under the genre tags: durata · regia · classificazione */
.pet-film__specs {
	margin: 0 0 4px;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 10px;
	font-size: .95rem;
	color: var(--pet-ink-soft);
}
.pet-film__specs > span:not(.pet-film__specs-sep) { color: var(--pet-ink); font-weight: 500; }
.pet-film__specs-sep { color: color-mix(in srgb, var(--pet-ink-soft) 60%, transparent); }

/* Synopsis sits in the intro column, right under the genre tags */
.pet-film__synopsis { margin: 20px 0 0; }
.pet-film__synopsis > :first-child { margin-top: 0; }
.pet-film__synopsis > :last-child { margin-bottom: 0; }
.pet-film__synopsis p { font-size: clamp(1.02rem, 1.4vw, 1.14rem); line-height: 1.6; color: color-mix(in srgb, var(--pet-ink) 88%, #fff); }
.pet-film__synopsis .pet-film__synopsis-label {
	margin: 22px 0 6px;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--pet-muted);
}

/* Details + rating: boxed on a white base, same column width as everything else */
.pet-film__info {
	background: var(--pet-panel);
	border-radius: 18px;
	box-shadow: 0 8px 26px rgba(20, 22, 28, .07);
	padding: clamp(22px, 3.4vw, 34px);
}
.pet-film__info-title {
	margin: 0 0 18px;
	font-size: .72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .16em;
	color: var(--pet-ink-soft);
}
.pet-film__meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 16px clamp(24px, 4vw, 44px);
	margin: 0;
}
.pet-film__meta-item { margin: 0; }
.pet-film__meta dt,
.pet-film__cast dt {
	font-size: .66rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: var(--pet-ink-soft);
	margin: 0 0 5px;
}
.pet-film__meta dd { margin: 0; font-weight: 600; font-size: 1.02rem; color: var(--pet-ink); }

.pet-film__cast {
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--pet-border);
}
.pet-film__cast dd { margin: 0; display: flex; flex-wrap: wrap; gap: 6px 8px; }
.pet-film__cast dt { margin-bottom: 8px; }
.pet-film__cast-name {
	font-size: .92rem;
	font-weight: 500;
	color: var(--pet-ink);
	background: var(--pet-surface);
	border: 1px solid var(--pet-border);
	border-radius: 999px;
	padding: 4px 12px;
}

.pet-film__rating {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--pet-border);
}
.pet-film__rating-label {
	font-size: .66rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: var(--pet-ink-soft);
}
.pet-film__rating-icons { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
/* No divider when the rating is the only content after the title. */
.pet-film__info-title + .pet-film__rating,
.pet-film__info-title + .pet-film__cast {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}
.pet-film__rating-age,
.pet-film__rating-warn { width: 32px; height: 32px; object-fit: contain; display: block; }

/* ---------- Download area ---------- */
.pet-film__downloads {
	background: var(--pet-surface);
	border-radius: 18px;
	padding: clamp(22px, 3.4vw, 34px);
}
.pet-downloads__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 24px;
	margin: 0 0 24px;
}
.pet-downloads__head h2 { font-size: clamp(1.4rem, 2.6vw, 2rem); margin: 0; }

.pet-view-toggle {
	display: inline-flex;
	gap: 2px;
	padding: 3px;
	background: var(--pet-panel);
	border-radius: 10px;
}
.pet-view-toggle__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 13px;
	border: 0;
	border-radius: 7px;
	background: transparent;
	color: var(--pet-ink-soft);
	font: inherit;
	font-size: .8rem;
	font-weight: 700;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}
.pet-view-toggle__btn:hover { color: var(--pet-ink); }
.pet-view-toggle__btn.is-active { background: var(--pet-accent); color: var(--pet-on-accent); }

.pet-download-group { margin: 0 0 28px; }
.pet-download-group:last-child { margin-bottom: 0; }
.pet-download-group__title {
	font-size: .72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .14em;
	color: var(--pet-ink-soft);
	margin: 0 0 14px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--pet-border);
}
.pet-download-list { list-style: none; margin: 0; padding: 0; }

.pet-download-item__link {
	position: relative;
	display: flex;
	background: var(--pet-panel);
	border: 1px solid var(--pet-border);
	border-radius: 10px;
	overflow: hidden;
	text-decoration: none;
	color: var(--pet-ink);
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.pet-download-item__link:hover {
	border-color: var(--pet-accent);
	box-shadow: 0 10px 24px rgba(20, 22, 28, .1);
}
/* Conferma al click — il download parte via redirect server-side e non dà
   altrimenti alcun segno sulla pagina (vedi main.js). */
.pet-download-item__link.is-confirmed { border-color: #2f9e6f; }
.pet-download-item__link.is-confirmed::after {
	content: "✓ " attr(data-confirm-label);
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	background: rgba(255, 255, 255, .95);
	color: #1f7a52;
	font-weight: 700;
	font-size: .85rem;
	letter-spacing: .01em;
	animation: pet-dl-confirm 2.5s ease forwards;
}
@keyframes pet-dl-confirm {
	0% { opacity: 0; }
	10% { opacity: 1; }
	75% { opacity: 1; }
	100% { opacity: 0; }
}
.pet-download-item__thumb {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: var(--pet-surface-2);
	color: var(--pet-accent-text);
}
.pet-download-item__thumb img { width: 100%; height: 100%; display: block; }
.pet-download-item__thumb--placeholder {
	background: linear-gradient(140deg, var(--pet-surface), var(--pet-accent-tint));
}
.pet-download-item__body { display: flex; flex-direction: column; min-width: 0; }
.pet-download-item__title { font-weight: 700; font-size: .95rem; line-height: 1.3; }
.pet-download-item__type {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-weight: 700;
	font-size: .64rem;
	color: var(--pet-ink-soft);
	text-transform: uppercase;
	letter-spacing: .1em;
}

/* Grid view — previews get the emphasis */
.pet-downloads--grid .pet-download-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: 16px;
}
.pet-downloads--grid .pet-download-item__link { flex-direction: column; border-radius: 14px; }
.pet-downloads--grid .pet-download-item__thumb { width: 100%; aspect-ratio: 3 / 2; padding: 12px; }
.pet-downloads--grid .pet-download-item__thumb img { object-fit: contain; }
.pet-downloads--grid .pet-download-item__thumb .pet-icon { width: 30px; height: 30px; }
.pet-downloads--grid .pet-download-item__body { gap: 5px; padding: 13px 15px 15px; }
.pet-downloads--grid .pet-download-item__link:hover { transform: translateY(-2px); }

/* List view — compact rows */
.pet-downloads--list .pet-download-list { display: flex; flex-direction: column; gap: 8px; }
.pet-downloads--list .pet-download-item__link { flex-direction: row; align-items: center; gap: 14px; padding: 9px 14px 9px 9px; }
.pet-downloads--list .pet-download-item__thumb { width: 52px; height: 52px; border-radius: 6px; }
.pet-downloads--list .pet-download-item__thumb img { object-fit: cover; }
.pet-downloads--list .pet-download-item__thumb .pet-icon { width: 20px; height: 20px; }
.pet-downloads--list .pet-download-item__body { flex-direction: row; align-items: baseline; gap: 12px; flex-wrap: wrap; }

/* ---------- Footer (dark) ---------- */
.pet-site-footer {
	--pf-text: rgba(255, 255, 255, .92);
	--pf-soft: rgba(255, 255, 255, .58);
	--pf-line: rgba(255, 255, 255, .12);
	--pf-accent: color-mix(in srgb, var(--pet-accent) 72%, #fff);

	position: relative;
	background: linear-gradient(180deg, #23272f, #191c22);
	padding: 52px 0 44px;
	font-size: .92rem;
	line-height: 1.6;
	color: var(--pf-soft);
}
.pet-site-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--pet-accent) 55%, transparent), transparent);
}
.pet-site-footer__inner { display: block; }
.pet-site-footer a { color: var(--pf-text); text-decoration: none; }
.pet-site-footer a:hover { color: var(--pf-accent); }

/* Footer columns */
.pet-footer__main {
	display: flex;
	flex-wrap: wrap;
	gap: 34px 56px;
	margin: 0 0 36px;
}
.pet-footer__block { flex: 1 1 190px; min-width: 0; }
.pet-footer__block--brand { flex: 1 1 240px; }
.pet-footer__block--social { flex: 0 1 auto; }

.pet-footer__eyebrow {
	margin: 0 0 14px;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .15em;
	color: rgba(255, 255, 255, .45);
}

.pet-footer__logo { display: inline-block; margin: 0 0 16px; }
.pet-footer__logo img { display: block; max-height: 46px; width: auto; height: auto; }
.pet-footer__addr { margin: 0; font-size: .85rem; line-height: 1.6; color: var(--pf-soft); }
.pet-footer__note { margin: 12px 0 0; font-size: .85rem; line-height: 1.6; color: var(--pf-soft); }
.pet-footer__note p { margin: 0 0 6px; }

.pet-footer__contacts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.pet-footer__contacts li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: .88rem;
	line-height: 1.45;
	color: var(--pf-text);
}
.pet-footer__contacts .pet-icon {
	flex: none;
	width: 15px;
	height: 15px;
	margin-top: 2px;
	color: var(--pf-accent);
}

.pet-footer__socials { display: flex; flex-wrap: wrap; gap: 9px; }
.pet-footer__soc {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: 11px;
	background: rgba(255, 255, 255, .07);
	border: 1px solid var(--pf-line);
	color: rgba(255, 255, 255, .72);
	transition: transform .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.pet-footer__soc:hover {
	background: var(--pet-accent);
	border-color: var(--pet-accent);
	color: var(--pet-on-accent);
	transform: translateY(-2px);
}
.pet-footer__soc svg { width: 17px; height: 17px; display: block; }

.pet-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 24px;
	padding-top: 24px;
	border-top: 1px solid var(--pf-line);
	font-size: .82rem;
}
.pet-copyright { margin: 0; font-weight: 600; color: var(--pf-text); }
.pet-footer__policies { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; }
.pet-footer__policies a,
.pet-menu--footer a { font-weight: 600; color: rgba(255, 255, 255, .8); }
.pet-footer__policies a:hover { color: var(--pf-accent); }
.pet-footer__credit {
	margin: 18px 0 0;
	display: flex;
	align-items: center;
	gap: 7px;
}
.pet-footer__credit-label { font-size: .72rem; color: rgba(255, 255, 255, .45); }
/* Vendor badge — always TradePress orange, independent of the client accent. */
a.pet-footer__credit-tag {
	padding: 4px 10px;
	font-size: .7rem;
	border-color: #ff8a65;
	background: #ff8a65;
	color: #fff;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
}
a.pet-footer__credit-tag:hover {
	border-color: #ff7a50;
	background: #ff7a50;
	color: #fff;
}
.pet-menu--footer { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 0; padding: 0; list-style: none; }

@media (prefers-reduced-motion: reduce) {
	.pet-rail__poster,
	.pet-rail__item a:hover .pet-rail__poster,
	.pet-showcase__posterframe,
	.pet-card__link,
	.pet-download-item__link {
		transition: none !important;
		transform: none !important;
	}
	html { scroll-behavior: auto; }
}

/* ---------- Back to top ---------- */
.pet-to-top {
	position: fixed;
	right: clamp(16px, 3vw, 32px);
	bottom: clamp(16px, 3vw, 32px);
	z-index: 60;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid var(--pet-accent);
	border-radius: 999px;
	background: var(--pet-accent);
	color: var(--pet-on-accent);
	box-shadow: 0 8px 24px rgba(20, 22, 28, .16);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity .2s ease, transform .2s ease, visibility .2s ease, background .15s ease, color .15s ease;
}
.pet-to-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.pet-to-top:hover { background: var(--pet-accent-dark); border-color: var(--pet-accent-dark); color: var(--pet-on-accent); }
.pet-to-top:focus-visible { outline: 2px solid var(--pet-accent); outline-offset: 2px; }
.pet-to-top .pet-icon { width: 20px; height: 20px; }

/* ---------- Generic content ---------- */
.pet-page { padding: 48px 0 0; }
.pet-narrow { max-width: 660px; }
.pet-page--doc { max-width: 980px; }
.pet-entry-content { max-width: 70ch; }

/* Account / registration pages: the plugin shortcode owns the layout (cards),
   so drop the prose width cap and trim the top gap. */
.pet-page--account { padding: 30px 0 8px; }
.pet-page--account .pet-entry-content { max-width: none; }

/* Content page: optional in-page section menu beside the prose */
.pet-doc__layout { display: block; }
.pet-doc__layout .pet-prose { max-width: 68ch; }
.pet-doc-nav[hidden] { display: none; }
.pet-doc-nav__title {
	margin: 0 0 10px;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--pet-ink-soft);
}
.pet-doc-nav ul { margin: 0; padding: 0; list-style: none; }
.pet-doc-nav li + li { margin-top: 2px; }
.pet-doc-nav a {
	display: block;
	padding: 6px 10px;
	border-radius: 7px;
	font-size: .85rem;
	line-height: 1.35;
	color: var(--pet-ink-soft);
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}
.pet-doc-nav a:hover { background: var(--pet-surface); color: var(--pet-ink); }
.pet-doc-nav a.is-active { background: var(--pet-accent-tint); color: var(--pet-accent-text); font-weight: 600; }

@media (max-width: 1039px) {
	.pet-doc-nav {
		margin: 0 0 30px;
		padding: 16px 18px;
		border: 1px solid var(--pet-border);
		border-radius: 12px;
		background: var(--pet-panel);
	}
}
@media (min-width: 1040px) {
	.pet-doc__layout {
		display: grid;
		grid-template-columns: 200px minmax(0, 1fr);
		column-gap: 48px;
		align-items: start;
	}
	.pet-doc-nav {
		position: sticky;
		top: 118px;
		max-height: calc(100vh - 140px);
		overflow-y: auto;
	}
}
.pet-entry-content img { border-radius: var(--pet-radius); }
.pet-post-list { display: grid; gap: 28px; }
.pet-post-summary h2 { font-size: 1.4rem; margin: 0 0 6px; }

/* Long-form prose (Privacy / Cookie Policy and other content pages) */
.pet-prose { max-width: none; color: var(--pet-ink-soft); font-size: 1rem; line-height: 1.72; }
.pet-prose > * + * { margin-top: 1.1em; }
.pet-prose h2 {
	color: var(--pet-ink);
	font-size: clamp(1.22rem, 2.2vw, 1.5rem);
	line-height: 1.25;
	letter-spacing: -.01em;
	margin-top: 2.1em;
}
.pet-prose h3 { color: var(--pet-ink); font-size: 1.1rem; margin-top: 1.7em; }
.pet-prose h2:first-child,
.pet-prose h3:first-child { margin-top: 0; }
.pet-prose h2 + p,
.pet-prose h3 + p { margin-top: .5em; }
.pet-prose a { color: var(--pet-accent-text); text-decoration: underline; text-underline-offset: 2px; }
.pet-prose a:hover { color: var(--pet-accent); }
.pet-prose strong { color: var(--pet-ink); font-weight: 600; }
.pet-prose ul,
.pet-prose ol { padding-left: 1.35em; }
.pet-prose li + li { margin-top: .4em; }
.pet-prose blockquote {
	margin: 1.4em 0;
	padding: 2px 0 2px 1em;
	border-left: 3px solid var(--pet-accent);
	color: var(--pet-ink-soft);
}
.pet-prose hr { border: 0; border-top: 1px solid var(--pet-border); margin: 2.4em 0; }
.pet-prose code {
	background: var(--pet-surface);
	padding: .12em .4em;
	border-radius: 4px;
	font-size: .9em;
}
.pet-prose table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.pet-prose th,
.pet-prose td { border: 1px solid var(--pet-border); padding: 8px 10px; text-align: left; }
.pet-prose th { background: var(--pet-surface); color: var(--pet-ink); }

/* ---------- Responsive ---------- */
@media (max-width: 780px) {
	.pet-film__layout { display: block; }
	.pet-film__poster { position: static; max-width: 300px; margin: 0 0 24px; }
}
@media (max-width: 640px) {
	.pet-container { padding: 0 18px; }
	/* On phones the header keeps a bit more presence than the fluid curve would
	   give at this width. */
	.pet-site-header__inner { gap: 12px 16px; padding-top: 20px; padding-bottom: 20px; }
	.pet-brand__logo img { max-height: 44px; max-width: min(150px, 38vw); }
	.pet-account-link { gap: 6px; }
	.pet-hero { padding: 36px 0 20px; }
	.pet-hero--image { min-height: 380px; padding: 40px 0 72px; }
	/* Scheda film: locandina a tutta larghezza della colonna. */
	.pet-film__poster { max-width: 100%; }
	.pet-footer__bottom { flex-direction: column; align-items: flex-start; }
	.pet-footer__main { gap: 26px 40px; }
	.pet-footer__block,
	.pet-footer__block--brand { flex-basis: 100%; }
	/* Two compact columns rather than one tall one. */
	.pet-downloads--grid .pet-download-list { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.pet-downloads--grid .pet-download-item__body { padding: 10px 12px 12px; }
	.pet-downloads--grid .pet-download-item__title { font-size: .88rem; }
}
@media (max-width: 460px) {
	.pet-account-link .pet-btn { padding-left: 11px; padding-right: 11px; }
	.pet-account-link .pet-btn span {
		position: absolute;
		width: 1px; height: 1px;
		overflow: hidden;
		clip: rect(1px, 1px, 1px, 1px);
	}
	/* Grid stays a real two-column grid down to the smallest screens
	   (the list view is a separate choice in the toggle). */
	.pet-downloads--grid .pet-download-list { gap: 10px; }
	.pet-downloads__head { flex-wrap: wrap; gap: 10px; }
	.pet-film__downloads .pet-view-toggle { width: 100%; }
	.pet-film__downloads .pet-view-toggle__btn { flex: 1; justify-content: center; }
}

/* ============================================================
   Editorial homepage: showcase hero + rails
   ============================================================ */
.pet-showcase {
	position: relative;
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: clamp(470px, 47vw, 660px);
	padding: clamp(48px, 6.5vw, 88px) 0;
	overflow: hidden;
}
.pet-showcase__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center 22%;
	z-index: 0;
}
/* The poster is always shown next to the text. Without a landscape cover the
   background is the poster itself, blurred and darkened. */
.pet-showcase--poster .pet-showcase__bg {
	background-size: cover;
	background-position: center;
	filter: blur(26px) saturate(1.1);
	transform: scale(1.15);
}
.pet-showcase__inner {
	display: flex;
	align-items: center;
	gap: clamp(24px, 5vw, 56px);
}
.pet-showcase__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
/* The poster is sized by width only; the image is width:100% / height:auto, so
   the frame follows the poster's own proportions and never crops or distorts,
   at any viewport size or on resize. */
.pet-showcase__posterframe {
	flex: 0 0 auto;
	align-self: center;
	width: clamp(190px, 22vw, 300px);
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 18px 44px rgba(0, 0, 0, .5);
}
.pet-showcase__posterframe img {
	display: block;
	width: 100%;
	height: auto;
}
@media (max-width: 720px) {
	/* On phones: the whole poster on top, text below, both full width. */
	.pet-showcase--poster .pet-showcase__inner,
	.pet-showcase--cover .pet-showcase__inner {
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}
	.pet-showcase__posterframe {
		width: min(240px, 60vw);
	}
	.pet-showcase__body { max-width: none; width: 100%; }
}
.pet-showcase::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 55%;
	z-index: 1;
	pointer-events: none;
	-webkit-backdrop-filter: blur(12px);
	backdrop-filter: blur(12px);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 88%);
	mask-image: linear-gradient(to bottom, transparent 0%, #000 88%);
}
.pet-showcase__inner { position: relative; z-index: 2; width: 100%; }
.pet-showcase__body { max-width: 640px; }
.pet-showcase__eyebrow {
	margin: 0 0 12px;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .86);
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}
.pet-showcase__eyebrow time { letter-spacing: .04em; }
.pet-showcase__title {
	margin: 0 0 10px;
	font-size: clamp(2rem, 4.4vw, 3.1rem);
	line-height: 1.08;
	letter-spacing: -.02em;
	color: #fff;
}
.pet-showcase__specs {
	margin: 0 0 16px;
	font-size: .95rem;
	color: rgba(255, 255, 255, .82);
}
.pet-showcase__desc {
	margin: 0 0 20px;
	font-size: clamp(.98rem, 1.4vw, 1.1rem);
	line-height: 1.5;
	color: rgba(255, 255, 255, .92);
}
.pet-showcase__tags { margin: 0 0 22px; display: flex; flex-wrap: wrap; gap: 8px; }
.pet-tag--on-dark {
	background: rgba(255, 255, 255, .14);
	border-color: rgba(255, 255, 255, .32);
	color: #fff;
}
.pet-tag--on-dark:hover { background: rgba(255, 255, 255, .26); border-color: #fff; }
.pet-showcase__cta { margin: 0; display: flex; flex-wrap: wrap; gap: 12px; }
/* The hero backdrop is always dark, whatever the client's accent colour, so the
   buttons use fixed light/dark values instead of the accent tokens. */
.pet-showcase__cta .pet-btn--on-accent {
	background: #fff;
	border-color: #fff;
	color: #16181d;
}
.pet-showcase__cta .pet-btn--on-accent:hover {
	background: rgba(255, 255, 255, .88);
	border-color: rgba(255, 255, 255, .88);
	color: #16181d;
}
.pet-showcase__cta .pet-btn--on-accent-outline {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .55);
	color: #fff;
}
.pet-showcase__cta .pet-btn--on-accent-outline:hover {
	background: rgba(255, 255, 255, .2);
	border-color: #fff;
	color: #fff;
}
.pet-showcase__cta .pet-btn:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}
.pet-showcase__note {
	margin: 18px 0 0;
	font-size: .88rem;
	color: rgba(255, 255, 255, .9);
	background: rgba(0, 0, 0, .28);
	border-left: 3px solid rgba(255, 255, 255, .5);
	padding: 10px 14px;
	border-radius: 4px;
	max-width: 58ch;
}

/* Rails — two panels on the same row */
.pet-rails { padding: clamp(18px, 2.5vw, 28px) 0 0; }
.pet-rails__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(16px, 2.4vw, 28px);
}
.pet-rails__grid > .pet-rail {
	background: var(--pet-surface);
	border: 1px solid var(--pet-border);
	border-radius: 12px;
	padding: clamp(12px, 1.6vw, 18px) clamp(16px, 2vw, 22px);
}
@media (max-width: 780px) {
	.pet-rails__grid { grid-template-columns: 1fr; }
}
.pet-rail__title {
	margin: 0 0 10px;
	font-size: 1.02rem;
	letter-spacing: -.01em;
	color: var(--pet-ink);
}
.pet-rail__track {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(var(--pet-slots, 3), 1fr);
	gap: clamp(10px, 1.4vw, 16px);
}
.pet-rail__item--ghost .pet-rail__poster {
	display: flex;
	align-items: center;
	justify-content: center;
	background: color-mix(in srgb, var(--pet-surface-2) 92%, var(--pet-ink));
	box-shadow: none;
	transform: none;
}
.pet-rail__item a {
	display: flex;
	flex-direction: column;
	gap: 8px;
	text-decoration: none;
	color: var(--pet-ink);
}
.pet-rail__poster {
	display: block;
	aspect-ratio: 2 / 3;
	border-radius: 8px;
	overflow: hidden;
	background: var(--pet-surface-2);
	box-shadow: 0 2px 8px rgba(20, 22, 28, .12);
	transition: transform .18s ease, box-shadow .18s ease;
}
.pet-rail__item a:hover .pet-rail__poster { transform: translateY(-3px); box-shadow: 0 12px 26px rgba(20, 22, 28, .18); }
.pet-rail__poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pet-rail__poster--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: linear-gradient(140deg, var(--pet-surface), var(--pet-surface-2));
}
/* Generic film-poster icon filling an empty poster slot (ghost slot, or a
   real film with no poster) — faded so it reads as a placeholder, not as
   content. */
.pet-rail__poster .pet-icon,
.pet-rail__poster--empty .pet-icon {
	color: var(--pet-ink);
	opacity: .18;
}
.pet-rail__name {
	font-size: .9rem;
	font-weight: 600;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.pet-rail__sub { font-size: .78rem; color: var(--pet-ink-soft); }
.pet-rail__item a:hover .pet-rail__name { color: var(--pet-accent-text); }

/* Catalog block under the editorial sections */
.pet-catalog--editorial { padding-top: clamp(34px, 5vw, 52px); }
.pet-catalog__heading {
	margin: 0 0 18px;
	font-size: 1.12rem;
	letter-spacing: -.01em;
	color: var(--pet-ink);
}

@media (max-width: 640px) {
	.pet-showcase { min-height: clamp(380px, 90vw, 480px); }
	.pet-showcase__bg { background-position: center 12%; }
	.pet-showcase__cta .pet-btn { flex: 1 1 auto; justify-content: center; }
	.pet-rail__name { font-size: .82rem; }
}
