/* A small personal artifact, rather than a portrait hero. Native details works
   with a pointer, touch, keyboard, and without JavaScript. */
.personal-record{max-width:650px;margin:12px 0 48px auto;border:1px solid #e2e7df;background:#fdfefa;box-shadow:0 15px 35px -30px #334c3c55;position:relative}
.personal-record:after{content:"";position:absolute;inset:5px -5px -5px 6px;border:1px solid #edf0e8;z-index:-1;transform:rotate(.5deg);pointer-events:none}
.personal-record summary{list-style:none;display:flex;align-items:center;gap:25px;min-height:145px;padding:24px 30px;cursor:pointer}
.personal-record summary::-webkit-details-marker{display:none}
.personal-record summary:focus-visible{outline:2px solid var(--teal);outline-offset:5px}
.record-preview{flex:0 0 76px;height:90px;overflow:hidden;transform:rotate(-3deg);border:4px solid white;box-shadow:0 3px 9px #263b2b16;transition:transform .6s}
.record-preview img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 24%;filter:grayscale(1)}
.personal-record summary:hover .record-preview{transform:rotate(0)}
.record-invitation{display:flex;flex-direction:column;gap:10px}.record-label{font:400 9px/1.6 Manrope,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#7e887a}
.record-title{font:italic 28px/1.2 Georgia,serif;letter-spacing:-.025em;color:var(--ink)}
.record-action{font:400 10px/1.6 Manrope,Arial,sans-serif;color:#65755f;display:flex;align-items:center;gap:4px}.record-close-label{display:none}.personal-record[open] .record-close-label{display:inline}.personal-record[open] .record-open-label{display:none}
.record-fold{display:inline-block;width:9px;height:11px;margin-left:6px;border:1px solid #168f9877;transform:skewY(-12deg);transition:transform .5s}.personal-record[open] .record-fold{transform:skewY(12deg)}
.record-route{margin-left:auto;text-align:right;font:italic 12px/1.5 Georgia,serif;color:#87917f}.record-route>span{color:#168f9877}
.record-interior{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:34px;padding:5px 30px 30px;align-items:center}
.record-portrait{margin:0;transform:rotate(-1.4deg);padding:8px 8px 13px;background:white;box-shadow:0 4px 13px #24352912}.record-portrait img{display:block;width:100%;height:270px;object-fit:cover;object-position:center 25%;filter:grayscale(1)}.record-portrait figcaption{font:italic 13px/1.5 Georgia,serif;margin:9px 4px 0;color:#8b9385}
.record-details{border-left:1px solid #e5eae1;padding-left:28px}.record-details h2{font:italic 31px/1.2 Georgia,serif;margin:12px 0 24px;letter-spacing:-.025em}.record-details dl{margin:0}.record-details dl>div{margin:0 0 18px}.record-details dt{font:400 9px/1.5 Manrope,Arial,sans-serif;color:#909987;margin-bottom:4px}.record-details dd{font:400 11px/1.7 Manrope,Arial,sans-serif;margin:0;color:#4e5d47}.record-details>p{font:italic 15px/1.6 Georgia,serif;color:#85917c;margin:23px 0 0}
@media(max-width:600px){.personal-record{margin-bottom:35px}.personal-record summary{padding:20px;gap:18px}.record-title{font-size:24px}.record-route{display:none}.record-interior{gap:20px;padding:0 20px 25px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.record-portrait{padding:5px 5px 10px}.record-portrait img{height:220px}.record-details{padding-left:17px}.record-details h2{font-size:25px}.record-details dd{font-size:10px}}
@media(max-width:360px){.record-interior{grid-template-columns:1fr}.record-portrait{max-width:220px;justify-self:center}.record-details{border-left:0;border-top:1px solid #e5eae1;padding:20px 0 0}.record-details dl{display:flex;flex-wrap:wrap;gap:10px 20px}.record-details dl>div{margin:0}.record-preview{flex-basis:60px;height:75px}.record-title{font-size:21px}}
@media(prefers-reduced-motion:reduce){.record-preview,.record-fold{transition:none}}

/* The introduction and record form a single opening, above the role facts.
   Opening the record increases the row height and keeps subsequent copy clear. */
.about-opening{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.03fr);gap:clamp(28px,4vw,52px);align-items:start;padding-top:22px;margin-bottom:44px}
.about-opening .spread-heading{padding:0;max-width:none}.about-opening .spread-heading h1{font-size:clamp(45px,5.4vw,68px)}.about-opening .spread-heading>p{font-size:clamp(22px,2.3vw,27px);max-width:440px;margin-top:24px}.about-opening .spread-mark{top:14px}
.about-opening .personal-record{width:100%;max-width:none;margin:4px 0 0;isolation:isolate}.about-opening .personal-record summary{gap:18px;padding:22px;min-height:158px}.about-opening .record-title{font-size:26px}.about-opening .record-interior{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;padding:5px 22px 26px}.about-opening .record-portrait img{height:245px}.about-opening .record-details{padding-left:20px}.about-opening .record-details h2{font-size:29px}
@media(min-width:981px) and (max-width:1180px){.about-opening .record-route{display:none}}
@media(max-width:980px){.about-opening{grid-template-columns:1fr;gap:30px;padding-top:15px;margin-bottom:36px}.about-opening .spread-heading>p{max-width:590px}.about-opening .personal-record{max-width:650px;justify-self:end;margin:0}.about-opening .record-interior{grid-template-columns:minmax(0,220px) minmax(0,1fr)}}
@media(max-width:600px){.about-opening{gap:26px}.about-opening .personal-record summary{padding:20px;gap:18px;min-height:140px}.about-opening .record-title{font-size:24px}.about-opening .record-interior{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;padding:0 20px 25px}.about-opening .record-portrait img{height:220px}.about-opening .record-details{padding-left:17px}.about-opening .record-details h2{font-size:25px}}
@media(max-width:360px){.about-opening .record-interior{grid-template-columns:1fr}.about-opening .record-details{padding:20px 0 0}.about-opening .record-title{font-size:21px}}
