.cookie-banner[hidden], .cookie-details[hidden], [data-cookie-settings][hidden] { display: none; }
.cookie-banner { position: fixed; z-index: 100; inset: auto 24px 24px auto; width: min(560px, calc(100% - 48px)); max-height: calc(100dvh - 48px); overflow: auto; padding: 26px 30px; background: #fff; color: #0b1710; border: 1px solid #0b1710; box-shadow: 0 10px 48px #0b171018; font: 14px/1.6 Manrope, Arial, sans-serif; }
.cookie-heading { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.cookie-heading h2 { margin: 0; font: 400 30px/1.2 Anton, Impact, sans-serif; text-transform: uppercase; }
.cookie-banner p { margin: 14px 0; }
.cookie-banner button, .cookie-settings { cursor: pointer; border: 0; border-radius: 0; background: transparent; color: inherit; font: inherit; }
.cookie-close { flex: 0 0 44px; min-height: 44px; margin: -10px -12px 0 0; font-size: 28px !important; line-height: 1; }
.cookie-policy { text-decoration: underline; text-underline-offset: 4px; }
.cookie-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 20px; }
.cookie-actions button, [data-cookie="save"], .cookie-settings { position: relative; min-height: 44px; padding: 8px 0; text-align: left; }
.cookie-actions button::after, [data-cookie="save"]::after { content: ''; position: absolute; left: 0; right: 0; bottom: 3px; height: 1px; background: currentColor; transform: scaleX(.35); transform-origin: left; transition: transform .2s ease; }
.cookie-actions button:hover::after, .cookie-actions button:focus-visible::after, [data-cookie="save"]:hover::after, [data-cookie="save"]:focus-visible::after { transform: scaleX(1); }
.cookie-banner button:focus-visible, .cookie-settings:focus-visible, .cookie-option input:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.cookie-details { border-top: 1px solid #d8ddd8; margin-top: 18px; padding-top: 4px; }
.cookie-option { display: flex; align-items: start; gap: 12px; padding: 10px 0; cursor: pointer; }
.cookie-option input { flex: 0 0 22px; width: 22px; height: 22px; margin: 3px 0 0; accent-color: #0b1710; }
/* Su schermi larghi una barra bassa sul fondo, per lasciare libera la hero. */
@media (min-width: 900px) {
  .cookie-banner { inset: auto 0 0; width: auto; max-height: min(70dvh, 520px); display: grid; grid-template-columns: auto minmax(0, 1fr) auto 44px; grid-template-areas: "title text actions close" "title policy actions close" "details details details details"; column-gap: 40px; align-items: center; padding: 16px max(24px, calc((100% - 1360px) / 2)); border-width: 1px 0 0; box-shadow: 0 -8px 40px #0b171014; }
  .cookie-heading { display: contents; }
  .cookie-heading h2 { grid-area: title; font-size: 24px; white-space: nowrap; }
  .cookie-close { grid-area: close; margin: 0; }
  .cookie-banner > p { grid-area: text; margin: 0; max-width: 680px; font-size: 13.5px; line-height: 1.5; }
  .cookie-policy { grid-area: policy; justify-self: start; font-size: 13.5px; }
  .cookie-actions { grid-area: actions; grid-template-columns: repeat(3, auto); gap: 28px; margin: 0; }
  .cookie-details { grid-area: details; max-width: 760px; margin-top: 14px; }
}
@media (max-width: 899px) {
  .cookie-banner { inset: auto 0 0; width: auto; padding: 14px 16px 6px; max-height: 70dvh; border-width: 1px 0 0; font-size: 13px; line-height: 1.5; }
  .cookie-heading h2 { font-size: 20px; }
  .cookie-close { margin: -10px -10px 0 0; }
  .cookie-banner p { margin: 6px 0 4px; }
  .cookie-actions { gap: 14px; margin-top: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .cookie-actions button::after, [data-cookie="save"]::after { transition: none; }
}
