/* Final contrast layer for live previews. Keep foreground and surface paired. */
.button-whatsapp,
.wa-rep-card .button-whatsapp,
.contact-details .sales-actions .button-whatsapp {
  background: #147a3a !important;
  border-color: #35b66a !important;
  color: #fff !important;
  box-shadow: inset 0 1px rgba(255,255,255,.22), 0 8px 20px rgba(0,0,0,.2) !important;
}
.button-whatsapp:hover,
.button-whatsapp:focus-visible {
  background: #116b35 !important;
  color: #fff !important;
}
.button-whatsapp svg,
.button-whatsapp .wa-btn-icon,
.button-whatsapp span { color: inherit !important; fill: currentColor !important; }

.contact-details .sales-card {
  background: #f3f0e8 !important;
  border-color: #d7cbb7 !important;
  color: #1d1e1b !important;
  box-shadow: inset 0 1px #fff, 0 12px 30px rgba(0,0,0,.16) !important;
}
.contact-details .sales-card .sales-role,
.contact-details .sales-card p { color: #444941 !important; }
.contact-details .sales-card h3,
.contact-details .sales-card .sales-email-link { color: #171816 !important; }
.contact-details .sales-actions .button-call {
  background: #24344a !important;
  border-color: #24344a !important;
  color: #fff !important;
}
.contact-details .sales-actions .button-call:hover,
.contact-details .sales-actions .button-call:focus-visible {
  background: #172536 !important;
  color: #fff !important;
}

.cta-section .quote-direct-email {
  display: inline-block;
  margin-top: 14px;
  color: #f3c98d;
  font: 700 13px Manrope, sans-serif;
  text-decoration: underline;
  text-underline-offset: 4px;
  overflow-wrap: anywhere;
}
.cta-section .quote-direct-email:hover,
.cta-section .quote-direct-email:focus-visible { color: #fff; }
.site-footer .footer-email-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 10px;
  padding: 10px 16px;
  border: 1px solid #e2b469;
  border-radius: 999px;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}
.site-footer .footer-email-link:hover,
.site-footer .footer-email-link:focus-visible { background: #e2b469; color: #172536; }

/* Keep manufacturing facts crisp on the pale section background. */
.proof-stats-grid .proof-stat-card {
  background: #202832;
  border-color: #46515f;
  box-shadow: 0 12px 28px rgba(18, 25, 31, .18);
}
.proof-stats-grid .proof-stat-card .proof-label { color: #f4f5f2; }
.proof-stats-grid .proof-stat-card p { color: #d9e1e9; }

/* Mouse-driven 3D: transitions must not fight the pointer. */
.spc-3d-viewport.is-dragging { cursor: grabbing; }
.spc-3d-plank-assembly.is-dragging { transition: none; }
.spc-3d-drag-hint {
  margin: -4px 0 16px;
  color: #c9d3dc;
  font: 500 12px/1.5 Manrope, sans-serif;
}

/* The detail cards remain legible when the 3D sidebar gets narrow. */
.plank-layers-stack .plank-layer { cursor: pointer; min-width: 0; }
.plank-layers-stack .layer-info { min-width: 0; }
.plank-layers-stack .layer-badge { max-width: 100%; overflow-wrap: anywhere; white-space: normal; text-align: center; }
@media (max-width: 1250px) {
  .plank-layers-stack .plank-layer {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: 8px 14px;
  }
  .plank-layers-stack .layer-badge { grid-column: 2; justify-self: start; }
}
@media (max-width: 480px) {
  .plank-layers-stack .plank-layer { padding: 15px; gap: 7px 10px; }
  .plank-layers-stack .layer-info strong { font-size: 14px; }
  .plank-layers-stack .layer-info p { font-size: 12px; }
  .spc-3d-drag-hint { font-size: 11px; }
}

.freight-hud-card .motion-control,
.freight-scene .motion-control {
  background: #294d54 !important;
  border-color: #8daeb0 !important;
  color: #fff !important;
}
.freight-hud-card .lane-options .lane-pill {
  background: #1c3744 !important;
  border-color: #78909b !important;
  color: #fff !important;
}
.freight-hud-card .lane-options .lane-pill .lane-title { color: #fff !important; }
.freight-hud-card .lane-options .lane-pill .lane-badge {
  background: #e2b469 !important;
  border-color: #e2b469 !important;
  color: #14212a !important;
}
.freight-hud-card .lane-options .lane-pill.active,
.freight-hud-card .lane-options .lane-pill:hover {
  background: #285962 !important;
  border-color: #e2b469 !important;
}
.freight-hud-card .lane-summary { color: #d4e1e7 !important; }
.freight-hud-card .route-status { color: #d4e1e7 !important; }
.freight-hud-card .lane-planning-note {
  margin: 14px 0 0;
  color: #c8d8df;
  font-size: 12px;
  line-height: 1.55;
}
.freight-hud-card .lane-regions { margin: 20px 0 18px; }
.freight-hud-card .lane-region { padding: 12px 0 4px; border-top: 1px solid rgba(200,216,223,.2); }
.freight-hud-card .lane-region-title {
  display: block;
  color: #e2b469;
  font: 700 10px "DM Mono", monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.freight-hud-card .lane-region .lane-options { margin: 10px 0 6px; }
.freight-hud-card .lane-region .lane-pill { min-height: 44px; }
@media (max-width: 600px) {
  .freight-hud-card .freight-scene-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .freight-hud-card .motion-control {
    align-self: flex-start;
    flex: none;
    min-width: 132px;
    white-space: nowrap;
  }
  .freight-hud-card .lane-region .lane-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .freight-hud-card .lane-region .lane-pill {
    width: 100% !important;
    min-height: 72px;
    padding: 9px 11px !important;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center !important;
    gap: 5px;
    border-radius: 16px;
    text-align: left;
  }
  .freight-hud-card .lane-region .lane-title { font-size: 11px; line-height: 1.2; }
  .freight-hud-card .lane-region .lane-badge { font-size: 9px; }
}

/* Keep the visible wood film above the opaque core in the assembled 3D stack. */
.spc-3d-plank-assembly .slab-layer-1 { transform: translateZ(14px); }
.spc-3d-plank-assembly .slab-layer-2 { transform: translateZ(11px); }
.spc-3d-plank-assembly .slab-layer-3 { transform: translateZ(8px); }
.spc-3d-plank-assembly .slab-layer-4 { transform: translateZ(0); }
.spc-3d-plank-assembly .slab-layer-5 { transform: translateZ(-6px); }
.spc-3d-plank-assembly .slab-layer-6 { transform: translateZ(-10px); }
.spc-3d-plank-assembly .slab-uv-gloss {
  background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.02) 46%, rgba(255,255,255,.11));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.spc-3d-plank-assembly .slab-wear-clear { background: rgba(225,238,255,.06); }
.plank-layers-stack .plank-layer.highlight,
.plank-layers-stack .plank-layer:focus-visible {
  border-color: #e2b469;
  background: rgba(226,180,105,.14);
  box-shadow: inset 3px 0 #e2b469;
}
.freight-hud-card .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.section-dark .button-outline:not(.button-whatsapp),
.freight-hud-card .button-outline:not(.motion-control) {
  background: #29444b !important;
  border-color: #8daeb0 !important;
  color: #fff !important;
}

/* A compact, continuously moving quality strip replaces the oversized document wall. */
.quality-strip {
  padding: 30px 0 22px;
  overflow: hidden;
  color: #f5f1e7;
  background: #17211d;
  border-block: 1px solid rgba(226,180,105,.25);
  scroll-margin-top: 90px;
}
.quality-strip-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 22px;
  margin-bottom: 22px;
}
.quality-strip-heading .eyebrow { margin: 0 0 8px; color: #e2b469; }
.quality-strip-heading h2 {
  margin: 0;
  font-size: clamp(24px, 2.7vw, 38px);
  line-height: 1.15;
  letter-spacing: -.035em;
}
.quality-strip-heading h2 em { color: #e2b469; }
.quality-strip-link {
  flex: none;
  color: #f9d396;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 5px;
}
.quality-strip-link:focus-visible { outline: 2px solid #e2b469; outline-offset: 5px; }
.quality-strip-viewport { overflow: hidden; }
.quality-strip-track {
  display: flex;
  width: max-content;
  animation: quality-slide 32s linear infinite;
  will-change: transform;
}
.quality-strip:hover .quality-strip-track,
.quality-strip:focus-within .quality-strip-track { animation-play-state: paused; }
body.motion-paused .quality-strip-track { animation-play-state: paused; }
.quality-strip-items {
  flex: none;
  display: flex;
  align-items: center;
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0 12px 0 0;
}
.quality-strip-items li {
  flex: none;
  padding: 10px 15px;
  border: 1px solid rgba(226,180,105,.28);
  border-radius: 999px;
  background: rgba(226,180,105,.08);
  color: #f5f1e7;
  font-size: 13px;
  line-height: 1.2;
  white-space: nowrap;
}
.quality-strip-note {
  margin-top: 17px;
  margin-bottom: 0;
  color: #b9c5bb;
  font-size: 11px;
  line-height: 1.45;
}
@keyframes quality-slide { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .quality-strip-track { animation: none; }
  .quality-strip-viewport { overflow-x: auto; }
}
@media (max-width: 640px) {
  .quality-strip { padding: 24px 0 18px; }
  .quality-strip-heading { display: block; margin-bottom: 16px; }
  .quality-strip-heading h2 { font-size: 25px; }
  .quality-strip-link { display: inline-block; margin-top: 12px; }
  .quality-strip-items li { font-size: 11px; padding: 9px 12px; }
}

/* Factory certification badges — static, centered, wraps on small screens */
.cert-badge-head { margin: 18px 0 14px; text-align: center; }
.cert-badge-head .eyebrow { margin: 0; color: #e2b469; letter-spacing: .14em; font-size: 12px; }
.cert-badge-viewport { overflow: visible; }
.cert-badge-track { display: flex; justify-content: center; width: auto; }
.cert-badge-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  gap: 22px 34px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.cert-badge-items li {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  width: 104px;
}
.cert-badge-items li img {
  width: 84px;
  height: 84px;
  display: block;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}
.cert-badge-items li span {
  font-size: 11px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #d9cbb0;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}
@media (max-width: 640px) {
  .cert-badge-items { gap: 18px 20px; }
  .cert-badge-items li { width: 84px; }
  .cert-badge-items li img { width: 68px; height: 68px; }
}

/* Hero samples show the real matching product image, not unrelated room scenes. */
.studio-room { background: #1c2421; }
.studio-room > img { object-fit: cover !important; object-position: center !important; }
@media (min-width: 1101px) and (max-width: 1449px) {
  .studio-stage { height: 610px; }
}
@media (max-width: 600px) {
  .spc-3d-viewport { height: 270px; }
  .spc-3d-plank-assembly { transform: rotateX(62deg) rotateZ(-32deg); }
}

/* Shipping worked-example panel: light text on its dark surface */
.landed-cost-worked-example { color: #e8e6df; }
.landed-cost-worked-example h3,
.landed-cost-worked-example strong { color: #ffffff; }
.landed-cost-worked-example p,
.landed-cost-worked-example li,
.landed-cost-worked-example small { color: #c4c9cf; }
.landed-cost-worked-example .status-badge-gold,
.landed-cost-worked-example .worked-rate,
.landed-cost-worked-example .timeline-step,
.landed-cost-worked-example .timeline-duration,
.landed-cost-worked-example .timeline-arrow { color: #e7ad52; }

/* WhatsApp chooser: call buttons and room for the close button */
.whatsapp-chooser-modal .wa-chooser-header { padding-right: 56px; }
.whatsapp-chooser-modal .status-badge-green { white-space: normal; }
.whatsapp-chooser-modal .wa-modal-call { margin-top: 10px; justify-content: center; }

/* Readable intros on dark sections and category tags on light cards */
.section-dark .section-lede { color: #b9bdb3 !important; }
#product-showcase .product-category { color: #ffefcf !important; }

/* Shipping on phones: fit the whole route map to the screen width (no half-clipping),
   and tighten the port buttons so the section is shorter and fits. */
@media (max-width: 600px) {
  .logistics-map.map-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .logistics-map.map-scroll svg,
  #freight-map { min-width: 0; width: 100%; height: auto; }
  .freight-hud-card .lane-region .lane-pill {
    min-height: 54px;
    padding: 7px 10px !important;
    gap: 3px;
    border-radius: 13px;
  }
  .freight-hud-card .lane-region .lane-title { font-size: 10.5px; }
  .freight-hud-card .lane-region .lane-badge { font-size: 8.5px; padding: 3px 7px; }
}
