/* Page 10 v4 candidate — explicit website preview in the page hero. */
.news-page-v2 .corporate-hero.news {
  min-height: 540px;
}
.news-page-v2 .corporate-hero.news::before {
  background:
    radial-gradient(circle at 82% 28%, rgba(55,125,215,.25), transparent 29%),
    linear-gradient(112deg, #040e27 0%, #071a40 58%, #0a3270 100%);
}
.news-page-v2 .corporate-hero.news::after { opacity: .12; }

.news-page-v2 .news-hero-grid {
  min-height: 540px;
  padding-top: 58px;
  padding-bottom: 58px;
  display: grid;
  grid-template-columns: minmax(300px,.72fr) minmax(500px,1.28fr);
  gap: 72px;
  align-items: center;
}
.news-hero-copy { position: relative; z-index: 2; }

.news-hero-visual {
  position: relative;
  z-index: 2;
  height: 376px;
  margin: 0;
  overflow: hidden;
  color: #fff;
  background:
    linear-gradient(rgba(81,142,215,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(81,142,215,.10) 1px, transparent 1px),
    linear-gradient(145deg,#dfe9f6,#b9cce4);
  background-size: 28px 28px, 28px 28px, auto;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 18px;
  box-shadow: 0 30px 76px rgba(0,0,0,.36);
}
.news-hero-visual-head {
  position: absolute;
  z-index: 5;
  top: 0;
  left: 0;
  right: 0;
  height: 42px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: rgba(4,14,39,.94);
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.news-hero-visual-head span { color: var(--cyan); font-size: 7px; font-weight: 900; letter-spacing: .15em; }
.news-hero-visual-head b { color: rgba(255,255,255,.66); font-size: 7px; letter-spacing: .12em; }

.news-hero-desktop {
  position: absolute;
  z-index: 2;
  left: 30px;
  top: 76px;
  width: calc(100% - 86px);
  height: 245px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(8,30,67,.22);
  border-radius: 9px;
  box-shadow: 0 24px 48px rgba(15,42,83,.30);
  transform: perspective(1100px) rotateY(-2deg) rotateX(.8deg);
}
.news-hero-browser-bar { height: 24px; padding: 0 10px; display: flex; align-items: center; gap: 5px; color: #75849b; background: #f6f8fb; border-bottom: 1px solid #dfe5ed; font-size: 6px; }
.news-hero-browser-bar i { width: 5px; height: 5px; border-radius: 50%; background: #c6ccd5; }
.news-hero-browser-bar i:first-child { background: #ef7a7a; }
.news-hero-browser-bar i:nth-child(2) { background: #e6b754; }
.news-hero-browser-bar i:nth-child(3) { background: #64bf92; }
.news-hero-browser-bar span { margin-left: 7px; padding: 3px 13px; background: #e9eef5; border-radius: 999px; }
.news-hero-desktop > img { width: 100%; height: calc(100% - 24px); object-fit: cover; object-position: top; }

.news-hero-phone {
  position: absolute;
  z-index: 3;
  right: 21px;
  bottom: 23px;
  width: 108px;
  height: 229px;
  overflow: hidden;
  background: #fff;
  border: 5px solid #06152f;
  border-radius: 17px;
  box-shadow: 0 22px 44px rgba(8,30,67,.38);
}
.news-hero-phone > span { position: absolute; z-index: 2; top: 6px; left: 50%; width: 36px; height: 3px; transform: translateX(-50%); background: rgba(255,255,255,.74); border-radius: 5px; }
.news-hero-phone img { width: 100%; height: 100%; object-fit: cover; object-position: top; }

.news-hero-visual figcaption {
  position: absolute;
  z-index: 4;
  left: 0;
  right: 0;
  bottom: 0;
  height: 42px;
  padding: 0 150px 0 18px;
  display: flex;
  align-items: center;
  gap: 9px;
  color: #152b4d;
  background: rgba(241,246,252,.92);
  border-top: 1px solid rgba(8,30,67,.13);
  backdrop-filter: blur(8px);
}
.news-hero-visual figcaption i { width: 7px; height: 7px; background: #20a879; border-radius: 50%; box-shadow: 0 0 0 4px rgba(32,168,121,.13); }
.news-hero-visual figcaption span { font-size: 7px; font-weight: 900; letter-spacing: .12em; }
.news-hero-visual figcaption strong { margin-left: auto; color: #31537f; font-size: 7px; letter-spacing: .1em; }

@media (max-width: 1100px) {
  .news-page-v2 .news-hero-grid { grid-template-columns: minmax(260px,.74fr) minmax(430px,1.26fr); gap: 38px; }
  .news-hero-visual { height: 342px; }
  .news-hero-desktop { left: 24px; top: 70px; width: calc(100% - 70px); height: 220px; }
  .news-hero-phone { right: 17px; width: 96px; height: 204px; }
}

@media (max-width: 860px) {
  .news-page-v2 .corporate-hero.news,
  .news-page-v2 .corporate-hero.news .news-hero-grid { min-height: 760px; }
  .news-page-v2 .news-hero-grid { grid-template-columns: 1fr; gap: 30px; padding-top: 55px; padding-bottom: 50px; align-content: center; }
  .news-hero-copy { max-width: 650px; }
  .news-hero-visual { width: min(100%, 660px); height: 320px; }
}

@media (max-width: 600px) {
  .news-page-v2 .corporate-hero.news,
  .news-page-v2 .corporate-hero.news .news-hero-grid { min-height: 690px; }
  .news-page-v2 .news-hero-grid { gap: 24px; padding-top: 44px; padding-bottom: 42px; }
  .news-hero-visual { height: 270px; border-radius: 13px; }
  .news-hero-visual-head { height: 36px; padding-inline: 11px; }
  .news-hero-visual-head span,
  .news-hero-visual-head b { font-size: 6px; }
  .news-hero-desktop { left: 16px; top: 56px; width: calc(100% - 48px); height: 174px; transform: none; }
  .news-hero-phone { right: 11px; bottom: 16px; width: 72px; height: 153px; border-width: 4px; border-radius: 13px; }
  .news-hero-visual figcaption { height: 34px; padding: 0 92px 0 13px; }
  .news-hero-visual figcaption strong { display: none; }
}

@media (max-width: 350px) {
  .news-page-v2 .corporate-hero.news,
  .news-page-v2 .corporate-hero.news .news-hero-grid { min-height: 660px; }
  .news-hero-visual { height: 246px; }
  .news-hero-desktop { height: 154px; }
  .news-hero-phone { width: 65px; height: 138px; }
}
