/*
 * Final-design archive/detail/legal rules.
 * Loaded after n6.css so the measured Figma values remain the final cascade.
 */

@media (min-width: 1101px) {
  .n6-archive-container,
  .n6-detail-container {
    grid-template-columns: 1080px 304px;
    width: 1497px;
    max-width: calc(100% - var(--n6-page-inline));
    margin-right: 0;
    margin-left: max(
      calc(var(--n6-page-inline) / 2),
      calc(
        (100% - var(--n6-content-archive)) / 2
        + (100vw - 100%) / 2
      )
    );
  }

  .n6-works-archive .n6-works-filters,
  .n6-works-detail .n6-works-filters {
    width: 1148px;
    max-width: none;
    margin-left: -37px;
  }

  .n6-column-archive .n6-column-list {
    margin-left: -37px;
  }
}

.n6-page-hero {
  min-height: 400px;
}

.n6-works-filters__head {
  margin-bottom: 0;
  padding-bottom: 35px;
}

.n6-works-filters__head h2 {
  font-size: 20px;
  font-weight: 400;
}

.n6-works-filters__head > a {
  display: inline-flex;
  width: 184px;
  min-width: 184px;
  height: 34px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  font-size: 17px;
}

.n6-filter-row {
  grid-template-columns: 165px minmax(0, 1fr);
  padding: 24px 0;
}

.n6-filter-row h3 {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
}

.n6-filter-row a,
.n6-content-archive .n6-card-tags span,
.n6-content-detail .n6-card-tags span,
.n6-related .n6-card-tags span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  font-size: 14px;
  line-height: 1;
}

.n6-filter-subgroup {
  grid-template-columns: 94px minmax(0, 1fr);
}

.n6-filter-subgroup h4 {
  font-size: 14px;
  font-weight: 400;
}

.n6-filter-subgroup + .n6-filter-subgroup {
  padding-top: 54px;
}

.n6-work-grid {
  row-gap: 115px;
}

.n6-column-list-card {
  grid-template-columns: 390px minmax(0, 1fr);
  gap: 63px;
}

.n6-column-list-card__meta {
  gap: 22px;
  margin-bottom: 18px !important;
  font-size: 20px;
  line-height: 1.35;
}

.n6-column-list-card__meta span {
  display: inline-flex;
  min-width: 95px;
  height: 30px;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
  font-size: 14px;
  line-height: 1;
}

.n6-column-list-card h2 {
  margin-bottom: 14px;
  font-size: 20px;
  line-height: 1.75;
}

.n6-column-list-card > div > p:last-child {
  max-width: 550px;
  font-size: 16px;
  line-height: 1.9375;
}

.n6-archive-main > .n6-contact-banner,
.n6-detail-main > .n6-contact-banner {
  width: min(100%, 1056px);
  margin-inline: auto;
}

.n6-contact-banner h2 {
  display: flex;
  width: min(100%, 550px);
  height: 65px;
  margin-inline: auto;
  align-items: center;
  justify-content: center;
  line-height: 1.2667;
}

.n6-contact-banner {
  height: 358px;
  min-height: 358px;
  padding: 44px 35px 0;
  place-content: start center;
}

.n6-contact-banner p {
  width: min(100%, 528px);
  margin-top: 35px;
  margin-inline: auto;
  line-height: 1.3;
}

.n6-contact-banner .n6-button {
  width: min(100%, 326px);
  height: 64px;
  margin-top: 39px;
  margin-right: auto;
  margin-left: auto;
}

.n6-archive-main > .n6-contact-banner {
  margin-right: auto;
  margin-left: 0;
}

.n6-works-archive .n6-pagination {
  margin: 96px 0 80px;
}

.n6-column-archive .n6-pagination {
  margin: 85px 0 80px;
}

.n6-works-archive .n6-works-filters {
  margin-bottom: 106px;
}

.n6-case,
.n6-column-entry {
  width: min(100%, 1056px);
  margin-inline: auto;
}

.n6-case > h1,
.n6-column-entry > h1 {
  font-size: 30px;
  font-weight: 400;
  line-height: 1.55;
}

.n6-case__main-image,
.n6-column-entry__image {
  width: min(100%, 857px);
  aspect-ratio: 857 / 502;
  margin: 35px auto 58px;
}

.n6-case__summary section {
  grid-template-columns: 245px minmax(0, 1fr);
  gap: 55px;
}

.n6-case__summary p,
.n6-content-detail .n6-entry-content p,
.n6-content-detail .n6-entry-content li {
  font-size: 16px;
  line-height: 1.6;
}

.n6-content-detail .n6-entry-content h2 {
  font-size: 20px;
}

.n6-content-detail .n6-entry-content h3,
.n6-content-detail .n6-entry-content h4 {
  font-size: 18px;
}

.n6-entry-nav {
  width: min(100%, 1056px);
  margin: 65px auto;
}

.n6-related .n6-subcontainer {
  width: min(calc(100% - var(--n6-page-inline)), 1500px);
}

.n6-related-grid {
  gap: 45px;
}

.n6-related .n6-archive-card__image {
  aspect-ratio: 47 / 32;
}

.n6-related .n6-archive-card h2 {
  font-size: 20px;
}

.n6-legal {
  padding: 109px 0 0;
}

.n6-legal__inner section + section {
  margin-top: 75px;
}

.n6-legal h2 {
  margin-bottom: 19px;
  font-size: 20px;
  line-height: 1.55;
}

.n6-legal p,
.n6-legal li {
  font-size: 16px;
  line-height: 1.6;
}

.n6-sitemap {
  min-height: 0;
  padding: 80px 0 0;
}

.n6-sitemap h2 {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.55;
}

.n6-sitemap section > div {
  grid-template-columns: repeat(3, 200px);
  column-gap: 161px;
  row-gap: 25px;
}

.n6-sitemap a {
  font-size: 16px;
  line-height: 1.7;
}

.n6-sitemap-page .n6-wide-links--subpage {
  margin-top: 86px;
}

.n6-privacy-page .n6-wide-links--subpage {
  margin-top: 129px;
}

@media (min-width: 768px) {
  .n6-legal__inner,
  .n6-sitemap__inner {
    position: relative;
    left: calc((100vw - 100%) / 2);
  }
}

