/* An inhabited wreck, with a quiet reading surface and real archive keepsakes. */
#about.cabin {
    padding:clamp(218px,17vw,245px) 0 55px; isolation:isolate;
    background:radial-gradient(ellipse at 50% 12%,#30134580,transparent 50%);
}
.cabin-scenery { position:absolute; top:0; left:50%; width:min(1440px,100%); transform:translateX(-50%); z-index:-1; pointer-events:none; overflow:clip }
.cabin-scenery img { position:relative; left:50%; transform:translateX(-50%); width:100%; min-width:1280px; height:auto; mask:url('/assets/illustrated/cabin-shell-mask-v1.svg') center/100% 100% no-repeat }
#about .cabin-interior { width:min(1110px,calc(100% - 140px)); position:relative }
#about .cabin-heading { text-align:center; position:relative; margin:0 0 20px }
.cabin-eyebrow { color:#d6b687; font-size:21px; letter-spacing:2px; text-transform:uppercase; margin-bottom:8px }
#about .section-title { font-size:clamp(46px,4.8vw,68px); line-height:1.1; margin:0 auto; color:#f4e4ff; text-shadow:2px 4px 0 #3c175c }
#about .cabin-stories {
    display:grid; grid-template-columns:1.05fr 1fr; grid-template-areas:'beast intro' 'beast origin' 'keepsakes keepsakes';
    gap:16px 30px; padding:0; position:relative;
}
.cabin-welcome { grid-area:intro; align-self:end; padding:5px 12px 0; max-width:440px }
#about .section-intro { text-align:left; margin:0; padding:0; font-size:25px; line-height:1.45; max-width:none; color:#e5d3ec }
#about .section-intro strong { color:#f4deff }
.cabin-mascot { grid-area:beast; align-self:end; position:relative; z-index:1; margin:0 -15px 0 -25px }
.cabin-mascot > img { width:100%; max-width:510px; height:auto; mask:url('/assets/illustrated/cabin-desk-mask-v1.svg') center/100% 100% no-repeat }
#about .about-card { padding:0; margin:0; max-width:none; min-width:0; background:none; position:relative }
#about .about-card::after { content:none }
#about .about-card h3 { font-size:34px; margin:0 0 12px; line-height:1.12; color:#f0ddff; text-wrap:balance }
#about .about-card p { font-size:23px; line-height:1.45; color:#e1cce6; margin:0 }
#about .cabin-log {
    grid-area:origin; grid-column:auto; width:100%; max-width:450px; min-height:0;
    padding:34px 36px 37px 100px; isolation:isolate;
}
.cabin-log::before { content:''; position:absolute; inset:0; background:url('/assets/illustrated/cabin-logbook-v1.svg') center/100% 100% no-repeat; z-index:-1; pointer-events:none }
.cabin-log-heading { display:flex; align-items:center; gap:15px; margin-bottom:13px }
#about .origin-portrait { position:static; flex:none; width:94px; height:94px; float:none; padding:0; margin:0; background:none; transform:none; object-fit:contain }
.cabin-inscription { display:block; font-size:19px; line-height:1.3; color:#d3b28c; margin-bottom:7px }
#about .cabin-log h3 { font-size:33px; margin:0 }
.cabin-source { display:inline-block; margin-top:15px; padding-block:4px; color:#d8b6ff; font-size:20px; line-height:1.4; text-decoration-thickness:1px; text-underline-offset:4px }
.cabin-source span { display:inline-block; margin-left:5px }
.cabin-source:hover { color:#f2deff }
.cabin-keepsakes {
    grid-area:keepsakes; display:grid; grid-template-columns:1fr 1fr;
    gap:65px 65px; margin-top:110px; position:relative;
}
.cabin-keepsakes::before,.cabin-keepsakes::after {
    content:''; position:absolute; top:-90px; bottom:-100px; width:60px;
    background:url('/assets/illustrated/cabin-rib-v1.svg') center top/60px 1000px repeat-y;
    z-index:-1; pointer-events:none;
}
.cabin-keepsakes::before { left:-52px }
.cabin-keepsakes::after { right:-52px; transform:scaleX(-1) }
#about .cabin-keepsake {
    display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.05fr); gap:24px;
    align-items:center; padding:10px 8px 65px; isolation:isolate;
}
#about .cabin-keepsake::after {
    content:''; position:absolute; left:-20px; right:-20px; bottom:-8px;
    width:auto; height:90px; margin:0;
    background:url('/assets/illustrated/cabin-shelf-v1.svg') center/100% 100% no-repeat;
    opacity:1; z-index:-1; pointer-events:none;
}
.cabin-photo { position:relative; display:block; padding:11px; background:#bda384; outline:1px solid #3e253d; box-shadow:4px 5px 0 #1a0e25; transform:rotate(-3deg); align-self:center; margin:0 0 12px }
.cabin-photo > img:first-child { width:100%; height:auto; object-fit:contain }
.cabin-photo::before,.cabin-photo::after,.cabin-photo-corner::before,.cabin-photo-corner::after {
    content:''; position:absolute; width:40px; height:40px;
    background:url('/assets/illustrated/cabin-photo-corner-v1.svg') center/contain no-repeat; pointer-events:none;
}
.cabin-photo::before { top:-5px; left:-5px }
.cabin-photo::after { top:-5px; right:-5px; transform:rotate(90deg) }
.cabin-photo-corner::before { bottom:-5px; left:-5px; transform:rotate(-90deg) }
.cabin-photo-corner::after { bottom:-5px; right:-5px; transform:rotate(180deg) }
.cabin-photo:focus-visible { outline:3px solid #e9d5ff; outline-offset:7px }
.cabin-photo:hover { box-shadow:4px 5px 0 #7132f5 }
.cabin-advert .cabin-photo { transform:rotate(3deg) }
.cabin-community .cabin-photo { transform:rotate(2deg) }
.cabin-document { background:#99816a; transform:rotate(-2deg); border-top:8px solid #b6a086; border-bottom:8px solid #b6a086 }
.cabin-reel,.cabin-medallion { position:absolute; width:83px; height:auto; pointer-events:none; bottom:-32px; left:-24px; z-index:2 }
.cabin-medallion { left:auto; right:-25px; bottom:-39px; width:76px }
.cabin-keepsake-copy { padding-bottom:12px }
.cabin-departure { position:relative; text-align:center; padding:50px 0 0 }
.cabin-departure > p { font-size:27px; color:#e4cdef }
.cabin-departure .cabin-source { margin-top:2px }
#about .cabin-guide { position:absolute; right:0; top:-65px; margin:0 }
@media (max-width:1199px) {
    #about .cabin-interior { width:calc(100% - 100px) }
    #about .cabin-stories { grid-template-columns:1fr 1.1fr; column-gap:12px }
    #about .section-intro { font-size:23px }
    #about .cabin-log { padding:28px 29px 34px 82px }
    #about .origin-portrait { width:76px; height:76px }
    #about .cabin-log h3 { font-size:30px }
    #about .about-card p { font-size:22px }
    .cabin-keepsakes { gap:50px 35px; margin-top:85px }
    .cabin-keepsakes::before { left:-38px }
    .cabin-keepsakes::after { right:-38px }
    #about .cabin-keepsake { gap:18px; grid-template-columns:minmax(0,.85fr) minmax(0,1fr) }
    #about .about-card h3 { font-size:30px }
}
@media (max-width:900px) {
    #about .cabin-interior { width:calc(100% - 80px) }
    .cabin-keepsakes { gap:55px 25px }
    #about .cabin-keepsake { display:flex; flex-direction:column; align-items:stretch; gap:20px; padding:0 10px 65px }
    .cabin-photo { width:75%; max-width:205px; margin:0 auto 10px; align-self:auto }
    #about .cabin-keepsake h3 { font-size:31px }
    .cabin-keepsake-copy { padding:0 5px }
}
@media (max-width:760px) {
    #about.cabin { padding-top:165px; background:radial-gradient(ellipse at 50% 9%,#301345aa,transparent 65%) }
    .cabin-scenery { display:none }
    #about.cabin::before { content:''; position:absolute; top:0; left:0; width:100%; height:145px; background:url('/assets/illustrated/cabin-shell-768-v1.webp') center top/768px 512px no-repeat,url('/assets/illustrated/cabin-crest-v1.svg') center top/600px 150px no-repeat; mask-image:url('/assets/illustrated/cabin-shell-mask-v1.svg'),linear-gradient(#000 80%,transparent); mask-size:768px 512px,100% 100%; mask-position:center top; mask-repeat:no-repeat; mask-composite:intersect; pointer-events:none }
    #about .cabin-interior { width:calc(100% - 64px) }
    #about .cabin-heading { margin-bottom:24px }
    #about .cabin-guide { width:72px; height:72px; top:-120px; right:-2px }
    .cabin-eyebrow { font-size:17px; letter-spacing:1px }
    #about .section-title { font-size:clamp(43px,8.5vw,64px) }
    #about .cabin-stories { grid-template-columns:minmax(0,1fr); grid-template-areas:'intro' 'beast' 'origin' 'keepsakes'; gap:0 }
    #about .section-intro { font-size:23px; text-align:center; line-height:1.45 }
    .cabin-welcome { padding:0 4px; max-width:none }
    .cabin-mascot { width:min(480px,110%); margin:5px -5% -18px; justify-self:center }
    #about .cabin-log { width:100%; max-width:none; padding:28px 27px 37px 20% }
    #about .origin-portrait { width:86px; height:86px }
    .cabin-log-heading { gap:12px; margin-bottom:15px }
    #about .cabin-log h3 { font-size:31px }
    .cabin-inscription { font-size:18px }
    .cabin-keepsakes { grid-template-columns:minmax(0,1fr); gap:62px; margin-top:60px }
    .cabin-keepsakes::before { left:-30px; width:30px; background-size:30px 1000px }
    .cabin-keepsakes::after { right:-30px; width:30px; background-size:30px 1000px }
    #about .cabin-keepsake { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); align-items:center; gap:20px; padding:0 4px 65px }
    .cabin-photo { width:100%; max-width:230px; margin:0 auto 15px }
    .cabin-keepsake-copy { padding:0 }
    #about .cabin-keepsake h3 { font-size:30px }
    .cabin-source { font-size:20px }
    #about .cabin-keepsake::after { left:-12px; right:-12px; height:80px }
    .cabin-departure { padding-top:45px }
}
@media (max-width:520px) {
    #about .cabin-interior { width:calc(100% - 52px) }
    #about .section-intro { font-size:22px }
    #about .cabin-log { padding:28px 7% 32px 20% }
    #about .origin-portrait { width:72px; height:72px }
    #about .cabin-log h3 { font-size:29px }
    .cabin-log-heading .cabin-inscription { font-size:16px }
    #about .cabin-log p { font-size:22px }
    #about .cabin-keepsake { display:flex; gap:22px; padding:0 14px 65px }
    .cabin-photo { width:70%; max-width:215px }
    #about .cabin-keepsake h3 { font-size:32px }
    #about .cabin-keepsake p { font-size:23px }
    .cabin-keepsake-copy { padding-inline:3px }
    .cabin-keepsakes::before { left:-25px; width:30px }
    .cabin-keepsakes::after { right:-25px; width:30px }
}