
/* ==========================================================
   THE BOOMING MARKETS
   MARKET NEWS PAGE V1
   ========================================================== */

.mn-hero {
  background:
    radial-gradient(
      circle at 85% 10%,
      rgba(231, 183, 63, 0.08),
      transparent 28%
    ),
    linear-gradient(
      150deg,
      #0b1523,
      #07101b
    );

  border-bottom:
    1px solid rgba(226, 178, 58, 0.14);

  padding:
    72px 0
    56px;
}


.mn-hero h1 {
  font-size:
    clamp(
      38px,
      5vw,
      64px
    );

  line-height: 1.03;
  margin:
    10px 0
    16px;
}


.mn-hero p {
  color: #8d99a9;
  font-size: 16px;
  line-height: 1.7;
  max-width: 760px;
}


.mn-controls-section {
  background: #080d14;
  border-bottom:
    1px solid #172131;
  padding:
    24px 0
    20px;
  position: sticky;
  top: 0;
  z-index: 15;
}


.mn-controls {
  align-items: end;
  display: grid;
  gap: 20px;
  grid-template-columns:
    minmax(0, 1.8fr)
    minmax(0, 1fr)
    minmax(220px, 0.8fr);
}


.mn-control-group > span,
.mn-search-wrap label {
  color: #707d8f;
  display: block;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.1em;
  margin-bottom: 8px;
  text-transform: uppercase;
}


.mn-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}


.mn-filter-row button {
  background: #0d1520;
  border:
    1px solid #243144;
  border-radius: 999px;
  color: #9aa5b5;
  cursor: pointer;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.055em;
  padding:
    7px
    11px;
  transition:
    border-color 150ms ease,
    background 150ms ease,
    color 150ms ease;
}


.mn-filter-row button:hover {
  border-color:
    rgba(231, 183, 63, 0.55);
  color: #f0c65d;
}


.mn-filter-row button.active {
  background:
    linear-gradient(
      135deg,
      #f0cf66,
      #d69a19
    );

  border-color: #e8ba43;
  color: #0b1018;
}


.mn-impact-high-btn:not(.active) {
  border-color:
    rgba(221, 0, 0, 0.52) !important;
  color: #ff5555 !important;
}


.mn-search-wrap input {
  background: #0d1520;
  border:
    1px solid #253246;
  border-radius: 10px;
  color: #eef3f8;
  font-size: 12px;
  outline: none;
  padding:
    11px
    13px;
  width: 100%;
}


.mn-search-wrap input:focus {
  border-color:
    rgba(232, 185, 70, 0.58);
  box-shadow:
    0 0 0 3px
    rgba(226, 177, 54, 0.06);
}


.mn-summary-bar {
  align-items: center;
  border-top:
    1px solid #172131;
  display: flex;
  justify-content: space-between;
  margin-top: 18px;
  padding-top: 14px;
}


.mn-summary-bar > div:first-child {
  align-items: center;
  display: flex;
  gap: 10px;
}


.mn-summary-bar span {
  background:
    rgba(78, 215, 156, 0.08);
  border:
    1px solid rgba(78, 215, 156, 0.18);
  border-radius: 999px;
  color: #68d8a8;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.09em;
  padding:
    5px
    8px;
}


.mn-summary-bar strong {
  color: #d5dce5;
  font-size: 11px;
}


.mn-last-refresh {
  color: #647286;
  font-size: 9px;
}


.mn-feed-section {
  background:
    linear-gradient(
      180deg,
      #08111d,
      #070c13
    );

  min-height: 600px;
  padding:
    30px 0
    80px;
}


.mn-news-grid {
  display: grid;
  gap: 14px;
}


.mn-news-card {
  align-items: stretch;
  background:
    linear-gradient(
      145deg,
      #0f1825,
      #09111b
    );

  border:
    1px solid #202d3e;
  border-radius: 15px;
  display: grid;
  gap: 0;
  grid-template-columns:
    115px
    minmax(0, 1fr)
    160px;
  overflow: hidden;
  transition:
    border-color 180ms ease,
    transform 180ms ease;
}


.mn-news-card:hover {
  border-color:
    rgba(230, 182, 61, 0.43);
  transform:
    translateY(-1px);
}


