/**
 * V16.13 — Final assisted-commerce identity.
 * Grounded in the supplied final design-system screens.
 */

:root {
  --als-v16-primary: #00321c;
  --als-v16-primary-container: #004b2c;
  --als-v16-deep: #053120;
  --als-v16-gold: #f0bf6b;
  --als-v16-gold-bright: #ffcc78;
  --als-v16-gold-dark: #7d580a;
  --als-v16-background: #f9f9f7;
  --als-v16-ivory: #f9f9f7;
  --als-v16-sand: #eeeeec;
  --als-v16-surface: #fff;
  --als-v16-surface-low: #f4f4f2;
  --als-v16-surface-high: #e8e8e6;
  --als-v16-text: #1a1c1b;
  --als-v16-muted: #404942;
  --als-v16-outline: #bfc9c0;
  --als-v16-outline-strong: #707971;
  --als-v16-shell: 1280px;
  --als-v16-shadow-sm: 0 2px 10px rgba(26,28,27,.055);
  --als-v16-shadow: 0 16px 42px rgba(26,28,27,.11);
  --als-v16-radius-sm: 4px;
  --als-v16-radius: 8px;
  --als-v16-radius-lg: 12px;
  --als-v1613-focus: 0 0 0 3px rgba(42,106,72,.18);
}

html { scroll-behavior: smooth; }
body {
  background: var(--als-v16-background);
  color: var(--als-v16-text);
  font-family: "IBM Plex Sans Arabic", Arial, sans-serif;
}
body:not(.rtl) { font-family: Inter, Arial, sans-serif; }
.als-v16-shell,
.als-v164-section.als-v16-shell,
.als-v168-shell {
  max-width: var(--als-v16-shell);
  padding-inline: 64px;
}
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--als-v16-primary);
  outline-offset: 2px;
}

/* Global shell and footer identity */
.als-v16-header,
.site-header,
.als-v16-header__main {
  background: rgba(249,249,247,.96);
  border-color: var(--als-v16-outline);
  backdrop-filter: blur(14px);
}
.als-v16-header__main-inner { max-width: 1280px; }
.als-v16-main-nav a,
.als-v16-action-item { color: var(--als-v16-muted); }
.als-v16-main-nav a:hover,
.als-v16-main-nav .current-menu-item > a,
.als-v16-main-nav .current_page_item > a { color: var(--als-v16-primary); }

.site-footer,
.als-v16-footer,
footer.als-v16-footer {
  background: var(--als-v16-surface-high) !important;
  border-top: 1px solid var(--als-v16-outline) !important;
  color: var(--als-v16-text) !important;
}
.site-footer a,
.site-footer p,
.site-footer li,
.als-v16-footer a,
.als-v16-footer p,
.als-v16-footer li { color: var(--als-v16-muted) !important; }
.site-footer h2,
.site-footer h3,
.site-footer h4,
.als-v16-footer h2,
.als-v16-footer h3,
.als-v16-footer h4 { color: var(--als-v16-primary) !important; }
.site-footer img,
.als-v16-footer img {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}

/* Homepage: final design-system rhythm */
.als-v164-home-page { background: var(--als-v16-background); }
.als-v164-home-hero {
  background: var(--als-v16-background);
  border-bottom: 1px solid var(--als-v16-outline);
  padding-block: 48px;
}
.als-v164-home-hero__grid {
  align-items: center;
  gap: 24px;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
}
.als-v164-home-hero__content { max-width: 590px; }
.als-v164-home-hero__content h1 {
  color: var(--als-v16-primary);
  font-size: clamp(34px,4vw,48px);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.17;
  margin-bottom: 20px;
}
.als-v164-home-hero__content > p {
  color: var(--als-v16-muted);
  font-size: 18px;
  line-height: 1.7;
}
.als-v164-home-hero__media {
  aspect-ratio: 16 / 10;
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  box-shadow: none;
  min-height: 0;
}
.als-v164-home-hero__media img { object-fit: cover; }
.als-v164-btn {
  border-radius: 4px;
  min-height: 44px;
  padding: 11px 24px;
}
.als-v164-btn.is-primary { background: var(--als-v16-primary); }
.als-v164-btn.is-outline {
  background: transparent;
  border-color: var(--als-v16-outline-strong);
  color: var(--als-v16-text);
}
.als-v164-location-link { color: var(--als-v16-primary); }
.als-v164-trust-strip {
  border-top: 1px solid var(--als-v16-outline);
  gap: 12px;
  margin-top: 24px;
  padding-top: 20px;
}
.als-v164-section { padding-block: 48px; }
.als-v164-soft-section { background: var(--als-v16-surface-low); }
.als-v164-section-head h2 {
  color: var(--als-v16-primary);
  font-size: clamp(27px,3vw,32px);
  line-height: 1.25;
}
.als-v164-section-head > span,
.als-v164-eyebrow { color: var(--als-v16-gold-dark); }
.als-v164-material-grid > a,
.als-v164-space-grid > a,
.als-v164-start-card,
.als-v164-products-grid article,
.als-v164-case-grid article,
.als-v164-home-guides a {
  border-radius: 8px !important;
  box-shadow: none !important;
  border: 1px solid var(--als-v16-outline);
}
.als-v164-material-grid > a:hover,
.als-v164-space-grid > a:hover,
.als-v164-start-card:hover,
.als-v164-products-grid article:hover {
  box-shadow: var(--als-v16-shadow-sm) !important;
  transform: translateY(-2px);
}
.als-viz-home-card {
  background: var(--als-v16-surface-low);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  box-shadow: none;
  gap: 24px;
  grid-template-columns: 1fr 1fr;
  margin-block: 48px;
  overflow: hidden;
  padding: 0;
}
.als-viz-home-card__content { padding: 48px; }
.als-viz-home-card__content h2 { color: var(--als-v16-primary); font-size: 32px; }
.als-viz-home-card__content a {
  background: var(--als-v16-primary);
  border-radius: 4px;
  color: #fff;
  min-height: 44px;
}
.als-viz-home-card__preview { min-height: 360px; }
.als-viz-home-card__preview img { height: 100%; object-fit: cover; }

