/* ZUUL FX CONTACT V1.50 — direct professional contact */
.page-contact {
  background:#050505;
  color:#efefef;
}

.contact-hero-v150 {
  position:relative;
  min-height:580px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  border-bottom:1px solid #242424;
  background:
    linear-gradient(to right,rgba(0,0,0,.97) 0%,rgba(0,0,0,.78) 48%,rgba(0,0,0,.34) 100%),
    url('../img/hero-band.jpg') center 28% / cover no-repeat;
}
.contact-hero-v150 .container {
  position:relative;
  z-index:2;
  padding-bottom:76px;
}
.contact-kicker {
  color:#d71919;
  font-size:16px;
  font-weight:bold;
  letter-spacing:3px;
  text-transform:uppercase;
}
.contact-hero-v150 h1 {
  margin:10px 0 0;
  font-size:96px;
}
.contact-hero-v150 p {
  max-width:820px;
  margin:22px 0 0;
  color:#c8c8c8;
  font-size:20px;
  line-height:1.72;
}

.contact-section-v150 {
  padding:88px 0;
  border-bottom:1px solid #232323;
}
.contact-section-v150--red {
  background:
    radial-gradient(circle at 84% 16%,rgba(145,10,10,.15),rgba(0,0,0,0) 31%),
    #080606;
}

.contact-main-grid {
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:28px;
  align-items:stretch;
}
.contact-main-card,
.contact-access-card {
  border:1px solid #303030;
  background:#090909;
  padding:36px;
}
.contact-main-card .meta,
.contact-access-card .meta {
  color:#d71919;
  font-size:12px;
  font-weight:bold;
  letter-spacing:1.5px;
  text-transform:uppercase;
}
.contact-main-card h2,
.contact-access-card h2 {
  margin:10px 0 0;
  font-size:50px;
}
.contact-name {
  margin-top:24px;
  font-size:27px;
  font-weight:bold;
  text-transform:uppercase;
}
.contact-main-card p,
.contact-access-card p {
  margin:14px 0 0;
  color:#aaa;
  font-size:17px;
  line-height:1.72;
}
.contact-email {
  display:inline-block;
  margin-top:22px;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  text-decoration:none;
  border-bottom:1px solid #7d1717;
  padding-bottom:4px;
}
.contact-email:hover { color:#d71919; }

.contact-actions-v150 {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:26px;
}
.contact-actions-v150 a {
  display:inline-block;
  padding:14px 17px;
  border:1px solid #343434;
  color:#eee;
  text-decoration:none;
  font-size:12px;
  font-weight:bold;
  letter-spacing:1px;
  text-transform:uppercase;
}
.contact-actions-v150 a.primary {
  background:#a81111;
  border-color:#c01818;
}
.contact-actions-v150 a:hover {
  border-color:#d71919;
}

.contact-purpose-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:28px;
}
.contact-purpose {
  border:1px solid #2b2b2b;
  background:#080808;
  padding:26px;
}
.contact-purpose strong {
  display:block;
  color:#f1f1f1;
  font-size:20px;
  text-transform:uppercase;
}
.contact-purpose span {
  display:block;
  margin-top:8px;
  color:#9d9d9d;
  font-size:15px;
  line-height:1.65;
}

.contact-links-head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:36px;
  margin-bottom:30px;
}
.contact-links-head h2 {
  margin:0;
  font-size:56px;
}
.contact-links-head p {
  max-width:540px;
  margin:0;
  color:#9f9f9f;
  font-size:17px;
  line-height:1.7;
}
.contact-social-row {
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}
.contact-social-row a {
  display:block;
  text-align:center;
  border:1px solid #2d2d2d;
  background:#080808;
  padding:19px 10px;
  color:#eee;
  text-decoration:none;
  font-size:13px;
  font-weight:bold;
  letter-spacing:1px;
  text-transform:uppercase;
}
.contact-social-row a:hover {
  border-color:#a71818;
  color:#d71919;
}

.page-contact h1.zfx-title-svg,
.page-contact h2.zfx-title-svg {
  justify-content:flex-start;
  text-align:left;
}
.page-contact .zfx-title-svg .zfx-char-accent {
  color:#d71919 !important;
}
.page-contact .zfx-title-svg .zfx-char:not(.zfx-char-accent) {
  color:#f1f1f1 !important;
}

@media screen and (max-width:900px) {
  .contact-main-grid { grid-template-columns:1fr; }
  .contact-purpose-grid { grid-template-columns:1fr 1fr; }
  .contact-social-row { grid-template-columns:1fr 1fr 1fr; }
}
@media screen and (max-width:700px) {
  .contact-links-head { display:block; }
  .contact-links-head p { margin-top:14px; }
}
@media screen and (max-width:560px) {
  .contact-hero-v150 { min-height:520px; }
  .contact-hero-v150 h1 { font-size:62px; }
  .contact-hero-v150 p { font-size:17px; }
  .contact-section-v150 { padding:68px 0; }
  .contact-main-card,
  .contact-access-card { padding:28px 22px; }
  .contact-main-card h2,
  .contact-access-card h2,
  .contact-links-head h2 { font-size:40px; }
  .contact-email { font-size:19px; word-break:break-word; }
  .contact-purpose-grid,
  .contact-social-row { grid-template-columns:1fr; }
}