/* Transcending Personal Training
   Contact page only. */


/* ==========================================================================
   Site styles
   ========================================================================== */

.page-home .hero-desc strong {
  color:var(--ink);
}

/* ==========================================================================
   Contact page
   ========================================================================== */

body.contact-a {
  background:#0a0a0a;
}

.contact-a .cpage {
  position:relative;
  color:var(--ink,#fff);
  /* diagonal carbon weave — pure CSS, no image */;
  background-color:#0a0a0a;
  background-image: linear-gradient(27deg, #151515 5px, transparent 5px), linear-gradient(207deg, #151515 5px, transparent 5px), linear-gradient(27deg, #101010 5px, transparent 5px), linear-gradient(207deg, #101010 5px, transparent 5px), linear-gradient(90deg, #0e0e0e 10px, transparent 10px), linear-gradient(#0c0c0c 25%, #090909 25%, #090909 50%, transparent 50%, transparent 75%, #0d0d0d 75%, #0d0d0d);
  background-size:20px 20px;
  background-position:0 3px, 4px 15px, 0 12px, 4px 4px, 0 0, 0 0;
}

.contact-a .cpage::before,
.contact-a .cpage::after {
  content:'';
  position:absolute;
  pointer-events:none;
  border-radius:50%;
  background:radial-gradient(circle, rgba(237,28,36,.10), transparent 62%);
}

.contact-a .cpage::before {
  top:-140px;
  right:-10vw;
  width:52vw;
  height:52vw;
}

.contact-a .cpage::after {
  bottom:8%;
  left:-16vw;
  width:46vw;
  height:46vw;
}

.contact-a .cwrap {
  max-width:1280px;
  margin:0 auto;
  padding:0 5vw;
  position:relative;
  z-index:1;
}

.contact-a .ital {
  font-family:'Lora','Lora Fallback',serif;
  font-style:italic;
  font-weight:400;
  color:var(--red,#ED1C24);
  text-transform:none;
  letter-spacing:0;
}

.contact-a h1,
.contact-a h2 {
  font-family:'Bebas Neue','Bebas Fallback',sans-serif;
  font-weight:400;
  letter-spacing:.02em;
  line-height:.98;
}

.contact-a .chero {
  --nav-overlap: 78px;
  margin-top: calc(-1 * var(--nav-overlap));
  padding: calc(72px + var(--nav-overlap)) 0 44px;
  position: relative;
  overflow: hidden;
  min-height: min(88vh, 760px);
  display: flex;
  align-items: center;
}

@media (max-width: 900px) {
  .contact-a .chero {
    --nav-overlap: 64px;
  }
}

.contact-a .chero > .cwrap {
  width:100%;
}

.contact-a .chero-bg {
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}

.contact-a .chero-bg video,
.contact-a .chero-bg img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 38%;
  filter:none;
}

.contact-a .chero-bg::after {
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(10,10,10,.22) 0%, rgba(10,10,10,.10) 46%, rgba(10,10,10,.04) 100%), linear-gradient(180deg, rgba(10,10,10,.18) 0%, rgba(10,10,10,.04) 45%, rgba(10,10,10,.22) 100%);
}

.contact-a .chero .cwrap {
  position:relative;
  z-index:1;
}

.contact-a .chero h1,
.contact-a .chero .hero-desc,
.contact-a .chero .sec-kicker {
  text-shadow:0 2px 6px rgba(0,0,0,.85), 0 2px 26px rgba(0,0,0,.65);
}

.contact-a .chero-grid {
  display:grid;
  grid-template-columns:1fr 1.05fr;
  gap:56px;
  align-items:start;
}

.contact-a .hero-stars {
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  padding:8px 16px;
  border-radius:100px;
  font-size:.8rem;
  color:#d9d6d2;
  margin-bottom:20px;
}

.contact-a .hero-stars .stars {
  color:#ffb800;
  letter-spacing:2px;
}

.contact-a .chero h1 {
  font-size:clamp(3rem,6.2vw,5.2rem);
  color:#fff;
  margin:6px 0 18px;
}

.contact-a .chero .hero-desc {
  color:#c9c6c2;
  font-size:1.02rem;
  line-height:1.65;
  max-width:520px;
  margin-bottom:26px;
}

.contact-a .chero .hero-desc a {
  color:#fff;
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:rgba(237,28,36,.55);
  text-underline-offset:3px;
}

.contact-a .chero .hero-desc a:hover {
  color:var(--red,#ED1C24);
}

.contact-a .sec-kicker {
  display:inline-block;
  color:var(--red,#ED1C24);
  font-weight:800;
  font-size:.74rem;
  letter-spacing:.22em;
  text-transform:uppercase;
}

.contact-a .cchips {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:26px;
}

.contact-a .cchip {
  display:flex;
  align-items:center;
  gap:13px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1);
  border-radius:14px;
  padding:14px 16px;
  text-decoration:none;
  transition:all .22s;
  position:relative;
  overflow:hidden;
}

.contact-a .cchip::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.06) 50%,transparent 70%);
  transform:translateX(-110%);
  transition:transform .5s ease;
}