@media (max-width: 767px) {
  .n6-page-hero {
    min-height: 300px;
  }

  .n6-works-filters__head {
    gap: 16px;
    padding-bottom: 18px;
  }

  .n6-works-filters__head h2 {
    font-size: 16px;
  }

  .n6-works-filters__head > a {
    width: auto;
    min-width: 135px;
    height: 32px;
    padding-inline: 12px;
    font-size: 12px;
  }

  .n6-filter-row {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 18px 0;
  }

  .n6-filter-row h3 {
    font-size: 14px;
  }

  .n6-filter-row a,
  .n6-content-archive .n6-card-tags span,
  .n6-content-detail .n6-card-tags span,
  .n6-related .n6-card-tags span {
    min-height: 26px;
    padding-inline: 11px;
    font-size: 11px;
  }

  .n6-filter-subgroup {
    grid-template-columns: 1fr;
  }

  .n6-filter-subgroup + .n6-filter-subgroup {
    padding-top: 10px;
  }

  .n6-filter-subgroup h4 {
    font-size: 12px;
  }

  .n6-column-list-card {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .n6-contact-banner {
    height: auto;
    min-height: 0;
    padding: 50px 22px;
    place-content: center;
  }

  .n6-contact-banner h2 {
    height: auto;
    min-height: 0;
  }

  .n6-contact-banner .n6-button {
    height: auto;
    min-height: 58px;
  }

  .n6-work-grid {
    row-gap: 65px;
  }

  .n6-works-archive .n6-works-filters {
    margin-bottom: 65px;
  }

  .n6-works-archive .n6-pagination,
  .n6-column-archive .n6-pagination {
    margin: 75px 0 85px;
  }

  .n6-column-list-card__meta {
    font-size: 14px;
  }

  .n6-column-list-card__meta span {
    min-width: 0;
    height: 27px;
    padding-inline: 12px;
    font-size: 12px;
  }

  .n6-column-list-card h2 {
    font-size: 19px;
    line-height: 1.6;
  }

  .n6-column-list-card > div > p:last-child {
    font-size: 14px;
    line-height: 1.8;
  }

  .n6-case > h1,
  .n6-column-entry > h1 {
    font-size: 24px;
  }

  .n6-case__main-image,
  .n6-column-entry__image {
    width: 100%;
    aspect-ratio: 16 / 10;
  }

  .n6-case__summary section {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .n6-case__summary p,
  .n6-content-detail .n6-entry-content p,
  .n6-content-detail .n6-entry-content li {
    font-size: 14px;
    line-height: 1.85;
  }

  .n6-related .n6-subcontainer {
    width: calc(100% - var(--n6-page-inline));
  }

  .n6-related-grid {
    gap: 45px;
  }

  .n6-legal {
    padding-top: var(--n6-section-space-mobile);
  }

  .n6-legal__inner section + section {
    margin-top: 52px;
  }

  .n6-legal h2 {
    margin-bottom: 14px;
    font-size: 18px;
    line-height: 1.6;
  }

  .n6-legal p,
  .n6-legal li {
    font-size: 14px;
    line-height: 1.8;
  }

  .n6-sitemap {
    padding-top: var(--n6-section-space-mobile);
  }

  .n6-sitemap section > div {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .n6-sitemap-page .n6-wide-links--subpage,
  .n6-privacy-page .n6-wide-links--subpage {
    margin-top: 75px;
  }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .n6-flow-cards > div:nth-child(4n):not(:last-child)::after {
    display: none;
  }
}

/* ------------------------------------------------------------
 * Mobile lower-page polish
 * Preserve the desktop design and content while improving mobile rhythm.
 * ------------------------------------------------------------ */

@media (max-width: 767px) {
  .n6-subpage {
    --n6-section-space-mobile: 68px;
    overflow-wrap: anywhere;
  }

  .n6-subpage h2,
  .n6-subpage h3,
  .n6-contact-banner h2 {
    text-wrap: balance;
  }

  .n6-subpage h2,
  .n6-subpage h3,
  .n6-subpage p,
  .n6-subpage li {
    word-break: auto-phrase;
  }

  .n6-section-nav {
    gap: 18px;
    min-height: 60px;
    padding: 10px 2px 12px;
    scroll-padding-inline: 2px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
  }

  .n6-section-nav::-webkit-scrollbar {
    display: none;
  }

  .n6-section-nav a {
    min-height: 36px;
    scroll-snap-align: start;
  }

  .n6-service-page .n6-subsection-head h2,
  .n6-company-page .n6-subsection-head h2 {
    margin-bottom: 24px;
    font-size: 22px;
    line-height: 1.5;
  }

  .n6-service-page .n6-subsection-head p,
  .n6-company-page .n6-subsection-head p {
    font-size: 14px;
    line-height: 1.85;
  }

  .n6-service-intro .n6-subsection-head {
    margin-bottom: 64px;
  }

  .n6-service-list {
    gap: 68px;
  }

  .n6-service-row {
    gap: 24px;
  }

  .n6-service-row__body h3 {
    font-size: 22px;
    line-height: 1.5;
  }

  .n6-service-row__body > p:not(.n6-service-row__kicker) {
    font-size: 14px;
    line-height: 1.85;
  }

  .n6-service-page .n6-strength-detail-list {
    gap: 28px;
  }

  .n6-service-page .n6-strength-detail {
    padding: 28px 20px 22px;
  }

  .n6-service-page .n6-strength-detail > h3 {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.55;
  }

  .n6-service-page .n6-strength-detail__columns > div {
    min-height: 0;
    padding: 22px 20px;
  }

  .n6-service-page .n6-strength-detail__columns .n6-strength-detail__quote {
    font-size: 17px;
    line-height: 1.7;
  }

  .n6-flow-page .n6-subsection-head {
    margin-bottom: 48px;
  }

  .n6-flow-group {
    row-gap: 32px;
  }

  .n6-flow-group + .n6-flow-group {
    margin-top: 70px;
  }

  .n6-flow-cards,
  .n6-flow-cards--nine {
    gap: 10px;
  }

  .n6-flow-cards > div {
    min-height: 168px;
    padding: 18px 10px;
  }

  .n6-flow-cards strong {
    font-size: 28px;
  }

  .n6-flow-cards span {
    margin-top: 12px;
    font-size: 13px;
    line-height: 1.6;
  }

  .n6-table-wrap {
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .n6-faq-list summary {
    min-height: 64px;
    padding-block: 18px;
    font-size: 15px;
    line-height: 1.6;
  }

  .n6-faq-list details[open] > div p {
    font-size: 14px;
    line-height: 1.85;
  }

  .n6-philosophy-grid article {
    padding: 26px 23px;
  }

  .n6-philosophy-grid article > span {
    font-size: 46px;
  }

  .n6-philosophy-grid h3 {
    font-size: 19px;
    line-height: 1.65;
  }

  .n6-machine-grid {
    gap: 38px;
  }

  .n6-machine-grid h3 {
    margin-top: 14px;
    font-size: 16px;
    line-height: 1.65;
  }

  .n6-company-profile th,
  .n6-company-profile td {
    padding-inline: 0;
  }

  .n6-company-profile th {
    padding-top: 17px;
    font-size: 13px;
  }

  .n6-company-profile td {
    padding-bottom: 17px;
    font-size: 14px;
    line-height: 1.8;
  }

  .n6-content-archive,
  .n6-content-detail {
    padding-top: 64px;
  }

  .n6-content-detail {
    padding-bottom: 82px;
  }

  .n6-works-filters {
    margin-bottom: 56px;
  }

  .n6-works-filters__head {
    gap: 12px;
    padding-bottom: 14px;
  }

  .n6-works-filters__head > a {
    min-width: 128px;
  }

  .n6-filter-row {
    gap: 9px;
    padding: 14px 0;
  }

  .n6-filter-row a,
  .n6-content-archive .n6-card-tags span,
  .n6-content-detail .n6-card-tags span,
  .n6-related .n6-card-tags span {
    min-height: 28px;
    padding-inline: 10px;
    line-height: 1.35;
  }

  .n6-work-grid {
    row-gap: 56px;
  }

  .n6-column-list {
    gap: 48px;
  }

  .n6-column-list-card {
    gap: 20px;
  }

  .n6-column-list-card h2 {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 1.55;
  }

  .n6-column-list-card > div > p:last-child {
    font-size: 14px;
    line-height: 1.75;
  }

  .n6-works-archive .n6-pagination,
  .n6-column-archive .n6-pagination {
    margin: 64px 0 72px;
  }

  .n6-contact-banner {
    padding: 44px 20px;
  }

  .n6-contact-banner h2 {
    font-size: 22px;
    line-height: 1.5;
  }

  .n6-contact-banner p {
    margin-top: 18px;
    font-size: 14px;
    line-height: 1.65;
  }

  .n6-contact-banner .n6-button {
    min-height: 54px;
    margin-top: 28px;
  }

  .n6-case > h1,
  .n6-column-entry > h1 {
    font-size: 23px;
    line-height: 1.55;
    text-wrap: balance;
  }

  .n6-case__main-image,
  .n6-column-entry__image {
    margin: 28px 0 42px;
  }

  .n6-case__summary {
    gap: 30px;
    margin-bottom: 58px;
  }

  .n6-entry-content h2 {
    font-size: 19px;
    line-height: 1.65;
  }

  .n6-entry-content h3 {
    font-size: 17px;
    line-height: 1.65;
  }

  .n6-customer-voice {
    margin-top: 58px;
    padding: 28px 22px;
  }

  .n6-contact-content {
    padding: 68px 0;
  }

  .n6-contact-page .n6-contact-lead {
    margin-bottom: 56px;
    font-size: 14px;
    line-height: 1.85;
  }

  .n6-contact-page .n6-contact-form {
    padding: 32px 18px 40px;
  }

  .n6-legal {
    padding: 68px 0 90px;
  }

  .n6-legal__inner section + section {
    margin-top: 44px;
  }

  .n6-legal h2 {
    font-size: 18px;
    line-height: 1.55;
  }

  .n6-legal p,
  .n6-legal li {
    font-size: 14px;
    line-height: 1.85;
  }

  .n6-sitemap {
    padding-top: 68px;
  }

  .n6-sitemap__inner section + section {
    margin-top: 46px;
  }

  .n6-sitemap a {
    min-height: 42px;
    align-items: center;
  }

  .n6-error {
    min-height: 0;
    padding: 68px 0 84px;
  }

  .n6-error > div {
    width: calc(100% - 30px);
    margin-inline: auto;
  }

  .n6-error h2 {
    font-size: 27px;
    line-height: 1.55;
  }

  .n6-error p {
    max-width: 340px;
    margin: 18px auto 0;
    font-size: 14px;
    line-height: 1.85;
    text-wrap: pretty;
  }

  .n6-error__buttons {
    gap: 14px;
    margin-top: 36px;
  }

  .n6-error__buttons .n6-button {
    width: min(100%, 260px);
  }

  .n6-wide-links--subpage {
    gap: 12px;
    margin-top: 68px;
    padding-inline: 15px;
  }

  .n6-wide-links--subpage span {
    bottom: 28px;
    left: 24px;
  }

  .n6-body:not(.home) .n6-footer {
    padding-top: 54px;
  }

  .n6-body:not(.home) .n6-footer address {
    margin-top: 26px;
  }

  .n6-body:not(.home) .n6-footer__nav {
    padding-top: 32px;
  }
}

/* ------------------------------------------------------------
 * Responsive integrity: tablet, small desktop and fluid archives
 * ------------------------------------------------------------ */

@media (min-width: 1101px) and (max-width: 1599px) {
  .n6-archive-container,
  .n6-detail-container {
    grid-template-columns: minmax(0, 1fr) clamp(260px, 20vw, 304px);
    gap: clamp(45px, 6vw, 80px);
    width: min(calc(100% - var(--n6-page-inline)), 1497px);
    max-width: none;
    margin-inline: auto;
  }

  .n6-works-archive .n6-works-filters,
  .n6-works-detail .n6-works-filters {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }

  .n6-column-archive .n6-column-list {
    margin-left: 0;
  }

  .n6-column-list-card {
    grid-template-columns: clamp(270px, 36%, 390px) minmax(0, 1fr);
    gap: clamp(32px, 4vw, 55px);
  }
}

@media (min-width: 768px) and (max-width: 1100px) {
  .n6-archive-container,
  .n6-detail-container {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .n6-content-sidebar {
    display: none;
  }

  .n6-column-list-card {
    grid-template-columns: clamp(240px, 38%, 360px) minmax(0, 1fr);
    gap: 32px;
  }

  .n6-service-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
  }

  .n6-service-row.is-reverse .n6-service-row__media {
    order: 0;
  }

  .n6-service-row__media {
    width: min(100%, 680px);
    margin-inline: auto;
  }

  .n6-section-nav {
    scrollbar-width: none;
  }

  .n6-section-nav::-webkit-scrollbar {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .n6-company-page .n6-message .n6-subcontainer,
  .n6-company-page .n6-message .n6-subsection-head {
    width: calc(100% - var(--n6-page-inline));
    margin-inline: auto;
  }

  .n6-company-page .n6-message__grid {
    grid-template-areas:
      "portrait"
      "copy"
      "career";
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
  }

  .n6-company-page .n6-message__grid article {
    max-width: none;
    padding: 0;
  }

  .n6-company-page .n6-message__portrait {
    aspect-ratio: 16 / 9;
  }

  .n6-company-page .n6-message__career {
    width: 100%;
    margin: 0;
  }
}

/* ------------------------------------------------------------
 * Service taxonomy links
 * ------------------------------------------------------------ */

.n6-material-tags span,
.n6-material-tags a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 3px 14px;
  border: 1px solid var(--n6-green);
  border-radius: 999px;
  color: var(--n6-green);
  background: #fff;
  font-size: 14px;
  line-height: 20px;
  text-decoration: none;
}

.n6-material-tags a.is-filter-link {
  gap: 8px;
  transition:
    color .2s ease,
    background-color .2s ease,
    transform .2s ease;
}

.n6-material-tags a.is-filter-link::after {
  content: "→";
  font-size: .9em;
  line-height: 1;
}

.n6-material-tags a.is-filter-link:hover,
.n6-material-tags a.is-filter-link:focus-visible,
.n6-material-tags .is-active {
  color: #fff;
  background: var(--n6-green);
}

.n6-material-tags a.is-filter-link:hover {
  transform: translateY(-1px);
}

/* ------------------------------------------------------------
 * Migrated article readability
 * ------------------------------------------------------------ */

.n6-content-detail .n6-entry-content {
  width: min(100%, 860px);
  margin-inline: auto;
  color: #231814;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}

.n6-content-detail .n6-entry-content > p {
  margin: 0;
  font-size: 16px;
  line-height: 1.85;
}

.n6-content-detail .n6-entry-content > p + p {
  margin-top: .16em;
}

.n6-content-detail .n6-entry-content > p:empty {
  display: none;
}

.n6-content-detail .n6-entry-content > p:has(> strong:first-child):not(:has(> strong > u)) {
  margin-top: 42px;
  padding: 12px 17px;
  border-left: 4px solid var(--n6-aqua);
  color: var(--n6-green);
  background: #f3f7f6;
  font-size: 18px;
  line-height: 1.65;
}

.n6-content-detail .n6-entry-content > p:has(> strong:first-child):not(:has(> strong > u)) + p {
  margin-top: 16px;
}

.n6-content-detail .n6-entry-content > p:has(> strong > u) {
  margin-top: 0;
  padding: 0 24px;
  background: #eef5f3;
}

.n6-content-detail .n6-entry-content > p:not(:has(> strong > u)) + p:has(> strong > u),
.n6-content-detail .n6-entry-content > p:has(> strong > u):first-child {
  margin-top: 52px;
  padding-top: 24px;
  border-radius: 16px 16px 0 0;
  color: var(--n6-green);
  font-size: 17px;
}

.n6-content-detail .n6-entry-content > p:has(> strong > u):not(:has(+ p > strong > u)) {
  padding-bottom: 24px;
  border-radius: 0 0 16px 16px;
}

.n6-content-detail .n6-entry-content > p strong > u {
  text-decoration: none;
}

.n6-content-detail .n6-entry-content h2 {
  margin-top: 56px;
  line-height: 1.6;
}

.n6-content-detail .n6-entry-content h3 {
  margin-top: 44px;
  line-height: 1.65;
}

.n6-content-detail .n6-entry-content h4 {
  margin-top: 36px;
  line-height: 1.65;
}

.n6-content-detail .n6-entry-content ul,
.n6-content-detail .n6-entry-content ol {
  margin: 26px 0;
  padding-left: 1.5em;
}

.n6-content-detail .n6-entry-content li + li {
  margin-top: 7px;
}

.n6-content-detail .n6-entry-content a {
  color: var(--n6-green);
  text-decoration: underline;
  text-decoration-color: var(--n6-aqua);
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}

.n6-content-detail .n6-entry-content figure {
  width: min(100%, 860px);
  margin: 46px auto;
}

.n6-content-detail .n6-entry-content figure > div {
  display: contents;
}

.n6-content-detail .n6-entry-content figure img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 18px;
}

.n6-content-detail .n6-entry-content figcaption {
  margin-top: 10px;
  color: #66706e;
  font-size: 13px;
  line-height: 1.7;
  text-align: center;
}

.n6-content-detail .n6-entry-content blockquote {
  margin: 38px 0;
  padding: 22px 26px;
  border-left: 4px solid var(--n6-aqua);
  background: #f5f7f7;
}

.n6-content-detail .n6-entry-content table {
  width: 100%;
  margin: 34px 0;
  border-collapse: collapse;
}

.n6-content-detail .n6-entry-content th,
.n6-content-detail .n6-entry-content td {
  padding: 12px 14px;
  border: 1px solid #d8e1df;
  font-size: 14px;
  line-height: 1.7;
  text-align: left;
}

.n6-content-detail .n6-entry-content th {
  color: var(--n6-green);
  background: #eef5f3;
}

.n6-content-detail .n6-entry-content iframe,
.n6-content-detail .n6-entry-content video {
  width: 100%;
  max-width: 100%;
}

@media (max-width: 767px) {
  .n6-material-tags span,
  .n6-material-tags a {
    padding-inline: 10px;
    font-size: 12px;
  }

  .n6-works-detail .n6-detail-main {
    display: flex;
    flex-direction: column;
  }

  .n6-works-detail .n6-case {
    order: 1;
  }

  .n6-works-detail .n6-entry-nav {
    order: 2;
  }

  .n6-works-detail .n6-works-filters {
    order: 3;
    margin: 72px 0 0;
  }

  .n6-works-detail .n6-contact-banner {
    order: 4;
  }

  .n6-content-detail .n6-entry-content > p,
  .n6-content-detail .n6-entry-content li {
    font-size: 15px;
    line-height: 1.85;
  }

  .n6-content-detail .n6-entry-content > p:has(> strong:first-child):not(:has(> strong > u)) {
    margin-top: 34px;
    padding: 11px 13px;
    font-size: 16px;
    line-height: 1.65;
  }

  .n6-content-detail .n6-entry-content > p:has(> strong:first-child):not(:has(> strong > u)) + p {
    margin-top: 13px;
  }

  .n6-content-detail .n6-entry-content > p:has(> strong > u) {
    padding-inline: 17px;
  }

  .n6-content-detail .n6-entry-content > p:not(:has(> strong > u)) + p:has(> strong > u),
  .n6-content-detail .n6-entry-content > p:has(> strong > u):first-child {
    margin-top: 40px;
    padding-top: 20px;
    font-size: 16px;
  }

  .n6-content-detail .n6-entry-content > p:has(> strong > u):not(:has(+ p > strong > u)) {
    padding-bottom: 20px;
  }

  .n6-content-detail .n6-entry-content figure {
    margin-block: 36px;
  }

  .n6-content-detail .n6-entry-content figure img {
    border-radius: 14px;
  }

  .n6-content-detail .n6-entry-content blockquote {
    margin: 30px 0;
    padding: 18px;
  }

  .n6-content-detail .n6-entry-content table {
    display: block;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
}

/* ------------------------------------------------------------
 * Mobile consistency pass
 * Keep the desktop composition while making Japanese copy, cards and
 * controls behave consistently across 320–767px viewports.
 * ------------------------------------------------------------ */

@media (max-width: 767px) {
  .n6-home,
  .n6-subpage {
    overflow-wrap: break-word;
    line-break: strict;
  }

  .n6-home :where(h2, h3),
  .n6-subpage :where(h1, h2, h3),
  .n6-contact-banner h2 {
    overflow-wrap: break-word;
    word-break: auto-phrase;
    text-wrap: balance;
  }

  .n6-home :where(p, li),
  .n6-subpage :where(p, li),
  .n6-work-card h3,
  .n6-column-card h3,
  .n6-archive-card h2,
  .n6-column-list-card h2 {
    overflow-wrap: break-word;
    word-break: auto-phrase;
    text-wrap: pretty;
  }

  /* Desktop composition breaks should yield to the available mobile width. */
  .n6-home .n6-intro h2 br,
  .n6-service-page .n6-subsection-head p br,
  .n6-flow-group__description br,
  .n6-price-box > p br,
  .n6-price-box__closing br,
  .n6-materials-box > p br,
  .n6-materials-box section > p br {
    display: none;
  }

  .n6-home .n6-section-head__lead {
    max-width: 330px;
    margin-inline: auto;
    font-size: clamp(17px, 4.8vw, 19px);
    line-height: 1.55;
  }

  .n6-home .n6-section-head__text,
  .n6-service-card p,
  .n6-strength-card p {
    font-size: 15px;
    line-height: 1.8;
  }

  .n6-service-card h3,
  .n6-strength-card h3 {
    text-wrap: balance;
  }

  .n6-strength-card__body {
    padding-top: 32px;
  }

  .n6-work-card__tags span {
    font-size: 12px;
  }

  .n6-work-card h3 {
    line-height: 1.55;
  }

  .n6-home .n6-columns__list {
    gap: 38px;
  }

  .n6-column-card {
    grid-template-columns: 36% minmax(0, 1fr);
    gap: 18px;
  }

  .n6-column-card__image {
    aspect-ratio: 3 / 2;
  }

  .n6-column-card h3 {
    line-height: 1.6;
  }

  .n6-section-nav {
    padding-right: 24px;
    font-size: 12px;
    box-shadow: inset -20px 0 18px -22px rgba(27, 53, 49, .8);
  }

  .n6-section-nav a {
    font-size: 12px;
    white-space: nowrap;
  }

  .n6-service-page .n6-subsection-head p,
  .n6-company-page .n6-subsection-head p,
  .n6-service-row__body > p:not(.n6-service-row__kicker),
  .n6-service-page .n6-strength-detail__columns .n6-strength-detail__description,
  .n6-service-page .n6-strength-detail__solution li,
  .n6-flow-group__description,
  .n6-price-box > p,
  .n6-price-box__closing,
  .n6-materials-box > p,
  .n6-materials-box section > p,
  .n6-faq-list details[open] > div p,
  .n6-machine-grid p,
  .n6-company-page .n6-message__grid p,
  .n6-column-list-card > div > p:last-child,
  .n6-contact-page .n6-contact-lead,
  .n6-contact-banner p,
  .n6-legal p,
  .n6-legal li,
  .n6-error p {
    font-size: 15px;
    line-height: 1.85;
  }

  .n6-content-detail .n6-entry-content > p,
  .n6-content-detail .n6-entry-content li {
    font-size: 16px;
    line-height: 1.85;
  }

  .n6-contact-page .n6-contact-form input:not([type="radio"]):not([type="checkbox"]),
  .n6-contact-page .n6-contact-form textarea,
  .n6-contact-page .n6-contact-form select {
    font-size: 16px;
  }
}

/* ------------------------------------------------------------
 * Figma TOP corrections: hero copy spacing and Strength surface
 * ------------------------------------------------------------ */

@media (min-width: 1025px) {
  .n6-home .n6-hero__copy {
    top: 605px;
  }

  .n6-home .n6-hero__en {
    margin-bottom: 34px !important;
  }
}

@media (max-width: 1024px) {
  .n6-home .n6-hero__en {
    margin-bottom: 24px !important;
  }
}

.n6-home .n6-strengths {
  background: rgba(245, 245, 245, .88);
}

.n6-home .n6-strengths > .n6-display-label {
  left: 0;
  color: #d9d9d9;
  letter-spacing: .05em;
}

/* ------------------------------------------------------------
 * Page transition and long-form reading
 * ------------------------------------------------------------ */

body.n6-body {
  opacity: 1;
  animation: n6-page-enter .46s cubic-bezier(.22, 1, .36, 1) both;
}

body.n6-body.is-page-leaving {
  opacity: 0;
  animation: none;
  pointer-events: none;
  transition: opacity .22s ease;
}

@keyframes n6-page-enter {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.n6-content-detail .n6-entry-content .n6-scroll-reveal {
  opacity: 1;
  translate: none;
  scale: none;
  transition: none;
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  body.n6-body,
  body.n6-body.is-page-leaving {
    opacity: 1;
    animation: none;
    transition: none;
  }
}

/* ------------------------------------------------------------
 * Lower-page mobile refinements
 * ------------------------------------------------------------ */

@media (max-width: 767px) {
  .n6-body .n6-drawer__close {
    color: #fff;
  }

  .n6-body .n6-drawer__close span {
    background: #fff;
  }

  .n6-flow-cards,
  .n6-flow-cards--nine {
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .n6-flow-cards > div {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
    gap: 14px;
    min-height: 78px;
    padding: 12px 18px;
  }

  .n6-flow-cards strong {
    font-size: 32px;
    line-height: 1;
    text-align: center;
  }

  .n6-flow-cards span {
    margin-top: 0;
    font-size: 16px;
    line-height: 1.5;
    text-align: left;
  }

  .n6-materials-box > section:last-of-type .n6-material-tags {
    align-items: stretch;
  }

  .n6-materials-box > section:last-of-type .n6-material-tags > * {
    justify-content: center;
    width: 100%;
    min-height: 42px;
    padding: 7px 12px;
    text-align: center;
  }

  .n6-wide-links--subpage a,
  .n6-wide-links--subpage a + a,
  .n6-wide-links--subpage img {
    height: 230px;
    min-height: 230px;
  }

  .n6-company-page .n6-history li {
    grid-template-columns: 76px minmax(0, 1fr);
    gap: 16px;
    min-height: 0;
    padding: 18px 0 18px 22px;
    align-items: start;
    font-size: 14px;
    line-height: 1.7;
  }

  .n6-company-page .n6-history time {
    font-size: 16px;
    line-height: 1.7;
  }

  .n6-company-page .n6-history li::before {
    top: 25px;
  }

  .n6-company-page .n6-history li:not(:last-child)::after {
    top: 37px;
    bottom: -25px;
  }

  .n6-home .n6-works__grid {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  .n6-home .n6-work-card,
  .n6-home .n6-work-card > a,
  .n6-home .n6-work-card__image {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .n6-home .n6-work-card > a {
    display: block;
  }

  .n6-home .n6-work-card h3 {
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

/* ------------------------------------------------------------
 * Display review corrections (2026-07-29)
 * ------------------------------------------------------------ */

.n6-service-page .n6-strength-detail__columns > div:first-child {
  border: 1px solid #171717;
}

.n6-company-page .n6-philosophy .n6-subsection-head h2 .n6-philosophy-heading-n {
  display: inline;
  color: #949494;
  font-family: "Cormorant Garamond", var(--n6-display) !important;
  font-size: 1.65em;
  font-style: normal;
  font-weight: 400;
  line-height: .7;
  vertical-align: -.06em;
}

.n6-company-page .n6-message::before {
  content: "TOP MESSAGE";
  position: absolute;
  z-index: 0;
  top: 8px;
  left: 0;
  color: rgba(160, 160, 160, .22);
  font-family: "Cormorant Garamond", var(--n6-display);
  font-size: clamp(80px, 10vw, 175px);
  font-style: italic;
  line-height: 1;
  white-space: nowrap;
}

.n6-company-page .n6-message .n6-subcontainer {
  position: relative;
  z-index: 1;
}

.n6-company-page .n6-message__career {
  position: relative;
  padding: 38px 34px 28px;
  border: 1px solid #949494;
}

.n6-company-page .n6-message__career h3 {
  position: absolute;
  top: 0;
  left: 50%;
  min-width: 116px;
  margin: 0;
  padding: 0 22px;
  background: #f3f3f3;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}

.n6-sidebar-banner--service b,
.n6-sidebar-banner--service small,
.n6-sidebar-banner--service em {
  color: #fff;
}

.n6-sidebar-banner--works,
.n6-sidebar-banner--column {
  border-color: #30adab;
  color: #171717;
}

.n6-sidebar-banner--works b,
.n6-sidebar-banner--works em,
.n6-sidebar-banner--column b,
.n6-sidebar-banner--column em {
  color: #30adab;
}

.n6-sidebar-banner--works small,
.n6-sidebar-banner--column small {
  color: #171717;
}

.n6-contact-page .n6-contact-form {
  position: relative;
  background: #fafafa;
}

.n6-contact-status {
  margin: 0 0 28px;
  padding: 16px 20px;
  border: 1px solid currentColor;
  font-size: 14px;
  line-height: 1.7;
}

.n6-contact-status.is-success {
  color: #287d79;
  background: #eef9ef;
}

.n6-contact-status.is-error {
  color: #9a3434;
  background: #fff4f4;
}

@media (min-width: 768px) {
  .n6-home .n6-guide__panel {
    position: relative;
    z-index: 2;
    width: calc(100% + 72px);
  }
}

@media (min-width: 768px) {
  .n6-contact-page .n6-contact-form::before {
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    bottom: 0;
    width: calc((100vw - 100%) / 2);
    background: #fafafa;
  }

  .n6-company-page .n6-history li {
    align-items: center;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .n6-company-page .n6-history li::before {
    top: 50%;
    transform: translateY(-50%);
  }

  .n6-company-page .n6-history li:not(:last-child)::after {
    top: calc(50% + 7px);
    bottom: calc(-50% + 7px);
  }
}

@media (max-width: 767px) {
  .n6-company-page .n6-message__career {
    padding: 34px 20px 22px;
  }

  .n6-company-page .n6-message__career dl > div {
    padding-inline: 0;
  }

  .n6-contact-page .n6-contact-form::before {
    display: none;
  }
}

/* ------------------------------------------------------------
 * Figma visual audit response (2026-07-29)
 * ------------------------------------------------------------ */

@media (max-width: 767px) {
  .n6-work-grid,
  .n6-related-grid {
    min-width: 0;
  }

  .n6-work-grid > .n6-archive-card,
  .n6-related-grid > .n6-archive-card,
  .n6-work-grid > .n6-archive-card > a,
  .n6-related-grid > .n6-archive-card > a,
  .n6-work-grid .n6-archive-card__image,
  .n6-related-grid .n6-archive-card__image {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
}

@media (min-width: 901px) {
  /* The English and Japanese hero labels are already separate in markup.
   * These offsets align the existing structure to the 1920px Figma frame. */
  .n6-page-hero {
    padding-top: 200px;
  }

  .n6-page-hero h1 {
    margin-left: 6px;
  }
}

@media (min-width: 1025px) {
  .n6-home .n6-hero h1 {
    width: min(100%, 916px);
  }

  .n6-home .n6-intro {
    padding-bottom: 70px;
  }

  .n6-home .n6-services {
    padding-bottom: 123px;
  }

  .n6-home .n6-services__grid {
    position: relative;
    left: 50%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 17px;
    width: min(calc(100vw - 80px), 1414px);
    margin-left: 0;
    transform: translateX(-50%);
  }

  .n6-home .n6-strengths {
    padding-bottom: 60px;
  }

  .n6-home .n6-works {
    padding-bottom: 209px;
  }

  .n6-home .n6-columns {
    padding-bottom: 134px;
  }

  .n6-home .n6-guide {
    padding-bottom: 51px;
  }

  .n6-company-page .n6-philosophy {
    padding-bottom: 224px;
  }

  .n6-company-page .n6-message {
    padding-bottom: 162px;
  }

  .n6-company-page .n6-message__portrait {
    aspect-ratio: 3 / 2;
  }

  .n6-company-page .n6-machines {
    padding-bottom: 343px;
  }

  .n6-company-page .n6-company-profile {
    padding-bottom: 412px;
  }

  .n6-footer {
    padding-bottom: 83px;
  }
}

/* Shared typography and media surfaces from the completed Figma frames. */
.n6-home,
.n6-subpage {
  --n6-ink: #000;
  --n6-sub-ink: #000;
  color: #000;
}

.n6-service-card > img,
.n6-strength-card,
.n6-strength-card img,
.n6-work-card__image,
.n6-column-card__image,
.n6-service-row__media,
.n6-machine-grid article > div,
.n6-archive-card__image {
  overflow: hidden;
  border-radius: 20px;
}

.n6-service-card p,
.n6-strength-card p {
  line-height: 1.6;
}

.n6-archive-card h2 {
  line-height: 1.85;
}

.n6-archive-card p,
.n6-column-list-card > div > p:last-child {
  line-height: 1.9375;
}

.n6-column-list-card h2 {
  line-height: 2;
}

.n6-contact-page .n6-contact-form input:not([type="radio"]):not([type="checkbox"]),
.n6-contact-page .n6-contact-form textarea,
.n6-contact-page .n6-contact-form select {
  border-color: #bebebe;
}

@media (min-width: 768px) {
  .n6-case > h1,
  .n6-column-entry > h1 {
    max-width: 609px;
    line-height: 65px;
  }

  .n6-contact-phone h2 {
    font-size: 25px;
    line-height: 65px;
  }
}

@media (max-width: 900px) {
  .n6-section-nav {
    overscroll-behavior-inline: contain;
    scroll-padding-inline: 12px 48px;
    scroll-snap-type: x proximity;
  }

  .n6-section-nav::after {
    content: "";
    flex: 0 0 28px;
    width: 28px;
  }

  .n6-section-nav a {
    scroll-snap-align: start;
  }
}

@media (max-width: 767px) {
  .n6-home .n6-intro__ring {
    right: -24px;
    width: min(260px, 72vw);
  }

  .n6-company-page .n6-history > .n6-section-particle-canvas {
    right: -130px;
    width: 620px;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  .n6-home .n6-intro__ring {
    right: -30px;
    width: 360px;
  }

  .n6-flow-cards,
  .n6-flow-cards--nine {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .n6-flow-cards > div {
    min-height: 200px;
    padding: 20px 16px;
  }

  .n6-flow-cards strong {
    font-size: 34px;
    line-height: 1;
  }

  .n6-flow-cards span {
    margin-top: 14px;
    font-size: 15px;
    line-height: 1.55;
  }

  .n6-flow-cards > div:nth-child(4n):not(:last-child)::after {
    display: block;
  }

  .n6-flow-cards > div:nth-child(3n):not(:last-child)::after {
    display: none;
  }
}

@media (max-width: 480px) {
  .n6-price-guide .n6-table-wrap::before {
    content: "横にスクロールできます  →";
    display: block;
    position: sticky;
    left: 0;
    width: max-content;
    margin: 0 0 10px;
    color: var(--n6-green);
    font-size: 12px;
    line-height: 1.5;
    letter-spacing: .04em;
  }

  .n6-price-guide .n6-table-wrap {
    padding-bottom: 8px;
    box-shadow: inset -18px 0 18px -20px rgba(0, 64, 49, .85);
  }
}

/* ------------------------------------------------------------
 * Contact Form 7 integration
 * ------------------------------------------------------------ */

.n6-contact-form--cf7 .wpcf7,
.n6-contact-form--cf7 .wpcf7-form,
.n6-contact-form--cf7 .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  min-width: 0;
}

.n6-contact-form--cf7 .wpcf7-form > p:empty {
  display: none;
}

.n6-contact-form--cf7 .n6-cf7-fieldset {
  width: 100%;
}

.n6-contact-form--cf7 .n6-radio-group {
  display: block;
}

.n6-contact-form--cf7 .n6-radio-group .wpcf7-form-control {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 25px;
}

.n6-contact-form--cf7 .wpcf7-list-item {
  margin: 0;
}

.n6-contact-form--cf7 .wpcf7-list-item label {
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  line-height: 1.65;
  cursor: pointer;
}

.n6-contact-form--cf7 .wpcf7-list-item input {
  flex: 0 0 auto;
  margin-top: .32em;
  accent-color: var(--n6-green);
}

.n6-contact-form--cf7 .n6-form-label {
  display: block;
}

.n6-contact-form--cf7 .n6-form-row > br {
  display: none;
}

.n6-contact-form--cf7 input:not([type="radio"]):not([type="checkbox"]),
.n6-contact-form--cf7 textarea {
  color: #171717;
  transition:
    border-color .2s ease,
    background-color .2s ease,
    box-shadow .2s ease;
}

.n6-contact-form--cf7 input:not([type="radio"]):not([type="checkbox"]):focus,
.n6-contact-form--cf7 textarea:focus {
  border-color: var(--n6-green);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(48, 173, 171, .14);
}

.n6-contact-form--cf7 .wpcf7-not-valid {
  border-color: #b96b6b !important;
  background: #fffafa;
}

.n6-contact-form--cf7 .wpcf7-not-valid-tip {
  display: block;
  margin-top: 8px;
  color: #8b3838;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.65;
}

.n6-contact-form--cf7 .n6-cf7-submit {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-height: 58px;
  margin-top: 50px;
}

.n6-contact-form--cf7 .n6-cf7-submit > p {
  margin: 0;
}

.n6-contact-form--cf7 .n6-cf7-submit .n6-button {
  display: block;
  margin: 0;
  padding-right: 56px;
  padding-left: 56px;
  text-align: center;
  background:
    radial-gradient(circle at calc(100% - 30px) 50%, var(--n6-green) 0 3px, transparent 3.5px),
    #fff;
  appearance: none;
}

.n6-contact-form--cf7 .n6-cf7-submit .n6-button:hover {
  color: var(--n6-green) !important;
  background:
    radial-gradient(circle at calc(100% - 30px) 50%, var(--n6-green) 0 3px, transparent 3.5px),
    #fff;
}

.n6-contact-form--cf7 form.submitting .wpcf7-submit {
  opacity: .6;
  pointer-events: none;
}

.n6-contact-form--cf7 form.submitting .n6-cf7-submit .n6-button {
  background: #fff;
}

.n6-contact-form--cf7 .wpcf7-spinner {
  visibility: hidden;
  position: absolute;
  top: 50%;
  left: calc(50% + 82px);
  width: 30px;
  height: 30px;
  margin: 0;
  border: 1px solid rgba(48, 173, 171, .35);
  border-radius: 50%;
  background: #fff;
  opacity: 1;
  box-shadow: 0 6px 18px rgba(0, 64, 49, .1);
  transform: translateY(-50%);
}

.n6-contact-form--cf7 form.submitting .wpcf7-spinner {
  visibility: visible;
}

.n6-contact-form--cf7 .wpcf7-spinner::before {
  content: "";
  position: absolute;
  inset: 5px;
  width: auto;
  height: auto;
  border: 2px solid rgba(48, 173, 171, .2);
  border-top-color: var(--n6-green);
  border-radius: 50%;
  background: transparent;
  transform-origin: center;
  animation: n6-cf7-spin .8s linear infinite;
}

@keyframes n6-cf7-spin {
  to {
    transform: rotate(360deg);
  }
}

.n6-contact-form--cf7 .wpcf7-response-output {
  margin: 28px 0 0 !important;
  padding: 16px 20px !important;
  border: 1px solid var(--n6-green) !important;
  border-radius: 0;
  color: #174b42;
  background: #eef8f5;
  font-size: 14px;
  line-height: 1.75;
}

.n6-contact-form--cf7 form.invalid .wpcf7-response-output,
.n6-contact-form--cf7 form.unaccepted .wpcf7-response-output,
.n6-contact-form--cf7 form.payment-required .wpcf7-response-output,
.n6-contact-form--cf7 form.spam .wpcf7-response-output,
.n6-contact-form--cf7 form.failed .wpcf7-response-output,
.n6-contact-form--cf7 form.aborted .wpcf7-response-output {
  border-color: #b96b6b !important;
  color: #7d2f2f;
  background: #fff5f5;
}

.n6-contact-form--cf7 form.sent .wpcf7-response-output {
  border-color: var(--n6-green) !important;
  color: #174b42;
  background: #eef8f5;
}

.n6-contact-form__notice {
  margin: 0;
  padding: 16px 20px;
  border: 1px solid #c7d8d4;
  color: #174b42;
  background: #f3f9f7;
  font-size: 14px;
  line-height: 1.75;
}

@media (max-width: 767px) {
  .n6-contact-form--cf7 .n6-radio-group .wpcf7-form-control {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .n6-contact-form--cf7 .n6-cf7-submit {
    gap: 12px;
    margin-top: 38px;
  }

  .n6-contact-form--cf7 .wpcf7-response-output {
    margin-top: 22px !important;
    padding: 14px 16px !important;
  }
}

/* ------------------------------------------------------------
 * Display review corrections (sheet No.14–20 / 2026-07-30)
 * Values are mapped from the completed 1920px Figma frames while keeping
 * the existing responsive composition fluid.
 * ------------------------------------------------------------ */

/* No.15: the outline belongs to the problem label, not the grey panel. */
.n6-service-page .n6-strength-detail__columns > div:first-child {
  border: 0;
}

.n6-service-page .n6-strength-detail__columns > .n6-strength-detail__problem > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(258px, 100%);
  height: 36px;
  padding: 0 15px;
  border: 1px solid #000;
  border-radius: 20px;
  color: #000;
  background: transparent;
  font-size: 16px;
  line-height: 31px;
}

/* No.16–17: reproduce the split 110px / 80px Cormorant wordmark. */
.n6-company-page .n6-philosophy-grid article > .n6-philosophy-word {
  display: flex;
  align-items: baseline;
  min-height: 82px;
  color: #949494;
  font-family: "Cormorant Garamond", var(--n6-display);
  font-size: 80px;
  font-style: italic;
  font-weight: 300;
  line-height: 65px;
}

.n6-company-page .n6-philosophy-word > b {
  font: inherit;
  font-size: 110px;
  font-weight: 300;
  line-height: 65px;
}

.n6-company-page .n6-philosophy-grid h3 {
  margin-top: 27px;
  font-size: 30px;
  line-height: 1.5;
}

/* The former generated decoration is replaced with a grid-aligned element. */
.n6-company-page .n6-message::before {
  content: none;
}

.n6-company-page .n6-message__display {
  display: none;
}

.n6-company-page .n6-message__career {
  border: 0;
  background: rgba(250, 250, 250, .9);
}

.n6-company-page .n6-message__career h3 {
  position: static;
  min-width: 0;
  margin: 0 0 20px;
  padding: 0;
  background: transparent;
  transform: none;
}

.n6-company-page .n6-message__career dt {
  font-family: var(--n6-sans);
  font-style: normal;
}

@media (min-width: 1025px) {
  /* No.18–19: 1793/1920 background block, aligned to Figma's right edge. */
  .n6-company-page .n6-message {
    isolation: isolate;
    overflow: visible;
    padding-top: 104px;
    background: transparent;
  }

  .n6-company-page .n6-message::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    left: auto;
    width: min(93.3854167%, 1793px);
    height: clamp(850px, 57.03125vw, 1095px);
    background: #f5f5f5;
  }

  .n6-company-page .n6-message__grid {
    position: relative;
  }

  .n6-company-page .n6-message__portrait {
    width: min(calc(100% - 50px), 807px);
    margin-left: min(.833333vw, 16px);
    aspect-ratio: 3 / 2;
  }

  .n6-company-page .n6-message__grid > article {
    padding-top: 22px;
  }

  .n6-company-page .n6-message__display {
    display: block;
    z-index: 0;
    grid-area: career;
    align-self: start;
    width: max-content;
    color: rgba(0, 121, 94, .07);
    font-family: "Cormorant Garamond", var(--n6-display);
    font-size: clamp(210px, 15.625vw, 300px);
    font-style: italic;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .05em;
    white-space: nowrap;
    transform: translate(-836px, -155px);
    pointer-events: none;
  }

  .n6-company-page .n6-message__career {
    z-index: 1;
    width: min(calc(100% - 82px), 862px);
    min-height: 560px;
    margin: 85px 0 0 82px;
    padding: 29px 43px 31px;
  }

  .n6-company-page .n6-message__career dl > div {
    min-height: 64px;
    padding: 14px 0;
  }

  /* No.20: preserve the global content center; only narrow the background. */
  .n6-service-page .n6-price-page,
  .n6-service-page .n6-materials-page {
    isolation: isolate;
    background: transparent;
  }

  .n6-service-page .n6-price-page::after,
  .n6-service-page .n6-materials-page::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0 0 0 auto;
    width: min(93.3854167%, 1793px);
  }

  .n6-service-page .n6-price-page::after {
    background: #f4f4f4;
  }

  .n6-service-page .n6-materials-page::after {
    background: #f2f2f2;
  }

  .n6-company-page .n6-company-profile {
    isolation: isolate;
    background: transparent;
  }

  .n6-company-page .n6-company-profile::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0 0 0 auto;
    width: min(93.3854167%, 1793px);
    background: #f5f5f5;
  }
}

.n6-company-page .n6-company-profile {
  background-color: #f5f5f5;
}

@media (min-width: 1025px) {
  .n6-company-page .n6-company-profile {
    background-color: transparent;
  }
}

@media (max-width: 767px) {
  .n6-company-page .n6-philosophy-grid article > .n6-philosophy-word {
    min-height: 66px;
    font-size: 56px;
  }

  .n6-company-page .n6-philosophy-word > b {
    font-size: 86px;
  }

  .n6-company-page .n6-philosophy-grid h3 {
    font-size: 30px;
  }
}

/* TOP: Figma visual corrections (2026-07-30). */
.n6-home .n6-text-link {
  color: #00795e;
}

.n6-home .n6-strengths {
  background: rgba(242, 242, 242, .8);
}

.n6-home .n6-strength-card__number {
  color: rgba(48, 173, 171, .15);
  font-family: "Libre Bodoni", var(--n6-number);
  font-size: clamp(80px, 9.03vw, 130px);
  font-style: italic;
  font-weight: 600;
  line-height: 65px;
}

@media (min-width: 768px) {
  .n6-home .n6-text-link i {
    width: 76px;
    height: 76px;
  }
}

@media (min-width: 1025px) {
  .n6-home .n6-works__grid {
    position: relative;
    left: 50%;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(24px, 2.34375vw, 45px);
    width: min(calc(100vw - 174px), 1747px);
    margin-left: 0;
    transform: translateX(-50%);
  }

  .n6-home .n6-work-card__image {
    aspect-ratio: 403 / 270;
    border-radius: 15.476px;
  }
}

/* Service / shared lower-page corrections from the completed Figma frame. */
@media (min-width: 901px) {
  .n6-subpage > .n6-page-hero {
    min-height: 400px;
    padding-top: 200px;
  }

  .n6-subpage > .n6-page-hero h1 {
    gap: 16px;
  }

  .n6-subpage .n6-section-nav {
    gap: 40px;
    width: min(calc(100% - var(--n6-page-inline)), 1148px);
    min-height: 98px;
  }

  .n6-subpage .n6-section-nav a {
    gap: 11px;
    font-size: 16px;
    font-weight: 500;
    line-height: 25.6px;
  }

  .n6-subpage .n6-section-nav a::after {
    width: 38px;
    height: 38px;
    font-size: 14px;
  }

  .n6-service-page .n6-flow-cards:not(.n6-flow-cards--nine) {
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 28px;
    width: 100%;
    max-width: none;
  }

  .n6-service-page .n6-flow-cards--nine {
    grid-template-columns: repeat(9, minmax(0, 1fr));
    width: 100%;
    max-width: none;
  }

  .n6-service-page .n6-flow-cards > div {
    min-height: 372px;
    padding: 0;
  }

  .n6-service-page .n6-flow-cards > div:not(:last-child)::after {
    right: -32px;
    display: grid;
    width: 36px;
    height: 36px;
    background: #fff;
    content: "→";
    place-content: center;
  }

  .n6-service-page .n6-flow-cards strong {
    position: absolute;
    top: -1px;
    left: -1px;
    color: rgba(48, 173, 171, .3);
    font-family: "Libre Bodoni", var(--n6-display);
    font-size: 40px;
    font-style: italic;
    font-weight: 600;
    line-height: 39px;
    letter-spacing: 4.4px;
  }

  .n6-service-page .n6-flow-cards span {
    margin: auto;
  }
}

.n6-service-page .n6-flow-page > .n6-flow-ring {
  position: absolute;
  z-index: 0;
  top: 72px;
  left: max(-16.6px, -.865vw);
  width: clamp(320px, 44.8127vw, 860.404px);
  height: auto;
  max-width: none;
  opacity: .05;
  animation: n6-intro-ring-spin 28s linear infinite;
  transform-origin: center;
  pointer-events: none;
  user-select: none;
}

.n6-service-page .n6-flow-page > .n6-subcontainer {
  position: relative;
  z-index: 1;
}

.n6-service-page .n6-faq-page > .n6-section-particle-canvas {
  top: 236px;
  right: -274px;
  width: 1180px;
}

@media (max-width: 900px) {
  .n6-service-page .n6-flow-page > .n6-flow-ring {
    top: 96px;
    left: -150px;
  }

  .n6-service-page .n6-faq-page > .n6-section-particle-canvas {
    top: 170px;
    right: -350px;
    width: 760px;
    opacity: .5;
  }
}

@media (prefers-reduced-motion: reduce) {
  .n6-service-page .n6-flow-page > .n6-flow-ring {
    animation: none;
  }
}

.n6-service-page .n6-service-row__body > p:not(.n6-service-row__kicker) {
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: 0;
}

.n6-service-page .n6-service-row__body ul {
  gap: 16px;
}

.n6-service-page .n6-service-row__body li {
  padding-left: 18px;
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 20.8px;
  letter-spacing: 0;
}

.n6-service-page .n6-service-row__body li::before {
  top: 6px;
  width: 8px;
  height: 8px;
  background: #00795e;
}

.n6-service-page .n6-flow-cards strong {
  color: rgba(48, 173, 171, .3);
  font-family: "Libre Bodoni", var(--n6-display);
  font-style: italic;
  font-weight: 600;
  letter-spacing: 4.4px;
}

.n6-service-page .n6-strength-detail::after {
  font-family: "Libre Bodoni", var(--n6-display);
  font-style: italic;
  font-weight: 600;
}

.n6-service-page .n6-materials-page::before {
  color: #d9d9d9;
  font-family: "Libre Bodoni", var(--n6-display);
  font-size: 120px;
  font-style: italic;
  font-weight: 400;
  line-height: 166.364px;
  letter-spacing: 6px;
}

.n6-service-page .n6-faq-list summary span,
.n6-service-page .n6-faq-list details > div > span {
  font-family: "DM Serif Display", var(--n6-display);
}

.n6-service-page .n6-materials-box section > p {
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: 0;
}

.n6-service-page .n6-faq-list {
  width: min(100%, 1149px);
  margin-inline: auto;
  border-top: 0;
}

.n6-service-page .n6-faq-list details {
  margin-bottom: 20px;
  border: 0;
  background: #fafafa;
}

.n6-service-page .n6-faq-list summary {
  min-height: 80px;
  padding: 20px 56px 20px 23px;
  color: #000;
  background: #fafafa;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
}

.n6-service-page .n6-faq-list details[open] summary::before {
  content: "";
  position: absolute;
  right: 66px;
  bottom: 0;
  left: 27px;
  border-bottom: 1px dotted #707070;
}

.n6-service-page .n6-faq-list details > div,
.n6-service-page .n6-faq-list details[open] > div {
  gap: 17px;
  padding: 22px 24px 13px 23px;
  background: #fafafa;
}

.n6-service-page .n6-faq-list details[open] > div p {
  color: #000;
  font-size: 16px;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0;
}

@media (max-width: 900px) {
  .n6-service-page .n6-faq-list details {
    margin-bottom: 12px;
  }

  .n6-service-page .n6-faq-list summary {
    min-height: 68px;
    padding: 16px 48px 16px 18px;
    font-size: 16px;
    line-height: 1.5;
  }

  .n6-service-page .n6-faq-list details[open] summary::before {
    right: 42px;
    left: 18px;
  }

  .n6-service-page .n6-faq-list details > div,
  .n6-service-page .n6-faq-list details[open] > div {
    gap: 12px;
    padding: 18px;
  }
}

/* Company page: Figma typography and spacing corrections (2026-07-30).
 * Every rule is page-scoped so shared components on other pages stay unchanged. */
.n6-company-page .n6-company-map-link {
  position: relative;
  width: 326px;
  min-width: 0;
  height: 64px;
  min-height: 0;
  margin: 48px auto 0;
  padding: 0 52px;
  border-color: #00795e;
  border-radius: 32px;
  color: #00795e !important;
  background: #fff;
  font-family: var(--n6-sans);
  font-size: 16px;
  font-weight: 700;
  line-height: 20.8px;
}

.n6-company-page .n6-company-map-link::after {
  position: absolute;
  top: 50%;
  right: 28px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #00795e;
  content: "";
  transform: translateY(-50%);
}

.n6-company-page .n6-company-map-link:hover {
  color: #00795e !important;
  background: #fff;
}

@media (min-width: 901px) {
  .n6-company-page .n6-philosophy-grid h3 {
    font-family: var(--n6-sans);
    font-size: 30px;
    font-weight: 400;
    line-height: 65px;
    letter-spacing: 0;
  }

  .n6-company-page .n6-philosophy-grid article > p {
    color: #000;
    font-family: var(--n6-sans);
    font-size: 16px;
    font-weight: 400;
    line-height: 20.8px;
    letter-spacing: 0;
  }

  .n6-company-page .n6-message__grid > article {
    max-width: 888px;
  }

  .n6-company-page .n6-message__grid > article h2 {
    margin-bottom: 19px;
    font-family: var(--n6-sans);
    font-size: 40px;
    font-weight: 400;
    line-height: 65px;
    letter-spacing: 0;
  }

  .n6-company-page .n6-message__grid > article > p:not(.n6-message__signature) {
    color: #000;
    font-family: var(--n6-sans);
    font-size: 16px;
    font-weight: 400;
    line-height: 25.8px;
    letter-spacing: 0;
  }

  .n6-company-page .n6-message__grid > article > p:not(.n6-message__signature) + p:not(.n6-message__signature) {
    margin-top: 0;
  }

  .n6-company-page .n6-message__signature {
    gap: 0;
    margin-top: 55px;
  }

  .n6-company-page .n6-message__signature span {
    color: #999;
    font-family: var(--n6-enokoro);
    font-size: 16px;
    font-weight: 400;
    line-height: 20.8px;
  }

  .n6-company-page .n6-message__signature strong {
    color: #000;
    font-family: var(--n6-enokoro);
    font-size: 23px;
    font-weight: 700;
    line-height: 1.4;
  }

  .n6-company-page .n6-message__career h3 {
    margin-bottom: 0;
    font-family: var(--n6-sans);
    font-size: 20px;
    font-weight: 400;
    line-height: 42px;
    letter-spacing: 0;
  }

  .n6-company-page .n6-message__career dl > div {
    align-items: center;
    min-height: 64px;
    padding: 0;
    font-size: 14px;
    line-height: 1.5;
  }

  .n6-company-page .n6-message__career dt {
    font-family: var(--n6-enokoro);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
  }

  .n6-company-page .n6-message__career dd {
    font-family: var(--n6-sans);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
  }

  .n6-company-page .n6-machine-grid h3 {
    font-family: var(--n6-sans);
    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0;
  }

  .n6-company-page .n6-machine-grid p {
    color: #000;
    font-family: var(--n6-enokoro);
    font-size: 16px;
    font-weight: 400;
    line-height: 20.8px;
    letter-spacing: 0;
  }

  .n6-company-page .n6-company-profile th {
    font-family: var(--n6-enokoro);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0;
  }

  .n6-company-page .n6-company-profile td {
    font-family: var(--n6-sans);
    font-size: 16px;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0;
  }

  .n6-company-page .n6-history time {
    color: #a8a8a8;
    font-family: "DM Serif Display", var(--n6-display);
    font-size: 30px;
    font-style: italic;
    font-weight: 400;
    line-height: 1.4;
  }

  .n6-company-page .n6-history li > span {
    color: #000;
    font-family: var(--n6-sans);
    font-size: 18px;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0;
  }
}

@media (max-width: 767px) {
  .n6-company-page .n6-company-map-link {
    width: min(100%, 326px);
    height: 58px;
    margin-top: 32px;
    padding-inline: 44px;
    font-size: 15px;
  }

  .n6-company-page .n6-company-map-link::after {
    right: 24px;
  }
}

/* Contact page: Figma typography and form-surface corrections (2026-07-30).
 * The contact-page scope prevents these values from changing shared forms/buttons. */
.n6-contact-page .n6-contact-phone--inquiry .n6-contact-phone__hours {
  color: #30adab;
  font-family: var(--n6-sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 20.8px;
  letter-spacing: 0;
}

.n6-contact-page .n6-contact-lead--inquiry {
  color: #000;
  font-family: var(--n6-sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 25.6px;
  letter-spacing: 0;
}

.n6-contact-page .n6-contact-form--inquiry {
  isolation: isolate;
  background: #fafafa;
}

.n6-contact-page .n6-contact-form--inquiry legend,
.n6-contact-page .n6-contact-form--inquiry .n6-form-label,
.n6-contact-page .n6-contact-form--inquiry .wpcf7-list-item-label {
  color: #000;
  font-family: var(--n6-sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: 0;
}

.n6-contact-page .n6-contact-form--inquiry legend span,
.n6-contact-page .n6-contact-form--inquiry .n6-form-row em {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  min-width: 60px;
  height: 25px;
  margin-left: 0;
  padding: 0 14px;
  border: 1px solid #30adab;
  border-radius: 20px;
  color: #30adab;
  background: transparent;
  font-family: var(--n6-sans);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 15px;
  letter-spacing: 0;
  white-space: nowrap;
}

.n6-contact-page .n6-contact-form--inquiry input:not([type="radio"]):not([type="checkbox"]),
.n6-contact-page .n6-contact-form--inquiry textarea {
  border-color: #bebebe;
  color: #000;
  background: #fff;
  font-family: var(--n6-sans);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
}

.n6-contact-page .n6-contact-form--inquiry .wpcf7-list-item label {
  gap: 14px;
}

.n6-contact-page .n6-contact-form--inquiry .wpcf7-list-item input {
  width: 20px;
  height: 20px;
  margin-top: 1px;
}

.n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit {
  min-height: 64px;
}

.n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit input.n6-button {
  width: 326px;
  max-width: 100%;
  min-width: 0;
  height: 64px;
  min-height: 64px;
  padding: 0 56px;
  border: 1px solid #00795e;
  border-radius: 32px;
  color: #00795e !important;
  background:
    radial-gradient(circle at calc(100% - 28px) 50%, #00795e 0 4px, transparent 4.5px),
    transparent;
  font-family: var(--n6-sans);
  font-size: 16px;
  font-weight: 700;
  line-height: 20.8px;
}

.n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit input.n6-button:hover {
  color: #00795e !important;
  background:
    radial-gradient(circle at calc(100% - 28px) 50%, #00795e 0 4px, transparent 4.5px),
    transparent;
}

@media (min-width: 901px) {
  .n6-contact-page .n6-contact-content--inquiry {
    overflow: hidden;
    padding-top: 50px;
  }

  .n6-contact-page .n6-contact-phone--inquiry {
    margin-bottom: 65px;
  }

  .n6-contact-page .n6-contact-phone--inquiry .n6-contact-phone__heading {
    margin: 0;
  }

  .n6-contact-page .n6-contact-phone--inquiry .n6-contact-phone__link {
    display: flex;
    align-items: baseline;
    justify-content: center;
    height: 30px;
    margin-top: -2px;
    margin-inline: auto;
  }

  .n6-contact-page .n6-contact-phone--inquiry .n6-contact-phone__hours {
    margin-top: 17px;
  }

  .n6-contact-page .n6-contact-lead--inquiry {
    margin-bottom: 97px;
  }

  .n6-contact-page .n6-wide-links--subpage {
    margin-top: 0;
  }

  .n6-contact-page .n6-contact-form--inquiry {
    padding: 78px 108px 80px 122px;
    background: transparent;
  }

  .n6-contact-page .n6-contact-form--inquiry::before {
    display: block;
    z-index: -1;
    top: 0;
    right: auto;
    bottom: 0;
    left: calc((100vw - 100%) / -2);
    width: calc(100vw - 310px);
    background: #fafafa;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-cf7-fieldset {
    display: block;
    position: relative;
    height: 58px;
    min-height: 58px;
    padding: 0;
  }

  .n6-contact-page .n6-contact-form--inquiry legend {
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 2px;
  }

  .n6-contact-page .n6-contact-form--inquiry legend,
  .n6-contact-page .n6-contact-form--inquiry .n6-form-label {
    display: flex;
    float: none;
    align-items: flex-start;
    justify-content: space-between;
    width: 230px;
    padding: 0 31px 0 0;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-form-label {
    align-items: center;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-radio-group {
    position: absolute;
    top: 0;
    left: 250px;
    width: 462px;
    height: 58px;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-radio-group .wpcf7-form-control {
    grid-template-columns: 243px 194px;
    gap: 14px 25px;
    width: 462px;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-form-row {
    grid-template-columns: 230px 560px;
    gap: 20px;
    height: 46px;
    margin-top: 55px;
    font-size: 16px;
    font-weight: 400;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-form-row input:not([type="radio"]):not([type="checkbox"]) {
    width: 560px;
    min-height: 46px;
    height: 46px;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-form-row--textarea {
    height: 179px;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-form-row textarea {
    width: 560px;
    min-height: 179px;
    height: 179px;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit {
    min-height: 64px;
    margin-top: 60px;
  }

  .n6-contact-page .n6-contact-form--inquiry .wpcf7-list-item input {
    margin: 1px 0 0;
  }
}

@media (max-width: 900px) {
  .n6-contact-page .n6-contact-form--inquiry legend,
  .n6-contact-page .n6-contact-form--inquiry .n6-form-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit {
    margin-top: 42px;
  }
}

/* Contact Form 7 inserts Turnstile at the beginning of the form.
 * Keep the visual order aligned with the actual submission flow:
 * fields -> verification -> submit -> response. */
.n6-contact-page .n6-contact-form--inquiry .wpcf7-form {
  display: flex;
  flex-direction: column;
}

.n6-contact-page .n6-contact-form--inquiry .wpcf7-turnstile {
  display: flex;
  order: 1;
  align-self: stretch;
  justify-content: center;
  width: 100%;
  min-height: 65px;
  margin: 36px 0 0;
}

.n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit {
  order: 2;
  margin-top: 24px;
}

.n6-contact-page .n6-contact-form--inquiry .wpcf7-response-output {
  order: 3;
}

@media (max-width: 767px) {
  .n6-contact-page .n6-contact-form--inquiry .wpcf7-turnstile {
    margin-top: 30px;
  }

  .n6-contact-page .n6-contact-form--inquiry .n6-cf7-submit {
    margin-top: 20px;
  }
}

/* Column thumbnails: use the 3:2 ratio of the authored thumbnail assets.
 * This keeps TOP, archive and popular-post images consistent without
 * changing Works cards or article-body media. */

.n6-column-card__image,
.n6-column-list-card__image {
  height: auto;
  aspect-ratio: 3 / 2;
}

.n6-column-card__image img.n6-content-image,
.n6-column-list-card__image img.n6-content-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.n6-content-sidebar .n6-sidebar-post > img.n6-content-image,
.n6-content-sidebar .n6-sidebar-post > .n6-image-placeholder {
  display: block;
  align-self: start;
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* Keep the pointer hit area stationary on hover.
 * Moving the interactive element itself can repeatedly drop/reacquire
 * :hover when the pointer sits on its lower edge, which looks like jitter. */
@media (hover: hover) and (pointer: fine) {
  .n6-pill:hover,
  .n6-button:hover,
  .n6-hero__tel.is-visible:hover,
  .n6-material-tags a.is-filter-link:hover {
    transform: none;
  }
}

/* Preserve the image reveal transition and the hover zoom together.
 * The reveal shorthand otherwise replaces the original transform transition,
 * making card images jump immediately to their hover scale. */
.n6-work-card__image img.n6-content-image,
.n6-column-card__image img.n6-content-image {
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  transform-origin: center;
  backface-visibility: hidden;
  will-change: transform;
  transition:
    opacity .76s cubic-bezier(.22, 1, .36, 1) var(--n6-reveal-delay, 0ms),
    translate .92s cubic-bezier(.22, 1, .36, 1) var(--n6-reveal-delay, 0ms),
    scale .92s cubic-bezier(.22, 1, .36, 1) var(--n6-reveal-delay, 0ms),
    transform .35s ease;
}

.n6-wide-links img {
  transform-origin: center;
  backface-visibility: hidden;
  filter: saturate(.86);
  will-change: auto;
}

.n6-wide-links a::after {
  opacity: 1;
  transition: opacity .28s ease;
}

.n6-wide-links a:hover::after {
  opacity: .72;
}

.n6-wide-links a:hover img {
  filter: saturate(.86);
  transform: none;
}