@import url("./stylesheet_modern.css");

:root {
  --ink: #102e58;
  --ink-soft: #4b6080;
  --blue: #1264c4;
  --blue-deep: #124b91;
  --sky: #78cde9;
  --ice: #eaf7fb;
  --yellow: #f4d04e;
  --white: #fff;
  --line: #d7e2e6;
  --content: min(1180px, calc(100% - 64px));
  --font-jp: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
  --font-en: "Barlow Condensed", "Inter", sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--ink);
  background: var(--white);
  font-family: var(--font-jp);
  letter-spacing: 0;
}

body * { letter-spacing: 0 !important; }

body::before {
  display: none;
}

a,
button {
  transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s ease;
}

.fadeleft,
.faderight {
  opacity: 1;
  transform: none;
  animation: none;
}

.w-container {
  width: var(--content);
  max-width: none;
}

/* Header */
.header {
  position: relative;
  z-index: 50;
}

.top-header {
  position: absolute;
  inset: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 116px;
  padding: 0 52px;
  color: var(--white);
  background: transparent;
  box-shadow: none;
}

.top-header .logo a {
  display: grid;
  grid-template-columns: 44px auto;
  grid-template-rows: auto auto;
  column-gap: 12px;
  align-items: center;
  color: inherit;
}

.top-header .logo {
  flex: 0 0 220px;
}

.logo-mark {
  grid-row: 1 / 3;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--blue);
  position: relative;
}

.logo-mark::before,
.logo-mark::after {
  content: "";
  position: absolute;
  left: 9px;
  width: 26px;
  height: 7px;
  border: 3px solid var(--white);
  border-top: 0;
  border-radius: 0 0 50% 50%;
}

.logo-mark::before { top: 11px; }
.logo-mark::after { top: 22px; }

.top-header .logo .logo-title {
  margin: 0;
  font-size: 26px;
  font-family: var(--font-jp);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0;
  color: var(--white) !important;
  text-shadow: 0 2px 12px rgba(0, 32, 51, .35) !important;
}

.top-header .logo-sub {
  margin-top: 7px;
  color: var(--ink-soft);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  color: rgba(255,255,255,.78) !important;
  text-shadow: 0 2px 10px rgba(0, 32, 51, .3) !important;
}

.header-nav {
  margin-left: auto;
}

.header-nav .menu {
  display: flex;
  gap: 30px;
  margin: 0 34px 0 0;
}

.header-nav .menu a {
  color: var(--white) !important;
  font-size: 14px;
  font-weight: 600;
  text-shadow: 0 2px 10px rgba(0, 32, 51, .35) !important;
}

.header-nav .menu a small {
  margin-right: 4px;
  color: var(--yellow);
  font-family: "Inter", sans-serif;
  font-size: 14px;
}

.header-phone {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  margin-right: 20px;
  min-width: 190px;
  min-height: 58px;
  padding: 4px 18px 5px 22px;
  border-left: 2px solid var(--yellow);
  color: var(--white);
  background: rgba(0, 38, 61, .36);
  box-shadow: none;
  backdrop-filter: blur(5px);
  font-family: var(--font-en);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.25;
  white-space: nowrap;
}

.header-phone:hover {
  color: var(--blue-deep);
  border-left-color: var(--white);
  background: var(--yellow);
  transform: none;
}

.header-actions {
  display: flex;
  flex: 0 0 262px;
  align-items: center;
  justify-content: flex-end;
}

.header-phone span {
  margin-bottom: 3px;
  color: rgba(255,255,255,.82);
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 700;
}

.header-phone span i {
  margin-right: 5px;
  color: var(--yellow);
}

.header-phone:hover span,
.header-phone:hover span i { color: var(--blue-deep); }

.header-toggle {
  display: grid;
  place-items: center;
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  border: 0;
  border-radius: 50%;
  color: var(--white);
  background: rgba(0, 63, 100, .82);
  backdrop-filter: blur(8px);
  font-size: 20px;
  cursor: pointer;
}

.header-toggle:hover {
  transform: rotate(8deg);
  background: var(--blue);
}

.header-toggle .fa-times { display: none; }

/* Hero */
#mainview {
  position: relative;
  min-height: 860px;
  padding: 0;
  overflow: hidden;
  background: var(--blue-deep);
  justify-content: flex-start !important;
  align-items: stretch;
}

#mainview::before,
#mainview::after {
  display: none;
}

#mainview .hero-grid {
  position: relative;
  z-index: 2;
  width: var(--content);
  min-height: 860px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 176px 0 190px;
  flex-direction: row;
}

#mainview .hero-text {
  width: min(760px, 100%);
  padding: 0;
  margin: 0 auto 0 0 !important;
  align-items: flex-start;
  gap: 0;
  text-align: left;
}

.hero-kicker {
  margin: 0 0 30px;
  color: var(--sky);
  font-family: var(--font-en);
  font-size: 18px;
  font-weight: 800;
  letter-spacing: .12em;
}

.hero-tag {
  position: relative;
  margin: 0 0 24px;
  color: var(--white);
  font-family: var(--font-jp);
  font-size: 19px;
  font-weight: 900;
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 4px 18px 4px 20px;
  border: 0;
  border-left: 6px solid var(--yellow);
  border-radius: 0;
  background: rgba(0, 48, 76, .68);
  box-shadow: none;
  text-align: left;
  text-shadow: 0 2px 10px rgba(0, 22, 35, .35);
}

.hero-headline {
  margin: 0;
  color: var(--white);
  font-family: var(--font-jp);
  font-size: 72px;
  font-weight: 800;
  line-height: 1.22;
  letter-spacing: 0;
  text-align: left;
  text-shadow: 0 4px 28px rgba(0, 32, 51, .42);
}

.hero-headline > span { display: block; white-space: nowrap; margin: 0; }

.hero-headline > span:first-child {
  position: relative;
  width: fit-content;
  font-size: 1em;
}

.hero-headline__accent {
  position: relative;
  display: inline-block !important;
  color: var(--white);
  z-index: 0;
}

.hero-headline__accent::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -4px;
  bottom: 5px;
  left: -4px;
  height: 18px;
  background: var(--yellow);
  transform: skewX(-12deg);
}

.hero-sub {
  margin: 34px 0 0;
  color: rgba(255,255,255,.92);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.9;
  text-align: left;
}

.hero-response {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 0;
  color: var(--white);
  font-size: 14px;
  font-weight: 800;
}

.hero-response span {
  width: 34px;
  height: 2px;
  background: var(--yellow);
}

#mainview .hero-image {
  position: absolute !important;
  z-index: 1;
  inset: 0 !important;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0 !important;
  background: var(--sky);
}

#mainview .hero-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0, 34, 56, .9) 0%, rgba(0, 48, 76, .72) 36%, rgba(0, 45, 70, .15) 72%),
    linear-gradient(0deg, rgba(0, 34, 56, .48) 0%, transparent 42%);
  pointer-events: none;
  display: block;
}

#mainview .hero-image picture,
#mainview .hero-image img {
  display: block;
  width: 100%;
  height: 100%;
}

.hero-proof {
  position: absolute;
  z-index: 3;
  right: max(32px, calc((100% - 1180px) / 2));
  bottom: 0;
  left: max(32px, calc((100% - 1180px) / 2));
  display: grid;
  grid-template-columns: repeat(3, 1fr) 1.25fr;
  min-height: 116px;
  color: var(--blue-deep);
  background: rgba(255,255,255,.96);
  border-top: 5px solid var(--yellow);
  box-shadow: none;
  backdrop-filter: blur(12px);
}

.hero-proof__item,
.hero-proof__phone {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 22px 26px;
  border-right: 1px solid rgba(0, 76, 118, .14);
}

.hero-proof__item:nth-child(-n+2) {
  position: relative;
  background: transparent;
}

.hero-proof__item:nth-child(-n+2)::before {
  display: none;
}

.hero-proof__label {
  margin-bottom: 8px;
  color: var(--blue);
  font-family: var(--font-jp);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
}

.hero-proof__item strong {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--blue-deep);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.35;
}

.hero-proof__item strong i {
  display: grid;
  place-items: center;
  flex: 0 0 22px;
  width: 22px;
  height: 34px;
  color: var(--blue);
  background: transparent;
  font-size: 16px;
}

.hero-proof__item strong em {
  color: var(--blue);
  font-size: 1.18em;
  font-style: normal;
}

.hero-proof__phone {
  border: 0;
  color: var(--ink);
  background: var(--yellow);
}

.hero-proof__phone span {
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 700;
}

.hero-proof__phone strong {
  font-family: var(--font-en);
  font-size: 28px;
  font-weight: 800;
  letter-spacing: 0;
}

.hero-proof__phone:hover {
  color: var(--white);
  background: var(--blue);
}

#mainview .hero-image img {
  object-fit: cover;
  object-position: center 38%;
}

#mainview .hero-stats,
#mainview .hero-cta-group,
#mainview .contact_area {
  display: none !important;
}

.scroll-indicator {
  position: absolute;
  z-index: 3;
  top: 50%;
  right: 20px;
  color: var(--white);
  font-family: var(--font-en);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .08em;
  writing-mode: vertical-rl;
}

.scroll-indicator::after {
  content: "";
  display: block;
  width: 1px;
  height: 74px;
  margin: 14px auto 0;
  background: var(--blue);
}

/* Shared section language */
.namebox {
  text-align: left;
}

.namebox h2,
.worries-title {
  color: var(--ink);
  font-family: var(--font-jp);
  font-size: clamp(42px, 5vw, 68px);
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: 0;
}

.namebox > p {
  color: var(--blue);
  font-family: var(--font-en);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

#service,
#flow,
#relief,
#stats,
#warranty,
#area,
#faq,
#voice,
#company,
#contact {
  padding-top: 120px;
  padding-bottom: 120px;
}

/* Problem / emergency */
.worries-section {
  padding: 120px 0;
  background: var(--ice);
}

.worries-section .w-container {
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  gap: 80px;
  align-items: start;
}

.worries-lead {
  padding-top: 16px;
  color: var(--blue);
  font-family: var(--font-jp);
  font-size: 16px;
  font-weight: 800;
}

.worries-title {
  margin: 0 0 48px;
}

.worries-title__pop,
.worries-title__pop em {
  color: var(--blue);
  font-style: normal;
}

.worries-checklist {
  grid-column: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin: 0;
  border-top: 1px solid var(--line);
}

.worries-checklist li {
  padding: 22px 8px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  font-size: 16px;
  font-weight: 600;
}

.worries-check {
  color: var(--blue);
  background: transparent;
}

.emergency-banner {
  padding: 0;
  color: var(--white);
  background: var(--blue-deep);
}

#emergency.emergency-banner { background: var(--blue-deep); }
#emergency.emergency-banner::before { display: none; }

.emergency-banner__inner {
  min-height: 260px;
  padding: 56px 0;
}

.emergency-banner__tag {
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 0;
  color: var(--white);
  background: transparent;
}

.emergency-banner__title,
.emergency-banner__sub { color: var(--white); }

.emergency-banner__title {
  font-family: var(--font-jp);
  font-size: clamp(30px, 3.2vw, 46px);
  font-weight: 900;
  line-height: 1.22;
}

.emergency-banner__title strong {
  margin-left: 0;
  padding: 0;
  border-radius: 0;
  color: var(--yellow);
  background: transparent;
}

.emergency-banner__phone {
  position: relative;
  min-width: 430px;
  padding: 24px 54px 22px;
  border: 3px solid rgba(255,255,255,.72);
  border-radius: 0;
  color: var(--blue-deep);
  background: var(--yellow);
  box-shadow: 6px 6px 0 rgba(0, 26, 42, .42);
}

.emergency-banner__phone::after {
  content: "›";
  position: absolute;
  top: 50%;
  right: 22px;
  font-size: 38px;
  font-weight: 400;
  transform: translateY(-54%);
}

.emergency-banner__phone:hover {
  color: var(--white);
  background: var(--blue);
  box-shadow: 5px 5px 0 rgba(0, 26, 42, .35);
  transform: translate(5px, 5px);
}

.emergency-banner__action {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 800;
}

.emergency-banner__num {
  gap: 12px;
  font-family: var(--font-en);
  font-size: clamp(30px, 2.6vw, 40px);
  letter-spacing: 0;
}

.emergency-banner__num::before { display: none; }

.emergency-banner__num .fas {
  display: inline-grid !important;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  border-radius: 0;
  color: var(--white) !important;
  background: var(--blue-deep);
  font-size: 18px !important;
}

