
/* Gigantic Catalogue premium UI refinement layer
   Preserves existing functionality and JavaScript hooks.
*/
:root{
 --g-ink:#102033;
 --g-muted:#5c6675;
 --g-brand:#f0447b;
 --g-brand-dark:#c72f60;
 --g-accent:#ffcc4d;
 --g-surface:#ffffff;
 --g-soft:#f8f6f2;
 --g-line:#e7e1d9;
 --g-radius:18px;
 --g-shadow:0 24px 70px rgba(16,32,51,.10);
}
body{
 font-family:"Inter","Segoe UI",system-ui,sans-serif!important;
 color:var(--g-ink)!important;
 background:#fff!important;
}
.shell{width:min(1240px,calc(100% - 48px))!important}
.site-header{
 background:rgba(255,255,255,.92)!important;
 border-bottom:1px solid var(--g-line)!important;
 box-shadow:0 8px 30px rgba(16,32,51,.04);
}
.brand-mark,.brand-logo{
 border-radius:12px!important;
 box-shadow:none!important;
}
.main-nav a,.nav-links a{
 font-weight:650!important;
}
.hero{
 background:#fff!important;
 position:relative;
}
.hero:before{
 content:"";
 position:absolute;
 width:420px;height:420px;
 right:-180px;top:40px;
 border:1px solid rgba(240,68,123,.12);
 border-radius:50%;
}
.hero h1{
 font-weight:850!important;
 letter-spacing:-.04em!important;
}
.hero h1 span{color:var(--g-brand)!important}
.btn,.add-button{
 border-radius:12px!important;
 transition:transform .2s ease,box-shadow .2s ease!important;
}
.btn-primary,.add-button{
 background:var(--g-brand)!important;
 box-shadow:0 12px 28px rgba(240,68,123,.22)!important;
}
.btn-primary:hover,.add-button:hover{
 background:var(--g-brand-dark)!important;
 transform:translateY(-2px);
}
.hero-card,.hero-main-card{
 border-radius:22px!important;
 box-shadow:var(--g-shadow)!important;
 transform:none!important;
}
section{
 scroll-margin-top:90px;
}
.product-card{
 background:#fff!important;
 border:1px solid var(--g-line)!important;
 border-radius:18px!important;
 box-shadow:none!important;
 overflow:hidden;
 transition:.25s ease;
}
.product-card:hover{
 transform:translateY(-5px);
 box-shadow:var(--g-shadow)!important;
}
.product-image-wrap{
 border-radius:0!important;
}
.product-image-wrap img{
 aspect-ratio:4/3;
 object-fit:cover;
}
.status-badge{
 background:#102033!important;
 border-radius:999px!important;
}
.product-body h3{
 letter-spacing:-.02em;
}
.price{
 color:var(--g-brand-dark)!important;
}
.cart-drawer,.modal{
 border-radius:22px!important;
 box-shadow:0 30px 90px rgba(0,0,0,.18)!important;
}
footer{
 border-top:1px solid var(--g-line)!important;
}
@media(max-width:760px){
 .shell{width:calc(100% - 32px)!important}
 .hero h1{font-size:42px!important}
 .hero-card,.hero-main-card{border-radius:18px!important}
}


/* Catalogue marketplace upgrade */
body{
 font-family:"Manrope", "Inter", system-ui, sans-serif!important;
}
.product-card{cursor:pointer!important}
.product-image-wrap{position:relative!important;overflow:hidden!important}
.product-image-wrap:after{
 content:"";
 position:absolute;
 inset:0;
 background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.18));
 opacity:0;
 transition:.3s;
}
.product-card:hover .product-image-wrap:after{opacity:1}
.view-product{
 position:absolute;
 right:14px;
 bottom:14px;
 z-index:2;
 background:white;
 color:#102033;
 padding:8px 12px;
 border-radius:999px;
 font-size:12px;
 font-weight:800;
 opacity:0;
 transform:translateY(8px);
 transition:.25s;
}
.product-card:hover .view-product{opacity:1;transform:translateY(0)}

.product-details-modal{display:grid;place-items:center;padding:24px}
.details-box{
 width:min(920px,100%);
 background:#fff;
 border-radius:28px;
 overflow:hidden;
 display:grid;
 grid-template-columns:1.05fr .95fr;
 box-shadow:0 40px 100px rgba(0,0,0,.25);
 position:relative;
}
.details-image{min-height:520px;background:#f4f6f9}
.details-image img{width:100%;height:100%;object-fit:cover}
.details-content{padding:48px 42px;display:flex;flex-direction:column;justify-content:center}
.details-content h2{font-family:"Playfair Display",serif;font-size:42px;line-height:1.1;margin:10px 0}
.details-label{color:#f0447b;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.details-price{font-size:30px;font-weight:900;color:#c72f60;margin-bottom:18px}
.details-content p{color:#5c6675;line-height:1.8;font-size:16px}
.details-benefits{display:flex;flex-direction:column;gap:10px;margin:18px 0 28px;color:#344054;font-weight:700;font-size:14px}
.details-close{position:absolute;right:20px;top:20px;z-index:5;width:42px;height:42px;border:0;border-radius:50%;background:#fff;font-size:25px;cursor:pointer;box-shadow:0 5px 20px rgba(0,0,0,.12)}
@media(max-width:800px){
 .details-box{grid-template-columns:1fr}
 .details-image{min-height:320px}
 .details-content{padding:30px 24px}
 .details-content h2{font-size:32px}
}
