/* ═══════════════════════════════════════════════════════════════ ALMAAR — Premium Streetwear Theme (Black + Gold) Restored from "almaar production" design, adapted to the PHP app. Fonts are loaded via in the page (parallel, non-blocking) instead of @import here, to avoid flash-of-unstyled-content. ═══════════════════════════════════════════════════════════════ */ :root { --bg:#070707; --surface:#0c0c0c; --card:#111111; --elevated:#181818; --text:#f5f5f0; --text-2:#9a9a95; --text-3:#555550; --gold:#c8a97e; --gold-l:#ddc4a0; --gold-d:#a08560; --beige:#e8d5b7; --grad:linear-gradient(135deg,var(--gold-l),var(--gold),var(--gold-d)); --grad-text:linear-gradient(135deg,var(--beige),var(--gold)); --glow:rgba(200,169,126,0.08); --border:#1a1a1a; --border-h:#252525; --serif:'Cormorant Garamond',serif; --sans:'DM Sans',sans-serif; --ease:cubic-bezier(0.25,1,0.5,1); --r:14px; --r-sm:8px; --ok:#4caf50; --err:#e74c3c; --warn:#e0a458; --primary:var(--gold); --primary-dark:var(--gold-d); } *,*::before,*::after{margin:0;padding:0;box-sizing:border-box} html{scroll-behavior:smooth} body{font-family:var(--sans);background:var(--bg);color:var(--text);overflow-x:hidden;-webkit-font-smoothing:antialiased;font-weight:400;line-height:1.6} ::selection{background:var(--gold);color:#000} a{color:inherit;text-decoration:none} img{max-width:100%;display:block} h1,h2,h3,h4,h5{font-weight:600;line-height:1.2} .container{max-width:1200px;margin:0 auto;padding:0 2rem} #three-bg{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none} .topbar,.header,.catnav,.main,.footer,.mobile-nav,.mobile-nav-overlay{position:relative;z-index:2} /* LOADER */ .loader{position:fixed;inset:0;z-index:10000;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1.5rem;animation:loaderAuto .6s ease 2s forwards} @keyframes loaderAuto{to{opacity:0;visibility:hidden;pointer-events:none}} .loader .lo{font-family:var(--serif);font-size:2rem;background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.1em;opacity:0;animation:fi .5s ease .15s forwards} .loader .bar{width:36px;height:2px;border-radius:2px;background:var(--border);overflow:hidden;opacity:0;animation:fi .3s ease .35s forwards} .loader .bar::after{content:'';display:block;width:100%;height:100%;background:var(--grad);border-radius:2px;animation:sl .9s ease-in-out infinite} .loader.hide{animation:fo .5s ease forwards} @keyframes fi{to{opacity:1}} @keyframes sl{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}} @keyframes fo{to{opacity:0;visibility:hidden;pointer-events:none}} /* TOP BAR */ .topbar{background:var(--surface);border-bottom:1px solid var(--border);font-size:.72rem;color:var(--text-3);letter-spacing:.02em} .topbar__inner{display:flex;align-items:center;justify-content:space-between;height:38px} .topbar__links{display:flex;gap:1.4rem} .topbar__links a{color:var(--text-3);transition:color .25s} .topbar__links a:hover{color:var(--gold-l)} /* HEADER / NAV */ .header{background:rgba(7,7,7,0.72);backdrop-filter:blur(20px) saturate(1.15);border-bottom:1px solid rgba(255,255,255,0.04);position:sticky;top:0;z-index:1000;transition:background .4s} .header.scrolled{background:rgba(7,7,7,0.94)} .header__inner{display:flex;align-items:center;gap:1.5rem;height:64px} .header__logo{display:flex;align-items:center} .logo-text{font-family:var(--serif);font-size:1.45rem;letter-spacing:.08em;background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text} .header__hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none} .header__hamburger span{width:22px;height:1.5px;background:var(--text);transition:.3s;display:block} .header__search{flex:1;max-width:440px;position:relative} .header__search input{width:100%;padding:.6rem 2.6rem .6rem 1rem;background:var(--card);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-family:var(--sans);font-size:.82rem;outline:none;transition:border-color .3s,box-shadow .3s} .header__search input::placeholder{color:var(--text-3)} .header__search input:focus{border-color:var(--gold-d);box-shadow:0 0 0 3px var(--glow)} .header__search button{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-3);cursor:pointer;display:flex;padding:6px;transition:color .25s} .header__search button:hover{color:var(--gold-l)} .header__actions{display:flex;align-items:center;gap:1.3rem;margin-left:auto} .header__link{display:flex;align-items:center;gap:.4rem;color:var(--text-3);font-size:.78rem;font-weight:500;transition:color .25s;position:relative} .header__link:hover{color:var(--text)} .header__link svg{width:21px;height:21px} .header__cart{position:relative} .header__badge{position:absolute;top:-7px;right:-10px;min-width:16px;height:16px;padding:0 4px;background:var(--grad);color:#000;border-radius:9px;font-size:.6rem;font-weight:700;display:flex;align-items:center;justify-content:center} /* CATEGORY NAV */ .catnav{background:rgba(7,7,7,0.6);border-bottom:1px solid var(--border);backdrop-filter:blur(10px)} .catnav__list{display:flex;gap:2rem;list-style:none;height:46px;align-items:center;overflow-x:auto} .catnav__link{font-size:.76rem;font-weight:500;color:var(--text-3);white-space:nowrap;transition:color .25s;letter-spacing:.02em} .catnav__link:hover,.catnav__link.on{color:var(--gold-l)} /* MOBILE NAV */ .mobile-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:1998;opacity:0;visibility:hidden;transition:.3s} body.nav-open .mobile-nav-overlay{opacity:1;visibility:visible} .mobile-nav{position:fixed;top:0;left:0;width:300px;max-width:85vw;height:100vh;background:var(--surface);border-right:1px solid var(--border);z-index:1999;transform:translateX(-100%);transition:transform .45s var(--ease);overflow-y:auto;padding-bottom:2rem} body.nav-open .mobile-nav{transform:translateX(0)} .mobile-nav__header{display:flex;align-items:center;justify-content:space-between;padding:1.2rem 1.4rem;border-bottom:1px solid var(--border)} .mobile-nav__close{background:none;border:none;color:var(--text-2);font-size:1.6rem;cursor:pointer;line-height:1} .mobile-nav__search{padding:1.2rem 1.4rem} .mobile-nav__search form{position:relative} .mobile-nav__search input{width:100%;padding:.7rem 2.4rem .7rem .9rem;background:var(--card);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-size:.82rem;outline:none} .mobile-nav__search button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-3);cursor:pointer;display:flex} .mobile-nav__section{padding:.6rem 1.4rem 1rem;border-bottom:1px solid var(--border)} .mobile-nav__label{font-size:.66rem;font-weight:600;color:var(--gold);letter-spacing:.06em;text-transform:uppercase;margin:.8rem 0 .5rem} .mobile-nav__link{display:flex;align-items:center;gap:.6rem;padding:.6rem 0;color:var(--text-2);font-size:.86rem;transition:color .2s} .mobile-nav__link:hover{color:var(--gold-l)} .mobile-nav__link svg{width:18px;height:18px;opacity:.7} /* BUTTONS */ .btn,.btn-g,.btn-o{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 2rem;border-radius:var(--r-sm);font-family:var(--sans);font-size:.78rem;font-weight:600;cursor:pointer;transition:all .3s var(--ease);border:none;letter-spacing:.01em;text-align:center} .btn-g,.btn--primary{background:var(--grad);color:#000;box-shadow:0 2px 12px var(--glow)} .btn-g:hover,.btn--primary:hover{box-shadow:0 6px 24px rgba(200,169,126,0.18);transform:translateY(-1px);color:#000} .btn-o,.btn--outline,.btn--secondary{background:transparent;color:var(--text-2);border:1px solid var(--border-h)} .btn-o:hover,.btn--outline:hover,.btn--secondary:hover{border-color:var(--gold-d);color:var(--gold-l)} .btn--lg{padding:1rem 2.4rem;font-size:.84rem} .btn--sm{padding:.6rem 1.2rem;font-size:.72rem} .btn--full,.btn--block{width:100%} .btn--danger{background:var(--err);color:#fff} .btn--danger:hover{filter:brightness(1.08)} .btn .ar{transition:transform .2s;font-style:normal} .btn:hover .ar{transform:translateX(3px)} .btn:disabled{opacity:.6;cursor:not-allowed} /* SECTIONS */ .main{min-height:60vh} .section{padding:5rem 0;position:relative;z-index:2} .section--alt{background:rgba(12,12,12,0.5)} .section__title{font-family:var(--serif);font-size:clamp(1.8rem,4vw,2.6rem);font-weight:400;line-height:1.1;margin-bottom:2rem} .section__title em{font-style:italic;color:var(--gold-l)} .section__header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:2.5rem} .section__header .section__title{margin-bottom:0} .section__link{color:var(--gold);font-size:.8rem;font-weight:500;transition:color .25s;white-space:nowrap} .section__link:hover{color:var(--gold-l)} /* ═══ HERO ═══ */ .hero{position:relative;z-index:2;min-height:78vh;display:flex;align-items:center;padding:4rem 0;text-align:center} .hero__inner{display:flex;justify-content:center} .hero__content{max-width:660px;margin:0 auto} .hero__badge{display:inline-block;font-size:.72rem;font-weight:500;color:var(--gold);letter-spacing:.06em;margin-bottom:1.4rem;opacity:0;animation:fadeUp .6s var(--ease) .3s forwards} .hero__title{font-family:var(--serif);font-size:clamp(2.2rem,5.5vw,4rem);font-weight:400;line-height:1.08;margin-bottom:1.3rem;opacity:0;animation:fadeUp .9s var(--ease) .45s forwards} .hero__title em{font-style:italic;color:var(--gold-l)} .hero__subtitle{color:var(--text-2);max-width:460px;margin:0 auto 2.4rem;font-size:.9rem;line-height:1.75;opacity:0;animation:fadeUp .7s var(--ease) .6s forwards} .hero__actions{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap;opacity:0;animation:fadeUp .7s var(--ease) .75s forwards} /* ═══ CATEGORY GRID ═══ */ .category-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1.2rem} .category-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.8rem 1rem;text-align:center;transition:all .4s var(--ease)} .category-card:hover{border-color:var(--border-h);transform:translateY(-3px);box-shadow:0 16px 32px rgba(0,0,0,0.3)} .category-card__icon{width:54px;height:54px;margin:0 auto .9rem;border-radius:50%;background:rgba(200,169,126,0.08);border:1px solid rgba(200,169,126,0.18);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.5rem;color:var(--gold-l)} .category-card h3{font-size:.82rem;font-weight:500;color:var(--text-2)} /* ═══ PRODUCT GRID + CARDS ═══ */ .product-grid,.p-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem} .product-card,.p-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:all .5s var(--ease);display:flex;flex-direction:column} .product-card:hover,.p-card:hover{border-color:var(--border-h);transform:translateY(-3px);box-shadow:0 20px 40px rgba(0,0,0,0.3),0 0 0 1px rgba(200,169,126,0.04)} .product-card__image{display:block;aspect-ratio:3/4;position:relative;overflow:hidden;background:var(--surface)} .product-card__image img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)} .product-card:hover .product-card__image img{transform:scale(1.05)} .product-card__badge{position:absolute;top:1rem;left:1rem;padding:.3rem .7rem;border-radius:6px;background:rgba(200,169,126,0.14);backdrop-filter:blur(10px);border:1px solid rgba(200,169,126,0.18);color:var(--gold-l);font-size:.64rem;font-weight:600;z-index:2} .product-card__body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1} .product-card__category{font-size:.64rem;font-weight:600;color:var(--gold);margin-bottom:.45rem;letter-spacing:.05em;text-transform:uppercase} .product-card__title{font-family:var(--serif);font-size:1.25rem;font-weight:400;margin-bottom:.6rem;line-height:1.2} .product-card__title a:hover{color:var(--gold-l)} .product-card__price{display:flex;align-items:baseline;gap:.5rem;margin-bottom:1rem;margin-top:auto} .product-card__current{font-size:1rem;font-weight:600;color:var(--text)} .product-card__old{font-size:.78rem;color:var(--text-3);text-decoration:line-through} .product-card__form{margin-top:.2rem} /* ═══ TRUST BANNER ═══ */ .trust-banner{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:rgba(12,12,12,0.5);position:relative;z-index:2} .trust-banner__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px} .trust-item{padding:2.5rem 1.5rem;text-align:center} .trust-item svg{color:var(--gold);margin-bottom:.8rem} .trust-item h4{font-size:.86rem;font-weight:600;margin-bottom:.3rem} .trust-item p{font-size:.74rem;color:var(--text-3)} /* ═══ NEWSLETTER ═══ */ .nl{padding:5rem 2rem;text-align:center;position:relative;z-index:2} .nl h3{font-family:var(--serif);font-size:1.8rem;font-weight:400;margin-bottom:.5rem} .nl h3 em{font-style:italic;color:var(--gold-l)} .nl p{color:var(--text-3);font-size:.85rem;margin-bottom:2rem} .nl-form{display:flex;max-width:400px;margin:0 auto;border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden;transition:border-color .3s,box-shadow .3s} .nl-form:focus-within{border-color:var(--gold-d);box-shadow:0 0 0 3px var(--glow)} .nl-form input{flex:1;padding:.82rem 1rem;border:none;background:transparent;color:var(--text);font-family:var(--sans);font-size:.82rem;outline:none} .nl-form input::placeholder{color:var(--text-3)} .nl-form button{padding:.82rem 1.5rem;background:var(--grad);border:none;color:#000;font-family:var(--sans);font-size:.72rem;font-weight:600;cursor:pointer;transition:opacity .3s;letter-spacing:.02em} .nl-form button:hover{opacity:.88} /* ═══ FOOTER ═══ */ .footer{border-top:1px solid var(--border);padding:4rem 0 1.8rem;position:relative;z-index:2;background:var(--surface)} .footer__grid{display:grid;grid-template-columns:2.2fr 1fr 1fr 1.3fr;gap:2.5rem;margin-bottom:3rem} .footer__brand,.f-logo{font-family:var(--serif);font-size:1.4rem;background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.8rem} .footer__col p{color:var(--text-3);font-size:.8rem;line-height:1.75;max-width:280px} .footer__col h4{font-size:.72rem;font-weight:600;color:var(--text-2);margin-bottom:1rem;letter-spacing:.03em} .footer__col ul{list-style:none} .footer__col li{margin-bottom:.5rem} .footer__col a{color:var(--text-3);font-size:.8rem;transition:color .25s} .footer__col a:hover{color:var(--gold-l)} .footer__bottom{border-top:1px solid var(--border);padding-top:1.6rem} .footer__bottom p{font-size:.72rem;color:var(--text-3);text-align:center} /* ═══ FORMS ═══ */ .form-group,.fg{margin-bottom:1.3rem} .form-group label,.fg label,.form-label{display:block;font-size:.74rem;font-weight:500;color:var(--text-2);margin-bottom:.45rem} .form-control,.form-group input,.form-group textarea,.form-group select,.fg input,.fg textarea,.fg select,input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],input[type=search],textarea,select{width:100%;padding:.82rem 1rem;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--card);color:var(--text);font-family:var(--sans);font-size:.84rem;transition:border-color .3s,box-shadow .3s;outline:none} .form-control:focus,.form-group input:focus,.form-group textarea:focus,.form-group select:focus,.fg input:focus,.fg textarea:focus,input:focus,textarea:focus,select:focus{border-color:var(--gold-d);box-shadow:0 0 0 3px var(--glow)} textarea{resize:vertical;min-height:120px} select option{background:var(--bg)} .form-row,.fr{display:grid;grid-template-columns:1fr 1fr;gap:1rem} /* ═══ CARDS / PANELS ═══ */ .card,.panel,.box{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.6rem} .auth-card,.form-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:2.5rem;max-width:440px;margin:3rem auto} .auth-card h1,.auth-card h2,.form-card h1{font-family:var(--serif);font-weight:400;font-size:1.8rem;margin-bottom:.4rem;text-align:center} .auth-card .muted,.auth-sub{color:var(--text-3);font-size:.82rem;text-align:center;margin-bottom:1.8rem} /* ═══ FLASH / ALERTS ═══ */ .flash,.alert{padding:.9rem 1.2rem;border-radius:var(--r-sm);font-size:.82rem;margin:1rem 0;border:1px solid var(--border-h);background:var(--elevated)} .flash--success,.alert--success,.alert-success{border-color:rgba(76,175,80,0.4);background:rgba(76,175,80,0.08);color:#9fd6a2} .flash--error,.alert--error,.alert-danger,.alert--danger{border-color:rgba(231,76,60,0.4);background:rgba(231,76,60,0.08);color:#f0a89f} .flash--warning,.alert--warning,.alert-warning{border-color:rgba(224,164,88,0.4);background:rgba(224,164,88,0.08);color:#e6c79a} .flash--info,.alert--info,.alert-info{border-color:rgba(200,169,126,0.35);background:var(--glow);color:var(--gold-l)} /* ═══ TABLES ═══ */ table,.table{width:100%;border-collapse:collapse;font-size:.82rem} .table th,table th{text-align:left;padding:.85rem 1rem;color:var(--text-2);font-weight:600;font-size:.72rem;letter-spacing:.03em;text-transform:uppercase;border-bottom:1px solid var(--border-h)} .table td,table td{padding:.85rem 1rem;border-bottom:1px solid var(--border);color:var(--text-2)} .table tr:hover td{background:rgba(255,255,255,0.015)} /* ═══ BADGES / STATUS PILLS ═══ */ .badge,.status,.pill{display:inline-block;padding:.25rem .7rem;border-radius:20px;font-size:.66rem;font-weight:600;letter-spacing:.02em} .badge--gold,.status--paid,.status--delivered,.status--approved,.status--active{background:rgba(200,169,126,0.14);color:var(--gold-l);border:1px solid rgba(200,169,126,0.2)} .status--pending,.status--awaiting_payment,.status--processing{background:rgba(224,164,88,0.12);color:#e6c79a;border:1px solid rgba(224,164,88,0.25)} .status--cancelled,.status--rejected,.status--failed,.status--banned{background:rgba(231,76,60,0.12);color:#f0a89f;border:1px solid rgba(231,76,60,0.25)} .status--shipped,.status--confirmed{background:rgba(120,160,210,0.12);color:#a9c4e6;border:1px solid rgba(120,160,210,0.25)} /* ═══ PAGINATION ═══ */ .pagination{display:flex;gap:.4rem;justify-content:center;margin-top:2.5rem;list-style:none} .pagination a,.pagination span{display:flex;align-items:center;justify-content:center;min-width:38px;height:38px;padding:0 .6rem;border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text-2);font-size:.8rem;transition:all .25s} .pagination a:hover{border-color:var(--gold-d);color:var(--gold-l)} .pagination .active,.pagination .current{background:var(--grad);color:#000;border-color:transparent;font-weight:600} /* ═══ BREADCRUMB ═══ */ .breadcrumb{display:flex;gap:.5rem;font-size:.74rem;color:var(--text-3);padding:1.2rem 0;flex-wrap:wrap} .breadcrumb a{color:var(--text-3);transition:color .25s} .breadcrumb a:hover{color:var(--gold-l)} .breadcrumb .sep{color:var(--text-3)} /* ═══ TOAST ═══ */ .toast-container{position:fixed;bottom:1.5rem;right:1.5rem;z-index:9999;display:flex;flex-direction:column;gap:.6rem} .toast{background:var(--elevated);border:1px solid var(--border-h);border-radius:var(--r-sm);padding:.8rem 1.4rem;font-size:.8rem;color:var(--text);box-shadow:0 8px 24px rgba(0,0,0,0.3);transform:translateY(20px);opacity:0;transition:all .4s var(--ease)} .toast.show{transform:translateY(0);opacity:1} .toast--success{border-color:rgba(76,175,80,0.4)} .toast--error{border-color:rgba(231,76,60,0.4)} /* ═══ CART / CHECKOUT ═══ */ .cart-summary,.order-summary{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.6rem} .cart-summary__row,.summary-row{display:flex;justify-content:space-between;padding:.55rem 0;font-size:.85rem;color:var(--text-2)} .cart-summary__total,.summary-total{display:flex;justify-content:space-between;padding-top:1rem;margin-top:.5rem;border-top:1px solid var(--border-h);font-size:1rem;font-weight:600;color:var(--text)} .cart-summary hr{border:none;border-top:1px solid var(--border);margin:.8rem 0} .cart-item{display:flex;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--border)} .cart-item__image,.cart-item img{width:80px;height:96px;object-fit:cover;border-radius:var(--r-sm);background:var(--elevated)} .checkout-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:2rem;align-items:start} /* ═══ REVEAL ANIMATIONS ═══ */ @keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}} .rv{opacity:0;transform:translateY(18px);transition:all .7s var(--ease)} .rv.vis{opacity:1;transform:translateY(0)} .d1{transition-delay:.06s}.d2{transition-delay:.12s}.d3{transition-delay:.18s} /* ═══ WHATSAPP FLOAT ═══ */ .wa-float{position:fixed;bottom:1.5rem;left:1.5rem;width:52px;height:52px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;z-index:900;box-shadow:0 6px 20px rgba(37,211,102,0.35);transition:transform .25s} .wa-float:hover{transform:scale(1.08)} /* ═══ UTILITIES ═══ */ .text-gold{color:var(--gold-l)} .text-center{text-align:center} .muted{color:var(--text-3)} .divider{height:1px;background:linear-gradient(90deg,transparent,var(--border-h),transparent);margin:0 auto;max-width:1200px} .page-head{padding:2.5rem 0 1rem} .page-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(1.8rem,4vw,2.6rem)} .empty-state{text-align:center;padding:5rem 1rem;color:var(--text-3)} .empty-state svg{margin-bottom:1rem;opacity:.5} /* ═══ RESPONSIVE ═══ */ @media(max-width:1100px){ .product-grid,.p-grid{grid-template-columns:repeat(3,1fr)} .category-grid{grid-template-columns:repeat(3,1fr)} } @media(max-width:900px){ #three-bg{opacity:.6} .header__search{display:none} .header__hamburger{display:flex} .header__actions{gap:1rem} .header__link span{display:none} .catnav{display:none} .product-grid,.p-grid{grid-template-columns:repeat(2,1fr);gap:1.2rem} .trust-banner__grid{grid-template-columns:1fr 1fr} .footer__grid{grid-template-columns:1fr 1fr;gap:2rem} .checkout-layout{grid-template-columns:1fr} .form-row,.fr{grid-template-columns:1fr} .section{padding:3.5rem 0} .hero{min-height:70vh} .container{padding:0 1.3rem} } @media(max-width:600px){ #three-bg{opacity:.45} .product-grid,.p-grid{grid-template-columns:1fr 1fr;gap:.9rem} .category-grid{grid-template-columns:1fr 1fr} .trust-banner__grid{grid-template-columns:1fr} .footer__grid{grid-template-columns:1fr;gap:1.6rem} .section__header{flex-direction:column;align-items:flex-start;gap:.8rem} .topbar__links{display:none} .nl-form{flex-direction:column;border:none;gap:.6rem} .nl-form input{border:1px solid var(--border);border-radius:var(--r-sm)} .nl-form button{border-radius:var(--r-sm)} .product-card__title{font-size:1.05rem} .btn,.btn-g,.btn-o{min-height:44px} input,textarea,select{font-size:16px} } /* ═══ SHOP LAYOUT + SIDEBAR ═══ */ .shop-layout{display:grid;grid-template-columns:240px 1fr;gap:2.5rem;align-items:start} .shop-header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:1.8rem;flex-wrap:wrap;gap:.5rem} .shop-header h1{font-family:var(--serif);font-weight:400;font-size:1.8rem} .shop-header__count{font-size:.78rem;color:var(--text-3)} .sidebar{position:sticky;top:90px} .sidebar__section{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.3rem;margin-bottom:1.2rem} .sidebar__title{font-size:.74rem;font-weight:600;color:var(--text-2);letter-spacing:.04em;text-transform:uppercase;margin-bottom:1rem} .sidebar__list{list-style:none} .sidebar__list li{margin-bottom:.3rem} .sidebar__list a{display:flex;justify-content:space-between;padding:.5rem .7rem;border-radius:var(--r-sm);font-size:.82rem;color:var(--text-2);transition:all .2s} .sidebar__list a:hover{background:var(--elevated);color:var(--gold-l)} .sidebar__list a.active{background:rgba(200,169,126,0.1);color:var(--gold-l);border:1px solid rgba(200,169,126,0.2)} .sidebar__count{color:var(--text-3);font-size:.72rem} /* ═══ PRODUCT DETAIL ═══ */ .product-detail{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start;padding:2rem 0} .product-gallery{position:sticky;top:90px} .product-gallery__main{aspect-ratio:3/4;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);overflow:hidden} .product-gallery__main img{width:100%;height:100%;object-fit:cover} .product-gallery__thumbs{display:flex;gap:.7rem;margin-top:.9rem;flex-wrap:wrap} .product-gallery__thumbs img{width:70px;height:84px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--border);cursor:pointer;transition:border-color .2s} .product-gallery__thumbs img:hover,.product-gallery__thumbs img.active{border-color:var(--gold)} .product-info__category{font-size:.7rem;font-weight:600;color:var(--gold);letter-spacing:.05em;text-transform:uppercase;margin-bottom:.6rem} .product-info__title{font-family:var(--serif);font-weight:400;font-size:2.2rem;line-height:1.1;margin-bottom:1rem} .product-info__price{display:flex;align-items:baseline;gap:.8rem;margin-bottom:1.5rem} .product-info__current{font-size:1.6rem;font-weight:600;color:var(--gold-l)} .product-info__old{font-size:1rem;color:var(--text-3);text-decoration:line-through} .product-info__desc{color:var(--text-2);font-size:.9rem;line-height:1.8;margin-bottom:1.8rem} .product-info__meta{font-size:.8rem;color:var(--text-3);margin-bottom:1.5rem} .product-info__actions{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap} .qty-control{display:flex;align-items:center;border:1px solid var(--border-h);border-radius:var(--r-sm);overflow:hidden} .qty-control button{width:40px;height:44px;background:var(--elevated);border:none;color:var(--text);font-size:1.1rem;cursor:pointer;transition:background .2s} .qty-control button:hover{background:var(--card)} .qty-control input{width:50px;height:44px;text-align:center;background:var(--card);border:none;color:var(--text);font-size:.9rem;padding:0} /* ═══ REVIEWS ═══ */ .review{border-bottom:1px solid var(--border);padding:1.3rem 0} .review__head{display:flex;justify-content:space-between;margin-bottom:.5rem} .review__author{font-weight:600;font-size:.85rem} .review__stars{color:var(--gold);font-size:.85rem} .review__date{font-size:.72rem;color:var(--text-3)} .review__body{font-size:.85rem;color:var(--text-2);line-height:1.7} .stars{color:var(--gold);letter-spacing:2px} /* ═══ ADMIN LAYOUT ═══ */ .admin-layout{display:grid;grid-template-columns:230px 1fr;min-height:100vh} .admin-sidebar{background:var(--surface);border-right:1px solid var(--border);padding:1.5rem 0} .admin-sidebar__brand{font-family:var(--serif);font-size:1.3rem;padding:0 1.5rem 1.3rem;background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text} .admin-sidebar a{display:flex;align-items:center;gap:.6rem;padding:.7rem 1.5rem;color:var(--text-2);font-size:.84rem;transition:all .2s} .admin-sidebar a:hover,.admin-sidebar a.active{background:rgba(200,169,126,0.08);color:var(--gold-l);border-right:2px solid var(--gold)} .admin-main{padding:2rem;overflow-x:auto} .admin-topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding-bottom:1.2rem;border-bottom:1px solid var(--border)} .admin-topbar h1{font-family:var(--serif);font-weight:400;font-size:1.6rem} .stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;margin-bottom:2rem} .stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.4rem} .stat-card__label{font-size:.72rem;color:var(--text-3);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.5rem} .stat-card__value{font-family:var(--serif);font-size:1.8rem;color:var(--gold-l)} /* ═══ USER DASHBOARD ═══ */ .dashboard-layout{display:grid;grid-template-columns:230px 1fr;gap:2rem;align-items:start;padding:2rem 0} .dash-nav{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1rem;position:sticky;top:90px} .dash-nav a{display:block;padding:.7rem .9rem;border-radius:var(--r-sm);color:var(--text-2);font-size:.84rem;transition:all .2s;margin-bottom:.2rem} .dash-nav a:hover,.dash-nav a.active{background:rgba(200,169,126,0.08);color:var(--gold-l)} @media(max-width:900px){ .shop-layout{grid-template-columns:1fr} .sidebar{position:static} .product-detail{grid-template-columns:1fr;gap:1.5rem} .product-gallery{position:static} .admin-layout,.dashboard-layout{grid-template-columns:1fr} .admin-sidebar{border-right:none;border-bottom:1px solid var(--border);padding:1rem 0 .5rem} .admin-sidebar .admin-nav{display:flex;overflow-x:auto;gap:.25rem;padding:.5rem .75rem;-webkit-overflow-scrolling:touch} .admin-sidebar .admin-nav li{flex:0 0 auto} .admin-sidebar .admin-nav a{white-space:nowrap;padding:.5rem .8rem;border-radius:var(--r-sm)} .admin-sidebar .admin-nav a.active{border-right:none;background:rgba(200,169,126,0.14)} .admin-main{padding:1.25rem} .admin-topbar{flex-wrap:wrap;gap:.6rem} .admin-topbar h1{font-size:1.35rem} .stat-grid{grid-template-columns:1fr 1fr} .dash-nav{position:static} } @media(max-width:600px){.stat-grid{grid-template-columns:1fr}.admin-topbar h1{font-size:1.2rem}} /* ═══ AUTH PAGES ═══ */ .auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1rem;background:var(--bg)} .auth-container{width:100%;max-width:440px} .auth-logo{display:block;text-align:center;font-family:var(--serif);font-size:1.8rem;letter-spacing:.08em;margin-bottom:1.5rem;background:var(--grad-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text} .auth-subtitle{color:var(--text-3);font-size:.84rem;text-align:center;margin-bottom:1.8rem} .auth-card h1{font-family:var(--serif);font-weight:400;font-size:1.7rem;text-align:center;margin-bottom:.3rem} .auth-footer{text-align:center;font-size:.82rem;color:var(--text-3);margin-top:1.5rem} .auth-footer a{color:var(--gold-l)} .auth-card .form-group:last-of-type{margin-bottom:1rem} /* ═══ PRODUCT DETAIL — extra ═══ */ .product-info__discount{background:rgba(76,175,80,0.14);color:#9fd6a2;font-size:.68rem;font-weight:600;padding:.2rem .55rem;border-radius:5px;margin-left:.4rem} .product-info__sku{font-size:.74rem;color:var(--text-3);margin-bottom:1rem} .product-info__stock,.stock{font-size:.78rem;margin-bottom:1.2rem;font-weight:500} .stock--in{color:#9fd6a2} .stock--out{color:#f0a89f} .product-info__form{margin:1.4rem 0} .product-info__wishlist{margin-top:1rem} .quantity-selector{display:inline-flex;align-items:center;border:1px solid var(--border-h);border-radius:var(--r-sm);overflow:hidden;margin-bottom:1rem} .quantity-selector button{width:42px;height:44px;background:var(--elevated);border:none;color:var(--text);font-size:1.1rem;cursor:pointer;transition:background .2s} .quantity-selector button:hover{background:var(--card)} .quantity-selector input{width:54px;height:44px;text-align:center;background:var(--card);border:none;border-left:1px solid var(--border);border-right:1px solid var(--border);color:var(--text);font-size:.9rem} .product-gallery__thumb{width:70px;height:84px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--border);cursor:pointer;transition:border-color .2s} .product-gallery__thumb:hover,.product-gallery__thumb.active{border-color:var(--gold)} .text-muted{color:var(--text-3)} /* ═══ REVIEWS (review-card variant) ═══ */ .reviews-list{margin-top:1.5rem} .review-card{border-bottom:1px solid var(--border);padding:1.3rem 0} .review-card__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem} .review-card__stars{color:var(--gold);letter-spacing:2px;font-size:.9rem} .review-form-wrap{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.6rem;margin-top:1.5rem} .review-form .form-group{margin-bottom:1rem} /* ═══ COMPATIBILITY — remaining page classes ═══ */ .container--narrow{max-width:760px} .page-title{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,4vw,2.4rem);margin-bottom:.4rem} .page-subtitle{color:var(--text-3);font-size:.86rem;margin-bottom:1.5rem} .content-block{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:2rem;margin-bottom:1.5rem} .content-block h2,.content-block h3{font-family:var(--serif);font-weight:500;margin-bottom:.8rem} .content-block p{color:var(--text-2);font-size:.88rem;line-height:1.8;margin-bottom:1rem} .form{margin-top:.5rem} .form-row--between{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1rem} .auth-switch{text-align:center;font-size:.82rem;color:var(--text-3);margin-top:1.4rem} .auth-switch a{color:var(--gold-l)} .error,.text-error{color:#f0a89f;font-size:.8rem} .text-success{color:#9fd6a2} .link-btn{background:none;border:none;color:var(--gold-l);cursor:pointer;font-size:.82rem;font-family:var(--sans);padding:0;text-decoration:underline} .link-btn--danger{color:#f0a89f} .link-sm{font-size:.78rem;color:var(--gold-l)} .status-badge{display:inline-block;padding:.25rem .7rem;border-radius:20px;font-size:.66rem;font-weight:600;background:var(--elevated);border:1px solid var(--border-h);color:var(--text-2)} .table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--r);background:var(--card)} .table-wrap table{margin:0} /* CART */ .cart-layout{display:grid;grid-template-columns:1.6fr 1fr;gap:2rem;align-items:start} .cart-items{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:.5rem 1.5rem} .cart-item__img{width:80px;height:96px;object-fit:cover;border-radius:var(--r-sm);background:var(--elevated);flex-shrink:0} .cart-item__info{flex:1} .cart-item__price,.cart-item__total{font-weight:600;color:var(--gold-l);font-size:.9rem} .cart-item__qty{display:inline-flex;align-items:center;border:1px solid var(--border-h);border-radius:var(--r-sm);overflow:hidden;margin:.4rem 0} .cart-item__qty button{width:32px;height:34px;background:var(--elevated);border:none;color:var(--text);cursor:pointer} .cart-item__qty input{width:42px;height:34px;text-align:center;background:var(--card);border:none;border-left:1px solid var(--border);border-right:1px solid var(--border);color:var(--text)} .cart-item__remove{background:none;border:none;color:var(--text-3);cursor:pointer;font-size:.75rem;transition:color .2s} .cart-item__remove:hover{color:#f0a89f} .cart-summary__item{display:flex;justify-content:space-between;padding:.5rem 0;font-size:.85rem;color:var(--text-2)} .cart-summary__note{font-size:.74rem;color:var(--text-3);margin-top:.5rem} /* CHECKOUT */ .checkout-main{display:flex;flex-direction:column;gap:1.5rem} .checkout-section{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.6rem} .checkout-section h2,.checkout-section h3{font-family:var(--serif);font-weight:500;font-size:1.2rem;margin-bottom:1.2rem} .payment-options,.payment_option{display:flex;flex-direction:column;gap:.7rem} .payment-option{display:flex;align-items:center;gap:.8rem;padding:1rem;border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;transition:all .2s} .payment-option:hover{border-color:var(--gold-d)} .payment-option input{width:auto} .checkbox{display:flex;align-items:center;gap:.5rem;font-size:.84rem;color:var(--text-2);cursor:pointer} .checkbox input{width:auto} /* DASHBOARD */ .dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-bottom:2rem} .dashboard-header{margin-bottom:1.5rem} .dashboard-section{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.6rem;margin-bottom:1.5rem} .dash-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.4rem;text-align:center} .dash-card__value{font-family:var(--serif);font-size:1.8rem;color:var(--gold-l)} .dash-card__label{font-size:.74rem;color:var(--text-3);margin-top:.3rem} /* ADDRESSES */ .address-grid,.address-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem} .address-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.4rem;position:relative} .address-card--default{border-color:rgba(200,169,126,0.35)} .address-card__badge{position:absolute;top:1rem;right:1rem;font-size:.62rem;font-weight:600;color:var(--gold-l);background:rgba(200,169,126,0.12);padding:.2rem .6rem;border-radius:20px} .address-card__actions{display:flex;gap:.8rem;margin-top:1rem} .address-option{display:flex;gap:.8rem;padding:1rem;border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;transition:border-color .2s} .address-option:hover{border-color:var(--gold-d)} .address-option__body{flex:1;font-size:.84rem;color:var(--text-2)} /* ORDER DETAIL */ .order-detail-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:2rem;align-items:start} .order-detail-header{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem} .order-timeline{position:relative;padding-left:2rem;margin:1.5rem 0} .order-timeline::before{content:'';position:absolute;left:6px;top:4px;bottom:4px;width:2px;background:var(--border-h)} /* FAQ */ .faq-list{max-width:760px;margin:0 auto} .faq-item{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:1.3rem 1.5rem;margin-bottom:1rem} .faq-item h3,.faq-item summary{font-family:var(--serif);font-weight:500;font-size:1.1rem;cursor:pointer;margin-bottom:.5rem} .faq-item p{color:var(--text-2);font-size:.86rem;line-height:1.7} /* CATEGORY DESC */ .category-desc{color:var(--text-2);font-size:.88rem;line-height:1.7;margin-bottom:1.5rem} .pagination__dots{color:var(--text-3)} @media(max-width:900px){ .cart-layout,.order-detail-grid,.checkout-main{grid-template-columns:1fr} .dashboard-grid{grid-template-columns:1fr} .address-grid,.address-list{grid-template-columns:1fr} } /* ═══ FINAL COVERAGE ═══ */ .product-info{padding:0} .shop-content{min-width:0} .sidebar__sort select{width:100%} /* ═══ ABOUT PAGE ═══ */ .ah{min-height:42vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:5rem 2rem 3rem;position:relative;z-index:2} .ah .al{font-size:.72rem;font-weight:500;color:var(--gold);letter-spacing:.06em;margin-bottom:.5rem} .ah h1{font-family:var(--serif);font-size:clamp(2.2rem,5vw,3.8rem);font-weight:400;margin-bottom:1rem} .ah h1 em{font-style:italic;color:var(--gold-l)} .ah p{color:var(--text-2);max-width:520px;margin:0 auto;line-height:1.8;font-size:.9rem} .story{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--border);position:relative;z-index:2} .story:first-of-type{border-top:1px solid var(--border)} .s-txt{padding:4rem;display:flex;flex-direction:column;justify-content:center} .s-txt h3{font-family:var(--serif);font-size:1.6rem;font-weight:400;margin-bottom:.8rem} .s-txt h3 em{font-style:italic;color:var(--gold-l)} .s-txt p{color:var(--text-2);line-height:1.8;margin-bottom:.7rem;font-size:.88rem} .s-vis{background:var(--card);display:flex;align-items:center;justify-content:center;border-left:1px solid var(--border);min-height:340px;position:relative;overflow:hidden} .s-vis img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0} .qt{text-align:center;padding:4.5rem 2rem;max-width:580px;margin:0 auto;position:relative;z-index:2} .qt blockquote{font-family:var(--serif);font-size:1.3rem;font-style:italic;line-height:1.8;margin-bottom:.8rem;font-weight:400;color:var(--text)} .qt .at{font-size:.72rem;font-weight:500;color:var(--gold)} .vals{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;max-width:960px;margin:0 auto 5rem;position:relative;z-index:2} .vl{background:var(--bg);padding:2.5rem 2rem;text-align:center;transition:background .3s} .vl:hover{background:var(--card)} .vl-n{font-family:var(--serif);font-size:1.6rem;font-weight:400;color:var(--gold-l);margin-bottom:.3rem} .vl h4{font-size:.86rem;font-weight:600;margin-bottom:.35rem} .vl p{font-size:.78rem;color:var(--text-3);line-height:1.55} @media(max-width:900px){.story{grid-template-columns:1fr}.s-txt{padding:2.5rem 1.5rem}.s-vis{min-height:200px;border-left:none;border-top:1px solid var(--border)}.story .s-vis{order:-1}.vals{grid-template-columns:1fr;margin:0 1.5rem 3rem}.qt{padding:3rem 1.5rem}.qt blockquote{font-size:1.05rem}} /* ═══ POLICY / STATIC PAGES ═══ */ .policy-hero{text-align:center;padding:4rem 2rem 2rem;position:relative;z-index:2} .policy-hero .al{font-size:.72rem;font-weight:500;color:var(--gold);letter-spacing:.06em;margin-bottom:.5rem} .policy-hero h1{font-family:var(--serif);font-size:clamp(2rem,4.5vw,3rem);font-weight:400} .policy-hero h1 em{font-style:italic;color:var(--gold-l)} .policy-body{max-width:780px;margin:0 auto;padding:1rem 2rem 4rem;position:relative;z-index:2} .policy-body h2{font-family:var(--serif);font-weight:500;font-size:1.4rem;margin:2rem 0 .8rem;color:var(--text)} .policy-body h3{font-size:1rem;font-weight:600;margin:1.4rem 0 .5rem;color:var(--gold-l)} .policy-body p,.policy-body li{color:var(--text-2);line-height:1.85;font-size:.9rem;margin-bottom:.8rem} .policy-body ul,.policy-body ol{padding-left:1.4rem;margin-bottom:1rem} .policy-body strong{color:var(--text)} .policy-body .upd{font-size:.78rem;color:var(--text-3);margin-bottom:1.5rem} /* ═══ CONTACT PAGE ═══ */ .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;max-width:1000px;margin:0 auto;padding:2rem;position:relative;z-index:2} .contact-info h2{font-family:var(--serif);font-weight:400;font-size:1.8rem;margin-bottom:1rem} .contact-info .ci-item{display:flex;gap:.9rem;align-items:flex-start;margin-bottom:1.3rem} .contact-info .ci-item svg{color:var(--gold);flex-shrink:0;margin-top:3px} .contact-info .ci-item h4{font-size:.82rem;font-weight:600;margin-bottom:.2rem} .contact-info .ci-item p,.contact-info .ci-item a{font-size:.84rem;color:var(--text-2)} .contact-socials{display:flex;gap:1rem;margin-top:1.5rem} .contact-socials a{width:40px;height:40px;border:1px solid var(--border-h);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--text-2);transition:all .25s} .contact-socials a:hover{border-color:var(--gold);color:var(--gold-l)} @media(max-width:900px){.contact-grid{grid-template-columns:1fr}} /* ═══ SIZE GUIDE ═══ */ .size-table{width:100%;border-collapse:collapse;margin:1.5rem 0} .size-table th,.size-table td{border:1px solid var(--border);padding:.8rem 1rem;text-align:center;font-size:.84rem} .size-table th{background:var(--card);color:var(--gold-l);font-weight:600} .size-table td{color:var(--text-2)} /* ═══ ADMIN GALLERY MANAGER ═══ */ .gallery-manager{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:.6rem} .gm-item{position:relative;width:120px;height:120px;border-radius:var(--r-sm);overflow:hidden;border:1px solid var(--border-h);cursor:grab;background:var(--elevated);transition:transform .2s,box-shadow .2s,opacity .2s} .gm-item:hover{box-shadow:0 6px 18px rgba(0,0,0,0.35)} .gm-item.gm-dragging{opacity:.5;cursor:grabbing} .gm-item img{width:100%;height:100%;object-fit:cover;pointer-events:none} .gm-item .gm-badge{position:absolute;top:6px;left:6px;background:var(--grad);color:#000;font-size:.58rem;font-weight:700;padding:.15rem .45rem;border-radius:4px;display:none} .gm-item.is-featured{border-color:var(--gold)} .gm-item.is-featured .gm-badge{display:block} .gm-item.gm-removed{opacity:.35;filter:grayscale(1)} .gm-item.gm-removed::after{content:'REMOVED';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);color:#f0a89f;font-size:.7rem;font-weight:700;letter-spacing:.05em} .gm-actions{position:absolute;bottom:6px;right:6px;display:flex;gap:5px;opacity:0;transition:opacity .2s} .gm-item:hover .gm-actions{opacity:1} .gm-btn{width:26px;height:26px;border:none;border-radius:6px;background:rgba(0,0,0,.65);color:#fff;cursor:pointer;font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:background .2s} .gm-btn.gm-feature:hover{background:var(--gold-d);color:#000} .gm-btn.gm-del:hover{background:var(--err)} .gm-preview{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.7rem} .gm-prev-item{width:90px;text-align:center} .gm-prev-item img{width:90px;height:90px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--border)} .gm-prev-item span{display:block;font-size:.62rem;color:var(--text-3);margin-top:.2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} /* ═══ PRODUCT GALLERY — zoom + lightbox ═══ */ .product-gallery__main{position:relative;cursor:zoom-in} .product-gallery__main img{transition:transform .35s var(--ease)} .product-gallery__main img.zoomed{transform:scale(1.8)} .gallery-zoom-hint{position:absolute;bottom:12px;right:12px;width:38px;height:38px;border-radius:50%;background:rgba(7,7,7,.65);border:1px solid var(--border-h);color:var(--gold-l);display:flex;align-items:center;justify-content:center;cursor:pointer;backdrop-filter:blur(6px);transition:all .2s;z-index:2} .gallery-zoom-hint:hover{background:var(--gold);color:#000} .product-gallery__thumb{padding:0;border:1px solid var(--border);background:none;cursor:pointer;border-radius:var(--r-sm);overflow:hidden;transition:border-color .2s} .product-gallery__thumb.active{border-color:var(--gold)} .lightbox{position:fixed;inset:0;z-index:5000;background:rgba(5,5,5,.94);display:none;align-items:center;justify-content:center;opacity:0;transition:opacity .3s} .lightbox.open{display:flex;opacity:1} .lightbox__img{max-width:90vw;max-height:88vh;object-fit:contain;border-radius:var(--r-sm);box-shadow:0 20px 60px rgba(0,0,0,.6)} .lightbox__close{position:absolute;top:20px;right:24px;background:none;border:none;color:var(--text-2);font-size:2.4rem;line-height:1;cursor:pointer;transition:color .2s} .lightbox__close:hover{color:var(--gold-l)} .lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid var(--border-h);color:var(--text);font-size:1.8rem;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center} .lightbox__nav:hover{background:var(--gold);color:#000;border-color:var(--gold)} .lightbox__prev{left:24px}.lightbox__next{right:24px} @media(max-width:600px){.lightbox__nav{width:42px;height:42px;font-size:1.4rem}.lightbox__prev{left:10px}.lightbox__next{right:10px}.product-gallery__main{cursor:default}.product-gallery__main img.zoomed{transform:none}} /* ═══ PRODUCT BADGES ═══ */ .product-card__badges{position:absolute;top:.9rem;left:.9rem;display:flex;flex-direction:column;gap:.35rem;z-index:2} .pc-badge{display:inline-block;padding:.28rem .6rem;border-radius:5px;font-size:.6rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;backdrop-filter:blur(8px)} .pc-badge--sale{background:var(--grad);color:#000} .pc-badge--new{background:rgba(120,160,210,.18);color:#a9c4e6;border:1px solid rgba(120,160,210,.3)} .pc-badge--best{background:rgba(200,169,126,.16);color:var(--gold-l);border:1px solid rgba(200,169,126,.3)} .pc-badge--feat{background:rgba(224,164,88,.16);color:#e6c79a;border:1px solid rgba(224,164,88,.3)} .pc-badge--hot{background:rgba(231,76,60,.16);color:#f0a89f;border:1px solid rgba(231,76,60,.3)} /* ═══ STICKY ADD TO CART ═══ */ .sticky-atc{position:fixed;left:0;right:0;bottom:0;z-index:1500;background:rgba(12,12,12,.96);backdrop-filter:blur(14px);border-top:1px solid var(--border-h);transform:translateY(100%);transition:transform .35s var(--ease);padding:.8rem 0} .sticky-atc.show{transform:translateY(0)} .sticky-atc__inner{display:flex;align-items:center;justify-content:space-between;gap:1rem} .sticky-atc__info{display:flex;flex-direction:column;min-width:0} .sticky-atc__name{font-family:var(--serif);font-size:1rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:50vw} .sticky-atc__price{font-size:.82rem;color:var(--gold-l);font-weight:600} .sticky-atc__form{flex-shrink:0} @media(max-width:600px){.sticky-atc__name{font-size:.86rem;max-width:42vw}.sticky-atc .btn{padding:.7rem 1.3rem}} /* ═══ ADMIN ANALYTICS ═══ */ .trend-chart{display:flex;align-items:flex-end;gap:.6rem;height:160px;padding-top:.5rem} .trend-bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:.4rem} .trend-bar__fill{width:100%;max-width:42px;background:var(--grad);border-radius:6px 6px 0 0;min-height:3px;transition:height .5s var(--ease)} .trend-bar__label{font-size:.66rem;color:var(--text-3)} .bestseller-list{display:flex;flex-direction:column;gap:.5rem} .bestseller-row{display:flex;align-items:center;gap:.7rem;padding:.5rem;border-radius:var(--r-sm);transition:background .2s;color:var(--text-2)} .bestseller-row:hover{background:var(--elevated)} .bestseller-rank{width:22px;height:22px;flex-shrink:0;border-radius:50%;background:rgba(200,169,126,.14);color:var(--gold-l);font-size:.72rem;font-weight:700;display:flex;align-items:center;justify-content:center} .bestseller-row img{width:38px;height:38px;border-radius:6px;object-fit:cover;flex-shrink:0;background:var(--elevated)} .bestseller-name{flex:1;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .bestseller-count{font-size:.72rem;color:var(--gold-l);font-weight:600;flex-shrink:0} @media(max-width:900px){.trend-chart{height:130px}} /* ═══ PASSWORD EYE TOGGLE ═══ */ .pw-wrap{position:relative} .pw-wrap input{width:100%;padding-right:46px;box-sizing:border-box} .pw-eye{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-3);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;transition:color .2s} .pw-eye:hover{color:var(--gold-l)} /* ═══ PRODUCT VARIANTS (size/colour) ═══ */ .variant-pick{margin:1.25rem 0} .variant-group{margin-bottom:1rem} .variant-label{display:block;font-size:.78rem;color:var(--text-2);margin-bottom:.5rem;letter-spacing:.03em} .variant-label em{color:var(--gold-l);font-style:normal} .size-guide-link{color:var(--gold-l);font-size:.72rem;margin-left:.4rem;text-decoration:underline;cursor:pointer} .variant-options{display:flex;flex-wrap:wrap;gap:.5rem} .variant-opt{min-width:46px;padding:.55rem .8rem;background:var(--card);border:1px solid var(--border-h);border-radius:var(--r-sm);color:var(--text);font-size:.82rem;cursor:pointer;transition:all .2s} .variant-opt:hover{border-color:var(--gold)} .variant-opt.on{background:var(--gold);color:#000;border-color:var(--gold);font-weight:600} .variant-swatch{width:34px;height:34px;border-radius:50%;border:2px solid var(--border-h);cursor:pointer;transition:all .2s;padding:0} .variant-swatch:hover{transform:scale(1.08)} .variant-swatch.on{border-color:var(--gold);box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--gold)} .variant-stock{font-size:.78rem;color:var(--text-3);margin:.4rem 0 0;min-height:1em} .variant-stock--err{color:#f0a89f} /* ═══ SIZE GUIDE MODAL ═══ */ .sg-modal{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.7);backdrop-filter:blur(4px);align-items:center;justify-content:center;padding:1rem} .sg-modal.open{display:flex} .sg-modal__box{background:var(--surface);border:1px solid var(--border-h);border-radius:var(--r);max-width:560px;width:100%;padding:2rem;position:relative;max-height:85vh;overflow-y:auto} .sg-modal__close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:var(--text-2);font-size:1.6rem;line-height:1;cursor:pointer} .sg-modal__close:hover{color:var(--gold-l)} .sg-modal__title{font-family:var(--serif);font-weight:500;margin:0 0 1.2rem;color:var(--text)} .sg-table{width:100%;border-collapse:collapse;font-size:.86rem} .sg-table th,.sg-table td{padding:.6rem .8rem;text-align:center;border:1px solid var(--border)} .sg-table thead th{background:rgba(200,169,126,.1);color:var(--gold-l);font-weight:600} .sg-table td{color:var(--text-2)} .sg-modal__note{font-size:.76rem;color:var(--text-3);margin:1rem 0 0;text-align:center} /* ═══ ANNOUNCEMENT BAR ═══ */ .announce-bar{position:relative;z-index:5;text-align:center;padding:.5rem 1rem;font-size:.82rem;font-weight:600;letter-spacing:.03em;line-height:1.4} .announce-bar a{text-decoration:none} .announce-bar a:hover{text-decoration:underline} /* moving / scrolling variant */ .announce-bar--move{padding:.5rem 0;overflow:hidden;white-space:nowrap} .announce-bar--move .announce-track{display:inline-block;white-space:nowrap;animation:announceScroll 18s linear infinite;will-change:transform} .announce-bar--move .announce-item{display:inline-block;padding:0 3rem} .announce-bar--move:hover .announce-track{animation-play-state:paused} @keyframes announceScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}} /* ═══ CATEGORY CARD IMAGE ═══ */ .category-card{overflow:hidden} .category-card__img{width:100%;aspect-ratio:1/1;margin:-1.8rem -1rem .9rem;width:calc(100% + 2rem);overflow:hidden;border-radius:var(--r) var(--r) 0 0} .category-card__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)} .category-card:hover .category-card__img img{transform:scale(1.06)} /* ═══ PRODUCT CARD — NO-IMAGE FALLBACK ═══ */ .product-card__noimg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0e0e0e,#161616);font-family:var(--serif);font-size:1.3rem;letter-spacing:.15em;color:rgba(200,169,126,0.35)} /* ═══ ADD TO CART — animation states ═══ */ .header__cart{display:inline-block} .cart-bounce{animation:cartBounce .5s var(--ease)} @keyframes cartBounce{0%{transform:scale(1)}30%{transform:scale(1.28)}55%{transform:scale(.92)}100%{transform:scale(1)}} .btn.is-adding{opacity:.8} .btn.is-added{background:#25D366 !important;color:#062e16 !important;border-color:#25D366 !important;animation:btnPop .35s var(--ease)} @keyframes btnPop{0%{transform:scale(.96)}50%{transform:scale(1.04)}100%{transform:scale(1)}} .header__badge{transition:transform .3s var(--ease)} /* ═══ GLOBAL PASSWORD TOGGLE — modern SHOW/HIDE pill ═══ */ .pw-toggle-wrap{position:relative;display:block} .pw-toggle-wrap input{width:100%;padding-right:64px !important;box-sizing:border-box} .pw-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);height:26px;padding:0 10px;border:1px solid var(--border-h,rgba(200,169,126,.25));border-radius:13px;background:rgba(200,169,126,.08);color:var(--gold-l,#ddc4a0);font-size:.62rem;font-weight:700;letter-spacing:.12em;cursor:pointer;display:flex;align-items:center;line-height:1;transition:all .2s;font-family:var(--sans,'DM Sans',sans-serif)} .pw-toggle:hover{background:rgba(200,169,126,.18);border-color:var(--gold,#c8a97e)} .pw-toggle.is-on{background:var(--gold,#c8a97e);color:#0a0a0a;border-color:var(--gold,#c8a97e)} .pw-toggle__txt{display:block} /* ═══ TRUST BADGES ═══ */ .trust-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem} .trust-badge{display:flex;align-items:center;gap:.85rem;padding:1.1rem 1.2rem;background:var(--card);border:1px solid var(--border);border-radius:var(--r);transition:border-color .3s var(--ease),transform .3s var(--ease)} .trust-badge:hover{border-color:var(--border-h);transform:translateY(-2px)} .trust-badge svg{color:var(--gold-l);flex-shrink:0} .trust-badge strong{display:block;font-size:.86rem;font-weight:600;color:var(--text)} .trust-badge span{display:block;font-size:.74rem;color:var(--text-3);margin-top:.1rem} @media(max-width:900px){.trust-badges{grid-template-columns:1fr 1fr}} @media(max-width:520px){.trust-badges{grid-template-columns:1fr 1fr;gap:.7rem}.trust-badge{padding:.85rem;flex-direction:column;text-align:center;gap:.5rem}} /* ═══ PRODUCT CARD — Quick View overlay (premium) ═══ */ .product-card__quickview{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding-bottom:1.4rem;background:linear-gradient(to top,rgba(7,7,7,.55),rgba(7,7,7,0) 55%);opacity:0;transition:opacity .45s var(--ease);pointer-events:none} .product-card:hover .product-card__quickview{opacity:1} .product-card__qv-pill{transform:translateY(12px);transition:transform .45s var(--ease);background:rgba(12,12,12,.7);backdrop-filter:blur(8px);border:1px solid var(--gold);color:var(--gold-l);font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:.55rem 1.3rem;border-radius:30px} .product-card:hover .product-card__qv-pill{transform:translateY(0)} @media(hover:none){.product-card__quickview{display:none}}