
:root {
  --brand: #35B7A8;
  --brand-dark: #168f84;
  --ink: #14212b;
  --muted: #6b7a85;
  --soft: #f6fbfa;
  --ivory: #fbfaf7;
  --night: #071520;
  --glass: rgba(255,255,255,.72);
  --line: rgba(20,33,43,.09);
  --shadow: 0 20px 70px rgba(10, 38, 47, .12);
  --radius: 28px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif; line-height: 1.65; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.section { padding: clamp(72px, 8vw, 128px) 0; position: relative; overflow: hidden; }
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.eyebrow { color: var(--brand-dark); letter-spacing: .16em; font-size: 13px; font-weight: 700; text-transform: uppercase; margin: 0 0 14px; }
h1, h2, h3 { margin: 0; line-height: 1.13; letter-spacing: -.02em; }
h1 { font-size: clamp(42px, 7vw, 92px); font-weight: 500; }
h2 { font-size: clamp(32px, 4vw, 58px); font-weight: 500; }
h3 { font-size: clamp(22px, 2.2vw, 32px); font-weight: 500; }
p { margin: 0; }
.lead { font-size: clamp(17px, 1.5vw, 21px); color: #53636d; max-width: 720px; }
.site-header { position: fixed; left: 0; right: 0; top: 0; z-index: 50; backdrop-filter: blur(0); transition: .35s; border-bottom: 1px solid transparent; }
.site-header.is-scrolled { background: rgba(255,255,255,.82); backdrop-filter: blur(18px); border-bottom-color: rgba(20,33,43,.08); }
.nav { height: 78px; width: min(1240px, calc(100% - 36px)); margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand-logo { display: flex; align-items: center; gap: 12px; }
.brand-logo img { height: 56px; width: auto; object-fit: contain; }
.nav-links { display: flex; gap: 28px; align-items: center; color: rgba(20,33,43,.72); font-size: 14px; }
.nav-links a { position: relative; }
.nav-links a:after { content:""; position:absolute; left:0; bottom:-8px; width:0; height:1px; background:var(--brand); transition:.25s; }
.nav-links a:hover:after { width:100%; }
.tmall-link { border: 1px solid rgba(53,183,168,.34); color: var(--brand-dark); padding: 10px 18px; border-radius: 999px; background: rgba(255,255,255,.55); }
.hero { min-height: 100svh; display: grid; align-items: center; padding: 108px 0 60px; background: radial-gradient(circle at 78% 28%, rgba(53,183,168,.18), transparent 34%), linear-gradient(118deg, #fbfcfb 0%, #f7fbfb 46%, #edf7f7 100%); overflow: hidden; position: relative; }
.hero:before { content:""; position:absolute; inset:0; background-image: linear-gradient(120deg, rgba(255,255,255,.78) 0%, rgba(255,255,255,.25) 55%, rgba(53,183,168,.08)); pointer-events:none; }
.hero-grid { position: relative; z-index: 1; width:min(1240px, calc(100% - 40px)); margin:0 auto; display:grid; grid-template-columns: .92fr 1.08fr; gap: clamp(28px, 6vw, 72px); align-items:center; }
.hero-copy { padding: 28px 0; }
.hero-logo { width: 210px; margin-bottom: 48px; }
.slogan { font-size: clamp(22px, 3vw, 38px); color: var(--brand-dark); letter-spacing:.08em; margin: 18px 0 8px; }
.hero-sub { margin-top: 24px; color: #53636d; font-size: clamp(17px, 1.5vw, 21px); max-width: 600px; }
.hero-actions { display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding: 13px 21px; border-radius: 999px; border: 1px solid rgba(20,33,43,.13); background: rgba(255,255,255,.72); box-shadow: 0 10px 28px rgba(15,45,50,.06); color:#21313a; font-weight:600; }
.btn.primary { background: var(--ink); color:#fff; border-color:var(--ink); }
.btn.brand { background: rgba(53,183,168,.11); color: var(--brand-dark); border-color: rgba(53,183,168,.36); }
.hero-visual { transition: transform .2s ease-out; position: relative; }
.hero-card { border-radius: 36px; overflow: hidden; box-shadow: 0 40px 100px rgba(15,49,59,.16); background:#fff; transform: rotate(-1deg); }
.hero-card img { width:100%; aspect-ratio: 1 / 1; object-fit: contain; background:#f8fbfb; }
.glow-orb { position:absolute; border-radius:999px; background: radial-gradient(circle, rgba(255,255,255,.95), rgba(53,183,168,.22) 45%, transparent 72%); filter: blur(2px); opacity:.8; animation: float 7s ease-in-out infinite; }
.glow-orb.one { width:190px; height:190px; right:-48px; top:-48px; }
.glow-orb.two { width:110px; height:110px; left:-30px; bottom:38px; animation-delay: -2s; }
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-18px); } }
.metric-row { display:grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-top: 32px; }
.metric { padding:18px 16px; border:1px solid rgba(53,183,168,.18); border-radius:18px; background:rgba(255,255,255,.65); }
.metric strong { display:block; font-size: clamp(25px, 3vw, 38px); line-height:1; color: var(--brand-dark); letter-spacing:-.04em; }
.metric span { font-size: 12px; color:#6b7a85; display:block; margin-top:8px; }
.panel { background: rgba(255,255,255,.72); border: 1px solid rgba(255,255,255,.8); box-shadow: var(--shadow); border-radius: var(--radius); backdrop-filter: blur(18px); }
.story { background: radial-gradient(circle at 72% 18%, rgba(53,183,168,.26), transparent 25%), linear-gradient(135deg, #071520 0%, #0c2430 42%, #f9fbfa 42.2%, #fff 100%); color:#fff; }
.story .container { display:grid; grid-template-columns: .9fr 1.1fr; gap: 58px; align-items:center; }
.story .container > .reveal:first-child { padding: clamp(26px, 4vw, 46px); border-radius: var(--radius); background: rgba(5,17,25,.76); border: 1px solid rgba(255,255,255,.14); box-shadow: 0 22px 70px rgba(0,0,0,.18); backdrop-filter: blur(10px); }
.story .lead, .story p { color: rgba(255,255,255,.75); }
.story-card { padding: clamp(28px,4vw,50px); background: rgba(255,255,255,.92); color: var(--ink); border-radius: var(--radius); box-shadow: var(--shadow); }
.story-card p { color: #4c5a61; margin-top: 16px; }
.story-mark { width:140px; margin-bottom: 22px; filter: drop-shadow(0 0 35px rgba(53,183,168,.5)); }
.story-quotes { display:grid; gap:14px; margin-top:26px; }
.quote-chip { padding:14px 16px; border-radius:16px; background: rgba(53,183,168,.1); color: var(--brand-dark); border:1px solid rgba(53,183,168,.16); font-weight:700; }
.product-section { background: linear-gradient(180deg, #fff 0%, #f8fbfb 100%); }
.split { display:grid; grid-template-columns: 1fr 1fr; gap: clamp(28px,5vw,64px); align-items:center; }
.product-photo { padding: 18px; }
.product-photo img { border-radius:24px; box-shadow: var(--shadow); }
.feature-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap:18px; margin-top: 34px; }
.feature-card { padding: 24px; border:1px solid var(--line); border-radius:22px; background:#fff; }
.feature-icon { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background: rgba(53,183,168,.1); color: var(--brand-dark); margin-bottom: 18px; }
.feature-card h3 { white-space: nowrap; font-size: clamp(20px, 1.7vw, 28px); }
.feature-card p { color:#64737c; margin-top: 10px; }
.science { background: radial-gradient(circle at 14% 22%, rgba(53,183,168,.12), transparent 28%), linear-gradient(180deg, #f8fbfb 0%, #fff 100%); }
.science-grid { display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 42px; }
.science-card { padding: 28px; min-height: 320px; border-radius: 26px; border:1px solid rgba(53,183,168,.16); background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(247,252,251,.92)); box-shadow: 0 16px 50px rgba(22,143,132,.07); position:relative; overflow:hidden; }
.science-card:after { content:""; position:absolute; width:160px; height:160px; right:-52px; top:-52px; border-radius:50%; background:radial-gradient(circle, rgba(53,183,168,.22), transparent 68%); }
.science-card .num { font-size: 52px; line-height: 1; color: rgba(53,183,168,.35); font-family: Georgia, serif; }
.science-card h3 { margin-top: 18px; }
.science-card p { color:#5d6c75; margin-top:14px; }
.protein-row { display:grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top:26px; }
.protein { border-radius:18px; padding:18px; background:rgba(255,255,255,.74); border:1px solid rgba(20,33,43,.07); }
.protein b { color: var(--brand-dark); }
.proof { background: #fff; }
.proof-head { display:flex; justify-content:space-between; gap:24px; align-items:end; }
.proof-head .lead { max-width: 600px; }
.data-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 38px; }
.data-card { padding: 28px 22px; border-radius: 24px; background: linear-gradient(180deg,#fff, #f7fbfb); border:1px solid rgba(20,33,43,.08); box-shadow: 0 16px 45px rgba(15,45,50,.06); }
.data-card strong { display:block; font-size: clamp(35px,4vw,56px); line-height:1; color: var(--brand-dark); letter-spacing:-.05em; }
.data-card span { display:block; font-weight:700; margin-top: 12px; }
.data-card small { display:block; margin-top: 12px; color:#7a8790; line-height:1.55; }
.report-gallery { display:grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 28px; }
.report-thumb { border-radius:22px; overflow:hidden; background:#f7f7f4; border:1px solid rgba(20,33,43,.08); box-shadow: 0 14px 42px rgba(0,0,0,.06); }
.report-thumb img { width:100%; height: 240px; object-fit: cover; object-position: top; }
.report-thumb figcaption { padding: 14px 16px; font-size: 14px; color:#5f6b72; }
.patent-strip { margin-top: 30px; display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.patent-card { border-radius:22px; overflow:hidden; background:#fff; border:1px solid rgba(20,33,43,.08); position:relative; }
.patent-card img { height: 260px; width:100%; object-fit: cover; object-position: center; }
.patent-card div { padding:16px 18px; }
.patent-card small { color:#7b8790; }
.usage { background: linear-gradient(180deg, #f8fbfb, #fff); }
.steps { display:grid; grid-template-columns: repeat(4, 1fr); gap:16px; margin-top: 38px; }
.step { padding: 24px; border-radius:24px; background:#fff; border:1px solid rgba(20,33,43,.08); }
.step .no { width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background: var(--brand); color:#fff; font-weight:700; margin-bottom: 16px; }
.step p { color:#596872; margin-top:8px; }
.gallery { background:#fff; }
.gallery-grid { display:grid; grid-template-columns: 1.2fr .8fr; gap:18px; margin-top: 40px; }
.gallery-main img, .gallery-stack img { border-radius:26px; box-shadow: var(--shadow); width:100%; object-fit: cover; }
.gallery-main img { height: 100%; min-height: 520px; object-fit: cover; }
.gallery-stack img { height: calc((520px - 18px)/2); }
.gallery-stack { display:grid; gap:18px; }
.future { background: radial-gradient(circle at 50% 40%, rgba(53,183,168,.16), transparent 24%), linear-gradient(135deg, #f9fbfb, #fff); }
.future-card { padding: clamp(32px, 5vw, 58px); text-align:center; }
.future-card p { color:#66727b; max-width:760px; margin:18px auto 0; }
.contact { background: linear-gradient(135deg, #071520 0%, #0b2932 100%); color: #fff; }
.contact .lead { color:rgba(255,255,255,.68); }
.contact-grid { display:grid; grid-template-columns: .9fr 1.1fr; gap: 40px; align-items:start; }
.qr-grid { display:grid; grid-template-columns: 1fr 1fr; gap:18px; }
.qr-card { padding:22px; background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.13); border-radius: 24px; }
.qr-card img { border-radius:18px; width: 100%; max-width: 260px; margin:auto; }
.qr-card h3 { margin-top: 16px; font-size: 21px; }
.qr-card p { color:rgba(255,255,255,.66); margin-top:8px; }
.footer { padding: 28px 0; background: #061018; color: rgba(255,255,255,.62); font-size: 13px; }
.footer .container { display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.beian-links { display:flex; gap:18px; flex-wrap:wrap; }
.beian-links a { color: rgba(255,255,255,.72); }
.beian-links a:hover { color:#fff; }
.reveal { opacity:0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in-view { opacity:1; transform: translateY(0); }
.disclaimer { margin-top: 22px; color:#7f8b93; font-size: 13px; }
@media (max-width: 980px) {
  .nav-links { display:none; }
  .hero-grid, .split, .story .container, .contact-grid { grid-template-columns: 1fr; }
  .hero { padding-top: 92px; min-height:auto; }
  .hero-logo { width: 170px; margin-bottom: 28px; }
  .metric-row, .data-grid { grid-template-columns: repeat(2,1fr); }
  .feature-grid, .science-grid, .protein-row, .steps, .report-gallery { grid-template-columns: 1fr 1fr; }
  .story { background: linear-gradient(180deg,#071520 0%, #0c2430 58%, #fff 58.2%, #fff 100%); }
  .gallery-grid { grid-template-columns: 1fr; }
  .gallery-main img, .gallery-stack img { height:auto; min-height:0; }
}
@media (max-width: 640px) {
  .container, .hero-grid, .nav { width: min(100% - 28px, 1180px); }
  .nav { height: 66px; }
  .brand-logo img { height: 44px; }
  .hero-actions { gap:10px; }
  .btn { width:100%; }
  .metric-row, .feature-grid, .science-grid, .protein-row, .data-grid, .steps, .report-gallery, .patent-strip, .qr-grid { grid-template-columns: 1fr; }
  .report-thumb img { height: 280px; }
  .section { padding: 66px 0; }
  .hero-card { border-radius: 24px; }
  .proof-head { display:block; }
}

/* V4: only the six requested local fixes */
.desktop-break { display: none; }
.contact-buttons .btn { min-width: 132px; }
.support-phone { margin-top: 18px; color: rgba(255,255,255,.74); font-size: 15px; }
@media (min-width: 981px) {
  .desktop-break { display: block; }
}
@media (max-width: 980px) {
  .nav { height: auto; min-height: 66px; padding: 10px 0 8px; flex-wrap: wrap; gap: 8px 14px; align-items: center; }
  .nav-links { display: flex; width: 100%; gap: 18px; overflow-x: auto; padding: 2px 0 8px; font-size: 13px; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .nav-links::-webkit-scrollbar { display: none; }
  .tmall-link { padding: 8px 14px; }
  .hero { padding-top: 132px; }
}
@media (max-width: 640px) {
  .nav { height: auto; }
  .hero { padding-top: 126px; }
  .contact-buttons .btn { min-width: 0; }
}

/* V5: only the five requested local fixes */
.nav-toggle { display:none; width: 42px; height: 42px; border: 1px solid rgba(20,33,43,.12); border-radius: 999px; background: rgba(255,255,255,.72); align-items:center; justify-content:center; flex-direction:column; gap:5px; padding:0; cursor:pointer; }
.nav-toggle span { width:18px; height:2px; background: var(--ink); border-radius:999px; transition:.25s; }
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity:0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.gallery-concept-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:18px; margin-top:40px; }
.concept-card { min-height: 250px; padding: 28px; border-radius: 26px; border:1px solid rgba(53,183,168,.16); background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,252,251,.92)); box-shadow: 0 16px 50px rgba(22,143,132,.07); position:relative; overflow:hidden; }
.concept-card:after { content:""; position:absolute; width: 150px; height:150px; right:-64px; top:-64px; border-radius:50%; background: radial-gradient(circle, rgba(53,183,168,.18), transparent 68%); }
.concept-icon { width:48px; height:48px; border-radius:16px; display:grid; place-items:center; color:var(--brand-dark); background: rgba(53,183,168,.1); border:1px solid rgba(53,183,168,.16); font-weight:700; margin-bottom:18px; }
.concept-card h3 { font-size: clamp(21px, 1.7vw, 27px); }
.concept-card p { color:#5d6c75; margin-top:14px; }
.proof .report-gallery { grid-template-columns: repeat(4, 1fr); gap:18px; margin-top:32px; }
.proof .report-thumb img { height: 300px; }
@media (max-width: 980px) {
  .nav { height: 66px; min-height: 66px; padding: 0; flex-wrap: nowrap; position:relative; }
  .nav-toggle { display:flex; }
  .nav-links { display:none; position:absolute; top: calc(100% + 10px); left:0; right:0; width:100%; padding: 12px; border-radius: 22px; background: rgba(255,255,255,.94); border:1px solid rgba(20,33,43,.08); box-shadow: 0 16px 42px rgba(15,45,50,.12); backdrop-filter: blur(18px); gap:0; overflow: visible; white-space: normal; }
  .nav-links.is-open { display:grid; grid-template-columns: 1fr 1fr; }
  .nav-links a { padding: 12px 10px; border-radius:14px; }
  .nav-links a:hover { background: rgba(53,183,168,.08); }
  .nav-links a:after { display:none; }
  .tmall-link { text-align:center; }
  .hero { padding-top: 92px; }
  .gallery-concept-grid { grid-template-columns: 1fr 1fr; }
  .proof .report-gallery { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .nav { height: 66px; }
  .hero { padding-top: 92px; }
  .nav-links.is-open { grid-template-columns: 1fr; }
  .gallery-concept-grid { grid-template-columns: 1fr; }
  .proof .report-gallery { grid-template-columns: 1fr; }
  .proof .report-thumb img { height: 300px; }
}


/* V6: only latest four requested local fixes */
html { scroll-padding-top: 96px; }
.hero-tech-card img { object-fit: cover; object-position: center; }
.hero-sub { max-width: 720px; }
.visual-system-panel { margin-top: 42px; display:grid; grid-template-columns: .95fr 1.25fr; gap: 28px; align-items: stretch; padding: clamp(28px, 4vw, 46px); border-radius: 34px; border: 1px solid rgba(53,183,168,.14); background: radial-gradient(circle at 25% 35%, rgba(53,183,168,.16), transparent 28%), linear-gradient(135deg, rgba(255,255,255,.98), rgba(247,252,251,.94)); box-shadow: 0 24px 70px rgba(22,143,132,.08); overflow:hidden; }
.visual-orbit { min-height: 430px; border-radius: 30px; position:relative; display:grid; place-items:center; background: linear-gradient(145deg, rgba(7,21,32,.96), rgba(12,47,55,.9)); overflow:hidden; }
.visual-orbit:before { content:""; position:absolute; inset:-20%; background: radial-gradient(circle at 50% 50%, rgba(53,183,168,.32), transparent 34%), radial-gradient(circle at 20% 25%, rgba(255,255,255,.16), transparent 18%); }
.orbit-ring { position:absolute; border-radius:50%; border:1px solid rgba(255,255,255,.18); }
.ring-one { width: 260px; height:260px; border-color:rgba(53,183,168,.42); }
.ring-two { width: 360px; height:360px; border-style:dashed; border-color:rgba(255,255,255,.18); }
.barrier-core { width: 158px; height:158px; border-radius: 46px; background: rgba(255,255,255,.92); border:1px solid rgba(53,183,168,.42); display:grid; place-items:center; position:relative; z-index:2; color:#103038; box-shadow: 0 22px 50px rgba(0,0,0,.18); }
.barrier-core span { font-size: 32px; font-weight: 800; letter-spacing:.08em; }
.barrier-core strong { font-size: 16px; color:var(--brand-dark); letter-spacing:.18em; text-transform: uppercase; }
.node { position:absolute; width:14px; height:14px; border-radius:50%; background:var(--brand); box-shadow:0 0 28px rgba(53,183,168,.9); z-index:3; }
.n1 { top: 20%; left: 28%; } .n2 { top: 30%; right: 22%; } .n3 { bottom: 22%; left: 22%; } .n4 { bottom: 28%; right: 28%; }
.visual-copy-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.visual-copy-card { padding: 26px; border-radius: 26px; background:#fff; border:1px solid rgba(20,33,43,.08); box-shadow: 0 14px 38px rgba(18,49,58,.05); }
.visual-copy-card h3 { font-size: clamp(20px, 1.5vw, 25px); }
.visual-copy-card p { margin-top:12px; color:#5d6c75; line-height:1.8; }
@media (max-width: 980px) {
  html { scroll-padding-top: 88px; }
  .visual-system-panel { grid-template-columns: 1fr; }
  .visual-orbit { min-height: 330px; }
}
@media (max-width: 640px) {
  .visual-copy-grid { grid-template-columns: 1fr; }
}


/* V7: only two requested visual refinements */
.visual-orbit { background: none; padding: 0; }
.visual-orbit:before { display:none; }
.visual-repair-img { width:100%; height:100%; min-height:430px; display:block; object-fit:cover; border-radius:30px; }
.hero-tech-card { background: transparent; }
@media (max-width: 980px) { .visual-repair-img { min-height:330px; } }

/* V8: only the two visual refinements + navigation anchor accuracy */
section[id] { scroll-margin-top: 104px; }
.hero-tech-card { border-radius: 38px; box-shadow: 0 42px 110px rgba(8, 39, 49, .18); }
.hero-tech-card img { aspect-ratio: 1 / 1; object-fit: cover; background:#eefaf8; }
.visual-repair-img { object-fit: cover; object-position:center; box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
@media (max-width: 980px) { section[id] { scroll-margin-top: 88px; } }

/* V13: navigation anchor accuracy only */
section[id] { scroll-margin-top: 112px; }
@media (max-width: 980px) { section[id] { scroll-margin-top: 94px; } }

/* V14: navigation anchor positioning only */
section[id] { scroll-margin-top: 78px; }
@media (max-width: 980px) { section[id] { scroll-margin-top: 66px; } }

/* V15: navigation anchor positioning only. Do not offset anchors with CSS;
   JavaScript aligns each section top directly to avoid previous-section white edges. */
html { scroll-padding-top: 0 !important; }
section[id] { scroll-margin-top: 0 !important; }


/* QR module fix: keep only WeChat/Douyin cards and center QR text */
.qr-grid {
  justify-content: center;
}
.qr-card {
  text-align: center;
}
.qr-card img {
  display: block;
  margin-left: auto;
  margin-right: auto;
}


/* Contact email fix */
.support-email {
  margin-top: 8px;
  color: rgba(255,255,255,.74);
  font-size: 15px;
}
.support-email a {
  color: inherit;
  text-decoration: none;
}
.support-email a:hover {
  text-decoration: underline;
}

.support-phone a,
.support-email a {
  color: inherit;
  text-decoration: none;
}

.support-phone a:hover,
.support-email a:hover {
  text-decoration: underline;
}


/* QR three-channel fix: WeChat / Douyin / Xiaohongshu */
.qr-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-content: center;
  align-items: start;
  gap: 16px;
}

.qr-card {
  text-align: center;
}

.qr-card img {
  display: block;
  width: 100%;
  max-width: 190px;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  margin-left: auto;
  margin-right: auto;
}

.qr-card h3 {
  margin-top: 14px;
  font-size: 18px;
  line-height: 1.35;
}

@media (max-width: 980px) {
  .qr-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
  }
  .qr-card {
    padding: 16px;
  }
  .qr-card img {
    max-width: 150px;
  }
  .qr-card h3 {
    font-size: 16px;
  }
}

@media (max-width: 640px) {
  .qr-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .qr-card img {
    max-width: 230px;
  }
}

/* Contact QR alignment fix: remove phone/email; align QR cards bottom with flagship buttons */
@media (min-width: 981px) {
  .contact-grid {
    align-items: end;
  }
}

.qr-grid {
  align-items: end;
}

.qr-card {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
