/* APULIA App Intro V6 — lancement cinématographique */
.apulia-app-intro{
	--apulia-intro-orange:#f5a623;
	--apulia-intro-deep:#001D26;
	--apulia-intro-teal:#003F52;
	--apulia-intro-teal-light:#005E75;
	--apulia-intro-turquoise:#00A8A8;
	--apulia-intro-ivory:#fffaf3;
	--apulia-intro-ease:cubic-bezier(.22,.61,.36,1);
	--apulia-intro-fly:cubic-bezier(.16,.72,.18,1);
	--apulia-intro-z:2147483000;
	--m-depth:1;
	position:fixed;
	inset:0;
	z-index:var(--apulia-intro-z);
	overflow:hidden;
	pointer-events:auto;
	background:var(--apulia-intro-deep);
	perspective:1400px;
	-webkit-tap-highlight-color:transparent;
	touch-action:none;
}

.apulia-app-intro-scene{
	position:absolute;
	inset:0;
	transform-origin:50% 50%;
	transform-style:preserve-3d;
}

.apulia-app-intro-mapbox{
	position:absolute;
	inset:0;
	opacity:0;
	background:var(--apulia-intro-deep);
}
.apulia-app-intro--unveil .apulia-app-intro-mapbox{
	opacity:1;
	transition:opacity .88s cubic-bezier(.22,.61,.36,1);
}
.apulia-app-intro--unveil .apulia-app-intro-mapbox .maplibregl-canvas{
	filter:none;
}

