/* ===== Font locali ===== */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(fonts/open-sans-400.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(fonts/open-sans-500.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(fonts/open-sans-600.ttf) format('truetype');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(fonts/open-sans-700.ttf) format('truetype');
}

@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/manrope-600.ttf) format('truetype');
}


/* ===== Stili del sito ===== */
/* MANUTENZIONE: colori e larghezza principale si modificano qui. */
:root{
  --copper:#07549f;
  --copper-light:#0b4683;
  --dark:#123453;
  --paper:#f4f7fa;
  --cement:#eaf0f5;
  --text:#123453;
  --muted:#536578;
  --width:1216px
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:95px
}
body{
  margin:0;
  color:var(--text);
  background:var(--paper);
  font-family:'Open Sans',system-ui,sans-serif;
  font-size:16px;
  line-height:1.6
}
a{
  color:inherit;
  text-decoration:none
}
img{
  display:block;
  max-width:100%
}
button{
  font:inherit;
  cursor:pointer
}
h1,h2,h3,p{
  margin:0
}
h1,h2,h3{
  font-family:'Manrope',system-ui,sans-serif;
  font-weight:600;
  line-height:1.12
}
em{
  color:var(--copper);
  font-style:normal
}
.container{
  width:min(var(--width),calc(100% - 64px));
  margin-inline:auto
}
.section{
  padding:112px 0
}
.eyebrow{
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--copper);
  font-size:14px;
  font-weight:600;
  letter-spacing:.25em;
  text-transform:none;
  margin-bottom:18px
}
.eyebrow:before{
  content:'';
  width:48px;
  height:2px;
  background:var(--copper);
  flex-shrink:0
}
h2{
  font-size:48px;
  margin-bottom:18px
}
.intro{
  max-width:580px;
  color:var(--muted);
  font-size:18px;
  margin-bottom:64px
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:12px 24px;
  background:var(--copper);
  color:white;
  font-weight:600;
  border:1px solid #72b6d8;
  border-radius:3px;
  transition:background .2s,transform .2s
}
.button:hover{
  background:var(--copper-light)
}
.button.compact{
  min-height:36px;
  padding:6px 20px;
  font-size:14px
}
.button.outline{
  background:transparent;
  border-color:#b9dcf0;
  color:#ffffff
}
.button.outline:hover{
  background:#ffffff16
}
.button.light-outline{
  background:transparent;
  color:var(--text);
  border-color:#536578
}
.button.light-outline:hover{
  background:#1234530a
}
.buttons{
  display:flex;
  gap:16px;
  flex-wrap:wrap
}
.brand{
  display:flex;
  align-items:center;
  gap:12px
}


