.work-visual {
  aspect-ratio: 1.45;
  background: #e6eef6;
  overflow: hidden;
  position: relative;
  border-radius: 9px;
  border: 1px solid #dce5ef;
  transition: transform .5s, box-shadow .5s;
}
.work-card:hover .work-visual {
  transform: translateY(-6px);
  box-shadow: 0 16px 36px #152c4714;
}
.browser-bar {
  height: 22px;
  display: flex;
  align-items: center;
  gap: 4px;
  background: #f3f5f8;
  border-bottom: 1px solid #dce5ef;
  padding-inline: 10px;
}
.browser-bar i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #b9c3cc;
}
.concept-screen {
  height: calc(100% - 22px);
  position: relative;
  overflow: hidden;
  background: #18252d;
  color: white;
  padding: 6%;
  isolation: isolate;
}
.concept-screen.product {
  background: #e5e3de;
  color: #272726;
}
.concept-screen:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      #05131c90,
      transparent 80%);
  z-index: -1;
}
.concept-screen.product:after {
  background:
    linear-gradient(
      90deg,
      #f4f3f1c9,
      transparent 78%);
}
.concept-screen img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform .7s;
}
.work-card:hover .concept-screen img {
  transform: scale(1.04);
}
.concept-nav {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  letter-spacing: .1em;
}
.concept-nav strong {
  font-size: 16px;
}
.concept-title {
  position: absolute;
  top: 31%;
  left: 6%;
  max-width: 65%;
  font-size: clamp(25px, 2.4vw, 38px);
  line-height: 1.02;
  letter-spacing: -.02em;
}
.product .concept-title {
  font-family: Georgia, serif;
  font-weight: 400;
  max-width: 70%;
}
.concept-bottom {
  position: absolute;
  bottom: 9%;
  font-size: 11px;
  letter-spacing: .09em;
}
@media (max-width: 1000px) {
  .concept-title {
    font-size: 27px;
  }
}
@media (max-width: 900px) {
  .work-visual {
    aspect-ratio: 1.4;
  }
  .concept-title {
    font-size: clamp(25px, 7vw, 38px);
  }
}
.tilted-browser .work-visual {
  aspect-ratio: 1.25;
  box-shadow: 0 30px 80px #00206866;
}
.case-showcase .work-visual {
  aspect-ratio: 1.85;
}
.case-showcase .concept-title {
  font-size: clamp(40px, 5.8vw, 90px);
}
.case-showcase .concept-nav {
  font-size: 13px;
}
.case-showcase .concept-nav strong {
  font-size: 26px;
}
.case-showcase .concept-bottom {
  font-size: 13px;
}
@media (max-width: 900px) {
  .case-showcase .work-visual {
    aspect-ratio: 1.35;
  }
  .case-showcase .concept-title {
    font-size: clamp(24px, 6.5vw, 45px);
  }
  .case-showcase .concept-nav,
  .case-showcase .concept-bottom {
    font-size: 10px;
  }
  .case-showcase .concept-nav strong {
    font-size: 16px;
  }
}
.portfolio-meta .concept-note {
  color: #99a3b0;
}
.v3-project-screen {
  container-type: inline-size;
  aspect-ratio: 1.3;
  overflow: hidden;
  position: relative;
  isolation: isolate;
  line-height: 1.3;
  font-family: Arial, sans-serif;
  color: #171c22;
  background: white;
  text-align: left;
}
.v3-project-screen * {
  box-sizing: border-box;
}
.v3-project-screen p,
.v3-project-screen i {
  color: inherit;
  font-style: normal;
}
.v3-project-screen img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.v3-project-screen header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.v3-project-screen header b {
  white-space: nowrap;
}
.v3-project-screen header small {
  font-size: 1.4cqw;
  white-space: nowrap;
}
.v3-project-screen i {
  font-size: 1.5cqw;
}
.v3-project-screen strong {
  display: block;
  font-weight: 600;
}
.v3-project-screen small {
  font-weight: 400;
}
.v3-project-screen header span {
  font-size: 1.3cqw;
}
.v3-solar {
  background: #f3f5ed;
  color: #1d4235;
}
.v3-solar-nav {
  height: 13%;
  padding: 0 5%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.v3-solar-nav strong {
  font-size: 3.5cqw;
  letter-spacing: -.18cqw;
}
.v3-solar-nav strong span {
  font-size: 1.5cqw;
  vertical-align: top;
  margin-left: 3px;
}
.v3-solar-nav small {
  font-size: 1.45cqw;
}
.v3-solar-nav i {
  padding: 2cqw 2.5cqw;
  border-radius: 30px;
  background: #dbeea6;
  font-size: 1.4cqw;
}
.v3-solar-photo {
  height: 68%;
  position: relative;
  margin: 0 3.5%;
  overflow: hidden;
  border-radius: 3cqw;
}
.v3-solar-photo:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(#142d4530, #112d3080);
}
.v3-solar-title {
  position: absolute;
  inset: 20% 7% 10%;
  z-index: 1;
  color: white;
  text-align: center;
}
.v3-solar-title span {
  font-size: 1.35cqw;
  letter-spacing: .5cqw;
}
.v3-solar-title strong {
  font-size: 7.2cqw;
  font-weight: 500;
  line-height: 1.02;
  letter-spacing: -.3cqw;
  margin: 3cqw 0 4cqw;
}
.v3-solar-title i {
  border-radius: 30px;
  color: #204335;
  background: #d9f598;
  padding: 2cqw 3cqw;
  display: inline-block;
}
.v3-solar-bottom {
  height: 19%;
  padding: 4cqw 5%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.5cqw;
  gap: 4cqw;
}
.v3-solar-bottom > span {
  font-size: 2.3cqw;
  font-weight: 500;
}
.v3-solar-bottom b {
  font-size: 1.4cqw;
  font-weight: 500;
  border-bottom: 1px solid #bbc5b8;
  padding-bottom: 1.5cqw;
}
.v3-precision {
  color: #1a2429;
  background: #fff;
}
.v3-precision-nav {
  height: 12%;
  padding: 0 5%;
}
.v3-precision-nav b {
  font-size: 3.3cqw;
  letter-spacing: -.1cqw;
}
.v3-precision-nav span {
  border-bottom: 1px solid #ea632d;
}
.v3-precision-main {
  height: 67%;
  display: grid;
  grid-template-columns: 37% 63%;
}
.v3-precision-main > aside {
  padding: 5cqw 4cqw;
  background: #ff722f;
  z-index: 1;
}
.v3-precision-main aside small {
  font-size: 1.1cqw;
  letter-spacing: .15cqw;
}
.v3-precision-main aside strong {
  font-size: 9cqw;
  line-height: .89;
  letter-spacing: -.4cqw;
  margin: 4cqw 0 3cqw;
  font-weight: 800;
}
.v3-precision-main p {
  font-size: 1.4cqw;
  line-height: 1.5;
}
.v3-precision-main i {
  font-size: 1.3cqw;
  display: block;
  margin-top: 3cqw;
  border-bottom: 1px solid #343434;
  padding-bottom: 1cqw;
  max-width: 19cqw;
}
.v3-precision-main > div {
  position: relative;
  overflow: hidden;
}
.v3-image-label {
  position: absolute;
  bottom: 3cqw;
  right: 4cqw;
  color: #fff;
  letter-spacing: .2cqw;
  font-size: 1cqw;
}
.v3-precision-bottom {
  height: 21%;
  background: #152129;
  color: #c6d0d4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4cqw;
  gap: 2cqw;
}
.v3-precision-bottom > span {
  font-size: 1.55cqw;
  line-height: 1.6;
}
.v3-precision-bottom > b {
  font-size: 1.2cqw;
  font-weight: 400;
  border-left: 1px solid #718087;
  padding-left: 2cqw;
}
.v3-material {
  background: #faf8f4;
  color: #292b27;
}
.v3-material-nav {
  height: 13%;
  padding: 0 5%;
  border-bottom: 1px solid #dcdad3;
}
.v3-material-nav b {
  font-size: 3.5cqw;
  letter-spacing: -.2cqw;
}
.v3-material-nav b span {
  color: #dc6431;
  vertical-align: top;
  margin-left: 3px;
}
.v3-material-nav i {
  font-size: 1.3cqw;
  color: #a74e29;
}
.v3-material-head {
  height: 37%;
  padding: 4cqw 5%;
  position: relative;
}
.v3-material-head > small {
  font-size: 1.15cqw;
  letter-spacing: .25cqw;
  color: #a75632;
}
.v3-material-head > strong {
  font-size: 6.5cqw;
  letter-spacing: -.25cqw;
  line-height: 1.02;
  margin-top: 2.2cqw;
  font-weight: 500;
}
.v3-material-head > p {
  position: absolute;
  bottom: 4cqw;
  right: 5cqw;
  font-size: 1.4cqw;
  line-height: 1.6;
}
.v3-material-catalog {
  display: grid;
  grid-template-columns: 62% 38%;
  height: 50%;
  border-top: 1px solid #d9d7cf;
}
.v3-material-catalog > div {
  position: relative;
  overflow: hidden;
}
.v3-material-catalog > div > span {
  position: absolute;
  bottom: 2.5cqw;
  left: 4cqw;
  font-size: 1cqw;
  letter-spacing: .15cqw;
}
.v3-material-catalog aside {
  padding: 3cqw 4cqw;
}
.v3-material-catalog aside > b {
  font-size: 2cqw;
  font-weight: 500;
  display: block;
  margin-bottom: 2.6cqw;
}
.v3-material-catalog aside > div {
  padding: 1.9cqw 0;
  border-top: 1px solid #dcd9cf;
}
.v3-material-catalog aside span {
  display: block;
  color: #ad5c36;
  font-size: 1cqw;
  margin-bottom: 1cqw;
}
.v3-material-catalog aside strong {
  font-size: 1.5cqw;
  font-weight: 400;
}
.v3-textile {
  background: #f7f4ed;
  color: #514336;
}
.v3-textile-nav {
  height: 14%;
  padding: 0 6%;
  border-bottom: 1px solid #e7e1d6;
}
.v3-textile-nav b {
  font-family: Georgia, serif;
  letter-spacing: .45cqw;
  font-weight: 400;
  font-size: 4cqw;
}
.v3-textile-image {
  position: relative;
  height: 64%;
  margin: 0 4%;
  overflow: hidden;
}
.v3-textile-image > img {
  object-position: center 58%;
}
.v3-textile-image > div {
  position: absolute;
  left: 5%;
  bottom: 8%;
  background: #f7f4edeb;
  padding: 3cqw 4cqw;
  min-width: 41%;
}
.v3-textile-image small {
  font-size: .95cqw;
  letter-spacing: .25cqw;
}
.v3-textile-image strong {
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 6.3cqw;
  line-height: .98;
  letter-spacing: -.12cqw;
  margin: 2cqw 0;
}
.v3-textile-image i {
  font-size: 1.1cqw;
}
.v3-textile-image > span {
  position: absolute;
  right: 3cqw;
  bottom: 3cqw;
  color: white;
  font-size: 1.4cqw;
  text-shadow: 0 1px 4px #0006;
}
.v3-textile-bottom {
  height: 22%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4cqw 6%;
  gap: 3cqw;
}
.v3-textile-bottom strong {
  font-family: Georgia, serif;
  font-weight: 400;
  font-size: 3cqw;
  max-width: 35%;
}
.v3-textile-bottom p {
  font-size: 1.4cqw;
  line-height: 1.6;
}
.v3-textile-bottom i {
  font-size: 1.3cqw;
}
.v3-industrial {
  background: #fff;
  color: #18304c;
}
.v3-industrial-nav {
  height: 15%;
  padding: 0 5%;
}
.v3-industrial-nav b {
  font-size: 3.4cqw;
  letter-spacing: -.1cqw;
}
.v3-industrial-nav b i {
  font-size: 3cqw;
  color: #205ef8;
}
.v3-industrial-nav > span {
  background: #155cef;
  color: #fff;
  padding: 1.5cqw 2cqw;
  font-size: 1.2cqw;
}
.v3-industrial-image {
  height: 61%;
  position: relative;
  overflow: hidden;
}
.v3-industrial-image:after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      90deg,
      #071d397a,
      transparent);
}
.v3-industrial-image > div {
  position: absolute;
  left: 6%;
  top: 17%;
  color: white;
  z-index: 1;
}
.v3-industrial-image span {
  font-size: 1.1cqw;
  letter-spacing: .22cqw;
}
.v3-industrial-image strong {
  font-size: 6.6cqw;
  line-height: 1.06;
  margin: 3cqw 0 4cqw;
  letter-spacing: -.15cqw;
}
.v3-industrial-image i {
  padding-bottom: 1cqw;
  border-bottom: 1px solid #fff;
  font-size: 1.4cqw;
}
.v3-industrial-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3cqw;
  padding: 4cqw 6%;
  height: 24%;
}
.v3-industrial-bottom > strong {
  font-size: 2.7cqw;
}
.v3-industrial-bottom b {
  font-size: 1.8cqw;
  font-weight: 500;
}
.v3-industrial-bottom p {
  font-size: max(10px, 1.15cqw);
  margin-top: 1cqw;
  color: #4d627a;
}
.v3-audio {
  background: #f75c39;
  color: #201f24;
}
.v3-audio-nav {
  height: 14%;
  padding: 0 5%;
}
.v3-audio-nav b {
  font-size: 4.6cqw;
  letter-spacing: -.25cqw;
  font-weight: 700;
}
.v3-audio-nav b span {
  font-size: 1.3cqw;
  vertical-align: top;
  display: inline-block;
  margin: 1cqw;
}
.v3-audio-nav i {
  font-size: 1.3cqw;
  border-bottom: 1px solid #201f24;
  padding-bottom: .8cqw;
}
.v3-audio-main {
  height: 57%;
  padding: 2cqw 5% 0;
  display: grid;
  grid-template-columns: 47% 53%;
  align-items: center;
}
.v3-audio-type small {
  font-size: 1.1cqw;
  letter-spacing: .15cqw;
}
.v3-audio-type strong {
  font-size: 6.8cqw;
  line-height: .97;
  letter-spacing: -.3cqw;
  font-weight: 500;
  margin: 3cqw 0 5cqw;
}
.v3-audio-type i {
  background: #26252b;
  color: #fff;
  padding: 2cqw 3cqw;
  border-radius: 30px;
  font-size: 1.3cqw;
}
.v3-audio-product {
  height: 95%;
  background: #f6f1e6;
  border-radius: 50% 50% 3cqw 3cqw;
  position: relative;
  overflow: hidden;
}
.v3-audio-product img {
  object-fit: cover;
  object-position: 55% center;
}
.v3-audio-product > span {
  position: absolute;
  bottom: 2cqw;
  left: 0;
  right: 0;
  text-align: center;
  font-size: .9cqw;
  letter-spacing: .08cqw;
}
.v3-audio-bottom {
  height: 29%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4cqw 5%;
}
.v3-audio-bottom strong {
  font-size: 5.7cqw;
  font-weight: 800;
  letter-spacing: -.2cqw;
  line-height: .88;
}
.v3-audio-bottom > span {
  font-size: 1.5cqw;
  line-height: 1.6;
}
.v3-audio-bottom > i {
  font-size: 1.2cqw;
  align-self: end;
}
.case-study-stage .v3-project-screen {
  max-width: 1040px;
  margin: auto;
  box-shadow: 0 18px 50px #1c2d4924;
}
@media (max-width: 650px) {
  .v3-project-screen header small {
    font-size: 1.3cqw;
  }
}
.portfolio-card .v3-project-screen img,
.moment-photo img {
  transition: transform .7s cubic-bezier(.2, .7, .2, 1);
}
@media (hover: hover) and (pointer: fine) {
  .portfolio-card:hover .v3-project-screen img {
    transform: scale(1.055);
  }
}
@media (prefers-reduced-motion: reduce) {
  .portfolio-card:hover .portfolio-art,
  .portfolio-card:focus-visible .portfolio-art,
  .portfolio-card:hover .v3-project-screen img,
  .portfolio-card:hover .portfolio-direction,
  .moments-gallery figure:hover .moment-photo img,
  .collaboration-grid article:hover,
  .feature-grid article:hover,
  .culture-grid article:hover,
  .portfolio-filter button:hover,
  .button:hover .arrow,
  .text-link:hover .arrow,
  .dropdown a:hover .menu-service-icon,
  .dropdown a:hover .menu-service-arrow {
    transform: none;
  }
}
.home-portfolio .work-visual,
.home-portfolio .portfolio-visual {
  box-shadow: none;
}

