/* Candidate Gói 10 — route-scoped manufacturing body.
   Shared hero, advisor banner and footer styles remain owned by shared assets. */
.sapamefa-manufacturing-page {
  color: var(--smf-color-text);
  background: var(--smf-color-surface);
  overflow: clip;
}

.sapamefa-manufacturing-page *,
.sapamefa-manufacturing-page *::before,
.sapamefa-manufacturing-page *::after {
  box-sizing: border-box;
}

.sapamefa-manufacturing-page .cap10-container {
  width: min(var(--smf-container-content), calc(100% - var(--smf-gutter) * 2));
  margin-inline: auto;
}

.cap10-section {
  padding-block: var(--smf-section-standard);
}

.cap10-section--machines,
.cap10-section--people,
.cap10-section--process {
  padding-top: var(--smf-space-10);
}

.cap10-section--soft {
  background: var(--smf-color-surface-soft);
}

.cap10-heading {
  width: 100%;
  max-width: none;
  margin: 0 auto var(--smf-space-10);
  text-align: center;
}

.cap10-heading h2 {
  margin: 0;
  color: var(--smf-color-deep);
  font-size: var(--smf-section-heading-title-size);
  font-weight: var(--smf-font-weight-bold);
  line-height: var(--smf-type-section-title-line);
  letter-spacing: var(--smf-type-section-title-tracking);
  text-wrap: balance;
}

.cap10-copy h2 {
  margin: 0 0 var(--smf-space-4);
  color: var(--smf-color-deep);
  font-size: var(--smf-section-heading-row-size);
  font-weight: var(--smf-font-weight-bold);
  line-height: var(--smf-type-section-title-line);
  letter-spacing: var(--smf-type-section-title-tracking);
}

.cap10-heading p:last-child,
.cap10-copy > p {
  margin: var(--smf-space-3) 0 0;
  color: var(--smf-color-text-muted);
  font-size: var(--smf-type-body-size);
  line-height: var(--smf-type-body-line);
}

.cap10-split {
  display: grid;
  gap: var(--smf-space-10);
  align-items: stretch;
}

.cap10-media {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0;
  border: var(--smf-border-width-hairline) solid var(--smf-color-border);
  border-radius: var(--smf-radius-small);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--smf-color-light) 82%, white), var(--smf-color-surface-soft));
  box-shadow: 0 1.25rem 3.5rem color-mix(in srgb, var(--smf-color-deep) 10%, transparent);
}

.cap10-media picture,
.cap10-machine__image picture,
.cap10-media img {
  display: block;
  width: 100%;
  height: 100%;
}

.cap10-media img {
  object-fit: cover;
}

.cap10-media.is-fallback {
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--smf-color-light) 88%, white), var(--smf-color-surface-disabled));
}

.cap10-media--overview,
.cap10-media--quality {
  aspect-ratio: 8 / 5;
}

.cap10-media-fallback {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: none;
  place-items: center;
  padding: 1rem;
  color: var(--smf-color-text-muted);
  font-size: var(--smf-type-xs);
  font-weight: var(--smf-font-weight-semibold);
  line-height: var(--smf-line-note);
  text-align: center;
}

.cap10-media.is-fallback .cap10-media-fallback {
  display: grid;
}

.cap10-points {
  display: grid;
  gap: .75rem;
  margin: 1.6rem 0 0;
  padding: 0;
  list-style: none;
}

.cap10-points li {
  position: relative;
  padding: .9rem 1rem .9rem 2.8rem;
  border: var(--smf-border-width-hairline) solid var(--smf-color-border);
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-surface-soft);
  color: var(--smf-color-text);
  line-height: var(--smf-line-note);
}

.cap10-points li::before {
  content: "✓";
  position: absolute;
  left: 1rem;
  top: .82rem;
  display: grid;
  width: 1.25rem;
  height: 1.25rem;
  place-items: center;
  border-radius: 50%;
  background: var(--smf-color-teal);
  color: var(--smf-color-white);
  font-size: var(--smf-type-2xs);
  line-height: 1;
  font-weight: var(--smf-font-weight-bold);
}

.cap10-machine-gallery {
  display: grid;
  gap: 1.25rem;
}

