/**
 * Verizons brand
 * Logo: Verizon-style check + "S" (signature red)
 * UI theme / wordmark: classic blue
 */
:root {
  --vz-red: #EE0000;
  --vz-red-dark: #CD040B;
  --blue: #1A4DBE;
  --blue-bright: #2F6FF0;
  --navy: #0A1023;
  --navy-2: #131B36;
  --emerald: #055C2D;
  --emerald-bright: #12B76A;
  --gold: #C7963C;
  --danger: #D0432B;
  --para: #5B6480;
  --border: #E7EAF2;
  --bg: #F4F6FA;
  --card: #FFFFFF;
}

.vz-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: inherit;
  line-height: 1;
}

.vz-check {
  position: relative;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
}
.vz-check::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 14px;
  width: 12px;
  height: 5px;
  background: var(--vz-red);
  border-radius: 2px;
  transform: rotate(45deg);
  transform-origin: center;
}
.vz-check::after {
  content: '';
  position: absolute;
  left: 10px;
  top: 8px;
  width: 22px;
  height: 6px;
  background: var(--vz-red);
  border-radius: 2px;
  transform: rotate(-48deg);
  transform-origin: left center;
}

.vz-s {
  font-family: 'Jost', Arial, Helvetica, sans-serif;
  font-weight: 800;
  font-size: 28px;
  color: var(--vz-red);
  letter-spacing: -1px;
  line-height: 1;
  margin-left: -2px;
}

.vz-word {
  font-family: 'Jost', Arial, Helvetica, sans-serif;
  font-weight: 800;
  font-size: 60px;
  color: var(--blue-bright);
  letter-spacing: -0.4px;
}
.vz-logo.on-dark .vz-word { color: #ffffff; }
.vz-logo.on-dark .vz-check::before,
.vz-logo.on-dark .vz-check::after { background: #FF2A2A; }
.vz-logo.on-dark .vz-s { color: #FF2A2A; }

.vz-logo.sm { gap: 7px; }
.vz-logo.sm .vz-check { width: 28px; height: 28px; }
.vz-logo.sm .vz-check::before { left: 3px; top: 11px; width: 9px; height: 4px; }
.vz-logo.sm .vz-check::after { left: 8px; top: 6px; width: 17px; height: 4.5px; }
.vz-logo.sm .vz-s { font-size: 20px; }
.vz-logo.sm .vz-word { font-size: 16px; }

.vz-logo.lg { gap: 12px; }
.vz-logo.lg .vz-check { width: 48px; height: 48px; }
.vz-logo.lg .vz-check::before { left: 5px; top: 18px; width: 16px; height: 6px; }
.vz-logo.lg .vz-check::after { left: 13px; top: 10px; width: 28px; height: 7px; }
.vz-logo.lg .vz-s { font-size: 36px; }
.vz-logo.lg .vz-word { font-size: 26px; }

.brand-mark, .mark, .logo-s { display: none !important; }

.btn-primary, .btn.btn-primary, button.btn-primary, .cmn-btn {
  background: var(--blue-bright) !important;
  border-color: var(--blue-bright) !important;
  color: #fff !important;
}
.btn-primary:hover, .cmn-btn:hover { background: var(--blue) !important; }
