/* =================================================================
   ICERTIS MASTER LP STYLESHEET — v3 Clean Build
   2026 Brand Guidelines

   PALETTE
   Vera Rose    #874451   Primary signature (~20% max)
   Linen        #EBECE7   Light neutral — primary background
   Mineral Blue #4C7383   Secondary — dark-section accent
   Parchment    #EAE7DC   Warm neutral background
   Espresso     #20161B   Near-black — text, dark sections, footer
   Stone        #D2CDC4   Medium neutral background / dividers
   Terracotta   #AB5C3E   Warm accent (never adjacent to Vera Rose)

   FONTS
   Lora (serif)   h1–h4
   Inter (sans)   h5–h6, body, UI, forms

   RULES — zero exceptions
   No gradients. No clip-path. No skewX. No teal. Flat solid only.
   ================================================================= */

/* Fonts (Inter + Lora) and Font Awesome v6 are loaded via <link> in the HTML template.
   @import removed: slower than <link>, causes double-load, and FA4 conflicts with FA6 syntax. */


/* ── RESET ──────────────────────────────────────────────────────── */
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; }
* { -webkit-tap-highlight-color: rgba(0,0,0,0); }
html,
body.up, .up div, .up span, .up p, .up a,
.up h1, .up h2, .up h3, .up h4, .up h5, .up h6,
.up ul, .up ol, .up li, .up dl, .up dt, .up dd,
.up blockquote, .up pre, .up code, .up em, .up strong,
.up fieldset, .up form, .up label, .up legend,
.up table, .up caption, .up tbody, .up tfoot, .up thead, .up tr, .up th, .up td,
.up select, .up input, .up option, .up img,
.up object, .up iframe, .up abbr, .up address {
  margin: 0; padding: 0; border: 0; outline: 0;
}
html { -webkit-text-size-adjust: none; }
.up button, .up input, .up select, .up textarea {
  font-size: 100%; margin: 0; vertical-align: baseline; box-shadow: none;
}
.up textarea { overflow: auto; vertical-align: top; }
.up input[type="button"], .up input[type="submit"] { -webkit-appearance: none !important; }

/* FIX: Replaced :focus { outline: 0 } which removed all keyboard focus indicators (WCAG 2.4.7).
   :focus-visible only fires for keyboard navigation — no visual change on mouse/touch. */
