.news-page main a:not(.news-jumpbar a) { color: #315fa8; }
.news-page main a:hover { color: #244780; }
.news-page .nav-parent.active { color: var(--coral-dark); }
.news-page .nav-parent.active::after { content: ''; position: absolute; right: 0; bottom: 5px; left: 0; height: 2px; border-radius: 2px; background: var(--coral); }

.news-hero {
  position: relative;
  overflow: hidden;
  color: white;
  background:
    radial-gradient(circle at 82% 15%, rgba(255, 94, 103, .32), transparent 29%),
    radial-gradient(circle at 92% 92%, rgba(99, 216, 181, .19), transparent 32%),
    linear-gradient(135deg, #23072e, #4d1458 60%, #74204f);
}
.news-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .1;
  background-image: linear-gradient(115deg, transparent 46%, #fff 46.2%, transparent 46.5%), radial-gradient(circle, #fff 1px, transparent 1.5px);
  background-size: 150px 150px, 42px 42px;
  mask-image: linear-gradient(90deg, transparent 5%, #000);
}
.news-hero-inner {
  position: relative;
  max-width: 1200px;
  min-height: 560px;
  margin: auto;
  padding: 70px 35px;
  display: grid;
  grid-template-columns: minmax(0, 1.23fr) minmax(330px, .77fr);
  align-items: center;
  gap: 68px;
}
.news-hero-copy { min-width: 0; }
.news-hero h1 { max-width: 760px; }
.news-hero-copy p { max-width: 720px; color: #eadceb; }
.news-hero-copy strong { color: white; }
.news-hero-copy a { color: #92ead0 !important; font-weight: 800; }

.signal-board {
  position: relative;
  padding: 25px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 23px;
  background: rgba(26, 5, 34, .5);
  box-shadow: 0 27px 55px rgba(14, 2, 20, .32);
  backdrop-filter: blur(12px);
}
.signal-board::after { content: ''; position: absolute; top: -65px; right: -65px; width: 155px; height: 155px; border: 25px solid rgba(99, 216, 181, .08); border-radius: 50%; }
.signal-board > * { position: relative; z-index: 1; }
.signal-topline { padding-bottom: 15px; display: flex; justify-content: space-between; border-bottom: 1px solid rgba(255, 255, 255, .12); color: #c8adca; font-size: 8px; font-weight: 850; letter-spacing: 1.7px; }
.signal-live { color: #8ce5ca; }
.signal-live i { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 10px var(--mint); animation: signal-pulse 1.6s infinite; }
@keyframes signal-pulse { 50% { opacity: .35; transform: scale(.75); } }
.signal-display { padding: 25px 0; display: grid; grid-template-columns: 68px 1fr; align-items: center; gap: 17px; }
.signal-icon { width: 68px; height: 68px; display: grid; place-items: center; border-radius: 19px; background: linear-gradient(145deg, var(--coral), #f68b6d); box-shadow: 0 13px 25px rgba(14, 2, 20, .28); }
.signal-icon svg { width: 40px; height: 40px; fill: none; stroke: white; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.signal-label { display: block; margin-bottom: 5px; color: #ffbfaa; font-size: 8px; font-weight: 850; letter-spacing: 1.5px; }
.signal-display strong { display: block; color: white; font-size: 23px; }
.signal-display small { display: block; margin-top: 5px; color: #d7c1d9; font-size: 11px; }
.signal-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.signal-meta span { padding: 13px; border: 1px solid rgba(255, 255, 255, .11); border-radius: 11px; color: white; font-size: 10px; font-weight: 800; }
.signal-meta small { display: block; margin-bottom: 5px; color: #a98eac; font-size: 7px; letter-spacing: 1.2px; }
.signal-wave { height: 38px; margin-top: 18px; display: flex; align-items: center; gap: 6px; }
.signal-wave i { width: 4px; height: 10px; border-radius: 5px; background: linear-gradient(var(--mint), #56a9bf); animation: wave 1.25s ease-in-out infinite; }
.signal-wave i:nth-child(2n) { animation-delay: -.35s; }
.signal-wave i:nth-child(3n) { animation-delay: -.7s; }
.signal-wave i:nth-child(5n) { animation-delay: -1s; }
@keyframes wave { 0%, 100% { height: 8px; opacity: .55; } 50% { height: 32px; opacity: 1; } }

.news-content { max-width: 1160px; margin: auto; padding: 62px 30px 82px; }
.desk-intro { margin-bottom: 30px; display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 18px; }
.desk-line { width: 36px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--coral), #ffb16e); }
.desk-intro h2 { font-size: 31px; }
.desk-intro p { margin: 0; color: #a1779f; font-size: 8px; font-weight: 850; letter-spacing: 1.4px; }

.android-grid { scroll-margin-top: 110px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.update-card { position: relative; min-width: 0; padding: 34px; overflow: hidden; border: 1px solid var(--line); border-radius: 23px; background: white; box-shadow: 0 14px 36px rgba(53, 19, 68, .07); }
.update-card::after { content: ''; position: absolute; right: -65px; bottom: -65px; width: 155px; height: 155px; border: 24px solid rgba(255, 94, 103, .05); border-radius: 50%; }
.update-card > * { position: relative; z-index: 1; }
.article-meta { display: flex; align-items: center; gap: 12px; color: #9b889e; font-size: 8px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.platform-mark { padding: 8px 10px; border-radius: 8px; background: #ffe8e6; color: var(--coral-dark); }
.context-mark { background: #ece5f5; color: #6e45a3; }
.update-card h2 { margin: 20px 0 22px; font-size: 30px; }
.update-card p { font-size: 14px; }
.volume-visual { width: 100%; max-width: 320px; margin-top: 27px; display: grid; grid-template-columns: 20px 1fr 20px; align-items: center; gap: 10px; color: var(--coral-dark); font-size: 18px; font-weight: 800; }
.volume-visual div { position: relative; height: 8px; border-radius: 8px; background: #f2dfe1; }
.volume-visual div::before { content: ''; position: absolute; inset: 0 34% 0 0; border-radius: inherit; background: linear-gradient(90deg, var(--coral), #ff9a74); }
.volume-visual i { position: absolute; top: 50%; left: 64%; width: 18px; height: 18px; border: 4px solid white; border-radius: 50%; background: var(--coral); box-shadow: 0 2px 8px rgba(54, 19, 67, .25); transform: translate(-50%, -50%); }
.version-context { background: linear-gradient(145deg, #f5eef8, #fff 78%); }
.version-track { margin-top: 27px; display: flex; align-items: center; gap: 7px; color: #73598a; font-size: 8px; font-weight: 850; }
.version-track span:first-child { padding: 8px; border-radius: 7px; background: var(--plum); color: white; }
.version-track i { min-width: 5px; height: 1px; flex: 1; background: #cdbdd4; }

.ios-section { scroll-margin-top: 110px; margin-top: 42px; overflow: hidden; border: 1px solid #dcd4e4; border-radius: 25px; background: #fbf9fc; box-shadow: 0 16px 40px rgba(53, 19, 68, .06); }
.ios-header { padding: 28px 34px; display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 17px; border-bottom: 1px solid #e4dce8; background: linear-gradient(100deg, #eae2f2, #f7f2f8); }
.ios-symbol { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 16px; background: #7653a6; color: white; }
.ios-symbol svg { width: 31px; height: 31px; fill: currentColor; }
.ios-header h2 { font-size: 31px; }
.ios-date { padding-left: 25px; border-left: 1px solid #cfc2d7; color: #9a869e; font-size: 7px; line-height: 1.6; letter-spacing: 1.2px; }
.ios-date strong { color: var(--plum); font-size: 10px; }
.ios-story, .ios-more { position: relative; padding: 38px 34px; display: grid; grid-template-columns: 45px minmax(0, 1fr) 210px; gap: 25px; border-bottom: 1px solid #e7dfe9; }
.story-index { display: flex; flex-direction: column; align-items: center; gap: 11px; color: #84659a; font-size: 9px; font-weight: 850; }
.story-index i { width: 1px; min-height: 105px; flex: 1; background: linear-gradient(#b49bc3, transparent); }
.story-version { color: #7a56a9; font-size: 8px; font-weight: 850; letter-spacing: 1.4px; }
.ios-story-copy h2 { margin: 9px 0 20px; font-size: 28px; }
.ios-story-copy p { font-size: 14px; }
.face-visual { position: relative; min-height: 205px; align-self: center; border-radius: 22px; background: linear-gradient(145deg, #291034, #5d2868); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); }
.face-visual span { position: absolute; width: 35px; height: 35px; border-color: #8ce5ca; border-style: solid; }
.face-visual span:nth-child(1) { top: 34px; left: 34px; border-width: 3px 0 0 3px; border-radius: 10px 0 0; }
.face-visual span:nth-child(2) { top: 34px; right: 34px; border-width: 3px 3px 0 0; border-radius: 0 10px 0 0; }
.face-visual span:nth-child(3) { bottom: 34px; left: 34px; border-width: 0 0 3px 3px; border-radius: 0 0 0 10px; }
.face-visual span:nth-child(4) { right: 34px; bottom: 34px; border-width: 0 3px 3px 0; border-radius: 0 0 10px; }
.face-visual i { position: absolute; top: 50%; left: 50%; width: 55px; height: 68px; border: 3px solid #ff9895; border-top-color: transparent; border-radius: 45%; transform: translate(-50%, -48%); }
.audio-story { grid-template-columns: 45px minmax(0, 1fr); }
.audio-compare { grid-column: 2; margin-top: 5px; padding: 15px; display: grid; grid-template-columns: 1fr 33px 1fr; align-items: center; gap: 12px; border: 1px solid #d9d1e0; border-radius: 13px; background: white; }
.audio-compare span { padding: 12px; border-radius: 9px; background: #fff0ef; color: var(--plum); font-size: 10px; font-weight: 850; text-align: center; }
.audio-compare span:last-child { background: #edf8f5; }
.audio-compare small { display: block; margin-bottom: 4px; color: #a17494; font-size: 7px; letter-spacing: 1px; }
.audio-compare i { color: var(--coral-dark); font-size: 20px; font-style: normal; text-align: center; }
.ios-more { grid-template-columns: 45px minmax(0, 1fr); border-bottom: 0; }
.ios-more-content h2 { margin-bottom: 23px; font-size: 28px; }
.ios-note-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.ios-note-grid section { padding: 24px; border: 1px solid #ded5e5; border-radius: 17px; background: white; }
.note-icon { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 11px; background: #ffe9e7; color: var(--coral-dark); font-size: 11px; font-weight: 900; }
.watch-icon { background: #e6f7f2; color: #188b74; }
.ios-note-grid h3 { margin: 16px 0 10px; color: var(--plum); font-size: 18px; }
.ios-note-grid p { margin-bottom: 0; font-size: 13px; }
.notes-date { margin: 18px 0 0; padding: 16px 18px; border-left: 3px solid #7653a6; background: #f0eaf5; font-size: 13px; }

.topic-grid { scroll-margin-top: 110px; margin-top: 42px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.topic-card { padding: 34px; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: 0 14px 34px rgba(53, 19, 68, .06); }
.topic-card-top { display: flex; align-items: center; gap: 12px; }
.topic-card-top .topic-label { margin: 0; }
.topic-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: #ffe8e7; color: var(--coral-dark); font-size: 19px; font-weight: 900; }
.topic-card h2 { margin: 18px 0 20px; font-size: 28px; }
.topic-card p { font-size: 14px; }
.access-card { background: #effaf7; border-color: #cce9e0; }
.access-card .topic-icon { background: #1b9b81; color: white; font-size: 9px; }
.access-card .topic-label { color: #16836d; }
.highlight-line { padding: 12px 15px; border-left: 3px solid #1b9b81; background: rgba(255, 255, 255, .75); color: #47665f; font-weight: 750; }

.resolution-section { margin-top: 42px; padding: 43px; display: grid; grid-template-columns: .75fr 1.25fr; gap: 55px; overflow: hidden; border-radius: 24px; color: white; background: radial-gradient(circle at 100% 0%, rgba(255, 94, 103, .24), transparent 36%), linear-gradient(130deg, var(--plum-deep), #5d1e66); }
.resolution-section h2, .resolution-section p, .resolution-section strong { color: white; }
.resolution-label { display: inline-block; margin-bottom: 13px; padding: 8px 10px; border-radius: 8px; background: rgba(255, 255, 255, .1); color: #ffaaa5; font-size: 8px; font-weight: 850; letter-spacing: 1.5px; }
.resolution-copy { padding-left: 27px; border-left: 1px solid rgba(255, 255, 255, .18); }
.resolution-copy p:first-child { margin-top: 0; }
.resolution-copy p:last-child { margin-bottom: 0; }
.resolution-copy a { color: #8ce5ca !important; font-weight: 800; }
.check-row { margin: 20px 0; display: flex; align-items: center; gap: 10px; color: #ffbfaa; font-size: 8px; font-weight: 850; letter-spacing: 1.2px; }
.check-row span { padding: 8px 10px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 8px; }
.check-row i { min-width: 10px; height: 1px; flex: 1; background: rgba(255, 255, 255, .24); }

.news-page .faq-section { scroll-margin-top: 110px; margin-top: 42px; }

.reveal { transition: opacity .55s ease, transform .55s ease; }
.js-ready .reveal:not(.is-visible) { opacity: 0; transform: translateY(22px); }

@media (max-width: 960px) {
  .news-hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .signal-board { max-width: 700px; }
  .ios-story { grid-template-columns: 38px minmax(0, 1fr); }
  .face-visual { grid-column: 2; min-height: 165px; }
  .resolution-section { gap: 35px; }
}

@media (max-width: 760px) {
  .desk-intro { grid-template-columns: 36px 1fr; }
  .desk-intro p { display: none; }
  .android-grid, .topic-grid { grid-template-columns: 1fr; }
  .ios-header { grid-template-columns: 50px 1fr; }
  .ios-date { grid-column: 2; padding: 0; border: 0; }
  .resolution-section { grid-template-columns: 1fr; gap: 25px; }
  .resolution-copy { padding: 0; border: 0; }
}

@media (max-width: 620px) {
  .news-page .nav-parent.active::after { display: none; }
  .news-hero-inner { min-height: 0; padding: 42px 21px 48px; }
  .news-hero h1 { font-size: 38px; }
  .signal-board { padding: 20px; border-radius: 19px; }
  .signal-display { grid-template-columns: 58px 1fr; }
  .signal-icon { width: 58px; height: 58px; }
  .signal-display strong { font-size: 20px; }
  .news-content { padding: 42px 17px 58px; }
  .desk-intro h2 { font-size: 27px; }
  .update-card { padding: 27px 20px; border-radius: 19px; }
  .update-card h2 { font-size: 25px; }
  .article-meta { align-items: flex-start; flex-direction: column; }
  .version-track { flex-wrap: wrap; }
  .version-track i { min-width: 8px; }
  .ios-section { margin-top: 30px; border-radius: 19px; }
  .ios-header { padding: 23px 19px; }
  .ios-header h2 { font-size: 26px; }
  .ios-story, .ios-more { padding: 28px 18px; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; }
  .story-index i { min-height: 75px; }
  .ios-story-copy h2, .ios-more-content h2 { font-size: 24px; }
  .face-visual, .audio-compare { grid-column: 1 / -1; margin-left: 40px; }
  .audio-compare { grid-template-columns: 1fr; }
  .audio-compare i { transform: rotate(90deg); }
  .ios-note-grid { grid-template-columns: 1fr; }
  .ios-note-grid section { padding: 21px 18px; }
  .topic-grid { margin-top: 30px; }
  .topic-card { padding: 27px 20px; border-radius: 19px; }
  .topic-card h2 { font-size: 24px; }
  .resolution-section { margin-top: 30px; padding: 29px 20px; border-radius: 19px; }
  .check-row { gap: 5px; }
  .check-row span { padding: 7px 6px; font-size: 7px; }
  .news-page .faq-section { margin-top: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .signal-live i, .signal-wave i { animation: none !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}
