/* =========================================================
   AGENCY THEME ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€šÃ‚Â dark / amber redesign (overrides fashion.css)
   ========================================================= */
:root{
  --ax-bg:#0b0b0d;
  --ax-bg-soft:#131316;
  --ax-panel:#17181b;
  --ax-panel-2:#1e1f23;
  --ax-line:#2a2b30;
  --ax-text:#f4f4f2;
  --ax-text-soft:#a7a8ad;
  --ax-amber:#1fbded;
  --ax-amber-2:#1fbded;
  --ax-amber-soft: rgb(18 193 247 / 20%);
  --ax-white:#f5f7f6;
  --ax-white-soft:rgba(245,247,246,.08);
  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
}

body{background:var(--ax-bg) !important;color:var(--ax-text) !important;font-family:var(--font-body);}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display); color:var(--ax-text);}
a{color:inherit;text-decoration:none;}
::selection{background:var(--ax-amber);color:#052e2b;}

.ax-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  color:var(--ax-amber);font-weight:600;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.12em;margin-bottom:14px;
}
.ax-eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--ax-amber);display:inline-block;}

.ax-section{padding:100px 0;}
.ax-section-tight{padding:60px 0;}
.ax-section-alt{background:var(--ax-bg-soft);}

.ax-title{font-size:clamp(2rem,3.4vw,3rem);font-weight:700;line-height:1.15;color:#fff;}
.ax-sub{color:var(--ax-text-soft);font-size:1.05rem;max-width:640px;}

.ax-grad{background:linear-gradient(90deg,var(--ax-amber),var(--ax-amber-2));-webkit-background-clip:text;background-clip:text;color:transparent;}

/* ---------- NAVBAR override ---------- */

.ax-nav-pill{
  background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:999px;padding:6px;gap:4px;
}
.fb-nav-link{
  color:var(--ax-text-soft) !important;
  font-size:.85rem;
  font-weight:600;
  letter-spacing:.03em;
  padding:9px 18px;
  border-radius:999px;
  transition:.2s;
}
.fb-nav-link:hover{color: #17181b !important;}
.fb-nav-link.ax-nav-active{background:var(--ax-amber-soft);color:var(--ax-amber) !important;}

.ax-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 28px;border-radius:999px;font-weight:600;font-size:.95rem;
  transition:.25s;border:1px solid transparent;
}
.ax-btn-primary{background:var(--ax-white);color:#0a0a0c;}
.ax-btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(45,212,191,.25);color:#0a0a0c;background:#fff;}
.ax-btn-ghost{border-color:var(--ax-line);color:var(--ax-text);}
.ax-btn-ghost:hover{border-color:var(--ax-amber);color:var(--ax-amber);}

/* ---------- HERO (centered, bold headline style) ---------- */
.ax-hero{
  position:relative;overflow:hidden;padding:170px 0 80px;text-align:center;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 2px, transparent 2px 90px),
    var(--ax-bg);
}
.ax-hero::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(ellipse 55% 40% at 50% 6%, rgba(45,212,191,.22), transparent 70%);
  pointer-events:none;
}
.ax-hero-badge{
  position:relative;display:inline-flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border-radius:999px;
  background:var(--ax-panel);border:1px solid var(--ax-line);color:#fff;font-size:.78rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:28px;
}
.ax-hero-badge .num{
  background:linear-gradient(90deg,var(--ax-amber),var(--ax-amber-2));color:#052e2b;font-size:.72rem;font-weight:800;
  padding:4px 10px;border-radius:999px;
}
.ax-hero-title{
  position:relative;font-size:clamp(2.6rem,6vw,4.6rem);font-weight:700;color:#fff;line-height:1.06;margin-bottom:26px;
  max-width:900px;margin-left:auto;margin-right:auto;
}
.ax-hero-title .hl{
  display:inline-block;background:linear-gradient(90deg,var(--ax-amber),var(--ax-amber-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.ax-hero-title .ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5em;
    height: 1.5em;
    border-radius: 50%;
    background: linear-gradient(160deg,var(--ax-amber),var(--ax-amber-2));
    color: #052e2b;
    vertical-align: middle;
    margin: 0 6px;
    font-size: .55em;
}
.ax-hero-desc{position:relative;color:var(--ax-text-soft);font-size:1.1rem;max-width:560px;margin:0 auto 34px;}
.ax-hero-cta-wrap{position:relative;display:flex;justify-content:center;margin-bottom:36px;}
.ax-hero-social{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;}
.ax-hero-avatars{display:flex;}
.ax-hero-avatars img{
  width:38px;height:38px;border-radius:50%;object-fit:cover;border:2px solid var(--ax-bg);margin-left:-10px;
}
.ax-hero-avatars img:first-child{margin-left:0;}
.ax-hero-stars i{color:var(--ax-amber);font-size:.85rem;}
.ax-hero-social .lbl{color:var(--ax-text-soft);font-size:.8rem;margin-left:4px;}

/* ---------- MARQUEE ---------- */
.ax-marquee-wrap{border-top:1px solid var(--ax-line);border-bottom:1px solid var(--ax-line);padding:26px 0;overflow:hidden;background:var(--ax-bg-soft);}
.ax-marquee-track{display:flex;gap:70px;white-space:nowrap;animation:axmarquee 26s linear infinite;width:max-content;}
.ax-marquee-track span{font-family:var(--font-display);font-size:1.3rem;color:var(--ax-text-soft);letter-spacing:.05em;}
@keyframes axmarquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- SERVICES (asymmetric bento) ---------- */
.ax-service-card{
  background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;padding:32px;
  height:100%;transition:.3s;position:relative;overflow:hidden;
}
.ax-service-card:hover{border-color:var(--ax-amber);transform:translateY(-4px);}
.ax-service-num{font-family:var(--font-display);font-size:.85rem;color:var(--ax-amber);font-weight:700;}
.ax-service-icon{
  width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:var(--ax-amber-soft);color:var(--ax-amber);font-size:1.4rem;margin:18px 0;
}
.ax-service-card h5{color:#fff;margin-bottom:10px;}
.ax-service-card p{color:var(--ax-text-soft);font-size:.92rem;margin:0;}
.ax-service-featured{background:linear-gradient(160deg,var(--ax-amber),var(--ax-amber-2));color:#052e2b;}
.ax-service-featured .ax-service-num,.ax-service-featured p,.ax-service-featured h5{color:#083b36 !important;}
.ax-service-featured .ax-service-icon{background:rgba(5,46,43,.18);color:#052e2b;}

/* ---------- STATS STRIP ---------- */
.ax-stat-band{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:24px;padding:50px;}
.ax-stat-item{text-align:center;}
.ax-stat-item .num{font-family:var(--font-display);font-size:2.6rem;font-weight:700;color:var(--ax-amber);}
.ax-stat-item .lbl{color:var(--ax-text-soft);font-size:.88rem;margin-top:4px;}

/* ---------- CASE STUDIES / PORTFOLIO ---------- */
.ax-case-card{
  border-radius:20px;overflow:hidden;position:relative;border:1px solid var(--ax-line);
  background:var(--ax-panel);height:100%;
}
.ax-case-media{aspect-ratio:16/10;overflow:hidden;background:var(--ax-panel-2);}
.ax-case-media img{width:100%;height:100%;object-fit:cover;transition:.5s;}
.ax-case-card:hover .ax-case-media img{transform:scale(1.06);}
.ax-case-body{padding:22px;}
.ax-case-body h5{color:#fff;margin-bottom:6px;}
.ax-case-body .tag{color:var(--ax-amber);font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;font-weight:600;}
.ax-case-metrics{display:flex;gap:22px;margin-top:14px;}
.ax-case-metrics .m-num{font-family:var(--font-display);color:#fff;font-weight:700;font-size:1.3rem;}
.ax-case-metrics .m-lbl{color:var(--ax-text-soft);font-size:.75rem;}

/* ---------- TESTIMONIALS ---------- */
.ax-testi-card{
  background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:22px;padding:36px;height:100%;
}
.ax-testi-quote{color:#fff;font-size:1.15rem;line-height:1.6;font-family:var(--font-display);font-weight:500;}
.ax-testi-person{display:flex;align-items:center;gap:14px;margin-top:26px;}
.ax-testi-person img{width:52px;height:52px;border-radius:50%;object-fit:cover;}
.ax-testi-person .name{color:#fff;font-weight:600;font-size:.92rem;}
.ax-testi-person .role{color:var(--ax-text-soft);font-size:.8rem;}
.ax-stars i{color:var(--ax-amber);font-size:.85rem;}

/* ---------- PRICING ---------- */
.ax-price-card{
  background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:22px;padding:38px 32px;height:100%;position:relative;transition:.3s;
}
.ax-price-card:hover{border-color:var(--ax-amber);}
.ax-price-card.is-featured{background:linear-gradient(165deg,#0d1f1c,#111214);border-color:var(--ax-amber);}
.ax-price-ribbon{
  position:absolute;top:-14px;left:32px;background:linear-gradient(90deg,var(--ax-amber),var(--ax-amber-2));
  color:#052e2b;font-size:.72rem;font-weight:700;padding:6px 14px;border-radius:999px;text-transform:uppercase;letter-spacing:.05em;
}
.ax-price-amount{font-family:var(--font-display);font-size:2.6rem;font-weight:700;color:#fff;}
.ax-price-amount sup{font-size:1rem;color:var(--ax-amber);vertical-align:top;top:8px;position:relative;}
.ax-price-list{list-style:none;padding:0;margin:22px 0;}
.ax-price-list li{color:var(--ax-text-soft);font-size:.9rem;padding:7px 0;display:flex;gap:10px;align-items:flex-start;}
.ax-price-list li i{color:var(--ax-amber);margin-top:3px;}

/* ---------- FAQ ---------- */
.ax-faq-item{border-bottom:1px solid var(--ax-line);padding:22px 0;}
.ax-faq-item button{
  background:none;border:none;width:100%;text-align:left;color:#fff;font-family:var(--font-display);
  font-size:1.05rem;font-weight:600;display:flex;justify-content:space-between;align-items:center;
}
.ax-faq-item button i{color:var(--ax-amber);transition:.3s;}
.ax-faq-item .ax-faq-body{color:var(--ax-text-soft);padding-top:12px;font-size:.92rem;}

/* ---------- CONTACT / CTA ---------- */
.ax-cta-block{
  background:linear-gradient(120deg,#1e1a10,#131316);border:1px solid var(--ax-line);border-radius:28px;
  padding:70px 40px;text-align:center;position:relative;overflow:hidden;
}
.ax-input{
  background:var(--ax-panel-2) !important;border:1px solid var(--ax-line) !important;color:#fff !important;
  border-radius:12px !important;padding:13px 16px !important;
}
.ax-input::placeholder{color:var(--ax-text-soft);}
.ax-input:focus{border-color:var(--ax-amber) !important;box-shadow:none !important;}
.ax-label{color:var(--ax-text-soft);font-size:.82rem;margin-bottom:6px;display:block;}

/* ---------- FOOTER override ---------- */
.fb-footer{background:var(--ax-bg-soft) !important;border-top:1px solid var(--ax-line);}
.fb-footer h6{color:#fff;}
.fb-footer a{color:var(--ax-text-soft);}
.fb-footer a:hover{color:var(--ax-amber);}
.footer-bottom{border-top:1px solid var(--ax-line);color:var(--ax-text-soft);}

@media (max-width:991px){
  .ax-hero{padding:130px 0 60px;}
  .ax-hero-tag{display:none;}
}

/* =========================================================
   SITE-WIDE OVERRIDES ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€šÃ‚Â applies the dark/amber redesign
   to every remaining page (packages, checkout, contact,
   login, dashboard, service, terms, privacy, thank-you)
   ========================================================= */

body{background:var(--ax-bg) !important;}

/* Inner page hero banner (used on packages/checkout/contact/terms/privacy/service) */
.page-title-big-typography{
  background:radial-gradient(ellipse at 15% 0%, rgba(45,212,191,.16), transparent 55%), var(--ax-bg) !important;
  border-bottom:1px solid var(--ax-line);
  padding:150px 0 60px !important;
}
.page-title-big-typography h1{color:var(--ax-amber) !important;opacity:1 !important;font-family:var(--font-body);font-size:.95rem !important;text-transform:uppercase;letter-spacing:.12em;font-weight:600 !important;}
.page-title-big-typography h2{color:#fff !important;font-family:var(--font-display);font-size:clamp(1.8rem,3vw,2.6rem) !important;}

/* Generic sections / gray sections everywhere */
.section, .section-gray, .section-tight{background:var(--ax-bg);}
.section-gray{background:var(--ax-bg-soft) !important;}
.section-title{color:#fff;font-family:var(--font-display);}
.section-sub, .text-soft{color:var(--ax-text-soft) !important;}
.eyebrow{color:var(--ax-amber) !important;}

/* Cards used across services/service.html/dashboard etc */
.fb-card{background:var(--ax-panel) !important;border:1px solid var(--ax-line) !important;border-radius:18px !important;}
.fb-card:hover{border-color:var(--ax-amber) !important;}
.fb-icon{background:var(--ax-amber-soft) !important;color:var(--ax-amber) !important;}
.fb-card h5, .fb-card h6{color:#fff !important;}

/* Buttons everywhere */
.btn-primary-fb{background:var(--ax-white) !important;border:none !important;color:#0a0a0c !important;}
.btn-primary-fb:hover{box-shadow:0 10px 30px rgba(45,212,191,.35);transform:translateY(-2px);}
.btn-outline-fb{border:1px solid var(--ax-line) !important;color:var(--ax-text) !important;background:transparent !important;}
.btn-outline-fb:hover{border-color:var(--ax-amber) !important;color:var(--ax-amber) !important;}
.btn-ghost-fb{border:1px solid var(--ax-line) !important;color:#fff !important;}

/* Pricing cards (packages.html + home) */
.price-card{background:var(--ax-panel) !important;border:1px solid var(--ax-line) !important;border-radius:22px !important;}
.price-card.featured{background:linear-gradient(165deg,#1e1a10,#17181b) !important;border-color:var(--ax-amber) !important;}
.price-card .ribbon{background:linear-gradient(90deg,var(--ax-amber),var(--ax-amber-2)) !important;color:#052e2b !important;}
.price-amount{color:#fff !important;font-family:var(--font-display);}
.price-list li{color:var(--ax-text-soft) !important;}

/* Forms (checkout / contact / login) */
.fb-input{background:var(--ax-panel-2) !important;border:1px solid var(--ax-line) !important;color:#fff !important;}
.fb-input::placeholder{color:var(--ax-text-soft) !important;}
.fb-input:focus{border-color:var(--ax-amber) !important;box-shadow:none !important;}
.fb-label{color:var(--ax-text-soft) !important;}
.form-group-modern .fb-label{color:var(--ax-text-soft) !important;}

/* Checkout page */
.checkout-premium-section{background:var(--ax-bg);padding:80px 0;}
.checkout-card{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;padding:32px;}
.checkout-title{color:#fff;font-family:var(--font-display);}
.section-divider{border-top:1px solid var(--ax-line);margin:24px 0;}
.pl-card{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;color:var(--ax-text);}
.pl-card h5{color:#fff;}
.order-line{color:var(--ax-text-soft);display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--ax-line);}
.order-total{color:#fff;font-weight:700;display:flex;justify-content:space-between;padding:14px 0;font-family:var(--font-display);}

/* Contact info cards */
.info-strip-card{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:18px;padding:28px;text-align:center;}
.info-strip-card h6{color:#fff;margin:6px 0;}
.icon-tile{width:52px;height:52px;border-radius:14px;background:var(--ax-amber-soft);color:var(--ax-amber);display:flex;align-items:center;justify-content:center;margin:0 auto;}
.icon-tile svg{width:24px;height:24px;}

/* Login page */
.auth-wrap{min-height:100vh;}
.auth-left{background:linear-gradient(160deg,#1a1508,#0b0b0d);}
.auth-card{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:22px;padding:40px;}
.term-card{background:var(--ax-panel-2);border:1px solid var(--ax-line);border-radius:16px;padding:20px;}
.term-line{border-bottom:1px solid var(--ax-line);color:var(--ax-text-soft);display:flex;justify-content:space-between;padding:8px 0;}
.term-status{color:var(--ax-amber);}

/* Terms / privacy content */
.terms_sec{background:var(--ax-bg);color:var(--ax-text-soft);padding:60px 0;}
.terms_sec p, .terms_sec li{color:var(--ax-text-soft);}
.terms_sec h2, .terms_sec h3, .terms_sec h4{color:#fff;font-family:var(--font-display);}

/* Dashboard shell */
.db-body{background:var(--ax-bg) !important;}
.db-sidebar{background:var(--ax-panel) !important;border-right:1px solid var(--ax-line) !important;}
.db-nav-link{color:var(--ax-text-soft) !important;}
.db-nav-link:hover, .db-nav-link.active{color:var(--ax-amber) !important;background:var(--ax-amber-soft) !important;}
.db-nav-group{color:var(--ax-text-soft) !important;opacity:.6;}
.db-topbar{background:var(--ax-panel) !important;border-bottom:1px solid var(--ax-line) !important;}
.db-main{background:var(--ax-bg) !important;}
.mini-chart-card, .preview-frame{background:var(--ax-panel) !important;border:1px solid var(--ax-line) !important;color:var(--ax-text-soft);}
.preview-topbar span{background:var(--ax-line) !important;}

/* Accordion (FAQ elsewhere) */
.fb-accordion .accordion-item{background:var(--ax-panel) !important;border:1px solid var(--ax-line) !important;}
.fb-accordion .accordion-button{background:var(--ax-panel) !important;color:#fff !important;}
.fb-accordion .accordion-body{color:var(--ax-text-soft) !important;}

/* Plan features (allProducts partial rendered inline) */
.plan-features{color:var(--ax-text-soft);}
.plan-features i{color:var(--ax-amber);}

/* Generic table styling (thankyou / dashboard order tables) */
table{color:var(--ax-text-soft);}
table th{color:#fff;border-color:var(--ax-line) !important;}
table td{border-color:var(--ax-line) !important;}

/* =========================================================
   V2 REDESIGN ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€šÃ‚Â breadcrumb, bento inner-page hero, no-image
   sections, contrast fixes, checkout/login/thankyou overhaul
   ========================================================= */

/* ---------- CONTRAST FIXES (force dark surfaces) ---------- */
.info-strip-card,.fb-card,.price-card,.pl-card,.checkout-card,.auth-card,
.term-card,.db-card,.ax-price-card,.ax-service-card,.ax-testi-card,.ax-case-card,
.ax-stat-band,.ax-cta-block{background:var(--ax-panel) !important;border-color:var(--ax-line) !important;}
.info-strip-card h6,.pl-card h4,.pl-card h5,.checkout-title,.fb-card h5,.fb-card h6{color:#fff !important;}
.info-strip-card{transition:.25s;}
.info-strip-card:hover{border-color:var(--ax-amber) !important;transform:translateY(-3px);}

/* ---------- BREADCRUMB ---------- */
.ax-breadcrumb{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-bottom:22px;
  font-family:var(--font-body);font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;
}
.ax-breadcrumb a{color:var(--ax-text-soft);transition:.2s;}
.ax-breadcrumb a:hover{color:var(--ax-amber);}
.ax-breadcrumb .sep{color:var(--ax-line);font-size:.7rem;}
.ax-breadcrumb .current{color:var(--ax-amber);}
.ax-breadcrumb .home-ico{color:var(--ax-amber);font-size:.85rem;}

/* ---------- INNER PAGE HERO (bento, no image) ---------- */
.ax-page-hero{
  position:relative;overflow:hidden;padding:150px 0 60px;
  background:
    linear-gradient(180deg, rgba(45,212,191,.06), transparent 60%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 2px, transparent 2px 90px),
    var(--ax-bg);
  border-bottom:1px solid var(--ax-line);
}
.ax-page-hero::after{
  content:"";position:absolute;top:-120px;right:-120px;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(45,212,191,.18),transparent 70%);pointer-events:none;
}
.ax-page-hero .ax-eyebrow{margin-bottom:10px;}
.ax-page-hero h1{font-size:clamp(2rem,3.6vw,3.1rem);font-weight:700;color:#fff;margin-bottom:10px;}
.ax-page-hero p{color:var(--ax-text-soft);max-width:560px;margin:0;}
.ax-page-hero-stats{display:flex;gap:28px;margin-top:26px;flex-wrap:wrap;}
.ax-page-hero-stats div{border-left:2px solid var(--ax-amber);padding-left:12px;}
.ax-page-hero-stats .n{font-family:var(--font-display);color:#fff;font-weight:700;font-size:1.3rem;}
.ax-page-hero-stats .l{color:var(--ax-text-soft);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;}

/* ---------- BENTO GRID (generic, replaces image sections) ---------- */
.ax-bento{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;}
.ax-bento-tile{
  grid-column:span 3;background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;
  padding:30px;transition:.3s;position:relative;overflow:hidden;
}
.ax-bento-tile:hover{border-color:var(--ax-amber);transform:translateY(-4px);}
.ax-bento-tile.span-2{grid-column:span 2;}
.ax-bento-tile.span-4{grid-column:span 4;}
.ax-bento-tile.span-6{grid-column:span 6;}
.ax-bento-tile .tile-ico{
  width:50px;height:50px;border-radius:14px;background:var(--ax-amber-soft);color:var(--ax-amber);
  display:flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:16px;
}
.ax-bento-tile h5{color:#fff;margin-bottom:8px;}
.ax-bento-tile p{color:var(--ax-text-soft);font-size:.9rem;margin:0;}
.ax-bento-tile .tile-num{position:absolute;top:20px;right:24px;font-family:var(--font-display);font-size:2.4rem;font-weight:700;color:var(--ax-line);}
.ax-bento-tile.dark-amber{background:linear-gradient(160deg,var(--ax-amber),var(--ax-amber-2));}
.ax-bento-tile.dark-amber h5,.ax-bento-tile.dark-amber p,.ax-bento-tile.dark-amber .tile-ico{color:#052e2b !important;}
.ax-bento-tile.dark-amber .tile-ico{background:rgba(0,0,0,.15);}
@media (max-width:991px){.ax-bento{grid-template-columns:repeat(2,1fr);}.ax-bento-tile,.ax-bento-tile.span-2,.ax-bento-tile.span-4,.ax-bento-tile.span-6{grid-column:span 2;}}

/* ---------- Avatar / initial badges (replace <img> avatars) ---------- */
.ax-avatar-badge{
  width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,var(--ax-amber),var(--ax-amber-2));color:#052e2b;font-weight:700;font-size:.8rem;
  border:2px solid var(--ax-bg);margin-left:-10px;font-family:var(--font-display);
}
.ax-avatar-badge:first-child{margin-left:0;}
.ax-testi-person .ax-avatar-badge{margin-left:0;width:52px;height:52px;font-size:1.05rem;}

/* ---------- Case study (icon based, no photo) ---------- */
.ax-case-card{padding:30px;}
.ax-case-icon{
  width:56px;height:56px;border-radius:16px;background:var(--ax-amber-soft);color:var(--ax-amber);
  display:flex;align-items:center;justify-content:center;font-size:1.5rem;margin-bottom:20px;
}

/* ---------- STEP INDICATOR (checkout) ---------- */
.ax-steps{display:flex;align-items:center;gap:10px;margin-bottom:32px;flex-wrap:wrap;}
.ax-step{display:flex;align-items:center;gap:10px;color:var(--ax-text-soft);font-size:.85rem;font-weight:600;}
.ax-step .dot{width:30px;height:30px;border-radius:50%;background:var(--ax-panel);border:1px solid var(--ax-line);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.85rem;color:var(--ax-text-soft);}
.ax-step.is-active .dot,.ax-step.is-done .dot{background:linear-gradient(90deg,var(--ax-amber),var(--ax-amber-2));color:#052e2b;border-color:transparent;}
.ax-step.is-active,.ax-step.is-done{color:#fff;}
.ax-step-line{flex:1;height:1px;background:var(--ax-line);min-width:20px;}

/* ---------- Checkout summary card ---------- */
.pl-card{border-radius:20px !important;position:sticky;top:100px;}
.ax-trust-row{display:flex;gap:16px;margin-top:20px;flex-wrap:wrap;}
.ax-trust-row .t{display:flex;align-items:center;gap:8px;color:var(--ax-text-soft);font-size:.78rem;}
.ax-trust-row .t i{color:var(--ax-amber);}

/* ---------- Login page bento panel ---------- */
.auth-left{
  background:
    radial-gradient(ellipse 60% 50% at 80% 15%, rgba(45,212,191,.20), transparent 70%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 2px, transparent 2px 60px),
    linear-gradient(160deg,#141209,var(--ax-bg)) !important;
}
.auth-left .ax-bento-tile{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.09);}
.auth-left .ax-bento-tile h5,.auth-left .ax-bento-tile p{color:#fff;}
.auth-left .ax-bento-tile p{color:rgba(255,255,255,.65);}

/* ---------- Thank you success ring (no image) ---------- */
.ax-success-ring{
  width:96px;height:96px;border-radius:50%;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(160deg,var(--ax-amber),var(--ax-amber-2));color:#052e2b;font-size:2.4rem;
  box-shadow:0 0 0 10px var(--ax-amber-soft);
}

/* ---------- Order summary tiles (thank-you page) ---------- */
.ax-order-grid{display:flex;flex-direction:column;gap:14px;max-width:460px;}
.ax-order-tile{
  display:flex;align-items:center;gap:16px;text-align:left;
  background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:16px;padding:18px 22px;
}
.ax-order-tile .tile-ico{
  width:44px;height:44px;flex-shrink:0;border-radius:12px;background:var(--ax-amber-soft);color:var(--ax-amber);
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;
}
.ax-order-tile p{margin:0;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ax-text-soft);}
.ax-order-tile h5{margin:2px 0 0;color:#fff;font-size:1.05rem;}
.ax-order-tile.dark-amber{background:linear-gradient(100deg,var(--ax-amber),var(--ax-amber-2));border-color:transparent;}
.ax-order-tile.dark-amber .tile-ico{background:rgba(0,0,0,.15);color:#052e2b;}
.ax-order-tile.dark-amber p{color:rgba(5,46,43,.65);}
.ax-order-tile.dark-amber h5{color:#052e2b;}

/* ---------- Dashboard breadcrumb spacing tweak ---------- */
.db-content .ax-breadcrumb{margin-bottom:18px;}

.ax-hero-title .ico i {
    font-size: 20px;
}
/* =========================================================
   V3 Ã¢â‚¬â€ Codexa-style component library (hero code panel, orb,
   logo strip, tool panels, tabs, compare table, newsletter)
   ========================================================= */

/* ---------- Hero (left aligned) ---------- */
.ax-hero-v2{
  position:relative;overflow:hidden;padding:160px 0 90px;text-align:center;
  background:
    radial-gradient(ellipse 55% 45% at 50% 0%, rgba(45,212,191,.20), transparent 65%),
    var(--ax-bg);
  border-bottom:1px solid var(--ax-line);
}
.ax-hero-v2 h1{font-size:clamp(2.3rem,4.6vw,3.6rem);font-weight:700;color:#fff;line-height:1.15;max-width:760px;margin:0 auto 18px;}
.ax-hero-v2 p{color:var(--ax-text-soft);max-width:560px;margin:0 auto 32px;font-size:1.05rem;}

/* code editor mockup */
.ax-code-wrap{position:relative;max-width:920px;margin:0 auto;}
.ax-code-float-btn{
  position:absolute;top:-18px;right:6%;z-index:3;background:var(--ax-amber);color:#052e2b;
  font-size:.78rem;font-weight:700;padding:9px 16px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;
  box-shadow:0 10px 26px rgba(45,212,191,.35);
}
.ax-code-float-input{
  position:absolute;top:34px;right:6%;z-index:3;background:#fff;color:#0a0a0c;border-radius:12px;
  padding:10px 16px;font-size:.8rem;font-weight:600;box-shadow:0 14px 30px rgba(0,0,0,.35);
  display:flex;align-items:center;gap:8px;width:150px;
}
.ax-code-panel{
  background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.5);text-align:left;
}
.ax-code-tabbar{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--ax-line);background:var(--ax-panel-2);}
.ax-code-tabbar .dots{display:flex;gap:6px;margin-right:10px;}
.ax-code-tabbar .dots span{width:10px;height:10px;border-radius:50%;background:var(--ax-line);}
.ax-code-tabbar .tab{font-size:.78rem;color:var(--ax-text-soft);padding:5px 12px;border-radius:8px;font-family:var(--font-mono, var(--font-body));}
.ax-code-tabbar .tab.active{background:var(--ax-panel);color:#fff;}
.ax-code-body{display:flex;}
.ax-code-gutter{padding:20px 12px;color:#4a4b52;font-size:.78rem;line-height:1.85;text-align:right;font-family:var(--font-mono, monospace);border-right:1px solid var(--ax-line);user-select:none;}
.ax-code-lines{padding:20px 22px;font-size:.8rem;line-height:1.85;font-family:var(--font-mono, monospace);color:var(--ax-text-soft);text-align:left;overflow-x:auto;}
.ax-code-lines .kw{color:#f472b6;}
.ax-code-lines .fn{color:var(--ax-amber);}
.ax-code-lines .str{color:#fbbf24;}
.ax-code-lines .cm{color:#5b5c63;}
.ax-code-lines .pu{color:#8b8c93;}

/* ---------- Logo strip ---------- */
.ax-logo-strip{padding:34px 0;border-bottom:1px solid var(--ax-line);background:var(--ax-bg);}
.ax-logo-strip .lbl{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#5b5c63;text-align:center;margin-bottom:22px;}
.ax-logo-row{display:flex;align-items:center;justify-content:center;gap:56px;flex-wrap:wrap;opacity:.55;}
.ax-logo-row .item{font-family:var(--font-display);font-weight:700;font-size:1.1rem;color:var(--ax-text-soft);display:flex;align-items:center;gap:8px;}

/* ---------- Orb graphic ---------- */
.ax-orb-wrap{position:relative;display:flex;align-items:center;justify-content:center;height:100%;min-height:260px;}
.ax-orb{
  position:relative;width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, rgba(45,212,191,.9), rgba(45,212,191,.15) 60%, transparent 75%);
  filter:blur(0px);
}
.ax-orb::before {
    content: "{";
    font-size: 63px;
    position: absolute;
    display: flex;
    inset: -40px;
    padding-right: 30px;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(45,212,191,.18), transparent 70%);
}
.ax-orb::after {
    content: "}";
    position: absolute;
    justify-content: center;
    display: flex;
    font-size: 63px;
    align-items: center;
    padding-left: 38px;
    color: #2dd4bf;
    inset: 18px;
    border-radius: 50%;
    border: 1px solid rgba(45,212,191,.35);
}
.ax-feature-row{display:flex;gap:14px;align-items:flex-start;padding:22px 0;border-top:1px solid var(--ax-line);}
.ax-feature-row:first-child{border-top:none;}
.ax-feature-row .ico{width:38px;height:38px;flex:none;border-radius:10px;background:var(--ax-amber-soft);color:var(--ax-amber);display:flex;align-items:center;justify-content:center;}
.ax-feature-row h6{color:#fff;margin-bottom:4px;font-size:.98rem;}
.ax-feature-row p{color:var(--ax-text-soft);font-size:.86rem;margin:0;}

/* ---------- Tool panel cards (workflow sync / status list) ---------- */
.ax-tool-panel{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;padding:24px;height:100%;}
.ax-tool-row{display:flex;align-items:center;justify-content:space-between;padding:13px 14px;border-radius:12px;background:var(--ax-panel-2);margin-bottom:10px;font-size:.85rem;color:var(--ax-text-soft);}
.ax-tool-row .status{font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px;}
.ax-tool-row .status.on{background:var(--ax-amber-soft);color:var(--ax-amber);}
.ax-tool-row .status.off{background:rgba(148,150,158,.14);color:#9a9ba1;}
.ax-check-list{list-style:none;padding:0;margin:0;}
.ax-check-list li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;color:var(--ax-text-soft);font-size:.9rem;}
.ax-check-list li i{color:var(--ax-amber);margin-top:3px;}

/* ---------- Metrics panel with mini bar chart ---------- */
.ax-metric-panel{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:20px;padding:26px;}
.ax-metric-bars{display:flex;align-items:flex-end;gap:6px;height:90px;margin:18px 0;}
.ax-metric-bars span{flex:1;background:linear-gradient(180deg,var(--ax-amber),rgba(45,212,191,.15));border-radius:5px 5px 0 0;}
.ax-big-num{font-family:var(--font-display);font-size:3.2rem;font-weight:700;color:#fff;line-height:1;}
.ax-big-num .tag{display:inline-block;vertical-align:middle;margin-left:10px;background:var(--ax-amber-soft);color:var(--ax-amber);font-size:.7rem;font-weight:700;padding:4px 10px;border-radius:999px;}
.ax-avatar-strip{display:flex;gap:10px;margin-top:22px;}
.ax-avatar-strip .a{width:56px;height:56px;border-radius:12px;background:var(--ax-panel-2);border:1px solid var(--ax-line);display:flex;align-items:center;justify-content:center;color:var(--ax-text-soft);}

/* ---------- 3-step section ---------- */
.ax-step-card{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:18px;padding:24px;height:100%;}
.ax-step-card .k {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--ax-amber);
    margin-bottom: 16px;
    display: block;
}
.ax-step-icon-row{display:flex;gap:10px;margin-bottom:18px;}
.ax-step-icon-row .ic{width:38px;height:38px;border-radius:10px;background:var(--ax-panel-2);border:1px solid var(--ax-line);display:flex;align-items:center;justify-content:center;color:var(--ax-text-soft);}
.ax-step-card h5{color:#fff;font-size:1.02rem;margin-bottom:6px;}
.ax-step-card p{color:var(--ax-text-soft);font-size:.85rem;margin:0;}
.ax-sparkline{height:70px;display:flex;align-items:center;}

/* ---------- Tabs (decisions section) ---------- */
.ax-pill-tabs{display:inline-flex;gap:6px;background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:999px;padding:6px;margin-bottom:34px;}
.ax-pill-tabs .t{padding:9px 20px;border-radius:999px;font-size:.85rem;font-weight:600;color:var(--ax-text-soft);cursor:pointer;}
.ax-pill-tabs .t.active{background:var(--ax-amber);color:#052e2b;}
.ax-decision-panel{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:22px;padding:48px;}
.ax-decision-panel h3{color:#fff;font-size:1.5rem;margin-bottom:14px;}
.ax-decision-panel p{color:var(--ax-text-soft);max-width:600px;margin:0 auto 24px;}

/* ---------- Compare table ---------- */
.ax-compare{background:var(--ax-panel);border:1px solid var(--ax-line);border-radius:22px;overflow:hidden;}
.ax-compare-row{display:grid;grid-template-columns:1fr 1fr;}
.ax-compare-col{padding:34px;}
.ax-compare-col.is-us{background:linear-gradient(165deg,#0d1f1c,var(--ax-panel));}
.ax-compare-col h6{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ax-text-soft);margin-bottom:20px;}
.ax-compare-col.is-us h6{color:var(--ax-amber);}
.ax-compare-item{display:flex;gap:10px;align-items:flex-start;padding:10px 0;font-size:.9rem;color:var(--ax-text-soft);}
.ax-compare-item i{margin-top:3px;}
.ax-compare-col:not(.is-us) .ax-compare-item i{color:#6b6c73;}
.ax-compare-col.is-us .ax-compare-item i{color:var(--ax-amber);}
@media (max-width:767px){.ax-compare-row{grid-template-columns:1fr;}}

/* ---------- Newsletter footer bar ---------- */
.ax-newsletter{display:flex;gap:8px;max-width:360px;}
.ax-newsletter input{flex:1;background:var(--ax-panel-2);border:1px solid var(--ax-line);color:#fff;border-radius:10px;padding:11px 14px;font-size:.85rem;}
.ax-newsletter input::placeholder{color:var(--ax-text-soft);}
.ax-newsletter button{background:var(--ax-amber);color:#052e2b;border:none;border-radius:10px;padding:11px 18px;font-weight:700;font-size:.85rem;}

/* ---------- section badges reused as pill eyebrow with border ---------- */
.ax-pill-eyebrow{
  display:inline-flex;align-items:center;gap:8px;border:1px solid var(--ax-line);background:var(--ax-panel);
  color:var(--ax-amber);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;
  padding:7px 16px;border-radius:999px;margin-bottom:18px;
}
.ax-pill-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ax-amber);}

@media (max-width:991px){
  .ax-hero-v2{padding:130px 0 60px;}
  .ax-code-float-btn,.ax-code-float-input{display:none;}
}

/* =========================================================
   V4 Ã¢â‚¬â€ full-page grid pattern + section dividers (match ref)
   ========================================================= */
html{background:var(--ax-bg);}
body{
  background-color:var(--ax-bg) !important;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) !important;
  background-size:64px 64px !important;
  background-position:center top !important;
}

/* section dividers everywhere (thin hairline like the reference) */
.ax-hero-v2{border-bottom:1px solid var(--ax-line);}
.ax-logo-strip{border-bottom:1px solid var(--ax-line);}
.ax-marquee-wrap{border-top:1px solid var(--ax-line);border-bottom:1px solid var(--ax-line);}
#platform,#tooling,#metrics,#steps,#reliability,#compare,#pricing,#testimonials,#faq{
  border-top:1px solid var(--ax-line);
}
.ax-section-alt{background:var(--ax-bg-soft) !important;}

/* remove the old radial full-bleed gradients so the grid reads cleanly, keep a soft glow only near hero top */
.ax-hero-v2{
  background:
    radial-gradient(ellipse 55% 40% at 50% 0%, rgba(45,212,191,.16), transparent 65%),
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
    var(--ax-bg);
  background-size:auto,64px 64px,64px 64px,auto;
  background-position:center top;
}

/* tighten hero eyebrow pill to match reference (smaller, icon + text, centered) */
.ax-pill-eyebrow{font-size:.68rem;padding:6px 14px 6px 10px;}

/* vertical column-guide dividers at the container edges (site-wide, matches reference) */
body::before,body::after{
  content:"";position:fixed;top:0;bottom:0;width:1px;
  background:var(--ax-line);z-index:1;pointer-events:none;opacity:.7;
}
body::before{left:calc(50% - 570px);}
body::after{right:calc(50% - 570px);}
@media (max-width:1240px){body::before,body::after{display:none;}}

/* finer, denser hero grid to match reference's tighter cell size */
.ax-hero-v2{
  background:
    radial-gradient(ellipse 55% 40% at 50% 0%, rgba(45,212,191,.16), transparent 65%),
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px),
    var(--ax-bg);
  background-size:auto,44px 44px,44px 44px,auto;
  background-position:center top;
}

/* logo row: smaller caps + subtle divider under each */
.ax-logo-row .item{font-size:.95rem;opacity:.7;}

/* section spacing tightened slightly to mirror reference density */
.ax-section{padding:84px 0;}
.ax-section-tight{padding:50px 0;}

/* orb: sharper teal core with more defined ring like reference brain/orb glow */
.ax-orb{
  width:170px;
  height:170px;
  background: radial-gradient(circle at 38% 32%, rgb(11 11 13), rgb(11 11 13) 55%, transparent 72%);
  box-shadow:0 0 90px rgba(45,212,191,.35);
}

/* code panel: match reference's tighter radius + darker gutter */
.ax-code-panel{border-radius:16px;}
.ax-code-tabbar{padding:12px 16px;}

/* compare table divider between columns like screenshot's card border */
.ax-compare-row{position:relative;}
.ax-compare-row::after{
  content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:var(--ax-line);
}
@media (max-width:767px){.ax-compare-row::after{display:none;}}
