/* =========================================
   Inter – Self Hosted (WOFF2 Only)
   Location: /assets/fonts/inter/
   ========================================= */

/* 400 Regular */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* 500 Medium */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* 600 SemiBold */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* 700 Bold */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* 400 Italic */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* 700 Bold Italic */
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-BoldItalic.woff2") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
:root{
  --rbt2-blue-900:#27283C;
  --rbt2-blue-600:#27283C;
  --rbt2-amber:#EC8A2C;
  --rbt2-ink:#27283C;
  --rbt2-muted:#4b5563;
  --rbt2-bg:#F8F9FA;
  --rbt2-border:#E7EAEE;
  --rbt2-radius:14px;
  --rbt2-max:1100px;
  --rbt2-font: 'Inter', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:var(--rbt2-font);color:var(--rbt2-ink);background:var(--rbt2-bg);line-height:1.6}

/* --- Abstract curved background accents (Services + Products pages) --- */
body.abstract-curves{position:relative}
body.abstract-curves::before,
body.abstract-curves::after{
  content:"";
  position:fixed;
  width:720px;
  height:720px;
  border-radius:999px;
  filter:blur(24px);
  pointer-events:none;
  z-index:-1;
}
/* top-right warm + cool curve */
body.abstract-curves::before{
  top:-260px;
  right:-300px;
  transform:rotate(18deg);
  background:
    radial-gradient(circle at 28% 30%, rgba(236,138,44,.22), rgba(236,138,44,0) 62%),
    radial-gradient(circle at 72% 68%, rgba(39,40,60,.18), rgba(39,40,60,0) 66%);
}
/* bottom-left cool wash */
body.abstract-curves::after{
  bottom:-320px;
  left:-340px;
  transform:rotate(-12deg);
  background:
    radial-gradient(circle at 35% 35%, rgba(39,40,60,.16), rgba(39,40,60,0) 64%),
    radial-gradient(circle at 78% 70%, rgba(236,138,44,.14), rgba(236,138,44,0) 66%);
}

/* Add subtle curves inside dark hero without changing the palette */
body.abstract-curves .hero{position:relative; overflow:hidden}
body.abstract-curves .hero::before,
body.abstract-curves .hero::after{
  content:"";
  position:absolute;
  border-radius:999px;
  pointer-events:none;
}
body.abstract-curves .hero::before{
  filter:blur(10px);
  width:980px;
  height:520px;
  right:-360px;
  top:-220px;
  transform:rotate(-10deg);
  opacity:.9;
  background:radial-gradient(closest-side at 30% 40%, rgba(236,138,44,.30), rgba(236,138,44,0) 70%);
}
body.abstract-curves .hero::after{
  filter:blur(10px);
  width:860px;
  height:520px;
  left:-340px;
  bottom:-260px;
  transform:rotate(14deg);
  opacity:.55;
  background:radial-gradient(closest-side at 55% 50%, rgba(255,255,255,.18), rgba(255,255,255,0) 70%);
}

a{color:var(--rbt2-blue-900);text-decoration:none;font-weight:650}
a:hover{text-decoration:underline}
.container{max-width:var(--rbt2-max);margin:0 auto;padding:0 20px}
.narrow{max-width:900px;margin:0 auto;padding:0 20px}
.section{padding:72px 0}
.bg{background:var(--rbt2-bg)}
.hero{
  background:linear-gradient(135deg,var(--rbt2-blue-900) 0%,var(--rbt2-blue-600) 100%);
  color:#fff;
  padding:56px 0 46px;
}

/* --- Home hero (light, image + dimensional color) --- */
.home-hero{
  position:relative;
  overflow:hidden;
  /* slightly richer + more dimensional than the previous light gradient */
  background:linear-gradient(135deg, rgba(39,40,60,.10) 0%, #ffffff 48%, rgba(236,138,44,.10) 100%);
  color:var(--rbt2-ink);
  padding:72px 0;
}
.home-hero::before,
.home-hero::after{
  content:"";
  position:absolute;
  inset:auto;
  border-radius:999px;
  filter:blur(26px);
  opacity:.75;
  pointer-events:none;
}
/* Warm accent glow */
.home-hero::before{
  width:520px;height:520px;
  left:-180px;top:-220px;
  background:radial-gradient(circle at 30% 30%, rgba(236,138,44,.72), rgba(236,138,44,0) 62%);
}
/* Cool shadow glow */
.home-hero::after{
  width:600px;height:600px;
  right:-240px;bottom:-260px;
  background:radial-gradient(circle at 60% 60%, rgba(39,40,60,.48), rgba(39,40,60,0) 64%);
}

.home-hero-copy{
  margin-left:-10px;
}

.home-hero-inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:44px;
  align-items:center;
}
.home-hero h1{
  color:var(--rbt2-blue-900);
  margin:0 0 12px;
  font-size:clamp(2.45rem,3.35vw,3.35rem);
  line-height:1.08;
  letter-spacing:-.02em;
}
.home-hero-sub{
  margin:0 0 20px;
  font-size:1.24rem;
  max-width:56ch;
  color:rgba(39,40,60,.9);
}
.home-hero .btns{margin-top:6px}
.home-hero-media{
  position:relative;
}
.home-hero-media::before{
  content:"";
  position:absolute;
  inset:-14px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(236,138,44,.28), rgba(39,40,60,.18));
  transform:rotate(-1.2deg);
  z-index:0;
}
.home-hero-media img{
  position:relative;
  display:block;
  width:100%;
  border-radius:20px;
  border:1px solid rgba(39,40,60,.12);
  box-shadow:0 20px 60px rgba(39,40,60,.18);
  z-index:1;
}

