.contact-page { background: #010405; }
.contact-shell { width: min(100% - 80px, 1280px); margin: 0 auto; }
.section-kicker { margin: 0 0 20px; color: var(--teal-bright); font-size: .68rem; font-weight: 700; letter-spacing: .22em; }

.contact-hero { position: relative; min-height: 94svh; overflow: hidden; isolation: isolate; background: #010405; }
.contact-hero::after { position: absolute; z-index: -1; right: 0; bottom: -1px; left: 0; height: clamp(150px,18vw,250px); background: linear-gradient(180deg,transparent,rgba(1,4,5,.55) 43%,#010405); content: ""; }
.contact-hero__media,.contact-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.contact-hero__media { z-index: -4; object-fit: cover; object-position: center; animation: contact-hero-breathe 19s ease-in-out infinite alternate; }
.contact-hero__shade { z-index: -3; background: linear-gradient(90deg,rgba(1,4,5,.99),rgba(1,4,5,.94) 31%,rgba(1,4,5,.48) 57%,rgba(1,4,5,.06) 82%),linear-gradient(180deg,rgba(1,4,5,.68),transparent 31%,transparent 60%,rgba(1,4,5,.94)); }
.contact-hero__mist { position: absolute; z-index: -2; bottom: 3%; left: 19%; width: 620px; height: 250px; border-radius: 50%; background: rgba(61,202,197,.07); filter: blur(90px); animation: contact-mist 11s ease-in-out infinite alternate; }
.contact-hero__content { display: flex; align-items: center; min-height: calc(94svh - 82px); padding: 40px clamp(42px,6.1vw,88px) 95px; }
.contact-hero__content > div { max-width: 635px; }
.contact-hero h1 { margin: 50px 0 27px; color: var(--white); font-size: clamp(3.1rem,4.8vw,4.55rem); font-weight: 400; letter-spacing: -.052em; line-height: 1; text-shadow: 0 6px 28px rgba(0,0,0,.82); }
.contact-hero h1 em { display: block; margin-top: 8px; color: var(--teal-bright); font-style: normal; }
.contact-hero__copy { max-width: 585px; margin: 0; color: #c4cdce; font-size: clamp(.94rem,1vw,1.04rem); line-height: 1.78; text-shadow: 0 2px 12px #000; }
.contact-hero__actions { display: flex; gap: 14px; margin-top: 36px; }
.contact-hero__actions .button { min-width: 208px; }
.contact-hero__meta { position: absolute; bottom: 50px; left: clamp(42px,6.1vw,88px); margin: 0; color: rgba(204,218,219,.67); font-size: .59rem; font-weight: 700; letter-spacing: .2em; }
.contact-hero__scroll { position: absolute; right: clamp(42px,6.1vw,88px); bottom: 47px; display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(155,229,226,.25); border-radius: 50%; background: rgba(2,9,10,.54); transition: border-color .25s,background-color .25s,transform .25s; }
.contact-hero__scroll svg { width: 19px; fill: none; stroke: var(--teal-bright); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }
.contact-hero__scroll:hover { transform: translateY(4px); border-color: rgba(91,221,215,.7); background: rgba(23,91,91,.2); }
.contact-page .header-action { width: 190px; }

.inquiry-section { position: relative; margin-top: -1px; padding: 135px 0 145px; overflow: hidden; background: radial-gradient(720px 420px at 87% 22%,rgba(56,193,187,.065),transparent 72%),linear-gradient(180deg,#010405,#02090a 58%,#010405); }
.inquiry-section::before { position: absolute; top: 11%; left: -10%; width: 520px; height: 520px; border: 1px solid rgba(78,205,198,.04); border-radius: 50%; content: ""; }
.inquiry-layout { display: grid; grid-template-columns: .83fr 1.17fr; gap: clamp(65px,8vw,118px); align-items: start; }
.inquiry-copy { padding-top: 36px; }
.inquiry-copy h2,.location-heading h2 { margin: 0; color: var(--white); font-size: clamp(2.4rem,3.8vw,3.7rem); font-weight: 400; letter-spacing: -.045em; line-height: 1.06; }
.inquiry-copy h2 em,.location-heading h2 em { color: var(--teal-bright); font-style: normal; }
.inquiry-intro { margin: 27px 0 44px; color: var(--copy); font-size: .98rem; line-height: 1.82; }
.contact-list { display: grid; border-top: 1px solid rgba(107,221,215,.14); font-style: normal; }
.contact-line { position: relative; display: grid; grid-template-columns: 54px 1fr 24px; gap: 18px; align-items: center; min-height: 95px; border-bottom: 1px solid rgba(107,221,215,.14); transition: background-color .28s ease,border-color .28s ease,padding .28s ease; }
.contact-line::before { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: var(--teal-bright); opacity: 0; content: ""; transition: opacity .28s ease; }
.contact-line:hover,.contact-line:focus-visible { padding-right: 10px; padding-left: 13px; border-color: rgba(108,231,224,.34); background: linear-gradient(90deg,rgba(57,192,187,.09),transparent 75%); outline: none; }
.contact-line:hover::before,.contact-line:focus-visible::before { opacity: 1; }
.contact-line__icon { display: grid; width: 48px; height: 48px; place-items: center; border: 1px solid rgba(104,222,215,.29); border-radius: 14px; background: linear-gradient(145deg,rgba(66,192,187,.12),rgba(2,8,9,.26)); box-shadow: inset 0 1px rgba(255,255,255,.06),0 0 22px rgba(67,195,191,.05); transition: border-color .28s,background-color .28s,box-shadow .28s,transform .28s; }
.contact-line__icon svg { width: 26px; fill: none; stroke: var(--teal-bright); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.25; filter: drop-shadow(0 0 7px rgba(92,230,222,.25)); }
.contact-line:hover .contact-line__icon { transform: translateY(-2px); border-color: rgba(117,239,232,.66); background: rgba(47,167,163,.15); box-shadow: inset 0 1px rgba(255,255,255,.11),0 0 27px rgba(64,214,206,.13); }
.contact-line small { display: block; margin-bottom: 7px; color: var(--teal-bright); font-size: .55rem; font-weight: 700; letter-spacing: .18em; }
.contact-line strong { display: block; color: #eef4f4; font-size: .82rem; font-weight: 400; line-height: 1.55; }
.contact-line__arrow { width: 18px; fill: none; stroke: rgba(91,221,215,.7); stroke-width: 1.3; transition: transform .28s,stroke .28s; }
.contact-line:hover .contact-line__arrow { transform: translateX(4px); stroke: #8dfff9; }

.inquiry-form { --mx: 50%; --my: 30%; position: relative; overflow: hidden; padding: clamp(35px,4vw,55px); border: 1px solid rgba(112,226,219,.22); border-radius: 13px; background: linear-gradient(145deg,rgba(22,52,55,.5),rgba(3,9,10,.52)); box-shadow: inset 0 1px rgba(255,255,255,.055),0 35px 95px rgba(0,0,0,.34); backdrop-filter: blur(14px); }
.inquiry-form::before { position: absolute; inset: 0; background: radial-gradient(380px circle at var(--mx) var(--my),rgba(100,231,223,.105),transparent 56%),linear-gradient(120deg,rgba(255,255,255,.05),transparent 28%,transparent 74%,rgba(67,195,191,.025)); content: ""; pointer-events: none; }
.inquiry-form__glow { position: absolute; top: -100px; right: -80px; width: 260px; height: 260px; border-radius: 50%; background: rgba(70,219,211,.08); filter: blur(60px); }
.form-heading { position: relative; display: flex; gap: 18px; align-items: center; margin-bottom: 36px; }
.form-heading > span { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid rgba(91,221,215,.42); border-radius: 50%; color: var(--teal-bright); font-size: .65rem; box-shadow: 0 0 23px rgba(67,195,191,.08); }
.form-heading p { margin: 0 0 7px; color: var(--teal-bright); font-size: .56rem; font-weight: 700; letter-spacing: .18em; }
.form-heading h3 { margin: 0; color: #f1f6f6; font-size: 1.42rem; font-weight: 400; }
.form-grid { position: relative; display: grid; grid-template-columns: repeat(2,1fr); gap: 23px 18px; }
.form-grid label { display: grid; gap: 9px; }
.form-grid label > span { color: #9eacad; font-size: .65rem; letter-spacing: .05em; }
.form-field--wide { grid-column: 1/-1; }
.form-grid input,.form-grid select,.form-grid textarea { width: 100%; border: 1px solid rgba(114,201,198,.17); border-radius: 5px; outline: 0; background: rgba(1,7,8,.48); color: #edf4f4; font: inherit; font-size: .78rem; transition: border-color .25s,background-color .25s,box-shadow .25s; }
.form-grid input,.form-grid select { height: 51px; padding: 0 16px; }
.form-grid textarea { min-height: 145px; padding: 15px 16px; resize: vertical; line-height: 1.6; }
.form-grid select { appearance: none; background-image: linear-gradient(45deg,transparent 50%,#65dcd6 50%),linear-gradient(135deg,#65dcd6 50%,transparent 50%); background-position: calc(100% - 18px) 22px,calc(100% - 13px) 22px; background-repeat: no-repeat; background-size: 5px 5px,5px 5px; }
.form-grid option { background: #071011; color: #edf4f4; }
.form-grid input::placeholder,.form-grid textarea::placeholder { color: #667476; }
.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { border-color: rgba(102,229,222,.62); background-color: rgba(18,62,63,.24); box-shadow: 0 0 0 3px rgba(67,195,191,.055),0 0 22px rgba(67,195,191,.06); }
.form-grid [aria-invalid="true"] { border-color: rgba(255,143,143,.6); }
.form-footer { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 26px; }
.form-footer p { max-width: 260px; margin: 0; color: #819092; font-size: .65rem; line-height: 1.5; }
.form-footer p.is-error { color: #ffaaaa; }
.form-footer p.is-success { color: var(--teal-bright); }
.form-footer .button { min-width: 188px; border: 0; cursor: pointer; }

.contact-location { padding: 128px 0 145px; background: radial-gradient(760px 340px at 50% 25%,rgba(50,196,190,.045),transparent 76%),linear-gradient(180deg,#010405,#02090a); }
.location-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 52px; }
.location-heading > p { width: min(42%,530px); margin: 0; color: var(--copy); font-size: .95rem; line-height: 1.8; }
.map-panel { position: relative; min-height: 535px; overflow: hidden; border: 1px solid rgba(109,223,216,.2); border-radius: 12px; background: #061011; box-shadow: 0 30px 95px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.04); isolation: isolate; }
.map-panel::after { position: absolute; z-index: 2; inset: 0; border-radius: inherit; box-shadow: inset 0 0 55px rgba(0,0,0,.85),inset 0 0 0 1px rgba(116,232,226,.04); content: ""; pointer-events: none; }
.map-panel__image { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.72) brightness(.57) contrast(1.05) saturate(.52); transform: scale(1.03); transition: transform 2s cubic-bezier(.2,.7,.2,1),filter .8s ease; }
.map-panel:hover .map-panel__image { filter: grayscale(.72) brightness(.61) contrast(1.06) saturate(.6); transform: scale(1.055); }
.map-panel__vignette { position: absolute; z-index: -2; inset: 0; background: radial-gradient(circle at 61% 46%,rgba(72,209,202,.06),transparent 24%),linear-gradient(90deg,rgba(1,7,8,.4),transparent 22%,transparent 78%,rgba(1,7,8,.46)),linear-gradient(180deg,rgba(1,7,8,.22),transparent 28%,rgba(1,7,8,.5)); }
.map-panel__routes { position: absolute; z-index: -1; inset: 0; width: 100%; height: 100%; fill: none; stroke: rgba(74,215,207,.26); stroke-width: 1.2; stroke-dasharray: 3 16; stroke-linecap: round; filter: drop-shadow(0 0 5px rgba(66,210,203,.16)); animation: contact-route 12s linear infinite; }
.map-label { position: absolute; z-index: 1; color: rgba(193,204,205,.46); font-size: clamp(.56rem,.7vw,.7rem); letter-spacing: .13em; text-shadow: 0 1px 3px #000; pointer-events: none; }
.map-label--soho{top:25%;left:39%}.map-label--westminster{top:50%;left:28%}.map-label--southwark{top:57%;left:61%}.map-label--canary{top:46%;right:4%}
.location-marker { position: absolute; z-index: 5; top: 43%; left: 60%; width: 70px; height: 90px; padding: 0; border: 0; background: transparent; cursor: pointer; transform: translate(-50%,-50%); }
.location-marker__pulse { position: absolute; top: 9px; left: 14px; width: 42px; height: 42px; border: 1px solid rgba(100,255,246,.58); border-radius: 50%; box-shadow: 0 0 8px rgba(65,239,229,.34),inset 0 0 8px rgba(65,239,229,.18); opacity: 0; animation: contact-location-pulse 2.8s cubic-bezier(.2,.65,.25,1) infinite; }
.location-marker__pulse--two { animation-delay: 1.4s; }
.location-marker__core { position: absolute; inset: 0; display: block; filter: drop-shadow(0 0 7px rgba(121,255,246,.82)) drop-shadow(0 0 21px rgba(56,220,211,.5)) drop-shadow(0 9px 9px rgba(0,0,0,.82)); animation: contact-marker-float 3.5s ease-in-out infinite,contact-marker-neon 3.2s ease-in-out infinite; }
.location-marker__core::after { position: absolute; left: 17px; bottom: -2px; width: 36px; height: 9px; border-radius: 50%; background: rgba(62,232,222,.3); filter: blur(7px); content: ""; opacity: .68; }
.location-marker__core svg { display: block; width: 100%; height: 100%; overflow: visible; }
.location-marker:focus-visible { outline: 1px solid var(--teal-bright); outline-offset: 8px; }
.map-office { position: absolute; z-index: 4; top: 25px; left: 27px; display: flex; align-items: center; gap: 13px; min-width: 190px; padding: 12px 16px 12px 12px; border: 1px solid rgba(94,213,207,.17); border-radius: 8px; background: rgba(2,9,10,.71); backdrop-filter: blur(9px); }
.map-office__glyph { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(93,229,221,.4); border-radius: 50%; color: var(--teal-bright); background: rgba(39,153,150,.15); box-shadow: 0 0 17px rgba(67,195,191,.1); }
.map-office p { margin: 0; line-height: 1.15; }.map-office strong { display: block; color: var(--teal-bright); font-size: .55rem; letter-spacing: .18em; }.map-office b { display: block; margin-top: 6px; color: #f3f8f8; font-size: .83rem; }
.map-panel__bar { position: absolute; z-index: 5; right: 24px; bottom: 22px; left: 24px; min-height: 74px; display: flex; align-items: center; justify-content: space-between; padding: 0 17px 0 21px; border: 1px solid rgba(107,221,215,.18); border-radius: 8px; background: rgba(2,9,10,.82); backdrop-filter: blur(11px); }
.map-address { display: flex; align-items: center; gap: 14px; }.map-address svg { width: 22px; fill: none; stroke: var(--teal-bright); stroke-width: 1.4; }.map-address p { margin: 0; }.map-address strong { display: block; color: var(--teal-bright); font-size: .56rem; letter-spacing: .18em; }.map-address span { display: block; margin-top: 6px; color: #f1f6f6; font-size: .78rem; font-style: normal; }
.map-directions { display: flex; align-items: center; justify-content: space-between; width: 155px; height: 43px; padding: 0 15px 0 18px; border: 1px solid rgba(91,221,215,.55); border-radius: 22px; background: rgba(30,108,107,.23); font-size: .65rem; font-weight: 700; letter-spacing: .04em; transition: border-color .25s,background-color .25s,box-shadow .25s,transform .25s; }
.map-directions svg { width: 17px; fill: none; stroke: var(--teal-bright); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }.map-directions:hover { transform: translateY(-2px); border-color: rgba(109,236,228,.9); background: rgba(43,160,156,.3); box-shadow: 0 0 25px rgba(67,195,191,.14); }

.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .8s ease,transform .9s cubic-bezier(.22,.74,.2,1); }
.js .reveal.is-visible { opacity: 1; transform: translateY(0); }

@keyframes contact-hero-breathe { to { transform: scale(1.035); } }
@keyframes contact-mist { to { transform: translate3d(95px,-14px,0) scale(1.12); opacity: .72; } }
@keyframes contact-route { to { stroke-dashoffset: -152; } }
@keyframes contact-location-pulse { 0%{transform:scale(.55);opacity:0}18%{opacity:.48}100%{transform:scale(2.15);opacity:0} }
@keyframes contact-marker-float { 0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)} }
@keyframes contact-marker-neon { 0%,100%{filter:drop-shadow(0 0 7px rgba(121,255,246,.78)) drop-shadow(0 0 18px rgba(56,220,211,.42)) drop-shadow(0 9px 9px rgba(0,0,0,.82))}50%{filter:drop-shadow(0 0 10px rgba(151,255,249,.95)) drop-shadow(0 0 29px rgba(56,229,220,.66)) drop-shadow(0 9px 9px rgba(0,0,0,.82))} }

@media (max-width: 1060px) {
  .inquiry-layout { grid-template-columns: 1fr; gap: 70px; }.inquiry-copy { max-width: 760px; padding-top: 0; }.location-heading { align-items: start; flex-direction: column; gap: 24px; }.location-heading > p { width: min(100%,720px); }
}

@media (max-width: 780px) {
  .contact-shell { width: min(100% - 38px,1280px); }.site-header { grid-template-columns: 1fr auto; height: 72px; padding: 0 20px; }.site-header .brand { width: 170px; }.site-header .nav { display: none; }.contact-page .site-header .header-action { width: 154px; height: 42px; padding: 0 14px; font-size: .6rem; }
  .contact-hero { min-height: 100svh; }.contact-hero__content { min-height: calc(100svh - 72px); padding: 42px 24px 105px; }.contact-hero h1 { margin-top: 42px; }.contact-hero__actions { flex-direction: column; }.contact-hero__actions .button { width: min(100%,230px); }.contact-hero__meta { left: 24px; bottom: 44px; max-width: 75%; line-height: 1.6; }.contact-hero__scroll { right: 24px; bottom: 41px; }
  .inquiry-section,.contact-location { padding: 95px 0; }.inquiry-form { padding: 32px 23px; }.form-grid { grid-template-columns: 1fr; }.form-field--wide { grid-column: auto; }.form-footer { align-items: stretch; flex-direction: column; }.form-footer .button { width: 100%; }.contact-line { grid-template-columns: 48px 1fr 18px; gap: 14px; }.contact-line strong { font-size: .75rem; }
  .map-panel { min-height: 590px; }.map-panel__bar { align-items: flex-start; flex-direction: column; gap: 15px; padding: 17px; }.map-directions { align-self: flex-end; }.map-address span { max-width: 240px; line-height: 1.5; }.map-label { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js .reveal { opacity: 1; transform: none; }
}

@media (max-width:620px) {
  .contact-hero { min-height: 620px; }
  .contact-hero__media { object-position: 68% center; opacity: .78; animation: none; transform: none; }
  .contact-hero__content { min-height: 550px; padding: 46px 22px 88px; }
  .contact-hero__content > div { max-width: 100%; padding-left: 16px; }
  .contact-hero h1 { margin-top: 38px; font-size: clamp(2rem,10vw,2.65rem); line-height: 1.02; }
  .contact-hero__copy { font-size: .86rem; line-height: 1.7; }
  .contact-hero__actions { width: 100%; }
  .contact-hero__actions .button { width: 100%; }
  .contact-hero__meta,.contact-hero__scroll { display: none; }
  .contact-section { padding: 76px 18px; }
  .contact-grid { grid-template-columns: 1fr !important; gap: 28px; }
  .inquiry-form { padding: 30px 22px; }
  .form-grid { grid-template-columns: 1fr !important; }
  .form-footer { align-items: stretch; flex-direction: column; gap: 18px; }
  .form-footer .button { width: 100%; }
  .map-panel { min-height: 510px; }
  .map-office { top: 16px; left: 16px; min-width: 0; max-width: calc(100% - 32px); }
  .map-panel__bar { right: 14px; bottom: 14px; left: 14px; align-items: flex-start; flex-direction: column; gap: 14px; padding: 16px; }
  .map-address span { max-width: 230px; line-height: 1.45; }
  .location-marker { transform: scale(.82); }
}
