
:root{--paper:#ede7dd;--sheet:#fffdf7;--ink:#292633;--muted:#635e62;--night:#25273d;--gold:#b18e54;--line:#d4c8ba;--sans:system-ui,-apple-system,"Segoe UI",sans-serif;--serif:Georgia,"Times New Roman",serif}*{box-sizing:border-box}html{scroll-padding-top:6rem}body{margin:0;background:var(--paper);color:var(--ink);font:1.07rem/1.75 var(--serif)}a{color:#4a4a73;text-underline-offset:3px}a:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.skip{position:absolute;top:0;left:-9999px;padding:.5rem;background:white;z-index:30}.skip:focus{left:1rem}.hero{padding:6rem max(1.2rem,calc((100% - 1110px)/2)) 4.8rem;color:#fff7eb;background:radial-gradient(circle at 84% 22%,#a7876650,transparent 28rem),linear-gradient(130deg,#192331,#353049 67%,#423836)}.eyebrow{font:800 .73rem var(--sans);letter-spacing:.15em;text-transform:uppercase;color:#e0c493}.hero h1{font:500 clamp(3.1rem,8vw,6.7rem)/.98 var(--serif);letter-spacing:-.055em;max-width:1090px;margin:.7rem 0 1.15rem}.hero p{max-width:820px;color:#eae1df;font-size:1.27rem;line-height:1.6}.state{display:inline-block;margin-top:1rem;border:1px solid #c0a67e;padding:.4rem .7rem;font:750 .74rem/1.5 var(--sans);color:#ead5b3}.nav-wrap{position:sticky;top:0;z-index:20;background:#f8f4edee;backdrop-filter:blur(10px);border-bottom:1px solid var(--line);box-shadow:0 3px 20px #22222a12}.nav-wrap nav{max-width:1200px;margin:auto;display:flex;gap:.3rem;overflow-x:auto;padding:.62rem .8rem;white-space:nowrap;scrollbar-width:thin;font:700 .83rem/1.4 var(--sans)}.nav-wrap a{padding:.5rem .7rem;color:#313345;text-decoration:none;border-radius:4px}.nav-wrap a:hover{background:#e9e0d5}.nav-wrap .home{color:white;background:#31344a}main{max-width:1170px;margin:auto;padding:clamp(1.5rem,4vw,3.5rem) clamp(1.2rem,4vw,3.9rem) 5rem;background:var(--sheet);box-shadow:0 15px 60px #22222a11}.lead{font-size:1.27rem;max-width:890px;margin:0 0 3rem}.lead strong{color:#624766}.chapter{border-top:1px solid var(--line);scroll-margin-top:6rem;padding:3.1rem 0}.chapter h2{font:500 clamp(2.1rem,4.7vw,3.5rem)/1.15 var(--serif);letter-spacing:-.035em;max-width:920px;margin:.4rem 0 1.1rem}.chapter>p{max-width:910px}.kicker{font:800 .72rem/1.5 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#765d71}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.95rem;margin:1.5rem 0}.card{padding:1.3rem;background:#f4eee6;border:1px solid #d8ccbf;border-top:4px solid #95746e}.card h3{font:600 1.31rem/1.35 var(--serif);margin:0 0 .5rem}.card p{font-size:.99rem;line-height:1.64;margin:0}.note{border-left:5px solid var(--gold);background:#f0e8da;padding:1.25rem 1.4rem;margin:1.5rem 0}.note p{margin:.5rem 0}.route{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;font:750 .85rem/1.5 var(--sans);margin:1.5rem 0}.route span{background:#ebe4d8;border:1px solid #d2c2ae;padding:.58rem .85rem}.route b{color:#8f6c4b}.two-paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1.5rem 0}.two-paths>div{background:#eee7db;border:1px solid #d2bfae;padding:1.35rem}.two-paths h3{font:600 1.3rem/1.4 var(--serif);margin:.1rem 0 .6rem}.two-paths p{margin:0}.convergence{background:#e5ede8;border:2px solid #4e7568;padding:1.45rem;text-align:center;margin:1rem 0}.convergence strong{display:block;font:600 1.34rem/1.4 var(--serif);color:#305548}.convergence p{margin:.5rem auto;max-width:640px}.links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;margin:1.5rem 0}.links a{display:block;background:#eee8e0;border:1px solid #c6b5a6;text-decoration:none;font:750 1rem/1.5 var(--sans);padding:1.2rem}.links small{display:block;color:#635e62;font:400 .85rem/1.55 var(--sans);margin-top:.3rem}footer{padding:1.7rem;background:#252537;color:#eee7dd;text-align:center;font:.78rem/1.65 var(--sans)}footer a{color:#e6bf85}@media(max-width:760px){.hero{padding:4.4rem 1.2rem 3.3rem}.cards,.two-paths,.links{grid-template-columns:1fr}.chapter{padding:2.6rem 0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Origini afroamericane: trama storica nel testo, non laboratorio per principianti. */
.chapter h3{font:600 clamp(1.45rem,2.8vw,2rem)/1.27 var(--serif);letter-spacing:-.015em;margin:2.25rem 0 .85rem;color:#43384a;scroll-margin-top:6rem}
.chapter .chapter-intro{font-size:1.16rem;line-height:1.73;border-left:3px solid var(--gold);padding-left:1.3rem;max-width:820px;margin:1.3rem 0 2rem}
.atlantic-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin:1.4rem 0 1.6rem}
.atlantic-flow>div{background:#e9ede9;border:1px solid #bdcdc4;border-top:4px solid #527166;padding:1.1rem 1.05rem}
.atlantic-flow strong{display:block;font:750 1rem/1.42 var(--sans);color:#315649}
.atlantic-flow span{display:block;font:.88rem/1.6 var(--sans);margin-top:.45rem;color:#3b4f47}
.atlantic-quote{padding:1.2rem 1.4rem;border-left:4px solid #806780;background:#f1ebf2;margin:1.5rem 0}
.atlantic-quote span,.chapter-threshold span{display:block;color:#60435c;letter-spacing:.07em;text-transform:uppercase;font:800 .72rem/1.6 var(--sans)}
.atlantic-quote p{margin:.35rem 0;font-size:1.03rem}
.atlantic-sources{background:#f2f0e9;border:1px solid #d4cbbd;margin:1.6rem 0;padding:1.3rem 1.4rem;font:.89rem/1.8 var(--sans)}
.atlantic-sources strong{display:block;color:#49424a;font-size:.88rem}
.atlantic-sources p{margin:.4rem 0}
.chapter-threshold{margin:2rem 0 0;padding:1.3rem 1.4rem;background:#e7efeb;border-left:5px solid #527768}
.chapter-threshold p{margin:.45rem 0 0}
@media(max-width:760px){.atlantic-flow{grid-template-columns:1fr}.chapter .chapter-intro{padding-left:.95rem}}


/* Belle Époque e nuovi linguaggi: impaginazione saggistica, non schede scolastiche. */
.late-context{margin:1.7rem 0;padding:1.3rem 1.5rem;background:#f4efe7;border-left:4px solid #9b7770}
.late-context strong{display:block;color:#594350;font:750 .92rem/1.5 var(--sans)}
.late-context p{margin:.55rem 0 0}
.late-focus{margin:1.25rem 0 2rem;padding:1.15rem 1.4rem;background:#e9f0eb;border:1px solid #c3d4c9;border-left:4px solid #53796b}
.late-focus strong{display:block;color:#315747;font:750 .9rem/1.45 var(--sans)}
.late-focus p{margin:.4rem 0 .55rem}
.late-focus span{display:block;padding-top:.5rem;border-top:1px solid #c9dacf;font:.82rem/1.6 var(--sans);color:#4e6458}
.late-portraits>div{border-top:1px solid #d7c9bd;padding:1rem 0}
.late-portraits>div:first-child{border:0}
.late-portraits h3{margin-top:1rem}
.late-lab{margin:2.5rem 0 0;padding:clamp(1.15rem,3vw,2rem);background:#e7ece7;color:#263c36;border:1px solid #b4cbbd;border-top:6px solid #4c7864}
.late-lab-kicker{font:800 .76rem/1.5 var(--sans);letter-spacing:.13em;text-transform:uppercase;color:#3b6954}
.late-lab h3{color:#294b3d;margin:.6rem 0 1rem}
.late-lab .late-lab-lead{font-size:1.09rem}
.late-lab details{background:#fafbf6;border:1px solid #adc5b6;padding:1rem 1.15rem;margin:1.15rem 0}
.late-lab summary{font:800 .92rem/1.5 var(--sans);cursor:pointer}
.late-lab summary:focus-visible{outline:3px solid #ab8544;outline-offset:3px}
.late-lab details p{font-size:.97rem}
.late-lab-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1.4rem 0}
.late-lab-steps>div{background:#fcfcf7;border:1px solid #c5d5c8;padding:1.1rem 1.2rem}
.late-lab-steps span{font:800 .78rem/1.6 var(--sans);letter-spacing:.05em;color:#38664f}
.late-lab-steps p{margin:.55rem 0 0;font-size:.96rem;line-height:1.63}
.late-lab-final{background:#d7e5db;border-left:4px solid #547e63;padding:1.1rem 1.35rem}
.late-lab-final strong{color:#315443;font:750 .9rem/1.5 var(--sans)}
.late-lab-final p{margin:.5rem 0}
@media(max-width:760px){.late-lab-steps{grid-template-columns:1fr}}

/* Hero pittorici documentati per i percorsi verso la modernità */
.hero.art-hero{position:relative;min-height:clamp(460px,61vh,720px);display:flex;flex-direction:column;justify-content:center;padding-bottom:6rem;background-image:linear-gradient(90deg,rgba(19,22,33,.98),rgba(19,22,33,.86) 47%,rgba(22,24,31,.23)),var(--hero-art);background-size:cover;background-position:var(--hero-focus,center);background-repeat:no-repeat}
.hero.art-hero h1{max-width:770px;text-shadow:0 4px 20px #0009}.hero.art-hero p{max-width:690px;text-shadow:0 3px 15px #0008}.hero.art-hero .state{background:rgba(20,20,28,.48)}
.hero-art-credit{position:absolute;z-index:4;right:clamp(1rem,5vw,4rem);bottom:.95rem;max-width:90%;padding:.45rem .68rem;background:rgba(15,17,24,.74);border:1px solid #ffffff55;color:#f5e9d8;font:600 .69rem/1.5 var(--sans);text-align:right}.hero-art-credit a{color:#f6e6c7;text-decoration:underline;text-underline-offset:2px}@media(max-width:690px){.hero-art-credit{left:1rem;right:1rem;max-width:none;text-align:left;font-size:.65rem}}
@media(max-width:690px){.hero.art-hero{min-height:auto;padding-top:4.5rem;padding-bottom:6rem;background-image:linear-gradient(90deg,rgba(19,22,33,.95),rgba(19,22,33,.68)),var(--hero-art);background-position:var(--hero-mobile,var(--hero-focus,center))}}