.emergency-banner__hours {
  margin-top: 7px;
  color: var(--blue-deep);
  font-size: 14px;
}

.emergency-banner__hours b {
  margin-left: 10px;
  padding-left: 10px;
  border-left: 1px solid rgba(0, 52, 82, .35);
  font-weight: 800;
}

.emergency-banner__phone:hover .emergency-banner__hours,
.emergency-banner__phone:hover .emergency-banner__num .fas {
  color: var(--white);
}

/* Service */
#service {
  background: var(--white);
}

#service .namebox {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 64px;
  border-bottom: 1px solid var(--line);
}

.servicebox {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}

.servicebox > div {
  position: relative;
  padding: 0 0 30px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: var(--white);
  box-shadow: none;
}

.servicebox picture,
.servicebox img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
}

.servicebox img {
  object-fit: cover;
  transition: transform .5s ease;
}

.servicebox > div:hover img { transform: scale(1.035); }

.servicebox h3,
.servicebox .pricebox,
.servicebox .btnarrow6 {
  margin-left: 28px;
  margin-right: 28px;
}

.servicebox h3 {
  margin-top: 26px;
  color: var(--ink);
  font-family: var(--font-jp);
  font-size: 21px;
  font-weight: 800;
  line-height: 1.45;
}

.servicebox .pricebox {
  color: var(--blue);
  background: transparent;
}

/* Service catalogue: titles stay in document flow, outside the photographs. */
#service { background: #f5f8fc; }
#service .namebox { align-items: center; gap: 24px; margin-bottom: 40px; border: 0; }
#service .namebox h2 { font-size: 36px; line-height: 1.4; font-weight: 900; }
#service .namebox h2 span { display: inline-block; }
#service .namebox > p { position: static; font: 600 24px/1 'Barlow Condensed', sans-serif; color: #1264c4; opacity: 1; transform: none; }
#service .namebox::before, #service .namebox::after { display: none; }
#service .servicebox { gap: 52px 32px; border: 0; background: none; }
#service .servicebox > div { display: flex; flex-direction: column; padding: 0; background: none; border: 0; border-top: 1px solid #9bafcc; border-radius: 0; box-shadow: none; isolation: isolate; }
#service .servicebox > div::before { display: none; }
#service .servicebox > div::after { top: 20px; left: 0; right: auto; bottom: auto; width: 58px; height: 64px; padding: 0; color: #1264c4; background: none; border: 0; font: 600 64px/1 'Barlow Condensed', sans-serif; border-radius: 0; box-shadow: none; transform: none; z-index: 2; }
#service .servicebox > div:hover { transform: none; box-shadow: none; border-top-color: #1264c4; }
#service .servicebox picture { order: 1; position: relative; width: 100%; height: auto; aspect-ratio: 3 / 2; margin: 0; padding: 0; overflow: hidden; }
#service .servicebox picture::after { display: none; }
#service .servicebox picture img { position: absolute; inset: 0; height: 100%; width: 100%; aspect-ratio: auto; object-fit: cover; opacity: 1; filter: none; }
#service .servicebox h3 { order: 0; display: block; position: static; inset: auto; width: auto; height: auto; min-height: 130px; margin: 0; padding: 24px 0 22px 72px; background: none; color: #153b6a; font-size: 28px; font-weight: 900; line-height: 1.3; text-shadow: none; pointer-events: auto; }
#service .servicebox h3 small { display: block; margin-top: 10px; font-size: 16px; line-height: 1.65; font-weight: 500; color: #426080; }
#service .service-actions { order: 2; display: flex; flex-wrap: wrap; gap: 12px 20px; position: static; width: auto; padding: 16px 0 0; margin: auto 0 0; border: 0; background: none; }
#service .service-action { display: inline-flex; flex: 0 1 auto; align-items: center; justify-content: space-between; gap: 12px; width: auto; min-height: 44px; padding: 0; color: #153b6a; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 16px; font-weight: 700; }
#service .service-action--detail::after { content: '\f061'; display: grid; place-items: center; width: 36px; height: 36px; background: #1264c4; color: #fff; font-family: 'Font Awesome 5 Free'; font-weight: 900; transition: transform .2s, background-color .2s; }
#service .service-action--contact { margin-left: auto; font-size: 14px; font-weight: 500; text-decoration: underline; text-underline-offset: 5px; }
#service .service-action:hover { color: #a53726; transform: none; background: none; }
#service .service-action--detail:hover::after { transform: translateX(4px); }
#service .service-action:focus-visible { outline: 2px solid #153b6a; outline-offset: 4px; }
@media (max-width: 1200px) and (min-width: 641px) {
  #service .servicebox { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  #service .namebox { display: block; margin-bottom: 28px; }
  #service .namebox h2 { font-size: 28px; }
  #service .namebox > p { margin-top: 12px; font-size: 20px; }
  #service .servicebox { grid-template-columns: 1fr; gap: 40px; }
  /* Override the legacy two-column mobile rules in stylesheet_modern.css. */
  #service .servicebox > div { display: flex !important; }
  #service .servicebox picture { height: auto !important; min-height: 0 !important; }
  #service .servicebox h3 { min-height: 126px; padding: 22px 0 20px 64px !important; font-size: 24px !important; text-align: left !important; color: #153b6a !important; }
  #service .servicebox > div::after { font-size: 56px; width: 52px; }
  #service .service-actions { flex-direction: row; margin-right: 0; margin-left: 0; }
}

/* Large photographic service entries with inset editorial captions. */
#service .servicebox { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 56px 48px; align-items: start; }
#service .servicebox > div { overflow: visible; border: 0; }
#service .servicebox > div:nth-child(even) { margin-top: 64px; }
#service .servicebox > div::after { top: 16px; left: 16px; width: 52px; height: 56px; display: grid; place-items: center; font-size: 44px; line-height: 1; color: #153b6a; background: #f5f8fc; }
#service .servicebox picture { order: 0; aspect-ratio: 3 / 2; clip-path: polygon(0 0, calc(100% - 28px) 0, 100% 28px, 100% 100%, 0 100%); }
#service .servicebox h3 { order: 1; position: relative; z-index: 3; width: calc(100% - 48px); min-height: 126px; margin: -36px 0 0; padding: 24px 20px 20px 0; background: #f5f8fc; font-size: 36px; line-height: 1.4; }
#service .servicebox h3 small { margin-top: 8px; font-size: 16px; font-weight: 500; }
#service .service-actions { width: 100%; margin: 0; padding: 16px 0 0; border-top: 1px solid #b7c9e0; }
#service .service-action--detail { font-size: 17px; }
#service .service-action--detail::after { width: 44px; height: 44px; background: transparent; color: #1264c4; border: 1px solid #8cacb6; }
#service .service-action--detail:hover::after { background: #1264c4; color: #fff; }
@media (max-width: 1000px) and (min-width: 641px) {
  #service .servicebox { gap: 40px 28px; }
  #service .servicebox h3 { font-size: 28px; width: calc(100% - 24px); padding-right: 12px; }
  #service .servicebox > div:nth-child(even) { margin-top: 40px; }
}
@media (max-width: 640px) {
  #service .servicebox { grid-template-columns: minmax(0,1fr); gap: 40px; }
  #service .servicebox > div:nth-child(even) { margin-top: 0; }
  #service .servicebox > div::after { top: 12px; left: 12px; width: 44px; height: 48px; font-size: 36px; }
  #service .servicebox h3 { position: relative !important; background: #f5f8fc !important; width: calc(100% - 24px); min-height: 0; margin-top: -24px; padding: 18px 12px 20px 0 !important; font-size: 28px !important; }
  #service .servicebox h3 small { font-size: 15px; }
  #service .service-actions { gap: 8px; }
  #service .service-action--detail { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  #service .servicebox > div { animation: none; opacity: 1; transform: none; }
  #service .servicebox picture img { transition: none; }
  #service .servicebox > div:hover img { transform: none; }
}

/* Alternating 7/5 and 5/7 spreads keep the catalogue from reading as a card grid. */
@media (min-width: 1001px) {
  #service .servicebox { grid-template-columns: repeat(12,minmax(0,1fr)); gap: 72px 40px; }
  #service .servicebox > div:nth-child(4n+1) { grid-column: span 7; margin-top: 0; }
  #service .servicebox > div:nth-child(4n+2) { grid-column: span 5; margin-top: 104px; }
  #service .servicebox > div:nth-child(4n+3) { grid-column: span 5; margin-top: 104px; }
  #service .servicebox > div:nth-child(4n+4) { grid-column: span 7; margin-top: 0; }
  #service .servicebox > div:nth-child(4n+1) picture,
  #service .servicebox > div:nth-child(4n+4) picture { aspect-ratio: 4 / 3; }
  #service .servicebox > div:nth-child(4n+2) picture,
  #service .servicebox > div:nth-child(4n+3) picture { aspect-ratio: 1.25; }
  #service .servicebox h3 { font-size: 40px; width: calc(100% - 56px); margin-top: -48px; padding-top: 24px; }
  #service .servicebox > div:nth-child(4n+2) h3,
  #service .servicebox > div:nth-child(4n+3) h3 { font-size: 30px; width: calc(100% - 24px); }
  #service .servicebox > div:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); grid-template-rows: 1fr auto; gap: 0 48px; margin-top: 8px; padding-top: 32px; border-top: 2px solid #153b6a; }
  #service .servicebox > div:last-child::after { top: 48px; }
  #service .servicebox > div:last-child picture { grid-column: 1; grid-row: 1 / 3; aspect-ratio: 16 / 9; }
  #service .servicebox > div:last-child h3 { grid-column: 2; grid-row: 1; align-self: center; width: 100%; min-height: 0; margin: 0; padding: 20px 0; font-size: 36px; }
  #service .servicebox > div:last-child .service-actions { grid-column: 2; grid-row: 2; padding-bottom: 8px; }
}
#service .namebox > p::before, #service .namebox > p::after { display: none; }

/* One continuous, manually controlled service carousel. */
#service .service-image-note { margin: -16px 0 28px; color: #536b89; font-size: 14px; line-height: 1.6; letter-spacing: 0; }
#service .service-carousel-controls:not([hidden]) { display: flex; align-items: center; justify-content: space-between; margin: -8px 0 24px; }
#service .service-carousel-status { display: flex; align-items: baseline; gap: 8px; color: #536b89; font: 600 18px/1 'Barlow Condensed',sans-serif; }
#service .service-carousel-status b { color: #1264c4; font-size: 40px; font-weight: 600; }
#service .service-carousel-buttons { display: flex; gap: 12px; }
#service .service-carousel-buttons button { display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 1px solid #9cb5bd; border-radius: 0; background: transparent; color: #153b6a; cursor: pointer; font-size: 20px; }
#service .service-carousel-buttons button:hover:not(:disabled) { background: #1264c4; color: #fff; border-color: #1264c4; }
#service .service-carousel-buttons button:disabled { opacity: .3; cursor: default; }
#service .service-carousel-buttons button:focus-visible, #service .carousel-track:focus-visible { outline: 2px solid #1264c4; outline-offset: 4px; }
#service .servicebox.carousel-track { --slide-width: 62%; --slide-gap: 32px; display: flex; gap: var(--slide-gap); position: relative; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding: 0 0 24px; scrollbar-width: thin; scrollbar-color: #1264c4 #dce7e9; }
#service .servicebox.carousel-track::after { content: ''; flex: 0 0 calc(100% - var(--slide-width) - var(--slide-gap)); }
#service .servicebox.carousel-track > div:nth-child(n) { display: flex !important; flex-direction: column; flex: 0 0 var(--slide-width); min-width: 0; margin: 0; padding: 0; border: 0; scroll-snap-align: start; scroll-snap-stop: always; gap: 0; animation: none; opacity: 1; transform: none; }
#service .servicebox.carousel-track > div:nth-child(n)::after { top: 16px; }
#service .servicebox.carousel-track > div:nth-child(n) picture { aspect-ratio: 16 / 9; width: 100%; flex-shrink: 0; }
#service .servicebox.carousel-track > div:nth-child(n) h3 { width: calc(100% - 40px); align-self: auto; margin: -32px 0 0; padding: 20px 16px 20px 0; min-height: 126px; font-size: 36px; }
#service .servicebox.carousel-track > div:nth-child(n) .service-actions { position: absolute; top: 16px; right: 16px; z-index: 3; width: auto; margin: 0; padding: 0; border: 0; }
#service .carousel-track .service-action--detail { min-height: 44px; padding: 0 14px; gap: 12px; background: #fff; color: #153b6a; font-size: 14px; }
#service .carousel-track .service-action--detail::after { width: 20px; height: 20px; border: 0; background: transparent; color: #1264c4; }
#service .carousel-track .service-action--detail:hover { background: #153b6a; color: #fff; }
#service .carousel-track .service-action--detail:hover::after { background: transparent; color: #fff; transform: none; }
@media (max-width: 1000px) {
  #service .servicebox.carousel-track { --slide-width: 76%; --slide-gap: 24px; }
  #service .servicebox.carousel-track > div:nth-child(n) h3 { font-size: 30px; }
}
@media (max-width: 640px) {
  #service .servicebox.carousel-track { --slide-width: 88%; --slide-gap: 16px; }
  #service .servicebox.carousel-track > div:nth-child(n) picture { aspect-ratio: 4 / 3; }
  #service .servicebox.carousel-track > div:nth-child(n) h3 { width: calc(100% - 16px); min-height: 134px; margin-top: -20px; font-size: 26px !important; }
  #service .service-carousel-buttons button { width: 44px; height: 44px; }
  #service .servicebox.carousel-track .service-actions { flex-wrap: wrap; gap: 8px 12px; }
}

