:root {
  --logo-bg: #eae9e9;
  --surface: #eae9e9;
  --surface-strong: #ffffff;
  --text: #162431;
  --muted: #4c6070;
  --line: rgba(24, 58, 74, 0.14);
  --accent: #2e8fa4;
  --accent-strong: #18697d;
  --accent-soft: rgba(46, 143, 164, 0.13);
  --shadow: 0 22px 48px rgba(20, 46, 61, 0.08);
  --radius: 16px;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "IBM Plex Sans", "Avenir Next", "Segoe UI", sans-serif;
  color: var(--text);
  line-height: 1.68;
  background: var(--logo-bg);
}

.container {
  width: min(1040px, 92%);
  margin: 0 auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  backdrop-filter: blur(8px);
  background: rgba(234, 233, 233, 0.92);
  border-bottom: 1px solid rgba(24, 58, 74, 0.1);
}

.header-inner {
  min-height: 84px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.header-tagline {
  margin: 0;
  padding-left: 14px;
  border-left: 1px solid rgba(24, 58, 74, 0.22);
  color: #2d3f4d;
  font-family: inherit;
  font-size: clamp(0.82rem, 1.15vw, 1rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
  max-width: 38ch;
}

.brand-link {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 14px;
  transition: background-color 0.25s ease;
}

.brand-link:hover {
  background: rgba(255, 255, 255, 0.72);
}

.brand-logo {
  height: clamp(34px, 5vw, 50px);
  width: auto;
  display: block;
}

main {
  padding: 24px 0 34px;
}


.section-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.section-grid .section {
  margin-top: 0;
  height: 100%;
}

.section-grid-last {
  margin-bottom: 10px;
}

.hero,
.section {
  position: relative;
  margin-top: 20px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
  backdrop-filter: blur(5px);
  overflow: hidden;
}

.hero::before,
.section::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 5px;
  background: linear-gradient(180deg, var(--accent), rgba(46, 143, 164, 0));
}

.hero {
  padding: clamp(24px, 4.4vw, 44px);
  background: var(--surface);
  isolation: isolate;
}

.hero::before {
  z-index: 3;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20260%20140%27%3E%3Cpath%20fill%3D%27%235f6b73%27%20d%3D%27M18%2070c34-30%20101-30%20135%200-34%2030-101%2030-135%200Z%27%2F%3E%3Cpath%20fill%3D%27%235f6b73%27%20d%3D%27M150%2070l70-38v76l-70-38Z%27%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20210%20120%27%3E%3Cpath%20fill%3D%27%236b747a%27%20d%3D%27M186%2060c-28%2024-82%2024-110%200%2028-24%2082-24%20110%200Z%27%2F%3E%3Cpath%20fill%3D%27%236b747a%27%20d%3D%27M62%2060L10%2030v60l52-30Z%27%2F%3E%3C%2Fsvg%3E"),
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20200%20220%27%3E%3Cpath%20fill%3D%27%236a7379%27%20d%3D%27M40%20210c2-58-4-104-24-170%2036%2026%2050%2071%2042%20170Z%27%2F%3E%3Cpath%20fill%3D%27%23727b81%27%20d%3D%27M94%20210c-7-74%206-125%2032-188%2018%2049%206%20103-10%20188Z%27%2F%3E%3Cpath%20fill%3D%27%23646d73%27%20d%3D%27M146%20210c-1-52%2013-101%2044-162%208%2057-8%20109-24%20162Z%27%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: 220px auto, 148px auto, 176px auto;
  background-position: 18px 22%, 204px 72%, calc(100% - 12px) calc(100% - 8px);
  opacity: 0.2;
}

.hero > * {
  position: relative;
  z-index: 2;
}

.section {
  padding: clamp(22px, 4vw, 36px);
  isolation: isolate;
}

.section::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-repeat: no-repeat;
  opacity: 0.14;
}

.section > * {
  position: relative;
  z-index: 2;
}

