/* Shared PC / tablet / phone layout. Loaded after the archived theme. */
.juguo-site {
  --site-width: 88%;
  --site-gap: clamp(20px, 2vw, 64px);
  --site-copy: clamp(16px, 1.05vw, 32px);
  font-size: var(--site-copy);
}

.juguo-site .container {
  width: var(--site-width);
  max-width: none;
  padding-inline: 0;
  margin-inline: auto;
}

.juguo-site .container .container {
  width: 100%;
}

.juguo-site .header-bg-lg {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: var(--site-gap);
  padding: clamp(180px, 11vw, 320px) 6% clamp(64px, 6vw, 180px);
  min-height: min(900px, 90svh);
  background-size: 100% 100%;
}

.juguo-site .header-bg-lg > .container-fluid {
  width: 100%;
  padding: 0;
  min-width: 0;
}

.juguo-site .header-bg-lg .row {
  margin: 0;
}

.juguo-site .header-bg-lg .col-lg-6 {
  width: 100%;
  padding: 0;
}

.juguo-site .header-bg-lg .max-585 {
  max-width: none;
  margin: 0 !important;
}

.juguo-site .header-bg-lg .header-content {
  padding: 0;
  margin: 0;
  text-align: left;
}

.juguo-site .header-bg-lg .header-content h1 {
  font-size: clamp(40px, 3.7vw, 132px);
  line-height: 1.25;
  margin: 0 0 24px;
  max-width: 13em;
}

.juguo-site .header-bg-lg .header-content p {
  font-size: var(--site-copy);
  line-height: 1.85;
  margin-bottom: 32px;
  max-width: 42em;
}

.juguo-site .header-bg-lg .header-image-shape {
  position: static;
  inset: auto;
  transform: none;
  width: 100%;
  max-width: none;
  padding: 0;
  margin: 0;
  min-width: 0;
}

.juguo-site .header-bg-lg .header-image-shape img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* Above-the-fold content must stay visible before and after plugin startup. */
.juguo-site .header-bg-lg .header-content h1,
.juguo-site .header-bg-lg .header-content p,
.juguo-site .header-bg-lg .header-image-shape img,
.juguo-site .header-bg-lg .main-btn {
  opacity: 1;
  animation: none;
}

.juguo-site .header-bg-lg .button-group {
  justify-content: flex-start;
  gap: 16px;
  margin: 0;
}

.juguo-site .header-bg-lg .button-group .main-btn {
  margin: 0;
}

.juguo-site .main-btn {
  font-size: max(15px, .9em);
  min-height: 44px;
  padding: .9em 2em;
}

.juguo-site .navbar-brand .logo,
.juguo-site .footer-logo img {
  width: clamp(150px, 11vw, 320px);
  height: auto;
}

.juguo-site .main-nav .navbar-collapse {
  flex-grow: 0;
  min-width: 0;
}

.juguo-site .main-nav nav .navbar-nav .nav-item a {
  font-size: clamp(16px, 1vw, 30px);
  white-space: nowrap;
  padding-inline: clamp(10px, 1vw, 30px);
}

.juguo-site .topbar-list li {
  font-size: clamp(14px, .85vw, 24px);
}

.juguo-site .feature-section,
.juguo-site .service-section,
.juguo-site .process-section {
  padding-block: clamp(56px, 5vw, 160px);
}

.juguo-site .section-title {
  max-width: 80%;
  margin: 0 auto clamp(32px, 3vw, 96px);
}

.juguo-site .section-title h2 {
  font-size: clamp(28px, 2.2vw, 76px);
  line-height: 1.45;
}

.juguo-site .section-title p,
.juguo-site .feature-card-body p,
.juguo-site .service-card-body p,
.juguo-site .process-text p {
  font-size: var(--site-copy);
  line-height: 1.8;
}

.juguo-site .section-title small {
  font-size: var(--site-copy);
}

.juguo-site .feature-section .container > .row,
.juguo-site .service-section > .container > .row,
.juguo-site .process-content > .row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--site-gap);
  margin: 0;
}

.juguo-site .feature-section .container > .row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.juguo-site .feature-section .row > [class*="col-"],
.juguo-site .service-section > .container > .row > [class*="col-"],
.juguo-site .process-content > .row > [class*="col-"] {
  width: auto;
  min-width: 0;
  padding: 0;
  margin: 0;
}

