:root{
  /* Corporate palette inspired by modern web design trends */
  --brand: #013a63;
  --brand-2: #005a8a;
  --accent: #00a6fb;
}
*{box-sizing:border-box}
/* Media default safety for images and media */
img, svg, video{ max-width:100%; height:auto; }
a{color:var(--brand);text-decoration:none}
a:hover{color:var(--brand-2)}
.btn{display:inline-flex;align-items:center;gap:.5rem;border-radius:1rem;padding:.75rem 1.25rem;background:var(--brand);color:#fff}
.btn:hover{background:var(--brand-2)}
.btn-outline{display:inline-flex;align-items:center;gap:.5rem;border-radius:1rem;padding:.5rem 1rem;border:1px solid var(--brand);color:var(--brand)}
.btn-outline:hover{background:var(--brand);color:#fff}
.chip{display:inline-flex;align-items:center;border-radius:999px;padding:.25rem .75rem;font-size:.875rem;background:rgba(1,58,99,.05);color:var(--brand)}
.chip{font-weight:600}
.container{max-width:1100px;margin:0 auto;padding:1.25rem}
/* Prevent accidental horizontal scroll from long tokens */
.card p, .card li, .card a{ overflow-wrap:anywhere; }
.header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,0.9);backdrop-filter:saturate(180%) blur(6px);border-bottom:1px solid #e5e7eb}
.footer{border-top:1px solid #e5e7eb;color:#64748b}
.nav a{margin-right:1rem;font-size:.95rem}
.hero{position:relative;min-height:60vh;display:flex;align-items:center;justify-content:center;color:#0f172a}
/* Replace default hero backgrounds with a custom abstract image */
.hero::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background:linear-gradient(180deg, rgba(1,58,99,0.4), rgba(0,90,138,0.4));
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background-image:url('hero-custom.png');
  background-size:cover;background-position:center;opacity:0.35;
}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:1rem;padding:1.25rem;transition:transform .3s, box-shadow .3s;}
.card.show{transform:translateY(0)}
.card:hover{transform:translateY(-4px);box-shadow:0 10px 15px rgba(0,0,0,.1)}
.muted{color:#64748b}
.breadcrumbs{font-size:.9rem;color:#64748b;margin:1rem 0}
.breadcrumbs a{color:inherit}

/* Fade-in utility class for other elements */
.fade-in{transition:opacity .6s ease,transform .6s ease}
.fade-in.show{}

/* Utilities */
.text-brand{color:var(--brand)}
.text-justify{text-align:justify}

/* Spacing utility for consecutive paragraphs */
.para-spaced > p + p{ margin-top: 1rem; }

/* Home fold optimization */
.home .skyline-hero{ min-height: 200px; }
.home .hero{ min-height: unset; padding: 1rem 0 .5rem; }
.home .hero-title{ font-size: clamp(1.75rem, 2.2vw + 1rem, 2.25rem); }

/* Compact cards on home to keep fold tight */
.home-cards .card{ padding: .9rem; }
.home-cards .grid{ gap: .75rem !important; }

/* Animated site-wide background representing Italian industry */
body::before{
  content:"";position:fixed;inset:0;z-index:-10;pointer-events:none;
  background:
    radial-gradient(1200px 600px at 15% 10%, rgba(0,166,251,.18), transparent 60%),
    radial-gradient(900px 500px at 85% 20%, rgba(1,58,99,.14), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.90));
}
body::after{
  content:"";position:fixed;left:0;right:0;top:0;bottom:0;z-index:-11;pointer-events:none;
  background-image: url('bg-skyline.svg');
  background-size: 1200px auto;
  background-repeat: repeat-x;
  background-position: 0 100%;
  opacity:.65;
  animation: skyline-scroll 60s linear infinite;
}

@keyframes skyline-scroll{
  from{ background-position: 0 100%; }
  to{ background-position: -1200px 100%; }
}

@media (max-width: 640px){
  body::after{
    opacity:.45;
    background-size: 900px auto;
    animation-duration: 90s;
  }
}

/* Banner clearly visible on non-hero pages */
.skyline-hero{
  position: relative;
  min-height: 200px;
  background-image: url('bg-skyline-italia.svg');
  background-size: 1200px auto;
  background-repeat: repeat-x;
  background-position: 0 100%;
  animation: skyline-scroll 50s linear infinite;
  border-bottom: 1px solid #e5e7eb;
}

/* Accessibility helpers */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:16px;top:16px;width:auto;height:auto;padding:.5rem .75rem;background:#fff;border:1px solid #e5e7eb;border-radius:.5rem;z-index:50}

/* Back to top button */
.back-to-top{position:fixed;right:16px;bottom:16px;width:44px;height:44px;border-radius:999px;background:var(--brand);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 16px rgba(0,0,0,.15);opacity:0;pointer-events:none;transition:opacity .2s, transform .2s;z-index:50}
.back-to-top.show{opacity:1;pointer-events:auto;transform:translateY(0)}
.back-to-top:hover{background:var(--brand-2)}

/* About page compaction for above-the-fold visibility */
.about .skyline-hero{ min-height: 260px; }
.about-container{ padding-top: .75rem; padding-bottom: 1rem; }
.about-compact .card{ padding: .75rem; }
.about-compact .grid{ gap: .9rem; }

/* Callout + bullets for About description */
.callout{ border-radius: 1rem; padding: .9rem 1rem; border:1px solid #e5e7eb; background: #ffffff; }
.callout--brand{ background: rgba(0,166,251,.06); border-color: rgba(1,58,99,.15); }
.bullets{ list-style: none; margin: 0; padding: 0; }
.bullets li{ position: relative; padding-left: 1.25rem; margin: .35rem 0; }
.bullets li::before{ content: ""; position: absolute; left: 0; top: .55em; width: .5rem; height: .5rem; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 2px rgba(0,166,251,.18); }
.tight{ line-height: 1.4; }

/* --- About page visual enhancements (no content changes) --- */
.about .container{ position: relative; }
.about h1{
  letter-spacing: .2px;
}
.about h1::after{
  content: ""; display:block; width:72px; height:4px; margin:.5rem 0 0 0; border-radius:4px;
  background: linear-gradient(90deg, var(--brand), var(--accent));
}
.about h2{
  position: relative; padding-left: .75rem;
}
.about h2::before{
  content: ""; position:absolute; left:0; top:.55em; width:.35rem; height:.35rem; border-radius:50%; background: var(--accent);
  box-shadow: 0 0 0 4px rgba(0,166,251,.18);
}
.about .callout{
  border-left:4px solid var(--brand);
  box-shadow: 0 6px 12px rgba(1,58,99,.08);
}
.about .chip{
  background: rgba(1,58,99,.06);
  font-weight:600;
}
.about .card{
  position: relative;
  box-shadow: 0 6px 12px rgba(0,0,0,.04);
}
.about .card::before{
  content:""; position:absolute; left:0; top:0; height:3px; width:0; border-top-left-radius:1rem; border-top-right-radius:1rem;
  background: linear-gradient(90deg, var(--brand), var(--accent)); transition: width .4s ease;
}
.about .card:hover::before{ width:100%; }
.about .card:hover{ box-shadow: 0 12px 20px rgba(0,0,0,.08); }
.about .bullets li{ color:#0f172a; }

/* About icons on methodology cards */
.about .card[data-icon]::after{
  content:""; position:absolute; right:12px; top:12px; width:32px; height:32px;
  border-radius:50%; background:#fff; border:1px solid rgba(1,58,99,.15);
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
}
.about .card[data-icon="ricerca"]::after{ background-image:url('icons/research.svg'); }
.about .card[data-icon="esperienza"]::after{ background-image:url('icons/bank.svg'); }
.about .card[data-icon="risultati"]::after{ background-image:url('icons/results.svg'); }

/* Generic icon badges for cards (used on Home) */
.card[data-icon]{ position: relative; }
.home .card[data-icon]::after{
  content:""; position:absolute; right:12px; top:12px; width:32px; height:32px;
  border-radius:50%; background:#fff; border:1px solid rgba(1,58,99,.15);
  box-shadow: 0 2px 6px rgba(0,0,0,.06);
  background-repeat:no-repeat; background-position:center; background-size:18px 18px;
}
.home .card[data-icon="bi"]::after{ background-image:url('icons/research.svg'); }
.home .card[data-icon="credito"]::after{ background-image:url('icons/bank.svg'); }
.home .card[data-icon="esg"]::after{ background-image:url('icons/leaf.svg'); }

/* --- Mission page visual enhancements --- */
.mission .container{ position: relative; }
.mission h1{ letter-spacing:.2px; }
.mission h1::after{ content:""; display:block; width:72px; height:4px; margin:.5rem 0 0 0; border-radius:4px; background: linear-gradient(90deg, var(--brand), var(--accent)); }
.mission h2{ position:relative; padding-left:.75rem; }
.mission h2::before{ content:""; position:absolute; left:0; top:.55em; width:.35rem; height:.35rem; border-radius:50%; background: var(--accent); box-shadow:0 0 0 4px rgba(0,166,251,.18); }
.mission .chip{ background: rgba(1,58,99,.06); font-weight:600; }
.mission .card{ position:relative; box-shadow:0 6px 12px rgba(0,0,0,.04); }
.mission .card::before{ content:""; position:absolute; left:0; top:0; height:3px; width:0; border-top-left-radius:1rem; border-top-right-radius:1rem; background: linear-gradient(90deg, var(--brand), var(--accent)); transition: width .4s ease; }
.mission .card:hover::before{ width:100%; }
.mission .card:hover{ box-shadow:0 12px 20px rgba(0,0,0,.08); }
.mission .intro-callout{ border-left:4px solid var(--brand); box-shadow: 0 6px 12px rgba(1,58,99,.08); border-radius:1rem; padding:1rem; background:#fff; }
.mission .intro-figure{ border-radius:1rem; box-shadow:0 4px 8px rgba(0,0,0,.06); }
.mission .pdf-embed{ aspect-ratio: 210 / 297; width:100%; height:auto; border:0; }
.mission .card[data-icon]::after{ content:""; position:absolute; right:12px; top:12px; width:32px; height:32px; border-radius:50%; background:#fff; border:1px solid rgba(1,58,99,.15); box-shadow:0 2px 6px rgba(0,0,0,.06); background-repeat:no-repeat; background-position:center; background-size:18px 18px; }
.mission .card[data-icon="resilienza"]::after{ background-image:url('icons/shield.svg'); }
.mission .card[data-icon="efficienza"]::after{ background-image:url('icons/gear.svg'); }
.mission .card[data-icon="sostenibilita"]::after{ background-image:url('icons/leaf.svg'); }

/* Mission radial layout (sun) */
/* Simplified Mission layout: linear, readable cards */
.mission-sun{ display:grid; gap: 1rem; align-items:start; margin-top:.5rem; grid-template-columns: 1fr; }
.mission-sun::before{ display:none; }
.mission-core{ position:relative; z-index:auto; width:auto; background:#fff; border-radius:1rem; padding: 1rem 1rem; border:1px solid #e5e7eb; box-shadow:0 6px 12px rgba(0,0,0,.04); text-align:left; overflow:visible; }
.mission-core h2{ position:static; transform:none; padding:0; margin:0 0 .5rem 0; font-size:1.25rem; font-weight:700; }
.mission-core h2::before{ display:none; }
.mission-core-text{ padding: 0; max-height:none; overflow:visible; font-size:1rem; line-height:1.6; max-width: 100%; margin: 0; }
.mission-core-text p + p{ margin-top:.5rem; }
.mission .pad{ position:static; width:auto; aspect-ratio:auto; border-radius:1rem; display:block; text-align:left; z-index:auto; }
.mission .pad h3{ margin:0; }
.mission .pad p{ font-size: 1rem; line-height:1.5; }
.mission .pad-1,.mission .pad-2,.mission .pad-3{ position:static; transform:none; }
/* Remove decorative rays */
.mission .ray{ display:none !important; }
.mission .footer{ margin-top: 24px; }

/* Three-column pads like home on medium+ screens */
@media (min-width: 768px){
  .mission-sun{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .mission-core{ grid-column: 1 / -1; }
}
@media (max-width: 1024px){
  .mission-sun{ display:block; min-height:unset; }
  .mission-sun::before{ display:none; }
  .mission .pad{ position:static; width:auto; aspect-ratio:auto; border-radius:1rem; margin-top:1rem; text-align:left; }
  .mission .ray{ display:none; }
  .mission-core{ width:auto; aspect-ratio:auto; border-radius:1rem; padding:1rem; }
  /* Reset absolute heading in core on mobile */
  .mission-core h2{ position: static; top:auto; left:auto; transform:none; font-size:1.25rem; margin: 0 0 .35rem 0; }
  .mission-core-text{ padding: 0; max-width: 100%; font-size: 1rem; }
  .mission .footer{ margin-top: 48px; }
}

/* Header nav wraps below logo on small screens */
@media (max-width: 720px){
  .header .container{ flex-wrap: wrap; }
  .header .nav{ width:100%; display:flex; flex-wrap: wrap; gap:.5rem 1rem; margin-top:.5rem; }
  .header .nav a{ margin-right:0; }
}

/* --- PMI page visual enhancements --- */
.pmi h1{ letter-spacing:.2px; }
.pmi h1::after{ content:""; display:block; width:72px; height:4px; margin:.5rem 0 0 0; border-radius:4px; background: linear-gradient(90deg, var(--brand), var(--accent)); }
.pmi h2{ position:relative; padding-left:.75rem; }
.pmi h2::before{ content:""; position:absolute; left:0; top:.55em; width:.35rem; height:.35rem; border-radius:50%; background: var(--accent); box-shadow:0 0 0 4px rgba(0,166,251,.18); }
.pmi .card{ position:relative; box-shadow:0 6px 12px rgba(0,0,0,.04); }
.pmi .card::before{ content:""; position:absolute; left:0; top:0; height:3px; width:0; border-top-left-radius:1rem; border-top-right-radius:1rem; background: linear-gradient(90deg, var(--brand), var(--accent)); transition: width .4s ease; }
.pmi .card:hover::before{ width:100%; }
.pmi .card:hover{ box-shadow:0 12px 20px rgba(0,0,0,.08); }
.pmi .intro-figure{ border-radius:1rem; box-shadow:0 4px 8px rgba(0,0,0,.06); }
.pmi .intro-figure.small{ max-height: 160px; object-fit: contain; }
.pmi .focus-note{ background: rgba(0,166,251,.08); border:1px solid rgba(1,58,99,.15); color:#0f172a; padding:.75rem 1rem; border-radius: .75rem; font-weight:600; }
.pmi .card[data-icon]::after{ content:""; position:absolute; right:12px; top:12px; width:32px; height:32px; border-radius:50%; background:#fff; border:1px solid rgba(1,58,99,.15); box-shadow:0 2px 6px rgba(0,0,0,.06); background-repeat:no-repeat; background-position:center; background-size:18px 18px; }
.pmi .card[data-icon="merito"]::after{ background-image:url('icons/research.svg'); }
.pmi .card[data-icon="agevolata"]::after{ background-image:url('icons/grant.svg'); }
.pmi .card[data-icon="ristrutturazione"]::after{ background-image:url('icons/gear.svg'); }
.pmi .card[data-icon="sostenibile"]::after{ background-image:url('icons/results.svg'); }
.pmi .card[data-icon="strategia"]::after{ background-image:url('icons/leaf.svg'); }
.pmi .card[data-icon="formazione"]::after{ background-image:url('icons/education.svg'); }

/* --- Large Corporate page visual enhancements --- */
.lc h1{ letter-spacing:.2px; }
.lc h1::after{ content:""; display:block; width:72px; height:4px; margin:.5rem 0 0 0; border-radius:4px; background: linear-gradient(90deg, var(--brand), var(--accent)); }
.lc h2{ position:relative; padding-left:.75rem; }
.lc h2::before{ content:""; position:absolute; left:0; top:.55em; width:.35rem; height:.35rem; border-radius:50%; background: var(--accent); box-shadow:0 0 0 4px rgba(0,166,251,.18); }
.lc .card{ position:relative; box-shadow:0 6px 12px rgba(0,0,0,.04); }
.lc .card::before{ content:""; position:absolute; left:0; top:0; height:3px; width:0; border-top-left-radius:1rem; border-top-right-radius:1rem; background: linear-gradient(90deg, var(--brand), var(--accent)); transition: width .4s ease; }
.lc .card:hover::before{ width:100%; }
.lc .card:hover{ box-shadow:0 12px 20px rgba(0,0,0,.08); }
.lc .card[data-icon]::after{ content:""; position:absolute; right:12px; top:12px; width:32px; height:32px; border-radius:50%; background:#fff; border:1px solid rgba(1,58,99,.15); box-shadow:0 2px 6px rgba(0,0,0,.06); background-repeat:no-repeat; background-position:center; background-size:18px 18px; }
.lc .card[data-icon="bi"]::after{ background-image:url('icons/research.svg'); }
.lc .card[data-icon="benchmark"]::after{ background-image:url('icons/results.svg'); }
.lc .card[data-icon="rischio"]::after{ background-image:url('icons/shield.svg'); }
.lc .card[data-icon="scf"]::after{ background-image:url('icons/bank.svg'); }
.lc .card[data-icon="esg"]::after{ background-image:url('icons/leaf.svg'); }
.lc .card[data-icon="formazione"]::after{ background-image:url('icons/education.svg'); }