.section-grid > .section:nth-child(1)::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20220%20120%27%3E%3Cpath%20fill%3D%27%236b747a%27%20d%3D%27M20%2060c26-25%2077-25%20103%200-26%2025-77%2025-103%200Z%27%2F%3E%3Cpath%20fill%3D%27%236b747a%27%20d%3D%27M120%2060l56-34v68l-56-34Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20100%2080%27%3E%3Cpath%20fill%3D%27%2368727a%27%20d%3D%27M18%2040c14-13%2041-13%2055%200-14%2013-41%2013-55%200Z%27%2F%3E%3Cpath%20fill%3D%27%2368727a%27%20d%3D%27M68%2040l24-14v28l-24-14Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20100%2080%27%3E%3Cpath%20fill%3D%27%2368727a%27%20d%3D%27M18%2040c14-13%2041-13%2055%200-14%2013-41%2013-55%200Z%27%2F%3E%3Cpath%20fill%3D%27%2368727a%27%20d%3D%27M68%2040l24-14v28l-24-14Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20120%20130%27%3E%3Cpath%20fill%3D%27%23788086%27%20d%3D%27M22%20120c-2-31%207-59%2025-94%206%2035-3%2065-13%2094Z%27%2F%3E%3Cpath%20fill%3D%27%236a7379%27%20d%3D%27M62%20120c0-35-11-64-32-94%2027%2020%2039%2047%2042%2094Z%27%2F%3E%3Cpath%20fill%3D%27%23818a90%27%20d%3D%27M97%20120c3-26%2016-49%2037-77-3%2029-15%2054-27%2077Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20120%20130%27%3E%3Cpath%20fill%3D%27%23788086%27%20d%3D%27M22%20120c-2-31%207-59%2025-94%206%2035-3%2065-13%2094Z%27%2F%3E%3Cpath%20fill%3D%27%236a7379%27%20d%3D%27M62%20120c0-35-11-64-32-94%2027%2020%2039%2047%2042%2094Z%27%2F%3E%3Cpath%20fill%3D%27%23818a90%27%20d%3D%27M97%20120c3-26%2016-49%2037-77-3%2029-15%2054-27%2077Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20120%20130%27%3E%3Cpath%20fill%3D%27%23788086%27%20d%3D%27M22%20120c-2-31%207-59%2025-94%206%2035-3%2065-13%2094Z%27%2F%3E%3Cpath%20fill%3D%27%236a7379%27%20d%3D%27M62%20120c0-35-11-64-32-94%2027%2020%2039%2047%2042%2094Z%27%2F%3E%3Cpath%20fill%3D%27%23818a90%27%20d%3D%27M97%20120c3-26%2016-49%2037-77-3%2029-15%2054-27%2077Z%27%2F%3E%3C%2Fsvg%3E");
  background-size: 162px auto, 70px auto, 58px auto, 120px auto, 86px auto, 74px auto;
  background-position: 12px 18%, 148px 66%, 88px 42%, calc(100% - 10px) calc(100% - 8px), calc(100% - 102px) calc(100% - 8px), calc(100% - 186px) calc(100% - 8px);
}

.section-grid > .section:nth-child(2)::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20210%20120%27%3E%3Cpath%20fill%3D%27%23626d74%27%20d%3D%27M188%2060c-30%2019-95%2019-125%200%2030-19%2095-19%20125%200Z%27%2F%3E%3Cpath%20fill%3D%27%23626d74%27%20d%3D%27M60%2060L12%2034v52l48-26Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20170%20190%27%3E%3Cpath%20fill%3D%27%23707980%27%20d%3D%27M28%20180c-3-46%209-92%2036-148%209%2054-5%20101-20%20148Z%27%2F%3E%3Cpath%20fill%3D%27%23636d73%27%20d%3D%27M84%20180c0-58-18-102-52-152%2044%2031%2063%2076%2069%20152Z%27%2F%3E%3Cpath%20fill%3D%27%237a8389%27%20d%3D%27M132%20180c4-42%2025-83%2058-130-5%2049-24%2091-41%20130Z%27%2F%3E%3C%2Fsvg%3E");
  background-size: 180px auto, 146px auto;
  background-position: calc(100% - 24px) 74%, 16px calc(100% - 10px);
}