/* An open timeline: six steps on desktop, a vertical route on smaller screens. */
#flow .flow-container { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 0; background: none; border: 0; }
#flow .flowbox { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; min-height: 320px; padding: 20px 18px 48px; border: 0; border-left: 1px solid #ffffff24; background: none; box-shadow: none; border-radius: 0; transform: none; }
#flow .flowbox:first-child { border-left: 0; }
#flow .flowbox::before, #flow .flowbox::after { display: none; }
#flow .flowboxtitle { position: static; width: 100%; margin: 0 0 20px; padding: 0; background: none; }
#flow .flowboxtitle h3 { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 12px; margin: 0; font-size: 20px; font-weight: 800; line-height: 1.4; white-space: normal; }
#flow .flowboxtitle h3 span { display: block; width: auto; height: auto; margin: 0; padding: 0; background: none; box-shadow: none; border-radius: 0; color: #9aaeb5; font: 600 46px/1 'Barlow Condensed',sans-serif; }
#flow .flowboxtitle h3 span::before { content: '0'; }
#flow .flowboximg { position: static; width: 64px; height: 64px; margin: 0 0 18px; padding: 0; background: none; border: 0; box-shadow: none; }
#flow .flowboximg img { display: block; width: 100%; height: 100%; object-fit: contain; filter: brightness(0) invert(1); opacity: .85; }
#flow .flow-caption { margin: 0; color: #c4d8df; font-size: 16px; line-height: 1.8; text-align: left; }
#flow .flow-water__track { stroke: #7aa3ae50; stroke-width: 2px; }
#flow .flow-water__fill { stroke: #70d4e4; stroke-width: 3px; filter: none; }
#flow .flowbox.is-water-reached { background: none; }
#flow .flowbox.is-water-reached .flowboxtitle h3 span { color: #70d4e4; background: none; box-shadow: none; }
#flow .is-water-stopped .flowbox:nth-child(5) { background: #ffffff08; box-shadow: none; }
#flow .is-water-stopped .flowbox:nth-child(5) .flowboxtitle h3 { color: #ffe079 !important; }
#flow .is-water-stopped .flowbox:nth-child(5) .flowboxtitle h3 span { color: #ffe079; }
@media (max-width: 1200px) {
  #flow .flow-container { grid-template-columns: 1fr; }
  #flow .flowbox { display: grid; grid-template-columns: minmax(0,1fr) 80px; gap: 10px 24px; min-height: 180px; padding: 24px 20px 24px 52px; border-left: 0; border-bottom: 1px solid #ffffff24; }
  #flow .flowboxtitle { margin: 0; }
  #flow .flowboxtitle h3 { flex-direction: row; align-items: center; gap: 20px; font-size: 24px; }
  #flow .flowboximg { grid-column: 2; grid-row: 1 / 3; align-self: center; margin: 0; }
  #flow .flow-caption { grid-column: 1; }
}
@media (max-width: 640px) {
  #flow .flowbox { grid-template-columns: minmax(0,1fr) 48px; gap: 12px; padding: 22px 8px 22px 38px; }
  #flow .flowboxtitle h3 { gap: 10px; font-size: 18px; }
  #flow .flowboxtitle h3 span { font-size: 32px; }
  #flow .flowboximg { width: 48px; height: 48px; }
  #flow .flow-caption { grid-column: 1 / -1; padding-right: 50px; font-size: 16px; }
  #flow .flowboximg { grid-row: 1; }
}

/* Three distinct commitments, without an enclosing card. */
#flow .flow-promises { margin: 64px 0 0; padding: 36px 0 0; border-top: 1px solid #ffffff40; background: none; }
#flow .flow-promises__header { display: flex; flex-direction: row-reverse; align-items: baseline; justify-content: space-between; gap: 20px; margin-bottom: 32px; }
#flow .flow-promises__header p { margin: 0; color: #c5d8df; font-size: 16px; font-weight: 500; }
#flow .flow-promises__header h3 { margin: 0; color: #fff; font-size: 32px; font-weight: 800; line-height: 1.5; }
#flow .flow-promises__header h3 span { display: inline-block; margin-left: 10px; color: #ffe079; }
#flow .flow-promises__list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; list-style: none; margin: 0; padding: 0; }
#flow .flow-promises__list li { min-width: 0; padding: 0 28px; border-left: 1px solid #ffffff30; }
#flow .flow-promises__list li:first-child { padding-left: 0; border-left: 0; }
#flow .flow-promises__list li:last-child { padding-right: 0; }
#flow .flow-promises__label { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 40px; margin-bottom: 18px; color: #90cbdc; font-size: 16px; font-weight: 700; }
#flow .flow-promises__label i { font-size: 28px; color: #90cbdc; }
#flow .flow-promises__list h4 { margin: 0 0 18px; font-size: 24px; line-height: 1.65; font-weight: 700; color: #fff; }
#flow .flow-promises__list em { font-style: normal; color: #ffe079; font-size: 30px; font-weight: 900; }
#flow .flow-promises__list p { margin: 0; font-size: 16px; line-height: 1.9; font-weight: 400; color: #d8e5e9; }
@media (max-width: 1000px) {
  #flow .flow-promises__header { display: block; }
  #flow .flow-promises__header p { margin-bottom: 8px; }
  #flow .flow-promises__list { grid-template-columns: 1fr; gap: 28px; }
  #flow .flow-promises__list li, #flow .flow-promises__list li:first-child { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; border-left: 0; border-top: 1px solid #ffffff30; padding: 24px 0 0; }
  #flow .flow-promises__label { grid-column: 1 / -1; }
  #flow .flow-promises__list h4 { margin-bottom: 0; }
  #flow .flow-promises__list p { align-self: center; }
}
@media (max-width: 640px) {
  #flow .flow-promises { margin-top: 40px; padding-top: 28px; }
  #flow .flow-promises__header h3 { font-size: 26px; }
  #flow .flow-promises__header h3 span { margin-left: 0; }
  #flow .flow-promises__list li, #flow .flow-promises__list li:first-child { display: block; }
  #flow .flow-promises__list h4 { font-size: 22px; margin-bottom: 14px; }
  #flow .flow-promises__list em { font-size: 28px; }
}

/* Flow */
#flow {
  background:
    linear-gradient(155deg, transparent 42%, #74baff0a 42%, #74baff0a 64%, transparent 64%),
    linear-gradient(118deg, #091f46 0%, #124779 46%, #165991 70%, #102d59 100%);
}

#area {
  background:
    linear-gradient(125deg, transparent 48%, #b5ddff0d 48%, #b5ddff0d 72%, transparent 72%),
    linear-gradient(115deg, #0a244e 0%, #124a83 40%, #1967a8 72%, #153969 100%);
}
#area::after { display: none; }

#flow .namebox h2,
#flow .flowboxtitle h3,
#flow .flowtextbox,
#flow .flowtextbox strong { color: var(--white); }

#flow .namebox > p { color: var(--sky); }

.flow-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 64px;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.15);
}

.flowbox {
  min-height: 260px;
  padding: 30px;
  border: 0;
  border-radius: 0;
  background: #18333f;
}

.flowboximg img { filter: brightness(0) invert(1); opacity: .8; }

.flowboxtitle h3 span { color: var(--sky); }

.flowtextbox {
  border-color: rgba(255,255,255,.2);
  background: transparent;
}

