/*
Theme Name: Etezan Custom Theme
Theme URI: https://example.com/
Author: Converted from static site
Description: Custom WordPress theme generated from the Etezan Consultancy and Solutions static HTML site.
Version: 1.0.0
Text Domain: etezan-custom
*/

/* Admin bar offset for sticky nav */
body.admin-bar nav.sticky {
  top: 32px;
}
@media screen and (max-width: 782px) {
  body.admin-bar nav.sticky {
    top: 46px;
  }
}


/* ===== index.html inline styles ===== */
html { scroll-padding-top: 92px; }
    body { font-family: 'Inter', sans-serif; }

    /* ===== Brand variables (lightweight, same values as services.html) ===== */
    :root{
      --brand:#5A0B83;
      --brandDark:#3E075B;
      --line: rgba(15,23,42,.10);
    }

    /* ===== Navigation hover underline (same behavior) ===== */
    .link-underline{
      position: relative;
    }
    .link-underline:after{
      content:"";
      position:absolute;
      left:0;
      bottom:-7px;
      height:2px;
      width:0%;
      background: var(--brand);
      transition: width .25s ease;
    }
    .link-underline:hover:after{
      width:100%;
    }

    /* ===== Nav link base + active state ===== */
    .nav-link{
      position: relative;
      color: rgba(17,24,39,.92);
    }
    .nav-link.active{
      color: var(--brand);
      font-weight: 600;
    }
    .nav-link.active:after{
      content:"";
      position:absolute;
      left:0;
      right:0;
      bottom:-7px;
      height:2px;
      background: var(--brand);
      border-radius: 999px;
    }

    /* ===== Industries card hover (your original) ===== */
    .industry-card{
      border:1px solid rgba(15,23,42,.10);
      transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
    }
    .industry-card:hover{
      transform: translateY(-4px);
      border-color: rgba(90,11,131,.28);
      box-shadow: 0 18px 40px rgba(15,23,42,.10);
    }

    /* ===== Premium card (was missing; used by Insights cards) ===== */
    .card-premium{
      border: 1px solid var(--line);
      box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 10px 26px rgba(15,23,42,.08);
      transform: translateY(0);
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    .card-premium:hover{
      transform: translateY(-5px);
      border-color: rgba(90,11,131,.18);
      box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 20px 46px rgba(15,23,42,.14);
    }

    /* Back to top – subtle entrance animation */
    #backToTop{
      opacity: 0;
      transform: translateY(8px);
      transition: opacity .25s ease, transform .25s ease;
    }

    #backToTop.show{
      opacity: 1;
      transform: translateY(0);
    }