.section-grid-last > .section:nth-child(1)::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20220%20140%27%3E%3Cpath%20fill%3D%27%23737c82%27%20d%3D%27M24%2070c20-20%2054-33%2090-28%2020%203%2038%2012%2052%2028-14%2016-32%2025-52%2028-36%205-70-8-90-28Z%27%2F%3E%3Cpath%20fill%3D%27%23737c82%27%20d%3D%27M148%2070l44-24v48l-44-24Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20100%2080%27%3E%3Cpath%20fill%3D%27%2368727a%27%20d%3D%27M18%2040c14-13%2041-13%2055%200-14%2013-41%2013-55%200Z%27%2F%3E%3Cpath%20fill%3D%27%2368727a%27%20d%3D%27M68%2040l24-14v28l-24-14Z%27%2F%3E%3C%2Fsvg%3E");
  background-size: 176px auto, 84px auto;
  background-position: calc(100% - 16px) 18%, 20px calc(100% - 18px);
}

.section-grid-last > .section:nth-child(2)::after {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20200%20220%27%3E%3Cpath%20fill%3D%27%236a7379%27%20d%3D%27M40%20210c2-58-4-104-24-170%2036%2026%2050%2071%2042%20170Z%27%2F%3E%3Cpath%20fill%3D%27%23727b81%27%20d%3D%27M94%20210c-7-74%206-125%2032-188%2018%2049%206%20103-10%20188Z%27%2F%3E%3Cpath%20fill%3D%27%23646d73%27%20d%3D%27M146%20210c-1-52%2013-101%2044-162%208%2057-8%20109-24%20162Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20210%20120%27%3E%3Cpath%20fill%3D%27%23626d74%27%20d%3D%27M188%2060c-30%2019-95%2019-125%200%2030-19%2095-19%20125%200Z%27%2F%3E%3Cpath%20fill%3D%27%23626d74%27%20d%3D%27M60%2060L12%2034v52l48-26Z%27%2F%3E%3C%2Fsvg%3E"), url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20140%20200%27%3E%3Cpath%20fill%3D%27%23646e75%27%20d%3D%27M34%20190c6-54%201-100-18-160%2032%2025%2041%2070%2030%20160Z%27%2F%3E%3Cpath%20fill%3D%27%236d767c%27%20d%3D%27M80%20190c-4-62%2010-110%2034-174%2015%2045%205%2097-13%20174Z%27%2F%3E%3C%2Fsvg%3E");
  background-size: 128px auto, 132px auto, 102px auto;
  background-position: 8px calc(100% - 8px), calc(100% - 16px) 22%, calc(100% - 14px) calc(100% - 10px);
}


h1,
h2,
h3 {
  margin: 0;
  letter-spacing: -0.01em;
}

h1 {
  max-width: 18ch;
  margin-bottom: 16px;
  font-size: clamp(2rem, 4vw, 3.1rem);
  line-height: 1.08;
}

h2 {
  margin-bottom: 8px;
  font-size: clamp(1.42rem, 2.4vw, 2rem);
}

h3 {
  margin-bottom: 16px;
  color: var(--muted);
  font-size: clamp(1.02rem, 1.8vw, 1.22rem);
  font-weight: 570;
}

p {
  margin: 0 0 15px;
  max-width: 78ch;
}

.lead {
  margin-bottom: 16px;
  font-size: clamp(1.07rem, 1.75vw, 1.26rem);
  line-height: 1.58;
  color: #1a3444;
}

.list-title {
  margin: 2px 0 8px;
  font-weight: 680;
}

ul,
ol {
  margin: 0;
  padding-left: 0;
  list-style: none;
}

ul li,
ol li {
  position: relative;
  margin-bottom: 10px;
  padding: 10px 0 10px 20px;
  border-bottom: 1px dashed rgba(26, 74, 93, 0.14);
}

