/* ─── Wisy Block Theme — Global Styles ─────────────────── */
/* Loaded via functions.php enqueue                        */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;700&family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500&display=swap');

:root {
  --wisy-navy:        #1a2b45;
  --wisy-navy-light:  #243654;
  --wisy-teal:        #1d9e75;
  --wisy-teal-light:  #e1f5ee;
  --wisy-teal-dark:   #0f6e56;
  --wisy-amber:       #d4820a;
  --wisy-amber-light: #faeeda;
  --wisy-gray-50:     #f7f7f5;
  --wisy-gray-100:    #eeede9;
  --wisy-gray-200:    #d3d1c7;
  --wisy-gray-500:    #888780;
  --wisy-gray-700:    #444441;
  --wisy-gray-900:    #1e1e1c;
  --radius-sm:  6px;
  --radius-md:  10px;
  --radius-lg:  14px;
}

/* ─── Base ──────────────────────────────────────────────── */
body { font-family: 'DM Sans', 'Noto Sans TC', sans-serif; }
a { color: var(--wisy-teal); }
a:hover { color: var(--wisy-teal-dark); }

/* ─── Header ────────────────────────────────────────────── */
.wisy-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  border-bottom: 1px solid var(--wisy-gray-100);
}
.wisy-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 32px;
  max-width: 1100px;
  margin: 0 auto;
  gap: 24px;
}
.wisy-logo-wrap .wp-block-site-title a,
.wisy-logo-wrap .wp-block-site-title {
  font-family: 'Noto Sans TC', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--wisy-navy) !important;
  text-decoration: none !important;
  line-height: 1.2;
}
.wisy-logo-sub {
  font-size: 10px;
  color: var(--wisy-gray-500);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  display: block;
  margin-top: 2px;
  font-family: 'DM Sans', sans-serif;
}
.wisy-nav .wp-block-navigation__container {
  gap: 4px !important;
}
.wisy-nav .wp-block-navigation-item__content {
  font-family: 'Noto Sans TC', sans-serif;
  font-size: 14px;
  color: var(--wisy-gray-700);
  padding: 6px 12px !important;
  border-radius: var(--radius-sm);
  transition: background 0.15s, color 0.15s;
}
.wisy-nav .wp-block-navigation-item__content:hover {
  background: var(--wisy-gray-50);
  color: var(--wisy-navy);
  text-decoration: none;
}
.wisy-header-cta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  white-space: nowrap;
}
.wisy-phone-link {
  font-size: 14px;
  font-weight: 500;
  color: var(--wisy-navy) !important;
  text-decoration: none !important;
}

/* ─── Buttons ───────────────────────────────────────────── */
.wp-block-button__link,
.wp-element-button {
  border-radius: var(--radius-md) !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  font-weight: 500 !important;
  transition: opacity 0.15s, transform 0.1s !important;
  text-decoration: none !important;
}
.wp-block-button__link:hover { opacity: 0.88; }
.wp-block-button__link:active { transform: scale(0.98); }

.is-style-teal .wp-block-button__link {
  background: var(--wisy-teal) !important;
  color: #fff !important;
}
.is-style-outline-white .wp-block-button__link {
  background: transparent !important;
  color: #fff !important;
  border: 1.5px solid rgba(255,255,255,0.35) !important;
}
.is-style-outline-white .wp-block-button__link:hover {
  border-color: rgba(255,255,255,0.7) !important;
}
.is-style-outline-navy .wp-block-button__link {
  background: transparent !important;
  color: var(--wisy-navy) !important;
  border: 1.5px solid var(--wisy-navy) !important;
}

/* ─── Hero ──────────────────────────────────────────────── */
.wisy-hero {
  background: var(--wisy-navy);
  position: relative;
  overflow: hidden;
}
.wisy-hero::after {
  content: '';
  position: absolute;
  right: -80px; top: -80px;
  width: 420px; height: 420px;
  border-radius: 50%;
  background: rgba(29,158,117,0.08);
  pointer-events: none;
}
.wisy-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--wisy-teal-light) !important;
  font-family: 'Noto Sans TC', sans-serif;
  opacity: 0.85;
  margin-bottom: 20px !important;
}
.wisy-hero-tag::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--wisy-teal);
  flex-shrink: 0;
}
.wisy-hero h1,
.wisy-hero .wp-block-heading {
  color: #fff !important;
  font-size: clamp(26px, 4vw, 38px) !important;
}
.wisy-hero p,
.wisy-hero .wp-block-paragraph {
  color: rgba(255,255,255,0.65) !important;
  font-family: 'Noto Sans TC', sans-serif;
  font-size: 15px;
}
.wisy-hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.wisy-badge {
  font-size: 11px;
  font-family: 'Noto Sans TC', sans-serif;
  color: rgba(255,255,255,0.55);
  border: 1px solid rgba(255,255,255,0.15);
  padding: 4px 10px;
  border-radius: 20px;
  display: inline-block;
}

/* ─── Stats Bar ─────────────────────────────────────────── */
.wisy-stats {
  background: var(--wisy-navy-light);
  border-top: 1px solid rgba(255,255,255,0.07);
}
.wisy-stats .wp-block-columns {
  margin: 0 !important;
}
.wisy-stat-item {
  padding: 22px 24px;
  border-right: 1px solid rgba(255,255,255,0.07);
}
.wisy-stat-item:last-child { border-right: none; }
.wisy-stat-num {
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #fff !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  line-height: 1 !important;
  margin: 0 0 4px !important;
}
.wisy-stat-label {
  font-size: 12px !important;
  color: rgba(255,255,255,0.45) !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  margin: 0 !important;
}