/* Reasons */
.flow-container { position: relative; isolation: isolate; }
.flow-water { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2; overflow: visible; }
.flow-water path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.flow-water__track { stroke: rgba(120,205,233,.18); stroke-width: 6px; }
.flow-water__fill { stroke: #64ddf6; stroke-width: 4px; filter: drop-shadow(0 0 4px rgba(100,221,246,.6)); }
.flowbox { transition: background-color .5s ease; }
.flowbox.is-water-reached { background: #174450; }
.flowbox.is-water-reached .flowboxtitle h3 span { color: #102e58; background: #64ddf6; box-shadow: none; }
.is-water-stopped .flowbox:nth-child(5) { background: #205564; box-shadow: inset 0 3px #64ddf6; }
.is-water-stopped .flowbox:nth-child(5) .flowboxtitle h3 { color: #a5efff !important; }
@media (max-width: 640px) {
  .flow-container .flowbox { padding-left: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .flow-container .flowbox { transition: none; }
}

/* Reasons */
#relief {
  overflow: hidden;
  background: var(--white);
}

#relief::after,
.reasonlist::before {
  display: none;
}

#relief > .namebox {
  width: var(--content);
  margin: 0 auto 72px;
}

.reasonbox {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  margin: 0 0 120px;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.scroll_up,
.reasonbox.scroll_up .reasonbox-img,
.reasonbox.scroll_up .reasonbox-text,
.reasonbox.scroll_up .reason-num {
  opacity: 1;
  transform: none;
}

.reasonbox:nth-child(even) .reasonbox-text { order: 2; }
.reasonbox:nth-child(even) .reasonbox-img { order: 1; }

.reasonbox-img {
  overflow: hidden;
  border-radius: 0;
}

.reasonbox-img img {
  width: 100%;
  min-height: 430px;
  object-fit: cover;
}

.reason-num {
  color: var(--blue);
  background: transparent;
}

.reason-num em {
  display: none;
}

.reason-num::before {
  color: var(--blue);
  font-family: var(--font-en);
  font-size: 56px;
}

.reasonbox-text h3 {
  font-family: var(--font-jp);
  font-size: clamp(32px, 3.4vw, 48px);
  font-weight: 900;
  line-height: 1.22;
  letter-spacing: 0;
}

.reason-points li i { color: var(--blue); }

/* Reasons: an editorial rhythm with small, distinct colour accents. */
#relief > .namebox { text-align: left; padding: 0; }
#relief .namebox h2 { color: #153b6a; font-size: 44px; line-height: 1.35; }
#relief .namebox h2 .title-sub { display: block; width: fit-content; margin-bottom: 18px; padding: 0; background: none; color: #48636c; font-size: 16px; font-weight: 500; }
#relief .namebox h2 em { display: inline-block; margin: 0 6px; color: #1264c4; font-family: var(--font-jp); font-size: inherit; font-weight: 900; font-style: normal; letter-spacing: 0; white-space: nowrap; }
#relief .namebox h2 .reason-heading-number { display: inline-block; margin-right: 6px; font-family: 'Inter',sans-serif; font-size: 112px; font-weight: 800; font-style: normal; line-height: 1; letter-spacing: 0; vertical-align: baseline; }
#relief .namebox > p { position: static; margin-top: 16px; font-size: 18px; color: #1264c4; opacity: 1; }
#relief .reasonbox { --reason-accent: #1264c4; --reason-tint: #d8f0f5; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; padding: 40px 0 0; margin-bottom: 88px; border-top: 1px solid #cbd9dc; background: none; }
#relief .reasonbox:nth-child(2) { --reason-accent: #ba5140; --reason-tint: #fae4dc; }
#relief .reasonbox:nth-child(3) { --reason-accent: #267769; --reason-tint: #dceee7; }
#relief .reasonbox::before, #relief .reasonbox::after { display: none; }
#relief .reasonbox:last-child { margin-bottom: 0; }
#relief .reasonbox-text { display: grid; grid-template-columns: 86px minmax(0,1fr); gap: 20px 20px; order: 2; }
#relief .reasonbox:nth-child(even) .reasonbox-text { order: 1; }
#relief .reason-num { grid-column: 1; display: block; position: static; width: auto; height: auto; margin: 0; padding: 0; border: 0; color: var(--reason-accent); background: none; font: 600 80px/1 'Barlow Condensed',sans-serif; }
#relief .reason-num::before { display: none; }
#relief .reason-tag { grid-column: 2; justify-self: start; align-self: center; margin: 0; padding: 0 0 6px; border-radius: 0; background: none; border-bottom: 3px solid var(--reason-accent); color: var(--reason-accent); font-size: 18px; font-weight: 700; }
#relief .reasonbox-text h3 { grid-column: 1 / -1; margin: 0; padding: 0; color: #153b6a; font-size: 32px; font-weight: 800; line-height: 1.6; font-feature-settings: 'palt'; }
#relief .reasonbox-text h3 strong { font-weight: 900; box-shadow: inset 0 -10px var(--reason-tint); }
#relief .reasonbox-text > p { grid-column: 1 / -1; margin: 0; font-size: 16px; line-height: 1.95; letter-spacing: 0; color: #435e7e; word-break: normal; }
#relief .reasonbox-text > p br { display: none; }
#relief .reasonbox-text ul.reason-points { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; padding: 0; background: none; border: 0; border-radius: 0; }
#relief .reasonbox-text ul.reason-points li { display: flex; align-items: baseline; gap: 10px; padding: 10px 0; border-bottom: 1px solid #dce5e7; font-size: 16px; line-height: 1.5; font-weight: 500; color: #153b6a; }
#relief .reasonbox-text ul.reason-points li::before { display: none; }
#relief .reasonbox-text ul.reason-points li i { color: var(--reason-accent); font-size: 16px; }
#relief .reasonbox-img { order: 1; display: block; position: relative; overflow: visible; align-self: center; padding: 0 12px 12px 0; background: none; }
#relief .reasonbox:nth-child(even) .reasonbox-img { order: 2; }
#relief .reasonbox-img::before { content: ''; position: absolute; inset: 28px 0 0 28px; background: var(--reason-tint); z-index: 0; }
#relief .reasonbox-img picture { display: block; position: relative; width: 100%; max-width: none; margin: 0; aspect-ratio: 5 / 4; overflow: hidden; }
#relief .reasonbox-img picture img { display: block; width: 100%; height: 100%; min-height: 0; object-fit: cover; border-radius: 0; }
@media (max-width: 1000px) {
  #relief .reasonbox { gap: 32px; }
  #relief .reasonbox-text h3 { font-size: 26px; }
}
@media (max-width: 700px) {
  #relief > .namebox { margin-bottom: 36px; }
  #relief .namebox h2 { font-size: 30px; }
  #relief .namebox h2 em { font-size: inherit; }
  #relief .namebox h2 .reason-heading-number { font-size: 76px; margin-right: 3px; }
  #relief .reasonbox { grid-template-columns: 1fr; gap: 28px; margin-bottom: 52px; padding-top: 28px; }
  #relief .reasonbox .reasonbox-text, #relief .reasonbox:nth-child(even) .reasonbox-text { order: 1; }
  #relief .reasonbox .reasonbox-img, #relief .reasonbox:nth-child(even) .reasonbox-img { order: 2; }
  #relief .reasonbox-text { grid-template-columns: 68px minmax(0,1fr); gap: 18px 12px; }
  #relief .reason-num { font-size: 64px; }
  #relief .reason-tag { font-size: 16px; }
  #relief .reasonbox-text h3 { font-size: 26px; }
}
@media (max-width: 380px) {
  #relief .namebox h2 { font-size: 24px; }
  #relief .namebox h2 em { margin: 0 4px; font-size: inherit; }
  #relief .namebox h2 .reason-heading-number { font-size: 64px; }
  #relief .namebox h2 .title-sub { font-size: 14px; white-space: normal; }
}

/* Visual chapters with a balanced photo and text layout. */
#relief { background: #f7f9fc; }
#relief > .namebox { margin-bottom: 64px; }
#relief .reasonbox { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px 64px; align-items: start; position: relative; padding-top: 24px; margin-bottom: 104px; border-top: 2px solid #153b6a; }
#relief .reasonbox-text { display: contents; }
#relief .reason-num { grid-column: 2; grid-row: 1 / 3; justify-self: end; align-self: center; font-size: 136px; line-height: 1; font-weight: 600; color: var(--reason-accent); opacity: .22; }
#relief .reason-tag { grid-column: 1; grid-row: 1; font-size: 17px; line-height: 1.5; padding: 0; border: 0; box-shadow: none; letter-spacing: 0; }
#relief .reasonbox-text h3 { grid-column: 1 / -1; grid-row: 2; position: relative; z-index: 1; padding-right: 150px; font-size: 64px; line-height: 1.25; letter-spacing: 0; }
#relief .reasonbox-text h3 strong { color: var(--reason-accent); box-shadow: none; }
#relief .reasonbox .reasonbox-img { grid-column: 1 / -1; grid-row: 3; order: initial; width: 100%; padding: 0; margin: 8px 0 12px; }
#relief .reasonbox-img::before { display: none; }
#relief .reasonbox.scroll_up .reasonbox-img { transform: none; opacity: 1; }
#relief .reasonbox-img picture { aspect-ratio: 2.65; }
#relief .reasonbox-img picture img { object-position: center 48%; filter: none; }
#relief .reasonbox-text > p { grid-column: 1; grid-row: 4; font-family: var(--font-jp); font-size: 17px; font-weight: 500; line-height: 1.9; text-align: left; letter-spacing: 0; font-feature-settings: 'palt'; color: #344e57; }
#relief .reasonbox-text > p strong { display: block; margin-bottom: 12px; font-size: 22px; font-weight: 800; line-height: 1.6; color: #153b6a; }
#relief .reasonbox-text ul.reason-points { grid-column: 2; grid-row: 4; }
#relief .reasonbox-text ul.reason-points li { padding: 16px 0; gap: 14px; border-color: #cbd4d3; font-family: var(--font-jp); font-size: 21px; font-weight: 700; line-height: 1.55; letter-spacing: 0; font-feature-settings: 'palt'; }
#relief .reasonbox-text ul.reason-points li:first-child { padding-top: 0; }
#relief .reasonbox-text ul.reason-points li i { font-size: 14px; }
@media (max-width: 1000px) {
  #relief .reasonbox { column-gap: 32px; }
  #relief .reasonbox-text h3 { font-size: 48px; padding-right: 110px; }
  #relief .reason-num { font-size: 108px; }
  #relief .reasonbox-img picture { aspect-ratio: 2; }
}
@media (max-width: 700px) {
  #relief > .namebox { margin-bottom: 40px; }
  #relief .reasonbox { grid-template-columns: minmax(0,1fr); gap: 20px; margin-bottom: 64px; }
  #relief .reason-num { grid-column: 1; grid-row: 1; font-size: 52px; opacity: 1; }
  #relief .reason-tag { grid-column: 1; grid-row: 1; min-height: 52px; display: flex; align-items: center; padding-right: 64px; font-size: 16px; }
  #relief .reasonbox-text h3 { grid-column: 1; font-size: 36px; padding: 0; line-height: 1.4; }
  #relief .reasonbox-text h3 strong { display: block; }
  #relief .reasonbox .reasonbox-img { grid-column: 1; margin: 0; }
  #relief .reasonbox-img picture { aspect-ratio: 4 / 3; }
  #relief .reasonbox-text > p { grid-column: 1; font-size: 16px; }
  #relief .reasonbox-text > p strong { font-size: 20px; }
  #relief .reasonbox-text ul.reason-points li { font-size: 18px; gap: 10px; }
  #relief .reasonbox-text ul.reason-points { grid-column: 1; grid-row: 5; }
}

@media (min-width: 701px) {
  #relief .reasonbox { gap: 22px 48px; }
  #relief .reasonbox .reasonbox-img { grid-column: 1; grid-row: 1 / 5; margin: 0; align-self: center; }
  #relief .reasonbox-img picture { aspect-ratio: 4 / 5; }
  #relief .reason-num { grid-column: 2; grid-row: 1; font-size: 76px; }
  #relief .reason-tag { grid-column: 2; grid-row: 1; padding-right: 88px; }
  #relief .reasonbox-text h3 { grid-column: 2; grid-row: 2; padding: 0; font-size: 44px; line-height: 1.4; }
  #relief .reasonbox-text > p { grid-column: 2; grid-row: 3; }
  #relief .reasonbox-text ul.reason-points { grid-column: 2; grid-row: 4; }
  #relief .reasonbox:nth-child(even) .reasonbox-img { grid-column: 2; }
  #relief .reasonbox:nth-child(even) .reason-tag,
  #relief .reasonbox:nth-child(even) .reasonbox-text h3,
  #relief .reasonbox:nth-child(even) .reasonbox-text > p,
  #relief .reasonbox:nth-child(even) .reasonbox-text ul.reason-points { grid-column: 1; }
}
@media (min-width: 701px) and (max-width: 1000px) {
  #relief .reasonbox { column-gap: 28px; }
  #relief .reasonbox-text h3 { font-size: 32px; }
  #relief .reasonbox-text > p strong { font-size: 20px; }
  #relief .reasonbox-text ul.reason-points li { font-size: 18px; }
  #relief .reason-num { font-size: 60px; }
  #relief .reason-tag { padding-right: 64px; font-size: 16px; }
}

/* Offset photo mounts and oversized folios keep each subject in focus. */
#relief .reasonbox .reasonbox-img { padding: 18px 18px 0 28px; isolation: isolate; }
#relief .reasonbox-img::before { display: block; content: ''; inset: 0 0 38px 52px; border-top: 1px solid var(--reason-accent); border-right: 1px solid var(--reason-accent); background: transparent; z-index: -1; }
#relief .reasonbox-img picture { aspect-ratio: 1; clip-path: polygon(0 0, calc(100% - 32px) 0, 100% 32px, 100% 100%, 0 100%); }
#relief .reasonbox-img picture img { object-position: 52% 50%; transition: transform .6s ease; }
#relief .reasonbox:nth-child(2) .reasonbox-img picture img { object-position: 46% 62%; }
#relief .reasonbox:nth-child(3) .reasonbox-img picture { aspect-ratio: 1.12; }
#relief .reasonbox:nth-child(3) .reasonbox-img picture img { object-position: 58% 42%; }
#relief .reasonbox-img .reason-num { position: absolute; right: 0; bottom: -2px; z-index: 2; padding: 12px 0 0 20px; background: #f7f9fc; color: var(--reason-accent); font-size: 112px; line-height: .88; opacity: 1; }
#relief .reason-photo-label { position: absolute; top: 18px; left: 0; writing-mode: vertical-rl; font-family: var(--font-jp); font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: 0; color: #435e7e; }
#relief .reason-tag { padding-right: 0; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  #relief .reasonbox-img:hover picture img { transform: scale(1.035); }
}
@media (max-width: 700px) {
  #relief .reason-tag { min-height: 0; }
  #relief .reasonbox .reasonbox-img { padding: 14px 14px 0 24px; margin-bottom: 12px; }
  #relief .reasonbox-img picture { aspect-ratio: 1.15; }
  #relief .reason-photo-label { top: 14px; }
  #relief .reasonbox-img .reason-num { font-size: 80px; padding: 10px 0 0 14px; }
}
@media (prefers-reduced-motion: reduce) {
  #relief .reasonbox-img picture img { transition: none; }
}

/* Open statistical display on a quiet engineering grid. */
#stats { color: #153b6a; padding: 88px 0 96px; background-color: #edf3fb; background-image: linear-gradient(#14748b12 1px, transparent 1px), linear-gradient(90deg, #14748b12 1px, transparent 1px); background-size: 40px 40px; border-top: 1px solid #b9d4d8; }
#stats::before { display: none; }
#stats .namebox { margin: 0 0 56px; padding: 0; text-align: left; }
#stats .namebox h2 { color: #153b6a; font-family: var(--font-jp); font-size: 44px; font-weight: 900; line-height: 1.4; letter-spacing: 0; }
#stats .namebox > p { position: static; margin: 12px 0 0; color: #1264c4; font: 700 18px/1.4 'Barlow Condensed',sans-serif; letter-spacing: 0; }
#stats .namebox > p::before, #stats .namebox > p::after { display: none; }
#stats .stats-grid { grid-template-columns: 1.35fr 1fr 1fr 1fr; gap: 0; max-width: none; border-top: 2px solid #153b6a; border-bottom: 1px solid #7b9ca5; }
#stats .stat-card { position: relative; min-width: 0; min-height: 264px; display: flex; flex-direction: row; flex-wrap: wrap; align-content: start; align-items: baseline; justify-content: flex-start; gap: 0 8px; padding: 28px 24px 32px; border: 0; border-right: 1px solid #a9c7ce; border-radius: 0; background: #edf3fb99; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; text-align: left; transition: none; }
#stats .stat-card:first-child { padding-left: 0; }
#stats .stat-card:last-child { border-right: 0; }
#stats .stat-card:hover { transform: none; background: #edf3fb99; }
#stats .stat-card__label { order: -1; width: 100%; margin: 0 0 28px; padding: 0; border: 0; color: #153b6a; font-family: var(--font-jp); font-size: 20px; font-weight: 700; line-height: 1.5; letter-spacing: 0; }
#stats .stat-card__num { color: #007ead; font: 700 148px/.95 'Barlow Condensed',sans-serif; letter-spacing: 0; font-variant-numeric: tabular-nums; text-shadow: none; }
#stats .stat-card:first-child .stat-card__num { font-size: 112px; }
#stats .stat-card__suffix { margin: 0; color: #153b6a; font: 700 20px/1.4 var(--font-jp); letter-spacing: 0; }
#stats .stat-card:last-child .stat-card__num { padding-top: 18px; color: #b44d3e; font-family: var(--font-jp); font-size: 104px; font-weight: 900; line-height: 1.2; }
#stats .stat-card__suffix:empty { display: none; }
@media (max-width: 1200px) {
  #stats .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #stats .stat-card { padding: 28px; }
  #stats .stat-card:first-child { padding-left: 28px; }
  #stats .stat-card:nth-child(2) { border-right: 0; }
  #stats .stat-card:nth-child(-n+2) { border-bottom: 1px solid #a9c7ce; }
}
@media (max-width: 600px) {
  #stats { padding: 56px 0; background-size: 24px 24px; }
  #stats .namebox { margin-bottom: 32px; }
  #stats .namebox h2 { font-size: 30px; }
  #stats .stat-card, #stats .stat-card:first-child { min-height: 192px; padding: 20px 12px; gap: 6px; }
  #stats .stat-card__label { font-size: 16px; margin-bottom: 24px; }
  #stats .stat-card__num { font-size: 88px; }
  #stats .stat-card:first-child .stat-card__num { font-size: 64px; }
  #stats .stat-card__suffix { font-size: 16px; }
  #stats .stat-card:last-child .stat-card__num { font-size: 64px; padding-top: 12px; }
}
@media (max-width: 380px) {
  #stats .stat-card:first-child .stat-card__num { font-size: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  #stats .stats-grid .stat-card { animation: none; opacity: 1; transform: none; }
}

/* A shared line box aligns values of different sizes on one baseline. */
#stats .stat-card { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 0; }
#stats .stat-card__value { height: 160px; white-space: nowrap; font: 700 148px/160px 'Barlow Condensed',sans-serif; letter-spacing: 0; word-spacing: 0; }
#stats .stat-card__value .stat-card__num { display: inline; vertical-align: baseline; line-height: 1; padding: 0; }
#stats .stat-card__value .stat-card__suffix { display: inline; vertical-align: baseline; margin-left: 6px; }
@media (max-width: 600px) {
  #stats .stat-card__value { height: 96px; font-size: 88px; line-height: 96px; }
  #stats .stat-card__value .stat-card__suffix { margin-left: 2px; }
  #stats .stat-card:first-child .stat-card__num { font-size: 56px; }
}
@media (max-width: 380px) {
  #stats .stat-card:first-child .stat-card__num { font-size: 40px; }
  #stats .stat-card:last-child .stat-card__num { font-size: 56px; }
}

/* Company identity and an unframed, editorial fact sheet. */
#company { background: #f7f9fc; color: #153b6a; padding: 88px 0; }
#company::before, #company dl::before { display: none; }
#company .company-container { max-width: none; }
#company .namebox { text-align: left; margin: 0 0 48px; padding: 0; }
#company .namebox h2 { color: #153b6a; text-shadow: none; font: 900 40px/1.4 var(--font-jp); letter-spacing: 0; }
#company .namebox h2 + p { position: static; margin: 10px 0 0; color: #1264c4; font: 700 18px/1.4 'Barlow Condensed',sans-serif; letter-spacing: 0; }
#company .namebox > p::before, #company .namebox > p::after { display: none; }
#company .company-profile { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 72px; border-top: 2px solid #153b6a; padding-top: 40px; }
#company .company-identity { position: relative; padding: 0 0 32px; align-self: start; }
#company .company-identity::after { content: ''; display: block; width: 48px; height: 4px; margin-top: 32px; background: #1264c4; }
#company .company-identity img { display: block; width: 112px; height: 112px; object-fit: contain; margin-bottom: 28px; }
#company .company-identity__designation { margin: 0 0 12px; font: 700 16px/1.6 var(--font-jp); letter-spacing: 0; color: #435e7e; }
#company .company-identity h3 { margin: 0; font: 900 56px/1.25 var(--font-jp); letter-spacing: 0; color: #153b6a; }
#company .company-identity__roman { margin: 12px 0 0; color: #1264c4; font: 600 22px/1.4 'Barlow Condensed',sans-serif; letter-spacing: 0; }
#company dl { grid-template-columns: 112px minmax(0,1fr); gap: 0 24px; align-self: start; margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
#company dt, #company dd { margin: 0; min-height: 96px; padding: 24px 0; border: 0; border-bottom: 1px solid #c5d2d3; background: transparent; letter-spacing: 0; text-align: left; font-family: var(--font-jp); line-height: 1.7; }
#company dt { font-size: 15px; font-weight: 500; color: #536b89; }
#company dd { font-size: 20px; font-weight: 700; color: #153b6a; }
#company dd:hover { background: transparent; }
#company dl dt:last-of-type, #company dl dd:last-of-type { border-bottom: 1px solid #c5d2d3; }
#company .company-team { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 6px; }
#company .company-team strong { color: #1264c4; font: 600 40px/1 'Barlow Condensed',sans-serif; transform: none; }
#company .company-team small { font-size: 15px; font-weight: 500; color: #536b89; }
@media (max-width: 1000px) {
  #company .company-profile { gap: 32px; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); }
  #company .company-identity h3 { font-size: 44px; }
  #company dl { grid-template-columns: 88px minmax(0,1fr); gap: 0 16px; }
  #company dd { font-size: 18px; }
}
@media (max-width: 700px) {
  #company { padding: 56px 0; }
  #company .namebox { margin-bottom: 28px; }
  #company .namebox h2 { font-size: 30px; }
  #company .company-profile { grid-template-columns: minmax(0,1fr); gap: 24px; padding-top: 28px; }
  #company .company-identity { padding: 0; }
  #company .company-identity img { width: 80px; height: 80px; margin-bottom: 20px; }
  #company .company-identity::after { margin-top: 24px; }
  #company dt, #company dd { min-height: 80px; padding: 20px 0; }
  #company dl { grid-template-columns: 80px minmax(0,1fr); gap: 0 12px; }
  #company dd { font-size: 17px; }
}

/* Customer quotations: one lead story and two supporting voices. */
#voice { padding: 88px 0; background: #fff; color: #153b6a; }
#voice::before { display: none; }
#voice .namebox { margin: 0 0 56px; padding: 0; text-align: left; }
#voice .namebox h2 { font: 900 44px/1.4 var(--font-jp); letter-spacing: 0; color: #153b6a; }
#voice .namebox h2 + p { position: static; margin: 12px 0 0; font: 700 18px/1.4 'Barlow Condensed',sans-serif; letter-spacing: 0; color: #1264c4; }
#voice .namebox > p::before, #voice .namebox > p::after { display: none; }
#voice .voice-group { --voice-accent: #1264c4; margin-bottom: 80px; }
#voice .voice-group:last-child { --voice-accent: #267769; margin-bottom: 0; }
#voice .voice-group__title { justify-content: flex-start; align-items: baseline; gap: 16px; padding: 20px 0; margin: 0; border-top: 2px solid #153b6a; font: 500 16px/1.5 var(--font-jp); letter-spacing: 0; color: #536b89; }
#voice .voice-group__title span { padding: 0; background: none; border-radius: 0; font-size: 28px; font-weight: 800; color: var(--voice-accent); }
#voice .voice-group__title::before, #voice .voice-group__title::after { display: none; }
#voice .voice-wrapper { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 0 56px; }
#voice .voice-human { padding: 28px 0; border: 0; border-bottom: 1px solid #cbd9dc; border-radius: 0; background: none; box-shadow: none; gap: 18px; transition: none; animation: none; opacity: 1; transform: none; }
#voice .voice-human:hover { transform: none; box-shadow: none; }
#voice .voice-human::before { display: none; }
#voice .voice-human:first-child { grid-row: 1 / 3; padding: 32px 36px 32px 0; border-right: 1px solid #cbd9dc; }
#voice .voice-highlight { display: block; order: 0; margin: 0; font: 800 24px/1.6 var(--font-jp); letter-spacing: 0; color: #153b6a; quotes: none; }
#voice .voice-highlight::before, #voice .voice-highlight::after { content: none; }
#voice .voice-human:first-child .voice-highlight { font-size: 36px; line-height: 1.55; }
#voice .voice-human:first-child .voice-highlight::before { content: '\201C'; display: block; height: 64px; margin-bottom: 12px; color: var(--voice-accent); font: 700 108px/1 Georgia,serif; }
#voice .voice-human p { order: 1; margin: 0; padding: 0; border: 0; font: 500 16px/1.95 var(--font-jp); letter-spacing: 0; color: #435e7e; text-align: left; }
#voice .voice-human h3 { order: 2; margin: 4px 0 0; padding: 0; border: 0; font: 700 15px/1.5 var(--font-jp); letter-spacing: 0; color: var(--voice-accent); }
#voice .voice-human:first-child h3 { margin-top: auto; padding-top: 24px; }
@media (max-width: 1000px) {
  #voice .voice-wrapper { gap: 0 28px; }
  #voice .voice-human:first-child { padding-right: 24px; }
  #voice .voice-human:first-child .voice-highlight { font-size: 30px; }
  #voice .voice-highlight { font-size: 22px; }
}
@media (max-width: 700px) {
  #voice { padding: 56px 0; }
  #voice .namebox { margin-bottom: 32px; }
  #voice .namebox h2 { font-size: 30px; }
  #voice .voice-group { margin-bottom: 48px; }
  #voice .voice-wrapper { grid-template-columns: minmax(0,1fr); gap: 0; }
  #voice .voice-human:first-child { grid-row: auto; padding: 20px 0 28px; border-right: 0; }
  #voice .voice-human:first-child .voice-highlight { font-size: 28px; }
  #voice .voice-human:first-child h3 { margin-top: 4px; padding-top: 0; }
  #voice .voice-group__title { gap: 12px; font-size: 14px; }
  #voice .voice-group__title span { font-size: 26px; }
}

/* Lower sections */
.stats-section,
.warranty-section,
#faq {
  background: var(--ice);
}

#company dt::before {
  content: "";
  display: none;
}

.floating-cta {
  display: none;
}

.stats-grid,
.warranty-grid,
.voicebox,
.companybox {
  border-radius: 0;
  box-shadow: none;
}

#area .w-container,
#company .w-container,
#contact .w-container {
  max-width: 1180px;
}

#contact {
  color: var(--white);
  background: var(--blue-deep);
}

