@font-face {
  font-family: Gloock;
  src: url('../fonts/gloock.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Outfit;
  src: url('../fonts/outfit-regular.woff2') format('woff2');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Outfit;
  src: url('../fonts/outfit-medium.woff2') format('woff2');
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
}
:root {
  --page: #e8f2f3;
  --ink: #2c484b;
  --muted: #758d90;
  --white: #f9fcfc;
  --rail: 1140px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--page); color: var(--muted); font: 400 16px/1.4 Outfit, sans-serif; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--ink); }
button, input { font: inherit; }
.rail { width: min(var(--rail), calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: absolute; top: -100px; left: 10px; z-index: 100; background: white; padding: 8px; }
.skip-link:focus { top: 10px; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--ink); font-family: Gloock, Georgia, serif; font-weight: 400; }

.site-header { position: absolute; z-index: 30; inset: 0 0 auto; height: 95px; }
.site-header__inner { height: 95px; display: grid; grid-template-columns: 228px 1fr 170px; align-items: center; gap: 20px; }
.site-logo img { width: 228px; height: auto; }
.primary-nav { justify-self: center; }
.primary-nav__list { display: flex; align-items: center; gap: 41px; margin: 0; padding: 0; list-style: none; }
.primary-nav a { display: block; color: var(--ink); padding: 10px 0; line-height: 22px; }
.primary-nav .current-menu-item a { border-bottom: 2px solid var(--ink); }
.header-blog-link { color: var(--ink); font-size: 18px; text-decoration: underline; text-underline-offset: 3px; justify-self: end; white-space: nowrap; }
.menu-toggle { display: none; }

.home-hero { height: 1123px; background-position: center top; background-size: cover; background-repeat: no-repeat; overflow: hidden; }
.home-hero__inner { height: 100%; position: relative; }
.home-hero h1 { position: absolute; z-index: 2; top: 185px; left: 0; width: 100%; margin: 0; text-align: center; font-size: 64px; line-height: 1.06; }
.home-hero__justice { position: absolute; top: 255px; left: 311px; width: 518px; }
.home-hero__justice img { width: 100%; }
.reader-card { position: absolute; z-index: 3; top: 392px; left: 652px; width: 277px; min-height: 160px; padding: 17px 18px; background: var(--white); border-radius: 10px; box-shadow: 0 8px 24px rgb(44 72 75 / 3%); }
.reader-card__top { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: 18px; line-height: 1.1; }
.reader-card__top strong { font-weight: 500; }
.reader-card__avatars { width: 102px; flex: none; }
.reader-card p { margin: 23px 0 0; white-space: nowrap; font-size: 14px; }
.home-hero__handshake { position: absolute; top: 809px; left: 162px; width: 64px; }
.home-hero__gavel { position: absolute; top: 765px; left: 828px; width: 462px; }
.home-hero__intro { position: absolute; top: 1034px; left: 50%; transform: translateX(-50%); width: 335px; text-align: center; line-height: 22px; }
.trending-news { height: 986px; background-position: center center; background-size: cover; background-repeat: no-repeat; }
.trending-news__inner { height: 100%; position: relative; }
.trending-news h2 { margin: 0; padding-top: 86px; text-align: center; font-size: 36px; line-height: 38px; }
.trending-news__portrait { position: absolute; top: 341px; right: 0; width: 484px; border-radius: 44% 44% 12px 12px; overflow: hidden; }
.trending-news__portrait img { width: 100%; }

