/* Contact composition only. Header, navigation and footer use site.css unchanged. */
.contact-view{background:#0b0b0c;--contact-red:#e30613}
.contact-skip{position:fixed;left:16px;top:-100px;z-index:99;background:#fff;color:#111;padding:12px 18px}
.contact-skip:focus{top:12px}
.contact-stage{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:39% 61%;grid-template-rows:auto auto 1fr;min-height:max(820px,62vw);max-width:1740px;margin:0 auto;background:#111;color:#fff}
.contact-environment{position:absolute;z-index:-4;inset:0 0 0 36%}
.contact-environment img{width:100%;height:100%;object-fit:cover;object-position:38% 0;display:block}
.contact-shade{position:absolute;z-index:-2;inset:0;background:linear-gradient(90deg,#0b0b0c 0%,#0b0b0c 34%,rgba(11,11,12,.94) 38%,rgba(11,11,12,.12) 47%,transparent 55%)}
.contact-information{position:relative;z-index:5;grid-column:1;grid-row:1;width:97%;padding:clamp(32px,3.2vw,55px) 0 0 clamp(26px,3.1vw,54px)}
.contact-information h1{font-family:'Arial Black',Arial,Helvetica,sans-serif;font-size:clamp(54px,6.1vw,100px);font-weight:900;letter-spacing:-.055em;line-height:1;margin:0 0 22px;white-space:nowrap;-webkit-text-stroke:.65px currentColor}
.contact-intro{font-size:clamp(17px,1.45vw,24px);line-height:1.4;margin:0 0 25px;max-width:510px}
.contact-details{display:grid;gap:13px;margin:0 0 24px}
.contact-detail{display:flex;gap:clamp(13px,1.5vw,25px);align-items:center;min-width:0;font-size:clamp(18px,1.65vw,26px);line-height:1.25}
.contact-detail>div{min-width:0}
.contact-symbol{display:grid;place-items:center;flex-shrink:0;width:clamp(48px,4.3vw,70px);aspect-ratio:1;border-radius:50%;background:linear-gradient(140deg,#fb101e,#d0000d)}
.contact-symbol svg{width:48%;height:48%;fill:#fff}
.contact-symbol .contact-outline{fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.contact-detail a{color:inherit;text-decoration:none}
.contact-detail a:hover{text-decoration:underline;text-underline-offset:4px}
.contact-detail a:focus-visible,.contact-cta:focus-visible{outline:3px solid currentColor;outline-offset:5px}
.contact-phone-label{display:block;font-size:.64em;margin-bottom:3px;letter-spacing:.025em}
.contact-phone{white-space:nowrap}
.contact-email{font-size:clamp(15px,1.5vw,24px);overflow-wrap:anywhere}
.contact-detail address{font-style:normal}
.contact-person{font-weight:700}
.contact-person strong{display:block}
.contact-person-title{display:block;margin-top:4px;font-size:clamp(13px,1vw,17px);font-weight:400;line-height:1.4}
.contact-ctas{position:relative;z-index:5;grid-column:1;grid-row:2;align-self:start;display:grid;gap:16px;width:calc(97% - clamp(26px,3.1vw,54px));max-width:470px;margin:0 0 54px clamp(26px,3.1vw,54px)}
.contact-cta{box-sizing:border-box;display:flex;align-items:center;justify-content:flex-start;gap:clamp(13px,1.7vw,26px);height:clamp(64px,5.4vw,86px);padding:12px clamp(16px,1.7vw,27px);border:2px solid transparent;border-radius:4px;color:#fff;text-decoration:none;font-size:clamp(18px,1.95vw,30px);font-weight:700;line-height:1.15}
.contact-cta>span:not(.contact-linkedin-mark){white-space:nowrap}
.contact-demo{background:linear-gradient(120deg,#ed0816,#cc0010)}
.contact-demo>img{object-fit:contain;flex-shrink:0;width:clamp(34px,3.5vw,54px);height:clamp(34px,3.5vw,54px)}
.contact-linkedin{background:linear-gradient(110deg,#04476d,#02304f);border-color:#009ce1}
.contact-linkedin-mark{flex-shrink:0;display:grid;place-items:center;width:clamp(34px,3.5vw,54px);height:clamp(34px,3.5vw,54px);border-radius:3px;background:#087bb7;color:#fff;font-family:Arial,sans-serif;font-size:clamp(30px,3.1vw,47px);font-weight:800;letter-spacing:-.05em;line-height:1}
.contact-external{width:22px;height:22px;margin-left:auto;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.contact-cta:hover{filter:brightness(1.12)}
.contact-illustration{position:absolute;z-index:0;inset:0;pointer-events:none}
.contact-portrait{position:absolute;z-index:0;width:65%;right:0;bottom:16%;aspect-ratio:1.36;overflow:hidden}
.contact-portrait svg{display:block;width:100%;height:auto}
/* A raised counter masks the lower torso; the front edge grounds the scene. */
.contact-desktop{position:absolute;z-index:1;bottom:0;right:0;left:27%;height:20.5%;border-top:5px solid #6e3e23;background:repeating-linear-gradient(2deg,transparent 0 8px,#50271624 9px,transparent 11px 26px),linear-gradient(180deg,#b67b50,#aa683d 24%,#ca9261 55%,#885334);box-shadow:0 -5px 14px #0003}
.contact-desktop:before{content:'';position:absolute;left:0;right:0;bottom:0;height:23px;background:linear-gradient(#754126,#462714);border-top:3px solid #c68d60}
.contact-desktop:after{content:'';position:absolute;inset:-7px 0 0;background:linear-gradient(90deg,#0b0b0c,transparent 24%)}
.contact-props{position:absolute;z-index:2;right:0;bottom:3.5%;width:64%}
.contact-props>svg{display:block;width:100%;height:auto;overflow:visible}
.contact-prop-writing{font-family:Arial,Helvetica,sans-serif;font-size:29px;font-weight:700;letter-spacing:.5px;fill:#202020}
.contact-note-writing{font-family:'Kalam','Comic Sans MS',cursive;font-weight:700;font-size:25px;fill:#202020}
@media(min-width:1740px){.contact-stage{min-height:1080px}}
@media(min-width:801px) and (max-width:1100px){
 .contact-stage{grid-template-columns:43% 57%;min-height:820px}
 .contact-information{width:97%;padding-left:26px;padding-top:38px}
 .contact-information h1{font-size:clamp(51px,6.2vw,66px)}
 .contact-intro{font-size:17px}
 .contact-detail{font-size:19px;gap:12px}
 .contact-email{font-size:16px}
 .contact-symbol{width:48px}
 .contact-ctas{margin-left:26px;width:calc(97% - 26px)}
 .contact-cta{font-size:20px;padding:12px 15px;gap:13px;height:68px}
 .contact-external{width:17px}
 .contact-shade{background:linear-gradient(90deg,#0b0b0c 0 36%,#0b0b0cf5 41%,transparent 58%)}
 .contact-environment{left:40%}
 .contact-portrait{width:60%;right:0;bottom:16%;aspect-ratio:1.03}
 .contact-props{width:58%;right:0}
 .contact-desktop{left:34%;height:21%}
}
@media(max-width:800px){
 .contact-stage{display:grid;grid-template-columns:50% 50%;grid-template-rows:auto auto;min-height:0;max-width:800px;background:#f4f2ef;color:#0b0b0c}
 /* Zoom/crop the room to shelving level, not floor level behind the portrait. */
 .contact-environment{inset:0;z-index:-4;overflow:hidden}
 .contact-environment img{height:150%;object-position:50% 0}
 .contact-shade{background:linear-gradient(180deg,#fffdfb 0%,#fffdfbf7 35%,#fffdfbd9 48%,#fffdfa18 68%,transparent 80%)}
 .contact-information{grid-column:1/-1;grid-row:1;width:100%;padding:25px 5% 0}
 .contact-information h1{font-size:clamp(45px,9.8vw,76px);margin-bottom:13px;letter-spacing:-.055em}
 .contact-intro{font-size:clamp(16px,2.8vw,22px);max-width:530px;width:100%;margin:0 0 22px;line-height:1.4}
 .contact-details{gap:11px;margin-bottom:23px}
 .contact-detail{font-size:clamp(17px,3.1vw,24px);gap:14px;line-height:1.25}
 .contact-symbol{width:clamp(42px,7vw,57px)}
 .contact-phone-label{font-size:.7em;margin-bottom:2px}
 .contact-email{font-size:clamp(15px,2.9vw,23px)}
 /* Mobile actions have their own row so neither button can cover the thumbs-up. */
 .contact-ctas{grid-column:1/-1;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr));width:90%;max-width:none;gap:12px;margin:0 5%;align-self:start}
 .contact-cta{height:54px;gap:8px;padding:8px 9px;font-size:clamp(13px,3.6vw,22px)}
 .contact-cta>span:not(.contact-linkedin-mark){white-space:normal;min-width:0}
 .contact-demo>img,.contact-linkedin-mark{width:clamp(22px,6.5vw,40px);height:clamp(22px,6.5vw,40px)}
 .contact-linkedin-mark{font-size:clamp(21px,5.8vw,36px)}
 .contact-external{display:none}
 .contact-illustration{position:relative;inset:auto;grid-column:1/-1;grid-row:3;margin-top:12px;aspect-ratio:1.13;z-index:0;min-height:255px}
 .contact-portrait{width:74%;right:0;top:0;bottom:auto;aspect-ratio:1.08}
 .contact-desktop{left:0;height:34%;bottom:0;border-top-width:4px}
 .contact-desktop:after{background:none}
 .contact-desktop:before{height:22px}
 .contact-props{width:100%;right:0;bottom:9%}
}
@media(max-width:374px){
 .contact-information h1{font-size:43px}
 .contact-symbol{width:39px}
 .contact-detail{gap:11px}
 .contact-email{font-size:14px}
 .contact-cta{font-size:13px;gap:6px;padding:8px 6px;height:50px}
}
@media(prefers-reduced-motion:reduce){.contact-stage *{scroll-behavior:auto}}