/* Contact (/contact) as a small sheet set: routes are leader callouts, the form is a transmittal,
   direct lines sit in a title block, and the received stamp lands with ink. Built on pages-base.css.
   Every state below is final unless html.mo-live AND an element pages-contact.js marked with [data-pg]. */
.takeoff-contact{--cx-ink:#102441;--cx-gold:#BA8B37;--cx-gold-d:#94702e;--cx-gold-t:#7a5c22;--cx-paper:#F6F4EE;--cx-stone:#E9E2D4;--cx-under:#DDD4C2;
 --cx-line:rgba(16,36,65,.17);--cx-line-2:rgba(16,36,65,.4);--cx-muted:#4a5668;--cx-err:#A8381F;--cx-r:3px;
 --cx-mono:var(--pg-mono,'IBM Plex Mono',ui-monospace,Menlo,monospace);--cx-cond:var(--pg-cond,'Barlow Condensed','Barlow',sans-serif);
 --cx-ease:cubic-bezier(.2,.7,.1,1);--cx-drop:cubic-bezier(.3,1.4,.5,1);--cx-ox:10px;--cx-ax:16px;--cx-tilt:1.2deg}
.takeoff-contact :is(#message,.tk-close){overflow-x:clip}

/* Stamp labels: Barlow Condensed caps after a short gold rule. */
.takeoff-contact main .tk-overline{display:flex;align-items:center;gap:12px;font-family:var(--cx-cond);font-weight:600;font-size:14px!important;letter-spacing:.16em;text-transform:uppercase;color:var(--cx-ink)}
.takeoff-contact main .tk-overline::before{content:"";flex:none;width:30px;height:1px;background:var(--cx-gold-d);transform-origin:0 50%}

/* 1. Routes: detail bubble, note, leader line, drafted arrowhead. The leader draws on hover and focus. */
.takeoff-contact .vp-contact-routes{margin-top:34px;border-top:1px solid var(--cx-line-2)}
.takeoff-contact .vp-contact-routes a{--cx-cg:16px;--cx-ac:10.5px;display:grid;grid-template-columns:42px auto minmax(18px,1fr) 22px;align-items:center;column-gap:var(--cx-cg);min-height:68px;padding:10px 2px;border-bottom:1px solid var(--cx-line);font-size:18px;font-weight:500;line-height:1.3;color:var(--cx-ink)}
.takeoff-contact .vp-contact-routes a>span:first-child{grid-column:2}
.takeoff-contact .vp-contact-routes a::before{content:"";grid-column:1;grid-row:1;box-sizing:border-box;width:42px;height:42px;border:1px solid var(--cx-ink);border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;white-space:pre;font:500 10px/15px var(--cx-mono);letter-spacing:.06em;color:var(--cx-ink);background:linear-gradient(var(--cx-ink),var(--cx-ink)) 50% 50%/100% 1px no-repeat}
.takeoff-contact .vp-contact-routes a:nth-child(1)::before{content:"1\A EST" / ""}
.takeoff-contact .vp-contact-routes a:nth-child(2)::before{content:"2\A MSG" / ""}
.takeoff-contact .vp-contact-routes a:nth-child(3)::before{content:"3\A TRK" / ""}
.takeoff-contact .vp-contact-routes a:nth-child(4)::before{content:"4\A MAT" / ""}
.takeoff-contact .vp-contact-routes a::after{content:"";grid-column:3;grid-row:1;align-self:center;height:9px;margin-right:calc(-1*var(--cx-cg));
 background:linear-gradient(var(--cx-gold-d),var(--cx-gold-d)) 0 50%/0% 2px no-repeat,
  radial-gradient(circle,var(--cx-ink) 0 2px,transparent 2.6px) 0 50%/6px 6px no-repeat,
  repeating-linear-gradient(90deg,var(--cx-line-2) 0 7px,transparent 7px 11px) 0 50%/100% 1px no-repeat;
 transition:background-size .5s var(--cx-ease)}
.takeoff-contact .vp-contact-routes a>span:last-child{grid-column:4;grid-row:1;margin:0;position:relative;display:block;width:22px;height:22px}
.takeoff-contact .vp-contact-routes a>span:last-child .nl-icon{display:none}
.takeoff-contact .vp-contact-routes a>span:last-child::before{content:"";position:absolute;left:0;top:7px;width:17px;height:8px;background:var(--cx-ink);clip-path:polygon(0 0,100% 50%,0 100%,24% 50%);transition:transform .25s var(--cx-ease),background-color .16s}
/* The in-page route turns down at the end of its leader, toward the form below. */
.takeoff-contact .vp-contact-routes a[href^="#"]::after{margin-right:calc(-1*(var(--cx-cg) + var(--cx-ac)))}
.takeoff-contact .vp-contact-routes a[href^="#"]>span:last-child::before{left:calc(var(--cx-ac) - 8.5px);transform:translateY(8.5px) rotate(90deg)}
.takeoff-contact .vp-contact-routes a:focus-visible::after{background-size:100% 2px,6px 6px,100% 1px}
.takeoff-contact .vp-contact-routes a:focus-visible>span:last-child::before{background:var(--cx-gold-d);transform:translateX(3px)}
.takeoff-contact .vp-contact-routes a[href^="#"]:focus-visible>span:last-child::before{transform:translateY(10.5px) rotate(90deg)}
@media(hover:hover){
 .takeoff-contact .vp-contact-routes a:hover::after{background-size:100% 2px,6px 6px,100% 1px}
 .takeoff-contact .vp-contact-routes a:hover>span:last-child::before{background:var(--cx-gold-d);transform:translateX(3px)}
 .takeoff-contact .vp-contact-routes a[href^="#"]:hover>span:last-child::before{transform:translateY(10.5px) rotate(90deg)}}

/* 2. Photos: the hero is a trimmed sheet (crop marks, registration target); the archive photo sits on a second sheet. */
.takeoff-contact .vp-hero--contact .vp-photo,.takeoff-contact .vp-contact-layout>aside>figure{display:grid;grid-template-areas:"img" "cap";align-content:center;position:relative;isolation:isolate}
.takeoff-contact .vp-hero--contact .vp-photo img,.takeoff-contact .vp-contact-layout>aside>figure img{grid-area:img;border-radius:var(--cx-r);position:relative;z-index:1}
.takeoff-contact .vp-hero--contact .vp-photo::after{content:"";grid-area:img;margin:-17px;z-index:2;pointer-events:none;--k:linear-gradient(var(--cx-gold-d),var(--cx-gold-d));
 background:var(--k) 0 17px/11px 1px,var(--k) 17px 0/1px 11px,var(--k) 100% 17px/11px 1px,var(--k) calc(100% - 17px) 0/1px 11px,
  var(--k) 0 calc(100% - 17px)/11px 1px,var(--k) 17px 100%/1px 11px,var(--k) 100% calc(100% - 17px)/11px 1px,var(--k) calc(100% - 17px) 100%/1px 11px;background-repeat:no-repeat}
.takeoff-contact .vp-hero--contact .vp-photo::before{content:"";grid-area:img;align-self:start;justify-self:center;width:19px;height:19px;margin-top:-31px;z-index:2;pointer-events:none;border-radius:50%;
 background:radial-gradient(circle,transparent 0 5px,var(--cx-gold-d) 5px 6px,transparent 6.5px),linear-gradient(var(--cx-gold-d),var(--cx-gold-d)) 50% 0/1px 100% no-repeat,linear-gradient(var(--cx-gold-d),var(--cx-gold-d)) 0 50%/100% 1px no-repeat}
.takeoff-contact .vp-contact-layout>aside>figure::before{content:"";grid-area:img;z-index:0;background:var(--cx-under);border:1px solid var(--cx-line);border-radius:var(--cx-r);transform:translate(-12px,12px)}
.takeoff-contact .vp-hero--contact .vp-photo figcaption,.takeoff-contact .vp-contact-layout>aside>figure figcaption{grid-area:cap;display:flex;align-items:baseline;gap:12px;margin-top:16px;font:600 12.5px/1.4 var(--cx-cond);letter-spacing:.12em;text-transform:uppercase;color:#505d6c}
.takeoff-contact .vp-contact-layout>aside>figure figcaption{margin-top:22px}
/* One line, fixed height: the caption cannot reflow when the condensed face arrives, so the photo never moves. */
.takeoff-contact .vp-hero--contact .vp-photo figcaption{height:1.4em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.takeoff-contact .vp-hero--contact .vp-photo figcaption::before,.takeoff-contact .vp-contact-layout>aside>figure figcaption::before{flex:none;font:500 11px/1.4 var(--cx-mono);letter-spacing:.1em;color:var(--cx-gold-t)}
.takeoff-contact .vp-hero--contact .vp-photo figcaption::before{content:"";content:"FIG. 1" / ""}
.takeoff-contact .vp-contact-layout>aside>figure figcaption::before{content:"";content:"FIG. 2" / ""}

/* 3. The message section is drawn on a structural grid: A, B, C bubbles and dash-dot lines to the edge. */
.takeoff-contact #message{position:relative;isolation:isolate;background:var(--cx-stone)}
.takeoff-contact .cx-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;display:none}
.takeoff-contact .cx-grid.is-set{display:block}
.takeoff-contact .cx-grid i{position:absolute;top:26px;bottom:0;width:30px;margin-left:-15px;transform-origin:50% 15px;font:500 12px/28px var(--cx-mono);font-style:normal;text-align:center;color:var(--cx-ink)}
.takeoff-contact .cx-grid i::before{content:"";position:absolute;left:0;top:0;width:30px;height:30px;box-sizing:border-box;border:1px solid var(--cx-line-2);border-radius:50%}
.takeoff-contact .cx-grid i::after{content:"";position:absolute;left:14.5px;top:36px;bottom:0;width:1px;background:repeating-linear-gradient(to bottom,rgba(16,36,65,.2) 0 22px,transparent 22px 27px,rgba(16,36,65,.2) 27px 30px,transparent 30px 35px)}

/* 4. The form is a transmittal sheet: title row, ruled cells, a gold line traced under the focused cell. */
.takeoff-contact .vp-contact-form{position:relative;isolation:isolate}
.takeoff-contact .vp-contact-form>p{margin-bottom:34px}
.takeoff-contact .vp-contact-form form,.takeoff-contact .vp-contact-form .form-ok{position:relative;background:var(--cx-paper);border-radius:var(--cx-r)}
.takeoff-contact .vp-contact-form form::before,.takeoff-contact .vp-contact-form .form-ok::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--cx-under);border:1px solid var(--cx-line);border-radius:var(--cx-r);transform-origin:0 0;
 transform:translate(calc(var(--cx-ox) + (1 - var(--cx-k,1))*var(--cx-ax)),calc(var(--cx-ox) + (1 - var(--cx-k,1))*var(--cx-ax)*1.25)) rotate(calc((1 - var(--cx-k,1))*var(--cx-tilt)))}