#contact .namebox h2,
#contact .namebox p { color: var(--white); }

#contact .form-container {
  padding: 48px;
  border-radius: 0;
  color: var(--ink);
  background: var(--white);
}

#contact input,
#contact textarea {
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: #f7fafb;
}

#contact button[type="submit"] {
  min-width: 280px;
  border-radius: 0;
  background: var(--yellow);
  color: var(--ink);
}

/* Footer */
.footer {
  padding: 90px 0 30px;
  color: var(--white);
  background: var(--ink);
}

.footer-inner { width: var(--content); }
.footer-top { border-bottom: 0; }
.footer-logo__name { font-size: 32px; }
.footer-links { display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 18px 44px; }
.footer-links a { color: rgba(255,255,255,.8); }
.footer-sns__btn { border-radius: 50%; }

@media (max-width: 980px) {
  :root { --content: min(100% - 40px, 760px); }

  .top-header { height: 96px; padding: 0 24px; }
  .header-nav,
  .header-phone { display: none; }
  .header-actions { flex: 0 0 auto; }
  .top-header .logo .logo-title { font-size: 22px; }
  .header-toggle { flex-basis: 52px; width: 52px; height: 52px; }

  html.open .header-nav {
    position: fixed;
    inset: 0;
    z-index: -1;
    display: grid;
    place-items: center;
    background: var(--blue-deep);
  }

  html.open .header-nav .menu {
    display: grid;
    gap: 0;
    width: min(520px, calc(100% - 48px));
    margin: 0;
  }

  html.open .header-nav .menu a {
    display: block;
    padding: 20px 0;
    border-bottom: 1px solid rgba(255,255,255,.2);
    color: var(--white);
    font-size: 20px;
  }

  html.open .header-toggle .fa-bars { display: none; }
  html.open .header-toggle .fa-times { display: block; }

  #mainview { min-height: 820px; padding: 0; }
  #mainview .hero-grid { min-height: 820px; padding: 88px 0 176px; }
  #mainview .hero-text { width: 100%; }
  #mainview .hero-image { inset: 0 !important; width: 100%; height: 100%; }
  .hero-proof { right: 20px; left: 20px; }
  .hero-proof { grid-template-columns: 1fr 1fr; }
  .hero-proof__item,
  .hero-proof__phone { min-height: 88px; padding: 16px 20px; }
  .scroll-indicator { display: none; }

  .worries-section .w-container { grid-template-columns: 1fr; gap: 16px; }
  .worries-checklist { grid-column: 1; }
  .servicebox { grid-template-columns: repeat(2, 1fr); }
  .reasonbox { gap: 36px; }
}

