/* Proposta 4 approvata: navigazione orizzontale e tre anteprime essenziali. */
:root{--es-blue:var(--opero-accent);--es-ink:var(--opero-ink);--es-muted:var(--opero-ink);--es-line:var(--opero-line)}
body{background:#fff}
.ref-header{margin:0;border:0;border-bottom:1px solid var(--es-line);border-radius:0;background:#fffffff5;box-shadow:none}
.ref-header .header-row{width:min(1440px,calc(100% - 8.4%));min-height:84px;padding:0;display:grid;grid-template-columns:1fr auto 1fr;gap:28px}
.ref-header .brand{width:170px;flex-basis:auto}
.ref-header .brand svg{width:170px;height:43px}
.ref-header .desktop-nav{margin:0;gap:16px}
.ref-header .desktop-nav a,.ref-header .desktop-nav a:nth-last-child(2){font-size:1rem;line-height:1.4;color:var(--es-ink);border:0;padding:10px 15px;border-radius:9px;transition:color .18s,background .18s,box-shadow .18s}
.ref-header .desktop-nav a:hover{color:var(--opero-ink);background:var(--opero-surface-warm)}
.ref-header .desktop-nav a[aria-current=page]{color:var(--opero-ink);background:var(--opero-surface-warm);box-shadow:0 0 20px rgb(0 163 224 / 0.137),inset 0 0 0 1px rgb(0 163 224 / 1.000);font-weight:500}
.ref-header .desktop-nav a[aria-current=page]::after{height:2px;left:15px;right:15px;bottom:3px;background:var(--es-blue);border-radius:2px}
.ref-header .rf-header-cta{justify-self:end;background:var(--es-blue);border:1px solid var(--es-blue);border-radius:9px;min-height:48px;min-width:150px;padding:11px 23px;font-size:1rem;box-shadow:none}
.ref-header .rf-header-cta:hover{background:var(--opero-action)}
.ref-header .rf-header-cta[aria-current=page]{box-shadow:0 0 0 4px rgb(0 163 224 / 1.000),0 0 22px rgb(0 163 224 / 0.180)}
.ref-header .mobile-menu{justify-self:end}
.ref-header .mobile-menu nav{padding:12px;background:#fff;border:1px solid var(--es-line);border-radius:12px;box-shadow:0 12px 35px rgb(0 163 224 / 0.082);top:calc(100% + 8px);right:20px;min-width:240px}
.ref-header .mobile-menu nav a{padding:12px 16px;border:0;border-radius:8px;font-size:1rem}
.ref-header .mobile-menu nav a[aria-current=page]{color:var(--opero-ink);background:var(--opero-surface-warm);box-shadow:inset 3px 0 var(--es-blue),0 0 15px rgb(0 163 224 / 0.102);font-weight:500}
.page-servizi{background:#fff;color:var(--es-ink)}
.es-service-nav{border-bottom:1px solid var(--es-line);background:#fff}
.es-service-tabs{display:flex;justify-content:center;align-items:center;gap:35px;min-height:62px;padding:8px 20px}
.es-service-tab{position:relative;min-height:44px;padding:8px 17px;background:transparent;border:0;border-radius:8px;color:var(--es-muted);font:inherit;font-size:1rem;line-height:1.5;cursor:pointer;transition:background .18s,color .18s,box-shadow .18s}
.es-service-tab:hover{background:var(--opero-surface-warm);color:var(--opero-ink)}
.es-service-tab[aria-selected=true]{color:var(--opero-ink);background:var(--opero-surface-warm);box-shadow:0 0 18px rgb(0 163 224 / 0.082);font-weight:500}
.es-service-tab[aria-selected=true]::after{content:"";position:absolute;height:2px;bottom:-9px;left:7px;right:7px;background:var(--es-blue)}
.es-service-tab:focus-visible{outline:2px solid var(--es-blue);outline-offset:3px}
.es-content{width:min(1440px,calc(100% - 8.4%));margin-inline:auto;padding-top:46px}
.es-service-panel.rf-service-panel{display:block;min-height:0;background:none}
.es-service-panel:focus-visible{outline:2px solid var(--es-blue);outline-offset:8px;border-radius:4px}
.es-heading :is(h1,h2){font-size:clamp(2rem,3.15vw,3rem);font-weight:600;line-height:1.15;letter-spacing:-.045em;color:var(--es-ink);margin:0}
.es-heading>p{font-size:clamp(1.125rem,1.85vw,1.65rem);line-height:1.45;color:var(--es-muted);margin:6px 0 0}
.es-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;margin-top:44px}
.es-type-card{min-width:0}
.es-type-card>a{height:100%;display:grid;grid-template-rows:auto auto auto 1fr;align-content:start;border-radius:6px}
.es-type-copy{display:contents}
.es-type-copy h2{font-size:clamp(1.65rem,2.35vw,2.2rem);font-weight:600;letter-spacing:-.045em;line-height:1.2;margin:0 0 7px;color:var(--es-ink)}
.es-type-copy p{font-size:clamp(1rem,1.45vw,1.3rem);line-height:1.45;color:var(--es-muted);margin:0;min-height:2.9em;max-width:360px}
.es-preview{position:relative;overflow:hidden;aspect-ratio:494/326;width:calc(100% + 22px);margin:21px -11px 0;isolation:isolate}
/* Selezioni delle sole anteprime nel rendering approvato, senza ricreare i laptop. */
.es-preview img{position:absolute;display:block;width:310.931174%;max-width:none;height:auto;top:-142.331289%;left:var(--preview-left);mix-blend-mode:multiply}
.es-preview-siti-classici{--preview-left:-5.668016%}
.es-preview-siti-interattivi{--preview-left:-107.692308%}
.es-preview-siti-interattivi img{clip-path:inset(0 35% 0 0)}
.es-preview-siti-immersivi{--preview-left:-204.048583%}
.es-example-link,.es-detail-link{display:flex;align-items:center;gap:12px;width:fit-content;color:var(--opero-ink);font-size:1.125rem;font-weight:500;line-height:1.5;margin-top:21px;min-height:44px}
.es-example-link svg,.es-detail-link svg,.es-help svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.es-type-card>a:hover .es-example-link,.es-detail-link:hover{text-decoration:underline;text-underline-offset:5px;color:var(--opero-ink)}
.es-type-card>a:focus-visible{outline:2px solid var(--es-blue);outline-offset:10px}
.es-topic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;margin-top:48px}
.es-topic-grid article{padding-block:25px;border-top:1px solid var(--es-line)}
.es-topic-grid h2{font-size:1.6rem;line-height:1.25;letter-spacing:-.03em;font-weight:500;margin:0 0 15px}
.es-topic-grid p{font-size:1.0625rem;line-height:1.7;color:var(--es-muted);margin:0}
.es-detail-link{margin-top:12px}
.es-help{border-top:1px solid var(--es-line);margin-top:52px;padding:28px 0 34px;text-align:center}
.es-help p{display:flex;justify-content:center;align-items:center;gap:5px;flex-wrap:wrap;font-size:1.0625rem;line-height:1.6;color:var(--es-muted)}
.es-help a{display:inline-flex;align-items:center;gap:13px;color:var(--opero-ink);min-height:44px;font-weight:500}
.es-help a:hover{text-decoration:underline;text-underline-offset:4px}
.es-no-script{padding:16px;text-align:center;color:var(--es-muted)}
.es-no-script a{color:var(--opero-ink);text-decoration:underline}
@media(max-width:1180px){.es-type-grid,.es-topic-grid{gap:28px}.ref-header .desktop-nav{gap:4px}.ref-header .desktop-nav a,.ref-header .desktop-nav a:nth-last-child(2){padding-inline:12px}.es-type-copy p{max-width:none}}
@media(max-width:1080px){.ref-header .header-row{display:flex;min-height:78px;gap:22px}.ref-header .brand{margin-right:auto}.ref-header .desktop-nav{display:none}.ref-header .mobile-menu{display:block}.ref-header .rf-header-cta{min-width:125px;min-height:44px}.es-content{padding-top:36px}.es-type-grid{margin-top:36px;gap:24px}.es-type-copy h2{font-size:1.55rem}.es-type-copy p{font-size:1rem}.es-example-link{font-size:1rem}}
@media(max-width:760px){.ref-header .header-row,.es-content{width:calc(100% - 40px)}.ref-header .brand,.ref-header .brand svg{width:142px}.ref-header .brand svg{height:37px}.ref-header .rf-header-cta{display:none}.ref-header .header-row{min-height:72px}.es-service-tabs{gap:14px;min-height:62px;padding-inline:10px}.es-service-tab{font-size:1rem;padding-inline:15px}.es-content{padding-top:32px}.es-heading :is(h1,h2){font-size:clamp(2rem,5.8vw,2.6rem);max-width:600px}.es-heading>p{font-size:1.125rem;margin-top:11px}.es-type-grid,.es-topic-grid{grid-template-columns:1fr;gap:32px;margin-top:34px}.es-type-card{max-width:570px;width:100%;margin-inline:auto}.es-type-card+.es-type-card{padding-top:30px;border-top:1px solid var(--es-line)}.es-type-copy h2{font-size:1.75rem}.es-type-copy p{font-size:1.0625rem;min-height:0;max-width:420px}.es-preview{margin-top:17px}.es-example-link{font-size:1.0625rem;margin-top:9px}.es-topic-grid{gap:8px}.es-topic-grid article{padding-block:22px}.es-help{margin-top:36px;padding-block:22px 29px}.es-help p{font-size:1rem}.es-help a{gap:9px}}
@media(prefers-reduced-motion:reduce){.ref-header .desktop-nav a,.es-service-tab{transition:none}}

/* Same approved laptop crop as the other Web cards; only its screen shows TONDO. */
.es-preview-tondo{container-type:inline-size}
.es-tondo-screen{position:absolute;left:7.1%;top:6.7%;width:80.6%;height:81.6%;overflow:hidden;background:#272523;color:#fff9ed;isolation:isolate}
.es-tondo-brand{position:absolute;left:5%;top:7%;font-family:Arial Black,Arial,sans-serif;font-weight:900;font-size:4.8cqw;letter-spacing:-.08em;line-height:1;z-index:2}
.es-tondo-screen-nav{position:absolute;right:5%;top:9%;font-size:1.25cqw;letter-spacing:.04em;z-index:2}
.es-preview-tondo .es-tondo-pizza{position:absolute;width:83%;height:110%;max-width:none;left:41%;top:8%;object-fit:cover;mix-blend-mode:normal;clip-path:none;transform:none;filter:none;z-index:0}
.es-tondo-caption{position:absolute;left:5%;top:33%;font-family:Arial,sans-serif;font-size:6.1cqw;font-weight:700;letter-spacing:-.06em;line-height:1.05;z-index:1}
.es-tondo-caption em{font-family:Georgia,serif;font-weight:400;color:#f8c941;letter-spacing:-.04em}
.es-tondo-screen-cta{position:absolute;left:5%;bottom:10%;padding:3% 4%;background:#f8c941;border-radius:30px;font-size:1.5cqw;font-weight:700;color:#272523;z-index:1}
.es-preview-tondo .es-tondo-pizza{mask-image:linear-gradient(to right,transparent,#000 15%)}
.es-preview-fronda{container-type:inline-size}
.es-fronda-screen{position:absolute;z-index:2;left:9.11%;top:6.75%;width:83.6%;height:81.6%;overflow:hidden;background:#173d29;color:#fff;text-align:left}
.es-preview-fronda .es-fronda-garden{width:100%;height:100%;top:0;left:0;max-width:100%;object-fit:cover;mix-blend-mode:normal}
.es-fronda-screen::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,30,17,.5),rgba(10,30,17,.04));pointer-events:none}
.es-fronda-brand,.es-fronda-screen-nav,.es-fronda-caption,.es-fronda-screen-cta{position:absolute;z-index:1}
.es-fronda-brand{top:6%;left:7%;font:3.6cqw/1 Georgia,serif;letter-spacing:-.07em}
.es-fronda-screen-nav{top:8%;right:6%;font:600 1.05cqw/1 Arial,sans-serif;letter-spacing:.1em}
.es-fronda-caption{top:33%;left:7%;font:7.2cqw/.98 Georgia,serif;letter-spacing:-.045em}
.es-fronda-caption em{font-weight:400}
.es-fronda-screen-cta{bottom:11%;left:7%;padding:1.8% 3%;background:#f7f6ee;color:#193b2a;font:600 1.35cqw/1 Arial,sans-serif}
.rf-fronda-example,.rf-fronda-example iframe{background:#f6f5ee}
.es-preview-soglia{container-type:inline-size}
.es-soglia-screen{position:absolute;z-index:2;left:8.1%;top:6.75%;width:84%;height:81.6%;overflow:hidden;background:#eeede5;color:#343b32;text-align:left}
.es-preview-soglia .es-soglia-house{width:100%;height:100%;top:0;left:0;max-width:100%;object-fit:cover;mix-blend-mode:normal}
.es-soglia-brand,.es-soglia-nav,.es-soglia-caption,.es-soglia-cta,.es-soglia-scroll{position:absolute;z-index:1}
.es-soglia-brand{top:7%;left:7%;font:4cqw/1 Georgia,serif;letter-spacing:-.06em}
.es-soglia-brand em{color:#a75e3f;font-style:normal}.es-soglia-brand small{display:block;font:.85cqw/1 Arial,sans-serif;letter-spacing:.25em;margin-top:1cqw}
.es-soglia-nav{top:10%;right:6%;font:.95cqw/1 Arial,sans-serif;letter-spacing:.025em}
.es-soglia-caption{top:34%;left:7%;font:6.3cqw/1 Georgia,serif;letter-spacing:-.055em}
.es-soglia-caption em{font-weight:400;color:#7f856e}
.es-soglia-cta{bottom:19%;left:7%;padding:2.4% 4%;border-radius:30px;background:#343b32;color:#fff;font:1.2cqw/1 Arial,sans-serif}
.es-soglia-scroll{bottom:8%;left:7%;font:.8cqw/1 Arial,sans-serif;letter-spacing:.1em}
.rf-soglia-example,.rf-soglia-example iframe{background:#eeede5}
