/* ==========================================================================
   HiveSite inner-pages skin
   Loaded only when theme = hivesite_classic | hivesite_ocean | hivesite_minimal.
   Re-styles legacy Webbuilder classes to match the HiveSite brand system so
   every sub-page (services, team, faqs, contact, portfolio, blog, …) inherits
   the same colors / typography / radius / shadow as the homepage.
   ========================================================================== */

:root {
  --hs-radius: 16px;
  --hs-radius-sm: 10px;
  --hs-shadow: 0 10px 40px -12px rgba(180, 83, 9, 0.22);
  --hs-shadow-sm: 0 4px 14px -4px rgba(180, 83, 9, 0.18);
  --hs-font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang TC",
    "Microsoft JhengHei", "Noto Sans TC", Roboto, Helvetica, Arial, sans-serif;
}

/* ---------- Ocean & Minimal variants ---------- */
body.hs-theme-ocean {
  --hs-bg: #F0F7FF !important;
  --hs-border: #BFDBFE !important;
  --hs-surface: #FFFFFF !important;
  --hs-shadow: 0 10px 40px -12px rgba(37, 99, 235, 0.22) !important;
}
body.hs-theme-minimal {
  --hs-bg: #FAFAFA !important;
  --hs-border: #E5E7EB !important;
  --hs-surface: #FFFFFF !important;
  --hs-radius: 8px !important;
  --hs-radius-sm: 6px !important;
  --hs-shadow: 0 4px 20px -5px rgba(0,0,0,0.08) !important;
}