.mn-news-side {
  align-items: center;
  border-right:
    1px solid #202d3e;
  display: flex;
  flex-direction: column;
  gap: 8px;
  justify-content: center;
  padding:
    18px
    12px;
}


.mn-impact {
  border:
    1px solid transparent;
  border-radius: 999px;
  font-size: 8.5px;
  font-weight: 950;
  letter-spacing: 0.075em;
  padding:
    5px
    9px;
}


.mn-impact.high {
  animation:
    mnHighImpactPulse
    1.15s
    ease-in-out
    infinite;

  background: #DD0000;
  border-color: #ff3b3b;
  color: #ffffff;

  box-shadow:
    0 0 8px
    rgba(221, 0, 0, 0.62);
}


@keyframes mnHighImpactPulse {
  0%,
  100% {
    background: #DD0000;
    opacity: 1;
    transform: scale(1);
  }

  50% {
    background: #ff1010;
    opacity: 0.84;
    transform: scale(1.06);
  }
}


.mn-impact.medium {
  background:
    rgba(231, 177, 47, 0.09);
  border-color:
    rgba(231, 177, 47, 0.24);
  color: #edc45b;
}


.mn-impact.low {
  background:
    rgba(72, 202, 152, 0.08);
  border-color:
    rgba(72, 202, 152, 0.2);
  color: #65d3a7;
}


.mn-market-tag {
  color: #e6b944;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.07em;
}


.mn-news-main {
  padding:
    18px
    21px;
}


.mn-news-main a {
  color: #eef2f7;
  display: inline-block;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.4;
  text-decoration: none;
}


.mn-news-main a:hover {
  color: #edc45c;
}


.mn-news-main p {
  color: #778599;
  display:
    -webkit-box;
  font-size: 11px;
  line-height: 1.65;
  margin:
    9px 0
    0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}


.mn-news-meta {
  align-items: flex-end;
  border-left:
    1px solid #202d3e;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding:
    18px;
  text-align: right;
}


.mn-news-meta strong {
  color: #96a2b2;
  font-size: 10px;
}


.mn-news-meta span {
  color: #5e6b7e;
  font-size: 9px;
  margin-top: 6px;
}


.mn-state-card {
  background: #0d1520;
  border:
    1px solid #202d3e;
  border-radius: 14px;
  color: #78869a;
  font-size: 12px;
  padding:
    32px
    22px;
  text-align: center;
}


@media (prefers-reduced-motion: reduce) {
  .mn-impact.high {
    animation: none;
  }
}


@media (max-width: 850px) {

  .mn-controls {
    grid-template-columns:
      1fr;
  }

  .mn-controls-section {
    position: static;
  }

  .mn-news-card {
    grid-template-columns:
      92px
      minmax(0, 1fr);
  }

  .mn-news-meta {
    align-items: flex-start;
    border-left: none;
    border-top:
      1px solid #202d3e;
    grid-column:
      1 / -1;
    padding:
      11px
      16px;
    text-align: left;
  }

}


@media (max-width: 600px) {

  .mn-hero {
    padding:
      48px 0
      38px;
  }

  .mn-hero p {
    font-size: 14px;
  }

  .mn-news-card {
    display: block;
  }

  .mn-news-side {
    border-bottom:
      1px solid #202d3e;
    border-right: none;
    flex-direction: row;
    justify-content: flex-start;
    padding:
      12px
      15px;
  }

  .mn-news-main {
    padding:
      16px;
  }

  .mn-news-main a {
    font-size: 14px;
  }

}

/* ==========================================================
   THE BOOMING MARKETS
   MARKET NEWS PAGE V2
   ========================================================== */


/* ----------------------------------------------------------
   HERO
   ---------------------------------------------------------- */

.mn-hero {
  position: relative;

  overflow: hidden;

  padding:
    82px 0
    64px !important;

  background:
    radial-gradient(
      circle at 80% 18%,
      rgba(223,179,73,.11),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #06162c 0%,
      #07162a 48%,
      #101a26 100%
    ) !important;
}

.mn-hero::after {
  content: "";

  position: absolute;

  width: 520px;
  height: 520px;

  top: -280px;
  right: -160px;

  border:
    1px solid
    rgba(221,177,65,.06);

  border-radius: 50%;
}

.mn-hero .wrap {
  position: relative;
  z-index: 1;
}

