﻿/* 2026-10-05: one consistent bilingual typeface and clearer reading sizes. */
.digital-site {
  --brand-font: 'Noto Serif TC', 'Noto Serif CJK TC', 'Songti TC', 'PMingLiU', serif;
  --serif: var(--brand-font);
  --body: var(--brand-font);
  font-family: var(--brand-font);
  font-size: 18px;
  font-weight: 500;
}
.digital-site :is(h1, h2, h3, p, a, button, input, textarea, label, small, strong, span) {
  font-family: var(--brand-font);
}
.digital-site :is(h1, h2, h3) { font-weight: 600; }
.digital-site :is(button, .scene-button, .scene-nav-link, .home-link, .enter-button) { font-weight: 600; }
.digital-site p { line-height: 1.9; }
.digital-site .scene-wordmark { font-size: clamp(116px, 14vw, 208px); line-height: 1; font-weight: 600; }
.digital-site .scene-title { font-size: clamp(60px, 6.7vw, 102px); line-height: 1.12; letter-spacing: -.045em; }
html:lang(zh-Hant) .digital-site .scene-title { font-size: clamp(42px, 5vw, 74px); line-height: 1.4; letter-spacing: 0; }
.digital-site .scene-slogan { font-size: clamp(28px, 2.9vw, 42px); line-height: 1.55; font-weight: 600; }
html:lang(zh-Hant) .digital-site .scene-slogan { font-size: clamp(26px, 2.7vw, 38px); }
.digital-site .scene-kicker { font-size: 15px; letter-spacing: .05em; font-weight: 600; }
/* Main company slogan keeps its warm gold, now a clear feature above the headline. */
.digital-site .scene-imagination .scene-kicker {
  font-size: clamp(29px, 2.7vw, 40px);
  line-height: 1.5;
  letter-spacing: 0;
  margin-bottom: 28px;
  max-width: 590px;
  font-weight: 600;
  text-wrap: balance;
}
html:lang(zh-Hant) .digital-site .scene-imagination .scene-kicker { font-size: clamp(27px, 2.5vw, 36px); }
.digital-site .scene-description { font-size: 18px; line-height: 1.9; max-width: 470px; font-weight: 500; }
html:lang(zh-Hant) .digital-site .scene-description { font-size: 18px; }
.digital-site .scene-nav { max-width: 430px; }
.digital-site .scene-nav-link { font-size: 17px; line-height: 1.7; min-height: 56px; }
.digital-site .scene-button { font-size: 19px; line-height: 1.6; }
.digital-site .scene-text-link, .digital-site .scene-scroll { font-size: 15px; font-weight: 600; }
.digital-site .scene-brand { font-size: 32px; font-weight: 600; }
.digital-site .scene-controls .language button, .digital-site .sub-header .language button { font-size: 15px; font-weight: 600; }
.digital-site .motion-toggle { font-size: 13px; font-weight: 600; opacity: 1; }
.digital-site .eyebrow { font-size: 14px; letter-spacing: .08em; font-weight: 600; }
.digital-site .section-heading h2, .digital-site .about-services > h2 { font-size: clamp(34px, 3.5vw, 48px); line-height: 1.4; }
html:lang(zh-Hant) .digital-site .section-heading h2 { font-size: clamp(30px, 3vw, 38px); }
.digital-site .service-card h3, .digital-site .case-card h3 { font-size: 29px; line-height: 1.55; }
html:lang(zh-Hant) .digital-site .service-card h3, html:lang(zh-Hant) .digital-site .case-card h3 { font-size: 25px; }
.digital-site .service-card p, .digital-site .case-card p,
html:lang(zh-Hant) .digital-site .service-card p, html:lang(zh-Hant) .digital-site .case-card p,
.digital-site .about-copy p, .digital-site .gallery-intro, .digital-site .form-notice,
.digital-site #concept-detail, .digital-site .contact-details {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.95;
  color: #293e50;
}
.digital-site .sub-main > h1 { font-size: clamp(52px, 7.5vw, 90px); line-height: 1.35; }
html:lang(zh-Hant) .digital-site .sub-main > h1 { font-size: clamp(34px, 4.8vw, 54px); line-height: 1.5; }
.digital-site .about-copy h2 { font-size: clamp(34px, 3.4vw, 46px); line-height: 1.5; }
html:lang(zh-Hant) .digital-site .about-copy h2 { font-size: 34px; }
.digital-site .concept-caption small { font-size: 14px; font-weight: 500; color: #3e5364; }
.digital-site .concept-caption strong { font-size: 33px; line-height: 1.5; font-weight: 600; }
.digital-site .concept-card { opacity: .85; }
.digital-site .concept-card.is-active { opacity: 1; }
.digital-site #concept-dialog h2, .digital-site .contact-form-panel h2 { font-size: 38px; line-height: 1.5; }
.digital-site #contact-form label { font-size: 16px; font-weight: 600; }
.digital-site #contact-form input, .digital-site #contact-form textarea { font-size: 18px; font-weight: 500; }
.digital-site .footer-company { font-size: 15px; line-height: 1.8; }
.digital-site .footer-established, .digital-site .footer-bottom { font-size: 13px; line-height: 1.9; }
.digital-site .footer-established { white-space: normal; }
.digital-site .footer-bottom a { min-height: 44px; display: inline-flex; align-items: center; }
.digital-site .scene-content .section-heading { gap: 24px; }
.digital-site .scene-copy, .digital-site .sub-header, .digital-site .scene-controls { min-width: 0; }
@media (max-width: 700px) {
  /* No large gold connecting loops on any mobile page. Keep the cat's yarn ball. */
  .digital-site .scene-yarn, .digital-site .subpage-orbit,
  .digital-site #yarn-map, .digital-site .orbit-ring, .digital-site .stage-ring { display: none; }
  .digital-site .scene-content::before { display: none; }
  .digital-site { font-size: 17px; }
  .digital-site .scene-title { font-size: 56px; line-height: 1.15; }
  html:lang(zh-Hant) .digital-site .scene-title { font-size: 42px; line-height: 1.45; }
  .digital-site .scene-wordmark { font-size: 124px; }
  .digital-site .scene-slogan, html:lang(zh-Hant) .digital-site .scene-slogan { font-size: 28px; }
  .digital-site .scene-imagination .scene-kicker,
  html:lang(zh-Hant) .digital-site .scene-imagination .scene-kicker { font-size: 26px; line-height: 1.65; margin-bottom: 22px; }
  .digital-site .scene-kicker { font-size: 14px; }
  .digital-site .scene-description, html:lang(zh-Hant) .digital-site .scene-description { font-size: 17px; }
  .digital-site .scene-nav { max-width: none; }
  .digital-site .scene-nav-link { font-size: 15px; padding: 12px 10px; min-height: 78px; }
  .digital-site .scene-button { font-size: 18px; }
  .digital-site .scene-text-link, .digital-site .scene-scroll { font-size: 14px; }
  .digital-site .scene-brand { font-size: 28px; }
  .digital-site .scene-controls .language button, .digital-site .sub-header .language button { font-size: 14px; }
  .digital-site .motion-toggle { font-size: 12px; padding-inline: 9px; }
  .digital-site .scene-topbar { padding-inline: 20px; gap: 10px; }
  .digital-site .scene-topbar .scene-controls { max-width: none; margin-left: auto; }
  .digital-site .service-card p, .digital-site .case-card p,
  html:lang(zh-Hant) .digital-site .service-card p, html:lang(zh-Hant) .digital-site .case-card p,
  .digital-site .about-copy p, .digital-site .gallery-intro, .digital-site .form-notice,
  .digital-site #concept-detail, .digital-site .contact-details { font-size: 17px; line-height: 1.95; }
  .digital-site .service-card h3, .digital-site .case-card h3 { font-size: 27px; }
  html:lang(zh-Hant) .digital-site .service-card h3, html:lang(zh-Hant) .digital-site .case-card h3 { font-size: 24px; }
  .digital-site .section-heading { flex-wrap: wrap; }
  .digital-site .section-heading h2, .digital-site .about-services > h2 { font-size: 36px; }
  html:lang(zh-Hant) .digital-site .section-heading h2 { font-size: 30px; }
  .digital-site .sub-main > h1 { font-size: 48px; }
  html:lang(zh-Hant) .digital-site .sub-main > h1 { font-size: 34px; }
  .digital-site .about-copy h2, html:lang(zh-Hant) .digital-site .about-copy h2 { font-size: 33px; }
  .digital-site .concept-caption strong { font-size: 28px; }
  .digital-site .contact-form-panel h2, .digital-site #concept-dialog h2 { font-size: 36px; }
}
@container (max-width: 260px) {
  .digital-site .scene-title { font-size: 38px !important; line-height: 1.3 !important; }
  .digital-site .scene-wordmark { font-size: 72px; }
  .digital-site .scene-nav { grid-template-columns: 1fr; }
  .digital-site .scene-nav-link { min-height: 52px; }
  .digital-site .scene-imagination .scene-kicker { font-size: 24px; }
  .digital-site .phrase-end { white-space: normal; }
}