@media (max-width: 640px) {
  :root { --content: calc(100% - 36px); }

  .top-header { height: 84px; padding: 0 18px; }
  .logo-mark { width: 38px; height: 38px; }
  .top-header .logo a { grid-template-columns: 38px auto; column-gap: 9px; }
  .top-header .logo .logo-title { font-size: 19px; }
  .top-header .logo-sub { font-size: 14px; }
  .header-toggle { flex-basis: 48px; width: 48px; height: 48px; }

  #mainview { min-height: 760px; padding: 0; }
  #mainview .hero-grid {
    min-height: 760px;
    align-items: flex-start;
    padding: 142px 0 220px;
  }
  .hero-kicker { margin-bottom: 22px; font-size: 14px; }
  .hero-tag {
    min-height: 36px;
    margin-bottom: 20px;
    padding: 3px 12px 3px 14px;
    border-left-width: 5px;
    font-size: 14px;
  }
  .hero-headline { font-size: 44px; line-height: 1.1; }
  .hero-sub { margin-top: 24px; font-size: 14px; line-height: 1.9; }
  #mainview .hero-image { inset: 0 !important; width: 100%; height: 100%; border-radius: 0 !important; }
  #mainview .hero-image picture,
  #mainview .hero-image img { height: 100%; }
  #mainview .hero-image img { object-position: 58% center; }
  #mainview .hero-image::after {
    background:
      linear-gradient(90deg, rgba(0, 34, 56, .88) 0%, rgba(0, 45, 70, .64) 66%, rgba(0, 45, 70, .22) 100%),
      linear-gradient(0deg, rgba(0, 31, 49, .7) 0%, transparent 60%);
  }
  .hero-proof {
    top: auto;
    right: 0;
    bottom: 0;
    left: 0;
    min-height: 185px;
  }
  .hero-proof__item,
  .hero-proof__phone { min-height: 110px; padding: 13px 14px; }
  .hero-proof__item strong { gap: 8px; font-size: 14px; }
  .hero-proof__item strong i { flex-basis: 28px; width: 28px; height: 28px; font-size: 14px; }
  .hero-proof__label { margin-bottom: 5px; font-size: 14px; }
  .hero-proof__phone strong { font-size: 17px; }
  .hero-proof__phone span { font-size: 14px; }

  #service,
  #flow,
  #relief,
  #stats,
  #warranty,
  #area,
  #faq,
  #voice,
  #company,
  #contact,
  .worries-section { padding-top: 80px; padding-bottom: 80px; }

  .namebox h2,
  .worries-title { font-size: 38px; line-height: 1.18; }
  .worries-checklist { grid-template-columns: 1fr; }
  .servicebox,
  .flow-container { grid-template-columns: 1fr; }
  .reasonbox { grid-template-columns: 1fr; gap: 26px; margin-bottom: 80px; }
  .reasonbox:nth-child(even) .reasonbox-text,
  .reasonbox:nth-child(even) .reasonbox-img { order: initial; }
  .reasonbox-img { border-radius: 0; }
  .reasonbox-img img { min-height: 280px; }
  .reason-num { width: 100%; height: auto; }
  .reason-num::before { font-size: 44px; }
  .emergency-banner__inner { padding: 44px 0; }
  .emergency-banner__cta { width: 100%; }
  .emergency-banner__phone {
    width: 100%;
    min-width: 0;
    padding: 22px 38px 20px 20px;
  }
  .emergency-banner__num { gap: 8px; font-size: 27px; }
  .emergency-banner__hours b { display: block; margin: 6px 0 0; padding: 0; border: 0; }
  #contact .form-container { padding: 28px 20px; }
  .footer-links { grid-template-columns: 1fr 1fr; gap: 16px 20px; }
}

