@import url("reset.css");
@import url("font.css");

:root { --paper: #f7f4f0; --ink: #000; --pad: clamp(18px, 4vw, 62px); }
* { box-sizing: border-box; }
html, body { min-width: 320px; min-height: 100%; margin: 0; }
body { font-family: Inter, Arial, sans-serif; background: var(--paper); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.news-page { position: relative; min-height: 100svh; overflow: hidden; background: linear-gradient(120deg, rgb(221 230 241 / 92%), var(--paper) 42%, rgb(229 233 241 / 84%)); }.news-page::before, .news-page::after { content: ""; position: absolute; z-index: 0; border-radius: 50%; background: rgb(180 201 224 / 55%); filter: blur(52px); }.news-page::before { top: 9%; left: -12%; width: 34vw; height: 34vw; }.news-page::after { right: 11%; bottom: -20%; width: 38vw; height: 38vw; }
.news-header { position: relative; z-index: 3; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; padding: 25px var(--pad); }.news-header__logo img { width: 56px; height: 56px; }.news-nav { display: flex; align-items: center; justify-content: center; gap: clamp(18px, 3vw, 46px); padding: 13px 30px; border-radius: 999px; background: rgb(188 188 188 / 86%); font-size: clamp(13px, 1.25vw, 19px); white-space: nowrap; }.news-nav a:hover, .news-nav [aria-current="page"] { text-decoration: underline; text-underline-offset: 4px; }.news-menu { display: flex; grid-column: 3; justify-self: end; flex-direction: column; gap: 6px; width: 54px; padding: 11px 0 11px 18px; border: 0; background: transparent; cursor: pointer; }.news-menu span { display: block; width: 36px; height: 2px; background: var(--ink); }
.news-content { position: relative; z-index: 1; min-height: calc(100svh - 110px); padding: clamp(34px, 6vw, 100px) var(--pad) 0; }.news-content::before { content: ""; position: absolute; top: 11%; right: 10%; bottom: -30%; left: 10%; border: 1px solid rgb(66 91 96 / 25%); border-radius: 50%; transform: rotate(-16deg); }.news-content::after { content: ""; position: absolute; top: 29%; right: -10%; width: 78%; height: 1px; background: rgb(66 91 96 / 28%); transform: rotate(23deg); }.news-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 3vw, 52px); width: min(100%, 980px); margin: 0 auto; }.news-card { display: block; overflow: hidden; border: 1.5px solid #000; background: #000; }.news-card:hover { transform: translateY(-6px); transition: transform .2s ease; }.news-card img { width: 100%; aspect-ratio: .754; object-fit: cover; }
@media (max-width: 850px) { .news-nav { position: absolute; top: 92px; left: var(--pad); right: var(--pad); display: none; flex-direction: column; gap: 0; padding: 15px; text-align: center; box-shadow: 0 12px 24px rgb(0 0 0 / 12%); }.news-nav.is-open { display: flex; }.news-nav a { padding: 12px; }.news-content { min-height: calc(100svh - 90px); } }
@media (max-width: 520px) { .news-header { padding-block: 16px; }.news-header__logo img { width: 42px; height: 42px; }.news-menu { width: 42px; }.news-menu span { width: 30px; }.news-content { padding-top: 58px; }.news-grid { gap: 9px; }.news-card { border-width: 1px; } }
