/* crowd6's own sheet (senior2 07:21 UTC 15 Oct 2026): the content pages 23 · 24 · 26 · 27 · 28 · 29 · 30 · 31 built to the v2 mocks; linked after ee.c2.css in base.html */
/* Every px is the mock's at that width: from 1024 up it is divided by the root zoom (1.1), so the page shows the mock's pixels; below 1024
   the zoom is 1 and the px is the mock's as written. Every rule is scoped to its page's own classes: the sheet loads on every page. */

/* ----- 23 ABOUT ----- */
main:has(> .ab-hero) { max-width: none; padding: 0 24px; background: #fff; }
main:has(> .ab-hero) > section { max-width: calc(1136px / var(--zoom, 1)); margin-inline: auto; }
.ab-eye { display: block; font-size: calc(12px / var(--zoom, 1)); line-height: 1.2; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; color: var(--t-blue); }
.ab-hero { padding: calc(79px / var(--zoom, 1)) 0 calc(38px / var(--zoom, 1)); border-bottom: 1px solid #e0e7ee; }
.ab-hero h1, main:has(> .ab-hero) h2, main:has(> .ab-hero) h3 { text-wrap: wrap; }
.ab-hero h1 { display: block; margin: calc(16px / var(--zoom, 1)) 0 0; font-size: calc(48px / var(--zoom, 1)); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--t-ink); }
.ab-blue { color: var(--t-blue); }
.ab-lead { max-width: calc(640px / var(--zoom, 1)); margin: calc(19px / var(--zoom, 1)) 0 0; font-size: calc(19px / var(--zoom, 1)); line-height: 1.58; color: var(--t-body); }
.ab-acts { display: flex; gap: calc(12px / var(--zoom, 1)); margin: calc(25px / var(--zoom, 1)) 0 0; }
.ab-btn { display: inline-flex; align-items: center; justify-content: center; gap: calc(10px / var(--zoom, 1)); min-height: calc(44px / var(--zoom, 1)); padding: 0 calc(17px / var(--zoom, 1)); box-sizing: border-box;
  border: 1px solid #cdd5de; border-radius: 6px; background: #fff; color: var(--t-ink); font-size: calc(13px / var(--zoom, 1)); font-weight: 600; line-height: 1.25; text-decoration: none !important; }
.ab-btn:hover { border-color: #b4c0cc; color: var(--t-ink); }
.ab-btn.ab-primary { border-color: var(--t-blue); background: var(--t-blue); color: #fff; box-shadow: 0 1px 2px rgba(16, 24, 40, .12); }
.ab-btn.ab-primary:hover { background: var(--accent-2, #005a95); border-color: var(--accent-2, #005a95); color: #fff; }
.ab-btn:focus-visible { outline: 2px solid var(--t-blue); outline-offset: 2px; }
.ab-btn svg { flex: none; }

.ab-sec h2, .ab-believe h2, .ab-built h2 { margin: 0; font-size: calc(29.3px / var(--zoom, 1)); line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.ab-sub { margin: calc(13px / var(--zoom, 1)) 0 0; font-size: calc(16px / var(--zoom, 1)); line-height: 1.5; color: var(--t-body); }
.ab-result { padding: calc(41px / var(--zoom, 1)) 0 calc(53px / var(--zoom, 1)); }
.ab-three { list-style: none; margin: calc(28px / var(--zoom, 1)) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(30px / var(--zoom, 1)); }
.ab-lined li { border-top: 2px solid #bfd7e8; padding-top: calc(20px / var(--zoom, 1)); }
.ab-n { display: block; font-size: calc(14px / var(--zoom, 1)); line-height: 1.2; font-weight: 700; letter-spacing: .08em; color: var(--t-body); }
.ab-three h3 { margin: calc(21px / var(--zoom, 1)) 0 0; font-size: calc(18px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.ab-three p { margin: calc(12px / var(--zoom, 1)) 0 0; font-size: calc(14px / var(--zoom, 1)); line-height: calc(24px / var(--zoom, 1)); color: var(--t-body); }

.ab-believe { padding: calc(34px / var(--zoom, 1)) calc(32px / var(--zoom, 1)) calc(52px / var(--zoom, 1)); border: 1px solid #dde7ef; border-radius: 12px; background: #f3f7fb; }
.ab-believe .ab-sub { margin-top: calc(14px / var(--zoom, 1)); }
.ab-believe ol { list-style: none; margin: calc(49px / var(--zoom, 1)) 0 0; padding: 0; }
.ab-believe li { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: calc(20px / var(--zoom, 1)) 0; border-top: 1px solid #e0e7ee; }
.ab-believe li:first-child { border-top: 0; padding-top: 0; }
.ab-believe li:last-child { padding-bottom: 0; }
.ab-believe h3 { margin: 0; font-size: calc(16px / var(--zoom, 1)); line-height: calc(21.6px / var(--zoom, 1)); font-weight: 700; letter-spacing: -.01em; color: var(--t-ink); }
.ab-believe li p { margin: calc(5px / var(--zoom, 1)) 0 0; font-size: calc(14px / var(--zoom, 1)); line-height: 1.5; color: var(--t-body); }
.ab-bn { flex: none; font-size: calc(16px / var(--zoom, 1)); font-weight: 400; color: var(--t-nav); }

.ab-started { padding: calc(39px / var(--zoom, 1)) 0 calc(53px / var(--zoom, 1)); border-top: 1px solid #e0e7ee; border-bottom: 1px solid #e0e7ee; }
.ab-started .ab-three { margin-top: calc(31px / var(--zoom, 1)); }
.ab-started .ab-three h3 { margin-top: calc(23px / var(--zoom, 1)); }
.ab-started .ab-three p { margin-top: calc(11px / var(--zoom, 1)); }

.ab-built { display: flex; align-items: center; gap: calc(40px / var(--zoom, 1)); padding: calc(42px / var(--zoom, 1)) 0 calc(120px / var(--zoom, 1)); }
.ab-built h2 { align-self: flex-start; flex: none; width: calc(254px / var(--zoom, 1)); }
.ab-built p { flex: 1; margin: 0; font-size: calc(16px / var(--zoom, 1)); line-height: 1.5; color: var(--t-body); }
.ab-built .ab-btn { flex: none; }

@media (max-width: 1023px) {
  .ab-hero { padding-top: 59px; }
  .ab-hero h1 { font-size: 40.6px; }
  .ab-lead { max-width: 690px; font-size: 16.7px; line-height: 27px; }
  .ab-acts { margin-top: 24px; }
  .ab-sec h2, .ab-believe h2, .ab-built h2 { font-size: 29.9px; }
  .ab-believe h3 { font-size: 16.5px; }
  .ab-believe { padding-bottom: 51px; }
  .ab-believe ol { margin-top: 48px; }
  .ab-result { padding-top: 42px; padding-bottom: 54px; }
  .ab-three { margin-top: 27px; }
  .ab-three h3, .ab-started .ab-three h3 { margin-top: 22px; }
  .ab-three p { margin-top: 11px; }
  .ab-built { display: block; padding-top: 42px; padding-bottom: 104px; }
  .ab-built h2 { width: auto; }
  .ab-built p { margin-top: 13px; }
  .ab-built .ab-btn { margin-top: 22px; }
}
@media (max-width: 720px) {
  main:has(> .ab-hero) { padding: 0 20px; }
  .ab-hero { padding-top: 34px; padding-bottom: 28px; }
  .ab-hero h1 { font-size: 34.2px; line-height: 37px; }
  .ab-lead { font-size: 16px; line-height: 27px; }
  .ab-acts { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 11px; margin-top: 20px; }
  .ab-sec h2, .ab-believe h2, .ab-built h2 { font-size: 26.7px; }
  .ab-sub { font-size: 14px; line-height: 23px; }
  .ab-result { padding-top: 28px; padding-bottom: 44px; }
  .ab-three { grid-template-columns: 1fr; gap: 0; margin-top: 24px; }
  .ab-three li + li { margin-top: 43px; }
  .ab-lined li { padding-top: 20px; }
  .ab-lined li + li { margin-top: 39px; }
  .ab-n { font-size: 13px; }
  .ab-three h3, .ab-started .ab-three h3 { margin-top: 13px; }
  .ab-three p, .ab-started .ab-three p { margin-top: 12px; font-size: 12.75px; line-height: 22px; }
  .ab-believe { padding: 24px 24px 38px; }
  .ab-believe ol { margin-top: 46px; }
  .ab-believe li { display: block; padding: 21px 0 20px; }
  .ab-believe li p { font-size: 12.75px; line-height: 18.5px; }
  .ab-bn { display: block; margin-top: 23px; }
  .ab-started { padding-top: 30px; padding-bottom: 46px; }
  .ab-started .ab-sub { margin-top: 15px; }
  .ab-started .ab-three { margin-top: 27px; }
  .ab-built { padding-top: 28px; padding-bottom: 69px; }
  .ab-built .ab-btn { margin-top: 21px; }
  .ab-built p { font-size: 14px; line-height: 24px; }
}
@media (max-width: 400px) {
  main:has(> .ab-hero) { padding: 0 16px; }
  .ab-acts .ab-primary { padding: 10.5px 24px; line-height: 20px; }
  .ab-believe h3 { line-height: 24px; }
  .ab-believe li p { line-height: 20px; margin-top: 4px; }
  .ab-believe { padding-bottom: 41px; }
  .ab-believe ol { margin-top: 45px; }
  .ab-believe li { padding: 20px 0 19px; }
  .ab-bn { margin-top: 21px; }
}

/* ----- 24 DOCS ----- */
main:has(> .dc-shell) { max-width: none; padding: 0 24px; background: #fff; }
.dc-shell { display: grid; grid-template-columns: calc(242px / var(--zoom, 1)) minmax(0, 1fr); max-width: calc(1002px / var(--zoom, 1)); margin: 0 auto; padding: calc(60px / var(--zoom, 1)) 0 calc(50px / var(--zoom, 1)); }
.dc-rail { position: sticky; top: calc(24px / var(--zoom, 1)); align-self: start; display: flex; flex-direction: column; align-items: flex-start; }
.dc-rail p { margin: 0 0 calc(15px / var(--zoom, 1)); font-size: calc(14.5px / var(--zoom, 1)); line-height: 1.4; font-weight: 700; color: var(--t-ink); }
.dc-rail a, .dc-fold nav a { display: block; padding: calc(12px / var(--zoom, 1)) 0; font-size: calc(14.1px / var(--zoom, 1)); line-height: 1.4; color: var(--t-body); text-decoration: none; }
.dc-rail a:hover, .dc-fold nav a:hover { color: var(--t-blue); }
.dc-body h1, .dc-body h2, .dc-body h3 { text-wrap: wrap; }
.dc-eye { display: block; font-size: calc(14px / var(--zoom, 1)); line-height: 1.2; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: var(--t-body); }
.dc-hero h1 { display: block; margin: calc(22px / var(--zoom, 1)) 0 0; font-size: calc(43px / var(--zoom, 1)); line-height: calc(50px / var(--zoom, 1)); font-weight: 700; letter-spacing: -.03em; color: var(--t-ink); }
.dc-sub { margin: calc(21px / var(--zoom, 1)) 0 0; font-size: calc(15px / var(--zoom, 1)); line-height: 1.6; letter-spacing: -.005em; color: var(--t-body); }
.dc-fold { display: none; }
.dc-cards { display: grid; grid-template-columns: 1fr 1fr; gap: calc(16px / var(--zoom, 1)); margin: calc(27px / var(--zoom, 1)) 0 0; padding-bottom: calc(35px / var(--zoom, 1)); border-bottom: 1px solid #e0e7ee; }
.dc-cards a { display: block; padding: calc(20px / var(--zoom, 1)) calc(20px / var(--zoom, 1)); border: 1px solid #cadce9; border-radius: 6px; background: #f3f8fc; text-decoration: none !important; }
.dc-cards a:hover { border-color: var(--t-blue); }
.dc-cards b { display: block; font-size: calc(14.5px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; color: var(--t-ink); }
.dc-cards span { display: block; margin-top: calc(10px / var(--zoom, 1)); font-size: calc(12px / var(--zoom, 1)); line-height: 1.4; color: var(--t-body); }
.dc-cards svg, .dc-more svg { vertical-align: -1px; }
.dc-sec { padding: calc(27px / var(--zoom, 1)) 0 calc(28px / var(--zoom, 1)); border-bottom: 1px solid #e0e7ee; }
.dc-sec:last-child { border-bottom: 0; }
#start { padding-bottom: calc(45px / var(--zoom, 1)); }
#devices { padding-bottom: calc(29px / var(--zoom, 1)); }
#checks { padding-bottom: calc(26px / var(--zoom, 1)); }
#api { padding-bottom: calc(29px / var(--zoom, 1)); }
.dc-sec h2 { margin: 0; font-size: calc(25.2px / var(--zoom, 1)); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.dc-sec > p { max-width: calc(650px / var(--zoom, 1)); margin: calc(11px / var(--zoom, 1)) 0 0; font-size: calc(14.8px / var(--zoom, 1)); line-height: calc(27.5px / var(--zoom, 1)); color: var(--t-body); }
.dc-steps { list-style: none; margin: calc(24px / var(--zoom, 1)) 0 0; padding: 0; }
.dc-steps li { position: relative; padding: calc(28px / var(--zoom, 1)) 0 0 calc(47px / var(--zoom, 1)); }
.dc-steps li + li { margin-top: calc(39px / var(--zoom, 1)); }
.dc-num { position: absolute; left: 0; top: 0; display: grid; place-items: center; width: calc(30px / var(--zoom, 1)); height: calc(30px / var(--zoom, 1)); box-sizing: border-box; border: 1px solid #cfe0ed; border-radius: 7px; background: #eef5fa; font-size: calc(13px / var(--zoom, 1)); font-weight: 700; color: #245c86; }
.dc-steps h3 { margin: 0; font-size: calc(17.6px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; letter-spacing: -.01em; color: var(--t-ink); }
.dc-steps p { margin: calc(6px / var(--zoom, 1)) 0 0; font-size: calc(16px / var(--zoom, 1)); line-height: calc(26px / var(--zoom, 1)); color: var(--t-body); }
.dc-chips { display: flex; gap: calc(12px / var(--zoom, 1)); margin: calc(15px / var(--zoom, 1)) 0 0 !important; }
.dc-chips span { padding: calc(6px / var(--zoom, 1)) calc(7px / var(--zoom, 1)); border-radius: 4px; background: #eaf3fa; font-size: calc(10.8px / var(--zoom, 1)); line-height: 1.3; font-weight: 600; color: #0e5d99; }
.dc-sec > p.dc-more { margin-top: calc(15px / var(--zoom, 1)); }
.dc-more a { font-size: calc(16px / var(--zoom, 1)); color: var(--t-blue); text-decoration: none; }
.dc-more a:hover { text-decoration: underline; }
.dc-devs { list-style: none; margin: calc(14px / var(--zoom, 1)) 0 0; padding: 0; }
.dc-devs li { display: flex; align-items: center; justify-content: space-between; padding: calc(19px / var(--zoom, 1)) calc(2px / var(--zoom, 1)) calc(19px / var(--zoom, 1)) 0; border-bottom: 1px solid #e0e7ee; }
.dc-devs b { display: block; font-size: calc(16px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; color: var(--t-ink); }
.dc-devs span { display: block; margin-top: calc(8px / var(--zoom, 1)); font-size: calc(15px / var(--zoom, 1)); line-height: 1.4; color: var(--t-body); }
.dc-devs svg { flex: none; color: var(--t-nav); }
.dc-sec > p.dc-line { margin-top: calc(11px / var(--zoom, 1)); font-size: calc(14.5px / var(--zoom, 1)); letter-spacing: .006em; }
.dc-code { margin: calc(15px / var(--zoom, 1)) 0 0; padding: calc(21px / var(--zoom, 1)) calc(22px / var(--zoom, 1)); border-radius: 10px; background: #122d46; color: #e8eef5; font-family: var(--code); font-size: calc(13px / var(--zoom, 1)); line-height: 1.65; white-space: pre; overflow-x: auto; }
.dc-code code { font: inherit; color: inherit; background: none; padding: 0; }
.dc-acts { display: flex; flex-wrap: wrap; gap: calc(12px / var(--zoom, 1)); margin: calc(13px / var(--zoom, 1)) 0 0 !important; }
.dc-btn { display: inline-flex; align-items: center; min-height: calc(44px / var(--zoom, 1)); padding: 0 calc(17px / var(--zoom, 1)); box-sizing: border-box; border: 1px solid #cdd5de; border-radius: 6px; background: #fff; color: var(--t-ink); font-size: calc(13px / var(--zoom, 1)); font-weight: 600; text-decoration: none !important; }
.dc-btn:hover { border-color: #b4c0cc; }
.dc-btn.dc-primary { border-color: var(--t-blue); background: var(--t-blue); color: #fff; }
.dc-btn.dc-primary:hover { background: var(--accent-2, #005a95); border-color: var(--accent-2, #005a95); }
.dc-btn:focus-visible, .dc-cards a:focus-visible { outline: 2px solid var(--t-blue); outline-offset: 2px; }
.dc-results { margin: calc(31px / var(--zoom, 1)) 0 0; }
.dc-results > div { padding: calc(18px / var(--zoom, 1)) 0 calc(19px / var(--zoom, 1)); border-bottom: 1px solid #e0e7ee; }
.dc-results > div:first-child { padding-top: 0; }
.dc-results > div:last-child { border-bottom: 0; padding-bottom: 0; }
.dc-results dt { margin: 0; }
.dc-results dd { margin: calc(6px / var(--zoom, 1)) 0 0; font-size: calc(14px / var(--zoom, 1)); line-height: 1.5; color: var(--t-body); }
.dc-pill { display: inline-block; padding: calc(4px / var(--zoom, 1)) calc(7px / var(--zoom, 1)); border-radius: 4px; font-size: calc(11.5px / var(--zoom, 1)); line-height: 1.3; font-weight: 600; }
.dc-pill.ok { background: #e8f5ef; color: #077c59; }   /* the mock's #087f5b stands 4.46 to 1 on its tint: one step darker for the 4.5 the look tests hold */
.dc-pill.bad { background: #fff0ed; color: #b42318; }
.dc-pill.look { background: #fff3db; color: #925400; }
.dc-pill.none { background: #edf1f5; color: #475467; }
@media (max-width: 1023px) {
  .dc-shell { display: block; padding-top: 42px; padding-bottom: 39px; }
  .dc-sec h2 { font-size: 25.9px; }
  .dc-hero h1 { margin-top: 18px; }
  .dc-rail { display: none; }
  .dc-fold { display: block; max-width: 420px; margin: 16px 0 0; padding-bottom: 19px; border-bottom: 1px solid #e0e7ee; }
  .dc-cards { margin-top: 26px; }
  .dc-results > div { padding: 19px 0 20px; }
  .dc-fold summary { display: flex; align-items: center; gap: 8px; min-height: 44px; font-size: 16px; font-weight: 600; color: var(--t-ink); cursor: pointer; list-style: none; }
  .dc-fold summary::-webkit-details-marker { display: none; }
  .dc-fold summary::before { content: ""; border: 5px solid transparent; border-left: 8px solid var(--t-ink); border-right: 0; }
  .dc-fold[open] summary::before { transform: rotate(90deg); }
  .dc-fold nav { padding: 0 0 8px 16px; }
}
@media (max-width: 720px) {
  main:has(> .dc-shell) { padding: 0 20px; }
  .dc-shell { padding-top: 29px; padding-bottom: 13px; }
  .dc-eye { font-size: 13.2px; }
  .dc-hero h1 { font-size: 35.5px; line-height: 40px; }
  .dc-sub { font-size: 14px; line-height: 24px; }
  .dc-cards { grid-template-columns: 1fr; gap: 12px; margin-top: 24px; padding-bottom: 28px; }
  .dc-cards a { padding: 17px 17px 18px; }
  .dc-cards b { font-size: 14.2px; }
  .dc-cards span { font-size: 11.1px; }
  .dc-sec h2 { font-size: 23.2px; }
  .dc-sec > p, .dc-sec > p.dc-line { font-size: 14px; line-height: 25px; }
  .dc-code { font-size: 11.5px; padding-top: 18px; padding-bottom: 18px; }
  .dc-sec { padding-top: 23px; }
  .dc-steps { margin-top: 21px; }
  .dc-steps p { max-width: 330px; }
  .dc-results { margin-top: 33px; }
  #checks > p:first-of-type { margin-top: 14px; }
  #start { padding-bottom: 43px; } #ownership { padding-bottom: 25px; } #checks { padding-bottom: 26px; } #devices { padding-bottom: 27px; } #api { padding-bottom: 26px; }
}
@media (max-width: 400px) { main:has(> .dc-shell) { padding: 0 16px; } .dc-hero h1 { font-size: 31.9px; line-height: 36px; } }

/* ----- /docs/api — the reference that left /docs with mock 24; no mock of its own: the old reference blocks in the docs column ----- */
main:has(> .docs-api) { max-width: calc(1002px / var(--zoom, 1)); }
.docs-api > .docs-sec:first-child { border-top: 0; padding-top: calc(44px / var(--zoom, 1)); }
.docs-api .dca-h { margin: 0 0 calc(12px / var(--zoom, 1)); font-size: calc(29.3px / var(--zoom, 1)); line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
/* ----- 26 SECURITY (the about page's hero and type roles; its own blocks) ----- */
main:has(> .sc-hero) { max-width: none; padding: 0 24px; background: #fff; }
main:has(> .sc-hero) > section { max-width: calc(1136px / var(--zoom, 1)); margin-inline: auto; }
main:has(> .sc-hero) h1, main:has(> .sc-hero) h2, main:has(> .sc-hero) h3 { text-wrap: wrap; }
.sc-hero { padding: calc(79px / var(--zoom, 1)) 0 0; }
.sc-hero h1 { display: block; margin: calc(16px / var(--zoom, 1)) 0 0; font-size: calc(48px / var(--zoom, 1)); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--t-ink); }
.sc-three ol { list-style: none; margin: 0; padding: calc(67px / var(--zoom, 1)) 0 calc(16px / var(--zoom, 1)); display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(30px / var(--zoom, 1)); border-bottom: 1px solid #e0e7ee; }
.sc-n { display: block; font-size: calc(14px / var(--zoom, 1)); line-height: 1.2; font-weight: 700; letter-spacing: .08em; color: var(--t-blue); }
.sc-three h3 { margin: calc(21px / var(--zoom, 1)) 0 0; font-size: calc(18px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.sc-three p { margin: calc(12px / var(--zoom, 1)) 0 0; font-size: calc(14px / var(--zoom, 1)); line-height: calc(24px / var(--zoom, 1)); color: var(--t-body); }
.sc-controls { padding: calc(39px / var(--zoom, 1)) 0 calc(64px / var(--zoom, 1)); }
.sc-controls h2, .sc-band h2 { margin: 0; font-size: calc(29.5px / var(--zoom, 1)); line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.sc-hero .ab-lead { letter-spacing: -.005em; }
.sc-controls dl { display: grid; grid-template-columns: 1fr 1fr; column-gap: calc(34px / var(--zoom, 1)); margin: calc(28px / var(--zoom, 1)) 0 0; }
.sc-controls dl > div { padding: calc(22px / var(--zoom, 1)) 0 calc(24px / var(--zoom, 1)); border-top: 1px solid #e0e7ee; }
.sc-controls dl > div:nth-last-child(-n+2) { padding-bottom: 0; }
.sc-controls dt { font-size: calc(18px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.sc-controls dd { margin: calc(14px / var(--zoom, 1)) 0 0; font-size: calc(14px / var(--zoom, 1)); line-height: calc(23px / var(--zoom, 1)); color: var(--t-body); }
.sc-report { padding: 0 0 calc(83px / var(--zoom, 1)); }
.sc-band h2 { font-size: calc(25.5px / var(--zoom, 1)) !important; flex: none; }
.sc-band { display: flex; align-items: center; gap: calc(24px / var(--zoom, 1)); padding: calc(28px / var(--zoom, 1)) calc(32px / var(--zoom, 1)); border: 1px solid #d3e3ee; border-radius: 12px; background: #eff6fb; }
.sc-band p { flex: 1; margin: 0; font-size: calc(16px / var(--zoom, 1)); line-height: 1.5; color: var(--t-body); }
.sc-band .ab-btn { flex: none; }
.sc-chips { display: flex; flex-wrap: wrap; gap: calc(12px / var(--zoom, 1)); margin: 0; }
@media (max-width: 1023px) {
  .sc-hero { padding-top: 59px; }
  .sc-hero h1 { font-size: 40.6px; }
  .sc-controls h2, .sc-band h2 { font-size: 29.9px; }
  .sc-band { display: block; }
  .sc-report { padding-bottom: 72px; }
  .sc-controls dl { column-gap: 26px; }
  .sc-band h2 { font-size: 25.25px !important; }
  .sc-band p { margin-top: 14px; }
  .sc-band .ab-btn { margin-top: 22px; }
}
@media (max-width: 720px) {
  main:has(> .sc-hero) { padding: 0 20px; }
  .sc-hero { padding-top: 34px; }
  .sc-hero h1 { font-size: 34.2px; line-height: 37px; }
  .sc-three ol { grid-template-columns: 1fr; gap: 0; }
  .sc-three li + li { margin-top: 40px; }
  .sc-controls h2, .sc-band h2 { font-size: 26.7px; }
  .sc-controls dl { grid-template-columns: 1fr; }
  .sc-controls dl > div:nth-last-child(2) { padding-bottom: 20px; }
  .sc-band { padding: 25px 26px 24px; }
  .sc-report { padding-bottom: 41px; }
  .sc-band h2 { font-size: 24.3px !important; }
  .sc-band p { font-size: 14px; line-height: 23px; }
  .sc-band .ab-btn { margin-top: 20px; }
  .sc-three ol { padding-top: 53px; }
  .sc-three h3 { margin-top: 12px; }
  .sc-three p { margin-top: 11px; font-size: 12.85px; line-height: 22px; }
  .sc-three li + li { margin-top: 41px; }
  .sc-controls { padding-top: 29px; padding-bottom: 51px; }
  .sc-controls dl { margin-top: 25px; }
  .sc-controls dl > div { padding: 21px 0 20px; }
  .sc-controls dd { margin-top: 13px; font-size: 12.85px; line-height: 22px; }
}
@media (max-width: 400px) { main:has(> .sc-hero) { padding: 0 16px; } }

/* ----- 27 CONTACT (the about page's hero and type roles; four address cards) ----- */
main:has(> .ct-hero) { max-width: none; padding: 0 24px; background: #fff; }
main:has(> .ct-hero) > section { max-width: calc(1136px / var(--zoom, 1)); margin-inline: auto; }
main:has(> .ct-hero) h1, main:has(> .ct-hero) h2 { text-wrap: wrap; }
.ct-hero { padding: calc(79px / var(--zoom, 1)) 0 0; }
.ct-hero h1 { display: block; margin: calc(16px / var(--zoom, 1)) 0 0; font-size: calc(48px / var(--zoom, 1)); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; color: var(--t-ink); }
.ct-cards { display: grid; grid-template-columns: 1fr 1fr; gap: calc(25px / var(--zoom, 1)) calc(24px / var(--zoom, 1)); padding-top: calc(63px / var(--zoom, 1)); }
.ct-card { padding: calc(26px / var(--zoom, 1)) calc(27px / var(--zoom, 1)) calc(27px / var(--zoom, 1)); border: 1px solid #e1e7ed; border-radius: 12px; background: #fff; }
.ct-card.ct-main { border-color: #c5ddef; border-top: 3px solid var(--t-blue); background: #eff7fc; padding-top: calc(26px / var(--zoom, 1)); }
.ct-card h2 { margin: 0; font-size: calc(20.5px / var(--zoom, 1)); line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.ct-card p { margin: calc(18px / var(--zoom, 1)) 0 0; font-size: calc(14px / var(--zoom, 1)); line-height: 1.5; color: var(--t-body); }
.ct-card p.ct-addr { margin-top: calc(16px / var(--zoom, 1)); }
.ct-addr a { color: var(--t-blue); text-decoration: none; }
.ct-addr a:hover { text-decoration: underline; }
.ct-card .ab-btn { margin-top: calc(16px / var(--zoom, 1)); }
.ct-context { padding: calc(42px / var(--zoom, 1)) 0 calc(121px / var(--zoom, 1)); }
.ct-context h2 { margin: 0; font-size: calc(29.3px / var(--zoom, 1)); line-height: 1.15; font-weight: 700; letter-spacing: -.02em; color: var(--t-ink); }
.ct-context p { margin: calc(14px / var(--zoom, 1)) 0 0; font-size: calc(16px / var(--zoom, 1)); line-height: 1.6; color: var(--t-body); }
.ct-context p.ct-shot { margin-top: calc(25px / var(--zoom, 1)); }
.ct-acts { display: flex; flex-wrap: wrap; gap: calc(12px / var(--zoom, 1)); margin-top: calc(14px / var(--zoom, 1)) !important; }
@media (max-width: 1023px) {
  .ct-hero { padding-top: 59px; }
  .ct-hero h1 { font-size: 40.6px; }
  .ct-context h2 { font-size: 29.9px; }
  .ct-context { padding-bottom: 108px; }
  .ct-context p { font-size: 16.15px; }
}
@media (max-width: 720px) {
  main:has(> .ct-hero) { padding: 0 20px; }
  .ct-hero { padding-top: 34px; }
  .ct-hero h1 { font-size: 34.2px; line-height: 37px; }
  .ct-cards { grid-template-columns: 1fr; padding-top: 50px; }
  .ct-card, .ct-card.ct-main { padding: 22px 23px 26px; }
  .ct-card p { margin-top: 17px; font-size: 13px; }
  .ct-card p.ct-addr { margin-top: 15px; }
  .ct-card .ab-btn { margin-top: 15px; }
  .ct-context h2 { font-size: 26.7px; }
  .ct-context { padding-top: 30px; padding-bottom: 69px; }
  .ct-context p { margin-top: 12px; font-size: 14px; line-height: 24px; }
  .ct-context p.ct-shot { font-size: 16px; }
}
@media (max-width: 400px) { main:has(> .ct-hero) { padding: 0 16px; } .ct-context p.ct-shot { max-width: 300px; } }
