.about-page { background:#090909; color:#f7f7f7; }
.about-page main { overflow:hidden; }
.about-section { width:min(calc(100% - clamp(48px, 11.12vw, 160px)), 1360px); margin:0 auto; }
.about-hero { width:100%; margin:0; }
.about-hero { min-height:100vh; box-sizing:border-box; display:flex; align-items:center; padding:150px clamp(24px, 5.56vw, 80px) 60px; }
.about-hero__grid { width:min(100%, 1360px); height:calc(100vh - 210px); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:5vw; }
.about-copy { max-width:590px; }
.about-hero h1 { font-size:clamp(76px,10vw,142px); line-height:.76; letter-spacing:-.065em; margin:0 0 35px; }
.about-page .section-label,.about-details dt,.film-stats span { color:#fff36d; font:700 12px var(--font-ibm); }
.about-intro,.hobby-intro,.film-intro p:not(.section-label) { font:400 14px/1.35 var(--font-ibm); }
.about-intro { max-width:490px; }
.about-details { display:grid; grid-template-columns:1fr 1fr; margin:22px 0 0; max-width:500px; }
.about-details div { padding:4px 12px 0 0; }
.about-details div+div { border-left:1px solid #666; padding-left:14px; }
.about-details dd { margin:4px 0 0; font:400 13px/1.3 var(--font-ibm); }
.art-placeholder { width:100%; height:100%; min-height:0; margin:0; }
.art-placeholder img { display:block; width:100%; height:100%; object-fit:contain; }
.skills-band { padding:75px max(5vw,24px); background:linear-gradient(105deg,#f8ee72 0%,#f2ad73 22%,#dc4760 50%,#9b3b7d 75%,#1489b4 100%); background-size:220% 220%; background-position:0% 50%; animation:skills-gradient-flow 10s ease-in-out infinite; }
.skills-list { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; max-width:1400px; margin:auto; }
.skills-list span { border-radius:30px; padding:4px 18px; background:#fff; color:#090909; font:700 clamp(14px,2vw,21px)/1.15 var(--font-ibm); }
.about-section { padding:76px 0; }
.hobbies-section { padding-top:60px; }
.hobbies-heading { display:grid; grid-template-columns:1.1fr 1fr; align-items:start; gap:32px; margin-bottom:22px; }
.about-section h2 { margin:0 0 18px; font:700 clamp(42px,6.4vw,78px)/.95 var(--font-ibm); letter-spacing:-.04em; }
.art-placeholder--small { width:100%; height:auto; aspect-ratio:2.5; margin:0; }
.hobby-intro { max-width:680px; margin:5px 0 28px; }
.concert-table-wrap { overflow-x:auto; }
.concert-table { width:100%; min-width:650px; table-layout:fixed; border-collapse:collapse; font:400 12px var(--font-ibm); }
.concert-table th,.concert-table td { padding:5px 8px; border-bottom:1px solid #777; text-align:left; white-space:nowrap; }
.concert-table thead th { color:#fff36d; font-size:11px; }
.concert-table th:nth-child(1) { width:26%; }
.concert-table th:nth-child(2) { width:20%; }
.concert-table th:nth-child(3) { width:22%; }
.concert-table th:nth-child(4) { width:16%; }
.concert-table th:nth-child(5) { width:16%; }
.concert-table tbody th { font-weight:700; }
.concert-table th:not(:first-child),.concert-table td:not(:first-child) { text-align:center; }
.concert-table th:first-child,.concert-table td:first-child { text-align:left; }
.film-section { width:min(calc(100% - clamp(48px, 11.12vw, 160px)), 1360px); padding:75px 0 90px; }
.film-intro { max-width:1360px; margin:0 auto 34px; display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.film-intro>div:first-child { max-width:620px; }
.film-stats { display:grid; grid-template-columns:1fr 1fr; text-align:center; }
.film-stats>div+div { border-left:1px solid #777; }
.film-stats strong { display:block; color:#fff36d; font:600 clamp(45px,7vw,76px)/1 var(--font-ibm); }
.film-grid { width:min(100%,1360px); margin:auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.film-grid.is-collapsed>.film-card:nth-child(n+5) { display:none; }
.film-cover { aspect-ratio:2/3; display:grid; place-items:center; padding:12px; overflow:hidden; background:#222; color:#aaa; text-align:center; font:500 12px var(--font-ibm); }
.film-cover--image { padding:0; }
.film-cover--image img { width:100%; height:100%; object-fit:cover; }
.film-card p { margin:7px 0 0; color:#fff36d; font:700 11px var(--font-ibm); }
.film-card h3 { margin:1px 0; font:700 16px var(--font-ibm); }
.film-card span { font:400 11px var(--font-ibm); }
.archive-loading { grid-column:1/-1; }
.archive-actions { width:min(100%,1360px); margin:26px auto 0; display:flex; justify-content:space-between; }
.archive-toggle { padding:7px 22px; border:0; border-radius:30px; background:white; color:#090909; font:700 12px var(--font-ibm); cursor:pointer; }
.archive-toggle:hover { background:#fff36d; }
.contact-block { display:grid; grid-template-columns:.3fr 1fr; gap:20px; border-top:1px solid #444; }
.contact-email,.contact-links { grid-column:2; width:fit-content; font:500 22px var(--font-ibm); }
.contact-links { display:flex; gap:20px; font-size:14px; }
.about-page .site-footer { margin-top:0; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:700px) {
 .about-section { width:calc(100% - 40px); }
 .about-hero { width:100%; }
 .about-hero { min-height:100svh; padding:120px 20px 45px; }
 .about-hero__grid { height:auto; grid-template-columns:1fr; gap:28px; }
 .about-hero h1 { font-size:clamp(76px,20vw,120px); }
 .about-hero__grid > .art-placeholder { height:auto; min-height:260px; }
 .skills-band { padding:18px 14px; }
 .hobbies-heading { grid-template-columns:1fr; gap:12px; }
 .art-placeholder--small { width:100%; min-height:120px; margin:0 0 14px; }
 .film-intro { grid-template-columns:1fr; gap:25px; }
 .film-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
 .film-section { width:calc(100% - 40px); padding:55px 0; }
 .contact-block { grid-template-columns:1fr; }
 .contact-email,.contact-links { grid-column:1; }
}
/* Movie log cards */
.film-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; width:100%; }
.film-cover { aspect-ratio:2/3; display:grid; place-items:center; padding:12px; overflow:hidden; background:#222; color:#aaa; text-align:center; font:500 12px/1.3 var(--font-ibm); }
.film-cover--image { padding:0; background:#171717; }
.film-cover--image img { display:block; width:100%; height:100%; object-fit:cover; }
.film-card p { margin:7px 0 0; color:#fff36d; font:700 11px var(--font-ibm); }
.film-card h3 { margin:2px 0; font:700 16px var(--font-ibm); }
.film-card>span { font:400 11px var(--font-ibm); opacity:.8; }
.film-card[hidden] { display:none; }
.archive-actions { justify-content:space-between; }
@media(max-width:700px) { .film-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } }
/* White holographic hover for movie posters */
.film-cover { position:relative; isolation:isolate; transition:transform .5s ease, box-shadow .5s ease; }
.film-cover::before { content:""; position:absolute; z-index:1; inset:-60%; pointer-events:none; background:linear-gradient(0deg,transparent 38%,rgba(255,255,255,.08) 55%,rgba(255,255,255,.48) 68%,transparent 78%); opacity:0; transform:rotate(-45deg) translateY(-38%); transition:opacity .45s ease,transform .65s ease; }
.film-cover:hover { z-index:2; transform:scale(1.045); box-shadow:0 0 22px rgba(255,255,255,.32); }
.film-cover:hover::before { opacity:1; transform:rotate(-45deg) translateY(38%); }
@media(prefers-reduced-motion:reduce) { .skills-band { animation:none; background-position:50% 50%; } .film-cover,.film-cover::before { transition:none; } .film-cover:hover { transform:none; } }
