/*
Theme Name: Wallify Khas Style
Author: Wallify
Description: WooCommerce storefront inspired by the structure of the supplied KhasWall reference, redesigned for Wallify.
Version: 2.0.0
Requires at least: 6.0
*/

:root{--ink:#171717;--muted:#777;--line:#e9e9e9;--soft:#fafafa;--sale:#b3261e;--gold:#b28a45;--max:1320px}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);font-family:Arial,Helvetica,sans-serif;background:#fff;font-size:14px}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{width:min(94%,var(--max));margin:auto}
.announcement{background:#171717;color:#fff;text-align:center;padding:10px;font-size:13px;letter-spacing:.15px}
.header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:100}
.header-main{height:82px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{font-size:30px;font-weight:800;letter-spacing:2.5px;white-space:nowrap}
.brand b{font-weight:800}
.brand i{color:var(--gold);font-style:normal}
.nav{display:flex;align-items:center;justify-content:center;gap:25px;flex:1}.nav ul{display:flex;align-items:center;gap:25px;list-style:none;margin:0;padding:0}.nav li{list-style:none}.nav li a{font-size:14px;font-weight:600;white-space:nowrap}
.nav>a,.nav-item>span{font-size:14px;font-weight:600;white-space:nowrap}
.nav-item{position:relative;padding:32px 0}
.nav-item .dropdown{display:none;position:absolute;top:70px;left:-18px;background:#fff;border:1px solid var(--line);min-width:220px;padding:8px 0;box-shadow:0 12px 30px rgba(0,0,0,.08)}
.nav-item:hover .dropdown{display:block}
.dropdown a{display:block;padding:11px 17px;font-size:13px}
.dropdown a:hover{background:var(--soft)}
.header-tools{display:flex;align-items:center;gap:10px}
.tool{width:38px;height:38px;border:0;background:#fff;display:grid;place-items:center;font-size:18px;cursor:pointer}
.mobile-toggle{display:none}
.searchbar{display:none;border-top:1px solid var(--line);padding:12px 0}
.searchbar form{display:flex}
.searchbar input{flex:1;border:1px solid #ddd;padding:12px}
.searchbar button{border:0;background:#171717;color:#fff;padding:0 18px}

.hero{background:linear-gradient(90deg,rgba(245,243,238,.98),rgba(245,243,238,.2)),url('assets/images/hero-wallify.svg') center/cover;min-height:520px;display:flex;align-items:center;margin-bottom:65px}
.hero-copy{padding:70px 0;max-width:620px}
.hero-kicker{font-size:12px;letter-spacing:2.5px;font-weight:700;color:var(--gold);margin-bottom:12px}
.hero h1{font-size:52px;line-height:1.05;margin:0 0 18px}
.hero p{font-size:17px;color:#666;max-width:560px}
.btn{display:inline-block;background:#171717;color:#fff;padding:13px 23px;font-weight:700;font-size:13px;margin-top:15px}
.btn:hover{background:var(--gold);color:#fff}

.section{padding:0 0 70px}
.section-title{text-align:center;margin:0 0 30px;font-size:29px;font-weight:700}
.section-sub{text-align:center;color:#777;margin:-18px auto 30px;max-width:650px}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.product-card{min-width:0;position:relative}
.product-image{background:#f6f6f6;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.product-card:hover .product-image img{transform:scale(1.025)}
.badge{position:absolute;left:10px;top:10px;background:var(--sale);color:#fff;padding:5px 9px;font-size:11px;font-weight:700;z-index:2}
.product-name{font-size:14px;font-weight:600;margin:13px 0 7px;line-height:1.35}
.price{font-size:14px;font-weight:700}
.price del{color:#999;font-weight:400;margin-right:5px}
.price ins{text-decoration:none}
.product-card .stars{font-size:11px;color:#aaa;margin-top:6px}

.collection-row{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:70px}
.collection{background:#eee;min-height:190px;padding:22px;display:flex;align-items:end;position:relative;overflow:hidden}
.collection:before{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(0,0,0,.45))}
.collection h3{position:relative;color:#fff;margin:0;font-size:18px;z-index:1}

.deal{background:#171717;color:#fff;padding:48px 30px;margin-bottom:70px;text-align:center}
.deal small{color:#d5b76f;letter-spacing:2px}
.deal h2{font-size:34px;margin:8px 0}
.deal p{color:#bbb}

.newsletter{background:#f7f7f7;padding:55px 20px;text-align:center;margin-top:15px}
.newsletter h2{margin:0 0 7px;font-size:27px}
.newsletter p{color:#777}
.newsletter form{max-width:520px;margin:20px auto 0;display:flex}
.newsletter input{flex:1;padding:14px;border:1px solid #ddd}
.newsletter button{padding:0 25px;border:0;background:#171717;color:#fff;font-weight:700}

.footer{background:#111;color:#fff;margin-top:0;padding:55px 0 20px}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
.footer h4{font-size:13px;text-transform:uppercase;letter-spacing:1px}
.footer p,.footer a{font-size:13px;color:#aaa;line-height:1.9}
.footer a:hover{color:#fff}
.footer-bottom{border-top:1px solid #2b2b2b;margin-top:40px;padding-top:18px;color:#777;font-size:12px;display:flex;justify-content:space-between}

.page-head{background:#f7f7f7;text-align:center;padding:45px 15px;margin-bottom:40px}
.page-head h1{margin:0;font-size:36px}
.content{padding:50px 0}
.woocommerce .woocommerce-breadcrumb{color:#777}
.woocommerce .button,.woocommerce a.button,.woocommerce button.button{background:#171717;color:#fff;border-radius:0}
.woocommerce .button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{background:var(--gold);color:#fff}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:#171717;font-weight:700}
.woocommerce span.onsale{background:var(--sale);border-radius:0}
.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(4,1fr);gap:24px;list-style:none;padding:0;margin:0}
.woocommerce ul.products:before,.woocommerce ul.products:after{display:none!important}
.woocommerce ul.products li.product{width:auto!important;margin:0!important;float:none!important;position:relative}
.woocommerce ul.products li.product a img{margin:0!important;width:100%!important}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:14px;padding:0;margin-top:13px}
.woocommerce ul.products li.product .price{font-size:14px}
.woocommerce ul.products li.product .button{font-size:12px}
.woocommerce .quantity .qty{padding:10px}
input,textarea,select{border:1px solid #ddd;padding:11px}

@media(max-width:1050px){
 .nav{gap:14px}.product-grid,.woocommerce ul.products{grid-template-columns:repeat(3,1fr)!important}.collection-row{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:780px){
 .header-main{height:65px}.nav{display:none}.header-tools .tool:nth-child(1){display:none}.mobile-toggle{display:grid}.hero{min-height:390px;margin-bottom:45px}.hero-copy{padding:45px 0}.hero h1{font-size:40px}.product-grid,.woocommerce ul.products{grid-template-columns:repeat(2,1fr)!important;gap:14px}.section{padding-bottom:50px}.collection-row{grid-template-columns:1fr 1fr}.newsletter form{display:block}.newsletter input,.newsletter button{width:100%;height:46px}.newsletter button{margin-top:7px}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}
}

.nav ul ul{display:none;position:absolute;top:28px;left:0;background:#fff;border:1px solid var(--line);min-width:210px;padding:8px 0;box-shadow:0 12px 30px rgba(0,0,0,.08);z-index:120}.nav li.menu-item-has-children{position:relative}.nav li.menu-item-has-children:hover>ul{display:block}.nav li.menu-item-has-children>ul li a{display:block;padding:10px 16px;font-weight:500}