header{
  position:fixed;
  inset:0 0 auto;
  z-index:10;
  transition:background .25s
}
header.scrolled{
  background:#123453;
  backdrop-filter:blur(12px);
  box-shadow:0 3px 14px #0002
}
.navigation{
  height:80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  color:white
}
.desktop-links{
  display:flex;
  gap:32px;
  font-size:14px;
  text-transform:uppercase
}
.desktop-links a{
  color:#e2ebf4;
  transition:color .2s
}
.desktop-links a:hover,.footer-links a:hover{
  color:#72b6d8
}
.nav-actions{
  display:flex;
  align-items:center;
  gap:16px;
  font-size:14px
}
.menu-button{
  display:none;
  border:0;
  background:transparent;
  color:white;
  font-size:28px;
  padding:8px
}
.mobile-menu{
  background:var(--dark);
  padding:24px 32px;
  border-top:1px solid #ffffff1a
}
.mobile-menu a{
  display:block;
  color:white;
  padding:8px 0
}
.mobile-menu .button{
  margin-top:8px
}
.hero{
  min-height:100svh;
  position:relative;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#123453;
  color:#ffffff
}
.hero-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover
}
.hero:before{
  content:'';
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg,#123453f2,#123453cc 50%,#12345366),linear-gradient(0deg,#12345399,transparent 50%,#1234534d)
}
.hero:after{
  content:'';
  position:absolute;
  bottom:0;
  inset-inline:0;
  height:96px;
  background:linear-gradient(transparent, #123453);
  z-index:2
}
.hero-content{
  position:relative;
  z-index:3;
  padding-top:120px;
  padding-bottom:130px
}
.hero h1{
  font-size:72px;
  line-height:1.1;
  margin:28px 0
}
.hero p{
  max-width:510px;
  font-size:20px;
  line-height:1.65;
  color:#ffffff;
  margin-bottom:40px
}
.hero .eyebrow{
  margin-bottom:0
}
.stats,.about,footer{
  background:var(--dark);
  color:white
}
.stats{
  padding:80px 0
}
.stats-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:48px
}
.stats strong{
  display:block;
  font:600 48px 'Manrope',system-ui,sans-serif;
  color:#72b6d8
}
.stats p{
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:14px;
  color:#d7e2ee;
  margin-top:8px
}
.service-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px
}
.service{
  padding:28px;
  background:white;
  border:1px solid #cfdae5;
  border-radius:3px;
  transition:transform .25s,border .25s,box-shadow .25s;
  position:relative
}
.service:hover{
  transform:translateY(-4px);
  border-color:color-mix(in srgb,var(--copper),transparent 70%);
  box-shadow:0 10px 20px #07549f0c
}
.service-media{
  position:relative;
  margin-bottom:20px
}
.service-photo{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4 / 3;
  object-fit:cover;
  object-position:center;
  border-radius:2px
}
.service-media .icon{
  position:absolute;
  top:12px;
  left:12px;
  margin:0;
  box-shadow:0 2px 8px #1234531f
}
.icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  color:var(--copper);
  background:#e2eff6;
  border-radius:3px;
  margin-bottom:16px;
  flex-shrink:0
}
.icon svg{
  width:24px;
  height:24px
}
.service h3{
  font-size:20px;
  margin-bottom:8px
}
.service p{
  font-size:15px;
  color:var(--muted);
  line-height:1.6
}
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center
}
.about-picture{
  position:relative;
  margin-bottom:24px
}
.about-picture img{
  width:100%;
  height:520px;
  object-fit:cover;
  border-radius:3px
}
.about-picture:after{
  content:'';
  position:absolute;
  inset:16px -16px -16px 16px;
  border:2px solid color-mix(in srgb,var(--copper),transparent 70%);
  z-index:0;
  pointer-events:none
}
.about-picture img,.experience{
  position:relative;
  z-index:1
}
.experience{
  position:absolute;
  left:-24px;
  bottom:-24px;
  background:var(--copper);
  padding:16px 24px;
  box-shadow:0 10px 25px #0003;
  border-radius:3px
}
.experience strong{
  display:block;
  font:600 32px 'Manrope',system-ui,sans-serif
}
.experience span{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.08em
}
.about p{
  color:#d7e2ee;
  margin:24px 0;
  font-size:18px;
  line-height:1.7
}
.about p+p{
  font-size:16px;
  color:#d7e2ee
}
.about p strong{
  color:#fff
}
.features{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  list-style:none;
  padding:0;
  margin:32px 0 0
}
.features li{
  display:flex;
  gap:8px;
  font-size:14px;
  color:#e2ebf4
}
.features li:before{
  content:'✓';
  color:#72b6d8;
  font-weight:700
}
.gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:64px
}
.project{
  position:relative;
  overflow:hidden;
  border-radius:3px;
  height:380px;
  background:var(--dark)
}
.project>img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .7s
}
.project:after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(transparent 55%,#123453aa);
  opacity:1
}
.project:hover>img{
  transform:scale(1.05)
}
.project-text{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  z-index:1;
  padding:24px;
  color:white
}
.project h3{
  font-size:22px
}
.project p{
  font-size:14px;
  color:#ffffff;
  margin-top:8px;
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:max-height .4s,opacity .4s
}
.project:hover p{
  max-height:90px;
  opacity:1
}
.contacts{
  background:var(--cement)
}
.contact-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:0
}
.contact-list{
  display:grid;
  flex-direction:column;
  gap:24px
}
.contact-card{
  display:flex;
  align-items:flex-start;
  gap:20px;
  padding:20px;
  background:#fff;
  border:1px solid #cfdae5;
  border-radius:3px;
  transition:border-color .2s
}
.contact-card[href]:hover{
  border-color:var(--copper)
}
.contact-card .icon{
  margin:0
}
.contact-card small{
  display:block;
  font-size:12px;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:4px
}
.contact-card strong{
  display:block;
  font-size:16px
}
.contact-card span span{
  font-size:14px;
  color:var(--muted)
}
.contact-list .buttons{
  padding-top:16px;
  gap:12px
}
.contact-list .buttons a{
  flex:1;
  white-space:nowrap
}
footer{
  padding:64px 0 32px
}
footer .container:before{
  content:'';
  display:block;
  height:2px;
  background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--copper),transparent 50%),transparent);
  margin-bottom:64px
}
.footer-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:32px;
  margin-bottom:48px
}

