/* DAVON — struttura di Board of Innovation, colori del sito attuale: petrolio e oro, nessun blu.
   Movimento (decisioni.md, 2026-10-09, sopra il "poco movimento" della call per scelta di Lu): misure in revisioni/2026-10-09-studio-movimento-boi-bcg.md.
   La parte "demo 2" in fondo al file sovrascrive le regole della prima versione dove serve. Font: titoli Inter Tight Light, testo Inter (decisioni.md, 2026-10-14). */
@font-face{font-family:"Inter";src:url(/f/inter.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Inter Tight";src:url(/f/inter-tight.woff2) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}
:root{--ink:#1C282B;--paper:#F2F4F3;--paper2:#E6EBEA;--card:#FFFFFF;--pet:#2E4046;--pet2:#3C535A;--petd:#182124;--gold:#E3AC32;--gold-d:#7A5A0F;--mu:#566568;--line:#C9D2D1;--on-d:#EEF2F1;--mu-d:#B3C0C1;--line-d:rgba(238,242,241,.2);
 --w:1180px;--hh:76px;--fb:"Inter",system-ui,sans-serif;--fu:"Inter",system-ui,sans-serif;
 /* titoli Inter Tight Light, testo Inter, interfaccia Inter Medium in maiuscolo spaziato come il logo (era l'opzione b del prototipo) */
 --fh:"Inter Tight",system-ui,sans-serif;--wh:300;--lsh:-.03em;--lh:1.04}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + 12px);-webkit-text-size-adjust:100%}
.rm{scroll-behavior:auto}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--fb)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--fh);font-weight:var(--wh);line-height:1.1;margin:0 0 .5em;letter-spacing:var(--lsh);text-wrap:balance}
h2{font-size:clamp(1.9rem,4vw,3rem)}h3{font-size:1.3rem;font-weight:500;letter-spacing:-.01em}
p{margin:0 0 1em}
.wrap{max-width:var(--w);margin:0 auto;padding:0 clamp(16px,3vw,32px)}.narrow{max-width:760px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--petd);padding:8px 12px;z-index:50}.skip:focus{left:8px}
mark.seg{background:rgba(227,172,50,.28);color:inherit;outline:1px dashed var(--gold);outline-offset:1px;padding:0 .2em;border-radius:2px}
.sec.dark mark.seg,.ft mark.seg{background:rgba(227,172,50,.22);color:var(--on-d)}

