/* 04｜關於我們（頁面 295） */

/* Astra is limiting About page 295's Elementor content to 1440px. */
body.em-design-about .site-content > .ast-container {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Match the two About hero actions to the home banner buttons. */
#about-hero-actions .elementor-widget-button:first-child,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:first-child {
  margin-right: 16px !important;
}

#about-hero-actions .elementor-widget-button .elementor-button,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button {;
  align-items: center;
  min-height: 49px;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

#about-hero-actions .em-about-hero__button--primary .elementor-button,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:first-child .elementor-button {
  background: var(--em-brand-red) !important;
  color: #fff !important;
}

#about-hero-actions .em-about-hero__button--secondary .elementor-button,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:last-child .elementor-button {
  background: #fff !important;
  color: var(--em-brand-ink) !important;
}

#about-hero-actions .elementor-button-text::after,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button-text::after {
  content: "→";
  display: inline-block;
  margin-left: 15px;
  transition: transform .2s ease;
}

@media (hover: hover) and (pointer: fine) {
  #about-hero-actions .em-about-hero__button--primary .elementor-button:hover,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:first-child .elementor-button:hover {
    background: #cf0010 !important;
  }
  #about-hero-actions .em-about-hero__button--secondary .elementor-button:hover,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:last-child .elementor-button:hover {
    color: var(--em-brand-red) !important;
  }
  #about-hero-actions .elementor-button:hover .elementor-button-text::after,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button:hover .elementor-button-text::after {
    transform: translateX(4px);
  }
}

@media (max-width: 767px) {
  #about-hero-actions .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button {
    min-height: 45px;
    padding: 11px 20px !important;
    font-size: 13px !important;
  }
}

#about-hero-actions .elementor-widget-button .elementor-button,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button {
  animation: em-about-button-enter .7s cubic-bezier(.22, 1, .36, 1) both;
}

#about-hero-actions .elementor-widget-button:first-child .elementor-button,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:first-child .elementor-button {
  animation-delay: .12s;
}

#about-hero-actions .elementor-widget-button:last-child .elementor-button,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:last-child .elementor-button {
  animation-delay: .24s;
}

#about-hero-actions .elementor-button:focus-visible,
body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button:focus-visible {
  outline: 3px solid rgba(230, 0, 18, .28);
  outline-offset: 3px;
}

/* Quiet reveal as each content band enters view, matching the homepage cadence. */
@supports (animation-timeline: view()) {
  .em-about-section:not(.em-about-section--hero) .e-con-boxed > .e-con-inner,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:not(:first-child) .e-con-boxed > .e-con-inner {
    animation: em-about-section-enter linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 72%;
  }
}

/* Gentle image zoom and service-row feedback add movement without busy effects. */
.em-about-company-photo .elementor-widget-image,
body.em-design-about [data-elementor-type="wp-page"] .elementor-widget-image {
  overflow: hidden;
}

.em-about-company-image img,
body.em-design-about [data-elementor-type="wp-page"] .elementor-widget-image img {
  transition: transform .55s cubic-bezier(.22, 1, .36, 1), filter .4s ease;
}

.em-about-company-photo:hover .em-about-company-image img,
body.em-design-about [data-elementor-type="wp-page"] .elementor-widget-image:hover img {
  transform: scale(1.035);
  filter: saturate(1.04);
}

.em-about-service-row {
  transition: background-color .25s ease, transform .25s ease, padding .25s ease;
}

.em-about-service-row:hover {
  background-color: rgba(230, 0, 18, .035);
  transform: translateX(3px);
}

body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:nth-child(3) .elementor-widget-button .elementor-button {
  transition: color .2s ease, transform .2s ease;
}

body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:nth-child(3) .elementor-widget-button:hover .elementor-button {
  color: var(--em-brand-red) !important;
  transform: translateX(4px);
}

@media (hover: hover) and (pointer: fine) {
  #about-hero-actions .em-about-hero__button--primary .elementor-button:hover,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:first-child .elementor-button:hover {
    background: #cf0010 !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(230, 0, 18, .16) !important;
  }
  #about-hero-actions .em-about-hero__button--secondary .elementor-button:hover,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button:last-child .elementor-button:hover {
    color: var(--em-brand-red) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(32, 36, 42, .12) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #about-hero-actions .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:first-child .elementor-widget-button .elementor-button,
  .em-about-section:not(.em-about-section--hero) .e-con-boxed > .e-con-inner,
  .em-about-company-image img,
  .em-about-service-row,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:not(:first-child) .e-con-boxed > .e-con-inner,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-widget-image img,
  body.em-design-about [data-elementor-type="wp-page"] > .elementor-element:nth-child(3) .elementor-widget-button .elementor-button {
    animation: none !important;
    transition: none !important;
  }
}

