/*
Theme Name: ITAssist
Theme URI: https://itassist.it
Author: ITAssist
Description: Tema one-page per ITAssist (assistenza informatica da remoto), in italiano, inglese e spagnolo, senza plugin necessari. Palette Aurora.
Version: 2.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: itassist
*/
@font-face{font-family:'Bricolage Grotesque';font-style:normal;font-weight:200 800;font-display:swap;src:url(assets/fonts/bricolage-grotesque-latin-wght-normal.woff2) format('woff2')}
@font-face{font-family:'Instrument Sans';font-style:normal;font-weight:400 700;font-display:swap;src:url(assets/fonts/instrument-sans-latin-wght-normal.woff2) format('woff2')}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:swap;src:url(assets/fonts/jetbrains-mono-latin-wght-normal.woff2) format('woff2')}

/* Palette Aurora: nero, magenta, glow viola e blu. Layout a fasce scure con card bordate. */
:root{
  --bg:#05060B; --band:#0C0D14; --card:#12131B; --line:#2A2B38;
  --fg:#F4F4F8; --mut:#A9ABB8;
  --acc:#E0309F; --acc2:#FF8AD4; --btn:#D10E8E; --btnfg:#FFFFFF;
  --g1:rgba(176,8,123,.38); --g2:rgba(90,27,184,.35); --g3:rgba(10,77,181,.28);
  --win:#0E0F17; --wtop:#14151F; --bar:#242538;
  --r:14px;
  --fd:'Bricolage Grotesque',system-ui,-apple-system,'Segoe UI',sans-serif;
  --fb:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:dark}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:400 16px/1.6 var(--fb);overflow-x:hidden}
