/* Full screen layout foundation, 2026-09-24.
   Sections use the viewport; long form copy keeps a readable measure. */
:root {
  --fs-ink: #132823;
  --fs-ink-soft: #24443b;
  --fs-paper: #f6f4ec;
  --fs-white: #fffdf8;
  --fs-accent: #dc7950;
  --fs-line: rgba(19, 40, 35, .18);
  --fs-gutter: clamp(20px, 3.8vw, 88px);
  --fs-reading: 820px;
}

.home-portal,
.fs-root-list,
.fs-root-article,
.fs-area,
.fs-region,
.fs-page-content {
  overflow-x: clip;
}

.home-portal .csd-shell,
.fs-root-list .csd-shell,
.fs-root-article .csd-shell,
.fs-area .csd-shell,
.fs-region .csd-shell,
.fs-page-content .csd-shell {
  width: calc(100% - var(--fs-gutter) * 2);
  max-width: none;
  margin-inline: auto;
}

.home-portal .csd-shell.ns-header-inner,
.fs-root-list .csd-shell.ns-header-inner,
.fs-root-article .csd-shell.ns-header-inner,
.fs-area .csd-shell.ns-header-inner,
.fs-region .csd-shell.ns-header-inner,
.fs-page-content .csd-shell.ns-header-inner {
  width: calc(100% - var(--fs-gutter) * 2);
  max-width: none;
}

.home-portal :is(h1, h2, h3),
.fs-root-list :is(h1, h2, h3),
.fs-root-article :is(h1, h2, h3),
.fs-area :is(h1, h2, h3),
.fs-region :is(h1, h2, h3) {
  text-wrap: balance;
}