.cap10-machine-gallery__secondary {
  display: grid;
  gap: 1.25rem;
}

.cap10-machine {
  display: grid;
  overflow: hidden;
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-surface);
  box-shadow: 0 .85rem 2.5rem color-mix(in srgb, var(--smf-color-deep) 8%, transparent);
}

.cap10-machine__image {
  position: relative;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: var(--smf-color-surface-disabled);
}

.cap10-machine--primary .cap10-machine__image {
  aspect-ratio: 16 / 11;
}

.cap10-people-grid {
  display: grid;
  gap: 1.25rem;
  align-items: stretch;
}

.cap10-people-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: var(--smf-border-width-hairline) solid var(--smf-color-border);
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-surface);
  box-shadow: none;
}

.cap10-people-card__media {
  flex: 0 0 auto;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* MANUFACTURING-IMAGE-ASSETS-01
   Match the approved responsive crop ratios so mobile/tablet assets are not
   cropped a second time by the runtime media frame. */
@media (max-width: 39.99rem) {
  .cap10-machine__image,
  .cap10-machine--primary .cap10-machine__image,
  .cap10-people-card__media {
    aspect-ratio: 4 / 5;
  }
}

@media (min-width: 40rem) and (max-width: 63.99rem) {
  .cap10-machine__image,
  .cap10-machine--primary .cap10-machine__image,
  .cap10-people-card__media {
    aspect-ratio: 8 / 5;
  }
}

.cap10-people-card__body {
  flex: 1 1 auto;
  padding: var(--smf-space-5);
}

.cap10-people-card h3 {
  margin: 0 0 var(--smf-space-2);
  color: var(--smf-color-deep);
  font-size: var(--smf-type-feature-card-title-size);
  font-weight: var(--smf-font-weight-semibold);
  line-height: var(--smf-line-title);
  letter-spacing: var(--smf-tracking-normal);
}

.cap10-people-card p {
  margin: 0;
  color: var(--smf-color-text-muted);
  font-size: var(--smf-font-size-xs);
  line-height: var(--smf-line-body);
}

.cap10-media--overview,
.cap10-machine,
.cap10-people-card,
.cap10-media--quality {
  position: relative;
  z-index: 0;
  cursor: pointer;
  will-change: transform;
  box-shadow: none;
  transition:
    transform var(--smf-motion-control) var(--smf-ease-emphasized),
    box-shadow var(--smf-motion-control) var(--smf-ease-standard),
    border-color var(--smf-motion-control) var(--smf-ease-standard),
    background-color var(--smf-motion-control) var(--smf-ease-standard);
}

.cap10-media--overview:focus-within,
.cap10-machine:focus-within,
.cap10-people-card:focus-within,
.cap10-media--quality:focus-within {
  z-index: 2;
  transform: translateY(-8px);
  box-shadow: 0 16px 36px var(--smf-color-teal-10);
}

@media (hover: hover) and (pointer: fine) {
  .cap10-media--overview:hover,
  .cap10-machine:hover,
  .cap10-people-card:hover,
  .cap10-media--quality:hover {
    z-index: 2;
    transform: translateY(-8px);
    box-shadow: 0 16px 36px var(--smf-color-teal-10);
  }
}

.cap10-process-phases,
.cap10-process-steps {
  margin: 0;
  padding: 0;
  list-style: none;
}

.cap10-process-phases {
  display: grid;
  gap: var(--smf-space-10);
}

.cap10-process-phase {
  min-width: 0;
}

.cap10-process-phase__label {
  position: relative;
  display: grid;
  overflow: hidden;
  min-height: var(--smf-space-12);
  margin: 0 0 calc(var(--smf-space-10) / 2 + var(--smf-space-4));
  padding: calc(var(--smf-space-3) + var(--smf-space-1)) var(--smf-space-4) var(--smf-space-3);
  place-items: center;
  border-radius: var(--smf-radius-small);
  background: color-mix(in srgb, var(--smf-color-teal) 30%, var(--smf-color-surface));
  box-shadow: var(--smf-elevation-flat);
  color: var(--smf-color-deep);
  font-size: var(--smf-type-eyebrow-size);
  font-weight: var(--smf-type-eyebrow-weight);
  letter-spacing: var(--smf-type-eyebrow-tracking);
  line-height: var(--smf-type-eyebrow-line);
  text-align: center;
  text-transform: uppercase;
}

.cap10-process-phase__label::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: var(--smf-space-1);
  background: var(--smf-color-teal);
}

