/* experience-visuals-20261024.css */
/* Native service scenes and layered office visual. Original green/gold tokens. */
.experience-hero { min-width: 0; width: 100%; padding: 24px; border: 1px solid #ddc58d40; border-radius: 22px; background: var(--green-deep); color: var(--paper); box-shadow: 0 24px 60px #001b182b; overflow: hidden; }
.experience-brand { display: flex; align-items: center; gap: 12px; padding-inline: 8px; }
.experience-brand img { flex: 0 0 46px; width: 46px; height: 46px; object-fit: contain; }
.experience-brand strong { display: block; color: var(--paper); font-size: 20px; line-height: 1.5; }
.experience-brand span { display: block; color: #f5f2eac4; font-size: 12px; line-height: 1.7; }
.experience-stage { position: relative; width: 100%; aspect-ratio: 540 / 420; margin-block: 8px; isolation: isolate; }
.experience-scene { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .4s ease, transform .4s ease, visibility .4s; pointer-events: none; }
[data-experience-hero][data-active="documents"] [data-experience-scene="documents"],
[data-experience-hero][data-active="plans"] [data-experience-scene="plans"],
[data-experience-hero][data-active="logistics"] [data-experience-scene="logistics"] { opacity: 1; visibility: visible; transform: translateY(0); }
.experience-scene .experience-ground { fill: #001e1b47; }
.experience-scene .experience-glass { fill: #ffffff05; stroke: #ddc58d33; stroke-width: 1; }
.experience-scene .experience-fine-line { stroke: #ddc58d25; stroke-width: 1; }
.experience-scene .experience-gold-fill { fill: var(--gold-light); }
.experience-scene .experience-green-fill { fill: var(--green); }
.experience-scene .experience-paper-line { stroke: #78928b; stroke-width: 5; stroke-linecap: round; opacity: .65; }
.experience-scene .experience-paper-soft { fill: #dbe5dc; }
.experience-scene .experience-fold { fill: #d8d6c7; stroke: #c3c8b9; stroke-width: 1; }
.experience-scene .experience-check-line { stroke: var(--green); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.experience-scene .experience-gold-soft { fill: #ddc58d12; stroke: #ddc58d40; }
.experience-scene .experience-gold-line { stroke: var(--gold-light); stroke-width: 3; stroke-linecap: round; }
.experience-scene .experience-plan-paper { fill: var(--paper); stroke: #e1d5b7; stroke-width: 1; }
.experience-scene .experience-plan-grid { stroke: #2c635635; stroke-width: 1; }
.experience-scene .experience-plan-walls { stroke: var(--green); stroke-width: 6; stroke-linejoin: round; }
.experience-scene .experience-roof { fill: var(--gold-light); stroke: #f6e5ba; stroke-width: 1; }
.experience-scene .experience-building-front { fill: var(--paper); }
.experience-scene .experience-building-side { fill: #c9d5ca; }
.experience-scene .experience-window { fill: var(--green); opacity: .8; }
.experience-scene .experience-side-window { fill: #396653; }
.experience-scene .experience-door { fill: #9cb1a1; }
.experience-scene .experience-route { stroke: var(--gold-light); stroke-width: 2; stroke-dasharray: 5 10; stroke-linecap: round; opacity: .7; }
.experience-scene .experience-box-top { fill: #ead4a6; }
.experience-scene .experience-box-front { fill: #c2a36d; }
.experience-scene .experience-box-side { fill: #a98a53; }
.experience-scene .experience-box-tape { fill: #f1e5c8; }
.experience-scene .experience-box-mark { stroke: #725e3c; stroke-width: 3; stroke-linecap: round; }
.experience-scene .experience-truck-box { fill: var(--paper); }
.experience-scene .experience-truck-cab { fill: var(--gold-light); }
.experience-scene .experience-truck-window { fill: var(--green); }
.experience-scene .experience-truck-base { stroke: #c8c6b4; stroke-width: 9; stroke-linecap: round; }
.experience-scene .experience-wheel { fill: #183d35; stroke: #aec0b0; stroke-width: 3; }
.experience-scene .experience-wheel-center { fill: #bfcebf; }
.experience-float { animation: experienceFloat 6s ease-in-out infinite alternate; }
.experience-float-back { animation: experienceFloat 7.5s ease-in-out -2s infinite alternate-reverse; }
.experience-orbit-detail { animation: experienceFloat 8s ease-in-out -1s infinite alternate; }
.experience-caption { display: grid; gap: 4px; min-height: 67px; padding: 0 8px 16px; text-align: center; }
.experience-caption strong { color: var(--paper); font-size: 18px; line-height: 1.6; }
.experience-caption span { color: #f5f2eab8; font-size: 13px; line-height: 1.8; }
.experience-scene-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.experience-scene-controls button { min-width: 0; min-height: 46px; padding: 9px 6px; border: 1px solid #ddc58d40; border-radius: 9px; background: transparent; color: var(--paper); font: inherit; font-size: 12px; line-height: 1.5; transition: background .2s, color .2s, border-color .2s; touch-action: manipulation; }
.experience-scene-controls button[aria-pressed="true"] { color: var(--green-deep); background: var(--gold-light); border-color: var(--gold-light); font-weight: 700; }
.experience-scene-controls button:focus-visible { outline: 3px solid var(--gold-light); outline-offset: 3px; }
.experience-about { position: relative; isolation: isolate; min-width: 0; padding: 26px 18px 20px; border: 1px solid var(--line); border-radius: 20px; background: var(--ivory); }
.experience-about::before { content: ""; position: absolute; z-index: -2; inset: 15px -9px -9px 15px; border: 1px solid var(--gold); border-radius: 20px; transform: rotate(-3deg); opacity: .35; }
.experience-about-orbit { position: absolute; z-index: -1; width: 185px; height: 185px; inset: 20px auto auto 50%; translate: -50% 0; border: 1px solid var(--line); border-radius: 50%; }
.experience-about-brand { position: relative; display: grid; justify-items: center; gap: 6px; padding: 10px 4px 24px; text-align: center; }
.service-about-grid .experience-about .experience-about-brand img, .experience-about .experience-about-brand img { width: 88px; height: 88px; object-fit: contain; margin-bottom: 6px; }
.experience-about-brand strong { font-size: 23px; line-height: 1.5; color: var(--green); }
.experience-about-brand > span { font-size: 12px; line-height: 1.8; color: var(--muted); }
.experience-about-points { position: relative; display: grid; gap: 10px; list-style: none; padding: 0; margin: 0; }
.experience-about-points li { display: flex; align-items: center; gap: 11px; padding: 13px; border: 1px solid var(--line); border-radius: 11px; background: var(--paper); box-shadow: 0 5px 14px #073f3c05; }
.experience-about-symbol { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; color: var(--green); background: var(--ivory); }
.experience-about-symbol svg { width: 24px; height: 24px; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.experience-about-points strong { display: block; font-size: 16px; line-height: 1.6; color: var(--green); }
.experience-about-points small { display: block; color: var(--muted); font-size: 11px; line-height: 1.8; }
body.premium-site.refined-site .service-catalog .service-card .card-top { align-items: center; gap: 16px; }
body.premium-site.refined-site .service-catalog .service-card .service-symbol { flex: 0 0 60px; width: 60px; height: 60px; border-radius: 15px; }
body.premium-site.refined-site .service-catalog .service-card .service-symbol .icon { width: 33px; height: 33px; }
body.premium-site.refined-site .service-catalog .service-card h3 { min-height: 3em; font-size: clamp(23px, 2vw, 27px); line-height: 1.5; }
body.premium-site.refined-site .service-catalog .service-card { transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
body.premium-site.refined-site .service-catalog .service-card:focus-within { border-color: var(--gold); box-shadow: 0 12px 25px #073f3c0b; }
body.premium-site.refined-site .service-catalog .service-card:active { transform: translateY(1px); }
@media (hover: hover) and (pointer: fine) {
  body.premium-site.refined-site .service-catalog .service-card:hover { transform: translateY(-4px); border-color: var(--gold); box-shadow: 0 15px 30px #073f3c0e; }
  .experience-scene-controls button:not([aria-pressed="true"]):hover { background: #ffffff0c; border-color: var(--gold); }
}
@keyframes experienceFloat { from { translate: 0 0; } to { translate: 0 -6px; } }
body.is-motion-paused .experience-hero *, body.is-motion-paused .experience-about *, [data-experience-hero][data-page-hidden="true"] *, [data-experience-about][data-page-hidden="true"] * { animation-play-state: paused !important; }
@media (max-width: 760px) {
  .experience-hero { padding: 20px 16px; max-width: 560px; margin-inline: auto; }
  .experience-about { max-width: 420px; width: 100%; margin-inline: auto; }
  .experience-about::before { inset-inline: 8px; }
  body.premium-site.refined-site .service-catalog .service-card .service-symbol { flex-basis: 56px; width: 56px; height: 56px; }
  body.premium-site.refined-site .service-catalog .service-card h3 { min-height: 0; }
}
@media (max-width: 380px) {
  .experience-hero { padding: 17px 12px; border-radius: 16px; }
  .experience-brand { padding-inline: 0; gap: 9px; }
  .experience-brand strong { font-size: 18px; }
  .experience-brand span { font-size: 10px; }
  .experience-scene-controls { gap: 5px; }
  .experience-scene-controls button { font-size: 11px; min-height: 48px; padding-inline: 3px; }
  .experience-caption strong { font-size: 16px; }
  .experience-caption span { font-size: 12px; }
  .experience-about { padding-inline: 12px; }
  .experience-about-points li { gap: 8px; padding: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .experience-hero *, .experience-about * { animation: none !important; transition: none !important; }
  body.premium-site.refined-site .service-catalog .service-card { transition: none; transform: none !important; }
}
@media print { .experience-hero, .experience-about { break-inside: avoid; box-shadow: none; } .experience-hero * { animation: none !important; } }


/* service-drawer-20261024.css */
/* Native RTL service drawer. Load after the original site styles. */
body.is-service-drawer-open { overflow: hidden; overscroll-behavior: none; }
body.premium-site.refined-site #service-guide-dialog {
  position: fixed;
  inset: 0 0 0 auto;
  margin: 0;
  width: min(640px, 100vw);
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  padding: 0;
  border: 0;
  border-left: 1px solid #b8945760;
  border-radius: 18px 0 0 18px;
  background: var(--paper, #fffef8);
  color: var(--ink, #123f3b);
  overflow: hidden;
  box-sizing: border-box;
  box-shadow: -24px 0 80px #022d2b38;
}
body.premium-site.refined-site #service-guide-dialog:not([open]) { display: none; }
body.premium-site.refined-site #service-guide-dialog::backdrop {
  background: #022d2ba8;
  backdrop-filter: blur(3px);
}
body.premium-site.refined-site #service-guide-body {
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding: calc(76px + env(safe-area-inset-top, 0px)) 28px 0;
  scrollbar-gutter: stable;
  scroll-behavior: auto;
}
body.premium-site.refined-site #service-guide-dialog .dialog-close {
  position: absolute;
  inset-inline-end: 20px;
  top: calc(16px + env(safe-area-inset-top, 0px));
  width: 46px;
  height: 46px;
  z-index: 4;
  background: var(--paper, #fffef8);
  box-shadow: 0 4px 16px #022d2b0c;
}
body.premium-site.refined-site #service-guide-title {
  padding-inline-end: 0;
  font-size: clamp(24px, 4vw, 31px);
  line-height: 1.65;
  margin: 8px 0 12px;
  overflow-wrap: anywhere;
}
body.premium-site.refined-site #service-guide-body .dialog-intro > p:last-child {
  line-height: 1.95;
  font-size: 16px;
  margin-bottom: 0;
}
body.premium-site.refined-site #service-guide-body .service-tabs {
  flex: 0 0 auto;
  gap: 6px;
  margin: 24px 0 20px;
  padding-bottom: 12px;
  scrollbar-width: thin;
}
body.premium-site.refined-site #service-guide-body .service-tabs [role="tab"] {
  min-height: 46px;
  padding: 10px 12px;
  font-size: 14px;
  flex: 1 0 auto;
}
body.premium-site.refined-site #service-guide-body .service-tabpanel {
  flex: 0 0 auto;
  min-height: 140px;
  overflow-wrap: anywhere;
}
body.premium-site.refined-site #service-guide-body .guide-official {
  flex: 0 0 auto;
  font-size: 14px;
  line-height: 1.9;
  margin-bottom: 22px;
}
body.premium-site.refined-site #service-guide-body .dialog-footer {
  position: sticky;
  bottom: 0;
  z-index: 3;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 10px;
  flex: 0 0 auto;
  margin: auto -2px 0;
  padding: 15px 2px calc(14px + env(safe-area-inset-bottom, 0px));
  background: var(--paper, #fffef8);
  border-top: 1px solid #b8945755;
  box-shadow: 0 -10px 20px #fffef8eb;
}
body.premium-site.refined-site #service-guide-body .dialog-footer .button {
  min-width: 0;
  min-height: 48px;
  padding: 11px 10px;
  font-size: 14px;
  white-space: normal;
  text-align: center;
  box-sizing: border-box;
}
body.premium-site.refined-site #service-guide-body .dialog-footer .drawer-call {
  grid-column: 1 / -1;
  min-height: 54px;
  font-size: 17px;
  font-weight: 800;
  gap: 12px;
}
body.premium-site.refined-site #service-guide-body .dialog-footer .drawer-details {
  grid-column: 1 / -1;
  min-height: 40px;
  padding-block: 7px;
  border-color: transparent;
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 5px;
}
@media (max-width: 680px) {
  body.premium-site.refined-site #service-guide-dialog { width: 100vw; border: 0; border-radius: 0; }
  body.premium-site.refined-site #service-guide-body { padding-left: max(18px, env(safe-area-inset-left, 0px)); padding-right: max(18px, env(safe-area-inset-right, 0px)); }
  body.premium-site.refined-site #service-guide-body .service-tabs [role="tab"] { padding-inline: 10px; font-size: 13px; }
}
@media (prefers-reduced-motion: no-preference) {
  body.premium-site.refined-site:not(.is-motion-paused) #service-guide-dialog[open] { animation: abu-service-drawer-in 180ms ease-out; }
  @keyframes abu-service-drawer-in { from { opacity: .5; transform: translateX(18px); } to { opacity: 1; transform: translateX(0); } }
}
@media print { body.premium-site.refined-site #service-guide-dialog { display: none !important; } }


/* reviews-mobile-20261024.css */
/* Native review browsing and a compact service-aware mobile action bar. */
[data-review-carousel].review-carousel-ready .customer-review-grid {
  display: grid; grid-auto-flow: column; grid-template-columns: none;
  grid-auto-columns: calc((100% - 40px) / 3); gap: 20px;
  min-inline-size: 0; overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x proximity; overscroll-behavior-inline: contain;
  touch-action: auto; padding-block: 6px 16px;
  scrollbar-width: thin; scrollbar-color: var(--gold) var(--soft);
}
[data-review-carousel].review-carousel-ready .customer-review {
  min-inline-size: 0; scroll-snap-align: start; scroll-snap-stop: normal;
  margin: 0; overflow-wrap: anywhere;
}
[data-review-carousel] .review-carousel-controls {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 12px; margin-block-start: 18px;
}
[data-review-carousel] [data-review-prev],
[data-review-carousel] [data-review-next] {
  inline-size: 44px; block-size: 44px; padding: 0;
  display: inline-grid; place-items: center; border: 1px solid var(--line);
  border-radius: 12px; background: var(--paper); color: var(--green);
  cursor: pointer; font: inherit; font-size: 22px; line-height: 1;
}
[data-review-carousel] [data-review-prev]:disabled,
[data-review-carousel] [data-review-next]:disabled { opacity: .38; cursor: default; }
[data-review-carousel] [data-review-position] { min-inline-size: 100px; text-align: center; color: var(--muted); font-size: 14px; }
[data-review-carousel] .customer-review-grid:focus-visible,
[data-review-carousel] [data-review-prev]:focus-visible,
[data-review-carousel] [data-review-next]:focus-visible {
  outline: 3px solid var(--gold); outline-offset: 4px;
}
[data-review-carousel] .review-carousel-controls[hidden] { display: none !important; }
#selected-service-bar { display: none; }
#selected-service-bar[hidden] { display: none !important; }
@media (max-width: 1100px) {
  [data-review-carousel].review-carousel-ready .customer-review-grid { grid-auto-columns: calc((100% - 20px) / 2); }
}
@media (max-width: 760px) {
  [data-review-carousel].review-carousel-ready .customer-review-grid { grid-auto-columns: 88%; gap: 14px; }
  [data-review-carousel].review-carousel-ready .customer-review { padding: 22px; }
  body.has-selected-service-bar { padding-bottom: calc(128px + env(safe-area-inset-bottom, 0px)) !important; }
  body.has-selected-service-bar a.floating-call,
  body.has-selected-service-bar .quick-contact { display: none !important; }
  body.has-selected-service-bar .back-top { bottom: calc(134px + env(safe-area-inset-bottom, 0px)); }
  body.has-selected-service-bar #selected-service-bar {
    display: grid; gap: 9px; position: fixed; z-index: 76;
    inset-inline: 0; bottom: 0;
    padding: 10px 18px calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--paper, #fffdf8); color: var(--green, #073f3c);
    border-block-start: 1px solid var(--line, #d9ddd4);
    box-shadow: 0 -5px 24px #073f3c12;
  }
  #selected-service-bar .selected-service-copy { display: flex; align-items: baseline; gap: 10px; min-inline-size: 0; }
  #selected-service-bar .selected-service-copy small { color: var(--muted); flex: 0 0 auto; font-size: 11px; }
  #selected-service-bar [data-selected-service-name] { min-inline-size: 0; overflow-wrap: anywhere; font-size: 14px; line-height: 1.6; }
  #selected-service-bar .selected-service-actions { display: grid; grid-template-columns: minmax(0, 1fr) 100px; gap: 9px; }
  #selected-service-bar .selected-service-actions a {
    min-inline-size: 0; min-block-size: 44px; display: flex; align-items: center;
    justify-content: center; text-align: center; border-radius: 10px;
    font-size: 14px; font-weight: 700; text-decoration: none;
  }
  #selected-service-bar [data-selected-service-request] { background: var(--green, #073f3c); color: var(--paper, #fffdf8); }
  #selected-service-bar [data-selected-service-call] { border: 1px solid var(--green, #073f3c); color: var(--green, #073f3c); }
  #selected-service-bar a:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
}
@media (prefers-reduced-motion: reduce) {
  [data-review-carousel] .customer-review-grid { scroll-behavior: auto !important; }
}
@media print { .review-carousel-controls, #selected-service-bar { display: none !important; } [data-review-carousel].review-carousel-ready .customer-review-grid { display: grid; grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0,1fr)); overflow: visible; } }