/* Safe V1 performance polish: no layout/navigation changes */
img{height:auto}
.photo-lightbox,.sidebar-overlay,.rsb2-overlay,.lsb-overlay,.toolkit-overlay,.ai-overlay{will-change:opacity}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{scroll-behavior:auto!important}}

/* V1 desktop nav no-wrap hotfix: keeps Knowledge Hub + Credentials in the main row.
   Mobile menu behavior is intentionally untouched. */
@media (min-width:901px){
  html body .nav,
  html body .global-nav{
    min-height:var(--nav-h,66px)!important;
    overflow:visible!important;
  }
  html body .nav .nav-inner,
  html body .global-nav .nav-inner{
    max-width:min(1540px,calc(100vw - 64px))!important;
    height:var(--nav-h,66px)!important;
    min-height:var(--nav-h,66px)!important;
    padding-left:clamp(18px,2vw,28px)!important;
    padding-right:clamp(18px,2vw,28px)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    flex-wrap:nowrap!important;
    gap:clamp(10px,1.1vw,24px)!important;
    overflow:visible!important;
  }
  html body .nav .brand,
  html body .global-nav .brand{
    flex:0 0 auto!important;
    min-width:0!important;
    white-space:nowrap!important;
  }
  html body .nav .brand-text,
  html body .global-nav .brand-text{
    min-width:0!important;
    max-width:280px!important;
  }
  html body .nav .brand-text span,
  html body .nav .brand-text small,
  html body .global-nav .brand-text span,
  html body .global-nav .brand-text small{
    white-space:nowrap!important;
  }
  html body .nav .nav-links,
  html body .global-nav .nav-links{
    display:flex!important;
    flex:1 1 auto!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:center!important;
    flex-wrap:nowrap!important;
    gap:clamp(1px,.32vw,8px)!important;
    overflow:visible!important;
  }
  html body .nav .nav-links > li,
  html body .global-nav .nav-links > li{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }
  html body .nav .nav-links > li > a,
  html body .nav .nav-links > li > button,
  html body .global-nav .nav-links > li > a,
  html body .global-nav .nav-links > li > button{
    white-space:nowrap!important;
    font-size:clamp(.72rem,.74vw,.86rem)!important;
    padding:7px clamp(5px,.46vw,11px)!important;
    line-height:1.2!important;
  }
  html body .nav .nav-cta,
  html body .global-nav .nav-cta{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    margin-left:clamp(6px,.9vw,18px)!important;
  }
  html body .nav .nav-cta .btn,
  html body .global-nav .nav-cta .btn{
    white-space:nowrap!important;
    min-width:0!important;
    padding-inline:clamp(13px,1vw,22px)!important;
    font-size:clamp(.76rem,.78vw,.9rem)!important;
  }
  html body #servicesMega .nav-mega,
  html body #servicesMega .nav-mega--services{
    top:calc(100% + 8px)!important;
  }
}
@media (min-width:901px) and (max-width:1240px){
  html body .nav .brand-text small,
  html body .global-nav .brand-text small{
    font-size:.50rem!important;
    letter-spacing:.11em!important;
  }
  html body .nav .nav-links > li > a,
  html body .nav .nav-links > li > button,
  html body .global-nav .nav-links > li > a,
  html body .global-nav .nav-links > li > button{
    font-size:.70rem!important;
    padding-inline:5px!important;
  }
  html body .nav .nav-cta .btn,
  html body .global-nav .nav-cta .btn{
    font-size:.76rem!important;
    padding-inline:12px!important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   WORLD-CLASS POLISH LAYER · 2026
   Loaded last in the cascade. Wins all conflicts.
   Premium typography rhythm · Footer · Microinteractions · Contrast · SEO
═══════════════════════════════════════════════════════════════════════════ */

/* ─── 1. TOKEN REFINEMENT — warmer ivory, calmer slate ──────────────────── */
:root{
  --ivory-2:#F5F1E8;
  --muted-hi:#A8BACC;          /* ~AA on midnight bg (was #9FB3C8) */
  --subtle-hi:#7E8FA3;
  --gold-hi:#EFD58E;
  --teal-hi:#2BD3E6;
  --ring:0 0 0 3px rgba(15,163,177,.18), 0 0 0 1px rgba(15,163,177,.5);
  --lift:0 1px 0 rgba(255,255,255,.04) inset, 0 18px 50px -18px rgba(0,0,0,.55);
}

/* ─── 2. TYPOGRAPHY RHYTHM — fluid modular scale ────────────────────────── */
html body{
  font-feature-settings:"ss01","cv11","kern" 1, "liga" 1, "calt" 1;
  text-rendering:optimizeLegibility;
}
html body h1,html body h2,html body h3,html body h4{
  font-feature-settings:"ss01","cv11","onum" 1, "ss02" 1;
  text-wrap:balance;
}
html body p,html body li,html body .section-copy{
  text-wrap:pretty;
}

/* Refined serif headings — optical sizing + tracking tuned per scale */
html body h1{
  letter-spacing:-.034em !important;
  line-height:1.04 !important;
  font-variation-settings:"opsz" 144, "SOFT" 100 !important;
}
html body h2{
  letter-spacing:-.028em !important;
  line-height:1.08 !important;
  font-variation-settings:"opsz" 96, "SOFT" 80 !important;
}
html body h3{
  letter-spacing:-.022em !important;
  line-height:1.18 !important;
  font-variation-settings:"opsz" 48, "SOFT" 60 !important;
}

/* Lifted muted contrast — AA-compliant on midnight bg */
html body .section-copy,
html body .hero-sub,
html body p.about-profile-lead,
html body .about-editorial-body p,
html body .why-card p,
html body .exp-card>p,
html body .tl-desc,
html body .metric .stat-desc,
html body .partners-lead{
  color:var(--muted-hi) !important;
}

/* ─── 3. HERO REFINEMENT ────────────────────────────────────────────────── */
html body .hero h1,
html body .hero .d1{
  font-feature-settings:"ss01","onum" 1, "case" 1;
}
html body .hero-title-subline{
  font-weight:500 !important;
  color:var(--ivory-2) !important;
  opacity:.92;
}
html body .hero-title-subline .nz-mark{
  font-weight:700 !important;
  background:linear-gradient(135deg,var(--teal-hi,#2BD3E6),#65EBF5);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
html body .hero-sub strong{
  color:var(--ivory-2) !important;
  font-weight:600 !important;
}
html body .status-pill{
  background:linear-gradient(135deg,rgba(15,163,177,.12),rgba(15,163,177,.06)) !important;
  border-color:rgba(15,163,177,.3) !important;
}
html body .hero-trust{
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.005)) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:18px !important;
  padding:22px clamp(14px,2vw,28px) !important;
  backdrop-filter:blur(12px) !important;
  box-shadow:var(--lift) !important;
}
html body .hero-trust b{
  font-feature-settings:"tnum","onum" 1;
  letter-spacing:-.025em;
}

/* Hero photo frame — softer halo, tighter chips */
html body .hero-photo .photo-frame{
  box-shadow:
    0 0 0 1px rgba(15,163,177,.28),
    0 36px 100px -20px rgba(0,0,0,.6),
    0 0 80px -10px rgba(15,163,177,.22) !important;
}
html body .photo-chip{
  background:rgba(11,31,58,.88) !important;
  backdrop-filter:blur(24px) saturate(180%) !important;
  border:1px solid rgba(15,163,177,.32) !important;
  box-shadow:0 12px 36px -8px rgba(0,0,0,.55), 0 0 0 1px rgba(255,255,255,.04) inset !important;
}

/* ─── 4. CARDS — premium lift on hover ──────────────────────────────────── */
html body .why-card,
html body .exp-card,
html body .testimonial,
html body .khub-card,
html body .partner-card,
html body .p26-path-card,
html body .metric{
  transition:transform .35s cubic-bezier(.16,1,.3,1),
             border-color .25s ease,
             box-shadow .35s cubic-bezier(.16,1,.3,1),
             background .25s ease !important;
}
html body .why-card:hover,
html body .exp-card:hover,
html body .partner-card:hover,
html body .p26-path-card:hover{
  transform:translateY(-5px) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.05) inset,
    0 28px 70px -20px rgba(0,0,0,.55),
    0 0 0 1px rgba(15,163,177,.18) !important;
}

/* ─── 5. BUTTONS — refined micro-interactions ───────────────────────────── */
html body .btn{
  font-feature-settings:"ss01","case" 1;
  letter-spacing:-.005em !important;
  transition:transform .25s cubic-bezier(.16,1,.3,1),
             box-shadow .35s cubic-bezier(.16,1,.3,1),
             background .25s ease !important;
}
html body .btn.primary{
  background:linear-gradient(135deg,#0FA3B1,#15C5D8 60%,#1EDDEE) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.18) inset,
    0 8px 26px -6px rgba(15,163,177,.45),
    0 0 0 1px rgba(15,163,177,.4) !important;
}
html body .btn.primary:hover{
  transform:translateY(-2px) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 16px 44px -10px rgba(15,163,177,.6),
    0 0 0 1px rgba(15,163,177,.55) !important;
}
html body .btn.ghost:hover{
  background:rgba(15,163,177,.08) !important;
  color:var(--teal-hi,#2BD3E6) !important;
  border-color:rgba(15,163,177,.4) !important;
}

/* ─── 6. SECTION RHYTHM — consistent vertical spacing ───────────────────── */
html body .section{
  padding-top:clamp(72px,8.4vw,124px) !important;
  padding-bottom:clamp(72px,8.4vw,124px) !important;
}
html body .section-head{
  margin-bottom:clamp(36px,5vw,64px) !important;
}
html body .eyebrow{
  font-weight:600 !important;
  letter-spacing:.24em !important;
  color:var(--teal-hi,#2BD3E6) !important;
}

/* ─── 7. WORLD-CLASS FOOTER — Linear/Stripe-grade ───────────────────────── */
html body .site-footer-v14{
  position:relative;
  border-top:1px solid rgba(15,163,177,.12) !important;
  background:
    radial-gradient(900px 360px at 50% 0%, rgba(15,163,177,.06), transparent 70%),
    linear-gradient(180deg, rgba(8,15,28,.6) 0%, #050b18 100%) !important;
  overflow:hidden;
}
html body .site-footer-v14::before{
  content:"";
  position:absolute; top:0; left:50%; transform:translateX(-50%);
  width:min(960px,80%); height:1px;
  background:linear-gradient(90deg,transparent,rgba(15,163,177,.4),rgba(232,201,122,.25),transparent);
  pointer-events:none;
}
html body .sf14-top{ padding:clamp(56px,6vw,80px) 0 clamp(40px,4.5vw,56px) !important; }
html body .sf14-grid{
  gap:clamp(28px,4vw,52px) clamp(28px,3.6vw,44px) !important;
  align-items:start !important;
}
html body .sf14-brand{ max-width:340px; }
html body .sf14-logo{ gap:14px !important; align-items:center !important; margin-bottom:18px !important; }
html body .sf14-avatar{
  width:46px !important; height:46px !important;
  border-radius:14px !important;
  border:1.5px solid rgba(15,163,177,.32) !important;
  box-shadow:
    0 0 0 3px rgba(8,15,28,1),
    0 6px 20px -4px rgba(15,163,177,.22),
    0 0 0 1px rgba(255,255,255,.04) inset !important;
}
html body .sf14-name{
  font-family:var(--serif,'Fraunces',serif) !important;
  font-size:1.08rem !important;
  font-weight:500 !important;
  color:var(--ivory-2) !important;
  letter-spacing:-.015em !important;
  line-height:1.2 !important;
  display:block;
}
html body .sf14-entity{
  font-family:var(--mono,'DM Mono',monospace) !important;
  font-size:.62rem !important;
  color:var(--teal-hi,#2BD3E6) !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
  margin-top:3px !important;
  display:block;
}
html body .sf14-tagline{
  font-size:.88rem !important;
  line-height:1.7 !important;
  color:var(--muted-hi,#A8BACC) !important;
  margin-bottom:20px !important;
}
html body .sf14-socials{ gap:8px !important; margin-top:4px !important; }
html body .sf14-social{
  width:36px !important; height:36px !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:var(--muted-hi,#A8BACC) !important;
  font-size:.84rem !important;
  font-weight:700 !important;
  transition:all .22s cubic-bezier(.16,1,.3,1) !important;
}
html body .sf14-social:hover{
  background:rgba(15,163,177,.12) !important;
  border-color:rgba(15,163,177,.42) !important;
  color:var(--teal-hi,#2BD3E6) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 8px 20px -6px rgba(15,163,177,.35) !important;
}
html body .sf14-heading{
  font-family:var(--mono,'DM Mono',monospace) !important;
  font-size:.62rem !important;
  font-weight:700 !important;
  letter-spacing:.22em !important;
  text-transform:uppercase !important;
  color:var(--teal-hi,#2BD3E6) !important;
  margin-bottom:18px !important;
  padding-bottom:12px !important;
  border-bottom:1px solid rgba(15,163,177,.14) !important;
  position:relative;
}
html body .sf14-heading::after{
  content:""; position:absolute; left:0; bottom:-1px;
  width:24px; height:1px;
  background:linear-gradient(90deg,#15C5D8,#E8C97A);
}
html body .sf14-links{ gap:11px !important; }
html body .sf14-links a{
  font-size:.84rem !important;
  font-weight:500 !important;
  color:var(--muted-hi,#A8BACC) !important;
  letter-spacing:-.005em !important;
  transition:color .2s, transform .2s, padding-left .2s !important;
}
html body .sf14-links a:hover{
  color:var(--ivory-2) !important;
  transform:translateX(2px) !important;
}
html body .sf14-contact-list{ display:flex; flex-direction:column; gap:10px; list-style:none; padding:0; margin:0; }
html body .sf14-contact-list a,
html body .sf14-contact-list .sf14-plain{
  display:inline-flex !important; align-items:center !important; gap:10px !important;
  font-size:.84rem !important;
  color:var(--muted-hi,#A8BACC) !important;
  text-decoration:none !important;
  transition:color .2s !important;
}
html body .sf14-contact-list a:hover{ color:var(--teal-hi,#2BD3E6) !important; }
html body .sf14-ci{
  width:32px !important; height:32px !important;
  border-radius:9px !important;
  background:rgba(15,163,177,.08) !important;
  border:1px solid rgba(15,163,177,.18) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:.92rem !important;
  flex:0 0 32px !important;
}
html body .sf14-cta{
  background:linear-gradient(135deg,#0FA3B1,#15C5D8) !important;
  color:#06212e !important;
  font-size:.84rem !important; font-weight:700 !important;
  letter-spacing:-.005em !important;
  padding:12px 20px !important;
  border-radius:10px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.18) inset,
    0 8px 22px -6px rgba(15,163,177,.42) !important;
  margin-top:14px !important;
}
html body .sf14-cta:hover{
  transform:translateY(-2px) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 14px 36px -8px rgba(15,163,177,.55) !important;
}
html body .sf14-bottom{
  border-top:1px solid rgba(255,255,255,.05) !important;
  padding:20px 0 !important;
  background:rgba(0,0,0,.18);
}
html body .sf14-bottom-inner{
  font-size:.76rem !important;
  color:var(--subtle-hi,#7E8FA3) !important;
  letter-spacing:.005em !important;
  /* Single row, ends pushed to left & right, never wrap children */
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:space-between !important;
  flex-wrap:nowrap !important;
  text-align:left !important;
  gap:18px !important;
  width:100% !important;
}
/* Copyright span: never break mid-text */
html body .sf14-bottom-inner > span:first-child{
  white-space:nowrap !important;
  flex:0 0 auto !important;
  min-width:0 !important;
  text-align:left !important;
  justify-content:flex-start !important;
}
/* Bottom-links: align to the right end, never wrap */
html body .sf14-bottom-links{
  gap:18px !important;
  flex:0 0 auto !important;
  flex-wrap:nowrap !important;
  justify-content:flex-end !important;
  white-space:nowrap !important;
}
/* Very narrow phones (≤520px): stack and center as a graceful fallback so nothing overflows off-screen */
@media (max-width:520px){
  html body .sf14-bottom-inner{
    flex-direction:column !important;
    justify-content:center !important;
    text-align:center !important;
    gap:10px !important;
  }
  html body .sf14-bottom-inner > span:first-child{
    white-space:normal !important;
    text-wrap:balance !important;
    text-align:center !important;
    justify-content:center !important;
    line-height:1.6 !important;
  }
  html body .sf14-bottom-links{
    flex-wrap:wrap !important;
    justify-content:center !important;
    white-space:normal !important;
  }
}
html body .sf14-bottom-links a{
  color:var(--muted-hi,#A8BACC) !important;
  transition:color .2s !important;
}
html body .sf14-bottom-links a:hover{ color:var(--teal-hi,#2BD3E6) !important; }
html body .sf14-bottom-nepali{
  /* No longer a highlighted standalone link — sits inside .sf14-bottom-links
     and matches the same discreet copyright-row treatment as Privacy / Sitemap / NZ Companies Office. */
  color:var(--muted-hi,#A8BACC) !important;
  font-size:.76rem !important;
  font-weight:500 !important;
  letter-spacing:0 !important;
  transition:color .2s !important;
  transform:none !important;
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  text-decoration:none !important;
}
html body .sf14-bottom-nepali:hover{
  color:var(--teal-hi,#2BD3E6) !important;
  transform:none !important;
}

/* ─── 8. ACCESSIBILITY — tap targets & focus rings ──────────────────────── */
html body a,
html body button,
html body input,
html body select,
html body textarea{
  -webkit-tap-highlight-color:transparent;
}
html body :focus-visible{
  outline:2px solid var(--teal-hi,#2BD3E6) !important;
  outline-offset:3px !important;
  border-radius:6px;
}
@media(pointer:coarse){
  html body .nav-links > li > a,
  html body .sf14-links a,
  html body .sf14-bottom-links a,
  html body .footer-list a,
  html body .ft-list a{
    min-height:44px !important;
    display:inline-flex !important;
    align-items:center !important;
  }
}

/* ─── 9. SELECTION & SCROLLBAR refinement ───────────────────────────────── */
html ::selection{
  background:rgba(15,163,177,.32) !important;
  color:var(--ivory-2,#F5F1E8) !important;
  text-shadow:none !important;
}
html ::-webkit-scrollbar{ width:8px !important; height:8px !important; }
html ::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,rgba(15,163,177,.28),rgba(15,163,177,.16)) !important;
  border-radius:8px !important;
}
html ::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,rgba(15,163,177,.5),rgba(15,163,177,.3)) !important;
}

/* ─── 10. ANCHORS — refined accent link style across body content ───────── */
html body main a:not(.btn):not(.nav-links a):not(.nav-mega-item):not(.sf14-links a):not(.sf14-bottom-links a):not(.sf14-contact-list a):not(.footer-list a):not(.ft-list a):not(.ft-contact):not(.ft-social):not(.sf14-cta):not(.sf14-social):not(.brand):not(.skip-link):not(.cred-verify):not(.mobile-svc-item):not(.mm-link):not(.company){
  text-underline-offset:3px;
  text-decoration-color:rgba(15,163,177,.35);
  text-decoration-thickness:1px;
  transition:text-decoration-color .2s, color .2s;
}
html body main a:not(.btn):hover{
  text-decoration-color:rgba(43,211,230,.65);
}

/* ─── 11. PRINT — clean print stylesheet ────────────────────────────────── */
@media print{
  html body{ background:#fff !important; color:#111 !important; }
  html body .nav, html body .site-footer-v14,
  html body .chc-toggle, html body .chc-panel,
  html body .ai-fab, html body .ai-panel,
  html body .sidebar-toggle, html body .sidebar-panel,
  html body .rsb2-toggle, html body .rsb2-panel,
  html body .lsb-toggle, html body .lsb-panel,
  html body .toolkit-trigger, html body .scroll-top,
  html body .mobile-svc-fab, html body .mobile-svc-menu,
  html body #mobileMenu{
    display:none !important;
  }
  html body h1, html body h2, html body h3, html body h4{ color:#0B1F3A !important; }
  html body p, html body li{ color:#222 !important; }
  html body a{ color:#0FA3B1 !important; text-decoration:underline !important; }
}

/* ─── 12. REDUCED MOTION ────────────────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html body *,
  html body *::before,
  html body *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}

/* ─── 13. RESPONSIVE NUDGES — mobile reading polish ─────────────────────── */
@media(max-width:700px){
  html body .hero h1{ letter-spacing:-.028em !important; }
  html body .hero-sub{ font-size:1rem !important; line-height:1.7 !important; }
  html body .hero-trust{
    padding:18px !important;
    grid-template-columns:1fr 1fr !important;
    gap:14px 8px !important;
  }
  html body .hero-trust > div{
    padding:6px 4px !important;
    border:0 !important;
    border-bottom:1px solid rgba(255,255,255,.05) !important;
  }
  html body .hero-trust > div:nth-last-child(-n+2){ border-bottom:0 !important; }
  html body .sf14-grid{ gap:28px 18px !important; }
}

/* ─── 14. LCP optimization — guarantee hero img has computed size ───────── */
html body .hero-photo picture,
html body .hero-photo img{
  contain:layout style;
  content-visibility:auto;
  contain-intrinsic-size:auto 560px;
}

/* ─── 15. SEO score boost — make sure all visible text is ≥12px ─────────── */
html body small,
html body .meta,
html body .brand-text small,
html body .hero-actions .meta,
html body .companies-head,
html body .ft-bottom-inner,
html body .sf14-bottom,
html body .sf14-bottom-inner{
  font-size:max(.74rem, 12px) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   V1.4 — CTA HIGHLIGHT · CLOUD HEALTH POLISH · MOBILE WOW
═══════════════════════════════════════════════════════════════════════════ */

/* ─── 16. CTA HIGHLIGHTING — "WORK WITH ME" & "SEND MESSAGE" ───────────── */
/* Shared keyframes */
@keyframes wcctaShimmer{
  0%{ background-position:-200% 0; }
  100%{ background-position:200% 0; }
}
@keyframes wcctaGlow{
  0%,100%{ box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 10px 30px -8px rgba(15,163,177,.5),
    0 0 0 1px rgba(15,163,177,.5),
    0 0 26px -4px rgba(15,163,177,.35); }
  50%{ box-shadow:
    0 1px 0 rgba(255,255,255,.28) inset,
    0 14px 40px -8px rgba(232,201,122,.55),
    0 0 0 1px rgba(232,201,122,.5),
    0 0 38px -2px rgba(232,201,122,.4); }
}
@keyframes wcctaArrow{
  0%,100%{ transform:translateX(0); }
  50%{ transform:translateX(4px); }
}

/* Hero primary CTA — "Send the database problem" */
html body .hero-actions .btn.primary,
/* Footer CTA — "Work with Dipak" */
html body .sf14-cta,
/* Nav mega CTA — "Work with Dipak" */
html body .nav-mega-cta-btn,
/* Contact form submit — "Send Message" */
html body .form-card .submit-btn,
html body .form-card .btn.primary[type="submit"]{
  position:relative !important;
  background:linear-gradient(135deg,#0FA3B1 0%,#15C5D8 35%,#1EDDEE 65%,#15C5D8 100%) !important;
  background-size:200% 100% !important;
  color:#062028 !important;
  font-weight:800 !important;
  letter-spacing:-.005em !important;
  border:none !important;
  animation:wcctaGlow 4s ease-in-out infinite, wcctaShimmer 6s linear infinite !important;
  overflow:hidden;
  isolation:isolate;
  z-index:1;
}
/* Sheen overlay on these CTAs */
html body .hero-actions .btn.primary::after,
html body .sf14-cta::after,
html body .nav-mega-cta-btn::after,
html body .form-card .submit-btn::after,
html body .form-card .btn.primary[type="submit"]::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,
    transparent 0%,
    transparent 38%,
    rgba(255,255,255,.42) 50%,
    transparent 62%,
    transparent 100%);
  background-size:280% 100%;
  background-position:200% 0;
  animation:wcctaShimmer 3.6s ease-in-out infinite;
  pointer-events:none;
  z-index:1;
  mix-blend-mode:overlay;
}
/* Lift on hover */
html body .hero-actions .btn.primary:hover,
html body .sf14-cta:hover,
html body .nav-mega-cta-btn:hover,
html body .form-card .submit-btn:hover,
html body .form-card .btn.primary[type="submit"]:hover{
  transform:translateY(-3px) scale(1.015) !important;
  animation:wcctaShimmer 1.6s linear infinite !important;
}

/* Send Message — extra-large, with side icon dock */
html body .form-card .submit-btn,
html body .form-card .btn.primary[type="submit"]{
  font-size:1.02rem !important;
  padding:18px 28px !important;
  min-height:60px !important;
  border-radius:14px !important;
  margin-top:10px !important;
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px;
  text-transform:none;
  letter-spacing:-.01em !important;
}
html body .form-card .submit-btn::before{
  content:"";
  position:absolute;
  left:-30%; top:50%;
  width:50px; height:50px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.4), transparent 70%);
  transform:translateY(-50%);
  filter:blur(8px);
  z-index:0;
  pointer-events:none;
}

/* Eyebrows above these CTAs — make them feel like premium signs */
html body .contact-text > .eyebrow,
html body .form-card > .eyebrow{
  color:var(--gold-hi,#EFD58E) !important;
  font-weight:700 !important;
}
html body .contact-text > .eyebrow::before,
html body .contact-text > .eyebrow::after,
html body .form-card > .eyebrow::before,
html body .form-card > .eyebrow::after{
  background:linear-gradient(90deg,transparent,var(--gold-hi,#EFD58E)) !important;
}
html body .form-card > .eyebrow::after{
  background:linear-gradient(90deg,var(--gold-hi,#EFD58E),transparent) !important;
}

/* Footer "Work with Dipak" — slightly larger + reassuring micro-text */
html body .sf14-cta{
  font-size:.9rem !important;
  padding:14px 22px !important;
  min-height:50px !important;
  width:100% !important;
}

/* ─── 17. CLOUD HEALTH PANEL — innovative polish ────────────────────────── */
html body .chc-toggle{
  background:linear-gradient(135deg,#0FA3B1,#15C5D8) !important;
  color:#062028 !important;
  font-weight:700 !important;
  letter-spacing:.04em !important;
  border:1px solid rgba(15,197,216,.5) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 8px 26px -6px rgba(15,163,177,.45) !important;
  transition:transform .25s, box-shadow .25s !important;
}
html body .chc-toggle:hover{
  transform:translateY(-2px) translateX(-3px) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.3) inset,
    0 14px 36px -8px rgba(15,163,177,.55) !important;
}

html body .chc-panel{
  background:linear-gradient(180deg,#0a1a2e 0%, #060e1c 100%) !important;
  border-left:1px solid rgba(15,163,177,.18) !important;
}

/* Brand row in header */
html body .chc-brand{
  font-family:var(--mono,'DM Mono',monospace);
  font-size:.7rem;
  color:var(--teal-hi,#2BD3E6);
  letter-spacing:.16em;
  text-transform:uppercase;
  font-weight:700;
}
html body .chc-brand-dot{
  width:9px; height:9px;
  border-radius:50%;
  background:#22C55E;
  box-shadow:0 0 0 3px rgba(34,197,94,.18), 0 0 12px rgba(34,197,94,.6);
  animation:chcBrandPulse 2.4s ease-in-out infinite;
}
@keyframes chcBrandPulse{
  0%,100%{ box-shadow:0 0 0 3px rgba(34,197,94,.18), 0 0 12px rgba(34,197,94,.6); }
  50%{    box-shadow:0 0 0 6px rgba(34,197,94,.0),  0 0 22px rgba(34,197,94,.85); }
}

/* Tabs */
html body .chc-tabs{
  padding:14px 16px 0 !important;
  border-bottom:1px solid rgba(255,255,255,.05);
}
html body .chc-tab{
  background:transparent;
  border:0;
  padding:10px 8px;
  font-size:.74rem;
  font-weight:600;
  color:var(--muted-hi,#A8BACC);
  letter-spacing:.04em;
  cursor:pointer;
  border-bottom:2px solid transparent;
  transition:color .2s, border-color .2s, background .2s;
  display:inline-flex; align-items:center; gap:6px;
}
html body .chc-tab:hover{
  color:var(--ivory-2,#F5F1E8);
}
html body .chc-tab.active{
  color:var(--teal-hi,#2BD3E6) !important;
  border-bottom-color:var(--teal-hi,#2BD3E6) !important;
}

/* Status card */
html body .chc-content{ padding:16px 18px 24px !important; }
html body .chc-status-card{
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.005)) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  border-radius:16px !important;
  padding:18px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.04) inset,
    0 18px 50px -22px rgba(0,0,0,.5) !important;
}
html body .chc-status-header{
  display:flex !important; align-items:center !important; gap:12px !important;
  padding-bottom:14px !important;
  margin-bottom:14px !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
}
html body .chc-cloud-logo{
  width:42px !important; height:42px !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  font-size:1.3rem !important;
  flex:0 0 42px !important;
}
html body .chc-cloud-name{
  font-family:var(--serif,'Fraunces',serif) !important;
  font-size:1rem !important;
  font-weight:500 !important;
  color:var(--ivory-2,#F5F1E8) !important;
  line-height:1.2 !important;
  letter-spacing:-.01em !important;
}
html body .chc-cloud-meta{
  font-family:var(--mono,'DM Mono',monospace) !important;
  font-size:.58rem !important;
  color:var(--subtle-hi,#7E8FA3) !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
  margin-top:2px !important;
}
html body .chc-cloud-status{
  margin-left:auto !important;
  display:inline-flex !important; align-items:center !important; gap:8px !important;
  padding:6px 12px !important;
  border-radius:999px !important;
  font-family:var(--mono,'DM Mono',monospace) !important;
  font-size:.66rem !important;
  font-weight:700 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
}
html body .chc-cloud-status.ok{
  background:rgba(34,197,94,.08) !important;
  color:#86EFAC !important;
  border:1px solid rgba(34,197,94,.28) !important;
}
html body .chc-pulse{
  display:inline-block;
  width:7px; height:7px;
  border-radius:50%;
  background:#22C55E;
  box-shadow:0 0 0 3px rgba(34,197,94,.18), 0 0 8px rgba(34,197,94,.7);
  animation:chcBrandPulse 2.4s ease-in-out infinite;
}

/* Service rows */
html body .chc-service-list{ display:flex; flex-direction:column; gap:4px; margin-bottom:14px; }
html body .chc-service-row{
  display:flex !important; align-items:center !important; gap:10px !important;
  padding:9px 12px !important;
  background:rgba(255,255,255,.025) !important;
  border:1px solid rgba(255,255,255,.04) !important;
  border-radius:9px !important;
  transition:background .2s, border-color .2s, transform .2s !important;
}
html body .chc-service-row:hover{
  background:rgba(15,163,177,.06) !important;
  border-color:rgba(15,163,177,.18) !important;
  transform:translateX(2px);
}
html body .chc-svc-dot{
  width:8px !important; height:8px !important;
  border-radius:50%;
  flex:0 0 8px;
}
html body .chc-svc-dot.green{
  background:#22C55E;
  box-shadow:0 0 0 3px rgba(34,197,94,.16);
}
html body .chc-svc-name{
  flex:1;
  font-size:.86rem !important;
  color:var(--ivory-2,#F5F1E8) !important;
  font-weight:500 !important;
}
html body .chc-svc-badge{
  font-family:var(--mono,'DM Mono',monospace) !important;
  font-size:.6rem !important;
  font-weight:700 !important;
  letter-spacing:.08em !important;
  padding:2px 8px !important;
  border-radius:5px !important;
  background:rgba(34,197,94,.1) !important;
  color:#86EFAC !important;
  border:1px solid rgba(34,197,94,.22) !important;
}

/* Verify-on-official link */
html body .chc-verify-link{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  padding:12px 14px !important;
  margin:8px 0 14px !important;
  background:linear-gradient(135deg,rgba(232,201,122,.08),rgba(232,201,122,.02)) !important;
  border:1px solid rgba(232,201,122,.22) !important;
  border-radius:12px !important;
  text-decoration:none !important;
  transition:background .25s, border-color .25s, transform .25s !important;
  position:relative;
  overflow:hidden;
}
html body .chc-verify-link::before{
  content:"";
  position:absolute;
  top:0; left:-100%;
  width:60%; height:100%;
  background:linear-gradient(90deg,transparent,rgba(232,201,122,.18),transparent);
  transition:left .8s ease;
  pointer-events:none;
}
html body .chc-verify-link:hover{
  background:linear-gradient(135deg,rgba(232,201,122,.14),rgba(232,201,122,.04)) !important;
  border-color:rgba(232,201,122,.4) !important;
  transform:translateY(-1px);
}
html body .chc-verify-link:hover::before{ left:140%; }
html body .chc-verify-icon{
  width:32px; height:32px;
  border-radius:9px;
  background:rgba(232,201,122,.12);
  border:1px solid rgba(232,201,122,.25);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:.95rem;
  flex:0 0 32px;
}
html body .chc-verify-text{
  flex:1;
  display:flex; flex-direction:column;
  min-width:0;
}
html body .chc-verify-text b{
  font-size:.84rem;
  color:var(--gold-hi,#EFD58E);
  font-weight:700;
  letter-spacing:-.005em;
  line-height:1.2;
}
html body .chc-verify-text small{
  font-family:var(--mono,'DM Mono',monospace);
  font-size:.62rem;
  color:var(--muted-hi,#A8BACC);
  margin-top:3px;
  letter-spacing:.02em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html body .chc-verify-arrow{
  color:var(--gold-hi,#EFD58E);
  font-size:1.05rem;
  font-weight:700;
  transition:transform .25s ease;
  flex:0 0 auto;
}
html body .chc-verify-link:hover .chc-verify-arrow{ transform:translateX(4px); }

/* Tip box */
html body .chc-tip{
  background:rgba(15,163,177,.06) !important;
  border:1px solid rgba(15,163,177,.16) !important;
  border-left:3px solid var(--teal-hi,#2BD3E6) !important;
  border-radius:10px !important;
  padding:12px 14px !important;
  font-size:.82rem !important;
  line-height:1.55 !important;
  color:var(--muted-hi,#A8BACC) !important;
  margin:10px 0 14px !important;
}
html body .chc-tip strong{
  color:var(--teal-hi,#2BD3E6) !important;
  font-weight:700 !important;
  display:block;
  margin-bottom:4px;
  font-size:.76rem;
  letter-spacing:.04em;
}

/* Bottom CTA */
html body .chc-cta{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:13px 18px !important;
  border-radius:11px !important;
  background:linear-gradient(135deg,#0FA3B1,#15C5D8) !important;
  color:#062028 !important;
  font-size:.86rem !important;
  font-weight:800 !important;
  letter-spacing:-.005em !important;
  text-decoration:none !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.18) inset,
    0 8px 22px -6px rgba(15,163,177,.45) !important;
  transition:transform .25s, box-shadow .25s !important;
}
html body .chc-cta:hover{
  transform:translateY(-2px) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 14px 32px -8px rgba(15,163,177,.55) !important;
}

/* ─── 18. MOBILE WOW — hamburger + slide menu + Services FAB ────────────── */

/* Hamburger button — premium glass + glow */
@media (max-width:1100px){
  html body #navHamburger{
    background:linear-gradient(135deg,rgba(15,163,177,.18),rgba(15,163,177,.06)) !important;
    border:1px solid rgba(15,163,177,.32) !important;
    border-radius:12px !important;
    padding:9px !important;
    width:46px !important; height:46px !important;
    backdrop-filter:blur(12px);
    box-shadow:
      0 1px 0 rgba(255,255,255,.06) inset,
      0 4px 14px -3px rgba(15,163,177,.32) !important;
    transition:background .25s, box-shadow .25s, transform .25s !important;
  }
  html body #navHamburger:hover{
    background:linear-gradient(135deg,rgba(15,163,177,.28),rgba(15,163,177,.1)) !important;
    transform:translateY(-1px) !important;
    box-shadow:
      0 1px 0 rgba(255,255,255,.1) inset,
      0 8px 20px -4px rgba(15,163,177,.42) !important;
  }
  html body #navHamburger span{
    background:#F5F1E8 !important;
    height:2px !important;
    width:22px !important;
    border-radius:2px !important;
    transition:transform .35s cubic-bezier(.65,.05,.36,1), opacity .25s, background .25s !important;
  }
  html body #navHamburger[aria-expanded="true"]{
    background:linear-gradient(135deg,rgba(232,201,122,.22),rgba(232,201,122,.08)) !important;
    border-color:rgba(232,201,122,.4) !important;
  }
  html body #navHamburger[aria-expanded="true"] span{
    background:var(--gold-hi,#EFD58E) !important;
  }
}

/* Mobile slide menu — premium WOW redesign */
html body #mobileMenu{
  background:
    radial-gradient(800px 400px at 50% 0%, rgba(15,163,177,.1), transparent 60%),
    linear-gradient(180deg, #060d18 0%, #050a14 100%) !important;
  width:min(420px, 100vw) !important;
  border-left:1px solid rgba(15,163,177,.14) !important;
  box-shadow:-20px 0 60px -10px rgba(0,0,0,.6) !important;
  padding:96px 22px 32px !important;
}
html body #mobileMenu::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(15,163,177,.4),rgba(232,201,122,.25),transparent);
  pointer-events:none;
}

/* Premium header strip inside the mobile menu */
html body #mobileMenu::after{
  content:"DIPAK RIJAL · AWS · AUCKLAND";
  position:absolute;
  top:54px;
  left:22px; right:22px;
  font-family:var(--mono,'DM Mono',monospace);
  font-size:.62rem;
  letter-spacing:.22em;
  color:var(--teal-hi,#2BD3E6);
  font-weight:700;
  padding-bottom:14px;
  border-bottom:1px solid rgba(15,163,177,.18);
  pointer-events:none;
}

/* Menu item polish */
html body #mobileMenu a{
  background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.015)) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  color:#F5F1E8 !important;
  border-radius:14px !important;
  padding:15px 18px !important;
  font-size:1.02rem !important;
  font-weight:600 !important;
  min-height:54px !important;
  gap:14px !important;
  letter-spacing:-.005em !important;
  position:relative;
  overflow:hidden;
  transition:background .22s, border-color .22s, transform .22s !important;
}
html body #mobileMenu a::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:3px;
  background:linear-gradient(180deg,var(--teal-hi,#2BD3E6),var(--gold-hi,#EFD58E));
  border-radius:0 3px 3px 0;
  opacity:0;
  transition:opacity .22s ease;
}
html body #mobileMenu a:active,
html body #mobileMenu a:hover{
  background:linear-gradient(135deg,rgba(15,163,177,.14),rgba(15,163,177,.05)) !important;
  border-color:rgba(15,163,177,.32) !important;
  transform:translateX(3px) !important;
}
html body #mobileMenu a:active::before,
html body #mobileMenu a:hover::before{ opacity:1; }

/* The "✉️ Get in touch" CTA inside mobile menu — premium gold */
html body #mobileMenu a[href*="contact"]{
  background:linear-gradient(135deg,#0FA3B1,#15C5D8,#E8C97A) !important;
  background-size:200% 100% !important;
  color:#062028 !important;
  font-weight:800 !important;
  font-size:1.08rem !important;
  border:0 !important;
  justify-content:center !important;
  min-height:58px !important;
  margin-top:6px !important;
  animation:wcctaShimmer 5s linear infinite !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 10px 28px -8px rgba(15,163,177,.5) !important;
}

/* Divider between sections */
html body #mobileMenu > div > div[style*="height:1px"]{
  background:linear-gradient(90deg,transparent,rgba(15,163,177,.32),transparent) !important;
  margin:16px 0 !important;
}

/* Overlay — richer blur */
html body #mmOverlay{
  background:rgba(0,0,0,.78) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}

/* ─── 19. MOBILE SERVICES FAB & SLIDE-BAR — beautified ──────────────────── */
/* IMPORTANT: do NOT override `display` here. The bridge CSS handles visibility:
   `display:none` on desktop, `display:flex` at max-width:820px. */
html body .mobile-svc-fab{
  background:linear-gradient(135deg,#0FA3B1,#15C5D8) !important;
  color:#062028 !important;
  border:0 !important;
  border-radius:999px !important;
  padding:12px 18px 12px 14px !important;
  font-weight:800 !important;
  font-size:.85rem !important;
  letter-spacing:-.005em !important;
  align-items:center !important;
  gap:9px !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 10px 28px -6px rgba(15,163,177,.45),
    0 0 0 1px rgba(15,163,177,.4) !important;
  animation:wcctaGlow 4.5s ease-in-out infinite !important;
  transition:transform .25s !important;
  z-index:9994;
}
/* Belt-and-braces — force the mobile FAB and slide-bar to stay hidden on desktop */
@media (min-width:821px){
  html body .mobile-svc-fab,
  html body .mobile-svc-menu{ display:none !important; }
}
html body .mobile-svc-fab:hover,
html body .mobile-svc-fab:active{
  transform:translateY(-2px) scale(1.03) !important;
}
html body .mobile-svc-fab svg{
  width:18px !important; height:18px !important;
}
html body .mobile-svc-dot{
  position:absolute;
  top:6px; right:6px;
  width:9px; height:9px;
  border-radius:50%;
  background:#22C55E;
  box-shadow:0 0 0 2.5px rgba(11,31,58,1), 0 0 10px rgba(34,197,94,.7);
  animation:chcBrandPulse 2.4s ease-in-out infinite;
}

/* The Services slide-bar/sheet */
html body .mobile-svc-menu{
  background:
    radial-gradient(700px 320px at 50% 0%, rgba(15,163,177,.1), transparent 60%),
    linear-gradient(180deg, #060d18 0%, #050a14 100%) !important;
  border-left:1px solid rgba(15,163,177,.14) !important;
  box-shadow:-20px 0 60px -10px rgba(0,0,0,.6) !important;
}
html body .mobile-svc-title{
  border-bottom:1px solid rgba(15,163,177,.18) !important;
  padding-bottom:14px !important;
  margin-bottom:14px !important;
}
html body .mobile-svc-title span:first-child{
  font-family:var(--serif,'Fraunces',serif) !important;
  font-size:1.18rem !important;
  font-weight:500 !important;
  color:var(--ivory-2,#F5F1E8) !important;
  letter-spacing:-.015em !important;
}
html body .mobile-svc-title::before{
  content:"DIPAK · AUCKLAND";
  position:absolute;
  top:24px;
  left:24px;
  font-family:var(--mono,'DM Mono',monospace);
  font-size:.58rem;
  color:var(--teal-hi,#2BD3E6);
  letter-spacing:.22em;
  font-weight:700;
}
html body .mobile-svc-close{
  width:36px !important; height:36px !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  color:var(--muted-hi,#A8BACC) !important;
  font-size:1.3rem !important;
  cursor:pointer;
  transition:background .2s, transform .2s !important;
}
html body .mobile-svc-close:hover,
html body .mobile-svc-close:active{
  background:rgba(15,163,177,.12) !important;
  color:var(--teal-hi,#2BD3E6) !important;
  transform:rotate(90deg);
}

/* List items */
html body .mobile-svc-item{
  background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.015)) !important;
  border:1px solid rgba(255,255,255,.07) !important;
  color:var(--ivory-2,#F5F1E8) !important;
  border-radius:13px !important;
  padding:13px 14px !important;
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  text-decoration:none !important;
  position:relative;
  overflow:hidden;
  transition:background .22s, border-color .22s, transform .22s !important;
  min-height:60px;
}
html body .mobile-svc-item::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:3px;
  background:linear-gradient(180deg,var(--teal-hi,#2BD3E6),var(--gold-hi,#EFD58E));
  border-radius:0 3px 3px 0;
  opacity:0;
  transition:opacity .22s ease;
}
html body .mobile-svc-item:hover,
html body .mobile-svc-item:active{
  background:linear-gradient(135deg,rgba(15,163,177,.14),rgba(15,163,177,.05)) !important;
  border-color:rgba(15,163,177,.32) !important;
  transform:translateX(3px);
}
html body .mobile-svc-item:hover::before,
html body .mobile-svc-item:active::before{ opacity:1; }
html body .mobile-svc-icon{
  width:42px !important; height:42px !important;
  border-radius:11px !important;
  background:rgba(15,163,177,.08) !important;
  border:1px solid rgba(15,163,177,.18) !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:1.2rem !important;
  flex:0 0 42px !important;
}
html body .mobile-svc-copy{
  display:flex; flex-direction:column;
  min-width:0;
}
html body .mobile-svc-copy b{
  font-size:.94rem;
  font-weight:700;
  color:var(--ivory-2,#F5F1E8);
  letter-spacing:-.005em;
  line-height:1.2;
}
html body .mobile-svc-copy small{
  font-size:.72rem;
  color:var(--muted-hi,#A8BACC);
  margin-top:3px;
  font-weight:500;
}

/* Bottom CTA in slide-bar */
html body .mobile-svc-cta{
  background:linear-gradient(135deg,#0FA3B1,#15C5D8,#E8C97A) !important;
  background-size:200% 100% !important;
  color:#062028 !important;
  font-weight:800 !important;
  font-size:1rem !important;
  padding:16px 22px !important;
  border-radius:14px !important;
  text-align:center !important;
  text-decoration:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-top:14px !important;
  animation:wcctaShimmer 5s linear infinite !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 10px 28px -8px rgba(15,163,177,.5) !important;
  transition:transform .25s !important;
}
html body .mobile-svc-cta:hover,
html body .mobile-svc-cta:active{
  transform:translateY(-2px) scale(1.015) !important;
}

/* ─── 20. SOCIAL ICONS — refined GitHub/LinkedIn/Credly icon sizing ─────── */
html body .sf14-social svg{
  width:14px !important;
  height:14px !important;
}
html body .sf14-social{
  font-family:var(--sans);
}