/* Contact page styles, scoped from the supplied design. */
.kg-contact{--warn:#B44526}
.kg-contact input,.kg-contact textarea,.kg-contact select{font:inherit;color:inherit;background:none;border:0;width:100%}
/* ---------- HERO: shorter, detail photograph, address as the headline act ---------- */
.kg-contact .hero{position:relative;min-height:min(70svh,620px);display:flex;flex-direction:column;overflow:hidden;background:var(--ink)}
.kg-contact .hero-media{position:absolute;inset:-8% 0;will-change:transform}
.kg-contact .hero-img{position:absolute;inset:0;background-size:cover;background-position:60% center;
  transform:scale(1.1);animation:kb 2.6s var(--ease) forwards}
@keyframes kb{to{transform:scale(1)}}
.kg-contact .hero-scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,13,12,.94) 0%,
  rgba(11,13,12,.76) 42%,rgba(11,13,12,.42) 100%)}
.kg-contact .hero-scrim2{position:absolute;inset:0;background:linear-gradient(to top,rgba(11,13,12,.94) 0%,
  rgba(11,13,12,.5) 34%,rgba(11,13,12,.1) 66%)}
.kg-contact .hero-noise{position:absolute;inset:0;background-image:var(--grain);opacity:.06;mix-blend-mode:overlay;pointer-events:none}
.kg-contact .hero-in{position:relative;z-index:5;margin-top:auto;padding-top:calc(var(--hdr) + 50px);
  padding-bottom:clamp(30px,5vh,60px)}
.kg-contact .hero h1{font-size:clamp(2rem,5.2vw,4.6rem);letter-spacing:-.05em;line-height:1;max-width:16ch;
  margin-bottom:clamp(16px,2.2vh,26px)}
.kg-contact .hero h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}
.kg-contact .hero h1 .w>i{display:inline-block;font-style:normal;transform:translateY(112%);transition:transform 1.15s var(--ease)}
.kg-contact .hero.go h1 .w>i{transform:none}
.kg-contact .hero .sub{max-width:50ch;color:rgba(255,255,255,.64)}
.kg-contact .hero .fade{opacity:0;transform:translateY(22px);filter:blur(6px);
  transition:opacity .9s var(--ease),transform .9s var(--ease),filter .9s var(--ease)}
.kg-contact .hero.go .fade{opacity:1;transform:none;filter:blur(0)}
.kg-contact .mailbig{display:inline-flex;align-items:center;gap:clamp(12px,2vw,24px);margin-top:clamp(24px,3.4vh,40px);
  font-size:clamp(1.05rem,3vw,2.1rem);font-weight:600;letter-spacing:-.045em;transition:color .35s}
.kg-contact .mailbig:hover{color:var(--accent-hi)}
.kg-contact .mailbig .arw{width:clamp(36px,4vw,54px);height:clamp(36px,4vw,54px);border-radius:50%;flex:0 0 auto;
  border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;
  transition:transform .55s var(--ease),background-color .35s,color .35s,border-color .35s}
.kg-contact .mailbig .arw svg{width:44%;height:44%}
.kg-contact .mailbig:hover .arw{transform:rotate(-45deg);background:#fff;color:var(--ink);border-color:#fff}

/* ---------- FORM: panel on the left, live console on the right ---------- */
.kg-contact .fgrid{display:grid;grid-template-columns:1.28fr .72fr;gap:clamp(26px,4.4vw,74px);align-items:start}
.kg-contact .types{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:clamp(22px,2.6vw,32px)}
.kg-contact .type{border:1px solid rgba(11,13,12,.18);border-radius:100px;padding:10px 18px;font-size:14px;font-weight:500;
  letter-spacing:-.012em;transition:background-color .35s,border-color .35s,color .35s}
.kg-contact .type:hover{border-color:rgba(11,13,12,.42)}
.kg-contact .type.on{background:var(--ink);border-color:var(--ink);color:#fff}
.kg-contact .row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,26px)}
.kg-contact .field{position:relative;padding-top:22px;margin-bottom:clamp(18px,2.2vw,28px)}
.kg-contact .field label{position:absolute;left:0;top:24px;font-size:15px;color:rgba(11,13,12,.45);pointer-events:none;
  transition:transform .35s var(--ease),font-size .35s var(--ease),color .35s}