h1,h2,h3,p,ul,ol{margin:0}
h1,h2,h3{font-family:var(--fd);text-wrap:balance;letter-spacing:-.02em}
a{color:inherit}
:focus-visible{outline:2px solid var(--acc2);outline-offset:3px}
.g{padding-inline:max(16px,calc((100% - 1140px)/2))}
.eye{font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--acc2)}
section[id]{scroll-margin-top:84px}
.skip{position:absolute;left:-9999px;top:8px;background:#fff;color:#000;padding:10px 16px;z-index:100;border-radius:999px}.skip:focus{left:8px}
.admin-bar header{top:32px}@media(max-width:782px){.admin-bar header{top:46px}}

/* header */
header{position:sticky;top:0;z-index:30;background:rgba(5,6,11,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:20px;min-height:68px}
.logo{display:flex;flex-direction:column;line-height:1;text-decoration:none;color:var(--fg)}
.logo b{font:700 26px var(--fd);letter-spacing:-.04em}
.logo i{font-style:normal;color:var(--acc)}
.logo small{font:400 10.5px var(--fb);letter-spacing:.2em;color:var(--mut);margin-top:5px;text-transform:uppercase}
nav{display:flex;gap:6px;flex:1;justify-content:center}
nav>a,nav>button{background:none;border:0;color:var(--fg);font:500 15px var(--fb);padding:10px 14px;cursor:pointer;text-decoration:none;display:inline-flex;gap:7px;align-items:center}
nav>a:hover,nav>button:hover{color:var(--acc2)}
.caret{width:0;height:0;border:4px solid transparent;border-top-color:currentColor;border-bottom:0;transition:transform .2s}
[aria-expanded="true"]>.caret{transform:rotate(180deg)}
.right{display:flex;gap:12px;align-items:center}
.lang{position:relative}
.lang>button{background:none;border:1px solid var(--line);color:var(--fg);font:500 13px var(--fb);padding:7px 14px;border-radius:999px;cursor:pointer;display:flex;align-items:center;gap:8px}
.lang>button:hover{border-color:var(--fg)}
.lang ul{position:absolute;right:0;top:calc(100% + 8px);margin:0;padding:8px;list-style:none;background:#0A0B12;border:1px solid var(--line);border-radius:var(--r);min-width:160px;display:none;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.lang ul.open{display:block}
.lang a{display:flex;gap:10px;align-items:center;color:var(--fg);text-decoration:none;font:400 14px var(--fb);padding:8px 10px;border-radius:10px}
.lang a:hover,.lang a[aria-current="true"]{background:#1B1C27}
.flag{width:22px;height:15px;display:block;flex:none;border:1px solid rgba(255,255,255,.25);border-radius:3px}
.burger{display:none;background:none;border:1px solid var(--line);color:var(--fg);padding:9px 11px;border-radius:12px;cursor:pointer}
.mega{position:absolute;left:0;right:0;top:100%;background:rgba(5,6,11,.97);display:none;border-bottom:1px solid var(--line)}
.mega.open{display:block}
.mega ul{list-style:none;margin:0;padding:18px 0 22px;width:min(100%,360px)}
.mega li a{display:block;padding:13px 0;border-bottom:1px solid var(--line);text-decoration:none;font:500 16px var(--fb)}
.mega li:last-child a{border-bottom:0}.mega li a:hover{color:var(--acc2)}

/* bottoni */
.btn{display:inline-flex;gap:10px;align-items:center;background:var(--btn);color:var(--btnfg);border:0;border-radius:999px;font:600 15px var(--fb);padding:14px 26px;cursor:pointer;text-decoration:none;transition:transform .2s,background .2s,color .2s}
.btn svg{width:16px;height:16px;flex:none;transition:transform .2s}
.btn:hover svg{transform:translateX(4px)}
.btn:hover{background:var(--acc);color:#fff}
.btn.line{background:transparent;color:var(--fg);box-shadow:inset 0 0 0 1.5px currentColor}
.btn.line:hover{background:var(--fg);color:var(--bg)}
.hd-btn{padding:10px 20px}

/* hero */
.hero{position:relative;overflow:hidden;background:radial-gradient(900px 520px at 88% 12%,var(--g1) 0,transparent 62%),radial-gradient(760px 520px at 0% 100%,var(--g2) 0,transparent 60%),radial-gradient(600px 400px at 55% 110%,var(--g3) 0,transparent 60%),var(--bg)}
.hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;opacity:.35;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 70% 40%,#000 0,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 70% 40%,#000 0,transparent 75%);pointer-events:none}
.hero .g{position:relative}
.wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(28px,5vw,64px);align-items:center;padding-block:64px 88px}
.col{display:flex;flex-direction:column;gap:24px;min-width:0}
.hero h1{font-size:clamp(38px,5.6vw,68px);font-weight:800;line-height:1.02}
.hero h1 em{font-style:normal;color:var(--acc)}
.lead{font-size:clamp(17px,1.7vw,20px);color:var(--mut);max-width:50ch}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.chk{display:flex;gap:8px 26px;flex-wrap:wrap;font:400 13px var(--mono);color:var(--mut)}
.chk span::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acc);margin-right:10px}
.win{background:var(--win);border-radius:var(--r);box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px var(--line),0 0 60px -10px var(--acc);overflow:hidden;min-width:0}
.win .top{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--wtop);border-bottom:1px solid var(--line);font:400 12px var(--mono);color:var(--mut)}
.win .top b{width:10px;height:10px;border-radius:50%;background:var(--line)}
.win .rec{margin-left:auto;display:flex;gap:8px;align-items:center;color:var(--acc2)}
.win .rec::before{content:'';width:8px;height:8px;border-radius:50%;background:#43D18A}
.win ul{list-style:none;margin:0;padding:18px 18px 8px;display:flex;flex-direction:column;gap:12px;font:400 14px var(--mono);min-height:250px}
.win li{display:flex;gap:12px;align-items:flex-start;color:var(--mut);opacity:.28;transition:opacity .5s,color .5s}
.win li.on{opacity:1;color:#DCEAF7}
.win li .ck{flex:none;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:11px}
.win li.on .ck{background:#43D18A;border-color:#43D18A;color:#06210F}
.bar2{margin:6px 18px 0;height:6px;background:var(--bar);border-radius:99px;overflow:hidden}
.bar2 i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--acc2),var(--acc));border-radius:99px;transition:width .6s}
.win .foot{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 18px;font:500 13px var(--mono);color:var(--mut)}
.win .foot b{color:#fff;font-weight:600}

/* sezioni */
.hd{display:flex;flex-direction:column;gap:14px;max-width:62ch;margin-bottom:40px}
h2{font-size:clamp(28px,3.8vw,48px);font-weight:700;line-height:1.08}
.trust,.how,.faq{background:var(--band)}
.trust,.svc,.how,.plans,.form,.faq{padding-block:clamp(60px,8vw,104px)}
.rv{transform:translateY(18px);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{transform:none}

/* fiducia */
.trust .top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:start}
.who{display:flex;flex-direction:column;gap:22px}
.id{display:flex;gap:16px;align-items:center}
.av{width:68px;height:68px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;flex:none}
.id b{display:block;font:600 18px var(--fd)}
.id span{font:400 13px var(--mono);color:var(--mut)}
.who p{color:var(--mut);max-width:52ch}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0}
.chips li{font:500 12px var(--mono);letter-spacing:.04em;padding:7px 14px;border-radius:999px;border:1px solid var(--line)}
.gar{display:grid;gap:12px;list-style:none;padding:0}
.gar li{display:flex;gap:16px;padding:18px 20px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);align-items:flex-start;transition:transform .25s,border-color .25s}
.gar li:hover{transform:translateX(6px);border-color:var(--acc)}
.gar svg{width:28px;height:28px;flex:none;color:var(--acc)}
.gar b{display:block;font:600 17px var(--fd)}
.gar span{font-size:14.5px;color:var(--mut)}