.resource-page { padding-top: 252px; min-height: 1785px; }
.resource-layout { display: grid; grid-template-columns: 354px 1fr; column-gap: 45px; }
.resource-topics h1 { font-size: 36px; line-height: 38px; margin: 0 0 35px; }
.resource-topics ul { list-style: none; margin: 0; padding: 0; }
.resource-topics li { margin-bottom: 17px; line-height: 22px; }
.resource-topics a { color: var(--ink); font-size: 18px; }
.resource-topics a::before { content: '⊙'; display: inline-block; margin-right: 9px; font-size: 18px; font-weight: 500; }
.resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 33px; row-gap: 37px; }
.topic-card { display: block; min-width: 0; }
.topic-card img { width: 100%; height: 330px; object-fit: cover; }
.topic-card__label { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 22px; }
.topic-card__icon { width: 14px; height: 14px; flex: none; color: var(--ink); }
.empty-outline { height: 136px; margin-top: 146px; border: 1px solid #c6dbde; border-radius: 31px; }

.about-hero { height: 1081px; background-position: center top; background-size: cover; background-repeat: no-repeat; }
.about-hero__inner { height: 100%; position: relative; }
.about-hero__portrait { position: absolute; top: 252px; left: 0; width: 484px; border-radius: 44% 44% 12px 12px; overflow: hidden; }
.about-hero__portrait img { width: 100%; }
.about-hero__ampersand { position: absolute; top: 761px; left: 448px; color: var(--white); font: 400 210px/1 Gloock, Georgia, serif; }
.faq-section { height: 1617px; padding-top: 142px; }
.faq-section h1 { margin: 0 0 48px; font-size: 36px; line-height: 38px; text-align: center; }
.faq-list { width: 684px; max-width: 100%; margin-inline: auto; }
.faq-item { margin: 0 0 7px; text-align: center; }
.faq-item summary { display: grid; place-items: center; min-height: 66px; padding: 10px 16px; border-radius: 10px; color: var(--ink); cursor: pointer; list-style: none; font-size: 18px; line-height: 24px; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item[open] summary { background: var(--white); }
.faq-answer { padding: 26px 60px 12px; }
.faq-answer p { margin: 0; line-height: 22px; }
.faq-section .empty-outline { margin-top: 250px; }
.blank-main--blog { height: 674px; padding-top: 413px; }
.blank-main--blog .empty-outline { margin: 0; }
.contact-main { height: 533px; padding-top: 252px; background-position: center top; background-size: cover; background-repeat: no-repeat; }
.contact-panel { width: 860px; height: 160px; margin: 0 auto; background: var(--white); border-radius: 20px; }
.empty-main { height: 0; }
.page15-main { height: 92px; }
.page15-main h1 { margin: 0; font-size: 32px; line-height: 1.2; }

.site-footer { min-height: 548px; background-position: center top; background-size: cover; background-repeat: no-repeat; }
.site-footer__inner { border-top: 1px solid #c6dbde; padding-top: 100px; }
.site-footer__columns { display: grid; grid-template-columns: 433px 1fr 1fr; gap: 150px; min-height: 285px; }
.site-footer__identity { border-right: 1px solid #c6dbde; padding-right: 140px; }
.site-footer__identity img { width: 276px; max-width: none; }
.site-footer__identity p { margin: 21px 0 0; max-width: 275px; line-height: 22px; }
.site-footer h2 { margin: 1px 0 31px; font: 400 22px/28px Outfit, sans-serif; white-space: nowrap; }
.site-footer__resources ul { list-style: none; margin: 0; padding: 0; }
.site-footer__resources li { margin: 0 0 10px; white-space: nowrap; }
.site-footer__resources li::before { content: '›'; color: #111; font-size: 24px; margin-right: 12px; line-height: 0; }
.site-footer__legal p { width: 290px; line-height: 22px; }
.site-footer__disclaimer { margin: 0 0 26px; line-height: 22px; }
.site-footer__copyright { margin: 0; line-height: 22px; }

@media (max-width: 767px) {
  .site-header { height: 95px; }
  .site-header.is-open { height: 213px; }
  .site-header__inner { grid-template-columns: 1fr 46px; gap: 0; }
  .site-logo img { width: 210px; }
  .header-blog-link { display: none; }
  .menu-toggle { display: flex; width: 33px; height: 33px; padding: 5px; margin-left: auto; flex-direction: column; justify-content: center; gap: 4px; border: 0; background: #dce8e9; cursor: pointer; transform: translateX(-53px); }
  .menu-toggle span { display: block; width: 23px; height: 2px; background: var(--ink); transition: transform .2s, opacity .2s; }
  .site-header.is-open .menu-toggle span:first-child { transform: translateY(6px) rotate(45deg); }
  .site-header.is-open .menu-toggle span:nth-child(2) { opacity: 0; }
  .site-header.is-open .menu-toggle span:last-child { transform: translateY(-6px) rotate(-45deg); }
  .primary-nav { display: none; position: absolute; top: 63px; right: 20px; width: 140px; padding: 11px 16px; background: var(--white); box-shadow: 0 7px 24px rgb(44 72 75 / 7%); }
  .site-header.is-open .primary-nav { display: block; }
  .primary-nav__list { display: block; }
  .primary-nav a { padding: 5px 0; line-height: 22px; }
  .primary-nav .current-menu-item a { border: 0; text-decoration: underline; }
  .home-hero { height: 902px; background-position: center top; }
  .home-hero h1 { top: 150px; font-size: 64px; line-height: 68px; }
  .home-hero__justice { top: 286px; left: 0; width: 350px; }
  .reader-card { top: 600px; left: 50px; width: 300px; min-height: 175px; }
  .reader-card__top { flex-direction: column; align-items: flex-start; gap: 0; }
  .reader-card p { margin-top: 25px; }
  .home-hero__handshake { display: none; }
  .home-hero__gavel { display: none; }
  .home-hero__intro { top: 814px; width: 330px; }
  .trending-news { height: 816px; background-position: center top; }
  .trending-news h2 { padding-top: 75px; }
  .trending-news__portrait { top: 383px; right: 0; width: 350px; }
  .resource-page { padding-top: 215px; min-height: 3187px; }
  .resource-layout { display: block; }
  .resource-topics h1 { text-align: center; margin: 0 0 20px; }
  .resource-topics li { text-align: center; margin-bottom: 13px; }
  .resource-topics a { font-size: 16px; }
  .resource-grid { display: block; margin-top: 138px; }
  .topic-card { margin-bottom: 32px; }
  .topic-card img { height: 327px; }
  .topic-card__label { font-size: 13px; }
  .empty-outline { height: 100px; margin-top: 82px; border-radius: 30px; }
  .about-hero { height: 783px; background-position: center top; }
  .about-hero__portrait { top: 245px; width: 350px; }
  .about-hero__ampersand { display: none; }
  .faq-section { height: 1515px; padding-top: 75px; }
  .faq-section h1 { max-width: 300px; margin: 0 auto 48px; line-height: 38px; }
  .faq-item { margin-bottom: 7px; }
  .faq-item summary { justify-items: start; text-align: left; font-size: 18px; line-height: 24px; }
  .faq-answer { padding: 25px 8px 15px; text-align: center; }
  .faq-section .empty-outline { margin-top: 185px; }
  .blank-main--blog { height: 472px; padding-top: 372px; }
  .contact-main { height: 390px; padding-top: 215px; }
  .contact-panel { width: 350px; max-width: calc(100% - 40px); height: 100px; border-radius: 18px; }
  .page15-main { height: 160px; }
  .site-footer { min-height: 1007px; background-position: center top; }
  .site-footer__inner { padding-top: 64px; }
  .site-footer__columns { display: block; text-align: center; min-height: 0; }
  .site-footer__identity { padding: 0; border: 0; }
  .site-footer__identity img { width: 350px; max-width: 100%; margin: 0 auto; }
  .site-footer__identity p { margin: 31px auto 0; max-width: 345px; }
  .site-footer__resources { margin-top: 98px; }
  .site-footer h2 { margin-bottom: 40px; }
  .site-footer__resources li { margin-bottom: 10px; }
  .site-footer__legal { margin-top: 73px; }
  .site-footer__legal p { margin: 30px auto 0; }
  .site-footer__disclaimer { margin: 94px 0 30px; text-align: center; }
  .site-footer__copyright { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .menu-toggle span { transition: none; }
}
