/* RsquareGames Insights — isolated page styles.
   Deliberately avoids generic header/footer/section selectors used by legacy styles.css. */
/* Full-bleed page reset: remove the browser's default 8px body margin,
   which otherwise exposes the white browser canvas at the page corners. */
html, body {
  width: 100%;
  min-height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  background: #080e18 !important;
}

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

.ins-page{
 --ins-bg:#080e18;--ins-panel:#101b2a;--ins-panel2:#142338;--ins-text:#f3f7fb;
 --ins-muted:#a7b6c8;--ins-line:rgba(173,199,224,.14);--ins-accent:#49d6c5;--ins-blue:#6aa9ff;
 display:block;width:100%;min-height:100vh;margin:0;padding:0;overflow:hidden;
 background:var(--ins-bg);color:var(--ins-text);font-family:'DM Sans',Arial,sans-serif;
 font-size:16px;line-height:1.6;text-align:left;
}
.ins-page,.ins-page *{box-sizing:border-box}
.ins-page h1,.ins-page h2,.ins-page h3,.ins-page p{margin-top:0}
.ins-page h1,.ins-page h2,.ins-page h3{font-family:'Space Grotesk','DM Sans',Arial,sans-serif;letter-spacing:-.035em;color:var(--ins-text);font-weight:700}
.ins-page a{font-family:inherit}
.ins-page .ins-wrap{width:min(1160px,calc(100% - 48px));margin-left:auto;margin-right:auto}
.ins-page .ins-hero{display:block;width:100%;margin:0;padding:94px 0 64px;text-align:left;background:radial-gradient(ellipse at 78% 10%,rgba(73,214,197,.13),transparent 38%),radial-gradient(ellipse at 10% 70%,rgba(106,169,255,.11),transparent 35%)}
.ins-page .ins-eyebrow{display:block;color:var(--ins-accent);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:0 0 18px}
.ins-page .ins-hero h1{max-width:850px;margin:0 0 20px;font-size:clamp(40px,6vw,72px);line-height:1.04}
.ins-page .ins-hero p{max-width:720px;margin:0;color:var(--ins-muted);font-size:18px;line-height:1.8}
.ins-page .ins-rule{height:1px;width:100%;background:var(--ins-line)}
.ins-page .ins-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding:48px 0 88px}
.ins-page .ins-card{display:flex;flex-direction:column;min-width:0;min-height:320px;padding:28px;border:1px solid var(--ins-line);border-radius:20px;background:linear-gradient(145deg,rgba(20,35,56,.98),rgba(13,23,37,.98));color:var(--ins-text);text-decoration:none;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.ins-page .ins-card:hover{transform:translateY(-4px);border-color:rgba(73,214,197,.6);background:linear-gradient(145deg,#172b43,#101d2d)}
.ins-page .ins-card .ins-cat{display:block;color:var(--ins-accent);font-size:11px;letter-spacing:.13em;font-weight:700}
.ins-page .ins-card h2{font-size:24px;line-height:1.25;margin:18px 0 12px}
.ins-page .ins-card p{margin:0;color:var(--ins-muted);font-size:14px;line-height:1.8}
.ins-page .ins-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:26px;color:#91a5ba;font-size:12px}
.ins-page .ins-arrow{color:var(--ins-accent);font-weight:700;white-space:nowrap}
.ins-page .ins-cta{display:block;margin:0 0 82px;padding:42px;border:1px solid var(--ins-line);border-radius:22px;background:linear-gradient(120deg,rgba(73,214,197,.10),rgba(106,169,255,.08));text-align:left}
.ins-page .ins-cta h2{font-size:30px;line-height:1.2;margin:0 0 12px}
.ins-page .ins-cta p{max-width:680px;margin:0;color:var(--ins-muted);line-height:1.8}
.ins-page .ins-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:20px;padding:13px 20px;border-radius:999px;background:var(--ins-accent);color:#06131b;text-decoration:none;font-weight:700}
.ins-page .ins-article-hero{display:block;margin:0;padding:74px 0 48px;background:radial-gradient(ellipse at 80% 10%,rgba(73,214,197,.12),transparent 42%);text-align:left}
.ins-page .ins-back{display:inline-block;margin:0 0 28px;color:var(--ins-accent);text-decoration:none;font-weight:600}
.ins-page .ins-article-hero h1{max-width:900px;margin:0 0 18px;font-size:clamp(38px,5vw,62px);line-height:1.08}
.ins-page .ins-article-hero .ins-deck{max-width:780px;margin:0;color:var(--ins-muted);font-size:19px;line-height:1.8}
.ins-page .ins-article-meta{margin-top:24px;color:#8fa4b9;font-size:13px}
.ins-page .ins-article-layout{display:grid;grid-template-columns:minmax(0,780px) 260px;gap:72px;padding-top:48px;padding-bottom:90px}
.ins-page .ins-prose{min-width:0;color:#c6d2df;font-size:17px;line-height:1.9}
.ins-page .ins-prose p{margin:0 0 25px;color:#c6d2df}
.ins-page .ins-prose h2{margin:42px 0 14px;font-size:27px;line-height:1.25}
.ins-page .ins-aside{position:sticky;top:30px;align-self:start;padding:24px;border:1px solid var(--ins-line);border-radius:18px;background:var(--ins-panel)}
.ins-page .ins-aside h3{font-size:18px;line-height:1.3;margin:0 0 14px}
.ins-page .ins-aside p{margin:0 0 14px;color:var(--ins-muted);font-size:14px;line-height:1.75}
.ins-page .ins-aside a{color:var(--ins-accent);text-decoration:none;font-weight:700}
.ins-page .ins-footer{display:block;width:100%;margin:0;padding:26px 0 36px;border-top:1px solid var(--ins-line);background:#080e18;color:#8295a9;font-size:13px}
@media(max-width:900px){
 .ins-page .ins-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ins-page .ins-article-layout{grid-template-columns:1fr;gap:30px}
 .ins-page .ins-aside{position:static;max-width:540px}
}
@media(max-width:620px){
 .ins-page .ins-wrap{width:calc(100% - 32px)}
 .ins-page .ins-hero{padding:64px 0 44px}
 .ins-page .ins-hero p{font-size:16px}
 .ins-page .ins-grid{grid-template-columns:1fr;gap:14px;padding:30px 0 60px}
 .ins-page .ins-card{min-height:270px;padding:24px}
 .ins-page .ins-cta{padding:26px;margin-bottom:60px}
 .ins-page .ins-cta h2{font-size:26px}
 .ins-page .ins-article-hero{padding:56px 0 36px}
 .ins-page .ins-article-hero h1{font-size:clamp(36px,10vw,48px)}
 .ins-page .ins-article-hero .ins-deck{font-size:16px}
 .ins-page .ins-article-layout{padding-top:30px;padding-bottom:64px}
 .ins-page .ins-prose{font-size:16px}
 .ins-page .ins-prose h2{font-size:24px;margin-top:34px}
}


/* Footer sits after the .ins-page main element in the HTML, so style it directly.
   This prevents legacy site footer rules from painting a white block. */
.ins-footer {
  display: block !important;
  width: 100% !important;
  min-height: 86px;
  margin: 0 !important;
  padding: 26px 0 36px !important;
  border-top: 1px solid rgba(173,199,224,.14) !important;
  background: #080e18 !important;
  color: #8295a9 !important;
  font-family: 'DM Sans', Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  text-align: left !important;
}
.ins-footer .ins-wrap {
  width: min(1160px, calc(100% - 48px));
  margin-left: auto;
  margin-right: auto;
}

/* Final structural safeguard: page main and its footer share one dark canvas. */
html, body { margin:0!important; padding:0!important; min-height:100vh!important; background:#080e18!important; }
.ins-page { width:100%!important; min-height:100vh!important; background:#080e18!important; }
.ins-page .ins-footer { background:#080e18!important; color:#8295a9!important; width:100%!important; }