/* Layout measured from office-thunagu.com on 2026-10-16. */
@font-face { font-family: "Font Awesome 6 Free"; font-style: normal; font-weight: 900; font-display: block; src: url("./assets/fonts/fa-solid-900.woff2") format("woff2"); }
@font-face { font-family: "Font Awesome 6 Brands"; font-style: normal; font-weight: 400; font-display: block; src: url("./assets/fonts/fa-brands-400.woff2") format("woff2"); }
.fa-solid, .fa-brands { display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-variant: normal; line-height: 1; text-rendering: auto; }
.fa-solid { font-family: "Font Awesome 6 Free"; font-weight: 900; }
.fa-brands { font-family: "Font Awesome 6 Brands"; font-weight: 400; }
.arrow-right::before { content: "\f178"; }
.external-arrow::before { content: "\f08e"; }
.icon-youtube::before { content: "\f167"; }
.icon-facebook::before { content: "\f09a"; }

:root { --paper: #f1eee8; --line: #d6d6d6; }
h2, h3 { margin: 0; }
#main { padding-top: var(--hero-height); }
.hero { position: fixed; inset: 0 0 auto; }
.page-sections { position: relative; z-index: 1; display: flex; flex-direction: column; }
.page-section { position: relative; display: flex; flex-direction: column; align-items: center; flex: 0 0 auto; width: 100%; margin-top: -1px; background: #fff; }
.section-container { width: 1440px; max-width: 100%; margin: 120px 0; padding: 0 80px; }
.section-heading { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-start; gap: 10px; max-width: 100%; }
.section-english { max-width: 100%; font: 500 64px/1 "Inter", sans-serif; letter-spacing: -.025em; }
.section-heading > h2 { padding-left: 4px; font: 400 16px/1.75 var(--japanese); letter-spacing: .06em; }
.heading-green > .section-english { color: var(--green-strong); }
.view-link { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 12px; max-width: 100%; }
.view-label { position: relative; padding-top: 1px; padding-bottom: 1px; font: 400 14px/1.75 var(--japanese); white-space: nowrap; }
.view-label::after { position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: var(--green); content: ""; transform: scaleX(0); transform-origin: left; transition: transform 300ms; }
.circle-arrow { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid var(--green); border-radius: 50%; color: var(--green); transition: border-color 250ms, background 250ms, color 250ms, transform 250ms; }
.circle-arrow > i { font-size: 11px; }
.view-link:hover .view-label, .view-link:focus-visible .view-label { color: #0f876a; }
.view-link:hover .view-label::after, .view-link:focus-visible .view-label::after { transform: scaleX(1); }
.view-link:hover .circle-arrow, .view-link:focus-visible .circle-arrow { border-color: var(--green-strong); background: var(--green-strong); color: white; transform: translateX(3px); }

.news-layout { display: flex; align-items: flex-start; justify-content: space-between; }
.news-section-intro { display: flex; flex: 0 0 25%; flex-direction: column; align-items: flex-start; gap: 48px; }
.news-list { flex: 0 0 75%; min-width: 0; }
.news-list > li { width: 100%; border-bottom: 1px solid var(--line); }
.news-row { display: flex; align-items: center; gap: 24px; width: 100%; padding: 24px 0; }
.news-date { display: flex; flex: 0 0 auto; align-items: center; gap: 16px; }
.news-date > time { color: #666; font-size: 14px; line-height: 1.75; }
.news-category { flex: 0 0 100px; }
.news-row > h3 { flex: 1; min-width: 0; font: 400 16px/1.6 var(--japanese); }
.news-row:hover h3 { color: var(--green); }

.service-inner { display: flex; flex-direction: column; align-items: center; }
.service-header { width: 100%; padding-bottom: 48px; }
.service-list { width: 100%; }
.service-row { display: flex; align-items: flex-start; justify-content: space-between; width: 100%; padding: 44px 20px 43px; border-bottom: 1px solid var(--line); }
.service-image { flex: 0 0 auto; width: 31.25%; height: auto; border-radius: 12px; }
.service-body { display: flex; flex: 0 0 66%; flex-direction: column; align-items: flex-start; gap: 20px; min-width: 0; }
.service-top { display: flex; align-items: center; justify-content: space-between; gap: 40px; width: 100%; padding-right: 16px; }
.service-top h3 { max-width: 100%; font: 500 28px/1.6 var(--japanese-bold); letter-spacing: -.02em; }
.service-description { width: 100%; font: 400 16px/1.95 var(--japanese); }
.service-tags { display: flex; flex-wrap: wrap; gap: 12px; max-width: 100%; margin-top: 12px; }
.service-tags > li { max-width: 100%; padding: 2px 12px; border-radius: 4px; background: var(--paper); font: 400 13px/1.8 var(--japanese); }
.service-actions { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 32px; max-width: 100%; margin-top: 72px; }
.soft-button { position: relative; display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 320px; max-width: 100%; padding: 16px; border-radius: 10px; background: var(--paper); font: 400 16px/1.95 var(--japanese); transition: background 300ms, color 300ms; }
.soft-button > i { position: absolute; right: 20px; color: #666; font-size: 11px; }
.soft-button:hover { background: var(--green-strong); color: white; }
.soft-button:hover > i { right: 17px; color: white; }

.section-track { padding: 100px 0 176px; background: linear-gradient(rgb(116 111 101 / 80%), rgb(116 111 101 / 80%)), url("./assets/track-record.jpg") center / cover; }
.track-inner { width: 1060px; max-width: calc(100% - 160px); }
.track-heading { align-items: center; padding-bottom: 48px; color: white; }
.track-list { display: flex; flex-wrap: wrap; align-items: stretch; gap: 40px; width: 100%; }
.track-list > li { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; justify-content: center; width: calc(33.33% - 26.668px); padding: 38px 32px; border-radius: 8px; background: white; text-align: center; }
.track-list p { font: 300 20px/1.6 var(--japanese); }

.section-voice { align-items: flex-end; margin-top: -56px; border-radius: 0 56px 0 0; background: var(--paper); overflow: hidden; }
.voice-inner { width: 90%; margin: 120px 0; }
.voice-header { display: flex; align-items: flex-end; justify-content: space-between; width: 89%; padding-bottom: 44px; }
.voice-viewport { width: 100%; overflow-x: auto; overflow-y: hidden; padding-bottom: 12px; scrollbar-width: none; overscroll-behavior-x: contain; }
.voice-viewport::-webkit-scrollbar { display: none; }
.voice-track { display: flex; align-items: stretch; width: 100%; }
.voice-slide { display: flex; flex: 0 0 440px; align-items: stretch; padding-right: 40px; }
.voice-card { display: flex; flex: 1; flex-direction: column; gap: 16px; width: 100%; min-width: 0; padding-bottom: 22px; border-radius: 12px; background: white; }
.voice-image-wrap { flex: 0 0 auto; width: 100%; overflow: hidden; border-radius: 12px 12px 0 0; aspect-ratio: 8 / 5; }
.voice-image { width: 100%; height: 100%; object-fit: contain; background: white; transition: transform 400ms ease-in-out; }
.voice-body { display: flex; flex: 1; flex-direction: column; justify-content: space-between; padding: 0 22px; }
.voice-summary { display: flex; flex: 1; flex-direction: column; gap: 4px; margin-bottom: 20px; }
.voice-company { font: 300 12px/1.75 var(--japanese); }
.voice-title { font: 600 20px/1.6 var(--japanese-bold); transition: color 300ms; }
.voice-industry { padding-top: 10px; border-top: 1px solid var(--line); }
.voice-industry > p { margin-left: 4px; font: 500 12px/1.75 var(--japanese); }
.voice-card:hover .voice-image { transform: scale(1.035); }
.voice-card:hover .voice-title { color: #0f876a; }

.section-company::before { position: absolute; inset: 260px 0 0; background: linear-gradient(90deg, #fff 47%, #f5f5f5 48%); content: ""; }
.company-photo { position: relative; align-self: flex-start; width: 80%; height: 460px; border-radius: 6px 56px 6px 6px; overflow: hidden; background: #e5ebe5; }
.company-panel { position: relative; display: flex; flex-direction: column; align-items: center; width: 1440px; max-width: calc(100% - 80px); margin-left: 80px; padding-right: 80px; border-radius: 0 0 0 12px; background: #f5f5f5; }
.company-body { width: 920px; max-width: calc(100% - 160px); margin: 80px 80px 120px; }
.company-header { display: flex; align-items: flex-end; justify-content: space-between; width: 100%; margin-bottom: 48px; padding-top: 10px; }
.company-message { max-width: 100%; font: 400 30px/1.8 var(--japanese); letter-spacing: .01em; }
.company-links { display: flex; flex-wrap: wrap; gap: 0 20px; width: 100%; margin-top: 48px; }
.company-links > li { width: calc(50% - 10px); border-bottom: 1px solid var(--line); }
.company-links a { display: flex; align-items: center; gap: 4px; width: 100%; padding: 20px 0 20px 4px; font: 300 18px/1.6 var(--japanese); }
.company-links a > span { flex: 1; }
.company-links a > i { flex: 0 0 22px; padding-right: 10px; color: var(--green); font-size: 12px; }
.company-links a:hover { color: var(--green); }

.section-contact { margin-top: -40px; border-radius: 40px 40px 0 0; background: linear-gradient(105.58deg, #c3e0c8 0%, #edd5a6 28.72%, #cfe1c3 58.45%, #99d3c5 84.56%, #bceef1 100%); }
.contact-glass { display: flex; flex-direction: column; align-items: center; width: 100%; padding: 100px 0; border-radius: inherit; background: rgb(255 255 255 / 50%); backdrop-filter: blur(200px); -webkit-backdrop-filter: blur(200px); }
.contact-card { display: flex; flex-direction: column; align-items: center; width: 1076px; max-width: calc(100% - 160px); margin: 0 80px; padding: 48px 40px; border-radius: 20px; background: white; }
.contact-heading { align-items: center; text-align: center; }
.contact-copy { margin: 24px 0 10px; font: 600 16px/1.75 var(--japanese); }
.contact-button { position: relative; display: flex; align-items: center; justify-content: center; width: 320px; max-width: 100%; height: 70px; padding: 20px 0; border-radius: 10px; background: var(--green-strong); color: white; font: 600 18px/1.75 var(--japanese-bold); transition: background 300ms; }
.contact-button > i { position: absolute; right: 16px; font-size: 11px; }
.contact-button:hover { background: #0f876a; }

.site-footer { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; width: 100%; padding: 64px 0 20px; background: white; color: #000; }
.footer-inner { width: 1440px; max-width: 100%; padding: 0 80px; }
.footer-brand { display: block; width: 224px; max-width: 100%; }
.footer-brand > img { width: 100%; height: auto; }
.footer-main { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 40px; width: 100%; margin: 32px 0 40px; }
.footer-info { display: flex; flex-direction: column; gap: 20px; width: 405px; max-width: 100%; }
.footer-address { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; width: 100%; font: 400 15px/1.75 var(--japanese); }
.footer-address > span { display: block; max-width: 100%; }
.footer-address > a { display: inline-flex; align-items: center; justify-content: center; font-size: 14px; }
.footer-social { display: flex; align-items: center; gap: 20px; font-size: 20px; }
.footer-nav { display: flex; align-items: flex-start; gap: 64px; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.footer-main-link { display: flex; align-items: center; height: 21px; padding-bottom: 1px; font: 300 16px/1.75 var(--japanese-bold); }
.footer-sub-links { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.footer-sub-links a { display: flex; align-items: center; height: 21px; padding-bottom: 1px; font: 300 13px/1.75 var(--japanese); }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 24px; width: 100%; font: 400 12px/1.75 var(--japanese); }
.footer-nav a:hover, .footer-bottom a:hover, .footer-address a:hover { color: var(--green); }

html.has-reveals [data-reveal] { opacity: 0; transform: translateY(10px); transition: opacity 600ms var(--ease), transform 600ms var(--ease); }
html.has-reveals [data-reveal-fast] { transition-duration: 300ms; }
html.has-reveals [data-reveal].is-revealed, html.has-reveals [data-reveal]:focus-within { opacity: 1; transform: none; }

@media (max-width: 1060px) {
  .section-container { padding-right: 72px; padding-left: 72px; }
  .news-list { flex-basis: 70%; }
  .track-inner { max-width: calc(100% - 144px); }
  .voice-inner { width: 95%; }
  .voice-header { width: 94%; }
  .voice-slide { flex-basis: 380px; }
  .company-photo { height: 340px; border-radius: 0 12px 12px 0; }
  .section-company::before { top: 200px; }
  .company-panel { max-width: calc(100% - 72px); margin-left: 72px; padding-right: 72px; }
  .company-header { padding-top: 0; }
  .contact-card { max-width: calc(100% - 144px); margin: 0 72px; }
  .footer-inner { width: 90%; padding: 0; }
}

@media (max-width: 840px) {
  #main { padding-top: var(--hero-height); }
  .section-container { margin-top: 88px; margin-bottom: 88px; }
  .section-heading { gap: 4px; }
  .section-english { font-size: 52px; }
  .section-heading > h2 { font-size: 14px; }
  .news-layout { flex-direction: column; }
  .news-section-intro { flex: 0 0 auto; flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 20px; width: 100%; padding-bottom: 24px; }
  .news-list { flex: 1 0 auto; width: 100%; }
  .news-row { flex-direction: column; align-items: flex-start; gap: 8px; padding: 16px 0; }
  .news-date { width: 100%; }
  .news-date > time { font-size: 13px; }
  .news-category { flex-basis: auto; }
  .news-row > h3 { flex: 0 0 auto; width: 100%; font-size: 14px; }
  .service-header { padding-bottom: 0; }
  .service-row { flex-wrap: wrap; gap: 10px; padding: 32px 0; }
  .service-image { width: 100%; aspect-ratio: 1200 / 674; object-fit: cover; border-radius: 6px; }
  .service-body { flex-basis: 100%; gap: 10px; }
  .service-top { flex-wrap: wrap; gap: 40px 0; padding-right: 8px; }
  .service-top h3 { font-size: 22px; }
  .service-description { font-size: 14px; }
  .service-row:nth-child(n + 2) .service-description { font-size: 15px; }
  .service-more .view-label { display: none; }
  .service-more .circle-arrow { width: 32px; height: 32px; }
  .service-tags > li { padding-right: 10px; font-size: 13px; }
  .service-actions { flex-wrap: wrap; gap: 20px; margin-top: 40px; }
  .section-track { padding: 88px 0 144px; }
  .track-heading { padding-bottom: 32px; }
  .track-heading > h2 { font-size: 15px; }
  .track-list { gap: 20px; }
  .track-list > li { width: calc(33.33% - 13.334px); padding: 24px 28px; }
  .track-list p { font-size: 16px; }
  .voice-inner { width: calc(100% - 72px); margin: 88px 0 88px 72px; }
  .voice-header { padding-bottom: 32px; }
  .voice-slide { flex-basis: 48%; padding-right: 32px; }
  .voice-summary { margin-bottom: 10px; }
  .voice-company { font-size: 13px; }
  .voice-title { font-size: 18px; }
  .section-company::before { top: 160px; }
  .company-photo { width: 85%; height: 300px; }
  .company-panel { width: 100%; max-width: 100%; margin-left: 0; padding: 0 72px; }
  .company-body { max-width: 100%; margin: 48px 0 88px; }
  .company-header { margin-bottom: 32px; }
  .company-message { width: 100%; font-size: 24px; }
  .company-links { margin-top: 32px; }
  .company-links a { font-size: 16px; }
  .section-contact { margin-top: -32px; }
  .contact-glass { border-radius: 32px 32px 0 0; }
  .contact-card { padding: 48px 20px; }
  .contact-heading > h2 { font-size: 15px; }
  .site-footer { padding-top: 40px; }
  .footer-main { margin: 24px 0 32px; }
  .footer-info { width: 100%; gap: 24px; }
  .footer-address { font-size: 14px; }
  .footer-address > a { font-size: 12px; }
  .footer-nav { display: none; }
  .footer-bottom { font-size: 10px; }
}

@media (max-width: 540px) {
  .section-container { width: 90%; max-width: 90%; padding: 0; }
  .view-label { font-size: 13px; }
  .view-link > .circle-arrow { width: 36px; height: 36px; }
  .view-link > .circle-arrow > i { font-size: 9px; }
  .service-more > .circle-arrow { width: 32px; height: 32px; }
  .service-more > .circle-arrow > i { font-size: 11px; }
  .service-body { gap: 8px; }
  .service-actions { width: 100%; margin-top: 32px; }
  .soft-button { width: 100%; }
  .track-inner { width: 90%; max-width: 90%; }
  .track-list { flex-direction: column; flex-wrap: nowrap; }
  .track-list > li { width: 100%; padding: 20px 32px; }
  .voice-inner { width: 95%; margin-left: 0; }
  .voice-slide { flex-basis: 85%; padding-right: 20px; }
  .voice-body { gap: 4px; }
  .company-photo { width: 90%; height: 260px; }
  .company-panel { padding: 0; }
  .company-body { width: 90%; max-width: 90%; }
  .company-header { flex-direction: column; align-items: flex-start; gap: 20px; }
  .company-links { flex-direction: column; flex-wrap: nowrap; }
  .company-links > li { width: 100%; }
  .contact-glass { padding: 80px 0; }
  .contact-card { width: 90%; max-width: 90%; margin: 0; }
  .contact-button { width: 100%; padding: 8px 0; font-size: 16px; }
  .site-footer { padding: 28px 0 16px; }
}

@media (max-width: 320px) {
  .news-section-intro { flex-direction: column; align-items: flex-start; }
  .voice-title { font-size: 16px; }
  .company-photo { height: 240px; }
}

@media (prefers-reduced-motion: reduce) {
  html.has-reveals [data-reveal] { opacity: 1; transform: none; transition: none; }
}

@media print {
  #main { padding-top: 0; }
  .hero { position: relative; }
  html.has-reveals [data-reveal] { opacity: 1; transform: none; }
  .voice-viewport { overflow: visible; }
  .voice-slide[aria-hidden="true"] { display: none; }
  .site-header, .mobile-menu { display: none; }
}

/* The original composition, with a consistent typographic and interaction finish. */
.news-row { position: relative; padding-right: 36px; transition: background 220ms; }
.news-row-arrow { flex: 0 0 auto; margin-left: auto; color: var(--green-strong); font: 500 20px/1 "Inter", sans-serif; transition: transform 220ms; }
.news-row:hover, .news-row:focus-visible { background: #f7faf8; }
.news-row:hover .news-row-arrow { transform: translate(2px,-2px); }
.news-date { min-width: 108px; }
.service-row { transition: border-color 250ms; }
.service-row:hover { border-color: #9dc6b7; }
.service-description br { display: none; }
.service-top { gap: 24px; }
.service-top h3 { text-wrap: pretty; }
.service-tags { gap: 8px; margin-top: 4px; }
.service-tags > li { padding: 4px 12px; border: 1px solid #e9e6df; }
.track-list > li { border-radius: 12px; box-shadow: 0 10px 30px rgb(35 39 32 / 6%); }
.track-list .track-label { color: #62675f; font: 400 14px/1.8 var(--japanese); }
.track-list .track-value { margin-top: 8px; color: var(--green-strong); font: 500 52px/1.2 "Inter", sans-serif; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.track-value > span { margin-left: 6px; font: 400 20px/1.4 var(--japanese); letter-spacing: 0; }
.voice-card { overflow: hidden; border: 1px solid #e5e5dd; transition: border-color 250ms, box-shadow 250ms; }
a.voice-card:hover, a.voice-card:focus-visible { border-color: #b5c9bc; box-shadow: 0 8px 24px rgb(40 55 40 / 5%); }
.voice-card.is-coming-soon .voice-title { color: #70746b; font: 500 20px/1.6 "Inter", sans-serif; letter-spacing: -.02em; }
.voice-controls { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 89%; margin-top: 20px; }
.voice-hint { color: #686e63; font-size: 12px; }
.voice-control-buttons { display: flex; flex: 0 0 auto; gap: 10px; align-items: center; }
.voice-step { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid #b4c5b8; border-radius: 50%; color: var(--green-strong); background: transparent; transition: background 220ms, color 220ms; }
.voice-step[data-voice-prev] > i { transform: rotate(180deg); }
.voice-step > i { font-size: 13px; }
.voice-step:hover { background: var(--green-strong); color: white; }
.voice-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; min-width: 110px; padding: 10px 14px; border: 1px solid #b4c5b8; border-radius: 24px; background: transparent; color: #45554a; font-size: 12px; transition: background 220ms; }
.voice-toggle:hover { background: rgb(255 255 255 / 65%); }
.voice-toggle-icon { font: 600 12px/1 "Inter", sans-serif; }
.contact-card { border: 1px solid rgb(255 255 255 / 90%); box-shadow: 0 18px 60px rgb(61 87 66 / 5%); }
.contact-detail { margin-bottom: 30px; color: #666; font-size: 13px; line-height: 1.9; text-align: center; }
.contact-button { box-shadow: 0 5px 16px rgb(14 122 97 / 12%); transition: background 250ms, box-shadow 250ms; }
.contact-button:hover { background: #09644f; box-shadow: 0 8px 24px rgb(14 122 97 / 20%); }
.footer-back-top { display: flex; align-items: center; justify-content: flex-end; gap: 16px; width: fit-content; min-height: 44px; margin: 0 0 24px auto; font-size: 12px; color: #62665f; }
.footer-back-top > span { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #cdd7cf; border-radius: 50%; color: var(--green-strong); font: 500 18px/1 "Inter", sans-serif; transition: background 250ms; }
.footer-back-top:hover > span { background: #edf5f0; }
@media (max-width: 1060px) { .voice-controls { width: 94%; } }
@media (max-width: 840px) {
  .news-date { min-width: 0; }
  .news-row { padding-right: 32px; }
  .news-row-arrow { position: absolute; right: 4px; top: calc(50% - 10px); }
  .section-heading > h2 { font-size: 15px; }
  .service-description, .service-row:nth-child(n + 2) .service-description { font-size: 15px; line-height: 1.95; }
  .service-body { gap: 14px; }
  .service-top { flex-wrap: nowrap; gap: 14px; }
  .service-top h3 { min-width: 0; font-size: 22px; line-height: 1.6; }
  .service-more { align-self: flex-start; min-width: 44px; min-height: 44px; justify-content: center; }
  .track-list > li { padding-inline: 20px; }
  .track-list .track-label { font-size: 13px; }
  .track-list .track-value { font-size: 42px; }
  .track-value > span { font-size: 17px; }
  .voice-controls { flex-wrap: wrap; gap: 16px; margin-top: 16px; }
  .voice-hint { font-size: 11px; }
  .voice-control-buttons { margin-left: auto; }
  .voice-company { font-size: 13px; }
  .voice-body { padding-inline: 18px; }
  .contact-detail { font-size: 12px; }
  .footer-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 28px; width: 100%; }
  .footer-column { gap: 0; }
  .footer-main-link { min-height: 44px; height: auto; font-size: 14px; }
  .footer-sub-links { gap: 0; }
  .footer-sub-links a { min-height: 36px; height: auto; }
  .footer-column:last-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; }
  .footer-back-top { margin-bottom: 16px; }
}
@media (max-width: 540px) {
  .section-english { font-size: 50px; }
  .service-row { gap: 20px; }
  .service-top h3 { font-size: 21px; }
  .service-tags > li { font-size: 12px; padding: 4px 10px; }
  .track-list > li { flex-direction: row; justify-content: space-between; gap: 16px; padding: 20px 24px; text-align: left; }
  .track-list .track-value { margin-top: 0; font-size: 38px; }
  .track-list .track-label { font-size: 14px; }
  .track-value > span { font-size: 16px; }
  .voice-slide { flex-basis: 88%; }
  .voice-header, .voice-controls { width: 90%; margin-inline: auto; }
  .voice-viewport { padding-left: 5%; }
  .voice-controls { justify-content: flex-end; }
  .voice-hint { width: 100%; text-align: right; font-size: 10px; }
  .voice-title { line-height: 1.75; }
  .company-message { font-size: 24px; line-height: 1.8; }
  .contact-copy { margin-top: 24px; }
  .contact-detail { margin-bottom: 24px; }
}
@media (max-width: 360px) {
  .section-english { font-size: 44px; }
  .service-top h3 { font-size: 19px; }
  .track-list > li { padding-inline: 18px; }
}
@media print {
  .hero-discover, .voice-controls, .mobile-contact-dock, .footer-back-top { display: none !important; }
}

.company-photo > img { width: 100%; height: 100%; object-fit: cover; object-position: left center; }