/* =====================================================================
   Summit Cloud Services — custom layer on top of the Sandbox template
   Palette: Slate ink #343F52 · Sky #2563EB → Cyan #06B6D4 accent gradient
   Loaded AFTER style.css and colors/summit.css
   ===================================================================== */

:root{
  --sc-ink:#343F52;
  --sc-deep:#1F2733;
  --sc-sky:#2563EB;
  --sc-cyan:#06B6D4;
  --sc-grad:linear-gradient(100deg,#2563EB,#06B6D4);
  --sc-grad-soft:linear-gradient(100deg,rgba(37,99,235,.14),rgba(6,182,212,.14));
}

/* ---------- Accent utilities ---------- */
.text-gradient{
  background:var(--sc-grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.bg-slate{background-color:var(--sc-ink)!important}
.bg-deep{background-color:var(--sc-deep)!important}

.btn-gradient-sky{
  background:var(--sc-grad);color:#fff!important;border:0;
  box-shadow:0 10px 30px -10px rgba(37,99,235,.55);
  transition:transform .15s ease,box-shadow .2s ease,filter .2s ease;
}
.btn-gradient-sky:hover{
  color:#fff!important;transform:translateY(-2px);
  box-shadow:0 16px 40px -10px rgba(6,182,212,.6);filter:saturate(1.08);
}
.btn-gradient-sky:focus-visible{outline:3px solid rgba(6,182,212,.5);outline-offset:2px}

/* soft accent chip behind icons */
.sc-iconbox{
  width:56px;height:56px;border-radius:15px;display:inline-flex;
  align-items:center;justify-content:center;background:var(--sc-grad-soft);
}
.sc-iconbox i{background:var(--sc-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ---------- Logo colour handling ---------- */
/* One logo file rendered white over the dark hero navbar; natural (dark) on
   the fixed white clone and on inner light navbars. */
.summit-hero-wrap .navbar:not(.navbar-clone) .navbar-brand img{filter:brightness(0) invert(1)}
.to-white{filter:brightness(0) invert(1)}

/* ---------- Navbar over dark hero ---------- */
.summit-hero-wrap{position:relative}
.summit-hero-wrap .navbar:not(.navbar-clone){
  position:absolute;top:0;left:0;right:0;z-index:15;background:transparent;
}
@media(min-width:992px){
  .summit-hero-wrap .navbar:not(.navbar-clone) .nav-link{color:rgba(255,255,255,.86)}
  .summit-hero-wrap .navbar:not(.navbar-clone) .nav-link:hover,
  .summit-hero-wrap .navbar:not(.navbar-clone) .nav-link.active{color:#fff}
}
.summit-hero-wrap .navbar:not(.navbar-clone) .hamburger span,
.summit-hero-wrap .navbar:not(.navbar-clone) .hamburger span:before,
.summit-hero-wrap .navbar:not(.navbar-clone) .hamburger span:after{background:#fff}

/* ---------- HERO alpine scene ---------- */
.summit-hero{
  position:relative;overflow:hidden;background:#0E141B;color:#EAF1F8;
  padding:170px 0 150px;
}
@media(max-width:768px){.summit-hero{padding:130px 0 100px}}
.summit-scene{position:absolute;inset:0;z-index:1;pointer-events:none}
.summit-scene .glow{
  position:absolute;inset:0;
  background:
    radial-gradient(60% 55% at 80% 6%,rgba(6,182,212,.30),transparent 60%),
    radial-gradient(52% 52% at 18% 0%,rgba(37,99,235,.34),transparent 62%),
    linear-gradient(180deg,#0E141B,#0E141B);
}
.summit-scene .ridge{position:absolute;left:0;right:0;bottom:0;width:100%}
.summit-scene .contour{position:absolute;inset:0;opacity:.5;z-index:2;mix-blend-mode:screen}
.summit-hero .container{position:relative;z-index:5}
.summit-hero h1{font-weight:800;letter-spacing:-.02em;line-height:1.05}
.summit-hero .lead{color:#B9C6D3}
.sc-star{position:absolute;width:2px;height:2px;border-radius:50%;background:#cfe9f5;opacity:.5}

@keyframes sc-drift{from{transform:translateX(0)}to{transform:translateX(-38px)}}
@keyframes sc-tw{from{opacity:.18}to{opacity:.8}}
@media(prefers-reduced-motion:no-preference){
  .sc-c-slow{animation:sc-drift 26s ease-in-out infinite alternate}
  .sc-c-fast{animation:sc-drift 17s ease-in-out infinite alternate-reverse}
  .sc-star{animation:sc-tw 3.6s ease-in-out infinite alternate}
}

/* ---------- Solid top navbar (inner pages) ---------- */
.sc-topnav{background:#fff;box-shadow:0 1px 0 rgba(31,39,51,.07)}

/* ---------- Sticky cloned navbar (shown on scroll, every page) ----------
   The template doesn't give a transparent clone a background, so force a
   solid white bar with dark logo + links whenever the clone is present. */
.navbar-clone{background:#fff;box-shadow:0 6px 28px -16px rgba(31,39,51,.28)}
.navbar-clone .navbar-brand img{filter:none}
.navbar.navbar-clone .navbar-nav .nav-link{color:var(--sc-ink)!important}
.navbar.navbar-clone .navbar-nav .nav-link:hover,
.navbar.navbar-clone .navbar-nav .nav-link.active{color:var(--sc-sky)!important}
.navbar-clone .hamburger span,
.navbar-clone .hamburger span:before,
.navbar-clone .hamburger span:after{background:var(--sc-ink)}

/* ---------- Inner-page header band ---------- */
.sc-pageband{
  position:relative;overflow:hidden;background:var(--sc-deep);color:#EAF1F8;
  padding:130px 0 66px;
}
.sc-pageband:after{ /* subtle topo accent line */
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--sc-grad);
}
.sc-pageband h1{font-weight:800;letter-spacing:-.02em;color:#fff}
.sc-pageband .breadcrumb a{color:#9fb0c0}
.sc-pageband .breadcrumb a:hover{color:#fff}
.sc-pageband .glow{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(50% 120% at 85% 0%,rgba(6,182,212,.22),transparent 60%),
            radial-gradient(40% 120% at 10% 0%,rgba(37,99,235,.22),transparent 60%);
}
.sc-pageband .container{position:relative;z-index:2}

/* ---------- Feature cards ---------- */
.sc-card{
  background:#fff;border:1px solid #e7ebf1;border-radius:20px;padding:34px 30px;height:100%;
  transition:transform .18s ease,box-shadow .22s ease,border-color .2s ease;
}
.sc-card:hover{transform:translateY(-5px);box-shadow:0 22px 48px -26px rgba(37,99,235,.45);border-color:#cfe0fb}

/* stat counters */
.sc-stat{font-weight:800;letter-spacing:-.02em;line-height:1;
  background:var(--sc-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ---------- Contact form ---------- */
.sc-form .form-control{
  border-radius:12px;border:1.5px solid #e2e7ee;padding:.85rem 1rem;background:#fff;
}
.sc-form .form-control:focus{border-color:var(--sc-sky);box-shadow:0 0 0 .2rem rgba(37,99,235,.14)}
.sc-form label{font-weight:600;font-size:.9rem;margin-bottom:.35rem;color:var(--sc-ink)}
.sc-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
#sc-form-status{display:none}
#sc-form-status.show{display:block}

/* ---------- Footer ---------- */
.sc-footer{background:var(--sc-deep);color:#aeb9c6}
.sc-footer a{color:#cbd4de}
.sc-footer a:hover{color:#fff}
.sc-footer h4{color:#fff}
.sc-footer .sc-divider{border-color:rgba(255,255,255,.1)}

/* ---------- Legal / prose pages ---------- */
.sc-prose{max-width:760px}
.sc-prose h2{font-weight:800;letter-spacing:-.01em;margin:2.2rem 0 .8rem;font-size:1.4rem;color:var(--sc-ink)}
.sc-prose h3{font-weight:700;margin:1.4rem 0 .5rem;font-size:1.08rem;color:var(--sc-ink)}
.sc-prose p,.sc-prose li{color:#5c6672;line-height:1.75}
.sc-prose ul{padding-left:1.2rem}
.sc-prose li{margin-bottom:.4rem}
.sc-prose .sc-updated{color:#8a94a1;font-size:.9rem}

/* small helpers */
.sc-chip{display:inline-block;padding:.35rem .8rem;border-radius:999px;font-size:.8rem;font-weight:600;
  background:var(--sc-grad-soft);color:var(--sc-sky)}
.sc-tech{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .85rem;border:1px solid #e3e8ef;
  border-radius:10px;font-size:.85rem;font-weight:600;color:var(--sc-ink);background:#fff}