
:root{
  --bg:#0b0f14;
  --soft:#f6f8fb;
  --ink:#0f172a;
  --muted:#6b7280;
  --grad1:#1a9fff;
  --grad2:#00d4ff;
  --radius-xl:1.5rem;
}

*{box-sizing:border-box}
html,body{height:100%}
body.theme-smooth{
  font-family: ui-sans-serif, system-ui, -apple-system, "SF Pro Text", "Segoe UI", Roboto, Arial;
  background:#fff;
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.container-xxl{max-width:1280px}

.tracking-tight{letter-spacing:-0.015em}

/* Glass navbar */
.glass-nav{
  backdrop-filter:saturate(180%) blur(10px);
  background:rgba(255,255,255,0.7);
  border-bottom:1px solid rgba(15,23,42,0.06);
}
.brand-badge{
  display:inline-block;width:20px;height:20px;border-radius:6px;
  background:linear-gradient(135deg,var(--grad1),var(--grad2));
  vertical-align:middle;
}

/* Buttons */
.btn-gradient{
  background:linear-gradient(90deg,var(--grad1),var(--grad2));
  color:#00131f;border:none;border-radius:999px;padding:.75rem 1.25rem;font-weight:700;
}
.btn-gradient:hover{filter:brightness(0.95);color:#00131f}
.link-arrow{font-weight:600;text-decoration:none}
.link-arrow:hover{text-decoration:underline}

/* Sections */
.section{padding:80px 0}
.bg-soft{background:var(--soft)}
.section-title{font-weight:800;letter-spacing:-.02em}
.bg-gradient-bottom{
  background:linear-gradient(180deg, rgba(255,255,255,0) 0%, #eef6ff 100%);
}

/* Hero */
.hero{isolation:isolate}
.hero-bg{
  position:absolute;inset:0;width:100%;height:120%;object-fit:cover;transform:translateY(-6%);filter:saturate(110%) contrast(105%);
}
.hero-overlay{
  position:absolute;inset:0;
  background:radial-gradient(1200px 600px at 20% 20%, rgba(0,0,0,0.5), transparent 60%),
             linear-gradient(180deg, rgba(0,0,0,.6) 0%, rgba(0,0,0,.4) 40%, rgba(0,0,0,.2) 100%);
}
.hero .gradient-text{background:linear-gradient(90deg,#ffffff,#e9f1f1,#dce1e7);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Tiles & cards */
.card-fx{border-radius:var(--radius-xl);border:1px solid rgba(15,23,42,0.08);box-shadow:0 10px 30px rgba(2,6,23,0.05);transition:transform .35s ease, box-shadow .35s ease}
.card-fx:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(2,6,23,0.08)}
.tile{position:relative;overflow:hidden;border-radius:var(--radius-xl)}
.tile img{width:100%;height:320px;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.tile:hover img{transform:scale(1.06)}
.tile-caption{position:absolute;left:0;right:0;bottom:0;padding:1rem 1.25rem;color:#fff;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.65));}
.tile-pop{transition:transform .35s ease, box-shadow .35s ease}
.tile-pop:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(2,6,23,.15)}

/* Quotes */
.quote{border:1px solid rgba(15,23,42,0.08);border-radius:var(--radius-xl);background:#fff;box-shadow:0 10px 30px rgba(2,6,23,0.05)}

/* Accordion clean */
.accordion-clean .accordion-item{border:1px solid rgba(15,23,42,.08);border-radius:var(--radius-xl);overflow:hidden;margin-bottom:10px}
.accordion-clean .accordion-button{padding:1.25rem 1.25rem;font-weight:600}
.accordion-clean .accordion-button:not(.collapsed){background:#f8fbff}

/* Parallax effect */
.scrolling .hero-bg{transform:translateY(calc(-6% + var(--scroll,0px)))}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s ease, transform .8s ease}
.reveal.is-visible{opacity:1;transform:none}

/* === Brand Overrides === */

:root{
  --brand:#286ea9;
  --soft:#e9f1f1; /* from palette */
  --soft-2:#e2e9ec;
  --soft-3:#dce1e7;
  --bg:#f0f9f6;
  --ink:#0e2433;
  --muted:#5b6b7a;
  --grad1:#286ea9;
  --grad2:#3a8fcf;
  --radius-xl:1.5rem;
}
/* Override key components with brand */
.btn-gradient{background:linear-gradient(90deg,var(--grad1),var(--grad2));color:#fff}
.btn-gradient:hover{filter:brightness(1.05);color:#fff}
.glass-nav{background:rgba(255,255,255,0.75);border-bottom:1px solid rgba(40,110,169,0.12)}
.link-arrow{color:var(--brand)}
.link-arrow:hover{text-decoration:underline}
.accordion-clean .accordion-button:not(.collapsed){background:var(--soft)}
.card-fx{border:1px solid rgba(40,110,169,0.18)}
.tile-caption{background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.55))}
footer.section{background:linear-gradient(180deg, rgba(40,110,169,0.04) 0%, rgba(40,110,169,0.12) 100%)}
.brand-logo{filter: drop-shadow(0 2px 8px rgba(40,110,169,.35));}
