/* ============================================================================ Pizzeria Nerone — site.css Design system + sezioni + effetti. Palette/font iniettati come var in . Font self-hostati (GDPR): nessuna richiesta a Google. ============================================================================ */ /* ── Font self-hostati ─────────────────────────────────────────────────── */ @font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/poppins-400.woff2') format('woff2')} @font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/poppins-500.woff2') format('woff2')} @font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/poppins-600.woff2') format('woff2')} @font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/poppins-700.woff2') format('woff2')} @font-face{font-family:'Aclonica';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/aclonica-400.woff2') format('woff2')} /* ── Reset leggero ─────────────────────────────────────────────────────── */ *,*::before,*::after{box-sizing:border-box} [hidden]{display:none!important} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%} body{margin:0;font-family:"Poppins",system-ui,sans-serif;color:var(--text);background:var(--bg); line-height:1.7;font-size:17px;overflow-x:hidden} img{max-width:100%;height:auto;display:block} a{color:var(--brand);text-decoration:none;transition:color .2s} a:hover{color:var(--brand-dark)} h1,h2,h3,h4{font-family:"Aclonica",system-ui,sans-serif;line-height:1.2;color:var(--dark);margin:0 0 .5em;font-weight:400} ul{margin:0;padding:0;list-style:none} p{margin:0 0 1rem} strong{font-weight:600} :focus-visible{outline:3px solid var(--brand-2);outline-offset:2px} .skip-link{position:absolute;left:-9999px;top:0;z-index:1000;background:var(--brand);color:#fff; padding:.7rem 1.2rem;border-radius:0 0 8px 0;font-weight:600} .skip-link:focus{left:0;color:#fff} .container{width:min(1180px,92vw);margin-inline:auto} .center{text-align:center} .section{padding:clamp(2.8rem,6vw,5.5rem) 0} .section-alt{background:#fff} .section-title{font-size:clamp(1.5rem,3.2vw,2.4rem);font-weight:400;text-align:center;margin-bottom:.6rem} .section-title::after{content:"";display:block;width:60px;height:4px;border-radius:4px; background:var(--brand-2);margin:.8rem auto 0} .section-lead{max-width:760px;margin:0 auto 2.5rem;text-align:center;font-size:1.05rem;color:var(--text)} .eyebrow{display:block;text-align:center;font-family:"Poppins",sans-serif;font-weight:600; text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;color:var(--brand);margin-bottom:.6rem} /* ── Bottoni ───────────────────────────────────────────────────────────── */ .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem; font-family:"Poppins",sans-serif;font-weight:600;font-size:.98rem; padding:.85rem 1.6rem;border-radius:10px;border:2px solid transparent;cursor:pointer; transition:transform .18s ease,box-shadow .18s ease,background .2s,color .2s;text-align:center;line-height:1.2} .btn:hover{transform:translateY(-2px)} .btn-lg{padding:1.05rem 2.2rem;font-size:1.05rem} .btn-block{display:flex;width:100%} .btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 22px -8px rgba(128,0,0,.6)} .btn-primary:hover{background:var(--brand-dark);color:#fff;box-shadow:0 12px 26px -8px rgba(128,0,0,.7)} .btn-gold{background:var(--brand-2);color:#3a2a00} .btn-gold:hover{background:var(--brand-2-dark);color:#3a2a00} .btn-outline{background:transparent;border-color:var(--brand);color:var(--brand)} .btn-outline:hover{background:var(--brand);color:#fff} .btn-light{background:#fff;color:var(--brand)} .btn-light:hover{background:#fff;color:var(--brand-dark)} .btn-ghost{background:transparent;border-color:#cfc6bf;color:var(--text)} .btn-ghost:hover{border-color:var(--text)} /* ── Top bar ───────────────────────────────────────────────────────────── */ .topbar{background:var(--brand-dark);color:#f6e7e0;font-size:.82rem} .topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.4rem 0;flex-wrap:wrap} .topbar a{color:#f6e7e0} .topbar a:hover{color:#fff} .topbar-contacts{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap} .topbar .sep{opacity:.5} /* ── Selettore lingua ──────────────────────────────────────────────────── */ .lang-switch{position:relative;display:inline-block} .lang-switch summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.25rem;font-weight:600} .lang-switch summary::-webkit-details-marker{display:none} .lang-switch>ul{position:absolute;right:0;top:150%;background:#fff;border:1px solid #ece5df;border-radius:10px; box-shadow:0 16px 34px -18px rgba(0,0,0,.4);padding:.35rem;min-width:150px;z-index:130} .lang-switch>ul a{display:block;padding:.45rem .7rem;border-radius:7px;color:var(--dark);font-size:.86rem} .lang-switch>ul a:hover{background:var(--bg);color:var(--brand)} .lang-switch>ul a.on{font-weight:700;color:var(--brand)} .nav-lang{display:none} .lang-switch.header-lang{display:none} /* visibile solo su mobile (vedi media query) */ /* ── Header ────────────────────────────────────────────────────────────── */ .site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94); backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid #ece5df; transition:box-shadow .25s,padding .25s} .site-header.scrolled{box-shadow:0 6px 24px -12px rgba(0,0,0,.28)} .header-inner{display:flex;align-items:center;gap:1.2rem;padding:.7rem 0;transition:padding .25s} .site-header.scrolled .header-inner{padding:.45rem 0} .brand{flex:none} .brand img{height:56px;width:auto;transition:height .25s} .site-header.scrolled .brand img{height:46px} .main-nav{display:flex;align-items:center;margin-left:auto} .main-nav>ul{display:flex;gap:1.3rem;align-items:center} .main-nav a{font-family:"Poppins",sans-serif;font-weight:600;font-size:.88rem;text-transform:uppercase; letter-spacing:.03em;color:var(--dark);position:relative;display:inline-flex;align-items:center;gap:.25rem} .main-nav a:hover{color:var(--brand)} .main-nav>ul>li>a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--brand);transition:width .25s} .main-nav>ul>li>a:hover::after{width:100%} .main-nav .caret{font-size:.7rem;opacity:.7} /* Dropdown */ .has-sub{position:relative} .subnav{position:absolute;left:0;top:100%;min-width:230px;background:#fff;border:1px solid #ece5df;border-radius:12px; box-shadow:0 20px 44px -20px rgba(0,0,0,.4);padding:.5rem;opacity:0;visibility:hidden;transform:translateY(8px); transition:opacity .2s,transform .2s,visibility .2s;z-index:5} .has-sub:hover .subnav,.has-sub:focus-within .subnav{opacity:1;visibility:visible;transform:none} .subnav a{display:block;padding:.6rem .8rem;border-radius:8px;text-transform:none;letter-spacing:0;font-size:.9rem} .subnav a:hover{background:var(--bg);color:var(--brand)} .subnav a::after{display:none} .nav-cta{padding:.7rem 1.2rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;flex:none} .nav-toggle{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px;margin-left:.2rem} .nav-toggle span{width:26px;height:3px;background:var(--dark);border-radius:3px;transition:.3s} .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)} .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0} .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)} /* Barra ordine sticky (mobile) */ .order-bar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:140;background:var(--brand);color:#fff; text-align:center;padding:.9rem;font-family:"Poppins",sans-serif;font-weight:700;font-size:1rem; box-shadow:0 -6px 22px -8px rgba(0,0,0,.4);letter-spacing:.02em} .order-bar:hover{color:#fff;background:var(--brand-dark)} /* ── Hero (foto + overlay + contenuto) ─────────────────────────────────── */ .hero{position:relative;overflow:hidden;display:flex;align-items:center; min-height:clamp(460px,58vw,640px);color:#fff; background:var(--hero-dark)} .hero-bg{position:absolute;inset:0;z-index:0} .hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.42} .hero::after{content:"";position:absolute;inset:0;z-index:1; background:linear-gradient(105deg,rgba(42,8,6,.92) 0%,rgba(42,8,6,.72) 42%,rgba(42,8,6,.30) 100%)} .hero-inner{position:relative;z-index:2;width:min(1180px,92vw);margin-inline:auto;padding:3.5rem 0} .hero-content{max-width:640px} .hero-kicker{display:inline-block;font-family:"Poppins",sans-serif;font-weight:600;text-transform:uppercase; letter-spacing:.16em;font-size:.8rem;color:var(--brand-2);margin-bottom:1rem; border:1px solid rgba(200,153,46,.5);border-radius:999px;padding:.35rem 1rem} .hero h1{color:#fff;font-size:clamp(2rem,5vw,3.4rem);line-height:1.12;margin-bottom:1.1rem; text-shadow:0 3px 18px rgba(0,0,0,.35)} .hero h1 strong{color:var(--brand-2);font-weight:400} .hero-lead{font-size:clamp(1.05rem,2vw,1.3rem);color:#f3e9e4;max-width:560px;margin-bottom:1.8rem} .hero-actions{display:flex;gap:.9rem;flex-wrap:wrap} /* ── Philosophy ────────────────────────────────────────────────────────── */ .philosophy{text-align:center} .philosophy-inner{max-width:820px;margin:0 auto} .philosophy h2{font-size:clamp(1.6rem,3.4vw,2.5rem)} /* ── Founder (due colonne) ─────────────────────────────────────────────── */ .founder{background:#fff} .split{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.8rem,5vw,4rem);align-items:center} .split.rev{grid-template-columns:1.1fr .9fr} .split-media img{border-radius:18px;box-shadow:0 24px 50px -26px rgba(0,0,0,.45);width:100%} .split-body h2{font-size:clamp(1.5rem,3vw,2.3rem)} .split-body .btn{margin-top:.6rem} /* ── Smart App band ────────────────────────────────────────────────────── */ .smartapp{background:linear-gradient(120deg,var(--brand-dark) 0%,var(--brand) 60%,var(--brand-light) 100%); color:#fff;text-align:center} .smartapp h2{color:#fff;font-size:clamp(1.5rem,3vw,2.3rem)} .smartapp p{max-width:760px;margin:0 auto 1.6rem;color:#fbeee9} .smartapp .btn{background:var(--brand-2);color:#3a2a00} .smartapp .btn:hover{background:#fff;color:var(--brand)} /* ── Servizi ───────────────────────────────────────────────────────────── */ .services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem} .service-card{background:#fff;border-radius:18px;padding:1.6rem 1.3rem;text-align:center; border:1px solid #efe7e0;box-shadow:0 12px 30px -22px rgba(0,0,0,.4);transition:transform .25s,box-shadow .25s; display:flex;flex-direction:column} .service-card:hover{transform:translateY(-6px);box-shadow:0 24px 44px -24px rgba(0,0,0,.4)} .service-icon{width:92px;height:92px;margin:0 auto 1rem;border-radius:50%;overflow:hidden; border:3px solid var(--brand-2);background:var(--brand);padding:16px; box-shadow:0 8px 20px -12px rgba(128,0,0,.6)} .service-icon img{width:100%;height:100%;object-fit:contain} .service-card h3{font-size:1.05rem;margin-bottom:.5rem} .service-card p{font-size:.94rem;flex:1} .service-card .btn{margin-top:1rem} /* ── Gallery ───────────────────────────────────────────────────────────── */ .gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem} .gallery-item{position:relative;border-radius:16px;overflow:hidden;box-shadow:0 16px 36px -24px rgba(0,0,0,.5);aspect-ratio:4/3} .gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s} .gallery-item:hover img{transform:scale(1.06)} .gallery-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.4rem .9rem .8rem;color:#fff; font-family:"Poppins",sans-serif;font-weight:600;font-size:.92rem; background:linear-gradient(0deg,rgba(0,0,0,.7),transparent)} /* ── Quote ─────────────────────────────────────────────────────────────── */ .quote-band{background:var(--dark);color:#f3ece6;text-align:center} .quote-band blockquote{max-width:820px;margin:0 auto;font-family:"Aclonica",serif; font-size:clamp(1.3rem,3vw,2rem);line-height:1.35;color:#fff} .quote-band cite{display:block;margin-top:1rem;font-style:normal;color:var(--brand-2);font-size:1rem;font-family:"Poppins",sans-serif} /* ── Courses band ──────────────────────────────────────────────────────── */ .courses{background:var(--bg)} .courses-inner{max-width:820px;margin:0 auto;text-align:center} /* ── Reviews (carosello) ───────────────────────────────────────────────── */ .reviews{background:#fff} .carousel{position:relative;width:min(1180px,92vw);margin:1.5rem auto 0} .carousel-track{display:flex;gap:1.4rem;overflow-x:auto;scroll-snap-type:x mandatory; scroll-behavior:smooth;padding:1rem .3rem 1.6rem;scrollbar-width:none} .carousel-track::-webkit-scrollbar{display:none} .review-card{scroll-snap-align:center;flex:0 0 min(380px,82vw);background:var(--bg);border-radius:16px; padding:1.7rem;border:1px solid #efe7e0;box-shadow:0 14px 34px -24px rgba(0,0,0,.35)} .review-card .stars{color:var(--brand-2);letter-spacing:2px;margin-bottom:.6rem} .review-card blockquote{margin:0 0 1rem;font-size:.98rem;font-style:italic;color:var(--text)} .review-card figcaption{font-family:"Poppins",sans-serif;font-weight:700;color:var(--dark)} .review-card .src{color:var(--brand);font-weight:600;font-size:.85rem} .carousel-nav{position:absolute;top:42%;transform:translateY(-50%);z-index:2;width:46px;height:46px; border-radius:50%;border:0;background:#fff;color:var(--brand);font-size:1.6rem;cursor:pointer; box-shadow:0 8px 20px -8px rgba(0,0,0,.4);display:grid;place-items:center;transition:background .2s,transform .2s} .carousel-nav:hover{background:var(--brand);color:#fff} .carousel-nav.prev{left:-8px}.carousel-nav.next{right:-8px} /* ── Mission ───────────────────────────────────────────────────────────── */ .mission{background:linear-gradient(180deg,var(--bg),#fff)} .mission-inner{max-width:820px;margin:0 auto;text-align:center;font-size:1.06rem} /* ── Blog preview ──────────────────────────────────────────────────────── */ .posts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem} .post-card{background:#fff;border-radius:16px;overflow:hidden;border:1px solid #efe7e0; box-shadow:0 14px 34px -24px rgba(0,0,0,.35);transition:transform .25s,box-shadow .25s;display:flex;flex-direction:column} .post-card:hover{transform:translateY(-5px);box-shadow:0 24px 44px -24px rgba(0,0,0,.4)} .post-card .thumb{aspect-ratio:16/9;overflow:hidden;background:var(--bg)} .post-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s} .post-card:hover .thumb img{transform:scale(1.05)} .post-card .pc-body{padding:1.2rem 1.3rem 1.4rem;display:flex;flex-direction:column;flex:1} .post-card .cat{font-family:"Poppins",sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.08em; font-size:.7rem;color:var(--brand);margin-bottom:.4rem} .post-card h3{font-size:1.02rem;line-height:1.3;margin-bottom:.5rem} .post-card p{font-size:.92rem;color:var(--text);flex:1} .post-card .date{font-size:.8rem;color:#9a8f86;margin-top:.6rem} .post-card a.stretched{color:inherit} .post-card a.stretched::after{content:"";position:absolute;inset:0} /* ── Contatto / form ───────────────────────────────────────────────────── */ .contact{background:var(--dark);color:#efe7e1} .contact .section-title{color:#fff} .contact .section-title::after{background:var(--brand-2)} .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:start;margin-top:1rem} .contact-info h3{color:#fff;font-size:1.2rem} .contact-info a{color:var(--brand-2)} .contact-info .map{margin-top:1.2rem;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.12)} .contact-info .map iframe{width:100%;height:260px;border:0;display:block;filter:grayscale(.2)} .lead-form{background:#fff;border-radius:18px;padding:1.8rem;text-align:left;color:var(--text);box-shadow:0 24px 50px -24px rgba(0,0,0,.5)} .lead-form .field{margin-bottom:1rem} .lead-form label{display:block;font-family:"Poppins",sans-serif;font-weight:600;font-size:.85rem;margin-bottom:.35rem;color:var(--dark)} .lead-form input[type=text],.lead-form input[type=email],.lead-form input[type=tel],.lead-form textarea{width:100%;padding:.85rem 1rem; border:1.5px solid #ded5cd;border-radius:10px;font:inherit;transition:border-color .2s,box-shadow .2s;resize:vertical} .lead-form input:focus,.lead-form textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(128,0,0,.14);outline:none} .lead-form .hp{position:absolute;left:-9999px} .checkbox{display:flex;align-items:flex-start;gap:.6rem;font-size:.9rem;margin:.6rem 0 1.2rem;font-weight:400} .checkbox input{margin-top:.25rem;width:18px;height:18px;accent-color:var(--brand)} .lead-feedback{margin:.8rem 0 0;font-weight:600;font-size:.95rem} .lead-feedback.ok{color:#1a7a45}.lead-feedback.err{color:var(--brand)} .contact-note{margin-top:1rem;color:#c9bdb5;font-size:.9rem} /* ── FAQ ───────────────────────────────────────────────────────────────── */ .faq-list{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:.8rem} .faq-item{background:#fff;border:1px solid #efe7e0;border-radius:12px;overflow:hidden} .faq-item summary{cursor:pointer;list-style:none;padding:1.1rem 1.4rem;font-family:"Poppins",sans-serif; font-weight:600;font-size:1rem;color:var(--dark);display:flex;justify-content:space-between;align-items:center;gap:1rem} .faq-item summary::-webkit-details-marker{display:none} .faq-item summary::after{content:"+";font-size:1.5rem;color:var(--brand);transition:transform .25s;flex:none} .faq-item[open] summary::after{transform:rotate(45deg)} .faq-answer{padding:0 1.4rem 1.3rem;color:var(--text)} /* ── Pagine generiche / legali / articoli ─────────────────────────────── */ .page-hero{background:var(--hero-dark);color:#fff;padding:clamp(2.4rem,6vw,4rem) 0 clamp(2rem,5vw,3rem);text-align:center;position:relative} .page-hero h1{color:#fff;font-size:clamp(1.7rem,4vw,2.8rem)} .page-hero p{max-width:720px;margin:.4rem auto 0;color:#f2e7e1} .prose{max-width:800px;margin:0 auto} .prose h2{font-size:clamp(1.3rem,2.6vw,1.9rem);margin-top:2rem} .prose h3{font-size:1.2rem;margin-top:1.5rem} .prose ul{list-style:disc;padding-left:1.3rem;margin:0 0 1rem} .prose ol{list-style:decimal;padding-left:1.3rem;margin:0 0 1rem} .prose li{margin:.3rem 0} .prose a{text-decoration:underline} .legal-updated{color:#8a7f76;font-size:.9rem} /* Blocchi servizi/pagina */ .info-blocks{display:grid;gap:1.2rem;max-width:880px;margin:0 auto} .info-block{background:#fff;border:1px solid #efe7e0;border-left:4px solid var(--brand);border-radius:12px;padding:1.3rem 1.5rem;scroll-margin-top:120px} .info-block h3{color:var(--brand);font-size:1.15rem;margin-bottom:.4rem} .info-block p{margin:0} /* Timeline (team) */ .timeline{max-width:760px;margin:2rem auto 0;position:relative;padding-left:1.5rem;border-left:3px solid var(--brand-2)} .timeline li{position:relative;padding:0 0 1.4rem 1.2rem} .timeline li::before{content:"";position:absolute;left:calc(-1.5rem - 1.5px);top:.35rem;width:14px;height:14px; border-radius:50%;background:var(--brand);transform:translateX(-50%);border:3px solid var(--bg)} .timeline .year{font-family:"Aclonica",sans-serif;color:var(--brand);font-size:1.1rem;display:block} /* ── Menu page (SmartAppFood embed) ────────────────────────────────────── */ .menu-embed-wrap{max-width:1000px;margin:0 auto} .saf-menu{min-height:280px} .menu-fallback{text-align:center;color:#8a7f76;padding:2rem 0} .menu-sections{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;max-width:900px;margin:2.5rem auto 0} .menu-section-card{background:#fff;border:1px solid #efe7e0;border-radius:14px;padding:1.3rem 1.4rem} .menu-section-card h3{color:var(--brand);font-size:1.1rem;margin-bottom:.4rem} .menu-section-card p{margin:0;font-size:.94rem} /* ── Footer ────────────────────────────────────────────────────────────── */ .site-footer{background:#17110f;color:#c3b8b0;padding-top:2.8rem;font-size:.92rem} .footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:1.6rem 2.2rem;padding-bottom:2rem;align-items:start} .footer-brand img{height:56px;width:auto} .footer-brand p{margin:.8rem 0 0;font-size:.88rem;color:#a99e96;max-width:34ch} .footer-social{display:flex;gap:.5rem;margin-top:1rem} .footer-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:grid;place-items:center; color:#e7ddd6;font-weight:700;transition:background .2s,transform .2s} .footer-social a:hover{background:var(--brand);transform:translateY(-3px);color:#fff} .footer-col h4{color:#fff;font-family:"Poppins",sans-serif;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.85rem} .footer-col p{margin:.3rem 0} .footer-col ul{display:flex;flex-direction:column;gap:.5rem} .site-footer a{color:#c3b8b0}.site-footer a:hover{color:#fff} .footer-hours{font-size:.86rem} .footer-hours li{display:flex;justify-content:space-between;gap:1rem;padding:.15rem 0;border-bottom:1px dashed rgba(255,255,255,.08)} .footer-hours li.closed span:last-child{color:var(--brand-2)} .footer-bottom{border-top:1px solid rgba(255,255,255,.08);padding:1.3rem 0;font-size:.82rem;text-align:center} .footer-bottom>.container>p{margin:0} .footer-credit{margin-top:.4rem;font-size:.74rem;opacity:.6} .footer-credit p{margin:0} .footer-credit a{color:#d6cbc3} .footer-credit a:hover{color:#fff;text-decoration:underline} /* ── Cookie bar ────────────────────────────────────────────────────────── */ .cookiebar{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:200;background:#fff; border-radius:14px;box-shadow:0 20px 50px -18px rgba(0,0,0,.45);border:1px solid #ece5df; max-width:980px;margin-inline:auto;box-sizing:border-box} .cookiebar .container{width:auto;max-width:none;margin:0} .cookiebar-inner{display:flex;align-items:center;gap:1.2rem;padding:1.1rem 1.3rem;flex-wrap:wrap} .cookiebar-text{margin:0;font-size:.9rem;flex:1 1 240px;min-width:0} .cookiebar-actions{display:flex;gap:.6rem;flex-wrap:wrap} .cookiebar .btn{padding:.6rem 1.1rem;font-size:.85rem} .cookie-modal{position:fixed;inset:0;z-index:210;display:flex;align-items:center;justify-content:center;padding:1rem} .cookie-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter:blur(2px)} .cookie-modal-box{position:relative;z-index:1;background:#fff;border-radius:16px;max-width:560px;width:100%; max-height:86vh;overflow:auto;padding:2rem;box-shadow:0 30px 70px -20px rgba(0,0,0,.55)} .cookie-modal-box h3{font-size:1.4rem;margin-bottom:.4rem} .cookie-modal-intro{font-size:.92rem;margin-bottom:1.2rem} .cookie-modal-x{position:absolute;top:.8rem;right:1rem;background:none;border:0;font-size:1.8rem;line-height:1;color:#9a8f86;cursor:pointer} .cookie-cats{display:flex;flex-direction:column;gap:.8rem;margin-bottom:1.4rem} .cookie-cat{display:flex;gap:.8rem;align-items:flex-start;padding:1rem;border:1px solid #ece5df;border-radius:12px;cursor:pointer} .cookie-cat input{margin-top:.25rem;width:20px;height:20px;accent-color:var(--brand);flex:none} .cookie-cat-body{display:flex;flex-direction:column;gap:.2rem} .cookie-cat-name{font-family:"Poppins",sans-serif;font-weight:700;color:var(--dark)} .cookie-cat-name em{font-weight:500;color:var(--brand);font-style:normal;font-size:.82rem} .cookie-cat-desc{font-size:.88rem;color:var(--text)} /* Elenco servizi/cookie per categoria (consenso granulare) */ .cookie-cat-group{border:1px solid #ece5df;border-radius:12px;overflow:hidden} .cookie-cat-group>.cookie-cat{border:0;border-radius:0} .cookie-cat-group:has(.cookie-svc-list)>.cookie-cat{border-bottom:1px solid #f0ece7} .cookie-svc-list{margin:0;padding:.5rem .9rem .8rem;display:flex;flex-direction:column;gap:.55rem;background:#faf7f4} .cookie-svc label{display:flex;gap:.6rem;align-items:flex-start;cursor:pointer} .cookie-svc input{margin-top:.2rem;width:18px;height:18px;accent-color:var(--brand);flex:none} .cookie-svc-body{display:flex;flex-direction:column;gap:.12rem} .cookie-svc-name{font-weight:600;font-size:.9rem;color:var(--dark)} .cookie-svc-meta{font-size:.76rem;color:#8a7f76} .cookie-svc-purpose{font-size:.82rem;color:var(--text)} /* Mappe cookie-gated */ .map{position:relative;min-height:200px} .map-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem; text-align:center;padding:1.2rem;background:var(--bg);color:var(--text);border-radius:14px} .map-fallback p{margin:0;font-size:.9rem;max-width:34ch} .map-fallback .row-actions{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center} /* Video embed (YouTube/Vimeo) cookie-gated */ .video-embed{position:relative;margin:1.4rem 0} .video-embed-frame{position:relative;width:100%;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000} .video-embed-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0} .video-embed-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center; gap:.7rem;text-align:center;padding:1.2rem;background:var(--dark);color:#f3ece6;border-radius:14px} .video-embed-play{font-size:2.2rem;color:var(--brand-2);line-height:1} .video-embed-fallback p{margin:0;font-size:.9rem;max-width:36ch;color:#e7ddd6} .cookie-modal-actions{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:flex-end} .cookie-modal-actions .btn{padding:.7rem 1.2rem;font-size:.9rem} .cookie-reopen{position:fixed;left:1rem;bottom:1rem;z-index:150;width:44px;height:44px;border-radius:50%; border:0;background:var(--brand);color:#fff;display:grid;place-items:center;cursor:pointer; box-shadow:0 10px 24px -10px rgba(0,0,0,.5);transition:transform .2s} .cookie-reopen:hover{transform:scale(1.08)} @media(max-width:560px){ .cookie-modal-actions{justify-content:stretch} .cookie-modal-actions .btn{flex:1} .cookiebar-inner{flex-direction:column;align-items:stretch;gap:.9rem;text-align:center;padding:1.1rem} .cookiebar-text{flex:0 0 auto;min-width:0} .cookiebar-actions{width:100%;flex-direction:column;gap:.5rem} .cookiebar-actions .btn{flex:1 1 auto;width:100%} } /* ── Torna su ──────────────────────────────────────────────────────────── */ .to-top{position:fixed;right:1.2rem;bottom:1.2rem;z-index:150;width:48px;height:48px;border-radius:50%; background:var(--brand);color:#fff;display:grid;place-items:center;font-size:1.3rem;opacity:0;pointer-events:none; transform:translateY(12px);transition:opacity .3s,transform .3s;box-shadow:0 10px 24px -10px rgba(128,0,0,.7)} .to-top.show{opacity:1;pointer-events:auto;transform:none} /* ── Chatbot widget ────────────────────────────────────────────────────── */ .sb-chat{position:fixed;right:1.4rem;bottom:1.4rem;z-index:170} .sb-chat-launch{width:58px;height:58px;border-radius:50%;border:0;background:linear-gradient(150deg,var(--brand-light),var(--brand)); color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 14px 30px -10px rgba(128,0,0,.7);transition:transform .2s} .sb-chat-launch:hover{transform:scale(1.06)} .sb-chat-panel{position:absolute;right:0;bottom:72px;width:min(360px,88vw);height:min(520px,72vh); background:#fff;border-radius:16px;box-shadow:0 30px 70px -20px rgba(0,0,0,.5);display:flex;flex-direction:column;overflow:hidden;border:1px solid #ece5df} .sb-chat-head{background:linear-gradient(150deg,var(--brand-light),var(--brand));color:#fff;padding:.9rem 1rem;display:flex;justify-content:space-between;align-items:center} .sb-chat-title{display:flex;align-items:center;gap:.5rem;font-family:"Poppins",sans-serif} .sb-chat-ai{background:rgba(255,255,255,.25);font-size:.65rem;font-weight:700;padding:.1rem .4rem;border-radius:4px;letter-spacing:.5px} .sb-chat-close{background:none;border:0;color:#fff;font-size:1.5rem;cursor:pointer;line-height:1} .sb-chat-note{background:#f6f0ec;color:#6b5d55;font-size:.74rem;padding:.5rem .9rem;border-bottom:1px solid #eee} .sb-chat-msgs{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.6rem;background:#fcfbfa} .sb-msg{max-width:82%;padding:.6rem .85rem;border-radius:14px;font-size:.92rem;line-height:1.45;white-space:pre-wrap;word-wrap:break-word} .sb-msg.me{align-self:flex-end;background:var(--brand);color:#fff;border-bottom-right-radius:4px} .sb-msg.bot{align-self:flex-start;background:#f0eae5;color:var(--dark);border-bottom-left-radius:4px} .sb-msg.typing{opacity:.6;font-style:italic} .sb-chat-input{display:flex;gap:.5rem;padding:.7rem;border-top:1px solid #eee;background:#fff} .sb-chat-input input{flex:1;padding:.65rem .8rem;border:1.5px solid #ded5cd;border-radius:999px;font:inherit} .sb-chat-input input:focus{outline:none;border-color:var(--brand)} .sb-chat-input button{width:42px;height:42px;border-radius:50%;border:0;background:var(--brand);color:#fff;cursor:pointer;flex:none} :root:has([data-chatbot]:not([hidden])) .to-top{bottom:5.8rem} /* ── Reveal on scroll ──────────────────────────────────────────────────── */ .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease} .reveal.is-visible{opacity:1;transform:none} /* ── Responsive ────────────────────────────────────────────────────────── */ @media(max-width:1000px){ .services-grid{grid-template-columns:repeat(2,1fr)} .footer-grid{grid-template-columns:1fr 1fr} } @media(max-width:900px){ .split,.split.rev{grid-template-columns:1fr} .split.rev .split-media{order:-1} .gallery-grid,.posts-grid,.menu-sections{grid-template-columns:1fr} .contact-grid{grid-template-columns:1fr} .order-bar{display:block} body{padding-bottom:3.4rem} /* spazio per la order-bar mobile */ .nav-cta{display:none} /* la CTA header lascia posto alla order-bar */ /* Header mobile: logo a sinistra · lingue al centro · hamburger a destra */ .header-inner{gap:.5rem;position:relative} .brand img{height:46px} .site-header.scrolled .brand img{height:40px} .lang-switch.header-lang{display:inline-block;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0} .lang-switch.header-lang>ul{right:auto;left:50%;transform:translateX(-50%)} .topbar .lang-switch{display:none} /* lingua spostata nell'header */ .nav-toggle{margin-left:auto} .topbar-contacts .sep{display:none} .topbar-inner{justify-content:center;gap:.4rem 1rem} /* Menu mobile off-canvas */ .site-header{backdrop-filter:none;-webkit-backdrop-filter:none} .main-nav{position:fixed;top:0;right:0;height:100vh;height:100dvh;width:min(340px,86vw);z-index:120; background:#fff;flex-direction:column;align-items:flex-start;justify-content:flex-start; gap:.2rem;padding:5rem 1.4rem 2rem;overflow-y:auto;margin-left:0; transform:translateX(100%);transition:transform .3s;box-shadow:-20px 0 50px -20px rgba(0,0,0,.45)} .main-nav.open{transform:none} .main-nav>ul{flex-direction:column;gap:.1rem;width:100%;align-items:stretch} .main-nav>ul>li{width:100%;border-bottom:1px solid #f0ece7} .main-nav>ul>li>a{display:flex;padding:.9rem .2rem;font-size:1rem} .main-nav>ul>li>a::after{display:none} .subnav{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 .4rem 1rem;min-width:0} .subnav a{padding:.5rem .2rem} .nav-toggle{display:flex;z-index:130} .nav-lang{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:1rem;padding-top:1rem;border-top:1px solid #f0ece7;width:100%} .nav-lang a{padding:.4rem .7rem;border:1.5px solid #e0d8d0;border-radius:8px;font-weight:700;font-size:.85rem;color:var(--dark)} .nav-lang a.on{background:var(--brand);color:#fff;border-color:var(--brand)} } @media(max-width:560px){ .services-grid{grid-template-columns:1fr} .footer-grid{grid-template-columns:1fr;text-align:center} .footer-social{justify-content:center} .footer-hours li{max-width:280px;margin:0 auto} .hero-actions .btn{width:100%} } /* ── Riduzione movimento ───────────────────────────────────────────────── */ @media(prefers-reduced-motion:reduce){ *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important} .reveal{opacity:1;transform:none} }