/* Global fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght@300;400;700&display=swap');


body {
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}




/* ===================== Tokens (logo-matched blues) ===================== */
:root{
  --ink:#0B1E2D; --text:#0F172A; --muted:#5B6776; --border:#CBD5E1; --bg:#FFFFFF;
  --brand-500:#2BC0FF; --brand-700:#0B8EDD; --brand-800:#0A78BF;  /* Email blue */
  --call-500:#3DDC97; --call-700:#16A34A; --call-800:#11863E;    /* Call green */
  --chat-500:#1FA8F5;
  --container:1200px; --radius:10px;
  --shadow-soft:0 8px 18px rgba(11,30,45,.10);
  --shadow-panel:0 28px 60px rgba(11,30,45,.18);
  --t:220ms; --e:cubic-bezier(.2,.8,.2,1);
  --ff:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --topbar-h:80px;
  --dock-h:96px; /* updated by JS */
}
html{scroll-behavior:smooth}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--ff);color:var(--text);background:var(--bg)}
.container{max-width:var(--container);padding:0 16px;margin:0 auto}
img{max-width:100%;display:block}





/* ============================== Buttons =============================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:800;
  border-radius:var(--radius);padding:.62rem 1rem;border:1.4px solid transparent;
  text-decoration:none;white-space:nowrap;cursor:pointer;text-align:center;
  transition:filter var(--t) var(--e),transform var(--t) var(--e);
}
.btn:focus-visible{outline:3px solid rgba(37,178,255,.35);outline-offset:2px}
.btn--brand{
  color:#fff;border-color:var(--brand-800);
  background:linear-gradient(180deg,var(--brand-500) 0%, var(--brand-700) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.06);
}
.btn--chat{
  color:#fff;border-color:#0A79C6;
  background:linear-gradient(180deg,#55C6FF 0%, #1FA8F5 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.06);
}
.btn:hover{transform:translateY(-1px)} .btn:active{transform:translateY(0)}

/* ============================== TOP BAR =============================== */
header.topbar{position:sticky;top:0;z-index:999;background:#fff;border-bottom:1px solid rgba(203,213,225,.66)}
header.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:linear-gradient(90deg,var(--brand-700),var(--brand-500));opacity:.20}
.topbar__row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;min-height:80px}
.brand__mark{height:125px;width:175px}

/* ========= Flip Contact (single button toggling Call/E-mail) ========= */
.contact-wrap{display:inline-block; position:relative}
.flip-btn{
  position:relative; display:inline-block; border-radius:var(--radius);
  border:1.4px solid #fff; color:#fff; text-decoration:none;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.12);
  perspective:1000px;
}
.flip-card{
  display:grid; place-items:center;
  transform-style:preserve-3d; transition:transform 600ms var(--e);
}
.flip-face{
  grid-area:1/1; display:inline-flex; align-items:center; gap:.5rem;
  padding:.62rem 1rem; font-weight:800; backface-visibility:hidden;
}
.flip-face svg{width:16px;height:16px}
.flip-face.mail{transform:rotateY(180deg)}
/* State: CALL (green) */
.flip-btn.is-call{
  background:linear-gradient(180deg,var(--call-500) 0%, var(--call-700) 100%);
  box-shadow:0 6px 6px rgba(0,0,0,0.45);
}
.flip-btn.is-call .flip-card{transform:rotateY(0)}
/* State: MAIL (blue) */
.flip-btn.is-mail{
  background:linear-gradient(180deg,var(--brand-500) 0%, var(--brand-700) 100%);
  box-shadow:0 6px 6px rgba(0,0,0,0.45);
}
.flip-btn.is-mail .flip-card{transform:rotateY(180deg)}
.flip-btn:hover{filter:brightness(1.03); transform:translateY(-1px)}
.flip-btn:active{transform:translateY(0)}
.flip-btn:focus-visible{outline:3px solid rgba(37,178,255,.35); outline-offset:3px}