:focus-visible { outline: 2px solid #4C7383; outline-offset: 2px; }

.up img { border: 0; max-width: 100%; vertical-align: top; }
.up a { outline: none; cursor: pointer; text-decoration: none !important; }
.up a:hover, .up a:focus { text-decoration: underline !important; outline: none !important; }
.up .none { display: none; }
.up button::-moz-focus-inner, input[type="submit"]::-moz-focus-inner { border: 0; }

/* Placeholders */
.up input::-webkit-input-placeholder,
.up textarea::-webkit-input-placeholder { color: rgba(32,22,27,.55) !important; opacity: 1; }
.up input:-moz-placeholder,
.up textarea:-moz-placeholder { color: rgba(32,22,27,.55) !important; opacity: 1; }
.up input::-moz-placeholder,
.up textarea::-moz-placeholder { color: rgba(32,22,27,.55) !important; opacity: 1; }
.up input:-ms-input-placeholder,
.up textarea:-ms-input-placeholder { color: rgba(32,22,27,.55) !important; opacity: 1; }


/* ── BASE ───────────────────────────────────────────────────────── */
body.up {
  font-family: 'Inter', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.65;
  color: #20161B;
  background: #EBECE7; /* Linen — brand canvas */
}
.up .wrapper { width: 100%; overflow: hidden; }
.up .container { max-width: 1240px; width: 100%; margin: 0 auto; padding: 0 40px; }
.up .set-bg, .up .set_bg { background-position: center; background-size: cover; background-repeat: no-repeat; }
.up a, .up button { display: inline-block; transition: all 0.2s ease; }
.up .get_bg { display: none; }
.up .mid-container { display: flex; flex-wrap: wrap; width: 100%; }


/* ── TYPOGRAPHY ─────────────────────────────────────────────────── */
/* FIX: Headline weights updated from 700/600 to 500 (Medium) per brand guide type hierarchy.
   Brand guide specifies "Lora / Medium, Sentence Case" for all headline levels. */
.up h1, .up h1 div {
  font-family: 'Lora', serif; font-weight: 500;
  font-size: 44px; line-height: 1.2; letter-spacing: -0.01em;
  color: #20161B; margin-bottom: 24px;
}
.up h2, .up h2 div {
  font-family: 'Lora', serif; font-weight: 500;
  font-size: 36px; line-height: 1.25; letter-spacing: -0.01em;
  color: #20161B; margin-bottom: 20px;
}
.up h3, .up h3 div {
  font-family: 'Lora', serif; font-weight: 500;
  font-size: 28px; line-height: 1.3; color: #20161B; margin-bottom: 18px;
}
.up h4, .up h4 div {
  font-family: 'Lora', serif; font-weight: 500;
  font-size: 24px; line-height: 1.35; color: #20161B; margin-bottom: 16px;
}
.up h5, .up h5 div {
  font-family: 'Inter', sans-serif; font-weight: 600;
  font-size: 14px; line-height: 1.4; letter-spacing: 0.08em;
  text-transform: uppercase; color: #4C7383; margin-bottom: 12px;
}
.up h6, .up h6 div {
  font-family: 'Inter', sans-serif; font-weight: 700;
  font-size: 16px; line-height: 1.5; color: #20161B; margin-bottom: 8px;
}
.up .big_p, .up .big_p li {
  font-family: 'Inter', sans-serif; font-size: 20px;
  line-height: 1.65; color: #20161B; margin-bottom: 20px;
}
.up div.p_text, .up div.p_text div, .up li {
  font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.7; color: #20161B;
}

/* Lists */
.up ul, .up ol { margin: 16px 0; padding-left: 48px; }
.up ul { list-style: none; }
.up ul li::before {
  content: "";
  border-color: transparent #4C7383;
  border-style: solid;
  border-width: 0.28em 0 0.28em 0.4em;
  display: block; height: 0; width: 0;
  left: -1em; top: 0.9em; position: relative;
}
/* Dark section bullet — ensures visibility on dark backgrounds */
.up .white-text ul li::before {
  border-color: transparent #EBECE7 !important;
}
.up li:last-child { padding-bottom: 0; }
.up .no-list-style ul { padding-left: 0; list-style: none; margin: 0; }
.up .no-list-style li { padding-left: 0; }
.up .no-list-style li::before { display: none; }

/* Utility */
.up .dis-flex { display: flex; flex-wrap: wrap; }
.up .vmiddle { align-items: center; }
.up .vtop { align-items: flex-start; }
.up .flw { width: 100%; }
.up .text-center { text-align: center; }


/* ── BUTTONS ────────────────────────────────────────────────────── */
/* Primary — Vera Rose */
.up .green-cta a {
  background: #874451;
  color: #EBECE7 !important;
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px;
  padding: 13px 30px; border: 2px solid #874451; border-radius: 0;
  text-decoration: none !important; text-align: center;
  min-width: 180px; letter-spacing: 0.02em;
}
.up .green-cta a:hover {
  background: #20161B; border-color: #20161B;
  color: #874451 !important; text-decoration: none !important;
}
/* Secondary — Linen */
.up .white-cta a {
  background: #EBECE7;
  color: #20161B !important;
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px;
  padding: 13px 30px; border: 2px solid #EBECE7; border-radius: 0;
  text-decoration: none !important; text-align: center; min-width: 180px;
}
.up .white-cta a:hover {
  background: #D2CDC4; border-color: #D2CDC4;
  color: #20161B !important; text-decoration: none !important;
}
.up .btn-cont { margin-top: 28px; }
.up .btn-cont.dis-flex { gap: 16px; }


/* ── MARKETO FORMS ──────────────────────────────────────────────── */
.up form.mktoForm {
  width: 100% !important; float: none; margin: 0 !important;
  background: transparent; padding: 0 !important;
}
.up .mktoForm .mktoFormRow { width: 100% !important; padding: 0 !important; float: none; margin-bottom: 0 !important; }
.up .mktoForm .mktoFormCol { width: 100% !important; margin: 0 !important; min-height: auto !important; }
.up .mktoForm .mktoAsterix { display: none !important; }
.up .mktoForm .mktoFieldWrap { width: 100% !important; margin: 0 !important; }
.up .mktoForm .mktoOffset, .up .mktoForm .mktoGutter { display: none; }

.up .mktoForm .mktoLabel {
  width: auto !important; padding: 0 !important;
  font-family: 'Inter', sans-serif; font-weight: 500;
  font-size: 14px; line-height: 1.4; color: #20161B;
  margin-bottom: 5px; display: block;
}
/* FIX: color changed from rgba(32,22,27,.55) to #20161B.
   The 55% opacity value was applied to the input element itself, making user-typed
   text render dimly — indistinguishable from placeholder text and failing WCAG 1.4.3.
   Placeholder pseudo-elements below handle the muted placeholder color separately. */
.up .mktoForm input[type="url"],
.up .mktoForm input[type="text"],
.up .mktoForm input[type="date"],
.up .mktoForm input[type="tel"],
.up .mktoForm input[type="email"],
.up .mktoForm input[type="number"],
.up .mktoForm textarea.mktoField,
.up .mktoForm select.mktoField {
  padding: 11px 14px !important;
  width: 100% !important;
  font-family: 'Inter', sans-serif;
  appearance: none !important;
  -moz-appearance: none !important;
  -webkit-appearance: none !important;
  height: 44px;
  background: #fff;
  border: 1px solid #D2CDC4;
  border-radius: 0;
  box-shadow: none !important;
  font-size: 15px;
  line-height: normal;
  color: #20161B !important;
  margin-bottom: 12px !important;
  margin-top: 0 !important;
}
.up .mktoForm input[type="url"].mktoInvalid,
.up .mktoForm input[type="text"].mktoInvalid,
.up .mktoForm input[type="email"].mktoInvalid,
.up .mktoForm input[type="tel"].mktoInvalid,
.up .mktoForm textarea.mktoField.mktoInvalid,
.up .mktoForm select.mktoField.mktoInvalid { border-color: #874451 !important; }

.up .mktoForm input:focus,
.up .mktoForm select.mktoField:focus,
.up .mktoForm textarea.mktoField:focus {
  border-color: #4C7383 !important; box-shadow: none !important; outline: none;
}
.up .mktoForm select.mktoField {
  height: 44px; padding: 10px 14px !important;
  background: #fff url("https://engage.icertis.com/rs/475-LPK-911/images/PRJ300123234303-MasterTemplate-Icertis-dropdown.svg") no-repeat right 12px center;
  background-size: 16px; cursor: pointer; padding-right: 36px !important;
}
.up .mktoForm textarea.mktoField { height: 90px; padding: 12px 14px !important; }

/* Checkboxes */
.up .mktoForm .mktoCheckboxList { width: 100% !important; padding: 0; margin-bottom: 14px; }
.up .mktoForm .mktoCheckboxList input { cursor: pointer; opacity: 0; position: absolute; width: 20px; height: 20px; top: 0; z-index: 5; }
.up .mktoForm .mktoCheckboxList label {
  font-family: 'Inter', sans-serif; font-size: 14px; color: #20161B;
  position: relative; padding-left: 32px !important;
  display: flex; align-items: center; line-height: 1.4; cursor: pointer;
}
.up .mktoForm .mktoCheckboxList label::before {
  position: absolute; left: 0; top: 2px; content: "";
  height: 20px; width: 20px; border: 1.5px solid #20161B; border-radius: 2px; background: #fff;
}
.up .mktoForm .mktoCheckboxList input:checked + label::before { background: #20161B; }
.up .mktoForm .mktoCheckboxList input:checked + label::after {
  position: absolute; content: ""; height: 6px; width: 11px;
  left: 4px; top: 7px; border-left: 2px solid #EBECE7; border-bottom: 2px solid #EBECE7;
  transform: rotate(-45deg);
}
.up .mktoForm .mktoCheckboxList a { color: #4C7383; text-decoration: underline !important; }

/* Radio */
.up .mktoForm .mktoRadioList { width: 100% !important; padding: 0; margin-bottom: 14px; }
.up .mktoForm .mktoRadioList input { opacity: 0; position: absolute; width: 20px; height: 20px; }
.up .mktoForm .mktoRadioList label {
  font-family: 'Inter', sans-serif; font-size: 14px; color: #20161B;
  position: relative; padding-left: 32px !important;
  display: flex; align-items: center; line-height: 1.4; cursor: pointer;
}
.up .mktoForm .mktoRadioList input + label::before {
  content: ""; position: absolute; left: 0; top: 2px;
  width: 20px; height: 20px; border: 1.5px solid #20161B; border-radius: 50%; background: #fff;
}
.up .mktoForm .mktoRadioList input:checked + label::after {
  content: ""; position: absolute; left: 5px; top: 7px;
  width: 10px; height: 10px; background: #20161B; border-radius: 50%;
}

/* Privacy text */
/* FIX: color corrected from rgba(34,20,16) — invalid 3-value rgba syntax, also wrong hex
   (#221410 vs Espresso #20161B). Updated to correct Espresso value. */
.up .mktoForm .mktoHtmlText {
  width: 100% !important;
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  line-height: 1.6;
  color: #20161B !important;
}
.up .mktoForm .mktoHtmlText * {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}
.up .mktoForm .mktoHtmlText a {
  color: #20161B;
  text-decoration: underline !important;
}

/* FIX: Country select color — <select> ignores ::placeholder so it needs its own rule.
   Default (unselected): muted at 55% opacity, visually consistent with placeholder text inputs.
   After selection: JS adds .has-value and full Espresso color is applied. */
.up .mktoForm select.mktoField { color: rgba(32,22,27,.55) !important; }
.up .mktoForm select.mktoField.has-value { color: #20161B !important; }

/* FIX: Known-visitor "Not you?" link — Marketo renders the link as
   <a class="mktoNotYou"> so the <a> itself carries the class.
   Selectors targeting a child <a> (e.g. .mktoNotYou a) don't match.
   Correct selector is a.mktoNotYou. MutationObserver in JS is also
   updated to target this class directly. */
a.mktoNotYou {
  color: #4C7383 !important;
  text-decoration: underline !important;
}
a.mktoNotYou:hover { color: #20161B !important; }

/* Submit button */
.up .mktoForm .mktoButtonRow { width: 100% !important; float: none; text-align: left !important; margin-top: 20px; }
.up .mktoForm .mktoButtonRow .mktoButtonWrap { margin: 0 !important; }
.up .mktoForm button.mktoButton, .mktoForm button.mktoButton {
  width: 100% !important; display: flex; align-items: center; justify-content: center;
  background: #874451 !important; border: 2px solid #874451 !important;
  color: #EBECE7 !important; border-radius: 0;
  font-family: 'Inter', sans-serif !important; font-weight: 600 !important;
  font-size: 15px !important; letter-spacing: 0.02em;
  padding: 13px 20px !important; cursor: pointer;
  text-shadow: none !important; box-shadow: none !important;
  max-width: 100%; margin: 0 !important;
}
.up .mktoForm button.mktoButton:hover, .mktoForm button.mktoButton:hover {
  background: #20161B !important; border-color: #20161B !important; color: #874451 !important;
}
.up .mktoForm fieldset { width: 100% !important; float: left !important; padding: 0 !important; margin: 0 !important; }
.up .mktoForm fieldset legend { margin: 0 !important; padding: 0 !important; }
.up .mktoForm .g-recaptcha { width: 100% !important; float: left; margin-top: 20px; }
.up span.error { color: #874451; font-size: 12px; margin-top: 4px; display: none !important; }

/* Form title style
   NOTE: .form-cont h5 uses Lora for visual prominence in the form panel context.
   This is an intentional deviation from the base h5 (Inter eyebrow) and is scoped
   specifically to form containers. FIX: border-bottom reduced from 3px to 1px per
   brand guide (divider lines = 1px). */
.up .form-cont h5 {
  font-family: 'Lora', serif; font-size: 20px; font-weight: 500;
  color: #20161B; text-transform: none; letter-spacing: 0;
  border-bottom: 1px solid #4C7383; padding-bottom: 14px; margin-bottom: 20px;
}
.up .form-cont h2 { font-size: 22px; position: relative; margin-bottom: 28px; }
.up .form-cont h2:after {
  content: ''; position: absolute; left: 0; bottom: -10px;
  background: #4C7383; width: 40px; height: 3px;
}
.up .form-cont div.p_text { font-size: 14px; line-height: 1.6; color: rgba(32,22,27,.7); }


/* ── HEADER ─────────────────────────────────────────────────────── */
.up header { padding: 24px 0; }
.up header .logo-cont {
  max-width: 180px;
  width: 180px;
  display: block;
}
.up header .logo-cont img,
img#header_logo_img {
  width: 100% !important;
  max-width: 180px !important;
  height: auto !important;
  display: block;
}


/* ── BANNER 1 (text-only dark hero) ─────────────────────────────── */
.up .banner-1 { padding: 90px 0; }


/* ── BANNER 2 (image hero + CTA, clean rectangular panel) ───────── */
.up .banner-2 { padding: 60px 0; }
.up .banner-2 .wrap {
  position: relative; z-index: 1;
  padding: 60px 48px;
  max-width: 680px;
  background: #20161B;
}
.up .banner-2 h1 { margin-bottom: 20px; }
.up .banner-2 .txt-cont { margin-bottom: 28px; }
.up .banner-2 .mobile-img { display: none; }


/* ── BANNER 3 (image hero + form, clean rectangular panel) ──────── */
.up .banner-3 { padding: 60px 0; }
.up .banner-3 .container .dis-flex { align-items: flex-start; }
.up .banner-3 .wrap {
  position: relative; z-index: 1;
  padding: 60px 48px;
  max-width: 560px;
  margin-right: 40px;
  background: #20161B;
  flex-shrink: 0;
}
.up .banner-3 h1 { margin-bottom: 20px; }
.up .banner-3 .txt-cont { margin-bottom: 28px; }
.up .banner-3 .form-cont {
  flex: 1; background: #fff; padding: 36px 32px;
}


/* ── BANNER 4 (solid color hero + form) ─────────────────────────── */
.up .banner-4 { padding: 60px 0; }
.up .banner-4 .container .dis-flex { align-items: flex-start; }
.up .banner-4 .wrap { flex: 1; margin-right: 48px; }
.up .banner-4 h1 { margin-bottom: 20px; }
.up .banner-4 .txt-cont { margin-bottom: 28px; }
.up .banner-4 .form-cont { width: 440px; flex-shrink: 0; background: #fff; padding: 36px 32px; }


/* ── SEC 5 (long-form body copy + CTA) ──────────────────────────── */
.up .sec5 { padding: 80px 0; }
.up .sec5 .txt-cont { max-width: 860px; margin-bottom: 40px; }
.up .sec5 h2 { margin-bottom: 24px; }


/* ── SEC 6 (speaker cards) ──────────────────────────────────────── */
.up .sec6 { padding: 80px 0; border-top: 1px solid #D2CDC4; }
.up .sec6 .txt-cont { margin-bottom: 56px; }
.up .speaker-cont { display: flex; flex-wrap: wrap; justify-content: center; gap: 40px; }

/* FIX: Speaker items in two_col and three_col must stack vertically (image above text).
   The .dis-flex class in the HTML was forcing all items into a horizontal row regardless
   of column mode. Override to block so image sits above text in grid layouts. */
.up .speaker-cont .item { text-align: center; display: block; }

.up .speaker-cont.three_col .item { flex-basis: calc(33.33% - 28px); }
.up .speaker-cont.two_col   .item { flex-basis: calc(50% - 20px); max-width: 320px; }

/* one_col: horizontal layout — image left, text right */
.up .speaker-cont.one_col .item {
  flex-basis: 100%; display: flex; align-items: center;
  text-align: left; gap: 36px; max-width: 600px;
}

/* FIX: Visibility toggling — previously one_col/two_col/three_col only changed
   flex-basis but never hid items, so selecting "2 speakers" still rendered all 3.
   :nth-child now hides the extra items for each mode. */
.up .speaker-cont.one_col .item:nth-child(n+2) { display: none; }
.up .speaker-cont.two_col  .item:nth-child(n+3) { display: none; }

/* Speaker image */
.up .speaker-cont .item .item-img { margin-bottom: 20px; }
/* FIX: Inset box-shadow replaces the outer border approach. An outer border adds a ring
   OUTSIDE the image, which can't cover a teal ring that's embedded inside the PNG.
   An inset shadow paints OVER the image at its inside edge, masking the teal ring.
   5px gives enough coverage for the ring thickness in the placeholder assets.
   Replace the placeholder PNGs with clean headshots for a permanent fix. */
.up .speaker-cont .item .item-img img {
  border-radius: 50%;
  width: 120px; height: 120px;
  object-fit: cover; object-position: center top;
  box-shadow: inset 0 0 0 5px #D2CDC4;
  display: block;
  margin: 0 auto; /* FIX: block-level img needs explicit centering — text-align:center on parent doesn't apply to block children */
}
.up .speaker-cont.one_col .item .item-img { margin-bottom: 0; flex-shrink: 0; }

/* Speaker text */
/* FIX: Speaker name uses h5 but the Marketo template's inline style block applies
   color: ${eyebrow_color} !important to ALL h5 elements, making names render in
   Mineral Blue. A more specific selector (0,2,1 vs 0,1,1 specificity) with its
   own !important wins without any HTML tag changes needed. */
.up .speaker-cont h5,
.up .speaker-cont h5 * { color: #20161B !important; }
.up .speaker-cont h5 { font-weight: 700; font-size: 16px; letter-spacing: 0; text-transform: none; margin-bottom: 4px; }
.up .speaker-cont h6 { color: #4C7383; font-size: 14px; margin-top: 4px; margin-bottom: 0; }
.up .item-txt div.p_text { font-size: 14px; color: rgba(32,22,27,.7); line-height: 1.5; }


/* ── SEC 7 (trusted-by logo bar) ────────────────────────────────── */
.up .sec7 { padding: 28px 0; }
.up .sec7 .dis-flex { align-items: center; gap: 48px; flex-wrap: wrap; }
.up .sec7 .title { flex-shrink: 0; }
.up .sec7 h4 { font-size: 13px; font-family: 'Inter', sans-serif; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 0; white-space: nowrap; }
.up .sec7 .logo-cont { display: flex; flex-wrap: wrap; align-items: center; gap: 40px; }
.up .sec7 .logo-cont .item img { max-height: 40px; width: auto; }


/* ── SEC 10 (two-column cards) ──────────────────────────────────── */
.up .sec10 { padding: 80px 0; }
.up .sec10 .card-cont { display: flex; gap: 0; }
.up .sec10 .item { flex: 1; padding: 0 48px 0 0; }
.up .sec10 .item:not(:last-child) { border-right: 1px solid #D2CDC4; }
.up .sec10 .item:not(:first-child) { padding: 0 0 0 48px; }
.up .sec10 .item .txt { margin-bottom: 28px; }
.up .sec10 h2, .up .sec10 h2 div { font-size: 28px; line-height: 1.3; }


/* ── SEC 11 (stat callout — full-width split) ───────────────────── */
.up .sec11 { overflow: hidden; }
.up .sec11 > .container { max-width: 100%; padding: 0; }
.up .sec11 .dis-flex { flex-wrap: nowrap; align-items: stretch; }
.up .sec11 .wrap {
  width: 55%; padding: 80px 7% 80px 6%;
  background: #20161B;
  max-width: none; margin: 0; position: relative; z-index: 1;
  display: flex; align-items: center;
}
.up .sec11 .wrap .txt-cont { max-width: 540px; }
.up .sec11 .img-cont { flex: 1; min-height: 400px; }
.up .sec11 h2 { display: flex; align-items: flex-end; font-size: 38px; }
.up .sec11 h2 img { margin-right: 20px; margin-bottom: 4px; }


/* ── SEC 12 (light feature cards, 3-up) ─────────────────────────── */
.up .sec12 { padding: 80px 0; }
.up .sec12 .top-txt { margin-bottom: 56px; }
.up .sec12 .card-cont { display: flex; flex-wrap: wrap; gap: 32px; justify-content: center; }
.up .sec12 .item { flex-basis: calc(33.33% - 22px); text-align: center; }
.up .sec12 .icon-cont { margin-bottom: 24px; }
.up .sec12 .icon-cont img { max-height: 64px; }
.up .sec12 h5 { font-weight: 700; color: #20161B; font-size: 15px; letter-spacing: 0; text-transform: none; }


/* ── SEC 13 (dark feature cards, 3-up) ──────────────────────────── */
.up .sec13 { padding: 80px 0; }
.up .sec13 .card-cont { display: flex; flex-wrap: wrap; gap: 32px; justify-content: center; }
.up .sec13 .item { flex-basis: calc(33.33% - 22px); text-align: center; }
.up .sec13 .icon-cont { margin-bottom: 24px; }
.up .sec13 .icon-cont img { max-height: 64px; }
.up .sec13 h5 { font-weight: 700; font-size: 15px; letter-spacing: 0; text-transform: none; }


/* ── SEC 14 (icon grid, 6-up) ───────────────────────────────────── */
.up .sec14 { padding: 80px 0; border-bottom: 1px solid #D2CDC4; }
.up .sec14 .top-txt { margin-bottom: 56px; }
.up .sec14 .card-cont { display: flex; flex-wrap: wrap; gap: 32px; justify-content: center; }
.up .sec14 .item { flex-basis: calc(33.33% - 22px); text-align: center; }
.up .sec14 .icon-cont {
  width: 88px; height: 88px; border-radius: 50%;
  border: 1.5px solid #4C7383;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 20px;
}
.up .sec14 .icon-cont img { max-height: 40px; }
.up .sec14 h5 { font-weight: 700; color: #20161B; font-size: 15px; letter-spacing: 0; text-transform: none; }


/* ── SEC 15 (single video, dark) ────────────────────────────────── */
.up .sec15 { padding: 80px 0; }
.up .sec15 .top-txt { margin-bottom: 40px; }
.up .video_wraper { position: relative; max-width: 900px; margin: 0 auto; overflow: hidden; border-radius: 4px; }
.up .video_wraper > div { padding-bottom: 56.25%; height: 0; position: relative; }
.up iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.up .sec15 iframe { z-index: 1; }
div#sec15_video div { padding-bottom: 56.25%; }


/* ── SEC 16 (resource card grid) ────────────────────────────────── */
.up .sec16 { padding: 80px 0; border-bottom: 1px solid #D2CDC4; }
.up .sec16 .top-txt { margin-bottom: 40px; }
.up .sec16 .card-cont { display: flex; flex-wrap: wrap; gap: 28px; justify-content: center; }
.up .sec16.three-col .item { flex-basis: calc(33.33% - 19px); }
.up .sec16.two-col .item { flex-basis: calc(50% - 14px); }
/* FIX: box-shadow removed — drop shadows are prohibited by 2026 brand guide.
   Replaced with a 1px Stone border for card definition. */
.up .sec16 .item { background: #fff; border: 1px solid #D2CDC4; }
.up .sec16 .item a { display: block; text-decoration: none !important; color: inherit; }
.up .sec16 .img-cont { padding-bottom: 56%; position: relative; overflow: hidden; }
.up .sec16 .img-cont.set_bg { position: relative; padding-bottom: 56%; overflow: hidden; }
.up .sec16 .item .get_bg img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.up .sec16 .txt-cont { padding: 20px 20px 24px; }
.up .sec16 .txt-cont div.p_text { font-size: 15px; color: #20161B; line-height: 1.6; }


/* ── SEC 17 (dual video, dark) ──────────────────────────────────── */
.up .sec17 { padding: 80px 0; }
.up .sec17 .row { width: 100%; }
.up .sec17 .col-sm-12 { margin-bottom: 40px; }
.up .sec17 .flx { display: flex; gap: 40px; flex-wrap: wrap; }
.up .sec17 .col-sm-6 { flex: 1; min-width: 280px; display: flex; flex-direction: column; }
.up .sec17 h5 { font-family: 'Lora', serif; font-size: 20px; font-weight: 500; letter-spacing: 0; text-transform: none; margin-bottom: 16px; text-align: center; }
.up .sec17 p { font-family: 'Inter', sans-serif; font-size: 18px; line-height: 1.6; text-align: center; }
.up .sec17 .video_wraper { margin-top: auto; width: 100%; border-radius: 4px; overflow: hidden; }
div#sec17_video1 div, div#sec17_video2 div { padding-bottom: 56.25%; }
.up .sec17 iframe { z-index: 1; }


/* ── SEC 19 (text + video) ───────────────────────────────────────── */
.up .sec19 { padding: 80px 0; }
.up .sec19 .card-cont.dis-flex { gap: 60px; flex-wrap: nowrap; align-items: flex-start; }
.up .sec19 .item { flex: 1; }
.up .sec19 .item .txt { margin-bottom: 28px; }
.video-box-item { position: relative; }
.video-box-item:before { display: none; }
.up .video-box-item { padding: 0; }
.up .sec19 .video-caption-item { margin-top: 20px; }
.up .sec19 iframe { position: relative; z-index: 1; width: 100%; height: auto; min-height: 280px; }


/* ── SEC 20 (mini footer CTA bar) ───────────────────────────────── */
.up .sec20 { padding: 60px 0; }
.up .sec20 .footer-cont-1 { text-align: center; }
.up .copyright3 h6 { font-size: 18px; font-weight: 600; font-family: 'Inter', sans-serif; }
.up .copyright3 h6 span { color: #874451; margin-right: 8px; }
.up .copyright3 a { color: #20161B; text-decoration: underline !important; }
.up .copyright3 .p_text { font-size: 14px; color: rgba(32,22,27,.55); margin-top: 8px; }


/* ── SEC 21 (testimonial quote) ─────────────────────────────────── */
.up .sec21 { padding: 80px 0; }
.up .sec21 .wrap { padding: 0 80px; text-align: center; max-width: 860px; margin: 0 auto; }
.up .sec21 .p_text { font-style: italic; font-size: 20px; line-height: 1.7; margin-bottom: 24px; }
.up .sec21 h6 { font-size: 15px; font-weight: 700; margin-bottom: 4px; }
.up .sec21 h5 { font-size: 13px; text-transform: none; letter-spacing: 0; }
div#sec21_content { margin-top: 20px; }


/* ── SEC 22 (image left + text right) ───────────────────────────── */
.up .sec22 { padding: 80px 0; }
.up .sec22 .dis-flex { align-items: center; gap: 60px; flex-wrap: nowrap; }
.up .sec22 .img-cont { width: 44%; flex-shrink: 0; }
.up .sec22 .txt-cont { flex: 1; }
.up .sec22 .txt { margin-bottom: 28px; }


/* ── SEC 25 (text + inline form) ────────────────────────────────── */
.up .sec25 { padding: 80px 0; }
.up .sec25 .dis-flex { gap: 60px; flex-wrap: nowrap; align-items: flex-start; }
.up .sec25 .txt-cont { flex: 1; }
.up .sec25 .txt-cont h2 { margin-bottom: 20px; }
.up .sec25 .form-cont {
  width: 420px; flex-shrink: 0;
  background: #EBECE7; padding: 36px 32px;
}
.up .sec25 form.mktoForm { background: transparent; padding: 0 !important; }
.up .sec25 .mktoForm .mktoLabel { display: none; }
.up .sec25 .mktoForm ::placeholder { font-weight: 500; color: rgba(32,22,27,.5) !important; }
.up .sec25 .mktoForm input[type="url"],
.up .sec25 .mktoForm input[type="text"],
.up .sec25 .mktoForm input[type="email"],
.up .sec25 .mktoForm input[type="tel"],
.up .sec25 .mktoForm input[type="number"],
.up .sec25 .mktoForm select.mktoField {
  border: 1px solid #D2CDC4; background: #fff;
  margin-bottom: 10px !important;
}
.up .sec25 .mktoForm button.mktoButton {
  max-width: 100% !important; margin: 8px 0 0 !important;
}
.up .sec25 .bottom-image { margin-top: 32px; }
.up .sec25 .bottom-image img { max-width: 280px; }


/* ── SEC 26 (link navigation bar) ───────────────────────────────── */
.up .sec26 { padding: 40px 0; }
.up .sec26 .txt-cont ul {
  display: flex; flex-wrap: wrap; gap: 12px 40px;
  list-style: none; margin: 0; padding: 0;
}
.up .sec26 ul li::before { display: none; }
.up .sec26 ul li { margin: 0; }
.up .sec26 ul li a {
  font-family: 'Inter', sans-serif; font-weight: 600;
  font-size: 15px; color: #20161B; text-decoration: underline !important;
}
.up .sec26 ul li a:hover { color: #874451; }


/* ── SEC 27 (form + speakers) ───────────────────────────────────── */
.up .sec27 { padding: 80px 0; }
.up .sec27 .dis-flex.vtop { gap: 60px; flex-wrap: nowrap; align-items: flex-start; }
.up .sec27 .wrap { flex: 1; }
.up .sec27 .txt-cont { margin-bottom: 0; }
.up .sec27 h4 { font-family: 'Lora', serif; font-size: 22px; margin-bottom: 32px; }
/* FIX: Removed list-style: disc and li::before override. Sec27 lists now inherit the
   standard custom triangle bullet from base styles, consistent with all other sections. */
.up .sec27 .txt-cont ul { color: rgba(32,22,27,.65); }
.up .sec27 .form-cont {
  width: 400px; flex-shrink: 0;
  background: #EBECE7; padding: 36px 32px;
}
.up .sec27 form.mktoForm { background: transparent; padding: 0 !important; }
.up .sec27 .mktoForm .mktoLabel { display: none; }
.up .sec27 .mktoForm ::placeholder { font-weight: 500; color: rgba(32,22,27,.5) !important; }
.up .sec27 .mktoForm button.mktoButton { max-width: 100% !important; margin: 8px 0 0 !important; }
.up .bottom-speakers { margin-top: 48px; }
.up .bottom-speakers h2 { font-size: 24px; margin-bottom: 32px; }
.up .speaker-container { display: flex; flex-wrap: wrap; gap: 32px; }
.up .sec27 .spkrs.speaker-cont { flex-basis: calc(33.33% - 22px); text-align: center; }
.up .sec27 .image-tag { width: 88px; height: 88px; margin: 0 auto 14px; position: relative; }
.up .sec27 .img-boxx { width: 100%; height: 100%; position: relative; overflow: hidden; border-radius: 50%; }
.up .sec27 .img-boxx img { width: 100%; height: 100%; object-fit: cover; }
.up .sec27 .image-tag:after { display: none; }
.up .sec27 .speaker-cont h5 { font-weight: 700; font-size: 15px; letter-spacing: 0; text-transform: none; color: #20161B; margin-bottom: 4px; }
.up .sec27 .item-txt div.p_text { font-size: 14px; color: rgba(32,22,27,.7); line-height: 1.5; }


/* ── FOOTERS ─────────────────────────────────────────────────────── */
/* FIX: Footer padding increased to 48px and Stone top border added for clear visual separation from page content. */
.up footer { padding: 48px 0; border-top: 1px solid #D2CDC4; }
.up footer .footer-cont { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; }
.up footer .left { flex: 1; min-width: 200px; }
.up footer .right { display: flex; justify-content: flex-end; }
.up footer li, .up footer li a {
  font-family: 'Inter', sans-serif; font-size: 13px;
  line-height: 1.8; text-decoration: underline !important; color: inherit;
}
.up footer li { display: inline-block; padding-bottom: 0; }
.up footer li:before { display: none; }
.up footer li:hover, .up footer li a:hover { text-decoration: none !important; }
.up footer .p_text { font-size: 13px; color: #EAE7DC; margin-top: 4px; }
/* FIX: Gap increased from 4px to 8px for footer link lists. */
.up footer .no-list-style ul { display: flex; gap: 8px; margin-bottom: 6px; }
/* FIX: Social icons given dedicated gap (20px) — 22px icons at 4px gap were cramped. */
.up footer .footer-socials ul { gap: 20px; }
.up footer .right li a, .up footer .socials li a { font-size: 22px; line-height: 1; text-decoration: none !important; }
.up footer .right li a:hover i, .up footer .socials li a:hover i { color: #874451 !important; }
.up footer.footer-2 .footer-cont { flex-direction: column; text-align: center; padding: 32px 0; }
.up footer.footer-2 .footer-cont .socials { margin-bottom: 12px; }
.up footer.footer-2 .footer-cont .socials ul { justify-content: center; }
.up footer .copyright h6 { font-size: 16px; font-weight: 500; }
.up footer .copyright h6 span { color: #874451; padding-right: 8px; }
.up footer .copyright a { text-decoration: underline !important; color: inherit; }
.up footer .copyright .p_text { font-size: 13px; margin-top: 6px; }
.up footer .footer-links li + li:before {
  content: "|";
  margin: 0 8px;
  color: inherit;
}