/*
 * ganggeban54.com industrial design system v1
 * Direction: precise B2B engineering, graphite + galvanized gray + safety orange.
 * Existing plugin-specific rules are retained at the end.
 */

:root {
  --yh-ink: #182129;
  --yh-ink-soft: #34434f;
  --yh-steel: #647784;
  --yh-line: #d8e0e5;
  --yh-surface: #f4f7f8;
  --yh-white: #ffffff;
  --yh-accent: #e85d04;
  --yh-accent-hover: #bf4900;
  --yh-success: #176b45;
  --yh-danger: #b42318;
  --yh-radius-sm: 6px;
  --yh-radius-md: 10px;
  --yh-radius-lg: 14px;
  --yh-shadow: 0 12px 32px rgba(24, 33, 41, 0.10);
  --yh-content: 1320px;
}

html {
  scroll-behavior: smooth;
  overflow-x: clip;
}

body {
  color: var(--yh-ink-soft);
  font-family: "Noto Sans SC", "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-size: 17px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

body,
button,
input,
select,
textarea {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.ct-container,
.elementor-section.elementor-section-boxed > .elementor-container,
.e-con-boxed > .e-con-inner {
  width: min(calc(100% - 48px), var(--yh-content));
  max-width: var(--yh-content);
  margin-inline: auto;
}

main#main,
.site-main {
  min-width: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--yh-ink);
  font-weight: 700;
  letter-spacing: -0.018em;
  text-wrap: balance;
}

h1 { font-size: clamp(2.15rem, 4vw, 3.5rem); line-height: 1.16; }
h2 { font-size: clamp(1.7rem, 3vw, 2.45rem); line-height: 1.24; }
h3 { font-size: clamp(1.3rem, 2vw, 1.7rem); line-height: 1.35; }
h4 { font-size: 1.2rem; line-height: 1.4; }
h5,
h6 { font-size: 1.05rem; line-height: 1.45; }

p,
li {
  max-width: 72ch;
}

a {
  text-underline-offset: 0.16em;
}

:focus-visible {
  outline: 3px solid rgba(232, 93, 4, 0.35);
  outline-offset: 3px;
}

/* Header */
#header {
  border-bottom: 1px solid var(--yh-line);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 24px rgba(24, 33, 41, 0.06);
}

#header [data-row] {
  background: var(--yh-white);
}

#header [data-row="middle"] .ct-container {
  min-height: 78px;
}

#header [data-id="logo"] img,
.site-logo-container img {
  width: auto;
  max-height: 48px;
  object-fit: contain;
}

#header .menu > li > a {
  min-height: 48px;
  color: var(--yh-ink);
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
}

#header .menu > li > a:hover,
#header .menu > li.current-menu-item > a,
#header .menu > li.current-menu-ancestor > a {
  color: var(--yh-accent);
}

#header .sub-menu {
  padding: 10px;
  border: 1px solid var(--yh-line);
  border-radius: var(--yh-radius-md);
  box-shadow: var(--yh-shadow);
}

#header .sub-menu a {
  min-height: 42px;
  border-radius: var(--yh-radius-sm);
}

#header .sub-menu a:hover {
  background: var(--yh-surface);
}

#header .menu > li:last-child > a {
  min-height: 44px;
  padding-inline: 20px;
  color: var(--yh-white);
  background: var(--yh-accent);
  border-radius: var(--yh-radius-sm);
}

#header .menu > li:last-child > a:hover {
  color: var(--yh-white);
  background: var(--yh-accent-hover);
}

/* Content rhythm */
.entry-content > * + *,
.woocommerce-product-details__short-description > * + * {
  margin-top: 1.15em;
}

.entry-content > h2,
.entry-content > h3 {
  margin-top: clamp(2.2rem, 5vw, 4rem);
}

.entry-content > h2 {
  padding-top: 0.45em;
  border-top: 3px solid var(--yh-accent);
}

