:root{
    --navy:#0B2620;
    --navy-2:#123832;
    --parchment:#F1FAF8;
    --white:#FFFFFF;
    --emerald:#2E7E69;
    --emerald-2:#3FA98C;
    --gold:#4FD3B0;
    --ink:#14201C;
    --muted:#57706B;
    --line:#D9EFEA;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter',sans-serif;
    color:var(--ink);
    background:var(--white);
    -webkit-font-smoothing:antialiased;
  }
  ::selection{background:var(--gold);color:var(--navy);}

  h1,h2,h3,h4,.font-display{
    font-family:'Fraunces',serif;
    letter-spacing:-0.01em;
  }
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:.72rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:var(--emerald-2);
    font-weight:500;
  }
  .eyebrow.on-dark{color:var(--gold);}
  .text-muted-2{color:var(--muted);}
  .bg-parchment{background:var(--parchment);}
  .bg-navy{background:var(--navy);}
  .divider-gold{
    width:56px;height:3px;background:var(--gold);border:0;
    margin:1.1rem 0 1.4rem;
  }

  a{color:inherit;text-decoration:none;}

  /* ---------- Navbar ---------- */
  .navbar-wx{
    padding:.85rem 0;
    background:rgba(14,27,42,0);
    transition:background .35s ease, box-shadow .35s ease, padding .35s ease;
  }
  .navbar-wx.scrolled{
    background:var(--navy);
    box-shadow:0 6px 24px rgba(14,27,42,.18);
    padding:.55rem 0;
  }
  .navbar-wx .navbar-brand{
    font-family:'Fraunces',serif;
    font-weight:600;
    font-size:1.35rem;
    color:var(--white);
    display:flex;align-items:center;gap:.55rem;
  }
  .brand-logo-wrap{
    display:inline-flex;align-items:center;
    background:#fff;
    border-radius:10px;
    padding:.35rem .7rem;
    line-height:0;
  }
  .brand-logo{height:32px;width:auto;display:block;}
  .brand-logo-footer{height:40px;}
  .navbar-wx .nav-link{
    color:rgba(255,255,255,.82) !important;
    font-weight:500;
    font-size:.93rem;
    padding:.5rem .95rem !important;
  }
  .navbar-wx .nav-link:hover{color:var(--gold) !important;}
  .navbar-wx .dropdown-menu{
    background:var(--navy-2);
    border:1px solid rgba(255,255,255,.08);
    border-radius:10px;
    padding:.4rem;
    margin-top:.6rem;
  }
  .navbar-wx .dropdown-item{
    color:rgba(255,255,255,.85);
    font-size:.9rem;
    border-radius:7px;
    padding:.55rem .8rem;
  }
  .navbar-wx .dropdown-item:hover{background:rgba(176,141,87,.16);color:var(--gold);}
  .btn-wx-gold{
    background:var(--gold);border:1px solid var(--gold);color:var(--navy);
    font-weight:600;padding:.55rem 1.3rem;border-radius:999px;font-size:.9rem;
  }
  .btn-wx-gold:hover{background:transparent;color:var(--gold);}
  .btn-wx-outline{
    border:1px solid rgba(255,255,255,.35);color:var(--white);
    font-weight:600;padding:.55rem 1.3rem;border-radius:999px;font-size:.9rem;
  }
  .btn-wx-outline:hover{border-color:var(--gold);color:var(--gold);}

  /* ---------- Hero ---------- */
  .hero{
    background:var(--navy);
    padding:9.5rem 0 6rem;
    position:relative;
    overflow:hidden;
  }
  .hero::before{
    content:"";position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size:44px 44px;
    mask-image:radial-gradient(ellipse at 30% 30%, black 15%, transparent 70%);
    pointer-events:none;
  }
  .hero h1{
    color:var(--white);
    font-size:clamp(2.3rem,4.4vw,3.4rem);
    line-height:1.1;
    font-weight:600;
  }
  .hero h1 em{
    font-style:italic;color:var(--gold);font-weight:500;
  }
  .hero p.lede{
    color:rgba(255,255,255,.72);
    font-size:1.06rem;
    max-width:520px;
    line-height:1.7;
  }
  .hero-chart{width:100%;height:auto;}
  .hero-chart .grid-line{stroke:rgba(255,255,255,.08);stroke-width:1;}
  .hero-chart .plot-line{
    fill:none;stroke:var(--gold);stroke-width:2.5;
    stroke-dasharray:640;stroke-dashoffset:640;
    animation:draw 2.6s ease forwards .3s;
  }
  .hero-chart .plot-fill{opacity:0;animation:fadeIn 1.4s ease forwards 1.6s;}
  .hero-chart .dot{
    fill:var(--gold);
    animation:travel 2.6s ease forwards .3s;
  }
  @keyframes draw{to{stroke-dashoffset:0;}}
  @keyframes fadeIn{to{opacity:1;}}
  @media (prefers-reduced-motion: reduce){
    .hero-chart .plot-line{animation:none;stroke-dashoffset:0;}
    .hero-chart .plot-fill{animation:none;opacity:1;}
    .hero-chart .dot{animation:none;}
  }
  .stat-chip{
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    padding:.9rem 1.1rem;
  }
  .stat-chip .num{
    font-family:'IBM Plex Mono',monospace;
    font-size:1.35rem;color:var(--white);font-weight:500;
  }
  .stat-chip .lbl{font-size:.76rem;color:rgba(255,255,255,.6);}

  /* ---------- Sanskrit strip ---------- */
  .strip-devanagari{
    background:var(--parchment);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:1.05rem 0;
    text-align:center;
    font-family:'Fraunces',serif;
    font-size:1.05rem;
    color:var(--emerald);
    letter-spacing:.02em;
  }

  /* ---------- Trust cards ---------- */
  .section-pad{padding:5.5rem 0;}
  .icon-badge{
    width:56px;height:56px;border-radius:14px;
    background:linear-gradient(145deg, var(--emerald), var(--emerald-2));
    display:flex;align-items:center;justify-content:center;
    color:var(--white);
  }
  .card-wx{
    background:var(--white);
    border:1px solid var(--line);
    border-radius:16px;
    padding:2rem;
    height:100%;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .card-wx:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(14,27,42,.09);}
  .card-wx h3{font-size:1.2rem;font-weight:600;margin:1.1rem 0 .6rem;}
  .card-wx a.learn{
    font-family:'IBM Plex Mono',monospace;font-size:.78rem;
    color:var(--emerald);text-transform:uppercase;letter-spacing:.06em;
    display:inline-flex;align-items:center;gap:.35rem;margin-top:.6rem;
  }
  .card-wx a.learn svg{transition:transform .2s ease;}
  .card-wx a.learn:hover svg{transform:translateX(3px);}

  /* ---------- Zigzag feature rows ---------- */
  .feature-row{padding:3.4rem 0;}
  .feature-row .ill-wrap{
    background:var(--parchment);
    border-radius:24px;
    padding:2.2rem;
    display:flex;align-items:center;justify-content:center;
  }
  .feature-row img{max-width:100%;height:auto;}
  .feature-row h3{font-size:1.7rem;font-weight:600;margin-bottom:.9rem;}
  .feature-row p{color:var(--muted);font-size:1.02rem;line-height:1.75;}

  /* ---------- Services baskets ---------- */
  .basket-card{
    border:1px solid var(--line);
    border-radius:18px;
    padding:2.2rem 1.9rem;
    height:100%;
    background:var(--white);
    position:relative;
  }
  .basket-card.featured{
    border-color:var(--gold);
    box-shadow:0 20px 45px rgba(176,141,87,.16);
  }
  .basket-card.featured .tag{
    position:absolute;top:-13px;left:1.9rem;
    background:var(--gold);color:var(--navy);
    font-family:'IBM Plex Mono',monospace;
    font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;
    padding:.3rem .7rem;border-radius:999px;font-weight:600;
  }
  .basket-card .basket-logo{
    width:52px;height:52px;border-radius:12px;
    background:var(--navy);color:var(--gold);
    display:flex;align-items:center;justify-content:center;
    font-family:'Fraunces',serif;font-weight:600;font-size:1.15rem;
    margin-bottom:1.1rem;
  }
  .basket-card h3{font-size:1.25rem;font-weight:600;margin-bottom:1rem;}
  .basket-card ul{list-style:none;padding:0;margin:0 0 1.4rem;}
  .basket-card ul li{
    padding:.42rem 0;border-bottom:1px dashed var(--line);
    font-size:.94rem;color:var(--ink);
  }
  .basket-card ul li:last-child{border-bottom:0;}
  .btn-basket{
    display:inline-flex;align-items:center;gap:.4rem;
    font-weight:600;font-size:.88rem;color:var(--emerald);
  }
  .basket-card.featured .btn-basket{color:var(--emerald);}

  /* ---------- How it works ---------- */
  .steps-wrap{position:relative;}
  .step-item{display:flex;gap:1.2rem;padding:1.5rem 0;border-bottom:1px solid var(--line);}
  .step-item:last-child{border-bottom:0;}
  .step-num{
    font-family:'IBM Plex Mono',monospace;
    font-size:.95rem;color:var(--emerald);font-weight:600;
    width:2.6rem;flex:none;
  }
  .step-item h4{font-size:1.05rem;font-weight:600;margin-bottom:.35rem;}
  .step-item p{color:var(--muted);font-size:.94rem;margin:0;}

  /* ---------- Footer ---------- */
  footer{background:var(--navy);color:rgba(255,255,255,.7);padding:4.5rem 0 0;}
  footer h4{
    color:var(--white);font-family:'IBM Plex Mono',monospace;
    font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
    margin-bottom:1.1rem;
  }
  footer ul{list-style:none;padding:0;margin:0;}
  footer ul li{margin-bottom:.65rem;font-size:.9rem;line-height:1.6;}
  footer a:hover{color:var(--gold);}
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);
    margin-top:3rem;padding:1.6rem 0;
    font-size:.82rem;color:rgba(255,255,255,.5);
  }
  .footer-warning{
    background:rgba(176,141,87,.08);
    border:1px solid rgba(176,141,87,.25);
    border-radius:12px;padding:1.1rem 1.3rem;
    font-size:.85rem;color:rgba(255,255,255,.75);
  }

  @media (max-width:991.98px){
    .navbar-wx{background:var(--navy);}
    .navbar-wx .dropdown-menu{background:rgba(255,255,255,.03);box-shadow:none;}
  }