/* Product detail: disciplined assisted-commerce layout */
.als-v168-product {
  background: var(--als-v16-background);
  color: var(--als-v16-text);
}
.als-v168-product-breadcrumb {
  color: var(--als-v16-muted);
  padding-block: 24px;
}
.als-v168-product-hero {
  align-items: start;
  gap: 24px;
  grid-template-columns: minmax(0,5fr) minmax(0,7fr);
  padding-bottom: 48px;
}
.als-v168-product-summary {
  gap: 24px;
  order: 1;
}
.als-v168-gallery {
  order: 2;
  position: sticky;
  top: 112px;
}
.als-v168-product-heading h1 {
  color: var(--als-v16-text);
  font-size: clamp(34px,4vw,48px);
  letter-spacing: -.02em;
  line-height: 1.18;
}
.als-v168-product-type { color: var(--als-v16-gold-dark); }
.als-v168-product-code { color: var(--als-v16-muted); }
.als-v169-price-card {
  background: var(--als-v16-surface-low);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  gap: 16px;
  padding: 16px;
}
.als-v168-product-price {
  color: var(--als-v16-primary);
  font-size: clamp(24px,3vw,32px);
  font-weight: 700;
}
.als-v1613-product-visualizer {
  align-items: center;
  background: var(--als-v16-primary);
  border: 1px solid var(--als-v16-primary);
  border-radius: 4px;
  color: #fff !important;
  display: flex;
  font-weight: 700;
  gap: 10px;
  justify-content: center;
  min-height: 48px;
  padding: 12px 18px;
  text-decoration: none;
}
.als-v1613-product-visualizer:hover { background: var(--als-v16-primary-container); }
.als-v168-options,
.als-v168-product-actions,
.als-v168-product-note {
  border-color: var(--als-v16-outline);
  border-radius: 8px;
}
.als-v168-routes { gap: 12px; }
.als-v168-routes .als-sp-path-card {
  background: var(--als-v16-surface);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  min-height: 132px;
}
.als-v168-routes .als-sp-path-card.is-selected,
.als-v168-routes .als-sp-path-card:hover {
  border-color: var(--als-v16-primary);
  box-shadow: var(--als-v1613-focus);
}
.als-v168-main-image {
  aspect-ratio: 4 / 3;
  background: var(--als-v16-surface-low);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
}
.als-v168-main-image img { object-fit: contain; }
.als-v168-thumbs button {
  border-radius: 4px;
  height: 84px;
  width: 84px;
}
.als-v168-section { padding-block: 48px; }
.als-v168-section-head h2 { color: var(--als-v16-primary); font-size: 32px; }
.als-v168-feature-grid article,
.als-v168-pattern-grid article,
.als-v168-space-grid article,
.als-v168-related-grid article {
  background: var(--als-v16-surface);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  box-shadow: none;
}
.als-v168-product-cta {
  background: var(--als-v16-primary);
  border-radius: 8px;
  color: #fff;
  margin-bottom: 48px;
}
.als-v168-product-cta h2,
.als-v168-product-cta p { color: #fff; }

/* Visualizer: focused, reliable and accessible */
.als-viz {
  background: var(--als-v16-background);
  color: var(--als-v16-text);
}
.als-viz-landing { background: var(--als-v16-background); }
.als-viz-hero {
  align-items: center;
  gap: 24px;
  grid-template-columns: 1fr 1fr;
  padding-block: 48px;
}
.als-viz-hero__content h1 {
  color: var(--als-v16-primary);
  font-size: clamp(34px,4vw,48px);
  line-height: 1.18;
}
.als-viz-hero__content > p { color: var(--als-v16-muted); font-size: 18px; }
.als-viz-btn {
  border-radius: 4px;
  min-height: 48px;
}
.als-viz-btn.is-primary { background: var(--als-v16-primary); }
.als-viz-btn.is-outline { border-color: var(--als-v16-outline-strong); color: var(--als-v16-text); }
.als-viz-hero__demo,
.als-viz-intent button,
.als-viz-faq details,
.als-viz-final > div {
  border-radius: 8px;
  box-shadow: none;
}
.als-viz-app {
  background: var(--als-v16-surface-low);
  min-height: 100vh;
}
.als-viz-appbar {
  background: rgba(249,249,247,.98);
  border-bottom: 1px solid var(--als-v16-outline);
  position: sticky;
  top: 0;
  z-index: 90;
}
.als-viz-appbar > .als-v16-shell {
  min-height: 72px;
}
.als-viz-steps li { color: var(--als-v16-muted); }
.als-viz-steps li span {
  background: var(--als-v16-surface-high);
  border: 1px solid var(--als-v16-outline);
  color: var(--als-v16-muted);
}
.als-viz-steps li.is-active,
.als-viz-steps li.is-complete { color: var(--als-v16-primary); }
.als-viz-steps li.is-active span,
.als-viz-steps li.is-complete span {
  background: var(--als-v16-primary);
  border-color: var(--als-v16-primary);
  color: #fff;
}
.als-viz-workspace { padding-block: 48px 96px; }
.als-viz-panel {
  background: var(--als-v16-surface);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  box-shadow: var(--als-v16-shadow-sm);
  padding: 24px;
}
.als-viz-panel__head { border-bottom: 1px solid var(--als-v16-outline); padding-bottom: 24px; }
.als-viz-panel__head h1 { color: var(--als-v16-primary); font-size: 32px; }
.als-viz-panel__head p { color: var(--als-v16-muted); }
.als-viz-mode-switch button,
.als-viz-room-methods button,
.als-viz-product-card,
.als-viz-dropzone,
.als-viz-photo-editor,
.als-viz-result-card,
.als-viz-tuning,
.als-viz-request-choice label,
.als-viz-request-form,
.als-viz-save-only {
  border-radius: 8px;
}
.als-viz-product-card,
.als-viz-request-choice label {
  border: 1px solid var(--als-v16-outline);
}
.als-viz-product-card.is-selected,
.als-viz-request-choice label.is-selected {
  border-color: var(--als-v16-primary);
  box-shadow: var(--als-v1613-focus);
}
.als-viz-selection-bar,
.als-viz-panel-nav {
  background: var(--als-v16-surface-low);
  border-color: var(--als-v16-outline);
}
.als-viz-selection-bar button,
.als-viz-panel-nav .is-primary,
.als-viz-submit,
.als-viz-save-only button {
  background: var(--als-v16-primary);
  border-radius: 4px;
  color: #fff;
  min-height: 48px;
}
.als-viz-request-form {
  background: var(--als-v16-surface);
  border: 1px solid var(--als-v16-outline);
  padding: 24px;
}
.als-viz-request-form input,
.als-viz-request-form select,
.als-viz-request-form textarea {
  background: var(--als-v16-surface);
  border: 1px solid var(--als-v16-outline);
  border-radius: 4px;
  color: var(--als-v16-text);
  min-height: 44px;
}
.als-viz-request-form input:focus,
.als-viz-request-form select:focus,
.als-viz-request-form textarea:focus {
  border-color: var(--als-v16-primary);
  box-shadow: var(--als-v1613-focus);
}
.als-viz-request-form small[data-viz-error] {
  color: #ba1a1a;
  display: block;
  min-height: 18px;
  padding-top: 4px;
}
.als-viz-form-status {
  border-radius: 4px;
  min-height: 0;
  padding: 0;
}
.als-viz-form-status:not(:empty) {
  background: rgba(0,75,44,.08);
  border: 1px solid rgba(0,75,44,.2);
  color: var(--als-v16-primary);
  margin-top: 12px;
  padding: 12px;
}
.als-viz-form-status.is-error:not(:empty) {
  background: #ffdad6;
  border-color: rgba(186,26,26,.3);
  color: #93000a;
}
.als-viz-request-form.is-submitting {
  opacity: .78;
  pointer-events: none;
  position: relative;
}
.als-viz-request-form.is-submitting::after {
  animation: als-v1613-spin .8s linear infinite;
  border: 3px solid rgba(0,50,28,.2);
  border-top-color: var(--als-v16-primary);
  border-radius: 50%;
  content: "";
  height: 28px;
  inset: 50% auto auto 50%;
  position: absolute;
  transform: translate(-50%,-50%);
  width: 28px;
}
@keyframes als-v1613-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }

.als-viz-success {
  align-items: center;
  background: var(--als-v16-surface);
  border: 1px solid var(--als-v16-outline);
  min-height: 520px;
  padding: 64px 24px;
  text-align: center;
}
.als-viz-success > .material-symbols-outlined {
  background: var(--als-v16-primary);
  border-radius: 50%;
  color: #fff;
  display: grid;
  font-size: 34px;
  height: 68px;
  place-items: center;
  width: 68px;
}
.als-viz-success h1 { color: var(--als-v16-primary); font-size: 32px; }
.als-viz-reference {
  background: var(--als-v16-surface-low);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
}
.als-v1613-next-steps {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3,1fr);
  margin: 28px auto;
  max-width: 780px;
}
.als-v1613-next-steps article {
  background: var(--als-v16-surface-low);
  border: 1px solid var(--als-v16-outline);
  border-radius: 8px;
  padding: 18px;
}
.als-v1613-next-steps span { color: var(--als-v16-primary); font-size: 28px; }
.als-v1613-next-steps strong { display: block; margin: 8px 0 4px; }
.als-v1613-next-steps p { color: var(--als-v16-muted); font-size: 13px; margin: 0; }

.als-v1613-server-error {
  background: #ffdad6;
  border: 1px solid rgba(186,26,26,.25);
  border-radius: 8px;
  color: #93000a;
  margin: 24px auto;
  max-width: 820px;
  padding: 16px;
}

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