/* ===== Desktop Call popover ===== */
.call-popover{
  position:absolute; z-index:1002; right:0; top:calc(100% + 10px);
  min-width:260px; background:#fff; border:1px solid #E5EDF5; border-radius:12px;
  box-shadow:var(--shadow-panel); padding:12px; display:none;
}
.call-popover.open{display:block; animation:pop-in 140ms var(--e)}
@keyframes pop-in{from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:translateY(0)}}
.call-popover .row{display:flex; align-items:center; justify-content:space-between; gap:10px}
.call-popover .num{font-weight:800; color:#0F2640; letter-spacing:.2px}
.call-popover .copy{border:1px solid #D6E3F3; background:#F3F8FC; padding:.45rem .7rem; border-radius:8px; cursor:pointer; font-weight:700}
.call-popover .alt{margin-top:10px; display:flex; gap:8px}
.call-popover .alt a{display:inline-flex; align-items:center; gap:6px; text-decoration:none; font-weight:700; color:#0B8EDD}
.call-popover .msg{margin-top:8px; font-size:.9rem; color:#16A34A; font-weight:700; min-height:1.2em}
.call-popover .arrow{
  position:absolute; right:14px; top:-8px; width:16px; height:16px; background:#fff;
  border-left:1px solid #E5EDF5; border-top:1px solid #E5EDF5; transform:rotate(45deg);
}

/* ============================= BOTTOM DOCK ============================ */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:997;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(10px);border-top:1px solid #E2E8F0;box-shadow:0 -10px 24px rgba(11,30,45,.08);padding:14px 12px calc(18px + env(safe-area-inset-bottom))}
.dock__wrap{max-width:var(--container);margin:0 auto;display:flex;gap:10px;align-items:center;justify-content:center;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.dock__wrap .btn{flex:0 0 auto;min-width:0;box-shadow:var(--shadow-soft);white-space:nowrap;padding:.6rem 1.0rem;font-size:.95rem;scroll-snap-align:start}
.btn-stack{display:inline-flex;align-items:baseline;gap:.2em}
.btn-sub::before{content:"("} .btn-sub::after{content:")"}
@media (max-width:480px){
  .dock__wrap{justify-content:space-between}
  .dock__wrap .btn{flex:0 0 calc((100% - 20px)/3);white-space:normal;font-size:.92rem;padding:.5rem .6rem}
  .btn-stack{display:flex;flex-direction:column;align-items:center;line-height:1.05}
  .btn-sub{font-weight:700;font-size:.85em}
}
@media (max-width:360px){.dock__wrap .btn{font-size:.9rem;padding:.45rem .55rem}}
main{padding-bottom:140px}
@media (max-width:480px){main{padding-bottom:150px}}

/* ===== Reused shine/brite for FAB ===== */
@keyframes rfp-brite{0%{filter:brightness(1)}50%{filter:brightness(1.06)}100%{filter:brightness(1)}}
@keyframes rfp-shine{to{transform:translateX(220%) skewX(-20deg)}}

/* ============================ FAB (floating CTA) ============================ */
.fab-quote{
  position:fixed; z-index:1001;
  right:clamp(10px, 2vw, 18px);
  bottom:calc(var(--dock-h) + 16px);
  display:inline-flex; align-items:center; gap:.55rem;
  font-weight:800; color:#fff; text-decoration:none; white-space:nowrap;
  border:1.4px solid var(--brand-800);
  background:linear-gradient(180deg,var(--brand-500) 0%, var(--brand-700) 100%);
  border-radius:999px; padding:.72rem 1.0rem;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 0 rgba(0,0,0,.06),
              0 8px 18px rgba(11,30,45,.10);
  transition:transform var(--t) var(--e), filter var(--t) var(--e);
}
.fab-quote:hover{ transform:translateY(-1px) }
.fab-quote:active{ transform:translateY(0) }
.fab-quote:focus-visible{ outline:3px solid rgba(37,178,255,.35); outline-offset:3px }
@keyframes fab-zoom-wobble{
  0%{transform:translateY(0) scale(1) rotate(0)}
  20%{transform:translateY(-1px) scale(1.06) rotate(-5deg)}
  40%{transform:translateY(-1px) scale(1.06) rotate(5deg)}
  60%{transform:translateY(-1px) scale(1.03) rotate(-3deg)}
  80%{transform:translateY(0) scale(1.02) rotate(3deg)}
  100%{transform:translateY(0) scale(1) rotate(0)}
}
@media (prefers-reduced-motion: no-preference){
  .fab-quote.attn{ animation:fab-zoom-wobble 1.1s ease-out both, rfp-brite 1200ms ease-out both }
  .fab-quote.attn::after{
    content:""; position:absolute; inset:0; border-radius:999px; pointer-events:none;
    background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.85) 18%, transparent 36%);
    transform:translateX(-140%) skewX(-20deg);
    animation:rfp-shine 900ms ease-out 120ms both;
  }
}

/* Mobile: compact circle expands to reveal text */
@media (max-width:640px){
  .fab-quote{ bottom:calc(var(--dock-h) + 12px); width:56px; height:56px; padding:0; justify-content:center }
  .fab-quote .fab-label{
    opacity:0; visibility:hidden; overflow:hidden;
    max-width:0; margin:0;
    transition:max-width 180ms ease, opacity 160ms ease, visibility 0ms linear 180ms, margin 160ms ease;
  }
  .fab-quote.is-open{ width:auto; height:56px; padding:0 .9rem; justify-content:flex-start }
  .fab-quote.is-open .fab-label{ visibility:visible; opacity:1; max-width:12.5rem; margin-left:.5rem; transition-delay:0ms }
}

/* 5-col variant for Industries mega */
.mega-grid.mega-grid--5{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:16px;
}
@media (max-width:1100px){
  .mega-grid.mega-grid--5{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}
@media (max-width:720px){
  .mega-grid.mega-grid--5{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

/* ===== Languages mega: scoped styles ===== */
#mega-languages .lang-tabs{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
#mega-languages .lang-tab{
  border:1px solid #E5EDF5; background:#fff; border-radius:10px; padding:.45rem .7rem;
  font-weight:800; cursor:pointer; color:#0F2640;
}
#mega-languages .lang-tab.is-active{ background:#F3F8FC; border-color:#D5E7F9; color:#0B8EDD; }

/* Panels & lists */
#mega-languages .lang-panel[hidden]{ display:none; }
#mega-languages .lang-list{ columns:2; column-gap:24px; padding:0; margin:0; list-style:none; }
#mega-languages .lang-list li{ break-inside:avoid; margin:.2rem 0; display:flex; gap:10px; align-items:center; }
#mega-languages .lang-name{ text-decoration:none; font-weight:800; color:#0F2640; }
#mega-languages .lang-price{
  font-size:.86rem; border:1px solid #E5EDF5; background:#F6FAFE; color:#0B8EDD;
  padding:.15rem .4rem; border-radius:8px; text-decoration:none;
}
@media (max-width:980px){ #mega-languages .lang-list{ columns:1; } }

/* Visual polish */
#mega-languages{
  width:min(980px,96vw);
  padding:16px 16px 12px;
}
#mega-languages .lang-tabs{
  display:flex; gap:6px; flex-wrap:wrap; margin:0 0 10px;
}
#mega-languages .lang-tab{
  border:1px solid #DCE8F4; background:#fff;
  padding:.38rem .6rem; border-radius:10px;
  font-weight:800; font-size:.92rem; color:#0F2640; cursor:pointer;
}
#mega-languages .lang-tab.is-active{
  background:#E9F4FF; border-color:#CFE5FB; color:#0B8EDD;
}
/* Grid: 3 equal columns on desktop, 2 on mid, 1 on small */
#mega-languages .lang-panels{ margin-top:4px; }
#mega-languages .lang-panel[hidden]{ display:none; }
#mega-languages .lang-panel > .lang-list{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px 22px;
  list-style:none; margin:0; padding:2px 2px 8px;
}
@media (max-width:1200px){
  #mega-languages .lang-panel > .lang-list{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:800px){
  #mega-languages .lang-panel > .lang-list{ grid-template-columns:1fr; }
}
/* Each row: name + small price chip */
#mega-languages .lang-list li{
  display:flex; align-items:center; gap:10px; min-height:28px;
}
#mega-languages .lang-name{
  font-weight:900; color:#0F2640; text-decoration:none; letter-spacing:.1px;
}
#mega-languages .lang-name:hover{ color:#0B8EDD; }
#mega-languages .lang-price{
  display:inline-flex; align-items:center; gap:4px;
  padding:.12rem .38rem; border:1px solid #E1EEF8; border-radius:8px;
  background:#F6FAFE; color:#0B8EDD; font-weight:800; font-size:.78rem;
  text-decoration:none; line-height:1;
}
#mega-languages .lang-price::before{
  content:"₹"; font-weight:900; opacity:.85;
}
/* Footer row: compact, centered action buttons */
#mega-languages .mega-foot{
  display:flex; justify-content: center; gap: 12px; margin-top:6px;
}
#mega-languages .mega-foot .btn{
  padding:.55rem .8rem; border-radius:10px; font-weight:900; box-shadow:var(--shadow-soft);
}
#mega-languages .lang-price{ border-color:transparent; background:#ECF6FF; }

