html { -webkit-text-size-adjust: 100%; height: 100%; scroll-behavior: smooth; }
body {
    font-family: 'Inter', 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background-color: var(--bg);
    color: var(--text);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a { text-decoration: none; color: inherit; transition: opacity var(--transition), transform var(--transition); }
a:hover { opacity: 0.9; }

.section { position: relative; width: 100%; background-color: var(--bg); overflow: hidden; }
.section-container { position: relative; width: 1087px; max-width: 100%; margin: 0 auto; height: 100%; transition: width 0.3s ease; }

.bg-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.2; z-index: 0; pointer-events: none; }
.bg-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.2; z-index: 0; pointer-events: none; }
.bg-video.portfolio { opacity: 0.12; }

.content { position: relative; z-index: 1; }

.animated-svg-container { overflow: visible !important; position: relative !important; width: 80px !important; height: 120px !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: 25px 0 !important; cursor: pointer !important; }
.hero-section .animated-svg-container { position: relative !important; left: auto !important; transform: none !important; bottom: auto !important; margin-top: 14px !important; width: 56px !important; height: 36px !important; display: block !important; z-index: 2 !important; order: 3 !important; }
.animated-svg-container > div,
.animated-svg-container > div > div,
.animated-svg-container > div > div > div,
.animated-svg-container > div > div > div > div,
.animated-svg-container > div > div > div > div > div { overflow: visible !important; width: 100% !important; height: 100% !important; }
.animated-arrow-svg { display: block !important; width: 100% !important; height: 100% !important; position: relative !important; overflow: visible !important; }
.animated-arrow-svg g { clip-path: none !important; overflow: visible !important; }
.animated-arrow-svg .arrow-group-1,
.animated-arrow-svg .arrow-group-2,
.animated-arrow-svg .arrow-group-3 { transform-origin: 540px 332px; will-change: transform, opacity; }
.animated-arrow-svg .arrow-group-1 { transform: translate(540px, 332px); animation: scrollDownLoop 3s linear infinite; animation-delay: 0s; }
.animated-arrow-svg .arrow-group-2 { transform: translate(540px, 332px); animation: scrollDownLoop 3s linear infinite; animation-delay: 1s; }
.animated-arrow-svg .arrow-group-3 { transform: translate(540px, 332px); animation: scrollDownLoop 3s linear infinite; animation-delay: 2s; }
.animated-arrow-svg .arrow-group-1 path { animation: arrowFadeLoop 3s linear infinite; animation-delay: 0s; }
.animated-arrow-svg .arrow-group-2 path { animation: arrowFadeLoop 3s linear infinite; animation-delay: 1s; }
.animated-arrow-svg .arrow-group-3 path { animation: arrowFadeLoop 3s linear infinite; animation-delay: 2s; }

@supports (-webkit-touch-callout: none) { html, body { height: -webkit-fill-available; } }

.back-to-top { position: fixed; bottom: max(16px, env(safe-area-inset-bottom)); right: max(16px, env(safe-area-inset-right)); width: 46px; height: 46px; display: none; align-items: center; justify-content: center; border-radius: 9999px; background-image: linear-gradient(90deg, var(--accent), var(--accent-2)); color: #ffffff; font-weight: 700; border: 1px solid rgba(255, 255, 255, 0.18); box-shadow: 0 10px 24px rgba(0, 151, 178, 0.35); z-index: 1000; transition: transform var(--transition), box-shadow var(--transition), filter var(--transition); }
.back-to-top.is-visible { display: inline-flex; }
.back-to-top:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(0, 151, 178, 0.5); filter: brightness(1.06); }

*::selection { background: rgba(56, 189, 248, 0.28); color: #001b21; }

button:focus-visible,
.hero-cta:focus-visible,
.comunicato-link:focus-visible,
.footer-form-submit:focus-visible,
.social-link:focus-visible,
.back-to-top:focus-visible,
input:focus-visible,
textarea:focus-visible,
a:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; box-shadow: 0 0 0 6px rgba(56, 189, 248, 0.15); }

.animated-svg-container:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; box-shadow: 0 0 0 6px rgba(56, 189, 248, 0.15); }

.cookie-banner { position: fixed; left: 0; right: 0; bottom: 0; padding: 16px; padding-left: max(16px, env(safe-area-inset-left)); padding-right: max(16px, env(safe-area-inset-right)); display: flex; align-items: flex-end; justify-content: center; z-index: 10000; opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity var(--transition), transform var(--transition); }
.cookie-banner.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.cookie-banner-inner { max-width: 1100px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; background-color: rgba(255, 255, 255, 0.08); border: 1px solid var(--surface-border); backdrop-filter: blur(10px); box-shadow: var(--shadow); border-radius: 9999px; padding: 12px 18px; }
.cookie-banner-text { color: var(--text-dim); font-size: 14px; }
.cookie-banner-link { color: #ffffff; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.cookie-banner-accept { margin-left: 8px; padding: 10px 18px; border-radius: 9999px; border: 1px solid rgba(255, 255, 255, 0.18); background-image: linear-gradient(90deg, var(--accent), var(--accent-2)); color: #001b21; font-weight: 700; cursor: pointer; min-height: 40px; min-width: 120px; box-shadow: var(--shadow); transition: transform var(--transition), box-shadow var(--transition), filter var(--transition); }
.cookie-banner-accept:hover { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(0, 151, 178, 0.5); filter: brightness(1.06); }