.takeoff-contact .vp-contact-form form::after,.takeoff-contact .vp-contact-details::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:var(--cx-r);--k:linear-gradient(var(--cx-line-2),var(--cx-line-2));
 background:var(--k) 0 0/100% 1px,var(--k) 100% 0/1px 100%,var(--k) 100% 100%/100% 1px,var(--k) 0 100%/1px 100%;background-repeat:no-repeat}
.takeoff-contact .cx-sheet-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;border-bottom:1px solid var(--cx-line-2)}
.takeoff-contact .cx-sheet-head>*{padding:13px 18px 12px;min-width:0}
.takeoff-contact .cx-sheet-head>*+*{border-left:1px solid var(--cx-line)}
.takeoff-contact .cx-sheet-head b{align-self:center;font:600 23px/1 var(--cx-cond);letter-spacing:.14em;text-transform:uppercase;color:var(--cx-ink)}
.takeoff-contact .cx-sheet-head small{display:block;margin-bottom:3px;font:600 11px/1.2 var(--cx-cond);letter-spacing:.16em;text-transform:uppercase;color:#505d6c}
.takeoff-contact .cx-sheet-head span{font-size:15px;line-height:1.3;color:var(--cx-ink)}
.takeoff-contact .cx-sheet-head .cx-no{font:500 14px/1.3 var(--cx-mono);letter-spacing:.04em;white-space:nowrap}
.takeoff-contact .vp-contact-form form .form-grid{gap:1px;background:var(--cx-line)}
.takeoff-contact .vp-contact-form .field{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"lab err" "ctl ctl";align-items:baseline;column-gap:12px;row-gap:2px;padding:12px 18px 8px;background:var(--cx-paper);transition:background-color .16s,box-shadow .16s}
.takeoff-contact .vp-contact-form .field label{grid-area:lab;font:600 12.5px/1.3 var(--cx-cond);letter-spacing:.13em;text-transform:uppercase;color:var(--cx-muted)}
.takeoff-contact .vp-contact-form .field label .req{color:var(--cx-err)}
.takeoff-contact .vp-contact-form .field :is(input,select,textarea){grid-area:ctl;width:100%;min-width:0;min-height:44px;margin:0;padding:6px 0 7px;border:0;border-radius:0;background:transparent;box-shadow:none;font:400 17px/1.4 var(--font-body,'Barlow',sans-serif);color:var(--cx-ink)}
.takeoff-contact .vp-contact-form .field :is(input,select,textarea):focus,.takeoff-contact .vp-contact-form .field :is(input,select,textarea):focus-visible{outline:none;box-shadow:none;border:0}
.takeoff-contact .vp-contact-form .field ::placeholder{color:#6B7890;opacity:1}
.takeoff-contact .vp-contact-form .field select{-webkit-appearance:none;appearance:none;padding-right:28px;cursor:pointer;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M0 0h12L6 8z' fill='%23102441'/%3E%3C/svg%3E") no-repeat right 4px center}
.takeoff-contact .vp-contact-form .field textarea{min-height:132px;resize:vertical}
.takeoff-contact .vp-contact-form .form-grid>.field:last-child{padding-bottom:28px}
.takeoff-contact .vp-contact-form .field::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;z-index:1;background:var(--cx-gold-d);transform:scaleX(0);transform-origin:0 50%;transition:transform .34s var(--cx-ease)}
.takeoff-contact .vp-contact-form .field:focus-within{background:#FCFBF7;box-shadow:inset 0 0 0 1px var(--cx-ink)}
.takeoff-contact .vp-contact-form .field:focus-within::after{transform:scaleX(1)}
.takeoff-contact .vp-contact-form .field:focus-within label{color:var(--cx-ink)}
/* Errors sit on the label line, in words, with a red rule; nothing moves or shakes. */
.takeoff-contact .vp-contact-form .cx-err{grid-area:err;justify-self:end;text-align:right;font:500 14px/1.3 var(--font-body,'Barlow',sans-serif);color:var(--cx-err)}
.takeoff-contact .vp-contact-form .field.cx-bad{background:#FBF3EF}
.takeoff-contact .vp-contact-form .field.cx-bad::after{transform:scaleX(1);background:var(--cx-err)}
.takeoff-contact .vp-contact-form .field.cx-bad label{color:var(--cx-err)}
.takeoff-contact .vp-contact-form .cx-count{position:absolute;right:18px;bottom:8px;font:500 11px/1.2 var(--cx-mono);letter-spacing:.08em;color:#5d6878;font-variant-numeric:tabular-nums;pointer-events:none}
.takeoff-contact .vp-contact-form .field.cx-near .cx-count{color:var(--cx-gold-t)}
.takeoff-contact .vp-contact-form .field.cx-over .cx-count{color:var(--cx-err)}
.takeoff-contact .vp-contact-form form>div[style]{margin:0!important;padding:16px 18px;gap:12px 22px!important;border-top:1px solid var(--cx-line-2)}
.takeoff-contact .vp-contact-form form .mono{font:600 13px/1.3 var(--cx-cond)!important;letter-spacing:.13em!important;text-transform:uppercase!important;color:var(--cx-muted)!important}
.takeoff-contact .vp-contact-form form>.btn-note{margin:0;padding:0 18px 16px;font:500 15px/1.45 var(--font-body,'Barlow',sans-serif);letter-spacing:0;color:var(--cx-err)}

/* 5. Sending: the button plots its own progress bar while the request runs (aria-busy from main.js). */
.takeoff-contact .vp-contact-form button[type=submit]{position:relative;overflow:hidden;isolation:isolate;min-width:176px}
.takeoff-contact .vp-contact-form form[aria-busy=true] button[type=submit]{cursor:progress;opacity:1}
.takeoff-contact .vp-contact-form form[aria-busy=true] button[type=submit]::before{content:"";position:absolute;left:22px;right:22px;bottom:9px;height:1px;background:repeating-linear-gradient(90deg,rgba(16,36,65,.5) 0 4px,transparent 4px 7px)}
.takeoff-contact .vp-contact-form form[aria-busy=true] button[type=submit]::after{content:"";position:absolute;left:22px;right:22px;bottom:8px;height:3px;background:var(--cx-ink);transform-origin:0 50%;transform:scaleX(.5)}
.mo-live .takeoff-contact .vp-contact-form form[aria-busy=true] button[type=submit]::after{animation:cx-plot 2.6s cubic-bezier(.15,.6,.2,1) forwards}

/* 6. Received: the same sheet, with the rubber stamp and the reference in Plex Mono. */
.takeoff-contact .vp-contact-form .form-ok{padding:34px 26px 28px!important;border:1px solid var(--cx-line-2)}
.takeoff-contact .vp-contact-form .form-ok .stamp{--cx-rot:-4deg;position:relative;display:inline-block;transform:rotate(var(--cx-rot));padding:13px 20px 12px;border:3px solid var(--cx-gold-d);border-radius:4px;box-shadow:inset 0 0 0 3px var(--cx-paper),inset 0 0 0 4px var(--cx-gold-d);background:var(--cx-paper);color:var(--cx-gold-t);font:500 12px/1.45 var(--cx-mono);letter-spacing:.12em;text-transform:uppercase;animation:none}
.takeoff-contact .vp-contact-form .form-ok .stamp b{display:block;margin-bottom:4px;font:700 32px/1 var(--cx-cond);letter-spacing:.08em;color:var(--cx-gold-d)}
.takeoff-contact .vp-contact-form .form-ok .cx-date{display:block;margin-top:6px;padding-top:6px;border-top:1px solid var(--cx-gold-d);font:500 12px/1.3 var(--cx-mono);letter-spacing:.16em}
.takeoff-contact .vp-contact-form .form-ok [data-request-ref]{max-width:none;margin:20px 0 0;padding-top:14px;border-top:1px solid var(--cx-line);font:500 13px/1.55 var(--cx-mono);letter-spacing:.02em;color:var(--cx-ink)}
.cx-ink.takeoff-contact :is(.form-ok .stamp,.cx-review-stamp){filter:url(#cx-ink)}
.takeoff-contact :is(.form-ok .stamp,.cx-review-stamp)::after{content:"";position:absolute;inset:-3px;border:3px solid var(--cx-gold-d);border-radius:4px;opacity:0;pointer-events:none}
.mo-live .takeoff-contact .form-ok.cx-sent .stamp{animation:cx-drop .62s var(--cx-drop) .12s backwards}
.mo-live .takeoff-contact .form-ok.cx-sent .stamp::after{animation:cx-ring .7s ease-out .44s}
.mo-live .takeoff-contact .form-ok.cx-sent [data-request-ref]{animation:cx-rise .5s var(--cx-ease) .7s backwards}

/* 7. Direct lines as a title block: plotted frame, detail bubbles, the phone number large in Plex Mono. */
.takeoff-contact .vp-contact-layout>aside{margin-top:56px}
@media(min-width:801px){.takeoff-contact .vp-contact-layout>aside>figure{width:84%;margin-left:auto}.takeoff-contact .vp-contact-details+figure img{aspect-ratio:16/9}}
.takeoff-contact .vp-contact-details{position:relative;padding:0;background:var(--cx-paper);border-radius:var(--cx-r)}
.takeoff-contact .vp-contact-details h3{margin:0;padding:22px 24px 18px;border-bottom:1px solid var(--cx-line-2);font-size:25px;line-height:1.2}
.takeoff-contact .vp-contact-details h3::before{content:"";content:"Direct line" / "";display:block;margin-bottom:8px;font:600 12px/1.2 var(--cx-cond);letter-spacing:.16em;text-transform:uppercase;color:#505d6c}
.takeoff-contact .vp-contact-details dl{margin:0}
.takeoff-contact .vp-contact-details dt{position:relative;margin:0;padding:18px 24px 5px 78px;font:600 12.5px/1.3 var(--cx-cond);letter-spacing:.13em;text-transform:uppercase;color:var(--cx-muted);background:linear-gradient(var(--cx-line),var(--cx-line)) 0 0/100% 1px no-repeat}
.takeoff-contact .vp-contact-details dt:first-of-type{background-size:0 0}
.takeoff-contact .vp-contact-details dt::before{content:"";position:absolute;left:24px;top:16px;box-sizing:border-box;width:38px;height:38px;border:1px solid var(--cx-ink);border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;white-space:pre;font:500 9.5px/14px var(--cx-mono);letter-spacing:.04em;color:var(--cx-ink);background:linear-gradient(var(--cx-ink),var(--cx-ink)) 50% 50%/100% 1px no-repeat}
.takeoff-contact .vp-contact-details dt:nth-of-type(1)::before{content:"1\A TEL" / ""}
.takeoff-contact .vp-contact-details dt:nth-of-type(2)::before{content:"2\A MAIL" / ""}
.takeoff-contact .vp-contact-details dt:nth-of-type(3)::before{content:"3\A AREA" / ""}
.takeoff-contact .vp-contact-details dd{margin:0;padding:0 24px 18px 78px;font-size:18px;line-height:1.4;overflow-wrap:anywhere}
.takeoff-contact .vp-contact-details dd .nl-icon{display:none}
.takeoff-contact .vp-contact-details dd a{display:inline-flex;align-items:center;min-height:44px;margin:-6px 0;color:var(--cx-ink);text-decoration-thickness:1px;text-decoration-color:var(--cx-gold);text-underline-offset:6px}
.takeoff-contact .vp-contact-details dd a[href^="tel:"]{font:500 clamp(26px,2.3vw,32px)/1.2 var(--cx-mono);letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
.takeoff-contact .vp-contact-details dd p{margin:6px 0 0;font-size:15px;color:#505d6c}
.takeoff-contact .vp-contact-details>p{margin:0;padding:16px 24px 20px;border-top:1px solid var(--cx-line-2);font-size:15px;line-height:1.5}
.takeoff-contact .vp-contact-details>p::before{content:"";content:"Note" / "";margin-right:10px;font:600 12px/1 var(--cx-cond);letter-spacing:.16em;text-transform:uppercase;color:var(--cx-gold-t)}
@media(hover:hover){.takeoff-contact .vp-contact-details dd a:hover{text-decoration-thickness:2px;text-decoration-color:var(--cx-gold-d)}}

/* 8. Closing band: back on paper, with a review stamp set across the edge of the sheet above it. */
.takeoff-contact .tk-close{position:relative;background:var(--cx-paper);border-top:1px solid var(--cx-line-2)}
.takeoff-contact .tk-close-inner{position:relative}
.takeoff-contact .cx-review{position:absolute;right:8px;top:-121px;z-index:3;pointer-events:none}
.takeoff-contact .cx-review-stamp{--cx-rot:-6deg;position:relative;display:block;transform:rotate(var(--cx-rot));padding:10px 18px 9px;border:3px solid var(--cx-gold-d);border-radius:4px;box-shadow:inset 0 0 0 3px var(--cx-paper),inset 0 0 0 4px var(--cx-gold-d);background:var(--cx-paper);color:var(--cx-gold-t);text-align:center}
.takeoff-contact .cx-review-stamp b{display:block;font:700 26px/1 var(--cx-cond);letter-spacing:.1em;text-transform:uppercase}
.takeoff-contact .cx-review-stamp span{display:block;margin-top:5px;font:500 11px/1.2 var(--cx-mono);letter-spacing:.14em;text-transform:uppercase}

/* Layouts: desktop and mobile are composed separately. */
@media(max-width:1100px){.takeoff-contact .vp-contact-layout>aside{margin-top:40px}.takeoff-contact .cx-review{top:-118px}}
@media(max-width:850px){.takeoff-contact .cx-review{top:-94px;right:0}}
@media(max-width:800px){
 .takeoff-contact .vp-contact-layout>aside{margin-top:12px;align-items:stretch}
 .takeoff-contact .vp-contact-layout>aside>figure{grid-template-rows:minmax(0,1fr) auto;align-content:stretch}
 .takeoff-contact .vp-contact-details+figure img{height:100%;min-height:0}}
@media(max-width:700px){.takeoff-contact .cx-review{top:-88px}}
@media(max-width:600px){
 .takeoff-contact{--cx-ox:6px;--cx-ax:6px;--cx-tilt:.5deg}
 .takeoff-contact .vp-contact-routes{margin-top:24px}
 .takeoff-contact .vp-contact-routes a{--cx-cg:12px;--cx-ac:8.5px;grid-template-columns:36px auto minmax(12px,1fr) 18px;min-height:62px;padding:8px 0;font-size:16px}
 .takeoff-contact .vp-contact-routes a::before{width:36px;height:36px;font-size:9px;line-height:13px}
 .takeoff-contact .vp-contact-routes a>span:last-child{width:18px}
 .takeoff-contact .vp-contact-routes a>span:last-child::before{width:15px}
 .takeoff-contact .vp-contact-routes a[href^="#"]>span:last-child::before{left:calc(var(--cx-ac) - 7.5px)}
 .takeoff-contact .vp-hero--contact .vp-photo::after{margin:-13px;background-size:8px 1px,1px 8px,8px 1px,1px 8px,8px 1px,1px 8px,8px 1px,1px 8px;
  background-position:0 13px,13px 0,100% 13px,calc(100% - 13px) 0,0 calc(100% - 13px),13px 100%,100% calc(100% - 13px),calc(100% - 13px) 100%}
 .takeoff-contact .vp-hero--contact .vp-photo::before{margin-top:-25px;width:15px;height:15px}
 .takeoff-contact .vp-hero--contact .vp-photo figcaption{margin-top:13px;font-size:11.5px}
 .takeoff-contact .vp-contact-form>p{margin-bottom:24px}
 .takeoff-contact .cx-sheet-head{grid-template-columns:minmax(0,1fr) auto}
 .takeoff-contact .cx-sheet-head>*{padding:11px 14px 10px}
 .takeoff-contact .cx-sheet-head b{font-size:20px}
 .takeoff-contact .cx-sheet-head>span:nth-child(2){display:none}
 .takeoff-contact .vp-contact-form .field{padding:10px 14px 4px}
 .takeoff-contact .vp-contact-form .form-grid>.field:last-child{padding-bottom:26px}
 .takeoff-contact .vp-contact-form .field textarea{min-height:112px}
 .takeoff-contact .vp-contact-form .cx-count{right:14px;bottom:7px}
 .takeoff-contact .vp-contact-form form>div[style]{padding:14px}
 .takeoff-contact .vp-contact-form .form-ok{padding:26px 18px 22px!important}
 .takeoff-contact .vp-contact-form .form-ok .stamp b{font-size:27px}
 .takeoff-contact .vp-contact-layout>aside{margin-top:6px}
 .takeoff-contact .vp-contact-layout>aside>figure{display:none}
 .takeoff-contact .vp-contact-details h3{padding:18px 18px 15px;font-size:23px}
 .takeoff-contact .vp-contact-details dt{padding:16px 18px 4px 66px}
 .takeoff-contact .vp-contact-details dt::before{left:16px;top:14px;width:36px;height:36px}
 .takeoff-contact .vp-contact-details dd{padding:0 18px 16px 66px;font-size:17px}
 .takeoff-contact .vp-contact-details dd a[href^="tel:"]{font-size:25px}
 .takeoff-contact .vp-contact-details>p{padding:14px 18px 18px}
 .takeoff-contact .cx-review{top:-82px;right:-4px}
 .takeoff-contact .cx-review-stamp{padding:8px 13px 7px}
 .takeoff-contact .cx-review-stamp b{font-size:21px}
 .takeoff-contact .cx-review-stamp span{font-size:10px}}
@media(max-width:380px){.takeoff-contact .vp-contact-routes a{font-size:15.5px;--cx-cg:10px}.takeoff-contact .cx-sheet-head b{font-size:18px;letter-spacing:.1em}}

/* Scroll registration: the sheet under the form settles onto the stack as it scrolls in. */
@supports (animation-timeline:view()){
 .mo-live .takeoff-contact .vp-contact-form form{view-timeline:--cx-sheet block}
 .mo-live .takeoff-contact .vp-contact-form form::before{animation:cx-register linear both;animation-timeline:--cx-sheet;animation-range:entry 0% cover 40%}}

/* Motion. Hidden states exist only for elements pages-contact.js marked, and only under .mo-live. */
.mo-live .takeoff-contact .tk-overline[data-pg]:not(.pg-in){opacity:1}
.mo-live .takeoff-contact .tk-overline[data-pg]:not(.pg-in)::before{transform:scaleX(0)}
.mo-live .takeoff-contact .tk-overline[data-pg].pg-in::before{animation:cx-rule .7s var(--cx-ease) .1s backwards}
.mo-live .takeoff-contact .vp-contact-routes a[data-pg]:not(.pg-in){opacity:1;clip-path:inset(0 100% 0 0)}
.mo-live .takeoff-contact .vp-contact-routes a[data-pg].pg-in{animation:cx-wipe .7s var(--cx-ease) calc(var(--pg-i,0)*140ms + 240ms) backwards}
.mo-live .takeoff-contact .vp-contact-routes a[data-pg].pg-in::before{animation:cx-bubble .55s var(--cx-drop) calc(var(--pg-i,0)*140ms + 420ms) backwards}
.mo-live .takeoff-contact .vp-contact-routes a[data-pg].pg-in::after{animation:cx-lead .9s var(--cx-ease) calc(var(--pg-i,0)*140ms + 560ms) backwards}
.mo-live .takeoff-contact .vp-contact-routes a[data-pg].pg-in>span:last-child{animation:cx-fade .35s ease calc(var(--pg-i,0)*140ms + 900ms) backwards}
.mo-live .takeoff-contact [data-pg=cx-crop]:not(.pg-in),.mo-live .takeoff-contact [data-pg=cx-sheet]:not(.pg-in){opacity:1}
.mo-live .takeoff-contact [data-pg=cx-crop]:not(.pg-in)::after,.mo-live .takeoff-contact [data-pg=cx-crop]:not(.pg-in)::before{opacity:0}
.mo-live .takeoff-contact [data-pg=cx-crop].pg-in::after{animation:cx-crop .55s var(--cx-ease) .75s backwards}
.mo-live .takeoff-contact [data-pg=cx-crop].pg-in::before{animation:cx-target .6s var(--cx-ease) .95s backwards}
.mo-live .takeoff-contact [data-pg=cx-sheet]:not(.pg-in)::before{opacity:0;transform:none}
.mo-live .takeoff-contact [data-pg=cx-sheet].pg-in::before{animation:cx-under .7s var(--cx-ease) .45s backwards}
.mo-live .takeoff-contact [data-pg=cx-frame]:not(.pg-in){opacity:1}
.mo-live .takeoff-contact [data-pg=cx-frame]:not(.pg-in)::after{background-size:0 1px,1px 0,0 1px,1px 0}
.mo-live .takeoff-contact [data-pg=cx-frame].pg-in::after{animation:cx-frame 1.15s linear .1s backwards}
.mo-live .takeoff-contact form[data-pg]:not(.pg-in) .cx-sheet-head{clip-path:inset(0 100% 0 0)}
.mo-live .takeoff-contact form[data-pg]:not(.pg-in) :is(.field,form>div[style])>*{opacity:0}
.mo-live .takeoff-contact form[data-pg]:not(.pg-in) .form-grid{background-color:var(--cx-paper)}
.mo-live .takeoff-contact form[data-pg].pg-in .cx-sheet-head{animation:cx-wipe .7s var(--cx-ease) .2s backwards}
.mo-live .takeoff-contact form[data-pg].pg-in .form-grid{animation:cx-rules .7s ease .3s backwards}
.mo-live .takeoff-contact form[data-pg].pg-in .field>:not(.cx-err){animation:cx-rise .5s var(--cx-ease) calc(var(--pg-i,0)*60ms + 380ms) backwards}
.mo-live .takeoff-contact form[data-pg].pg-in>div[style]>*{animation:cx-rise .5s var(--cx-ease) .8s backwards}
.mo-live .takeoff-contact .vp-contact-details[data-pg]:not(.pg-in) :is(dt,h3)::before{opacity:0}
.mo-live .takeoff-contact .vp-contact-details[data-pg]:not(.pg-in) dt{background-size:0% 1px}
.mo-live .takeoff-contact .vp-contact-details[data-pg]:not(.pg-in) dd a[href^="tel:"]{clip-path:inset(0 100% 0 0)}
.mo-live .takeoff-contact .vp-contact-details[data-pg].pg-in dt{animation:cx-row .6s var(--cx-ease) calc(var(--cx-n,0)*160ms + 350ms) backwards}
.mo-live .takeoff-contact .vp-contact-details[data-pg].pg-in dt::before{animation:cx-bubble .55s var(--cx-drop) calc(var(--cx-n,0)*160ms + 480ms) backwards}
.mo-live .takeoff-contact .vp-contact-details[data-pg].pg-in h3::before{animation:cx-fade .5s ease .3s backwards}
.mo-live .takeoff-contact .vp-contact-details[data-pg].pg-in dd a[href^="tel:"]{animation:cx-type .95s steps(14,end) .75s backwards}
.takeoff-contact .vp-contact-details dt:nth-of-type(2){--cx-n:1}.takeoff-contact .vp-contact-details dt:nth-of-type(3){--cx-n:2}
.mo-live .takeoff-contact .cx-grid[data-pg]:not(.pg-in){opacity:1}
.mo-live .takeoff-contact .cx-grid[data-pg]:not(.pg-in) i{opacity:0}
.mo-live .takeoff-contact .cx-grid[data-pg]:not(.pg-in) i::after{clip-path:inset(0 0 100% 0)}
.mo-live .takeoff-contact .cx-grid[data-pg].pg-in i{animation:cx-bubble .5s var(--cx-drop) calc(var(--cx-n,0)*120ms) backwards}
.mo-live .takeoff-contact .cx-grid[data-pg].pg-in i::after{animation:cx-down 1.6s cubic-bezier(.4,0,.2,1) calc(var(--cx-n,0)*120ms + 250ms) backwards}
.takeoff-contact .cx-grid i:nth-child(2){--cx-n:1}.takeoff-contact .cx-grid i:nth-child(3){--cx-n:2}
.mo-live .takeoff-contact .cx-review-stamp[data-pg].pg-in{animation:cx-drop .6s var(--cx-drop) .25s backwards}
.mo-live .takeoff-contact .cx-review-stamp[data-pg].pg-in::after{animation:cx-ring .7s ease-out .58s}
/* Keyboard focus never lands on a field or link that is still being revealed. */
.mo-live .takeoff-contact form[data-pg] .field:focus-within>*,.mo-live .takeoff-contact form[data-pg]>div[style]>:focus-within,.mo-live .takeoff-contact form[data-pg]>div[style]>:focus-visible{opacity:1!important;animation:none!important}
.mo-live .takeoff-contact form[data-pg]:focus-within .cx-sheet-head{clip-path:none!important;animation:none!important}
.mo-live .takeoff-contact .vp-contact-details[data-pg] dd a[href^="tel:"]:focus-visible{clip-path:none!important;animation:none!important}
.mo-live .takeoff-contact .vp-contact-routes a[data-pg]:focus-visible,.mo-live .takeoff-contact .vp-contact-routes a[data-pg]:focus-visible>span{opacity:1!important;animation:none!important}
.takeoff-contact .vp-hero--contact{overflow-x:clip}
@keyframes cx-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes cx-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@keyframes cx-down{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
@keyframes cx-fade{from{opacity:0}}
@keyframes cx-rise{from{opacity:0;transform:translateY(10px)}}
@keyframes cx-rule{from{transform:scaleX(0)}}
@keyframes cx-bubble{0%{opacity:0;transform:scale(.3)}60%{opacity:1;transform:scale(1.08)}100%{transform:none}}
@keyframes cx-lead{from{background-size:0% 2px,0 0,0% 1px}}
@keyframes cx-row{from{background-size:0% 1px}}
@keyframes cx-rules{from{background-color:var(--cx-paper)}}
@keyframes cx-crop{from{opacity:0;transform:scale(1.05)}}
@keyframes cx-target{from{opacity:0;transform:rotate(-90deg) scale(.5)}}
@keyframes cx-under{from{opacity:0;transform:none}}
@keyframes cx-frame{0%{background-size:0 1px,1px 0,0 1px,1px 0}25%{background-size:100% 1px,1px 0,0 1px,1px 0}50%{background-size:100% 1px,1px 100%,0 1px,1px 0}75%{background-size:100% 1px,1px 100%,100% 1px,1px 0}100%{background-size:100% 1px,1px 100%,100% 1px,1px 100%}}
@keyframes cx-drop{0%{opacity:0;transform:rotate(-15deg) scale(1.7)}55%{opacity:1;transform:rotate(-3deg) scale(.95)}78%{transform:rotate(calc(var(--cx-rot) - 1deg)) scale(1.015)}100%{transform:rotate(var(--cx-rot))}}
@keyframes cx-ring{0%{opacity:.55;transform:scale(1)}100%{opacity:0;transform:scale(1.2)}}
@keyframes cx-plot{from{transform:scaleX(0)}to{transform:scaleX(.94)}}
@keyframes cx-register{from{transform:translate(calc(var(--cx-ox) + var(--cx-ax)),calc(var(--cx-ox) + var(--cx-ax)*1.25)) rotate(var(--cx-tilt))}to{transform:translate(var(--cx-ox),var(--cx-ox))}}

/* Parked states: no movement, the final drawing. */
.mo-still .takeoff-contact .form-ok .stamp{animation:none}
@media(prefers-reduced-motion:reduce){
 .takeoff-contact .vp-contact-routes a::after,.takeoff-contact .vp-contact-routes a>span:last-child::before,.takeoff-contact .vp-contact-form .field,.takeoff-contact .vp-contact-form .field::after{transition:none}
 .takeoff-contact .vp-contact-form form::before,.takeoff-contact .vp-contact-form form[aria-busy=true] button[type=submit]::after,.takeoff-contact :is(.form-ok .stamp,.cx-review-stamp),.takeoff-contact :is(.form-ok .stamp,.cx-review-stamp)::after{animation:none!important}}
@media print{.takeoff-contact .cx-grid{display:none!important}.takeoff-contact [data-pg] *,.takeoff-contact [data-pg]::before,.takeoff-contact [data-pg]::after,.takeoff-contact [data-pg] *::before,.takeoff-contact [data-pg] *::after{animation:none!important;clip-path:none!important;opacity:1!important}}