/* Mobile drawer label tweak */
.m-acc-panel .m-acc-label{
  padding:6px 16px 2px;
  font-size:12px;
  font-weight:600;
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:0.03em;
}

/* Keep the primary nav in a single row with a reserved right cluster */
nav.primary{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
}
.nav-list{
  display:flex;
  gap:22px;
  align-items:center;
  justify-content:center;
  flex:1 1 auto;
  margin:0; padding:0;
  white-space:nowrap;
}
.nav-cta{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
  white-space:nowrap;
}
.navwrap .navrow{ justify-content:stretch; }
.navwrap .navrow, nav.primary, .nav-list, .nav-cta{ flex-wrap:nowrap; }
@media (max-width:1280px){
  .nav-list{ gap:18px; }
}
@media (max-width:1160px){
  .nav-list{ gap:14px; }
}
@media (max-width:1100px){
  .nav-cta{ display:none; }
}

/* Services mega layout */
#mega-services{
  width: min(1100px, 96vw);
  padding: 16px;
}
#mega-services .svc4-h4{
  margin: .2rem 0 .35rem;
  font-size: .98rem;
  letter-spacing: .2px;
}
#mega-services .svc4-item{
  padding: .48rem .56rem;
  gap: 10px;
}
#mega-services .ico{
  width: 28px; height: 28px;
  border-radius: 8px;
}
#mega-services .col-translation .svc4-list{
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
}
#mega-services .col-localization .svc4-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 18px;
  row-gap: 6px;
}
#mega-services .mega-seealso,
#mega-services .seealso-row .mega-item{
  font-size: .92rem;
}
#mega-services .seealso-row{
  display: flex; gap: 12px; align-items: center;
  margin-top: 6px;
}
#mega-services .svc4-belt{ gap: 10px; }
#mega-services .svc4-card{ padding: 10px; }
#mega-services .svc4-stack{ gap: 6px; }
#mega-services .mega-grid-two{
  display: grid;
  grid-template-columns: 1fr 1.5fr 0.9fr;
  gap: 16px 24px;
}
#mega-services .col-localization{
  border-left: 1px solid #E8F0FA;
  padding-left: 24px;
}

