/*
Theme Name: XUDING Global
Theme URI: https://xudingpackaging.com
Author: XUDING New Materials
Description: Lightweight, conversion-focused theme for XUDING Packaging's international website.
Version: 1.0.2
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: xuding-global
*/

:root {
  --ink: #0b1720;
  --muted: #63717a;
  --line: rgba(11, 23, 32, .12);
  --paper: #f7f8f5;
  --white: #fff;
  --lime: #b9f249;
  --teal: #0c716c;
  --teal-dark: #064a48;
  --orange: #ff7a3d;
  --radius: 24px;
  --shadow: 0 24px 80px rgba(4, 35, 34, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.section { padding: 110px 0; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px; color: var(--teal); font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 30px; height: 2px; background: currentColor; }
.section-title { max-width: 760px; margin: 0; font-size: clamp(38px, 5vw, 68px); line-height: .98; letter-spacing: -.055em; }
.section-copy { max-width: 650px; margin: 24px 0 0; color: var(--muted); font-size: 18px; line-height: 1.7; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; padding: 16px 0; transition: .3s ease; }
.site-header.scrolled { padding: 9px 0; background: rgba(247,248,245,.88); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); }
.nav-wrap { display: flex; align-items: center; justify-content: space-between; gap: 26px; }
.brand { display: flex; align-items: center; gap: 12px; font-weight: 900; letter-spacing: -.03em; }
.brand-mark { position: relative; width: 42px; height: 42px; border-radius: 12px; background: var(--ink); overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; background: var(--lime); transform: skewX(-24deg); }
.brand-mark::before { width: 10px; height: 30px; left: 11px; top: 6px; }
.brand-mark::after { width: 10px; height: 22px; right: 9px; bottom: 6px; }
.brand-copy { display: grid; line-height: 1; }
.brand-copy small { margin-top: 4px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.nav-menu { display: flex; align-items: center; gap: 28px; margin: 0; padding: 0; list-style: none; }
.nav-menu a { position: relative; font-size: 14px; font-weight: 650; }
.nav-menu a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 2px; background: var(--teal); transition: .25s ease; }
.nav-menu a:hover::after { right: 0; }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 22px; border: 1px solid transparent; border-radius: 999px; cursor: pointer; font-size: 14px; font-weight: 800; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-dark { color: white; background: var(--ink); box-shadow: 0 14px 30px rgba(11,23,32,.18); }
.btn-lime { color: var(--ink); background: var(--lime); box-shadow: 0 14px 34px rgba(185,242,73,.2); }
.btn-outline { border-color: var(--line); background: rgba(255,255,255,.52); }
.menu-toggle { display: none; width: 45px; height: 45px; border: 0; border-radius: 50%; color: white; background: var(--ink); }

.hero { position: relative; min-height: 820px; padding: 154px 0 80px; overflow: hidden; background: radial-gradient(circle at 80% 20%, rgba(185,242,73,.3), transparent 28%), linear-gradient(135deg,#f7f8f5 0%,#eef3ec 58%,#dce9dc 100%); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .32; background-image: linear-gradient(rgba(11,23,32,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(11,23,32,.06) 1px,transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(to right,black,transparent 70%); }
.hero-grid { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: 50px; }
.hero-kicker { display: inline-flex; align-items: center; gap: 9px; padding: 8px 13px; border: 1px solid rgba(12,113,108,.18); border-radius: 999px; color: var(--teal-dark); background: rgba(255,255,255,.65); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 5px rgba(185,242,73,.24); }
.hero h1 { max-width: 710px; margin: 24px 0; font-size: clamp(56px, 7.6vw, 104px); line-height: .88; letter-spacing: -.075em; }
.hero h1 em { display: block; color: var(--teal); font-family: Georgia, serif; font-weight: 400; letter-spacing: -.06em; }
.hero-copy { max-width: 610px; margin: 0; color: var(--muted); font-size: 19px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 42px; padding-top: 28px; border-top: 1px solid var(--line); }
.hero-proof div { display: grid; gap: 4px; }
.hero-proof strong { font-size: 22px; letter-spacing: -.04em; }
.hero-proof span { color: var(--muted); font-size: 12px; }
.hero-visual { position: relative; min-height: 590px; perspective: 1200px; }
.orb { position: absolute; width: 470px; aspect-ratio: 1; right: -55px; top: 30px; border-radius: 50%; background: linear-gradient(145deg,rgba(255,255,255,.95),rgba(255,255,255,.24)); box-shadow: inset -30px -30px 80px rgba(12,113,108,.12), 0 50px 100px rgba(12,113,108,.12); }
.pack { position: absolute; overflow: hidden; border: 1px solid rgba(255,255,255,.65); box-shadow: 0 35px 70px rgba(11,23,32,.2); transform-style: preserve-3d; transition: transform .2s ease-out; }
.pack::after { content: "XUDING"; position: absolute; left: 24px; bottom: 24px; font-size: 12px; font-weight: 900; letter-spacing: .18em; }
.pack-a { width: 250px; height: 350px; left: 20px; top: 80px; border-radius: 16px 16px 32px 32px; color: white; background: linear-gradient(160deg,#053c3b,#0c716c 55%,#8ac33a); transform: rotateY(14deg) rotateZ(-7deg); }
.pack-a::before { content: "FLEXIBLE\A PACKAGING"; white-space: pre; position: absolute; inset: 42px 24px auto; font-size: 31px; font-weight: 850; line-height: .95; letter-spacing: -.06em; }
.pack-b { width: 225px; height: 305px; right: 0; top: 190px; border-radius: 15px 15px 28px 28px; color: var(--ink); background: linear-gradient(160deg,#fff,#ebeee8); transform: rotateY(-14deg) rotateZ(6deg); }
.pack-b::before { content: "PE\A SOLUTIONS"; white-space: pre; position: absolute; inset: 38px 24px auto; color: var(--teal); font-size: 38px; font-weight: 900; line-height: .9; letter-spacing: -.07em; }
.roll { position: absolute; width: 280px; height: 155px; left: 110px; bottom: 12px; border-radius: 50%; background: radial-gradient(circle at center,#d1d8d2 0 14%,#fff 15% 43%,#cfd8d1 44% 47%,#f7faf6 48% 67%,#b8c8bd 69% 100%); box-shadow: 0 35px 60px rgba(11,23,32,.24); transform: rotateX(67deg) rotateZ(-12deg); }
.visual-tag { position: absolute; right: 18px; top: 75px; display: grid; gap: 5px; padding: 15px 18px; border-radius: 16px; background: rgba(255,255,255,.78); box-shadow: var(--shadow); backdrop-filter: blur(12px); }
.visual-tag strong { font-size: 13px; }
.visual-tag span { color: var(--muted); font-size: 11px; }

.trust-strip { position: relative; z-index: 2; margin-top: -34px; }
.trust-inner { display: grid; grid-template-columns: 1.2fr repeat(4,1fr); align-items: center; min-height: 110px; padding: 20px 28px; border-radius: 24px; color: white; background: var(--ink); box-shadow: var(--shadow); }
.trust-inner > div { padding: 10px 20px; border-left: 1px solid rgba(255,255,255,.12); }
.trust-inner > div:first-child { border-left: 0; }
.trust-inner small { display: block; color: rgba(255,255,255,.55); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.trust-inner strong { display: block; margin-top: 7px; font-size: 14px; }

.solutions-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 50px; }
.solutions-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 18px; }
.solution-card { position: relative; min-height: 430px; padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--white); transition: transform .3s ease, box-shadow .3s ease; }
.solution-card:hover { transform: translateY(-8px); box-shadow: var(--shadow); }
.solution-card:nth-child(1) { grid-column: span 5; }
.solution-card:nth-child(2) { grid-column: span 4; color: white; background: var(--teal-dark); }
.solution-card:nth-child(3) { grid-column: span 3; background: #e9efdf; }
.card-index { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.solution-card:nth-child(2) .card-index { color: rgba(255,255,255,.55); }
.solution-card h3 { max-width: 330px; margin: 74px 0 14px; font-size: 37px; line-height: 1; letter-spacing: -.05em; }
.solution-card p { max-width: 360px; margin: 0; color: var(--muted); line-height: 1.65; }
.solution-card:nth-child(2) p { color: rgba(255,255,255,.68); }
.card-art { position: absolute; right: -40px; bottom: -70px; width: 240px; height: 250px; border-radius: 22px; border: 1px solid rgba(255,255,255,.6); background: linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,255,255,.2)); box-shadow: 0 25px 50px rgba(11,23,32,.16); transform: rotate(-10deg); }
.solution-card:nth-child(2) .card-art { background: linear-gradient(145deg,#b9f249,#5e9622); }
.solution-card:nth-child(3) .card-art { width: 210px; height: 210px; border-radius: 50%; background: radial-gradient(circle,#dce5dd 0 15%,#fff 16% 42%,#b7c4b9 43% 48%,#f3f5f1 49% 70%,#94aa99 71%); }

.industries { color: white; background: var(--ink); }
.industry-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: start; }
.industry-list { border-top: 1px solid rgba(255,255,255,.14); }
.industry-item { display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 20px; padding: 25px 0; border-bottom: 1px solid rgba(255,255,255,.14); transition: padding .25s ease; }
.industry-item:hover { padding-left: 12px; }
.industry-item span { color: var(--lime); font-size: 12px; font-weight: 800; }
.industry-item strong { font-size: 24px; letter-spacing: -.03em; }
.industry-item i { font-style: normal; color: rgba(255,255,255,.4); }
.industries .section-copy { color: rgba(255,255,255,.62); }

.process-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-top: 55px; counter-reset: process; }
.process-step { counter-increment: process; min-height: 250px; padding: 27px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.55); }
.process-step::before { content: "0" counter(process); display: inline-grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; color: white; background: var(--teal); font-size: 12px; font-weight: 850; }
.process-step h3 { margin: 52px 0 12px; font-size: 22px; letter-spacing: -.04em; }
.process-step p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }

.quality { padding: 90px 0; }
.quality-panel { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding: 60px; border-radius: 34px; overflow: hidden; color: white; background: linear-gradient(135deg,var(--teal-dark),var(--teal)); }
.quality-panel::after { content: ""; position: absolute; right: -10%; bottom: -65%; width: 520px; aspect-ratio: 1; border: 80px solid rgba(185,242,73,.16); border-radius: 50%; }
.quality-points { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.quality-point { padding: 20px; border: 1px solid rgba(255,255,255,.16); border-radius: 17px; background: rgba(255,255,255,.07); }
.quality-point strong { display: block; margin-bottom: 6px; }
.quality-point span { color: rgba(255,255,255,.62); font-size: 12px; line-height: 1.5; }

.cta { padding: 45px 0 110px; }
.cta-inner { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 35px; padding: 55px 60px; border-radius: 30px; overflow: hidden; background: var(--lime); }
.cta-inner::after { content: ""; position: absolute; width: 300px; height: 300px; right: 13%; top: -120px; border: 1px solid rgba(11,23,32,.16); border-radius: 50%; box-shadow: 0 0 0 35px rgba(255,255,255,.18),0 0 0 70px rgba(255,255,255,.11); }
.cta-copy { position: relative; z-index: 1; }
.cta h2 { max-width: 700px; margin: 0; font-size: clamp(36px,5vw,64px); line-height: .95; letter-spacing: -.055em; }
.cta p { margin: 18px 0 0; color: rgba(11,23,32,.65); }
.cta .btn { position: relative; z-index: 1; flex: 0 0 auto; }

.site-footer { padding: 70px 0 30px; color: white; background: #071116; }
.footer-grid { display: grid; grid-template-columns: 1.6fr repeat(3,1fr); gap: 50px; }
.footer-about { max-width: 380px; margin-top: 22px; color: rgba(255,255,255,.55); line-height: 1.7; }
.footer-col h3 { margin: 0 0 20px; color: rgba(255,255,255,.38); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.footer-col a, .footer-col span { display: block; margin: 12px 0; color: rgba(255,255,255,.76); font-size: 14px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 55px; padding-top: 25px; border-top: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.36); font-size: 12px; }

.page-hero { padding: 180px 0 80px; background: linear-gradient(135deg,#eff3ed,#dae8db); }
.page-hero h1 { max-width: 850px; margin: 0; font-size: clamp(52px,7vw,92px); line-height: .92; letter-spacing: -.065em; }
.content-wrap { padding: 80px 0 120px; }
.content-wrap .entry-content { max-width: 860px; font-size: 17px; line-height: 1.8; }
.content-wrap h2 { margin-top: 50px; font-size: 36px; letter-spacing: -.04em; }
.product-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; max-width: 1180px; margin-top: 45px; }
.product-card { display: flex; flex-direction: column; min-height: 480px; padding: 17px; border: 1px solid var(--line); border-radius: 22px; background: white; transition: transform .28s ease, box-shadow .28s ease; }
.product-card:hover { transform: translateY(-7px); box-shadow: var(--shadow); }
.product-visual { position: relative; display: grid; place-items: center; height: 245px; margin-bottom: 23px; border-radius: 16px; overflow: hidden; background: linear-gradient(140deg,#eef4ea,#d8e8d8); }
.product-visual::before { content: ""; position: absolute; width: 190px; height: 190px; border-radius: 50%; background: rgba(255,255,255,.6); box-shadow: 0 0 0 28px rgba(255,255,255,.2); }
.product-visual i { position: relative; display: block; width: 125px; height: 165px; border: 1px solid rgba(255,255,255,.75); border-radius: 8px 8px 18px 18px; background: linear-gradient(155deg,#0a5552,#b9f249); box-shadow: 0 25px 45px rgba(11,23,32,.2); transform: rotate(-6deg); }
.product-visual img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.product-roll .product-visual i { width: 165px; height: 100px; border: 0; border-radius: 50%; background: radial-gradient(circle,#cbd5cc 0 14%,#fff 15% 42%,#afbfb2 43% 48%,#f7f9f5 49% 68%,#91aa96 69%); transform: rotateX(55deg) rotateZ(-8deg); }
.product-pe .product-visual i { background: linear-gradient(145deg,rgba(255,255,255,.85),rgba(191,216,205,.35)); }
.product-industrial .product-visual { background: linear-gradient(140deg,#eee6d9,#cfb999); }
.product-industrial .product-visual i { background: repeating-linear-gradient(90deg,#d8c3a1 0 4px,#bba078 4px 6px); }
.product-esd .product-visual { background: linear-gradient(140deg,#e6e8eb,#b9c5cd); }
.product-esd .product-visual i { background: linear-gradient(145deg,#f4f5f5,#919ca2 52%,#e9eeee); }
.product-group { color: var(--teal); font-size: 10px; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.product-card strong { display: block; margin-top: 9px; font-size: 25px; line-height: 1.05; letter-spacing: -.04em; }
.product-card p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.product-card b { margin-top: auto; font-size: 12px; }
.product-detail-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 55px; align-items: start; }
.product-detail-art { position: sticky; top: 110px; min-height: 520px; border-radius: 28px; background: radial-gradient(circle at 50% 35%,#fff,transparent 25%),linear-gradient(145deg,#e9f0e5,#cce0cd); }
.product-detail-art::before { content: "XUDING"; position: absolute; left: 50%; top: 50%; width: 230px; height: 310px; display: grid; place-items: end start; padding: 25px; border-radius: 14px 14px 28px 28px; color: white; background: linear-gradient(155deg,var(--teal-dark),var(--teal) 60%,#8ec635); box-shadow: 0 38px 70px rgba(11,23,32,.22); font-size: 13px; font-weight: 900; letter-spacing: .17em; transform: translate(-50%,-50%) rotate(-5deg); }
.product-detail-art.has-image::before { display: none; }
.product-detail-art.has-image { overflow: hidden; background: #eef2eb; }
.product-detail-art.has-image img { width: 100%; height: 100%; min-height: 520px; object-fit: cover; }
.product-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 30px 0; }
.product-specs div { padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: white; }
.product-specs small { display: block; margin-bottom: 5px; color: var(--muted); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.product-specs strong { font-size: 14px; }
.rfq-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 34px; }
.rfq-form label { display: grid; gap: 8px; color: var(--muted); font-size: 13px; font-weight: 700; }
.rfq-form .full { grid-column: 1/-1; }
.rfq-form input, .rfq-form select, .rfq-form textarea { width: 100%; padding: 15px 16px; border: 1px solid var(--line); border-radius: 12px; color: var(--ink); background: white; outline: none; }
.rfq-form input:focus, .rfq-form textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(12,113,108,.1); }

.reveal { opacity: 0; transform: translateY(25px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .nav-menu, .nav-actions .btn-outline { display: none; }
  .menu-toggle { display: inline-grid; place-items: center; }
  .nav-menu.open { position: fixed; inset: 74px 20px auto; display: grid; gap: 0; padding: 18px; border-radius: 20px; background: white; box-shadow: var(--shadow); }
  .nav-menu.open li a { display: block; padding: 14px; }
  .hero { min-height: auto; }
  .hero-grid, .industry-grid, .quality-panel { grid-template-columns: 1fr; }
  .hero-visual { min-height: 530px; max-width: 560px; }
  .trust-inner { grid-template-columns: 1fr 1fr; }
  .trust-inner > div { border-left: 0; border-top: 1px solid rgba(255,255,255,.12); }
  .solutions-grid { grid-template-columns: 1fr 1fr; }
  .solution-card:nth-child(n) { grid-column: auto; }
  .solution-card:nth-child(3) { grid-column: 1/-1; }
  .process-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .product-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .container { width: min(100% - 24px,1180px); }
  .section { padding: 78px 0; }
  .brand-copy small { display: none; }
  .nav-actions > .btn { display: none; }
  .hero { padding-top: 120px; }
  .hero h1 { font-size: 58px; }
  .hero-visual { min-height: 430px; transform: scale(.82); transform-origin: left top; width: 120%; margin-bottom: -70px; }
  .orb { width: 390px; right: 0; }
  .pack-a { left: 5px; }
  .trust-inner, .solutions-grid, .process-grid, .footer-grid, .rfq-form { grid-template-columns: 1fr; }
  .product-grid, .product-detail-grid { grid-template-columns: 1fr; }
  .product-detail-art { position: relative; top: auto; min-height: 410px; }
  .trust-inner > div { padding: 15px 8px; }
  .solutions-head, .cta-inner, .footer-bottom { align-items: flex-start; flex-direction: column; }
  .solution-card:nth-child(3) { grid-column: auto; }
  .quality-panel { padding: 32px 22px; }
  .quality-points { grid-template-columns: 1fr; }
  .cta-inner { padding: 40px 25px; }
  .rfq-form .full { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}
.product-parameter-panel{padding:34px;border:1px solid var(--line);border-radius:24px;background:#f8faf7;box-shadow:0 20px 55px rgba(25,35,30,.08)}.product-parameter-panel h2{margin:6px 0 22px;font-size:36px;letter-spacing:-.04em}.product-parameter-panel h3{margin:26px 0 8px;font-size:20px}.product-parameter-panel>p:not(.eyebrow){color:var(--muted);line-height:1.7}.product-parameter-panel .product-specs{grid-template-columns:1fr;margin:0}.product-gallery-section{padding:10px 0 88px}.product-introduction{max-width:900px;margin:0 auto 64px;padding:44px 48px;border-radius:24px;background:#f3f7f1}.product-introduction h2{margin:7px 0 20px;font-size:42px;letter-spacing:-.04em}.product-introduction p{font-size:17px;line-height:1.8}.product-gallery-heading{margin-bottom:28px}.product-gallery-heading h2{margin:7px 0 0}.product-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.product-gallery figure{margin:0;border-radius:22px;overflow:hidden;background:#f3eee5;box-shadow:0 18px 48px rgba(25,35,30,.1)}.product-gallery img{display:block;width:100%;height:auto}@media(max-width:760px){.product-parameter-panel{padding:24px}.product-introduction{margin-bottom:42px;padding:30px 24px}.product-gallery{grid-template-columns:1fr}.product-gallery-section{padding-bottom:56px}}
.product-parameter-table{margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}.product-parameter-table div{display:grid;grid-template-columns:132px minmax(0,1fr);border-bottom:1px solid var(--line)}.product-parameter-table div:last-child{border-bottom:0}.product-parameter-table dt,.product-parameter-table dd{margin:0;padding:13px 15px;line-height:1.45}.product-parameter-table dt{color:var(--muted);background:#f4f7f2;font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}.product-parameter-table dd{border-left:1px solid var(--line);font-size:14px;font-weight:700}@media(max-width:760px){.product-parameter-table div{grid-template-columns:105px minmax(0,1fr)}.product-parameter-table dt,.product-parameter-table dd{padding:11px}}
.product-parameter-panel{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}.product-parameter-panel h2{margin:7px 0 24px}.product-parameter-table{border:1px solid #dfe4df;border-radius:0}.product-parameter-table div{grid-template-columns:34% minmax(0,1fr);min-height:64px;border-bottom:1px solid #dfe4df}.product-parameter-table dt,.product-parameter-table dd{display:flex;align-items:center;margin:0;padding:16px 18px;line-height:1.45}.product-parameter-table dt{color:#66716b;background:#fafbfa;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none}.product-parameter-table dd{border-left:1px solid #dfe4df;color:#26342e;background:#fff;font-size:15px;font-weight:500}.product-parameter-panel h3{margin-top:30px}@media(max-width:760px){.product-parameter-table div{grid-template-columns:34% minmax(0,1fr)}.product-parameter-table dt,.product-parameter-table dd{padding:13px 12px;font-size:13px}}
.product-detail-grid{grid-template-columns:1fr 1fr;gap:42px}.product-parameter-panel h2{margin:4px 0 16px;font-size:30px}.product-parameter-table div{min-height:49px}.product-parameter-table dt,.product-parameter-table dd{padding:10px 14px;font-size:13px;line-height:1.35}.product-parameter-panel h3{margin:20px 0 5px;font-size:17px}.product-parameter-panel>p:not(.eyebrow){margin:0 0 14px;font-size:13px;line-height:1.55}.product-parameter-panel .btn{padding:11px 17px;font-size:12px}@media(max-width:760px){.product-detail-grid{grid-template-columns:1fr;gap:30px}}
.product-parameter-table dd{overflow-wrap:anywhere}.product-detail-art img{display:block}@media(max-width:760px){.page-hero h1{font-size:clamp(38px,12vw,56px)}.content-wrap{padding:48px 0 72px}.product-detail-art,.product-detail-art.has-image img{min-height:0;aspect-ratio:1/1}.product-detail-art.has-image img{height:auto;object-fit:cover}.product-parameter-panel h2{font-size:27px}.product-gallery-heading h2,.product-introduction h2{font-size:32px}.product-gallery-section .container{width:min(100% - 28px,1180px)}}