/* Product material-archive layout. Palette: canvas #f3f5f8, paper #fff, ink #243247,
   navy #1a3c5e, blue #206bc4, rule #dfe5ec. Preserve host type and content. */
.product-layout { --bg:#f3f5f8; --border:#dfe5ec; --shadow:none; font-size:14px; line-height:1.75; }
.product-layout > nav { box-shadow:none; border-bottom:1px solid #dfe5ec; }
.product-layout > nav .nav-inner { max-width:none; }
.product-layout header.hero { position:relative; margin-left:260px; padding:25px 36px 22px; text-align:left; background:var(--card); color:var(--text); border-bottom:1px solid var(--border); }
.product-layout header.hero h1 { display:inline; font-size:27px; letter-spacing:0; margin:0; }
.product-layout header.hero .sub { display:inline; margin-left:12px; font-size:16px; color:var(--text-light); }
.product-layout header.hero .en-sub { font-size:12px; opacity:1; color:var(--text-light); margin-top:3px; }
.product-layout .container { max-width:1430px; margin-left:260px; padding:24px 36px; }
.product-layout .container > .card:first-child { border:0; background:transparent; padding:0; margin-bottom:18px; font-size:12px; }
.product-layout .card { padding:26px 28px; border:1px solid var(--border); border-radius:8px; box-shadow:none; margin-bottom:20px; }
.product-layout .flooring-guide h2 { font-size:19px; margin-bottom:15px; color:var(--text); }
.product-layout .flooring-guide h2 .en { font-size:13px; font-weight:400; color:var(--text-light); }
.product-layout .card > p { max-width:100ch; }
.product-layout .boundary-note { border-left:3px solid #8fa5bd; background:var(--bg); border-radius:0 4px 4px 0; padding:12px 16px; margin-top:18px; font-size:12px; }
.product-layout .en { color:var(--text-light); }
.product-layout table { font-size:13px; box-shadow:none; border:1px solid var(--border); }
.product-layout th { background:#edf2f8; color:#34465c; font-weight:600; padding:12px 14px; }
.product-layout th .en { color:#536675; }
.product-layout td { padding:12px 14px; border-bottom:1px solid var(--border); vertical-align:top; }
.product-layout tr:nth-child(even) { background:var(--bg); }
.product-layout .guide-figure { border:1px solid var(--border); padding:12px; border-radius:6px; }
.product-layout .guide-figure img { max-height:230px; }
.product-layout footer { margin-left:260px; }
.dashboard-rail { position:fixed; top:76px; bottom:0; left:0; width:260px; padding:26px 15px; background:var(--card); border-right:1px solid var(--border); overflow-y:auto; }
.dashboard-rail h2 { font-size:13px; font-weight:600; color:var(--text-light); margin:0 12px 18px; }
.dashboard-rail .guide-toc { display:flex; flex-direction:column; gap:4px; }
.dashboard-rail .guide-toc a { display:block; padding:11px 12px; color:var(--text-light); font-size:12px; border-left:3px solid transparent; border-radius:4px; text-decoration:none; }
.dashboard-rail .guide-toc a:hover { background:var(--bg); color:var(--text); }
.dashboard-rail .guide-toc a.is-current { background:#e9f1fb; color:#185aab; border-left-color:#206bc4; font-weight:600; }
html[data-theme="dark"] .product-layout th { background:#243a50; color:#e4edf5; }
html[data-theme="dark"] .dashboard-rail .guide-toc a.is-current { background:#243a50; color:#b2d4ff; }
@media(min-width:901px) { .product-layout > nav .nav-inner { min-height:76px; } }
@media(max-width:1100px) and (min-width:901px) { .dashboard-rail { width:225px; } .product-layout header.hero, .product-layout .container, .product-layout footer { margin-left:225px; } .product-layout .container { padding:20px; } }
@media(max-width:900px) {
  .product-layout header.hero, .product-layout .container, .product-layout footer { margin-left:0; }
  .product-layout header.hero { padding:20px; }
  .product-layout header.hero h1 { font-size:23px; }
  .product-layout header.hero .sub { font-size:14px; }
  .dashboard-rail { position:relative; top:auto; width:auto; padding:15px 20px; border-bottom:1px solid var(--border); }
  .dashboard-rail h2 { margin:0 0 8px; }
  .dashboard-rail .guide-toc { flex-direction:row; overflow-x:auto; gap:6px; }
  .dashboard-rail .guide-toc a { flex:0 0 auto; padding:9px; }
  .product-layout .container { padding:20px 12px; }
  .product-layout .card { padding:20px 16px; }
  .product-layout .flooring-guide h2 .en { display:block; }
}
@media print { .dashboard-rail { display:none; } .product-layout header.hero, .product-layout .container, .product-layout footer { margin-left:0; } }

/* Material archive direction: blue ink, cool paper, measured reading columns.
   Hero typography and the continuous navigation spine provide the identity. */
.material-layout { --bg:#eef2f5; --text:#20364b; --text-light:#586d7d; --border:#d3dfe7; font-size:15px; }
.material-layout .dashboard-rail { background:#16344a; border:0; padding:30px 18px; }
.material-layout .dashboard-rail h2 { color:#a9c1d2; padding:0 0 20px; border-bottom:1px solid #355267; margin-bottom:12px; letter-spacing:1px; }
.material-layout .dashboard-rail .guide-toc { gap:3px; }
.material-layout .dashboard-rail .guide-toc a { color:#c6d5df; font-size:12px; padding:12px 11px; border-radius:3px; }
.material-layout .dashboard-rail .guide-toc a:hover { color:#fff; background:#24485f; }
.material-layout .dashboard-rail .guide-toc a.is-current { color:#fff; background:#2c526b; border-left-color:#77c8dd; }
.material-layout header.hero { padding:40px 42px 28px; min-height:272px; border-bottom:4px solid #16344a; overflow:hidden; }
.material-layout header.hero h1 { display:block; font-size:44px; line-height:1.15; font-weight:650; letter-spacing:2px; }
.material-layout header.hero .sub { display:block; margin:8px 0 16px; font-family:Georgia, 'Times New Roman', serif; font-size:42px; line-height:1.1; color:#426079; opacity:1; }
.material-layout header.hero .en-sub { position:absolute; right:42px; bottom:35px; font-size:11px; }
.material-actions { display:flex; gap:10px; margin-top:23px; flex-wrap:wrap; }
.material-actions a { padding:8px 20px; background:var(--card); color:var(--text); border:1px solid var(--border); border-radius:3px; font-size:12px; }
.material-actions a:first-child { background:#16344a; color:#fff; border-color:#16344a; }
.material-actions a:hover { box-shadow:0 2px 0 #6c9aaf; text-decoration:none; }
.material-layout .container { padding:22px 42px 40px; }
.material-layout .card { padding:30px; border:0; border-radius:3px; box-shadow:0 1px 0 #d2dce5; margin-bottom:26px; }
.material-layout .material-archive { display:grid; grid-template-columns:1fr 1fr; gap:0 32px; border-top:3px solid #4d7c96; }
.material-layout .material-archive h2 { grid-column:1/-1; padding-bottom:18px; border-bottom:1px solid var(--border); margin-bottom:21px; }
.material-layout .material-archive > p:not(.boundary-note) { font-size:14px; line-height:1.95; margin-bottom:0; }
.material-layout .material-archive > p.en { font-size:13px; border-left:1px solid var(--border); padding-left:30px; }
.material-layout .material-archive .boundary-note { grid-column:1/-1; max-width:none; margin-top:24px; font-size:12px; background:#f0f5f8; border-left-color:#578aa4; }
.material-layout .flooring-guide h2 { font-size:21px; font-weight:650; line-height:1.6; }
.material-layout .product-deep-dive > h2 { margin:-30px -30px 24px; padding:20px 30px; background:#f8fafc; border-bottom:1px solid var(--border); }
.material-layout .product-deep-dive > h2 .en { display:block; font-size:12px; padding-top:2px; }
.material-layout .flooring-guide .guide-columns { gap:18px; margin:24px 0; }
.material-layout .guide-figure { background:#f8fafc; border:0; padding:18px; }
.material-layout .guide-figure figcaption { padding-top:10px; border-top:1px solid var(--border); }
.material-layout table { border:0; }
.material-layout th { background:#24465d; color:#fff; padding:15px; }
.material-layout th .en { color:#d2e1ea; }
.material-layout td { padding:15px; }
.material-layout .flooring-guide summary { background:#eaf0f5; padding:16px 20px; border-left:3px solid #527f97; border-radius:2px; }
.material-layout .guide-process { display:grid; grid-template-columns:1fr 1fr; gap:0 40px; padding-left:25px; }
html[data-theme="dark"] .material-layout { --text:#e4edf5; --text-light:#b3c4d3; --border:#455d70; --bg:#111c28; }
html[data-theme="dark"] .material-layout :is(.product-deep-dive > h2,.boundary-note,.guide-figure,summary) { background:#243a50!important; }
html[data-theme="dark"] .material-layout header.hero .sub { color:#a8c8dd; }
@media(max-width:1200px) { .material-layout header.hero .en-sub { position:static; } .material-layout .container { padding:22px; } }
@media(max-width:900px) {
  .material-layout header.hero { padding:30px 22px 24px; min-height:0; }
  .material-layout header.hero h1 { font-size:34px; }
  .material-layout header.hero .sub { font-size:34px; }
  .material-layout .dashboard-rail { padding:15px; }
  .material-layout .dashboard-rail h2 { padding-bottom:10px; }
  .material-layout .dashboard-rail .guide-toc a { padding:9px; }
  .material-layout .container { padding:20px 14px; }
  .material-layout .card { padding:22px; }
  .material-layout .product-deep-dive > h2 { margin:-22px -22px 20px; padding:18px 22px; }
}
@media(max-width:650px) {
  .material-layout .material-archive { display:block; }
  .material-layout .material-archive > p.en { margin-top:16px; padding:16px 0 0; border-left:0; border-top:1px solid var(--border); }
  .material-layout .guide-process { grid-template-columns:1fr; }
  .material-layout header.hero .sub { font-size:31px; }
  .material-actions { gap:6px; }
  .material-actions a { padding:8px 13px; }
}
@media print { .material-actions { display:none; } }

/* Shared product-page adaptation. Original content and media stay in place. */
.product-layout .dashboard-rail { top:var(--material-nav-height,77px); }
.material-picker { display:block; color:#c6d5df; font-size:11px; margin:0 10px 24px; }
.material-picker select { display:block; width:100%; margin-top:8px; padding:10px 8px; border:1px solid #52748a; border-radius:3px; background:#24485f; color:#fff; font:inherit; font-size:13px; }
.material-review-link { display:block; margin:22px 12px 0; padding-top:18px; border-top:1px solid #355267; color:#c6d5df; font-size:12px; }
.product-layout:not(.material-layout) .material-picker { color:var(--text); }
.product-layout:not(.material-layout) .material-review-link { color:var(--text); }
.material-layout header.hero h1, .material-layout header.hero .sub { padding-right:0; overflow-wrap:anywhere; }
.material-layout header.hero .sub { font-size:clamp(26px,3vw,42px); }
.material-layout .container { min-width:0; }
.material-layout .card > h3 { font-size:21px; line-height:1.6; color:var(--text); margin-bottom:22px; padding-bottom:16px; border-bottom:1px solid var(--border); }
.material-layout .card > h3 .en { display:block; font-size:12px; font-weight:400; color:var(--text-light); }
.material-layout .card > p.cn + p.en { margin-top:12px; margin-bottom:22px; }
.material-layout .card > p:has(> strong:first-child) { margin-top:20px; }
.material-layout .card > ul { padding-left:22px; }
.product-layout .table-wrap { max-width:100%; overflow-x:auto; }
.product-layout table { width:100%; }
.product-layout th, .product-layout td { overflow-wrap:anywhere; }
.product-layout .container [id] { scroll-margin-top:calc(var(--material-nav-height,77px) + 20px); }
.material-layout .card > p { overflow-wrap:anywhere; }
.material-layout .card > .section-title { font-size:21px; font-weight:650; border-bottom:1px solid var(--border); padding-bottom:14px; margin:20px 0; }
.material-layout .card > .section-title .en { display:block; font-size:12px; font-weight:400; }
@media(max-width:900px) {
  .product-layout .dashboard-rail { top:auto; }
  .material-picker { margin:0 0 16px; }
  .material-picker select { max-width:340px; }
  .material-review-link { margin:12px 0 0; padding-top:10px; }
  .material-layout header.hero h1 { padding-right:0; font-size:30px; }
  .material-layout header.hero .sub { padding-right:0; font-size:30px; margin-top:20px; }
}