.mega-grid.mega-grid--3{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px }

/* ======================= NAV STYLES (desktop + mobile) ======================= */
.mi,.ms{
  font-family:'Material Symbols Outlined';
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 28;
  display:inline-flex; align-items:center; justify-content:center;
  line-height:1; color:#0B8EDD;
}
.mi{font-size:28px; width:32px; height:32px; flex:0 0 32px;}
.mi-sm{font-size:24px; width:28px; height:28px; flex:0 0 28px;}
.ms{font-size:24px; width:28px; height:28px; flex:0 0 28px;}

.navwrap{position:sticky; top:var(--topbar-h); z-index:998; background:#fff; border-bottom:1px solid #E5EDF5;}
.navrow{min-height:58px; display:flex; align-items:center; justify-content:center}
nav.primary{position:relative; width:100%}
.nav-link,.nav-trigger{font-weight:800;color:#0F2640;text-decoration:none;padding:.55rem .35rem;border-radius:8px;border:0;background:transparent;cursor:pointer}
.nav-link:hover,.nav-trigger:hover,.nav-link:focus-visible,.nav-trigger:focus-visible{color:var(--brand-700);outline-offset:2px}
.nav-trigger[aria-expanded="true"]{color:var(--brand-700)}

.mega{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  top:calc(100% + 12px);
  width:min(980px,96vw);
  background:#fff;
  border:1px solid #E5EDF5;
  border-radius:14px;
  box-shadow:var(--shadow-panel);
  padding:18px;
  display:none;
  z-index:2001;
}
.mega.open{display:block}
.mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.mega h4{margin:.5rem 0 .35rem 0;font-size:.95rem;color:#0F2640}

.mega-item{
  display:flex; align-items:center; gap:12px;
  padding:.65rem .7rem; border-radius:12px; text-decoration:none;
  color:#0F2640; border:1px solid transparent;
  transition:background var(--t) var(--e), border-color var(--t) var(--e), transform var(--t) var(--e);
}
.mega-item:hover{background:#F3F8FC;border-color:#E1EEF8;color:#0B8EDD; transform:translateY(-1px)}
.mega a:link,.mega a:visited{color:#0F2640;text-decoration:none}

/* Cities grid (desktop) */
.city-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:1024px){.city-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){.city-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.city-item{display:flex;align-items:center;gap:10px;padding:.65rem .75rem;border-radius:12px;border:1px solid transparent;transition:background var(--t) var(--e),border-color var(--t) var(--e),transform var(--t) var(--e)}
.city-item:hover{background:#F3F8FC;border-color:#E1EEF8;color:#0B8EDD;transform:translateY(-1px)}

.menu-btn{display:none}
@media (max-width:1100px){.nav-list{display:none}.menu-btn{display:inline-flex}.navrow{justify-content:space-between}}

/* ---------- Mobile drawer (accordion) ---------- */
.mobile-nav{position:fixed;inset:0;background:rgba(10,30,45,.45);backdrop-filter:blur(6px);z-index:1000;display:none}
.mobile-nav.open{display:block}
.mobile-panel{position:absolute;right:0;top:0;bottom:0;width:min(420px,92vw);background:#fff;box-shadow:-10px 0 40px rgba(10,30,45,.25);padding:18px;overflow:auto}
.mobile-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.mobile-title{font-weight:800;font-size:1.05rem}
.mobile-close{border:0;background:transparent;font-weight:800;font-size:1.2rem;cursor:pointer}

.m-accordion{display:block}
.m-acc-item{border-bottom:1px solid #E5EDF5}
.m-acc-btn{
  width:100%; display:flex; align-items:center; gap:12px;
  padding:14px 4px; background:transparent; border:0;
  font-weight:800; font-size:1.05rem; color:#0F2640; cursor:pointer;
}
.m-acc-btn[aria-expanded="true"]{color:#0B8EDD}
.m-acc-panel{padding:6px 0 12px 34px}
.m-acc-panel[hidden]{display:none}

.m-link,.m-link-large{
  display:flex; align-items:center; gap:10px;
  padding:.6rem .5rem; border-radius:10px; color:#0F2640; text-decoration:none;
  transition:background var(--t) var(--e), color var(--t) var(--e);
}
.m-link:hover,.m-link-large:hover{background:#F3F8FC;color:#0B8EDD}
.m-link-large{padding:14px 6px; font-weight:800; border-bottom:1px solid #E5EDF5}

/* Sub-accordion (states) */
.m-sub{margin:2px 0}
.m-sub-btn{
  width:100%; display:flex; align-items:center; gap:10px;
  padding:10px 0; background:transparent; border:0; cursor:pointer;
  font-weight:700; color:#0F2640;
}
.m-sub-btn[aria-expanded="true"]{color:#0B8EDD}
.m-sub-panel{padding:6px 0 6px 28px}
.m-sub-panel[hidden]{display:none}

/* Topbar sizing */
:root{
  --topbar-h: 90px;
  --logo-h:   110px;
}
header.topbar{ height: var(--topbar-h); }
.topbar .topbar__row{
  height: 100%;
  min-height: 0;
  align-items: center;
  padding-block: 0;
}
.brand__mark{
  height: var(--logo-h) !important;
  width: auto !important;
  max-height: 100%;
  display: block;
}
.navwrap{ top: var(--topbar-h); }

/* 4-col variant for industries */
.mega-grid--4{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px }
@media (max-width:980px){ .mega-grid--4{ grid-template-columns:repeat(2,1fr) }}

/* foot row */
.mega-foot{display:flex;justify-content:flex-end;margin-top:10px}

/* Mobile drawer z-index hardening */
.mobile-nav{ z-index: 2000 !important; }
.navwrap .menu-btn{ position:relative; z-index: 2002; }

/* ================= GLOBAL UI – BUTTONS & CHIPS ================= */

/* Button color tokens – align with home page palette */
:root{
  --btn-ink:#0b3c56;
  --btn-alt:#26bbc5;
}

/* 3D CTA buttons (same family as home page) */
.btn3d-x{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  font-weight:900;
  text-decoration:none;
  white-space:nowrap;
  min-width:170px;
  border-radius:12px;
  padding:.85rem 1.15rem;
  border:2px solid transparent;
  color:#fff;
  box-shadow:
    0 14px 0 rgba(0,0,0,.22),
    0 28px 42px rgba(4,36,60,.20),
    inset 0 1px 0 rgba(255,255,255,.55);
  transition:
    transform .12s ease,
    filter .12s ease,
    box-shadow .12s ease;
}
.btn3d-x.primary{
  background:var(--btn-ink);
  border-color:var(--btn-ink);
}
.btn3d-x.alt{
  background:var(--btn-alt);
  color:#08343a;
  border-color:var(--btn-alt);
}
.btn3d-x.blue{
  background:var(--btn-ink);
  border-color:var(--btn-ink);
  color:#fff;
}
.btn3d-x.gold{
  background:linear-gradient(180deg,#fbbf24 0%,#f59e0b 100%);
  border-color:#d97706;
  color:#111827;
}
.btn3d-x:hover{
  transform:translateY(-2px);
  filter:brightness(1.02);
}
.btn3d-x:active{
  transform:translateY(3px);
  box-shadow:
    0 8px 0 rgba(0,0,0,.32),
    0 16px 26px rgba(4,36,60,.25),
    inset 0 1px 0 rgba(255,255,255,.45);
}
.btn3d-x:focus-visible{
  outline:3px solid rgba(11,142,221,.35);
  outline-offset:2px;
}
.btn3d-x.sm{
  min-width:auto;
  padding:.65rem .9rem;
  font-size:.9rem;
}

/* Chips */
.chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 11px;
  border-radius:999px;
  font-size:.8rem;
  font-weight:700;
  background:#f1f5f9;
  color:#0f172a;
  border:1px solid #e2e8f0;
  white-space:nowrap;
  gap:6px;
}
.chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

/* Global layout utils */
.section-inner,
.block-narrow{
  max-width:1080px;
  margin:0 auto;
}
.wrap{
  max-width:var(--container);
  margin:0 auto;
  padding:24px 16px;
}
@media(max-width:640px){
  .wrap{
    padding-left:20px;
    padding-right:20px;
  }
}
@media(max-width:640px){
  .soft-hero-ctas{
    justify-content:center;
  }
  .soft-hero-ctas .btn3d-x{
    width:80%;
    max-width:320px;
    justify-content:center;
  }
}

/* Global guard — stop horizontal scrolling anywhere */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
*, *::before, *::after { box-sizing: border-box; }
img, svg, video { max-width: 100%; height: auto; }

/* ===== Brand palette (footer) ===== */
.itw-foot.theme-foot{
  --c1:#26bbc5; --c2:#7ad5db; --c3:#12b4bc; --c4:#187980; --c5:#a8d7a2; --c6:#0d858b;
  --c7:#70e4f3; --ink:#04243c; --ink2:#284b5a; --leaf:#66a181; --mut2:#b6c4c4; --white:#fff;
  --bg:#04243c; --edge:#284b5a; --link:#70e4f3; --linkv:#7ad5db;
  --shadow-lg:0 18px 46px rgba(4,36,60,.18), 0 8px 20px rgba(4,36,60,.12);
  --shadow-md:0 12px 24px rgba(4,36,60,.14), 0 4px 10px rgba(4,36,60,.10);
  --shine:inset 0 1px 0 rgba(255,255,255,.55);
}
.itw-foot{
  background:var(--bg); color:#eaf6fb; padding-top:22px; padding-bottom:0
}
.itw-foot .foot-wrap{ width:min(1200px,94vw); margin-inline:auto }

/* ACTION BAR */
.foot-action{
  display:grid; grid-template-columns:1fr auto 1fr; gap:12px; align-items:center;
  background:#0a2f49; border:2px solid var(--edge); border-radius:16px; padding:12px;
  box-shadow:var(--shadow-lg), var(--shine); margin-bottom:16px
}
.fa-left .fa-line{ margin:0; color:#dff3f8 }
.fa-ctas{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap }
.fa-right{ display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap }
@media (max-width:900px){ .foot-action{ grid-template-columns:1fr } .fa-right{ justify-content:center } }

/* 3D Buttons in footer */
.btn3d{
  display:inline-flex; align-items:center; gap:8px; text-decoration:none; font-weight:900;
  border-radius:12px; padding:.95rem 1.25rem; transform:translateY(0);
  transition:transform .12s ease, box-shadow .12s ease, filter .12s ease; white-space:nowrap
}
.btn3d svg{flex:0 0 auto}
.btn3d.primary{
  background:var(--c4); color:#fff; border:2px solid var(--c4);
  box-shadow:0 14px 0 rgba(0,0,0,.24), 0 28px 42px rgba(4,36,60,.24), var(--shine)
}
.btn3d.alt{
  background:var(--c1); color:#08343a; border:2px solid var(--c1);
  box-shadow:0 12px 0 rgba(0,0,0,.20), 0 26px 38px rgba(4,36,60,.20), var(--shine)
}
.btn3d:hover{ transform:translateY(-2px); filter:brightness(1.02) }
.btn3d:active{ transform:translateY(3px) }
.btn3d:focus{ outline:3px solid var(--c7); outline-offset:2px }

/* Chips in footer */
.chip{
  display:inline-flex; align-items:center; gap:6px; background:#fff; color:var(--ink);
  border:2px solid var(--c5); border-radius:999px; padding:.45rem .7rem; font-weight:900;
  text-decoration:none; box-shadow:0 6px 12px rgba(4,36,60,.10), var(--shine)
}
.chip.to-top{ background:#fff; border-color:var(--c1) }
.chip:focus{ outline:3px solid var(--c7); outline-offset:2px }

/* MEGA SITEMAP */
.foot-mega{
  display:grid; gap:12px; grid-template-columns:repeat(6,1fr);
  border-top:2px solid var(--edge); padding-top:16px; margin-top:6px
}
@media (max-width:1020px){ .foot-mega{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:720px){ .foot-mega{ grid-template-columns:1fr } }
.foot-col{
  background:#0a2f49; border:2px solid var(--edge); border-radius:16px; padding:10px;
  box-shadow:var(--shadow-md), var(--shine)
}
/* section headers */
.foot-head{
  width:100%; text-align:left; cursor:default;
  background:var(--c4); color:#fff; border:2px solid var(--c1);
  border-radius:12px; padding:.6rem .8rem; font-weight:900; margin:0 0 8px;
  box-shadow:var(--shine)
}
@media (max-width:720px){
  .foot-head{ cursor:pointer; display:flex; justify-content:space-between; align-items:center }
  .foot-head::after{ content:"▾"; font-weight:900 }
  .foot-head[aria-expanded="false"]::after{ content:"▸" }
}
.foot-body{ padding:2px 2px 2px 2px }
.foot-body ul{ margin:0; padding:0; list-style:none }
.foot-body li + li{ margin-top:6px }
.foot-body a{
  color:var(--link); text-decoration:none; border-bottom:1px dotted transparent; padding-bottom:1px
}
.foot-body a:hover{ text-decoration:underline }
.foot-body a:visited{ color:var(--linkv) }

/* LANGUAGE BELT */
.lang-belt{
  margin-top:12px; background:#0a2f49; border:2px solid var(--edge); border-radius:16px; padding:10px;
  box-shadow:var(--shadow-md), var(--shine)
}
.lang-belt p{ margin:0; color:#eaf6fb; line-height:1.6 }
.lang-belt a{ color:var(--link); text-decoration:none }
.lang-belt a:hover{ text-decoration:underline }

/* BASE STRIP */
.foot-base{
  display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:center;
  border-top:2px solid var(--edge); padding:12px 0; margin-top:12px
}
.fb-left, .fb-mid, .fb-right{ display:flex; align-items:center; gap:8px; justify-content:flex-start }
.fb-mid{ justify-content:center }
.fb-right{ justify-content:flex-end }
.fb-mid a{ color:var(--link); text-decoration:none }
.fb-mid a:hover{ text-decoration:underline }
.fb-mid .sep{ color:#89a7b7 }
@media (max-width:720px){
  .foot-base{ grid-template-columns:1fr; text-align:center }
  .fb-left, .fb-mid, .fb-right{ justify-content:center }
}
@media (prefers-reduced-motion:reduce){
  .btn3d, .chip{ transition:none }
}

/* Anti-FOUC support if you keep the cloak class */
html.itw-cloak { opacity:0; background:#fff; }
@media (prefers-reduced-motion:no-preference){
  html.itw-cloak { transition:opacity .18s ease; }
}


/* Quick Quote form section */
.itw-qq-section {
  margin-bottom: 56px;
}

.itw-qq-heading {
  font-size: 1.2rem;
  font-weight: 600;
  margin-bottom: 6px;
}

.itw-qq-sub {
  font-size: 0.92rem;
  color: #4b5563;
  margin-bottom: 16px;
  max-width: 40rem;
}

.itw-qq-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 24px;
  align-items: flex-start;
}

.itw-qq-form {
  border-radius: 20px;
  border: 1px solid rgba(148, 163, 184, 0.55);
  background: #ffffff;
  box-shadow: 0 20px 60px rgba(15, 23, 42, 0.18);
  padding: 16px 16px 14px;
  font-size: 0.9rem;
}

.itw-qq-row {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
}

.itw-qq-row > div {
  flex: 1;
}

.itw-qq-label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  margin-bottom: 3px;
  color: #374151;
}
/* ===== Quick Quote inputs, textarea & file ===== */

.itw-qq-input,
.itw-qq-textarea {
  width: 100%;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.8);
  padding: 7px 9px;
  font-size: 0.88rem;
  font-family: inherit;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  background: #ffffff;
  color: #0f172a;
}

.itw-qq-input:focus,
.itw-qq-textarea:focus {
  border-color: var(--brand-700);
  box-shadow: 0 0 0 1px rgba(11, 142, 221, 0.25); /* soft brand glow */
}

/* Textarea */
.itw-qq-textarea {
  resize: vertical;
  min-height: 80px;
}

/* Fancy file input (Attach files) */
.itw-qq-file {
  width: 100%;
  border-radius: 999px;
  border: 1px solid #d1d9e6;
  padding: 0;
  background: #f9fafb;
  font-size: 0.9rem;
  font-family: inherit;
  color: #0f172a;
  cursor: pointer;
  overflow: hidden;
}

/* The visible button inside the file input */
.itw-qq-file::file-selector-button {
  padding: 8px 14px;
  margin-right: 8px;
  border: 0;
  border-radius: 999px 0 0 999px;
  background: linear-gradient(180deg, #2563eb, #4f46e5);
  color: #ffffff;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  box-shadow:
    0 10px 20px rgba(37, 99, 235, 0.35),
    0 2px 5px rgba(15, 23, 42, 0.18);
}
.itw-qq-file::file-selector-button:hover {
  filter: brightness(1.05);
}

/* Safari/WebKit fallback */
.itw-qq-file::-webkit-file-upload-button {
  padding: 8px 14px;
  margin-right: 8px;
  border: 0;
  border-radius: 999px 0 0 999px;
  background: linear-gradient(180deg, #2563eb, #4f46e5);
  color: #ffffff;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  box-shadow:
    0 10px 20px rgba(37, 99, 235, 0.35),
    0 2px 5px rgba(15, 23, 42, 0.18);
}

.itw-qq-file:focus-visible {
  outline: 3px solid rgba(11, 142, 221, 0.4);
  outline-offset: 2px;
}

/* Hint text under file input */
.itw-qq-hint {
  font-size: 0.78rem;
  color: #6b7280;
  margin-top: 6px;
  margin-bottom: 10px;
}

/* CTA row */
.itw-qq-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 6px;
}


@media (max-width: 640px) {
  .itw-qq-cta-row {
    flex-direction: column;
    align-items: stretch;
  }

  /* Primary button */
  .itw-qq-cta-row .btn3d-primary {
    display: block;
    width: calc(100% - 16px);   /* inset from form edges */
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 8px 6px;           /* 8px left/right inside, 6px bottom gap */
    text-align: center;
    justify-content: center;
    white-space: normal;
  }

  /* Ghost button */
  .itw-qq-cta-row .btn3d-ghost {
    display: block;
    width: calc(100% - 16px);   /* inset from form edges */
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 8px;              /* 8px left/right inside */
    text-align: center;
    justify-content: center;
    white-space: normal;        /* allow multi-line text */
  }
}


/* 3D buttons – you can adjust to match your global button classes */
.btn3d {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border-radius: 999px;
  border: none;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.btn3d-primary {
  background: linear-gradient(135deg, #2563eb, #4f46e5);
  color: #f9fafb;
  box-shadow: 0 14px 30px rgba(255, 255, 255, 0.55);
}

.btn3d-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(37, 99, 235, 0.7);
}

.btn3d-ghost {
  background: #ffffff;
  color: #1f2937;
  border: 1px solid rgba(148, 163, 184, 0.9);
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.18);
}

.btn3d-ghost:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.28);
  background: #f9fafb;
}

.itw-qq-note {
  font-size: 0.8rem;
  color: #6b7280;
  margin-top: 4px;
}

.itw-qq-side {
  font-size: 0.9rem;
  color: #4b5563;
}

.itw-qq-side h3 {
  font-size: 1rem;
  margin-bottom: 6px;
}

.itw-qq-side ul {
  padding-left: 1.1rem;
  margin-bottom: 8px;
}

.itw-qq-side li {
  margin-bottom: 4px;
}

.itw-inline-link {
  color: var(--brand-700);
  text-decoration: none;
  font-weight: 600;
}

.itw-inline-link:hover {
  text-decoration: underline;
}

@media (max-width: 960px) {
  .itw-qq-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}




/* Material Symbols icon font */
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;              /* adjust if you want smaller/bigger icons */
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}



/* 1) All section kickers + H2 titles centered */
.itw-section-shell .itw-section-kicker,
.itw-section-shell h2 {
  text-align: center;
}

/* Optional: center the small intro paragraph under each H2 on language pages */
.itw-section-shell > .container > p {
  text-align: center;
}




.itw-hero-cta-row {
  justify-content: center;
}

/* 3) Quick Quote CTA row (if used inside the form) */
.itw-qq-cta-row {
  justify-content: center;
}


.btn3d-row,
.btn3d-x-row {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}


.itw-qq-cta-row .btn3d-ghost {
  white-space: normal;   /* allow wrapping */
  text-align: center;    /* center the multi-line text */
}