/* ─── Section Headers ───────────────────────────────────── */
.wisy-section-label {
  font-size: 11px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 500 !important;
  color: var(--wisy-gray-500) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 6px !important;
}

/* ─── Product Cards ─────────────────────────────────────── */
.wisy-product-card {
  background: #fff;
  border: 1px solid var(--wisy-gray-100);
  border-radius: var(--radius-lg);
  padding: 24px;
  transition: border-color 0.2s, transform 0.2s;
}
.wisy-product-card:hover {
  border-color: var(--wisy-teal);
  transform: translateY(-2px);
}
.wisy-product-icon {
  width: 44px; height: 44px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  font-size: 20px;
}
.wisy-product-card h3,
.wisy-product-card .wp-block-heading {
  font-size: 15px !important;
  margin: 0 0 8px !important;
  color: var(--wisy-navy) !important;
}
.wisy-product-card p {
  font-size: 13px !important;
  color: var(--wisy-gray-500) !important;
  font-family: 'Noto Sans TC', sans-serif;
  line-height: 1.6;
  margin: 0 !important;
}

/* ─── Feature Rows ──────────────────────────────────────── */
.wisy-feature {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.wisy-feature-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--wisy-teal);
  margin-top: 8px;
  flex-shrink: 0;
}
.wisy-feature strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--wisy-navy);
  font-family: 'Noto Sans TC', sans-serif;
  margin-bottom: 2px;
}
.wisy-feature p {
  font-size: 13px;
  color: var(--wisy-gray-700);
  margin: 0;
  font-family: 'Noto Sans TC', sans-serif;
}

/* ─── Tags / Badges ─────────────────────────────────────── */
.wisy-tag {
  display: inline-block;
  font-size: 11px;
  font-family: 'Noto Sans TC', sans-serif;
  font-weight: 500;
  padding: 3px 10px;
  border-radius: 20px;
}
.wisy-tag-teal   { background: var(--wisy-teal-light);  color: #0f6e56; }
.wisy-tag-amber  { background: var(--wisy-amber-light); color: #854f0b; }
.wisy-tag-navy   { background: #e6eaf1; color: var(--wisy-navy); }

/* ─── Article List ──────────────────────────────────────── */
.wisy-articles {
  border: 1px solid var(--wisy-gray-100);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.wisy-article-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--wisy-gray-100);
  text-decoration: none;
  transition: background 0.15s;
}
.wisy-article-row:last-child { border-bottom: none; }
.wisy-article-row:hover { background: var(--wisy-gray-50); }
.wisy-article-date {
  font-size: 11px;
  color: var(--wisy-gray-500);
  white-space: nowrap;
  min-width: 60px;
}
.wisy-article-title {
  font-size: 14px;
  color: var(--wisy-gray-900);
  font-family: 'Noto Sans TC', sans-serif;
  flex: 1;
}

/* ─── Contact CTA ───────────────────────────────────────── */
.wisy-cta {
  background: var(--wisy-navy);
}
.wisy-cta h2,
.wisy-cta .wp-block-heading {
  color: #fff !important;
  font-size: 20px !important;
  margin: 0 0 6px !important;
}
.wisy-cta p,
.wisy-cta .wp-block-paragraph {
  color: rgba(255,255,255,0.55) !important;
  font-size: 13px !important;
  font-family: 'Noto Sans TC', sans-serif;
  margin: 0 !important;
}

/* ─── Footer ────────────────────────────────────────────── */
.wisy-footer {
  background: var(--wisy-gray-900);
}
.wisy-footer h4,
.wisy-footer .wp-block-heading {
  font-size: 11px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 500 !important;
  color: rgba(255,255,255,0.4) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 0 0 14px !important;
}
.wisy-footer p,
.wisy-footer address,
.wisy-footer .wp-block-paragraph {
  font-size: 13px !important;
  color: rgba(255,255,255,0.45) !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  line-height: 1.8 !important;
  font-style: normal;
  margin: 0 !important;
}
.wisy-footer a {
  color: rgba(255,255,255,0.45) !important;
  text-decoration: none !important;
  transition: color 0.15s;
}
.wisy-footer a:hover { color: #fff !important; }
.wisy-footer-company {
  font-size: 16px !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin: 0 0 8px !important;
}
.wisy-footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.07);
  padding-top: 20px;
  margin-top: 40px;
}
.wisy-footer-bottom p {
  font-size: 12px !important;
  color: rgba(255,255,255,0.25) !important;
}
.wisy-footer .wp-block-navigation__container { gap: 8px !important; flex-direction: column !important; }
.wisy-footer .wp-block-navigation-item__content {
  font-size: 13px !important;
  font-family: 'Noto Sans TC', sans-serif !important;
  color: rgba(255,255,255,0.45) !important;
  padding: 0 !important;
}
.wisy-footer .wp-block-navigation-item__content:hover { color: #fff !important; }

/* ─── Responsive ────────────────────────────────────────── */
@media (max-width: 768px) {
  .wisy-header-inner { padding: 0 16px; }
  .wisy-nav { display: none; }
  .wisy-stat-item { border-right: none; border-bottom: 1px solid rgba(255,255,255,0.07); }
}
@media (max-width: 600px) {
  .wisy-hero h1,
  .wisy-hero .wp-block-heading { font-size: 24px !important; }
}