.service-menu summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.service-menu summary:after {
  content: "\2304";
  font-size: 12px;
}



.mobile-services {
  display: none;
}
.honeypot {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.appointment-form .submit:disabled {
  cursor: wait;
  opacity: .65;
}
.appointment-form .form-status {
  min-height: 1.8em;
  font-size: 14px;
  line-height: 1.8;
}
.appointment-form .is-error {
  color: #a72c18;
}
.appointment-form textarea {
  resize: vertical;
  min-height: 130px;
}
.appointment-form label,
.appointment-form legend {
  font-size: 15px;
}
.appointment-form fieldset label {
  font-size: 14px;
}
.appointment-form .consent {
  font-size: 13px;
}
.appointment-form :focus-visible {
  outline: 2px solid #075bce;
  outline-offset: 3px;
}
.cms-view #main,
.view-insights #main {
  background: #eff3f8;
  color: #132e4a;
  padding-bottom: 80px;
}
.cms-view .header {
  position: relative;
}
.cms-view .footer,
.cms-view .world-end {
  color: #fff;
}
.cms-view .section {
  padding-block: 70px;
}
.cms-view .cms-list-intro,
.portfolio-intro {
  padding-top: 90px;
  padding-bottom: 65px;
}
.cms-list-intro h1,
.portfolio-intro h1,
.case-study h1,
.cms-article h1 {
  font-size: clamp(32px, 3.6vw, 64px);
  line-height: 1.25;
  letter-spacing: -.045em;
  font-weight: 550;
}
.cms-list-intro p,
.portfolio-intro p {
  margin-top: 22px;
  max-width: 640px;
  font-size: 18px;
  line-height: 1.8;
  color: #566f88;
}
.portfolio-intro {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 50px;
}
.cms-list {
  padding-top: 0 !important;
}
.cms-empty {
  padding: 35px 0;
  color: #6a7c93;
}
.insight-grid {
  display: grid;
  grid-template-columns: 1fr;
}
.insight-card {
  display: grid;
  grid-template-columns: clamp(220px,22vw,300px) minmax(0, 1fr) 34px;
  gap: 32px;
  padding: 34px 0;
  border-top: 1px solid #9bb0c944;
  align-items: start;
}
.insight-card .cms-thumb {
  width: 100%;
  aspect-ratio: 16/9;
  height: auto;
  object-fit: contain;
  background: #dfe8f2;
  border-radius: 8px;
}
.insight-card h3 {
  font-size: clamp(21px, 1.8vw, 30px);
  line-height: 1.5;
  margin: 12px 0;
  font-weight: 550;
}
.insight-card p {
  font-size: 16px;
  line-height: 1.9;
  color: #71869b;
  max-width: 1000px;
}
.insight-card .category {
  font-size: 13px;
  color: #7d91aa;
}
.insight-card .arrow {
  font-size: 27px;
  transition: transform .25s;
}
.insight-card:hover .arrow {
  transform: translate(3px, -3px);
}
.insight-index {
  font-size: 42px;
  color: #6682a4;
}
.cms-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  margin-top: 44px;
}
.cms-pagination .button {
  padding: 10px 20px;
}
.page-number {
  min-width: 42px;
  min-height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid #a2b5cd;
  border-radius: 6px;
}
.page-number[aria-current] {
  background: #075bd8;
  border-color: #075bd8;
  color: white;
}
.page-count {
  font-size: 13px;
  color: #667f98;
}
.category-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding-block: 24px;
}
.category-nav a {
  border: 1px solid #b9c9db;
  border-radius: 30px;
  padding: 9px 18px;
  font-size: 14px;
}
.category-nav a:hover {
  background: #dce8f8;
}
.breadcrumbs {
  padding-top: 35px;
  font-size: 13px;
  color: #5e7793;
}
.breadcrumbs + article {
  padding-top: 45px;
}
.portfolio-grid,
.official-case-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 50px 32px;
}
.portfolio-card,
.official-case-card {
  min-width: 0;
  display: block;
}
.portfolio-art {
  overflow: hidden;
  border-radius: 12px;
  background: #e0e8f1;
  aspect-ratio: 1.3;
}
.portfolio-meta {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  margin: 20px 0 12px;
  font-size: 12px;
  color: #7e92aa;
}
.portfolio-card h3,
.official-case-card h3 {
  font-size: clamp(21px, 1.7vw, 30px);
  line-height: 1.5;
  font-weight: 550;
}
.portfolio-card p,
.official-case-card p {
  font-size: 15px;
  line-height: 1.9;
  color: #738ba3;
  margin-top: 12px;
}
.portfolio-direction {
  display: block;
  font-size: 12px;
  margin-top: 18px;
  color: #698cb8;
}
.case-category-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.case-category-tabs button {
  padding: 12px 24px;
  border: 1px solid #b6c8dc;
  border-radius: 30px;
  background: transparent;
  color: #224567;
  font: inherit;
  cursor: pointer;
}
.case-category-tabs button[aria-selected=true] {
  background: #075ce0;
  border-color: #075ce0;
  color: white;
}
.case-category-intro {
  padding: 35px 0;
}
.case-category-intro h2 {
  font-size: 28px;
}
.case-category-intro p {
  max-width: 860px;
  margin-top: 14px;
  font-size: 15px;
  line-height: 1.9;
  color: #637c95;
}
.official-case-art {
  aspect-ratio: 1.5;
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: white;
  background: #09243b;
}
.official-case-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .6;
}
.official-case-art > *:not(img) {
  position: relative;
}
.official-case-tag,
.official-case-focus {
  font-size: 14px;
}
.official-metric strong {
  font-size: clamp(36px, 4vw, 64px);
  display: block;
  line-height: 1.3;
}
.official-metric span {
  display: block;
  margin-top: 8px;
}
.official-case-lines {
  display: none;
}
.case-study,
.cms-article {
  padding-block: 90px;
}
.case-study-head {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 60px;
  align-items: end;
  margin-bottom: 45px;
}
.case-deck {
  font-size: 18px;
  line-height: 1.9;
  color: #5b738f;
}
.case-study-meta,
.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 13px;
  color: #7189a2;
  margin-top: 22px;
}
.case-study-stage {
  border-radius: 14px;
  overflow: hidden;
}
.case-study-concept {
  font-size: 13px;
  color: #637a93;
  margin-top: 15px;
}
.cms-article {
  max-width: 960px;
}
.cms-article > header {
  margin-bottom: 45px;
}
.cms-article .intro-lead {
  font-size: 18px;
  line-height: 1.9;
  margin-top: 26px;
  color: #58748e;
}
.cms-article-cover {
  width: 100%;
  height: auto;
  max-height: 540px;
  object-fit: contain;
  margin-bottom: 40px;
  border-radius: 10px;
}
.article-body {
  max-width: 850px;
  margin: 50px auto;
  font-size: 17px;
  line-height: 1.95;
  color: #304e68;
  overflow-wrap: anywhere;
}
.article-body p {
  margin: 1em 0;
}
.article-body h2 {
  font-size: 28px;
  margin: 1.8em 0 .8em;
  line-height: 1.5;
  color: #132f4d;
}
.article-body h3 {
  font-size: 22px;
  line-height: 1.5;
  margin: 1.5em 0 .6em;
}
.article-body ul,
.article-body ol {
  padding-left: 1.5em;
}
.article-body a,
.cms-source a {
  color: #0958bb;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.article-end,
.cms-source {
  margin: 30px 0;
  font-size: 15px;
  line-height: 1.9;
}
.article-end {
  padding-top: 30px;
  border-top: 1px solid #bdcede;
}
.case-service-next,
.official-contact,
.related-service {
  padding: 36px;
  background: #e1eaf5;
  border-radius: 12px;
  margin-top: 50px;
}
.case-service-next h2,
.official-contact h2,
.related-service h2 {
  font-size: 27px;
}
.case-service-next p,
.official-contact p {
  margin: 15px 0 24px;
  color: #59738d;
}
.official-detail-photo img {
  width: 100%;
  max-height: 620px;
  object-fit: cover;
  border-radius: 14px;
}
.official-case-banner {
  padding: 40px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
  align-items: center;
}
.official-case-banner strong {
  font-size: 44px;
}
.text-link {
  display: inline-block;
  color: #0962cb;
  border-bottom: 1px solid;
  padding-bottom: 6px;
}
.cms-preview-note {
  padding: 15px;
  background: #fff2cf;
  color: #764b00;
  margin-bottom: 30px;
}
.cms-cover {
  height: 100%;
}
.cms-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.view-insights:not(.cms-view) .section {
  padding-block: 70px;
}
.view-insights .page-intro {
  padding-top: 180px;
  padding-bottom: 35px;
}
.view-insights .page-intro h1 {
  font-size: 42px;
}
.view-insights .article {
  font-size: 17px;
  line-height: 1.9;
}
.view-insights .article h2 {
  font-size: 26px;
  margin: 32px 0 15px;
}
.view-insights .article p {
  margin: 16px 0;
}
.view-insights .article ul {
  padding-left: 22px;
}
.view-insights .article a {
  color: #075bd8;
}
.fanfan-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.fanfan-grid img {
  height: auto;
}
.feature-grid.four {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 60px;
}
.office-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 60px;
}
.office-grid article {
  padding: 35px;
  border-top: 1px solid #becddd;
}
.office-grid address {
  font-style: normal;
  font-size: 16px;
  line-height: 1.9;
  margin-top: 15px;
}
.team-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
  margin-top: 50px;
}
.team-gallery img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 10px;
}
.team-gallery figcaption {
  font-size: 14px;
  margin-top: 14px;
  color: #627b94;
}
.partner-band {
  padding-block: 80px;
  background: #eff3f8;
  color: #18334f;
}
.partner-band h2 {
  font-size: clamp(28px, 3vw, 44px);
  margin-bottom: 36px;
}


