/* ============================================================
   AACCCONS Model Overrides
   Adds AACCCONS-specific styles on top of model-style.css
   ============================================================ */

/* ---- Reset / Font ---- */
body {
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

/* ---- Utility ---- */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* ---- Bootstrap Link &amp; Text Reset (dark context) ---- */
a {
  color: inherit;
  transition: opacity 0.2s;
  text-decoration: none;
}
a:hover {
  opacity: 0.75;
  color: inherit;
}

/* =========================================================
   LOGO IMAGES
   ========================================================= */

/* Header logo */
.brand-logo {
  height: 30px;
  width: auto;
  display: block;
  object-fit: contain;
  flex-shrink: 0;
}

/* Footer logo */
.v2-footer-logo {
  height: 26px;
  width: auto;
  display: block;
  object-fit: contain;
  margin-bottom: 14px;
  opacity: 0.8;
}

/* mobile-menu logo (inside the overlay nav) */
.mobile-menu .brand-logo {
  height: 26px;
}

/* =========================================================
   NAVIGATION BUTTONS & AUTH-AWARE NAV
   ========================================================= */

/* Switch desktop-nav to flexbox so it adapts to 2 or 4 visible items */
.desktop-nav {
  position: absolute;
  top: 0;
  right: 18px;
  bottom: 0;
  left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  pointer-events: none;
}

.desktop-nav > * {
  pointer-events: auto;
}

/* Plain text link (Compliance Alerts when logged in) */
.nav-link-plain {
  color: var(--off-white, #edece8);
  font-size: clamp(12px, 0.82vw, 14px);
  font-weight: 400;
  letter-spacing: 0;
  text-decoration: none;
  white-space: nowrap;
  opacity: 0.88;
  margin-right: 4px;
}

.nav-link-plain:hover {
  opacity: 1;
  color: var(--off-white, #edece8);
}

/* Pill-shaped nav buttons */
.nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  padding: 0 18px;
  border-radius: 20px;
  font-size: clamp(12px, 0.78vw, 13px);
  font-weight: 500;
  letter-spacing: 0;
  white-space: nowrap;
  text-decoration: none !important;
  line-height: 1;
  transition: opacity 0.18s;
  cursor: pointer;
  background: none;
  border: none;
}

/* "Sign In" — outlined ghost button */
.nav-btn-secondary {
  background: transparent;
  color: var(--off-white, #edece8) !important;
  border: 1.5px solid rgba(237, 236, 232, 0.45);
}

.nav-btn-secondary:hover {
  opacity: 0.75;
  color: var(--off-white, #edece8) !important;
}

/* "Join" / primary — solid white button */
.nav-btn-primary {
  background: rgba(237, 236, 232, 0.92);
  color: #111 !important;
  border: 1.5px solid rgba(237, 236, 232, 0.92);
}

.nav-btn-primary:hover {
  opacity: 0.80;
  color: #111 !important;
}

/* Hide desktop nav on mobile (re-assert after flex override above) */
@media (max-width: 1024px) {
  .desktop-nav {
    display: none !important;
  }
}

/* =========================================================
   ALERT / DASHBOARD PAGE
   ========================================================= */

/* Full-page dark wrapper that clears the fixed 76px header */
.v2-alert-page {
  background: #0a0a0a;
  min-height: calc(100vh - 76px);
  padding-top: 96px;   /* 76px header + 20px breathing room */
  padding-bottom: 60px;
}

/* Centred content container inside the alert page */
.v2-alert-container {
  width: min(96%, 1100px);
  margin: 0 auto;
}

/* Prompt banners (Access Required / Subscription Required) */
.v2-alert-page .alert-info {
  background: rgba(14, 165, 233, 0.12);
  border: 1px solid rgba(14, 165, 233, 0.35);
  color: #bae6fd;
  border-radius: 8px;
  padding: 16px 20px;
}

.v2-alert-page .alert-warning {
  background: rgba(234, 179, 8, 0.10);
  border: 1px solid rgba(234, 179, 8, 0.30);
  color: #fde68a;
  border-radius: 8px;
  padding: 16px 20px;
}

.v2-alert-page .alert-info a,
.v2-alert-page .alert-warning a {
  color: #7dd3fc;
  text-decoration: underline;
}

/* Dashboard heading */
.v2-alert-page h1 {
  color: #edece8;
  font-size: clamp(22px, 3vw, 36px);
  font-weight: 700;
  margin-bottom: 6px;
}

.v2-alert-page .lead {
  color: rgba(237,236,232,0.55);
  font-size: clamp(13px, 1vw, 15px);
  margin-bottom: 28px;
}

/* Summary stat cards */
.v2-alert-page .card {
  background: #141414;
  border: 1px solid rgba(237,236,232,0.10);
  border-radius: 10px;
  color: #edece8;
}

.v2-alert-page .card-body {
  padding: 20px;
}

.v2-alert-page .card h5 {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.55;
  margin-bottom: 8px;
}

.v2-alert-page .card h2,
.v2-alert-page .card h3 {
  font-size: clamp(24px, 3vw, 36px);
  font-weight: 700;
  margin: 0;
  color: #fff;
}

/* Override Bootstrap colour utilities inside alert page */
.v2-alert-page .bg-primary { background: #1d4ed8 !important; }
.v2-alert-page .bg-success { background: #15803d !important; }
.v2-alert-page .bg-warning { background: #92400e !important; }
.v2-alert-page .bg-info    { background: #0369a1 !important; }

/* Tabs */
.v2-alert-page .nav-tabs {
  border-bottom-color: rgba(237,236,232,0.12);
}

.v2-alert-page .nav-tabs .nav-link {
  color: rgba(237,236,232,0.55);
  border: none;
  font-size: 13px;
}

.v2-alert-page .nav-tabs .nav-link.active {
  background: transparent;
  border-bottom: 2px solid #edece8;
  color: #edece8;
}

/* Alert item cards inside tabs */
.v2-alert-page .alert-light {
  background: #1a1a1a;
  border: 1px solid rgba(237,236,232,0.10);
  border-radius: 8px;
  color: #ccc;
}

.v2-alert-page .alert-light h6 {
  color: #edece8;
  margin-bottom: 4px;
}

.v2-alert-page .text-muted {
  color: rgba(237,236,232,0.45) !important;
}

/* Refresh button */
.v2-alert-page .btn-primary {
  background: #2563eb;
  border-color: #2563eb;
  border-radius: 8px;
  font-size: 13px;
}

.v2-alert-page .btn-outline-primary {
  border-color: rgba(37,99,235,0.6);
  color: #7dd3fc;
  border-radius: 6px;
  font-size: 12px;
}

.v2-alert-page .btn-outline-info {
  border-color: rgba(14,165,233,0.5);
  color: #7dd3fc;
  border-radius: 6px;
  font-size: 12px;
}

/* Summary card grid spacing */
.v2-alert-page .row.mb-4 {
  margin-bottom: 24px !important;
  gap: 0;
}

@media (max-width: 768px) {
  .v2-alert-page {
    padding-top: 86px;
    padding-bottom: 40px;
  }

  .v2-alert-page .row.mb-4 > [class*="col-"] {
    margin-bottom: 12px;
  }
}

/* =========================================================
   INNER PAGE SHELL
   ========================================================= */

/*
 * .v2-inner-page wraps the whole <main> on inner pages.
 * It provides a dark bg with a white centred card.
 */
.v2-inner-page {
  background: #000;
  min-height: calc(100vh - 76px);
  padding: 104px 16px 80px;
}

.v2-inner-card {
  background: #fff;
  color: #111;
  border-radius: 12px;
  padding: 40px 48px;
  max-width: 680px;
  margin: 0 auto 40px;
}

@media (max-width: 640px) {
  .v2-inner-card {
    padding: 28px 20px;
  }
}

.v2-inner-card h2 {
  font-size: clamp(22px, 2vw, 32px);
  font-weight: 700;
  color: #111;
  margin-top: 0;
  margin-bottom: 12px;
}

.v2-inner-card p {
  color: #444;
  line-height: 1.65;
}

.v2-inner-card a {
  color: #000;
  text-decoration: underline;
}

/* Wide card variant for wider content (subscriber dashboard, legal, etc.) */
.v2-inner-card--wide {
  max-width: 960px;
}

/* =========================================================
   BOOTSTRAP FORM OVERRIDES
   ========================================================= */

.v2-inner-card .form-control,
.v2-inner-card textarea.form-control {
  background: #f5f5f5;
  border: 1px solid #ddd;
  color: #111;
  border-radius: 8px;
  font-family: inherit;
  font-size: 15px;
}

.v2-inner-card .form-control:focus,
.v2-inner-card textarea.form-control:focus {
  background: #fff;
  border-color: #000;
  color: #111;
  box-shadow: none;
}

.v2-inner-card .form-control::placeholder {
  color: #aaa;
}

.v2-inner-card label {
  color: #333;
  font-size: 14px;
  font-weight: 500;
}

/* ---- Buttons ---- */
.v2-inner-card .btn-primary,
.v2-inner-card .btn-outline-primary.active,
.v2-inner-card [data-auth-login-form] button[type="submit"],
.v2-inner-card [data-auth-register-form] button[type="submit"],
.v2-inner-card [data-auth-paypal-form] button[type="submit"] {
  background: #000;
  border-color: #000;
  color: #fff;
  border-radius: 999px;
  font-family: inherit;
  font-weight: 600;
  padding: 12px 28px;
  font-size: 15px;
  cursor: pointer;
  transition: background 0.2s;
}

.v2-inner-card .btn-primary:hover {
  background: #222;
  border-color: #222;
}

.v2-inner-card .btn-outline-primary {
  border: 2px solid #000;
  color: #000;
  background: transparent;
  border-radius: 999px;
  font-family: inherit;
  font-weight: 600;
  padding: 11px 28px;
  font-size: 15px;
}

.v2-inner-card .btn-outline-primary:hover {
  background: #000;
  color: #fff;
}

.v2-inner-card .btn-block {
  display: block;
  width: 100%;
}

/* ---- Alerts ---- */
.v2-inner-card .alert {
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
}

.v2-inner-card .alert-info {
  background: #e8f4f8;
  border-color: #b6d8ea;
  color: #1a4a5c;
}

.v2-inner-card .alert-danger {
  background: #fdecea;
  border-color: #f5c2c7;
  color: #721c24;
}

.v2-inner-card .alert-success {
  background: #d1f0e0;
  border-color: #a3d9b9;
  color: #155724;
}

.v2-inner-card .alert-warning {
  background: #fff8e6;
  border-color: #ffe58f;
  color: #664d03;
}

/* =========================================================
   HOME PAGE – HERO (AACCCONS)
   ========================================================= */

.hero-subline-benefits {
  margin: 28px auto 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 24px;
  list-style: none;
  padding: 0;
  font-size: clamp(12px, 0.9vw, 14px);
  color: rgba(255, 255, 255, 0.7);
}

.hero-subline-benefits li {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hero-subline-benefits li .icon-check-circle-o {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.55);
  flex-shrink: 0;
  line-height: 1;
}

.hero-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 32px;
  padding: 14px 36px;
  border-radius: 999px;
  background: #fff;
  color: #000;
  font-size: clamp(13px, 0.9vw, 16px);
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}

.hero-cta:hover {
  background: #e8e8e8;
  color: #000;
  opacity: 1;
}

.hero-cta-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 14px;
  margin-left: 12px;
  padding: 13px 32px;
  border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, 0.4);
  background: transparent;
  color: #fff;
  font-size: clamp(13px, 0.9vw, 16px);
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
}

.hero-cta-secondary:hover {
  border-color: #fff;
  background: rgba(255, 255, 255, 0.08);
  opacity: 1;
}

/* =========================================================
   HOME PAGE – HOW IT WORKS
   ========================================================= */

.v2-how-section {
  background: #000;
  padding: 80px 24px;
}

.v2-how-section h2 {
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  font-size: clamp(32px, 2.5vw, 48px);
  letter-spacing: -0.02em;
  color: #fff;
  margin: 0 0 60px;
}

.v2-how-steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
  max-width: 1100px;
  margin: 0 auto;
}

@media (max-width: 760px) {
  .v2-how-steps {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

.v2-how-step {
  text-align: center;
}

.v2-how-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.v2-how-icon svg {
  width: 100%;
  height: 100%;
}

.v2-how-step h4 {
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 10px;
}

.v2-how-step p {
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
  line-height: 1.65;
  margin: 0;
}

.v2-how-step p a {
  color: #fff;
  text-decoration: underline;
}

.v2-how-cta {
  text-align: center;
  margin-top: 56px;
}

.v2-how-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 36px;
  border-radius: 999px;
  border: 2px solid rgba(255, 255, 255, 0.4);
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: border-color 0.2s, background 0.2s;
}

.v2-how-cta a:hover {
  border-color: #fff;
  background: rgba(255, 255, 255, 0.08);
  opacity: 1;
}

/* =========================================================
   HOME PAGE – FAQ SECTION
   ========================================================= */

.v2-faq-section {
  background: #fff;
  color: #111;
  padding: 80px 24px;
}

.v2-faq-section h2 {
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  font-size: clamp(32px, 2.5vw, 48px);
  letter-spacing: -0.02em;
  color: #111;
  margin: 0 0 56px;
}

.v2-faq-grid {
  max-width: 1080px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 40px;
}

@media (max-width: 760px) {
  .v2-faq-grid {
    grid-template-columns: 1fr;
  }
}

.elementskit-accordion .elementskit-card {
  border: 1px solid #e4e4e4;
  border-radius: 10px;
  margin-bottom: 12px;
  overflow: hidden;
  background: #fafafa;
}

.elementskit-accordion .elementskit-card-header a.ekit-accordion--toggler {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 22px;
  color: #111;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  background: transparent;
  transition: background 0.2s;
}

.elementskit-accordion .elementskit-card-header a.ekit-accordion--toggler:hover {
  background: #f0f0f0;
}

.elementskit-accordion .elementskit-card-body.ekit-accordion--content {
  padding: 4px 22px 20px;
  color: #444;
  font-size: 14px;
  line-height: 1.7;
}

.ekit_accordion_icon_group {
  flex-shrink: 0;
  margin-left: 12px;
}

.ekit_accordion_active_icon {
  display: none;
}

[aria-expanded="true"] .ekit_accordion_normal_icon {
  display: none;
}

[aria-expanded="true"] .ekit_accordion_active_icon {
  display: block;
}

.v2-faq-cta {
  text-align: center;
  margin-top: 52px;
}

.v2-faq-cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 36px;
  border-radius: 999px;
  background: #000;
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: background 0.2s;
}

.v2-faq-cta a:hover {
  background: #222;
  opacity: 1;
}

/* =========================================================
   HQ OVERLAY VIDEO SECTION – AACCCONS ADAPTATION
   ========================================================= */

.hq-video video {
  filter: brightness(0.6);
}

/* =========================================================
   OFFERS SECTION (like "We're Growing")
   ========================================================= */

.v2-offers-section {
  background: #fff;
  color: #111;
  padding: 100px 18px 96px;
  text-align: center;
}

.v2-offers-section h2 {
  margin: 0;
  text-transform: uppercase;
  font-size: clamp(54px, 5vw, 136px);
  line-height: 0.83;
  letter-spacing: -0.035em;
  font-weight: 700;
  color: #111;
}

.v2-offers-section .v2-offers-desc {
  margin: 64px auto 0;
  max-width: 1020px;
  font-size: clamp(20px, 1.75vw, 48px);
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.018em;
  color: #111;
}

.v2-offers-section .v2-offers-desc + .v2-offers-desc {
  margin-top: 54px;
}

.v2-service-chips {
  margin: 56px auto 0;
  max-width: 1200px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.v2-service-chip {
  border: 0;
  border-radius: 22px;
  background: #dfdfdf;
  color: #101010;
  padding: 18px 28px;
  font-size: clamp(16px, 1.4vw, 26px);
  line-height: 1;
  font-weight: 600;
  cursor: default;
  font-family: inherit;
  text-decoration: none;
  display: inline-block;
  transition: background 0.2s;
}

.v2-service-chip:hover {
  background: #cecece;
  color: #101010;
  opacity: 1;
}

@media (max-width: 1024px) {
  .v2-offers-section {
    padding: 56px 18px 60px;
  }
  .v2-offers-section h2 {
    font-size: clamp(44px, 10.8vw, 64px);
  }
  .v2-offers-section .v2-offers-desc {
    font-size: clamp(20px, 5.8vw, 30px);
  }
  .v2-service-chips {
    margin-top: 40px;
  }
  .v2-service-chip {
    padding: 10px 16px;
    font-size: clamp(12px, 2.6vw, 15px);
    border-radius: 99px;
  }
}

/* =========================================================
   AACCCONS FOOTER (V2)
   ========================================================= */

.v2-footer {
  background: #ededed;
  color: #111;
}

/* Subscribe box */
.v2-footer-subscribe {
  background: #dfdfdf;
  border-radius: 6px;
  margin: 10px 12px 0;
  padding: 36px 24px 44px;
}

.v2-footer-subscribe h3 {
  margin: 0;
  font-size: clamp(22px, 1.85vw, 40px);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: #111;
}

.v2-footer-subscribe .v2-subscribe-form {
  margin-top: 36px;
  border-bottom: 2px solid rgba(12, 12, 12, 0.18);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 0 14px;
}

.v2-footer-subscribe .v2-subscribe-form label {
  flex: 1;
  margin: 0;
}

.v2-footer-subscribe .v2-subscribe-form input[type="email"] {
  width: 100%;
  border: 0;
  background: transparent;
  outline: none;
  color: #1a1a1a;
  font-size: clamp(18px, 1.5vw, 30px);
  font-family: inherit;
  line-height: 1;
}

.v2-footer-subscribe .v2-subscribe-form input[type="email"]::placeholder {
  color: #8f8f8f;
}

.v2-footer-subscribe .v2-subscribe-form button {
  border: 0;
  border-radius: 999px;
  background: #000;
  color: #fff;
  font-size: clamp(13px, 0.95vw, 17px);
  font-family: inherit;
  font-weight: 600;
  padding: 12px 24px;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s;
}

.v2-footer-subscribe .v2-subscribe-form button:hover {
  background: #222;
}

/* Footer grid */
.v2-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 2fr;
  gap: 40px;
  padding: 52px 28px 32px;
  max-width: 1200px;
  margin: 0 auto;
}

@media (max-width: 880px) {
  .v2-footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
    padding: 36px 18px 24px;
  }
}

@media (max-width: 480px) {
  .v2-footer-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

.v2-footer-grid h4 {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #888;
  margin: 0 0 14px;
}

.v2-footer-grid ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.v2-footer-grid ul li {
  margin-bottom: 9px;
}

.v2-footer-grid ul a {
  color: #333;
  font-size: 14px;
  text-decoration: none;
  transition: color 0.2s;
}

.v2-footer-grid ul a:hover {
  color: #000;
  opacity: 1;
}

.v2-footer-brand-name {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
  margin: 0 0 10px;
  color: #111;
}

.v2-footer-brand-desc {
  font-size: 13px;
  color: #555;
  line-height: 1.6;
  margin: 0 0 20px;
}

/* Social icons */
.v2-social {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.v2-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #222;
  color: #fff;
  font-size: 15px;
  text-decoration: none;
  transition: background 0.2s;
}

.v2-social a:hover {
  background: #000;
  opacity: 1;
}

/* Footer contact form */
.v2-footer-contact-form .v2-fc-field {
  background: #e0e0e0;
  border: 1px solid #ccc;
  color: #111;
  border-radius: 6px;
  font-family: inherit;
  font-size: 13px;
  padding: 8px 12px;
  width: 100%;
  display: block;
  margin-bottom: 8px;
  outline: none;
  transition: border-color 0.2s;
}

.v2-footer-contact-form .v2-fc-field:focus {
  border-color: #000;
}

.v2-footer-contact-form .v2-fc-field::placeholder {
  color: #999;
}

.v2-footer-contact-form textarea.v2-fc-field {
  resize: vertical;
  min-height: 72px;
}

.v2-footer-contact-form .v2-fc-btn {
  background: #000;
  color: #fff;
  border: 0;
  border-radius: 6px;
  padding: 10px 22px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  width: 100%;
  margin-top: 4px;
  transition: background 0.2s;
}

.v2-footer-contact-form .v2-fc-btn:hover {
  background: #222;
}

/* Footer bottom bar */
.v2-footer-bottom {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding: 18px 24px;
  text-align: center;
}

.v2-footer-bottom .v2-copyright {
  font-size: 12px;
  color: #888;
  letter-spacing: -0.01em;
  margin: 0;
  line-height: 1.6;
}

.v2-footer-bottom .v2-copyright a {
  color: #666;
  text-decoration: none;
  transition: color 0.2s;
}

.v2-footer-bottom .v2-copyright a:hover {
  color: #111;
  opacity: 1;
}

@media (max-width: 1024px) {
  .v2-footer-subscribe {
    margin: 8px 10px 0;
    padding: 20px 16px 24px;
  }

  .v2-footer-subscribe h3 {
    font-size: clamp(18px, 5vw, 26px);
  }

  .v2-footer-subscribe .v2-subscribe-form {
    margin-top: 18px;
    padding-bottom: 10px;
  }

  .v2-footer-subscribe .v2-subscribe-form input[type="email"] {
    font-size: clamp(14px, 3.8vw, 20px);
  }

  .v2-footer-subscribe .v2-subscribe-form button {
    font-size: clamp(12px, 3vw, 14px);
    padding: 10px 16px;
  }
}

/* =========================================================
   LOADER (keep minimal dark version)
   ========================================================= */

#overlayer {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 7100;
  background: #000;
  top: 0;
  left: 0;
  transition: opacity 0.5s;
}

.loader {
  z-index: 7200;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.spinner-border {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(255, 255, 255, 0.2);
  border-top-color: #fff;
  border-radius: 50%;
  animation: v2-spin 0.75s linear infinite;
}

@keyframes v2-spin {
  to {
    transform: rotate(360deg);
  }
}

/* =========================================================
   SUBSCRIBER / MEMBER DASHBOARD AREA
   ========================================================= */

.v2-subscriber-section {
  background: #000;
  min-height: calc(100vh - 76px);
  padding: 100px 24px 60px;
}

.v2-subscriber-card {
  background: #fff;
  color: #111;
  border-radius: 12px;
  padding: 36px 40px;
  max-width: 960px;
  margin: 0 auto;
}

.v2-subscriber-card h2 {
  color: #111;
  font-size: clamp(20px, 1.8vw, 28px);
  font-weight: 700;
  margin-top: 0;
}

.v2-subscriber-card p,
.v2-subscriber-card li {
  color: #444;
  line-height: 1.65;
}

.v2-subscriber-card a {
  color: #000;
  text-decoration: underline;
}

/* =========================================================
   UTILITY / SIMPLE CONTENT PAGES (Privacy, Terms, etc.)
   ========================================================= */

.v2-simple-page {
  background: #000;
  min-height: calc(100vh - 76px);
  padding: 100px 24px 60px;
}

.v2-simple-card {
  background: #fff;
  color: #111;
  border-radius: 12px;
  padding: 40px 52px;
  max-width: 860px;
  margin: 0 auto;
}

@media (max-width: 640px) {
  .v2-simple-card {
    padding: 28px 20px;
  }
}

.v2-simple-card h1,
.v2-simple-card h2,
.v2-simple-card h3 {
  color: #111;
}

.v2-simple-card p,
.v2-simple-card li {
  color: #444;
  line-height: 1.7;
  font-size: 15px;
}

.v2-simple-card a {
  color: #000;
  text-decoration: underline;
}

/* =========================================================
   SUCCESS / CONFIRMATION PAGES
   ========================================================= */

.v2-confirm-section {
  background: #000;
  min-height: calc(100vh - 76px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 100px 24px 60px;
}

.v2-confirm-card {
  background: #fff;
  color: #111;
  border-radius: 12px;
  padding: 48px;
  max-width: 600px;
  width: 100%;
  text-align: center;
}

.v2-confirm-card h2 {
  color: #111;
  font-size: clamp(22px, 2vw, 32px);
  margin-bottom: 16px;
}

.v2-confirm-card p {
  color: #444;
  line-height: 1.65;
}

.v2-confirm-card a.v2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 24px;
  padding: 13px 32px;
  border-radius: 999px;
  background: #000;
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  transition: background 0.2s;
}

.v2-confirm-card a.v2-btn:hover {
  background: #222;
  opacity: 1;
}

/* =========================================================
   AOS COMPATIBILITY
   (AOS uses data-aos attributes; ensure transform origin is OK)
   ========================================================= */

[data-aos] {
  pointer-events: none;
}

[data-aos].aos-animate {
  pointer-events: auto;
}

/* =========================================================
   INNER PAGE CONTENT — UNIVERSAL DARK WRAPPER
   Dark background + off-white text on all inner pages.
   No white card — consistent with the new design system.
   ========================================================= */

body > div.col-12,
body > div.untree_co-hero,
body > div[data-member-page] {
  background: #000;
  padding-top: 96px;
  padding-bottom: 80px;
  min-height: calc(100vh - 280px);
  width: 100%;
  text-align: left;
}

body > div.col-12 > .container,
body > div.untree_co-hero > .container,
body > div[data-member-page] > .container {
  background: transparent;
  color: rgba(237, 236, 232, 0.9);
  border-radius: 0;
  padding: 0 24px;
  max-width: 900px;
}

@media (max-width: 640px) {
  body > div.col-12 > .container,
  body > div.untree_co-hero > .container,
  body > div[data-member-page] > .container {
    padding: 0 16px;
  }
}

/* ---- Typography in dark inner pages ---- */
body > div.col-12 > .container h1,
body > div.col-12 > .container h2,
body > div.col-12 > .container h3,
body > div.col-12 > .container h4,
body > div.col-12 > .container h5,
body > div.untree_co-hero > .container h1,
body > div.untree_co-hero > .container h2,
body > div.untree_co-hero > .container h3,
body > div[data-member-page] > .container h1,
body > div[data-member-page] > .container h2,
body > div[data-member-page] > .container h3,
body > div[data-member-page] > .container h4,
body > div[data-member-page] > .container h5 {
  color: #edece8;
}

body > div.col-12 > .container p,
body > div.col-12 > .container li,
body > div.untree_co-hero > .container p,
body > div.untree_co-hero > .container li,
body > div[data-member-page] > .container p,
body > div[data-member-page] > .container li {
  color: rgba(237, 236, 232, 0.6);
  line-height: 1.75;
}

body > div.col-12 > .container a,
body > div.untree_co-hero > .container a,
body > div[data-member-page] > .container a {
  color: rgba(237, 236, 232, 0.8);
  text-decoration: underline;
}

body > div.col-12 > .container label,
body > div.untree_co-hero > .container label,
body > div[data-member-page] > .container label {
  color: rgba(237, 236, 232, 0.5);
  font-size: 15px;
  font-weight: 500;
}

/* ---- Dark form controls ---- */
body > div.col-12 > .container .form-control,
body > div.untree_co-hero > .container .form-control,
body > div[data-member-page] > .container .form-control {
  background: transparent;
  border: 1px solid rgba(237, 236, 232, 0.15);
  color: #fff;
  border-radius: 10px;
  height: 48px;
  padding: 0 18px;
  font-family: inherit;
  font-size: 15px;
  box-shadow: none;
}

body > div.col-12 > .container textarea.form-control,
body > div[data-member-page] > .container textarea.form-control {
  height: auto;
  min-height: 100px;
  padding: 12px 18px;
}

body > div.col-12 > .container .form-control:focus,
body > div.untree_co-hero > .container .form-control:focus,
body > div[data-member-page] > .container .form-control:focus {
  background: transparent;
  border-color: rgba(237, 236, 232, 0.4);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06);
  color: #fff;
}

body > div.col-12 > .container .form-control::placeholder,
body > div.untree_co-hero > .container .form-control::placeholder,
body > div[data-member-page] > .container .form-control::placeholder {
  color: rgba(237, 236, 232, 0.25);
}

body > div.col-12 > .container .form-check-label,
body > div[data-member-page] > .container .form-check-label {
  color: rgba(237, 236, 232, 0.55);
}

body > div.col-12 > .container .form-check-input,
body > div[data-member-page] > .container .form-check-input {
  accent-color: #fff;
}

body > div.col-12 > .container .form-text,
body > div[data-member-page] > .container .form-text {
  color: rgba(237, 236, 232, 0.35);
}

/* ---- Buttons in dark inner pages ---- */
body > div.col-12 > .container .btn-primary,
body > div.untree_co-hero > .container .btn-primary,
body > div[data-member-page] > .container .btn-primary {
  background: #fff;
  border-color: #fff;
  color: #000;
  border-radius: 999px;
  font-weight: 600;
}

body > div.col-12 > .container .btn-primary:hover,
body > div.untree_co-hero > .container .btn-primary:hover,
body > div[data-member-page] > .container .btn-primary:hover {
  background: rgba(237, 236, 232, 0.88);
  border-color: rgba(237, 236, 232, 0.88);
  color: #000;
}

body > div.col-12 > .container .btn-outline-primary,
body > div.untree_co-hero > .container .btn-outline-primary,
body > div[data-member-page] > .container .btn-outline-primary {
  border-color: rgba(237, 236, 232, 0.45);
  color: #edece8;
  border-radius: 999px;
  font-weight: 600;
  background: transparent;
}

body > div.col-12 > .container .btn-outline-primary:hover,
body > div[data-member-page] > .container .btn-outline-primary:hover {
  background: rgba(237, 236, 232, 0.1);
  border-color: rgba(237, 236, 232, 0.65);
  color: #fff;
}

body > div.col-12 > .container .btn-block,
body > div[data-member-page] > .container .btn-block {
  border-radius: 10px;
  height: 50px;
}

/* ---- Alerts in dark inner pages ---- */
body > div.col-12 > .container .alert-info,
body > div.untree_co-hero > .container .alert-info,
body > div[data-member-page] > .container .alert-info {
  background: rgba(23, 162, 184, 0.1);
  border-color: rgba(23, 162, 184, 0.3);
  color: #7dd4e8;
}

body > div.col-12 > .container .alert-danger,
body > div.untree_co-hero > .container .alert-danger,
body > div[data-member-page] > .container .alert-danger {
  background: rgba(220, 53, 69, 0.1);
  border-color: rgba(220, 53, 69, 0.3);
  color: #ff8b9a;
}

body > div.col-12 > .container .alert-success,
body > div.untree_co-hero > .container .alert-success,
body > div[data-member-page] > .container .alert-success {
  background: rgba(40, 167, 69, 0.1);
  border-color: rgba(40, 167, 69, 0.3);
  color: #75d88e;
}

body > div.col-12 > .container .alert-warning,
body > div[data-member-page] > .container .alert-warning {
  background: rgba(255, 193, 7, 0.08);
  border-color: rgba(255, 193, 7, 0.2);
  color: #ffe08a;
}

/* ---- Privacy / Terms pages — override the inline color styles set by the generator ---- */
body > div.untree_co-hero > .container [data-custom-class='title'],
body > div.untree_co-hero > .container [data-custom-class='title'] * {
  color: #edece8 !important;
}

body > div.untree_co-hero > .container [data-custom-class='subtitle'],
body > div.untree_co-hero > .container [data-custom-class='subtitle'] * {
  color: rgba(237, 236, 232, 0.55) !important;
}

body > div.untree_co-hero > .container [data-custom-class='heading_1'],
body > div.untree_co-hero > .container [data-custom-class='heading_1'] *,
body > div.untree_co-hero > .container [data-custom-class='heading_2'],
body > div.untree_co-hero > .container [data-custom-class='heading_2'] * {
  color: #edece8 !important;
}

body > div.untree_co-hero > .container [data-custom-class='body_text'],
body > div.untree_co-hero > .container [data-custom-class='body_text'] * {
  color: rgba(237, 236, 232, 0.6) !important;
  font-size: 14px !important;
  line-height: 1.8 !important;
}

body > div.untree_co-hero > .container [data-custom-class='link'],
body > div.untree_co-hero > .container [data-custom-class='link'] * {
  color: #a4b8ff !important;
}

/* Override the inline <style> block that sets colors to #000000 */
body > div.untree_co-hero [data-custom-class='title'] {
  color: #edece8 !important;
}
body > div.untree_co-hero [data-custom-class='heading_1'] {
  color: #edece8 !important;
}
body > div.untree_co-hero [data-custom-class='body_text'] {
  color: rgba(237, 236, 232, 0.6) !important;
}

/* ---- Column centering for inner pages ---- */
body > div.col-12 > .container .col-md-7,
body > div.col-12 > .container .col-md-8,
body > div[data-member-page] > .container .col-md-7,
body > div[data-member-page] > .container .col-md-8 {
  margin: 0 auto;
  float: none !important;
  text-align: left;
}

body > div.col-12 > .container h2,
body > div[data-member-page] > .container h2 {
  text-align: center;
}

/* ---- Subscriber dashboard ---- */
.subscriber-subscribe-hero {
  background: transparent !important;
}

body > div[data-member-page] > .container [data-paypal-buttons] {
  margin-top: 20px;
}

body > div[data-member-page] > .container .card {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(237, 236, 232, 0.1);
  color: #edece8;
}

body > div[data-member-page] > .container .card-header {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(237, 236, 232, 0.1);
  color: #edece8;
}

body > div[data-member-page] > .container .table {
  color: rgba(237, 236, 232, 0.8);
}

body > div[data-member-page] > .container .table thead th {
  border-color: rgba(237, 236, 232, 0.12);
  color: rgba(237, 236, 232, 0.4);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

body > div[data-member-page] > .container .table td {
  border-color: rgba(237, 236, 232, 0.08);
}

/* ----Alert dashboard (alert.html) cards ---- */
body .card.bg-primary,
body .card.bg-success,
body .card.bg-warning,
body .card.bg-info {
  border: none;
}

/* =========================================================
   DARK FORM PAGE (register.html, login.html)
   Two-column NDS-style layout — dark background, dim inputs
   ========================================================= */

.v2-form-page {
  background: #000;
  min-height: calc(100vh - 76px);
  padding: 100px 40px 80px;
}

.v2-form-page-grid {
  max-width: 1100px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 72px;
  align-items: start;
}

@media (max-width: 860px) {
  .v2-form-page-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .v2-form-page {
    padding: 88px 24px 60px;
  }
}

.v2-form-heading {
  font-size: clamp(30px, 3.2vw, 52px);
  font-weight: 600;
  color: #edece8;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 20px;
}

.v2-form-subtext {
  font-size: clamp(16px, 1.2vw, 19px);
  font-weight: 500;
  color: rgba(237, 236, 232, 0.85);
  line-height: 1.55;
  margin: 0 0 20px;
}

.v2-form-fine {
  font-size: 14px;
  color: rgba(237, 236, 232, 0.38);
  line-height: 1.75;
  margin: 0;
}

.v2-form-fine strong {
  color: rgba(237, 236, 232, 0.6);
  font-weight: 500;
}

/* ---- Dark field inputs ---- */
.v2-dark-form .v2-field {
  margin-bottom: 20px;
}

.v2-dark-form .v2-field > label {
  display: block;
  font-size: 15px;
  font-weight: 500;
  color: rgba(237, 236, 232, 0.5);
  margin-bottom: 10px;
  text-align: left;
}

.v2-dark-form .v2-field input[type="text"],
.v2-dark-form .v2-field input[type="email"],
.v2-dark-form .v2-field input[type="password"] {
  width: 100%;
  height: 48px;
  padding: 0 18px;
  background: transparent;
  border: 1px solid rgba(237, 236, 232, 0.15);
  border-radius: 10px;
  color: #fff;
  font-size: 15px;
  font-family: inherit;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  display: block;
  appearance: none;
  -webkit-appearance: none;
}

.v2-dark-form .v2-field input:focus {
  border-color: rgba(237, 236, 232, 0.4);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06);
}

.v2-dark-form .v2-field input::placeholder {
  color: rgba(237, 236, 232, 0.22);
}

.v2-dark-form .v2-field-hint {
  display: block;
  font-size: 12px;
  color: rgba(237, 236, 232, 0.32);
  margin-top: 7px;
}

/* Checkbox row */
.v2-field-check {
  margin-bottom: 28px !important;
}

.v2-check-label {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  color: rgba(237, 236, 232, 0.48) !important;
  font-size: 14px;
  cursor: pointer;
  line-height: 1.55;
  font-weight: normal !important;
}

.v2-check-label input[type="checkbox"] {
  margin-top: 3px;
  flex-shrink: 0;
  accent-color: #fff;
  width: 15px;
  height: 15px;
}

.v2-check-label a {
  color: rgba(237, 236, 232, 0.8);
  text-decoration: underline;
}

/* Submit button */
.v2-form-btn {
  width: 100%;
  height: 52px;
  background: #fff;
  color: #000;
  border: none;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.2s;
  letter-spacing: 0.01em;
  margin-top: 4px;
  display: block;
}

.v2-form-btn:hover {
  background: rgba(237, 236, 232, 0.88);
}

/* Footer link */
.v2-form-foot {
  font-size: 14px;
  color: rgba(237, 236, 232, 0.38);
  margin-top: 20px;
  text-align: center;
}

.v2-form-foot a {
  color: rgba(237, 236, 232, 0.72);
  text-decoration: underline;
}

/* Error / status messages inside the form column */
.v2-form-side-form [data-auth-error],
.v2-form-side-form .alert-danger {
  background: rgba(220, 53, 69, 0.1) !important;
  border: 1px solid rgba(220, 53, 69, 0.28) !important;
  color: #ff8b9a !important;
  border-radius: 8px;
  padding: 12px 16px;
  font-size: 14px;
  margin-bottom: 16px;
  display: block;
}

.v2-form-side-form [data-auth-status] {
  color: rgba(237, 236, 232, 0.6);
  font-size: 14px;
  margin-bottom: 8px;
}

