
body{margin:0}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:3px solid currentColor;outline-offset:3px}
/* Pulsante del sito: blu e tortora si scambiano all'hover; il bordo segue il testo, così resta visibile anche su uno sfondo dello stesso colore */
.bt{display:inline-flex;align-items:center;gap:10px;min-height:56px;box-sizing:border-box;padding:0 26px 0 20px;border:2px solid currentColor;border-radius:999px;font-family:inherit;font-weight:700;font-size:18px;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.bt .mk{width:24px;height:24px}
.bt-blu,.bt-tortora:hover{background:#4A5B6D;color:#F0ECE3}
.bt-tortora{background:#E5DBD1;color:#4A5B6D}
.bt-blu:hover{background:#FCF3E5;color:#4A5B6D}
.bt:focus-visible{outline:3px solid #4A5B6D;outline-offset:3px}
/* Su telefono le CTA stanno al centro dello schermo, come nella hero del Residence; .cta è il gruppo di pulsanti (revisione mobile del 2026-11-12) */
@media (max-width:600px){.bt,.ctel,.cta{align-self:center!important}.cta{justify-content:center!important;text-align:center}}
.bt.lt:focus-visible{outline-color:#F0ECE3}
@media (prefers-reduced-motion:reduce){.bt{transition:none}}
/* Pulsante WhatsApp «Chiamaci o scrivici»: l'unico verde del sito, uguale su ogni sfondo; #40843C tiene il testo bianco a 4,6:1 e il bordo bianco lo stacca dalle sezioni blu */
.ctel{position:relative}
.ctel summary{list-style:none;display:inline-flex;align-items:center;gap:10px;min-height:56px;box-sizing:border-box;padding:0 24px 0 18px;border:2px solid currentColor;border-radius:999px;background:#40843C;color:#FFFFFF;font-weight:700;font-size:18px;cursor:pointer;transition:background .2s}
.ctel summary::-webkit-details-marker{display:none}
.ctel summary:hover,.ctel[open] summary{background:#2F6B2C}
.ctel summary:focus-visible{outline:3px solid #4A5B6D;outline-offset:3px}
.ctel-menu{position:absolute;left:0;right:0;top:calc(100% + 10px);z-index:5;display:flex;flex-direction:column;padding:8px;background:#FFFFFF;border-radius:16px;box-shadow:0 18px 40px rgba(20,28,38,0.22)}
.ctel-menu a{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 14px;border-radius:10px;color:#4A5B6D;font-weight:600;font-size:17px;text-decoration:none}
.ctel-menu a:hover{background:#F0ECE3}
.ctel.su .ctel-menu{top:auto;bottom:calc(100% + 10px)}
@media (prefers-reduced-motion:reduce){.ctel summary{transition:none}}
.lnk:hover{text-decoration:underline}
.lnk.on{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px}
.deco{position:absolute;display:block;pointer-events:none;background:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;animation:floaty 9s ease-in-out infinite}
.deco.lt{color:rgba(240,236,227,0.22)}
.deco.dk{color:rgba(74,91,109,0.18)}
.deco.s2{animation-duration:11s;animation-delay:-4s}
.deco.s3{animation-duration:13s;animation-delay:-7s}
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 -14px}}
@supports (animation-timeline: view()){
.deco{animation:floaty 9s ease-in-out infinite,drift linear both;animation-timeline:auto,view()}
.deco.s2{animation-duration:11s,auto;animation-delay:-4s,0s}
.deco.s3{animation-duration:13s,auto;animation-delay:-7s,0s}
@keyframes drift{from{transform:translateY(50px)}to{transform:translateY(-50px)}}
}
.i-paws{-webkit-mask-image:url(/img/icona-paws.svg);mask-image:url(/img/icona-paws.svg)}
.i-paw{-webkit-mask-image:url(/img/icona-paw.svg);mask-image:url(/img/icona-paw.svg)}
.i-chat{-webkit-mask-image:url(/img/icona-chat.svg);mask-image:url(/img/icona-chat.svg)}
.i-pin{-webkit-mask-image:url(/img/icona-pin.svg);mask-image:url(/img/icona-pin.svg)}
.i-dog{-webkit-mask-image:url(/img/icona-dog.svg);mask-image:url(/img/icona-dog.svg)}
.i-heartpaw{-webkit-mask-image:url(/img/icona-heartpaw.svg);mask-image:url(/img/icona-heartpaw.svg)}
.i-kennel{-webkit-mask-image:url(/img/icona-kennel.svg);mask-image:url(/img/icona-kennel.svg)}
.i-food{-webkit-mask-image:url(/img/icona-food.svg);mask-image:url(/img/icona-food.svg)}
.i-bowl15{-webkit-mask-image:url(/img/icona-bowl15.svg);mask-image:url(/img/icona-bowl15.svg)}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.ast{margin-left:3px}label:has(>input[type=checkbox])>.ast{margin-left:-7px}.obb{margin:-6px 0 0;font-size:15px;color:#6A6560}.tel{display:flex;gap:8px}.tel select.inp{flex:none;width:auto;padding-right:8px}.tel input.inp{flex:1;min-width:0}.fld label{font-size:15px;font-weight:600;color:#3E4C5B}
.inp{font:inherit;font-size:17px;color:#3E4C5B;background:#FFFFFF;border:1.5px solid #6D8399;border-radius:2px;min-height:48px;padding:10px 12px;box-sizing:border-box;width:100%}
.inp:focus{outline:3px solid #4A5B6D;outline-offset:1px;border-color:#4A5B6D}
textarea.inp{min-height:130px;resize:vertical}
@keyframes pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.12);opacity:1}100%{transform:scale(1);opacity:1}}
.pop{animation:pop .6s cubic-bezier(.2,.8,.2,1) both}
/* Blocco contatto della home (link rapidi e gate verso i moduli): stesse regole */
.qlink{display:flex;align-items:center;gap:14px;min-height:56px;text-decoration:none;border-radius:12px;padding:6px 12px 6px 6px;transition:background .2s}
.qlink:hover{background:rgba(255,255,255,0.12)}
.qic{flex:none;width:44px;height:44px;border-radius:50%;background:#FCF3E5;color:#4A5B6D;display:flex;align-items:center;justify-content:center}
.qic.wa{background:#40843C;color:#FFFFFF}
.mk{display:block;flex:none;background:currentColor;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}
.gate{display:flex;align-items:center;gap:20px;background:#FFFFFF;color:#3E4C5B;border-radius:16px;padding:6px 20px 6px 6px;text-decoration:none;box-shadow:0 10px 26px rgba(20,28,38,0.22);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.gate:hover,.gate:focus-visible{transform:translateY(-4px);box-shadow:0 16px 32px rgba(20,28,38,0.3)}
.gate:focus-visible{outline:3px solid #FFFFFF;outline-offset:3px}
.gate .gph{flex:none;width:150px;align-self:stretch;min-height:132px;border-radius:10px;overflow:hidden;position:relative;background:#D1CABE}
.gate .gph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.gate:hover .gph img{transform:scale(1.06)}
.gate .gtx{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:12px 0;font-size:16px;line-height:1.45;color:#4A5B6D}
.gate .gtx strong{font-family:'Lora',Georgia,serif;font-weight:500;font-size:22px;line-height:1.25;color:#3E4C5B}
.gate .gic{width:40px;height:40px;margin-bottom:4px;border-radius:50%;background:#E5DBD1;color:#4A5B6D;display:flex;align-items:center;justify-content:center;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.gate .gic .mk{width:24px;height:24px}
.gate:hover .gic{transform:rotate(-10deg) scale(1.08)}
.gate .gar{flex:none;width:44px;height:44px;border-radius:50%;background:#4A5B6D;color:#F0ECE3;display:flex;align-items:center;justify-content:center;transition:transform .3s ease}
.gate:hover .gar{transform:translateX(4px)}
@media (max-width:520px){.gate{flex-wrap:wrap;padding:6px}.gate .gph{width:100%;min-height:160px}.gate .gtx{padding:4px 8px}.gate .gar{display:none}}
@media (prefers-reduced-motion:reduce){.gate,.gate .gph img,.gate .gic,.gate .gar{transition:none}.gate:hover,.gate:focus-visible,.gate:hover .gph img,.gate:hover .gic,.gate:hover .gar{transform:none}}
.soc{width:64px;height:64px;border-radius:50%;border:2px solid #4A5B6D;color:#4A5B6D;display:flex;align-items:center;justify-content:center;box-sizing:border-box;box-shadow:inset 0 0 0 0 #4A5B6D;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,color .25s ease}
.soc:hover,.soc:focus-visible{transform:translateY(-5px);box-shadow:inset 0 0 0 32px #4A5B6D,0 10px 20px rgba(46,51,56,0.25);color:#F0ECE3}
.soc.lt{border-color:#F0ECE3;color:#F0ECE3;box-shadow:inset 0 0 0 0 #F0ECE3}
.soc.lt:hover,.soc.lt:focus-visible{box-shadow:inset 0 0 0 32px #F0ECE3,0 10px 20px rgba(20,28,38,0.35);color:#4A5B6D}
.soc:hover svg,.soc:focus-visible svg{animation:wig .55s ease}
@keyframes wig{0%{transform:scale(1) rotate(0deg)}40%{transform:scale(1.22) rotate(-10deg)}70%{transform:scale(.95) rotate(6deg)}100%{transform:scale(1) rotate(0deg)}}
@media (prefers-reduced-motion:reduce){.deco,.pop{animation:none}.soc{transition:none}.soc:hover,.soc:focus-visible{transform:none}.soc:hover svg,.soc:focus-visible svg{animation:none}}

/* Griglia unica del sito: tutti i contenitori di sezione sono larghi 1360px; le sezioni di solo testo centrato tengono una riga leggibile */
.txt>p,.txt>h1,.txt>h2{max-width:820px}
/* Header: resta in alto durante lo scroll; sotto i 1100px il menu diventa un pannello */
:root{scroll-padding-top:96px}
.hd{position:sticky;top:0;z-index:50;background:#4A5B6D;color:#F0ECE3}
.hd-in{max-width:1360px;margin:0 auto;box-sizing:border-box;padding:12px clamp(20px,5vw,64px);display:flex;align-items:center;justify-content:space-between;gap:8px 32px}
.hd-logo{display:flex;align-items:center;min-height:44px;min-width:0}
.hd-logo img{display:block;width:260px;max-width:100%;height:auto}
.hd-nav{display:block;position:static;inset:auto;width:auto;height:auto;margin:0;padding:0;border:0;background:none;color:inherit;overflow:visible}
.hd-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:0 28px}
.hd-nav ul a{position:relative;display:flex;align-items:center;min-height:44px;color:inherit;text-decoration:none;font-size:17px;font-weight:600}
/* pagina corrente: barra tortora sotto la voce, diversa dalla sottolineatura dell'hover */
.hd-nav ul a.on,.hd-nav ul a.on:hover{text-decoration:none}
.hd-nav ul a.on::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:4px;border-radius:2px;background:#E5DBD1}
.hd-apri,.hd-top,.hd-wa{display:none}
@supports (animation-timeline:scroll()){
.hd{animation:hd-ombra linear both;animation-timeline:scroll(root);animation-range:0 120px}
.hd-in{animation:hd-stretto linear both;animation-timeline:scroll(root);animation-range:0 120px}
.hd-logo img{animation:hd-logo linear both;animation-timeline:scroll(root);animation-range:0 120px}
}
@keyframes hd-ombra{to{box-shadow:0 8px 24px rgba(20,28,38,0.28)}}
@keyframes hd-stretto{to{padding-top:6px;padding-bottom:6px}}
@keyframes hd-logo{to{width:190px}}
@media (max-width:1099px){
.hd-apri{display:inline-flex;align-items:center;gap:8px;flex:none;min-height:48px;padding:0 16px 0 12px;border:2px solid rgba(240,236,227,0.55);border-radius:10px;background:none;color:inherit;font:inherit;font-size:17px;font-weight:700;cursor:pointer}
.hd-apri:hover{background:rgba(240,236,227,0.12)}
.hd-nav{display:none;position:fixed;inset:0 0 0 auto;width:min(360px,100%);height:100dvh;max-height:none;box-sizing:border-box;padding:16px 24px 28px;background:#F0ECE3;color:#4A5B6D;box-shadow:-12px 0 40px rgba(20,28,38,0.3);overflow:auto}
.hd-nav:popover-open{display:flex;flex-direction:column}
.hd-nav::backdrop{background:rgba(20,28,38,0.55)}
.hd-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.hd-tit{font-family:'Lora',Georgia,serif;font-size:24px;font-weight:500}
.hd-chiudi{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border:0;border-radius:50%;background:#E5DBD1;color:#4A5B6D;cursor:pointer}
.hd-nav ul{flex-direction:column;flex-wrap:nowrap;gap:0}
.hd-nav ul li+li{border-top:1px solid #D1CABE}
.hd-nav ul a{min-height:56px;font-family:'Lora',Georgia,serif;font-size:22px;font-weight:500}
.hd-nav ul a.on{margin:0 -12px;padding:0 12px;border-radius:10px;background:#4A5B6D;color:#F0ECE3;font-weight:600}
.hd-nav ul a.on::after{content:none}
.hd-wa{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:auto;min-height:56px;box-sizing:border-box;padding:0 20px;border:2px solid currentColor;border-radius:999px;background:#40843C;color:#FFFFFF;font-weight:700;font-size:18px;text-decoration:none}
.hd-wa:hover{background:#2F6B2C}
}
