:root{--brown:#4a210b;--brown2:#6c3514;--gold:#d99a32;--gold2:#f7d68b;--cream:#fff8e9;--ink:#633713;--line:#e8d2a9;--shadow:0 8px 24px #64350e1c}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:#fffdf7;color:#4c2a13;font-family:'Be Vietnam Pro',Arial,sans-serif;font-size:13px}.top-art{height:94px;background:linear-gradient(90deg,#f6e5bc88,#4a210b22,#f7e7c1aa),url('../img/roof-header.jpg') center 45%/cover;position:absolute;top:0;left:0;width:100%;pointer-events:none}.site-header{height:87px;position:relative;z-index:2;max-width:1450px;margin:auto;display:flex;align-items:center;justify-content:center;padding:10px 28px}.brand{display:flex;align-items:center;gap:12px;color:#ffdc80;text-align:center;text-shadow:0 2px 5px #160900;filter:drop-shadow(0 2px 4px #281000)}.brand strong,.footer-brand strong{font:700 28px/1.02 'Playfair Display',serif;display:block;letter-spacing:.3px}.brand small,.footer-brand small{font:italic 12px 'Playfair Display',serif;display:block;margin-top:5px;color:#fff1d3}.lotus-logo{font-size:43px;color:#e9b54c;text-shadow:0 0 8px #e9a22b;line-height:1}.header-tools{position:absolute;right:8%;top:32px;display:flex;gap:5px;align-items:center}.search{display:flex;height:28px;background:#fff6e4;border:1px solid #d9ad5d;border-radius:3px;overflow:hidden}.search input{width:155px;border:0;background:transparent;padding:0 10px;font-size:10px;outline:none}.search button{width:29px;border:0;background:#5b2b0b;color:#f9d77c;font-size:23px;cursor:pointer}.cart{border:1px solid #d7a94f;background:#572809;color:#f9d77c;padding:4px 8px;font-size:15px;display:flex;align-items:center;gap:4px;cursor:pointer}.cart span{font-size:8px;color:#fff2cf}.main-nav{position:relative;z-index:3;max-width:1240px;height:43px;margin:0 auto;background:linear-gradient(#6d3717,#3d1a08);border:1px solid #d8a64a;box-shadow:0 3px 9px #3516035c;border-radius:3px;display:flex;align-items:center;justify-content:center;padding:0 18px}.main-nav:before,.main-nav:after{content:"";position:absolute;top:-23px;width:45px;height:30px;border-top:4px solid #d6a247;pointer-events:none}.main-nav:before{left:-8px;transform:skewY(-20deg)}.main-nav:after{right:-8px;transform:skewY(20deg)}.nav-links{display:flex;align-items:center;gap:26px;height:100%}.nav-links a{color:#f8e3b5;text-decoration:none;font-size:10px;font-weight:700;white-space:nowrap;display:flex;gap:6px;align-items:center;transition:color .2s}.nav-links a:hover{color:#ffd15d}.nav-zalo{position:absolute;right:10px;top:-5px;padding:8px 18px 8px 35px;background:linear-gradient(#ffe7a2,#c98922);border:2px solid #fff0b8;border-radius:24px;color:#4b2309;text-decoration:none;font-weight:800;box-shadow:0 2px 8px #2c140b66;font-size:12px}.nav-zalo:before{content:'Z';position:absolute;left:7px;top:5px;background:#2b9ddc;color:white;border:2px solid white;border-radius:50%;width:23px;height:23px;display:grid;place-items:center}.nav-zalo b{display:block;font-size:11px}.menu-toggle{display:none;background:none;border:0;color:#ffe2a0;font-size:24px}.hero{height:506px;max-width:1536px;margin:0 auto;position:relative;overflow:hidden;background:#f7e4bb;border-radius:0 0 18px 18px;box-shadow:0 8px 26px #74431620}.hero-art{position:absolute;inset:0;background-image:url('../img/hero-slide-1.jpg');background-position:center;background-size:cover;background-repeat:no-repeat;filter:saturate(1.08);transition:background-image .45s ease,transform 1s ease}.hero:after{content:"";position:absolute;inset:0;border:1px solid #e8c57b;pointer-events:none;border-radius:inherit}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#fff0d000 0%,#fff1d020 22%,#fff8e7d9 46%,#fff4d7c9 69%,#fff1d820 100%)}.hero-copy{position:absolute;top:75px;left:35%;width:38%;text-align:center;color:#63350f;z-index:1;padding:20px 24px;background:#fff8e9a8;backdrop-filter:blur(2px);border:1px solid #f0d59a;border-radius:22px;box-shadow:0 8px 28px #60300d18}.eyebrow{font:italic 36px 'Playfair Display',serif;margin:0}.hero h1{font:italic 56px/1.1 'Playfair Display',serif;margin:-1px 0 1px;color:#5c2a0d}.hero-tagline{font:italic 17px 'Playfair Display',serif;color:#9b5d1d;margin:0 0 8px}.hero-desc{font-size:13px;line-height:1.75;margin:0 0 10px;color:#46260f}.gold-button{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(#8d5017,#4b220a);border:2px solid #d9a43d;box-shadow:0 2px 5px #78471b60;color:#fff2cf;text-decoration:none;padding:8px 14px;border-radius:22px;font-size:11px;font-weight:700}.gold-button span{font-size:20px;line-height:10px}.hero-quote{position:absolute;right:5%;top:145px;font:italic 17px/1.65 'Playfair Display',serif;color:#623a1c}.hero-quote div{text-align:center;font-size:30px;color:#9d652b;margin-top:4px}.hero-arrow{position:absolute;top:47%;z-index:2;width:48px;height:48px;border-radius:50%;border:1px solid #d7ae60;background:#fff1cc;color:#58300e;font-size:29px;line-height:20px;cursor:pointer;box-shadow:0 2px 6px #7a4a1b50}.hero-arrow.prev{left:2.2%}.hero-arrow.next{right:2.2%}.hero-dots{position:absolute;bottom:18px;z-index:2;left:50%;transform:translateX(-50%);display:flex;gap:9px}.hero-dots button{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:#b58b4d;cursor:pointer}.hero-dots button.active{background:#60300d;transform:scale(1.35);box-shadow:0 0 0 4px #fff3d880}.benefits{display:grid;grid-template-columns:repeat(5,1fr);max-width:1536px;margin:0 auto;background:linear-gradient(90deg,#f9e4b9,#fff8e7,#f7e2b7);border-top:1px solid #f3d9a1;border-bottom:1px solid #e8c98d;min-height:55px;padding:6px 7%;gap:10px}.benefits>div{display:flex;align-items:center;justify-content:center;gap:11px;border-right:1px solid #dcbf87}.benefits>div:last-child{border:0}.benefit-icon{font-size:30px;color:#a85d1d;background:#fff5df;border:1px solid #f0d6a5;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;flex-shrink:0}.benefits p{margin:0;display:flex;flex-direction:column;gap:3px}.benefits b{font-size:11px;color:#553014}.benefits small{font-size:10px;color:#8d6946}.section{max-width:1470px;margin:0 auto;padding:0 24px}.categories-section{padding-top:8px}.section-title{display:flex;align-items:center;justify-content:center;gap:12px;position:relative;min-height:27px;margin-bottom:6px}.section-title>span{color:#b67b2d;font-size:22px}.section-title h2,.panel h2{font-size:16px;color:#663510;margin:0;font-weight:800}.section-title>a{position:absolute;right:0;color:#a76524;text-decoration:none;font-size:10px}.category-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}.category-card{height:98px;border:1px solid #d8b271;border-radius:10px;overflow:hidden;padding:0;position:relative;background:#61320e;box-shadow:0 2px 4px #6e401e2b;cursor:pointer;transition:transform .2s,box-shadow .2s}.category-card:hover,.category-card.active{transform:translateY(-2px);box-shadow:0 4px 10px #7a4c1b45;border-color:#f0c76b}.category-card img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.05)}.category-card:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#301404d9)}.category-card span{position:absolute;bottom:7px;left:2px;right:2px;color:#fff3d8;font-size:10px;font-weight:600;text-align:center;text-shadow:0 1px 3px #190900;z-index:1;white-space:nowrap}.products-section{padding-top:13px}.products-section .section-title{margin-bottom:8px}.product-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.product-card{display:flex;min-width:0;border:1px solid #e4d5bc;border-radius:7px;background:#fffdf8;overflow:hidden;position:relative;min-height:115px;box-shadow:0 2px 5px #7c542012}.product-card>img{width:37%;object-fit:cover;min-width:0}.product-info{position:relative;flex:1;padding:13px 8px 7px;min-width:0}.product-info h3{font-size:10px;font-weight:600;margin:3px 0 4px;line-height:1.35;color:#3e2a1c}.product-info p{font-size:9px;color:#8a7765;margin:0 0 7px}.product-info strong{font-size:12px;color:#9e2e13;display:block;margin-bottom:8px}.ribbon{position:absolute;top:0;right:5px;background:#cf8a23;color:white;font-size:7px;padding:2px 5px;border-radius:0 0 4px 4px}.ribbon.green{background:#3c9d66}.ribbon.red{background:#cf4b4b}.detail-btn{border:0;border-radius:16px;background:linear-gradient(#91612f,#623713);color:#fff4d9;font-size:9px;padding:6px 10px;cursor:pointer;white-space:nowrap}.add-cart{position:absolute;right:5px;bottom:5px;width:22px;height:22px;border-radius:50%;border:1px solid #d9b978;background:#fff5df;color:#6c3b13;cursor:pointer;display:none}.product-card:hover .add-cart{display:block}.no-results{text-align:center;padding:20px;color:#7b5a3a}.lower-panels{max-width:1470px;margin:18px auto 16px;padding:0 25px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px}.panel{min-width:0;border-right:1px solid #eee0c9;padding-right:18px}.panel:last-child{border:0;padding:0}.panel h2{font-size:14px;margin:0 0 7px;white-space:nowrap}.panel h2 a{float:right;color:#a66a2b;text-decoration:none;font-size:9px;font-weight:400}.review-body{border:1px solid #eadcc6;border-radius:9px;background:#fffaf1;min-height:85px;display:flex;align-items:center;padding:10px;gap:13px}.avatar{width:52px;height:52px;flex-shrink:0;border-radius:50%;background:linear-gradient(#e7c98c,#a66c2d);border:2px solid #d5a85c;display:grid;place-items:center;font-size:26px}.review-body p{font:italic 11px/1.5 'Playfair Display',serif;margin:0 0 4px;color:#6e4a2d}.stars{color:#e5a31e;letter-spacing:1px;font-size:15px}.review-body small{font-size:9px;color:#7c5a3e}.review-pagination{text-align:center;color:#d4c4ad;font-size:10px;margin-top:5px}.review-pagination b{color:#81501e}.news-item{display:flex;align-items:center;gap:9px;text-decoration:none;color:#54371f;border-bottom:1px solid #eee0cc;padding:4px 0}.news-item img{width:51px;height:37px;object-fit:cover;border-radius:5px}.news-item span{display:flex;flex-direction:column;gap:3px}.news-item b{font-size:9px;font-weight:500}.news-item small{font-size:8px;color:#b58b60}.faq details{background:#fffaf1;border:1px solid #eee2d0;border-radius:7px;margin-bottom:4px;padding:6px 10px;color:#69482b;font-size:10px}.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:8px}.faq summary:after{content:'+';font-size:14px;color:#5b2a0d}.faq details[open] summary:after{content:'−'}.faq details p{margin:8px 0 2px;line-height:1.5;color:#8a6b4b}footer{background:radial-gradient(ellipse at 15% 0%,#78441d,#371707 70%);color:#e9d0a2;border-top:3px solid #c38c37;position:relative;overflow:hidden}footer:before{content:'❋';position:absolute;left:-18px;bottom:-44px;font-size:150px;color:#bd8b3d22}footer:after{content:'❋';position:absolute;right:20px;bottom:-45px;font-size:130px;color:#d5a34d2a}.footer-main{max-width:1430px;margin:auto;padding:19px 28px 14px;display:grid;grid-template-columns:1.25fr 1.2fr 1fr 1.25fr .65fr;gap:22px;position:relative;z-index:1}.footer-brand{display:flex;gap:10px;align-items:center;border-right:1px solid #8c5d2b;padding-right:14px}.footer-brand strong{font-size:23px;color:#f1cb69}.footer-brand small{font-size:9px}.footer-brand .lotus-logo{font-size:43px}.footer-main h3{font-size:11px;color:#ffda7e;margin:0 0 8px}.footer-main p,.footer-main>a{font-size:10px;line-height:1.6;color:#e7d1a9;margin:0 0 5px;text-decoration:none;display:block}.footer-main>div:not(:first-child){border-right:1px solid #8c5d2b}.footer-main>div:nth-child(4){border:0}.socials{display:flex;gap:8px;margin-bottom:10px}.socials a{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#f1cc72;color:#51290e;text-decoration:none;font-weight:800}.footer-zalo{display:block!important;border:1px solid #d6a64d;border-radius:18px;padding:6px 10px;width:max-content;background:#4d240d}.footer-zalo b{font-size:14px;color:#ffe4a4}.footer-blessing{text-align:center;font:italic 16px/1.5 'Playfair Display',serif;align-self:center}.footer-blessing div{font-size:35px;color:#d9a34a}.footer-bottom{border-top:1px solid #815426;padding:8px 6%;display:flex;justify-content:space-between;font-size:9px;color:#b99768;position:relative;z-index:1}.floating-zalo{position:fixed;right:18px;bottom:75px;z-index:9;background:#168fe0;color:white;border:3px solid #fff;border-radius:50%;width:52px;height:52px;display:grid;place-items:center;text-decoration:none;font-size:12px;font-weight:800;box-shadow:0 3px 12px #4c2b1740}.back-top{position:fixed;right:18px;bottom:17px;z-index:9;border:1px solid #c9a15a;background:#f8e4b5;color:#653611;border-radius:50%;width:36px;height:36px;font-size:24px;cursor:pointer;box-shadow:var(--shadow)}.toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);background:#48210b;color:#fff1d2;border:1px solid #d5a348;padding:10px 18px;border-radius:24px;z-index:20;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1537px){.hero{border-radius:0 0 14px 14px}.hero-art{background-position:center 49%}}
@media(max-width:1100px){.header-tools{right:3%}.nav-links{gap:13px}.nav-zalo{right:5px}.category-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.category-card{height:105px}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.product-card{min-height:130px}.hero-copy{left:28%;width:48%;top:90px}.hero-quote{right:3%;top:340px;font-size:13px}.footer-main{grid-template-columns:repeat(3,1fr)}.footer-brand{border-right:0}.footer-blessing{display:none}}
@media(max-width:700px){body{font-size:12px}.top-art{height:76px;background-position:center}.site-header{height:76px;justify-content:flex-start;padding:8px 12px}.brand{gap:7px}.brand strong{font-size:21px}.brand small{font-size:9px}.lotus-logo{font-size:31px}.header-tools{right:10px;top:10px}.search input{width:90px}.cart span{display:none}.cart{height:28px}.main-nav{height:auto;min-height:42px;margin:0 8px;padding:0 10px;justify-content:flex-start}.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:40px;left:0;right:0;background:#48200b;border:1px solid #c89841;box-shadow:var(--shadow);height:auto;padding:10px;flex-direction:column;align-items:stretch;gap:0}.nav-links.open{display:flex}.nav-links a{padding:10px 8px;border-bottom:1px solid #855323}.nav-zalo{right:8px;top:5px;padding:6px 10px 6px 29px;font-size:10px}.nav-zalo:before{width:19px;height:19px;left:5px;top:4px}.nav-zalo b{font-size:9px}.hero{height:620px}.hero-art{background-position:28% center;opacity:1}.hero-overlay{background:linear-gradient(180deg,#fff4db25 0%,#fff2d86b 28%,#fff6e9ed 65%,#fff6e9e8 100%)}.hero-copy{left:6%;right:6%;width:auto;top:210px;padding:20px 16px}.eyebrow{font-size:27px}.hero h1{font-size:39px}.hero-tagline{font-size:12px}.hero-desc{font-size:10px}.desktop{display:none}.hero-quote{top:28px;right:12%;font-size:12px;text-align:right}.hero-quote div{display:none}.hero-arrow{top:48%;width:36px;height:36px}.benefits{grid-template-columns:repeat(2,1fr);padding:8px;gap:5px}.benefits>div{justify-content:flex-start;padding:4px;border-right:0}.benefits>div:last-child{grid-column:span 2;justify-content:center}.benefit-icon{width:35px;height:35px;font-size:22px}.benefits b{font-size:10px}.benefits small{font-size:9px}.section{padding-left:10px;padding-right:10px}.section-title{gap:6px}.section-title h2{font-size:13px}.section-title>span{font-size:16px}.section-title>a{font-size:8px}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.category-card{height:105px}.category-card span{font-size:10px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.product-card{min-height:120px}.product-card>img{width:35%}.product-info{padding:12px 6px 6px}.product-info h3{font-size:9px}.product-info p{font-size:8px}.product-info strong{font-size:10px}.detail-btn{font-size:8px;padding:5px 7px}.lower-panels{grid-template-columns:1fr;padding:0 12px;gap:16px;margin-top:17px}.panel{border-right:0;border-bottom:1px solid #eadcc6;padding:0 0 13px}.panel h2{font-size:13px}.footer-main{grid-template-columns:1fr 1fr;padding:18px 14px;gap:15px}.footer-brand{grid-column:span 2}.footer-main>div:not(:first-child){border-right:0}.footer-main p,.footer-main>a{font-size:9px}.footer-bottom{padding:9px 12px;font-size:8px;gap:12px}.floating-zalo{right:12px;bottom:63px;width:45px;height:45px}.back-top{right:15px;bottom:12px}}
@media(max-width:380px){.brand strong{font-size:18px}.brand small{font-size:8px}.header-tools{top:51px;right:8px}.site-header{height:88px}.top-art{height:88px}.hero-copy{top:215px}.hero-desc{font-size:9px}.section-title h2{font-size:11px}.product-card{min-height:132px}.detail-btn{white-space:normal}}

/* Refinement: spacious, balanced 3-column catalog cards and independent content sections */
.categories-section{padding-top:20px;padding-bottom:8px}
.category-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.category-card{height:auto;aspect-ratio: 2.55 / 1;border-radius:13px}
.category-card img{object-fit:cover;transition:transform .35s ease}
.category-card:hover img{transform:scale(1.045)}
.category-card:after{inset:45% 0 0;background:linear-gradient(transparent,#2b1206e8)}
.category-card span{bottom:13px;left:8px;right:8px;font-size:clamp(12px,1.1vw,15px);font-weight:700}
.products-section{padding-top:22px;padding-bottom:24px}
.products-section .section-title{margin-bottom:16px}
.product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.product-card{display:flex;flex-direction:column;min-height:0;border-radius:12px;transition:transform .22s,box-shadow .22s}
.product-card:hover{transform:translateY(-3px);box-shadow:0 10px 25px #7c542026}
.product-card>img{width:100%;height:230px;object-fit:cover;display:block;background:#f4e6ce}
.product-info{padding:14px 16px 16px;min-height:132px}
.product-info h3{font-size:14px;line-height:1.45;margin:3px 0 6px}
.product-info p{font-size:12px;margin-bottom:10px}
.product-info strong{font-size:16px;margin-bottom:12px}
.detail-btn{font-size:11px;padding:8px 14px}
.add-cart{display:grid;place-items:center;right:12px;bottom:12px;width:30px;height:30px;font-size:18px}
.ribbon{top:10px;right:10px;font-size:10px;padding:4px 8px;border-radius:4px}
.section-title{min-height:34px;margin-bottom:12px}
.section-title h2{font-size:19px;letter-spacing:.3px}
.standalone-section{padding:30px 0 34px;margin:0;position:relative}
.standalone-section:nth-of-type(even){background:linear-gradient(110deg,#fff8e9,#fffdf8 48%,#fbefd8)}
.section-inner{padding-left:25px;padding-right:25px}
.review-grid,.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.review-card{display:flex;align-items:flex-start;gap:15px;padding:22px 20px;border:1px solid #ead6b2;border-radius:13px;background:#fffdf8;box-shadow:0 5px 18px #6d42100c;min-height:160px}
.review-avatar{width:56px;height:56px;flex:0 0 56px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#fff0ca,#e9c17c);border:2px solid #d9ad5b;font-size:27px}
.review-card p{font:italic 13px/1.7 'Playfair Display',serif;color:#6e4a2d;margin:7px 0 12px}
.review-card b,.review-card small{display:block;font-size:11px;color:#68401e}
.review-card small{font-size:10px;color:#987c5d;margin-top:3px}
.stars{color:#e5a31e;letter-spacing:2px;font-size:16px}
.article-card{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:#54371f;background:#fffdf8;border:1px solid #ead8ba;border-radius:13px;box-shadow:0 5px 18px #6d42100c;transition:transform .2s,box-shadow .2s}
.article-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px #6d42101b}
.article-card>img{width:100%;height:190px;object-fit:cover}
.article-card>div{padding:16px 18px 18px}
.article-card small{font-size:10px;color:#a77a43;letter-spacing:.4px}
.article-card h3{font-size:15px;line-height:1.5;margin:9px 0;color:#60330f}
.article-card p{font-size:12px;line-height:1.7;color:#82684d;margin:0 0 14px}
.article-card b{font-size:11px;color:#9a5d20}
.faq-list{max-width:900px;margin:0 auto;display:grid;gap:9px}
.faq-list details{background:#fffdf8;border:1px solid #ead8ba;border-radius:10px;padding:14px 18px;color:#69482b;font-size:13px;box-shadow:0 3px 12px #6d42100a}
.faq-list summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;font-weight:600}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:'+';font-size:20px;line-height:16px;color:#9b652a}
.faq-list details[open] summary:after{content:'−'}
.faq-list details p{margin:12px 0 0;line-height:1.7;color:#8a6b4b}
@media(max-width:1100px){.category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.category-card{height:auto}.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.product-card>img{height:190px}.review-grid,.news-grid{gap:12px}.review-card{padding:16px 13px;gap:10px}}
@media(max-width:700px){.categories-section{padding-top:16px}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.category-card{aspect-ratio:1.35/1}.category-card span{font-size:11px;bottom:9px}.products-section{padding-top:16px;padding-bottom:15px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-card>img{height:155px}.product-info{padding:11px 10px 12px;min-height:124px}.product-info h3{font-size:11px}.product-info p{font-size:9px}.product-info strong{font-size:12px}.detail-btn{font-size:9px;padding:7px 9px}.add-cart{display:grid;width:25px;height:25px;right:8px;bottom:8px}.section-title h2{font-size:14px}.section-title>a{right:0;font-size:9px}.standalone-section{padding:22px 0 25px}.section-inner{padding-left:12px;padding-right:12px}.review-grid,.news-grid{grid-template-columns:1fr;gap:10px}.review-card{min-height:0;padding:16px}.review-card p{font-size:12px}.article-card{display:grid;grid-template-columns:110px 1fr;min-height:0}.article-card>img{height:100%;min-height:145px}.article-card>div{padding:12px}.article-card h3{font-size:12px;margin:6px 0}.article-card p{font-size:10px;margin-bottom:8px}.article-card small{font-size:8px}.faq-list details{font-size:11px;padding:12px}.faq-list summary{line-height:1.5}}
@media(max-width:380px){.category-grid,.product-grid{grid-template-columns:1fr}.category-card{aspect-ratio:2/1}.product-card>img{height:210px}.product-info h3{font-size:12px}}

/* V3: enlarged temple-roof masthead; brand lettering is already part of the roof artwork */
.top-art{height:150px;background:#4a210b url('../img/roof-header-v3.jpg') center 42%/cover no-repeat;filter:none;z-index:1}
.site-header{height:100px;justify-content:flex-end;max-width:1536px;padding:10px 8%;z-index:2}
.header-tools{right:8%;top:32px}
.main-nav{margin-top:-9px;max-width:1240px;z-index:4}
@media(max-width:1100px){.top-art{height:125px;background-position:center 43%}.site-header{height:82px}.header-tools{right:4%;top:26px}.main-nav{margin-top:-5px}}
@media(max-width:700px){.top-art{height:105px;background-position:center 42%}.site-header{height:72px;padding:8px 10px}.header-tools{right:10px;top:12px}.main-nav{margin:0 8px;min-height:42px}.main-nav:before,.main-nav:after{top:-13px}}
@media(max-width:380px){.top-art{height:96px}.site-header{height:68px}.header-tools{top:8px}}





/* V7: one complete roofline above a clean scenic hero; no duplicated menu artwork */
.top-art{
  height:150px!important;
  background:#4a210b url('../img/roof-v7.jpg') center 43%/cover no-repeat!important;
  position:absolute;top:0;left:0;width:100%;z-index:1;pointer-events:none;
}
.site-header{height:86px;position:relative;z-index:3;max-width:1536px;margin:auto}
.header-tools{z-index:5}
.main-nav{position:relative;z-index:6;margin:-5px auto 0;max-width:1240px}
.main-nav:before,.main-nav:after{display:none!important}
.hero{
  position:relative;isolation:isolate;overflow:hidden;width:calc(100% - 40px);
  max-width:1536px;height:clamp(350px,31vw,520px);margin:0 auto;
  border:2px solid #d9ad56;border-top:0;border-radius:0;
  background:#e9c98a;box-shadow:0 8px 22px rgba(65,30,8,.2)
}
.hero-art{position:absolute;inset:0;z-index:0;background-image:url('../img/hero-scene-v7.jpg')!important;background-position:center center;background-size:cover;background-repeat:no-repeat;filter:saturate(1.06) contrast(1.02);transition:background-position .5s ease}
.hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(49,18,4,.02) 0%,rgba(255,236,193,.02) 27%,rgba(255,239,204,.70) 40%,rgba(255,239,204,.48) 68%,rgba(54,21,5,.03) 100%)}
.temple-pillar{position:absolute;top:0;bottom:0;z-index:3;width:clamp(48px,5.8vw,88px);pointer-events:none;border:3px solid #3b1607;background:linear-gradient(90deg,#3a1506 0%,#7a3a11 13%,#d39a3e 27%,#f7d88b 35%,#8b4718 48%,#4b1d08 62%,#d7a14a 77%,#4a1b07 100%);box-shadow:inset 0 0 0 2px #efc86b,inset 0 0 0 6px #71320e,0 0 16px rgba(35,12,2,.4)}
.temple-pillar:before{content:"";position:absolute;top:0;left:-20%;right:-20%;height:32px;background:linear-gradient(#ffedb4,#a96722 25%,#421806 45%,#e0ac4c 63%,#4b1b06);border:2px solid #f4d078;box-shadow:0 4px 9px #32130377}
.temple-pillar:after{content:"南\A 無\A 阿\A 彌\A 陀\A 佛";white-space:pre;position:absolute;top:14%;left:0;right:0;text-align:center;font:italic 15px/1.7 'Playfair Display',serif;color:#ffe49b;text-shadow:0 2px 3px #351505,0 0 8px #f4c45c}
.temple-pillar-left{left:0}.temple-pillar-right{right:0}.temple-pillar-right:after{content:"萬\A 事\A 如\A 意"}
.hero-copy{position:absolute;z-index:4;left:27%;top:8%;width:49%;padding:18px 22px;text-align:center;background:linear-gradient(135deg,rgba(255,246,220,.86),rgba(255,239,200,.64));border:1px solid rgba(255,248,221,.55);box-shadow:none;backdrop-filter:blur(2px)}
.hero-copy .eyebrow,.hero-desc{display:none}
.hero h1{margin:0 0 8px;font:italic 500 clamp(30px,3.4vw,54px)/1.12 'Playfair Display',Georgia,serif;color:#8b3218;text-shadow:0 1px 0 #fff5d6}
.hero-tagline{margin:0 0 16px;font:italic clamp(13px,1.25vw,18px)/1.55 'Playfair Display',serif;color:#4f2a17}
.gold-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:10px 22px;border:1px solid #e9c36b;border-radius:28px;background:linear-gradient(#8b4b17,#4b210b);color:#fff1c8;box-shadow:0 3px 10px #4a1f0740;font-weight:700}
.hero-quote{position:absolute;z-index:4;top:18%;right:8%;width:15%;text-align:center;font:italic clamp(12px,1.2vw,17px)/1.6 'Playfair Display',serif;color:#613315}
.hero-quote div{font-size:27px;color:#9a571c}
.hero-arrow{z-index:5;top:50%;width:40px;height:40px;border:1px solid #e1b96e;border-radius:50%;background:#fff1d7;color:#5c2b0d;box-shadow:0 2px 8px #411a0540}
.hero-arrow.prev{left:calc(clamp(48px,5.8vw,88px) + 12px)}.hero-arrow.next{right:calc(clamp(48px,5.8vw,88px) + 12px)}
.hero-dots{z-index:5;bottom:12px}
@media(max-width:760px){
 .top-art{height:112px!important;background-position:center 25%!important}
 .site-header{height:65px}.header-tools{top:12px;right:10px}.main-nav{margin:0 8px;min-height:42px}
 .hero{width:100%;height:410px}
 .hero-overlay{background:linear-gradient(180deg,rgba(255,239,205,.02) 0%,rgba(255,241,210,.10) 28%,rgba(255,241,213,.83) 62%,rgba(255,240,208,.76) 100%)}
 .temple-pillar{width:34px;border-width:1px}.temple-pillar:before{height:22px}.temple-pillar:after{top:18%;font-size:10px;line-height:1.8}
 .hero-copy{left:11%;width:78%;top:auto;bottom:48px;padding:12px 8px;background:rgba(255,246,222,.82)}
 .hero h1{font-size:clamp(24px,6vw,36px)}.hero-tagline{font-size:12px;margin-bottom:10px}
 .hero-quote{top:12px;right:12%;width:34%;font-size:11px;line-height:1.45;text-align:right}.hero-quote div{display:none}
 .hero-arrow{width:30px;height:30px;font-size:22px}.hero-arrow.prev{left:38px}.hero-arrow.next{right:38px}
}
@media(max-width:420px){.hero{height:360px}.hero-copy{left:10%;width:80%;bottom:44px}.hero h1{font-size:23px}.gold-button{font-size:11px;padding:8px 10px}}