/* Keep the header, copy and trust strip on the same horizontal grid. */
.top-header { padding-inline: 5%; gap: 32px; }
.top-header .logo { flex: 0 0 258px; }
.top-header .logo-sub { white-space: nowrap; font-weight: 400; }
.header-nav .menu { gap: 24px; margin-right: 0; }
.header-nav .menu li { flex: none; }
.header-nav .menu a { white-space: nowrap; font-weight: 500; }
.header-nav .menu small { display: none; }
.header-actions { flex: 0 0 auto; }
.header-phone { margin: 0; font-family: "Inter", sans-serif; font-weight: 600; border-left: 3px solid #ed6046; background: rgba(12,38,80,.85); }
.header-phone span { font-weight: 700; color: #fff; }
.header-phone span i { color: #ff927d; }
.header-toggle { display: none; border-radius: 0; }
#mainview .hero-grid { width: 90%; padding: 150px 0 220px; min-height: 940px; }
.hero-tag { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 0; border: 0; background: none; min-height: 0; margin-bottom: 24px; font-size: 16px; font-weight: 400; line-height: 1.3; text-shadow: none; }
.hero-tag::before { display: none; }
.hero-tag strong { font-size: 36px; font-weight: 500; color: #ffe079; line-height: 1.1; }
.hero-tag__authority { color: rgba(255,255,255,.9); }
.hero-headline { display: block; text-shadow: none; font-size: 80px; line-height: 1.15; }
.hero-headline > span { margin: 0 !important; text-align: left !important; }
.hero-headline__accent::after { height: 4px; bottom: 0; transform: none; }
.hero-sub { margin-top: 24px; }
.hero-response { font-weight: 500; margin-top: 14px; }
.hero-proof { left: 5%; right: 5%; border: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); min-height: 180px; background: #08649c; }
.hero-proof__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; padding: 22px 18px; min-height: 180px; border-right: 1px solid rgba(255,224,121,.3); text-align: center; }
.hero-proof__label { margin: 0; font-size: 18px; font-weight: 500; color: #fff; }
.hero-proof__item strong { color: #ffe079; font-weight: 800; font-size: 42px; line-height: 1.1; min-height: 82px; justify-content: center; }
.hero-proof__item strong.hero-proof__free { font-size: 64px; }
.hero-proof__item strong em.hero-proof__number { font-family: "Inter", sans-serif; font-size: 88px; font-style: italic; line-height: .95; color: #ffe079; }
.hero-proof__unit { font-size: 24px; align-self: flex-end; padding-bottom: 9px; }
.hero-proof__item--qualification { background-image: url("../image/main/proof-laurel.svg") !important; background-repeat: no-repeat !important; background-position: center !important; background-size: 270px 170px !important; }
.hero-proof__item { transform-origin: left bottom; }
.proof-ready:not(.proof-reveal) .hero-proof__item { opacity: 0; }
.proof-reveal .hero-proof__item { animation: proof-arrive .72s cubic-bezier(.16, 1, .3, 1) both; }
.proof-reveal .hero-proof__item:nth-child(2) { animation-delay: .24s; }
.proof-reveal .hero-proof__item:nth-child(3) { animation-delay: .48s; }
@keyframes proof-arrive {
  0% { opacity: 0; transform: translateY(36px) scale(.9); }
  55% { opacity: 1; transform: translateY(-5px) scale(1.035); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-proof .hero-proof__item { animation: none; opacity: 1; transform: none; }
}
.hero-proof__item strong i { display: none; }
.hero-proof__phone strong { font-family: "Inter", sans-serif; font-size: 26px; font-weight: 600; }
.emergency-banner__num { font-family: "Inter", sans-serif; }
.hero-call {
  position: relative;
  isolation: isolate;
  display: block;
  width: 530px;
  max-width: 100%;
  margin-top: 28px;
  padding: 20px 24px;
  color: #fff;
  background: transparent;
  border-bottom: 1px solid rgba(255,255,255,.45);
  border-radius: 0;
  text-align: left;
}
.hero-call::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(100deg, rgba(10,32,72,.94) 0%, rgba(10,32,72,.85) 65%, rgba(10,32,72,.35) 100%);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%);
}
.hero-call__heading {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0;
  background: transparent;
  color: #ff8175;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
}
.hero-call__heading .fa-arrow-right { position: absolute; right: 24px; top: 73px; font-size: 26px; color: #ff8175; transition: transform .2s ease; }
.hero-call__body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 10px 40px 0 0; }
.hero-call__body strong { font-family: "Inter", sans-serif; font-size: 46px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.hero-call__body > span { font-size: 14px; line-height: 1.6; color: #fff; }
.hero-call__body > span br { display: none; }
.hero-call:hover .hero-call__heading { background: transparent; color: #ffaaa1; }
.hero-call:hover .fa-arrow-right { transform: translateX(5px); }
.hero-call:hover { color: #fff; background: transparent; border-bottom-color: #ff8175; }
.hero-call:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
#mainview .hero-image img { opacity: 1; }
#mainview .hero-image::after {
  background: linear-gradient(90deg, rgba(8,32,72,.86), rgba(8,32,72,.6) 38%, rgba(8,32,72,.08) 68%);
}
@media (max-width: 1200px) {
  .header-nav { display: none; }
  .header-toggle { display: grid; margin-left: 20px; }
  .top-header { gap: 16px; }
  .hero-headline { font-size: 60px; }
  #mainview .hero-grid { padding: 140px 0 215px; }
  .hero-proof__item { padding-inline: 12px; }
  .hero-proof__item strong { font-size: 30px; }
  .hero-proof__item--qualification { background-size: 210px 160px !important; }
}
@media (max-width: 640px) {
  .top-header { padding-inline: 18px; }
  .top-header .logo { flex: 1 1 auto; }
  .top-header .logo a { column-gap: 8px; }
  .top-header .logo-sub { font-size: 14px; }
  .header-toggle { margin-left: 0; flex-basis: 40px; width: 40px; height: 44px; }
  #mainview .hero-grid { width: calc(100% - 36px); padding: 126px 0 175px; min-height: 830px; }
  .hero-headline { font-size: 40px; line-height: 1.25; }
  .hero-tag { display: flex; gap: 5px; font-size: 14px; margin-bottom: 24px; padding: 0; }
  .hero-tag strong { font-size: 30px; }
  .hero-tag::before { width: 18px; margin-right: 10px; }
  .hero-proof { left: 0; right: 0; grid-template-columns: 1fr; min-height: 0; }
  .hero-proof__item { min-height: 112px; padding: 16px 24px; flex-direction: row; justify-content: space-between; border-right: 0; border-bottom: 1px solid rgba(255,224,121,.3); }
  #mainview .hero-grid { padding-bottom: 385px; min-height: 1020px; }
  .hero-proof__item--qualification { background-image: none !important; }
  .hero-proof__label { margin: 0; }
  .hero-proof__label { font-size: 14px; }
  .hero-proof__item strong { font-size: 28px; min-height: 70px; }
  .hero-proof__item strong.hero-proof__free { font-size: 46px; }
  .hero-proof__item strong em.hero-proof__number { font-size: 68px; }
  .hero-proof__unit { font-size: 20px; }
  .hero-call { margin-top: 24px; padding: 18px 16px; }
  .hero-call__heading { font-size: 20px; padding: 0; }
  .hero-call__heading .fa-arrow-right { top: 62px; right: 16px; font-size: 18px; }
  .hero-call__body { padding: 10px 24px 0 0; gap: 10px; }
  .hero-call__body strong { font-size: 28px; }
  .hero-call__body > span br { display: block; }
  #mainview .hero-image::after { background: linear-gradient(90deg, rgba(8,32,72,.86), rgba(8,32,72,.5)); }
  .hero-proof__phone strong { font-size: 19px; }
}
@media (max-width: 359px) {
  .hero-headline { font-size: 34px; }
  .top-header .logo-sub { white-space: normal; }
  .hero-proof__phone strong { font-size: 17px; }
}

/* Reserve the trust strip inside the first screen, including mobile browser chrome. */
#mainview {
  --hero-header: 116px;
  --hero-proof-height: 160px;
  height: 100vh;
  height: 100svh;
  min-height: 760px;
}
#mainview .hero-grid {
  height: 100%;
  min-height: 0;
  padding: calc(var(--hero-header) + 16px) 0 calc(var(--hero-proof-height) + 20px);
  align-items: center;
}
.hero-proof { height: var(--hero-proof-height); min-height: 0; }
.hero-proof__item { min-height: 0; padding: 12px; }
.hero-proof__item--qualification { background-size: 250px 150px !important; }
@media (min-width: 641px) and (max-height: 900px) {
  #mainview { --hero-header: 88px; --hero-proof-height: 130px; min-height: 660px; }
  .top-header { height: 88px; }
  .hero-tag { flex-direction: row; align-items: baseline; gap: 12px; margin-bottom: 18px; }
  .hero-tag strong { font-size: 28px; }
  .hero-headline { font-size: 60px; }
  .hero-sub { margin-top: 18px; }
  .hero-call { margin-top: 18px; padding: 14px 22px; }
  .hero-call__body { padding-top: 6px; gap: 6px; }
  .hero-call__body strong { font-size: 38px; }
  .hero-call__heading .fa-arrow-right { top: 54px; }
  .hero-proof__item { gap: 4px; }
  .hero-proof__item strong { min-height: 64px; font-size: 32px; }
  .hero-proof__item strong.hero-proof__free { font-size: 50px; }
  .hero-proof__item strong em.hero-proof__number { font-size: 68px; }
  .hero-proof__item--qualification { background-size: 210px 124px !important; }
}
@media (max-width: 640px) {
  #mainview { --hero-header: 84px; --hero-proof-height: 116px; min-height: 640px; }
  .hero-proof { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero-proof__item { flex-direction: column; justify-content: center; gap: 6px; padding: 8px 4px; border-bottom: 0; border-right: 1px solid rgba(255,224,121,.3); }
  .hero-proof__label { font-size: 14px; line-height: 1.35; text-wrap: balance; }
  .hero-proof__item strong { font-size: 20px; min-height: 46px; gap: 3px; white-space: nowrap; }
  .hero-proof__item strong.hero-proof__free { font-size: 34px; }
  .hero-proof__item strong em.hero-proof__number { font-size: 44px; }
  .hero-proof__unit { font-size: 14px; padding-bottom: 4px; }
  .hero-tag { flex-direction: row; align-items: baseline; gap: 10px; margin-bottom: 20px; }
  .hero-tag strong { font-size: 22px; }
  .hero-call { margin-top: 20px; padding: 14px 16px; }
  .hero-call__body { gap: 6px; }
  .hero-call__heading .fa-arrow-right { top: 56px; }
}
@media (max-width: 640px) and (max-height: 700px) {
  #mainview { --hero-header: 72px; --hero-proof-height: 100px; min-height: 560px; }
  .top-header { height: 72px; }
  #mainview .hero-grid { padding-top: 82px; padding-bottom: 110px; }
  .hero-tag { margin-bottom: 12px; }
  .hero-tag strong { font-size: 20px; }
  .hero-headline { font-size: 32px; line-height: 1.15; }
  .hero-sub { margin-top: 12px; line-height: 1.5; }
  .hero-response { margin-top: 10px; font-size: 14px; gap: 6px; }
  .hero-response span { width: 16px; flex-shrink: 0; }
  .hero-call { margin-top: 12px; padding: 10px 12px; }
  .hero-call__heading { font-size: 18px; }
  .hero-call__heading .fa-arrow-right { top: 47px; right: 12px; }
  .hero-call__body { padding-top: 6px; gap: 4px; }
  .hero-call__body strong { font-size: 26px; }
  .hero-call__body > span { line-height: 1.4; }
  .hero-proof__item strong { font-size: 18px; }
}

/* Let the photograph carry the trust section without a separate panel. */
.hero-proof {
  background: transparent;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}
.hero-proof__item { border: 0; }
.hero-proof__label { text-shadow: 0 1px 6px rgba(0,18,30,.8); }
.hero-proof__item:last-child { border-right: 0; }
.hero-proof__item strong { text-shadow: 0 2px 8px rgba(1,22,40,.3); }
.hero-proof__item--qualification { background-size: 320px 148px !important; }
@media (min-width: 641px) and (max-height: 900px) {
  .hero-proof__item--qualification { background-size: 300px 124px !important; }
}
@media (min-width: 641px) and (max-width: 1100px) {
  .hero-proof__item--qualification { background-size: 220px 120px !important; }
  .hero-proof__item--qualification strong em.hero-proof__number { font-size: 54px; }
  .hero-proof__unit { font-size: 18px; }
}
body.hero-in-view #page-top { visibility: hidden; pointer-events: none; }

/* Trust credentials introduce the headline within the same reading column. */
#mainview .hero-grid {
  padding: calc(var(--hero-header) + 16px) 0 28px;
}
.hero-text .hero-proof {
  position: relative;
  inset: auto;
  flex: none;
  width: 640px;
  max-width: 100%;
  height: 112px;
  min-height: 0;
  margin: 0 0 24px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.hero-text .hero-proof__item { min-width: 0; padding: 6px; gap: 6px; }
.hero-text .hero-proof__item:first-child { align-items: flex-start; padding-left: 0; text-align: left; }
.hero-text .hero-proof__item:first-child > .hero-proof__label,
.hero-text .hero-proof__item:first-child > strong { justify-content: flex-start; text-align: left; }
.hero-text .hero-proof__label { font-size: 14px; line-height: 1.35; margin: 0; }
.hero-text .hero-proof__item strong { font-size: 28px; min-height: 52px; gap: 4px; }
.hero-text .hero-proof__item strong.hero-proof__free { font-size: 42px; }
.hero-text .hero-proof__item strong em.hero-proof__number { font-size: 58px; }
.hero-text .hero-proof__unit { font-size: 16px; padding-bottom: 4px; }
.hero-text .hero-proof__item--qualification { background-size: 200px 100px !important; }
@media (max-width: 640px) {
  #mainview .hero-grid { padding: calc(var(--hero-header) + 12px) 0 20px; }
  .hero-text .hero-proof { height: 96px; margin-bottom: 20px; }
  .hero-text .hero-proof__item { padding: 2px; gap: 4px; }
  .hero-text .hero-proof__label { min-height: 38px; display: flex; align-items: center; justify-content: center; }
  .hero-text .hero-proof__item strong { font-size: 18px; min-height: 42px; }
  .hero-text .hero-proof__item strong.hero-proof__free { font-size: 30px; }
  .hero-text .hero-proof__item strong em.hero-proof__number { font-size: 42px; }
  .hero-text .hero-proof__unit { font-size: 14px; }
}
@media (max-width: 640px) and (max-height: 700px) {
  .hero-text .hero-proof { height: 88px; margin-bottom: 12px; }
}

@media (min-width: 1201px) { .header-actions { display: none; } }
.top-header .logo a { grid-template-columns: 64px auto; column-gap: 12px; }
.top-header .logo img.logo-mark { display: block; width: 64px; height: 64px; object-fit: contain; border-radius: 0; background: none; }
.top-header .logo .logo-sub { font-size: 14px; }
body .top-header {
  background:
    linear-gradient(90deg, #ffffff00, #75caffb3 48%, #ffffff00) bottom / 100% 1px no-repeat,
    linear-gradient(112deg, #091f46 0%, #123e79 36%, #145a9b 66%, #102e62 100%) !important;
  box-shadow: 0 4px 16px #061b381a;
}
@media (min-width: 641px) {
  .top-header { height: 80px; }
  .top-header .logo a { grid-template-columns: 52px auto; column-gap: 10px; }
  .top-header .logo img.logo-mark { width: 52px; height: 52px; }
  .top-header .logo .logo-title { font-size: 24px; }
  .top-header .logo .logo-sub { margin-top: 4px; letter-spacing: 0; }
  #mainview { --hero-header: 80px; }
}
@media (max-width: 640px) {
  .top-header { flex-wrap: nowrap; gap: 12px; }
  .top-header .logo { min-width: 0; }
  .top-header .logo a { grid-template-columns: 48px minmax(0, 1fr); column-gap: 8px; }
  .top-header .logo .logo-sub { white-space: normal; line-height: 1.4; }
  .top-header .logo img.logo-mark { width: 48px; height: 48px; }
}

/* A continuous photographic surface, with the symptoms set directly on it. */
#worries {
  padding: 88px 0;
  background: linear-gradient(90deg, #f5f9fa 0%, rgba(245,249,250,.97) 35%, rgba(245,249,250,.65) 57%, rgba(245,249,250,.08) 78%), url('../image/service/washbasin.webp') right center / cover no-repeat;
}
#worries .w-container { display: block; text-align: left; }
#worries .worries-lead, #worries .worries-description { text-align: left; }
#worries .worries-lead { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px 18px; margin: 0 0 32px; padding: 0; border: 0; font-size: 17px; font-weight: 700; color: #143c4b; }
#worries .worries-lead strong { font-size: 23px; font-weight: 900; color: #006b98; box-shadow: inset 0 -9px #ffe28a; }
#worries .worries-lead > span { padding-left: 18px; border-left: 1px solid #87a5b0; line-height: 1.2; }
#worries .worries-title { max-width: 780px; margin: 0; text-align: left; text-shadow: none; color: var(--ink); line-height: 1.2; }
#worries .worries-title > span { display: block; font-size: 28px; font-weight: 700; font-feature-settings: 'palt'; }
#worries .worries-title > strong { display: table; margin-top: 14px; padding-bottom: 12px; border-bottom: 6px solid #1264c4; font-size: 112px; font-weight: 900; color: #005c85; line-height: 1.05; font-feature-settings: 'palt'; }
#worries .worries-description { margin: 28px 0 40px; font-size: 16px; font-weight: 400; line-height: 2; color: #425963; }
#worries .worries-description strong { display: block; font-size: 22px; font-weight: 700; color: #193c49; }
#worries .worries-description > span { display: block; margin-top: 6px; font-size: 17px; font-weight: 500; line-height: 1.8; }
#worries .worries-checklist { width: 760px; max-width: 100%; display: grid; grid-template-columns: 1fr 1fr; justify-content: stretch; gap: 0 32px; padding: 0; margin: 0; border-top: 1px solid #9daeb5; background: none; border-radius: 0; box-shadow: none; }
#worries .worries-checklist li { min-width: 0; width: 100%; display: grid; grid-template-columns: 112px minmax(0,1fr); grid-template-rows: 1fr 1fr; padding: 24px 0; font-size: 22px; line-height: 1.4; font-weight: 700; border-bottom: 1px solid #b7c4c9; gap: 6px 20px; }
#worries .worries-illustration { grid-row: 1 / 3; width: 112px; height: 112px; object-fit: contain; mix-blend-mode: multiply; transform: rotate(-5deg); }
#worries .worries-checklist li:nth-child(even) .worries-illustration { transform: rotate(5deg); }
#worries .worries-checklist li > span { align-self: end; color: #193c49; font-size: 24px; font-weight: 900; }
#worries .worries-checklist li small { grid-column: 2; align-self: start; justify-self: start; font-size: 17px; line-height: 1.6; font-weight: 700; color: #006b98; box-shadow: inset 0 -6px #c8edf6; }
#worries .worries-checklist li:nth-child(2) small { color: #974336; box-shadow: inset 0 -6px #ffe0d6; }
#worries .worries-checklist li:nth-child(3) small { color: #68531c; box-shadow: inset 0 -6px #ffe28a; }
#worries .worries-checklist li:nth-child(4) small { color: #246e68; box-shadow: inset 0 -6px #c8ebe0; }
#worries .worries-check { border: 0; border-radius: 0; background: none; }
#worries .worries-check .fas { color: #1264c4; }
#worries .u-line { color: var(--ink); font-size: inherit; font-weight: 700; }
#worries .u-line::after { display: none; }

#emergency.emergency-banner {
  padding: 0;
  background: linear-gradient(90deg, rgba(10,32,72,.88), rgba(10,32,72,.79)), url('../image/service/plumbing.webp') center 45% / cover no-repeat;
  border-top: 1px solid rgba(255,255,255,.3);
}
#emergency .emergency-banner__inner { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 48px; padding: 80px 0; min-height: 0; align-items: center; }
#emergency .emergency-banner__lead { min-width: 0; }
#emergency .emergency-banner__tag { border: 0; border-left: 3px solid #f6d984; padding: 0 0 0 12px; margin: 0 0 24px; color: #f6d984; font-size: 17px; font-weight: 700; line-height: 1.3; }
#emergency .emergency-banner__tag i { display: none; }
#emergency .emergency-banner__title { font-size: 46px; line-height: 1.3; margin: 0 0 18px; }
#emergency .emergency-banner__title span { display: block; font-size: 24px; font-weight: 500; }
#emergency .emergency-banner__title strong { display: block; margin: 12px 0 28px; color: #fff; white-space: nowrap; font-weight: 900; font-feature-settings: 'palt'; }
#emergency .emergency-banner__sub { font-size: 16px; font-weight: 500; line-height: 1.8; color: #d5dfe0; }
#emergency .emergency-banner__sub > span { display: block; }
#emergency .emergency-banner__sub > strong { display: inline-block; margin-top: 4px; color: #f6d984; font-size: 22px; font-weight: 700; }
#emergency .emergency-banner__cta { min-width: 0; align-self: center; }
#emergency .emergency-banner__phone { display: block; box-sizing: border-box; width: 100%; min-width: 0; padding: 30px 32px; border: 0; border-top: 3px solid #ed715e; border-bottom: 1px solid #b5d6d9; background: linear-gradient(125deg, transparent 68%, #d3e3f880 68%), linear-gradient(105deg, #f7fcfc, #e3edfc); box-shadow: none; border-radius: 0; color: #153b6a; text-align: left; }
#emergency .emergency-banner__phone::after { display: none; }
#emergency .emergency-banner__action { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 24px; color: #b83d2d; margin-bottom: 22px; }
#emergency .emergency-banner__action > .emergency-banner__urgent { font-size: inherit; font-weight: 800; color: inherit; font-feature-settings: 'palt'; }
#emergency .emergency-banner__action .fas { color: inherit; }
#emergency .emergency-banner__action > .fas { order: 0; font-size: 20px; transition: transform .2s; }
#emergency .emergency-banner__phone:hover .fa-arrow-right { transform: translateX(5px); }
#emergency .emergency-banner__num { display: block; color: #153b6a; font-family: 'Barlow Condensed', 'Inter', sans-serif; font-size: 80px; font-weight: 600; font-variant-numeric: lining-nums tabular-nums; line-height: 1; white-space: nowrap; }
#emergency .emergency-banner__num .fas { width: 28px; height: 32px; background: none; color: #ff9789 !important; }
#emergency .emergency-banner__hours { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px 20px; color: #426080; margin-top: 26px; padding-top: 18px; border-top: 1px solid #b5cdd2; font-size: 16px; font-weight: 500; }
#emergency .emergency-banner__hours b { display: inline; margin: 0 0 0 8px; padding: 0; border: 0; font-family: 'Barlow Condensed', 'Inter', sans-serif; font-size: 24px; font-weight: 600; }
#emergency .emergency-banner__free strong { margin-left: 4px; color: #b83d2d; font-size: 24px; font-weight: 800; }
#emergency .emergency-banner__phone:hover, #emergency .emergency-banner__phone:focus-visible { transform: none; background: linear-gradient(125deg, transparent 68%, #c8ddf890 68%), linear-gradient(105deg, #fff, #eaf2fc); box-shadow: none; border-color: #b83d2d; }
#emergency .emergency-banner__phone:focus-visible { outline: 2px solid #ff9789; outline-offset: 5px; }
@media (max-width: 1000px) {
  #worries .worries-title > strong { font-size: 96px; }
  #emergency .emergency-banner__inner { grid-template-columns: 1fr; gap: 32px; }
  #emergency .emergency-banner__title { font-size: 40px; }
  #emergency .emergency-banner__num { font-size: 76px; }
  #emergency .emergency-banner__action { font-size: 22px; }
}
@media (max-width: 640px) {
  #worries { padding: 56px 0; background: linear-gradient(90deg, rgba(245,249,250,.96), rgba(245,249,250,.87)), url('../image/service/washbasin.webp') center / cover no-repeat; }
  #worries .worries-title > span { font-size: 22px; }
  #worries .worries-title > strong { font-size: 52px; border-bottom-width: 4px; }
  #worries .worries-description { font-size: 14px; }
  #worries .worries-lead { gap: 10px; font-size: 16px; }
  #worries .worries-lead strong { font-size: 20px; }
  #worries .worries-lead > span { padding-left: 10px; }
  #worries .worries-description strong { font-size: 18px; }
  #worries .worries-description > span { font-size: 16px; }
  #worries .worries-checklist { gap: 0 12px; }
  #worries .worries-checklist li { grid-template-columns: 1fr; grid-template-rows: 96px auto auto; gap: 8px; padding: 20px 8px; font-size: 18px; text-align: left; }
  #worries .worries-illustration { grid-row: 1; width: 88px; height: 88px; margin-bottom: 8px; }
  #worries .worries-checklist li small { grid-column: 1; }
  #worries .worries-checklist li > span { font-size: 18px; }
  #worries .worries-checklist li small { font-size: 16px; }
  #worries .worries-check { width: 16px; }
  #emergency .emergency-banner__inner { grid-template-columns: 1fr; padding: 48px 0; gap: 24px; text-align: left; }
  #emergency .emergency-banner__lead { text-align: left; }
  #emergency .emergency-banner__title { font-size: 32px; }
  #emergency .emergency-banner__phone { padding: 24px 20px; }
  #emergency .emergency-banner__num { font-size: 42px; }
  #emergency .emergency-banner__action { font-size: 20px; }
  #emergency .emergency-banner__tag { font-size: 16px; }
  #emergency .emergency-banner__title span { font-size: 22px; }
}

/* Shared service navigation: desktop disclosure and mobile accordion. */
@media (min-width: 1201px) {
 .top-header .header-nav .menu .service-menu-panel a { color: #153b6a !important; text-shadow: none !important; }
 .top-header .header-nav .menu .service-menu-panel a:hover { color: #1264c4 !important; }
}
.top-header .service-menu { position: relative; margin: 0; border: 0; padding: 0; background: none; }
.top-header .service-menu summary { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0; color: #fff; font: 700 16px/1.5 var(--font-jp); letter-spacing: 0; list-style: none; cursor: pointer; }
.top-header .service-menu summary::-webkit-details-marker { display: none; }
.top-header .service-menu summary i { font-size: 12px; }
.top-header .service-menu[open] summary i { transform: rotate(180deg); }
.top-header .service-menu-panel { position: absolute; top: calc(100% + 18px); left: 0; width: 580px; padding: 24px; background: #fff; color: #153b6a; border-top: 3px solid #1264c4; box-shadow: 0 12px 24px #102e5820; }
.top-header .service-menu-links { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px 16px; }
.header-nav .menu .service-menu-panel a { display: flex; align-items: center; min-height: 48px; padding: 10px 0; color: #153b6a; font-size: 15px; font-weight: 500; white-space: normal; letter-spacing: 0; border: 0; border-bottom: 1px solid #d4e0e2; }
.header-nav .menu .service-menu-panel .service-menu-all { justify-content: space-between; margin-bottom: 12px; font-weight: 700; color: #1264c4; }
.header-nav .menu .service-menu-panel a:hover { color: #1264c4; background: #edf3fb; }
.top-header .service-menu summary:focus-visible, .service-menu-panel a:focus-visible, .footer-services a:focus-visible { outline: 2px solid #38b8d1; outline-offset: 3px; }
.footer { background: linear-gradient(115deg, #091f46, #123e73 62%, #102e58); }
.footer::before, .footer::after { display: none; }
.footer-services { display: grid; grid-template-columns: 220px minmax(0,1fr); gap: 40px; padding: 40px 0; border-top: 1px solid #ffffff38; border-bottom: 0; margin: 24px 0 0; text-align: left; }
.footer-services-heading p { margin: 0 0 12px; font: 600 20px/1.2 'Barlow Condensed',sans-serif; color: #8cc9ff; letter-spacing: 0; }
.footer-services h2 { margin: 0; font: 700 24px/1.6 var(--font-jp); letter-spacing: 0; color: #fff; text-align: left; }
.footer-services-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 24px; counter-reset: footer-service; }
.footer-services a { display: grid; grid-template-columns: 22px minmax(0,1fr) 14px; align-items: center; gap: 8px; min-height: 72px; padding: 14px 0; border-bottom: 1px solid #ffffff30; color: #fff; font-size: 16px; font-weight: 500; line-height: 1.5; letter-spacing: 0; counter-increment: footer-service; transition: color .2s, border-color .2s; }
.footer-services a::before { content: counter(footer-service,decimal-leading-zero); color: #8cc9ff; font: 500 14px/1 'Inter',sans-serif; }
.footer-services a::after { content: '\f061'; font: 900 12px/1 'Font Awesome 5 Free'; color: #8cc9ff; }
.footer-services a:hover { color: #b9e2ff; border-color: #b9e2ff; text-decoration: none; }
.footer .footer-links { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0; padding: 24px 0; border-top: 1px solid #ffffff38; }
.footer .footer-links a { display: flex; align-items: center; min-height: 44px; padding: 0; font-size: 14px; font-weight: 500; letter-spacing: 0; }
.footer .footer-copyright { margin-top: 8px; text-align: left; font-size: 14px; line-height: 1.7; letter-spacing: 0; }
.footer .footer-sns__btn { border-radius: 0; box-shadow: none; background: #ffffff0d; border: 1px solid #ffffff50; }
@media (max-width: 1200px) {
 html.open .header-nav { display: block; position: fixed; inset: 0; z-index: -1; padding: 108px 24px 32px; overflow-y: auto; overscroll-behavior: contain; background: linear-gradient(145deg, #091f46, #164d88 58%, #102e62); }
 html.open .header-nav .menu { display: block; width: min(520px,100%); margin: 0 auto; }
 html.open .header-nav .menu > li { width: 100%; margin: 0; }
 html.open .header-nav .menu > li > a, .top-header .service-menu summary { display: flex; align-items: center; justify-content: space-between; min-height: 56px; padding: 16px 0; border-bottom: 1px solid #6383ab; color: #fff; font-size: 18px; }
 .top-header .service-menu-panel { position: static; width: 100%; padding: 8px 16px 16px; background: #1b4277; border: 0; box-shadow: none; }
 .top-header .service-menu-links { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 16px; }
 html.open .header-nav .menu .service-menu-panel a { font-size: 14px; padding: 10px 0; min-height: 44px; color: #fff; border-bottom: 1px solid #6383ab; }
 html.open .header-nav .menu .service-menu-panel a:hover { background: #28538b; }
 html.open .header-toggle .fa-bars { display: none; }
 html.open .header-toggle .fa-times { display: block; }
}
@media (max-width: 900px) {
 .footer-services { grid-template-columns: 1fr; gap: 20px; padding: 28px 0; }
 .footer-services h2 { font-size: 22px; }
 .footer-services h2 br { display: none; }
 .footer-services-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 16px; }
 .footer-services a { min-height: 72px; font-size: 15px; gap: 6px; grid-template-columns: 18px minmax(0,1fr) 12px; }
 .footer .footer-links { gap: 4px 24px; }
}
@media (max-width: 480px) {
 .footer-services-list { grid-template-columns: 1fr; }
 .footer-services a { min-height: 56px; grid-template-columns: 24px minmax(0,1fr) 16px; gap: 12px; font-size: 16px; }
}