/*!
Theme Name:        PG SRL
Theme URI:         https://pgsrl.eu
Author:            PG SRL — Bending & Cutting Systems
Author URI:        https://pgsrl.eu
Description:       Theme custom per PG SRL — presse piegatrici e cesoie Made in Italy. Porting fedele al pixel del sito statico HTML.
Version:           1.0.0
Requires at least: 6.5
Requires PHP:      8.2
License:           Proprietary
Text Domain:       pgsrl
*/

/* The real CSS lives in /assets/css/ and is enqueued from inc/enqueue.php. */

/* WordPress accessibility classes — required so the skip-link is hidden
   visually but still picked up by screen readers and keyboard nav. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	white-space: nowrap;
	word-wrap: normal !important;
	border: 0;
}
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, .6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* ════════════════════════════════════════════════════════════
   FOOTER globals — These rules live inline only in the home's
   <style> block in the static (extracted into home.css). All
   the OTHER static pages render the footer at runtime via
   site.js -> document.write of FOOTER_HTML, and rely on the
   browser computing default sizes for SVGs (which doesn't work
   in WP because WP renders the footer markup directly from
   footer.php). Loading these rules from the theme stylesheet
   means every WP page gets the correct footer layout regardless
   of which inline-css/<slug>.css was extracted.
   ════════════════════════════════════════════════════════════ */
footer {
	background: var(--bg);
	padding: 80px var(--pad-x) 40px;
	border-top: 1px solid var(--line);
}
.foot-inner {
	max-width: var(--maxw); margin: 0 auto;
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 60px;
	padding-bottom: 80px;
	border-bottom: 1px solid var(--line);
}
.foot-brand { display: flex; flex-direction: column; gap: 20px; position: relative; }
.foot-brand p { color: var(--muted); font-size: 14px; max-width: 36ch; line-height: 1.55; }
.foot-brand .logo { gap: 14px; height: auto; align-items: center; display: flex; }
.foot-brand .logo img { width: 44px; height: 44px; object-fit: contain; flex: 0 0 auto; }
.foot-brand .logo > div { display: flex; flex-direction: column; line-height: 1.2; }
.foot-brand .logo > div > div:first-child { font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 16px; color: var(--ink); letter-spacing: -0.01em; }
.foot-brand .logo > div .sub { font-family: 'JetBrains Mono', monospace; font-size: 10px; color: var(--muted); letter-spacing: 0.06em; text-transform: uppercase; margin-top: 4px; }
.foot-col h5 { font-family: 'JetBrains Mono', monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 20px; font-weight: 400; }
.foot-col a { display: block; font-size: 14px; color: var(--ink-2); padding: 6px 0; transition: color .2s; text-decoration: none; }
.foot-col a:hover { color: var(--accent); }

.foot-social {
	max-width: var(--maxw);
	margin: 40px auto 0;
	padding: 28px 0 0;
	border-top: 1px solid var(--line);
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	align-items: center;
}
.foot-social a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px 10px 14px;
	border: 1px solid var(--line);
	border-radius: 999px;
	color: var(--ink-2);
	font-family: 'JetBrains Mono', ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	transition: border-color .25s ease, color .25s ease, transform .25s ease, background .25s ease;
}
.foot-social a svg {
	width: 18px; height: 18px;
	flex: 0 0 auto;
	transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
.foot-social a:hover {
	color: var(--ink);
	border-color: var(--ink);
	transform: translateY(-2px);
}
.foot-social a:hover svg { transform: scale(1.15) rotate(-4deg); }
.foot-social a[aria-label="Instagram"]:hover { color: #E1306C; border-color: #E1306C; }
.foot-social a[aria-label="LinkedIn"]:hover  { color: #0A66C2; border-color: #0A66C2; }
.foot-social a[aria-label="YouTube"]:hover   { color: #FF0000; border-color: #FF0000; }

.foot-bottom {
	max-width: var(--maxw); margin: 0 auto;
	padding-top: 32px;
	display: flex; justify-content: space-between;
	font-family: 'JetBrains Mono', monospace;
	font-size: 11px; color: var(--muted);
	letter-spacing: 0.05em;
}
.foot-bottom a { transition: color .25s ease; }
.foot-bottom a:hover { color: var(--accent); }

@media (max-width: 900px) {
	.foot-inner { grid-template-columns: 1fr 1fr; gap: 40px; }
}
@media (max-width: 600px) {
	.foot-inner { grid-template-columns: 1fr; }
	.foot-bottom { flex-direction: column; gap: 8px; }
}

/* Trust heading — show desktop variant by default, mobile variant only ≤760px.
   The mobile swap rule lives in mobile-cinema.css which is gated to
   (max-width:760px), so on desktop neither file hides .trust-heading--mobile
   → both heading variants would render. These rules live here (always loaded)
   to fix the duplication on viewports >760px. */
.trust-heading--mobile { display: none; }
@media (max-width: 760px) {
	.trust-heading--desktop { display: none; }
	.trust-heading--mobile  { display: block; }
}