/* extracted from insights.html — shared by hub + article pages */


    /* ── Hero ── */
    .insights-hero {
      padding: calc(var(--nav) + 90px) 0 100px;
      background: var(--bg);
      position: relative; overflow: hidden;
    }
    .insights-hero-bg {
      position: absolute; inset: 0;
      background: url('img/bto.jpg') center 55% / cover no-repeat; background-image: image-set(url('img/bto.webp') type('image/webp'), url('img/bto.jpg') type('image/png'));
      opacity: 0.55; filter: saturate(0.7) brightness(0.75);
    }
    .insights-hero-glow {
      position: absolute; inset: 0; pointer-events: none;
      background:
        linear-gradient(to bottom, rgba(3,7,26,0.70) 0%, rgba(3,7,26,0.30) 40%, rgba(3,7,26,0.88) 100%),
        linear-gradient(to right, rgba(3,7,26,0.75) 0%, rgba(3,7,26,0.20) 60%, rgba(3,7,26,0.05) 100%),
        radial-gradient(ellipse 55% 65% at 10% 50%, rgba(77,114,255,0.12) 0%, transparent 65%);
    }
    .insights-hero-inner {
      position: relative; z-index: 2;
      max-width: 1160px; margin: 0 auto; padding: 0 40px;
    }
    .ins-eyebrow {
      font-family: var(--mono); font-size: 10px; font-weight: 500;
      letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--blue-bright); margin-bottom: 20px;
      display: flex; align-items: center; gap: 10px;
    }
    .ins-eyebrow-dot {
      width: 6px; height: 6px; border-radius: 50%;
      background: var(--blue-bright);
      box-shadow: 0 0 8px rgba(77,114,255,0.8);
      animation: ins-pulse 2s ease-in-out infinite;
      flex-shrink: 0;
    }
    @keyframes ins-pulse {
      0%,100% { opacity: 1; transform: scale(1); }
      50% { opacity: 0.5; transform: scale(0.75); }
    }
    .insights-title {
      font-family: var(--display);
      font-size: clamp(34px, 5.5vw, 68px);
      font-weight: 800; letter-spacing: -0.03em;
      line-height: 1.05; color: var(--off-white);
      margin-bottom: 24px; max-width: 820px;
    }
    .insights-title em { font-style: normal; color: var(--blue-bright); }
    .insights-sub {
      font-family: var(--body); font-size: clamp(15px, 1.8vw, 18px);
      color: var(--muted); line-height: 1.65;
      max-width: 560px; margin-bottom: 48px;
    }
    .ins-hero-stats {
      display: flex; gap: 40px; flex-wrap: wrap; margin-bottom: 0;
    }
    .ins-hero-stat { display: flex; flex-direction: column; gap: 4px; }
    .ins-hero-stat-val {
      font-family: var(--display); font-size: 28px;
      font-weight: 800; color: var(--blue-bright); letter-spacing: -0.02em;
    }
    .ins-hero-stat-lbl {
      font-family: var(--mono); font-size: 10px;
      color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase;
    }
    .ins-hero-cards {
      display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
      margin-top: 44px;
    }
    .ins-hero-card {
      background: rgba(255,255,255,0.035);
      border: 1px solid rgba(77,114,255,0.15);
      border-radius: 12px; padding: 20px 18px;
      backdrop-filter: blur(10px);
      transition: transform 0.2s, border-color 0.2s;
    }
    .ins-hero-card:hover { transform: translateY(-3px); }
    .ins-hero-card-num {
      font-family: var(--mono); font-size: 10px; font-weight: 700;
      letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 8px;
    }
    .ins-hero-card-title {
      font-family: var(--display); font-size: 13px; font-weight: 700;
      color: var(--off-white); margin-bottom: 7px; line-height: 1.3;
    }
    .ins-hero-card-body {
      font-family: var(--body); font-size: 12px;
      color: var(--muted); line-height: 1.55;
    }
    .ins-hero-card[data-insight="stocks"] { border-top: 3px solid rgba(0,232,123,0.55); }
    .ins-hero-card[data-insight="stocks"] .ins-hero-card-num { color: rgba(0,232,123,0.85); }
    .ins-hero-card[data-insight="gdp"]    { border-top: 3px solid rgba(77,114,255,0.55); }
    .ins-hero-card[data-insight="gdp"]    .ins-hero-card-num { color: rgba(77,114,255,0.85); }
    .ins-hero-card[data-insight="launch"] { border-top: 3px solid rgba(232,192,64,0.55); }
    .ins-hero-card[data-insight="launch"] .ins-hero-card-num { color: rgba(232,192,64,0.85); }
    .ins-hero-card[data-insight="govt"]   { border-top: 3px solid rgba(168,85,247,0.55); }
    .ins-hero-card[data-insight="govt"]   .ins-hero-card-num { color: rgba(168,85,247,0.85); }
    /* Active card state */
    .ins-hero-card { position: relative; }
    .ins-hero-card.active {
      background: rgba(255,255,255,0.11);
      transform: translateY(-5px);
    }
    .ins-hero-card.active::after {
      content: '● VIEWING';
      display: block;
      font-family: var(--mono); font-size: 9px; font-weight: 700;
      letter-spacing: 0.14em; text-transform: uppercase; margin-top: 12px;
    }
    .ins-hero-card[data-insight="stocks"].active { border-color: rgba(0,232,123,0.75);  box-shadow: 0 8px 32px rgba(0,232,123,0.22), 0 0 0 1px rgba(0,232,123,0.4); }
    .ins-hero-card[data-insight="stocks"].active::after { color: var(--green); }
    .ins-hero-card[data-insight="gdp"].active    { border-color: rgba(77,114,255,0.75); box-shadow: 0 8px 32px rgba(77,114,255,0.22), 0 0 0 1px rgba(77,114,255,0.4); }
    .ins-hero-card[data-insight="gdp"].active::after    { color: var(--blue-bright); }
    .ins-hero-card[data-insight="launch"].active { border-color: rgba(232,192,64,0.75); box-shadow: 0 8px 32px rgba(232,192,64,0.22), 0 0 0 1px rgba(232,192,64,0.4); }
    .ins-hero-card[data-insight="launch"].active::after { color: var(--amber); }
    .ins-hero-card[data-insight="govt"].active   { border-color: rgba(168,85,247,0.75); box-shadow: 0 8px 32px rgba(168,85,247,0.22), 0 0 0 1px rgba(168,85,247,0.4); }
    .ins-hero-card[data-insight="govt"].active::after   { color: #A855F7; }

    /* ── Segment filter bar ── */
    .ins-seg-bar {
      display: flex; flex-wrap: wrap; gap: 8px;
      margin: 36px 0 32px;
    }
    .ins-seg-btn {
      font-family: var(--mono); font-size: 10px; font-weight: 600;
      letter-spacing: 0.14em; text-transform: uppercase;
      padding: 7px 16px; border-radius: 999px; cursor: pointer;
      border: 1px solid rgba(77,114,255,0.25);
      background: rgba(77,114,255,0.07); color: var(--muted);
      transition: background 0.18s, border-color 0.18s, color 0.18s;
    }
    .ins-seg-btn:hover { border-color: rgba(77,114,255,0.55); color: var(--off-white); }
    .ins-seg-btn.active {
      background: var(--blue-bright); color: #fff;
      border-color: var(--blue-bright);
      box-shadow: 0 0 12px rgba(77,114,255,0.4);
    }
    /* Hidden card when segment-filtered */
    .ins-hero-card.seg-hidden {
      display: none;
    }
    @media (max-width: 560px) { .ins-seg-bar { gap: 6px; } }

    /* ── Insight 05–07: Condo / HDB / Landed ── */
    .ins-hero-card[data-insight="condo"]        { border-top: 3px solid rgba(34,211,238,0.55); }
    .ins-hero-card[data-insight="condo"]        .ins-hero-card-num { color: rgba(34,211,238,0.85); }
    .ins-hero-card[data-insight="hdb-insights"] { border-top: 3px solid rgba(251,146,60,0.55); }
    .ins-hero-card[data-insight="hdb-insights"] .ins-hero-card-num { color: rgba(251,146,60,0.85); }
    .ins-hero-card[data-insight="landed"]       { border-top: 3px solid rgba(201,168,76,0.55); }
    .ins-hero-card[data-insight="landed"]       .ins-hero-card-num { color: rgba(201,168,76,0.85); }
    .ins-hero-card[data-insight="condo"].active        { border-color: rgba(34,211,238,0.75);  box-shadow: 0 8px 32px rgba(34,211,238,0.22),  0 0 0 1px rgba(34,211,238,0.4); }
    .ins-hero-card[data-insight="condo"].active::after        { color: #22D3EE; }
    .ins-hero-card[data-insight="hdb-insights"].active { border-color: rgba(251,146,60,0.75);  box-shadow: 0 8px 32px rgba(251,146,60,0.22),  0 0 0 1px rgba(251,146,60,0.4); }
    .ins-hero-card[data-insight="hdb-insights"].active::after { color: #FB923C; }
    .ins-hero-card[data-insight="landed"].active       { border-color: rgba(201,168,76,0.75);  box-shadow: 0 8px 32px rgba(201,168,76,0.22),  0 0 0 1px rgba(201,168,76,0.4); }
    .ins-hero-card[data-insight="landed"].active::after       { color: #C9A84C; }
    /* Tab active underline colours for new tabs */
    .tab-btn[data-tab="condo"].active        { border-bottom-color: #22D3EE; color: #22D3EE; }
    .tab-btn[data-tab="hdb-insights"].active { border-bottom-color: #FB923C; color: #FB923C; }
    .tab-btn[data-tab="landed"].active       { border-bottom-color: #C9A84C; color: #C9A84C; }
    .tab-btn[data-tab="rental"].active       { border-bottom-color: #15E89A; color: #15E89A; }
    /* Insight 08 hero card — rental */
    .ins-hero-card[data-insight="rental"]        { border-top: 3px solid rgba(21,232,154,0.55); }
    .ins-hero-card[data-insight="rental"]        .ins-hero-card-num { color: rgba(21,232,154,0.85); }
    .ins-hero-card[data-insight="rental"].active { border-color: rgba(21,232,154,0.75); box-shadow: 0 8px 32px rgba(21,232,154,0.22), 0 0 0 1px rgba(21,232,154,0.4); }
    .ins-hero-card[data-insight="rental"].active::after { color: #15E89A; }

    /* ── POV insight cards — shared design with launches.html / hdb-market.html ── */
    .il-pov-grid {
      display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; margin-top: 32px;
    }
    @media (max-width: 860px) { .il-pov-grid { grid-template-columns: 1fr; } }
    .il-pov-card {
      background: var(--bg3); border: 1px solid var(--blue-border); border-left: 3px solid;
      border-radius: 12px; padding: 26px 28px 24px;
      display: flex; flex-direction: column; gap: 14px;
      position: relative; overflow: hidden; transition: background 0.15s;
    }
    .il-pov-card::before { content:''; position:absolute; inset:0; opacity:0; transition:opacity 0.15s; border-radius:12px; }
    .il-pov-card:hover::before { opacity:1; }
    .il-pov-card.c-red   { border-left-color: var(--red); }
    .il-pov-card.c-green { border-left-color: var(--green); }
    .il-pov-card.c-amber { border-left-color: var(--amber); }
    .il-pov-card.c-blue  { border-left-color: var(--blue-bright); }
    .il-pov-card.c-cyan  { border-left-color: #22D3EE; }
    .il-pov-card.c-orange{ border-left-color: #FB923C; }
    .il-pov-card.c-gold  { border-left-color: #C9A84C; }
    .il-pov-card.c-yield { border-left-color: #15E89A; }
    .il-pov-card.c-red::before    { background: rgba(255,77,77,0.03); }
    .il-pov-card.c-green::before  { background: rgba(0,232,123,0.03); }
    .il-pov-card.c-amber::before  { background: rgba(232,192,64,0.03); }
    .il-pov-card.c-blue::before   { background: rgba(77,114,255,0.03); }
    .il-pov-card.c-cyan::before   { background: rgba(34,211,238,0.03); }
    .il-pov-card.c-orange::before { background: rgba(251,146,60,0.03); }
    .il-pov-card.c-gold::before   { background: rgba(201,168,76,0.03); }
    .il-pov-card.c-yield::before  { background: rgba(21,232,154,0.03); }
    .il-pov-card-top { display:flex; align-items:center; gap:10px; }
    .il-pov-num { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.12em; color:rgba(255,255,255,0.22); }
    .il-pov-tag {
      font-family:var(--mono); font-size:9px; font-weight:700; letter-spacing:0.22em;
      text-transform:uppercase; padding:3px 9px; border-radius:20px;
    }
    .il-pov-tag.c-red    { color:var(--red);         background:rgba(255,77,77,0.12);  border:1px solid rgba(255,77,77,0.28); }
    .il-pov-tag.c-green  { color:var(--green);       background:rgba(0,232,123,0.12);  border:1px solid rgba(0,232,123,0.28); }
    .il-pov-tag.c-amber  { color:var(--amber);       background:rgba(232,192,64,0.12); border:1px solid rgba(232,192,64,0.28); }
    .il-pov-tag.c-blue   { color:var(--blue-bright); background:rgba(77,114,255,0.12); border:1px solid rgba(77,114,255,0.28); }
    .il-pov-tag.c-cyan   { color:#22D3EE; background:rgba(34,211,238,0.12);  border:1px solid rgba(34,211,238,0.28); }
    .il-pov-tag.c-orange { color:#FB923C; background:rgba(251,146,60,0.12);  border:1px solid rgba(251,146,60,0.28); }
    .il-pov-tag.c-gold   { color:#C9A84C; background:rgba(201,168,76,0.12);  border:1px solid rgba(201,168,76,0.28); }
    .il-pov-tag.c-yield  { color:#15E89A; background:rgba(21,232,154,0.12);  border:1px solid rgba(21,232,154,0.28); }
    .il-pov-headline {
      font-family:var(--display); font-size:clamp(16px,2vw,19px);
      font-weight:700; letter-spacing:-0.02em; color:var(--white); line-height:1.25; margin:0;
    }
    .il-pov-data { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px; }
    .il-pov-data li {
      font-family:var(--body); font-size:13px; color:var(--off-white);
      line-height:1.55; padding-left:14px; position:relative;
    }
    .il-pov-data li::before { content:'·'; position:absolute; left:0; color:var(--muted2); font-weight:700; }
    .il-pov-data li strong { color:var(--white); font-weight:600; }
    .il-pov-implication {
      font-family:var(--body); font-size:13px; line-height:1.55; color:var(--muted);
      border-top:1px solid rgba(77,114,255,0.12); padding-top:14px; margin-top:auto;
    }
    .il-pov-implication strong { color:var(--off-white); font-weight:600; }
    .il-pov-as-of {
      font-family:var(--mono); font-size:10px; font-weight:600; letter-spacing:0.18em;
      text-transform:uppercase; color:var(--muted2); opacity:0.7; margin-top:6px;
    }

    @media (max-width: 900px) {
      .ins-hero-cards { grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 32px; }
    }
    @media (max-width: 600px) {
      .insights-hero-inner { padding: 0 20px; }
      .ins-hero-cards { grid-template-columns: 1fr; }
      .ins-hero-stats { gap: 24px; }
      .insights-title { font-size: 32px; }
    }

    /* ── Tab bar — matches launches.html nl-tabs style ── */
    .tab-bar-wrap {
      display: flex; gap: 4px; padding: 0 40px;
      border-bottom: 1px solid var(--blue-border);
      background: var(--bg2);
      position: sticky; top: var(--nav); z-index: 80;
      overflow-x: auto; scrollbar-width: none;
    }
    .tab-bar-wrap::-webkit-scrollbar { display: none; }
    .tab-btn {
      padding: 16px 24px; background: none; border: none;
      border-bottom: 2px solid transparent;
      font-family: var(--mono); font-size: 11px; font-weight: 700;
      letter-spacing: 0.1em; text-transform: uppercase;
      color: var(--muted2); cursor: pointer;
      transition: color 0.2s, border-color 0.2s;
      white-space: nowrap; margin-bottom: -1px; flex-shrink: 0;
    }
    .tab-btn:hover:not(.active) { color: var(--muted); }
    .tab-btn.active { color: var(--off-white); }
    .tab-btn[data-tab="stocks"].active { border-bottom-color: var(--green); color: var(--green); }
    .tab-btn[data-tab="gdp"].active    { border-bottom-color: var(--blue-bright); color: var(--blue-bright); }
    .tab-btn[data-tab="launch"].active { border-bottom-color: var(--amber); color: var(--amber); }
    .tab-btn[data-tab="govt"].active   { border-bottom-color: #A855F7; color: #A855F7; }

    /* ── Panes ── */
    .tab-pane { display: none !important; }
    .tab-pane.panel-open { display: block !important; }

    /* ── Section shell ── */
    .insight-section {
      max-width: var(--max); margin: 0 auto;
      padding: 52px 24px 88px;
    }

    /* ── Stat strip ── */
    .stat-strip {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      border: 1px solid var(--blue-border);
      border-radius: var(--R);
      overflow: hidden;
      margin-bottom: 48px;
    }
    @media (max-width: 680px) { .stat-strip { grid-template-columns: repeat(2, 1fr); } }
    .stat-cell {
      padding: 22px 16px; text-align: center;
      border-right: 1px solid var(--blue-border);
      background: var(--bg2);
      transition: background 0.2s;
    }
    .stat-cell:last-child { border-right: none; }
    .stat-cell:hover { background: rgba(77,114,255,0.07); }
    .stat-icon { font-size: 22px; display: block; margin-bottom: 8px; line-height: 1; }
    .stat-big { font-family: var(--mono); font-size: 26px; font-weight: 800; display: block; line-height: 1; margin-bottom: 5px; }
    .stat-lbl { font-size: 10px; color: var(--muted); font-family: var(--mono); letter-spacing: 0.05em; text-transform: uppercase; }
    .c-blue   { color: var(--blue-bright); }
    .c-green  { color: var(--green); }
    .c-amber  { color: var(--amber); }
    .c-gold   { color: #FFB800; }
    .c-purple { color: #A855F7; }
    .c-teal   { color: #06B6D4; }
    .c-red    { color: var(--red); }

    /* ── Section heading ── */
    .s-eyebrow {
      font-family: var(--mono); font-size: 10px;
      letter-spacing: 0.12em; color: var(--blue-bright);
      text-transform: uppercase; margin-bottom: 8px;
    }
    .s-title {
      font-family: var(--display);
      font-size: clamp(20px, 3.5vw, 32px);
      font-weight: 700; color: var(--white);
      line-height: 1.2; margin-bottom: 12px;
    }
    .s-body {
      font-size: 15px; color: var(--muted);
      line-height: 1.7; max-width: 700px; margin-bottom: 32px;
    }
    .s-body strong { color: var(--off-white); }
    .s-divider { border: none; border-top: 1px solid var(--blue-border); margin: 40px 0; }

    /* ── Leverage duo ── */
    .leverage-duo {
      display: grid; grid-template-columns: 1fr 56px 1fr;
      gap: 16px; align-items: center; margin: 32px 0;
    }
    @media (max-width: 640px) {
      .leverage-duo { grid-template-columns: 1fr; }
      .lev-vs { display: none; }
    }
    .lev-card { border-radius: var(--R); padding: 28px 24px; text-align: center; }
    .lev-card.stocks { background: rgba(107,130,192,0.07); border: 1px solid rgba(107,130,192,0.18); }
    .lev-card.property { background: rgba(0,232,123,0.07); border: 1px solid rgba(0,232,123,0.28); }
    .lev-label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 14px; }
    .lev-card.stocks .lev-label { color: var(--muted); }
    .lev-card.property .lev-label { color: var(--green); }
    .lev-roi { font-family: var(--mono); font-weight: 800; line-height: 1; margin-bottom: 12px; }
    .lev-card.stocks .lev-roi { font-size: 54px; color: var(--off-white); }
    .lev-card.property .lev-roi { font-size: 76px; color: var(--green); }
    .lev-desc { font-size: 12px; color: var(--muted); line-height: 1.7; }
    .lev-vs { font-family: var(--mono); font-size: 18px; font-weight: 700; color: var(--muted2); text-align: center; }

    /* ── Feature pills (colorful) ── */
    .feat-grid {
      display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
      gap: 12px; margin: 28px 0;
    }
    .feat-pill {
      border-radius: var(--R); padding: 18px 20px;
      display: flex; align-items: flex-start; gap: 14px; border: 1px solid;
    }
    .feat-pill.blue   { background: rgba(77,114,255,0.07);  border-color: rgba(77,114,255,0.22); }
    .feat-pill.green  { background: rgba(0,232,123,0.06);   border-color: rgba(0,232,123,0.22); }
    .feat-pill.amber  { background: rgba(232,192,64,0.07);  border-color: rgba(232,192,64,0.22); }
    .feat-pill.gold   { background: rgba(255,184,0,0.07);   border-color: rgba(255,184,0,0.22); }
    .feat-pill.purple { background: rgba(168,85,247,0.07);  border-color: rgba(168,85,247,0.22); }
    .feat-pill.teal   { background: rgba(6,182,212,0.07);   border-color: rgba(6,182,212,0.22); }
    .feat-icon { font-size: 22px; flex-shrink: 0; line-height: 1; margin-top: 1px; }
    .feat-text strong { display: block; font-size: 13px; font-weight: 600; color: var(--white); margin-bottom: 3px; }
    .feat-text span { font-size: 12px; color: var(--muted); line-height: 1.5; }

    /* ── Compare table ── */
    .compare-table { width: 100%; border-collapse: collapse; font-size: 13px; }
    .compare-table th {
      font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em;
      text-transform: uppercase; color: var(--muted); padding: 10px 14px;
      background: var(--bg2); border-bottom: 1px solid var(--blue-border); text-align: left;
    }
    .compare-table th.win-col { color: var(--blue-bright); }
    .compare-table td { padding: 11px 14px; border-bottom: 1px solid rgba(77,114,255,0.08); color: var(--off-white); vertical-align: middle; }
    .compare-table tr:last-child td { border-bottom: none; }
    .compare-table td:first-child { color: var(--muted); font-size: 12px; }
    .win-badge { display: inline-block; padding: 2px 7px; border-radius: 4px; font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: 0.06em; margin-right: 4px; background: rgba(77,114,255,0.12); color: var(--blue-bright); }
    .win-badge.green { background: rgba(0,232,123,0.12); color: var(--green); }

    /* ── Chart wrap ── */
    .chart-wrap {
      background: var(--bg2); border: 1px solid var(--blue-border);
      border-radius: var(--R); padding: 24px; margin: 28px 0;
    }
    .chart-title { font-family: var(--display); font-size: 14px; font-weight: 600; color: var(--white); margin-bottom: 4px; }
    .chart-subtitle { font-family: var(--mono); font-size: 10px; color: var(--muted); letter-spacing: 0.06em; margin-bottom: 16px; }
    .chart-legend { display: flex; gap: 20px; flex-wrap: wrap; margin-top: 14px; }
    .legend-item { display: flex; align-items: center; gap: 7px; font-family: var(--mono); font-size: 10px; color: var(--muted); }
    .legend-dot { width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; }

    /* ── Crisis recovery table ── */
    .crisis-table { width: 100%; border-collapse: collapse; font-size: 13px; margin: 20px 0; }
    .crisis-table th { font-family: var(--mono); font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); padding: 10px 14px; background: var(--bg2); border-bottom: 1px solid var(--blue-border); text-align: left; }
    .crisis-table td { padding: 10px 14px; border-bottom: 1px solid rgba(77,114,255,0.08); color: var(--off-white); }
    .crisis-table tr:last-child td { border-bottom: none; }
    .crisis-table td.drop { color: var(--red); font-family: var(--mono); font-weight: 700; }
    .crisis-table td.gap { color: var(--amber); font-family: var(--mono); font-weight: 700; }
    .crisis-table td.recovery { color: var(--green); font-family: var(--mono); font-weight: 700; }

    /* ── Callout ── */
    .callout {
      background: rgba(77,114,255,0.08); border: 1px solid var(--blue-border);
      border-left: 3px solid var(--blue-bright); border-radius: var(--R);
      padding: 20px 24px; margin: 28px 0;
    }
    .callout.green  { background: rgba(0,232,123,0.07);  border-color: rgba(0,232,123,0.2);  border-left-color: var(--green); }
    .callout.amber  { background: rgba(232,192,64,0.07); border-color: rgba(232,192,64,0.2); border-left-color: var(--amber); }
    .callout-label { font-family: var(--mono); font-size: 9px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--blue-bright); margin-bottom: 6px; }
    .callout.green  .callout-label { color: var(--green); }
    .callout.amber  .callout-label { color: var(--amber); }
    .callout p { font-size: 14px; color: var(--off-white); line-height: 1.65; }
    .callout p strong { color: var(--white); }

    /* ── Price ladder (Tab 3) ── */
    .price-ladder {
      border: 1px solid var(--blue-border); border-radius: var(--R);
      overflow: hidden; margin: 28px 0;
    }
    .price-rung {
      display: flex; align-items: center; padding: 22px 28px; gap: 24px;
    }
    @media (max-width: 560px) { .price-rung { flex-wrap: wrap; padding: 18px 20px; } }
    .price-rung.advertised { background: rgba(107,130,192,0.07); border-bottom: 1px solid var(--blue-border); }
    .price-rung.average    { background: rgba(77,114,255,0.1);   border-bottom: 1px solid var(--blue-border); }
    .price-rung.highest    { background: rgba(255,77,77,0.09); }
    .price-rung-label { font-family: var(--mono); font-size: 11px; color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; width: 160px; flex-shrink: 0; line-height: 1.4; }
    .price-rung-num { font-family: var(--mono); font-weight: 800; font-size: 40px; line-height: 1; flex: 1; }
    .price-rung-unit { font-size: 14px; font-weight: 400; color: var(--muted); }
    .price-rung.advertised .price-rung-num { color: var(--muted); }
    .price-rung.average    .price-rung-num { color: var(--blue-bright); }
    .price-rung.highest    .price-rung-num { color: var(--red); }
    .price-rung-tag { font-family: var(--mono); font-size: 11px; font-weight: 700; padding: 5px 12px; border-radius: 4px; white-space: nowrap; }
    .price-rung.advertised .price-rung-tag { background: rgba(107,130,192,0.15); color: var(--muted); }
    .price-rung.average    .price-rung-tag { background: rgba(77,114,255,0.18);   color: var(--blue-bright); }
    .price-rung.highest    .price-rung-tag { background: rgba(255,77,77,0.18);    color: var(--red); }

    .price-gap-banner {
      background: linear-gradient(135deg, rgba(232,192,64,0.1), rgba(232,192,64,0.04));
      border: 1px solid rgba(232,192,64,0.28); border-radius: var(--R);
      padding: 24px 28px; display: flex; align-items: center; gap: 28px;
    }
    @media (max-width: 560px) { .price-gap-banner { flex-direction: column; gap: 12px; } }
    .price-gap-num { font-family: var(--mono); font-size: 56px; font-weight: 800; color: var(--amber); line-height: 1; flex-shrink: 0; }
    .price-gap-text { font-size: 14px; color: var(--off-white); line-height: 1.7; }
    .price-gap-text strong { color: var(--amber); }

    /* ── Opportunity cards ── */
    .opp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; margin: 24px 0; }
    .opp-card { border-radius: var(--R); padding: 20px; border: 1px solid; }
    .opp-card:nth-child(1) { background: rgba(77,114,255,0.07);  border-color: rgba(77,114,255,0.22); }
    .opp-card:nth-child(2) { background: rgba(0,232,123,0.06);   border-color: rgba(0,232,123,0.22); }
    .opp-card:nth-child(3) { background: rgba(255,184,0,0.07);   border-color: rgba(255,184,0,0.22); }
    .opp-card:nth-child(4) { background: rgba(168,85,247,0.07);  border-color: rgba(168,85,247,0.22); }
    .opp-card-tag { font-family: var(--mono); font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 6px; }
    .opp-card:nth-child(1) .opp-card-tag { color: var(--blue-bright); }
    .opp-card:nth-child(2) .opp-card-tag { color: var(--green); }
    .opp-card:nth-child(3) .opp-card-tag { color: #FFB800; }
    .opp-card:nth-child(4) .opp-card-tag { color: #A855F7; }
    .opp-card-name { font-family: var(--display); font-size: 16px; font-weight: 700; color: var(--white); margin-bottom: 2px; }
    .opp-card-loc  { font-size: 11px; color: var(--muted); margin-bottom: 12px; }
    .opp-card-psf  { font-family: var(--mono); font-size: 20px; font-weight: 700; margin-bottom: 4px; }
    .opp-card:nth-child(1) .opp-card-psf { color: var(--blue-bright); }
    .opp-card:nth-child(2) .opp-card-psf { color: var(--green); }
    .opp-card:nth-child(3) .opp-card-psf { color: #FFB800; }
    .opp-card:nth-child(4) .opp-card-psf { color: #A855F7; }
    .opp-card-reason { font-size: 11px; color: var(--muted); line-height: 1.5; padding-top: 10px; border-top: 1px solid rgba(77,114,255,0.12); margin-top: 10px; }

    /* ── Policy cards ── */
    .policy-split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 28px 0; }
    @media (max-width: 560px) { .policy-split { grid-template-columns: 1fr; } }
    .policy-card { border-radius: var(--R); padding: 28px 24px; }
    .policy-card.before { background: rgba(255,77,77,0.07); border: 1px solid rgba(255,77,77,0.22); }
    .policy-card.after  { background: rgba(0,232,123,0.06); border: 1px solid rgba(0,232,123,0.22); }
    .policy-era-badge { display: inline-block; padding: 4px 12px; border-radius: 20px; font-family: var(--mono); font-size: 11px; font-weight: 700; letter-spacing: 0.06em; margin-bottom: 14px; }
    .policy-card.before .policy-era-badge { background: rgba(255,77,77,0.15); color: var(--red); }
    .policy-card.after  .policy-era-badge { background: rgba(0,232,123,0.15); color: var(--green); }
    .policy-card h3 { font-family: var(--display); font-size: 17px; font-weight: 700; margin-bottom: 16px; color: var(--white); }
    .policy-bullets { list-style: none; padding: 0; }
    .policy-bullets li { font-size: 13px; color: var(--muted); padding: 5px 0 5px 18px; position: relative; line-height: 1.5; }
    .policy-card.before .policy-bullets li::before { content: '✕'; position: absolute; left: 0; color: var(--red); font-weight: 700; }
    .policy-card.after  .policy-bullets li::before { content: '✓'; position: absolute; left: 0; color: var(--green); font-weight: 700; }

    /* ── Cooling cycle ── */
    .cycle-visual { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; margin: 32px 0; padding: 24px; background: var(--bg2); border: 1px solid var(--blue-border); border-radius: var(--R); }
    .cycle-step { text-align: center; padding: 12px 16px; }
    .cycle-step-icon { font-size: 28px; display: block; margin-bottom: 8px; }
    .cycle-step-label { font-size: 11px; color: var(--muted); font-family: var(--mono); line-height: 1.4; max-width: 86px; margin: 0 auto; }
    .cycle-arrow { font-size: 18px; color: var(--blue-border); padding: 0 4px; flex-shrink: 0; }

    /* ── Stat trio ── */
    .stat-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--blue-border); border-radius: var(--R); overflow: hidden; margin: 24px 0; }
    @media (max-width: 480px) { .stat-trio { grid-template-columns: 1fr; } }
    .stat-trio-cell { padding: 28px 20px; text-align: center; border-right: 1px solid var(--blue-border); background: var(--bg2); }
    .stat-trio-cell:last-child { border-right: none; }
    .stat-trio-num { font-family: var(--mono); font-size: 32px; font-weight: 800; line-height: 1; display: block; margin-bottom: 8px; }
    .stat-trio-lbl { font-size: 11px; color: var(--muted); line-height: 1.5; }

    /* ── Timeline ── */
    .timeline { position: relative; padding-left: 24px; margin: 28px 0; }
    .timeline::before { content: ''; position: absolute; left: 8px; top: 8px; bottom: 8px; width: 2px; background: var(--blue-border); }
    .tl-item { position: relative; margin-bottom: 28px; }
    .tl-item::before { content: ''; position: absolute; left: -20px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--blue-bright); border: 2px solid var(--bg); }
    .tl-era { font-family: var(--mono); font-size: 10px; font-weight: 700; color: var(--blue-bright); letter-spacing: 0.1em; margin-bottom: 4px; }
    .tl-title { font-family: var(--display); font-size: 15px; font-weight: 700; color: var(--white); margin-bottom: 4px; }
    .tl-body { font-size: 13px; color: var(--muted); line-height: 1.6; }

    /* ── Conclusion block ── */
    .conclusion-block { background: var(--bg2); border: 1px solid var(--blue-border); border-radius: var(--R); padding: 36px; text-align: center; margin-top: 48px; }
    .conclusion-block h3 { font-family: var(--display); font-size: 22px; font-weight: 700; color: var(--white); margin-bottom: 10px; }
    .conclusion-block p { font-size: 14px; color: var(--muted); line-height: 1.7; max-width: 540px; margin: 0 auto 22px; }
    .cta-btn { display: inline-block; background: var(--blue-bright); color: var(--white); font-family: var(--display); font-size: 14px; font-weight: 600; padding: 13px 30px; border-radius: 8px; cursor: pointer; transition: opacity 0.2s; }
    .cta-btn:hover { opacity: 0.85; }


    /* ── GDP–PPI gap timeline ── */
    .gap-timeline { display: flex; gap: 0; border: 1px solid var(--blue-border); border-radius: var(--R); overflow: hidden; margin: 16px 0 28px; }
    .gap-point { flex: 1; padding: 14px 8px; text-align: center; border-right: 1px solid var(--blue-border); background: var(--bg2); display: flex; flex-direction: column; gap: 4px; align-items: center; }
    .gap-point:last-child { border-right: none; }
    .gap-point.today { background: rgba(77,114,255,0.09); }
    .gap-yr { font-family: var(--mono); font-size: 9px; color: var(--muted); letter-spacing: 0.05em; text-transform: uppercase; }
    .gap-pct { font-family: var(--mono); font-size: 20px; font-weight: 800; color: var(--amber); line-height: 1; }
    .gap-point.today .gap-pct { color: var(--blue-bright); }
    .gap-lbl { font-size: 10px; color: var(--muted); }
    @media (max-width: 600px) {
      .gap-timeline { flex-wrap: wrap; }
      .gap-point { flex: 0 0 33.33%; border-bottom: 1px solid var(--blue-border); }
    }

  /* ── NEW ARTICLE CARDS HERO ── */
  .ins-new-hero {
    padding: calc(var(--nav) + 60px) 0 0;
    background: var(--bg);
    position: relative; overflow: hidden;
  }
  .ins-new-hero-bg {
    position: absolute; inset: 0;
    background: url('img/bto.jpg') center 40% / cover no-repeat;
    opacity: 0.22; filter: saturate(0.4) brightness(0.6);
    pointer-events: none;
  }
  .ins-new-hero-glow {
    position: absolute; inset: 0; pointer-events: none;
    background:
      linear-gradient(to bottom, rgba(3,7,26,0.55) 0%, rgba(3,7,26,0.10) 40%, rgba(3,7,26,0.95) 100%),
      radial-gradient(ellipse 60% 80% at 50% 20%, rgba(77,114,255,0.10) 0%, transparent 70%);
  }
  .ins-new-hero-inner {
    position: relative; z-index: 2;
    max-width: 1160px; margin: 0 auto; padding: 0 40px 60px; text-align: center;
  }
  .ins-new-hero-eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--mono); font-size: 10px; font-weight: 500;
    letter-spacing: 0.16em; text-transform: uppercase; color: var(--blue-bright);
    background: rgba(77,114,255,0.08); border: 1px solid rgba(77,114,255,0.2);
    padding: 6px 14px; border-radius: 100px; margin-bottom: 20px;
  }
  .ins-new-hero-dot {
    width: 6px; height: 6px; border-radius: 50%; background: var(--blue-bright);
    box-shadow: 0 0 8px rgba(77,114,255,0.8); animation: ins-pulse 2s ease-in-out infinite;
  }
  @keyframes ins-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.5; transform: scale(0.7); }
  }
  .ins-new-hero-headline {
    font-family: var(--display); font-size: clamp(34px, 5.5vw, 68px);
    font-weight: 700; letter-spacing: -0.03em; line-height: 1.05;
    color: #fff; margin-bottom: 16px;
  }
  .ins-new-hero-sub {
    font-family: var(--body); font-size: 16px;
    color: rgba(232,238,255,0.6); margin-bottom: 40px;
  }
  .ins-filter-row {
    display: flex; justify-content: center; flex-wrap: wrap; gap: 4px; margin-bottom: 40px;
    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 999px;
    padding: 5px;
    width: fit-content;
    margin-left: auto; margin-right: auto;
    box-shadow: 0 4px 24px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.12);
  }
  .ins-filter-btn {
    font-family: var(--mono); font-size: 10px; font-weight: 600;
    letter-spacing: 0.12em; text-transform: uppercase; padding: 7px 18px;
    border-radius: 999px; cursor: pointer;
    background: rgba(255,255,255,0.06); border: 1px solid rgba(232,238,255,0.15);
    color: rgba(232,238,255,0.5);
    transition: background 0.18s, border-color 0.18s, color 0.18s, box-shadow 0.18s;
  }

  /* All — neutral white */
  .ins-filter-btn[data-filter="all"]:hover   { color: #fff; border-color: rgba(255,255,255,0.4); }
  .ins-filter-btn[data-filter="all"].active  { background: rgba(255,255,255,0.15); color: #fff; border-color: rgba(255,255,255,0.5); box-shadow: 0 0 12px rgba(255,255,255,0.12); }

  /* HDB Upgrader — orange */
  .ins-filter-btn[data-filter="hdb-upgrader"]:hover  { color: #FB923C; border-color: rgba(251,146,60,0.5); }
  .ins-filter-btn[data-filter="hdb-upgrader"].active { background: rgba(251,146,60,0.18); color: #FB923C; border-color: rgba(251,146,60,0.6); box-shadow: 0 0 12px rgba(251,146,60,0.25); }

  /* Investor — blue */
  .ins-filter-btn[data-filter="investor"]:hover  { color: #7B96FF; border-color: rgba(77,114,255,0.5); }
  .ins-filter-btn[data-filter="investor"].active { background: rgba(77,114,255,0.18); color: #7B96FF; border-color: rgba(77,114,255,0.6); box-shadow: 0 0 12px rgba(77,114,255,0.28); }

  /* Overseas Investor — purple */
  .ins-filter-btn[data-filter="overseas"]:hover  { color: #C084FC; border-color: rgba(168,85,247,0.5); }
  .ins-filter-btn[data-filter="overseas"].active { background: rgba(168,85,247,0.18); color: #C084FC; border-color: rgba(168,85,247,0.6); box-shadow: 0 0 12px rgba(168,85,247,0.25); }

  /* First Home — green */
  .ins-filter-btn[data-filter="first-home"]:hover  { color: #34D399; border-color: rgba(0,180,90,0.5); }
  .ins-filter-btn[data-filter="first-home"].active { background: rgba(0,180,90,0.16); color: #34D399; border-color: rgba(0,180,90,0.6); box-shadow: 0 0 12px rgba(0,180,90,0.22); }
  /* ── Article grid — GLASS cards (refined 2026-04-27) ──
     Strategy: dark glass surface, light text, audience identity
     carried by a thin colored top edge + on-hover colored ring +
     the audience pill itself. No more flooded pastel backgrounds.
     -------------------------------------------------------------- */
  .ins-articles-list {
    max-width: 1160px; margin: 0 auto;
    padding: 0 40px 88px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
    position: relative; z-index: 2;
  }

  /* Base glass card */
  .ins-article-card {
    display: flex; flex-direction: column; gap: 14px;
    padding: 22px 20px 20px;
    position: relative;
    background:
      linear-gradient(180deg, rgba(255,255,255,0.055) 0%, rgba(255,255,255,0.025) 100%);
    border: 1px solid rgba(255,255,255,0.085);
    border-radius: 14px;
    cursor: pointer;
    overflow: hidden;
    backdrop-filter: blur(18px) saturate(1.4);
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
    box-shadow:
      0 10px 30px rgba(0,0,0,0.32),
      inset 0 1px 0 rgba(255,255,255,0.07);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
  }

  /* Top edge: thin colored stripe via ::before, replaces flat border-top
     (default neutral, per-audience override below) */
  .ins-article-card::before {
    content: '';
    position: absolute; top: 0; left: 0; right: 0; height: 2px;
    background: linear-gradient(90deg,
      transparent 0%,
      rgba(255,255,255,0.16) 30%,
      rgba(255,255,255,0.16) 70%,
      transparent 100%);
    pointer-events: none;
    transition: opacity 0.22s, background 0.22s;
    opacity: 0.7;
  }
  /* Soft inner top-glow on hover (colored per audience) */
  .ins-article-card::after {
    content: '';
    position: absolute; top: -40%; left: -10%; right: -10%; height: 80%;
    background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(255,255,255,0.10) 0%, transparent 60%);
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
  }

  .ins-article-card:hover {
    transform: translateY(-4px);
    background:
      linear-gradient(180deg, rgba(255,255,255,0.075) 0%, rgba(255,255,255,0.035) 100%);
    border-color: rgba(255,255,255,0.16);
    box-shadow:
      0 18px 44px rgba(0,0,0,0.42),
      inset 0 1px 0 rgba(255,255,255,0.10);
  }
  .ins-article-card:hover::before { opacity: 1; }
  .ins-article-card:hover::after  { opacity: 1; }
  .ins-article-card.hidden { display: none !important; }

  /* ── Per-audience accent — top stripe + hover glow + ring ──
     Background stays glass; only the edge + glow shift. */

  /* Investor — blue */
  .ins-article-card:has(.ins-aud-investor)::before {
    background: linear-gradient(90deg, transparent 0%, rgba(77,114,255,0.85) 50%, transparent 100%);
  }
  .ins-article-card:has(.ins-aud-investor)::after {
    background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(77,114,255,0.22) 0%, transparent 65%);
  }
  .ins-article-card:has(.ins-aud-investor):hover {
    border-color: rgba(77,114,255,0.40);
    box-shadow:
      0 18px 44px rgba(77,114,255,0.22),
      0 0 0 1px rgba(77,114,255,0.18),
      inset 0 1px 0 rgba(255,255,255,0.10);
  }
  .ins-article-card:has(.ins-aud-investor) .ins-card-cta { color: #7B96FF; }
  .ins-article-card:has(.ins-aud-investor):hover .ins-card-title { color: #B7C5FF; }

  /* HDB Upgrader — orange */
  .ins-article-card:has(.ins-aud-hdb)::before {
    background: linear-gradient(90deg, transparent 0%, rgba(251,146,60,0.85) 50%, transparent 100%);
  }
  .ins-article-card:has(.ins-aud-hdb)::after {
    background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(251,146,60,0.20) 0%, transparent 65%);
  }
  .ins-article-card:has(.ins-aud-hdb):hover {
    border-color: rgba(251,146,60,0.42);
    box-shadow:
      0 18px 44px rgba(251,146,60,0.20),
      0 0 0 1px rgba(251,146,60,0.20),
      inset 0 1px 0 rgba(255,255,255,0.10);
  }
  .ins-article-card:has(.ins-aud-hdb) .ins-card-cta { color: #FBB07A; }
  .ins-article-card:has(.ins-aud-hdb):hover .ins-card-title { color: #FFCDA8; }

  /* First Home — green */
  .ins-article-card:has(.ins-aud-first)::before {
    background: linear-gradient(90deg, transparent 0%, rgba(0,200,100,0.85) 50%, transparent 100%);
  }
  .ins-article-card:has(.ins-aud-first)::after {
    background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(0,200,100,0.20) 0%, transparent 65%);
  }
  .ins-article-card:has(.ins-aud-first):hover {
    border-color: rgba(0,200,100,0.40);
    box-shadow:
      0 18px 44px rgba(0,200,100,0.20),
      0 0 0 1px rgba(0,200,100,0.18),
      inset 0 1px 0 rgba(255,255,255,0.10);
  }
  .ins-article-card:has(.ins-aud-first) .ins-card-cta { color: #5EE3A1; }
  .ins-article-card:has(.ins-aud-first):hover .ins-card-title { color: #A8F2CC; }

  /* Citizens / PR — gold */
  .ins-article-card:has(.ins-aud-citizen)::before {
    background: linear-gradient(90deg, transparent 0%, rgba(201,168,76,0.85) 50%, transparent 100%);
  }
  .ins-article-card:has(.ins-aud-citizen)::after {
    background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(201,168,76,0.20) 0%, transparent 65%);
  }
  .ins-article-card:has(.ins-aud-citizen):hover {
    border-color: rgba(201,168,76,0.42);
    box-shadow:
      0 18px 44px rgba(201,168,76,0.18),
      0 0 0 1px rgba(201,168,76,0.20),
      inset 0 1px 0 rgba(255,255,255,0.10);
  }
  .ins-article-card:has(.ins-aud-citizen) .ins-card-cta { color: #E2C475; }
  .ins-article-card:has(.ins-aud-citizen):hover .ins-card-title { color: #F1DAA0; }

  /* Overseas Investor — purple */
  .ins-article-card:has(.ins-aud-overseas)::before {
    background: linear-gradient(90deg, transparent 0%, rgba(168,85,247,0.85) 50%, transparent 100%);
  }
  .ins-article-card:has(.ins-aud-overseas)::after {
    background: radial-gradient(ellipse 60% 100% at 50% 0%, rgba(168,85,247,0.22) 0%, transparent 65%);
  }
  .ins-article-card:has(.ins-aud-overseas):hover {
    border-color: rgba(168,85,247,0.42);
    box-shadow:
      0 18px 44px rgba(168,85,247,0.20),
      0 0 0 1px rgba(168,85,247,0.18),
      inset 0 1px 0 rgba(255,255,255,0.10);
  }
  .ins-article-card:has(.ins-aud-overseas) .ins-card-cta { color: #C084FC; }
  .ins-article-card:has(.ins-aud-overseas):hover .ins-card-title { color: #DCB7FF; }

  /* Top meta row */
  .ins-card-meta {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    position: relative; z-index: 1;
  }
  .ins-card-num {
    font-family: var(--mono); font-size: 10px; font-weight: 700;
    color: rgba(255,255,255,0.30); letter-spacing: 0.12em;
  }
  .ins-card-audience {
    font-family: var(--mono); font-size: 9px; font-weight: 700;
    letter-spacing: 0.12em; text-transform: uppercase;
    padding: 4px 10px; border-radius: 5px;
    display: inline-block; white-space: nowrap;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
  /* Audience pills — brighter on dark glass */
  .ins-aud-investor { background: rgba(77,114,255,0.18);  color: #B7C5FF; border: 1px solid rgba(77,114,255,0.42); }
  .ins-aud-hdb      { background: rgba(251,146,60,0.18);  color: #FFCDA8; border: 1px solid rgba(251,146,60,0.42); }
  .ins-aud-first    { background: rgba(0,200,100,0.16);   color: #A8F2CC; border: 1px solid rgba(0,200,100,0.40); }
  .ins-aud-citizen  { background: rgba(201,168,76,0.18);  color: #F1DAA0; border: 1px solid rgba(201,168,76,0.42); }
  .ins-aud-overseas { background: rgba(168,85,247,0.18);  color: #DCB7FF; border: 1px solid rgba(168,85,247,0.42); }

  /* Body */
  .ins-card-body {
    display: flex; flex-direction: column; gap: 9px; flex: 1;
    position: relative; z-index: 1;
  }
  .ins-card-title {
    font-family: var(--display); font-size: 15px; font-weight: 700;
    color: rgba(255,255,255,0.96); line-height: 1.30; margin: 0;
    letter-spacing: -0.01em;
    transition: color 0.18s;
  }
  .ins-card-lead {
    font-family: var(--body); font-size: 13px; color: rgba(232,238,255,0.62);
    line-height: 1.62; margin: 0;
  }

  /* CTA arrow — bottom of card, colour set per-variant above */
  .ins-card-cta {
    font-family: var(--mono); font-size: 16px;
    margin-top: auto; opacity: 0.65;
    transition: opacity 0.18s, transform 0.18s;
    text-align: right;
    position: relative; z-index: 1;
  }
  .ins-article-card:hover .ins-card-cta {
    opacity: 1;
    transform: translateX(3px);
  }

  /* article panel close row */
  .s-panel-close-row { padding: 28px 0 0; border-bottom: 1px solid var(--blue-border); margin-bottom: 48px; }
  .s-panel-close-btn {
    font-family: var(--mono); font-size: 11px; font-weight: 600;
    letter-spacing: 0.10em; text-transform: uppercase; color: var(--blue-bright);
    background: none; border: none; cursor: pointer; padding: 8px 0;
    display: inline-flex; align-items: center; gap: 6px; opacity: 0.8; transition: opacity 0.18s;
  }
  .s-panel-close-btn:hover { opacity: 1; }
  /* article panels container */
  .article-panels-wrap { position: relative; }
  .tab-pane { display: none; }
  .tab-pane.panel-open { display: block; }

  /* ══════════════════════════════════════════════
     ARTICLE PANELS — LIGHT THEME
     Scoped to .article-panels-wrap so nothing
     outside is affected.
  ══════════════════════════════════════════════ */
  .article-panels-wrap {
    background: #EEF2FA;
    /* border-top removed 2026-04-27 — was rendering a faint line above
       the footer when no panel was open. The light bg only matters when
       a panel is .panel-open; when collapsed, the wrap is height 0 and
       the border was the only visible artifact. */
  }

  /* Kill the footer's blue-border separator on this page only — it was
     stacking with the wrap border above to produce a visible white-ish
     line between content and footer. */
  body footer.footer { border-top: 0 !important; }

  /* Close button */
  .article-panels-wrap .s-panel-close-row { border-bottom-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .s-panel-close-btn { color: #4D72FF; }

  /* Section shell — already transparent, inherits light bg */
  .article-panels-wrap .insight-section { background: transparent; }

  /* Section headings */
  .article-panels-wrap .s-eyebrow { color: #4D72FF; }
  .article-panels-wrap .s-title { color: #0F1730; }
  .article-panels-wrap .s-body { color: #4A5568; }
  .article-panels-wrap .s-body strong { color: #0F1730; }
  .article-panels-wrap .s-divider { border-top-color: rgba(15,23,48,0.10); }

  /* Stat strip */
  .article-panels-wrap .stat-strip { border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .stat-cell { background: #fff; border-right-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .stat-cell:hover { background: #F5F7FF; }
  .article-panels-wrap .stat-lbl { color: #5A6A88; }

  /* Chart wrap */
  .article-panels-wrap .chart-wrap { background: #fff; border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .chart-title { color: #0F1730; }
  .article-panels-wrap .chart-subtitle { color: #5A6A88; }
  .article-panels-wrap .legend-item { color: #5A6A88; }

  /* Compare table */
  .article-panels-wrap .compare-table th { background: #F5F7FF; color: #5A6A88; border-bottom-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .compare-table th.win-col { color: #4D72FF; }
  .article-panels-wrap .compare-table td { color: #0F1730; border-bottom-color: rgba(15,23,48,0.07); }
  .article-panels-wrap .compare-table td:first-child { color: #5A6A88; }

  /* Crisis table */
  .article-panels-wrap .crisis-table th { background: #F5F7FF; color: #5A6A88; border-bottom-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .crisis-table td { color: #0F1730; border-bottom-color: rgba(15,23,48,0.07); }

  /* Callouts */
  .article-panels-wrap .callout { background: rgba(77,114,255,0.06); border-color: rgba(77,114,255,0.20); }
  .article-panels-wrap .callout.green { background: rgba(0,180,90,0.06); border-color: rgba(0,180,90,0.20); }
  .article-panels-wrap .callout.amber { background: rgba(232,192,64,0.08); border-color: rgba(232,192,64,0.20); }
  .article-panels-wrap .callout p { color: #0F1730; }
  .article-panels-wrap .callout p strong { color: #0F1730; }

  /* Price ladder */
  .article-panels-wrap .price-ladder { border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .price-rung.advertised { background: #F5F7FF; border-bottom-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .price-rung.average    { background: rgba(77,114,255,0.07); border-bottom-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .price-rung.highest    { background: rgba(255,77,77,0.06); }
  .article-panels-wrap .price-rung-label { color: #5A6A88; }
  .article-panels-wrap .price-gap-banner { background: rgba(232,192,64,0.08); }
  .article-panels-wrap .price-gap-text { color: #0F1730; }

  /* Feature pills */
  .article-panels-wrap .feat-text strong { color: #0F1730; }
  .article-panels-wrap .feat-text span { color: #4A5568; }
  .article-panels-wrap .feat-pill.blue   { background: rgba(77,114,255,0.07);  border-color: rgba(77,114,255,0.20); }
  .article-panels-wrap .feat-pill.green  { background: rgba(0,180,90,0.07);    border-color: rgba(0,180,90,0.20); }
  .article-panels-wrap .feat-pill.amber  { background: rgba(232,192,64,0.08);  border-color: rgba(232,192,64,0.20); }
  .article-panels-wrap .feat-pill.purple { background: rgba(168,85,247,0.07);  border-color: rgba(168,85,247,0.20); }
  .article-panels-wrap .feat-pill.teal   { background: rgba(6,182,212,0.07);   border-color: rgba(6,182,212,0.20); }

  /* Leverage duo */
  .article-panels-wrap .lev-card.stocks   { background: #F5F7FF; border-color: rgba(107,130,192,0.25); }
  .article-panels-wrap .lev-card.property { background: rgba(0,180,90,0.06); border-color: rgba(0,180,90,0.25); }
  .article-panels-wrap .lev-card.stocks .lev-roi { color: #0F1730; }
  .article-panels-wrap .lev-desc { color: #4A5568; }

  /* Opp cards */
  .article-panels-wrap .opp-card-name { color: #0F1730; }
  .article-panels-wrap .opp-card-loc  { color: #5A6A88; }
  .article-panels-wrap .opp-card-reason { color: #5A6A88; border-top-color: rgba(15,23,48,0.08); }

  /* Policy cards */
  .article-panels-wrap .policy-card h3 { color: #0F1730; }
  .article-panels-wrap .policy-bullets li { color: #4A5568; }

  /* Cooling cycle */
  .article-panels-wrap .cycle-visual { background: #fff; border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .cycle-step-label { color: #5A6A88; }
  .article-panels-wrap .cycle-arrow { color: rgba(15,23,48,0.20); }

  /* Stat trio */
  .article-panels-wrap .stat-trio { border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .stat-trio-cell { background: #fff; border-right-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .stat-trio-lbl { color: #5A6A88; }

  /* Timeline */
  .article-panels-wrap .timeline::before { background: rgba(15,23,48,0.12); }
  .article-panels-wrap .tl-item::before { background: #4D72FF; border-color: #EEF2FA; }
  .article-panels-wrap .tl-title { color: #0F1730; }
  .article-panels-wrap .tl-body  { color: #4A5568; }

  /* Gap timeline */
  .article-panels-wrap .gap-timeline { border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .gap-point { background: #fff; border-right-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .gap-point.today { background: #F0F4FF; }
  .article-panels-wrap .gap-yr { color: #5A6A88; }
  .article-panels-wrap .gap-lbl { color: #5A6A88; }

  /* POV insight cards */
  .article-panels-wrap .il-pov-card { background: #fff; border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .il-pov-num { color: rgba(15,23,48,0.18); }
  .article-panels-wrap .il-pov-headline { color: #0F1730; }
  .article-panels-wrap .il-pov-data li { color: #0F1730; }
  .article-panels-wrap .il-pov-data li::before { color: rgba(15,23,48,0.35); }
  .article-panels-wrap .il-pov-data li strong { color: #0F1730; }
  .article-panels-wrap .il-pov-implication { color: #4A5568; border-top-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .il-pov-implication strong { color: #0F1730; }
  .article-panels-wrap .il-pov-as-of { color: #5A6A88; }

  /* ════════════════════════════════════════════════════════════
     LIGHT-THEME READABILITY PATCH (2026-04-27)
     Catches every class that previously inherited a dark-theme
     default (white / off-white / muted) and would have rendered
     light-on-light inside .article-panels-wrap. Order:
       1) Safety-net default colour for the wrap
       2) Specific overrides for stat numbers, badges, table cells,
          card text that didn't have a light override
       3) Coloured accents adjusted for light-bg contrast
  ════════════════════════════════════════════════════════════ */

  /* (1) SAFETY NET — anything inheriting body text inside the wrap
         gets a readable dark slate by default. Specific overrides
         below take precedence where colour is intentional. */
  .article-panels-wrap { color: #1F2A44; }
  .article-panels-wrap p,
  .article-panels-wrap li,
  .article-panels-wrap span,
  .article-panels-wrap div,
  .article-panels-wrap td,
  .article-panels-wrap th { color: inherit; }

  /* (1b) BIG FIX — redefine the dark-theme CSS variables inside the
         wrap so every inline `color: var(--white|--off-white|--muted)`
         and `background: var(--bg2|--bg3)` reference automatically flips
         to a readable light-theme equivalent. This is the cleanest way
         to handle the ~120 inline-styled elements inside the 8 article
         panels without touching each one individually. */
  .article-panels-wrap {
    /* Text colours: were near-white → dark slate */
    --white:       #0F1730;
    --off-white:   #1F2A44;
    --muted:       #5A6A88;
    --muted2:      #5A6A88;
    /* Coloured accents: darken so they read on light bg */
    --green:       #0A8A4A;
    --red:         #C93030;
    --amber:       #B8860B;
    /* Backgrounds that were dark navy → become light surfaces */
    --bg:          #EEF2FA;
    --bg2:         #F5F7FF;
    --bg3:         #FFFFFF;
    /* Border colour — darker translucent for visibility on light bg */
    --blue-border: rgba(15,23,48,0.10);
  }
  /* Strong tags inside paragraphs get full-strength dark */
  .article-panels-wrap strong,
  .article-panels-wrap b { color: #0F1730; }

  /* (2) Stat numbers — were var(--off-white)/inherit */
  .article-panels-wrap .stat-big       { color: #0F1730; }
  .article-panels-wrap .stat-icon      { color: #4D72FF; opacity: 0.9; }
  .article-panels-wrap .stat-trio-num  { color: #0F1730; }

  /* Crisis / compare table state cells — drop / recovery / today */
  .article-panels-wrap .crisis-table td.drop     { color: #C93030; }
  .article-panels-wrap .crisis-table td.recovery { color: #0A8A4A; }
  .article-panels-wrap .gap-point.today,
  .article-panels-wrap .price-rung.today         { background: #F0F4FF; }

  /* Win / column badges */
  .article-panels-wrap .win-badge        { background: rgba(77,114,255,0.12); color: #3B5EDB; }
  .article-panels-wrap .win-badge.green  { background: rgba(0,180,90,0.12);   color: #0A8A4A; }
  .article-panels-wrap .win-col          { color: #4D72FF; }

  /* Cycle visual (cooling cycle) — was inherited white */
  .article-panels-wrap .cycle-step        { color: #0F1730; }
  .article-panels-wrap .cycle-step-icon   { color: #4D72FF; }

  /* Feature pills — wrapper text not previously overridden */
  .article-panels-wrap .feat-text         { color: #0F1730; }

  /* Gap percentage — was amber on dark, hard on light; darken */
  .article-panels-wrap .gap-pct           { color: #B8860B; }

  /* Timeline era label — blue is fine on light, just ensure */
  .article-panels-wrap .tl-era            { color: #4D72FF; }

  /* Callout label — small mono caption above callout body */
  .article-panels-wrap .callout-label     { color: #4D72FF; }
  .article-panels-wrap .callout.green .callout-label { color: #0A8A4A; }
  .article-panels-wrap .callout.amber .callout-label { color: #B8860B; }

  /* Policy era badges — were tinted bg + bright text */
  .article-panels-wrap .policy-era-badge          { background: rgba(15,23,48,0.06); color: #0F1730; }
  .article-panels-wrap .policy-card.before .policy-era-badge { background: rgba(255,77,77,0.12);  color: #C93030; }
  .article-panels-wrap .policy-card.after  .policy-era-badge { background: rgba(0,180,90,0.12);   color: #0A8A4A; }

  /* Leverage cards — stocks label was muted-light, fix to slate */
  .article-panels-wrap .lev-card.stocks .lev-label    { color: #5A6A88; }
  .article-panels-wrap .lev-card.property .lev-label  { color: #0A8A4A; }
  .article-panels-wrap .lev-card.property .lev-roi    { color: #0A8A4A; }
  .article-panels-wrap .lev-card.stocks               { background: #F5F7FF; border-color: rgba(107,130,192,0.25); }

  /* Opportunity card backgrounds — semi-transparent dark won't
     read on light; switch to subtle light tints */
  .article-panels-wrap .opp-card                  { background: #fff; border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .opp-card:nth-child(1)     { background: rgba(77,114,255,0.06); border-color: rgba(77,114,255,0.20); }
  .article-panels-wrap .opp-card:nth-child(2)     { background: rgba(0,180,90,0.06);   border-color: rgba(0,180,90,0.20); }
  .article-panels-wrap .opp-card:nth-child(3)     { background: rgba(232,192,64,0.08); border-color: rgba(232,192,64,0.22); }
  .article-panels-wrap .opp-card:nth-child(4)     { background: rgba(168,85,247,0.06); border-color: rgba(168,85,247,0.20); }

  /* Policy card backgrounds same treatment */
  .article-panels-wrap .policy-card.before        { background: rgba(255,77,77,0.06); border: 1px solid rgba(255,77,77,0.20); }
  .article-panels-wrap .policy-card.after         { background: rgba(0,180,90,0.06);  border: 1px solid rgba(0,180,90,0.22); }
  .article-panels-wrap .policy-bullets li         { color: #4A5568; }
  .article-panels-wrap .policy-bullets li::before { color: rgba(15,23,48,0.30); }

  /* Crisis table header background was var(--bg2) (very dark) */
  .article-panels-wrap .crisis-table th           { background: #F5F7FF; color: #5A6A88; }

  /* CTA button inside panels — was already blue, just guarantee text colour */
  .article-panels-wrap .cta-btn                   { background: #4D72FF; color: #fff; }
  .article-panels-wrap .cta-btn:hover             { background: #3B5EDB; }

  /* Chart legend text */
  .article-panels-wrap .chart-legend              { color: #5A6A88; }
  .article-panels-wrap .chart-legend .legend-item { color: #5A6A88; }

  /* Conclusion block */
  .article-panels-wrap .conclusion-block { background: #fff; border-color: rgba(15,23,48,0.10); }
  .article-panels-wrap .conclusion-block h3 { color: #0F1730; }
  .article-panels-wrap .conclusion-block p { color: #4A5568; }

  @media (max-width: 1080px) {
    .ins-articles-list { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 768px) {
    .ins-new-hero-inner { padding: 0 20px 48px; }
    .ins-articles-list { padding: 0 20px 60px; grid-template-columns: repeat(2, 1fr); gap: 12px; }
  }
  @media (max-width: 480px) {
    .ins-articles-list { grid-template-columns: 1fr; }
  }

  /* ── Insight hero images (3D isometric heroes) ── */
  .ins-hero-img { display:block; width:100%; height:auto; aspect-ratio: 16 / 7; object-fit:cover;
    border-radius:16px; border:1px solid var(--blue-border); box-shadow:0 18px 50px rgba(0,0,0,0.45); margin:2px 0 26px; }
  @media (max-width:600px){ .ins-hero-img { aspect-ratio:16/9; border-radius:12px; margin-bottom:20px; } }
  .ins-hero-diagram { display:block; width:100%; height:auto; border-radius:16px; margin:2px 0 28px; box-shadow:0 18px 50px rgba(0,0,0,0.40); }

  /* ── In-panel subheads (between cards and visuals) ── */
  .s-subhead { font-family:var(--display); font-size:clamp(19px,2.4vw,24px); font-weight:700;
    letter-spacing:-0.02em; color:var(--white); margin:42px 0 8px; }
  .s-subnote { font-family:var(--body); font-size:14px; line-height:1.6; color:var(--muted); margin:0 0 6px; max-width:780px; }

  /* ── Comparison matrix (Standard / Plus / Prime etc.) ── */
  .cmp-wrap { overflow-x:auto; margin:18px 0 6px; -webkit-overflow-scrolling:touch; }
  .cmp-table { width:100%; border-collapse:collapse; min-width:580px; background:var(--bg3);
    border:1px solid var(--blue-border); border-radius:12px; overflow:hidden; font-family:var(--body); }
  .cmp-table th, .cmp-table td { padding:13px 16px; text-align:left; border-bottom:1px solid rgba(255,255,255,0.06);
    font-size:13px; line-height:1.5; vertical-align:top; color:var(--off-white); }
  .cmp-table thead th { font-family:var(--mono); font-size:11px; letter-spacing:0.07em; text-transform:uppercase;
    font-weight:700; background:rgba(255,255,255,0.02); }
  .cmp-table thead th.cmp-std   { color:#FB923C; }
  .cmp-table thead th.cmp-plus  { color:#7B96FF; }
  .cmp-table thead th.cmp-prime { color:#C9A84C; }
  .cmp-table tbody th { font-family:var(--body); font-weight:600; color:var(--white); white-space:nowrap; font-size:12.5px; }
  .cmp-table tbody tr:last-child th, .cmp-table tbody tr:last-child td { border-bottom:none; }
  .cmp-table .yes { color:var(--green); font-weight:600; } .cmp-table .no { color:var(--red); font-weight:600; }

  /* ── Inline chart boxes ── */
  .chart-box { background:var(--bg3); border:1px solid var(--blue-border); border-radius:12px; padding:20px 22px; margin:22px 0 6px; }
  .chart-box h4 { margin:0 0 3px; font-family:var(--display); font-size:15px; font-weight:700; color:var(--white); letter-spacing:-0.01em; }
  .chart-box .chart-sub { margin:0 0 16px; font-family:var(--mono); font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted2); }
  .chart-box canvas { max-width:100%; }

  /* ── Main point (the single takeaway) ── */
  .s-mainpoint { font-family:var(--display); font-size:clamp(20px,2.7vw,30px); font-weight:600; line-height:1.42; letter-spacing:-0.01em; color:var(--off-white); margin:10px 0 30px; max-width:940px; border-left:3px solid var(--blue-bright); padding-left:22px; }
  .s-mainpoint strong { color:var(--white); font-weight:700; }
  @media (max-width:600px){ .s-mainpoint { padding-left:16px; font-size:19px; } }

  /* ── Collapsible "full breakdown" ── */
  .ins-details { margin:40px 0 8px; border-top:1px solid var(--blue-border); }
  .ins-details > summary { cursor:pointer; list-style:none; font-family:var(--mono); font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); padding:16px 0; display:flex; align-items:center; }
  .ins-details > summary::-webkit-details-marker { display:none; }
  .ins-details > summary::after { content:'\25BE'; margin-left:12px; transition:transform 0.2s; }
  .ins-details[open] > summary::after { transform:rotate(180deg); }
  .ins-details > summary:hover { color:var(--off-white); }
  .ins-details-inner { padding-top:6px; }

  /* ── Data-verdict callout (the substantiated conclusion) ── */
  .verdict { --vaccent:#4D72FF; background:rgba(255,255,255,0.03); border:1px solid var(--blue-border); border-left:4px solid var(--vaccent); border-radius:14px; padding:26px 30px; margin:32px 0 0; }
  .verdict-label { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.2em; text-transform:uppercase; color:var(--vaccent); margin-bottom:10px; }
  .verdict-headline { font-family:var(--display); font-size:clamp(20px,2.6vw,27px); font-weight:700; letter-spacing:-0.01em; color:var(--white); margin:0 0 18px; line-height:1.25; }
  .verdict-points { display:flex; flex-direction:column; gap:13px; }
  .verdict-point { display:flex; gap:16px; align-items:baseline; }
  .verdict-num { flex:0 0 auto; min-width:84px; font-family:var(--display); font-size:22px; font-weight:700; color:var(--vaccent); font-variant-numeric:tabular-nums; }
  .verdict-txt { font-family:var(--body); font-size:15px; line-height:1.5; color:var(--off-white); }
  .verdict-foot { font-family:var(--body); font-size:13.5px; line-height:1.55; color:var(--muted); margin:16px 0 0; padding-top:14px; border-top:1px solid var(--blue-border); }
  @media (max-width:600px){ .verdict { padding:22px 20px; } .verdict-point { gap:12px; } .verdict-num { min-width:70px; font-size:19px; } }
  .ins-cta-row { margin:22px 0 4px; display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
  .ins-cta-row .cta-note { font-family:var(--body); font-size:13px; color:var(--muted); }

  /* ── Article FAQ (AEO / answer-engine optimised) ── */
  .art-faq { margin:42px 0 8px; max-width:760px; border-top:1px solid rgba(15,23,48,0.12); padding-top:22px; }
  .art-faq-label { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--vaccent,#4D72FF); margin:0 0 14px; }
  .art-faq-item { padding:15px 0; border-bottom:1px solid rgba(15,23,48,0.08); }
  .art-faq-q { font-family:var(--display); font-size:17px; font-weight:700; color:#0F1730; margin:0 0 7px; }
  .art-faq-a { font-family:var(--body); font-size:15px; line-height:1.6; color:#33405E; margin:0; }

  /* ── Closing takeaway (editorial sign-off, citable) ── */
  .art-takeaway { font-family:var(--body); font-size:16px; line-height:1.65; color:#33405E; max-width:760px; margin:20px 0 4px; padding-left:16px; border-left:3px solid var(--vaccent,#4D72FF); }
  .art-takeaway strong { color:#0F1730; font-weight:700; }

  /* ── Editorial article styling (Bloomberg / Vox-style, shareable) ── */
  .art-kicker { font-family:var(--mono); font-size:12px; font-weight:700; letter-spacing:0.18em; text-transform:uppercase; color:var(--vaccent,#4D72FF); margin:2px 0 16px; display:flex; align-items:center; gap:11px; }
  .art-kicker::before { content:''; width:28px; height:2px; background:var(--vaccent,#4D72FF); }
  .art-headline { font-family:var(--display); font-size:clamp(30px,4.6vw,50px); font-weight:700; letter-spacing:-0.025em; line-height:1.07; color:var(--white); margin:0 0 20px; max-width:900px; }
  .art-dek { font-family:var(--body); font-size:clamp(17px,2.1vw,21px); line-height:1.5; color:var(--off-white); font-weight:400; margin:0 0 22px; max-width:760px; }
  .art-dek strong { color:var(--white); font-weight:600; }
  .art-byline { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:15px 0; border-top:1px solid var(--blue-border); border-bottom:1px solid var(--blue-border); font-family:var(--body); font-size:13px; color:var(--muted); margin:0 0 8px; max-width:760px; }
  .art-byline strong { color:var(--off-white); font-weight:600; }
  .art-byline .art-dot { color:var(--muted2); }
  .art-body { font-family:var(--body); font-size:17px; line-height:1.7; color:var(--off-white); margin:24px 0; max-width:720px; }
  .art-fig { margin:36px 0; }
  .fig-kick { font-family:var(--mono); font-size:11px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--vaccent,#4D72FF); margin:0 0 5px; }
  .fig-cap { font-family:var(--display); font-size:clamp(17px,2vw,20px); font-weight:700; color:var(--white); letter-spacing:-0.01em; margin:0 0 14px; }
  .fig-src { font-family:var(--mono); font-size:11px; letter-spacing:0.03em; color:var(--muted2); margin:11px 0 0; }

  /* ── Light-theme overrides (article panels render light) ── */
  .article-panels-wrap .art-headline { color:#0F1730; }
  .article-panels-wrap .art-dek { color:#33405E; }
  .article-panels-wrap .art-dek strong { color:#0F1730; }
  .article-panels-wrap .art-byline { color:#5A6A88; border-color:rgba(15,23,48,0.12); }
  .article-panels-wrap .art-byline strong { color:#0F1730; }
  .article-panels-wrap .art-byline .art-dot { color:rgba(15,23,48,0.30); }
  .article-panels-wrap .art-body { color:#33405E; }
  .article-panels-wrap .fig-cap { color:#0F1730; }
  .article-panels-wrap .fig-src { color:#5A6A88; }
  .article-panels-wrap .verdict { background:#fff; background:color-mix(in srgb, var(--vaccent) 7%, #ffffff); border:1px solid color-mix(in srgb, var(--vaccent) 32%, #ffffff); border-left:6px solid var(--vaccent); border-radius:16px; padding:32px 36px; box-shadow:0 18px 48px rgba(15,23,48,0.13); margin:40px 0 0; }
  .article-panels-wrap .verdict-label { display:inline-block; background:var(--vaccent); color:#fff; padding:6px 13px; border-radius:20px; font-size:11px; letter-spacing:0.16em; margin-bottom:15px; }
  .article-panels-wrap .verdict-headline { color:#0F1730; font-size:clamp(23px,3.1vw,32px); line-height:1.18; }
  @media (max-width:600px){ .article-panels-wrap .verdict { padding:24px 22px; } }
  .article-panels-wrap .verdict-txt { color:#33405E; }
  .article-panels-wrap .verdict-foot { color:#4A5568; border-top-color:rgba(15,23,48,0.10); }
  .article-panels-wrap .verdict-sub { color:#5A6A88; }
  .article-panels-wrap .ev-dim { color:#33405E; }
  .article-panels-wrap .ev-bar { background:rgba(15,23,48,0.08); }
  .article-panels-wrap .chart-box { background:#fff; border-color:rgba(15,23,48,0.10); }
  .article-panels-wrap .chart-box h4 { color:#0F1730; }
  .article-panels-wrap .chart-box .chart-sub { color:#5A6A88; }
  .article-panels-wrap .ins-details { border-top-color:rgba(15,23,48,0.12); }
  .article-panels-wrap .ins-details > summary { color:#5A6A88; }
  .article-panels-wrap .ins-details > summary:hover { color:#0F1730; }
  .article-panels-wrap .s-subhead { color:#0F1730; }
  .article-panels-wrap .s-subnote { color:#4A5568; }

  /* ── Full-page article takeover (each insight opens as its own page) ── */
  .tab-pane.panel-open {
    display:block; position:fixed; inset:0; z-index:1200;
    background:#EEF2FA; overflow-y:auto; -webkit-overflow-scrolling:touch;
    animation:artFade 0.22s ease;
  }
  @keyframes artFade { from { opacity:0; } to { opacity:1; } }
  .tab-pane.panel-open .s-panel-close-row {
    position:sticky; top:0; z-index:6; margin:0 0 30px; padding:16px 0;
    background:rgba(238,242,250,0.92); backdrop-filter:saturate(140%) blur(8px); -webkit-backdrop-filter:saturate(140%) blur(8px);
    border-bottom:1px solid rgba(15,23,48,0.10);
  }

  /* ── Verdict evidence comparison (visual substantiation) ── */
  .verdict-sub { font-family:var(--body); font-size:14px; color:var(--muted); margin:0 0 16px; }
  .ev-grid { display:flex; flex-direction:column; gap:11px; }
  .ev-row { display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:18px; align-items:center; }
  .ev-head .ev-hcol { font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; font-weight:700; }
  .ev-dim { font-family:var(--body); font-size:13.5px; color:var(--off-white); }
  .ev-cell { display:flex; align-items:center; gap:10px; }
  .ev-bar { position:relative; flex:1; height:8px; border-radius:4px; background:rgba(255,255,255,0.07); }
  .ev-bar > i { position:absolute; left:0; top:0; bottom:0; border-radius:4px; }
  .ev-val { font-family:var(--display); font-size:14px; font-weight:700; min-width:52px; text-align:right; }
  @media (max-width:620px){ .ev-row { grid-template-columns:1fr; gap:5px; } .ev-row.ev-head { display:none; } .ev-dim { font-weight:600; margin-top:8px; } }

  

    #povguy-lang-toggle button.active{background:#4f9bff;color:#03071A;}
    .goog-te-banner-frame.skiptranslate,.goog-logo-link,.goog-te-gadget span{display:none!important;}
    body{top:0!important;}
    .goog-te-gadget{color:transparent!important;font-size:0!important;}
  
