/* ============================================================
   V2 (October 2026): 12 services, grouped navigation, homepage
   transition, stats and About page updates. Loaded on every page.
   ============================================================ */

/* Service page "what's included" groups */
.inc-cat{margin-top:2.6rem}
.section-head + .inc-cat{margin-top:.6rem}
.inc-cat + .inc-grid{margin-top:1.1rem}
@media(min-width:1000px){
  .inc-grid:has(> .inc:nth-child(4):last-child){grid-template-columns:repeat(4,1fr)}
  .inc-grid:has(> .inc:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
}
@media(min-width:640px) and (max-width:999px){
  .inc-grid:has(> .inc:nth-child(4):last-child){grid-template-columns:repeat(2,1fr)}
}

/* Header mega menu: four groups of three */
.nav-mega{width:min(980px,94vw);padding:1rem 1rem .9rem}
.mega-groups{display:grid;grid-template-columns:repeat(4,1fr);gap:.4rem .9rem}
.mega-col{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.mega-lab{display:block;font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:.2rem .8rem .55rem;border-bottom:1px solid var(--line);margin-bottom:.35rem;line-height:1.35}
.nav-mega .mega-col a{font-size:.86rem;padding:.55rem .7rem}
@media(max-width:1100px){.mega-groups{grid-template-columns:repeat(2,1fr)}}

/* Footer: services in two compact columns so the footer stays short */
.foot-grid{grid-template-columns:1.4fr 1.7fr .9fr 1.3fr}
.foot-svc-list{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));column-gap:2rem}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}.foot-svc-list{grid-template-columns:1fr 1fr}}

/* Homepage: soften the jump from the dark hero to the light page.
   The partner strip continues the hero's night tone, then the services
   section fades up into the light background over its top padding. */