/* servizi */
.grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.sc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:12px;min-height:290px;transition:transform .3s,box-shadow .3s,border-color .3s}
.sc:hover{transform:translateY(-8px);box-shadow:0 22px 40px rgba(0,0,0,.4);border-color:var(--acc)}
.sc svg{width:40px;height:40px;color:var(--acc)}
.sc h3{font-size:18px;line-height:1.2}
.sc p{font-size:14px;color:var(--mut);flex:1}
.sc .p{font:700 28px var(--fd);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.sc .p small{font:400 12px var(--mono);color:var(--mut);letter-spacing:0;margin-left:6px}
.go{display:inline-flex;gap:8px;align-items:center;text-decoration:none;font:600 14px var(--fb);color:var(--acc2)}
.go svg{width:14px;height:14px;transition:transform .2s}.go:hover svg{transform:translateX(4px)}
.ctab{margin-top:18px;display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap;background:linear-gradient(120deg,rgba(176,8,123,.35),rgba(90,27,184,.28));border:1px solid var(--line);border-radius:var(--r);padding:26px 28px}
.ctab h3{font-size:22px}.ctab p{color:#E4D7EE;margin-top:4px}
.pnote{margin-top:22px;font:400 13px var(--mono);color:var(--mut)}

/* come funziona */
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;counter-reset:s}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;gap:10px}
.step b{font:500 13px var(--mono);color:var(--acc2);letter-spacing:.1em}
.step h3{font-size:19px}.step p{color:var(--mut);font-size:15px}

