/* Graphic revision: a visual board built from actual projects and original course diagrams. */
:root{--ground:#f1f4f8;--board:#dae6fa;--canvas:#e8edf5}
.graphical-hero{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:stretch;min-height:calc(100svh - 114px);padding-top:28px}
.hero-about{padding:38px 26px 28px 0;display:flex;flex-direction:column;justify-content:center;align-items:start}
.hero-about h1{font-size:clamp(52px,6.5vw,94px);line-height:.95;max-width:10ch}
.hero-about .message{font-size:var(--size-lead);margin-top:24px;max-width:27ch}
.hero-person{display:grid;grid-template-columns:80px 1fr;gap:22px;align-items:center;margin-top:32px}
.hero-person img{width:80px;aspect-ratio:4/5;object-fit:cover;object-position:center 35%}
.hero-person p{font-size:var(--size-body);line-height:1.5;max-width:47ch}
.hero-experience{font-size:var(--size-sm);max-width:51ch;margin-top:30px;color:var(--muted)}
.hero-board{background:var(--board);padding:24px;display:flex;flex-direction:column;justify-content:center;gap:20px;min-width:0;position:relative;overflow:hidden}
.preview-controls{display:flex;gap:8px;flex-wrap:wrap;justify-content:start;position:relative;z-index:1}
.preview-controls button{padding:10px 14px;border:0;background:transparent;color:var(--ink);font-size:var(--size-sm);min-height:44px}
.preview-controls button[aria-pressed=true]{background:var(--paper);color:var(--blue);font-weight:600}
.main-preview{display:block;background:var(--paper);text-decoration:none;transform:rotate(-2deg);transform-origin:center;transition:transform .3s,opacity .2s}
.main-preview:hover{transform:rotate(0deg) translateY(-3px);opacity:1}
.main-preview img{width:100%;aspect-ratio:16/10;object-fit:contain;background:var(--paper);transition:opacity .2s}
.main-preview span{display:block;padding:14px 20px;font-size:var(--size-sm);background:var(--paper)}
.board-bottom{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:9px;align-items:center}
.board-bottom a{display:block;overflow:hidden}.board-bottom img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.board-finance{transform:rotate(3deg)}.board-simulator{transform:rotate(-3deg)}
.graphical-hero .hero-board{animation:board-open 1s cubic-bezier(.22,1,.36,1) both}
@keyframes board-open{from{opacity:.6;transform:translateX(28px)}to{opacity:1;transform:translateX(0)}}
.visual-projects{padding-top:120px}.visual-projects .section-intro h2{font-size:clamp(42px,6vw,80px);max-width:9ch}
.project-gallery{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:58px 28px;align-items:start}
.gallery-project{min-width:0}.gallery-radice{grid-column:span 7}.gallery-portfolio-dashboard{grid-column:span 5;margin-top:95px}.gallery-fedwatcher{grid-column:span 5}.gallery-domus{grid-column:span 7;margin-top:95px}
.project-art{display:block;position:relative;overflow:hidden;background:var(--board);text-decoration:none}
.project-art img{width:100%;aspect-ratio:16/11;object-fit:contain;object-position:center;transition:transform .6s cubic-bezier(.22,1,.36,1)}
.project-art:hover{opacity:1}.project-art:hover img{transform:scale(1.035)}
.gallery-radice .project-art{padding:24px;background:#dfece7}.gallery-radice img{object-fit:cover;object-position:top}
.gallery-portfolio-dashboard .project-art{background:#e0eafa}.gallery-portfolio-dashboard img{aspect-ratio:4/4.7;object-fit:contain}
.gallery-fedwatcher .project-art{padding:24px;background:#dae4ed}.gallery-fedwatcher img{aspect-ratio:4/4.5;object-fit:cover;object-position:20% 20%}
.gallery-domus .project-art{padding:24px;background:#e3e6eb}.gallery-domus img{aspect-ratio:16/11;object-fit:cover;object-position:50% 45%}
.art-action{position:absolute;left:16px;bottom:16px;padding:12px 17px;background:var(--paper);font-size:var(--size-sm);color:var(--ink);transform:translateY(70px);transition:transform .25s}
.project-art:hover .art-action,.project-art:focus-visible .art-action{transform:translateY(0)}
.gallery-copy{padding:24px 0 0}.gallery-copy h3{font-size:var(--size-lead)}.gallery-copy h3 a{text-decoration:none}.gallery-copy p{margin-top:14px;max-width:50ch}.gallery-copy .tools{margin-top:14px}
.visual-entries{gap:12px}.visual-entries .entry{position:relative;min-height:460px;padding:32px;overflow:hidden;gap:24px}
.visual-entries .free-entry>img{width:68%;align-self:end;margin-right:-26px;transform:rotate(-5deg);margin-bottom:-20px}
.visual-entries .course-entry{background:var(--blue);color:var(--paper)}
.path-graphic{list-style:none;display:flex;gap:8px;align-items:end;justify-content:space-between;transform:rotate(-7deg);padding:24px 0;margin:0 -16px}
.path-graphic li{font-size:clamp(24px,3vw,42px);font-weight:500;background:var(--paper);color:var(--blue);padding:20px 14px;display:block}
.path-graphic li:nth-child(2){transform:translateY(-24px)}.path-graphic li:nth-child(3){transform:translateY(10px)}
.visual-course-list{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:36px 24px;align-items:start}
.visual-course{grid-column:span 4;min-width:0}.visual-course:nth-child(2){margin-top:56px}.visual-course:nth-child(3){margin-top:112px}
.course-cover{display:block;overflow:hidden}.course-cover img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .4s}.course-cover:hover img{transform:scale(1.04)}.course-cover:hover{opacity:1}
.visual-course-copy{padding-top:22px}.visual-course-copy p{margin-top:14px;min-height:54px}.visual-course-copy>a{display:inline-block;margin-top:20px}
.visual-business{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center;background:var(--board);color:var(--ink)}
.visual-business h3{font-size:var(--size-lead);margin-bottom:22px}.visual-business .business-list{gap:12px;margin-top:22px}.visual-business .business-list p{background:var(--paper);padding:18px}
.visual-business .button{background:var(--blue);color:var(--paper)}
.business-art{height:320px;position:relative}.business-art svg{width:100%;height:100%}.business-node{position:absolute;background:var(--paper);color:var(--ink);padding:18px 26px;font-size:var(--size-body);z-index:1;min-width:132px;text-align:center}
.business-node:nth-child(1){left:3%;top:13%;transform:rotate(-8deg)}.business-node:nth-child(2){right:0;top:13%;transform:rotate(7deg)}.business-node:nth-child(3){left:23%;bottom:5%;transform:rotate(-3deg)}
.visual-resource{padding:0;gap:0;background:var(--paper)}.visual-resource>div:last-child{padding:36px}.visual-resource img{aspect-ratio:1;object-fit:cover;object-position:22% 50%}
.course-detail-art{width:100%;max-width:840px;aspect-ratio:16/8;object-fit:contain;background:var(--board);margin-bottom:44px}
.detail-image.graphic-diagram{object-fit:contain;background:var(--board)}
@media(min-width:1450px){.graphical-hero{min-height:740px}.hero-board{padding:32px}}
@media(max-width:1000px){.graphical-hero{grid-template-columns:1fr 1fr;gap:20px}.hero-about{padding-right:0}.hero-about h1{font-size:64px}.hero-person{grid-template-columns:64px 1fr;gap:16px}.hero-person img{width:64px}.hero-person p{font-size:16px}.hero-board{padding:18px;gap:16px}.preview-controls{gap:0}.preview-controls button{padding:10px 9px}.board-bottom{grid-template-columns:1fr}.board-finance{display:none!important}.board-simulator img{aspect-ratio:2.4}.gallery-portfolio-dashboard,.gallery-domus{margin-top:64px}.visual-course-list{gap:20px}.visual-course-copy p{min-height:80px}.visual-business{grid-template-columns:1fr}.business-art{height:230px;max-width:420px;width:100%;margin:auto}.visual-entries .entry{padding:28px}.path-graphic{gap:4px}.path-graphic li{padding:18px 8px;font-size:24px}}
@media(max-width:700px){.graphical-hero{display:flex;flex-direction:column;padding-top:12px;gap:22px;min-height:0}.hero-about{display:grid;grid-template-columns:1fr;padding:22px 0 0;gap:22px}.hero-about h1{font-size:64px;max-width:9ch}.hero-about .message{font-size:24px;margin:0}.hero-person{grid-template-columns:70px 1fr;gap:18px;margin:0;align-items:start}.hero-person img{width:70px}.hero-person p{font-size:16px}.hero-about .actions{margin-top:0;gap:20px}.hero-experience{margin-top:0}.hero-board{padding:18px;gap:14px}.board-bottom{display:none}.main-preview{transform:rotate(-1.5deg);margin:4px 0}.main-preview img{aspect-ratio:16/9}.main-preview span{padding:12px 16px}.preview-controls{justify-content:space-between}.preview-controls button{padding:8px 14px;min-height:44px}.visual-projects{padding-top:76px}.visual-projects .section-intro h2{font-size:44px;max-width:14ch}.project-gallery{grid-template-columns:1fr;gap:40px}.gallery-project{grid-column:auto;margin-top:0!important}.gallery-radice .project-art,.gallery-fedwatcher .project-art,.gallery-domus .project-art{padding:16px}.gallery-project .project-art img{aspect-ratio:4/3;object-fit:contain}.gallery-radice .project-art img{object-fit:cover;object-position:top}.gallery-fedwatcher .project-art img{object-fit:cover;object-position:10% 25%}.gallery-copy{padding-top:18px}.art-action{display:none}.visual-entries .entry{min-height:390px}.visual-entries .free-entry>img{width:78%}.path-graphic li{font-size:30px}.visual-course-list{grid-template-columns:1fr;gap:42px}.visual-course{grid-column:auto;margin-top:0!important;display:grid;grid-template-columns:.9fr 1fr;gap:20px;align-items:center}.visual-course-copy{padding:0}.visual-course-copy h3{font-size:24px}.visual-course-copy p{font-size:16px;min-height:0}.visual-course-copy>a{font-size:14px;margin-top:16px}.course-cover img{aspect-ratio:4/5}.visual-business{gap:24px;padding:26px}.business-art{height:220px}.visual-resource{gap:0}.visual-resource>div:last-child{padding:26px}.visual-resource img{aspect-ratio:16/10}.course-detail-art{aspect-ratio:4/3}.detail-image.graphic-diagram{aspect-ratio:4/3}}
@media(max-width:390px){.hero-about h1{font-size:58px}.preview-controls button{padding:8px 10px}.visual-course{grid-template-columns:1fr}.course-cover img{aspect-ratio:16/10}.visual-course-copy p{font-size:17px}.visual-course-copy>a{font-size:17px}.hero-person{grid-template-columns:60px 1fr;gap:14px}.hero-person img{width:60px}}
.course-cover img{object-fit:contain;background:var(--board)}
@media(max-width:1000px){.graphical-hero{min-height:0}.hero-about{padding-top:28px;padding-bottom:28px}}
@media(max-width:700px){.path-graphic li{font-size:24px}.hero-about{padding-top:22px;padding-bottom:0}}
@media(prefers-reduced-motion:reduce){.graphical-hero .hero-board{animation:none}.main-preview,.board-finance,.board-simulator,.path-graphic,.path-graphic li,.business-node{transform:none!important}}