/* ============ INNER PAGE ADDITIONS ============ */
.page-banner{
  background:var(--navy);
  padding:8.5rem 0 3.5rem;
  position:relative;
  overflow:hidden;
}
.page-banner::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse at 20% 20%, black 10%, transparent 65%);
  pointer-events:none;
}
.page-banner .crumb{
  font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(255,255,255,.55);
}
.page-banner .crumb a{color:rgba(255,255,255,.55);}
.page-banner .crumb a:hover{color:var(--gold);}
.page-banner h1{
  color:var(--white);font-size:clamp(1.9rem,3.4vw,2.6rem);font-weight:600;margin-top:.6rem;
}
.page-banner p.sub{color:rgba(255,255,255,.68);max-width:640px;margin-top:.8rem;font-size:1.02rem;}

.content-section{padding:4.5rem 0;}
.prose p{color:var(--ink);line-height:1.85;font-size:1.02rem;}
.prose ul{padding-left:1.3rem;}
.prose ul li{color:var(--ink);line-height:1.8;margin-bottom:.5rem;}
.prose h2{font-size:1.5rem;font-weight:600;margin:2.2rem 0 1rem;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-size:1.15rem;font-weight:600;margin:1.6rem 0 .7rem;color:var(--emerald);}
.side-illustration{
  background:var(--parchment);border-radius:20px;padding:1.8rem;
  display:flex;align-items:center;justify-content:center;
}

