/* Blog and viewing history share the homepage card spacing. */
#home .home-blog .blog-box > a .data { max-width:none !important; }
#home .home-blog .blog-box h3 { white-space:normal !important; }
#home .home-blog, #home .home-recent { width:100%; float:none; clear:both; padding:0; margin:44px 0; border:0; }
#home .home-blog > .container, #home .home-recent > .container { width:calc(100% - 48px) !important; max-width:1140px; padding:0; margin:0 auto; }
#home .home-blog .block, #home .home-recent .block { padding:0; margin:0; width:100%; }
#home .home-blog h2, #home .home-recent h2 { float:none; width:auto; color:#1e354d; font-size:28px; line-height:1.3; letter-spacing:-.6px; margin:7px 0 10px; }
#home .wd-section-subtitle { float:none; width:auto; margin:0 0 24px; font-size:14px; color:#718297; line-height:1.6; }
#home .home-blog .blog-box { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); width:100%; gap:22px; margin:0; padding:0; float:none; }
#home .home-blog .blog-box > a { display:flex; flex-direction:column; float:none; box-sizing:border-box; width:100% !important; min-width:0; height:auto; padding:0; margin:0 !important; text-decoration:none; background:#fff; border:1px solid #e0e7ef; border-radius:12px; overflow:hidden; box-shadow:0 3px 14px #213f5a05; transition:border-color .15s,box-shadow .15s; }
#home .home-blog .blog-box > a:hover { border-color:#a5bfd9; box-shadow:0 8px 24px #213f5a0d; }
#home .home-blog .blog-box > a > img { display:block; flex:none; float:none; width:100% !important; height:180px !important; max-height:180px; margin:0; border:0; border-radius:0; box-sizing:border-box; padding:18px; background:#edf2f6; object-fit:contain; box-shadow:none; }
#home .home-blog .blog-box > a:nth-child(2) > img { background:#e8eff2; }
#home .home-blog .blog-box > a:nth-child(3) > img { background:#e9f0f4; }
#home .home-blog .blog-box > a .data { display:flex; flex-direction:column; flex:1; width:100% !important; float:none; padding:20px; margin:0; box-sizing:border-box; min-width:0; }
#home .wd-blog-label { display:block; float:none; width:auto; color:#648378; font-size:10px; text-transform:uppercase; font-weight:700; letter-spacing:1.4px; line-height:1.5; margin:0 0 10px; }
#home .home-blog .blog-box h3 { float:none; width:auto; color:#203b56; font-size:19px; font-weight:700; line-height:1.35; letter-spacing:-.3px; margin:0 0 10px; height:77px; max-height:none; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
#home .home-blog .blog-box .desc { float:none; width:auto; color:#718297; font-size:13px; line-height:1.6; height:63px; margin:0 0 18px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
#home .home-blog .blog-box .read { display:block; float:none; width:100%; color:#326dab; font-weight:600; font-size:12px; line-height:1.5; height:auto; opacity:1; margin:auto 0 0; padding:14px 0 0; border-top:1px solid #edf0f4; }
#home .home-blog .home-link-all-wrap { float:none; width:100%; margin:20px 0 0; text-align:left; }
#home .home-blog .home-link-all { display:inline-flex; float:none; align-items:center; width:auto; padding:11px 17px; border-radius:8px; border:1px solid #d6e1ed; background:#f5f8fc; color:#416588; font-size:13px; font-weight:600; height:auto; line-height:1.5; }
#home .home-recent { border-top:1px solid #e7edf3; padding-top:34px; margin-top:36px; }
#home #recent-items { display:grid !important; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); width:100% !important; gap:22px; margin:0 !important; padding:0; overflow:visible; float:none; }
#home #recent-items > .simple-prod { width:100% !important; max-width:none !important; min-width:0; float:none; padding:0; margin:0 !important; border:1px solid #e0e7ef; border-radius:12px; background:#fff; overflow:hidden; box-sizing:border-box; }
#home #recent-items .simple-wrap { width:100% !important; margin:0; border:0; }
#home #recent-items .img-wrap, #home #recent-items a.img { display:block; width:100%; height:210px; padding:0; margin:0; background:#f1f5f8; }
#home #recent-items .img-wrap img { display:block; width:100%; height:210px; max-height:210px; object-fit:contain; }
#home #recent-items .data { box-sizing:border-box; padding:17px 20px; }
#home #recent-items .title2 { display:block; float:none; white-space:normal; height:auto; max-height:none; font-size:15px; line-height:1.45; color:#304b65; margin:7px 0; }
#home #recent-items .price { font-size:18px; color:#263f59; line-height:1.4; }
html[mode="dark"] #home .home-blog .blog-box > a, html[mode="dark"] #home #recent-items > .simple-prod { background:#203448; border-color:#3a4e63; }
html[mode="dark"] #home .home-blog h2, html[mode="dark"] #home .home-recent h2, html[mode="dark"] #home .home-blog .blog-box h3, html[mode="dark"] #home #recent-items .title2, html[mode="dark"] #home #recent-items .price { color:#dbe8f3; }
html[mode="dark"] #home .home-blog .blog-box .desc, html[mode="dark"] #home .wd-section-subtitle { color:#acbdce; }
html[mode="dark"] #home .wd-blog-label { color:#99c7b5; }
html[mode="dark"] #home .home-blog .blog-box .read { color:#9ec8f0; border-color:#3c5064; }
html[mode="dark"] #home .home-blog .home-link-all { background:#263e55; color:#bddef8; border-color:#455d74; }
html[mode="dark"] #home .home-recent { border-color:#384c5e; }
@media(max-width:800px) { #home .home-blog .blog-box { grid-template-columns:1fr; gap:16px; }#home .home-blog .blog-box > a { display:grid; grid-template-columns:160px minmax(0,1fr); }#home .home-blog .blog-box > a > img { height:100% !important; min-height:180px; max-height:none; padding:14px; }#home .home-blog .blog-box h3 { height:auto; margin-bottom:8px; }#home .home-blog .blog-box .desc { height:auto; -webkit-line-clamp:2; } }
@media(max-width:600px) { #home .home-blog > .container, #home .home-recent > .container { width:calc(100% - 32px) !important; }#home .home-blog, #home .home-recent { margin:30px 0; }#home .home-blog h2, #home .home-recent h2 { font-size:24px; }#home .home-blog .blog-box > a { grid-template-columns:1fr; }#home .home-blog .blog-box > a > img { height:156px !important; min-height:0; max-height:156px; padding:14px; }#home .home-blog .blog-box > a .data { padding:18px; }#home .home-blog .blog-box h3 { font-size:18px; }#home #recent-items { grid-template-columns:1fr; gap:16px; }#home .home-recent { padding-top:24px; } }
@media(prefers-reduced-motion:reduce) { #home .home-blog .blog-box > a { transition:none; } }