.mn-hero .eyebrow {
  color: #d7aa40;

  font-size: 9px;
  font-weight: 900;

  letter-spacing: .17em;
}

.mn-hero h1 {
  max-width: 900px;

  margin:
    13px
    0
    17px !important;

  color: #f1f5f9;

  font-size:
    clamp(
      3.3rem,
      5.2vw,
      5.6rem
    ) !important;

  line-height: .99 !important;

  letter-spacing: -.055em;
}

.mn-hero p {
  max-width: 720px;

  color: #96a5b8 !important;

  font-size: 15px !important;

  line-height: 1.75 !important;
}


/* ----------------------------------------------------------
   CONTROL DECK
   ---------------------------------------------------------- */

.mn-controls-section {
  position: sticky;

  top: 0;

  z-index: 50;

  padding:
    22px
    0
    18px !important;

  background:
    rgba(
      5,
      13,
      25,
      .96
    ) !important;

  backdrop-filter:
    blur(18px);

  border-bottom:
    1px solid
    rgba(
      255,
      255,
      255,
      .045
    ) !important;
}

.mn-controls {
  grid-template-columns:
    minmax(0,1.55fr)
    minmax(0,.8fr)
    minmax(240px,.65fr)
    !important;

  gap: 18px !important;
}

.mn-control-group > span,
.mn-search-wrap label {
  color: #687a91 !important;

  font-size: 8px !important;

  letter-spacing: .15em !important;
}

.mn-filter-row {
  gap: 6px !important;
}

.mn-filter-row button {
  min-height: 31px;

  padding:
    0
    10px !important;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .06
    ) !important;

  border-radius: 999px;

  background:
    rgba(
      255,
      255,
      255,
      .018
    ) !important;

  color: #8494a8 !important;

  font-size: 8px !important;
}

.mn-filter-row button.active {
  border-color:
    rgba(
      222,
      178,
      66,
      .35
    ) !important;

  background:
    linear-gradient(
      135deg,
      #e9bd4f,
      #d69a19
    ) !important;

  color: #08101b !important;
}

.mn-impact-high-btn:not(.active) {
  border-color:
    rgba(
      255,
      70,
      70,
      .28
    ) !important;

  color:
    #ff6b6b !important;
}

.mn-search-wrap input {
  min-height: 42px;

  padding:
    0
    13px !important;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .065
    ) !important;

  border-radius: 10px;

  background:
    rgba(
      255,
      255,
      255,
      .018
    ) !important;

  color: #dce4ed;
}


/* ----------------------------------------------------------
   SUMMARY BAR
   ---------------------------------------------------------- */

.mn-summary-bar {
  margin-top: 15px !important;

  padding-top: 13px !important;

  border-top:
    1px solid
    rgba(
      255,
      255,
      255,
      .045
    ) !important;
}

.mn-summary-bar span {
  background:
    rgba(
      75,
      217,
      150,
      .055
    ) !important;

  border:
    1px solid
    rgba(
      75,
      217,
      150,
      .12
    ) !important;

  color: #75cfa9 !important;
}

.mn-summary-bar strong {
  color: #c7d0db !important;
}

.mn-last-refresh {
  color: #5f7187 !important;
}


/* ----------------------------------------------------------
   NEWS FEED
   ---------------------------------------------------------- */

.mn-feed-section {
  padding:
    34px
    0
    82px !important;

  background:
    linear-gradient(
      180deg,
      #07101d,
      #050b13
    ) !important;
}

.mn-news-grid {
  gap: 10px !important;
}

.mn-news-card {
  grid-template-columns:
    108px
    minmax(0,1fr)
    155px
    !important;

  min-height: 120px;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .052
    ) !important;

  border-radius: 14px !important;

  background:
    linear-gradient(
      145deg,
      rgba(14,28,49,.96),
      rgba(6,14,28,.98)
    ) !important;

  box-shadow:
    0 14px 38px
    rgba(0,0,0,.10);

  transition:
    border-color .2s ease,
    transform .2s ease,
    box-shadow .2s ease;
}

.mn-news-card:hover {
  transform:
    translateY(-2px) !important;

  border-color:
    rgba(
      221,
      177,
      65,
      .18
    ) !important;

  box-shadow:
    0 22px 52px
    rgba(0,0,0,.18);
}


