/* Contact page CSS: the ENTIRE page-specific block of contact-template.html, verbatim, plus the template's
   generic section rhythm (section / .h2 / .lede) scoped with :where() so it cannot override covers. */
@keyframes mark{from{transform:scaleX(0)}}
:where(.contact-page main) :where(section){padding-block:clamp(90px,13vh,150px)}
:where(.contact-page main) :where(.h2){font-weight:900;font-size:clamp(34px,5vw,66px);letter-spacing:-.035em}
:where(.contact-page main) :where(.lede){font-size:clamp(17px,1.5vw,20px);color:var(--ink-2);max-width:60ch}
/* ===================== CONTACT TEMPLATE ===================== */
/* Layout: compact title → two routes side by side (Support = external portal, Sales = email) → location strip with the full address, phone and fax as copyable text. */
.chero{padding-block:clamp(40px,7vh,88px) clamp(32px,5vh,56px)}
.chero .crumb{display:flex;gap:8px;align-items:center;font-family:var(--font-display);font-size:14px;color:var(--ink-2);margin-bottom:22px}
.chero .crumb a{text-decoration:none}.chero .crumb svg{width:12px;height:12px;opacity:.6}
.chero h1{font-weight:900;font-size:clamp(48px,7vw,104px);letter-spacing:-.045em;line-height:.92;text-transform:uppercase}
.chero h1 .hl{position:relative;color:var(--purple-text);z-index:0}
.chero h1 .hl::after{content:"";position:absolute;left:-.04em;right:-.04em;bottom:.08em;height:.22em;background:var(--highlight);z-index:-1;border-radius:3px;transform-origin:left;animation:mark 1s .5s var(--ease-out) both}
.routes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;perspective:1400px}
.route{position:relative;display:flex;flex-direction:column;padding:clamp(28px,3.4vw,44px);border-radius:30px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);min-height:360px;transform-style:preserve-3d;will-change:transform;transition:border-color .3s var(--ease-out)}
.route:hover{border-color:var(--purple-text)}
.route .ic{width:72px;height:72px;border-radius:22px;background:var(--purple-soft);display:grid;place-items:center;transform:translateZ(40px)}
.route .ic svg{width:34px;height:34px;stroke:var(--purple-text)}
.route h2{font-weight:900;font-size:clamp(28px,3vw,40px);letter-spacing:-.03em;margin-top:28px;transform:translateZ(24px)}
.route p{color:var(--ink-2);font-size:clamp(17px,1.4vw,19px);margin-top:14px;max-width:40ch}
.route .act{margin-top:auto;padding-top:30px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.route.sales{background:var(--purple);border-color:var(--purple);color:#fff}
.route.sales .ic{background:rgba(255,255,255,.14)}.route.sales .ic svg{stroke:var(--yellow)}
.route.sales p{color:rgba(255,255,255,.82)}
.copyline{display:inline-flex;align-items:center;gap:6px;padding:6px 6px 6px 16px;border-radius:14px;background:rgba(255,255,255,.12);font-family:var(--font-display);font-weight:700;font-size:17px}
.copyline span{user-select:all}
.copy{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase;border:0;border-radius:10px;padding:10px 12px;cursor:pointer;background:var(--yellow);color:#1d0f1c;transition:transform .16s var(--ease-out)}
.copy:active{transform:scale(.96)}
.copy svg{width:14px;height:14px;stroke:#1d0f1c}
.locate{margin-top:20px;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0;border-radius:30px;overflow:hidden;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow)}
.locate .pinbox{position:relative;min-height:300px;background:var(--bg-2);display:grid;place-items:center;overflow:hidden}
.locate .pinbox::before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:34px 34px;transform:perspective(600px) rotateX(55deg) scale(1.8);transform-origin:50% 60%}
.pin{position:relative;width:64px;height:64px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--purple);box-shadow:0 20px 30px -12px rgba(60,10,58,.6);display:grid;place-items:center}
.pin svg{width:30px;height:30px;fill:#fff;transform:rotate(45deg)}
.pin-shadow{position:absolute;left:50%;top:calc(50% + 46px);width:46px;height:12px;margin-left:-23px;border-radius:50%;background:rgba(60,10,58,.25);filter:blur(3px)}
.pulse-ring{position:absolute;left:50%;top:calc(50% + 52px);width:80px;height:24px;margin-left:-40px;border-radius:50%;border:2px solid var(--purple-text);opacity:0;animation:ring 2.4s var(--ease-out) infinite}
@keyframes ring{0%{transform:scale(.4);opacity:.8}100%{transform:scale(2.2);opacity:0}}
.locate .info{padding:clamp(28px,3.4vw,44px);display:grid;gap:22px;align-content:center}
.locate .info .kick2{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--purple-text)}
.locate .info h2{font-weight:900;font-size:clamp(32px,3.6vw,50px);letter-spacing:-.035em;margin-top:6px}
.locate address{font-style:normal;color:var(--ink-2);font-size:17px;line-height:1.6}
.locate dl{display:grid;grid-template-columns:auto 1fr;gap:8px 20px;margin:0;font-family:var(--font-display)}
.locate dt{color:var(--ink-2);font-size:14px;letter-spacing:.08em;text-transform:uppercase;padding-top:2px}
.locate dd{margin:0;font-weight:700;font-size:18px;user-select:all;font-variant-numeric:tabular-nums}
.locate .act{display:flex;flex-wrap:wrap;gap:12px}
.toast{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom,0px));z-index:40;transform:translate(-50%,20px);opacity:0;padding:12px 18px;border-radius:12px;background:var(--ink);color:var(--bg);font-family:var(--font-display);font-weight:600;font-size:14px;pointer-events:none;transition:opacity .25s var(--ease-out),transform .3s var(--ease-out)}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:900px){.routes,.locate{grid-template-columns:1fr}.route{min-height:0}.locate .pinbox{min-height:220px}}
@media (prefers-reduced-motion:reduce){.pulse-ring,.chero h1 .hl::after{animation:none!important}.pulse-ring{opacity:0}.route{transition-duration:.01ms!important}}