/* cervello.unlikeacademy.it · componenti nuovi sopra lo stile comune (stile.css, stessa base di aigratis e montaggio) */

/* navigazione tra le cinque parti */
.nav5{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.nav5 a{font-size:13.5px;font-weight:700;color:var(--ink);text-decoration:none;background:#fff;border:1.5px solid var(--line);border-radius:100px;padding:6px 13px;line-height:1.2}
.nav5 a b{color:var(--fucsia);font-weight:900;margin-right:5px}
.nav5 a:hover{border-color:var(--ink)}
.nav5 a.on{background:var(--ink);border-color:var(--ink);color:#fff}
.nav5 a.on b{color:#F7A8CB}

/* due colonne: cosa fa l'AI, cosa no */
.duecol{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.duecol .part ul{list-style:none;display:grid;gap:10px;margin-top:12px}
.duecol .part li{font-size:15.5px;line-height:1.45;padding-left:24px;position:relative}
.duecol .part li::before{content:'';position:absolute;left:0;top:6px;width:11px;height:11px;border-radius:3px;background:var(--blu);rotate:45deg}
.duecol .part.non li::before{background:var(--fucsia)}

/* decidi tu / delega pure */
.decidi{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.decidi>div{border-radius:20px;padding:clamp(22px,3vw,32px)}
.decidi .tu{background:var(--fucsia);color:#fff;box-shadow:5px 6px 0 rgba(34,124,192,.45)}
.decidi .tu h3,.decidi .tu li,.decidi .tu li b{color:#fff}
.decidi .del{background:#fff;border:1.5px solid var(--line);box-shadow:var(--ombra-card)}
.decidi h3{font-weight:900;font-size:1.4rem;letter-spacing:-.045em}
.decidi ul{list-style:none;display:grid;gap:11px;margin-top:16px}
.decidi li{font-size:16px;line-height:1.4;padding-left:26px;position:relative}
.decidi .tu li::before{content:'';position:absolute;left:0;top:6px;width:11px;height:11px;border-radius:50%;background:#fff}
.decidi .del li::before{content:'';position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:5px;background:var(--blu)}
.decidi .del li::after{content:'';position:absolute;left:4px;top:8px;width:7px;height:4px;border-left:2.5px solid #fff;border-bottom:2.5px solid #fff;rotate:-45deg}

/* studi: una scheda per ogni cosa che fa il cervello */
.studio{background:#fff;border:1.5px solid var(--line);border-radius:22px;padding:clamp(22px,3.4vw,38px);box-shadow:var(--ombra-card);margin-top:22px;display:grid;grid-template-columns:56px 1fr;gap:clamp(14px,2.4vw,26px);align-items:start;scroll-margin-top:20px}
.studio .num{width:52px;height:52px;border-radius:50%;background:var(--blu);color:#fff;font-weight:900;font-size:1.5rem;display:flex;align-items:center;justify-content:center;box-shadow:3px 4px 0 rgba(205,36,113,.28)}
.studio:nth-of-type(even) .num{background:var(--fucsia);box-shadow:3px 4px 0 rgba(34,124,192,.3)}
.studio h2{font-weight:900;font-size:clamp(1.45rem,3vw,2rem);letter-spacing:-.05em;line-height:1.06}
.studio .corpo>p{font-size:1.04rem;margin-top:12px;max-width:40em}
.studio .corpo>p+p{margin-top:10px}
.studio .dati-s{list-style:none;display:grid;gap:10px;margin-top:16px}
.studio .dati-s li{background:var(--azzurro);border-radius:14px;padding:13px 16px;font-size:15.5px;line-height:1.5}
.studio .dati-s li small{display:block;font-size:12.5px;color:var(--gray);margin-top:5px;line-height:1.4;font-weight:600}
.studio .lim{font-size:13.5px;color:var(--gray);margin-top:12px;line-height:1.5}
.studio .lim b{color:var(--gray);font-weight:800}
.studio .leggo{margin-top:14px;font-size:1.04rem;max-width:40em}
.studio .leggo .et{display:block;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--blu);margin-bottom:3px}
.studio .dom{margin-top:18px;background:var(--fucsia);color:#fff;border-radius:16px;padding:16px 20px;box-shadow:4px 5px 0 rgba(34,124,192,.38);font-weight:700;font-size:1.06rem;line-height:1.4}
.studio .dom span{display:block;font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;opacity:.9;margin-bottom:4px}
.studio .dom a{color:#fff;font-weight:800;text-decoration:none;border-bottom:2px solid rgba(255,255,255,.55);white-space:nowrap}

/* esercizi */
.attrezzi{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.btn-s{font-family:inherit;font-weight:800;font-size:15px;line-height:1.1;border-radius:100px;padding:12px 20px;cursor:pointer;background:#fff;color:var(--ink);border:2px solid var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.btn-s:hover{background:var(--ink);color:#fff}
.btn-s.done{background:var(--blu);border-color:var(--blu);color:#fff}
.autotest{margin-top:18px;display:grid;gap:8px}
.autotest .rg{display:grid;grid-template-columns:200px 1fr 1fr;gap:12px;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:10px 14px;box-shadow:var(--ombra-card)}
.autotest .rg>b{font-size:14.5px;line-height:1.25}
.autotest .rg>b i{font-style:normal;color:var(--fucsia);margin-right:6px}
.autotest label{display:grid;grid-template-columns:24px 1fr;gap:9px;align-items:start;font-size:14.5px;line-height:1.4;cursor:pointer}
.autotest input,.ck{appearance:none;-webkit-appearance:none;width:22px;height:22px;border:2px solid var(--ink);border-radius:6px;margin-top:1px;cursor:pointer;display:grid;place-content:center;background:#fff}
.autotest input::before,.ck::before{content:'';width:12px;height:7px;border-left:3px solid #fff;border-bottom:3px solid #fff;rotate:-45deg;margin-top:-3px;opacity:0}
.autotest input:checked,.ck:checked{background:var(--fucsia);border-color:var(--fucsia)}
.autotest input:checked::before,.ck:checked::before{opacity:1}

.es{background:#fff;border:1.5px solid var(--line);border-radius:24px;padding:clamp(22px,3.4vw,40px);box-shadow:var(--ombra);margin-top:26px;scroll-margin-top:20px}
.es .top{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.es .n{flex:none;width:52px;height:52px;border-radius:50%;background:var(--blu);color:#fff;font-weight:900;font-size:1.5rem;display:flex;align-items:center;justify-content:center;box-shadow:3px 4px 0 rgba(205,36,113,.28)}
.es:nth-of-type(even) .n{background:var(--fucsia);box-shadow:3px 4px 0 rgba(34,124,192,.3)}
.es h2{font-weight:900;font-size:clamp(1.5rem,3.2vw,2.15rem);letter-spacing:-.05em;line-height:1.05;flex:1;min-width:12em}
.es .tempo{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);border:1.5px solid var(--line);border-radius:100px;padding:6px 12px}
.es .perche{font-size:1.04rem;margin-top:16px;max-width:42em}
.es .due{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,3.4vw,40px);margin-top:22px;align-items:start}
.es ol{list-style:none;counter-reset:q;display:grid;gap:12px}
.es ol li{counter-increment:q;display:grid;grid-template-columns:30px 1fr;gap:12px;font-size:15.5px;line-height:1.5;align-items:start}
.es ol li::before{content:counter(q);width:28px;height:28px;border-radius:50%;background:var(--azzurro);color:var(--blu);font-weight:900;font-size:.9rem;display:flex;align-items:center;justify-content:center}
.es .fatto{margin-top:18px;background:var(--azzurro);border-radius:14px;padding:13px 16px;font-size:15.5px;line-height:1.5;font-weight:600;color:var(--ink)}
.foglio{background:#FFFEFB;border:1.5px solid var(--line);border-radius:16px;padding:16px 18px 14px;box-shadow:var(--ombra-card);position:relative}
.foglio .mano{position:absolute;right:16px;top:8px;font-size:1.25rem;rotate:-3deg;color:var(--fucsia)}
.foglio label.f{display:block;font-size:11.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--blu);margin:12px 0 2px;line-height:1.35;padding-right:70px}
.foglio label.f:first-of-type{margin-top:6px}
.foglio textarea{display:block;width:100%;font:inherit;font-size:15.5px;line-height:32px;color:var(--ink);border:0;background:transparent;resize:vertical;padding:0 2px;background-image:repeating-linear-gradient(transparent,transparent 31px,#D9D3CC 31px,#D9D3CC 32px);background-attachment:local;min-height:32px;overflow:hidden}
.foglio textarea:focus{outline:2px solid rgba(34,124,192,.5);outline-offset:2px;border-radius:4px}
.foglio .riservato{font-size:12.5px;color:var(--gray);margin-top:12px;line-height:1.4}

/* scheda */
.scheda-g{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px}
.scheda-g .bl{background:#FFFEFB;border:1.5px solid var(--line);border-radius:16px;padding:16px 18px 14px;box-shadow:var(--ombra-card);position:relative}
.scheda-g .bl::before{content:'';position:absolute;left:18px;top:0;width:36px;height:4px;border-radius:0 0 3px 3px;background:var(--fucsia)}
.scheda-g .bl:nth-child(even)::before{background:var(--blu)}
.scheda-g h3{font-weight:900;font-size:1.05rem;letter-spacing:-.03em;margin-top:6px;line-height:1.2}
.scheda-g .h{font-size:12.5px;color:var(--gray);line-height:1.4;margin-top:3px}
.scheda-g textarea{display:block;width:100%;font:inherit;font-size:15px;line-height:32px;color:var(--ink);border:0;background:transparent;resize:vertical;padding:0 2px;margin-top:6px;background-image:repeating-linear-gradient(transparent,transparent 31px,#D9D3CC 31px,#D9D3CC 32px);background-attachment:local;min-height:128px}
.scheda-g textarea:focus{outline:2px solid rgba(34,124,192,.5);outline-offset:2px;border-radius:4px}

/* le tre porte */
.porte{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:30px;align-items:stretch}
.porta{border-radius:22px;padding:clamp(22px,3vw,30px);display:flex;flex-direction:column;position:relative;overflow:hidden}
.porta .q{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;line-height:1.35}
.porta h2{font-weight:900;font-size:clamp(1.6rem,2.6vw,2.1rem);letter-spacing:-.05em;margin-top:10px;line-height:1.04}
.porta p{font-size:15.5px;line-height:1.5;margin-top:12px}
.porta p+p{margin-top:8px}
.porta .btn{margin-top:auto;font-size:15.5px;padding:15px 22px}
.porta .go{margin-top:12px;font-size:14.5px;font-weight:800;text-decoration:none;border-bottom:2px solid currentColor;align-self:flex-start}
.porta .spazio{flex:1;min-height:18px}
.porta.st{background:url(texture/grana-leggera.jpg) center/cover,radial-gradient(circle at 85% 20%,#7A52F0 0%,#5B38C4 45%,#2A1557 100%);background-blend-mode:multiply,normal;color:rgba(255,255,255,.9)}
.porta.st h2,.porta.st b{color:#fff}
.porta.st .q{color:#F7A8CB}
.porta.st .wm{width:150px;margin-top:12px}
.porta.cl{background:url(texture/grana-leggera.jpg) center/cover,#227CC0;background-blend-mode:multiply,normal;color:rgba(255,255,255,.92)}
.porta.cl h2,.porta.cl b{color:#fff}
.porta.cl .q{color:#fff;opacity:.9}
.porta.cl .btn{background:#fff;color:var(--ink);box-shadow:4px 5px 0 rgba(20,40,80,.28)}
.porta.cl .go{color:#fff}
.porta.pe{background:#fff;border:1.5px solid var(--line);box-shadow:var(--ombra-card)}
.porta.pe .q{color:var(--blu)}
.porta.pe .go{color:var(--ink)}

/* le altre guide, in ordine */
.guide{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:26px;counter-reset:g}
.guide li{counter-increment:g}
.guide a{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:18px 20px;box-shadow:var(--ombra-card);text-decoration:none;height:100%}
.guide a::before{content:counter(g);width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;font-weight:900;font-size:1.15rem;display:flex;align-items:center;justify-content:center}
.guide a:hover{border-color:var(--ink)}
.guide b{display:block;font-size:1.08rem;letter-spacing:-.03em;line-height:1.2}
.guide span{display:block;font-size:14.5px;line-height:1.45;margin-top:5px;color:var(--body)}
.guide small{display:block;font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--fucsia);margin-top:8px}

/* fonti */
.fonti{list-style:none;display:grid;gap:10px;margin-top:22px}
.fonti li{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:14px 18px;font-size:14.5px;line-height:1.5}
.fonti li b{display:block;font-size:15px}
.fonti li small{display:block;color:var(--gray);margin-top:4px;font-size:13px;line-height:1.45}

.prossima{margin-top:34px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.prossima .btn{font-size:16px;padding:16px 28px}
.prossima .lnk{font-size:15px}
.prossima .lnk a{color:var(--ink);font-weight:800;text-decoration:none;border-bottom:2px solid rgba(205,36,113,.4)}

@media(max-width:980px){
  .porte{grid-template-columns:1fr}
  .scheda-g{grid-template-columns:repeat(2,1fr)}
  .autotest .rg{grid-template-columns:1fr 1fr}
  .autotest .rg>b{grid-column:1/-1}
}
@media(max-width:760px){
  .duecol,.decidi,.es .due,.guide{grid-template-columns:1fr}
  .studio{grid-template-columns:1fr}
  .studio .num{width:44px;height:44px;font-size:1.25rem}
}
@media(max-width:560px){
  .scheda-g{grid-template-columns:1fr}
  .autotest .rg{grid-template-columns:1fr}
  .foglio label.f{padding-right:0}
  .foglio .mano{position:static;display:block;margin-bottom:4px}
}

/* stampa: solo il contenuto, un esercizio per foglio */
@media print{
  .strip,.hd,.nav5,.attrezzi,.btns,.btn,.btn-s,.stbanner,.prossima,footer,.porte,.guide,.hero .visual,#stratego,.no-stampa{display:none!important}
  body{background:#fff;color:#222;font-size:12pt}
  .hero,.fascia,.scura,.blu-sec{background:#fff!important}
  .es,.studio,.punto,.part{box-shadow:none!important;border:1px solid #bbb}
  .es{break-inside:avoid;page-break-inside:avoid;page-break-before:always;margin-top:0}
  .es:first-of-type{page-break-before:auto}
  .foglio{box-shadow:none;border:1px solid #bbb}
  .foglio textarea,.scheda-g textarea{overflow:visible}
  .scheda-g{grid-template-columns:repeat(2,1fr)}
  a{text-decoration:none}
}

/* riquadri cliccabili: si capisce che si apre */
a.part{display:block;transition:transform .18s,border-color .18s,box-shadow .18s}
a.part:hover{transform:translateY(-3px);border-color:var(--ink);box-shadow:var(--ombra)}
.part .vai{display:inline-block;margin-top:12px;font-size:14.5px;font-weight:800;color:var(--fucsia)}
a.part:hover .vai{text-decoration:underline;text-underline-offset:3px}

/* pagina degli esercizi: indice, avanzamento, scarica */
.progresso{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:22px;font-size:14.5px;font-weight:700;color:var(--ink)}
.progresso b{color:var(--fucsia);font-size:1.15rem}
.progresso .barra{flex:0 1 200px;height:10px;border-radius:10px;background:#fff;border:1.5px solid var(--line);overflow:hidden}
.progresso .barra i{display:block;height:100%;width:0;background:var(--fucsia);border-radius:10px;transition:width .3s}
.indice-et{margin-top:18px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--blu)}
.indice{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.indice a{display:inline-flex;align-items:center;gap:9px;background:#fff;border:2px solid var(--ink);border-radius:100px;padding:9px 16px 9px 10px;font-weight:800;font-size:15px;color:var(--ink);text-decoration:none;box-shadow:3px 4px 0 rgba(34,124,192,.3);transition:transform .15s}
.indice a:hover{transform:translate(-1px,-2px);box-shadow:4px 6px 0 rgba(34,124,192,.35)}
.indice a b{width:26px;height:26px;border-radius:50%;background:var(--fucsia);color:#fff;font-size:.9rem;display:flex;align-items:center;justify-content:center}
.indice a:nth-child(even) b{background:var(--blu)}
.btn-s.pieno{background:var(--ink);color:#fff}
.btn-s.pieno:hover{background:#000;border-color:#000}
.attrezzi.scarica{margin-top:18px}
.avviso-salv{margin-top:12px;font-size:13.5px;color:var(--gray);max-width:46em;line-height:1.45}
.avviso-salv b{color:var(--ink)}
.finito{margin-top:30px;background:var(--azzurro);border-radius:20px;padding:clamp(20px,3vw,30px)}
.finito h3{font-weight:900;font-size:1.35rem;letter-spacing:-.04em}
.finito p{margin-top:6px}

/* esercizio: intestazione chiara, spunta «fatto», foglio che invita a scrivere */
.es .top{align-items:flex-start}
.es .top .tt{flex:1;min-width:12em}
.es .top .tt .et{display:block;font-size:12px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--blu)}
.es:nth-of-type(even) .top .tt .et{color:var(--fucsia)}
.es .top h2{margin-top:4px;min-width:0}
.segna{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:700;color:var(--ink);background:#fff;border:2px solid var(--ink);border-radius:100px;padding:8px 14px 8px 10px;cursor:pointer;white-space:nowrap}
.segna:hover{background:var(--azzurro)}
.es:has(.segna input:checked){border-color:var(--fucsia)}
.es:has(.segna input:checked) .segna{background:var(--fucsia);border-color:var(--fucsia);color:#fff}
.es:has(.segna input:checked) .segna .ck{background:#fff;border-color:#fff}
.es:has(.segna input:checked) .segna .ck::before{border-color:var(--fucsia)}
.tempo-es{margin-top:12px;font-size:13px;color:var(--gray)}
.foglio{border:2px dashed rgba(34,124,192,.5);background:#fff}
.foglio .come{font-size:13px;color:var(--blu);font-weight:700;margin:2px 80px 4px 0;line-height:1.35}
.foglio .mano{top:10px}
.foglio textarea::placeholder{color:#B8B1AE;font-style:italic}
.foglio textarea:hover{background-color:rgba(34,124,192,.05)}
.foglio .salvato{font-size:12.5px;color:var(--blu);font-weight:700;min-height:1.2em;margin-top:8px}

/* academy: stesso box del team, con accento fucsia */
.team.academy .box{border-color:rgba(205,36,113,.35)}
.team.academy .ic{background:var(--rosa-bg);color:var(--fucsia)}

@media print{.finito,.indice,.indice-et,.progresso,.avviso-salv,.segna,.academy,.tempo-es{display:none!important}.foglio .come{display:none}}
@media(max-width:560px){.segna{white-space:normal}.foglio .come{margin-right:0}}

/* Login di Circle in alto a destra (19/10/2026) */
.hd .dx{display:flex;align-items:center;gap:14px}
.hd .login{font-size:14px;font-weight:800;color:var(--ink);text-decoration:none;border:2px solid var(--ink);border-radius:100px;padding:7px 16px;line-height:1.1;white-space:nowrap;transition:background .15s,color .15s}
.hd .login:hover{background:var(--ink);color:#fff}
@media(max-width:640px){.hd .dx{gap:10px}.hd .dx .back{display:none}.hd .login{padding:6px 13px;font-size:13.5px}}
@media(max-width:480px){.hd .dx .acc{display:none}}

/* Kit di riconoscimento della risorsa (19/10/2026) */

.rigatop{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.timbro{font-family:'Gochi Hand',cursive;font-size:1.3rem;line-height:1;color:var(--fucsia);rotate:-4deg;border:2.5px solid var(--fucsia);border-radius:10px;padding:4px 12px 2px;white-space:nowrap;display:inline-block}
.kit{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:22px}
.kit .cap{font-family:'Gochi Hand',cursive;font-size:1.2rem;line-height:1.1;color:var(--fucsia);rotate:-2deg;margin-left:6px}
.kt{position:relative;width:54px;height:54px;border-radius:15px;background:#fff;border:2px solid var(--fucsia);box-shadow:3px 4px 0 var(--fucsia);display:flex;align-items:center;justify-content:center;color:var(--fucsia);flex:none}
.kt.grande{width:68px;height:68px;border-radius:18px}
.kt img{width:30px;height:30px;object-fit:contain;display:block}
.kt.grande img{width:38px;height:38px}
.kt svg.ic{width:28px;height:28px}
.kt.grande svg.ic{width:36px;height:36px}
.kt.barrato{box-shadow:none;border-color:var(--line,#E4E0D9)}
.kt.barrato img,.kt.barrato svg.ic{filter:grayscale(1);opacity:.45}
.kt svg.x{position:absolute;left:6px;top:6px;width:calc(100% - 12px);height:calc(100% - 12px);color:var(--fucsia)}
.voto87{display:inline-flex;align-items:baseline;gap:2px;border:3px solid var(--fucsia);border-radius:100px;padding:6px 18px;background:#fff;color:var(--fucsia);font-weight:700}
.voto87 b{font-size:2rem;letter-spacing:-.05em;font-weight:900;color:var(--fucsia)}
.logo-in{width:20px;height:20px;vertical-align:-4px;margin-right:6px;object-fit:contain;display:inline-block}
.marchi{font-size:12.5px;color:var(--gray,#665E61);max-width:46em;margin:10px auto 0;line-height:1.45}
@media(max-width:640px){.kt{width:48px;height:48px}.kt.grande{width:60px;height:60px}.kit{gap:8px}}