/* 1Venda: the sections added in the November 2026 changes, shared by all three themes.
   Hero photo + screen/phone stage, big statements, the event gallery, phone frames, brand logos,
   the southern-Africa map, the coupons live map, testimonials, the captcha and the header theme switch.
   Colours and type come from the theme's tokens; nothing here uses !important on them. */

/* ---------- Hero: photo beside the text, screens on a stage under them ---------- */
.e-con.v1w-hero-grid { align-items: center; }
.e-con.v1w-hero-r { position: relative; }
.e-con.v1w-hero-r::before { content: ""; position: absolute; left: 16px; top: 16px; right: -16px; bottom: -16px; border-radius: var(--radius-xl); background: var(--tenant-highlight); opacity: 0.9; z-index: 0; }
.elementor-widget.v1w-hero-photo { position: relative; z-index: 1; }
.elementor-widget.v1w-hero-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-xl); }
.e-con.v1w-stage { position: relative; z-index: 1; margin-top: 56px; align-items: flex-end; justify-content: center; gap: 24px; }
.elementor-widget.v1w-stage-screen { flex: 1 1 auto; min-width: 0; max-width: 820px; }
.elementor-widget.v1w-stage-phone { flex: none; width: clamp(132px, 17vw, 220px); margin-left: -4%; padding: 10px; border-radius: 34px; background: #1c1b19; box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.08) inset, 0 30px 60px -20px rgba(0, 0, 0, 0.5); position: relative; }
.elementor-widget.v1w-stage-phone::before, .elementor-widget.v1w-phone-shot figure::before { content: ""; position: absolute; top: 18px; left: 50%; transform: translateX(-50%); width: 34%; height: 9px; border-radius: 5px; background: #1c1b19; z-index: 2; }
.elementor-widget.v1w-stage-phone img { display: block; width: 100%; height: auto; aspect-ratio: 9 / 19; object-fit: cover; object-position: top; border-radius: 24px; background: #fff; }
.e-con.v1w-hero-home .e-con.v1w-hero-l { align-items: center; text-align: center; margin: 0 auto; max-width: 900px; }
@media (max-width: 767px) {
  .e-con.v1w-hero-r::before { left: 10px; top: 10px; right: -10px; bottom: -10px; }
  .e-con.v1w-stage { flex-wrap: wrap; margin-top: 40px; gap: 16px; }
  .elementor-widget.v1w-stage-phone { margin-left: 0; width: 150px; }
}

/* ---------- Statement: big words, a row of facts, often over a photo ---------- */
.e-con.v1w-sec-statement { --padding-top: 120px; --padding-bottom: 120px; background-color: var(--surface-inverse); color: var(--on-inverse-muted); --ink: var(--on-inverse); --ink-body: var(--on-inverse-muted); --ink-muted: var(--on-inverse-muted); --eyebrow: var(--on-inverse-muted); }
.e-con.v1w-sec-statement-photo { box-shadow: inset 0 0 0 100vmax rgba(17, 17, 17, 0.7); }
.e-con.v1w-statement { max-width: 1000px; }
.elementor-widget.v1w-statement-h .elementor-heading-title { font: 400 clamp(44px, 7vw, 112px)/0.95 var(--font-display); letter-spacing: -0.045em; color: var(--on-inverse); }
.v1w-statement-p, .v1w-statement-p .elementor-widget-container { margin-top: 24px; max-width: 720px; font-size: 18px; line-height: 30px; color: var(--on-inverse-muted); }
.e-con.v1w-facts { margin-top: 40px; gap: 40px; justify-content: start; }
.e-con.v1w-fact { padding-left: 16px; border-left: 1px solid color-mix(in srgb, var(--on-inverse) 30%, transparent); }
.v1w-fact-n .elementor-heading-title { font: 600 clamp(28px, 3vw, 40px)/1 var(--font-display); letter-spacing: -0.03em; color: var(--tenant-highlight); }
.v1w-fact-l .elementor-heading-title { margin-top: 6px; font: 500 14px/20px var(--font-sans); color: var(--on-inverse-muted); }
.elementor-widget.v1w-statement-btn { margin-top: 36px; }
@media (max-width: 767px) { .e-con.v1w-sec-statement { --padding-top: 80px; --padding-bottom: 80px; } .e-con.v1w-facts { gap: 20px; } }

/* ---------- Event gallery: posters from the Tickito site ---------- */
.e-con.v1w-gallery { gap: 16px; }
.elementor-widget.v1w-event { border-radius: var(--radius-md); overflow: hidden; transition: transform 0.5s var(--v1-ease-out, ease), box-shadow 0.5s; }
.elementor-widget.v1w-event:hover { transform: translateY(-4px); box-shadow: var(--shadow-card); }
.v1w-event figure { margin: 0; }
.v1w-event img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; object-position: top; border-radius: var(--radius-md) var(--radius-md) 0 0; }
.v1w-event figcaption { margin: 0; padding: 8px 10px 10px; font: 500 12px/16px var(--font-sans); color: var(--ink-body); background: var(--surface-soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 50px; }
.v1w-event a { color: inherit; text-decoration: none; }

/* ---------- Phone screenshots in frames ---------- */
.e-con.v1w-phones { gap: 24px; align-items: start; }
.elementor-widget.v1w-phone-shot figure { position: relative; margin: 0; padding: 9px; border-radius: 30px; background: #1c1b19; box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.08) inset, 0 24px 50px -20px rgba(0, 0, 0, 0.45); }
.elementor-widget.v1w-phone-shot img { display: block; width: 100%; height: auto; aspect-ratio: 9 / 19; object-fit: cover; object-position: top; border-radius: 22px; background: #fff; }
.elementor-widget.v1w-phone-shot figcaption { position: absolute; left: 0; right: 0; top: 100%; margin-top: 12px; padding: 0 4px; text-align: center; font: 500 13px/18px var(--font-sans); color: var(--ink-body); }
.e-con.v1w-phones { padding-bottom: 56px; }

/* ---------- Brand logos in a row ---------- */
.e-con.v1w-sec-brands { --padding-top: 40px; --padding-bottom: 40px; }
.elementor-widget.v1w-brands-label .elementor-heading-title { justify-content: center; text-align: center; width: 100%; }
.e-con.v1w-brands { gap: 24px clamp(32px, 6vw, 96px); align-items: center; justify-content: center; }
.e-con.v1w-brand { gap: 10px; align-items: center; }
.v1w-brand-img img { display: block; height: 48px; width: auto; max-width: 220px; object-fit: contain; border-radius: 0; }
.v1w-brand-name .elementor-heading-title { font: 500 13px/18px var(--font-sans); color: var(--ink-muted); text-align: center; }

/* ---------- Southern-Africa map ---------- */
.v1w-mapwrap { position: relative; }
.v1w-samap { display: block; width: 100%; height: auto; overflow: visible; }
.v1w-samap path { fill: var(--surface-cool); stroke: var(--surface); stroke-width: 0.8; stroke-linejoin: round; transition: fill 0.4s; }
.v1w-samap path.is-live { fill: var(--tenant-highlight); }
.v1w-samap path.is-home { fill: var(--tenant-primary); }
.v1w-samap path.is-partners { fill: var(--surface-soft); stroke: var(--tenant-primary); stroke-width: 1; stroke-dasharray: 2 1.6; }
.v1w-samap .v1w-map-label circle { fill: var(--ink); stroke: var(--surface); stroke-width: 0.8; }
.v1w-samap .v1w-map-label text { font: 600 6px var(--font-sans); fill: var(--ink); paint-order: stroke; stroke: var(--surface); stroke-width: 1.4px; stroke-linejoin: round; }
.v1w-samap .v1w-map-dot { fill: var(--tenant-primary); }
.v1w-maplegend { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 16px 0 0; padding: 0; list-style: none; font: 500 13px/18px var(--font-sans); color: var(--ink-body); }
.v1w-maplegend li { display: inline-flex; align-items: center; gap: 8px; }
.v1w-maplegend li::before { content: ""; width: 12px; height: 12px; border-radius: 3px; background: var(--surface-cool); }
.v1w-maplegend li.is-live::before { background: var(--tenant-highlight); }
.v1w-maplegend li.is-home::before { background: var(--tenant-primary); }
.v1w-maplegend li.is-partners::before { background: var(--surface-soft); border: 1px dashed var(--tenant-primary); }
.v1w-country-partners .elementor-icon { color: var(--ink-muted); }

/* ---------- Testimonials under a quote ---------- */
.e-con.v1w-tms { margin-top: 32px; gap: 20px; }
.e-con.v1w-tm { --padding-top: 24px; --padding-right: 24px; --padding-bottom: 24px; --padding-left: 24px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); gap: 14px; }
.v1w-tm-text .elementor-heading-title { font: 400 17px/26px var(--font-sans); color: var(--ink); }
.v1w-tm-text .elementor-heading-title::before { content: "\201C"; display: block; font: 400 40px/0.6 var(--font-display); color: var(--tenant-primary); margin-bottom: 10px; }
.v1w-tm-who .elementor-heading-title { font: 500 13px/18px var(--font-sans); color: var(--ink-muted); }

/* ---------- Pictures above steps, photos in two-column sections ---------- */
.elementor-widget.v1w-steps-img { margin-bottom: 40px; }
.elementor-widget.v1w-steps-img img { display: block; width: 100%; height: auto; aspect-ratio: 21 / 9; object-fit: cover; border-radius: var(--radius-xl); }
.e-con.v1w-col-media .elementor-widget.v1w-col-photo img { padding: 0; border: 0; background: none; aspect-ratio: 4 / 3; object-fit: cover; }

/* ---------- Captcha ---------- */
.v1w-captcha .v1w-captcha-q { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.v1w-captcha .v1w-captcha-q .lbl { margin: 0; }
.v1w-captcha [data-captcha-q] { font-weight: 700; color: var(--ink); }
.v1w-captcha input[name="captcha"] { width: 120px; flex: none; }
.v1w-captcha small { display: block; margin-top: 6px; font: 400 13px/18px var(--font-sans); color: var(--ink-muted); }
.v1w-captcha-new { padding: 0; border: 0; background: none; color: var(--tenant-primary); font: inherit; text-decoration: underline; cursor: pointer; }
.v1w-captcha.is-bad input { border-color: var(--danger); }
.v1w-captcha.is-bad .err { display: block; }
.v1w-captcha.is-turnstile .v1w-captcha-q, .v1w-captcha.is-turnstile small { display: none; }
.v1w-captcha.is-turnstile .v1w-turnstile { display: block; }
.v1w-form [hidden] { display: none !important; }

/* ---------- Header theme switch: two icon buttons; the text stays as the accessible name ---------- */
.e-con.v1w-theme { --width: auto; flex: none; gap: 2px; padding: 2px; border: 1px solid var(--line); border-radius: var(--radius-pill); background: var(--surface); }
.v1w-theme-ico .elementor-button { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: var(--radius-pill); background: transparent; color: var(--ink-muted); cursor: pointer; }
.v1w-theme-ico .elementor-button:hover { background: var(--surface-soft); color: var(--ink); }
.v1w-theme-ico .elementor-button[aria-pressed="true"] { background: var(--ink); color: var(--surface); }
.v1w-theme-ico .elementor-button-content-wrapper { display: grid; place-items: center; gap: 0; }
.v1w-theme-ico .elementor-button-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.v1w-theme-ico .elementor-button-icon { display: grid; place-items: center; }
.v1w-theme-ico .elementor-button-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; }
.e-con.v1w-hdr-actions { gap: 10px; }
/* Phones keep the switch next to the Menu button, a little smaller. */
@media (max-width: 400px) { .v1w-theme-ico .elementor-button { width: 28px; height: 28px; } .e-con.v1w-hdr-actions { gap: 8px; } }
.e-con.v1w-brand { --width: auto; flex: 0 1 auto; width: auto; }
.e-con.v1w-brands { flex-wrap: wrap; }
/* Status chips stay pinned to the card corner, even on linked cards where the other widgets are static */
body:not(.elementor-editor-active) .e-con.feature.v1w-linked > .elementor-widget.v1w-status, .e-con.feature > .elementor-widget.v1w-status { position: absolute; width: auto; max-width: none; }
.feature .v1w-status .elementor-heading-title { display: inline-block; white-space: nowrap; }

/* Captcha block: its own layout (the template's .v1-field is a floating-label column-reverse) */
.v1w-captcha { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; }
.v1w-captcha .v1w-captcha-q { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0; }
.v1w-captcha .v1w-captcha-q .lbl { font: 600 14px/22px var(--font-sans); color: var(--ink); }
.v1w-captcha input[name="captcha"] { width: 120px; flex: none; font: 500 16px/26px var(--font-sans); color: var(--ink); background: var(--surface-soft); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px 14px; }
.v1w-captcha input[name="captcha"]:focus { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.v1w-captcha .err { display: none; font-size: 13px; line-height: 20px; color: var(--danger); }
.v1w-captcha.is-bad .err { display: block; }
.v1w-captcha.is-bad input[name="captcha"] { border-color: var(--danger); }

/* ---------- Map (redrawn from Natural Earth, changes_2): solid countries, one name each ---------- */
.v1w-samap { overflow: visible; }
.v1w-samap path { fill: var(--surface-cool); stroke: var(--surface); stroke-width: 1.4; stroke-dasharray: none; stroke-linejoin: round; }
.v1w-samap path.is-partners { fill: color-mix(in srgb, var(--ink) 22%, var(--surface)); stroke: var(--surface); stroke-width: 1.4; stroke-dasharray: none; }
.v1w-samap path.is-live { fill: var(--tenant-highlight); }
.v1w-samap path.is-home { fill: var(--tenant-primary); }
.v1w-samap .v1w-map-label text { font: 600 21px var(--font-sans); fill: var(--ink); stroke: none; paint-order: normal; }
.v1w-samap .v1w-map-label-live text { font-weight: 700; fill: #1c1b19; }
.v1w-samap .v1w-map-label-home text { font-weight: 700; fill: #ffffff; }
.v1w-samap .v1w-map-lead { stroke: var(--ink-muted); stroke-width: 1.4; }
.v1w-samap .v1w-map-end { fill: var(--ink); stroke: var(--surface); stroke-width: 1.2; }
.v1w-maplegend li.is-partners::before { background: color-mix(in srgb, var(--ink) 22%, var(--surface)); border: 0; }

/* ---------- A screen and a phone under a heading ---------- */
.e-con.v1w-screen-text { gap: 40px; align-items: start; }
.e-con.v1w-sec-screen .v1w-hero-art img { aspect-ratio: auto; object-position: top; }
.v1w-screen-note { margin-top: 14px; text-align: center; font-size: 13px; line-height: 18px; color: var(--ink-muted); }
.elementor-widget.v1w-frame-admin::after { content: "admin.yourbrand.com"; }
.elementor-widget.v1w-frame-tickito::after { content: "tickito.thevoicebw.com"; }
.elementor-widget.v1w-frame-tickito img { object-position: top; }

/* ---------- A phone screenshot in the gallery: shown whole, not cropped to the wide tile ---------- */
.elementor-widget.v1w-shot-phone img { object-fit: contain; object-position: center; background: var(--surface-cool); padding: 14px 0; }