/* Pricing cards for product pages */
.price-card{
  border:1px solid var(--line);border-radius:16px;
  padding:2rem 1.6rem;text-align:center;height:100%;
  background:var(--white);
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.price-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(14,27,42,.09);border-color:var(--gold);}
.price-card .period{
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.12em;
  text-transform:uppercase;color:var(--emerald);margin-bottom:.8rem;
}
.price-card .amount{
  font-family:'Fraunces',serif;font-size:2rem;font-weight:600;color:var(--navy);margin-bottom:1.4rem;
}
.price-card .amount sup{font-size:1rem;color:var(--muted);font-family:'Inter',sans-serif;}
.price-card .btn{
  width:100%;background:var(--emerald);border-color:var(--emerald);color:#fff;
  font-weight:600;border-radius:999px;padding:.6rem 0;
}
.price-card .btn:hover{background:transparent;color:var(--emerald);}
.price-card.featured{border-color:var(--gold);box-shadow:0 20px 45px rgba(176,141,87,.14);}
.price-card.featured .btn{background:var(--gold);border-color:var(--gold);color:var(--navy);}
.price-card.featured .btn:hover{background:transparent;color:var(--gold);}

.check-list{list-style:none;padding:0;}
.check-list li{
  display:flex;gap:.7rem;align-items:flex-start;
  padding:.55rem 0;border-bottom:1px dashed var(--line);color:var(--ink);
  line-height:1.7;
}
.check-list li:last-child{border-bottom:0;}
.check-list li svg{flex:none;margin-top:.25rem;color:var(--emerald);}

/* Feature blocks (option genius style) */
.feature-block{
  border:1px solid var(--line);border-radius:16px;padding:1.9rem;height:100%;background:var(--white);
}
.feature-block .icon-badge{margin-bottom:1rem;}
.feature-block h3{font-size:1.15rem;font-weight:600;margin-bottom:.9rem;}
.feature-block ol{padding-left:1.1rem;margin:0;}
.feature-block ol li{color:var(--ink);line-height:1.75;margin-bottom:.55rem;font-size:.95rem;}