/* ===== about.html inline styles ===== */
html { scroll-padding-top: 92px; }
  body { font-family: 'Inter', sans-serif; }

  :root{
    --brand:#5A0B83;
    --brand2:#3E075B;
    --ink:#0b1220;
    --line:rgba(15, 23, 42, .10);
  }

  /* ===== Nav (match index feel) ===== */
  .nav-glass{
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(15,23,42,.10);
  }

  .scroll-progress{
    position:absolute;
    left:0; bottom:-1px;
    height:2px;
    width:0%;
    background: linear-gradient(90deg, rgba(90,11,131,.9), rgba(90,11,131,.25));
  }

  /* ===== Navigation hover underline (same behavior) ===== */
  .link-underline{ position: relative; }
  .link-underline:after{
    content:"";
    position:absolute;
    left:0; bottom:-7px;
    height:2px; width:0%;
    background: var(--brand);
    transition: width .25s ease;
  }
  .link-underline:hover:after{ width:100%; }

  /* ===== Nav link base + active state (same as index.html) ===== */
  .nav-link{
    position: relative;
    color: rgba(17,24,39,.92);
  }
  .nav-link.active{
    color: var(--brand);
    font-weight: 600;
  }
  .nav-link.active:after{
    content:"";
    position:absolute;
    left:0; right:0;
    bottom:-7px;
    height:2px;
    background: var(--brand);
    border-radius: 999px;
  }

  .btn-premium{
    background: linear-gradient(135deg, var(--brand), var(--brand2));
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(90,11,131,.18);
    transition: transform .2s ease, box-shadow .2s ease;
  }
  .btn-premium:hover{
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(90,11,131,.24);
  }
  .btn-premium:before{
    content:"";
    position:absolute;
    top:-50%; left:-60%;
    width:55%; height:220%;
    transform: rotate(20deg);
    background: rgba(255,255,255,.22);
    transition: left .35s ease;
  }
  .btn-premium:hover:before{ left:120%; }

  .card-premium{
    border:1px solid var(--line);
    box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 10px 26px rgba(15,23,42,.08);
    transform: translateY(0);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .card-premium:hover{
    transform: translateY(-5px);
    border-color: rgba(90,11,131,.18);
    box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 20px 46px rgba(15,23,42,.14);
  }

  .section-divider{ position: relative; }
  .section-divider:before{
    content:"";
    position:absolute;
    left:0; right:0; top:-1px;
    height:1px;
    background: linear-gradient(90deg, transparent, rgba(90,11,131,.30), transparent);
  }

  @media (prefers-reduced-motion: no-preference){
    .reveal{ opacity:0; transform: translateY(14px); }
    .reveal.show{ opacity:1; transform: translateY(0); transition: opacity .7s ease, transform .7s ease; }
    .reveal[data-delay="1"].show{ transition-delay: .08s; }
    .reveal[data-delay="2"].show{ transition-delay: .16s; }
    .reveal[data-delay="3"].show{ transition-delay: .24s; }
  }

  /* Back to top – subtle entrance animation */
  #backToTop{
    opacity: 0;
    transform: translateY(8px);
    transition: opacity .25s ease, transform .25s ease;
  }
  #backToTop.show{
    opacity: 1;
    transform: translateY(0);
  }

  /* ---- Etezan subtle motion (no JS) ---- */
  @keyframes ezFadeUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  .ez-animate-up {
    opacity: 0;
    animation: ezFadeUp 700ms cubic-bezier(.2,.8,.2,1) forwards;
  }

  /* Stagger helpers */
  .ez-delay-1 { animation-delay: 80ms; }
  .ez-delay-2 { animation-delay: 160ms; }
  .ez-delay-3 { animation-delay: 240ms; }
  .ez-delay-4 { animation-delay: 320ms; }
  .ez-delay-5 { animation-delay: 400ms; }
  .ez-delay-6 { animation-delay: 480ms; }
  .ez-delay-7 { animation-delay: 560ms; }
  .ez-delay-8 { animation-delay: 640ms; }

  /* Hover lift */
  .ez-lift {
    transition: transform 220ms cubic-bezier(.2,.8,.2,1), box-shadow 220ms cubic-bezier(.2,.8,.2,1);
    will-change: transform;
  }
  .ez-lift:hover { transform: translateY(-6px); }

  /* Respect reduced motion */
  @media (prefers-reduced-motion: reduce) {
    .ez-animate-up { opacity: 1; animation: none !important; transform: none !important; }
    .ez-lift { transition: none !important; }
  }

  /* --- Parallax image (JS sets --pz) --- */
  .parallax-wrap{ position: relative; overflow: hidden; }
  .parallax-img{
    transform: translate3d(0, var(--pz, 0px), 0) scale(1.06);
    will-change: transform;
    transition: transform .12s linear;
  }

  /* --- KPI reveal + stagger (reliable) --- */
  @media (prefers-reduced-motion: no-preference){
    /* Start hidden */
    .kpi-item{
      opacity: 0;
      transform: translateY(14px) scale(.985);
      transition: opacity .65s ease, transform .65s ease;
    }
    /* When the parallax block is revealed, animate KPI items in */
    #valuesParallax.show .kpi-item{
      opacity: 1;
      transform: translateY(0) scale(1);
    }
  }

  /* ============================================================
     ✅ KPI "Brand Glass" Theme (NEW)
     Usage: add class "kpi-brand" to each KPI card.
     Optional: include a <div class="kpi-accent"></div> inside card.
     ============================================================ */
  .kpi-brand{
    position: relative;
    overflow: hidden;
    background: linear-gradient(
      180deg,
      rgba(255,255,255,.92),
      rgba(255,255,255,.86)
    );
    backdrop-filter: blur(10px);
    border: 1px solid rgba(90,11,131,.18);
    border-radius: 1rem;
    box-shadow:
      0 10px 28px rgba(15,23,42,.14),
      0 2px 0 rgba(255,255,255,.65) inset;
    transition:
      transform .25s ease,
      box-shadow .25s ease,
      border-color .25s ease;
  }

  .kpi-brand:hover{
    transform: translateY(-8px);
    border-color: rgba(90,11,131,.35);
    box-shadow:
      0 20px 50px rgba(15,23,42,.22),
      0 2px 0 rgba(255,255,255,.70) inset;
  }

  /* Brand accent bar (works for kpi-brand and anywhere else) */
  .kpi-accent{
    position: absolute;
    top: 0; bottom: 0; left: 0;
    width: 5px;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--brand), var(--brand2));
  }