.cap10-process-steps {
  --cap10-connector-gap: var(--smf-space-6);
  display: grid;
  gap: var(--cap10-connector-gap);
}

.cap10-process-card {
  position: relative;
  display: grid;
  grid-template-rows: var(--smf-space-8) auto 1fr;
  row-gap: var(--smf-space-3);
  justify-items: center;
  min-width: 0;
  min-height: 100%;
  padding: var(--smf-space-8) var(--smf-space-4) var(--smf-space-5);
  border: var(--smf-border-width-hairline) solid var(--smf-color-border);
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-surface);
  text-align: center;
}

.cap10-process-card::after {
  content: "";
  position: absolute;
  z-index: 2;
  left: 50%;
  top: calc(100% + var(--cap10-connector-gap) / 2);
  width: var(--smf-space-6);
  height: var(--smf-space-3);
  background: currentColor;
  color: var(--smf-color-teal);
  clip-path: polygon(0 40%, 70% 40%, 70% 8%, 100% 50%, 70% 92%, 70% 60%, 0 60%);
  transform: translate(-50%, -50%) rotate(90deg);
}

.cap10-process-card:last-child::after {
  content: none;
}

.cap10-step-number {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  width: var(--smf-space-10);
  height: var(--smf-space-10);
  place-items: center;
  border-radius: 50%;
  background: var(--smf-color-deep);
  color: var(--smf-color-bright);
  font-size: var(--smf-type-meta-size);
  font-weight: var(--smf-font-weight-bold);
  line-height: var(--smf-type-meta-line);
  font-variant-numeric: tabular-nums lining-nums;
}