.footer-grid p{
  color:#d7e2ee;
  font-size:14px;
  margin-top:16px
}
.footer-grid h4{
  font-size:14px;
  text-transform:none;
  letter-spacing:.08em;
  margin:0 0 20px
}
.footer-links{
  display:flex;
  flex-direction:column;
  gap:12px;
  font-size:14px;
  color:#d7e2ee
}
.footer-bottom{
  border-top:1px solid #ffffff1a;
  padding-top:24px;
  display:flex;
  justify-content:space-between;
  gap:24px;
  color:#d7e2ee;
  font-size:12px
}
.skip-link{
  position:fixed;
  z-index:20;
  top:-100px;
  background:white;
  padding:12px 20px
}
.skip-link:focus{
  top:10px
}
:focus-visible{
  outline:3px solid var(--copper);
  outline-offset:5px
}
[hidden]{
  display:none!important
}
@media(min-width:1200px){
  .hero-content{
    padding-top:80px;
    padding-bottom:80px
  }
  .hero h1{
    max-width:680px
  }
}
@media(max-width:1100px){
  .desktop-links,.nav-actions{
    display:none
  }
  .menu-button{
    display:block
  }
  .navigation{
    height:72px
  }
  .hero h1{
    font-size:60px
  }
  .about-grid,.contact-grid{
    gap:40px
  }
  .footer-grid{
    grid-template-columns:repeat(2,1fr)
  }
}
@media(max-width:767px){
  .container{
    width:calc(100% - 40px)
  }
  .section{
    padding:80px 0
  }
  h2{
    font-size:36px
  }
  .hero h1{
    font-size:48px
  }
  .hero p{
    font-size:18px
  }
  .hero-content{
    padding-top:140px;
    padding-bottom:130px
  }
  .hero-image{
    object-position:60%
  }
  .eyebrow{
    font-size:12px;
    letter-spacing:.18em
  }
  .stats{
    padding:56px 0
  }
  .stats-grid{
    grid-template-columns:1fr 1fr;
    gap:32px;
    text-align:center
  }
  .stats strong{
    font-size:40px
  }
  .stats p{
    font-size:12px
  }
  .service-grid{
    grid-template-columns:repeat(2,1fr);
    gap:20px
  }
  .service{
    padding:24px
  }
  .about-grid,.contact-grid{
    grid-template-columns:1fr;
    gap:56px
  }
  .about-picture img{
    height:400px
  }
  .experience{
    left:-8px
  }
  .gallery{
    grid-template-columns:1fr;
    gap:20px;
    margin-top:48px
  }
  .project{
    height:360px
  }
  .project p{
    opacity:1;
    max-height:90px
  }
  .intro{
    margin-bottom:48px
  }
  .footer-bottom{
    flex-direction:column;
    text-align:center;
    align-items:center
  }

}
@media(max-width:480px){
  .hero h1{
    font-size:clamp(32px,9vw,44px)
  }
  .hero .buttons{
    flex-direction:column;
    align-items:stretch
  }
  .service-grid,.footer-grid{
    grid-template-columns:1fr
  }
  .features{
    grid-template-columns:1fr
  }
  .service h3{
    font-size:21px
  }
  .navigation{
    gap:12px
  }

.contact-list .buttons{
    flex-direction:column
  }
  .about-picture img{
    height:350px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*:before,*:after{
    transition:none!important
  }
}

/* Logo ufficiale bianco: proporzioni originali, fondo trasparente. */
.brand-logo {
  width: 300px;
  height: auto;
  padding: 7px 9px;
  background:transparent;
  border-radius: 3px;
  object-fit: contain;
}
.footer-grid .brand-logo {
  width: 100%;
  max-width: 300px;
}
@media (max-width: 480px) {
  .navigation .brand-logo {
    width: min(250px, calc(100vw - 104px));
    padding: 6px 8px;
  }
}

/* Palette 60–30–10. Il blu scuro sui fondi chiari preserva il contrasto AA.
   --copper è conservato come alias del blu del logo per compatibilità. */
header {
  background-color: #123453;
}
.about .eyebrow, .about em {
  color: #72b6d8;
}
.about .eyebrow:before {
  background-color: #72b6d8;
}
header :focus-visible, .stats :focus-visible,
.about :focus-visible, footer :focus-visible {
  outline-color: #72b6d8;
}

/* Titoli del footer: stessa famiglia degli altri heading. */
h4 {
  font-family: 'Manrope', system-ui, sans-serif;
}

/* Revisione: font, logo bianco, fotografie e contatti. */
h1, h2, h3, h4 {
  font-family: 'Manrope', system-ui, sans-serif;
  font-weight: 600;
}
.hero em {
  color: #b9dcf0;
}
.hero .eyebrow {
  color: #ffffff;
}
.hero .eyebrow:before {
  background-color: #72b6d8;
}
.hero :focus-visible {
  outline-color: #ffffff;
}
.project-text {
  background-color: #123453eb;
}
.contact-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.contact-card {
  flex-direction: column;
}
.contact-grid > .buttons {
  margin-top: 32px;
}
@media (max-width: 1100px) {
  .hero:before {
    background: linear-gradient(90deg,#123453f2,#123453e6 50%,#123453d9),linear-gradient(0deg,#12345399,transparent 50%,#1234534d);
  }
  .contact-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 767px) {
  .contact-grid {
    gap: 0;
  }
}
@media (max-width: 480px) {
  .contact-list {
    grid-template-columns: 1fr;
  }
  .contact-card {
    flex-direction: row;
  }
  .contact-grid > .buttons {
    flex-direction: column;
  }
}

.contact-grid > .buttons svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-right: 8px;
}


/* ===== Privacy e cookie policy ===== */
/* Informativa: indice laterale e sezioni numerate. */
.policy-page { background: #f4f7fa; }
.policy-page header { position: relative; }
.policy-page .navigation { flex-wrap: wrap; }
.policy-page .policy-home { color: #fff; font-size: 1rem; text-decoration: underline; }
.policy-hero { padding: 64px 0 52px; border-bottom: 1px solid #cbd5df; }
.policy-eyebrow { color: #07549f; font-size: .875rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 20px; }
.policy-hero h1 { max-width: 860px; color: #123453; font-size: clamp(3.25rem, 7vw, 5.875rem); line-height: 1.05; letter-spacing: -.045em; margin: 0; }
.policy-intro { max-width: 760px; margin: 24px 0 0; color: #536578; font-size: clamp(1.125rem, 2vw, 1.4375rem); line-height: 1.5; }
.policy-meta { margin: 28px 0 0; color: #536578; font-size: .875rem; }
.policy-layout { display: grid; grid-template-columns: minmax(190px, 250px) minmax(0, 780px); justify-content: space-between; align-items: start; gap: 72px; padding-top: 62px; padding-bottom: 100px; }
.policy-toc { position: sticky; top: 24px; padding: 24px; border: 1px solid #cbd5df; border-radius: 16px; background: #fff; box-shadow: 0 16px 38px #1234530d; max-height: calc(100dvh - 48px); overflow: auto; }
.policy-toc-title { margin: 0 0 14px; color: #123453; font-family: 'Manrope', sans-serif; font-size: 1.0625rem; font-weight: 600; }
.policy-toc ol { display: grid; gap: 3px; list-style: none; padding: 0; margin: 0; }
.policy-toc a { display: flex; gap: 10px; padding: 8px; border-radius: 7px; color: #536578; font-size: .875rem; line-height: 1.4; text-decoration: none; }
.policy-toc a span { color: #07549f; font-size: .75rem; font-weight: 600; padding-top: 2px; }
.policy-toc a:hover, .policy-toc a:focus-visible { background: #eaf0f5; color: #07549f; }
.policy-toc > button { color: #07549f; font-size: .875rem; margin-top: 20px; min-height: 44px; text-align: left; }
.policy-document { min-width: 0; }
.policy-summary { margin-bottom: 48px; padding: 26px 28px; border-left: 4px solid #07549f; border-radius: 0 10px 10px 0; background: #eaf0f5; }
.policy-summary strong { display: block; margin-bottom: 8px; color: #123453; font-family: 'Manrope', sans-serif; font-size: 1.25rem; font-weight: 600; }
.policy-summary p { margin: 0; font-size: 1rem; line-height: 1.75; }
.policy-section { padding-bottom: 42px; margin-bottom: 42px; border-bottom: 1px solid #cbd5df; scroll-margin-top: 24px; }
.policy-section:last-of-type { margin-bottom: 0; }
.policy-section-number { display: inline-block; color: #07549f; font-size: .875rem; font-weight: 600; letter-spacing: .08em; margin-bottom: 10px; }
.policy-section h2 { margin: 0 0 20px; max-width: none; font-size: clamp(1.75rem, 3vw, 2.375rem); line-height: 1.25; }
.policy-section h3 { margin: 26px 0 8px; font-size: 1.125rem; line-height: 1.5; }
.policy-section p, .policy-section li { font-size: 1.03125rem; line-height: 1.75; }
.policy-section p { margin: 0; }
.policy-section p + p { margin-top: 14px; }
.policy-section a, .policy-back a { color: #07549f; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.policy-section .cookie-settings { color: #07549f; }
.policy-address { margin: 22px 0 0; padding: 22px 24px; border: 1px solid #cbd5df; border-radius: 10px; background: #fff; color: #123453; font-style: normal; font-size: 1rem; line-height: 1.75; overflow-wrap: anywhere; }
.policy-purpose-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 24px 0; }
.policy-purpose { padding: 22px; border: 1px solid #cbd5df; border-radius: 10px; background: #fff; }
.policy-purpose h3 { margin: 0 0 8px; font-size: 1.0625rem; }
.policy-purpose p { font-size: 1rem; line-height: 1.6; }
.policy-list { display: grid; gap: 10px; padding-left: 22px; margin: 20px 0; }
.policy-list li::marker { color: #07549f; }
.policy-table-wrap { max-width: 100%; overflow-x: auto; margin: 22px 0; }
.policy-table-wrap table { width: 100%; border-collapse: collapse; font-size: .875rem; line-height: 1.6; }
.policy-table-wrap caption { text-align: left; color: #536578; padding-bottom: 12px; }
.policy-table-wrap th, .policy-table-wrap td { padding: 12px; text-align: left; border: 1px solid #aebfcd; vertical-align: top; }
.policy-table-wrap th { background: #123453; color: #fff; }
.policy-back { padding-top: 40px; font-size: 1rem; }
.policy-page footer { padding-top: 0; }
.policy-page footer .container:before { margin-bottom: 32px; }
@media (max-width: 1000px) {
  .policy-layout { grid-template-columns: 1fr; gap: 38px; }
  .policy-toc { position: static; max-height: none; }
  .policy-toc ol { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 12px; }
}
@media (max-width: 600px) {
  .policy-hero { padding: 44px 0 38px; }
  .policy-hero h1 { font-size: clamp(2.625rem, 12vw, 4rem); }
  .policy-layout { padding-top: 38px; padding-bottom: 72px; }
  .policy-toc { padding: 18px; }
  .policy-toc ol, .policy-purpose-grid { grid-template-columns: 1fr; }
  .policy-section { padding-bottom: 34px; margin-bottom: 34px; }
  .policy-summary, .policy-address, .policy-purpose { padding: 20px; }
}


/* ===== Banner e preferenze cookie ===== */
.cookie-banner { position: fixed; inset: auto auto 20px 20px; width: min(620px, calc(100% - 40px)); max-height: calc(100dvh - 40px); overflow: auto; margin: 0; box-sizing: border-box; padding: 28px; border: 1px solid #cbd5df; border-radius: 18px; color: #123453; background: #fff; box-shadow: 0 16px 50px #12345326; z-index: 100; font-family: 'Open Sans', sans-serif; font-size: 1rem; }
.cookie-banner:not([open]), .cookie-banner [hidden] { display: none; }
.cookie-banner h2 { font-family: 'Manrope', sans-serif; font-weight: 600; font-size: clamp(1.5rem, 5vw, 1.875rem); line-height: 1.25; margin: 0 0 16px; letter-spacing: -.04em; }
.cookie-banner p { line-height: 1.6; margin: 0 0 12px; }
.cookie-banner .cookie-eyebrow { color: #07549f; font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 10px; }
.cookie-banner .cookie-note, .cookie-category p { font-size: .875rem; }
.cookie-banner a { color: #07549f; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.cookie-banner .cookie-policy-links { margin: 16px 0 24px; font-size: .875rem; }
.cookie-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.cookie-actions button { font: inherit; font-weight: 600; min-height: 46px; padding: 11px 18px; border: 1px solid; border-radius: 7px; cursor: pointer; }
.cookie-primary { background: #07549f; border-color: #07549f; color: #fff; }
.cookie-primary:hover { background: #0b4683; }
.cookie-reject { background: #fff; border-color: #123453; color: #123453; }
.cookie-reject:hover { background: #f4f7fa; }
.cookie-secondary { background: #eaf3fa; border-color: #9ebbd1; color: #07549f; }
.cookie-secondary:hover { background: #dbeaf5; }
.cookie-category { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 18px 0; border-top: 1px solid #dce3eb; }
.cookie-category h3 { font-family: 'Manrope', sans-serif; font-weight: 600; font-size: 1rem; line-height: 1.5; margin: 0 0 6px; }
.cookie-category p { margin: 0; }
.cookie-always { font-size: .75rem; font-weight: 600; letter-spacing: .1em; color: #07549f; text-transform: uppercase; white-space: nowrap; }
.cookie-preferences-actions { margin-top: 20px; }
.cookie-switch { position: relative; display: inline-flex; align-items: center; width: 50px; min-height: 44px; cursor: pointer; }
.cookie-switch input { position: absolute; opacity: 0; width: 50px; height: 44px; margin: 0; cursor: pointer; }
.cookie-switch-track { width: 50px; height: 28px; border-radius: 30px; background: #d2d9e2; border: 1px solid #7b8b9c; pointer-events: none; }
.cookie-switch-track:before { content: ''; display: block; width: 22px; height: 22px; border-radius: 50%; background: #fff; margin: 2px; box-shadow: 0 1px 3px #12345344; transition: transform .15s; }
.cookie-switch input:checked + .cookie-switch-track { background: #07549f; border-color: #07549f; }
.cookie-switch input:checked + .cookie-switch-track:before { transform: translateX(22px); }
.cookie-switch input:focus-visible + .cookie-switch-track { outline: 3px solid #07549f; outline-offset: 4px; }
.cookie-settings { border: 0; padding: 0; background: transparent; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; }
.cookie-banner :focus-visible { outline: 3px solid #07549f; outline-offset: 3px; }
@media(max-width: 600px) { .cookie-banner { inset: auto 12px 12px; width: calc(100% - 24px); max-height: calc(100dvh - 24px); padding: 24px 20px; } .cookie-category { gap: 12px; } .cookie-category:first-of-type { grid-template-columns: 1fr; gap: 8px; } .cookie-actions button { flex: 1 1 auto; } }
@media(prefers-reduced-motion: reduce) { .cookie-switch-track:before { transition: none; } }


/* Credits del footer. */
.footer-credit { display: inline-block; margin-top: 8px; font-size: .875rem; }
.footer-credit a { text-decoration: underline; text-underline-offset: 3px; }