/* Home: split editorial cover with a full-height image and an open-width index. */
.home-portal .hp-hero {
  padding-top: 0;
  background: var(--fs-ink);
}
.home-portal .hp-hero-grid {
  display: grid;
  width: 100%;
  min-height: min(850px, calc(100svh - 80px));
  grid-template-columns: minmax(0, 48%) minmax(0, 52%);
  gap: 0;
  padding: 0;
  align-items: stretch;
}
.home-portal .hp-hero-copy {
  display: flex;
  max-width: none;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: clamp(52px, 6vw, 112px) var(--fs-gutter);
}
.home-portal .hp-overline {
  margin-bottom: clamp(22px, 3vw, 54px);
  font-size: 13px;
}
.home-portal .hp-hero h1 {
  max-width: 15ch;
  font-size: clamp(50px, 5.25vw, 104px);
  line-height: 1.09;
  letter-spacing: -.055em;
}
.home-portal .hp-hero h1 span { color: #a9dcc9; }
.home-portal .hp-hero-lead {
  max-width: 34em;
  margin-top: clamp(24px, 3vw, 44px) !important;
  font-size: clamp(16px, 1.05vw, 20px);
  line-height: 1.85;
}
.home-portal .hp-hero-links a {
  min-height: 54px;
  padding-inline: 24px;
  font-size: 14px;
}
.home-portal .hp-boundary {
  max-width: 48em;
  margin-top: 32px !important;
  font-size: 12px;
}
.home-portal .hp-route-board {
  display: grid;
  min-height: 660px;
  grid-template-rows: minmax(180px, 1fr) auto auto;
  overflow: hidden;
  border: 0;
  background: #163b32;
  box-shadow: none;
}
.home-portal .hp-hero-photo {
  height: 100%;
  min-height: 0;
  grid-area: 1 / 1 / 4 / 2;
  background: #27473c;
}
.home-portal .hp-hero-photo::after {
  background: linear-gradient(180deg, rgba(8, 31, 25, .05) 10%, rgba(8, 31, 25, .22) 34%, rgba(8, 31, 25, .95) 96%);
}
.home-portal .hp-hero-photo figcaption {
  right: var(--fs-gutter);
  bottom: auto;
  left: var(--fs-gutter);
  top: clamp(28px, 4vw, 72px);
}
.home-portal .hp-hero-photo figcaption span { font-size: 12px; }
.home-portal .hp-hero-photo figcaption strong { font-size: clamp(20px, 2vw, 34px); }
.home-portal .hp-board-head {
  z-index: 1;
  grid-area: 2 / 1;
  padding: 30px var(--fs-gutter) 12px;
  border: 0;
  color: #fff;
  background: transparent;
}
.home-portal .hp-board-head span { color: #a9dcc9; font-size: 12px; }
.home-portal .hp-board-head strong { font-size: clamp(20px, 1.5vw, 27px); }
.home-portal .hp-route-board ol {
  z-index: 1;
  display: grid;
  grid-area: 3 / 1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 28px;
  padding: 0 var(--fs-gutter) 40px;
  color: #fff;
}
.home-portal .hp-route-board li {
  min-height: 78px;
  padding: 13px 0;
  border-color: rgba(255, 255, 255, .3);
}
.home-portal .hp-route-board li > b { color: #f7ae86; font-size: 12px; }
.home-portal .hp-route-board li strong { font-size: 16px; }
.home-portal .hp-route-board li span { color: rgba(255, 255, 255, .75); font-size: 12px; }
.home-portal .hp-route-board li em { color: #d6f4e7; background: rgba(255, 255, 255, .15); font-size: 11px; }
.home-portal .hp-hero-index { width: 100%; }
.home-portal .hp-hero-index article { padding-inline: var(--fs-gutter); }
.home-portal .hp-hero-index span { font-size: 12px; }
.home-portal .hp-hero-index strong { font-size: clamp(16px, 1.1vw, 21px); }
.home-portal :is(.hp-services, .hp-continuity, .hp-products, .hp-cities, .hp-reading, .hp-trust) {
  padding-block: clamp(76px, 7vw, 144px);
}
.home-portal .hp-section-head {
  grid-template-columns: minmax(150px, .25fr) minmax(0, 1.05fr) minmax(260px, .4fr);
  gap: clamp(24px, 4vw, 80px);
}
.home-portal .hp-section-head h2 { max-width: 18ch; font-size: clamp(40px, 3.5vw, 72px); }
.home-portal .hp-section-head > span { font-size: 16px; }
.home-portal .hp-service-jumps a { min-height: 112px; }
.home-portal .hp-service-jumps b { font-size: 18px; }
.home-portal .hp-service-jumps em { font-size: 12px; }
.home-portal .hp-service-stories { gap: clamp(22px, 3vw, 58px); }
.home-portal .hp-service-story { border-radius: 0; }
.home-portal .hp-cities-grid { grid-template-columns: minmax(260px, .3fr) minmax(0, 1fr); gap: clamp(44px, 7vw, 150px); }
.home-portal .hp-city-accordion summary > strong { font-size: clamp(27px, 2.3vw, 42px); }
.home-portal .hp-city-accordion nav a,
.home-portal .hp-city-main { font-size: 14px; }
.home-portal .hp-reading-head h2 { font-size: clamp(40px, 3.6vw, 72px); }
.home-portal .hp-story h3 { font-size: clamp(19px, 1.25vw, 25px); }
.home-portal .hp-story p { font-size: 14px; }
.home-portal .hp-trust-grid { grid-template-columns: minmax(300px, .36fr) minmax(0, 1fr); gap: clamp(50px, 7vw, 150px); }
.home-portal .hp-faq summary { font-size: clamp(17px, 1.15vw, 22px); }
.home-portal .hp-faq details p { font-size: 15px; }

/* The shared category template serves the seven core knowledge entrances. */
.fs-root-list .csd-breadcrumb,
.fs-area .csd-breadcrumb,
.fs-region .csd-breadcrumb,
.fs-root-article .csd-breadcrumb {
  min-height: 58px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}
.fs-root-list .csd-list-hero,
.fs-area .csd-list-hero {
  width: 100%;
  min-height: min(700px, 70svh);
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  gap: clamp(40px, 6vw, 120px);
  padding: clamp(56px, 7vw, 130px) var(--fs-gutter);
  color: #fff;
  background: var(--fs-ink);
}
.fs-root-list .csd-list-hero > div,
.fs-area .csd-list-hero > div { align-self: center; }
.fs-root-list .csd-list-hero .csd-kicker,
.fs-area .csd-list-hero .csd-kicker { color: #9de0c8; }
.fs-root-list .csd-list-hero h1,
.fs-area .csd-list-hero h1 {
  max-width: 13ch;
  font-size: clamp(52px, 5.7vw, 108px);
  line-height: 1.08;
}
.fs-root-list .csd-list-hero p,
.fs-area .csd-list-hero p { max-width: 35em; color: rgba(255, 255, 255, .77); font-size: clamp(17px, 1.25vw, 22px); }
.fs-root-list .csd-list-visual,
.fs-area .csd-list-visual { align-self: stretch; display: grid; place-items: center; }
.fs-root-list .csd-list-visual img,
.fs-area .csd-list-visual img { max-height: 580px; border-radius: 0; object-fit: contain; background: transparent; box-shadow: none; }
.fs-root-list .fs-root-hero-aside {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 440px;
  padding: clamp(28px, 3.4vw, 68px);
  border-left: 1px solid rgba(255,255,255,.3);
  color: #fff;
  background: #20463a;
}
.fs-root-list .fs-root-hero-aside > span { color: #9de0c8; font-size: 13px; font-weight: 800; letter-spacing: .12em; }
.fs-root-list .fs-root-hero-aside ol { margin: 30px 0; padding: 0; list-style: none; counter-reset: guide; }
.fs-root-list .fs-root-hero-aside li { position: relative; padding: 16px 0 17px 50px; border-top: 1px solid rgba(255,255,255,.28); counter-increment: guide; }
.fs-root-list .fs-root-hero-aside li::before { position: absolute; top: 19px; left: 0; content: '0' counter(guide); color: #f7ae86; font-size: 12px; font-weight: 800; }
.fs-root-list .fs-root-hero-aside b { display: block; font-size: clamp(20px, 1.5vw, 28px); }
.fs-root-list .fs-root-hero-aside small { display: block; margin-top: 5px; color: rgba(255,255,255,.7); font-size: 14px; }
.fs-root-list .fs-root-hero-aside > a { align-self: flex-start; display: inline-flex; gap: 35px; padding-bottom: 7px; border-bottom: 1px solid currentColor; color: #9de0c8; font-size: 15px; font-weight: 800; }
.fs-root-list #fs-articles { scroll-margin-top: 80px; }
.fs-root-list .csd-subcats a { border-color: rgba(255,255,255,.35); color: #fff; background: rgba(255,255,255,.08); }
.fs-root-list .csd-list-layout {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  gap: clamp(30px, 4vw, 72px);
  padding-block: clamp(70px, 6vw, 120px);
}
.fs-root-list .csd-news-list { gap: 0; }
.fs-root-list .csd-news-item {
  min-height: 210px;
  grid-template-columns: minmax(190px, .33fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(22px, 3vw, 58px);
  padding: 24px 0;
  border: 0;
  border-top: 1px solid var(--fs-line);
  border-radius: 0;
  box-shadow: none;
}
.fs-root-list .csd-news-item:last-child { border-bottom: 1px solid var(--fs-line); }
.fs-root-list .csd-news-item img { width: 100%; border-radius: 0; }
.fs-root-list .csd-news-item h3 { font-size: clamp(22px, 1.75vw, 32px); }
.fs-root-list .csd-news-item p { max-width: 65ch; font-size: 15px; }
.fs-root-list .csd-side-card { border-radius: 0; box-shadow: none; }
.fs-root-list .csd-pager { justify-content: flex-start; }

/* Articles use the screen for hierarchy, while prose stays easy to read. */
.fs-root-article main { background: var(--fs-paper); }
.fs-root-article .csd-article-layout {
  grid-template-columns: minmax(0, 1fr) minmax(270px, 340px);
  gap: clamp(38px, 5vw, 100px);
  padding-block: 32px 100px;
}
.fs-root-article .csd-article { min-width: 0; background: transparent; }
.fs-root-article .csd-article-head { padding: clamp(30px, 4vw, 80px) 0 50px; }
.fs-root-article .csd-article-head h1 {
  max-width: 20ch;
  margin-block: 20px 28px;
  font-size: clamp(42px, 4.5vw, 82px);
  line-height: 1.12;
}
.fs-root-article .csd-article-meta { font-size: 15px; }
.fs-root-article .csd-article-cover {
  width: 100%;
  max-height: 640px;
  aspect-ratio: 16 / 9;
  border-radius: 0;
  object-fit: cover;
  box-shadow: none;
}
.fs-root-article .csd-article-content {
  max-width: var(--fs-reading);
  padding: 34px 0 0;
  color: #253b34;
  font-size: clamp(17px, 1.05vw, 20px);
  line-height: 1.95;
  overflow-wrap: anywhere;
}
.fs-root-article .csd-article-content :is(h2, h3) { scroll-margin-top: 110px; }
.fs-root-article .csd-article-content img { max-width: 100%; height: auto; border-radius: 0; }
.fs-root-article .csd-article-content table { display: block; max-width: 100%; overflow-x: auto; }
.fs-root-article .csd-article-side { padding-top: 75px; }
.fs-root-article .csd-article-promo { max-width: var(--fs-reading); }
.fs-root-article .csd-related { padding-block: 70px 100px; border-top: 1px solid var(--fs-line); }
.fs-root-article .csd-article-grid { gap: clamp(16px, 2vw, 36px); }

/* The directory and fallback city template serve routes without a city-specific design. */
.fs-area .csd-two-col,
.fs-region .csd-two-col { gap: clamp(36px, 6vw, 120px); }
.fs-area .csd-region-content,
.fs-region .csd-region-content { max-width: 72ch; }
.fs-area .csd-image-card,
.fs-region .csd-image-card { border: 0; border-radius: 0; box-shadow: none; }
.fs-region .csd-hero { min-height: min(740px, 75svh); display: flex; align-items: center; }
.fs-region .csd-hero-grid { width: calc(100% - var(--fs-gutter) * 2); grid-template-columns: minmax(0, 1.05fr) minmax(350px, .95fr); gap: clamp(40px, 5vw, 110px); }
.fs-region .csd-hero h1 { max-width: 14ch; font-size: clamp(46px, 5.2vw, 96px); }
.fs-region .csd-hero-visual img { width: 100%; max-height: 570px; object-fit: contain; border-radius: 0; box-shadow: none; }
.fs-region .csd-flow article { border-radius: 0; box-shadow: none; }
.fs-page-content .csd-page-wrap { padding-block: 72px 120px; }
.fs-page-content .csd-article-content { max-width: var(--fs-reading); margin-inline: auto; font-size: 18px; line-height: 1.95; }
.fs-page-content .csd-article-content img { max-width: 100%; height: auto; }

@media (max-width: 1100px) {
  .home-portal .hp-hero-grid { grid-template-columns: 1fr; }
  .home-portal .hp-route-board { min-height: 560px; }
  .home-portal .hp-section-head { grid-template-columns: 140px 1fr; }
  .home-portal .hp-section-head > span { grid-column: 2; }
  .home-portal .hp-cities-grid,
  .home-portal .hp-trust-grid { grid-template-columns: 1fr; gap: 44px; }
  .fs-root-list .csd-list-layout,
  .fs-root-article .csd-article-layout { grid-template-columns: 1fr; }
  .fs-root-article .csd-article-side { padding-top: 0; }
  .fs-root-list .csd-side,
  .fs-root-article .csd-side { position: static; }
  .fs-root-list .csd-list-hero,
  .fs-area .csd-list-hero,
  .fs-region .csd-hero-grid { grid-template-columns: 1fr; }
  .fs-root-list .csd-list-visual,
  .fs-area .csd-list-visual { display: none; }
  .fs-root-list .fs-root-hero-aside { min-height: 0; }
}

@media (max-width: 720px) {
  :root { --fs-gutter: 18px; }
  .home-portal .hp-hero-grid { min-height: 0; }
  .home-portal .hp-hero-copy { padding-block: 54px 52px; }
  .home-portal .hp-hero h1 { font-size: clamp(36px, 9vw, 54px); }
  .home-portal .hp-hero-lead { font-size: 16px; }
  .home-portal .hp-hero-links { width: 100%; }
  .home-portal .hp-route-board { min-height: 0; grid-template-rows: 330px auto auto; }
  .home-portal .hp-hero-photo { grid-area: 1 / 1; height: 330px; }
  .home-portal .hp-hero-photo figcaption { top: auto; bottom: 22px; }
  .home-portal .hp-board-head { grid-area: 2 / 1; padding-block: 24px 10px; background: #173b32; }
  .home-portal .hp-route-board ol { grid-area: 3 / 1; grid-template-columns: 1fr; gap: 0; padding-bottom: 25px; background: #173b32; }
  .home-portal .hp-route-board li { min-height: 66px; }
  .home-portal .hp-hero-index { grid-template-columns: 1fr; }
  .home-portal .hp-hero-index article { min-height: 80px; }
  .home-portal .hp-section-head { display: block; }
  .home-portal .hp-section-head h2,
  .home-portal .hp-reading-head h2 { font-size: clamp(32px, 7.5vw, 46px); }
  .home-portal .hp-service-jumps a { min-height: 84px; }
  .home-portal .hp-city-accordion nav a { font-size: 13px; }
  .fs-root-list .csd-list-hero,
  .fs-area .csd-list-hero { min-height: 0; padding-block: 60px 68px; }
  .fs-root-list .csd-list-hero h1,
  .fs-area .csd-list-hero h1 { font-size: clamp(39px, 10vw, 60px); }
  .fs-root-list .fs-root-hero-aside { margin-top: 34px; padding: 22px; }
  .fs-root-list .csd-news-item { grid-template-columns: 1fr; gap: 15px; padding-block: 25px; }
  .fs-root-list .csd-news-item img { max-height: 260px; }
  .fs-root-article .csd-article-layout { padding-block: 0 65px; }
  .fs-root-article .csd-article-head { padding-block: 20px 28px; }
  .fs-root-article .csd-article-head h1 { font-size: clamp(32px, 8vw, 48px); }
  .fs-root-article .csd-article-content { font-size: 17px; }
  .fs-region .csd-hero { min-height: 0; }
  .fs-region .csd-hero h1 { font-size: clamp(35px, 9vw, 56px); }
  .fs-region .csd-hero-visual { display: none; }
  .fs-page-content .csd-page-wrap { padding-block: 45px 80px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-portal .hp-route-board *,
  .fs-root-list .csd-news-item * { animation: none !important; transition: none !important; }
}