/* ----------------------------------------------------------
   LEFT IMPACT COLUMN
   ---------------------------------------------------------- */

.mn-news-side {
  border-right:
    1px solid
    rgba(
      255,
      255,
      255,
      .045
    ) !important;

  padding:
    16px
    10px !important;
}

.mn-impact {
  font-size: 7px !important;

  padding:
    5px
    8px !important;
}

.mn-market-tag {
  color: #d9ac43 !important;

  font-size: 10px !important;
}


/* ----------------------------------------------------------
   MAIN STORY
   ---------------------------------------------------------- */

.mn-news-main {
  display: flex;

  flex-direction: column;

  justify-content: center;

  padding:
    17px
    20px !important;
}

.mn-news-main a {
  max-width: 900px;

  color: #e9eef5 !important;

  font-size: 14px !important;

  line-height: 1.42 !important;

  letter-spacing: -.01em;
}

.mn-news-main a:hover {
  color: #dfb34a !important;
}

.mn-news-main p {
  max-width: 920px;

  margin-top:
    7px !important;

  color: #76879b !important;

  font-size: 10px !important;

  line-height: 1.65 !important;
}


/* ----------------------------------------------------------
   SOURCE + TIME
   ---------------------------------------------------------- */

.mn-news-meta {
  align-items: flex-end;

  padding:
    16px !important;

  border-left:
    1px solid
    rgba(
      255,
      255,
      255,
      .045
    ) !important;
}

.mn-news-meta strong {
  color: #8999ad !important;

  font-size: 9px !important;
}

.mn-news-meta span {
  color: #576a80 !important;

  font-size: 8px !important;
}


/* ----------------------------------------------------------
   HIGH IMPACT
   Reduce aggressive pulsing
   ---------------------------------------------------------- */

.mn-impact.high {
  animation:
    mnHighImpactPulseV2
    1.8s
    ease-in-out
    infinite !important;

  box-shadow:
    0 0 10px
    rgba(
      221,
      0,
      0,
      .34
    ) !important;
}

@keyframes mnHighImpactPulseV2 {

  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: .82;
  }

}


/* ----------------------------------------------------------
   EMPTY / LOADING STATE
   ---------------------------------------------------------- */

.mn-state-card {
  min-height: 120px;

  display: grid;

  place-items: center;

  border:
    1px solid
    rgba(
      255,
      255,
      255,
      .05
    ) !important;

  border-radius: 14px;

  background:
    rgba(
      255,
      255,
      255,
      .015
    ) !important;

  color: #66788e !important;
}


/* ----------------------------------------------------------
   TABLET
   ---------------------------------------------------------- */

@media (max-width: 950px) {

  .mn-controls {
    grid-template-columns:
      1fr !important;
  }

  .mn-controls-section {
    position: relative;
  }

}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 620px) {

  .mn-hero {
    padding:
      58px
      0
      44px !important;
  }

  .mn-hero h1 {
    font-size:
      clamp(
        2.7rem,
        12vw,
        4rem
      ) !important;
  }

  .mn-news-card {
    display: block;
  }

  .mn-news-side {
    flex-direction: row;

    justify-content:
      flex-start;

    border-right: none !important;

    border-bottom:
      1px solid
      rgba(
        255,
        255,
        255,
        .045
      ) !important;
  }

  .mn-news-meta {
    align-items:
      flex-start;

    border-left:
      none !important;

    border-top:
      1px solid
      rgba(
        255,
        255,
        255,
        .045
      ) !important;

    text-align: left;
  }

}

/* ===== END MARKET NEWS PAGE V2 ===== */

/* ==========================================================
   MARKET NEWS V2 - FINAL POLISH
   ========================================================== */

/* Slightly tighter hero */
.mn-hero {
  padding-top: 68px !important;
  padding-bottom: 52px !important;
}

/* Tighter article summaries for faster scanning */
.mn-news-main p {
  line-height: 1.55 !important;

  -webkit-line-clamp: 2 !important;
}

/* Slightly reduce card height */
.mn-news-card {
  min-height: 112px !important;
}

/* Cleaner story title rhythm */
.mn-news-main a {
  line-height: 1.36 !important;
}

/* Slightly stronger separation between feed rows */
.mn-news-grid {
  gap: 9px !important;
}
