/* Shared mobile layout, loaded after each page's desktop styles. */
@media (max-width: 760px) {
  body {font-size:16px}
  .wrap {width:calc(100% - 40px)}
  .header {height:auto;min-height:112px;padding-block:8px;row-gap:4px}
  .header nav {gap:8px;font-size:12px}
  .header nav a,.nav-contact {min-height:44px}
  .nav-contact {gap:12px;font-size:12px;padding:8px 12px}
  .eyebrow {font-size:11px;letter-spacing:.1em;line-height:1.6}
  .button {font-size:14px;gap:12px;min-height:54px}
  .button-arrow {flex-shrink:0}
  .text-link {font-size:14px;min-height:48px;line-height:1.5}
  .hero {min-height:0;padding-bottom:20px}
  .hero-body {padding-top:32px}
  .hero-bottom p {font-size:16px}
  .hero-base {margin-top:240px}
  .hero-base p:first-child {font-size:11px;max-width:100%}
  .hero-art {inset:300px -20% 20px 0}
  .manifesto {padding-block:40px 52px}
  .section-index {margin-bottom:28px}
  .connection-copy>p:not(.eyebrow),.expertise-heading>p,.presence-heading>p,
  .partner-intro>p:last-child,.contact-bottom>p {font-size:16px}
  .connection-copy {padding:28px 20px 0}
  .connection-copy h2 {font-size:clamp(32px,8vw,40px)}
  .map-label {font-size:10px;padding:6px}
  .map-label small {font-size:10px}
  .network-footnote {font-size:9px;letter-spacing:.04em}
  .service summary {grid-template-columns:1fr 36px;gap:10px;padding-block:24px}
  .service-no {display:none}
  .service h3 {font-size:25px;line-height:1.2}
  .service-category {grid-column:1;grid-row:2;font-size:11px}
  .service-toggle {grid-column:2;width:36px;height:36px}
  .service-body {padding-left:0}
  .service-body ul,.service-body .text-link {font-size:15px;line-height:1.6}
  .sectors>span {font-size:11px}
  .sectors p {font-size:14px;line-height:1.8}
  .partner>span {font-size:14px;overflow-wrap:anywhere}
  .location address {font-size:16px}
  .location .city {font-size:12px}
  .contact-heading {flex-wrap:wrap;gap:24px}
  .contact-heading h2 {font-size:clamp(56px,13vw,80px);line-height:1.02}
  .contact-disc {width:80px;height:80px;margin-left:auto}
  .contact-disc>span:first-child {font-size:10px}
  .contact-channels {--contact-row-height:112px}
  .contact-row .eyebrow,.wechat .eyebrow {font-size:11px}
  .contact-row>span:last-child,.wechat summary>span:last-child {font-size:15px;line-height:1.5}
  .contact-channels .qr-panel {grid-template-columns:104px minmax(0,1fr);gap:12px}
  .contact-channels .qr-code-preview {width:104px;height:104px}
  .contact-channels .qr-panel p {font-size:13px}
  .contact-channels .qr-panel .text-link {font-size:13px;gap:4px;min-height:48px}
  .footer-bottom p,.footer-bottom a {font-size:12px}
  .footer-bottom {gap:8px}
  .footer-top>p {font-size:11px}
  .back-nav {flex-wrap:wrap;gap:12px;margin-bottom:24px}
  .back-nav a {min-height:44px;font-size:14px}
  .brand-page-hero {padding:24px 0 32px}
  .brand-header-grid {gap:24px;min-width:0}
  .brand-hero-logo {width:180px;max-width:100%;padding:24px}
  .brand-hero-logo img {max-height:90px}
  .brand-hero-info {min-width:0}
  .brand-hero-info h1 {font-size:clamp(32px,8.7vw,44px);line-height:1.12;overflow-wrap:anywhere}
  .brand-hero-info .lead {font-size:16px;line-height:1.7}
  .hero-actions,.cta-buttons {flex-direction:column;align-items:stretch;gap:12px}
  .hero-actions .button,.cta-buttons .button {justify-content:space-between;width:100%}
  .hero-actions .text-link {align-self:flex-start}
  .specs-grid {grid-template-columns:1fr;gap:12px;padding-block:32px}
  .spec-card,.product-card,.benefit-card,.tech-card,.prep-box,.clean-box {padding:22px 20px;min-width:0}
  .spec-card p:not(.eyebrow),.product-card p,.benefit-card p,.active-item span,
  .prep-box ol,.clean-list,.sustainability-banner p,.cta-panel p {font-size:16px;line-height:1.65}
  .spec-card h3,.benefit-card h3 {font-size:21px;line-height:1.25}
  .product-card h3 {font-size:25px;line-height:1.2}
  .product-card ul {font-size:15px;line-height:1.6}
  .product-card .tag,.benefit-card .tag {font-size:11px}
  .brand-section,.video-section,.cta-panel {padding-block:44px}
  .brand-section h2,.cta-panel h2 {font-size:clamp(29px,8vw,38px);line-height:1.15}
  .products-grid,.benefits-grid {grid-template-columns:1fr;gap:16px;margin-top:26px}
  .formulation-grid,.tech-grid {gap:20px;margin-top:26px}
  .active-item {padding:18px}
  .active-item strong {font-size:16px;line-height:1.5}
  .sustainability-banner {padding:24px 20px;margin-top:24px}
  .tech-list {font-size:15px;line-height:1.6}
  .tech-list li {flex-direction:column;gap:4px;padding-bottom:12px}
  .tech-list span:last-child {text-align:left}
  .tech-card>p,.brand-section>p[style] {font-size:16px!important}
  .nutri-table-header {padding:20px 14px}
  .nutri-table-header h3 {font-size:17px;line-height:1.4;letter-spacing:.03em}
  .nutri-table-header p,.nutri-badge,.nutri-footer-note {font-size:13px}
  .nutri-table {font-size:14px;table-layout:fixed}
  .nutri-table th,.nutri-table td {padding:12px 8px;overflow-wrap:anywhere;line-height:1.5}
  .nutri-table th {font-size:12px;letter-spacing:0}
  .nutri-table th:first-child:not([colspan]) {width:44%}
  .nutri-footer-note {padding:16px;line-height:1.6}
  .video-section>div:first-child>h2 {font-size:clamp(28px,8vw,36px)!important;line-height:1.2}
  .video-section>div:first-child>p:last-child {font-size:16px;line-height:1.7}
  .video-container {aspect-ratio:16/9;min-height:0;margin-top:24px}
  .video-actions a {font-size:14px;min-height:48px;line-height:1.5;padding:10px 12px}
}
@media (hover:none) {
  .benefit-card:hover,.product-card:hover {transform:none}
}