/* Investor Relations integration.
   The IR pages keep their own design: typography, colours, banners, accordions, document
   lists, tables, forms and layout come from the IR stylesheet (ir.css) and are NOT restyled
   here. This file only:
     1. presents the IR secondary navigation (.vz-irnav) as a purple extension attached to
        the bottom of the global header bar, in the same style as the global menu,
     2. reserves the space the two bars occupy,
     3. fixes responsive overflow.
   Everything is scoped to body.vz-ir (or .vz-irnav) so nothing here affects the main website. */

/* ---------------------------------------------------------------- the IR bar as an extension of the header
   The global bar loses its bottom corners on IR pages and the IR bar hangs directly beneath
   it at the same width, so the two read as one component. --vz-ir-top is kept in step with
   the real bottom edge of the global bar by vz-ir.js; the fallbacks cover the first paint. */
body.vz-ir .vz-bar { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
body.vz-ir #page-container { padding-top: 0 !important; }
body.vz-ir #menu-header { position: fixed !important; top: var(--vz-ir-top, 73px) !important; left: 0 !important; right: 0 !important; width: auto !important; margin: 0 !important; padding: 0 20px !important; background: transparent !important; box-shadow: none !important; z-index: 9980 !important; overflow: visible !important; pointer-events: none; }
body.vz-ir .et_pb_sticky_placeholder { display: none !important; }       /* the bar is always pinned, so IR's own spacer is not needed */
body.vz-ir #vz-main { height: var(--vz-ir-space, 128px); }
.vz-ir-crumbs { padding-top: 12px; padding-bottom: 12px; font-family: "Open Sans", sans-serif; }

.vz-irnav { position: relative; max-width: 1280px; margin: 0 auto; background: #280e47; border-radius: 0 0 12px 12px; box-shadow: 0 6px 16px rgba(40, 14, 71, .18); font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 400; line-height: 1.5; text-align: left; pointer-events: auto; }
.vz-irnav * { box-sizing: border-box; }
.vz-irnav ul { list-style: none !important; margin: 0 !important; padding: 0 !important; }

/* the row: same item metrics as the global menu; scrolls sideways when it does not fit */
/* Side padding is the global bar's (18px; 12px on small screens) plus 2px, as requested: the first
   label sits just inside the logo's left edge and the last arrow just inside the Sign Up button's right edge. The items carry their
   own inner padding (11px before the label, 6px after the arrow), which is taken off here. */
.vz-irnav .vz-irnav-list { display: flex; flex-wrap: nowrap; align-items: center; gap: 2px; padding: 5px 15px 5px 10px !important; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; border-radius: 0 0 12px 12px; }
.vz-irnav-list::-webkit-scrollbar { display: none; }
/* an item's link and its arrow button share ONE highlight, drawn on the item itself, so the two never overlap */
.vz-irnav-item { position: static; display: flex; flex: 0 0 auto; align-items: center; margin: 0; padding: 0; border-radius: 8px; transition: background-color .12s; }
.vz-irnav-item:hover, .vz-irnav-item.is-open, .vz-irnav-item:focus-within { background: rgba(255, 255, 255, .14); }
.vz-irnav-item:first-child { margin-right: auto; }                 /* "Investor" stays on the left */
.vz-irnav a, .vz-irnav button { font-family: "Open Sans", sans-serif; text-decoration: none; }
.vz-irnav button { margin: 0; border: 0; background: none; cursor: pointer; text-transform: none; letter-spacing: 0; }
.vz-irnav .vz-irnav-top { display: inline-flex; align-items: center; gap: 6px; padding: 8px 11px; border-radius: 8px; color: #fff !important; font-size: 15.4px; font-weight: 600; line-height: 1.5; white-space: nowrap; }
.vz-irnav-item.has-drop > a.vz-irnav-top { padding-right: 3px; }
.vz-irnav .vz-irnav-caret { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 37px; margin: 0; padding: 0 6px 0 0; color: #fff; background: transparent; border-radius: 0 8px 8px 0; }
.vz-irnav button.vz-irnav-top::after, .vz-irnav .vz-irnav-caret::after { content: ""; display: inline-block; width: 5px; height: 5px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .15s; }
.vz-irnav .vz-irnav-toggle[aria-expanded="true"]::after { transform: translateY(1px) rotate(225deg); }
.vz-irnav .vz-irnav-top, .vz-irnav .vz-irnav-top:hover, .vz-irnav .vz-irnav-caret:hover, .vz-irnav .vz-irnav-top:focus, .vz-irnav .vz-irnav-caret:focus { background: transparent; color: #fff !important; }
.vz-irnav-item.is-current { box-shadow: inset 0 -2px 0 #fff; border-radius: 8px 8px 0 0; }
.vz-irnav a:focus-visible, .vz-irnav button:focus-visible { outline: 2px solid #fff; outline-offset: 1px; }
/* soft edge when more items are off-screen to the right or left */
.vz-irnav::before, .vz-irnav::after { content: ""; position: absolute; top: 0; bottom: 0; width: 36px; pointer-events: none; opacity: 0; transition: opacity .15s; z-index: 1; }
.vz-irnav::before { left: 0; border-radius: 0 0 0 12px; background: linear-gradient(90deg, #280e47 20%, rgba(40, 14, 71, 0)); }
.vz-irnav::after { right: 0; border-radius: 0 0 12px 0; background: linear-gradient(270deg, #280e47 20%, rgba(40, 14, 71, 0)); }
.vz-irnav.can-scroll-left::before, .vz-irnav.can-scroll-right::after { opacity: 1; }

/* dropdowns: the same panel style as the global menu. They are positioned against the bar
   itself (not the scrolling row), so the row's horizontal scrolling never clips them. */
.vz-irnav-drop { display: none; position: absolute; top: calc(100% + 6px); left: 0; z-index: 5; width: max-content; min-width: 230px; max-width: 100%; padding: 8px; background: #fff; border: 1px solid #e4e2ea; border-radius: 12px; box-shadow: 0 10px 28px rgba(40, 14, 71, .12); }
.vz-irnav-drop--2 { width: min(520px, 100%); grid-template-columns: 1fr 1fr; gap: 0 20px; padding: 12px; }
.vz-irnav-item.is-open > .vz-irnav-drop { display: block; }
.vz-irnav-item.is-open > .vz-irnav-drop--2 { display: grid; }
.vz-irnav-drop a { display: block; padding: 7px 10px; border-radius: 7px; color: #280e47 !important; font-size: 14px; font-weight: 500; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
.vz-irnav-drop a:hover, .vz-irnav-drop a:focus-visible { background: #f7eef5; color: #812e77 !important; }
.vz-irnav-drop a[aria-current="page"] { color: #812e77 !important; font-weight: 700; }
.vz-irnav-drop a:focus-visible { outline: 2px solid #812e77; }
.vz-irnav-head { margin: 0 !important; padding: 0 !important; }
.vz-irnav-head a { font-weight: 700; }
.vz-irnav-col { min-width: 0; }
.vz-irnav-col + .vz-irnav-col { border-left: 1px solid #e4e2ea; padding-left: 20px; }

/* ---------------------------------------------------------------- tablet and mobile */
@media (max-width: 1180px) {
  body.vz-ir #menu-header { padding: 0 10px !important; top: var(--vz-ir-top, 67px) !important; }
  body.vz-ir #vz-main { height: var(--vz-ir-space, 120px); }
  .vz-irnav .vz-irnav-list { padding: 4px 7px 4px 4px !important; }
  .vz-irnav .vz-irnav-caret { width: 34px; height: 40px; padding-right: 8px; }
}
/* Phones: a compact, expandable IR menu. The purple bar stays attached under the global bar
   but shows one button; tapping it opens the IR categories as an accordion, and each category
   with sub-pages expands on its own. Nothing scrolls sideways. */
.vz-irnav-menu { display: none; }
@media (max-width: 767px) {
  .vz-irnav .vz-irnav-menu { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 8px 14px; color: #fff; font-size: 15.4px; font-weight: 600; line-height: 1.4; text-align: left; border-radius: 0 0 12px 12px; }
  .vz-irnav-menu-label { flex: 0 0 auto; }
  .vz-irnav-menu-cur { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: right; font-weight: 400; opacity: .85; }
  .vz-irnav .vz-irnav-menu::after { content: ""; flex: 0 0 auto; width: 6px; height: 6px; margin: 0 4px 3px 2px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform .15s; }
  .vz-irnav .vz-irnav-menu[aria-expanded="true"]::after { transform: translateY(3px) rotate(225deg); }
  .vz-irnav::before, .vz-irnav::after { display: none; }
  .vz-irnav .vz-irnav-list { display: none; }
  .vz-irnav.is-menu-open .vz-irnav-list { display: block; padding: 6px 6px 8px !important; max-height: calc(100vh - var(--vz-ir-top, 67px) - 60px); max-height: calc(100dvh - var(--vz-ir-top, 67px) - 60px); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; border-top: 1px solid rgba(255, 255, 255, .18); }
  .vz-irnav-item { flex-wrap: wrap; width: 100%; }
  .vz-irnav-item:first-child { margin-right: 0; }
  .vz-irnav-item + .vz-irnav-item { margin-top: 2px; }
  .vz-irnav .vz-irnav-top { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 10px 12px; white-space: normal; }
  .vz-irnav button.vz-irnav-top { justify-content: space-between; width: 100%; padding-right: 20px; text-align: left; }
  .vz-irnav .vz-irnav-caret { flex: 0 0 48px; width: 48px; height: 44px; padding: 0; }
  .vz-irnav-item.is-current { box-shadow: inset 3px 0 0 #fff; border-radius: 8px; }
  .vz-irnav-drop, .vz-irnav-drop--2 { position: static; flex: 0 0 100%; left: auto !important; width: 100%; min-width: 0; max-width: none; margin: 0 0 6px; padding: 6px; box-shadow: none; }
  .vz-irnav-item.is-open > .vz-irnav-drop--2 { display: block; }
  .vz-irnav-col + .vz-irnav-col { border-left: 0; padding-left: 0; border-top: 1px solid #e4e2ea; margin-top: 6px; padding-top: 6px; }
  .vz-irnav-drop a { padding: 11px 10px; }
}
@media (max-width: 980px) {
  /* wide tables scroll inside their own box instead of widening the page; the data is untouched */
  body.vz-ir #et-main-area table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body.vz-ir #et-main-area img, body.vz-ir #et-main-area iframe { max-width: 100%; }
  body.vz-ir #et-main-area a { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) { .vz-irnav *::after, .vz-irnav::before, .vz-irnav::after { transition: none !important; } }
/* /ir/ Key Platforms: the Vertoz Group cards, as on About Us (logo in a raised panel above the card, description below) */
.vz-ir-group { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; max-width: 1180px; margin: 30px auto 0; padding: 60px 20px 0; }
.vz-ir-gcard { position: relative; display: block; padding: 96px 30px 36px; border-radius: 22px; background: #f6f4f9; color: #333 !important; text-align: center; text-decoration: none !important; transition: transform .2s, box-shadow .2s; }
.vz-ir-gcard:hover, .vz-ir-gcard:focus-visible { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(40, 14, 71, .12); }
.vz-ir-gcard:focus-visible { outline: 2px solid #812e77; outline-offset: 3px; }
.vz-ir-glogo { position: absolute; top: -52px; left: 11%; right: 11%; display: flex; align-items: center; justify-content: center; height: 112px; padding: 14px 22px; border-radius: 18px; background: #fff; box-shadow: 0 10px 28px rgba(40, 14, 71, .1); }
.vz-ir-glogo img { display: block; max-width: 100%; max-height: 78px; width: auto; height: auto; object-fit: contain; }
.vz-ir-gcard p { margin: 0; padding: 0 !important; font-family: "Open Sans", sans-serif; font-size: 17px; line-height: 1.6; color: #333; }
@media (max-width: 980px) { .vz-ir-group { grid-template-columns: 1fr; gap: 76px; max-width: 560px; } }

/* /ir/ only: the hero image runs up behind the header and IR bar; the breadcrumbs sit on it */
body.vz-ir-home .vz-ir-crumbs { position: absolute; left: 0; right: 0; top: var(--vz-ir-space, 128px); z-index: 20; margin: 0 auto !important; padding-top: calc(var(--vz-crumb-top, 12px) + 8px) !important; }
body.vz-ir-home .vz-ir-crumbs a, body.vz-ir-home .vz-ir-crumbs li + li::before { color: rgba(255, 255, 255, .85) !important; }
body.vz-ir-home .vz-ir-crumbs [aria-current="page"] { color: #fff !important; }
/* on a busy photo the trail sits in a frosted dark pill so it stays readable */
body.vz-ir-home .vz-ir-crumbs ol { display: inline-flex !important; width: auto; padding: 7px 16px !important; border-radius: 999px; background: rgba(28, 11, 51, .62) !important; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 6px 18px rgba(0, 0, 0, .18); text-shadow: none; }
body.vz-ir-home .vz-ir-crumbs a, body.vz-ir-home .vz-ir-crumbs li + li::before { color: rgba(255, 255, 255, .8) !important; }
body.vz-ir-home .et_pb_section_2.et_pb_fullwidth_section { margin-top: calc(-1 * var(--vz-ir-space, 128px)) !important; }
body.vz-ir-home .et_pb_fullwidth_header_0 { position: relative; }
body.vz-ir-home .et_pb_fullwidth_header_0::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 320px; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(28, 11, 51, .62), rgba(28, 11, 51, .25) 55%, rgba(28, 11, 51, 0)); }
/* The IR menu bar and the hero photo share one Divi layer (z-index 1); the IR home breadcrumbs sit
   above it so they show over the photo, which also put them over the open IR dropdowns. They fade
   out while an IR dropdown is open, so the dropdown is never covered. */
body.vz-ir-home .vz-ir-crumbs { transition: opacity .15s, visibility .15s; }
body.vz-ir-home:has(#menu-header [aria-expanded="true"]) .vz-ir-crumbs { opacity: 0; visibility: hidden; }

/* Investor Relations contact form (CF7 form 5) */
.vz-irf { container-type: inline-size; max-width: 760px; font-family: "Open Sans", sans-serif; color: #1d1a33; }
.vz-irf fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.vz-irf legend { padding: 0; }
.vz-irf-q legend { margin-bottom: 10px; font-weight: 700; font-size: 17px; }
.vz-irf-q .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 10px; }
.vz-irf-q .wpcf7-list-item { display: inline-flex; align-items: center; gap: 8px; margin: 0 !important; padding: 9px 18px; border: 1px solid #d8d3e3; border-radius: 999px; background: #fff; cursor: pointer; font-weight: 600; font-size: 15px; transition: border-color .15s, background .15s; }
.vz-irf-q .wpcf7-list-item:hover { border-color: #812e77; }
.vz-irf-q .wpcf7-list-item:has(input:checked) { border-color: #812e77; background: #f6eef5; color: #812e77; }
.vz-irf-q input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: #812e77; }
.vz-irf-note { margin: 12px 0 18px !important; color: #6b6780; font-size: 14px; }
.vz-irf-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px 18px; margin-bottom: 16px; }
@container (min-width: 540px) { .vz-irf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.vz-irf-holder { margin-bottom: 16px !important; padding: 16px 18px 2px !important; border: 1px solid #e6e1ee !important; border-radius: 12px; background: #faf8fc; }
.vz-irf-holder > legend { float: left; width: 100%; margin-bottom: 12px; font-weight: 700; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: #812e77; }
.vz-irf-holder > legend + * { clear: both; }
.vz-irf-holder[hidden] { display: none !important; }
.vz-irf-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.vz-irf-field--wide { grid-column: 1 / -1; }
.vz-irf-field > label { font-weight: 600; font-size: 14px; color: #1d1a33; }
.vz-irf-field > label span { color: #b3261e; }
.vz-irf .wpcf7-form-control-wrap { display: block; position: relative; }
.vz-irf input[type="text"], .vz-irf input[type="email"], .vz-irf input[type="tel"], .vz-irf input[type="number"], .vz-irf select, .vz-irf textarea {
  box-sizing: border-box; width: 100% !important; height: 46px; margin: 0 !important; padding: 10px 14px !important;
  border: 1px solid #cfcadb !important; border-radius: 10px !important; background: #fff !important; box-shadow: none !important;
  font: 400 15px/1.4 "Open Sans", sans-serif !important; color: #1d1a33 !important;
}
.vz-irf textarea { height: auto; min-height: 130px; resize: vertical; }
.vz-irf select { padding-right: 30px !important; appearance: none; -webkit-appearance: none; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23555' stroke-width='1.6'/%3E%3C/svg%3E") right 12px center / 11px no-repeat !important; }
.vz-irf input:focus, .vz-irf select:focus, .vz-irf textarea:focus { outline: 2px solid #812e77 !important; outline-offset: 0; border-color: #812e77 !important; }
.vz-irf input::placeholder, .vz-irf textarea::placeholder { color: #9a96a8; }
.vz-irf-tel { display: grid; grid-template-columns: minmax(0, 132px) minmax(0, 1fr); gap: 8px; }
.vz-irf .wpcf7-not-valid { border-color: #b3261e !important; }
.vz-irf .wpcf7-not-valid-tip { margin-top: 4px; color: #b3261e; font-size: 13px; }
.vz-irf-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.vz-irf-submit { margin-top: 6px; }
.vz-irf .wpcf7-submit { min-width: 150px; height: 48px; padding: 0 28px !important; border: 0 !important; border-radius: 10px !important; background: #812e77 !important; color: #fff !important; font: 700 15px "Open Sans", sans-serif !important; letter-spacing: .02em; text-transform: none !important; cursor: pointer; transition: background .15s; }
.vz-irf .wpcf7-submit:hover, .vz-irf .wpcf7-submit:focus-visible { background: #64205c !important; }
.vz-irf .wpcf7-spinner { vertical-align: middle; }
@media (max-width: 640px) {
  .vz-irf-tel { grid-template-columns: minmax(0, 118px) minmax(0, 1fr); }
  .vz-irf .wpcf7-submit { width: 100%; }
}
.vz-ir-rta { margin-top: 28px !important; padding-top: 24px; border-top: 1px solid #e6e1ee; }