@media (max-width: 1024px) {
  .als-v16-shell,
  .als-v164-section.als-v16-shell,
  .als-v168-shell { padding-inline: 32px; }
  .als-v168-product-hero { grid-template-columns: 1fr; }
  .als-v168-gallery { order: 1; position: static; }
  .als-v168-product-summary { order: 2; }
  .als-viz-steps li { font-size: 11px; }
}

@media (max-width: 767px) {
  .als-v16-shell,
  .als-v164-section.als-v16-shell,
  .als-v168-shell { padding-inline: 16px; }
  .als-v164-home-hero { padding-block: 32px; }
  .als-v164-home-hero__grid,
  .als-viz-hero,
  .als-viz-home-card { grid-template-columns: 1fr; }
  .als-v164-home-hero__content h1,
  .als-viz-hero__content h1 { font-size: 32px; }
  .als-v164-home-hero__media { aspect-ratio: 4 / 3; }
  .als-v164-trust-strip { grid-template-columns: repeat(2,1fr); }
  .als-viz-home-card { margin-inline: 16px; }
  .als-viz-home-card__content { padding: 28px 20px; }
  .als-viz-home-card__preview { min-height: 260px; }
  .als-v164-section { padding-block: 36px; }

  .als-v168-product-breadcrumb { overflow-x: auto; white-space: nowrap; }
  .als-v168-product-hero { gap: 28px; padding-bottom: 32px; }
  .als-v168-product-heading h1 { font-size: 32px; }
  .als-v168-main-image { aspect-ratio: 1 / 1; }
  .als-v168-routes { grid-template-columns: 1fr; }
  .als-v168-routes .als-sp-path-card { min-height: 0; }
  .als-v168-feature-grid,
  .als-v168-pattern-grid,
  .als-v168-space-grid,
  .als-v168-related-grid { grid-template-columns: 1fr; }
  .als-v168-section-head h2 { font-size: 27px; }

  .als-viz-appbar > .als-v16-shell { min-height: 58px; }
  .als-viz-appbar__brand img { max-height: 38px; }
  .als-viz-steps {
    gap: 5px;
    overflow-x: auto;
    padding-block: 8px;
    scrollbar-width: none;
  }
  .als-viz-steps::-webkit-scrollbar { display: none; }
  .als-viz-steps li { flex: 0 0 auto; min-width: 86px; }
  .als-viz-appbar__actions { display: none; }
  .als-viz-workspace { padding-block: 20px 96px; }
  .als-viz-panel { padding: 16px; }
  .als-viz-panel__head h1 { font-size: 26px; }
  .als-viz-form-grid,
  .als-viz-request-choice,
  .als-v1613-next-steps { grid-template-columns: 1fr; }
  .als-viz-result-actions { overflow-x: auto; }
  .als-viz-success { min-height: 460px; padding: 42px 16px; }
}

.is-v1613-reveal { opacity: .001; transform: translateY(16px); transition: opacity .45s ease, transform .45s ease; }
.is-v1613-reveal.is-v1613-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .is-v1613-reveal { opacity: 1; transform: none; } }