body.contact-page { overflow:auto; min-height:100svh; }
.contact-page a:focus-visible,.contact-page summary:focus-visible { outline:2px solid var(--paper); outline-offset:4px; }
.contact-skip { position:absolute; top:-8rem; left:1rem; z-index:10; background:var(--paper); color:var(--ink); padding:1rem; }
.contact-skip:focus { top:1rem; }
.contact-header { display:flex; align-items:center; gap:1rem; padding: .5rem max(1.25rem,env(safe-area-inset-right)) .5rem max(1.25rem,env(safe-area-inset-left)); border-bottom:1px solid var(--rule); }
.contact-header .brand { font-size:1.1rem; min-width:44px; min-height:44px; display:flex; align-items:center; }
.contact-header>span { flex:1; color:var(--muted); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; }
.contact-header>a:last-child { display:flex; align-items:center; min-height:44px; font-size:.8rem; }
.contact-landing { display:grid; grid-template-columns:1fr 1fr; min-height:calc(100svh - 65px); }
.contact-portrait { position:relative; min-height:600px; background:#252825; }
.contact-portrait img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.contact-portrait::after { content:''; position:absolute; inset:60% 0 0; background:linear-gradient(transparent,rgba(0,0,0,.8)); pointer-events:none; }
.contact-portrait p { position:absolute; z-index:1; bottom:1.5rem; left:1.5rem; margin:0; font-size:.75rem; letter-spacing:.1em; text-transform:uppercase; }
.contact-card { min-width:0; padding:clamp(1.5rem,5vw,5rem); padding-bottom:max(2rem,env(safe-area-inset-bottom)); display:flex; flex-direction:column; justify-content:center; border-left:1px solid var(--rule); }
.contact-label { color:var(--muted); font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; margin:0 0 1.5rem; }
.contact-card h1 { font:400 clamp(3.5rem,7vw,7rem)/1 var(--serif); letter-spacing:-.06em; margin:0; }
.contact-description { color:var(--muted); line-height:1.65; max-width:36rem; margin:1.5rem 0; }
.contact-save { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:1rem; background:var(--paper); color:var(--ink); padding:1.1rem; margin:.5rem 0; border:1px solid var(--paper); }
.contact-save>span:first-child { font-size:1.8rem; }
.contact-save strong,.contact-save small { display:block; }
.contact-save small { margin-top:.4rem; font-size:.8rem; line-height:1.4; }
.contact-save:hover { background:#d7d9d1; }
.contact-help { font-size:.85rem; color:var(--muted); line-height:1.5; margin:0 0 1.5rem; }
.contact-help summary { cursor:pointer; min-height:44px; padding:.75rem 0; }
.contact-download { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; color:var(--paper); }
#contact-status { border-left:3px solid var(--paper); padding:.75rem; line-height:1.5; }
.contact-details { margin:0; border-top:1px solid var(--rule); }
.contact-details>div { display:grid; grid-template-columns:6rem minmax(0,1fr); align-items:center; gap:1rem; padding:.6rem 0; border-bottom:1px solid var(--rule); }
.contact-details dt { font-size:.75rem; color:var(--muted); }
.contact-details dd { margin:0; line-height:1.5; overflow-wrap:anywhere; }
.contact-details a { display:inline-flex; align-items:center; min-height:44px; }
.contact-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.5rem; }
.contact-actions a { border:1px solid var(--rule); min-height:44px; padding:.8rem 1rem; }
.contact-actions a:hover { border-color:var(--paper); }
.contact-footer { display:flex; flex-wrap:wrap; gap:.75rem; justify-content:space-between; color:var(--muted); font-size:.7rem; margin-top:2.5rem; line-height:1.5; }
@media(max-width:760px) { .contact-landing { grid-template-columns:1fr; } .contact-portrait { min-height:0; height:48svh; max-height:620px; } .contact-card { border-left:0; padding:1.5rem max(1.25rem,env(safe-area-inset-right)) max(2rem,env(safe-area-inset-bottom)) max(1.25rem,env(safe-area-inset-left)); } .contact-header>span { font-size:.6rem; } .contact-header { gap:.75rem; } }
@media(max-width:360px) { .contact-header>span { display:none; } .contact-header { justify-content:space-between; } .contact-details>div { grid-template-columns:1fr; gap:.2rem; } }