.cap10-process-card__icon {
  width: var(--smf-space-8);
  height: var(--smf-space-8);
  margin: 0;
  fill: none;
  stroke: var(--smf-color-teal);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cap10-process-card h3 {
  min-width: 0;
  margin: 0;
  color: var(--smf-color-deep);
  font-size: var(--smf-type-feature-card-title-size);
  font-weight: var(--smf-font-weight-semibold);
  line-height: var(--smf-line-title);
}

.cap10-process-card p {
  margin: 0;
  color: var(--smf-color-text-muted);
  font-size: var(--smf-font-size-xs);
  line-height: var(--smf-line-body);
}

.cap10-section--quality {
  background:
    linear-gradient(180deg, var(--smf-color-surface) 0%, var(--smf-color-surface-soft) 100%);
}

.cap10-quality-copy {
  position: relative;
  padding: var(--smf-space-8);
  border-left: var(--smf-border-width-accent) solid var(--smf-color-teal);
  border-radius: var(--smf-radius-small);
  background: var(--smf-color-surface);
  box-shadow: 0 .85rem 2.5rem color-mix(in srgb, var(--smf-color-deep) 7%, transparent);
}

.cap10-quality-copy .cap10-points li {
  padding-block: .75rem;
  background: transparent;
}

.cap10-text-link {
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  min-height: 2.75rem;
  margin-top: 1.5rem;
  padding: .7rem .15rem;
  color: var(--smf-color-teal);
  font-size: var(--smf-type-meta-size);
  font-weight: var(--smf-font-weight-semibold);
  line-height: var(--smf-type-meta-line);
  letter-spacing: var(--smf-tracking-control);
  text-decoration-thickness: .12em;
  text-underline-offset: .25em;
}

.cap10-text-link:hover {
  color: var(--smf-color-deep);
  text-decoration: underline;
}

.cap10-text-link:focus-visible {
  border-radius: var(--smf-radius-small);
  outline: var(--smf-focus-ring);
  outline-offset: var(--smf-focus-offset);
}

@media (min-width: 40rem) {
  .cap10-section--machines,
  .cap10-section--people,
  .cap10-section--process {
    padding-top: var(--smf-space-12);
  }

  .cap10-machine-gallery__secondary,
  .cap10-people-grid,
  .cap10-process-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cap10-people-card:last-child {
    grid-column: 1 / -1;
    width: min(100%, calc(50% - .625rem));
    justify-self: center;
  }

  .cap10-process-card::after {
    content: "";
    left: calc(100% + var(--cap10-connector-gap) / 2 + var(--smf-border-width-hairline) + var(--smf-border-width-hairline));
    top: calc(50% + var(--smf-border-width-hairline));
    transform: translate(-50%, -50%);
  }

  .cap10-process-card:last-child::after {
    content: none;
  }
}

@media (min-width: 64rem) {
  .cap10-section--machines,
  .cap10-section--people,
  .cap10-section--process {
    padding-top: var(--smf-space-14);
  }

  .cap10-split--overview {
    grid-template-columns: minmax(0, 55fr) minmax(0, 45fr);
  }

  .cap10-machine-gallery {
    grid-template-columns: minmax(0, 61fr) minmax(0, 39fr);
    aspect-ratio: 12 / 5;
  }

  .cap10-machine-gallery__secondary {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }

  .cap10-machine--primary,
  .cap10-machine--primary .cap10-machine__image,
  .cap10-machine-gallery__secondary,
  .cap10-machine-gallery__secondary .cap10-machine,
  .cap10-machine-gallery__secondary .cap10-machine__image {
    height: 100%;
  }

  .cap10-machine--primary {
    grid-template-rows: minmax(0, 1fr);
  }

  .cap10-machine--primary .cap10-machine__image,
  .cap10-machine-gallery__secondary .cap10-machine__image {
    aspect-ratio: auto;
  }

  .cap10-people-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cap10-people-card__media {
    aspect-ratio: 8 / 5;
  }

  .cap10-people-card:last-child {
    grid-column: auto;
    width: auto;
  }

  .cap10-process-phases {
    --cap10-connector-gap: var(--smf-space-6);
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0 var(--cap10-connector-gap);
    align-items: stretch;
  }

  .cap10-process-phase {
    display: contents;
  }

  .cap10-process-phase__label {
    grid-row: 1;
  }

  .cap10-process-phase:nth-child(1) > .cap10-process-phase__label {
    grid-column: 1 / 3;
  }

  .cap10-process-phase:nth-child(2) > .cap10-process-phase__label {
    grid-column: 3 / 5;
  }

  .cap10-process-phase:nth-child(3) > .cap10-process-phase__label {
    grid-column: 5 / 7;
  }

  .cap10-process-steps {
    display: contents;
  }

  .cap10-process-card {
    grid-row: 2;
  }

  .cap10-process-card h3 {
    min-height: 2.6em;
  }

  .cap10-process-card:last-child::after {
    content: "";
  }

  .cap10-process-phase:last-child .cap10-process-card:last-child::after {
    content: none;
  }

  .cap10-media--overview,
  .cap10-media--quality {
    height: 100%;
    aspect-ratio: auto;
  }

  .cap10-split--quality {
    grid-template-columns: minmax(0, 44fr) minmax(0, 56fr);
  }
}

@media (max-width: 39.99rem) {
  .cap10-section {
    padding-block: var(--smf-section-standard);
  }

  .cap10-section--machines,
  .cap10-section--people,
  .cap10-section--process {
    padding-top: var(--smf-space-10);
  }

  .cap10-heading {
    text-align: left;
  }

  .cap10-heading h2,
  .cap10-copy h2 {
    overflow-wrap: anywhere;
  }

  .cap10-quality-copy {
    padding: var(--smf-space-5);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sapamefa-manufacturing-page *,
  .sapamefa-manufacturing-page *::before,
  .sapamefa-manufacturing-page *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }

  .cap10-media--overview,
  .cap10-media--overview:hover,
  .cap10-media--overview:focus-within,
  .cap10-machine,
  .cap10-machine:hover,
  .cap10-machine:focus-within,
  .cap10-people-card,
  .cap10-people-card:hover,
  .cap10-people-card:focus-within,
  .cap10-media--quality,
  .cap10-media--quality:hover,
  .cap10-media--quality:focus-within {
    transform: none !important;
    box-shadow: none !important;
    transition: none !important;
  }
}

/* SAPAMEFA_V3.42 — manufacturing approved role mapping. */
.cap10-process-phase__label{
  color:var(--smf-color-text-strong);
  font-size:var(--smf-role-control-text-size);
  font-weight:var(--smf-font-weight-semibold);
  line-height:var(--smf-line-title);
  letter-spacing:.06em;
}
.cap10-step-number{
  background:var(--smf-project-inquiry-form-surface);
  color:var(--smf-color-accent-on-dark);
  font-size:var(--smf-role-control-text-size);
  font-weight:var(--smf-font-weight-bold);
  line-height:var(--smf-line-title);
}
.cap10-process-card h3,
.cap10-people-card h3{
  color:var(--smf-color-text-strong);
  font-size:var(--smf-role-card-title-size);
  font-weight:var(--smf-font-weight-semibold);
  line-height:var(--smf-line-title);
}
.cap10-process-card p,
.cap10-people-card p{
  color:var(--smf-color-text-strong);
  font-size:var(--smf-role-card-description-size);
  font-weight:var(--smf-font-weight-regular);
  line-height:var(--smf-line-lead);
}

@media (min-width:64rem) and (max-width:74.99rem){
  .cap10-process-phases{
    grid-template-columns:1fr;
    gap:var(--smf-space-10);
    align-items:stretch;
  }
  .cap10-process-phase{
    display:block;
    min-width:0;
  }
  .cap10-process-phase__label,
  .cap10-process-phase:nth-child(1)>.cap10-process-phase__label,
  .cap10-process-phase:nth-child(2)>.cap10-process-phase__label,
  .cap10-process-phase:nth-child(3)>.cap10-process-phase__label{
    grid-column:auto;
    grid-row:auto;
  }
  .cap10-process-steps{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--cap10-connector-gap);
  }
  .cap10-process-card{grid-row:auto;}
  .cap10-process-card h3{min-height:0;}
  .cap10-process-card::after{
    content:"";
    left:calc(100% + var(--cap10-connector-gap)/2 + var(--smf-border-width-hairline) + var(--smf-border-width-hairline));
    top:calc(50% + var(--smf-border-width-hairline));
    transform:translate(-50%,-50%);
  }
  .cap10-process-card:last-child::after{content:none;}
}
@media (min-width:75rem) and (max-width:99.99rem){
  .cap10-process-phases{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:var(--smf-space-6);
    align-items:stretch;
  }
  .cap10-process-phase{
    display:grid;
    grid-template-rows:auto 1fr;
    min-width:0;
  }
  .cap10-process-phase__label,
  .cap10-process-phase:nth-child(1)>.cap10-process-phase__label,
  .cap10-process-phase:nth-child(2)>.cap10-process-phase__label,
  .cap10-process-phase:nth-child(3)>.cap10-process-phase__label{
    grid-column:auto;
    grid-row:auto;
  }
  .cap10-process-steps{
    display:grid;
    grid-template-columns:1fr;
    gap:var(--cap10-connector-gap);
  }
  .cap10-process-card{grid-row:auto;}
  .cap10-process-card h3{min-height:0;}
  .cap10-process-card::after{
    content:"";
    left:50%;
    top:calc(100% + var(--cap10-connector-gap)/2);
    transform:translate(-50%,-50%) rotate(90deg);
  }
  .cap10-process-card:last-child::after{content:none;}
}


/* SAPAMEFA_V3.42 — final heading alignment after QA.
   Keep desktop headings centered and allow natural wrapping on smaller widths. */
.cap10-section--people .cap10-heading,
.cap10-section--process .cap10-heading{
  width:100%;
  max-width:none;
  margin-inline:auto;
  text-align:center;
}
#cap10-people-title,
#cap10-process-title{
  white-space:normal;
  text-wrap:pretty;
  word-break:normal;
  overflow-wrap:normal;
}
.cap10-section--people .cap10-heading p,
.cap10-section--process .cap10-heading p{
  width:100%;
  max-width:none;
  margin-inline:auto;
  text-align:center;
}
.cap10-process-card{
  grid-template-rows:auto auto 1fr;
}
.cap10-process-card h3{
  min-height:0;
}

/* CAPACITY-PROCESS-UPDATE — remove step connectors only on the manufacturing process. */
.sapamefa-manufacturing-page .cap10-section--process .cap10-process-card::after {
  content: none;
}