.contact-a .cchip:hover {
  border-color:rgba(237,28,36,.55);
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(0,0,0,.5);
}

.contact-a .cchip:hover::after {
  transform:translateX(110%);
}

.contact-a .cchip .ic {
  width:38px;
  height:38px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(237,28,36,.14);
  color:var(--red,#ED1C24);
}

.contact-a .cchip b {
  display:block;
  color:#fff;
  font-size:.85rem;
}

.contact-a .cchip span {
  display:block;
  color:#a9a6a2;
  font-size:.74rem;
  margin-top:2px;
}

.contact-a .hero-mark {
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:4px;
}

.contact-a .hero-mark img {
  width:58px;
  height:58px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(237,28,36,.6);
}

.contact-a .hero-mark b {
  display:block;
  color:#fff;
  font-size:.9rem;
}

.contact-a .hero-mark span {
  display:block;
  color:#9c9995;
  font-size:.76rem;
}

.contact-a .calpanel {
  position:relative;
  border-radius:22px;
  padding:22px;
  background: linear-gradient(145deg,#161616,#0d0d0d);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 0 0 1px rgba(0,0,0,.6), 0 30px 70px rgba(0,0,0,.6), 0 0 60px rgba(237,28,36,.07);
}

.contact-a .calpanel::before {
  /* fine weave on the plate itself */;
  content:'';
  position:absolute;
  inset:0;
  border-radius:22px;
  opacity:.5;
  pointer-events:none;
  background-image: radial-gradient(rgba(0,0,0,.55) 15%, transparent 16%), radial-gradient(rgba(0,0,0,.55) 15%, transparent 16%), radial-gradient(rgba(255,255,255,.05) 15%, transparent 20%), radial-gradient(rgba(255,255,255,.05) 15%, transparent 20%);
  background-size:12px 12px;
  background-position:0 0,6px 6px,0 1px,6px 7px;
}

.contact-a .calpanel::after {
  content:'';
  position:absolute;
  inset:-1px;
  border-radius:23px;
  pointer-events:none;
  background:linear-gradient(140deg,rgba(237,28,36,.5),transparent 30%,transparent 70%,rgba(237,28,36,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite:exclude;
  padding:1px;
}

.contact-a .cal-head {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:4px 6px 16px;
}

.contact-a .cal-head h2 {
  font-size:1.6rem;
  color:#fff;
}

.contact-a .cal-live {
  display:inline-flex;
  align-items:center;
  gap:7px;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.14em;
  color:#7CFC9B;
  text-transform:uppercase;
}

.contact-a .cal-live i {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#37e26a;
  box-shadow:0 0 10px #37e26a;
  animation:apulse 1.6s infinite;
}

@keyframes apulse { 50%{opacity:.4} }

.contact-a .cal-frame {
  position:relative;
  border-radius:14px;
  overflow:hidden;
  background:#111;
  min-height:620px;
}

.contact-a .cal-frame iframe {
  display:block;
  width:100%;
  height:620px;
  border:0;
  background:#fff;
}

.contact-a .cal-gate {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  width:100%;
  border:0;
  cursor:pointer;
  color:#fff;
  text-align:center;
  padding:32px 20px;
  background: radial-gradient(circle at 50% 40%, rgba(237,28,36,.22), transparent 55%), linear-gradient(180deg,#1a1a1a,#0d0d0d);
}

.contact-a .cal-gate b {
  font-family:'Bebas Neue','Bebas Fallback',sans-serif;
  font-size:2rem;
  letter-spacing:.04em;
  display:block;
}

.contact-a .cal-gate span {
  color:#b9b6b2;
  font-size:.9rem;
  max-width:280px;
}

.contact-a .cal-gate em {
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  background:var(--red-dark);
  color:#fff;
  font-style:normal;
  font-weight:800;
  font-size:.88rem;
  padding:12px 22px;
  border-radius:100px;
}

.contact-a .cal-foot {
  position:relative;
  display:flex;
  flex-wrap:wrap;
  gap:8px 18px;
  padding:14px 6px 2px;
  font-size:.76rem;
  color:#a9a6a2;
}

.contact-a .cal-foot svg {
  color:var(--red,#ED1C24);
  vertical-align:-2px;
  margin-right:5px;
}

.contact-a .cflow {
  padding:26px 0 10px;
  display:grid;
  grid-template-columns:.9fr 1.4fr;
  gap:26px;
  align-items:stretch;
}

.contact-a .cflow-photo {
  position:relative;
  border-radius:20px;
  overflow:hidden;
  min-height:340px;
  border:1px solid rgba(255,255,255,.1);
}

.contact-a .cflow-photo img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:grayscale(.25) contrast(1.06);
}

.contact-a .cflow-photo::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(10,10,10,.1) 30%,rgba(10,10,10,.92));
}

.contact-a .cflow-photo .cap {
  position:absolute;
  left:18px;
  right:18px;
  bottom:16px;
  z-index:1;
}

.contact-a .cflow-photo .cap b {
  font-family:'Bebas Neue','Bebas Fallback',sans-serif;
  font-size:1.5rem;
  color:#fff;
  letter-spacing:.03em;
}

.contact-a .cflow-photo .cap span {
  display:block;
  color:#c9c6c2;
  font-size:.8rem;
  margin-top:4px;
}

.contact-a .cflow-photo .cap span a {
  color:#fff;
}

.contact-a .cflow-map {
  position:relative;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  min-height:340px;
  background:#111;
}

.contact-a .cflow-map iframe {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  filter:invert(.92) hue-rotate(185deg) saturate(.4) brightness(.92) contrast(.95);
}

.contact-a .cflow-map .badge {
  position:absolute;
  z-index:2;
  top:14px;
  left:14px;
  background:rgba(10,10,10,.88);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:10px 16px;
}

.contact-a .cflow-map .badge b {
  display:block;
  font-family:'Bebas Neue','Bebas Fallback',sans-serif;
  letter-spacing:.06em;
  color:#fff;
  font-size:1rem;
}

.contact-a .cflow-map .badge span {
  color:#a9a6a2;
  font-size:.7rem;
}

.contact-a .cpins {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:16px 0 0;
}

.contact-a .cpins a {
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.74rem;
  font-weight:700;
  color:#d9d6d2;
  text-decoration:none;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.1);
  border-radius:100px;
  padding:7px 14px;
  transition:all .2s;
}

.contact-a .cpins a:hover {
  color:#fff;
  border-color:rgba(237,28,36,.55);
  background:rgba(237,28,36,.12);
}

.contact-a .cpins svg {
  color:var(--red,#ED1C24);
}

.contact-a .cfaq {
  padding:52px 5vw 30px;
  max-width:820px;
  margin:0 auto;
}

.contact-a .cfaq h2 {
  font-size:clamp(1.9rem,3.4vw,2.7rem);
  color:#fff;
  margin:8px 0 24px;
  text-align:center;
}

.contact-a .cfaq .sec-kicker {
  display:block;
  text-align:center;
}

.contact-a .cfaq .faq-item {
  border-bottom:1px solid rgba(255,255,255,.1);
}

.contact-a .cfaq .faq-q {
  padding:18px 4px 8px;
  color:#fff;
  font-family:inherit;
  font-weight:700;
  font-size:.95rem;
  letter-spacing:normal;
  line-height:1.4;
}

.contact-a .cfaq .faq-a {
  padding:0 4px 20px;
  color:#b9b6b2;
  font-size:.9rem;
  line-height:1.65;
}

.contact-a .cfaq .faq-a a {
  color:#fff;
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:rgba(237,28,36,.55);
  text-underline-offset:3px;
}

.contact-a .ccta {
  text-align:center;
  padding:34px 0 90px;
}

.contact-a .ccta h2 {
  font-size:clamp(2rem,4vw,3rem);
  color:#fff;
  margin:10px 0 12px;
}

.contact-a .ccta p {
  color:#b9b6b2;
  margin-bottom:24px;
}

.contact-a .ccta .btn-red {
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:var(--red,#ED1C24);
  color:#fff;
  font-weight:800;
  font-size:.92rem;
  padding:16px 32px;
  border-radius:100px;
  text-decoration:none;
  transition:all .2s;
  box-shadow:0 10px 34px rgba(237,28,36,.35);
}

.contact-a .ccta .btn-red:hover {
  background:var(--red-d,#c4141b);
  transform:translateY(-2px);
}

@media (max-width:1024px) {
  .contact-a .chero-grid {
    grid-template-columns:1fr;
    gap:34px;
  }

  .contact-a .cflow {
    grid-template-columns:1fr;
  }

  .contact-a .cflow-photo {
    min-height:280px;
  }
}

@media (max-width:560px) {
  .contact-a .cchips {
    grid-template-columns:1fr;
  }

  .contact-a .cal-frame iframe {
    height:540px;
  }

  .contact-a .calpanel {
    padding:14px;
  }
}

.contact-a .wb {
  position:relative;
  background:#faf9f7;
  color:#17171a;
  z-index:1;
}

.contact-a .wb::before {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.55;
  background-image:radial-gradient(rgba(23,23,26,.05) 1px, transparent 1.5px);
  background-size:22px 22px;
}

.contact-a .wb > * {
  position:relative;
}

.contact-a .wb h2 {
  color:#17171a;
}

.contact-a .wb-head {
  padding:64px 5vw 8px;
}

.contact-a .wb-head h2 {
  font-size:clamp(2.2rem,4.2vw,3.4rem);
  margin:8px 0 10px;
}

.contact-a .wb-sub {
  color:#55555c;
  font-size:.95rem;
  max-width:520px;
}

.contact-a .wb-sub a {
  color:#17171a;
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:rgba(237,28,36,.5);
  text-underline-offset:3px;
}

.contact-a .wb .cflow {
  padding-top:20px;
}

.contact-a .wb .cflow-photo,
.contact-a .wb .cflow-map {
  border-color:#eae4de;
  box-shadow:0 20px 55px rgba(23,23,26,.14);
}

.contact-a .wb .cflow-map .badge {
  background:#fff;
  border-color:#eee;
  box-shadow:0 8px 24px rgba(23,23,26,.14);
}

.contact-a .wb .cflow-map .badge b {
  color:#17171a;
}

.contact-a .wb .cflow-map .badge span {
  color:#75757c;
}

.contact-a .wb .cflow-map iframe {
  filter:none;
}

.contact-a .wb .cpins a {
  color:#3d3d42;
  background:#fff;
  border:1px solid #e8e2dc;
}

.contact-a .wb .cpins a:hover {
  color:#17171a;
  border-color:rgba(237,28,36,.5);
  background:#fff1f2;
}

.contact-a .wb .cfaq .faq-q {
  color:#17171a;
}

.contact-a .wb .cfaq .faq-item {
  border-bottom-color:#e8e2dc;
}

.contact-a .wb .cfaq .faq-a {
  color:#55555c;
}

.contact-a .wb .cfaq .faq-a a {
  color:#17171a;
  text-decoration-color:rgba(237,28,36,.5);
}

.contact-a .wb-diag {
  clip-path:polygon(0 72px, 100% 0, 100% calc(100% - 72px), 0 100%);
  padding:130px 0 150px;
  margin:26px 0 -26px;
}

.contact-a .wb-diag .cfaq {
  padding-top:56px;
  padding-bottom:8px;
}

.contact-a .ccta {
  padding-top:96px;
}

@media (max-width:700px) {
  .contact-a .wb-diag {
    clip-path:polygon(0 36px,100% 0,100% calc(100% - 36px),0 100%);
    padding:90px 0 110px;
  }
}

/* ==========================================================================
   Page fixes
   ========================================================================== */

.contact-a a.link-strong-white {
  color:#fff;
  font-weight:700;
}

/* decorative glows were pushing the page 144px wider than the screen */
.contact-a .cpage {
  overflow-x:clip;
}

/* Phones/tablets: background photo at its natural shape across the top, fading into the dark page,
   instead of being stretched ~8x behind the whole tall hero. */
@media (max-width:1020px) {
  .contact-a .chero-bg {
    background:#0b0b0b;
  }
  .contact-a .chero-bg img {
    height:auto;
    aspect-ratio:16/9;
    -webkit-mask-image:linear-gradient(180deg,#000 65%,transparent);
    mask-image:linear-gradient(180deg,#000 65%,transparent);
  }
}

/* ---------- Message form (lead inbox, 2026-10-16) ---------- */
.contact-a .cmsg {
  padding:40px 5vw 70px;
}

.contact-a .cmsg-grid {
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:48px;
  align-items:start;
}

.contact-a .cmsg-copy h2 {
  font-size:clamp(2rem,4vw,3rem);
  color:#fff;
  margin:10px 0 14px;
}

.contact-a .cmsg-copy p {
  color:#b9b6b2;
  max-width:44ch;
}

.contact-a .cmsg-form,
.contact-a .cmsg + .lead-thanks,
.contact-a .cmsg .lead-thanks {
  border-radius:22px;
  padding:26px;
  background:linear-gradient(145deg,#161616,#0d0d0d);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 30px 70px rgba(0,0,0,.6);
  display:grid;
  gap:16px;
}

.contact-a .cmsg-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.contact-a .cmsg-f {
  display:grid;
  gap:7px;
}

.contact-a .cmsg-f label {
  color:#d9d6d2;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.02em;
}

.contact-a .cmsg-f input,
.contact-a .cmsg-f select,
.contact-a .cmsg-f textarea {
  width:100%;
  background:#0b0b0b;
  color:#fff;
  border:1px solid rgba(255,255,255,.16);
  border-radius:12px;
  padding:13px 14px;
  font:inherit;
  font-size:1rem;
}

.contact-a .cmsg-f textarea {
  resize:vertical;
  min-height:110px;
}

.contact-a .cmsg-f input:focus,
.contact-a .cmsg-f select:focus,
.contact-a .cmsg-f textarea:focus {
  outline:2px solid var(--red,#ED1C24);
  outline-offset:1px;
  border-color:transparent;
}

.contact-a .cmsg-f [aria-invalid="true"] {
  border-color:var(--red,#ED1C24);
}

.contact-a .cmsg-send {
  justify-self:start;
  background:var(--red-dark);
  color:#fff;
  font-weight:800;
  font-size:.92rem;
  padding:15px 30px;
  border:0;
  border-radius:100px;
  cursor:pointer;
  box-shadow:0 10px 34px rgba(237,28,36,.35);
  transition:background .2s, transform .2s;
}

.contact-a .cmsg-send:hover {
  background:var(--red-d,#c4141b);
  transform:translateY(-2px);
}

.contact-a .cmsg-send:disabled {
  opacity:.7;
  transform:none;
}

.contact-a .cmsg-fine,
.contact-a .cmsg .lead-status {
  color:#9c9995;
  font-size:.8rem;
  margin:0;
}

.contact-a .cmsg .lead-status.is-error {
  color:#ff8a8f;
}

.contact-a .cmsg .lead-thanks__h {
  color:#fff;
  font-size:1.6rem;
  font-weight:800;
  margin:0;
}

.contact-a .cmsg .lead-thanks p {
  color:#d9d6d2;
  margin:0;
}

@media (max-width:860px) {
  .contact-a .cmsg-grid {
    grid-template-columns:1fr;
    gap:22px;
  }
}

@media (max-width:520px) {
  .contact-a .cmsg-row {
    grid-template-columns:1fr;
  }

  .contact-a .cmsg-form {
    padding:20px;
  }

  .contact-a .cmsg-send {
    justify-self:stretch;
  }
}


.contact-a .cal-head h2 .ital {
  color:var(--red-dark);
}