.kg-contact .field.filled label,.kg-contact .field:focus-within label{transform:translateY(-24px);font-size:11px;font-weight:600;
  letter-spacing:.13em;text-transform:uppercase}
.kg-contact .field:focus-within label{color:var(--accent)}
.kg-contact .field input,.kg-contact .field textarea,.kg-contact .field select{padding:6px 0 12px;border-bottom:1px solid rgba(11,13,12,.22);
  border-radius:0;font-size:15.5px;letter-spacing:-.012em;transition:border-color .35s}
.kg-contact .field textarea{resize:vertical;min-height:110px;line-height:1.6}
.kg-contact .field select{-webkit-appearance:none;appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,rgba(11,13,12,.4) 50%),
    linear-gradient(135deg,rgba(11,13,12,.4) 50%,transparent 50%);
  background-position:right 6px top 18px,right 1px top 18px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.kg-contact .field .bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--accent);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.kg-contact .field:focus-within .bar{transform:scaleX(1)}
.kg-contact .field.err input,.kg-contact .field.err textarea{border-bottom-color:var(--warn)}
.kg-contact .field .msg{display:block;margin-top:7px;font-size:12px;color:var(--warn);opacity:0;transform:translateY(-4px);
  transition:opacity .3s,transform .3s}
.kg-contact .field.err .msg{opacity:1;transform:none}
.kg-contact .counter{position:absolute;right:0;top:24px;font-size:11px;font-weight:600;letter-spacing:.1em;
  color:rgba(11,13,12,.35);font-variant-numeric:tabular-nums}
.kg-contact .klyvant-hp{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
.kg-contact .turnstile-wrap{width:100%;max-width:420px;margin-top:clamp(10px,1.6vw,18px);overflow:hidden}
.kg-contact .klyvant-turnstile-widget{width:100%}
.kg-contact .submit{display:inline-flex;align-items:center;gap:14px;background:var(--accent);color:#fff;border-radius:100px;
  padding:14px 14px 14px 28px;font-size:15px;font-weight:500;letter-spacing:-.012em;
  transition:background-color .3s;will-change:transform}
.kg-contact .submit:hover{background:var(--accent-deep)}
.kg-contact .submit:disabled{cursor:wait;opacity:.62;transform:none!important}
.kg-contact .submit .roll{display:block;overflow:hidden;height:21px}
.kg-contact .submit .roll span{display:block;transition:transform .5s var(--ease)}
.kg-contact .submit:hover .roll span{transform:translateY(-100%)}
.kg-contact .submit .arw{width:32px;height:32px;border-radius:50%;background:#fff;color:var(--accent);display:grid;
  place-items:center;flex:0 0 auto;transition:transform .5s var(--ease)}
.kg-contact .submit:hover .arw{transform:rotate(-45deg)}
.kg-contact .submit .arw svg{width:15px;height:15px}
.kg-contact .formfoot{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:clamp(20px,2.4vw,30px)}
.kg-contact .sent{font-size:14px;color:var(--accent);opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}
.kg-contact .sent.on{opacity:1;transform:none}
.kg-contact .sent.error{color:var(--warn)}

/* live console */
.kg-contact .console{position:sticky;top:max(calc(var(--hdr) + var(--wp-admin-offset,0px) + 12px),clamp(20px,7vh,80px));border-radius:18px;overflow:hidden;
  background:var(--ink);color:#fff;border:1px solid rgba(255,255,255,.14)}
.kg-contact .console::after{content:"";position:absolute;inset:0;background-image:var(--grain);opacity:.05;
  mix-blend-mode:overlay;pointer-events:none}
.kg-contact .console-in{position:relative;z-index:2;padding:clamp(20px,2.4vw,30px)}
.kg-contact .console-h{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.4)}
.kg-contact .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent-hi);margin-right:8px;
  vertical-align:1px;animation:pl 2.6s var(--ease) infinite}