/* header */
.hd{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--hh);padding:0 clamp(16px,3vw,32px);background:var(--pet);color:var(--on-d);border-bottom:1px solid transparent}
.hd.sc{border-color:var(--line-d)}
.wm{display:flex;align-items:center;height:100%}.wm img{height:54px;width:auto}
.nv{display:flex;align-items:center;gap:24px}
.mn{display:flex;align-items:center;gap:6px;list-style:none;margin:0;padding:0}
.mn>li{position:relative}
.mn a,.ddb{display:inline-flex;align-items:center;min-height:44px;padding:0 12px;color:var(--on-d);text-decoration:none;font:500 .92rem var(--fb);letter-spacing:.01em;background:none;border:0;cursor:pointer;white-space:nowrap}
.mn a:hover,.ddb:hover,.ddb[aria-expanded="true"]{color:var(--gold)}
.ddb::after{content:"";width:6px;height:6px;margin-left:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.ddm{display:none;position:absolute;left:0;top:100%;min-width:290px;max-height:calc(100vh - var(--hh) - 20px);overflow:auto;list-style:none;margin:0;padding:8px;background:var(--petd);border:1px solid var(--line-d);border-radius:6px;box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.dd.open .ddm{display:block}
@media (hover:hover) and (min-width:921px){.dd:hover .ddm{display:block}}
.ddm a{display:flex;align-items:center;min-height:40px;width:100%;padding:6px 12px;border-radius:4px;font-weight:400;white-space:normal}.ddm a:hover{background:var(--pet2);color:var(--on-d)}
.lg{display:flex;gap:2px;font:500 .78rem var(--fb);letter-spacing:.08em}
.lg a{display:inline-flex;align-items:center;min-height:36px;padding:0 8px;color:var(--mu-d);text-decoration:none}.lg a[aria-current]{color:var(--gold)}.lg a:hover{color:var(--on-d)}
.mb{display:none;background:none;border:0;width:48px;height:48px;padding:13px 11px;cursor:pointer}.mb i{display:block;height:2px;background:var(--on-d);margin:6px 0}
@media (max-width:920px){
 .mb{display:block}
 .nv{display:none;position:fixed;left:0;right:0;top:var(--hh);bottom:0;overflow:auto;flex-direction:column;align-items:stretch;gap:12px;padding:12px clamp(16px,3vw,32px) 28px;background:var(--pet)}
 .nv.open{display:flex}
 .mn{flex-direction:column;align-items:stretch;gap:0}
 .mn>li{border-bottom:1px solid var(--line-d)}.mn a,.ddb{width:100%;min-height:52px;font-size:1.05rem;justify-content:space-between}
 .ddm{position:static;min-width:0;max-height:none;box-shadow:none;border:0;background:transparent;padding:0 0 10px 6px}
 .lg{justify-content:flex-start}.nv .btn{align-self:flex-start}
}

/* pulsanti */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 24px;border-radius:999px;border:1.5px solid var(--gold);font:600 .95rem var(--fb);text-decoration:none;cursor:pointer;transition:background-color .15s,color .15s}
.btn.fill{background:var(--gold);color:var(--petd)}.btn.fill:hover{background:#F0BE4D}
.btn.ghost{background:transparent;color:var(--gold)}.btn.ghost:hover{background:var(--gold);color:var(--petd)}.btn.sm{min-height:40px;padding:0 18px;font-size:.9rem}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.row{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.kick{text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;font-weight:600;color:var(--gold-d);margin-bottom:1em}
.dark .kick,.hero .kick{color:var(--gold)}

/* hero: bande verticali e un bagliore oro in basso a destra, fermi */
.hero{position:relative;color:var(--on-d);padding:clamp(72px,12vw,150px) 0 clamp(56px,8vw,100px);background:
 radial-gradient(65% 90% at 88% 118%,rgba(227,172,50,.38),transparent 70%),
 repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 8.333%,rgba(255,255,255,0) 8.333% 16.666%),
 linear-gradient(100deg,#141C1E 0%,#2E4046 62%,#45595F 100%)}
.hero-t{display:grid;gap:0}
.hero h1{font-size:clamp(2.7rem,8.6vw,6.4rem);line-height:.98;margin:0 0 .4em}
.hero h1 .l1,.hero h1 .l2{display:block}
@media (min-width:900px){.hero h1 .l2{text-align:right}}
.sub{font-size:clamp(1.05rem,1.5vw,1.25rem);color:var(--mu-d);max-width:44ch}
@media (min-width:900px){.sub{margin-left:auto;text-align:right}.hero .row{justify-content:flex-end}}

/* fascia clienti */
.band{background:var(--paper);padding:clamp(40px,6vw,64px) 0;border-bottom:1px solid var(--line)}
.logos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.seg-box{display:flex;align-items:center;justify-content:center;text-align:center;min-height:72px;padding:10px;border:1.5px dashed var(--gold);border-radius:4px;color:var(--gold-d);font-size:.84rem;background:rgba(227,172,50,.1)}

/* sezioni */
.sec{padding:clamp(56px,8vw,104px) 0}
.sec.alt{background:var(--paper2)}
.sec.dark{background:var(--pet);color:var(--on-d)}.sec.dark.alt2{background:var(--petd)}
.intro{max-width:62ch;color:var(--mu);font-size:1.1rem}
.bigs{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.big{background:var(--pet2);border-radius:6px;padding:28px}
.big b{display:block;font:var(--wh) clamp(2.8rem,6vw,4.2rem)/1 var(--fh);letter-spacing:var(--lsh);margin-bottom:.3em}
.big p{margin:0;color:var(--mu-d)}
.cards{list-style:none;margin:32px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:28px;border-top:3px solid var(--gold)}
.card h3{margin-bottom:.6em}.card p{margin:0;color:var(--mu);font-size:.97rem}
.list{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:0 56px}
.list li{padding:26px 0;border-top:1px solid var(--line-d)}
.list h3{margin-bottom:.5em}.list p{margin:0;color:var(--mu-d);font-size:.97rem}
.two{display:grid;gap:24px 56px}.two p{color:var(--mu)}
@media (min-width:900px){.two{grid-template-columns:1fr 1.3fr;align-items:start}}
.vh{margin:48px 0 0;font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--gold-d)}
.vals{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px}
.vals li{border-top:1px solid var(--line);padding-top:16px}.vals p{margin:0;color:var(--mu)}
.ct-g{display:grid;gap:32px 56px}@media (min-width:900px){.ct-g{grid-template-columns:1fr 1fr}}
.seg-line{padding:12px 14px;border:1.5px dashed var(--gold);border-radius:4px;background:rgba(227,172,50,.1);margin:0 0 12px;max-width:520px}
.sec.dark p{color:var(--mu-d)}

/* modulo (resta nascosto senza webhook) */
.fm{display:grid;gap:14px}.fm label{display:grid;gap:6px;font-weight:600;font-size:.95rem}
.fm input,.fm textarea{font:inherit;font-weight:400;padding:12px 14px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);width:100%}
.fm .cb{display:flex;gap:10px;align-items:flex-start;font-weight:400}.fm .cb input{width:auto;margin-top:5px}
.fm .bad input,.fm .bad textarea{border-color:#E57368}.msg{color:#F2A29B;margin:0}.ok{font-weight:600}

/* footer: stesso fondo dell'hero */
.ft{color:var(--on-d);padding:56px 0 32px;font-size:.93rem;background:
 radial-gradient(60% 120% at 90% 130%,rgba(227,172,50,.3),transparent 70%),
 repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 8.333%,rgba(255,255,255,0) 8.333% 16.666%),
 linear-gradient(100deg,#141C1E 0%,#2E4046 70%)}
.ft-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}
.ft-logo{height:64px;width:auto;margin-bottom:16px}
.ft ul{list-style:none;padding:0;margin:0}.ft li{margin:.4em 0}.ft a{text-decoration:none}.ft a:hover{color:var(--gold)}.k{font-weight:600;margin-bottom:.6em}
.lgl{color:var(--mu-d);margin-top:32px}.proto{font-weight:600;color:var(--gold)}
.lnk{background:none;border:0;padding:0;font:inherit;text-decoration:underline;cursor:pointer;color:inherit}
.ck{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:560px;margin:0 auto;background:var(--petd);color:var(--on-d);border:1px solid var(--line-d);border-radius:8px;padding:16px 18px;box-shadow:0 12px 36px rgba(0,0,0,.4);display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.ck[hidden]{display:none}.ck p{margin:0;font-size:.92rem}.ck div{display:flex;gap:8px}

/* pagine legali, 404 */
.ph{padding:64px 0 8px}.nf{padding:120px 0}
.lgp{padding-top:clamp(24px,4vw,48px)}.lgp h1{font-size:clamp(2rem,4vw,3rem)}.lgp h2{font-size:1.3rem;margin-top:1.6em;font-weight:500}.upd{color:var(--mu)}
.tbl{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.92rem}th,td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;vertical-align:top}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}


/* ===================== demo 2: movimento e sezioni nuove ===================== */
:root{--eo:cubic-bezier(.16,1,.3,1);--es:cubic-bezier(.25,.1,.25,1);--gold-l:#EDCF8A}
html{scroll-behavior:auto}
.wrap{max-width:1240px}

/* header: trasparente sull'hero video, si nasconde scendendo e torna pieno salendo (BOI) */
.hd{transition:transform .4s var(--es),background-color .3s,border-color .3s}
.on-hv .hd{position:fixed;left:0;right:0;background:transparent}
.on-hv .hd.solid,.hd.solid{background:var(--pet);border-color:var(--line-d)}
.hd.up{transform:translateY(-100%)}
.nv.open~*,.hd:has(.nv.open){transform:none}
.wm img{height:46px}
.ddm{display:block;visibility:hidden;opacity:0;transform:translateY(6px);transition:opacity .25s var(--eo),transform .25s var(--eo),visibility 0s .25s}
.dd.open .ddm{visibility:visible;opacity:1;transform:none;transition:opacity .25s var(--eo),transform .25s var(--eo)}
@media (hover:hover) and (min-width:921px){.dd:hover .ddm{visibility:visible;opacity:1;transform:none;transition:opacity .25s var(--eo),transform .25s var(--eo)}}
.mn a,.ddb{transition:color .3s}
@media (max-width:920px){.ddm{display:none;visibility:visible;opacity:1;transform:none}.dd.open .ddm{display:block}.on-hv .hd:has(.nv.open){background:var(--pet)}}

/* pulsanti (BCG): il testo scivola, la freccia esce a destra e rientra da sinistra */
.btn{position:relative;overflow:hidden;gap:0;padding:0 50px 0 24px;border-radius:2px;transition:padding .35s var(--es),background-color .3s,color .3s,border-color .3s}
.btn .ar{position:absolute;top:50%;width:18px;height:18px;margin-top:-9px;transition:transform .35s var(--es),opacity .35s}
.btn .a1{right:20px}.btn .a2{left:20px;opacity:0;transform:translateX(-26px)}
.btn:hover,.btn:focus-visible{padding:0 24px 0 50px}
.btn:hover .a1,.btn:focus-visible .a1{opacity:0;transform:translateX(26px)}
.btn:hover .a2,.btn:focus-visible .a2{opacity:1;transform:none}
.btn.sm{padding:0 42px 0 18px}.btn.sm:hover{padding:0 18px 0 42px}.btn.sm .a1{right:15px}.btn.sm .a2{left:15px}
.ck .btn,.btn.ghost{padding:0 18px}.ck .btn:hover,.btn.ghost:hover{padding:0 18px}
.btn.fill:hover{background:var(--gold-l);border-color:var(--gold-l)}
.btn.line{background:transparent;color:var(--on-d);border-color:rgba(238,242,241,.55)}.btn.line:hover{border-color:var(--gold);color:var(--gold)}

/* entrate allo scroll (BOI, più corte): 24 px, 0,9 s, sfalsate di 80 ms; mai senza JS né con movimento ridotto */
.js:not(.rm) .rv{opacity:0;transform:translateY(24px)}
.js:not(.rm) .rv.is{opacity:1;transform:none;transition:opacity .9s var(--eo),transform .9s var(--eo);transition-delay:calc(var(--i,0) * 80ms)}
@keyframes up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.js:not(.rm) .in{animation:up 1.1s var(--eo) both;animation-delay:calc(var(--d,0) * 140ms + 200ms)}

/* hero video a tutto schermo */
.hv{min-height:100svh;display:flex;align-items:flex-end;padding:calc(var(--hh) + 40px) 0 clamp(48px,9vh,96px);background:var(--petd);overflow:hidden}
.hv-bg,.hv-veil{position:absolute;inset:0}
.hv-bg .vd{width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.hv-veil{background:linear-gradient(90deg,rgba(18,26,28,.82) 0%,rgba(18,26,28,.45) 48%,rgba(18,26,28,.05) 100%),linear-gradient(0deg,rgba(18,26,28,.7),transparent 45%)}
.hv-t{position:relative;z-index:1;width:100%}
.hv h1{font-size:clamp(2.6rem,7.2vw,6.6rem);line-height:.98;font-weight:300;margin:0 0 .45em;letter-spacing:-.035em}
.hv h1 .l1,.hv h1 .l2{display:block}.hv h1 .l2{color:var(--gold-l)}
@media (min-width:900px){.hv h1 .l2{padding-left:1.6em}}
.hv .sub{color:#CBD6D6;margin:0;text-align:left;max-width:46ch}
.hv .row{justify-content:flex-start}
.vp{position:absolute;right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,28px);z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid rgba(238,242,241,.45);background:rgba(18,26,28,.35);cursor:pointer;display:grid;place-items:center;transition:border-color .3s}
.vp:hover{border-color:var(--gold)}
.vp i{width:10px;height:12px;border-left:3px solid var(--on-d);border-right:3px solid var(--on-d)}
.vp[aria-pressed="true"] i{width:0;height:0;border-width:7px 0 7px 11px;border-style:solid;border-color:transparent transparent transparent var(--on-d);margin-left:3px}
.rm .vp{display:none}

/* approccio */
.intro{background:var(--paper);max-width:none;color:var(--ink);font-size:inherit}
.intro .big{font:var(--wh) clamp(1.9rem,3.8vw,3.3rem)/1.12 var(--fh);letter-spacing:var(--lsh);max-width:22ch;margin:0 0 clamp(32px,5vw,64px);background:none;padding:0;border-radius:0}
.intro-g{display:grid;gap:32px 72px}.intro-g>p{color:var(--mu);font-size:1.08rem;max-width:52ch}
@media (min-width:900px){.intro-g{grid-template-columns:1fr 1.1fr}}
.pil{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.pil a{position:relative;display:grid;grid-template-columns:56px 1fr 24px;align-items:center;gap:8px;padding:22px 4px;border-bottom:1px solid var(--line);text-decoration:none;font:var(--wh) clamp(1.25rem,2vw,1.6rem)/1.2 var(--fh);letter-spacing:-.01em}
.pil a::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--eo)}
.pil a:hover::after,.pil a:focus-visible::after{transform:scaleX(1)}
.pil .ar{width:20px;height:20px;color:var(--gold-d);transition:transform .35s var(--es)}.pil .a2{display:none}.pil a:hover .a1{transform:translateX(5px)}
.no{font:500 .8rem var(--fb);letter-spacing:.12em;color:var(--gold-d)}
.dark .no,.sts .no{color:var(--gold)}

/* fascia che scorre con i settori */
.mq{display:flex;overflow:hidden;background:var(--petd);color:var(--on-d);padding:22px 0;border-top:1px solid var(--line-d)}
.mq-t{display:flex;flex-shrink:0;list-style:none;margin:0;padding:0;animation:mq 60s linear infinite}
.mq li{white-space:nowrap;font:var(--wh) clamp(1.1rem,1.8vw,1.45rem)/1 var(--fh);padding:0 28px;display:flex;align-items:center;gap:56px}
.mq li::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold);margin-right:-28px}
.mq:hover .mq-t{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-100%)}}
.rm .mq{flex-wrap:wrap}.rm .mq-t{animation:none;flex-wrap:wrap;flex-shrink:1}.rm .mq-t[aria-hidden]{display:none}