/* Tables (compliance data) */
.table-wx{width:100%;border-collapse:collapse;font-size:.88rem;}
.table-wx th{
  background:var(--navy);color:var(--white);
  font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.05em;
  text-transform:uppercase;padding:.75rem .9rem;text-align:left;font-weight:500;
}
.table-wx td{padding:.7rem .9rem;border-bottom:1px solid var(--line);color:var(--ink);}
.table-wx tbody tr:nth-child(even){background:var(--parchment);}
.table-wx tbody tr:last-child td{font-weight:600;background:rgba(176,141,87,.1);}
.table-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:14px;}
.table-scroll .table-wx{margin-bottom:0;}
.table-scroll .table-wx tr:last-child td{border-bottom:0;}

/* Escalation / contact cards */
.contact-card{
  border:1px solid var(--line);border-radius:16px;padding:1.7rem;height:auto;background:var(--white);
}
.contact-card h4{
  font-family:'IBM Plex Mono',monospace;font-size:.75rem;letter-spacing:.08em;
  text-transform:uppercase;color:var(--emerald);margin-bottom:.9rem;
}
.contact-card ul{list-style:none;padding:0;margin:0;}
.contact-card ul li{font-size:.92rem;color:var(--ink);margin-bottom:.55rem;line-height:1.6;}
.contact-card ul li strong{display:block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;font-family:'IBM Plex Mono',monospace;font-weight:500;margin-bottom:.15rem;}

/* Bank detail cards (subscription page) */
.bank-card{
  border:1px solid var(--line);border-radius:16px;padding:2rem;height:100%;background:var(--white);
  position:relative;overflow:hidden;
}
.bank-card::before{
  content:"";position:absolute;top:0;left:0;width:5px;height:100%;background:var(--emerald);
}
.bank-card.alt::before{background:var(--gold);}
.bank-card h3{font-size:1.15rem;font-weight:600;margin-bottom:1.1rem;}
.bank-card dl{margin:0;}
.bank-card dt{
  font-family:'IBM Plex Mono',monospace;font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted);margin-top:.85rem;
}
.bank-card dt:first-child{margin-top:0;}
.bank-card dd{margin:.15rem 0 0;font-size:.98rem;color:var(--ink);font-weight:500;}

/* Contact page form */
.form-wx label{font-size:.85rem;font-weight:600;color:var(--navy);margin-bottom:.35rem;}
.form-wx .form-control{
  border:1px solid var(--line);border-radius:10px;padding:.65rem .9rem;font-size:.95rem;
}
.form-wx .form-control:focus{
  border-color:var(--emerald);box-shadow:0 0 0 .2rem rgba(20,83,45,.12);
}
.stat-block{text-align:center;padding:1.4rem 0;}
.stat-block .num{
  font-family:'Fraunces',serif;font-size:2.3rem;font-weight:600;color:var(--navy);
}
.stat-block .lbl{font-size:.85rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}

.social-icons a{
  width:38px;height:38px;border-radius:50%;border:1px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;margin-right:.5rem;color:var(--navy);
}
.social-icons a:hover{background:var(--emerald);border-color:var(--emerald);color:#fff;}

/* ============================================================
   ACCESSIBILITY FIXES (WCAG 2.1/2.2 AA)
   ============================================================ */

/* Skip-to-content link */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:2000;
  background:var(--navy);color:#fff;
  padding:.85rem 1.4rem;border-radius:0 0 10px 0;
  font-weight:600;font-size:.9rem;border:2px solid var(--gold);border-left:0;border-top:0;
}
.skip-link:focus{left:0;}

/* Visible mobile hamburger icon — default Bootstrap icon is dark and was
   invisible against the solid navy mobile navbar background */
.navbar-toggler-icon{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.95%29' stroke-width='2.4' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}
.navbar-toggler{border:1px solid rgba(255,255,255,.35) !important;}

/* Visible keyboard focus states (none existed previously) */
a:focus-visible,
button:focus-visible,
.form-control:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
.dropdown-item:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:2px;
  border-radius:4px;
}
/* On light backgrounds, gold is low-contrast as an outline too — use emerald there */
.prose a:focus-visible,
.card-wx a:focus-visible,
.btn-basket:focus-visible,
.contact-card a:focus-visible,
footer a:focus-visible{
  outline-color:var(--emerald);
}

/* Active nav-link indicator (orientation aid, also sets aria-current below) */
.navbar-wx .nav-link.active-link{color:var(--gold) !important;font-weight:600;}

/* Converted inline SVG assets */
.icon-badge img, .learn img, .btn-basket img, .check-list img { display:inline-block; vertical-align:middle; }