ul li:last-child,
ol li:last-child {
  border-bottom: 0;
  margin-bottom: 0;
}

ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 18px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 5px var(--accent-soft);
}

ol {
  counter-reset: step;
}

ol li {
  padding-left: 44px;
}

ol li::before {
  counter-increment: step;
  content: counter(step);
  position: absolute;
  left: 0;
  top: 8px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 700;
  background: linear-gradient(180deg, var(--accent), var(--accent-strong));
  box-shadow: 0 8px 16px rgba(28, 95, 114, 0.26);
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin-top: 20px;
}

.pilot-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 10px;
  background: #c74444;
  color: #ffffff;
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.01em;
  box-shadow: 0 10px 20px rgba(150, 34, 34, 0.25);
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.pilot-cta:hover {
  background: #b03b3b;
  transform: translateY(-1px);
}

.pilot-cta:active {
  transform: translateY(0);
}

.pilot-cta-sep {
  opacity: 0.9;
}

.site-footer {
  border-top: 1px solid rgba(24, 58, 74, 0.11);
  background: rgba(234, 233, 233, 0.92);
  backdrop-filter: blur(6px);
}

.footer-inner {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: var(--muted);
  font-size: 0.95rem;
}

.footer-inner a {
  color: var(--accent-strong);
  text-decoration: none;
}

.footer-inner a:hover {
  text-decoration: underline;
}

@media (max-width: 980px) {
  .section-grid {
    grid-template-columns: 1fr;
  }

  .hero,
  .section {
    border-radius: 14px;
  }
}

@media (max-width: 640px) {
  .container {
    width: min(1040px, 94%);
  }

  .header-inner {
    min-height: 74px;
    padding: 8px 0;
    gap: 6px;
    flex-direction: column;
    align-items: flex-start;
  }

  .brand-link {
    padding: 4px 0;
  }

  .brand-logo {
    height: 36px;
  }

  .header-tagline {
    padding-left: 0;
    border-left: 0;
    font-size: 0.82rem;
    max-width: 100%;
  }

  main {
    padding-top: 14px;
  }

  .hero,
  .section {
    padding: 18px 16px;
    margin-top: 14px;
  }

  .hero::after {
    background-size: 154px auto, 104px auto, 118px auto;
    background-position: 8px 22%, 98px 70%, calc(100% - 6px) calc(100% - 6px);
    opacity: 0.14;
  }

  .section::after {
    opacity: 0.1;
  }

  .section-grid > .section:nth-child(1)::after {
    background-size: 118px auto, 52px auto, 40px auto, 88px auto, 62px auto, 50px auto;
    background-position: 6px 14%, 78px 64%, 40px 40%, calc(100% - 6px) calc(100% - 6px), calc(100% - 58px) calc(100% - 6px), calc(100% - 98px) calc(100% - 6px);
  }

  .section-grid > .section:nth-child(2)::after {
    background-size: 124px auto, 102px auto;
    background-position: calc(100% - 10px) 78%, 8px calc(100% - 6px);
  }

  .section-grid-last > .section:nth-child(1)::after {
    background-size: 118px auto, 60px auto;
    background-position: calc(100% - 6px) 14%, 10px calc(100% - 10px);
  }

  .section-grid-last > .section:nth-child(2)::after {
    background-size: 90px auto, 94px auto, 72px auto;
    background-position: 4px calc(100% - 6px), calc(100% - 8px) 16%, calc(100% - 8px) calc(100% - 6px);
  }

  .section-grid {
    margin-top: 14px;
    gap: 14px;
  }

  .hero::before,
  .section::before {
    width: 4px;
  }

  .pilot-cta {
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    row-gap: 2px;
    font-size: 0.96rem;
    text-align: center;
  }

  .pilot-cta-sep {
    display: none;
  }

  ul li,
  ol li {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  ol li {
    padding-left: 40px;
  }

  .footer-inner {
    min-height: 58px;
    flex-direction: column;
    justify-content: center;
    padding: 10px 0;
  }
}


@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
  }
}