/* ---------- Page canvas ---------- */
body.hs-theme {
  font-family: var(--hs-font) !important;
  color: var(--hs-text, #1F2937);
  background: var(--hs-bg, #FFFBEB);
  -webkit-font-smoothing: antialiased;
}
body.hs-theme a { color: var(--main-color); }
body.hs-theme a:hover { color: var(--hover-color); }

/* remove random floating line-shapes from legacy templates */
body.hs-theme .line-one,
body.hs-theme .line-two,
body.hs-theme .service-line-shape::before,
body.hs-theme .service-line-shape::after { display: none !important; }

/* ---------- Breadcrumb ---------- */
body.hs-theme .breadcrumb-section {
  background: linear-gradient(135deg, var(--main-color) 0%, var(--hover-color) 100%) !important;
  background-image: linear-gradient(135deg, var(--main-color) 0%, var(--hover-color) 100%) !important;
  padding: 80px 0 60px !important;
  position: relative;
  overflow: hidden;
  margin-top: 0 !important;
}
body.hs-theme .breadcrumb-section.bg-img-c { background-image: none !important; background-color: transparent !important; }
body.hs-theme .breadcrumb-section::before {
  content: '';
  position: absolute;
  top: -120px; right: -80px;
  width: 380px; height: 380px;
  background: radial-gradient(circle, rgba(255,255,255,.18) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(20px);
  z-index: 1;
}
body.hs-theme .breadcrumb-section::after {
  content: '';
  position: absolute;
  bottom: -120px; left: -80px;
  width: 280px; height: 280px;
  background: radial-gradient(circle, rgba(255,255,255,.12) 0%, transparent 70%);
  border-radius: 50%;
  filter: blur(20px);
  z-index: 1;
}
/* dark overlay used by bg-img-c ::before – remove so gradient shows cleanly */
body.hs-theme .breadcrumb-section::before { background: transparent !important; opacity: 0 !important; }
body.hs-theme .breadcrumb-section > .breadcrumb-overlay { display: none !important; }
body.hs-theme .breadcrumb-text { position: relative; z-index: 2; text-align: center; }
body.hs-theme .breadcrumb-text h4.page-title {
  color: #fff !important;
  font-size: 40px !important;
  font-weight: 800 !important;
  letter-spacing: -.02em;
  margin-bottom: 10px !important;
}
body.hs-theme .breadcrumb-text ul {
  justify-content: center;
  background: rgba(255,255,255,.14);
  display: inline-flex;
  padding: 6px 18px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28);
  margin: 0;
}
body.hs-theme .breadcrumb-text ul li,
body.hs-theme .breadcrumb-text ul li a { color: #fff !important; font-weight: 600; }
body.hs-theme .breadcrumb-text ul li + li::before { color: rgba(255,255,255,.7) !important; }
body.hs-theme .breadcrumb-shapes .one,
body.hs-theme .breadcrumb-shapes .two { display: none !important; }

/* ---------- Spacing & containers for sections ---------- */
body.hs-theme .section-gap,
body.hs-theme .inner-section-gap {
  padding: 80px 0 !important;
  background: var(--hs-bg, #FFFBEB) !important;
}
body.hs-theme .bg-white { background: var(--hs-bg, #FFFBEB) !important; }
body.hs-theme .grey-bg { background: var(--hs-surface, #FFFFFF) !important; }

body.hs-theme .section-title h2,
body.hs-theme .section-title h3 {
  font-weight: 800 !important;
  letter-spacing: -.02em;
  color: var(--hs-text, #1F2937);
}
body.hs-theme .section-title span {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  color: var(--main-color);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: 10px;
}

/* ---------- Cards: services / team / portfolio / generic ---------- */
body.hs-theme .service-box-three,
body.hs-theme .team-member,
body.hs-theme .single-faq,
body.hs-theme .portfolio-item,
body.hs-theme .blog-item,
body.hs-theme .contact-info,
body.hs-theme .card {
  background: var(--hs-surface, #FFFFFF) !important;
  border: 1px solid var(--hs-border, #FDE68A) !important;
  border-radius: var(--hs-radius, 16px) !important;
  box-shadow: var(--hs-shadow-sm) !important;
  transition: all .25s ease !important;
  overflow: hidden;
}
body.hs-theme .service-box-three:hover,
body.hs-theme .team-member:hover,
body.hs-theme .portfolio-item:hover,
body.hs-theme .blog-item:hover,
body.hs-theme .card:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--hs-shadow) !important;
  border-color: var(--hover-color) !important;
}

/* Service cards */
body.hs-theme .service-box-three {
  padding: 32px 24px !important;
  text-align: left !important;
  height: 100%;
}
body.hs-theme .service-box-three .icon {
  width: 64px !important;
  height: 64px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, rgba(245,158,11,.18), rgba(180,83,9,.1)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 18px !important;
  font-size: 28px !important;
  color: var(--main-color) !important;
  transition: transform .3s ease;
  overflow: hidden;
}
body.hs-theme .service-box-three:hover .icon { transform: scale(1.05) rotate(-4deg); }
body.hs-theme .service-box-three .icon img,
body.hs-theme .service-box-three .icon img.lazy {
  width: 36px !important; height: 36px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  max-width: 36px !important;
}
body.hs-theme .service-box-three .content h5 { margin-bottom: 8px !important; }
body.hs-theme .service-box-three .content h5 a {
  color: var(--hs-text, #1F2937) !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  text-decoration: none;
}
body.hs-theme .service-box-three .content h5 a:hover { color: var(--main-color) !important; }
body.hs-theme .service-box-three .service-link {
  color: var(--main-color) !important;
  font-weight: 700;
}

/* Team members */
body.hs-theme .team-member { padding: 28px 20px !important; text-align: center; position: relative; }
body.hs-theme .team-member .member-picture-wrap { margin-bottom: 16px !important; position: relative; }
body.hs-theme .team-member .member-picture-wrap::after { display: none !important; }
body.hs-theme .team-member .member-picture {
  width: 110px !important; height: 110px !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, var(--main-color), var(--hover-color)) !important;
  padding: 4px !important;
  overflow: hidden;
  position: relative;
}
/* Hide the legacy triangular accent on member avatars */
body.hs-theme .team-member .member-picture::before { display: none !important; }
body.hs-theme .team-member .member-picture img,
body.hs-theme .team-member .member-picture .lazy,
body.hs-theme .team-member .member-picture img.lazy {
  width: 100% !important; height: 100% !important;
  border-radius: 50% !important;
  object-fit: cover;
  background: #fff;
  display: block;
  max-width: 100% !important;
}
body.hs-theme .team-member h4,
body.hs-theme .team-member h5,
body.hs-theme .team-member .name {
  color: var(--hs-text, #1F2937) !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
  font-size: 18px !important;
}
body.hs-theme .team-member .member-desc p,
body.hs-theme .team-member p,
body.hs-theme .team-member .pro { color: var(--main-color) !important; font-size: 14px; font-weight: 600; margin-bottom: 6px !important; }

/* ---------- FAQ accordion ---------- */
body.hs-theme .faq-section .card {
  margin-bottom: 14px;
  border: 1px solid var(--hs-border, #FDE68A) !important;
  border-radius: var(--hs-radius-sm, 10px) !important;
  background: var(--hs-surface, #FFFFFF) !important;
  overflow: hidden;
}
body.hs-theme .faq-section .card .card-header {
  background: var(--hs-surface, #FFFFFF) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--hs-border, #FDE68A) !important;
  padding: 16px 22px !important;
}
body.hs-theme .faq-section .card .card-header:last-child { border-bottom: 0 !important; }
body.hs-theme .faq-section .card .card-header h5,
body.hs-theme .faq-section .card .card-header h6,
body.hs-theme .faq-section .card .card-header a,
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"] {
  color: var(--hs-text, #1F2937) !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  text-decoration: none !important;
  display: flex; align-items: center; gap: 10px;
  margin: 0 !important;
  cursor: pointer;
}
body.hs-theme .faq-section .card .card-header h5 button,
body.hs-theme .faq-section .card .card-header h5 button::before { all: unset; }
body.hs-theme .faq-section .card .card-header h5 button {
  color: inherit !important; font-weight: inherit !important;
  font-size: inherit !important; display: flex; align-items: center; gap: 10px;
}
body.hs-theme .faq-section .card .card-header .icons {
  margin-left: auto;
  color: var(--main-color);
  font-size: 16px;
  transition: transform .2s ease;
}
body.hs-theme .faq-section .card .card-header i { color: var(--main-color); }
body.hs-theme .faq-section .card .card-header.active-header {
  background: linear-gradient(135deg, rgba(245,158,11,.12), rgba(180,83,9,.06)) !important;
}
body.hs-theme .faq-section .card .card-body {
  color: var(--hs-muted, #6B7280) !important;
  font-size: 15px; line-height: 1.7;
  padding: 16px 22px 20px !important;
}
body.hs-theme .faq-section .bg-light {
  background: var(--hs-surface, #FFFFFF) !important;
  border-radius: var(--hs-radius, 16px);
  border: 1px solid var(--hs-border, #FDE68A);
}

/* ---------- Forms & inputs ---------- */
body.hs-theme input[type="text"],
body.hs-theme input[type="email"],
body.hs-theme input[type="tel"],
body.hs-theme input[type="number"],
body.hs-theme input[type="password"],
body.hs-theme input[type="url"],
body.hs-theme input[type="search"],
body.hs-theme select,
body.hs-theme textarea,
body.hs-theme .form-control,
body.hs-theme .form_group input,
body.hs-theme .form_group textarea,
body.hs-theme .nice-select {
  border: 1px solid var(--hs-border, #FDE68A) !important;
  border-radius: var(--hs-radius-sm, 10px) !important;
  padding: 12px 16px !important;
  font-size: 15px !important;
  background: #fff !important;
  color: var(--hs-text, #1F2937) !important;
  box-shadow: none !important;
  transition: all .2s ease;
  font-family: inherit;
}
body.hs-theme input:focus,
body.hs-theme textarea:focus,
body.hs-theme select:focus,
body.hs-theme .form-control:focus,
body.hs-theme .nice-select.open {
  border-color: var(--main-color) !important;
  box-shadow: 0 0 0 4px rgba(180,83,9,.12) !important;
  outline: none !important;
}
body.hs-theme textarea { min-height: 120px; }
body.hs-theme label { color: var(--hs-text, #1F2937); font-weight: 600; font-size: 14px; }

/* ---------- Buttons ---------- */
body.hs-theme .template-btn,
body.hs-theme .main-btn,
body.hs-theme button[type="submit"],
body.hs-theme a.btn,
body.hs-theme .btn-primary,
body.hs-theme .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 12px 28px !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--main-color), var(--hover-color)) !important;
  border: 2px solid var(--hover-color) !important;
  box-shadow: var(--hs-shadow-sm) !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: all .2s ease;
  line-height: 1 !important;
}
body.hs-theme .template-btn:hover,
body.hs-theme .main-btn:hover,
body.hs-theme button[type="submit"]:hover,
body.hs-theme a.btn:hover,
body.hs-theme .btn-primary:hover,
body.hs-theme .btn:hover {
  transform: translateY(-2px) !important;
  color: #fff !important;
  text-decoration: none !important;
  box-shadow: var(--hs-shadow) !important;
}
body.hs-theme .btn-outline,
body.hs-theme .boxed-btn {
  background: transparent !important;
  color: var(--main-color) !important;
  border: 2px solid var(--hs-border, #FDE68A) !important;
  box-shadow: none !important;
}
body.hs-theme .btn-outline:hover,
body.hs-theme .boxed-btn:hover {
  background: rgba(245,158,11,.1) !important;
  color: var(--main-color) !important;
  border-color: var(--main-color) !important;
}

/* ---------- Contact info ---------- */
body.hs-theme .contact-info {
  padding: 28px 24px !important;
  border-radius: var(--hs-radius) !important;
  margin-bottom: 20px;
}
body.hs-theme .contact-info .icon {
  width: 50px; height: 50px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(245,158,11,.18), rgba(180,83,9,.1));
  display: flex; align-items: center; justify-content: center;
  color: var(--main-color);
  font-size: 22px;
  margin-bottom: 14px;
}
body.hs-theme .contact-info-content h5,
body.hs-theme .contact-info h4,
body.hs-theme .contact-info h5 {
  color: var(--hs-text) !important; font-weight: 700; margin-bottom: 6px;
}
body.hs-theme .contact-info-content p,
body.hs-theme .contact-info p { color: var(--hs-muted, #6B7280) !important; font-size: 14px; margin: 0; }

/* ---------- Pagination ---------- */
body.hs-theme .pagination,
body.hs-theme .pagination-nav { gap: 6px; }
body.hs-theme .page-link,
body.hs-theme .pagination li a,
body.hs-theme .pagination li span {
  border: 1px solid var(--hs-border) !important;
  background: #fff !important;
  color: var(--hs-text) !important;
  border-radius: 10px !important;
  padding: 8px 14px !important;
  font-weight: 600;
  margin: 0 2px;
}
body.hs-theme .page-item.active .page-link,
body.hs-theme .pagination li.active span,
body.hs-theme .pagination li.active a {
  background: linear-gradient(135deg, var(--main-color), var(--hover-color)) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: var(--hs-shadow-sm);
}
body.hs-theme .page-link:hover,
body.hs-theme .pagination li a:hover {
  background: rgba(245,158,11,.1) !important;
  color: var(--main-color) !important;
  border-color: var(--main-color) !important;
}

/* ---------- Alerts ---------- */
body.hs-theme .alert { border-radius: var(--hs-radius-sm); border: 1px solid var(--hs-border); }
body.hs-theme .alert-success { background: #ECFDF5; border-color: #A7F3D0; color: #065F46; }
body.hs-theme .alert-danger { background: #FEF2F2; border-color: #FECACA; color: #991B1B; }

/* ---------- Tables (rare but safe) ---------- */
body.hs-theme table { border-radius: var(--hs-radius-sm); overflow: hidden; }
body.hs-theme table thead th { background: linear-gradient(135deg, var(--main-color), var(--hover-color)); color: #fff; border-color: transparent; font-weight: 700; }
body.hs-theme table tbody td { border-color: var(--hs-border); }

/* ---------- Tabs ---------- */
body.hs-theme .nav-tabs .nav-link {
  border: 1px solid var(--hs-border);
  color: var(--hs-muted);
  border-radius: var(--hs-radius-sm) var(--hs-radius-sm) 0 0;
  font-weight: 600;
}
body.hs-theme .nav-tabs .nav-link.active {
  background: var(--main-color);
  color: #fff !important;
  border-color: var(--main-color);
}

/* ---------- Blog / portfolio item overrides (if enabled) ---------- */
body.hs-theme .blog-item { padding: 0 !important; }
body.hs-theme .blog-item .blog-thumb img,
body.hs-theme .portfolio-item img { border-radius: var(--hs-radius) var(--hs-radius) 0 0; }
body.hs-theme .blog-item .blog-content,
body.hs-theme .portfolio-item .port-content { padding: 22px; }
body.hs-theme .blog-item h4 a,
body.hs-theme .portfolio-item h4 a { color: var(--hs-text); font-weight: 700; text-decoration: none; }
body.hs-theme .blog-item h4 a:hover,
body.hs-theme .portfolio-item h4 a:hover { color: var(--main-color); }

/* ---------- Back to top / WhatsApp floating buttons ---------- */
body.hs-theme .back-to-top {
  background: linear-gradient(135deg, var(--main-color), var(--hover-color)) !important;
  border: 2px solid var(--hover-color) !important;
  color: #fff !important;
  border-radius: 50% !important;
  box-shadow: var(--hs-shadow);
}
body.hs-theme #WAButton { box-shadow: var(--hs-shadow) !important; border-radius: 50% !important; }

/* ---------- Misc: blockquote, highlighted text, pre ---------- */
body.hs-theme blockquote {
  border-left: 4px solid var(--hover-color);
  background: rgba(245,158,11,.08);
  padding: 16px 20px;
  border-radius: 0 var(--hs-radius-sm) var(--hs-radius-sm) 0;
  color: var(--hs-text);
  font-style: italic;
  margin: 20px 0;
}
body.hs-theme ::selection { background: var(--main-color); color: #fff; }

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
  body.hs-theme .breadcrumb-section { padding: 60px 0 40px !important; }
  body.hs-theme .breadcrumb-text h4.page-title { font-size: 28px !important; }
  body.hs-theme .section-gap,
  body.hs-theme .inner-section-gap { padding: 50px 0 !important; }
}

/* ---------- JS fallback avatars (team) + service icon placeholders ---------- */
body.hs-theme .hs-avatar-fb{
  width:100%; height:100%; border-radius:50%;
  background: #fff;
  color:var(--main-color); font-size:44px; font-weight:800;
  display:flex; align-items:center; justify-content:center;
  font-family:-apple-system,"PingFang TC",sans-serif;
  line-height:1;
}
body.hs-theme .hs-icon-fb{
  width:86px; height:86px; border-radius:18px;
  background: linear-gradient(135deg, rgba(180,83,9,.14), rgba(180,83,9,.05));
  color:var(--main-color);
  display:flex; align-items:center; justify-content:center;
  font-size:34px; margin:0 auto 14px;
}
body.hs-theme .contact-info ul li a{ color: var(--main-color); }
body.hs-theme .team-member .social-icons a{ background: rgba(255,255,255,.85); color:var(--main-color); }


/* ---------- Server-rendered initials avatars + emoji service icons ---------- */
body.hs-theme .member-picture .hs-avatar-initial{
  width:100%; height:100%; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:#fff; font-size:44px; font-weight:800;
  font-family:-apple-system,"PingFang TC","Noto Sans TC",sans-serif;
  letter-spacing:0; line-height:1;
}
body.hs-theme .member-picture img.hs-avatar-img{ width:100% !important; height:100% !important; object-fit:cover; border-radius:50%; }
body.hs-theme .service-box-three .icon{ font-size:32px; color:var(--main-color); }
body.hs-theme .service-box-three a.icon{ cursor:pointer; }
body.hs-theme .service-box-three .icon span{ font-size:34px; line-height:1; }

body.hs-theme .hs-cover{
  display:flex; align-items:center; justify-content:center;
  color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.25);
}
body.hs-theme .post-thumb .hs-cover--blog{ height:260px; border-radius:var(--hs-radius) var(--hs-radius) 0 0; }
body.hs-theme .project-thumb .hs-cover--port{ min-height:240px; }


/* ==========================================================================
   CONTACT PAGE (Webbuilder original skeleton preserved)
   - Targets the original .contact-section / .contact-info / .contact-form classes
   - All content remains editable from Webbuilder admin panel.
   ========================================================================== */
body.hs-theme section.contact-section{
  background:var(--hs-bg,#F0F7FF);
  padding:50px 0 60px;
}
body.hs-theme .contact-info{
  background:transparent;
  margin-bottom:40px;
}
body.hs-theme .illustration-img{
  margin-bottom:24px;
}
body.hs-theme .illustration-img img{
  max-width:100%;
  border-radius:calc(var(--hs-radius) + 6px);
  box-shadow:var(--hs-shadow);
}
body.hs-theme .illustration-img .hs-contact-art{
  padding:18px;
  background:var(--hs-surface,#fff);
  border-radius:calc(var(--hs-radius) + 6px);
  box-shadow:var(--hs-shadow);
  border:1px solid color-mix(in srgb,var(--main-color) 12%,#fff);
}
body.hs-theme .illustration-img .hs-contact-art svg{
  display:block; max-width:100%; height:auto;
}
body.hs-theme .contact-info-content{
  background:var(--hs-surface,#fff);
  padding:26px 28px;
  border-radius:calc(var(--hs-radius) + 6px);
  border:1px solid color-mix(in srgb,var(--main-color) 12%,#fff);
  box-shadow:var(--hs-shadow-sm);
}
body.hs-theme .contact-info-content .section-title .title-tag{
  display:inline-block;padding:5px 12px;
  border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.5px;
  color:var(--main-color);background:color-mix(in srgb,var(--main-color) 10%,#fff);
  border:1px solid color-mix(in srgb,var(--main-color) 20%,transparent);
  margin-bottom:12px;
}
body.hs-theme .contact-info-content .section-title .title{
  font-size:24px;font-weight:800;color:var(--hs-text,#1F2937);
  letter-spacing:-.3px;line-height:1.25;margin-bottom:6px;
}
body.hs-theme .contact-info-content ul{
  list-style:none;margin:18px 0 0;padding:0;
  display:flex;flex-direction:column;gap:10px;
}
body.hs-theme .contact-info-content ul li{
  display:flex !important;align-items:center !important;gap:10px !important;
  padding:10px 14px !important;
  border-radius:var(--hs-radius) !important;
  background:color-mix(in srgb,var(--main-color) 6%,#fff) !important;
  border:1px solid color-mix(in srgb,var(--main-color) 12%,transparent) !important;
  color:var(--hs-text,#1F2937) !important;
  font-size:13px !important;
  transition:transform .15s ease, box-shadow .15s ease;
  min-width:0 !important;
  line-height:1.45 !important;
  margin-bottom:8px !important;
}
body.hs-theme .contact-info-content ul li:last-child{ margin-bottom:0 !important; }
body.hs-theme .contact-info-content ul li > *{ min-width:0 !important; }
body.hs-theme .contact-info-content ul li:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 22px -12px color-mix(in srgb,var(--main-color) 25%,transparent);
}
body.hs-theme .contact-info-content ul li i{
  flex:none !important;width:28px !important;height:28px !important;border-radius:8px !important;
  background:linear-gradient(135deg,var(--main-color),var(--hover-color)) !important;
  color:#fff !important;font-size:13px !important;
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  margin:0 !important;
}
body.hs-theme .contact-info-content ul li a,
body.hs-theme .contact-info-content ul li span{
  color:var(--hs-text,#1F2937) !important;
  font-weight:500 !important;text-decoration:none !important;
  font-size:13px !important;
  line-height:1.5 !important;
  /* allow long emails/addresses to wrap, but do NOT hard-break phone numbers mid-digit */
  word-wrap:break-word !important;
  overflow-wrap:break-word !important;
  word-break:normal !important;
  hyphens:auto;
}
body.hs-theme .contact-info-content ul li a:hover{ color:var(--main-color) !important; }
/* tighten title spacing above the list */
body.hs-theme .contact-info-content .section-title{ margin-bottom:14px !important; }
body.hs-theme .contact-info-content .section-title .title{ font-size:20px !important; }
body.hs-theme .contact-info-content .section-title .title-tag{ font-size:11px !important; padding:4px 10px !important; }

/* Form card */
body.hs-theme .contact-form.grey-bg{
  background:var(--hs-surface,#fff) !important;
  border:1px solid color-mix(in srgb,var(--main-color) 12%,#fff);
  border-radius:calc(var(--hs-radius) + 6px);
  padding:36px 30px;
  box-shadow:var(--hs-shadow);
}
body.hs-theme .contact-form .input-group{
  position:relative; margin-bottom:20px;
}
body.hs-theme .contact-form .input-group input,
body.hs-theme .contact-form .input-group textarea{
  width:100%;
  padding:13px 52px 13px 16px;
  border-radius:var(--hs-radius-sm);
  border:1px solid color-mix(in srgb,var(--main-color) 22%,#cbd5e1);
  background:#fff;font-size:15px;color:var(--hs-text,#1F2937);
  transition:border-color .15s ease, box-shadow .15s ease;
  font-family:inherit;
  height:auto;
  line-height:1.4;
}
body.hs-theme .contact-form .input-group textarea{
  min-height:130px;
  padding-right:52px;
  resize:vertical;
}
body.hs-theme .contact-form .input-group input:focus,
body.hs-theme .contact-form .input-group textarea:focus{
  outline:none;border-color:var(--main-color);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--main-color) 18%,#fff);
}
body.hs-theme .contact-form .input-group input::placeholder,
body.hs-theme .contact-form .input-group textarea::placeholder{ color:#94a3b8; }
body.hs-theme .contact-form .input-group .icon{
  position:absolute;right:14px;top:50%;transform:translateY(-50%);
  color:var(--main-color); font-size:16px; line-height:1;
  pointer-events:none;
}
body.hs-theme .contact-form .input-group.textarea .icon{
  top:18px;transform:none;
}
body.hs-theme .contact-form button.main-btn.template-btn{
  display:inline-block;padding:12px 36px;border-radius:999px;font-weight:600;
  background:linear-gradient(135deg,var(--main-color),var(--hover-color));
  color:#fff !important;border:2px solid color-mix(in srgb,var(--hover-color),#fff 40%);
  box-shadow:0 8px 22px -8px var(--main-color);cursor:pointer;
  font-size:15px;transition:transform .15s ease, box-shadow .15s ease;
}
body.hs-theme .contact-form button.main-btn.template-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 28px -8px var(--main-color);
}
/* Map */
body.hs-theme .contact-map{
  border-radius:calc(var(--hs-radius) + 6px);
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--main-color) 12%,#fff);
  box-shadow:var(--hs-shadow);
  margin-top:40px;
}
body.hs-theme .contact-map iframe{ display:block;width:100%;height:420px;border:0; }
/* Stack form inputs at tablet */
@media (max-width:991px){
  body.hs-theme .contact-form.grey-bg{ padding:26px 20px; }
  body.hs-theme .contact-form .col-lg-4{ margin-bottom:0; }
}
@media (max-width:576px){
  body.hs-theme .contact-info-content{ padding:20px 16px; }
  body.hs-theme .contact-info-content .section-title .title{ font-size:20px; }
}

/* ==========================================================================
   TEAM PAGE (內頁) — 修復 hover 清晰度 + 社交圖示重疊
   - 社交 icon 原本絕對定位左上遮頭像，hover 時 legacy overlay 亦會蓋住文字
   - 改為 headshot 下方水平排列小圓 icon（只在 hover 顯示）
   - 強制 hover 時姓名/職稱顏色不被 legacy CSS 改為白色
   ========================================================================== */
body.hs-theme .team-member .member-picture .social-icons{
  position:absolute !important;
  left:0 !important; right:0 !important;
  bottom:0 !important; top:auto !important;
  width:100% !important;
  padding:10px 0 14px !important;
  margin:0 !important;
  display:flex; justify-content:center; gap:8px !important;
  background:linear-gradient(to top, rgba(0,0,0,.55), rgba(0,0,0,0) 100%) !important;
  border-radius:0 0 55px 55px !important;
  opacity:0 !important;
  transform:translateY(6px);
  transition:opacity .2s ease, transform .2s ease !important;
}
body.hs-theme .team-member:hover .member-picture .social-icons{
  opacity:1 !important;
  transform:translateY(0);
}
body.hs-theme .team-member .member-picture .social-icons a{
  width:30px !important; height:30px !important;
  border-radius:50% !important;
  background:rgba(255,255,255,.95) !important;
  color:var(--main-color) !important;
  display:flex !important; align-items:center; justify-content:center;
  font-size:12px !important; line-height:1 !important;
  margin:0 !important; padding:0 !important;
  transition:transform .15s ease, background .15s ease, color .15s ease !important;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}
body.hs-theme .team-member .member-picture .social-icons a i{
  color:var(--main-color) !important;
  font-size:12px !important; line-height:1 !important;
  width:auto !important; height:auto !important;
}
body.hs-theme .team-member .member-picture .social-icons a:hover{
  background:var(--main-color) !important;
  color:#fff !important;
  transform:scale(1.08);
}
body.hs-theme .team-member .member-picture .social-icons a:hover i{ color:#fff !important; }
/* 鎖定 hover 時姓名/職稱顏色（legacy CSS 會改成白色） */
body.hs-theme .team-member:hover .name,
body.hs-theme .team-member:hover .name a,
body.hs-theme .team-member:hover h3,
body.hs-theme .team-member:hover h4,
body.hs-theme .team-member:hover h5{
  color:var(--hs-text,#1F2937) !important;
}
body.hs-theme .team-member:hover .pro{
  color:var(--main-color) !important;
}
body.hs-theme .team-member .member-desc{ position:relative; z-index:2; }
/* headshot hover 輕微縮放，唔使 legacy overlay */
body.hs-theme .team-member .member-picture{ transition:transform .3s ease, box-shadow .3s ease; }
body.hs-theme .team-member:hover .member-picture{
  transform:translateY(-2px);
  box-shadow:0 14px 30px -12px color-mix(in srgb,var(--main-color) 55%,transparent);
}
/* 移除 legacy 三角形/overlay 陰影 */
body.hs-theme .team-member .member-picture::after,
body.hs-theme .team-member .member-picture-wrap::before,
body.hs-theme .team-member::before{ display:none !important; }

/* ==========================================================================
   FAQ PAGE — 修復答案配色看不見 + 多層陰影
   - 展開 panel 有深色 (--main-color) 背景 → 改成白色底 + 深灰字
   - 移除 legacy 雙重 border / 雙重 shadow
   - 統一 + / − icon 旋轉
   ========================================================================== */
body.hs-theme .faq-section .card{
  border:1px solid color-mix(in srgb,var(--main-color) 15%,#e5e7eb) !important;
  box-shadow:0 1px 2px rgba(15,23,42,.04) !important;
  margin-bottom:12px !important;
}
body.hs-theme .faq-section .card .card-header{
  background:#fff !important;
  border-bottom:0 !important;
  padding:18px 22px !important;
  transition:background .15s ease;
}
body.hs-theme .faq-section .card .card-header.active-header{
  background:color-mix(in srgb,var(--main-color) 6%,#fff) !important;
  border-bottom:1px solid color-mix(in srgb,var(--main-color) 12%,transparent) !important;
}
body.hs-theme .faq-section .card .card-header h6,
body.hs-theme .faq-section .card .card-header h5{
  font-size:15px !important;
  color:var(--hs-text,#1F2937) !important;
  margin:0 !important;
}
body.hs-theme .faq-section .card .card-header h6 a,
body.hs-theme .faq-section .card .card-header h5 a,
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"]{
  color:var(--hs-text,#1F2937) !important;
  text-decoration:none !important;
  width:100%; justify-content:space-between;
}
/* 修復問題：collapse 展開時 legacy CSS 會將 .card-body 變 main-color 深色底 */
body.hs-theme .faq-section .card .collapse,
body.hs-theme .faq-section .card .collapsing,
body.hs-theme .faq-section .card .collapse.show,
body.hs-theme .faq-section .card .card-body{
  background:#fff !important;
  color:var(--hs-text,#1F2937) !important;
}
body.hs-theme .faq-section .card .card-body p,
body.hs-theme .faq-section .card .card-body li,
body.hs-theme .faq-section .card .card-body span,
body.hs-theme .faq-section .card .card-body *,
body.hs-theme .faq-section .card .collapse.show *{
  color:var(--hs-text,#1F2937) !important;
  background:transparent !important;
}
body.hs-theme .faq-section .card .card-body{
  padding:18px 22px 22px !important;
  font-size:14.5px !important;
  line-height:1.75 !important;
  border:0 !important;
  box-shadow:none !important;
}
/* +/- toggle (Font Awesome glyphs) — 顏色跟 main-color，active 時不重複 override glyph */
body.hs-theme .faq-section .card .card-header .icons i{
  color:var(--main-color) !important;
  transition:transform .2s ease !important;
}
body.hs-theme .faq-section .card .card-header:not(.active-header) .icons i{ transform:rotate(0); }
body.hs-theme .faq-section .card .card-header.active-header .icons i{ transform:rotate(180deg); }
/* 移除 nested 雙重 border/shadow */
body.hs-theme .faq-section .card > .card,
body.hs-theme .faq-section .bg-light .card,
body.hs-theme .faq-section .card .card{
  border:0 !important; box-shadow:none !important;
  border-radius:0 !important; margin:0 !important;
}
body.hs-theme .faq-section .card-header .btn-link,
body.hs-theme .faq-section .card-header button{
  color:var(--hs-text,#1F2937) !important; text-decoration:none !important;
  padding:0 !important;
}
body.hs-theme .faq-section .card-header .btn-link:hover,
body.hs-theme .faq-section .card-header a:hover{
  color:var(--main-color) !important;
  text-decoration:none !important;
}

/* ==========================================================================
   FAQ PAGE v2 — 明顯可點 + 問題清晰 + 開合狀態清楚
   問題：FontAwesome 圖標因父層 font-weight:700 令 .far 配唔到字型檔，
        render 成小方框 □，用戶唔知邊度 click；且問題文字同 body 太似。
   做法：
   - 埋 .icons / 底層 FA 圖標，改成喺問題列右側畫一個圓形 ⊕ / ⊖ chevron
   - 問題字體加大加粗、整條 header 可點、hover 有反饋
   - 唔勾任何 flex/anonymous-text 陷阱；問題列用 block + 右 padding 畀位 icon
   ========================================================================== */

/* header 容器：整張卡一粒圓角 item，白底 */
body.hs-theme .faq-section .card{
  border:1px solid color-mix(in srgb,var(--main-color) 16%,#e5e7eb) !important;
  border-radius:12px !important;
  background:#fff !important;
  box-shadow:0 1px 2px rgba(15,23,42,.05) !important;
  overflow:hidden !important;
  margin-bottom:12px !important;
}

/* header：正常 (收埋) 白底；展開 brand tint */
body.hs-theme .faq-section .card .card-header{
  background:#fff !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
}
body.hs-theme .faq-section .card .card-header.active-header{
  background:color-mix(in srgb,var(--main-color) 6%,#fff) !important;
}

/* 問題文字：整行可點、粗黑、右邊留位畀 icon */
body.hs-theme .faq-section .card .card-header h5,
body.hs-theme .faq-section .card .card-header h6{
  display:block !important;            /* 用 block，避免 flex 文本排位問題 */
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  position:relative !important;
}
body.hs-theme .faq-section .card .card-header h5 a,
body.hs-theme .faq-section .card .card-header h6 a,
body.hs-theme .faq-section .card .card-header h6[data-toggle="collapse"],
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"]{
  display:block !important;            /* block + padding-right 畀 icon 位 */
  width:100% !important;
  padding:18px 52px 18px 20px !important;
  margin:0 !important;
  color:#111827 !important;
  background:transparent !important;
  border:0 !important;
  font-size:16px !important;
  font-weight:700 !important;          /* 問題加粗 */
  line-height:1.5 !important;
  text-align:left !important;
  text-decoration:none !important;
  white-space:normal !important;
  word-break:break-word !important;
  box-shadow:none !important;
  cursor:pointer !important;
  transition:color .15s ease, background .15s ease;
}

/* header 內右邊原 FA 圖標一律隱藏（□ 問題根源） */
body.hs-theme .faq-section .card .card-header .icons,
body.hs-theme .faq-section .card .card-header i,
body.hs-theme .faq-section .card .card-header .icons *{
  display:none !important;
}

/* 喺問題列右側畫圓形 ⊕ / ⊖ 指示符（用 Unicode 加減號，穩陣可靠） */
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"]::before,
body.hs-theme .faq-section .card .card-header h5 a::before,
body.hs-theme .faq-section .card .card-header h6 a::before{
  content:"";
  position:absolute;
  right:16px; top:50%;
  width:28px; height:28px;
  transform:translateY(-50%);
  border:1.5px solid color-mix(in srgb,var(--main-color) 35%,#cbd5e1);
  border-radius:50%;
  background:#fff;
}
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"]::after,
body.hs-theme .faq-section .card .card-header h5 a::after,
body.hs-theme .faq-section .card .card-header h6 a::after{
  content:"\FF0B";                              /* 全形 + （收合時）*/
  position:absolute;
  right:16px; top:50%;
  width:28px; height:28px;
  line-height:28px;
  transform:translateY(-50%);
  text-align:center;
  font-size:16px; font-weight:400;
  color:var(--main-color);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif !important;
}
/* 收埋：+ (expand) */
body.hs-theme .faq-section .card .card-header:not(.active-header) [data-toggle="collapse"]::before{
  border-color:color-mix(in srgb,var(--main-color) 35%,#cbd5e1);
  background:#fff;
}
body.hs-theme .faq-section .card .card-header:not(.active-header) [data-toggle="collapse"]::after{
  content:"\FF0B";
  color:var(--main-color);
  font-weight:600;
}
/* 已展開：− (collapse)，實心 brand 底 + 白色減號 */
body.hs-theme .faq-section .card .card-header.active-header [data-toggle="collapse"]::before,
body.hs-theme .faq-section .card .card-header.active-header h5 a::before,
body.hs-theme .faq-section .card .card-header.active-header h6 a::before{
  background:var(--main-color);
  border-color:var(--main-color);
}
body.hs-theme .faq-section .card .card-header.active-header [data-toggle="collapse"]::after,
body.hs-theme .faq-section .card .card-header.active-header h5 a::after,
body.hs-theme .faq-section .card .card-header.active-header h6 a::after{
  content:"\2212";                              /* − 數學減號 */
  color:#fff;
  font-size:18px; font-weight:700;
  line-height:26px;
}

/* hover / focus 反饋（未展開時） */
body.hs-theme .faq-section .card .card-header:not(.active-header) [data-toggle="collapse"]:hover,
body.hs-theme .faq-section .card .card-header:not(.active-header) h5 a:hover,
body.hs-theme .faq-section .card .card-header:not(.active-header) h6 a:hover{
  background:color-mix(in srgb,var(--main-color) 4%,#fff) !important;
  color:var(--main-color) !important;
}
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"]:focus,
body.hs-theme .faq-section .card .card-header [data-toggle="collapse"]:focus-visible{
  outline:none !important;
}

/* 答案區：柔和分隔 + 內縮 */
body.hs-theme .faq-section .card .card-body{
  padding:16px 22px 20px !important;
  font-size:15px !important;
  line-height:1.8 !important;
  color:#334155 !important;
  background:#fff !important;
  border-top:1px solid color-mix(in srgb,var(--main-color) 10%,#f1f5f9) !important;
  box-shadow:none !important;
}
body.hs-theme .faq-section .card .collapse,
body.hs-theme .faq-section .card .collapsing,
body.hs-theme .faq-section .card .collapse.show{
  background:#fff !important;
}
body.hs-theme .faq-section .card .card-body p,
body.hs-theme .faq-section .card .card-body li,
body.hs-theme .faq-section .card .card-body span,
body.hs-theme .faq-section .card .card-body *{
  color:#334155 !important;
  background:transparent !important;
}
body.hs-theme .faq-section .card .card-body p{ margin-bottom:0 !important; }

/* 移除舊版多餘 nested 結構 */
body.hs-theme .faq-section .card > .card,
body.hs-theme .faq-section .bg-light .card,
body.hs-theme .faq-section .card .card{
  border:0 !important; box-shadow:none !important;
  border-radius:0 !important; margin:0 !important;
  background:transparent !important;
}

/* FAQ section 背景 */
body.hs-theme .faq-section{
  background:#fff !important;
  padding-bottom:40px !important;
}

body.hs-theme .faq-section .container > .section-title,
body.hs-theme .faq-section .page-title{ color:var(--main-color); }