/* ===== services.html inline styles ===== */
body { font-family: 'Inter', sans-serif; }

    :root{
      --brand:#5A0B83;
      --brand2:#3E075B;
      --ink:#0b1220;
      --line:rgba(15, 23, 42, .10);
    }

    /* Better anchor behavior with sticky nav */
    html { scroll-padding-top: 92px; }

    /* Background texture + wash */
    .bg-noise{
      background-image:
        radial-gradient(rgba(90,11,131,.10) 1px, transparent 1px),
        radial-gradient(rgba(15,23,42,.06) 1px, transparent 1px);
      background-position: 0 0, 12px 12px;
      background-size: 24px 24px;
    }
    .bg-wash{
      background:
        radial-gradient(900px 520px at 12% -10%, rgba(90,11,131,.18), transparent 55%),
        radial-gradient(900px 520px at 88% 10%, rgba(62,7,91,.14), transparent 60%),
        linear-gradient(to bottom, #F9FAFB, #FFFFFF);
    }

    /* Nav glass */
    .nav-glass{
      background: rgba(255,255,255,.78);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(15,23,42,.08);
    }

    /* Progress bar under nav */
    .scroll-progress{
      position:absolute;
      left:0; bottom:-1px;
      height:2px;
      width:0%;
      background: linear-gradient(90deg, rgba(90,11,131,.9), rgba(90,11,131,.25));
    }

    /* Link underline */
    .link-underline{ position: relative; }
    .link-underline:after{
      content:"";
      position:absolute;
      left:0; bottom:-7px;
      height:2px; width:0%;
      background: var(--brand);
      transition: width .25s ease;
    }
    .link-underline:hover:after{ width:100%; }

    /* Active state in top nav */
    .nav-link{
      position: relative;
      color: rgba(17,24,39,.92);
    }
    .nav-link.active{
      color: var(--brand);
      font-weight: 600;
    }
    .nav-link.active:after{
      content:"";
      position:absolute;
      left:0; right:0;
      bottom:-7px;
      height:2px;
      background: var(--brand);
      border-radius: 999px;
    }

    /* Premium buttons */
    .btn-premium{
      background: linear-gradient(135deg, var(--brand), var(--brand2));
      position: relative;
      overflow: hidden;
      box-shadow: 0 8px 22px rgba(90,11,131,.18);
      transition: transform .2s ease, box-shadow .2s ease;
    }
    .btn-premium:hover{
      transform: translateY(-1px);
      box-shadow: 0 14px 30px rgba(90,11,131,.24);
    }
    .btn-premium:before{
      content:"";
      position:absolute;
      top:-50%; left:-60%;
      width:55%; height:220%;
      transform: rotate(20deg);
      background: rgba(255,255,255,.22);
      transition: left .35s ease;
    }
    .btn-premium:hover:before{ left:120%; }

    /* Card depth + hover glow */
    .card-premium{
      border:1px solid var(--line);
      box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 10px 26px rgba(15,23,42,.08);
      transform: translateY(0);
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    .card-premium:hover{
      transform: translateY(-5px);
      border-color: rgba(90,11,131,.18);
      box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 20px 46px rgba(15,23,42,.14);
    }

    /* Accent bar */
    .accent-bar{ position: relative; }
    .accent-bar:before{
      content:"";
      position:absolute;
      left:0; top:0; bottom:0;
      width:4px;
      background: linear-gradient(180deg, rgba(90,11,131,.95), rgba(90,11,131,.25));
    }

    /* Section divider */
    .section-divider{ position: relative; }
    .section-divider:before{
      content:"";
      position:absolute;
      left:0; right:0; top:-1px;
      height:1px;
      background: linear-gradient(90deg, transparent, rgba(90,11,131,.30), transparent);
    }

    /* Reveal animation + stagger */
    @media (prefers-reduced-motion: no-preference){
      .reveal{ opacity:0; transform: translateY(14px); }
      .reveal.show{ opacity:1; transform: translateY(0); transition: opacity .7s ease, transform .7s ease; }
      .reveal[data-delay="1"].show{ transition-delay: .08s; }
      .reveal[data-delay="2"].show{ transition-delay: .16s; }
      .reveal[data-delay="3"].show{ transition-delay: .24s; }
    }

    /* Active state on left Explore links */
    .explore-link{ border: 1px solid transparent; }
    .explore-link.active{
      background:#fff;
      border-color: rgba(90,11,131,.18);
      box-shadow: 0 10px 20px rgba(15,23,42,.06);
      color: var(--brand);
      font-weight: 600;
    }

    /* Hero glow orb that moves with mouse (subtle) */
    .hero-orb{
      pointer-events:none;
      position:absolute;
      inset:-120px -120px auto auto;
      width:520px; height:520px;
      background: radial-gradient(circle at 30% 30%, rgba(90,11,131,.22), transparent 60%);
      filter: blur(2px);
      transform: translate3d(0,0,0);
      opacity:.9;
    }

/* ===== contact.html inline styles ===== */
body { font-family: 'Inter', sans-serif; }

    :root{
      --brand:#5A0B83;
      --brand2:#3E075B;
      --ink:#0b1220;
      --line:rgba(15, 23, 42, .10);
    }

    html { scroll-padding-top: 92px; }

    /* Background texture + wash (matches services/about) */
    .bg-noise{
      background-image:
        radial-gradient(rgba(90,11,131,.10) 1px, transparent 1px),
        radial-gradient(rgba(15,23,42,.06) 1px, transparent 1px);
      background-position: 0 0, 12px 12px;
      background-size: 24px 24px;
    }
    .bg-wash{
      background:
        radial-gradient(900px 520px at 12% -10%, rgba(90,11,131,.18), transparent 55%),
        radial-gradient(900px 520px at 88% 10%, rgba(62,7,91,.14), transparent 60%),
        linear-gradient(to bottom, #F9FAFB, #FFFFFF);
    }

    /* Nav glass */
    .nav-glass{
      background: rgba(255,255,255,.78);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid rgba(15,23,42,.08);
    }

    /* Progress bar under nav */
    .scroll-progress{
      position:absolute;
      left:0; bottom:-1px;
      height:2px;
      width:0%;
      background: linear-gradient(90deg, rgba(90,11,131,.9), rgba(90,11,131,.25));
    }

    /* Link underline */
    .link-underline{ position: relative; }
    .link-underline:after{
      content:"";
      position:absolute;
      left:0; bottom:-7px;
      height:2px; width:0%;
      background: var(--brand);
      transition: width .25s ease;
    }
    .link-underline:hover:after{ width:100%; }

    /* Premium buttons */
    .btn-premium{
      background: linear-gradient(135deg, var(--brand), var(--brand2));
      position: relative;
      overflow: hidden;
      box-shadow: 0 8px 22px rgba(90,11,131,.18);
      transition: transform .2s ease, box-shadow .2s ease;
    }
    .btn-premium:hover{
      transform: translateY(-1px);
      box-shadow: 0 14px 30px rgba(90,11,131,.24);
    }
    .btn-premium:before{
      content:"";
      position:absolute;
      top:-50%; left:-60%;
      width:55%; height:220%;
      transform: rotate(20deg);
      background: rgba(255,255,255,.22);
      transition: left .35s ease;
    }
    .btn-premium:hover:before{ left:120%; }

    /* Card depth + hover glow */
    .card-premium{
      border:1px solid var(--line);
      box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 10px 26px rgba(15,23,42,.08);
      transform: translateY(0);
      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    }
    .card-premium:hover{
      transform: translateY(-5px);
      border-color: rgba(90,11,131,.18);
      box-shadow: 0 1px 0 rgba(15,23,42,.04), 0 20px 46px rgba(15,23,42,.14);
    }

    /* Section divider */
    .section-divider{ position: relative; }
    .section-divider:before{
      content:"";
      position:absolute;
      left:0; right:0; top:-1px;
      height:1px;
      background: linear-gradient(90deg, transparent, rgba(90,11,131,.30), transparent);
    }

    /* Reveal animation + stagger */
    @media (prefers-reduced-motion: no-preference){
      .reveal{ opacity:0; transform: translateY(14px); }
      .reveal.show{ opacity:1; transform: translateY(0); transition: opacity .7s ease, transform .7s ease; }
      .reveal[data-delay="1"].show{ transition-delay: .08s; }
      .reveal[data-delay="2"].show{ transition-delay: .16s; }
      .reveal[data-delay="3"].show{ transition-delay: .24s; }
    }

    /* Office card hover – subtle lift + brand tint */
    .office-card{
      transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
    }
    .office-card:hover{
      transform: translateY(-4px);
      border-color: rgba(90, 11, 131, 0.22);
      box-shadow:
        0 1px 0 rgba(15,23,42,.04),
        0 22px 48px rgba(15,23,42,.16);
    }

    /* Inputs (minimal, premium) */
    .field{
      width:100%;
      background: transparent;
      border: 0;
      border-bottom: 1px solid rgba(15,23,42,.18);
      padding: 14px 2px;
      outline: none;
      transition: border-color .2s ease;
    }
    .field:focus{ border-bottom-color: rgba(90,11,131,.65); }
    .label{
      font-size: .8rem;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: rgba(15,23,42,.78);
    }
    
    /* ==============================
   Brand tokens (fallback)
   ============================== */
    :root{
      --brand:#5A0B83;
      --brandDark:#3E075B;
      --background:#F9FAFB;
    }
    
    /* Brand utility fallbacks */
    .bg-brand{ background-color: var(--brand) !important; }
    .bg-brandDark{ background-color: var(--brandDark) !important; }
    .bg-background{ background-color: var(--background) !important; }
    
    .text-brand{ color: var(--brand) !important; }
    .text-brandDark{ color: var(--brandDark) !important; }
    
    /* Hover utilities without backslashes (WAF-safe) */
    [class~="hover:bg-brand"]:hover{ background-color: var(--brand) !important; }
    [class~="hover:bg-brandDark"]:hover{ background-color: var(--brandDark) !important; }
    [class~="hover:text-brand"]:hover{ color: var(--brand) !important; }
    [class~="hover:text-brandDark"]:hover{ color: var(--brandDark) !important; }
    
   /* ==============================
   Services hover fallback
   ============================== */

    /* Base states (important!) */
    .svc-card .svc-img { 
      transform: scale(1);
      transition: transform .5s ease;
    }
    
    .svc-card .svc-overlay { 
      opacity: 0;
      transition: opacity .3s ease;
    }
    
    .svc-card .svc-overlay-inner { 
      transform: translateY(16px);
      transition: transform .3s ease;
    }
    
    /* Hover states */
    .svc-card:hover .svc-img { transform: scale(1.05); }
    .svc-card:hover .svc-overlay { opacity: 1; }
    .svc-card:hover .svc-overlay-inner { transform: translateY(0); }
    
    /* Force the Services overlay gradient (no Tailwind dependency) */
    .svc-card .svc-overlay{
      background: linear-gradient(to top,
        rgba(90,11,131,0.90),
        rgba(90,11,131,0.70),
        rgba(90,11,131,0.40)
      );
    }

    /* Tailwind slash-opacity fallback: bg-brand/10 */
    [class~="bg-brand/10"]{
      background-color: rgba(90, 11, 131, 0.10) !important; /* brand @ 10% */
    }

    /* Border utility fallbacks */
    .border-brand { border-color: var(--brand) !important; }
    .border-brandDark { border-color: var(--brandDark) !important; }
    
    /* If you ever use opacity borders like border-brand/10 etc. */
    [class~="border-brand/10"] { border-color: rgba(90, 11, 131, 0.10) !important; }
    [class~="border-brand/20"] { border-color: rgba(90, 11, 131, 0.20) !important; }
    [class~="border-brand/30"] { border-color: rgba(90, 11, 131, 0.30) !important; }
    [class~="border-brand/40"] { border-color: rgba(90, 11, 131, 0.40) !important; }

    
    /* ==============================
   Fluent Forms styling (Etezan)
   ============================== */
    
    /* Wrap spacing */
    .fluentform {
      width: 100%;
    }
    
    /* Labels */
    .fluentform .ff-el-form-control-label label,
    .fluentform label {
      display: block;
      margin-bottom: 8px;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: #111827; /* gray-900 */
    }
    
    /* Inputs + textarea */
    .fluentform .ff-el-form-control,
    .fluentform input[type="text"],
    .fluentform input[type="email"],
    .fluentform input[type="tel"],
    .fluentform textarea,
    .fluentform select {
      width: 100%;
      background: #F9FAFB;           /* same as your wash */
      border: 1px solid #E5E7EB;     /* gray-200 */
      border-radius: 12px;
      padding: 14px 14px;
      font-size: 15px;
      line-height: 1.4;
      color: #111827;
      outline: none;
      box-shadow: none;
      transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
    }
    
    /* Placeholder */
    .fluentform ::placeholder {
      color: #9CA3AF; /* gray-400 */
    }
    
    /* Focus */
    .fluentform .ff-el-form-control:focus,
    .fluentform input:focus,
    .fluentform textarea:focus,
    .fluentform select:focus {
      background: #ffffff;
      border-color: #5A0B83; /* brand */
      box-shadow: 0 0 0 4px rgba(90, 11, 131, 0.12);
    }
    
    /* Field spacing */
    .fluentform .ff-el-group {
      margin-bottom: 18px;
    }
    
    /* Two-column row spacing (matches your grid look) */
    .fluentform .ff-el-group.ff-el-group-row {
      gap: 18px;
    }
    
    /* Submit button */
    .fluentform .ff-btn-submit,
    .fluentform button[type="submit"] {
      background: #5A0B83; /* brand */
      color: #fff;
      border: none;
      border-radius: 10px;
      padding: 14px 26px;
      font-size: 13px;
      font-weight: 800;
      letter-spacing: .18em;
      text-transform: uppercase;
      cursor: pointer;
      transition: transform .15s ease, background-color .2s ease, box-shadow .2s ease;
      box-shadow: 0 10px 25px rgba(17, 24, 39, 0.10);
    }
    
    /* Hover */
    .fluentform .ff-btn-submit:hover,
    .fluentform button[type="submit"]:hover {
      background: #3E075B; /* brandDark */
      transform: translateY(-1px);
    }
    
    /* Align submit like your design (center) */
    .fluentform .ff_submit_btn_wrapper {
      display: flex;
      justify-content: center;
      margin-top: 12px;
    }
    
    /* Success message */
    .fluentform .ff-message-success {
      border: 1px solid rgba(16, 185, 129, .25);
      background: rgba(16, 185, 129, .08);
      color: #065F46;
      padding: 12px 14px;
      border-radius: 12px;
      margin-top: 14px;
    }
    
    /* Error messages */
    .fluentform .error.text-danger,
    .fluentform .ff-el-is-error .ff-el-form-control {
      border-color: #EF4444 !important;
    }
    
    .fluentform .error.text-danger {
      margin-top: 8px;
      font-size: 13px;
    }
    
    nav .is-active {
  color: #5A0B83;
}

/* ==============================
   FIX: outline brand buttons hover text (safe on mobile & Safari)
   ============================== */

[class~="hover:text-white"]:hover{
  color: #fff !important;
}

/* Outline → filled brand buttons */
.border-brand:hover,
a.border-brand:hover,
a[class*="border-brand"]:hover{
  color: #fff !important;
}

/* Keep button content above shine overlays */
.btn-premium,
a[class*="border-brand"]{
  position: relative;
}

.btn-premium > *,
a[class*="border-brand"] > *{
  position: relative;
  z-index: 2;
}

/* Shine effect should not block text */
.btn-premium::before{
  pointer-events: none;
}

/* Fix Safari/IOS blank text on hover for outline buttons */
.ez-btn-outline:hover{
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}