/* servizi */
.svs{background:var(--paper)}
.svs-g{display:grid;gap:40px 72px}
@media (min-width:960px){.svs-g{grid-template-columns:.85fr 1.15fr}.svs-h{position:sticky;top:calc(var(--hh) + 24px);align-self:start}}
.pic{overflow:hidden;border-radius:2px;background:var(--pet)}
.pic img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--eo)}
.svs-h .pic{aspect-ratio:4/5;margin-top:28px}
@media (max-width:959px){.svs-h .pic{aspect-ratio:16/10}}
.svl{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.sv{display:grid;grid-template-columns:56px 1fr;gap:8px;padding:28px 0;border-bottom:1px solid var(--line);scroll-margin-top:calc(var(--hh) + 16px);position:relative}
.sv::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:56px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--eo)}
.sv:hover::before,.sv:target::before{transform:scaleX(1)}
.sv .no{padding-top:.45em}.sv h3{font-size:clamp(1.25rem,1.8vw,1.5rem);font-weight:400;margin-bottom:.45em}.sv p{margin:0;color:var(--mu)}

/* settori */
.sts{background:var(--petd)}
.stg{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:40px 28px}
.st{scroll-margin-top:calc(var(--hh) + 16px)}
.st .pic{aspect-ratio:4/3;margin-bottom:20px}.st:hover .pic img{transform:scale(1.04)}
.st h3{font-weight:400;font-size:1.35rem;margin-bottom:.5em;padding-bottom:.5em;position:relative}
.st h3::after{content:"";position:absolute;left:0;bottom:0;width:32px;height:2px;background:var(--gold);transition:width .4s var(--eo)}.st:hover h3::after{width:72px}
.st .cl{overflow:hidden;max-height:calc(4 * 1.6em);transition:max-height .6s var(--eo);-webkit-mask:linear-gradient(#000 60%,transparent);mask:linear-gradient(#000 60%,transparent)}
.st .cl p{margin:0;font-size:.97rem}
.st.open .cl{max-height:60em;-webkit-mask:none;mask:none}
.more{margin-top:10px;background:none;border:0;padding:8px 0;color:var(--gold);font:600 .88rem var(--fb);letter-spacing:.02em;cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(227,172,50,.4);transition:text-decoration-color .3s}
.more:hover{text-decoration-color:var(--gold)}

/* chi siamo */
.chi{background:var(--paper)}
.chi-g{display:grid;gap:40px 72px;align-items:center}
@media (min-width:900px){.chi-g{grid-template-columns:1.05fr 1fr}}
.chi .pic{aspect-ratio:4/3}.chi-g p{color:var(--mu);font-size:1.06rem}
.chi-g p:first-of-type{font:var(--wh) clamp(1.35rem,2.2vw,1.85rem)/1.3 var(--fh);color:var(--ink);letter-spacing:-.01em}
.vals{gap:28px;margin-top:20px}.vals li{border-top:1px solid var(--line);padding-top:20px}.vals h3{margin:.5em 0 .4em;font-weight:400}

/* contatti: bande petrolio che scorrono lente (BOI, a metà velocità), con un filo d'oro */
.ctb{position:relative;overflow:hidden;background:var(--petd);color:var(--on-d);padding:clamp(72px,10vw,128px) 0}
.ctb .wrap{position:relative;z-index:1}.ctb p{color:#C3CFCF}
.ctb h2{font-size:clamp(2.1rem,4.6vw,3.6rem);font-weight:300;max-width:16ch}
.bands{position:absolute;inset:0 0 0 46%;display:grid;grid-template-columns:repeat(6,1fr);opacity:.9;-webkit-mask:linear-gradient(90deg,transparent,#000 30%);mask:linear-gradient(90deg,transparent,#000 30%)}
.bands i{background:repeating-linear-gradient(180deg,#182124 0,#22323A 6%,#2E4046 12%,#3C535A 18%,#2E4046 24%,#22323A 30%,#182124 36%,#182124 44%,#1E2B2F 47%,rgba(227,172,50,.55) 47.6%,#1E2B2F 48.2%,#182124 50%);background-size:100% 200%;animation:bf 12s linear infinite;animation-delay:calc(var(--c) * -1.5s)}
@keyframes bf{to{background-position:0 -100%}}
@media (max-width:899px){.bands{inset:auto 0 0 0;height:45%;grid-template-columns:repeat(2,1fr);-webkit-mask:linear-gradient(180deg,transparent,#000 60%);mask:linear-gradient(180deg,transparent,#000 60%)}.bands i:nth-child(n+3){display:none}}
.rm .bands i{animation:none}
.ct-d{display:grid;grid-template-columns:auto 1fr;gap:10px 24px;align-self:end;margin:0;padding:24px 0;border-top:1px solid var(--line-d);font-size:1.02rem}
.ct-d dt{color:var(--gold);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding-top:.3em}.ct-d dd{margin:0}.ct-d a{text-decoration:none}.ct-d a:hover{color:var(--gold)}

/* footer */
.ft{background:var(--petd);border-top:1px solid var(--line-d)}
.ft-logo{height:56px}
.sec.dark .kick,.ctb .kick{color:var(--gold)}
.chi-g p:first-of-type{font:inherit;color:var(--mu);letter-spacing:normal}
.chi-g .kick+p{font:var(--wh) clamp(1.35rem,2.2vw,1.85rem)/1.3 var(--fh);color:var(--ink);letter-spacing:-.01em}
.chi-g p.kick{font:600 .76rem var(--fb);letter-spacing:.16em;color:var(--gold-d)}
.bands{opacity:.75}


/* ===================== demo 2b: tipografia e pulsanti pensati insieme al logo (Inter Medium, maiuscole spaziate) ===================== */
h1,h2,h3{font-family:var(--fh);font-weight:var(--wh);letter-spacing:var(--lsh);line-height:var(--lh)}
h3{line-height:1.2}
.hv h1{font-weight:var(--wh);letter-spacing:var(--lsh);font-size:clamp(2.7rem,7.4vw,6.8rem);line-height:1}
.intro .big,.chi-g .kick+p{font-family:var(--fh);font-weight:var(--wh);letter-spacing:var(--lsh)}
.ctb h2{font-weight:var(--wh)}
.sv h3,.st h3,.vals h3{font-weight:var(--wh);font-size:clamp(1.3rem,1.9vw,1.6rem);letter-spacing:-.005em}
.sv h3,.st h3,.vals h3{font-weight:400}
.pil a{font-family:var(--fh);font-weight:var(--wh)}
.mq li{font-family:var(--fh);font-weight:var(--wh)}
/* interfaccia: Inter Medium, come il logo */
.kick,.vh,.ct-d dt,.no,.lg{font-family:var(--fu);font-weight:500}
.kick,.vh,.ct-d dt{font-size:.74rem;letter-spacing:.2em}
.mn a,.ddb{font:500 .92rem var(--fu);letter-spacing:.01em}
/* pulsanti: rettangolo con raggio 2 px (gli spigoli netti del lettering), Inter Medium in maiuscolo spaziato 0,12 em, freccia che si scambia di lato (BCG) */
.btn{min-height:50px;border-radius:2px;border-width:1px;font:500 .8rem/1 var(--fu);letter-spacing:.12em;text-transform:uppercase;padding:0 50px 0 24px}
.btn.sm{min-height:42px;font-size:.74rem;padding:0 42px 0 18px}
.btn.fill{background:var(--gold);border-color:var(--gold);color:var(--petd)}
.btn.fill:hover{background:#EDC059;border-color:#EDC059}
.btn.line{border-color:rgba(238,242,241,.5)}.btn.line:hover{background:rgba(227,172,50,.08)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible,.pil a:focus-visible,.more:focus-visible,.vp:focus-visible,.mn a:focus-visible,.ddb:focus-visible{outline:0;box-shadow:0 0 0 2px var(--petd),0 0 0 4px var(--gold)}
.ck .btn,.btn.ghost{text-transform:none;letter-spacing:.02em;font-size:.86rem}
.more{font:500 .76rem var(--fu);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid rgba(227,172,50,.45);padding:6px 0;transition:border-color .3s}
.more:hover{border-color:var(--gold)}
/* logo */
.wm img{height:42px;width:auto}
.ft-logo{display:block;height:auto;margin-bottom:24px}.ft-logo img{height:60px;width:auto}
@media (min-width:700px){.ft-logo img{height:126px;margin-left:-10px}}
/* sigillo (2 orizzontale B): nell'intestazione accanto al nome; nel piè di pagina da solo, a 152 px sul telefono e 176 px da 700 px
   (maiuscole della scritta in tondo alte 22/512 del lato: 6,5 e 7,6 px) */
.wm{gap:12px}.wm img.mk{height:56px;width:56px;flex:none}
.ft-logo.ft-mk{width:152px;height:152px}
@media (min-width:700px){.ft-logo.ft-mk{width:176px;height:176px}}
@media (max-width:420px){.wm{gap:10px}.wm img.mk{height:48px;width:48px}.wm img:not(.mk){height:34px}}
/* hero animato in canvas: fondo con una luce petrolio a destra; senza JS resta il fondo */
.hv-bg{background:radial-gradient(70% 90% at 78% 40%,#1F3035 0%,#141C1E 62%,#101618 100%)}
.rb{display:block;width:100%;height:100%}

:root{--accent:#E3AC32}