body.home .marquee-sec{background:linear-gradient(180deg,#050d1a 0%,#081a31 55%,#0d2443 100%);position:relative}
body.home .marquee-sec .marquee-lab{color:rgba(255,255,255,.62)}
body.home .marquee-sec .chip{box-shadow:0 0 0 1px rgba(255,255,255,.12),0 10px 24px -14px rgba(0,0,0,.6)}
body.home #services{padding-top:clamp(7rem,12vw,10rem);background:linear-gradient(180deg,#0d2443 0%,#1d3a63 14%,#5f7ea8 34%,#b7c8e0 58%,rgba(219,228,242,0) 100%) top/100% 300px no-repeat}
body.home #services > .dots{opacity:.35}

/* About: brand tiles in place of the two small stock photos */
.brand-tile{aspect-ratio:4/3;border-radius:18px;position:relative;overflow:hidden;padding:1.1rem 1.2rem;display:flex;flex-direction:column;justify-content:flex-end;gap:.15rem;color:#fff;isolation:isolate}
.brand-tile::before{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.14) 1px,transparent 1px);background-size:14px 14px;mask-image:linear-gradient(160deg,#000 10%,transparent 70%);-webkit-mask-image:linear-gradient(160deg,#000 10%,transparent 70%)}
.bt-a{background:linear-gradient(150deg,#0B1F3A 0%,#16336b 100%)}
.bt-b{background:linear-gradient(140deg,#0FB4C8 0%,#3FA9F5 45%,#6366F1 100%)}
.brand-tile .logo-climb{position:absolute;top:1.1rem;left:1.2rem;height:30px;color:#fff}
.bt-n{position:absolute;top:.55rem;left:1.1rem;font-family:var(--display);font-weight:800;font-size:2.6rem;letter-spacing:-.04em;line-height:1}
.bt-k{font-family:var(--display);font-weight:700;font-size:1.02rem;letter-spacing:-.01em;line-height:1.2}
.bt-v{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;opacity:.78}

/* About: our story */
.story2{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr) minmax(0,1fr);gap:clamp(1.6rem,4vw,3.4rem);align-items:start}
.story2-head h2{margin-top:1rem}
.story2-copy p{color:var(--muted);margin:0 0 1.05rem;line-height:1.75}
.story2-copy p:last-child{margin-bottom:0}
.story2-note{background:var(--navy-grad,linear-gradient(150deg,#0B1F3A,#16336b));color:#fff;border-radius:22px;padding:1.6rem 1.5rem;box-shadow:var(--shadow-md);position:relative;overflow:hidden}
.story2-note h3{color:#fff;font-size:1.25rem;margin:.9rem 0 .6rem;letter-spacing:-.02em}
.story2-note p{color:rgba(255,255,255,.74);margin:0;font-size:.95rem;line-height:1.7}
.s2-ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(25,211,230,.18);color:#19D3E6}
@media(max-width:1000px){.story2{grid-template-columns:1fr}}

/* About: credibility band */
.cred{display:grid;grid-template-columns:repeat(4,1fr);background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-sm);overflow:hidden}
.cred-stat{padding:1.6rem 1.4rem;display:flex;flex-direction:column;gap:.35rem;border-right:1px solid var(--line)}
.cred-stat:last-child{border-right:0}
.cs-n{font-family:var(--display);font-weight:800;font-size:clamp(1.9rem,3.2vw,2.6rem);letter-spacing:-.04em;line-height:1;background:var(--accent-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.cs-l{color:var(--muted);font-size:.9rem;line-height:1.4}
.cred-quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1rem}
.cq{margin:0;background:var(--glass);border:1px solid var(--line);border-radius:18px;padding:1.3rem 1.3rem 1.2rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem}
.cq blockquote{margin:0;color:var(--ink);font-size:.95rem;line-height:1.65}
.cq figcaption{display:flex;flex-direction:column;font-size:.85rem}
.cq figcaption strong{color:var(--navy)}
.cq figcaption span{color:var(--muted);font-size:.8rem}
@media(max-width:900px){.cred{grid-template-columns:1fr 1fr}.cred-stat:nth-child(2){border-right:0}.cred-stat:nth-child(-n+2){border-bottom:1px solid var(--line)}.cred-quotes{grid-template-columns:1fr}}
.story2-head h2{font-size:clamp(2rem,3.4vw,2.8rem)}

/* Service pages: small note under a tile group (e.g. partner agency) */
.inc-note{margin:1rem 0 0;color:var(--muted);font-size:.92rem}
.inc-note a{color:var(--cyan-deep);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* Mobile fixes */
body.home header:has(.burger.open) .logo{color:var(--navy)}
body.home header:has(.burger.open) .burger span{background:var(--navy)}
@media(max-width:560px){
  .fF-cta{flex-direction:column}
  .fF-cta .btn{width:100%;justify-content:space-between}
  #stats.stats{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .story-photos.story-tiles{grid-template-columns:1fr 1fr}
  .brand-tile{aspect-ratio:1/1;padding:.9rem}
  .brand-tile .logo-climb{top:.9rem;left:.9rem;height:24px}
  .bt-n{top:.45rem;left:.85rem;font-size:2.1rem}
  .bt-k{font-size:.9rem}
  .bt-v{font-size:.6rem}
}

/* Alignment: equal-height group labels so every column's links line up */
.mega-lab{min-height:calc(2 * 1.35em + .75rem);display:flex;align-items:flex-start}
.mega-col a{min-height:46px}
/* Footer services: heading centred over the two link columns, even rows */
.foot-col-svc{justify-self:start;width:max-content;max-width:100%}
.foot-col-svc h4{text-align:center}
.foot-svc-list{row-gap:0}
.foot-svc-list a{display:flex;align-items:center;min-height:2.05rem;margin:0;padding:0;line-height:1.3}
@media(max-width:560px){.foot-col-svc{width:auto;justify-self:stretch}.foot-col-svc h4{text-align:left}}


/* ============================================================
   v3: Support page, form extras, header support link (Oct 2026)
   ============================================================ */
.nav-support{font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--muted);text-decoration:none;margin-right:.9rem;white-space:nowrap}
.nav-support:hover,.nav-support.active{color:var(--blue)}
@media(max-width:1180px){.nav-support{display:none}}

.contact-xlink{margin:-.6rem 0 1.2rem;font-size:.95rem;color:var(--muted)}
.contact-xlink a{color:var(--blue);font-weight:600}

.gh-consent{display:flex;gap:.65rem;align-items:flex-start;margin:.2rem 0 1.1rem;font-size:.9rem;line-height:1.5;color:var(--muted);cursor:pointer}
.gh-consent input{margin-top:.2rem;width:18px;height:18px;flex:0 0 18px;accent-color:var(--blue)}
.gh-consent a{color:var(--blue);font-weight:600}
.gh-captcha{margin-bottom:1.2rem}
.gh-captcha .g-recaptcha{max-width:100%;overflow:hidden}
.gh-captcha-msg{color:#b42318;font-size:.88rem;margin:.5rem 0 0}
@media(max-width:400px){.gh-captcha .g-recaptcha{transform:scale(.88);transform-origin:0 0}}

/* Urgent banner */
.sup-urgent-sec{padding-top:0}
.sup-urgent{display:flex;align-items:center;gap:1.1rem;padding:1.15rem 1.4rem;border-radius:18px;background:linear-gradient(135deg,#fff4ec,#ffe9e2);border:1px solid rgba(220,90,40,.25);box-shadow:var(--shadow-sm)}
.sup-urgent p{margin:0;flex:1;color:var(--navy);font-size:1rem}
.sup-urgent-ico{flex:0 0 44px;height:44px;border-radius:12px;display:grid;place-items:center;background:#f2622e;color:#fff}
.sup-urgent-actions{display:flex;gap:.6rem;flex-wrap:wrap}
@media(max-width:760px){.sup-urgent{flex-direction:column;align-items:flex-start}.sup-urgent-actions{width:100%}.sup-urgent-actions .btn{flex:1;justify-content:center}}

/* Contact cards */
.sup-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
.sup-card{display:flex;flex-direction:column;gap:.35rem;padding:1.5rem;border-radius:20px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);text-decoration:none;color:var(--navy);transition:transform .25s,box-shadow .25s}
.sup-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.sup-card-ico{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;color:#fff;background:var(--g,linear-gradient(135deg,#19D3E6,#3FA9F5));margin-bottom:.6rem;flex:0 0 46px}
.sup-card-t{font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.sup-card-v{font-family:var(--display);font-weight:700;font-size:1.12rem;word-break:break-word}
.sup-card-s{font-size:.9rem;color:var(--muted);line-height:1.45}
.sup-hours-line{display:flex;align-items:center;justify-content:center;gap:.5rem;margin:1.6rem 0 0;color:var(--muted);text-align:center}
@media(max-width:1000px){.sup-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.sup-cards{grid-template-columns:1fr}}

/* Hours */
.sup-hours{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center;padding:2rem;border-radius:22px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.sup-hours-copy h2{margin:.8rem 0 .6rem;font-size:clamp(1.5rem,2.6vw,2rem)}
.sup-hours-copy p{margin:0;color:var(--muted)}
.sup-hours-table{width:100%;border-collapse:collapse}
.sup-hours-table th,.sup-hours-table td{padding:.85rem .2rem;border-bottom:1px solid var(--line);text-align:left;font-size:1rem}
.sup-hours-table th{font-weight:600;color:var(--navy)}
.sup-hours-table td{text-align:right;color:var(--muted);font-family:var(--mono);font-size:.9rem}
.sup-hours-table tr:last-child th,.sup-hours-table tr:last-child td{border-bottom:0}
@media(max-width:760px){.sup-hours{grid-template-columns:1fr;padding:1.5rem}}

/* Ticket form */
.sup-form-card{max-width:980px;margin:0 auto}
.sup-form-intro{color:var(--muted);margin:0 0 1.4rem}
.sup-help{font-size:.82rem;color:var(--muted-2);margin:.15rem 0 0;line-height:1.45}
.sup-critical{display:flex;align-items:center;gap:.4rem;margin:.4rem 0 0;font-size:.88rem;font-weight:600;color:#b42318}
.sup-critical a{color:#b42318}
.field input[type=file]{padding:.7rem;background:var(--surface)}

/* Remote support */
.sup-agents{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:1.1rem;margin-bottom:1.8rem}
.sup-agent{display:flex;flex-direction:column;gap:.5rem;padding:1.6rem;border-radius:20px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.sup-agent h3{font-size:1.1rem;margin:0;line-height:1.3}
.sup-agent-os{margin:0;font-family:var(--mono);font-size:.76rem;color:var(--muted);letter-spacing:.03em}
.sup-agent-note{margin:0;font-size:.88rem;color:var(--muted);line-height:1.45}
.sup-agent .btn{margin-top:auto;align-self:flex-start}
.sup-agent-main{background:linear-gradient(160deg,#0B1F3A,#16336b);color:#fff;border-color:transparent;box-shadow:var(--shadow-lg)}
.sup-agent-main h3{color:#fff}
.sup-agent-main .sup-agent-os,.sup-agent-main .sup-agent-note{color:rgba(255,255,255,.75)}
.sup-agent-main .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35)}
.btn.is-disabled{opacity:.6;cursor:default;pointer-events:none}
.sup-remote-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:1.1rem}
.sup-steps,.sup-links{padding:1.6rem;border-radius:20px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.sup-steps h3,.sup-links h3{font-size:1.1rem;margin:0 0 1rem}
.sup-steps ol{list-style:none;margin:0 0 1.1rem;padding:0;display:grid;gap:.7rem}
.sup-steps li{display:flex;gap:.8rem;align-items:center;color:var(--navy)}
.sup-steps li span{flex:0 0 30px;height:30px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:.8rem;color:#fff;background:linear-gradient(135deg,#19D3E6,#3FA9F5)}
.sup-trust{display:flex;gap:.55rem;align-items:flex-start;margin:0;padding:.9rem 1rem;border-radius:14px;background:rgba(63,169,245,.08);font-size:.9rem;color:var(--navy);line-height:1.5}
.sup-trust svg{flex:0 0 18px;margin-top:.15rem;color:var(--blue)}
.sup-link{display:flex;align-items:center;gap:.9rem;padding:.9rem;border-radius:14px;border:1px solid var(--line);text-decoration:none;color:var(--navy);margin-bottom:.7rem;transition:background .2s}
.sup-link:last-child{margin-bottom:0}
.sup-link:hover{background:rgba(63,169,245,.06)}
.sup-link .sup-card-ico{width:40px;height:40px;flex:0 0 40px;margin:0}
.sup-link span:nth-child(2){flex:1;display:flex;flex-direction:column}
.sup-link small{color:var(--muted);font-size:.84rem;line-height:1.4}
@media(max-width:1000px){.sup-agents{grid-template-columns:1fr}.sup-remote-grid{grid-template-columns:1fr}}

/* Floating WhatsApp (Support page only) */
.sup-wa-float{position:fixed;right:20px;bottom:20px;z-index:60;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;color:#fff;background:#22C55E;box-shadow:0 12px 28px -8px rgba(34,197,94,.6);transition:transform .2s}
.sup-wa-float:hover{transform:scale(1.06)}

.sup-critical[hidden],.gh-captcha-msg[hidden]{display:none}
.sup-form-card{width:100%;max-width:980px}
.form-row>.field{min-width:0}
.field input[type=file]{width:100%;max-width:100%;min-width:0;box-sizing:border-box}

/* v3.1 header support pill */
.nav-right .nav-support{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--body);font-size:.9rem;font-weight:600;letter-spacing:0;text-transform:none;color:var(--navy);padding:.5rem .95rem;margin:0 1.1rem 0 1.6rem;border-radius:999px;border:1px solid rgba(63,169,245,.45);background:rgba(63,169,245,.1);transition:background .2s,border-color .2s,color .2s}
.nav-right .nav-support svg{color:var(--blue);flex:0 0 15px}
.nav-right .nav-support:hover,.nav-right .nav-support.active{background:var(--blue);border-color:var(--blue);color:#fff}
.nav-right .nav-support:hover svg,.nav-right .nav-support.active svg{color:#fff}
.scrolled .nav-right .nav-support,.nav.dark .nav-right .nav-support{color:inherit}
@media(max-width:1180px){.nav-right .nav-support{display:none}}


/* ============================================================
   v4: final finishing touches (29 Oct 2026)
   ============================================================ */
/* Managed IT hero note */
.hero-client-note{margin:1.1rem 0 0;font-size:.95rem;color:var(--muted)}
.hero-client-note a{color:var(--blue);font-weight:600}

/* Contact page office hours card */
.info-card-hours{cursor:default}
.info-card-hours .ic-after{margin-top:.45rem;line-height:1.5}
.info-card-hours .ic-after a{color:var(--blue);font-weight:600;white-space:nowrap}

/* Support: phone card after-hours line */
.sup-card-after{margin-top:.35rem;padding-top:.55rem;border-top:1px dashed var(--line);font-size:.86rem}
.sup-hours-copy p a{color:var(--blue);font-weight:600;white-space:nowrap}

/* Support: GH Technical Support Agent cards */
.sup-agents{grid-template-columns:repeat(4,1fr);align-items:stretch}
.sup-agent{gap:.55rem}
.sup-os-ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(63,169,245,.1);color:var(--navy);margin-bottom:.3rem}
.sup-agent-main .sup-os-ico{background:rgba(255,255,255,.12);color:#fff}
.sup-agent-app{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.sup-agent-main .sup-agent-app{color:rgba(255,255,255,.7)}
.sup-agent h3{font-size:1.25rem}
.sup-agent-btns{display:flex;flex-direction:column;gap:.6rem;margin:.3rem 0 .2rem}
.sup-variant{display:flex;flex-direction:column;gap:.25rem}
.sup-agent .sup-variant .btn{margin-top:0;align-self:stretch;justify-content:center;font-size:.86rem;padding-left:.9rem;padding-right:.9rem;white-space:normal;text-align:center}
.sup-variant-who{font-size:.78rem;color:var(--muted-2);text-align:center}
.sup-agent-note{margin-top:auto}
.sup-which{font-size:.86rem;color:var(--muted)}
.sup-which summary{cursor:pointer;color:var(--blue);font-weight:600;list-style:none}
.sup-which summary::-webkit-details-marker{display:none}
.sup-which summary::before{content:"+ ";font-family:var(--mono)}
.sup-which[open] summary::before{content:"– "}
.sup-which p{margin:.45rem 0 0;line-height:1.5;padding:.7rem .8rem;border-radius:12px;background:rgba(63,169,245,.08);color:var(--navy)}
@media(max-width:1100px){.sup-agents{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.sup-agents{grid-template-columns:1fr}}

/* Cookie consent banner */
.gh-cookie{position:fixed;left:20px;right:96px;bottom:20px;z-index:80;max-width:760px;display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;border-radius:16px;background:#0B1F3A;color:#fff;box-shadow:0 20px 50px -18px rgba(11,31,58,.6)}
.gh-cookie[hidden]{display:none}
.gh-cookie p{margin:0;font-size:.9rem;line-height:1.5;color:rgba(255,255,255,.88)}
.gh-cookie a{color:#7dd3fc;font-weight:600}
.gh-cookie .btn{flex:0 0 auto}
@media(max-width:620px){.gh-cookie{left:12px;right:12px;bottom:12px;flex-direction:column;align-items:stretch}.gh-cookie .btn{justify-content:center}}
.sup-agent-note{margin-top:.2rem}