.hero {
  isolation: isolate;
}
.hero .wrap,
.hero-content {
  position: relative;
  z-index: 2;
}
.light-land {
  position: relative;
  z-index: 1;
}
.light-land:before {
  pointer-events: none;
}

.footer {
  background: #071a38;
}
.report-zoom {
  display: block;
}
.dashboard-section figure img {
  width: 100%;
  height: auto;
}
.view-contact .footer-top {
  grid-template-columns: 1fr;
}
.view-contact .footer-top > .qr-grid {
  display: none;
}
.page-index .light-land {
  border-radius: 0;
}
.partner-band {
  padding-bottom: 100px;
}


.footer.wrap {
  width: 100%;
  padding-inline: max(var(--gutter), calc((100% - 1440px)/2));
  margin: 0;
}

.page-about #main > section:last-child {
  max-width: none;
  background: #eff3f8;
  color: #15334e;
  width: 100%;
  padding-inline: max(var(--gutter), calc((100% - 1440px)/2));
}
.page-about .light-land {
  border-radius: 0;
}
.page-about #main {
  background: #eff3f8;
}
@media (max-width: 1100px) {
  .portfolio-intro,
  .case-study-head {
    gap: 30px;
  }
  
  .feature-grid.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .insight-card {
    grid-template-columns: 200px minmax(0, 1fr) 24px;
    gap: 22px;
  }
  .insight-card .cms-thumb {
    width: 100%;
  }
  .fanfan-grid {
    gap: 20px;
  }
}
@media (max-width: 760px) {
  .service-menu {
    display: none;
  }
  .mobile-services {
    display: grid;
  }
  .cms-view .cms-list-intro,
  .portfolio-intro {
    padding-top: 50px;
    padding-bottom: 40px;
  }
  .cms-view .section {
    padding-block: 45px;
  }
  .portfolio-intro,
  .case-study-head {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .portfolio-grid,
  .official-case-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .cms-list-intro h1,
  .portfolio-intro h1,
  .case-study h1,
  .cms-article h1 {
    font-size: 32px;
  }
  .insight-card {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    padding: 25px 0;
  }
  .insight-card .cms-thumb {
    width: 100%; max-width: 420px;
  }
  .insight-card h3 {
    font-size: 20px;
  }
  .insight-card p {
    font-size: 14px;
    grid-column: 1/-1;
  }
  .insight-card .arrow {
    display: none;
  }
  .insight-card .category {
    font-size: 11px;
  }
  .insight-index {
    font-size: 28px;
  }
  .cms-pagination {
    gap: 8px;
  }
  .page-number {
    min-width: 36px;
    min-height: 36px;
  }
  .case-study,
  .cms-article {
    padding-block: 50px;
  }
  .cms-article .intro-lead,
  .case-deck {
    font-size: 16px;
  }
  .article-body {
    font-size: 16px;
    margin: 35px auto;
  }
  .article-body h2 {
    font-size: 25px;
  }
  .article-body h3 {
    font-size: 21px;
  }
  .case-service-next,
  .official-contact,
  .related-service {
    padding: 24px;
  }
  .fanfan-grid {
    grid-template-columns: 1fr;
  }
  .fanfan-grid article {
    max-width: 400px;
    margin: auto;
  }
  .feature-grid.four {
    grid-template-columns: 1fr;
  }
  
  
  .office-grid,
  .team-gallery {
    grid-template-columns: 1fr;
  }
  .team-gallery {
    gap: 30px;
  }
  .office-grid article {
    padding: 25px 0;
  }
  .official-case-art {
    padding: 24px;
  }
  .cms-view #main {
    padding-bottom: 50px;
  }
  .appointment-form label,
  .appointment-form fieldset label {
    font-size: 14px;
  }
  .appointment-form .consent {
    font-size: 12px;
  }
}