.yh-page-intro {
  width: min(calc(100% - 48px), var(--yh-content));
  margin: clamp(24px, 4vw, 56px) auto clamp(20px, 3vw, 40px);
  padding: clamp(24px, 4vw, 48px);
  border-left: 5px solid var(--yh-accent);
  border-radius: var(--yh-radius-lg);
  background: linear-gradient(135deg, var(--yh-surface), #eef1f3);
  box-shadow: var(--yh-shadow-sm);
}

.yh-page-intro h1 {
  margin: 0;
  max-width: 18ch;
}

.yh-archive-intro {
  margin-top: 0;
}

.elementor-top-section,
.e-con.e-parent {
  --padding-top: clamp(48px, 7vw, 88px);
  --padding-bottom: clamp(48px, 7vw, 88px);
}

/* Buttons and form controls */
.button,
button:not(.menu-toggle),
input[type="submit"],
.wp-element-button,
.elementor-button {
  min-height: 48px;
  padding: 12px 22px;
  border: 1px solid transparent;
  border-radius: var(--yh-radius-sm) !important;
  color: var(--yh-white);
  background: var(--yh-accent);
  font-weight: 700;
  line-height: 1.2;
  transition: background-color 160ms ease, border-color 160ms ease, transform 120ms ease;
}

.button:hover,
button:not(.menu-toggle):hover,
input[type="submit"]:hover,
.wp-element-button:hover,
.elementor-button:hover {
  color: var(--yh-white);
  background: var(--yh-accent-hover);
}

.button:active,
button:active,
input[type="submit"]:active,
.wp-element-button:active,
.elementor-button:active {
  transform: translateY(1px);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
select,
textarea {
  min-height: 48px;
  padding: 11px 13px;
  border: 1px solid #bac6cd;
  border-radius: var(--yh-radius-sm);
  color: var(--yh-ink);
  background: var(--yh-white);
}

textarea { min-height: 132px; }

input:focus,
select:focus,
textarea:focus {
  border-color: var(--yh-accent);
  box-shadow: 0 0 0 3px rgba(232, 93, 4, 0.13);
}

/* Product and article cards */
.products .product,
.wc-block-grid__product,
.entries .entry-card,
.elementor-post {
  overflow: hidden;
  border: 1px solid var(--yh-line);
  border-radius: var(--yh-radius-md);
  background: var(--yh-white);
  box-shadow: 0 6px 18px rgba(24, 33, 41, 0.06);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.products .product:hover,
.wc-block-grid__product:hover,
.entries .entry-card:hover,
.elementor-post:hover {
  border-color: #a9b7c0;
  box-shadow: var(--yh-shadow);
  transform: translateY(-2px);
}

.products .product img,
.wc-block-grid__product img,
.elementor-post img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.woocommerce-product-gallery,
.entry-content figure,
.entry-content img {
  border-radius: var(--yh-radius-md);
}

/* Tables */
.entry-content table,
.woocommerce table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border: 1px solid var(--yh-line);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--yh-radius-md);
  background: var(--yh-white);
}

table th,
table td {
  min-width: 110px;
  padding: 13px 15px;
  border-right: 1px solid var(--yh-line);
  border-bottom: 1px solid var(--yh-line);
  text-align: left;
  vertical-align: top;
}

table th {
  color: var(--yh-ink);
  background: #eaf0f3;
  font-weight: 700;
}

/* Feedback states */
.woocommerce-message,
.woocommerce-info,
.ff-message-success,
.fluentform .ff-el-is-success .text-danger {
  border: 1px solid rgba(23, 107, 69, 0.28);
  border-left: 4px solid var(--yh-success);
  border-radius: var(--yh-radius-sm);
  background: #edf8f2;
}

.woocommerce-error,
.fluentform .error,
.ff-el-is-error .text-danger {
  border-color: rgba(180, 35, 24, 0.28);
  color: var(--yh-danger);
}

/* Footer */
#footer,
.site-footer {
  color: #dce5ea;
  background: var(--yh-ink);
}

#footer h2,
#footer h3,
#footer h4,
#footer h5,
#footer h6 {
  color: var(--yh-white);
}

#footer a {
  color: #e9f0f3;
}

#footer a:hover {
  color: #ff914d;
}

#footer [data-row="bottom"] {
  border-top: 1px solid rgba(255, 255, 255, 0.13);
  background: var(--yh-ink);
}

/* Existing plugin-specific rules retained */
.ct-e-button .elementor-button-icon {
  font-size: 10px;
  line-height: 1em;
  align-self: center;
}

