/* ========= Fonts ========= */

@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900');
/* font-family: 'Montserrat', sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..900;1,6..96,400..900&display=swap');
/* font-family: "Bodoni Moda", serif; */

.font-bodoni {font-family: "Bodoni Moda", serif; letter-spacing: -1px;}
.font-montserrat {font-family: 'Montserrat', sans-serif;}

/* ------------------------------ */
/* CONFIG                         */
/* ------------------------------ */

:root{
	--brand-900: #0b4a6f; /* deep blue */
	--brand-700: #14668b;
	--accent: #f6a623; /* warm accent */
	--muted: #6c757d;
	--bg-soft: #f7fbfc;
	--card-radius: 6px;
}

/*html,body{height:100%;}*/

body{
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
		font-family: 'Montserrat', sans-serif;
	background:var(--bg-soft); 
	color:#0b2233;
	font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
	color: var(--brand-900);
	letter-spacing: -0.5px;
}

a {
	text-decoration:none;
	font-weight: 500;
}

b {
	font-weight: 600;
}

/* ------------------------------ */
/* COLORS                         */
/* ------------------------------ */

.text-brand-700 {color: var(--brand-700)!important;}
.text-brand-900 {color: var(--brand-900)!important;}
.bg-brand-700 {background-color: var(--brand-700)!important;}
.bg-brand-900 {background-color: var(--brand-900)!important;}

.text-accent {color: var(--accent)!important;}
.bg-accent {background-color: var(--accent)!important;}
.bg-muted {background-color: var(--muted)!important;}

.bg-white-25 {background-color: rgba(255,255,255,0.25)!important;}
.bg-white-50 {background-color: rgba(255,255,255,0.5)!important;}
.bg-white-75 {background-color: rgba(255,255,255,0.75)!important;}

/* ------------------------------ */
/* UTILITY                        */
/* ------------------------------ */

/* Font Weight */
.fw-300 {font-weight: 300!important;}
.fw-400 {font-weight: 400!important;}
.fw-500 {font-weight: 500!important;}
.fw-600 {font-weight: 600!important;}
.fw-700 {font-weight: 700!important;}
.fw-800 {font-weight: 800!important;}
.fw-900 {font-weight: 900!important;}

/* Object Fit */
.obj-cover {-o-object-fit: cover;object-fit: cover;}
.obj-contain {-o-object-fit: contain;object-fit: contain;}

/* Object Position */
.obj-pos-tl {-o-object-position: top left;object-position: top left;}
.obj-pos-tc {-o-object-position: top center;object-position: top center;}
.obj-pos-tr {-o-object-position: top right;object-position: top right;}
.obj-pos-cl {-o-object-position: center left;object-position: center left;}
.obj-pos-cc {-o-object-position: center center;object-position: center center;}
.obj-pos-cr {-o-object-position: center right;object-position: center right;}
.obj-pos-bl {-o-object-position: bottom left;object-position: bottom left;}
.obj-pos-bc {-o-object-position: bottom center;object-position: bottom center;}
.obj-pos-br {-o-object-position: bottom right;object-position: bottom right;}

/* Padding */
.p-2rem {padding: 2rem!important;}

/* ------------------------------ */
/* HERO                           */
/* ------------------------------ */

/* Hero con parallax scrolling e overlay */
.hero {
	position: relative;
	min-height: 50vh;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	padding: 4rem 0;
	overflow: hidden;
}
.hero.parallax {
	position: relative;
	min-height: 50vh;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	padding: 4rem 0;
	overflow: hidden;
}
.hero-background {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	/*background-image: url('img/bg-4.jpg');*/
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 1;
	transform: translateY(0);
	will-change: transform;
}
/* Overlay sfumato per migliorare leggibilità */
.hero-overlay {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background: linear-gradient(to bottom, rgba(11,74,111,0.5), rgba(20,102,139,0.3));
		background: linear-gradient(to bottom, rgba(11,74,111,0.85), rgba(20,102,139,0.3));
		mix-blend-mode:normal;
	z-index: 2;
	pointer-events: none;
}
.hero-content {
	position: relative;
	z-index: 3;
	text-align: left;
	max-width: 800px;
	padding: 2rem;
}

/* Decorative CAA pattern (subtle) */
.caa-pattern{
	position:absolute; right:-6%; top:-6%; width:50vmax; height:50vmax; opacity:.06; pointer-events:none; transform: rotate(18deg);
}

/* Cards CUSTOM */
.card-custom{
	border:none; 
	border-radius:var(--card-radius); 
	box-shadow: 0 6px 20px rgba(2,6,23,.06);
	transition: all 0.3s ease-in-out;
}

.card-custom img.img-zoom{
	transform: scale(1.0);
	transition: all 0.3s ease-in-out;
}
.card-custom:hover img.img-zoom{
	transform: scale(1.2);
}