.apulia-app-intro-veil{
	position:absolute;
	inset:0;
	z-index:2;
	pointer-events:none;
	background:radial-gradient(120% 92% at 50% 30%,#00627A 0%,#003F52 44%,#001D26 100%);
	opacity:1;
	transition:opacity .88s cubic-bezier(.22,.61,.36,1);
}

.apulia-app-intro--unveil .apulia-app-intro-veil{
	opacity:0;
}

.apulia-app-intro--map .apulia-app-intro-cam{
	display:none;
}

.apulia-app-intro-atmosphere,
.apulia-app-intro-seadepth,
.apulia-app-intro-sheen,
.apulia-app-intro-light,
.apulia-app-intro-matiere,
.apulia-app-intro-vignette{
	position:absolute;
	inset:0;
	pointer-events:none;
}

.apulia-app-intro-atmosphere{
	z-index:1;
	background:
		radial-gradient(120% 80% at 50% -10%,rgba(0,94,117,.22),transparent 54%),
		radial-gradient(90% 70% at 88% 30%,rgba(0,168,168,.05),transparent 46%);
	opacity:.55;
	transition:opacity .45s var(--apulia-intro-ease);
}

.apulia-app-intro-seadepth{
	z-index:1;
	background:radial-gradient(ellipse 80% 70% at 46% 48%,rgba(0,94,117,.12) 0%,rgba(0,29,38,0) 72%);
	opacity:.35;
	transition:opacity .45s var(--apulia-intro-ease);
}

.apulia-app-intro--unveil .apulia-app-intro-atmosphere,
.apulia-app-intro--unveil .apulia-app-intro-seadepth{
	opacity:0;
}

.apulia-app-intro-vignette{
	z-index:2;
	background:radial-gradient(78% 70% at 50% 44%,transparent 58%,rgba(0,29,38,.2) 100%);
	opacity:0;
	transition:opacity .55s var(--apulia-intro-ease);
}

.apulia-app-intro--unveil .apulia-app-intro-vignette{ opacity:1; }

.apulia-app-intro-sheen{
	background:linear-gradient(115deg,transparent 28%,rgba(234,243,245,.045) 46%,transparent 62%);
	opacity:0;
	transform:translate3d(-8%,0,0);
}

.apulia-app-intro-cam{
	position:absolute;
	inset:-18%;
	display:flex;
	align-items:center;
	justify-content:center;
	transform-origin:72% 66%;
	will-change:transform;
	transform:translate3d(6%,1%,0) scale(1.02) rotate(.35deg);
}

.apulia-app-intro-map{
	width:min(128vw,920px);
	height:auto;
	overflow:visible;
	opacity:0;
}

.apulia-app-intro-context{ fill:rgba(0,94,117,.16); }
.apulia-app-intro-sardinia,
.apulia-app-intro-sicily{
	fill:rgba(234,243,245,.11);
	stroke:rgba(234,223,206,.18);
	stroke-width:1;
}
.apulia-app-intro-italy{
	stroke:rgba(234,223,206,.28);
	stroke-width:1.15;
	stroke-linejoin:round;
}
.apulia-app-intro-coast{
	fill:none;
	stroke:rgba(255,250,243,.16);
	stroke-width:1.4;
	stroke-linecap:round;
}
.apulia-app-intro-gargano{ fill:rgba(255,250,243,.08); }
.apulia-app-intro-puglia{
	stroke:rgba(246,166,35,0);
	stroke-width:1.2;
	stroke-linejoin:round;
}
.apulia-app-intro-warm{ opacity:0; }
.apulia-app-intro-route{
	fill:none;
	stroke:var(--apulia-intro-orange);
	stroke-width:1.05;
	stroke-linecap:round;
	stroke-dasharray:420;
	stroke-dashoffset:420;
	opacity:0;
}
.apulia-app-intro-dest{
	fill:var(--apulia-intro-ivory);
	opacity:0;
}

.apulia-app-intro-light{
	background:radial-gradient(ellipse 42% 36% at 74% 64%,rgba(246,166,35,.16),transparent 68%);
	opacity:0;
}

.apulia-app-intro-matiere{
	background:
		linear-gradient(180deg,rgba(255,250,243,0) 54%,rgba(255,250,243,.045) 100%),
		repeating-linear-gradient(180deg,rgba(255,250,243,.015) 0 1px,transparent 1px 7px);
	opacity:0;
	clip-path:inset(18% 12% 14% 12%);
}

.apulia-app-intro-skip{
	position:absolute;
	top:max(12px, env(safe-area-inset-top, 0px));
	right:max(12px, env(safe-area-inset-right, 0px));
	z-index:20;
	pointer-events:auto;
	min-height:44px;
	min-width:44px;
	padding:10px 14px;
	margin:0;
	border:0;
	border-radius:999px;
	background:rgba(0,29,38,.42);
	color:#fffaf3;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
	font-size:14px;
	font-weight:600;
	letter-spacing:.02em;
	line-height:1.2;
	cursor:pointer;
	-webkit-tap-highlight-color:transparent;
	touch-action:manipulation;
}
.apulia-app-intro-skip:focus-visible{
	outline:2px solid #f5a623;
	outline-offset:3px;
}

.apulia-app-intro-sign{
	position:absolute;
	inset:0;
	z-index:4;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:max(28px, env(safe-area-inset-top, 0px)) 20px max(28px, env(safe-area-inset-bottom, 0px));
	opacity:1;
	transform:translate3d(0,-6.5vh,0);
	pointer-events:none;
	isolation:isolate;
}
.apulia-app-intro-sign::before{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	width:min(92vw, 420px);
	height:210px;
	transform:translate(-50%,-50%);
	background:radial-gradient(ellipse at center,rgba(0,29,38,.62) 0%,rgba(0,29,38,.28) 48%,transparent 74%);
	z-index:-1;
	pointer-events:none;
}

.apulia-app-intro--play .apulia-app-intro-sign{
	animation:none;
	opacity:1;
	transform:translate3d(0,-6.5vh,0);
}

.apulia-app-intro--logo-out .apulia-app-intro-sign{
	animation:none;
	opacity:0;
	transform:translate3d(0,calc(-6.5vh - 8px),0);
	transition:opacity .88s cubic-bezier(.22,.61,.36,1),transform .88s cubic-bezier(.22,.61,.36,1);
}

.apulia-app-intro-mark{
	margin:0;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
	font-size:clamp(30px,8.2vw,46px);
	font-weight:800;
	letter-spacing:.18em;
	color:#fff;
	text-shadow:0 2px 0 rgba(0,29,38,.25),0 8px 28px rgba(0,0,0,.55);
	opacity:0;
}
.apulia-app-intro--play .apulia-app-intro-mark{
	animation:apulia-app-intro-mark-in .55s var(--apulia-intro-ease) .08s forwards;
}
.apulia-app-intro--logo-out .apulia-app-intro-mark{
	animation:none;
	opacity:1;
}

.apulia-app-intro-rule{
	width:52px;
	height:3.5px;
	margin:13px auto 0;
	border-radius:99px;
	background:var(--apulia-intro-orange);
	box-shadow:0 0 12px rgba(245,166,35,.35);
	transform:scaleX(0);
	transform-origin:center;
}

.apulia-app-intro--play .apulia-app-intro-rule{
	animation:apulia-app-intro-rule .7s var(--apulia-intro-ease) .32s forwards;
}

.apulia-app-intro--logo-out .apulia-app-intro-rule{
	animation:none;
	transform:scaleX(1);
}

.apulia-app-intro-tag{
	margin:13px 0 0;
	max-width:min(90vw, 22.6em);
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
	font-size:clamp(13px,3.45vw,15px);
	font-weight:600;
	letter-spacing:.02em;
	line-height:1.38;
	text-transform:none;
	text-wrap:balance;
	color:rgba(255,250,243,.94);
	text-shadow:0 1px 0 rgba(0,29,38,.3),0 2px 12px rgba(0,0,0,.5);
	opacity:0;
}
.apulia-app-intro--play .apulia-app-intro-tag{
	animation:apulia-app-intro-tag-in .68s var(--apulia-intro-ease) .62s forwards;
}
.apulia-app-intro--logo-out .apulia-app-intro-tag{
	animation:none;
	opacity:1;
}

.apulia-app-intro-m{
	pointer-events:none;
	opacity:0;
	transform:scale(calc(.42 * var(--m-depth, 1))) translateY(6px);
	transition:opacity .4s var(--apulia-intro-ease),transform .5s cubic-bezier(.18,.9,.32,1.2);
}
.apulia-app-intro-m.is-in{
	opacity:1;
	transform:scale(var(--m-depth, 1)) translateY(0);
}

.apulia-app-intro-m--dot{
	width:8px;
	height:8px;
	border-radius:50%;
	background:var(--c,#f5a623);
	border:1.5px solid #fff;
	box-shadow:0 1px 6px rgba(0,0,0,.38);
}

.apulia-app-intro-m--photo{
	display:flex;
	flex-direction:column;
	align-items:center;
	width:64px;
	margin-bottom:-2px;
}

.apulia-app-intro-m-ring{
	display:block;
	width:30px;
	height:30px;
	border-radius:50%;
	overflow:hidden;
	border:2px solid #fff;
	box-shadow:0 3px 10px rgba(0,0,0,.4),0 0 0 1.5px var(--c,#f5a623);
	background:var(--apulia-intro-teal);
}

.apulia-app-intro-m-ring img{
	width:100%;
	height:100%;
	object-fit:cover;
	display:block;
}

.apulia-app-intro-m-name{
	margin-top:4px;
	max-width:64px;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,system-ui,sans-serif;
	font-size:9.5px;
	font-weight:700;
	letter-spacing:.03em;
	line-height:1.15;
	color:#fff;
	text-align:center;
	text-shadow:0 1px 3px rgba(0,0,0,.75),0 0 8px rgba(0,29,38,.55);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}

.apulia-app-intro--map .maplibregl-ctrl-top-left,
.apulia-app-intro--map .maplibregl-ctrl-top-right,
.apulia-app-intro--map .maplibregl-ctrl-bottom-left,
.apulia-app-intro--map .maplibregl-ctrl-logo,
.apulia-app-intro--map .maplibregl-ctrl-scale,
.apulia-app-intro--map .maplibregl-ctrl-compass,
.apulia-app-intro--map .maplibregl-ctrl-zoom,
.apulia-app-intro--map .maplibregl-ctrl-attrib-inner{
	display:none !important;
}
.apulia-app-intro--map .maplibregl-ctrl-bottom-right{
	right:0;
	bottom:0;
	z-index:3;
}
.apulia-app-intro--map .maplibregl-ctrl-attrib{
	font-size:8px;
	line-height:1.2;
	color:rgba(255,250,243,.55);
	background:transparent;
	box-shadow:none;
	margin:0 4px calc(6px + env(safe-area-inset-bottom, 0px)) 0;
}
.apulia-app-intro--map .maplibregl-ctrl-attrib a{
	color:rgba(255,250,243,.62);
	text-decoration:none;
}
.apulia-app-intro--map .maplibregl-ctrl-attrib.maplibregl-compact,
.apulia-app-intro--map .maplibregl-ctrl-attrib.maplibregl-compact-show{
	background:transparent !important;
	margin:4px;
	min-height:18px;
	max-width:22px;
	padding:0 18px 0 0;
	opacity:.42;
	box-shadow:none !important;
}
.apulia-app-intro--map .maplibregl-ctrl-attrib-button{
	width:18px;
	height:18px;
	background-color:rgba(0,29,38,.28);
	border-radius:50%;
	background-repeat:no-repeat;
	background-position:center;
	background-size:12px 12px;
	background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='%23ffffff' fill-rule='evenodd' viewBox='0 0 20 20'%3E%3Cpath d='M4 10a6 6 0 1 0 12 0 6 6 0 1 0-12 0m5-3a1 1 0 1 0 2 0 1 1 0 1 0-2 0m0 3a1 1 0 1 1 2 0v3a1 1 0 1 1-2 0'/%3E%3C/svg%3E");
}

.apulia-app-intro--play .apulia-app-intro-map{
	animation:apulia-app-intro-mapin .7s var(--apulia-intro-ease) .08s forwards;
}
.apulia-app-intro--play .apulia-app-intro-atmosphere{
	animation:none;
}
.apulia-app-intro--play .apulia-app-intro-seadepth{
	animation:none;
}
.apulia-app-intro--play .apulia-app-intro-sheen{
	animation:apulia-app-intro-sheen 4.15s var(--apulia-intro-ease) forwards;
}
.apulia-app-intro--svg.apulia-app-intro--play .apulia-app-intro-cam{
	animation:apulia-app-intro-cam 4.15s var(--apulia-intro-fly) forwards;
}
.apulia-app-intro--play .apulia-app-intro-route{
	animation:apulia-app-intro-route 2.35s var(--apulia-intro-ease) 1.15s forwards;
}
.apulia-app-intro--play .apulia-app-intro-warm{
	animation:apulia-app-intro-fadein .9s var(--apulia-intro-ease) 2.85s forwards;
}
.apulia-app-intro--play .apulia-app-intro-puglia{
	animation:apulia-app-intro-heel 1s var(--apulia-intro-ease) 2.75s forwards;
}
.apulia-app-intro--play .apulia-app-intro-dest{
	animation:apulia-app-intro-dest .6s var(--apulia-intro-ease) 3.15s forwards;
}
.apulia-app-intro--play .apulia-app-intro-light{
	animation:apulia-app-intro-fadein 1s var(--apulia-intro-ease) 2.9s forwards;
}
.apulia-app-intro--play .apulia-app-intro-matiere{
	animation:apulia-app-intro-paper .85s var(--apulia-intro-ease) 3.25s forwards;
}

.apulia-app-intro--open .apulia-app-intro-scene{
	animation:apulia-app-intro-reveal .48s var(--apulia-intro-ease) forwards;
}

.apulia-app-intro--reduced .apulia-app-intro-map,
.apulia-app-intro--reduced .apulia-app-intro-light,
.apulia-app-intro--reduced .apulia-app-intro-matiere,
.apulia-app-intro--reduced .apulia-app-intro-sign,
.apulia-app-intro--reduced .apulia-app-intro-rule,
.apulia-app-intro--reduced .apulia-app-intro-mark,
.apulia-app-intro--reduced .apulia-app-intro-tag{
	animation:none;
	opacity:1;
	transform:none;
}
.apulia-app-intro--reduced .apulia-app-intro-cam{
	transform:translate3d(-24%,12%,0) scale(2.55) rotate(-3.8deg);
}
.apulia-app-intro--reduced .apulia-app-intro-route,
.apulia-app-intro--reduced .apulia-app-intro-sheen,
.apulia-app-intro--reduced .apulia-app-intro-dest{
	opacity:.55;
	animation:none;
	stroke-dashoffset:0;
}

@keyframes apulia-app-intro-mapin{ to{ opacity:1; } }
@keyframes apulia-app-intro-fadein{ to{ opacity:1; } }
@keyframes apulia-app-intro-atm{
	0%{ transform:translate3d(0,0,0) scale(1); }
	100%{ transform:translate3d(-3%,1%,0) scale(1.06); }
}
@keyframes apulia-app-intro-sea{
	0%{ transform:translate3d(0,0,0) scale(1); }
	100%{ transform:translate3d(-8%,3%,0) scale(1.14); }
}
@keyframes apulia-app-intro-sheen{
	0%{ opacity:0; transform:translate3d(-12%,0,0); }
	22%{ opacity:.7; }
	100%{ opacity:.25; transform:translate3d(10%,4%,0); }
}
@keyframes apulia-app-intro-cam{
	0%{ transform:translate3d(6%,1%,0) scale(1.02) rotate(.35deg); }
	14%{ transform:translate3d(3%,0,0) scale(1.18) rotate(.1deg); }
	36%{ transform:translate3d(-7%,-2%,0) scale(1.62) rotate(-1.4deg); }
	62%{ transform:translate3d(-20%,8%,0) scale(2.28) rotate(-3.4deg); }
	84%{ transform:translate3d(-27%,13%,0) scale(2.82) rotate(-4.6deg); }
	100%{ transform:translate3d(-30%,15%,0) scale(3.12) rotate(-5deg); }
}
@keyframes apulia-app-intro-route{
	0%{ opacity:0; stroke-dashoffset:420; }
	12%{ opacity:.88; }
	100%{ opacity:.72; stroke-dashoffset:0; }
}
@keyframes apulia-app-intro-heel{ to{ stroke:rgba(246,166,35,.34); } }
@keyframes apulia-app-intro-dest{ to{ opacity:.85; } }
@keyframes apulia-app-intro-paper{ to{ opacity:1; clip-path:inset(8% 6% 8% 6%); } }
@keyframes apulia-app-intro-sign-in{
	to{ opacity:1; transform:translate3d(0,0,0); }
}
@keyframes apulia-app-intro-mark-in{
	from{ opacity:0; transform:translate3d(0,6px,0); }
	to{ opacity:1; transform:translate3d(0,0,0); }
}
@keyframes apulia-app-intro-tag-in{
	from{ opacity:0; transform:translate3d(0,5px,0); }
	to{ opacity:1; transform:translate3d(0,0,0); }
}
@keyframes apulia-app-intro-rule{ to{ transform:scaleX(1); } }
@keyframes apulia-app-intro-reveal{
	to{ opacity:0; transform:translate3d(0,-1.5%,0) scale(1.02); }
}

@media (max-width:390px){
	.apulia-app-intro-mark{
		letter-spacing:.16em;
		font-size:clamp(28px,8vw,40px);
	}
	.apulia-app-intro-tag{
		max-width:24.8em;
		font-size:13px;
		letter-spacing:.018em;
		line-height:1.4;
	}
	.apulia-app-intro-m-ring{ width:28px; height:28px; }
	.apulia-app-intro-m--photo{ width:58px; }
	.apulia-app-intro-m-name{ max-width:58px; font-size:9px; }
}

@media (max-height:640px){
	.apulia-app-intro-m-ring{ width:28px; height:28px; }
	.apulia-app-intro-m--photo{ width:58px; }
}

@media (orientation:landscape) and (max-height:500px){
	.apulia-app-intro-cam{ inset:-28%; }
	.apulia-app-intro-mark{ font-size:clamp(24px,6vh,36px); }
	.apulia-app-intro-tag{ font-size:12px; max-width:28em; }
	.apulia-app-intro-m-name{ display:none; }
}

@media (min-width:1025px){
	.apulia-app-intro-map{ width:min(92vw,980px); }
	.apulia-app-intro-m-ring{ width:34px; height:34px; }
	.apulia-app-intro-m--photo{ width:72px; }
	.apulia-app-intro-m-name{ font-size:10.5px; max-width:72px; }
	.apulia-app-intro-tag{ max-width:26em; }
}

@media (prefers-reduced-motion:reduce){
	.apulia-app-intro--play .apulia-app-intro-cam,
	.apulia-app-intro--play .apulia-app-intro-atmosphere,
	.apulia-app-intro--play .apulia-app-intro-seadepth,
	.apulia-app-intro--play .apulia-app-intro-sheen,
	.apulia-app-intro--play .apulia-app-intro-route{
		animation:none;
	}
}