/* Layout autonomo della one page: nessun tema o page builder richiesto. */
:root {
    --heading:#6ec1e4;
    --text:#7a7a7a;
    --green:#61ce70;
    --blue:#00499e;
    --pale:#eff1f3
}
 * {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth
}
body {
    margin:0;
    background:#fff;
    color:var(--text);
    font:400 17px/1.5 Roboto,Arial,sans-serif
}
img {
    max-width:100%;
    height:auto;
    vertical-align:middle
}
h1,h2,p {
    margin:0
}
a {
    color:#456cad;
    text-decoration:none
}
a:hover {
    color:#000
}
button,input,textarea {
    font:inherit
}
button,a {
    touch-action:manipulation
}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible {
    outline:3px solid #00499e;
    outline-offset:3px
}
hr {
    opacity:1;
    border:0;
    margin:0
}
[hidden] {
    display:none!important
}
.hero {
    display:grid;
    grid-template-columns:61% 39%;
    min-height:50vh
}
.hero-intro {
    display:flex;
    align-items:center;
    padding:0 25% 0 15%;
    background:url('../img/copertina.jpg') no-repeat;
    background-size:contain;
    background-attachment:fixed;
    position:relative
}
.hero-intro:before {
    content:'';
    position:absolute;
    inset:0;
    background:#456cad;
    opacity:.59
}
.hero-content {
    position:relative;
    width:100%
}
.hero-content h1 {
    line-height:0;
    margin:0 0 20px
}
.hero-content img {
    width:100%;
    height:auto
}
.hero-content hr {
    width:95%;
    border-top:1px solid #fff;
    padding:2px 0;
    margin-bottom:20px
}
.hero-content p {
    color:#fff;
    font:600 20px/1.6 'Playfair Display',Georgia,serif;
    letter-spacing:.2px;
    margin-bottom:30px
}
.hero-form {
    background:#c2cbd2;
    padding:80px 50px;
    color:#000
}
.hero-form h2 {
    color:var(--heading);
    font:600 34px/1.2 'Playfair Display',Georgia,serif;
    letter-spacing:.2px;
    margin-bottom:20px
}
.form-intro {
    font-size:20px;
    line-height:1.5;
    margin-bottom:45px
}
#contatti {
    scroll-margin-top:20px
}
.form-control {
    display:block;
    width:100%;
    font:400 15px/1.5 Roboto,Arial,sans-serif;
    color:#54595f;
    background:#fff;
    border:0;
    border-radius:0;
    min-height:43px;
    padding:10px 16px;
    margin-bottom:16px
}
.form-control:focus {
    box-shadow:0 0 0 2px #456cad;
    color:#54595f
}
textarea.form-control {
    height:104px;
    min-height:104px;
    resize:vertical
}
.request-button {
    display:inline-block;
    background:var(--green);
    color:#fff;
    border:0;
    border-radius:0;
    padding:20px 40px;
    font:500 16px/1 Roboto,Arial,sans-serif;
    letter-spacing:2px;
    text-transform:uppercase;
    text-decoration:none;
    cursor:pointer;
    transition:background .2s,color .2s
}
.request-button:hover,.request-button:focus {
    background:#bad4e4;
    color:#54595f
}
.button-blue {
    background:var(--blue)
}
.submit-button {
    width:100%;
    padding:20px;
    font-size:18px;
    letter-spacing:2.5px;
    text-transform:none
}
.submit-button i {
    margin-right:5px
}
.submit-button:disabled {
    opacity:.7;
    cursor:wait
}
.form-feedback {
    font-size:15px;
    margin-top:16px;
    padding:12px;
    background:#fff
}
.is-success {
    color:#176528
}
.is-error {
    color:#a01919
}
.trap {
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip-path:inset(50%)
}
.about {
    padding:100px 0
}
.about-grid {
    max-width:1140px;
    margin:auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    align-items:center
}
.about-heading>p {
    font-weight:300;
    text-transform:uppercase;
    margin-bottom:45.5px
}
.about-heading h2 {
    color:var(--heading);
    font-size:65px;
    font-weight:400;
    line-height:1;
    margin-bottom:20px
}
.about-heading hr {
    width:15%;
    border-top:2px solid #000;
    padding:2px 0
}
.about-column {
    display:flex;
    flex-direction:column;
    padding:35px;
    font-size:15px;
    font-weight:300;
    line-height:1.8
}
.about-column img {
    display:block;
    width:100%;
    transition:transform .3s
}
.about-column img:hover {
    transform:scale(1.1)
}
.about-column img+p {
    margin-top:20px
}
.about-column p {
    margin-bottom:22.5px
}
.about-column p+img {
    margin-top:20px
}
.product {
    display:grid;
    grid-template-columns:1fr 1fr;
    min-height:615px
}
.product-photo {
    position:relative;
    overflow:hidden;
    min-height:100%
}
.product-photo img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover
}
.product-copy {
    background:var(--pale);
    display:flex;
    align-items:center;
    padding:0 15% 0 10%
}
.product-copy>div {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    width:100%
}
.product-copy h2 {
    color:var(--heading);
    font:600 25px/1.2 'Playfair Display',Georgia,serif;
    letter-spacing:.2px;
    margin-bottom:20px
}
.product-copy hr {
    width:13%;
    border-top:5px solid #54595f;
    margin:15px 0 35px
}
.product-copy p {
    font-weight:300;
    line-height:1.5;
    margin-bottom:45.5px
}
.product-reverse .product-photo {
    grid-column:2;
    grid-row:1
}
.product-reverse .product-copy {
    grid-column:1;
    grid-row:1
}
.contact-grid {
    max-width:800px;
    margin:auto;
    padding:60px 0 40px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    text-align:center
}
.contact-grid h2 {
    color:var(--heading);
    font-size:25px;
    font-weight:600;
    line-height:1;
    margin-bottom:30px
}
.contact-grid p {
    font-weight:300;
    line-height:1.6;
    margin-bottom:25.5px
}
.contact-grid a[href^='tel:'] {
    color:inherit
}
.map-container {
    height:600px;
    position:relative;
    background:#f5f5f5
}
.map-container iframe {
    display:block;
    width:100%;
    height:100%;
    border:0
}
.map-placeholder {
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center
}
.site-footer {
    background:var(--pale);
    padding:11px max(20px,calc((100% - 1140px)/2)) 20px;
    text-align:center;
    color:#000;
    font-size:13px;
    font-weight:300;
    line-height:1.3
}
.site-footer p:first-child {
    margin-bottom:20px
}
.site-footer a {
    color:var(--blue);
    overflow-wrap:anywhere
}
#cookie-banner {
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    background:#fff;
    color:#222;
    z-index:1000;
    text-align:center;
    padding:15px 12px 10px;
    font:14px/1.7 Roboto,Arial,sans-serif;
    box-shadow:0 0 6px #999
}
#cookie-banner a {
    color:#333;
    text-decoration:underline;
    font-weight:600
}
#cookie-banner button {
    background:#000;
    color:#fff;
    border:0;
    padding:7px 13px;
    margin-top:6px;
    font:12px Arial;
    cursor:pointer
}
 @media(max-width:1024px) {
    .hero-intro {
        padding:0 200px 0 40px;
        background-attachment:scroll
    }
    .hero-content hr {
        margin-top:-10px;
        margin-bottom:10px
    }
    .hero-content p {
        font-size:16px;
        padding-bottom:60px
    }
    .hero-form {
        padding:25px
    }
    .hero-form h2 {
        font-size:17px
    }
    .form-intro {
        font-size:10px;
        line-height:1.4;
        margin-bottom:35px
    }
    .form-control {
        font-size:13px
    }
    .submit-button {
        font-size:14px
    }
    .about {
        padding:100px 25px
    }
    .about-grid {
        max-width:1025px
    }
    .about-heading h2 {
        font-size:45px
    }
    .about-column {
        padding:15px
    }
    .product-copy {
        padding:0 25px 0 35px
    }
    .product-copy h2 {
        font-size:27px
    }
    .product-copy p {
        font-size:14px;
        margin-bottom:35px
    }
    .product-copy .request-button {
        font-size:12px
    }
    .contacts {
        padding-bottom:100px
    }
    .site-footer {
        padding:30px 20px
    }
}
 @media(max-width:767px) {
    .hero {
        grid-template-columns:1fr
    }
    .hero-intro {
        padding:50px 30px 40px;
        background-size:contain
    }
    .hero-content hr {
        margin-left:auto;
        margin-right:auto
    }
    .hero-content p {
        font-size:18px;
        line-height:1.3;
        text-align:center;
        padding:0;
        margin-bottom:25px
    }
    .hero-form {
        padding:25px
    }
    .hero-form h2 {
        text-align:center;
        font-size:25px
    }
    .form-intro {
        text-align:center;
        font-size:14px;
        line-height:1.4
    }
    .about {
        padding:50px 20px
    }
    .about-grid {
        grid-template-columns:1fr
    }
    .about-column {
        padding:25px 0 0
    }
    .about-column img {
        width:100%
    }
    .about-heading h2 {
        font-size:45px
    }
    .product {
        grid-template-columns:1fr;
        min-height:0
    }
    .product-photo {
        height:350px;
        min-height:350px
    }
    .product-copy {
        padding:60px 30px;
        text-align:center
    }
    .product-copy h2 {
        font-size:25px
    }
    .product-copy hr {
        margin-left:auto;
        margin-right:auto
    }
    .product-copy p {
        font-size:15px;
        padding-bottom:10px
    }
    .product-copy .request-button {
        font-size:15px;
        max-width:100%;
        line-height:1.2
    }
    .product-reverse .product-photo {
        grid-column:1;
        grid-row:2
    }
    .product-reverse .product-copy {
        grid-column:1;
        grid-row:1
    }
    .contact-grid {
        grid-template-columns:1fr
    }
    .contact-grid>div {
        margin-bottom:20px
    }
    .contacts {
        padding-bottom:50px
    }
    .site-footer {
        padding:25px 20px;
        line-height:19px
    }
    .map-placeholder .request-button {
        font-size:13px;
        padding:20px
    }
}
 @media(prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    * {
        transition:none!important
    }
    .about-column img:hover {
        transform:none
    }
}
  @media(max-width:767px) {
    .product-copy>div {
        align-items:center
    }
}