.ct-e-button.ct-contact .elementor-button-icon {
  font-size: 18px;
}

.elementor-widget-n-accordion .e-n-accordion-item [aria-expanded="false"] {
  border-radius: var(--yh-radius-md);
}

@media (max-width: 1024px) {
  .ct-container,
  .elementor-section.elementor-section-boxed > .elementor-container,
  .e-con-boxed > .e-con-inner {
    width: min(calc(100% - 36px), var(--yh-content));
  }

  #header [data-row="middle"] .ct-container { min-height: 70px; }
  #header [data-id="logo"] img,
  .site-logo-container img { max-height: 42px; }
}

@media (max-width: 767px) {
  .yh-page-intro {
    width: min(calc(100% - 32px), var(--yh-content));
    padding: 22px 20px;
  }
  body { font-size: 16px; line-height: 1.68; }

  .ct-container,
  .elementor-section.elementor-section-boxed > .elementor-container,
  .e-con-boxed > .e-con-inner {
    width: min(calc(100% - 32px), var(--yh-content));
  }

  h1 { font-size: clamp(2rem, 10vw, 2.65rem); }
  h2 { font-size: clamp(1.55rem, 7vw, 2rem); }

  .elementor-top-section,
  .e-con.e-parent {
    --padding-top: 42px;
    --padding-bottom: 42px;
    --padding-left: 16px;
    --padding-right: 16px;
  }

  .products,
  .elementor-posts-container {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .button,
  button,
  input[type="submit"],
  .wp-element-button,
  .elementor-button {
    min-height: 48px;
    white-space: normal;
  }

  #footer [data-column] {
    text-align: left;
    align-items: flex-start;
  }
}

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

/* YH UNIFORM SPACING START */
:root {
  --yh-content: 1240px;
  --yh-section-space: 80px;
  --yh-page-gutter: 20px;
}

/* Align the header, footer, WooCommerce content and custom homepage sections. */
#header .ct-container,
#footer .ct-container,
.site-main .ct-container,
.yh-wrap {
  width: min(calc(100% - (var(--yh-page-gutter) * 2)), var(--yh-content)) !important;
  max-width: var(--yh-content) !important;
  margin-inline: auto !important;
}

/* One vertical rhythm for every top-level Elementor section. */
.site-main .elementor > .e-con.e-parent {
  --padding-top: var(--yh-section-space) !important;
  --padding-bottom: var(--yh-section-space) !important;
  --padding-left: var(--yh-page-gutter) !important;
  --padding-right: var(--yh-page-gutter) !important;
}

.site-main .elementor > .e-con.e-parent.e-con-boxed {
  --padding-left: 0px !important;
  --padding-right: 0px !important;
}

.site-main .elementor > .e-con.e-parent.e-con-boxed > .e-con-inner,
.site-main .elementor > .elementor-section.elementor-top-section > .elementor-container {
  width: min(calc(100% - (var(--yh-page-gutter) * 2)), var(--yh-content)) !important;
  max-width: var(--yh-content) !important;
  margin-inline: auto !important;
}

.site-main .elementor > .elementor-section.elementor-top-section {
  padding-top: var(--yh-section-space) !important;
  padding-bottom: var(--yh-section-space) !important;
}

/* Native, archive and product layouts use the same page space. */
.site-main .ct-container,
.single-product .site-main > .ct-container-full {
  padding-top: var(--yh-section-space) !important;
  padding-bottom: var(--yh-section-space) !important;
}

/* Homepage HTML sections and Elementor article/contact sections. */
.yh-section {
  padding-top: var(--yh-section-space) !important;
  padding-bottom: var(--yh-section-space) !important;
}

.yh-home-section,
.yh-contact-section,
.yh-collection-articles {
  padding-top: var(--yh-section-space) !important;
  padding-bottom: var(--yh-section-space) !important;
  padding-left: var(--yh-page-gutter) !important;
  padding-right: var(--yh-page-gutter) !important;
}

@media (max-width: 1024px) {
  :root {
    --yh-section-space: 64px;
    --yh-page-gutter: 18px;
  }
}

@media (max-width: 767px) {
  :root {
    --yh-section-space: 52px;
    --yh-page-gutter: 14px;
  }
}
/* YH UNIFORM SPACING END */