@keyframes pl{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(54,138,221,.4)}50%{opacity:.5;box-shadow:0 0 0 6px rgba(54,138,221,0)}}
.kg-contact .readout{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.kg-contact .readout dt{font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.38);margin-bottom:7px}
.kg-contact .readout dd{font-size:15px;font-weight:500;letter-spacing:-.022em;line-height:1.35}
.kg-contact .readout dd.pending{color:rgba(255,255,255,.32);font-weight:400}
.kg-contact .guide{padding:18px 0 4px;font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.6)}
.kg-contact .meterbar{height:3px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden;margin-top:16px}
.kg-contact .meterbar i{display:block;height:100%;width:0;background:var(--accent-hi);transition:width .5s var(--ease)}
.kg-contact .meterlab{display:flex;justify-content:space-between;margin-top:10px;color:rgba(255,255,255,.4)}

/* ---------- NEXT: stepped rows ---------- */
.kg-contact .next{border-top:1px solid rgba(11,13,12,.16)}
.kg-contact .next-row{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.2fr);
  gap:clamp(14px,3vw,50px);padding:clamp(22px,3vw,40px) 0;border-bottom:1px solid rgba(11,13,12,.16);
  align-items:baseline;transition:padding-left .55s var(--ease)}
.kg-contact .next-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(11,13,12,.035);
  transition:width .6s var(--ease);pointer-events:none}
.kg-contact .next-row:hover::before{width:100%}
.kg-contact .next-row:hover{padding-left:clamp(10px,1.6vw,24px)}
.kg-contact .next-row>*{position:relative;z-index:2}
.kg-contact .next-row .n{font-size:11.5px;font-weight:700;letter-spacing:.13em;color:var(--accent)}
.kg-contact .next-row h3{font-size:clamp(1.1rem,2.4vw,1.9rem);letter-spacing:-.042em;line-height:1.06}
.kg-contact .next-row p{color:rgba(11,13,12,.62);max-width:50ch}

/* ---------- OFFICES ---------- */
.kg-contact .offices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kg-contact .office{border-radius:16px;padding:clamp(22px,2.8vw,38px);display:flex;flex-direction:column;gap:14px;
  min-height:clamp(210px,22vw,280px);transition:border-color .45s,transform .5s var(--ease)}
.kg-contact .office:hover{border-color:rgba(255,255,255,.34);transform:translateY(-4px)}
.kg-contact .office .tag{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-hi)}
.kg-contact .office h3{font-size:clamp(1.3rem,2.6vw,2rem);letter-spacing:-.042em;margin-top:auto}
.kg-contact .office p{color:rgba(255,255,255,.58);font-size:14.5px;line-height:1.55}

@media (max-width:1024px){
  .kg-contact .fgrid{grid-template-columns:1fr;gap:26px}
  .kg-contact .console{position:relative;top:0;order:-1}
  .kg-contact .next-row{grid-template-columns:auto 1fr;row-gap:10px}
  .kg-contact .next-row p{grid-column:2}
  .kg-contact .offices{grid-template-columns:1fr}
}
@media (max-width:640px){ .kg-contact .row{grid-template-columns:1fr;gap:0} }
@media (prefers-reduced-motion:reduce){
  .kg-contact *,.kg-contact *::before,.kg-contact *::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
  .kg-contact [data-r]{opacity:1;transform:none;filter:none}
  .kg-contact .at .w>i,.kg-contact .hero h1 .w>i{transform:none}
  .kg-contact .hero .fade{opacity:1;transform:none;filter:none}
}