/*
Theme Name: Tokenizzazione IT
Theme URI: https://tokenizzazione.it/
Author: DETOFI
Description: Tema italiano per TOKENIZZAZIONE.IT e la tokenizzazione dell’Italia.
Version: 1.0.3
Text Domain: tokenizzazione-it
*/
:root{--blue:#436f51;--blue2:#31583e;--red:#ce2939;--cream:#fff9e9;--paper:#fffdf6;--text:#17212d;--muted:#5e6874;--line:rgba(67,111,81,.14);--max:1320px;--shadow:0 20px 60px rgba(46,75,55,.11)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--text);font-family:Inter,Arial,sans-serif;line-height:1.6}a{text-decoration:none;color:inherit}img{max-width:100%;height:auto}.ts-shell{width:min(var(--max),calc(100% - 48px));margin:auto}
.ts-header{height:96px;background:rgba(255,249,233,.94);border-top:4px solid var(--red);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50;backdrop-filter:blur(14px)}.ts-header-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}.ts-brand{display:flex;align-items:center;gap:12px}.ts-brand img{width:62px;height:62px;object-fit:contain}.ts-brand-text strong{font-size:24px;letter-spacing:.01em;color:var(--blue)}.ts-brand-text strong span{color:var(--red)}.ts-brand-text small{display:block;color:#78818a;font-weight:700;letter-spacing:.04em}.ts-nav{display:flex;align-items:center;gap:30px;font-weight:800;font-size:13px;text-transform:uppercase}.ts-nav a:hover{color:var(--red)}.ts-menu{display:none;border:1px solid var(--red);border-radius:10px;background:transparent;color:var(--blue);font-size:24px;width:44px;height:44px}
.ts-hero{min-height:700px;display:flex;align-items:center;overflow:hidden;position:relative}.ts-hero-inner{width:min(1500px,100%);margin:auto;display:grid;grid-template-columns:43% 57%;align-items:center;min-height:700px}.ts-copy{padding:70px 20px 70px max(40px,calc((100vw - var(--max))/2))}.ts-kicker,.ts-eyebrow{color:var(--blue);font-weight:900;letter-spacing:.06em;text-transform:uppercase;font-size:14px}.ts-hero h1{font-size:clamp(54px,5vw,82px);line-height:.94;margin:18px 0 24px;color:var(--blue);letter-spacing:-.04em}.ts-hero h1 span{display:block;color:var(--red)}.ts-lead{font-size:19px;max-width:600px;color:#39434d}.ts-buttons{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px}.ts-btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 24px;border-radius:7px;font-weight:900;text-transform:uppercase;font-size:13px}.ts-btn-primary{background:var(--blue);color:#fff}.ts-btn-primary:hover{background:var(--red)}.ts-btn-ghost{border:1px solid var(--blue);color:var(--blue);background:rgba(255,255,255,.35)}.ts-visual{height:700px;display:flex;align-items:center;justify-content:center;position:relative}.ts-visual img{width:110%;max-width:none;transform:translateX(-2%);filter:drop-shadow(0 30px 35px rgba(0,48,100,.12))}
.ts-features{position:relative;margin-top:-58px;z-index:3}.ts-feature-grid{background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.9);box-shadow:var(--shadow);border-radius:22px;display:grid;grid-template-columns:repeat(4,1fr);padding:25px 20px}.ts-feature{padding:10px 26px;border-right:1px solid var(--line)}.ts-feature:last-child{border:0}.ts-feature b{display:block;color:var(--blue);text-transform:uppercase;margin-bottom:4px}.ts-feature i{font-style:normal;font-size:27px;color:var(--red)}
.ts-section{padding:100px 0}.ts-section-white{background:rgba(255,255,255,.48)}.ts-center{text-align:center;max-width:850px;margin:auto}.ts-title{font-size:clamp(36px,4vw,58px);line-height:1.05;color:var(--blue);margin:10px 0 22px;letter-spacing:-.03em}.ts-title span{color:var(--red)}.ts-intro{font-size:18px;color:var(--muted)}.ts-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:48px}.ts-card{background:rgba(255,255,255,.76);border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:0 10px 30px rgba(16,56,100,.05)}.ts-card h3{color:var(--blue);font-size:23px;margin:5px 0 12px}.ts-card-num{color:var(--red);font-weight:900;font-size:13px}.ts-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px}.ts-pillar{background:var(--blue);color:#fff;border-radius:18px;padding:30px}.ts-pillar:nth-child(even){background:var(--blue2)}.ts-pillar h3{font-size:21px}.ts-pillar p{color:#e6eef8}.ts-cta{background:linear-gradient(120deg,var(--blue),#294b35);color:#fff}.ts-cta .ts-title,.ts-cta .ts-eyebrow{color:#fff}.ts-cta .ts-intro{color:#dce9f8}.ts-footer{background:#203b2a;color:#d8e4f2;padding:38px 0}.ts-footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center}.ts-footer img{width:52px}.ts-footer-brand{display:flex;align-items:center;gap:12px;font-weight:900}
.ts-reveal-left,.ts-reveal-right,.ts-reveal-up{opacity:0;transition:.8s ease}.ts-reveal-left{transform:translateX(-35px)}.ts-reveal-right{transform:translateX(35px)}.ts-reveal-up{transform:translateY(28px)}.ts-visible{opacity:1;transform:none}
@media(max-width:900px){.ts-header{height:76px}.ts-shell{width:min(100% - 28px,var(--max))}.ts-brand img{width:48px;height:48px}.ts-brand-text strong{font-size:19px}.ts-brand-text small{display:none}.ts-menu{display:block}.ts-nav{display:none;position:absolute;top:76px;left:0;right:0;background:var(--cream);padding:25px;flex-direction:column;border-bottom:1px solid var(--line)}.ts-nav.open{display:flex}.ts-hero,.ts-hero-inner{min-height:auto}.ts-hero-inner{display:flex;flex-direction:column}.ts-visual{order:1;width:100%;height:390px;overflow:hidden}.ts-visual img{width:120%;transform:none}.ts-copy{order:2;padding:42px 28px 110px;width:100%}.ts-hero h1{font-size:50px}.ts-features{margin-top:-65px}.ts-feature-grid{grid-template-columns:1fr 1fr}.ts-feature:nth-child(2){border-right:0}.ts-feature{border-bottom:1px solid var(--line)}.ts-feature:nth-child(3),.ts-feature:nth-child(4){border-bottom:0}.ts-grid,.ts-pillars{grid-template-columns:1fr 1fr}.ts-section{padding:75px 0}}
@media(max-width:560px){.ts-brand-text strong{font-size:17px}.ts-visual{height:315px}.ts-visual img{width:140%}.ts-copy{padding-left:22px;padding-right:22px}.ts-hero h1{font-size:43px}.ts-lead{font-size:16px}.ts-feature-grid,.ts-grid,.ts-pillars{grid-template-columns:1fr}.ts-feature{border-right:0;border-bottom:1px solid var(--line)!important}.ts-feature:last-child{border-bottom:0!important}.ts-buttons{flex-direction:column}.ts-btn{width:100%}.ts-footer-inner{flex-direction:column;text-align:center}}
/* =========================================================
   TOKENIZZAZIONE.IT – HERO DESKTOP FINAL FIX
   ========================================================= */

@media (min-width: 901px) {

	.ts-hero {
		min-height: 700px;
		overflow: hidden;
	}

	.ts-hero-inner {
		width: min(1500px, calc(100% - 80px));
		margin: 0 auto;

		display: grid;
		grid-template-columns: 46% 54%;
		align-items: center;

		min-height: 700px;
	}

	/* HERO bez posuvnej animácie */
	.ts-hero .ts-reveal-left,
	.ts-hero .ts-reveal-right {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	/* LEVÝ BLOK */
	.ts-copy {
		width: 100% !important;
		min-width: 0 !important;

		padding: 65px 35px 65px 0 !important;

		position: relative;
		z-index: 3;
	}

	.ts-kicker {
		margin: 0 0 14px;
	}

	.ts-hero h1 {
		margin: 0 0 28px;

		font-size: clamp(52px, 4.25vw, 74px);
		line-height: .94;
		letter-spacing: -.045em;

		width: 100%;
		max-width: 660px;
	}

	.ts-hero h1 span {
		display: block;
		color: var(--red);
	}

	.ts-lead {
		width: 100%;
		max-width: 530px;

		font-size: 19px;
		line-height: 1.55;
	}

	/* PRAVÝ HERO OBRÁZOK */
	.ts-visual {
		width: 100%;
		min-width: 0;
		height: 700px;

		display: flex;
		align-items: center;
		justify-content: center;

		position: relative;
		z-index: 2;

		transform: none !important;
	}

	.ts-visual img {
		display: block;

		width: 112%;
		max-width: none;
		height: auto;

		transform: translateX(-2%) !important;

		filter: drop-shadow(
			0 30px 35px rgba(0,48,100,.12)
		);
	}
}
/* =========================================================
   TOKENIZZAZIONE.IT – POSTER POPUP
   ========================================================= */

.it-popup-open {
	overflow: hidden;
}

.it-poster-popup {
	position: fixed;
	inset: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 30px;

	opacity: 0;
	visibility: hidden;

	z-index: 999999;

	transition:
		opacity .3s ease,
		visibility .3s ease;
}

.it-poster-popup.is-active {
	opacity: 1;
	visibility: visible;
}


/* =========================================================
   BACKDROP
   ========================================================= */

.it-poster-backdrop {
	position: absolute;
	inset: 0;

	background: rgba(5, 15, 30, .76);

	backdrop-filter: blur(7px);
	-webkit-backdrop-filter: blur(7px);
}


/* =========================================================
   COUNTDOWN
   ========================================================= */

.it-poster-countdown {
	position: relative;
	z-index: 3;

	width: 220px;
	height: 220px;

	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	background: rgba(255,255,255,.97);

	border: 3px solid #e31d2f;
	border-radius: 50%;

	box-shadow:
		0 30px 80px rgba(0,0,0,.30);

	transition:
		opacity .35s ease,
		transform .35s ease;
}

.it-poster-countdown.is-hidden {
	opacity: 0;
	transform: scale(.8);
	pointer-events: none;
}

.it-countdown-label {
	margin-bottom: 5px;

	color: #164e88;

	font-size: 15px;
	font-weight: 900;

	letter-spacing: .08em;
}

.it-countdown-number {
	color: #e31d2f;

	font-size: 76px;
	font-weight: 900;

	line-height: 1;
	letter-spacing: -.05em;
}


/* START je širší než číslo */

.it-countdown-number:not(:empty) {
	text-align: center;
}


/* =========================================================
   POSTER WINDOW
   ========================================================= */

.it-poster-window {
	position: absolute;
	z-index: 4;

	max-width: min(520px, 82vw);
	max-height: 88vh;

	opacity: 0;

	transform:
		scale(.92)
		translateY(20px);

	pointer-events: none;

	transition:
		opacity .45s ease,
		transform .45s ease;
}

.it-poster-window.is-visible {
	opacity: 1;

	transform:
		scale(1)
		translateY(0);

	pointer-events: auto;
}

.it-poster-window img {
	display: block;

	width: auto;
	max-width: 100%;

	height: auto;
	max-height: 88vh;

	margin: auto;

	border-radius: 6px;

	box-shadow:
		0 35px 90px rgba(0,0,0,.45);
}


/* =========================================================
   CLOSE
   ========================================================= */

.it-poster-close {
	position: absolute;

	top: -17px;
	right: -17px;

	width: 42px;
	height: 42px;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 0;

	background: #ffffff;

	color: #20242b;

	border: 0;
	border-radius: 50%;

	font-size: 28px;
	font-weight: 400;

	line-height: 1;

	box-shadow:
		0 6px 20px rgba(0,0,0,.20);

	cursor: pointer;

	z-index: 5;
}

.it-poster-close:hover {
	background: #e31d2f;
	color: #ffffff;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.it-poster-popup {
		padding: 0;
	}

	.it-poster-backdrop {
		background: rgba(0,0,0,.92);
	}

	.it-poster-countdown {
		width: 180px;
		height: 180px;
	}

	.it-countdown-number {
		font-size: 62px;
	}

	.it-countdown-label {
		font-size: 13px;
	}


	/* téměř přes celý mobil */

	.it-poster-window {
		width: 100%;
		max-width: 100%;

		height: 100dvh;
		max-height: 100dvh;

		display: flex;
		align-items: center;
		justify-content: center;

		padding: 12px;
	}

	.it-poster-window img {
		width: auto;
		max-width: 100%;

		height: auto;
		max-height: calc(100dvh - 24px);

		border-radius: 0;
	}

	.it-poster-close {
		position: fixed;

		top: 14px;
		right: 14px;

		width: 44px;
		height: 44px;

		background: rgba(255,255,255,.95);

		z-index: 10;
	}

}
/* =========================================================
   TOKENIZZAZIONE.IT – LETÁK 5 SEKUND
   ========================================================= */

.it-popup-open {
	overflow: hidden;
}

.it-poster-popup {
	position: fixed;
	inset: 0;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 25px;

	background: transparent;

	opacity: 0;
	visibility: hidden;

	z-index: 999999;

	transition:
		opacity .25s ease,
		visibility .25s ease;
}

.it-poster-popup.is-active {
	opacity: 1;
	visibility: visible;
}


/* tmavé okolí */

.it-poster-backdrop {
	position: absolute;
	inset: 0;

	background: rgba(5, 12, 25, .78);

	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}


/* =========================================================
   LETÁK – PC
   ========================================================= */

.it-poster-window {
	position: relative;

	display: flex;
	align-items: center;
	justify-content: center;

	max-width: 480px;
	max-height: 90vh;

	z-index: 2;

	animation: huPosterIn .35s ease both;
}

.it-poster-window img {
	display: block;

	width: auto;
	max-width: 100%;

	height: auto;
	max-height: 90vh;

	border-radius: 5px;

	box-shadow:
		0 30px 80px rgba(0,0,0,.45);
}


/* =========================================================
   ZAVŘÍT
   ========================================================= */

.it-poster-close {
	position: absolute;

	top: -17px;
	right: -17px;

	width: 44px;
	height: 44px;

	display: flex;
	align-items: center;
	justify-content: center;

	padding: 0;

	background: #ffffff;
	color: #17202b;

	border: 0;
	border-radius: 50%;

	font-size: 29px;
	font-weight: 400;
	line-height: 1;

	cursor: pointer;

	box-shadow:
		0 5px 20px rgba(0,0,0,.25);

	z-index: 5;
}

.it-poster-close:hover {
	background: #e31d2f;
	color: #ffffff;
}


/* =========================================================
   ODPOČET 5 4 3 2 1
   ========================================================= */

.it-poster-timer {
	position: absolute;

	top: 12px;
	left: 12px;

	display: flex;
	align-items: center;
	justify-content: center;

	width: 40px;
	height: 40px;

	background: rgba(255,255,255,.94);
	color: #e31d2f;

	border-radius: 50%;

	font-size: 17px;
	font-weight: 900;

	box-shadow:
		0 4px 14px rgba(0,0,0,.18);

	z-index: 4;
}


/* =========================================================
   ANIMACE
   ========================================================= */

@keyframes huPosterIn {

	from {
		opacity: 0;
		transform: scale(.94);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}

}


/* =========================================================
   MOBILE – LETÁK TÉMĚŘ PŘES CELÝ DISPLEJ
   ========================================================= */

@media (max-width: 700px) {

	.it-poster-popup {
		padding: 8px;
	}

	.it-poster-backdrop {
		background: rgba(0,0,0,.9);
	}

	.it-poster-window {
		width: 100%;
		height: 100dvh;

		max-width: none;
		max-height: 100dvh;

		padding: 6px;
	}

	.it-poster-window img {
		width: auto;
		max-width: 100%;

		height: auto;
		max-height: calc(100dvh - 12px);

		border-radius: 0;
	}

	.it-poster-close {
		position: fixed;

		top: 12px;
		right: 12px;
	}

	.it-poster-timer {
		position: fixed;

		top: 12px;
		left: 12px;
	}

}
/* =========================================================
   TOKENIZZAZIONE.IT – HERO FEATURE BOXES
   ========================================================= */

.ts-features {
	padding: 0 0 70px;
}

.ts-feature-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);

	background: rgba(255,255,255,.94);

	border: 1px solid rgba(25,70,45,.08);
	border-radius: 20px;

	overflow: hidden;

	box-shadow:
		0 18px 50px rgba(20,50,35,.07);
}


