.citizenship-hero {
  --citizenship-reserve:152px;
  inline-size:min(100%,calc((100svh - var(--citizenship-reserve)) * 16 / 9));
  margin:clamp(16px,3svh,36px) auto 0;
}
.admin-bar .citizenship-hero { --citizenship-reserve:184px; }
.citizenship-hero-cover {
  position:relative; isolation:isolate; container-type:inline-size;
  border-radius:var(--radius); overflow:hidden; background:var(--ink); color:var(--white);
}
.citizenship-hero-art { display:block; width:100%; height:auto; }
.citizenship-hero-cover::after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(40deg,var(--ink) 5%,color-mix(in srgb,var(--ink) 90%,transparent) 24%,color-mix(in srgb,var(--ink) 52%,transparent) 44%,transparent 66%);
}
.citizenship-hero-title {
  position:absolute; z-index:1; inset-inline-start:clamp(22px,5cqi,68px); inset-block-end:clamp(22px,5cqi,68px);
  inline-size:44%; display:flex; flex-direction:column; align-items:flex-start;
}
.citizenship-hero-title h1 {
  color:var(--white); font-size:clamp(34px,6.2cqi,74px); line-height:.98;
  letter-spacing:-.035em; margin:0 0 14px; text-wrap:balance;
}
.citizenship-lead { font-size:clamp(15px,1.6cqi,18px); line-height:1.48; max-width:42ch; margin:0 0 20px; }
.citizenship-hero-title .button { background:var(--yellow); color:var(--ink); border-color:var(--yellow); }
.citizenship-hero-title .button:hover { background:var(--white); color:var(--ink); border-color:var(--white); }
.citizenship-hero-title .button:focus-visible { outline-color:var(--white); }
.citizenship-hero-title .button svg { transform:rotate(90deg); }
.citizenship-note { color:color-mix(in srgb,var(--white) 85%,var(--ink)); font-size:14px; line-height:1.4; margin:12px 0 0; }
.citizenship-catalog { max-inline-size:1120px; margin:clamp(30px,5vw,64px) auto 0; }
.citizenship-catalog #citizenship-exams { scroll-margin-top:120px; }
.citizenship-catalog .citizenship-featured-exam { grid-template-columns:minmax(0,1fr); }
.citizenship-featured-exam .unit-card-link { background:var(--soft); overflow:hidden; }
.citizenship-featured-exam .unit-card-cover { border-radius:0; }
.citizenship-featured-exam .unit-card-copy { padding:clamp(20px,3vw,36px); justify-content:center; }
.citizenship-featured-exam .unit-card-footer { margin-top:0; }
@media(min-width:701px) {
  .citizenship-featured-exam .unit-card-link { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; }
}
@media(max-width:800px), (max-height:510px) {
  .citizenship-hero { inline-size:100%; }
  .citizenship-hero-cover::after { display:none; }
  .citizenship-hero-title {
    position:relative; inset:auto; inline-size:auto;
    padding:6px clamp(18px,5vw,36px) clamp(24px,6vw,40px);
  }
  .citizenship-hero-title::before {
    content:""; position:absolute; inset-inline:0; inset-block-end:100%; block-size:30px; pointer-events:none;
    background:linear-gradient(transparent,var(--ink));
  }
  .citizenship-hero-title h1 { font-size:clamp(36px,7.6cqi,54px); margin-bottom:12px; text-wrap:initial; }
  .citizenship-lead { font-size:16px; margin-bottom:18px; }
  .citizenship-hero-title .button { min-height:48px; }
  .citizenship-catalog #citizenship-exams { scroll-margin-top:120px; }
}