/* Brein Academy — strato di sistema (Brein Design System v1, ottobre 2026) */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,700..900&family=Plus+Jakarta+Sans:wght@400;500;700;800&family=JetBrains+Mono:wght@500&display=swap');
:root{
  --notte:#0B1430;--blu-notte:#162650;--blu-notte-2:#1F3263;--linea:#2E4278;
  --rosa:#E3A9B4;--bianco:#FFFFFF;--nebbia:#B9C1DD;--carta:#F4F2EE;--inchiostro:#0B1026;
  --acc:#D4145A;--b2:#D4145A;--b3:#9E005D;--on-acc:#FFFFFF;
  --display:'Archivo','Arial Black',system-ui,sans-serif;
  --body:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
html{-webkit-text-size-adjust:100%}
html,body{background:var(--notte)!important;color:var(--bianco)!important;font-family:var(--body)!important;overflow-x:clip}
body>div,body x-dc>div{background:var(--notte)!important}
a{color:var(--rosa)} a:hover{color:var(--bianco)}
::selection{background:var(--acc);color:#fff}

h1,h2,h3{font-family:var(--display)!important;font-stretch:125%!important;font-weight:900!important;
  text-transform:uppercase!important;letter-spacing:-.01em!important;line-height:1.06!important;
  text-wrap:balance;overflow-wrap:normal;hyphens:manual}
h1{font-size:clamp(1.7rem,4.4vw,3.05rem)!important}
h2{font-size:clamp(1.4rem,3.8vw,2.6rem)!important}
h3{font-size:clamp(1.02rem,2vw,1.3rem)!important;line-height:1.15!important}
h1 span,h2 span{color:inherit}

.hl{display:inline-block;background:var(--acc);color:#fff!important;border-radius:8px;padding:0 .18em;transform:rotate(-2deg);
  -webkit-box-decoration-break:clone;box-decoration-break:clone}

.tag{display:inline-flex!important;align-items:center;gap:10px;font-family:var(--mono)!important;font-weight:500!important;
  font-size:12px!important;letter-spacing:.08em!important;text-transform:uppercase}
.bars{display:inline-flex;flex-direction:column;gap:2px;width:16px;flex:0 0 16px}
.bars i{display:block;height:3px;border-radius:0 3px 3px 0}
.bars i:nth-child(1){background:var(--rosa)}
.bars i:nth-child(2){background:var(--b2);width:82%}
.bars i:nth-child(3){background:var(--b3)}

.btn-acc,.btn-ghost{min-height:54px!important;border-radius:14px!important;font-family:var(--body)!important;font-weight:800!important;font-size:16px!important}
.btn-acc{background:var(--acc)!important;color:#fff!important}
.btn-acc:hover{filter:brightness(1.08)}
.btn-ghost{background:var(--notte)!important;border:1px solid var(--linea)!important;color:#fff!important}
.btn-ghost:hover{border-color:var(--acc)!important}

a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible,label:focus-within{
  outline:2px solid var(--rosa)!important;outline-offset:3px!important}

input,textarea,select{background:var(--blu-notte-2)!important;color:#fff!important;border:1px solid var(--linea)!important;border-radius:12px!important;font-family:var(--body)!important}
input::placeholder,textarea::placeholder{color:#8F99BD!important;opacity:1}
input[type=checkbox],input[type=radio]{accent-color:var(--acc)}

/* card accento: una per pagina, per la call to action principale */
.card-acc{background:var(--acc)!important;color:#fff!important;border:0!important;border-radius:22px!important}
.card-acc *{color:#fff!important}
.card-acc .btn-acc{background:var(--notte)!important}.card-acc .hl{background:var(--notte)}[data-panel] h1{font-size:clamp(1.6rem,2.6vw,2.35rem)!important}[data-question]{font-size:clamp(1.2rem,2.2vw,1.75rem)!important;line-height:1.12!important}.card-acc .bars i:nth-child(2){background:#fff}
.card-acc .btn-ghost{background:transparent!important;border-color:rgba(255,255,255,.55)!important}

/* simbolo grande di sfondo nell'hero */
.hero-simbolo{position:absolute;pointer-events:none;user-select:none;opacity:.09;z-index:0;
  width:min(78vw,720px);height:auto;aspect-ratio:182/178;left:-12%;bottom:-24%}
.hero-host{position:relative;overflow:hidden}
.hero-host>*:not(.hero-simbolo){position:relative;z-index:1}

/* footer famiglia Brein */
.famiglia{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;font-size:14px}
.famiglia a{color:var(--nebbia)!important;text-decoration:none}
.famiglia a:hover{color:var(--rosa)!important}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* hero Home: foto del team in bianco e nero sfumata */
.hero-duo{position:absolute;top:0;bottom:0;right:0;left:-40%;width:140%;height:100%;object-fit:cover;object-position:50% 8%;opacity:.55;filter:grayscale(1) contrast(1.05);
  -webkit-mask-image:linear-gradient(to left,#000 40%,transparent 95%);mask-image:linear-gradient(to left,#000 40%,transparent 95%);pointer-events:none}
.hero-host>div:first-of-type{z-index:2!important}
@media (max-width:820px){.hero-duo{left:0;width:100%;opacity:.6;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 40%);mask-image:linear-gradient(to bottom,transparent 0,#000 40%)}}

/* header: bottoni proporzionati al menu */
[data-navbar] .btn-acc,[data-navbar] .btn-ghost{min-height:40px!important;padding:8px 16px!important;font-size:13.5px!important;border-radius:12px!important}

/* mobile: l'evidenziatore va a capo riga per riga, senza rettangoli sbordati */
@media (max-width:640px){.hl{display:inline;transform:none;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .14em;border-radius:6px}}