/* Continuous full-width section edges; centered final logo row. */
.light-land { border-radius: 0; }


.page-contact .footer .phone { display: none; }

/* Ocean rhythm: clear curved edges, shared endpoint colors, no blur on content. */
.home-hero { background-color: #0b2143; }
.home-hero:after { background: linear-gradient(transparent, #0b2143); }
.page-index .light-land { background: var(--paper); padding-top: 35px; }
.page-index .light-land .space:first-child { padding-top: 65px; }
.sea-edge { position:absolute; bottom:-1px; left:0; width:100%; height:clamp(72px,7vw,145px); overflow:hidden; pointer-events:none; z-index:4; color:var(--paper); }
.sea-edge svg { width:100%; height:100%; display:block; }
.sea-edge g { fill:currentColor; animation:sea-drift 26s linear infinite; }
.sea-edge g:first-child { opacity:.14; animation-duration:34s; }
.sea-edge g:nth-child(2) { opacity:.32; animation-duration:29s; animation-direction:reverse; }
.sea-edge-top { top:-1px; bottom:auto; transform:rotate(180deg); }
@keyframes sea-drift { to { transform:translateX(-1440px); } }
.intelligence-stage { margin-top:0; padding-top:90px; background:linear-gradient(#0b2143, var(--deep)); }
.world-end { background:linear-gradient(var(--deep), #071a38); }
.world-end .world-word { mask-image:linear-gradient(#000,transparent 90%); }
.footer { background:#071a38; }
.end-copy > p:not(.eyebrow) { max-width:660px; line-height:1.85; }
.footer-bottom { flex-wrap:wrap; line-height:1.9; gap:18px 30px; }
.footer .qr-grid { max-width:760px; }
.page-index .insight-card p { color:#b2c3d7; }
.page-index .insight-card .category { color:#99b0cc; }
.partner-band { overflow:hidden; padding-block:65px 90px; }
.partner-band h2 { text-align:center; }
.partner-marquee { --logo-width:clamp(180px,17vw,260px); overflow:hidden; margin-top:18px; mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); }
.partner-track { display:flex; width:max-content; animation:brand-drift 45s linear infinite; }
.partner-marquee:nth-of-type(3) .partner-track { animation-direction:reverse; animation-duration:48s; }
.partner-group { display:flex; gap:18px; padding-right:18px; flex-shrink:0; }
.partner-group img { width:var(--logo-width); height:110px; object-fit:contain; padding:24px; background:#fff; border-radius:10px; }
.partner-marquee:hover .partner-track,.partner-marquee:focus .partner-track { animation-play-state:paused; }
@keyframes brand-drift { to { transform:translateX(-50%); } }
.header { transition:background .25s,color .25s; }
.header > a:first-child { display:grid; flex-shrink:0; }
.header > a:first-child img { grid-area:1/1; transition:opacity .25s; }
.header .logo-default { filter:brightness(0) invert(1); }
.header.header-light .logo-default { filter:none; }
.header .logo-color { opacity:0; }
.header:has(.service-menu[open]) { background:#fff; color:var(--ink); border-color:#dbe4ef; }
.header:has(.service-menu[open]) .logo-default { opacity:0; }
.header:has(.service-menu[open]) .logo-color { opacity:1; }
.service-menu > .service-panel { position:absolute; top:calc(100% - 1px); left:var(--gutter); right:var(--gutter); display:grid; grid-template-columns:1.05fr repeat(3,1fr); gap:0; padding:24px; background:#fff; color:var(--ink); border-radius:0 0 18px 18px; box-shadow:0 24px 50px #020c2425; border:1px solid #e3eaf2; }
.service-panel > * { min-width:0; }
.service-overview { padding:24px; background:#f0f4f8; border-radius:8px; }
.service-panel small { display:block; font-size:14px; color:#62778e; margin-bottom:16px; }
.service-panel strong { display:block; font-size:clamp(18px,1.5vw,24px); line-height:1.5; }
.header .service-panel a { padding:24px; }
.service-panel p { font-size:15px; line-height:1.85; margin-top:18px; color:#62778e; }
.service-panel-card span { display:block; color:#145bd2; font-size:15px; margin-top:22px; }
.service-panel-card:hover { background:#f3f7fb; border-radius:8px; }
.header .service-overview a { padding:20px 0 0; color:#b74407; font-size:15px; }
.service-panel-foot { grid-column:1/-1; display:flex; justify-content:space-between; border-top:1px solid #e3eaf2; margin-top:20px; }
.header .service-panel-foot a { padding:18px 16px 0; font-size:15px; }
.floating-consult { transition:transform .25s,box-shadow .25s; transform-origin:right bottom; }
.floating-consult svg { width:28px; height:28px; }
.floating-consult:hover,.floating-consult:focus-visible { transform:scale(1.08); box-shadow:0 14px 40px #0005; }
.more-contact h3 { font-size:18px; margin-bottom:24px; }
@media (hover:hover) and (pointer:fine) {
 .header:hover { background:#fff; color:var(--ink); border-color:#dbe4ef; }
 .header:hover .logo-default { opacity:0; }
 .header:hover .logo-color { opacity:1; }
}
@media (min-width:1800px) {
 .wrap { max-width:1640px; width:calc(100% - var(--gutter)*2); }
 .footer.wrap { max-width:none; padding-inline:max(var(--gutter),calc((100% - 1640px)/2)); }
 .header nav { font-size:18px; }
 .section-heading > p { font-size:20px; }
 .footer p { font-size:17px; }
}
@media (max-width:760px) {
 .page-index .light-land { padding-top:0; }
 .page-index .light-land .space:first-child { padding-top:55px; }
 .intelligence-stage { padding-top:65px; }
 .button { font-size:16px; }
 .end-copy > p:not(.eyebrow) { font-size:17px; max-width:32em; }
 .partner-band { padding-block:40px 65px; }
 .partner-marquee { --logo-width:175px; }
 .partner-group img { height:90px; padding:20px; }
 .partner-track { animation-duration:32s; }
 .footer-bottom { font-size:14px; }
 .footer-bottom > span:first-child { flex-basis:100%; }
 .insight-card .cms-thumb { width:100%; }
 .insight-card .category { font-size:14px; }
 .insight-card p { font-size:16px; }
 .service-menu > .service-panel { display:none; }
}
@media (prefers-reduced-motion:reduce) {
 .sea-edge g,.partner-track { animation:none; }
 .partner-marquee { overflow-x:auto; mask-image:none; }
 .partner-group[aria-hidden] { display:none; }
 .floating-consult:hover { transform:none; }
}

.service-icon { width:34px; height:34px; color:#1261df; display:block; margin-bottom:18px; }
.world-end > .sea-edge { display:none; }
:is(.page-about,.page-contact,.view-services,.view-fanfan,.cms-view,.view-insights,.view-work) .world-end > .sea-edge { display:block; }
:is(.page-about,.page-contact,.view-services,.view-fanfan,.cms-view,.view-insights,.view-work) .world-end { padding-top:70px; }
.js .sea-edge:not(.ambient-visible) g,.js .partner-marquee:not(.ambient-visible) .partner-track,.page-hidden .sea-edge g,.page-hidden .partner-track { animation-play-state:paused; }
@media (max-width:760px) { .sailing-visual { display:block; } .service-overview strong { font-size:20px; } }

/* Let the retained sail remain the visual focal point. */
.home-hero > canvas { opacity:.4; }
.home-hero .sailing-visual img { filter:saturate(.88) brightness(.82) contrast(1.08); }

/* Viewport-sized opening. Min-height preserves content at accessibility zoom. */
:root { --hero-gutter:clamp(24px,7vw,280px); }
.home-hero .hero-content { width:calc(100% - var(--hero-gutter)*2); max-width:2560px; }
.header { padding-inline:max(var(--hero-gutter),calc((100% - 2560px)/2)); }
.home-hero .hero-bottom .button { flex-shrink:0; font-size:clamp(17px,1vw,24px); padding:clamp(17px,1.3vw,26px) clamp(28px,2vw,48px); }
/* The first viewport stays blue; the transition begins only after scrolling. */
.home-ocean-edge { position:relative; height:clamp(56px,10vh,160px); height:clamp(56px,10dvh,160px); background:#0b2143; }
.home-ocean-edge > .sea-edge { height:100%; }
@media (min-width:1800px) {
 .header .logo { width:clamp(210px,10vw,300px); }
 .header { height:clamp(108px,9vh,156px); }
 .header nav,.header-cta { font-size:clamp(18px,.9vw,24px); }
}
@media (max-width:760px) {
 :root { --hero-gutter:24px; }
 .home-hero .hero-bottom .button { font-size:16px; padding:14px 26px; }
}
/* Short desktop windows / landscape: fit the message above the wave. */
@media (max-height:650px) and (min-width:761px), (orientation:landscape) and (max-height:500px) {
 .header { height:76px; }
 .home-hero { align-items:center; }
 .home-hero .hero-content { padding-block:96px 68px; }
 .home-hero h1 { font-size:clamp(32px,min(6.2vw,10vh),68px); width:100%; line-height:1.1; }
 .home-hero h1 .line:first-child { font-size:.58em; line-height:1.4; margin-bottom:8px; }
 .home-hero .hero-bottom { display:flex; flex-wrap:wrap; gap:16px 28px; margin-top:20px; }
 .home-hero .hero-bottom p { font-size:16px; line-height:1.7; max-width:24em; }
 .home-hero .hero-bottom .button { font-size:16px; padding:14px 24px; margin-top:0; }
 .home-hero .sailing-visual { top:0; bottom:auto; height:100%; }
}