/* =========================================================
   JEDNOTLIVÉ BLOKY
   ========================================================= */

.ts-feature-grid article {
	position: relative;

	display: flex;
	flex-direction: column;
	align-items: flex-start;

	min-height: 150px;

	padding: 30px 30px 28px;
}


/* oddělovací čára */

.ts-feature-grid article + article::before {
	content: "";

	position: absolute;

	left: 0;
	top: 25px;
	bottom: 25px;

	width: 1px;

	background: rgba(30,70,50,.12);
}


/* =========================================================
   NADPIS
   ========================================================= */

.ts-feature-grid article strong {
	display: block;

	width: 100%;

	margin: 0 0 12px;

	color: #153c29;

	font-size: 17px;
	font-weight: 800;
	line-height: 1.25;

	letter-spacing: -.01em;
}


/* =========================================================
   TEXT
   ========================================================= */

.ts-feature-grid article span {
	display: block;

	width: 100%;

	margin: 0;

	color: #58645d;

	font-size: 15px;
	font-weight: 400;
	line-height: 1.6;
}


/* =========================================================
   HOVER
   ========================================================= */

.ts-feature-grid article {
	transition:
		background .25s ease,
		transform .25s ease;
}

.ts-feature-grid article:hover {
	background: #ffffff;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

	.ts-feature-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	.ts-feature-grid article {
		min-height: 135px;
	}

	.ts-feature-grid article:nth-child(3)::before {
		display: none;
	}

	.ts-feature-grid article:nth-child(n+3) {
		border-top: 1px solid rgba(30,70,50,.10);
	}

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 700px) {

	.ts-features {
		padding-bottom: 45px;
	}

	.ts-feature-grid {
		grid-template-columns: 1fr;

		border-radius: 16px;
	}

	.ts-feature-grid article {
		min-height: auto;

		padding: 22px 24px;
	}

	.ts-feature-grid article + article::before {
		display: none;
	}

	.ts-feature-grid article + article {
		border-top: 1px solid rgba(30,70,50,.10);
	}

	.ts-feature-grid article strong {
		margin-bottom: 7px;

		font-size: 16px;
	}

	.ts-feature-grid article span {
		font-size: 14px;
		line-height: 1.55;
	}
}
/* =========================================================
   CTA + FOOTER – VÍCE PROSTORU
   ========================================================= */

