/* Proposte 4/11/2026: parti comuni alle tre varianti del pannello con i servizi di IA (A, B, C). */
.ia{--testo:#f7f9f8;--tenue:#f7f9f8c2;--filo:#e3e9de3d;--banda:#f1c47b1a}
.ia button{font:inherit;color:inherit}
.ia button:focus-visible,.ia [tabindex="-1"]:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:4px}
.ia [tabindex="-1"]:focus:not(:focus-visible){outline:none}

/* Testata che si fa piccola quando si legge: resta il titolo su una riga. */
.ia h1{transition:font-size .35s ease,margin .35s ease}
.ia.compatto .panel-kicker,.ia.compatto .panel-intro{display:none}
.ia.compatto h1{font-size:clamp(24px,min(1.9vw,3.6vh),40px);margin-bottom:4px}
.ia.compatto h1 br{display:none}

/* Su computer il pannello resta dentro la stanza: niente pagina che si allunga. */
@media(min-width:1101px){.ia.work-panel{max-height:calc(100svh - 132px)}}

/* Testo di un servizio o di un caso. */
.ia .lettura h3{margin:0 0 12px;font-size:clamp(21px,min(1.45vw,2.9vh),34px);line-height:1.14;letter-spacing:-.025em;font-weight:600;color:#fff7e8}
.ia .lettura p,.ia .foglio>p{margin:0 0 12px;font-size:clamp(15px,min(.95vw,2vh),21px);line-height:1.5;color:var(--testo)}
.ia .chi{display:flex;flex-wrap:wrap;gap:2px 18px;font-weight:600;color:var(--gold)!important}
.ia .chi span+span{color:var(--tenue);font-weight:500}
.ia .parte h4,.ia .rimandi h4{margin:0 0 3px;font-size:clamp(13px,min(.8vw,1.75vh),17px);line-height:1.3;font-weight:600;letter-spacing:.01em;color:var(--gold)}
.ia .parte p{margin:0 0 12px}
.ia .rimandi{margin-top:16px}
.ia .rimandi ul{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 26px}
.ia .rimandi button{background:none;border:0;padding:4px 0;cursor:pointer;text-align:left;color:#fff7e8}
.ia .rimandi strong{font-weight:600;font-size:clamp(15px,min(.92vw,1.95vh),20px);text-decoration:underline;text-decoration-color:#f4c67899;text-underline-offset:5px;text-decoration-thickness:1px}
.ia .rimandi small{display:block;margin-top:2px;color:var(--tenue);font-size:clamp(13px,min(.8vw,1.75vh),15px)}
.ia .rimandi button:hover strong{color:var(--gold);text-decoration-color:currentColor}
.ia .rimandi button:not(:has(strong)){font-weight:600;font-size:clamp(15px,min(.92vw,1.95vh),18px);text-decoration:underline;text-decoration-color:#f4c67899;text-underline-offset:5px}

/* Contenitore che prende lo spazio libero fra testata e pulsante dei contatti. */
.ia .contact{flex:none}

@media(max-width:760px){
 .ia.compatto h1{font-size:26px;line-height:1.1}
 .ia .lettura h3{font-size:21px}
 .ia .lettura p,.ia .foglio>p{font-size:16px}
 .ia .parte h4,.ia .rimandi h4{font-size:14px}
}

/* 4/11/2026, commento dell'utente sulla A: pulsante dei contatti discreto in alto a destra, pannello più largo. */
.ia .contatto-alto{position:absolute;z-index:3;top:clamp(22px,2.6vh,36px);right:clamp(24px,3vw,64px);display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border:1.5px solid #f4c678b3;border-radius:10px;color:#fff7e8;text-decoration:none;font:600 clamp(14px,min(.85vw,1.8vh),18px)/1.2 Jost,General,sans-serif;letter-spacing:.01em;transition:background .2s ease,border-color .2s ease}
.ia .contatto-alto span{color:var(--gold);font:18px General,Arial,sans-serif}
.ia .contatto-alto:hover{background:#f4c67826;border-color:var(--gold)}
.ia .contatto-alto:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.ia .panel-kicker,.ia.compatto h1,.ia .briciole{margin-right:clamp(220px,15vw,300px)}
@media(min-width:1101px){.ia.work-panel{width:59vw;margin-right:2.4vw;padding-left:4.6vw;padding-right:4.6vw}}
@media(min-width:1101px) and (max-height:860px){.ia.work-panel{width:58vw;margin-right:2.4vw}}

/* Briciole di pane: compaiono quando si entra in una scheda, al posto della riga in maiuscolo. */
.briciole{display:none;margin-bottom:10px}
.ia.compatto .briciole{display:block}
.briciole ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;font-size:clamp(14px,min(.85vw,1.8vh),17px);line-height:1.3;color:var(--tenue)}
.briciole li:not(:first-child)::before{content:"›";margin:0 10px;color:var(--gold)}
.briciole a,.briciole button{background:none;border:0;padding:2px 0;color:#fff7e8;cursor:pointer;text-decoration:underline;text-decoration-color:#f4c67880;text-underline-offset:4px;font:inherit}
.briciole a:hover,.briciole button:hover{color:var(--gold)}
.briciole [aria-current]{color:var(--gold);font-weight:600}
@media(max-width:760px){
 .ia .contatto-alto{position:static;margin:0 0 14px;padding:8px 13px;font-size:14px}
 .ia .panel-kicker,.ia.compatto h1,.ia .briciole{margin-right:0}
 .briciole ol{font-size:13px}
}

/* Aperta con #caso-… o #servizio-…, il browser faceva scorrere la stanza (overflow:hidden) fino al foglio: 277 px a 2400 × 1260
   e la testata del pannello usciva dallo schermo. overflow:clip taglia allo stesso modo ma non scorre; Safari prima della 16 tiene hidden. */
@media(min-width:761px){.room{overflow:hidden;overflow:clip}}