/* Cards FIGURE */
.card-figure{
	border:none;
	background-color: transparent;
	border-radius:var(--card-radius); 
	/*box-shadow: 0 6px 20px rgba(2,6,23,.06);*/
	transition: all 0.3s ease-in-out;
	overflow: hidden;
}
.card-figure img{
	transform: scale(1.15);
}

/* CTA */
.btn-accent{background:var(--accent); color:#06202a; border:0; font-weight:600}
.btn-accent:focus{box-shadow:0 0 0 .25rem rgba(246,166,35,.18)}

/* CAA mode: show symbol badges next to headings */
/*.caa-badge{display:inline-flex; align-items:center; gap:.5rem}
.caa-symbol{width:44px; height:44px; flex:0 0 44px; border-radius:8px; background: #fff; align-items:center; justify-content:center; display:inline-flex; box-shadow:0 3px 10px rgba(2,6,23,.06)}*/

/*.caa-mode .with-caa::before{content:''; display:inline-block; width:14px; height:14px; margin-right:.5rem}*/
/* .caa-mode shows svg elements that are normally hidden */
/*.caa-symbol[data-hidden="true"]{display:none}*/

/* Footer */
footer {
	background:#fff; 
	/*border-top:1px solid rgba(2,6,23,.04);*/
}

/* Animations: Respect reduced-motion */
@media (prefers-reduced-motion: reduce){
	*{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important}
}

/* Simple entrance animation */
/*.reveal{opacity:0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease}
.reveal.visible{opacity:1; transform:none}*/

/* Focus styles for keyboard users on custom elements */
.focus-outline:focus{outline:3px solid rgba(20,102,139,.20); outline-offset:3px}

/* Responsive tweaks */
@media (min-width: 992px){
	.hero{padding:4rem 0}
	/*.caa-symbol{width:54px; height:54px}*/
}


.card-caa { 
	min-width: 10rem;
	max-width: 10rem;
	text-align: center;
	border-color: #333;
	box-shadow: 0 0 0 0.25rem rgba(51,51,51,.1);
}
.card-caa h6 { 
	font-size: 0.875rem;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	color: #333;
	white-space: nowrap;
	overflow: hidden;
}

/* ------------------------------ */
/* PAGE LOADER                    */
/* ------------------------------ */

.fw-page-loader {
	position: fixed;
	display: flex;
	align-items: center;
	justify-content: center;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0;
	height: 100%;
	background-color: var(--bg-soft);
	z-index: 9999;
}

/* ------------------------------ */
/* SPINNER                        */
/* ------------------------------ */
/* https://codepen.io/zapdev/pen/MYJRaj */

.fw-spinner {
  width: 96px;
  height: 96px;
	position: absolute;
}

.fw-spinner svg {
  animation: rotate 1.5s linear infinite;
  height: 100%;
  width: 100%;
}

.fw-spinner circle {
  stroke-dasharray: 1,200;
  stroke-dashoffset: 0;
  animation: 
    dash 1.5s ease-in-out infinite 0s, 
    color 6s ease-in-out infinite -0.75s;
  stroke-linecap: round;
  fill: none;
  stroke-width:2;
}

@keyframes rotate {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124;
  }
}
@keyframes color {
  /*100%, 0% { stroke: #4285F4; }
  25% { stroke: #DE3E35; }
  50% { stroke: #F7C223; }
  75% { stroke: #1DA760; }*/
	
	100%, 0% { stroke: var(--brand-900); }
	25% { stroke: var(--brand-900); }
  50% { stroke: var(--brand-900); }
	75% { stroke: var(--brand-900); }
}

/* ------------------------------ */
/* BOOTSTRAP                      */
/* ------------------------------ */

.navbar-nav {
	--bs-nav-link-font-weight: 500;
}

.navbar-brand {
 font-size: 1rem;
}

.btn {
	--bs-btn-font-weight: 600;
	--bs-btn-font-size: 0.875rem;
	text-transform: uppercase;
}

.btn-group-lg > .btn, .btn-lg {
	--bs-btn-font-size: 1.0rem;
}

.btn-group-sm > .btn, .btn-sm {
	--bs-btn-font-size: 0.750rem;
}

.btn.rounded-pill {
	padding: var(--bs-btn-padding-y) calc(var(--bs-btn-padding-x) * 2);
}

.lead {
	font-size: 1rem;
	font-weight: 400;
}
@media (min-width: 992px){
	.lead {
    font-size: 1.25rem;
    font-weight: 400;
	}
}

.ratio-2x3 {
    --bs-aspect-ratio: calc(141.38% / 2);
}
.ratio-2x3::before {
    content: "";
    display: block;
    padding-bottom: var(--bs-aspect-ratio);
}