.juguo-site .feature-card,
.juguo-site .service-card,
.juguo-site .process-item.border {
  height: 100%;
  padding: clamp(24px, 2vw, 64px);
}

.juguo-site .feature-card-header {
  gap: 16px;
}

.juguo-site .feature-card-thumb {
  flex: 0 0 auto;
  width: clamp(48px, 4vw, 96px);
  height: clamp(48px, 4vw, 96px);
  font-size: clamp(26px, 2.2vw, 56px);
  margin-right: 0;
}

.juguo-site .feature-card-header span,
.juguo-site .service-card-body h3,
.juguo-site .process-text h3 {
  font-size: clamp(20px, 1.4vw, 48px);
  line-height: 1.4;
}

.juguo-site .service-card-thumb {
  width: clamp(80px, 6vw, 180px);
  height: clamp(80px, 6vw, 180px);
  font-size: clamp(40px, 3.2vw, 96px);
}

.juguo-site .footer-details p,
.juguo-site .footer-list li,
.juguo-site .footer-address-text p {
  font-size: var(--site-copy);
  overflow-wrap: anywhere;
}

.juguo-site .footer-content-title h3 {
  font-size: clamp(22px, 1.4vw, 40px);
}

.juguo-site .footer-upper {
  padding-block: clamp(56px, 5vw, 140px);
}

@media (min-width: 1200px) {
  .juguo-site .navbar-area {
    padding-block: 12px;
  }

  .juguo-site .footer-upper > .container > .row > .col-lg-3 {
    flex: 1 1 0;
    min-width: 0;
  }

  .juguo-site .footer-upper > .container > .row > .col-lg-3:first-child {
    flex-grow: 2;
  }
}

@media (max-width: 1199px) {
  .juguo-site { --site-width: 92%; }
  .juguo-site .header-bg-lg { padding-inline: 4%; }
  .juguo-site .feature-section .container > .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .juguo-site .service-section > .container > .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .juguo-site .mobile-nav .logo { width: 150px; height: auto; }
  .juguo-site .mean-container .mean-nav { max-height: calc(100svh - 150px); overflow-y: auto; }
  .juguo-site .mean-container .mean-nav ul li a { min-height: 44px; }
}

@media (max-width: 767px) {
  .juguo-site { --site-width: calc(100% - 40px); --site-copy: 16px; --site-gap: 20px; }
  .juguo-site .header-bg-lg {
    grid-template-columns: minmax(0, 1fr);
    padding: 104px 20px 48px;
    min-height: 0;
    gap: 32px;
  }
  .juguo-site .header-bg-lg .header-content h1 { font-size: clamp(30px, 6.5vw, 44px); margin-bottom: 20px; }
  .juguo-site .header-bg-lg .header-content p { line-height: 1.8; margin-bottom: 24px; }
  .juguo-site .header-bg-lg .header-image-shape { max-width: 500px; justify-self: center; }
  .juguo-site .header-bg-lg .button-group { flex-wrap: wrap; gap: 12px; }
  .juguo-site .header-bg-lg .main-btn { padding-inline: 24px; }
  .juguo-site .section-title { max-width: 100%; margin-bottom: 28px; }
  .juguo-site .section-title h2 { font-size: 26px; }
  .juguo-site .service-section > .container > .row,
  .juguo-site .process-content > .row { grid-template-columns: minmax(0, 1fr); }
  .juguo-site .feature-card,
  .juguo-site .service-card,
  .juguo-site .process-item.border { padding: 24px; }
  .juguo-site .footer-upper .row { row-gap: 24px; }
  .juguo-site .footer-details p { line-height: 1.8; }
  .juguo-site .mobile-nav { min-height: 68px; }
  .juguo-site .mobile-nav .navbar-option-item button { min-width: 32px; min-height: 40px; }
  .juguo-site .mobile-nav .navbar-option { margin-right: 42px; }
  .juguo-site .mobile-nav .navbar-option-item { margin-left: 4px; }
  .juguo-site .mean-container .mean-nav { max-height: calc(100svh - 80px); }
  .juguo-site .form-control { font-size: 16px; }
}

@media (max-width: 575px) {
  .juguo-site .feature-section .container > .row { grid-template-columns: minmax(0, 1fr); }
  .juguo-site .mobile-nav .navbar-option-item:first-child { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .juguo-site *, .juguo-site *::before, .juguo-site *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