/* abbonamenti */
.pl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.plan{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:32px 28px;display:flex;flex-direction:column;gap:18px;min-width:0}
.plan.hl{background:linear-gradient(160deg,#B0087B,#5A1BB8);border-color:transparent;box-shadow:0 0 60px -15px var(--acc)}
.plan .tag{font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;background:#fff;color:#000;padding:4px 12px;border-radius:999px;align-self:flex-start}
.plan .pr{font:700 44px var(--fd);letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.plan .pr small{font:400 14px var(--fb);letter-spacing:0;display:block;margin-top:8px;color:var(--mut)}
.plan.hl .pr small{color:#F7D9EC}
.plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:15px;flex:1}
.plan li{padding-left:22px;position:relative;color:#D6D7E0}
.plan li::before{content:'';position:absolute;left:0;top:.62em;width:10px;height:1.5px;background:var(--acc)}
.plan.hl li::before{background:#fff}
.plan .btn{align-self:flex-start}
.plan.hl .btn:not(.line){background:#fff;color:#000}.plan.hl .btn:not(.line):hover{background:#000;color:#fff}

/* modulo */
.fr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(32px,6vw,80px);align-items:start}
.fr .l{display:flex;flex-direction:column;gap:20px}
.form{background:radial-gradient(700px 400px at 100% 0,rgba(90,27,184,.28),transparent 60%),var(--bg)}
form{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:18px}
label{display:flex;flex-direction:column;gap:7px;font:500 13px var(--fb);letter-spacing:.02em}
input,select,textarea{font:400 16px var(--fb);color:var(--fg);background:#0B0C12;border:1px solid var(--line);border-radius:12px;padding:12px 14px;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--acc);outline:2px solid rgba(224,48,159,.35);outline-offset:0}
textarea{min-height:110px;resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.chk-l{flex-direction:row;align-items:flex-start;gap:12px;font-weight:400;font-size:14px;line-height:1.5;color:var(--mut)}
.chk-l input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:#D10E8E}
.chk-l a{color:var(--acc2)}
.msg{border-radius:12px;padding:14px 16px;font-size:15px}
.msg.ok{background:#0F2A1D;border:1px solid #1E6B42;color:#BFF2D6}
.msg.err{background:#2E1015;border:1px solid #7A1F2B;color:#FFC9CF}
form .btn{align-self:flex-start}

/* faq */
.faq .w{max-width:820px}
.faq h2{margin-bottom:24px}
details{border:1px solid var(--line);background:var(--card);border-radius:var(--r);padding:18px 22px;margin-bottom:12px}
summary{cursor:pointer;font:600 18px var(--fd);list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';font:300 28px/1 var(--fb);color:var(--acc)}
details[open] summary::after{content:'–'}
details p{margin-top:12px;color:var(--mut);max-width:66ch}

/* footer e pagine legali */
footer{background:#000;color:var(--mut);padding-block:44px;font-size:14px;border-top:1px solid var(--line)}
footer .row{display:flex;gap:32px;justify-content:space-between;flex-wrap:wrap;align-items:flex-start}
footer .links{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px}
footer a{color:var(--fg)}
.legal{padding-block:56px 96px;min-height:70vh}
.legal .w{max-width:760px}
.legal h1{font-size:clamp(30px,5vw,48px);font-weight:700;margin-bottom:12px}
.legal h2{font-size:22px;margin:32px 0 10px}
.legal p{color:#D0D1DB;margin-bottom:10px}
.legal a{color:var(--acc2)}
.legal .meta{font:400 12px var(--mono);color:var(--mut);margin-bottom:28px}
.legal .todo{background:#3A2E0A;border:1px solid #7A6218;border-radius:12px;padding:12px 16px;font-size:14px;color:#FFE9A8;margin-bottom:24px}

@media(prefers-reduced-motion:no-preference){.sc,.gar li{will-change:transform}}
@media(prefers-reduced-motion:reduce){.rv{transform:none;transition:none}.sc,.gar li,.btn,.btn svg,.go svg{transition:none}}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){
 .wrap,.trust .top,.fr{grid-template-columns:1fr}
 .pl{grid-template-columns:1fr}
 .burger{display:block}
 nav{display:none;position:absolute;left:0;right:0;top:100%;background:#05060B;flex-direction:column;align-items:stretch;padding:8px 16px 16px;border-bottom:1px solid var(--line)}
 nav.open{display:flex}
 nav>a,nav>button{justify-content:space-between;padding:14px 4px;border-bottom:1px solid var(--line);width:100%}
 .mega{position:static;background:#0A0B12}.mega ul{padding:4px 16px 8px}
 .right{margin-left:auto}.btn.hd-btn{display:none}}
@media(max-width:620px){.grid,.steps{grid-template-columns:1fr}.win ul{min-height:0}form{padding:22px}.wrap{padding-block:44px 64px}}
