/* =============================================================
   SPG Techsoft – conversion widgets (designs A / B / C + callback modal)
   Loaded only when a CTA design is active (see include/site-widgets-config.php)
   ============================================================= */
.spgw{--w-navy:#1b2255;--w-purple:#261d74;--w-orange:#e17b1d;--w-orange-d:#c9650c;--w-blue:#00a3ff;--w-wa:#25d366;--w-wa-d:#128c4b;--w-ink:#28282b;--w-muted:#6b6d76;--w-line:#e6e7ee;--w-fab-bottom:24px;font-family:Poppins,system-ui,sans-serif}
.spgw.spgw-hs{--w-fab-bottom:100px}           /* leave room for HubSpot chat launcher */
.spgw *{box-sizing:border-box}
.spgw svg{width:100%;height:100%;display:block}
.spgw button{font-family:inherit;cursor:pointer}
html.spgw-lock{overflow:hidden}

/* scroll-to-top moves left so the right side is free for WhatsApp / chat */
.scroll-top-btn{right:auto!important;left:24px!important;bottom:24px!important}

/* ---------- shared floating buttons ---------- */
.spgw-fab{position:relative;width:58px;height:58px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;box-shadow:0 10px 24px rgba(13,15,48,.22);transition:transform .2s ease,box-shadow .2s ease;text-decoration:none}
.spgw-fab>svg{width:28px;height:28px}
.spgw-fab:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(13,15,48,.3);color:#fff}
.spgw-fab-wa{background:var(--w-wa)}
.spgw-fab-call{background:linear-gradient(135deg,var(--w-purple),#3b47c4)}
.spgw-fab-call>svg{width:25px;height:25px}
.spgw-tip{position:absolute;right:70px;top:50%;transform:translateY(-50%) translateX(6px);white-space:nowrap;background:var(--w-navy);color:#fff;font-size:13px;font-weight:500;padding:7px 12px;border-radius:8px;opacity:0;pointer-events:none;transition:.2s}
.spgw-tip:after{content:"";position:absolute;right:-5px;top:50%;margin-top:-5px;border:5px solid transparent;border-right:0;border-left-color:var(--w-navy)}
.spgw-fab:hover .spgw-tip,.spgw-fab:focus-visible .spgw-tip{opacity:1;transform:translateY(-50%)}
.spgw-pulse:before{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(59,71,196,.55);animation:spgwPulse 2.2s infinite}
@keyframes spgwPulse{70%{box-shadow:0 0 0 16px rgba(59,71,196,0)}100%{box-shadow:0 0 0 0 rgba(59,71,196,0)}}

.spgw-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;font-weight:600;font-size:15px;padding:12px 20px;text-decoration:none;transition:background .2s,transform .2s}
.spgw-btn svg{width:20px;height:20px}
.spgw-btn-orange{background:var(--w-orange);color:#fff}
.spgw-btn-orange:hover{background:var(--w-orange-d);color:#fff}
.spgw-btn-primary{background:linear-gradient(135deg,var(--w-purple),#3b47c4);color:#fff;box-shadow:0 8px 18px rgba(38,29,116,.28)}
.spgw-btn-primary:hover{filter:brightness(1.08);color:#fff}
.spgw-btn-primary:disabled{opacity:.6;cursor:wait}
.spgw-btn-wa{background:var(--w-wa);color:#fff}
.spgw-btn-wa:hover{background:var(--w-wa-d);color:#fff}

/* ================= DESIGN A ================= */
.spgw-a-stack{position:fixed;right:24px;bottom:var(--w-fab-bottom);z-index:1040;display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.spgw-a-bubble{position:relative;width:230px;background:#fff;border-radius:14px;padding:16px 16px 14px;text-align:center;box-shadow:0 18px 40px rgba(13,15,48,.2);border:1px solid var(--w-line);animation:spgwIn .35s ease;margin-bottom:2px}
.spgw-a-bubble[hidden]{display:none}
.spgw-a-bubble:after{content:"";position:absolute;right:22px;bottom:-8px;width:16px;height:16px;background:#fff;border-right:1px solid var(--w-line);border-bottom:1px solid var(--w-line);transform:rotate(45deg)}
.spgw-a-bubble p{margin:0 0 12px;font-size:14px;line-height:1.45;color:var(--w-ink)}
.spgw-a-bubble .spgw-a-bubble-hi{font-weight:700;font-size:16px;margin-bottom:4px}
.spgw-a-bubble .spgw-btn{width:100%;padding:10px}
.spgw-a-bubble-x{position:absolute;top:8px;right:8px;width:24px;height:24px;padding:5px;border:0;background:#f1f2f6;border-radius:50%;color:var(--w-muted)}
@keyframes spgwIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ================= DESIGN B ================= */
.spgw-b-tab{position:fixed;left:0;top:50%;transform:translateY(-50%);z-index:1040;writing-mode:vertical-rl;rotate:180deg;display:flex;align-items:center;gap:10px;border:0;background:var(--w-orange);color:#fff;font-weight:600;font-size:15px;letter-spacing:.3px;padding:18px 12px;border-radius:12px 0 0 12px;box-shadow:4px 6px 18px rgba(225,123,29,.35);transition:padding .2s,background .2s}
.spgw-b-tab svg{width:18px;height:18px;rotate:90deg}
.spgw-b-tab:hover{background:var(--w-orange-d);padding-right:16px}
.spgw-b-wa{position:fixed;right:24px;bottom:var(--w-fab-bottom);z-index:1040}
.spgw-b-wa>svg{width:26px;height:26px}
.spgw-bar{display:none}

/* ================= DESIGN C ================= */
.spgw-c-side{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:1040;width:46px;display:flex;flex-direction:column;align-items:flex-end;filter:drop-shadow(-4px 6px 12px rgba(13,15,48,.18))}
.spgw-c-contact{writing-mode:vertical-rl;rotate:180deg;border:0;background:var(--w-navy);color:#fff;font-weight:600;font-size:13px;letter-spacing:.6px;text-transform:uppercase;width:46px;padding:16px 0;border-radius:0 12px 0 0}
.spgw-c-contact:hover{background:var(--w-purple)}
.spgw-c-side a{position:relative;display:flex;align-items:center;justify-content:flex-end;width:46px;height:46px;color:#fff;text-decoration:none;transition:width .25s ease}
.spgw-c-side a svg{width:20px;height:20px;flex:0 0 20px;margin-right:13px}
.spgw-c-side a em{font-style:normal;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;max-width:0;opacity:0;transition:.25s;margin-right:0}
.spgw-c-side a:hover,.spgw-c-side a:focus-visible{width:auto;padding-left:14px;border-radius:10px 0 0 10px;flex-shrink:0}
.spgw-c-side a:hover em,.spgw-c-side a:focus-visible em{max-width:200px;opacity:1;margin-right:12px}
.spgw-c-side a:hover svg{animation:spgwWiggle .45s ease}
@keyframes spgwWiggle{30%{transform:rotate(-12deg) scale(1.1)}60%{transform:rotate(8deg)}}
.spgw-c-side .s-fb{background:#1877f2}.spgw-c-side .s-ig{background:linear-gradient(45deg,#f9a825,#e1306c 55%,#833ab4)}
.spgw-c-side .s-in{background:#0a66c2}.spgw-c-side .s-x{background:#111}
.spgw-c-side .s-mail{background:var(--w-orange)}.spgw-c-side .s-tel{background:#3b47c4;border-radius:0 0 0 12px}
.spgw-c-side a:first-of-type{border-top-left-radius:0}

.spgw-c-dial{position:fixed;right:24px;bottom:var(--w-fab-bottom);z-index:1041;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.spgw-c-dial-main{height:58px;border:0;border-radius:30px;padding:0 22px 0 16px;display:flex;align-items:center;gap:10px;color:#fff;font-weight:600;font-size:16px;background:linear-gradient(135deg,var(--w-orange),#f0962f);box-shadow:0 10px 24px rgba(225,123,29,.4)}
.spgw-c-dial-main span{width:26px;height:26px;display:grid}
.spgw-c-dial-main .x{display:none;padding:3px}
.spgw-c-dial.is-open .spgw-c-dial-main .o{display:none}.spgw-c-dial.is-open .spgw-c-dial-main .x{display:grid}
.spgw-c-dial-items{display:flex;flex-direction:column;align-items:flex-end;gap:10px;pointer-events:none}
.spgw-c-dial-items>*{display:flex;align-items:center;gap:10px;border:0;background:none;padding:0;text-decoration:none;opacity:0;transform:translateY(12px) scale(.9);transition:.22s ease}
.spgw-c-dial.is-open .spgw-c-dial-items{pointer-events:auto}
.spgw-c-dial.is-open .spgw-c-dial-items>*{opacity:1;transform:none}
.spgw-c-dial.is-open .spgw-c-dial-items>*:nth-child(2){transition-delay:.04s}.spgw-c-dial.is-open .spgw-c-dial-items>*:nth-child(1){transition-delay:.08s}
.spgw-c-dial-items span{background:#fff;color:var(--w-ink);font-size:13.5px;font-weight:600;padding:8px 12px;border-radius:8px;box-shadow:0 6px 18px rgba(13,15,48,.15)}
.spgw-c-dial-items i{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;padding:12px;box-shadow:0 6px 16px rgba(13,15,48,.2)}
.spgw-c-dial-items .d-wa i{background:var(--w-wa)}.spgw-c-dial-items .d-tel i{background:#3b47c4}
.spgw-c-dial-items .d-cb i{background:var(--w-orange)}.spgw-c-dial-items .d-chat i{background:var(--w-navy)}

/* ================= callback modal (shared) ================= */
.spgw-modal{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:16px}
.spgw-modal[hidden]{display:none}
.spgw-modal-backdrop{position:absolute;inset:0;background:rgba(13,15,48,.6);backdrop-filter:blur(2px);animation:spgwFade .2s ease}
@keyframes spgwFade{from{opacity:0}}
.spgw-modal-card{position:relative;width:100%;max-width:640px;max-height:calc(100vh - 32px);overflow:auto;background:#fff;border-radius:18px;padding:22px 40px 30px;box-shadow:0 30px 80px rgba(0,0,0,.35);animation:spgwIn .25s ease;text-align:center}
.spgw-modal-x{position:absolute;top:12px;right:12px;width:34px;height:34px;padding:9px;border:0;border-radius:50%;background:#f1f2f6;color:var(--w-muted)}
.spgw-modal-x:hover{background:#e6e7ee;color:var(--w-ink)}
.spgw-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--w-line);margin:0 -10px 18px}
.spgw-tabs button{border:0;background:none;padding:6px 6px 14px;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--w-muted);font-size:14px;font-weight:500;border-bottom:3px solid transparent;margin-bottom:-1px}
.spgw-tabs button+button{border-left:1px solid var(--w-line)}
.spgw-tabs svg{width:24px;height:24px}
.spgw-tabs [aria-selected=true]{color:var(--w-purple);font-weight:700;border-bottom-color:var(--w-orange)}
.spgw-logo{height:46px;width:auto;margin:4px auto 10px;display:block}
.spgw-h{font-size:30px;line-height:1.2;font-weight:700;color:#333;margin:0 auto 22px;max-width:520px}
.spgw-row{display:flex;gap:12px;margin-bottom:12px}
.spgw-input{width:100%;border:1.5px solid #d9dbe3;border-radius:10px;padding:13px 14px;font:inherit;font-size:16px;color:var(--w-ink);background:#fff;outline:none;transition:border-color .2s,box-shadow .2s}
.spgw-input:focus{border-color:#3b47c4;box-shadow:0 0 0 3px rgba(59,71,196,.15)}
textarea.spgw-input{resize:vertical;min-height:84px}
.spgw-phone{flex:1;display:flex;align-items:center;border:1.5px solid #d9dbe3;border-radius:10px;background:#fff;transition:border-color .2s,box-shadow .2s}
.spgw-phone:focus-within{border-color:#3b47c4;box-shadow:0 0 0 3px rgba(59,71,196,.15)}
.spgw-phone .spgw-input{border:0;box-shadow:none!important;padding-left:8px;font-size:18px;letter-spacing:.5px}
.spgw-cc{display:flex;align-items:center;gap:7px;padding-left:14px;font-weight:600;color:var(--w-ink);font-size:16px}
.spgw-flag{width:24px;height:16px;border-radius:2px;background:linear-gradient(#ff9933 33.3%,#fff 33.3% 66.6%,#138808 66.6%);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);position:relative}
.spgw-flag:after{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;margin:-2.5px;border:1px solid #000080;border-radius:50%}
.spgw-submit{min-width:190px;font-size:18px;padding:14px 22px}
.spgw-only-later,.spgw-only-message{display:none}
.spgw-modal[data-mode=later] .spgw-only-later,.spgw-modal[data-mode=message] .spgw-only-message{display:flex}
.spgw-err{color:#c62828;font-size:14px;margin:4px 0 0}
.spgw-note{color:#9a9ca5;font-size:13px;margin:14px 0 0}
.spgw-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.spgw-done{padding:20px 0 6px}
.spgw-done[hidden],.spgw-form[hidden]{display:none}
.spgw-done-ic{width:64px;height:64px;border-radius:50%;background:#e8f8ee;color:#1e9e55;display:grid;place-items:center;padding:16px;margin:0 auto 16px}
.spgw-done-txt{color:var(--w-muted);font-size:16px;margin:-10px 0 20px}

/* ================= mobile ================= */
@media (max-width:991px){
  .spgw-tip{display:none}
  .spgw-fab{width:54px;height:54px}
  .spgw-a-stack{right:16px;bottom:calc(var(--w-fab-bottom) - 8px)}
  /* B + C: the bottom bar replaces desktop floaters */
  .spgw-b-tab,.spgw-b-wa,.spgw-c-side{display:none}
  .spgw-bar{display:grid;grid-template-columns:1fr 1fr 1.5fr;position:fixed;left:0;right:0;bottom:0;z-index:1040;background:#fff;box-shadow:0 -6px 20px rgba(13,15,48,.12);padding:8px 10px calc(8px + env(safe-area-inset-bottom));gap:8px}
  .spgw-bar-2{grid-template-columns:1fr 2fr}
  .spgw-bar>*{display:flex;align-items:center;justify-content:center;gap:7px;height:48px;border:0;border-radius:10px;font-size:15px;font-weight:600;text-decoration:none;color:var(--w-purple);background:#eef0fb}
  .spgw-bar svg{width:20px;height:20px}
  .spgw-bar .is-wa{background:#e6f9ee;color:var(--w-wa-d)}
  .spgw-bar .is-cta{background:var(--w-orange);color:#fff}
  body:has(.spgw-bar){padding-bottom:64px}
  body:has(.spgw-bar) .scroll-top-btn{bottom:82px!important;left:16px!important}
  .spgw-c-dial{right:16px;bottom:calc(76px + var(--w-fab-bottom) - 24px)}
  .spgw-c-dial-main{width:54px;height:54px;padding:0;justify-content:center;border-radius:50%}
  .spgw-c-dial-main b{display:none}
  body:has(.spgw-bar) #hubspot-messages-iframe-container{bottom:66px!important}
  .spgw-modal{align-items:end;padding:0}
  .spgw-modal-card{border-radius:18px 18px 0 0;padding:18px 18px calc(22px + env(safe-area-inset-bottom));max-height:92vh}
  .spgw-h{font-size:22px;margin-bottom:16px}
  .spgw-tabs{margin:26px -6px 12px}.spgw-tabs button{font-size:12.5px}
  .spgw-logo{height:36px;margin-bottom:6px}
  .spgw-row-main{flex-direction:column}
  .spgw-submit{width:100%}
}
/* design C on mobile: speed dial hidden (bar covers it) unless HubSpot needs the chat item */
@media (max-width:991px){.spgw-design-c:not(.spgw-hs) .spgw-c-dial{display:none}}

/* ================= header tap-to-call / WhatsApp icons (mobile) ================= */
.spg-head-icons{display:none}
@media (max-width:991px){
  .spg-head-icons{display:flex;align-items:center;gap:10px;margin-left:auto;margin-right:12px}
  .spg-head-icons a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:#fff;text-decoration:none;box-shadow:0 4px 12px rgba(13,15,48,.15)}
  .spg-head-icons svg{width:20px;height:20px}
  .spg-head-icons .h-tel{background:#e17b1d}
  .spg-head-icons .h-wa{background:#25d366}
}
@media (prefers-reduced-motion:reduce){.spgw *,.spgw *:before{animation:none!important;transition:none!important}}

/* =============================================================
   Services v2 – outcome-based cards (only used when services = v2)
   ============================================================= */
.svc2{padding:90px 0 80px}
.svc2-head{max-width:820px;margin:0 auto 48px;text-align:center}
.svc2-kicker{display:inline-block;font-size:13px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:#ffb46b;margin-bottom:10px}
.svc2-head .services-title{margin-bottom:14px}
.svc2-head .services-subtitle{color:rgba(255,255,255,.82);font-size:16px;line-height:1.7;margin:0}
.svc2-head .services-subtitle a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.svc2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.svc2-card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:18px;padding:28px 26px 24px;box-shadow:0 10px 30px rgba(8,10,40,.18);transition:transform .25s ease,box-shadow .25s ease;overflow:hidden}
.svc2-card:before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:linear-gradient(90deg,#261d74,#00a3ff);transform:scaleX(0);transform-origin:left;transition:transform .35s ease}
.svc2-card:hover{transform:translateY(-6px);box-shadow:0 22px 46px rgba(8,10,40,.28)}
.svc2-card:hover:before{transform:scaleX(1)}
.svc2-top{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.svc2-icon{width:54px;height:54px;border-radius:14px;background:#f0f1fb;display:grid;place-items:center;flex:0 0 54px}
.svc2-icon img{width:34px;height:34px;object-fit:contain}
.svc2-tag{font-size:12.5px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:#e17b1d}
.svc2-title{font-size:21px;line-height:1.3;font-weight:700;color:#1b2255;margin:0 0 10px}
.svc2-desc{font-size:14.5px;line-height:1.65;color:#5d5f6b;margin:0 0 18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.svc2-chips{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-wrap:wrap;gap:7px}
.svc2-chips a{display:inline-block;font-size:12.5px;color:#3a3d4a;background:#f4f5f9;border:1px solid #e7e8ef;border-radius:20px;padding:4px 11px;text-decoration:none;transition:.2s}
.svc2-chips a:hover{background:#261d74;border-color:#261d74;color:#fff}
.svc2-more{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:600;font-size:15px;color:#fff;background:linear-gradient(135deg,#261d74,#3b47c4);border-radius:10px;padding:12px 18px;text-decoration:none;transition:filter .2s}
.svc2-more span{transition:transform .2s}
.svc2-more:hover{color:#fff;filter:brightness(1.1)}
.svc2-more:hover span{transform:translateX(4px)}
.svc2-foot{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:44px;color:#fff}
.svc2-foot p{margin:0;font-size:17px;font-weight:500}
.svc2-cta{border:0;border-radius:30px;background:#e17b1d;color:#fff;font-weight:600;font-size:15px;padding:13px 26px;box-shadow:0 8px 20px rgba(225,123,29,.4);font-family:inherit;cursor:pointer}
.svc2-cta:hover{background:#c9650c}
@media (max-width:1199px){.svc2-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:767px){.svc2{padding:60px 0}.svc2-grid{grid-template-columns:1fr;gap:18px}.svc2-card{padding:22px 20px 20px}.svc2-title{font-size:19px}.svc2-head{margin-bottom:30px;padding:0 4px}}
.svc2>.container{max-width:1240px;margin-left:auto!important;margin-right:auto!important;padding-left:20px;padding-right:20px}
.svc2 .svc2-foot p{color:#fff}
.spgw-modal.is-done .spgw-tabs{display:none}
@media (max-width:767px){.svc2-chips{flex-wrap:nowrap;overflow-x:auto;margin-right:-20px;padding-right:20px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent)}.svc2-chips::-webkit-scrollbar{display:none}.svc2-chips li{flex:0 0 auto}.svc2-desc{-webkit-line-clamp:2;margin-bottom:14px}.svc2-chips{margin-bottom:16px}}

/* Original centred "Let's Discuss" pill is kept: lift it above the mobile bottom bar (designs B, C) */
@media (max-width:991px){body:has(.spgw-bar) .floating-btn{bottom:84px}}