/* Contact 304: a conversation, with recognisable routes and quiet reading. */
body[data-page=contact]{margin:0;background:var(--cf-night);color:var(--cf-ink);font:400 16px/1.6 var(--cf-body);font-synthesis:none}
body[data-page=contact] #page{position:relative;background:var(--cf-night);isolation:isolate}
body[data-page=contact] #page *{box-sizing:border-box}
body[data-page=contact] #page :is(h1,h2,h3,p){margin-top:0}
body[data-page=contact] #page :is(a,button){touch-action:manipulation}
body[data-page=contact] #page :is(a,button):focus-visible{outline:2px solid var(--cf-light);outline-offset:6px}
body[data-page=contact] #page a{color:inherit;text-decoration:none}
.contact-rail{padding-inline:max(var(--cf-gutter),calc((100vw - 1800px)/2),env(safe-area-inset-left,0px),env(safe-area-inset-right,0px))}
.contact-label{font:400 10px/1.7 var(--cf-mono);letter-spacing:.05em;color:var(--cf-label)}
body[data-page=contact] #page :is(h1,h2){font:500 clamp(48px,5.3vw,90px)/1.08 var(--cf-display);text-transform:uppercase;letter-spacing:-.02em}
body[data-page=contact] #page em{font-style:normal;color:var(--cf-light)}
.contact-hero{display:grid;grid-template-columns:1.02fr 1fr;gap:28px 4%;align-items:center;min-height:min(100svh,1100px);padding-top:calc(var(--shell-height) + clamp(50px,5vw,92px));padding-bottom:26px;overflow:clip;background:radial-gradient(ellipse at 78% 40%,#10374c55,transparent 55%)}
.contact-hero-heading{position:relative;z-index:2;translate:var(--hero-slide,0px) 0;opacity:calc(1 - var(--hero-depart,0)*.25)}
.contact-hero-heading>.contact-label{display:block;margin-bottom:30px}
body[data-page=contact] #page h1{font-size:clamp(66px,6.2vw,110px);margin-bottom:27px;max-width:830px}
.contact-introduction{color:var(--cf-muted);font-size:clamp(17px,1.25vw,21px);max-width:43ch;margin-bottom:28px;line-height:1.65}
body[data-page=contact] #page .contact-primary{display:inline-flex;align-items:center;justify-content:space-between;gap:45px;min-height:56px;padding:14px 26px;background:var(--cf-frost);color:#132333;border-radius:999px;font-weight:500}
.contact-primary>span{font-size:28px;line-height:1}
body[data-page=contact] #page .contact-primary:hover{background:var(--cf-light)}
body[data-page=contact] #page .contact-reassurance{font-size:12px;color:var(--cf-muted);max-width:36ch;margin:14px 0 17px}
.contact-client-shortcut{display:inline-flex;align-items:center;gap:24px;min-height:44px;font-size:13px;border-bottom:1px solid var(--cf-line)}
.contact-client-shortcut>span{color:var(--cf-light);font-size:20px}
.contact-hero-base{grid-column:1/-1;display:flex;justify-content:space-between;gap:20px;align-items:center;border-top:1px solid var(--cf-line);padding-top:18px;margin-top:10px}
.contact-text-link{display:inline-flex;align-items:center;gap:26px;min-height:44px;border-bottom:1px solid #55718a80;font-size:14px;padding:8px 0}
.contact-text-link>span{font-size:23px;line-height:1;color:var(--cf-light)}
body[data-page=contact] #page :is(.contact-text-link,.contact-client-shortcut):hover{color:var(--cf-light);border-color:var(--cf-light)}
/* Decorative conversation panes, not interactive controls. */
.contact-art{position:relative;aspect-ratio:800/730;min-width:0;perspective:1500px;container-type:inline-size;transform:translateY(calc(var(--contact-depth,0)*-20px))}
.contact-art:before{content:'';position:absolute;inset:12% 0 0;background:radial-gradient(ellipse at 50% 64%,#019edb24,transparent 62%);pointer-events:none}
.contact-art-lines{position:absolute;inset:0;width:100%;height:100%;stroke:#49789180;stroke-width:1}
.contact-trace{stroke:var(--cf-light);stroke-width:1.7;stroke-dasharray:1;stroke-dashoffset:calc((1 - var(--contact-depth,0))*.45);filter:drop-shadow(0 0 6px #019edb70)}
.contact-trace-second{stroke:var(--cf-service-connect,#3ed6c4)}
.contact-pane{position:absolute;box-shadow:10px 18px 30px #0003;transform-origin:center;clip-path:polygon(0 0,94% 0,100% 6%,100% 85%,90% 85%,90% 100%,73% 85%,0 85%)}
.contact-pane-back{left:8%;top:12%;width:71%;height:66%;padding:7%;background:linear-gradient(135deg,#19303ee8,#0c1723);border:1px solid #638398;transform:translate(calc(var(--contact-depth,0)*-12px),calc(var(--contact-depth,0)*-18px)) rotateY(10deg) rotateZ(-8deg);color:var(--cf-ink)}
.contact-art-label{display:block;font:400 max(8px,1.6cqw)/1.5 var(--cf-mono);letter-spacing:.04em}
.contact-pane-back strong{display:block;margin:12% 0 8%;font:500 5.5cqw/1.2 var(--cf-body);letter-spacing:-.04em}
.contact-reply-lines{display:grid;gap:9px;width:55%;margin-top:10%}.contact-reply-lines i{height:1px;background:#6b8ca5}.contact-reply-lines i:last-child{width:70%}
.contact-art-signoff{position:absolute;bottom:22%;font:400 1.35cqw var(--cf-mono);color:var(--cf-muted)}
.contact-pane-edge{left:28%;top:29%;width:65%;height:65%;background:#6d94a9;transform:translate(7px,8px) rotateY(-13deg) rotateZ(6deg)}
.contact-pane-front{left:27%;top:28%;width:65%;height:65%;padding:6.8%;background:linear-gradient(135deg,#f1f6fa,#d3e3ec);color:#132c3f;transform:translate(calc(var(--contact-depth,0)*12px),calc(var(--contact-depth,0)*18px)) rotateY(calc(-13deg + var(--contact-depth,0)*4deg)) rotateZ(6deg)}
.contact-pane-front:before{content:'';position:absolute;inset:8px 8px 17%;border:1px solid #839cab;pointer-events:none;z-index:2}
.contact-pane-front:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at var(--optic-x,50%) var(--optic-y,50%),#fff8,transparent 60%);opacity:calc(var(--optic-hover,0)*.4);pointer-events:none}
.contact-pane-front .contact-art-label{color:#3d5b6e}
.contact-pane-front strong{display:block;position:relative;z-index:1;font:500 6.4cqw/1.17 var(--cf-body);letter-spacing:-.045em;margin:13% 0 0}
body[data-page=contact] #page .contact-pane-front em{color:#006f98}
.contact-art-bottom{position:absolute;left:10.5%;right:11%;bottom:22%;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#34566d;font:400 1.35cqw/1.6 var(--cf-mono)}
.contact-art-bottom img{display:block;width:15%;height:auto}
.contact-routes{display:grid;grid-template-columns:1fr 1fr;gap:7%;padding-block:clamp(65px,6vw,105px);border-top:1px solid var(--cf-line)}
.contact-route{min-width:0;position:relative;scroll-margin-top:calc(var(--shell-height) + 28px)}
.contact-route:before,.contact-next:before,.contact-location:before{content:'';position:absolute;top:0;left:0;width:70px;height:2px;background:var(--cf-light);scale:var(--seam-progress,1) 1;transform-origin:left;pointer-events:none}
.contact-route>.contact-label{display:block;margin:20px 0 26px}
body[data-page=contact] #page .contact-route h2{font-size:clamp(42px,4vw,66px);margin-bottom:24px}
.contact-route>p{max-width:46ch;color:var(--cf-muted);font-size:17px;line-height:1.7;margin-bottom:30px}
body[data-page=contact] #page .contact-phone{display:block;font-size:clamp(21px,2vw,33px);font-weight:500;padding:18px 0;border-top:1px solid var(--cf-line);border-bottom:1px solid var(--cf-line);white-space:nowrap;letter-spacing:-.025em}
.contact-phone>.contact-label{display:block;margin-bottom:9px;letter-spacing:.05em}
.contact-phone-arrow{float:right;color:var(--cf-light);padding-left:10px}
.contact-email-option{display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;margin-top:18px}
.contact-email-option .email-contact{font-size:15px}
.contact-client{padding:0 0 0 8%;border-left:1px solid var(--cf-line);--cf-light:var(--cf-service-reliability,#f1c478)}
.contact-client:before{left:8%;background:var(--cf-light)}
body[data-page=contact] #page .contact-support{display:flex;justify-content:space-between;align-items:center;gap:30px;min-height:58px;padding:13px 22px;border:1px solid #9a7946;background:#332b21;color:#f1c478;font-weight:500;margin:0 0 17px}
.contact-support>span{font-size:28px}.contact-support:hover{background:#443a29!important}
.contact-client-note{font-size:13px!important;margin-top:20px!important;max-width:42ch!important}
.contact-next,.contact-location{position:relative;border-top:1px solid var(--cf-line);padding-block:clamp(60px,6vw,105px);display:grid;grid-template-columns:1fr 1fr;gap:7%}
.contact-next:before,.contact-location:before{left:var(--cf-gutter)}
.contact-section-heading .contact-label,.contact-location .contact-label{display:block;margin-bottom:26px}
.contact-next h2,.contact-location h2{margin-bottom:0}
.contact-steps{margin:0;padding:0;list-style:none}
.contact-steps li{display:grid;grid-template-columns:40px 1fr;gap:18px;padding:25px 0;border-top:1px solid var(--cf-line)}
.contact-steps li:first-child{padding-top:0;border:0}
.contact-step-number{font:400 11px/1.7 var(--cf-mono);color:var(--cf-light);padding-top:5px}
.contact-steps h3{font:500 clamp(21px,1.6vw,27px)/1.3 var(--cf-body);margin:0 0 12px;letter-spacing:-.02em}
.contact-steps p{color:var(--cf-muted);max-width:43ch;line-height:1.7;margin-bottom:0}
.contact-location{background:radial-gradient(ellipse at 2% 95%,#019edb11,transparent 55%);scroll-margin-top:var(--shell-height)}
.contact-location-detail{align-self:center}.contact-location-detail>p{font-size:clamp(18px,1.6vw,24px);max-width:32ch;margin-bottom:22px}
.contact-location address{font-style:normal;line-height:1.85;color:var(--cf-muted);margin-bottom:22px}
@media(max-width:1050px){.contact-hero{gap:35px 2%}.contact-hero h1{font-size:clamp(58px,6.5vw,90px)!important}.contact-routes,.contact-next,.contact-location{gap:6%}.contact-client{padding-left:7%}.contact-client:before{left:7%}.contact-phone{font-size:24px!important}}
@media(max-width:800px){.contact-hero{grid-template-columns:1fr;min-height:0;padding-top:calc(var(--shell-height) + 50px);gap:30px}.contact-hero-heading{translate:none;opacity:1}.contact-hero h1{font-size:clamp(58px,9vw,82px)!important}.contact-introduction{max-width:43ch}.contact-art{width:min(100%,600px);justify-self:center;margin-top:-10px}.contact-hero-base{margin-top:0;flex-wrap:wrap;gap:8px}.contact-routes,.contact-next,.contact-location{grid-template-columns:1fr;gap:50px}.contact-route{padding:0;border:0}.contact-client:before{left:0}.contact-route h2{font-size:clamp(42px,7vw,60px)!important}.contact-route>p{font-size:16px}.contact-client-note{margin-bottom:0}.contact-steps{max-width:650px}.contact-location-detail>p{font-size:20px}.contact-phone{font-size:clamp(21px,4vw,30px)!important}.contact-location h2,.contact-next h2{font-size:clamp(48px,8vw,68px)!important}}
@media(max-width:420px){.contact-hero{padding-top:calc(var(--shell-height) + 36px)}.contact-hero-heading>.contact-label{font-size:9px;margin-bottom:22px}.contact-hero h1{font-size:clamp(52px,14vw,60px)!important}.contact-introduction{font-size:16px}.contact-art{margin-block:8px 0}.contact-art-label{font-size:8px}.contact-pane-front{padding:7% 6%}.contact-art-bottom,.contact-art-signoff{font-size:6px}.contact-hero-base>.contact-label{font-size:9px}.contact-phone-arrow{padding-left:3px}.contact-steps li{grid-template-columns:25px 1fr;gap:12px}.contact-label{font-size:9px}.contact-primary{font-size:15px}.contact-next,.contact-location,.contact-routes{padding-block:56px}}
@media(prefers-reduced-motion:reduce),(forced-colors:active){.contact-art,.contact-pane,.contact-hero-heading{transform:none;translate:none;opacity:1}.contact-trace{stroke-dashoffset:0}.contact-pane-front:after{display:none}}
html[data-motion=off] :is(.contact-art,.contact-pane,.contact-hero-heading){translate:none;opacity:1}
html[data-motion=off] .contact-art{transform:none}html[data-motion=off] .contact-pane-front:after{display:none}
@media(forced-colors:active){.contact-pane-front,.contact-pane-back{background:Canvas;color:CanvasText;border:1px solid CanvasText}.contact-art-lines,.contact-pane-edge{display:none}}
