*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --teal:#04657A;--teal-dark:#116379;--teal-glow:rgba(26,143,184,0.15);
  --text:#081820;--text-mid:#1e3a4a;--text-muted:#364950;
  --bg:#f0f4f7;--card:rgba(255,255,255,0.95);
  --glass:rgba(255,255,255,0.65);
  --card-bg: rgba(255,255,255,0.75);
  --card-border: rgba(50,197,240,0.25);
  --teal-deep: #116379;   /* STYL deep teal */
  --series: #087a9e;      /* validated chart teal */
  --series-soft: #cfe8f0; /* light ramp step — interpolated marks */
  --grid: #e4e9ec;
  --sky: #32C5F0;
  --track: #e4ecef;
}
html{scroll-behavior:auto;overflow:hidden;height:100%}
body{font-family:'Montserrat',system-ui,sans-serif;background:#f0f4f7;color:var(--text);height:100%;overflow:hidden;position:relative}
body::after{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;background:#f0f4f7;opacity:0.35}
body::before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none;background-image:url("");}

/* ═══════ NAV ═══════ */
.top-bar{position:fixed;top:0;left:0;right:0;z-index:1000;display:flex;justify-content:space-between;align-items:center;padding:16px 32px;background:#212c37;backdrop-filter:blur(16px);}
.top-bar a{font-size: 14px;color:#bfc1c1;text-decoration:none;font-weight:600}
.top-bar a:hover{text-decoration:underline
}

.bm-endorse {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 12px;
  margin-top: 9px;
}
.bm-endorse img { height: 32px; width: auto; }
.bm-endorse .bm-txt {

  display: flex;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: #999999;
  padding-bottom: 4px;
}
.bm-endorse .bm-txt2 {

  display: flex;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #16657a;
  padding-bottom: 4px;
}
.bm-endorse .bm-txt3 {

  display: flex;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #000000;
  padding-bottom: 4px;
}

.bm-endorse .bm-rule { width: 40px; height: 1px; margin-bottom: 10px; }
.bm-endorse .bm-rule.l { background: linear-gradient(90deg, rgba(50,197,240,0.55)); }
.bm-endorse .bm-rule.r { background: linear-gradient(90deg, rgba(50,197,240,0.55)); }
@media (max-width: 600px) {
  .brand-masthead .bm-styl { height: 52px; }
  .bm-endorse img { height: 22px; }
  .bm-endorse .bm-txt { font-size: 9px; padding-bottom: 3px; }
  .bm-endorse .bm-rule { width: 26px; margin-bottom: 8px; }
  .bm-endorse {display: none;}
  .back-link {display:none;}
  .panel-inner {padding-top: 50px;}
}
@media (max-width: 800px) {
  .bm-endorse {display: none;}
  .hero-logo {margin-top: 100px;}
  .panel-inner {padding-top: 50px;}
}

/* ═══════ HORIZONTAL SCROLL CONTAINER ═══════ */
.deck-wrapper{position:relative;z-index:2;height:100vh;overflow:hidden}
.deck-track{display:flex;height:100%;transition:transform 0.7s cubic-bezier(0.16,1,0.3,1)}
.panel{min-width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;padding:60px 40px;position:relative;overflow-y:auto;overflow-x:hidden}
.panel-inner{max-width:1100px;width:100%;position:relative}

.panel-inner h2 { 
  font-family: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  font-size: clamp(26px,4vw,40px);
  font-weight: 800;
  line-height: 1.06;
  color: #2a3c4e;
  margin-bottom: 24px;
  text-shadow: 0 1px 0 #fff;
  letter-spacing: -1.5px;
  animation: fadeUp 0.7s ease 0.2s both;
  text-transform: uppercase; }

.panel-inner h3 { 
  font-family: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  font-size: clamp(22px,4vw,30px);
  font-weight: 800;
  line-height: 1.06;
  color: #2a3c4e;
  margin-bottom: 24px;
  letter-spacing: -1.5px;
  animation: fadeUp 0.7s ease 0.2s both;
  text-transform: uppercase; }

.center { text-align: center; }

#myVideo {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  object-fit: cover; /* Keeps aspect ratio, crops edges */
  z-index: -1; 

}
.lifestylistic-icon {width: 145px;}
.rule { width: 130px; height: 1px; background: rgba(26,47,56,0.4); margin: 18px auto; }
.lead { font-size: 17px; font-weight: 500;color: var(--muted); line-height: 1.7; max-width: 760px; margin: 0 auto 5px; }
.hero-logo{display:block;margin:0 auto;height:86px;width:auto; margin-bottom: 25px}
.brand-endorse{display:flex;align-items:flex-end;justify-content:center;gap:12px;margin:14px 0 24px}
.brand-endorse img{height:30px;width:auto}
.brand-endorse .be-txt{font-size:11px;font-weight:600;letter-spacing:0.36em;text-transform:uppercase;color:var(--dim);padding-bottom:4px}
.brand-endorse .be-rule{width:40px;height:1px;margin-bottom:10px}
.brand-endorse .be-rule.l{background:linear-gradient(90deg,transparent,rgba(4,101,122,0.45))}
.brand-endorse .be-rule.r{background:linear-gradient(90deg,rgba(4,101,122,0.45),transparent)}
.brand-endorse.sm img{height:24px}
.brand-endorse.sm .be-txt{font-size:9.5px;padding-bottom:3px}
.brand-endorse.sm .be-rule{width:30px;margin-bottom:8px}
@media(max-width:768px){.hero-logo{height:62px}.brand-endorse{margin:10px 0 16px}.brand-endorse img{height:24px}.brand-endorse .be-txt{font-size:9.5px;padding-bottom:3px}.brand-endorse .be-rule{width:28px;margin-bottom:8px}}

/* Progress dots */
.nav-dots{position:fixed;right:28px;top:50%;transform:translateY(-50%);z-index:1000;display:flex;flex-direction:column;gap:10px}
.nav-dot{width:10px;height:10px;border-radius:50%;background:rgba(26,143,184,0.2);cursor:pointer;transition:all 0.4s;border:none;padding:0}
.nav-dot.active{background:var(--teal);transform:scale(1.4);box-shadow:0 0 12px rgba(26,143,184,0.5)}
.nav-dot:hover{background:rgba(26,143,184,0.5);transform:scale(1.2)}

/* Slide counter */
.slide-counter{position:fixed;bottom:28px;right:28px;z-index:1000;font-family:'Montserrat',sans-serif;font-size:14px;color:var(--text-muted);font-weight:500}
.slide-counter span{color:var(--teal);font-weight:800;font-size:22px}

/* Progress bar */
.progress{position:fixed;bottom:0;left:0;height:3px;background:linear-gradient(90deg,var(--teal),#157a6a);z-index:1000;transition:width 0.7s cubic-bezier(0.16,1,0.3,1)}

/* Arrow hints */
.arrow-hint{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;gap:12px;align-items:center}
.arrow-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--card-border);background:var(--glass);backdrop-filter:blur(8px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s;color:var(--teal);font-size:18px}
.arrow-btn:hover{background:var(--teal);color:#fff;transform:scale(1.1)}
.arrow-btn:disabled{opacity:0.3;cursor:default;transform:none}
.arrow-btn:disabled:hover{background:var(--glass);color:var(--teal)}

/* ═══════ TYPOGRAPHY ═══════ */
.eyebrow{font-size: 14px;letter-spacing:5px;color:#116379;text-transform:uppercase;font-weight:700;margin-bottom:9px}
h1{font-family:'Montserrat',sans-serif;font-weight:900;letter-spacing:-2px}
h2{font-family:'Montserrat',sans-serif;font-weight:800;letter-spacing:-1px}
h3{font-family:'Montserrat',sans-serif;font-weight:700}

/* ═══════ ANIMATIONS ═══════ */
@keyframes fadeUp{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeLeft{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:translateX(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(0.85)}to{opacity:1;transform:scale(1)}}
@keyframes countUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes pulseGlow{0%,100%{box-shadow:0 0 20px rgba(26,143,184,0.1)}50%{box-shadow:0 0 40px rgba(26,143,184,0.25)}}

.anim-item{opacity:0}
.panel.active .anim-item{animation:fadeUp 0.7s ease forwards}
.panel.active .anim-left{animation:fadeLeft 0.7s ease forwards}
.panel.active .anim-scale{animation:scaleIn 0.6s ease forwards}
.panel.active .d1{animation-delay:0.1s}.panel.active .d2{animation-delay:0.2s}
.panel.active .d3{animation-delay:0.3s}.panel.active .d4{animation-delay:0.4s}
.panel.active .d5{animation-delay:0.5s}.panel.active .d6{animation-delay:0.6s}
.panel.active .d7{animation-delay:0.7s}.panel.active .d8{animation-delay:0.8s}
.panel.active .d9{animation-delay:0.9s}.panel.active .d10{animation-delay:1s}
.panel.active .d11{animation-delay:1.1s}.panel.active .d12{animation-delay:1.2s}

/* ═══════ HERO PANEL ═══════ */
.hero{text-align:center}
.hero h1{font-size:clamp(25px, 6vw, 47px);line-height:1.05;
  color: #2a3c4e;margin-bottom:24px; text-shadow: 0 1px 0 #fff; text-transform: uppercase;}
.hero h1 em{font-style:normal;color:var(--teal);position:relative; text-shadow: 0 1px 0 #fff;}
.hero .subtitle{font-size:clamp(14px,2vw,18px); font-weight: 500;color:var(--text-muted);max-width:720px;margin:0 auto 33px;line-height:1.65}
.stat-row{display:flex;justify-content:center;gap:clamp(12px,5vw,15px);flex-wrap:wrap}
.stat-block{text-align:center;padding:20px 28px;background:var(--card);border:1px solid var(--card-border);border-radius:16px;backdrop-filter:blur(12px);min-width:140px;word-wrap:break-word;overflow-wrap:break-word}
.stat-block.active-glow{animation:pulseGlow 3s ease infinite}
.stat-val{font-family:'Montserrat',sans-serif;font-size:24px;font-weight:700;color: #116379;line-height:1}
.stat-lbl{font-size:13px;color:var(--text-muted);margin-top:6px;font-weight:500}

/* ═══════ SPLIT LAYOUT ═══════ */
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.split-text h2{font-size:clamp(28px,4vw,44px);line-height:1.1;margin-bottom:16px;
  color: #2a3c4e;text-shadow: 0 1px 0 #fff;text-transform: uppercase;}
.split-text .lead{font-size:16px;color:var(--text-muted);line-height:1.7}

/* ═══════ SPLIT TRIO LAYOUT ═══════ */
.split-trio{display:grid;grid-template-columns:3fr 1fr;gap:48px;align-items:center}
.split-trio-text h2{font-size:clamp(28px,4vw,44px);line-height:1.1;margin-bottom:16px;
  color: #2a3c4e;text-shadow: 0 1px 0 #fff;text-transform: uppercase;}
.split-trio-text .lead{font-size:16px;color:var(--text-muted);line-height:1.7}

/* ═══════ SPLIT DOUBLE LAYOUT ═══════ */
.split-double{display:grid;grid-template-columns:1fr 3fr;gap:48px;align-items:center}
.split-double-text h2{font-size:clamp(28px,4vw,44px);line-height:1.1;margin-bottom:16px;
  color: #2a3c4e;text-shadow: 0 1px 0 #fff;text-transform: uppercase;}
.split-double-text .lead{font-size:16px;color:var(--text-muted);line-height:1.7}

/* ═══════ EXPANDABLE CARDS ═══════ */
.expand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.expand-card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:16px;padding:12px;cursor:pointer;transition:all 0.4s cubic-bezier(0.16,1,0.3,1);backdrop-filter:blur(10px);overflow:hidden;position:relative;text-align:left;word-wrap:break-word;overflow-wrap:break-word}
.expand-card::after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--teal);transform:scaleX(0);transition:transform 0.4s;transform-origin:left}
.expand-card:hover{transform:translateY(-4px);border-color:var(--teal)}
.expand-card:hover::after{transform:scaleX(1)}
.expand-card.open{grid-column:1/-1;background:rgba(255,255,255,0.92);border-color:var(--teal);box-shadow:0 20px 60px rgba(26,143,184,0.15);text-align:left}
.ec-icon{font-size:35px;margin-bottom:10px;transition:transform 0.4s;}
.ec-icon img{width:50px;height:30px;object-fit:contain;display:inline-block;vertical-align:middle; float: left;}
.expand-card:hover .ec-icon{transform:scale(1.15)}
.ec-title{font-family:'Montserrat',sans-serif;font-size:16px;font-weight:700;color:var(--text);margin-bottom:6px;word-wrap:break-word;overflow-wrap:break-word; text-transform:uppercase;}
.ec-preview{font-size:13px;font-weight: 500;color:var(--text-muted);line-height:1.5;word-wrap:break-word;overflow-wrap:break-word}
.ec-detail{max-height:0;overflow:hidden;transition:max-height 0.5s cubic-bezier(0.16,1,0.3,1),opacity 0.4s,padding 0.4s;opacity:0;padding:0}
.expand-card.open .ec-detail{max-height:400px;opacity:1;padding:16px 0 0}
.expand-card.open .ec-icon{display: none;}
.ec-detail p{font-size: 18px;font-weight: 500;color:var(--text-mid);line-height:1.7;margin-bottom:10px}
.ec-tag{display:inline-block;font-size: 12px;font-weight:700;color:var(--teal);letter-spacing:1px;padding:4px 12px;background:var(--teal-glow);border-radius:20px}
.ec-close{display:none;position:absolute;top:16px;right:16px;width:28px;height:28px;border-radius:50%;border:1px solid var(--card-border);background:var(--glass);cursor:pointer;font-size:14px;color:var(--text-muted);align-items:center;justify-content:center}
.expand-card.open .ec-close{display:flex}


.roadmap { position: relative; margin-top: 30px;}
.rm-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
.rm-title { font-size: 12px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--teal); }
.rm-key { font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: var(--dim); }
.rm-rule { height: 1px; background: rgba(14,34,48,0.12); margin-bottom: 14px; }

.rm-row { margin-bottom: 12px; }
.rm-top { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
.rm-name { font-size: 14px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; color: var(--ink); }
.rm-pct { font-size: 14px; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
.rm-line { height: 4px; border-radius: 2px; background: var(--track); overflow: hidden; }
.rm-fill { height: 100%; border-radius: 2px; background: var(--teal); }
.rm-row.launch .rm-fill { background: var(--sky); }
.rm-row.launch .rm-pct { color: var(--ink); }
.rm-desc { font-size: 12px; font-weight: 500; color: var(--dim); margin-top: 3px; line-height: 1.35; }

.rm-foot { display: flex; gap: 14px; margin-top: -10px; font-size: 12px; letter-spacing: 0.6px; text-transform: uppercase; color: var(--dim); float: right; }
.rm-foot span { display: inline-flex; align-items: center; gap: 5px; }
.rm-foot i { width: 10px; height: 4px; border-radius: 2px; display: inline-block; }


/* ====== FLOW LINE ====== */
.flow { display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; margin: 30px 0 10px; }
.flow .fbox { background: var(--card); border: 1px solid var(--card-border); border-radius: 10px; padding: 16px 20px; text-align: center; }
.flow .fbox b { display: block; font-size: 19px; color: var(--ink); }
.flow .fbox span { font-size: 12px; color: var(--dim); }
.flow .farrow { color: var(--teal); font-size: 20px; font-weight: 600; }
.flow .fbox.hot { border-color: var(--teal); background: rgba(50,197,240,0.1); }
.flow .fbox.hot b { color: var(--teal-deep); }


/* ====== INVEST PANEL ====== */
.terms-row { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-top: 28px; }
.term { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px; padding: 20px 28px; min-width: 180px; }
.term .v { font-size: 22px; font-weight: 700; color: #116379; }
.term .l { font-size: 12px; color: var(--dim); margin-top: 4px; }



/* ====== CARDS & GRIDS ====== */
.grid { display: grid; gap: 16px; margin-top: 30px; }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }
.card { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px; padding: 18px 18px; text-align: left; }
.card h3 { font-size: 16px; font-weight: 700; color: var(--ink); margin-bottom: 8px; margin-top:5px; text-transform: uppercase; }
.card p { font-size: 14px; color: var(--muted); line-height: 1.6; }
.card .icon { width: 30px; height: 30px; object-fit: contain; margin-right: 15px; display: block; float:left;position:relative; margin-bottom:-5px; }
.card.center-card { text-align: center; }
.card.center-card .icon { margin: 0 auto 12px; }
.card .tick { color: var(--teal); font-weight: 700; font-size: 17px; flex-shrink: 0; float: left; position; relative; margin-right: 10px; }

.cap-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 28px; }
.cap { background: var(--card); border: 1px solid var(--card-border); border-radius: 10px; padding: 18px 12px; text-align: left; }
.cap img { width: 35px; height: auto; object-fit: contain; margin-bottom: 8px; float: left; position: relative; margin-right:10px; }
.cap div { font-size: 14px; font-weight: 600; color: var(--ink); text-transform: uppercase; }
.cap span { display: block; font-size: 12px; color: var(--dim); margin-top: 3px; }

.stat-strip { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin-top: 32px; }
.stat { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px; padding: 18px 26px; min-width: 170px; }
.stat .v { font-size: 24px; font-weight: 700; color: #116379; }
.stat .l { font-size: 12px; color: var(--dim); margin-top: 4px; line-height: 1.4; }

.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 32px; }
.step { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px; padding: 26px 22px; text-align: center; }
.step .num { width: 40px; height: 40px; border-radius: 50%; border: 1px solid #116379; color: #116379;
  display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 17px; margin: 0 auto 14px; }
.step h3 { font-size: 16px; font-weight: 700; color: var(--ink); margin-bottom: 8px; }
.step p { font-size: 14px; color: var(--muted); line-height: 1.6; }

.mock { max-width: 900px; width: 85%; margin: 26px auto 0; display: block; filter: drop-shadow(0 22px 44px rgba(14,34,48,0.22)); }
.shot-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 760px; margin: 22px auto 0; }
.shot-row img { width: 100%; border-radius: 10px; border: 1px solid var(--card-border); box-shadow: 0 14px 28px rgba(14,34,48,0.16); }

/* ═══════ STEP TIMELINE (HORIZONTAL) ═══════ */
.h-timeline{display:flex;gap:0;position:relative;margin-top:32px}
.h-timeline::before{content:"";position:absolute;top:28px;left:40px;right:40px;height:2px;background:linear-gradient(90deg,#116379,rgba(26,143,184,0.1))}
.tl-step{flex:1;text-align:center;position:relative;padding:0 12px}
.tl-num{width:56px;height:56px;border-radius:50%;background:var(--card);border:2px solid #116379;display:flex;align-items:center;justify-content:center;font-family:'Montserrat',sans-serif;font-size:22px;font-weight:800;color:#116379;margin:0 auto 16px;position:relative;z-index:2;transition:all 0.4s}
.tl-step:hover .tl-num{}
.tl-step h3{font-size:17px;color:#116379;margin-bottom:6px; text-shadow: none;}
.tl-step p{font-size:15px;font-weight: 500;color:var(--text-muted);line-height:1.5}

/* ====== CHART ====== */
.pct-toggle { display: flex; justify-content: center; gap: 5px; margin: 24px 0 8px; }
.pct-toggle button { padding: 10px 26px; border-radius: 999px; border: 1px solid var(--card-border); background: rgba(255,255,255,0.8);
  font-family: inherit; font-size: 14px; font-weight: 600; letter-spacing: 1px; color: var(--muted); cursor: pointer; transition: all 0.2s; }
.pct-toggle button.on { background: var(--teal); border-color: var(--teal); color: #fff; }
.chart { display: flex; align-items: flex-end; justify-content: center; gap: 44px; height: 300px; }
.bar-wrap { display: flex; flex-direction: column; align-items: center; width: 100px; }
.bar-val { font-size: 19px; font-weight: 700; color: var(--teal-deep); margin-bottom: 6px; }
.bar { width: 84px; border-radius: 8px 8px 0 0; background: linear-gradient(180deg, #1fc4f0,#1dadd3); transition: height 0.6s cubic-bezier(0.4,0,0.2,1); opacity: 0.8; }
.bar-year { font-size: 13px; font-weight: 600; color: var(--ink); margin-top: 10px; }
.bar-sub { font-size: 11px; color: var(--dim); margin-top: 2px; }
.chart-note { font-size: 12.5px; color: var(--dim); line-height: 1.6; max-width: 720px; margin: 22px auto 0; }

/* ═══════ REVENUE BARS ═══════ */
.rev-bars{display:flex;align-items:flex-end;gap:24px;height:280px;margin-top:32px;padding:0 20px}
.rev-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end}
.rev-bar{width:100%;border-radius:12px 12px 4px 4px;background:linear-gradient(180deg,#1fc4f0,#1dadd3);transition:height 1.2s cubic-bezier(0.16,1,0.3,1);height:0;position:relative;min-height:4px; opacity: 0.8;}
.panel.active .rev-bar{height:var(--h)}
.rev-bar-val{position:absolute;top:-32px;left:50%;transform:translateX(-50%);font-family:'Montserrat',sans-serif;font-size:18px;font-weight:800;color:var(--teal);white-space:nowrap}
.rev-bar-year{margin-top:12px;font-size:14px;font-weight:700;color:var(--text-mid)}
.rev-bar-growth{font-size:12px;color:#157a6a;font-weight:600;margin-top:2px}

/* ═══════ FLIP TILES (BEFORE/AFTER) ═══════ */
.flip-instruction{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#116379;background:rgba(26,143,184,0.08);border:1px solid rgba(26,143,184,0.3);border-radius:999px;padding:9px 20px;margin-bottom:4px;}
.flip-instruction .fi-ico{display:inline-block;font-size:14px;animation:fiSpin 3.2s ease-in-out infinite}
@keyframes fiSpin{0%,60%,100%{transform:rotate(0)}72%{transform:rotate(180deg)}84%{transform:rotate(360deg)}}
.flip-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:20px}
.flip-tile{perspective:1200px;height: 269px ;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform 0.3s}
.flip-tile:hover{transform:translateY(-3px)}
.flip-tile:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:14px}
.ft-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform 0.65s cubic-bezier(0.35,0.1,0.25,1)}
.flip-tile.flipped .ft-inner{transform:rotateY(180deg)}
.ft-face{inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;text-align:left}
.ft-tag{font-size:17px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;margin-bottom:10px}
.ft-text{font-size:16px;line-height:1.5;font-weight:500;flex:1;display:flex;align-items:center}
.ft-front{position:absolute;background:rgba(181,68,110,0.05);border:1.5px solid rgba(181,68,110,0.22)}
.ft-front .ft-tag{color:#b5446e}
.ft-front .ft-text{color:#7a3450}
.ft-back{position:absolute;background:linear-gradient(135deg,rgba(26,143,184,0.12),rgba(26,143,184,0.03));border:1.5px solid rgba(26,143,184,0.4);transform:rotateY(180deg)}
.ft-back .ft-tag{color:#116379}
.ft-back .ft-text{color:var(--text)}
.flip-tile:hover .ft-front{border-color:rgba(181,68,110,0.5);box-shadow:0 12px 28px rgba(181,68,110,0.12)}
.flip-tile:hover .ft-back{box-shadow:0 12px 28px rgba(26,143,184,0.14)}

/* ═══════ REPLACEMENT MORPH ═══════ */
.replace-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
.rep-card{background:var(--card);border:1px solid var(--card-border);border-radius:14px;padding:20px;position:relative;overflow:hidden;transition:all 0.4s;cursor:default}
.rep-card::before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--teal);transform:scaleY(0);transition:transform 0.4s;transform-origin:top}
.rep-card:hover::before{transform:scaleY(1)}
.rep-card:hover{border-color:var(--teal);transform:translateX(4px)}
.rep-from{font-size:13px;color:var(--text-muted);text-decoration:line-through;margin-bottom:4px}
.rep-to{font-size:16px;font-weight:700;color:var(--text);font-family:'Montserrat',sans-serif}

/* ═══════ PHASE CARDS ═══════ */
.phases{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px}
.phase{background:var(--card);border:1px solid var(--card-border);border-radius:16px;padding:28px 24px;backdrop-filter:blur(10px);transition:all 0.4s;position:relative;overflow:hidden}
.phase-num{font-family:'Montserrat',sans-serif;font-size:48px;font-weight:900;color:var(--teal);opacity:0.15;line-height:1}
.phase h3{font-size:18px;color:#01647b;margin:4px 0}
.phase .period{font-size:13px;color:var(--teal);font-weight:600}
.phase .budget{font-size:13px;font-weight:700;color:var(--text-mid);margin:4px 0 14px}
.phase li{font-size: 14px;color:var(--text-muted);line-height:1.8;list-style:none;padding-left:16px;position:relative}
.phase li::before{content:"→";position:absolute;left:0;color:var(--teal)}

/* ═══════ EQUITY TABLE ═══════ */
.eq-wrap{background:var(--card);border:1px solid var(--card-border);border-radius:16px;overflow:hidden;backdrop-filter:blur(10px);margin-top:24px}
.eq-head{display:grid;grid-template-columns:1fr 1fr 1fr;padding:14px 28px;font-size:11px;font-weight:700;letter-spacing:2px;color:var(--teal);text-transform:uppercase;border-bottom:2px solid var(--card-border)}
.eq-row{display:grid;grid-template-columns:1fr 1fr 1fr;padding:11px 28px;font-size:14px;border-bottom:1px solid rgba(26,143,184,0.08);transition:all 0.3s;cursor:default}
.eq-row:last-child{border-bottom:none}
.eq-row:hover{background:var(--teal-glow)}
.eq-row span{font-family:'Montserrat',monospace;font-weight:600}
.eq-row.featured{background:var(--teal-glow);border-left:3px solid var(--teal)}
.eq-row.featured span{color:var(--teal);font-weight:800}

/* ═══════ FLYWHEEL ORBIT ═══════ */
.flywheel-wrap{flex:1;display:flex;align-items:center;justify-content:center;min-width:340px}
.fw-orbit{position:relative;width:400px;height:400px}
.fw-ring{position:absolute;top:20px;left:20px;right:20px;bottom:20px;border-radius:50%;border:2px solid rgba(26,143,184,0.15)}
.fw-ring-2{top:60px;left:60px;right:60px;bottom:60px;border:1px dashed rgba(26,143,184,0.08)}
.fw-arrows{position:absolute;top:0;left:0;width:100%;height:100%}
.fw-arrows svg{width:100%;height:100%}
.panel.active .fw-arrows svg{animation:spinSlow 60s linear infinite}
@keyframes spinSlow{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.fw-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100px;height:100px;border-radius:50%;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:none;z-index:5}
.fw-center-icon{font-size:28px;line-height:1}
.fw-center-text{font-size:9px;font-weight:700;color:#fff;letter-spacing:1px;margin-top:2px;text-transform:uppercase}
.fw-center-logo{width:90px;height:auto;object-fit:contain}

/* Nodes are positioned by JS for orbiting */
.fw-node{position:absolute;width:80px;height:80px;border-radius:50%;background:var(--card);border:2px solid var(--card-border);display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:background 0.4s,border-color 0.4s,box-shadow 0.4s;z-index:10;padding:0;font-family:'Montserrat',sans-serif;will-change:top,left}
.fw-node:hover,.fw-node.active{background:var(--teal);border-color:var(--teal);box-shadow:none}
.fw-node:hover .fw-node-num,.fw-node.active .fw-node-num{color:#fff}
.fw-node:hover .fw-node-label,.fw-node.active .fw-node-label{color:rgba(255,255,255,0.9)}
.fw-node-num{font-family:'Montserrat',sans-serif;font-size:22px;font-weight:800;color:var(--teal);line-height:1;transition:color 0.3s}
.fw-node-label{font-size:9px;font-weight:600;color:var(--text-muted);margin-top:2px;transition:color 0.3s;letter-spacing:0.5px}
/* Connector trail */
.fw-trail{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:3}
.fw-trail canvas{width:100%;height:100%}
.fw-detail{background:var(--card);border:1px solid var(--card-border);border-radius:16px;padding:24px;backdrop-filter:blur(10px);transition:all 0.4s;min-height:140px}
.fw-detail.glow{border-color:var(--teal);box-shadow:0 8px 32px rgba(26,143,184,0.12)}
.fw-detail-num{font-family:'Montserrat',sans-serif;font-size:48px;font-weight:900;color:var(--teal);opacity:0.2;line-height:1;margin-bottom:4px;transition:all 0.4s}
.fw-detail h3{font-family:'Montserrat',sans-serif;font-size:20px;font-weight:700;color:var(--text);margin-bottom:8px;transition:all 0.3s}
.fw-detail p{font-size:14px;color:var(--text-muted);line-height:1.65;transition:all 0.3s}
.fw-node.active::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--teal);opacity:0;}
@keyframes nodePulse{0%{opacity:0.6;inset:-6px}100%{opacity:0;inset:-20px}}

@media(max-width:900px){
  .flywheel-wrap{min-width:unset}
  .fw-orbit{width:280px;height:280px}
  .fw-node{width:60px;height:60px}
  .fw-node-num{font-size:17px}
  .fw-node-label{font-size:7px}
  .fw-center{width:72px;height:72px}
  .fw-center-icon{font-size:22px}
  .fw-center-text{font-size:8px}
  .fw-arrows svg{display:none}
  .fw-detail{min-height:auto;padding:16px}
  .fw-detail-num{font-size:36px}
  .fw-detail h3{font-size:16px}
  .fw-detail p{font-size:13px}
}
@media(max-width:700px){
  section[data-title="Flywheel"] .panel-inner{flex-direction:column!important;gap:16px!important;padding-top:10px}
  .flywheel-wrap{order:-1;min-width:unset;flex:none}
  .fw-orbit{width:240px;height:240px;margin:0 auto}
  .fw-node{width:52px;height:52px}
  .fw-node-num{font-size:15px}
  .fw-node-label{font-size:7px}
  .fw-center{width:60px;height:60px}
  .fw-center-icon{font-size:18px}
  .fw-center-text{font-size:7px}
  .fw-detail{min-height:auto;padding:14px}
  .fw-detail-num{font-size:28px;margin-bottom:2px}
  .fw-detail h3{font-size:15px;margin-bottom:4px}
  .fw-detail p{font-size: 13px;line-height:1.5}
  section[data-title="Flywheel"] .eyebrow{font-size: 11px;margin-bottom:6px}
  section[data-title="Flywheel"] h2{font-size:22px!important;margin-bottom:8px!important; }
}

/* ═══════ CTA PANEL ═══════ */
.cta-panel{text-align:center}
.cta-panel h2{font-size:clamp(32px,5vw,56px);line-height:1.05;margin-bottom:20px;text-shadow: 0 1px 0 #fff;text-transform: uppercase;}
.cta-panel h2 em{font-style:normal;color:var(--teal);text-shadow: 0 1px 0 #fff;}
.cta-panel .lead{font-size:17px;color:var(--text-muted);max-width:580px;margin:0 auto 40px;line-height:1.65}
.cta-btn{display:inline-block;padding:18px 48px;background:#1fc4f0;color:#fff;font-size:16px;font-weight:700;text-decoration:none;border-radius:12px;transition:all 0.4s; text-transform: uppercase;}
.cta-btn:hover{transform:translateY(-3px);background:#116379; }
.cta-stats{display:flex;justify-content:center;gap:48px;margin-top:48px;flex-wrap:wrap}
.cta-stat{text-align:center}
.cta-stat-val{font-family:'Montserrat',sans-serif;font-size:32px;font-weight:900;color:var(--teal)}
.cta-stat-lbl{font-size:12px;color:var(--text-muted);margin-top:4px}

/* CONTACTS */
.contacts{display:flex;gap:20px;justify-content:center;margin-top:36px;flex-wrap:wrap}
.contact{background:var(--card);border:1px solid var(--card-border);border-radius:14px;padding:20px 28px;text-align:center;backdrop-filter:blur(10px);transition:all 0.3s;min-width:200px}
.contact:hover{transform:translateY(-4px);}
.contact h4{font-family:'Montserrat',sans-serif;font-size:15px;font-weight:700;color:var(--text)}
.contact .role{font-size: 12px;color:var(--teal);font-weight:600;margin:4px 0 8px;letter-spacing:1px}
.contact .info{font-size: 13px;color:var(--text-muted);line-height:1.7}

/* ═══════ RESPONSIVE ═══════ */
@media(max-width:900px){
  .split{grid-template-columns:1fr;gap:24px}
  .split-trio{grid-template-columns:1fr;gap:24px}
  .split-double{grid-template-columns:1fr;gap:24px}
  .expand-grid{grid-template-columns:1fr 1fr}
  #threeWins{grid-template-columns:1fr!important}
  .expand-card.open{grid-column:1/-1}
  .phases{grid-template-columns:1fr}
  .replace-grid{grid-template-columns:1fr}
  .flip-grid{grid-template-columns:1fr 1fr;gap:12px}
  .flip-tile{height:450px}
  .h-timeline{flex-direction:column;gap:16px}
  .h-timeline::before{display:none}
  .rev-bars{height:200px}
  .nav-dots{display:none}
  .fire {margin-top:25px;}
  .s1-description{margin-bottom: 20px;}
}
@media screen and (max-width: 932px) and (orientation: landscape){
  .panel-inner {padding-top: 450px;}
  .lifestylistic-icon {padding-top:150px;}
}

@media(max-width:600px){
  .panel{padding:60px 16px 70px;align-items:flex-start}
  .panel-inner{overflow-y:auto;max-height:calc(100vh - 130px);padding-bottom:20px;-webkit-overflow-scrolling:touch}
  .expand-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
  #threeWins{grid-template-columns:1fr!important}
  .expand-card{padding:16px 12px!important}
  .ec-icon{font-size:22px!important;margin-bottom:6px!important}
  .ec-icon img{width:24px;height:24px}
  .ec-title{font-size: 14px!important}
  .ec-preview{font-size: 12px!important}
  .stat-row{gap:10px;flex-direction:column;align-items:center}
  .stat-block{min-width:200px;padding:12px 16px}
  .stat-val{font-size:clamp(24px,8vw,36px)!important}
  .stat-lbl{font-size: 12px!important}
  .hero h1{font-size:26px!important}
  .hero .subtitle{font-size: 14px}
  .split-text h2{font-size:22px!important}
  .split-text .lead{font-size: 14px!important}
  .split-trio-text h2{font-size:22px!important}
  .split-trio-text .lead{font-size: 14px!important}
  .split-double-text h2{font-size:22px!important}
  .split-double-text .lead{font-size: 14px!important}
  .eyebrow{font-size:10px!important;letter-spacing:3px!important}
  .flip-grid{grid-template-columns:1fr;gap:10px}
  .flip-tile{height:450px}
  .flip-instruction{font-size:10px;padding:8px 14px}
  .rev-bars{height:160px;gap:12px}
  .rev-bar-val{font-size:13px!important}
  .phases{gap:12px}
  .phase{padding:18px 16px}
  .eq-wrap{font-size:12px}
  .eq-head{padding:10px 16px;font-size:10px}
  .eq-row{padding:8px 16px;font-size: 13px}
  .contacts{flex-direction:column;gap:10px}
  .contact{min-width:unset;padding:14px 18px}
  .cta-stats{gap:20px}
  .cta-stat-val{font-size:24px}
  .cta-btn{padding:14px 32px;font-size:14px}
  .slide-counter{bottom:20px;right:16px;font-size:12px}
  .slide-counter span{font-size:18px}
  .arrow-hint{bottom:16px}
  .arrow-btn{width:38px;height:38px;font-size:15px}
  .compare-rows{gap:8px}
  .cmp-bad,.cmp-good{padding:10px 14px;font-size: 13px}
  .replace-grid{grid-template-columns:1fr 1fr!important;gap:10px}
  .rep-card{padding:12px}
  .rep-from{font-size: 12px}
  .rep-to{font-size: 14px}
  .cards-grid{grid-template-columns:1fr 1fr!important;gap:10px!important}
  .card{padding:16px 14px}
  .card h3{font-size: 15px!important}
  .card p{font-size: 13px!important}
  .h-timeline{gap:12px}
  .tl-step h3{font-size:13px}
  .tl-step p{font-size: 12px}
  .tl-num{width:44px;height:44px;font-size:18px}
  .section-header{padding:24px 20px}
  .section-header h2{font-size:22px!important}
  .section-header .lead{font-size: 14px!important}
  .step{padding:16px;gap:14px}
  .step h3{font-size: 15px}
  .step p{font-size: 13px}
  .step-num{width:40px;height:40px;font-size:18px}
  .chart {gap: 24px; margin-top: 30px; }
.bar-wrap {width: 500px; }
.bar { width: 55px; }
.section {margin-bottom: 400px;}
.lifestylistic-icon {width: 75px;}
.fw-center-logo {width: 50px;}
  .fire {margin-top:25px;}
  .s1-description{margin-bottom: 20px;}
}

.wrap { max-width: 1360px; margin: 0 auto; padding: 40px 24px 60px; }
.page-note { text-align:center; font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--dim); margin-bottom:22px; }

/* ====== SLIDE FRAME (16:9, deck-ready) ====== */
.slide-holder { margin: 0 auto 36px; max-width: 1280px; }
.slide {
  width: 1280px; height: 720px; background: none;
  border: 0px solid var(--card-border); border-radius: 6px; position: relative; overflow: hidden;
  transform-origin: top left;
}
.slide::before {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0.45;
  background-image: radial-gradient(rgba(22,48,58,0.10) 1px, transparent 1px);
  background-size: 42px 42px;
}
.slide-label { font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: var(--dim); margin: 0 0 8px 2px; }

/* chips */
.src-chip {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
  color: var(--teal-deep); background: rgba(50,197,240,0.10);
  border: 1px solid rgba(4,101,122,0.30); border-radius: 999px; padding: 3px 10px;
  white-space: nowrap;
}
.src-chip.gov { 
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
  color: var(--teal-deep); background: rgba(50,197,240,0.10);
  border: 1px solid rgba(4,101,122,0.30); border-radius: 999px; padding: 3px 10px;
  white-space: nowrap;
}
.src-chip::before { content:"✓"; font-size: 11px; }

/* ── Slide 1 layout ── */
.s1-head { position:absolute; top:120px; left:56px; right:56px; }
.s1-eyebrow { font-size:14px; font-weight:700; letter-spacing:4px; color:#116379; text-transform:uppercase; }
.s1-title { 
  font-family: 'Montserrat', 'Segoe UI', system-ui, sans-serif;
  font-size: clamp(26px,4vw,40px);
  font-weight: 800;
  line-height: 1.06;
  color: #2a3c4e;
  margin-bottom: 10px;
  margin-top: 10px;
  text-shadow: 0 1px 0 #fff;
  letter-spacing: -1.5px;
  animation: fadeUp 0.7s ease 0.2s both;
  text-transform: uppercase; }
.s1-title b { font-weight:800; color:var(--teal-deep); }
.s1-description { font-size: 18px; font-weight: 500; color: var(--muted); line-height: 1.6; margin-top: -20px; }

.hero-block { position:relative; }
.hero-num { font-size:75px; font-weight:900; color:var(--teal-deep); line-height:0.95; letter-spacing:-6px;
  text-shadow: 0 1px 0 #fff; }
.hero-cap { font-size:19px; font-weight:600; color:#116379; margin-top:10px; line-height:1.4; }
.hero-sub { font-size:16px;font-weight: 500;color:var(--muted); margin-top:6px; }
.hero-chips { margin-top:14px; display:flex; flex-direction:column; gap:8px; align-items:flex-start; }
.hero-facts { display:flex; gap:26px; margin-top:22px; }
.hero-fact .hf-v { font-size:28px; font-weight:800; color:#116379; }
.hero-fact .hf-l { font-size:12px; font-weight:500;color:var(--dim); margin-top:2px; }

.seg-block { position:relative;}
.seg-title { font-size:14px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:#116379; margin-bottom:10px; margin-top: 15px; }
.seg-row { margin-bottom:24px; }
.seg-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:5px; }
.seg-name { font-size:16px; font-weight:700; color:var(--ink); }
.seg-val { font-size:22px; font-weight:800; color:var(--ink); }
.seg-bar { height:20px; border-radius:0 4px 4px 0; background:var(--series); }
.seg-meta { display:flex; justify-content:space-between; align-items:center; margin-top:5px; }
.seg-note { font-size:12px; color:var(--dim); }

.slide-foot {
  position:absolute; left:56px; right:56px; bottom:26px;
  display:flex; justify-content:space-between; align-items:center;
  border-top:1px solid var(--grid); padding-top:12px;
}
.foot-note { font-size:10px; color:var(--dim); letter-spacing:0.4px; }
.foot-brand { display:flex; align-items:center; gap:10px; }
.foot-brand img.fb-s { height:20px; }
.foot-brand .fb-sep { width:1px; height:20px; background:rgba(14,34,48,0.16); }
.foot-brand img.fb-l { height:21px; }

/* ── Slide 2 layout ── */
.s2-chart { position:absolute; left:56px; top:170px; width:750px; }
.s2-side { position:absolute; left:850px; right:56px; top:176px; display:flex; flex-direction:column; gap:16px; }
.side-tile { background:rgba(50,197,240,0.06); border:1px solid var(--card-border); border-radius:12px; padding:16px 18px; }
.side-tile .st-v { font-size:30px; font-weight:800; color:var(--teal-deep); line-height:1; }
.side-tile .st-l { font-size:12px; color:var(--muted); margin:5px 0 8px; line-height:1.4; }
svg text { font-family:'Montserrat','Segoe UI',system-ui,sans-serif; }
.bar-hit { cursor:default; }
#tip { position:fixed; z-index:50; pointer-events:none; display:none; background:var(--ink); color:#fff;
  border-radius:8px; padding:8px 12px; font-size:12.5px; line-height:1.45; box-shadow:0 10px 26px rgba(14,34,48,0.3); }
#tip b { font-size:14px; }

/* ====== APPENDIX ====== */
.appendix { max-width:1280px; margin:0 auto; background:var(--surface); border:1px solid var(--card-border); border-radius:14px; padding:30px 34px; }
.appendix h2 { font-size:15px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--teal-deep); margin-bottom:6px; }
.appendix .a-sub { font-size:12.5px; color:var(--muted); margin-bottom:18px; }
.ev-table { width:100%; border-collapse:collapse; font-size:12px; }
.ev-table th { text-align:left; font-size:10px; letter-spacing:1.5px; text-transform:uppercase; color:var(--dim); padding:8px 10px; border-bottom:2px solid var(--grid); }
.ev-table td { padding:10px; border-bottom:1px solid var(--grid); vertical-align:top; color:var(--text); line-height:1.5; }
.ev-table td.fig { font-weight:700; color:var(--ink); white-space:nowrap; font-variant-numeric:tabular-nums; }
.tier { display:inline-block; font-size:9px; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:2px 8px; border-radius:4px; white-space:nowrap; }
.tier.t1 { background:rgba(0,99,0,0.10); color:#084d08; }
.tier.t2 { background:rgba(4,101,122,0.10); color:var(--teal-deep); }
.tier.t3 { background:rgba(237,161,0,0.13); color:#8a6100; }
.method { margin-top:18px; font-size:11.5px; color:var(--dim); line-height:1.65; border-top:1px solid var(--grid); padding-top:14px; }
.method b { color:var(--muted); }

/* left column — the relationship */
.rel { left: 56px; margin-top: -20px;}
.rel-mark { font-size: 40px; font-weight: 900; 
  color: #2a3c4e; letter-spacing: -1px; line-height: 1.1; text-transform: uppercase;
  text-shadow: 0 1px 0 #fff; }
.rel-mark .x { color: var(--sky); font-weight: 700; }
.rel-mark-title { font-size: 24px; font-weight: 800; 
  color: #2a3c4e; letter-spacing: -1px; line-height: 1.2; text-transform: uppercase;
  text-shadow: 0 1px 0 #fff; }
.rel-chip {
  display: inline-block; margin-top: 14px; font-size: 12px; font-weight: 800;
  letter-spacing: 1.6px; text-transform: uppercase; color: var(--teal);
  border: 1.5px solid var(--teal); border-radius: 999px; padding: 6px 16px;
}
.rel-lede { font-size: 15.5px;font-weight: 500; color: var(--muted); line-height: 1.65; margin-top: 18px; }
.rel-lede b { color: var(--ink); }
.rel-take {
  margin-top: 22px; border-radius: 12px; padding: 18px 20px;
  color: #2a3c4e; font-size: 14.5px; line-height: 1.55; font-weight: 500; border: 1.5px solid var(--sky); background: rgba(50,197,240,0.09)
}
.rel-take b { color: #2a3c4e; }



/* right column — the firepower grid */
.fire { position: relative; }
.fire-title { font-size: 12px; font-weight: 700; letter-spacing: 2.5px; text-transform: uppercase; color: var(--dim); margin-bottom: 14px; }
.fgrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.fcell { text-align:center;padding:20px 28px;background:var(--card);border:1px solid var(--card-border);border-radius:16px;backdrop-filter:blur(12px);min-width:140px;word-wrap:break-word;overflow-wrap:break-word}
.fcell .fv { font-size: 34px; font-weight: 900; color: var(--teal); line-height: 1; letter-spacing: -1px; }
.fcell .fl { font-size: 12px; font-weight: 500;color: var(--ink); margin-top: 6px; line-height: 1.4; }
.fcell.hot { border: 1.5px solid var(--sky); background: rgba(50,197,240,0.09); }
.fcell.hot .fv { color: #2a3c4e; }

/* brand strip */
.brands { margin-top: 18px; }
.brands .b-title { font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--dim); margin-bottom: 8px; }
.b-row { display: flex; flex-wrap: wrap; gap: 8px; }
.b-pill {
  font-size: 12px; font-weight: 700; letter-spacing: 0.8px; color: var(--teal);
  background: #fff; border: 1px solid var(--card-border); border-radius: 999px; padding: 6px 14px;
}

/* ====== BRAND MATCH — styl.inc ====== */
/* ====== NETWORK BACKGROUND ====== */
body::before {
  content: url("");
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  z-index: 0;
  pointer-events: none;
  background: #C9D6FF;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #E2E2E2, #e0eaee);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #E2E2E2, #e0eaee); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

/* ====== PLAIN-ENGLISH HELP (the ? buttons) ====== */
.qm { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; border-radius:50%;
  border:1px solid #32C5F0; background:rgba(50,197,240,0.12); color:#32C5F0; font-size:11px; font-weight:700;
  line-height:1; cursor:pointer; margin-left:5px; vertical-align:middle; padding:0; font-family:inherit;
  text-transform:none; letter-spacing:0; }
.qm:hover { background:#32C5F0; color:#fff; }
#help-pop { position:fixed; z-index:2000; max-width:320px; background:#fff; border:1px solid rgba(50,197,240,0.45);
  border-radius:10px; padding:14px 16px; box-shadow:0 16px 40px rgba(14,34,48,0.2); display:none; text-align:left; }
#help-pop h5 { font-size:13px; font-weight:700; color:#0e2230; margin:0 0 6px; font-family:inherit; letter-spacing:0.3px; text-transform:none; }
#help-pop p { font-size:13px; color:#4a6670; line-height:1.55; margin:0; text-transform:none; letter-spacing:0; }