.ts-cta {
	padding: 75px 0 80px;
}

.ts-cta-grid {
	align-items: center;
	gap: 60px;
}

.ts-cta .ts-title {
	margin-bottom: 22px;
}

.ts-cta .ts-intro {
	margin-bottom: 0;
}


/* FOOTER */

.ts-footer {
	padding: 38px 0;
}

.ts-footer-inner {
	min-height: 70px;
	align-items: center;
}


/* MOBILE */

@media (max-width: 700px) {

	.ts-cta {
		padding: 55px 0 60px;
	}

	.ts-cta-grid {
		gap: 30px;
	}

	.ts-footer {
		padding: 32px 0;
	}
}
/* =========================================================
   CTA – FINÁLNÍ ROZLOŽENÍ
   ========================================================= */

.ts-cta {
	padding: 65px 0;
	background: linear-gradient(120deg, var(--blue), #294b35);
	color: #fff;
}

.ts-cta-grid {
	display: grid;
	grid-template-columns: 1.7fr .7fr;
	align-items: center;
	gap: 70px;
}

.ts-cta .ts-eyebrow {
	margin: 0 0 14px;
}

.ts-cta .ts-title {
	margin: 0 0 20px;
}

.ts-cta .ts-intro {
	margin: 0;
}

/* pravý sloupec s tlačítkem */
.ts-cta-grid > div:last-child {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	height: 100%;
}


/* =========================================================
   FOOTER
   ========================================================= */

.ts-footer {
	padding: 34px 0;
}

.ts-footer-inner {
	min-height: 60px;
	display: grid;
	grid-template-columns: 1fr 1.4fr 1fr;
	align-items: center;
	gap: 40px;
}


/* MOBILE */
@media (max-width: 700px) {

	.ts-cta {
		padding: 50px 0;
	}

	.ts-cta-grid {
		grid-template-columns: 1fr;
		gap: 30px;
	}

	.ts-cta-grid > div:last-child {
		justify-content: flex-start !important;
	}

	.ts-footer {
		padding: 30px 0;
	}

	.ts-footer-inner {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}