*{box-sizing:border-box} body{margin:0;font-family:Georgia,'Times New Roman',serif;color:#1a2129;background:#f4f6f7;line-height:1.65}
a{color:#101418} a:hover{text-decoration:underline}
.site-header{background:#0a0e12;color:#fff} .brand-row{display:flex;flex-wrap:wrap;gap:16px;align-items:center;max-width:1160px;margin:0 auto;padding:18px 20px}
.brand{font-size:30px;font-weight:700;color:#fff;text-decoration:none;letter-spacing:.5px} .tagline{color:#ffd23d;font-size:15px}
.cta-btn{margin-left:auto;background:#19b8d6;color:#1a1a1a;padding:10px 18px;border-radius:6px;text-decoration:none;font-weight:700}
.nav-row{background:#101418} .nav-menu{display:flex;flex-wrap:wrap;gap:4px;list-style:none;margin:0 auto;padding:0 20px;max-width:1160px}
.nav-menu>li{position:relative} .nav-menu a,.dropbtn{display:block;color:#fff;text-decoration:none;padding:12px 14px;background:none;border:0;font:inherit;cursor:pointer}
.nav-menu .menu{display:none;position:absolute;left:0;top:100%;background:#fff;list-style:none;margin:0;padding:8px 0;min-width:260px;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:20}
.nav-menu .menu a{color:#1a2129;padding:9px 16px} .nav-item:hover>.menu,.nav-item:focus-within>.menu,.nav-item.open>.menu{display:block}
.hero{max-width:1160px;margin:0 auto;padding:34px 20px 10px} .hero h1{font-size:40px;line-height:1.2;margin:8px 0}
.kicker{text-transform:uppercase;letter-spacing:2px;color:#101418;font-weight:700;font-size:13px} .evidence{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.evidence-item{background:#fff;border-left:5px solid #19b8d6;padding:12px 14px;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
.motif{height:26px;margin:18px 0;border-radius:6px;background:repeating-linear-gradient(90deg,#19b8d6 0 14px,transparent 14px 28px);opacity:.55}
main{max-width:1160px;margin:0 auto;padding:10px 20px 40px} .breadcrumb{font-size:14px;color:#666;margin:10px 0}
.lede{font-size:19px} .figure{margin:20px 0} .figure img{max-width:100%;height:auto;border-radius:8px} .caption{font-size:14px;color:#666}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin:20px 0}
.card,.blog-card{background:#fff;border:1px solid #ddd;border-top:5px solid #19b8d6;border-radius:8px;padding:18px} .card h3,.blog-card h3{margin-top:0}
.spec-table{border-collapse:collapse;width:100%;margin:18px 0;background:#fff} .spec-table th,.spec-table td{border:1px solid #ddd;padding:10px 12px;text-align:left} .table-wrap{overflow-x:auto}
.related{columns:2;gap:24px} .form-box{background:#fff;border:1px solid #ddd;border-radius:8px;padding:22px;max-width:640px;margin:20px 0}
.field{margin-bottom:14px} .field label{display:block;font-weight:700;margin-bottom:6px} .field input,.field textarea{width:100%;padding:10px;border:1px solid #bbb;border-radius:4px;font:inherit}
.btn{background:#101418;color:#fff;border:0;padding:12px 22px;border-radius:6px;font-weight:700;cursor:pointer} .hidden{display:none}
.note{background:#fffbe8;border:1px solid #e8d9a0;padding:12px 14px;border-radius:6px} .site-footer{background:#0a0e12;color:#ddd;padding:26px 20px;text-align:center} .site-footer a{color:#fff}
.range-overview{margin:24px 0} .range-overview h2{font-size:22px} .skip{position:absolute;left:-9999px} .visually-hidden{position:absolute;left:-9999px} .tag{display:inline-block;background:#19b8d6;padding:2px 8px;border-radius:4px;font-size:13px} .meta{font-size:14px;color:#666}
@media(max-width:640px){.hero h1{font-size:29px} .brand-row{flex-direction:column;align-items:flex-start} .cta-btn{margin-left:0} .related{columns:1}}

.lang-switch{width:max-content;margin:10px 16px 0 auto;position:relative;z-index:60}
.lang-switch summary{cursor:pointer;list-style:none;font-weight:600}
.lang-switch ul{list-style:none;margin:6px 0 0;padding:8px 0;background:#fff;border:1px solid #ccc}
.lang-switch li{padding:2px 14px}
.lang-switch a{color:#222;text-decoration:none}
.lang-switch .cur{font-weight:700}

/* Visual sample: category hierarchy and reading rhythm. */
.hero{padding:18px 20px 4px}
.hero .kicker{margin:4px 0}
.evidence{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0}
.evidence-item{min-width:0;padding:8px 10px;font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.hero .motif{height:12px;margin:10px 0}
.cta-btn{max-width:100%;border:2px solid #19b8d6;box-shadow:0 3px 0 #08788c}
.figure{width:100%;max-width:100%;margin:12px 0 24px}
.figure img{display:block;width:100%;max-width:100%;height:auto}
.card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:28px 0 44px}
.card-grid>.card{min-width:0;max-width:100%;border:1px solid #cdd6db;border-top:3px solid #9cabb4;padding:20px;overflow-wrap:anywhere}
.card-grid>.card:first-child{grid-column:span 2;background:#e0f4f7;border:2px solid #087e94;border-top-width:7px;padding:26px}
.card-grid .card h3{font-size:19px;line-height:1.3;margin:0 0 12px}
.card-grid .card:first-child h3{font-size:clamp(24px,3vw,32px)}
.card-grid .tag{max-width:100%;padding:0;background:transparent;border-radius:0;font-size:inherit}
.card-grid .meta{margin:0;color:#46545f}
main h2{margin:56px 0 20px;padding-top:20px;border-top:2px solid #aabcc5;font-size:clamp(25px,3vw,32px);font-weight:700;line-height:1.25;overflow-wrap:anywhere}
main p{margin-bottom:26px}
main>p:not(.note){max-width:78ch}
.range-overview{margin:40px 0 48px}
.range-overview h2{margin:32px 0 0;padding:22px 24px 12px;font-size:clamp(24px,2.6vw,29px);background:#e6edf0}
.range-overview h2+p{margin:0;padding:0 24px 26px;background:#e6edf0}
.range-overview h2:nth-of-type(even),.range-overview h2:nth-of-type(even)+p{background:#e6f2f3}
@media(min-width:641px) and (max-width:960px){
  .card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .evidence{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .hero{padding:14px 20px 2px}
  .evidence{grid-template-columns:minmax(0,1fr);gap:6px;margin:10px 0}
  .evidence-item{padding:7px 10px}
  .card-grid{grid-template-columns:minmax(0,1fr);gap:12px;margin:24px 0 36px}
  .card-grid>.card:first-child{grid-column:1;padding:22px}
  main h2{margin-top:42px;padding-top:16px}
  main p{margin-bottom:24px}
  .range-overview h2{margin-top:26px;padding:18px 16px 10px}
  .range-overview h2+p{padding:0 16px 22px}
}

/* R2 round: direct-heading rhythm and decorative product bands. */
main>h2{max-width:100%;box-sizing:border-box}
main>h2:nth-of-type(3n+2){background:#e6edf0;padding:22px 24px;border-left:5px solid #19b8d6;border-top:none}
main>h2:nth-of-type(3n){background:#0a0e12;color:#fff;padding:24px;margin-top:80px;border-top:none}
main>h2:nth-of-type(3n)::before{content:"";display:block;width:100%;max-width:100%;box-sizing:border-box;height:200px;margin-bottom:24px;background-color:#0a0e12;background-repeat:no-repeat;background-position:center;background-size:contain}
main>h2:nth-of-type(3)::before{background-image:url(/assets/img/jieyu-flexible.jpg)}
main>h2:nth-of-type(6)::before{background-image:url(/assets/img/jieyu-gob.jpg)}
main>h2:nth-of-type(9)::before{background-image:url(/assets/img/jieyu-indoor-flexible.png)}
main>h2:nth-of-type(12)::before{background-image:url(/assets/img/jieyu-flexible.jpg)}
.card-grid>.card:nth-child(3n){background:#f0f7f8}
@media(max-width:640px){
  main>h2:nth-of-type(3n+2){padding:16px}
  main>h2:nth-of-type(3n){padding:16px;margin-top:60px}
  main>h2:nth-of-type(3n)::before{height:140px;margin-bottom:16px}
}

/* R3 round: use the available reading width above the mobile breakpoint. */
@media(min-width:641px){
  main{max-width:1320px}
  main>p:not(.note){max-width:none}
}

/* G4 closure 4: keep mobile dropdown inside the viewport. */
@media(max-width:640px){.nav-menu{position:relative}.nav-menu>li{position:static}.nav-menu .menu{left:20px;right:20px;top:100%;min-width:0;width:auto;max-width:calc(100vw - 40px)}}