@media(max-width:900px){
  .home-hero{padding:54px 0}
  .home-hero-inner{grid-template-columns:1fr;gap:22px}
  .home-hero-copy{margin-left:0}
  .home-hero-media{order:-1}
}
.kicker{display:inline-block;font-weight:800;letter-spacing:.02em;text-transform:uppercase;font-size:.85rem;opacity:.92;margin:0 0 10px}
.hero h1{margin:0 0 12px;font-size:clamp(2rem,2.8vw,2.6rem);line-height:1.15}
.hero p{margin:0 0 18px;font-size:1.12rem;max-width:880px;opacity:.96}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px}
.btn{
  display:inline-block;
  padding:12px 22px;
  border-radius:10px;
  border:2px solid transparent;
  font-weight:750;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.btn.primary{background:var(--rbt2-amber);color:#fff;border-color:var(--rbt2-amber)}
.btn.primary:hover{background:#d97706;border-color:#d97706;transform:translateY(-1px);box-shadow:0 10px 22px rgba(245,158,11,.25);text-decoration:none}
.btn.outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.9)}
.btn.outline:hover{background:#fff;color:var(--rbt2-blue-900);text-decoration:none}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{
  background:#fff;
  border:1px solid var(--rbt2-border);
  border-radius:var(--rbt2-radius);
  padding:22px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.card h3{margin:0 0 8px;color:var(--rbt2-blue-900);font-size:1.18rem}
.card p{margin:0;color:var(--rbt2-muted)}
.col-4{grid-column:span 4}
.col-6{grid-column:span 6}
.col-12{grid-column:span 12}
.list{margin:12px 0 0 18px;color:var(--rbt2-muted)}
.list li{margin:8px 0}
.callout{
  border-left:4px solid var(--rbt2-blue-600);
  background:#fff;
  border-radius:12px;
  padding:18px;
  color:var(--rbt2-blue-900);
  font-weight:650;
}
.site-header{
  background:#fff;
  border-bottom:1px solid var(--rbt2-border);
  position:sticky;top:0;z-index:10;
}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0}
.brand{font-weight:900;font-size:1.24rem;letter-spacing:.01em}
.nav{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.nav a{font-weight:750;color:var(--rbt2-blue-900)}
.footer{
  background:var(--rbt2-blue-900);color:#e5e7eb;padding:34px 0;margin-top:60px
}
.footer a{color:#e5e7eb;font-weight:650}
.footer a:hover{color:var(--rbt2-amber);text-decoration:none}
.footer-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.footer .col{grid-column:span 4}
.small{font-size:.92rem;opacity:.9}
hr.sep{border:0;border-top:1px solid rgba(255,255,255,.12);margin:18px 0}
.form{
  background:#fff;border:1px solid var(--rbt2-border);border-radius:var(--rbt2-radius);
  padding:22px;box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.form label{display:block;font-weight:750;margin:12px 0 6px;color:var(--rbt2-blue-900)}
.form input,.form textarea{
  width:100%;border:1px solid var(--rbt2-border);border-radius:10px;padding:12px;font-size:1rem
}
.form textarea{min-height:140px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
@media(max-width:900px){
  .col-4,.col-6{grid-column:span 12}
  .form-row{grid-template-columns:1fr}
  .nav{gap:10px}
}

/* Logo */
.brand.logo{display:flex;align-items:center;gap:10px}
.brand.logo img{height:34px;width:auto;display:block}
@media(max-width:900px){.brand.logo img{height:30px}}


/* --- Updated nav (FusionTek-inspired) --- */
.site-header{
  backdrop-filter:saturate(180%) blur(8px);
  background:rgba(248,249,250,.9);
}
.header-inner{position:relative}
.brand{
  display:flex;align-items:center;gap:10px;
  font-weight:900;font-size:1.24rem;letter-spacing:.01em;
}
.brand img{height:30px;width:30px;display:block;flex:0 0 auto}
.brand-name{color:var(--rbt2-blue-900)}
.nav-toggle{display:none}
.nav-toggle-btn{display:none;cursor:pointer;user-select:none}
.nav-toggle-btn span{display:block;height:2px;width:22px;background:var(--rbt2-blue-900);margin:5px 0;border-radius:2px}

.nav{display:flex;gap:14px;align-items:center}
.nav a, .nav summary{
  color:var(--rbt2-blue-900);
  font-weight:800;
  text-decoration:none;
  border-radius:10px;
  padding:10px 10px;
  line-height:1;
}
.nav a:hover, .nav summary:hover{background:rgba(39,40,60,.06);text-decoration:none}
.nav details{position:relative}
.nav summary{list-style:none;cursor:pointer}
.nav summary::-webkit-details-marker{display:none}

.dropdown-menu{
  position:absolute;left:0;top:calc(100% + 10px);
  min-width:260px;
  background:#fff;border:1px solid var(--rbt2-border);
  border-radius:14px;
  box-shadow:0 16px 46px rgba(39,40,60,.12);
  padding:10px;
  display:none;
}
details[open] > .dropdown-menu{display:block}
.dropdown-menu a{
  display:block;
  padding:10px 12px;
  border-radius:12px;
  font-weight:750;
}
.dropdown-menu a:hover{background:rgba(231,234,238,.8)}
.dropdown-group{padding:6px 6px 10px 6px;border-radius:12px;background:rgba(248,249,250,.7);margin:6px 0}
.dropdown-title{font-weight:900;color:var(--rbt2-blue-900);padding:6px 6px 2px 6px}
.dropdown-title a{padding:6px 6px 2px 6px;font-weight:900}
.dropdown-menu a.sub{padding-left:20px;font-weight:700;color:var(--rbt2-muted)}

.header-cta{margin-left:8px;white-space:nowrap}

/* Desktop hover support */
@media (min-width: 901px){
  .nav details:hover > .dropdown-menu{display:block}
  .nav details:hover > summary{background:rgba(39,40,60,.06)}
}

/* Mobile */
@media(max-width:900px){
  .nav-toggle{display:block;position:absolute;right:0;top:18px;opacity:0;width:40px;height:40px;z-index:12}
  .nav-toggle-btn{display:block;position:absolute;right:0;top:18px;padding:10px;border-radius:12px;border:1px solid var(--rbt2-border);background:#fff;z-index:11}
  .header-cta{display:none}
  .nav{
    position:absolute;left:0;right:0;top:64px;
    background:#fff;border:1px solid var(--rbt2-border);
    border-radius:14px;
    box-shadow:0 18px 52px rgba(39,40,60,.14);
    padding:10px;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
  }
  .nav-toggle:checked ~ .nav{display:flex}
  .nav details{width:100%}
  .dropdown-menu{
    position:static;top:auto;left:auto;min-width:auto;
    border:none;box-shadow:none;padding:0 0 6px 0;display:block;background:transparent
  }
  details[open] > .dropdown-menu{display:block}
  .dropdown-menu a{padding:10px 12px}
  .nav a, .nav summary{padding:12px 12px}
}

/* --- Top ribbon (FusionTek-inspired) --- */
.top-ribbon{
  background:rgba(39,40,60,.92);
  color:#fff;
  font-weight:700;
  font-size:.92rem;
}
.top-ribbon .container{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
  padding:8px 20px;
}
.top-ribbon .ribbon-label{opacity:.95}
.top-ribbon .ribbon-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#fff;
  text-decoration:none;
  opacity:.95;
  font-weight:750;
}
.top-ribbon .ribbon-link:hover{opacity:1;text-decoration:underline}
.top-ribbon .ribbon-sep{opacity:.55}
.top-ribbon .ribbon-icon{width:16px;height:16px;display:inline-block}
@media(max-width:700px){
  .top-ribbon .container{justify-content:center;flex-wrap:wrap}
}

/* --- Home: Why RebootTwice sections --- */
.section-head{max-width:780px;margin:0 auto 24px;text-align:center}
.kicker{
  display:inline-block;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:.78rem;
  color:rgba(39,40,60,.75);
  margin-bottom:10px;
}
.section-head h2{margin:6px 0 8px;font-size:clamp(1.65rem,2.4vw,2.2rem);line-height:1.15;color:var(--rbt2-blue-900)}
.section-head p{margin:0;color:var(--rbt2-muted);font-size:1.05rem}

.why-rt{
  background:linear-gradient(180deg, #ffffff 0%, rgba(236,138,44,.05) 40%, rgba(231,234,238,.60) 100%);
}
.why-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:16px;
  margin-top:18px;
}
.why-card{
  grid-column:span 4;
  background:#fff;
  border:1px solid var(--rbt2-border);
  border-radius:18px;
  padding:18px;
  box-shadow:0 10px 30px rgba(39,40,60,.06);
  position:relative;
  overflow:hidden;
}
.why-card::before{
  content:"";
  position:absolute;
  top:-40px;right:-40px;
  width:140px;height:140px;border-radius:999px;
  background:radial-gradient(circle at 30% 30%, rgba(236,138,44,.25), rgba(236,138,44,0) 65%);
}
.why-card h3{margin:0 0 8px;font-size:1.24rem;color:var(--rbt2-blue-900)}
.why-card p{margin:0;color:var(--rbt2-muted)}
.why-quote{
  margin:20px auto 0;
  max-width:820px;
  background:rgba(39,40,60,.92);
  color:#fff;
  border-radius:18px;
  padding:16px 18px;
  box-shadow:0 14px 44px rgba(39,40,60,.16);
}
.why-quote p{margin:0}

.why-rt-alt{
  background:linear-gradient(135deg, rgba(39,40,60,.06) 0%, #ffffff 55%, rgba(236,138,44,.06) 100%);
}

/* --- Home: subtle section dividers for clearer separation --- */
.why-rt,
.why-rt-alt{
  position:relative;
}
.why-rt::before,
.why-rt-alt::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:2px;
  background:linear-gradient(90deg, rgba(236,138,44,.55), rgba(39,40,60,.40), rgba(236,138,44,.35));
  opacity:.85;
}
.two-col{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:22px;
  align-items:start;
}
.checklist{
  margin:0;
  padding:0;
  list-style:none;
}
.checklist li{
  position:relative;
  padding-left:28px;
  margin:12px 0;
  color:var(--rbt2-muted);
  font-weight:650;
}
.checklist li::before{
  content:"";
  position:absolute;
  left:0;top:.35em;
  width:18px;height:18px;border-radius:999px;
  background:rgba(236,138,44,.22);
  border:2px solid rgba(236,138,44,.75);
}
@media(max-width:900px){
  .why-card{grid-column:span 12}
  .two-col{grid-template-columns:1fr}
  .section-head{text-align:left}
}


/* Header spacing refinement (FusionTek-style) */
.site-header {
  padding: 14px 0;
}

.header-inner {
  display: flex;
  align-items: center;
  gap: 32px;
}

.site-logo img,
.site-logo-img {
  height: 48px;
  width: auto;
  display: block;
}

.nav {
  margin-left: auto;
}



/* --- Service/Product pages: split hero + image placeholders --- */
.hero-split{
  display:grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 44px;
  align-items:center;
}
.hero-copy .kicker{opacity:.9}
.hero-media-slot{display:flex; justify-content:flex-end;}
.media-slot{
  width:100%;
  max-width:420px;
  aspect-ratio: 4 / 3;
  border-radius: calc(var(--rbt2-radius) + 6px);
  background:
    radial-gradient(900px 500px at 20% 20%, rgba(255,255,255,.18), rgba(255,255,255,0) 60%),
    linear-gradient(135deg, rgba(236,138,44,.22), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 18px 45px rgba(0,0,0,.22);
  position:relative;
  overflow:hidden;
}
.media-overlay{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  letter-spacing:.02em;
  color: rgba(255,255,255,.88);
  text-transform: uppercase;
  font-size:.85rem;
}

/* Card media (Services/Products overview) */
.card-media{
  width:100%;
  aspect-ratio: 16 / 10;
  border-radius: calc(var(--rbt2-radius) + 2px);
  margin-bottom: 12px;
  background:
    radial-gradient(900px 500px at 15% 25%, rgba(39,40,60,.12), rgba(39,40,60,0) 60%),
    linear-gradient(135deg, rgba(39,40,60,.06), rgba(236,138,44,.10));
  border: 1px solid var(--rbt2-border);
  position:relative;
  overflow:hidden;
}
.card-media .media-overlay{
  color: rgba(39,40,60,.72);
  font-size:.75rem;
}

/* CTA band */
.cta-band{padding-top:54px;padding-bottom:54px}
.cta-card{
  display:flex;
  gap: 18px;
  align-items:center;
  justify-content:space-between;
  padding: 22px 22px;
  border-radius: calc(var(--rbt2-radius) + 6px);
  border: 1px solid var(--rbt2-border);
  background:
    radial-gradient(900px 500px at 12% 20%, rgba(236,138,44,.14), rgba(236,138,44,0) 55%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.86));
  box-shadow: 0 18px 50px rgba(17,24,39,.08);
}
.cta-card h2{margin:0 0 6px 0}
.cta-card p{margin:0;color:var(--rbt2-muted)}
.cta-actions{flex:0 0 auto}

/* Responsive */
@media (max-width: 920px){
  .hero-split{grid-template-columns: 1fr; gap: 22px}
  .hero-media-slot{justify-content:flex-start}
  .media-slot{max-width: 520px}
  .cta-card{flex-direction:column; align-items:flex-start}
}



/* --- Topographic contour texture (Services + Products pages) --- */
body.topo-map{
  background-image:
    url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%221200%22%20height=%22800%22%20viewBox=%220%200%201200%20800%22%3E%20%20%3Cg%20fill=%22none%22%20stroke=%22rgb(39,40,60)%22%20stroke-opacity=%220.18%22%20stroke-width=%221.2%22%3E%20%20%20%20%3Cpath%20d=%22M80,220%20C220,120%20420,120%20560,210%20C700,300%20860,300%201020,210%20C1120,150%201180,140%201240,170%22/%3E%20%20%20%20%3Cpath%20d=%22M40,300%20C220,200%20420,210%20560,300%20C700,390%20880,390%201040,290%20C1120,230%201180,220%201240,250%22/%3E%20%20%20%20%3Cpath%20d=%22M70,390%20C230,300%20430,310%20560,395%20C690,480%20880,490%201060,395%20C1140,350%201180,340%201240,370%22/%3E%20%20%20%20%3Cpath%20d=%22M140,520%20C280,450%20420,460%20560,540%20C700,620%20900,620%201080,520%20C1160,470%201200,460%201240,485%22/%3E%20%20%20%20%3Cpath%20d=%22M190,640%20C310,590%20430,600%20560,670%20C690,740%20900,740%201100,640%20C1160,590%201200,580%201240,605%22/%3E%20%20%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%22900%22%20height=%22600%22%20viewBox=%220%200%20900%20600%22%3E%20%20%3Cg%20fill=%22none%22%20stroke=%22rgb(236,138,44)%22%20stroke-opacity=%220.12%22%20stroke-width=%221.1%22%3E%20%20%20%20%3Cpath%20d=%22M-40,160%20C120,70%20260,80%20420,170%20C580,260%20720,250%20940,120%22/%3E%20%20%20%20%3Cpath%20d=%22M-30,240%20C140,140%20300,150%20440,245%20C580,340%20740,335%20960,210%22/%3E%20%20%20%20%3Cpath%20d=%22M-20,330%20C150,250%20320,260%20460,345%20C600,430%20770,430%20980,315%22/%3E%20%20%20%20%3Cpath%20d=%22M-10,430%20C160,360%20340,370%20480,450%20C620,530%20780,535%201000,425%22/%3E%20%20%3C/g%3E%3C/svg%3E");
  background-repeat: repeat;
  background-size: 1200px 1100px, 900px 850px;
  background-attachment: fixed;
  background-position: 50% 20%, 60% 40%;
}

/* Media slot real image support */
.media-slot .media-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.media-slot .media-img-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 500px at 20% 20%, rgba(255,255,255,.14), rgba(255,255,255,0) 60%),
    linear-gradient(135deg, rgba(39,40,60,.18), rgba(39,40,60,0) 55%);
  pointer-events:none;
}


/* ============================
   Inset + rounded hero sections (all pages except home)
   ============================ */
body:not(.home) .hero,
body:not(.home) .page-hero,
body:not(.home) .top-section{
  width: min(1240px, calc(100% - 32px));
  margin: 18px auto 0;
  border-radius: 28px;
  overflow: hidden;
}

/* Keep any hero background from clipping awkwardly on very small screens */
@media (max-width: 520px){
  body:not(.home) .hero,
  body:not(.home) .page-hero,
  body:not(.home) .top-section{
    width: calc(100% - 20px);
    margin-top: 14px;
    border-radius: 22px;
  }
}
}


/* ============================
   Above-the-fold tuning (all pages except home)
   Goal: hero + "Ready to move forward" fit within one viewport without scroll
   ============================ */
body:not(.home) .hero{
  padding: 44px 0 28px;
}
body:not(.home) .hero-split{
  gap: 40px;
}
body:not(.home) .hero-copy h1{
  margin-bottom: 10px;
}
body:not(.home) .hero-copy p{
  margin-top: 6px;
}
body:not(.home) .hero-media-slot .media-slot{
  min-height: 240px;
  max-height: 360px;
}
body:not(.home) .hero-media-slot .media-slot .media-img{
  max-height: 360px;
}
body:not(.home) .cta-band{
  padding-top: 26px;
  padding-bottom: 38px;
}
body:not(.home) .cta-card{
  padding: 18px 20px;
}


/* --- Override: Top info ribbon color --- */
.top-ribbon{
  background:#EC8A2C;
  color:#27283C;
  font-weight:600;
}
.top-ribbon .ribbon-label{color:#27283C; opacity:.95}
.top-ribbon a{color:#27283C; text-decoration:none}
.top-ribbon a:hover{text-decoration:underline}

/* --- Abstract wavy motif (CrowdStrike-inspired, using RebootTwice palette) --- */
.home-hero{
  background-color:#F8F9FA;
}
.home-hero::marker{content:""}
.home-hero .home-hero-media::after{
  content:"";
  position:absolute;
  inset:-18px;
  border-radius:24px;
  background-image:url("../img/hero-waves.svg");
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center;
  opacity:.95;
  z-index:0;
  filter:saturate(1.05);
}
.home-hero .home-hero-media img{
  opacity:0; /* use svg as decorative background in media card */
}

/* Apply a subtle abstract texture across pages for cohesion */
body.abstract{
  background-color:#F8F9FA;
  background-image:
    radial-gradient(circle at 15% 10%, rgba(236,138,44,.10), rgba(236,138,44,0) 55%),
    radial-gradient(circle at 85% 20%, rgba(39,40,60,.10), rgba(39,40,60,0) 60%);
  background-attachment:fixed;
}
.section-head .kicker,
.kicker{
  color:#EC8A2C;
}

/* --- Override: Dark full-width hero (CrowdStrike-inspired) --- */
.home-hero{
  background:#27283C !important;
  color:#F8F9FA !important;
}
.home-hero h1{
  color:#F8F9FA !important;
}
.home-hero-sub{
  color:rgba(248,249,250,.88) !important;
}
/* Make hero layout feel wider + more immersive */
.home-hero-inner{
  grid-template-columns: 1fr 1fr !important;
  gap:56px !important;
}
/* Turn the right side into a full-height visual panel */
.home-hero-media{
  position:relative !important;
  min-height:420px;
}
.home-hero-media::before{
  /* remove the old rotated card frame in dark mode */
  content:none !important;
}
.home-hero-media img{
  opacity:1 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:24px !important;
  border:1px solid rgba(231,234,238,.14) !important;
  box-shadow:0 30px 90px rgba(0,0,0,.45) !important;
}
/* Add subtle orange + slate glows like the reference */
.home-hero::before{
  content:"" !important;
  position:absolute;
  width:720px;height:720px;
  left:-260px;top:-360px;
  background:radial-gradient(circle at 30% 30%, rgba(236,138,44,.52), rgba(236,138,44,0) 62%);
  filter:blur(28px);
  opacity:.9;
  pointer-events:none;
}
.home-hero::after{
  content:"" !important;
  position:absolute;
  width:820px;height:820px;
  right:-320px;bottom:-420px;
  background:radial-gradient(circle at 60% 60%, rgba(231,234,238,.18), rgba(39,40,60,0) 64%);
  filter:blur(30px);
  opacity:.85;
  pointer-events:none;
}
/* Ensure section doesn't look boxed in */
.home-hero .container{
  position:relative;
  z-index:1;
}
@media(max-width:900px){
  .home-hero-inner{
    grid-template-columns: 1fr !important;
    gap:28px !important;
  }
  .home-hero-media{min-height:320px}
}

/* --- Fix: Make abstract hero extend across entire hero (full-bleed) --- */
.home-hero{
  position:relative !important;
  background:#27283C !important;
  overflow:hidden !important;
}
/* Full-bleed abstract background layer */
.home-hero::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background-image:url("../img/hero-abstract-dark.svg") !important;
  background-repeat:no-repeat !important;
  background-position:right center !important;
  background-size:cover !important;
  opacity:1 !important;
  z-index:0 !important;
  pointer-events:none !important;
}
/* Keep copy above the background */
.home-hero .container,
.home-hero-inner{
  position:relative !important;
  z-index:2 !important;
}

/* Remove the old framed image panel entirely */
.home-hero-media{
  display:none !important;
}
/* Make layout single-column so copy has room, like CrowdStrike */
.home-hero-inner{
  grid-template-columns: 1fr !important;
  max-width: 860px;
}
/* Ensure text reads well on abstract */
.home-hero h1{color:#F8F9FA !important;}
.home-hero-sub{color:rgba(248,249,250,.88) !important;}

/* --- Fix: restore wavy overlay on full-bleed dark hero + make hero moodier (taller/deeper) --- */
.home-hero{
  min-height: 760px !important;
  padding: 120px 0 120px !important;
}

/* Full-bleed base abstract */
.home-hero::after{
  background-image:url("../img/hero-abstract-dark.svg") !important;
  background-position:center right !important;
  background-size:cover !important;
  opacity:1 !important;
  z-index:0 !important;
}

/* Wavy/contour overlay layer */
.home-hero::before{
  content:"" !important;
  position:absolute !important;
  inset:-8% -6% -8% -6% !important;
  background-image:url("../img/hero-waves.svg") !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center !important;
  opacity:.75 !important; /* make visible */
  z-index:1 !important;
  pointer-events:none !important;
  mix-blend-mode:screen;
  filter: saturate(1.15) contrast(1.05);
}

/* Ensure text/CTA stay above both layers */
.home-hero .container,
.home-hero-inner{
  z-index:2 !important;
}

/* Add a deep vignette for moody depth */
.home-hero{
  box-shadow: inset 0 -200px 220px rgba(0,0,0,.45), inset 0 160px 220px rgba(0,0,0,.25);
}
/* Mobile tuning */
@media(max-width:900px){
  .home-hero{
    min-height: 640px !important;
    padding: 96px 0 96px !important;
  }
}

/* --- v10: Force full-flow composite hero (clears legacy framed media + pseudo layers) --- */
.home-hero{
  background:#27283C !important;
  min-height: 820px !important;
  padding: 140px 0 140px !important;
  position:relative !important;
  overflow:hidden !important;
}
.home-hero::before,
.home-hero::after{
  content:none !important; /* clear previous glow/wave layers to prevent clipping/stack issues */
}
.home-hero{
  background-image:url("../img/hero-abstract-composite.svg") !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center center !important;
}
.home-hero .container,
.home-hero-inner{
  position:relative !important;
  z-index:2 !important;
}
.home-hero-media{display:none !important;}
.home-hero-inner{
  grid-template-columns: 1fr !important;
  max-width: 920px;
}
.home-hero h1{color:#F8F9FA !important;}
.home-hero-sub{color:rgba(248,249,250,.88) !important; max-width:60ch;}
/* Moody depth */
.home-hero{
  box-shadow: inset 0 -240px 260px rgba(0,0,0,.55), inset 0 220px 260px rgba(0,0,0,.28);
}
@media(max-width:900px){
  .home-hero{min-height: 700px !important; padding: 110px 0 110px !important;}
}

/* --- v11: Orbit rings hero (no wavy lines) --- */
.home-hero{
  background:#0f1018 !important;
  background-image:url("../img/hero-orbits-fade.svg") !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-position:center center !important;
  min-height: 880px !important;
  padding: 160px 0 160px !important;
  position:relative !important;
  overflow:hidden !important;
}
.home-hero::before,
.home-hero::after{content:none !important;}
.home-hero-media{display:none !important;}
.home-hero-inner{grid-template-columns:1fr !important; max-width: 980px;}
.home-hero h1{color:#F8F9FA !important;}
.home-hero-sub{color:rgba(248,249,250,.88) !important;}

/* --- v12: Larger Hero Typography + Cinematic Placement --- */
.home-hero-inner{
  align-items:center !important;
  padding-top:40px;
}
.home-hero h1{
  font-size: clamp(3.8rem, 5vw, 4.8rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em;
  font-weight: 700;
}
.home-hero-sub{
  font-size: 1.35rem !important;
  max-width: 62ch;
  margin-top: 24px;
}
/* Slight downward placement for cinematic feel */
.home-hero .container{
  padding-top: 60px;
}

/* --- Fix Top Ribbon "Info:" color --- */
.top-ribbon .ribbon-label{
  color: inherit !important;
  font-weight:600;
}

/* --- v13: Homepage kicker font enlargement for key sections --- */
.section.why-rt .kicker,
.section.why-rt-alt .kicker{
  font-size: 1.25rem; /* larger label */
  letter-spacing: .08em;
}
@media(min-width: 900px){
  .section.why-rt .kicker,
  .section.why-rt-alt .kicker{
    font-size: 1.45rem;
  }
}

/* --- v13: Investment Advisors hero image with subtle checkpoint-style overlays --- */
.hero.hero-media-split{
  background: linear-gradient(135deg, rgba(39,40,60,.08) 0%, rgba(248,249,250,1) 55%, rgba(231,234,238,1) 100%);
  overflow:hidden;
}
.hero.hero-media-split .hero-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 44px;
  align-items:center;
}
.hero.hero-media-split .hero-media{
  position:relative;
}
.hero.hero-media-split .hero-media-frame{
  position:relative;
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(39,40,60,.12);
  box-shadow: 0 22px 70px rgba(39,40,60,.16);
}
.hero.hero-media-split .hero-media-frame::before{
  content:"";
  position:absolute;
  inset:0;
  /* soft fade + subtle abstract wash */
  background:
    radial-gradient(circle at 75% 35%, rgba(236,138,44,.20), rgba(236,138,44,0) 55%),
    radial-gradient(circle at 25% 70%, rgba(39,40,60,.14), rgba(39,40,60,0) 58%),
    linear-gradient(90deg, rgba(248,249,250,.35), rgba(248,249,250,0) 55%);
  mix-blend-mode: multiply;
  pointer-events:none;
  z-index:1;
}
.hero.hero-media-split .hero-media-frame::after{
  content:"";
  position:absolute;
  inset:0;
  /* gentle top-to-bottom fade like checkpoint cards */
  background: linear-gradient(180deg, rgba(39,40,60,.00) 0%, rgba(39,40,60,.10) 55%, rgba(39,40,60,.18) 100%);
  pointer-events:none;
  z-index:2;
}
.hero.hero-media-split img{
  display:block;
  width:100%;
  height: 420px;
  object-fit: cover;
}
@media(max-width: 900px){
  .hero.hero-media-split .hero-grid{grid-template-columns:1fr; gap:24px;}
  .hero.hero-media-split img{height: 320px;}
}

/* --- v14: Investment Advisors hero - dark primary with image fading into background (Checkpoint-inspired) --- */
.hero.hero-media-split{
  background:#27283C !important;
  color:#F8F9FA;
  padding: 86px 0;
  position:relative;
  overflow:hidden;
}
.hero.hero-media-split .kicker,
.hero.hero-media-split h1,
.hero.hero-media-split p{
  color:#F8F9FA !important;
}
.hero.hero-media-split p{
  opacity:.92;
}
.hero.hero-media-split .btn.outline{
  border-color: rgba(248,249,250,.35);
  color:#F8F9FA;
}
.hero.hero-media-split .btn.outline:hover{
  border-color: rgba(248,249,250,.55);
}

/* Layout */
.hero.hero-media-split .hero-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 52px;
  align-items:center;
}

/* Make image panel feel integrated (no "washed out") */
.hero.hero-media-split .hero-media-frame{
  border-radius: 24px;
  overflow:hidden;
  border: 1px solid rgba(231,234,238,.14);
  box-shadow: 0 34px 110px rgba(0,0,0,.42);
  position:relative;
  background:#27283C;
}

/* Fade image into dark background (right/left + top/bottom) */
.hero.hero-media-split .hero-media-frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    /* left fade so image melts into dark hero */
    linear-gradient(90deg, #27283C 0%, rgba(39,40,60,.55) 18%, rgba(39,40,60,0) 55%),
    /* bottom vignette */
    linear-gradient(180deg, rgba(39,40,60,0) 0%, rgba(39,40,60,.10) 55%, rgba(0,0,0,.35) 100%),
    /* subtle warm accent glow */
    radial-gradient(circle at 78% 32%, rgba(236,138,44,.28), rgba(236,138,44,0) 52%);
  pointer-events:none;
  z-index:2;
}

/* Subtle "space dots" motif (very light, not competing with homepage) */
.hero.hero-media-split::before{
  content:"";
  position:absolute;
  inset:-40%;
  background-image:
    radial-gradient(circle, rgba(231,234,238,.18) 1px, transparent 1.2px),
    radial-gradient(circle, rgba(236,138,44,.22) 1px, transparent 1.2px);
  background-size: 44px 44px, 66px 66px;
  background-position: 0 0, 12px 18px;
  opacity: .18;
  filter: blur(.2px);
  pointer-events:none;
  z-index:0;
}
.hero.hero-media-split .container{position:relative; z-index:1;}

.hero.hero-media-split img{
  display:block;
  width:100%;
  height: 460px;
  object-fit: cover;
  position:relative;
  z-index:1;
  opacity: .95;
}

/* Mobile */
@media(max-width: 900px){
  .hero.hero-media-split{padding: 64px 0;}
  .hero.hero-media-split .hero-grid{grid-template-columns:1fr; gap:26px;}
  .hero.hero-media-split img{height: 340px;}
}

/* --- v15: Stronger space dots + stronger perimeter fade (Investment Advisors hero) --- */

/* Make dot field more visible */
.hero.hero-media-split::before{
  content:"";
  position:absolute;
  inset:-20%;
  background-image:
    radial-gradient(circle, rgba(231,234,238,.35) 1.2px, transparent 1.6px),
    radial-gradient(circle, rgba(236,138,44,.35) 1.2px, transparent 1.6px);
  background-size: 38px 38px, 64px 64px;
  background-position: 0 0, 18px 22px;
  opacity: .32;                 /* increased visibility */
  pointer-events:none;
  z-index:0;
}

/* Stronger image edge fading */
.hero.hero-media-split .hero-media-frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    /* LEFT heavy fade */
    linear-gradient(90deg, #27283C 0%, rgba(39,40,60,.75) 20%, rgba(39,40,60,.35) 40%, rgba(39,40,60,0) 60%),
    /* TOP fade */
    linear-gradient(180deg, #27283C 0%, rgba(39,40,60,.55) 18%, rgba(39,40,60,0) 50%),
    /* BOTTOM vignette */
    linear-gradient(180deg, rgba(39,40,60,0) 55%, rgba(39,40,60,.35) 80%, rgba(0,0,0,.55) 100%),
    /* Subtle orange glow */
    radial-gradient(circle at 78% 32%, rgba(236,138,44,.35), rgba(236,138,44,0) 55%);
  pointer-events:none;
  z-index:2;
}

/* Slightly deepen overall section mood */
.hero.hero-media-split{
  box-shadow: inset 0 -180px 220px rgba(0,0,0,.45),
              inset 0 120px 180px rgba(0,0,0,.35);
}

/* --- v16: Balanced Investment Advisors hero (visible image + refined fade) --- */

/* Tone down dot intensity so they don't overpower image */
.hero.hero-media-split::before{
  content:"";
  position:absolute;
  inset:-15%;
  background-image:
    radial-gradient(circle, rgba(231,234,238,.22) 1.2px, transparent 1.6px),
    radial-gradient(circle, rgba(236,138,44,.22) 1.2px, transparent 1.6px);
  background-size: 44px 44px, 72px 72px;
  background-position: 0 0, 18px 22px;
  opacity: .22;
  pointer-events:none;
  z-index:0;
}

/* Refined fade that keeps subjects visible */
.hero.hero-media-split .hero-media-frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    /* softer left blend */
    linear-gradient(90deg, rgba(39,40,60,.85) 0%, rgba(39,40,60,.55) 18%, rgba(39,40,60,.15) 40%, rgba(39,40,60,0) 60%),
    /* subtle top fade */
    linear-gradient(180deg, rgba(39,40,60,.55) 0%, rgba(39,40,60,.25) 15%, rgba(39,40,60,0) 45%),
    /* lighter bottom vignette */
    linear-gradient(180deg, rgba(39,40,60,0) 55%, rgba(39,40,60,.20) 80%, rgba(0,0,0,.35) 100%),
    /* gentle orange glow accent */
    radial-gradient(circle at 78% 32%, rgba(236,138,44,.22), rgba(236,138,44,0) 55%);
  pointer-events:none;
  z-index:2;
}

/* Reduce global section shadow so image isn't crushed */
.hero.hero-media-split{
  box-shadow: inset 0 -120px 160px rgba(0,0,0,.35),
              inset 0 80px 120px rgba(0,0,0,.25);
}

/* --- v17: Slightly stronger star/dot field for dark industry heroes --- */
.hero.hero-media-split::before{
  opacity: .28 !important;
}
