:root{--collage-opacity:.18;--contact-field-wash:color-mix(in srgb,var(--paper) 94%,transparent)}
body[data-page="about"]{position:relative;isolation:isolate;overflow-x:clip}
body[data-page="about"] .page-header{background:color-mix(in srgb,var(--paper) 95%,transparent)}
body[data-page="about"] .page-content{position:relative;z-index:1;padding-top:56px;padding-bottom:80px}
body[data-page="about"] .site-footer{position:relative;z-index:1}
.about-collage{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;user-select:none}
.about-collage img{position:absolute;display:block;height:auto;opacity:var(--collage-opacity);filter:saturate(.6);object-fit:cover;max-width:none}
.collage-early-pep{width:50%;left:-12%;top:9%;transform:rotate(-6deg)}
.collage-youth{width:49%;left:65%;top:20%;transform:rotate(6deg)}
.collage-reception{width:50%;left:-9%;top:28%;transform:rotate(-5deg)}
.collage-leadership{width:52%;left:54%;top:39%;transform:rotate(3deg)}
.about-collage .collage-lectern{width:39%;max-width:480px;left:-12%;top:49%;transform:rotate(-7deg)}
.collage-candid{width:52%;left:36%;top:56%;transform:rotate(-4deg)}
.collage-recent-pep{width:48%;left:70%;top:82%;transform:rotate(5deg)}
.collage-early-leadership{width:48%;left:-5%;top:68%;transform:rotate(4deg)}
.about-collage .collage-outdoor-press{width:40%;max-width:424px;left:54%;top:69%;transform:rotate(-6deg)}
.about-collage .collage-awbd{width:40%;max-width:480px;left:-11%;top:83%;transform:rotate(6deg)}
.about-opening>div{background:transparent;padding:4px 0}
body[data-page="about"] .about-opening p{max-width:52ch}
body[data-page="about"] .project-links{margin-top:64px;background:transparent;padding:28px 0 0}
.about-presence{max-width:54ch;margin:48px 0 0 10%;background:transparent}
.about-presence h2{font-size:40px;line-height:1.1;margin-bottom:16px}
.about-presence p{font-size:19px;line-height:1.6}
.about-contact{display:grid;grid-template-columns:1fr 1.6fr;gap:64px;margin-top:64px;padding-top:36px;border-top:1px solid var(--stone);background:transparent}
body[data-page="about"] .page-content{color:var(--ink)}
body[data-page="about"] .page-content :is(p:not([data-state="error"]),figcaption,label span){color:var(--ink)}
body[data-page="about"] .page-content :is(.primary-link,.text-link){color:var(--ink);border-color:var(--ink)}
body[data-page="about"] .page-content :is(.primary-link,.text-link):hover{border-color:var(--bayou)}
.about-contact h2{font-size:clamp(44px,4vw,56px);line-height:1.08;margin-bottom:20px;letter-spacing:-.025em}
.contact-introduction p{max-width:25ch;font-size:20px;line-height:1.55}
.contact-introduction .text-link{font-size:17px;margin-top:24px}
.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.about-contact label{display:block;font-family:var(--sans);font-size:16px;line-height:1.5;font-weight:500}
.about-contact label span{color:var(--secondary);font-weight:400}
.about-contact input,.about-contact select,.about-contact textarea{margin-top:8px;background:var(--contact-field-wash);border-color:var(--control-border)}
.contact-message{margin-top:24px}
.about-contact textarea{display:block;width:100%;resize:vertical;min-height:140px;max-height:500px;padding:12px;font-family:var(--sans);font-size:18px;line-height:1.5;color:var(--ink);border:1px solid var(--control-border);border-radius:0;transition:border-color 320ms ease}
.about-contact :is(input,select,textarea):hover{border-color:var(--bayou)}
.about-contact textarea:focus-visible{outline:2px solid var(--live-blue);outline-offset:3px}
.contact-submit{display:flex;align-items:flex-start;gap:24px;margin-top:24px}
.contact-submit button{flex-shrink:0}
.contact-submit button:disabled{opacity:.6;cursor:wait}
.contact-submit p{font-size:16px;line-height:1.5;max-width:36ch;padding-top:7px;color:var(--ink)}
.contact-submit p[data-state="error"]{color:var(--rust)}
.contact-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
@media(max-width:760px){
  body[data-page="about"] .page-content{padding-top:40px;padding-bottom:48px}
  .collage-early-pep{width:90%;left:-48%;top:16%}
  .collage-youth{width:95%;left:52%;top:27%}
  .collage-reception{width:110%;left:-37%;top:35%}
  .collage-leadership{width:114%;left:39%;top:44%}
  .about-collage .collage-lectern{width:88%;left:-30%;top:55%}
  .collage-candid{width:110%;left:30%;top:62%}
  .collage-recent-pep{width:102%;left:48%;top:91%}
  .collage-early-leadership{width:110%;left:-20%;top:70%}
  .about-collage .collage-outdoor-press{width:89%;left:50%;top:76%}
  .about-collage .collage-awbd{width:102%;left:-39%;top:84%}
  body[data-page="about"] .project-links{margin-top:40px;padding-top:24px}
  .about-presence{margin:40px 0 0}
  .about-presence h2{font-size:36px}
  .about-presence p{font-size:18px}
  .about-contact{display:block;margin-top:40px;padding-top:28px}
  .about-contact h2{font-size:44px}
  .contact-introduction p{max-width:32ch;font-size:19px}
  .about-contact form{margin-top:28px}
  .contact-fields{grid-template-columns:1fr;gap:20px}
  .contact-message{margin-top:20px}
  .contact-submit{display:block}
  .contact-submit p{max-width:none;padding-top:12px}
}

body[data-page="about"] .about-opening p.about-book{display:flow-root}.about-book-cover{float:left;width:76px;margin:6px 20px 4px 0;transition:transform 300ms ease}.about-book-cover img{display:block;width:100%;height:auto;box-shadow:0 10px 24px -12px var(--shadow)}.about-book-cover:is(:hover,:focus-visible){transform:translateY(-2px)}@media(max-width:760px){.about-book-cover{width:64px;margin-right:16px}}@media(prefers-reduced-motion:reduce){.about-book-cover{transition:none}.about-book-cover:is(:hover,:focus-visible){transform:none}}
