/* ============ CONTACT BLOCK - ONE shared tier, SINGLE SPINE ============
   The "I LOOK FORWARD / TO HEARING / FROM YOU" + email + LOCATION/RELOCATION block is ONE
   component with ONE left alignment edge: the three-line label sits ABOVE the email, the
   email above the LOCATION/RELOCATION columns, everything hanging from one vertical spine.
   The old right-aligned label column and the FROM YOU <-> email baseline lock are RETIRED
   (contactblock.js keeps a compatibility no-op).

   Exactly three type sizes:
     10px caps ... .ct-lbl (600) AND .ct-k (400), 10/14 Nohemi uppercase .08em
     email ....... 400 Nohemi, 24px/32px from 400px viewports up, stepping down fluidly
                   below (clamp(18px,6vw,24px)) so it never touches the frame on an SE
     14px values . .ct-v 600 14/20 Nohemi
   Strict 8-pt rhythm: label -> 8 -> email -> 24 -> columns; in a column, label -> 8 -> value.
   Columns sit side by side at EVERY width: 48px gutter from 800 up, 32px below. Never stacked.

   Consumers: Landing Scene Work scenes (.statblk.ctblk, bottom-right), Get in touch
   (.cemail.ctblk, bottom-right, desktop-only <1280) and the Nav menu overlay's footer
   (.mn-foot.ctblk, pinned to the overlay bottom). Pages own ONLY page geometry (position /
   anchor / z-index / display); this tier owns type, rhythm, gutters, the brush and the
   copied confirmation. Selectors doubled so the tier outranks page rules regardless of
   load order. Linked from every consuming page's helmet after buttons.css. */
.ctblk.ctblk{flex-direction:column;align-items:flex-start;gap:var(--space-2,8px)}
.ctblk.ctblk .ct-lbl.ct-lbl{text-align:left;margin-top:0;color:#242424;white-space:nowrap;font:600 10px/14px 'Nohemi','Nohemi Fallback',Helvetica,Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.ctblk.ctblk .ct-r.ct-r{display:flex;flex-direction:column;gap:var(--space-6,24px);align-items:flex-start}
.ctblk.ctblk .emlink.emlink{position:relative;display:inline-block;color:#242424;text-decoration:none;font:400 clamp(18px,6vw,24px)/1.334 'Nohemi','Nohemi Fallback',Helvetica,Arial,sans-serif;letter-spacing:-.01em;text-transform:lowercase;pointer-events:auto;cursor:pointer}
.ctblk.ctblk .emlink .t{position:relative;z-index:1}
.ctblk.ctblk .bstroke.bstroke-lg{position:absolute;left:-4px;right:-4px;bottom:1px;height:.9em;z-index:0;color:var(--brush-color,#F1BE48);-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0);transition:clip-path .2s cubic-bezier(.4,0,.6,1)}
.ctblk.ctblk .bstroke-lg svg{display:block;width:100%;height:100%}
.ctblk.ctblk .bstroke-lg path{fill:currentColor}
.ctblk.ctblk .emlink:hover .bstroke,.ctblk.ctblk .emlink:focus-visible .bstroke{-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);transition:clip-path .35s cubic-bezier(.2,.7,.3,1)}
.ctblk.ctblk .copied.copied{position:absolute;left:calc(100% + 12px);bottom:2px;font:500 var(--hand-size,25px)/30px 'NaN SuperX','NaN SuperX Fallback',Helvetica,Arial,sans-serif;color:#242424;opacity:0;transform:rotate(-2deg);white-space:nowrap;pointer-events:none;transition:opacity .3s var(--ease,ease)}
.ctblk.ctblk .copied.show{opacity:.85}
.ctblk.ctblk .ct-cols.ct-cols{display:flex;flex-direction:row;gap:var(--space-12,48px)}
.ctblk.ctblk .ct-col.ct-col{display:flex;flex-direction:column;gap:var(--space-2,8px);align-items:flex-start}
.ctblk.ctblk .ct-k.ct-k{color:#242424;font:400 10px/14px 'Nohemi','Nohemi Fallback',Helvetica,Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.ctblk.ctblk .ct-v.ct-v{color:#242424;font:600 14px/20px 'Nohemi','Nohemi Fallback',Helvetica,Arial,sans-serif}
/* Below the layout breakpoint the gutter tightens; the columns stay two-up. */
@media (max-width:799px){.ctblk.ctblk .ct-cols.ct-cols{gap:var(--space-8,32px)}}