/* About composition; all personal facts remain in site-data.js. */
.about-hero { display:grid; grid-template-columns:1.12fr 1fr; align-items:center; min-height:calc(100svh - 5rem); padding-block:3rem 5rem; gap:2rem; }
.about-hero__copy { position:relative; z-index:2; }
.about-hero h1 { margin:0; font-size:clamp(4.5rem,9.3vw,8.6rem); line-height:1.06; font-weight:850; letter-spacing:-.035em; }
.about-hero h1 span span { color:var(--pink); }
.about-hero h1 small { display:block; margin-top:1rem; color:var(--pink); font-size:clamp(1.5rem,2.6vw,2.3rem); font-weight:650; letter-spacing:-.02em; }
.title-line { display:block; }
.about-hero__greeting { margin:2.25rem 0 .75rem; font-size:clamp(1.25rem,2vw,1.7rem); font-weight:650; }
.about-hero__lead { max-width:31em; margin:0; color:var(--experience-muted); line-height:1.85; font-size:1.13rem; }
.about-scene { position:relative; height:min(68svh,40rem); min-height:30rem; }
.about-scene__portrait { position:absolute; bottom:2.5rem; left:50%; width:auto; max-width:100%; height:min(calc(100% - 2.5rem),39rem); aspect-ratio:2 / 3; margin:0; transform:translateX(-50%); }
.about-scene__portrait > .parallax-layer { position:relative; height:100%; }
.about-scene__photo { height:100%; aspect-ratio:2 / 3; overflow:hidden; }
.about-scene__photo img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 42%; }
.about-scene__portrait figcaption { position:absolute; z-index:1; bottom:0; right:0; display:grid; gap:.12rem; min-width:max-content; max-width:calc(100% - 1rem); padding:.6rem .85rem; background:var(--paper); color:var(--ink); font-size:.88rem; line-height:1.35; transform:rotate(3deg); }
.about-scene__portrait figcaption span { white-space:nowrap; }
.about-scene__camera { position:absolute; left:-3%; bottom:5%; width:34%; z-index:3; }
.about-scene__camera img { width:100%; height:auto; transform:rotate(-12deg); }
.about-scene__star { position:absolute; right:1%; top:4%; width:15%; }
.about-scene__star img { width:100%; height:auto; transform:rotate(12deg); }
.about-scene__slogan { position:absolute; z-index:3; top:5%; left:-9%; padding:.8rem 1.3rem; color:var(--ink); background:var(--pink); border-radius:50% 45% 45% 5% / 35% 35% 35% 10%; font-size:.92rem; font-weight:750; }
.profile-section,.traits-section,.notes-section { display:grid; grid-template-columns:5fr 7fr; gap:8%; align-items:start; }
.profile-section { min-height:100svh; align-items:center; padding-block:5rem; }
.profile-section .section-heading h2 { font-size:clamp(3.4rem,5.5vw,5.5rem); line-height:1.1; }
.profile-section .section-heading > p { font-size:clamp(1.12rem,1.7vw,1.4rem); }
.profile-section__body { padding-top:.6rem; }
.profile-role { margin:0; color:var(--pink); font-size:clamp(1.7rem,2.7vw,2.35rem); font-weight:750; }
.profile-identity { margin:.4rem 0 2rem; color:var(--experience-muted); line-height:1.65; font-size:1.08rem; }
.profile-strip { display:grid; gap:1.25rem; }
.profile-note { display:grid; grid-template-columns:3.5rem 1fr; align-items:baseline; gap:1.4rem; }
.profile-note h3 { margin:0; color:var(--pink); font-size:1rem; font-weight:700; }
.profile-note p { margin:0; line-height:1.65; max-width:32em; font-size:clamp(1.06rem,1.35vw,1.2rem); }
.resume-action { display:inline-flex; align-items:center; justify-content:space-between; gap:2rem; min-height:3.5rem; margin-top:2rem; padding:.75rem 1.1rem; color:var(--navy); background:var(--pink); font-size:1rem; font-weight:800; text-decoration:none; cursor:pointer; transition:background 180ms ease,transform 180ms ease; }
.resume-action:hover { background:var(--paper-light); transform:translateY(-2px); }
.resume-action:focus-visible { outline:3px solid var(--paper-light); outline-offset:4px; }
.traits-section__heading { position:sticky; top:8rem; }
.story-progress { display:flex; align-items:baseline; gap:.8rem; margin-top:2.5rem; color:var(--pink); }
.story-progress > span { font-size:4rem; line-height:1; font-weight:750; font-variant-numeric:tabular-nums; }
.story-progress small { color:var(--experience-muted); font-size:1rem; }
.story-anchors { display:grid; justify-items:start; gap:.7rem; margin-top:1.6rem; }
.story-anchors a { display:block; padding:.5rem 0; color:var(--experience-muted); text-decoration:none; font-size:1rem; transition:color 180ms ease; }
.story-anchors a[aria-current] { color:var(--pink); }
.trait-story-list { display:grid; gap:7rem; }
.trait-story { position:relative; padding:clamp(2rem,4vw,3.5rem); color:var(--ink); background:var(--paper-light); box-shadow:.65rem 1.3rem 2.5rem rgba(8,12,27,.18); scroll-margin-top:8rem; }
.trait-story--2 { margin-left:1.5rem; }
.trait-story--3 { margin-right:1.5rem; }
.trait-story--4 { margin-left:.75rem; }
.trait-story__scene { margin:0 0 1.3rem; color:var(--pink-ink); font-size:1rem; font-weight:650; }
.trait-story h3 { max-width:11em; margin:0 0 .8rem; font-size:clamp(1.5rem,2.5vw,2.2rem); line-height:1.38; letter-spacing:-.02em; }
.trait-story__text { max-width:34em; margin:0; font-size:1.08rem; line-height:1.85; }
.trait-story small { display:block; margin-top:1.7rem; color:var(--ink-muted); font-size:.92rem; line-height:1.6; }
.paper-corner { position:absolute; top:0; right:0; width:2.5rem; height:2.5rem; background:var(--navy); clip-path:polygon(0 0,100% 0,100% 100%); pointer-events:none; }
.paper-corner::after { content:''; position:absolute; inset:0; background:#d7cbbb; clip-path:polygon(0 0,0 100%,100% 100%); }
.about-interests { margin-top:2rem; padding-top:1.3rem; border-top:1px solid rgba(255,255,255,.18); }
.about-interests h3 { margin:0 0 .8rem; font-size:1.15rem; }
.about-interests article { display:grid; grid-template-columns:5.5rem 1fr; gap:1rem; margin-top:.55rem; }
.about-interests h4 { margin:0; color:var(--pink); font-size:1rem; line-height:1.8; }
.about-interests p { margin:0; color:var(--experience-muted); font-size:1.05rem; line-height:1.8; }
.ticket-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3.5rem 2.5rem; align-items:start; margin-top:3rem; }
.ticket:nth-child(3n + 2) { padding-top:3.5rem; }
.ticket:nth-child(3n) { padding-top:1rem; }
.ticket__frame,.shelf-item__cover { perspective:800px; min-width:0; }
.ticket__frame > * { transform-style:preserve-3d; }
.ticket__frame img { display:block; width:100%; aspect-ratio:3/4; object-fit:cover; object-position:center; }
.travel-empty { display:flex; flex-direction:column; justify-content:space-between; aspect-ratio:4/3; padding:1.5rem; background:var(--paper); color:var(--ink); }
.travel-empty span { font-size:4.8rem; font-weight:800; line-height:1; letter-spacing:-.03em; color:#756778; }
.travel-empty small { align-self:end; font-size:.78rem; }
.pending-label { display:block; margin-top:.8rem; color:var(--experience-muted); font-size:.75rem; }
.ticket h3 { margin:1.3rem 0 .55rem; font-size:1.25rem; }
.ticket p { margin:0; color:var(--experience-muted); line-height:1.8; font-size:1.04rem; }
.shelf-layout { display:grid; grid-template-columns:1fr 1fr; gap:10%; margin-top:4rem; }
.shelf-layout > section > h3 { margin:0 0 2rem; color:var(--pink); font-size:1rem; font-weight:700; }
.shelf-layout > section > div { display:grid; gap:3rem; }
.shelf-layout > section:nth-child(2) { padding-top:4.5rem; }
.shelf-item { display:grid; grid-template-columns:minmax(6.5rem,.8fr) 1fr; align-items:center; gap:1.8rem; }
.shelf-item__cover > img { display:block; width:100%; height:auto; object-fit:contain; background:transparent; box-shadow:none; }
.shelf-empty { display:flex; flex-direction:column; justify-content:space-between; aspect-ratio:2/3; padding:1.3rem; background:#e5d5db; color:var(--ink); box-shadow:.5rem .9rem 1.8rem rgba(8,12,27,.2); }
.shelf-empty span { font-weight:750; font-size:2.25rem; }
.shelf-empty small { font-size:.73rem; }
.shelf-item--movies .shelf-empty { aspect-ratio:3/4; background:#dbdee6; }
.shelf-item--movies .shelf-item__cover > img { height:auto; }
.shelf-art { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-height:13rem; aspect-ratio:2/3; padding:1rem; overflow:hidden; color:#1f2940; background:#e8d9c6; box-shadow:.5rem .9rem 1.8rem rgba(8,12,27,.16); }
.shelf-art::before { content:''; position:absolute; width:9rem; aspect-ratio:1; right:-4.5rem; top:23%; border:1.1rem solid currentColor; border-radius:50%; opacity:.13; }
.shelf-art > * { position:relative; z-index:1; }
.shelf-art small { font-size:.55rem; font-weight:800; letter-spacing:.14em; }
.shelf-art strong { max-width:9ch; font-size:clamp(.95rem,1.4vw,1.35rem); line-height:1.15; overflow-wrap:anywhere; }
.shelf-art span { font-size:1.05rem; font-weight:850; line-height:1.3; }
.shelf-item--books:nth-child(2) .shelf-art { background:#cdd9d4; }
.shelf-item--movies:nth-child(1) .shelf-art { background:#e5d3d2; }
.shelf-item--movies:nth-child(2) .shelf-art { color:#f8f2e9; background:#52657a; }
.shelf-item--movies .shelf-art { aspect-ratio:3/4; }
.shelf-item h4 { margin:0 0 .7rem; font-size:1.35rem; }
.shelf-item p { margin:0; font-size:1.05rem; line-height:1.8; color:var(--experience-muted); }
.shelf-item__meta { display:block; margin:-.35rem 0 .8rem; color:var(--pink); font-size:.95rem; }
.shelf-item__source { display:inline-block; margin-top:.8rem; color:var(--paper-light); font-size:.95rem; text-underline-offset:.25em; }
.shelf-item__source:hover { color:var(--pink); }
.notes-list { display:grid; gap:2rem; padding-top:.5rem; }
.note-slot { padding:1.6rem 0 2rem; border-bottom:1px solid rgba(255,255,255,.18); }
.note-slot h3 { margin:0 0 .8rem; color:var(--pink); font-size:1.55rem; }
.note-slot p { margin:0; color:var(--experience-muted); font-size:1.08rem; line-height:1.85; }
.note-slot__category,.note-slot__status { display:block; color:var(--pink); font-size:.95rem; letter-spacing:.04em; }
.note-slot__category { margin-bottom:.8rem; }
.note-slot__status { margin-top:1rem; color:var(--experience-muted); letter-spacing:0; }
.resume-dialog { width:min(94vw,66rem); height:min(92dvh,58rem); max-width:none; max-height:none; padding:0; color:var(--ink); background:var(--paper-light); border:0; border-radius:1.2rem; box-shadow:0 1.5rem 5rem rgba(0,0,0,.35); overflow:hidden; }
.resume-dialog::backdrop { background:rgba(7,11,27,.82); }
.resume-dialog__toolbar { display:flex; justify-content:space-between; align-items:center; gap:1rem; min-height:4.5rem; padding:.8rem 1.25rem; background:#f0e4e8; border-bottom:1px solid rgba(32,40,64,.12); }
.resume-dialog__toolbar strong { font-size:1.05rem; letter-spacing:-.02em; }
.resume-dialog__toolbar > div { display:flex; align-items:center; gap:.7rem; }
.resume-dialog__toolbar a,.resume-dialog__toolbar button { padding:.65rem 1rem; color:var(--navy); background:var(--paper-light); border:1px solid rgba(32,40,64,.18); border-radius:999px; font:inherit; font-size:.92rem; font-weight:750; text-decoration:none; cursor:pointer; transition:background 160ms ease,transform 160ms ease; }
.resume-dialog__toolbar a { background:var(--pink); border-color:var(--pink); }
.resume-dialog__toolbar a:hover,.resume-dialog__toolbar button:hover { background:#fff; transform:translateY(-1px); }
.resume-dialog__preview { height:calc(100% - 4.5rem); padding:1.5rem; overflow:auto; background:#e7e9ef; text-align:center; }
.resume-dialog__preview img { display:block; width:min(100%,52rem); height:auto; margin-inline:auto; box-shadow:0 .8rem 2.5rem rgba(24,32,55,.18); }
@media (max-width:1000px) {
  .about-hero h1 { font-size:clamp(4rem,9vw,6rem); }
  .about-scene { min-height:24rem; height:32rem; }
  .traits-section,.profile-section,.notes-section { grid-template-columns:4fr 6fr; gap:6%; }
  .shelf-layout { gap:5%; }
  .shelf-item { grid-template-columns:.8fr 1fr; gap:1rem; }
}
@media (max-width:700px) {
  .about-hero { display:flex; flex-direction:column; gap:2rem; align-items:stretch; padding-block:2.5rem 3rem; min-height:0; }
  .about-hero h1 { font-size:clamp(3.5rem,16vw,5.5rem); }
  .about-hero h1 small { font-size:1.5rem; margin-top:.5rem; }
  .about-hero__greeting { margin-top:1.7rem; }
  .about-scene { width:min(100%,26rem); align-self:center; height:28rem; min-height:0; }
  .about-scene__camera { left:-2%; width:40%; }
  .about-scene__slogan { top:2%; left:0; font-size:.8rem; }
  .profile-section,.traits-section,.notes-section { display:block; }
  .profile-section__body { padding-top:2.3rem; }
  .traits-section__heading { position:static; }
  .story-progress { display:none; }
  .story-anchors { display:flex; flex-wrap:wrap; gap:.3rem 1.3rem; margin:1.4rem 0 2.5rem; }
  .story-anchors a { font-size:.95rem; }
  .trait-story-list { gap:2rem; }
  .trait-story { padding:2rem 1.6rem; }
  .trait-story--2,.trait-story--3,.trait-story--4 { margin:0; }
  .profile-section { min-height:100svh; padding-block:4rem; }
  .resume-dialog__toolbar strong { font-size:.85rem; }
  .ticket-list { grid-template-columns:1fr; gap:3rem; max-width:25rem; margin-inline:auto; }
  .ticket:nth-child(n) { padding-top:0; }
  .shelf-layout { grid-template-columns:1fr; gap:3rem; margin-top:2.5rem; }
  .shelf-layout > section:nth-child(2) { padding-top:0; }
  .shelf-item { grid-template-columns:minmax(7rem,.7fr) 1fr; gap:1.5rem; }
  .notes-list { padding-top:1.5rem; }
}