@font-face{font-family:"Gambetta";src:url(fonts/gambetta-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"General Sans";src:url(fonts/general-sans-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"General Sans";src:url(fonts/general-sans-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"General Sans";src:url(fonts/general-sans-600.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
  --or:#EF7A1E; --or-d:#B95408; --or-t:#FFF1E4;
  --ink:#1F2AA0; --navy:#0F1552; --text:#1B1D30; --mute:#555A74;
  --paper:#FFFFFF; --line:rgba(27,29,48,.14);
  --disp:"Gambetta", Georgia, serif; --sans:"General Sans", "Helvetica Neue", Arial, sans-serif;
  --hh:76px; --pad:clamp(20px,4.4vw,72px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:calc(var(--hh) + 16px);-webkit-text-size-adjust:100%}
body{font:400 17px/1.6 var(--sans);color:var(--text);background:var(--paper);overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--or);outline-offset:3px}
.wrap{padding-inline:var(--pad);max-width:1480px;margin-inline:auto}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:12px;z-index:99;background:#fff;padding:8px 14px}
.disp{font-family:var(--disp);font-weight:400;letter-spacing:-.015em;line-height:1.02}
.flags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;list-style:none}
.flags img{width:26px;height:18px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.18)}
.flags a{display:block;padding:3px;border-radius:3px}
.flags a:hover img{transform:translateY(-2px)}
.flags img{transition:transform .2s}

/* ---------- header ---------- */
.hd{position:fixed;inset:0 0 auto;z-index:50;height:var(--hh);color:#fff;transition:background .35s,color .35s,box-shadow .35s}
.hd.is-stuck{background:#fff;color:var(--text);box-shadow:0 1px 0 var(--line),0 8px 24px rgba(15,21,82,.06)}
.hd .wrap{height:100%;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;margin-right:auto;white-space:nowrap}
.brand b{font:400 30px/1 var(--disp);letter-spacing:-.01em}
.brand span{font:500 12px/1 var(--sans);letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.hd nav ul{display:flex;gap:26px;list-style:none}
.hd nav a{font-weight:500;font-size:15.5px;text-decoration:none;padding:8px 0;border-bottom:2px solid transparent}
.hd nav a:hover,.hd nav a[aria-current=page]{border-color:var(--or)}
.hd .tel{font-weight:600;font-size:15px;text-decoration:none;white-space:nowrap}
.menu-btn{font:600 15px/1 var(--sans);background:var(--or);color:var(--navy);border:0;border-radius:999px;padding:12px 18px 12px 16px;display:flex;align-items:center;gap:10px;cursor:pointer;min-height:44px}
.menu-btn i{display:block;width:16px;height:2px;background:currentColor;box-shadow:0 -5px 0 currentColor,0 5px 0 currentColor}
.menu-btn:hover{background:var(--navy);color:#fff}

/* ---------- indice / menu panel ---------- */
.panel{position:fixed;inset:0;z-index:60;background:var(--or);color:var(--navy);overflow:auto;max-height:100svh;
  clip-path:circle(0 at calc(100% - 80px) 38px);transition:clip-path .7s cubic-bezier(.7,0,.2,1);visibility:hidden}
.panel.open{clip-path:circle(150% at calc(100% - 80px) 38px);visibility:visible}
.panel .top{height:var(--hh);display:flex;align-items:center;justify-content:space-between}
.panel .close{font:600 15px/1 var(--sans);background:var(--navy);color:#fff;border:0;border-radius:999px;padding:13px 20px;cursor:pointer;min-height:44px}
.panel-main{display:grid;grid-template-columns:1fr 2.2fr;gap:48px;padding-block:24px 64px}
.panel-main .big{list-style:none}
.panel-main .big a{font:400 clamp(34px,4vw,58px)/1.12 var(--disp);text-decoration:none;display:inline-block;padding:4px 0}
.panel-main .big a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.panel h2{font:600 13px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px;opacity:.85}
.all{columns:3 200px;column-gap:32px;list-style:none}
.all li{break-inside:avoid}
.all a{display:block;padding:7px 0;text-decoration:none;font-weight:500;font-size:16px;border-bottom:1px solid rgba(15,21,82,.22);transition:padding .2s,background .2s,color .2s}
.all a:hover{color:#fff;background:var(--navy);padding-left:8px}
.panel .flags{margin-top:28px}

/* ---------- hero ---------- */
.hero{position:relative;min-height:max(660px,100svh);color:#fff;overflow:hidden;background:#20324a;display:grid}
.hero-bg{position:absolute;inset:-6% 0 0;height:112%;width:100%;object-fit:cover;object-position:50% 40%;will-change:transform}
.hero::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(10,16,52,.78) 0%,rgba(10,16,52,.42) 46%,rgba(10,16,52,0) 72%),
  linear-gradient(0deg,rgba(10,16,52,.85) 0%,rgba(10,16,52,0) 42%)}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:1fr auto;
  gap:24px 40px;padding-top:calc(var(--hh) + 36px);padding-bottom:32px;width:100%}
.hero-txt{align-self:end;padding-bottom:12px}
.hero h1{font-size:clamp(58px,8.4vw,142px);margin-bottom:26px}
.hero h1 span{display:block}
.hero .lead{font-size:clamp(18px,1.45vw,22px);line-height:1.5;max-width:34em;margin-bottom:30px;color:#F4F1FF}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:16px;text-decoration:none;transition:background .2s,color .2s,transform .2s}
.btn:hover{transform:translateY(-2px)}
.btn-or{background:var(--or);color:var(--navy)}.btn-or:hover{background:#fff;color:var(--navy)}
.btn-ghost{box-shadow:inset 0 0 0 1.5px currentColor}.btn-ghost:hover{background:#fff;color:var(--navy)}
.lens-col{position:relative;grid-column:2;grid-row:1;align-self:start;justify-self:start;margin-left:-11vw}
.lens{width:clamp(260px,30vw,470px);aspect-ratio:1;border-radius:50%;background-repeat:no-repeat;will-change:transform,background-position;
  box-shadow:0 0 0 2px rgba(255,255,255,.95),0 0 0 14px rgba(255,255,255,.14),0 30px 80px rgba(0,0,0,.35)}
.proof{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:28px;border-top:1px solid rgba(255,255,255,.35);padding-top:18px;font-size:14.5px;line-height:1.45;color:#EDEBFA}
.proof b{display:block;color:#fff;font-weight:600;font-size:15px;margin-bottom:2px}
.proof .flags{margin-top:6px;gap:4px}
.proof .flags img{width:22px;height:15px}

/* ---------- sections ---------- */
section{position:relative}
.sec{padding-block:clamp(72px,10vw,150px)}
.h2{font-size:clamp(40px,5vw,78px);margin-bottom:28px}
.statement{font:400 clamp(30px,3.3vw,52px)/1.15 var(--disp);letter-spacing:-.01em}
.statement strong{font-weight:400;color:var(--ink)}
.intro{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(32px,6vw,110px);align-items:start}
.prose p+p{margin-top:1em}
.prose a{color:var(--ink);font-weight:600;text-decoration-color:rgba(31,42,160,.35);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--or)}
.credit{margin-top:36px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.credit div{border-top:3px solid var(--or);padding-top:12px;font-size:15px;line-height:1.5}
.credit b{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--or-d);margin-bottom:4px}

/* posizione: foto + campo arancio */
.pos{background:var(--or);color:var(--navy);overflow:hidden}
.pos-photo{position:relative;height:clamp(360px,62vh,640px);overflow:hidden}
.pos-photo img{position:absolute;inset:-12% 0 auto;width:100%;height:124%;object-fit:cover;will-change:transform}
.pos-grid{display:grid;grid-template-columns:auto 1fr;gap:clamp(32px,5vw,90px);align-items:start;margin-top:-140px;position:relative;z-index:2;padding-bottom:clamp(64px,8vw,120px)}
.maps{display:flex;gap:18px;align-items:flex-end}
.maps figure{background:#fff;padding:10px;border-radius:4px;box-shadow:0 24px 60px rgba(90,30,0,.28)}
.maps img.cartina{width:350px;height:280px}
.maps img.ticino{width:117px;height:142px}
.maps figcaption{font-size:12.5px;color:var(--mute);padding-top:8px}
.pos .txt{padding-top:170px}
.pos .h2{color:var(--navy)}
.pos .prose a{color:var(--navy);text-decoration-color:rgba(15,21,82,.5)}
.pos .prose p{font-size:18px;max-width:40em}

/* servizi: indice numerato */
.serv-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:56px}
.serv-head p{color:var(--mute);max-width:36em}
.svc{border-top:1px solid var(--line)}
.svc details{border-bottom:1px solid var(--line)}
.svc summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:90px 1fr auto;align-items:center;gap:20px;padding:26px 0}
.svc summary::-webkit-details-marker{display:none}
.svc .n{font:500 15px/1 var(--sans);color:var(--or-d);letter-spacing:.04em}
.svc h3{font:400 clamp(28px,3vw,46px)/1.08 var(--disp);letter-spacing:-.01em;transition:color .2s}
.svc summary:hover h3{color:var(--ink)}
.svc .pm{width:44px;height:44px;border-radius:50%;background:var(--or-t);position:relative;flex:none;transition:background .25s,transform .35s}
.svc .pm::before,.svc .pm::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:var(--or-d);transform:translate(-50%,-50%)}
.svc .pm::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .35s}
.svc details[open] .pm{background:var(--or);transform:rotate(180deg)}
.svc details[open] .pm::before,.svc details[open] .pm::after{background:#fff}
.svc details[open] .pm::after{transform:translate(-50%,-50%) rotate(0)}
.svc .body{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:0 0 34px}
.svc ul{grid-column:2;columns:2 280px;column-gap:40px;list-style:none}
.svc li{break-inside:avoid;padding:8px 0 8px 22px;position:relative;border-bottom:1px dashed var(--line)}
.svc li::before{content:"";position:absolute;left:0;top:18px;width:9px;height:9px;border-radius:50%;background:var(--or)}
.svc .more{grid-column:2;margin-top:14px;font-weight:600;color:var(--ink)}
.also{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);margin-top:64px}
.also div{background:var(--or-t);border-radius:6px;padding:32px}
.also h3{font:400 30px/1.1 var(--disp);margin-bottom:12px}

/* indice arancio in home */
.idx{background:var(--or);color:var(--navy)}
.idx .h2{color:var(--navy)}
.idx .tbl th{color:var(--navy)}.idx .tbl th,.idx .tbl td{border-color:rgba(15,21,82,.25)}
.idx-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:40px}
.idx-head p{font-size:18px;max-width:34em}
.idx .all{columns:4 210px}
.idx-foot{margin-top:40px;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center}
.idx-foot a{font-weight:600}

/* contatti */
.ct{background:var(--navy);color:#fff;overflow:hidden}
.ct-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,6vw,110px);align-items:start}
.ct .h2{color:#fff}
.ct address{font-style:normal;font-size:19px;line-height:1.55;margin-bottom:28px}
.ct dl{display:grid;grid-template-columns:auto 1fr;gap:10px 24px;font-size:17px}
.ct dt{color:#C9CBEF;font-size:14px;padding-top:3px}
.ct dd a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35)}
.ct dd a:hover{border-color:var(--or)}
.ct-photo{border-radius:50%;aspect-ratio:1;overflow:hidden;box-shadow:0 0 0 2px rgba(255,255,255,.9),0 0 0 14px rgba(255,255,255,.1)}
.ct-photo img{width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.ct .credit div{border-color:var(--or);color:#E4E5F7}
.ct .credit b{color:#FFB37A}

/* piede */
.ft{background:#0A0F3C;color:#C9CBEF;font-size:14px;padding-block:36px}
.ft .wrap{display:flex;flex-wrap:wrap;gap:16px 40px;justify-content:space-between;align-items:center}
.ft a{color:#fff}

/* pagine interne */
.phero{position:relative;min-height:clamp(460px,64vh,640px);color:#fff;overflow:hidden;display:flex;align-items:flex-end;background:#26344e}
.phero img{position:absolute;inset:-8% 0 auto;width:100%;height:116%;object-fit:cover;will-change:transform}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,16,52,.86),rgba(10,16,52,.1) 65%)}
.phero .wrap{position:relative;z-index:2;width:100%;padding-bottom:48px}
.phero h1{font-size:clamp(52px,7vw,112px);margin-bottom:14px}
.phero p{font-size:clamp(18px,1.5vw,22px);max-width:36em}
.cols{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(32px,6vw,110px);align-items:start}
.sticky{position:sticky;top:calc(var(--hh) + 32px)}
.tbl{width:100%;border-collapse:collapse;margin-top:18px}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:16px 12px 16px 0;border-bottom:1px solid var(--line)}
.tbl th{font:400 24px/1.15 var(--disp);width:38%;color:var(--or-d)}
.note{background:var(--or-t);border-left:4px solid var(--or);padding:22px 26px;border-radius:0 6px 6px 0;margin-top:28px}

/* comparse */
/* una sola comparsa, sulle cartine: salgono dal campo arancio come cartoline */
.maps.rv figure{transform:translateY(70px) rotate(-4deg);transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.maps.rv figure+figure{transform:translateY(120px) rotate(5deg);transition-delay:.15s}
.maps.rv.in figure{transform:none}
.load{opacity:0;transform:translateY(22px);animation:up 1s cubic-bezier(.2,.7,.2,1) forwards}
.load.d1{animation-delay:.15s}.load.d2{animation-delay:.3s}.load.d3{animation-delay:.45s}.load.d4{animation-delay:.6s}
@keyframes up{to{opacity:1;transform:none}}
.lens.load{transform:scale(.6);animation:pop 1.3s .35s cubic-bezier(.2,.9,.2,1) forwards}
@keyframes pop{to{opacity:1;transform:none}}

@media (max-width:1100px){
  .hd nav,.hd .tel{display:none}
  .hero-in{grid-template-columns:1fr;grid-template-rows:auto auto auto}
  .lens-col{grid-column:auto;grid-row:auto;order:-1;justify-self:end;margin:4px 0 0}
  .lens{width:clamp(150px,34vw,300px)}
  .proof{grid-template-columns:1fr 1fr}
  .proof>div:last-child{grid-column:1/-1}
  .intro,.ct-grid,.cols,.serv-head,.idx-head{grid-template-columns:1fr}
  .pos-grid{grid-template-columns:1fr;margin-top:-90px}
  .pos .txt{padding-top:0}
  .panel-main{grid-template-columns:1fr}
  .ct-photo{max-width:420px}
  .sticky{position:static}
}
@media (max-width:640px){
  :root{--hh:64px}
  body{font-size:16.5px}
  .brand b{font-size:25px}.brand span{display:none}
  .hero{min-height:auto}
  .hero-in{padding-top:calc(var(--hh) + 20px)}
  .lens{width:150px}
  .proof{grid-template-columns:1fr;gap:14px}
  .credit,.also{grid-template-columns:1fr}
  .maps{flex-wrap:wrap}
  .maps img.cartina{width:100%;max-width:350px;height:auto}
  .svc summary{grid-template-columns:44px 1fr auto;gap:12px;padding:20px 0}
  .svc .body{grid-template-columns:1fr}.svc ul,.svc .more{grid-column:1}
  .tbl th{width:auto;display:block;padding-bottom:4px;border:0}.tbl td{display:block;padding-top:0}
  .panel-main .big a{font-size:34px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .load,.maps.rv figure{opacity:1;transform:none}
}