/* Contact frame 273:6566: 1200px content, 538 / 72 / 590px columns. */
html:has(.contact-page) { overflow-x: clip; }
body.page-template-page-contatti { overflow-x: clip; }
.contact-background { position: fixed; z-index: 0; inset: 0; overflow: clip; pointer-events: none; }
.contact-background img { position: absolute; max-width: none; }
.contact-background__top { top: -286px; left: calc(50% + 346px); }
.contact-background__left { top: 0; left: -338.9px; }
.contact-background__right { top: -202px; left: calc(50% - 106px); }
.contact-page { z-index: auto; display: grid; grid-template-columns: minmax(0, 538fr) minmax(0, 590fr); gap: 6%; align-items: start; width: min(var(--content-width), calc(100% - 48px)); min-height: 967px; padding: 206px 0 90px; }
.contact-page__intro { position: relative; z-index: 2; padding-top: 13px; container-type: inline-size; }
.contact-page h1 { min-height: 3.5em; margin: 0; font-size: min(80px, 14.869889cqw); font-weight: 900; line-height: .825; letter-spacing: -.02em; }
.contact-page h1 > span { display: block; }
.contact-page h1 > span:nth-child(1) { color: var(--pink); }
.contact-page h1 > span:nth-child(2) { color: var(--orange); }
.contact-page h1 > span:nth-child(n+3) { color: var(--violet-400); }
.contact-page__description { margin-top: 28px; font-size: 16px; line-height: 26px; }
.contact-page__description p { margin: 0; }
.contact-page__description p + p { margin-top: 12px; }
.contact-page__description strong { font-weight: 700; }
.contact-page__details { margin-top: 68px; }
.contact-page__details h2 { margin: 0 0 20px; color: var(--white-100); font-size: 20px; line-height: 28px; font-weight: 700; letter-spacing: -.2px; }
.contact-page__links { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; font-style: normal; }
.contact-page__link { display: flex; width: min(350px, calc(100% - 24px)); min-height: 48px; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 32px; color: var(--white-100); background: rgba(166,141,166,.3); box-shadow: var(--shadow); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); font-size: 16px; line-height: 24px; font-weight: 500; text-decoration: none; }
.contact-page__link--email { margin-left: 24px; }
.contact-page__link > span:last-child { min-width: 0; overflow-wrap: anywhere; }
.contact-page__links a:focus-visible { outline: 2px solid var(--white-100); outline-offset: 4px; }
.contact-page__form { position: relative; min-width: 0; }
.contact-page .contact-form { position: relative; z-index: 2; gap: 24px 20px; margin: 0; padding: 40px 48px; border-radius: 28px; background: rgba(166,141,166,.3); box-shadow: 0 12px 60px #261826, inset 0 0 0 1px rgba(242,237,232,.08); -webkit-backdrop-filter: blur(35px); backdrop-filter: blur(35px); }
.contact-page .contact-form h2 { margin: 0 0 16px; font-size: 20px; line-height: 28px; font-weight: 700; letter-spacing: -.2px; }
.contact-page .contact-form label { min-width: 0; }
.contact-page .contact-form input:not([type=checkbox]), .contact-page .contact-form textarea { padding: 12px 16px; border-radius: 8px; font-size: 16px; line-height: 24px; }
.contact-page .contact-form textarea { display: block; height: 153px; min-height: 153px; }
.contact-page .contact-form ::placeholder { color: var(--white-200); opacity: 1; font-style: italic; }
.contact-page .contact-form__privacy { gap: 8px; align-items: center; min-height: 22px; }
.contact-page .contact-form__privacy a { text-decoration: none; }
.contact-page .contact-form__privacy input { appearance: none; margin: 0; padding: 0; border: 2px solid var(--white-100); border-radius: 4px; background: transparent; cursor: pointer; }
.contact-page .contact-form__privacy input:checked { background: var(--pink) url('../img/network/spunta.svg') center / 16px no-repeat; }
.contact-page .contact-form :is(input, textarea):focus-visible { outline: 2px solid var(--white-100); outline-offset: 4px; }
.contact-page .contact-form .button { justify-self: end; min-width: 209px; height: 48px; min-height: 48px; gap: 14px; padding: 8px 8px 8px 24px; font-size: 16px; }
.contact-page .contact-form__honeypot { display: none; }
.contact-page__form .contact-pictogram-track { top: 186px; left: 94px; }
/* Start the backdrop below the form and bring the footer content 160px closer. */
.page-template-page-contatti .site-footer { z-index: 1; min-height: calc(640px + var(--contact-footer-overlap, 162px)); margin-top: calc(var(--form-footer-gap, 100px) - var(--contact-footer-overlap, 162px)); padding-top: var(--contact-footer-overlap, 162px); }
.page-template-page-contatti .site-footer::before { display: none; }
.site-footer > .contact-footer-blur { position: absolute; z-index: 0; inset: 0; overflow: clip; pointer-events: none; }
/* Successive Gaussian layers increase blur, instead of fading a sharp image over it. */
.contact-footer-blur > span { position: absolute; inset: 0; -webkit-backdrop-filter: blur(var(--blur-radius)); backdrop-filter: blur(var(--blur-radius)); -webkit-mask-image: linear-gradient(180deg, transparent calc((var(--blur-step) - 1) * 100% / 16), #000 calc(var(--blur-step) * 100% / 16)); mask-image: linear-gradient(180deg, transparent calc((var(--blur-step) - 1) * 100% / 16), #000 calc(var(--blur-step) * 100% / 16)); }
@media (max-width: 1199px) and (min-width: 1024px) {
    .contact-page .contact-form { padding-inline: 32px; }
    .contact-page__form .contact-pictogram-track { left: calc((100% - 520px) / 2); }
}
@media (max-width: 1023px) {
    .contact-page { width: min(var(--content-width), calc(100% - 2 * var(--page-gutter))); grid-template-columns: 1fr; gap: 60px; min-height: 0; padding: 200px 0 180px; }
    .contact-page__intro { width: 100%; max-width: 590px; padding-top: 0; }
    .contact-page h1 { min-height: 0; font-size: min(70px, 14.869889cqw); }
    .contact-page__details { margin-top: 40px; }
    .contact-page__form { width: 100%; max-width: 590px; }
    .contact-page__form .contact-pictogram-track { --pictogram-scale: .65; top: calc(100% - 235px); right: -72px; left: auto; }
    .contact-background__top { left: calc(100% - 374px); }
    .contact-background__right { left: calc(50% - 450px); }
    .page-template-page-contatti .site-footer { min-height: 0; padding-top: calc(10px + var(--contact-footer-overlap, 180px)); }
}
@media (max-width: 640px) {
    .contact-page { padding-top: 180px; }
    .contact-page .contact-form { grid-template-columns: 1fr; padding: 32px 24px; }
    .contact-page .contact-form h2 { font-size: 18px; line-height: 26px; }
    .contact-page__link { font-size: 14px; line-height: 22px; }
}