@keyframes em-about-button-enter {
  from { opacity: 0; translate: 0 10px; }
  to { opacity: 1; translate: 0 0; }
}

@keyframes em-about-section-enter {
  from { opacity: .35; translate: 0 24px; }
  to { opacity: 1; translate: 0 0; }
}

/* About page 295: paste at the end of Additional CSS. */

/* Reveal the actual full-width Elementor sections as they enter the viewport. */
@supports (animation-timeline: view()) {
  body.em-design-about [data-elementor-type="wp-page"] > section.e-con:not(:first-child),
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8 {
    animation: em-about-live-enter linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 42%;
  }
}

@keyframes em-about-live-enter {
  from { opacity: .55; translate: 0 18px; }
  to { opacity: 1; translate: 0 0; }
}

/* The six live service rows are Containers; target their verified Elementor IDs. */
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8 {
  border-radius: 4px;
  transition: background-color .24s ease, transform .24s ease, box-shadow .24s ease;
}

body.em-design-about [data-elementor-type="wp-page"] :is(.elementor-element-57509511, .elementor-element-73c7ad51, .elementor-element-56cb024a, .elementor-element-40005530, .elementor-element-4e80650c, .elementor-element-3aac45c8) .elementor-heading-title,
body.em-design-about [data-elementor-type="wp-page"] :is(.elementor-element-57509511, .elementor-element-73c7ad51, .elementor-element-56cb024a, .elementor-element-40005530, .elementor-element-4e80650c, .elementor-element-3aac45c8) .elementor-button {
  transition: color .22s ease, transform .22s ease;
}

/* Small idle movement remains visible when the cursor is over DevTools. */
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511 .elementor-button-text,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51 .elementor-button-text,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a .elementor-button-text,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530 .elementor-button-text,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c .elementor-button-text,
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8 .elementor-button-text {
  display: inline-block;
  animation: em-about-live-arrow 3.8s ease-in-out infinite;
}

body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51 .elementor-button-text { animation-delay: .35s; }
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a .elementor-button-text { animation-delay: .7s; }
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530 .elementor-button-text { animation-delay: 1.05s; }
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c .elementor-button-text { animation-delay: 1.4s; }
body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8 .elementor-button-text { animation-delay: 1.75s; }

@media (hover: hover) and (pointer: fine) {
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511:hover,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51:hover,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a:hover,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530:hover,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c:hover,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8:hover {
    background: #fff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 12px 26px rgba(32, 36, 42, .09) !important;
  }

  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511:hover > .e-con.e-child:nth-child(2) .elementor-heading-title,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51:hover > .e-con.e-child:nth-child(2) .elementor-heading-title,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a:hover > .e-con.e-child:nth-child(2) .elementor-heading-title,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530:hover > .e-con.e-child:nth-child(2) .elementor-heading-title,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c:hover > .e-con.e-child:nth-child(2) .elementor-heading-title,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8:hover > .e-con.e-child:nth-child(2) .elementor-heading-title {
    color: var(--em-brand-red) !important;
    transform: translateX(3px);
  }

  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511:hover .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51:hover .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a:hover .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530:hover .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c:hover .elementor-widget-button .elementor-button,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8:hover .elementor-widget-button .elementor-button {
    color: var(--em-brand-red) !important;
    transform: translate(4px, -2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.em-design-about [data-elementor-type="wp-page"] > section.e-con:not(:first-child),
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8 {
    animation: none !important;
    transition: none !important;
  }
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-57509511 .elementor-button-text,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-73c7ad51 .elementor-button-text,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-56cb024a .elementor-button-text,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-40005530 .elementor-button-text,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-4e80650c .elementor-button-text,
  body.em-design-about [data-elementor-type="wp-page"] .elementor-element-3aac45c8 .elementor-button-text {
    animation: none !important;
  }
}

@keyframes em-about-live-arrow {
  0%, 73%, 100% { opacity: .7; transform: translate(0, 0); }
  82% { opacity: 1; transform: translate(3px, -3px); }
  91% { opacity: .85; transform: translate(0, 0); }
}