/* ═══════════════════════════════════════════════════════════════════
   LYP LUXURY PRO — estilos.css  v4.0 ULTRA PREMIUM
   Cormorant Garamond + Cinzel · Dark Gold Luxury Aesthetic
   ═══════════════════════════════════════════════════════════════════ */

   @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,600&family=Cinzel:wght@400;500;600;700&family=Raleway:wght@300;400;500;600;700&display=swap');

   /* ── VARIABLES ────────────────────────────────────────────────────── */
   :root {
     /* Background scale */
     --void:        #010101;
     --abyss:       #050505;
     --obsidian:    #080808;
     --onyx:        #0c0c0c;
     --charcoal:    #111111;
     --smoke:       #1a1a1a;
     --smoke-2:     #222222;
     --mist:        #2a2a2a;
   
     /* Gold palette */
     --gold-900:    #3d2b08;
     --gold-700:    #7a550f;
     --gold-500:    #C9A84C;
     --gold-400:    #d9bc72;
     --gold-300:    #E8C96D;
     --gold-200:    #f0da9a;
     --gold-100:    #faefd0;
   
     /* Aliases */
     --gold:        var(--gold-500);
     --gold-bright: var(--gold-300);
     --gold-pale:   var(--gold-100);
     --gold-dark:   var(--gold-700);
   
     /* Alpha utilities */
     --gold-a6:     rgba(201,168,76,.06);
     --gold-a10:    rgba(201,168,76,.10);
     --gold-a16:    rgba(201,168,76,.16);
     --gold-a24:    rgba(201,168,76,.24);
     --gold-a40:    rgba(201,168,76,.40);
   
     /* Ivory/text scale */
     --ivory:       #EDE8DC;
     --ivory-80:    rgba(237,232,220,.8);
     --ivory-50:    rgba(237,232,220,.5);
     --ivory-30:    rgba(237,232,220,.3);
     --ivory-10:    rgba(237,232,220,.1);
     --ivory-05:    rgba(237,232,220,.05);
   
     /* Accent */
     --green-wa:    #25D366;
     --green-wa-2:  #128C7E;
     --red-sale:    #cc4444;
     --red-sale-bg: rgba(180,60,60,.12);
     --red-sale-br: rgba(180,60,60,.25);
   
     /* Glassmorphism */
     --glass-bg:    rgba(6,6,6,.82);
     --glass-br:    rgba(201,168,76,.13);
     --glass-br-2:  rgba(201,168,76,.22);
   
     /* Typography */
     --font-serif:  'Cormorant Garamond', Georgia, serif;
     --font-title:  'Cinzel', serif;
     --font-body:   'Raleway', sans-serif;
   
     /* Easing */
     --ease:        cubic-bezier(.19,1,.22,1);
     --ease-out:    cubic-bezier(.0,.0,.2,1);
     --ease-bounce: cubic-bezier(.34,1.56,.64,1);
     --ease-spring: cubic-bezier(.175,.885,.32,1.275);
   
     /* Radii */
     --r-xs: 4px;  --r-sm: 8px;   --r-md: 14px;
     --r-lg: 20px; --r-xl: 28px;  --r-2xl: 40px;
     --r-full: 9999px;
   
     /* Shadows */
     --sh-gold-sm:  0 0 24px rgba(201,168,76,.12), 0 0 60px rgba(201,168,76,.06);
     --sh-gold:     0 0 60px rgba(201,168,76,.18), 0 0 120px rgba(201,168,76,.08);
     --sh-gold-lg:  0 0 80px rgba(201,168,76,.28), 0 0 160px rgba(201,168,76,.12);
     --sh-deep:     0 20px 80px rgba(0,0,0,.9), 0 4px 20px rgba(0,0,0,.7);
     --sh-card:     0 8px 40px rgba(0,0,0,.7), inset 0 1px 0 rgba(201,168,76,.06);
     --sh-modal:    0 40px 120px rgba(0,0,0,.95), var(--sh-gold);
   
     /* Transitions */
     --t-fast:   .15s;
     --t-base:   .3s;
     --t-slow:   .55s;
     --t-xslow:  .8s;
   }
   
   /* ── RESET ────────────────────────────────────────────────────────── */
   *, *::before, *::after {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
   }
   html {
     scroll-behavior: smooth;
     font-size: 16px;
     overflow-x: hidden;
   }
   body {
     background: var(--void);
     color: var(--ivory);
     font-family: var(--font-body);
     font-weight: 400;
     line-height: 1.65;
     overflow-x: hidden;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     cursor: none;
   }
   img   { display: block; width: 100%; height: 100%; object-fit: cover; }
   a     { text-decoration: none; color: inherit; }
   ul    { list-style: none; }
   button{ border: none; background: none; font-family: var(--font-body); cursor: none; }
   input, select { font-family: var(--font-body); }
   h1, h2, h3, h4, h5 { font-weight: inherit; }
   
   /* ── SCROLLBAR ────────────────────────────────────────────────────── */
   ::-webkit-scrollbar       { width: 2px; }
   ::-webkit-scrollbar-track { background: var(--void); }
   ::-webkit-scrollbar-thumb { background: var(--gold-dark); border-radius: 2px; }
   ::selection               { background: var(--gold); color: var(--void); }
   
   /* ── NOISE OVERLAY ────────────────────────────────────────────────── */
   body::before {
     content: '';
     position: fixed;
     inset: 0;
     background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.035'/%3E%3C/svg%3E");
     pointer-events: none;
     z-index: 9997;
     opacity: .5;
     mix-blend-mode: overlay;
   }
   
   /* ── CURSOR ───────────────────────────────────────────────────────── */
   .cursor-dot {
     position: fixed;
     top: 0; left: 0;
     width: 6px; height: 6px;
     background: var(--gold-bright);
     border-radius: 50%;
     pointer-events: none;
     z-index: 99999;
     transform: translate(-50%, -50%);
     transition: width var(--t-fast), height var(--t-fast), background var(--t-fast), opacity var(--t-fast);
     mix-blend-mode: screen;
     will-change: transform;
   }
   .cursor-ring {
     position: fixed;
     top: 0; left: 0;
     width: 32px; height: 32px;
     border: 1px solid var(--gold-a40);
     border-radius: 50%;
     pointer-events: none;
     z-index: 99998;
     transform: translate(-50%, -50%);
     transition: width .25s var(--ease), height .25s var(--ease),
                 border-color .25s, opacity .25s;
     will-change: transform;
   }
   body.cursor-hover .cursor-dot  { width: 10px; height: 10px; background: var(--gold); }
   body.cursor-hover .cursor-ring { width: 50px; height: 50px; border-color: var(--gold-a40); }
   body.cursor-click .cursor-dot  { width: 14px; height: 14px; }
   body.cursor-click .cursor-ring { width: 20px; height: 20px; opacity: .4; }
   
   /* ── PAGE LOADER ──────────────────────────────────────────────────── */
   .page-loader {
     position: fixed;
     inset: 0;
     z-index: 999999;
     background: var(--void);
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 20px;
     transition: opacity .9s var(--ease), visibility .9s;
   }
   .page-loader.hidden { opacity: 0; visibility: hidden; pointer-events: none; }
   
   .loader-emblem {
     width: 88px; height: 88px;
     opacity: 0;
     animation: fadeUp .9s .1s var(--ease) forwards;
   }
   .loader-emblem svg { width: 100%; height: 100%; }
   
   .loader-circle-outer {
     stroke-dasharray: 233;
     stroke-dashoffset: 233;
     animation: drawCircle 1.2s .3s var(--ease) forwards;
   }
   .loader-circle-inner {
     stroke-dasharray: 160;
     stroke-dashoffset: 160;
     animation: drawCircle 1.2s .5s var(--ease) forwards;
   }
   @keyframes drawCircle {
     to { stroke-dashoffset: 0; }
   }
   
   .loader-bar-wrap {
     width: 200px; height: 1px;
     background: var(--smoke-2);
     position: relative;
     overflow: visible;
     opacity: 0;
     animation: fadeUp .5s .7s forwards;
   }
   .loader-bar-fill {
     position: absolute;
     left: 0; top: 0;
     height: 100%; width: 0%;
     background: linear-gradient(90deg, var(--gold-dark), var(--gold-bright), var(--gold));
     transition: width .1s linear;
     border-radius: 1px;
   }
   .loader-bar-glow {
     position: absolute;
     top: -3px;
     height: 7px;
     width: 30px;
     background: radial-gradient(ellipse, var(--gold-bright) 0%, transparent 70%);
     opacity: .6;
     filter: blur(3px);
     transition: left .1s linear;
     pointer-events: none;
   }
   .loader-pct {
     font-family: var(--font-title);
     font-size: 11px;
     letter-spacing: 4px;
     color: var(--gold);
     opacity: 0;
     animation: fadeUp .4s .8s forwards;
   }
   .loader-tagline {
     font-size: 10px;
     letter-spacing: 3px;
     color: var(--ivory-30);
     text-transform: uppercase;
     opacity: 0;
     animation: fadeUp .4s .9s forwards;
   }
   
   @keyframes fadeUp {
     from { opacity: 0; transform: translateY(14px); }
     to   { opacity: 1; transform: translateY(0); }
   }
   
   /* ── HEADER ───────────────────────────────────────────────────────── */
   .site-header {
     position: fixed;
     top: 0; left: 0;
     width: 100%;
     z-index: 1000;
     transition: all var(--t-slow) var(--ease);
   }
   
   /* Top bar */
   .header-topbar {
     background: var(--gold);
     padding: 8px 40px;
     overflow: hidden;
     transition: height var(--t-slow) var(--ease),
                 opacity var(--t-slow) var(--ease),
                 padding var(--t-slow) var(--ease);
     height: 38px;
   }
   .topbar-inner {
     max-width: 1440px;
     margin: 0 auto;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 24px;
   }
   .topbar-item {
     display: flex;
     align-items: center;
     gap: 7px;
     font-family: var(--font-title);
     font-size: 9.5px;
     letter-spacing: 2px;
     color: var(--void);
     text-transform: uppercase;
   }
   .topbar-item i { font-size: 10px; opacity: .8; }
   .topbar-divider { color: rgba(0,0,0,.3); font-size: 12px; }
   
   .site-header.scrolled .header-topbar {
     height: 0;
     opacity: 0;
     padding-top: 0;
     padding-bottom: 0;
   }
   
   /* Main header */
   .header-main {
     background: var(--glass-bg);
     backdrop-filter: blur(28px) saturate(180%);
     -webkit-backdrop-filter: blur(28px) saturate(180%);
     border-bottom: 1px solid var(--glass-br);
     transition: border-color var(--t-base);
   }
   .site-header.scrolled .header-main {
     border-bottom-color: var(--glass-br-2);
     box-shadow: 0 4px 40px rgba(0,0,0,.6);
   }
   
   .header-inner {
     max-width: 1440px;
     margin: 0 auto;
     height: 70px;
     padding: 0 40px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 20px;
   }
   
   /* Logo */
   .logo {
     display: flex;
     align-items: center;
     gap: 12px;
     flex-shrink: 0;
     transition: opacity var(--t-base);
   }
   .logo:hover { opacity: .85; }
   .logo-emblem {
     width: 42px; height: 42px;
     flex-shrink: 0;
   }
   .logo-emblem svg { width: 100%; height: 100%; }
   .logo-text { display: flex; flex-direction: column; }
   .logo-name {
     font-family: var(--font-title);
     font-size: 14px;
     letter-spacing: 5px;
     color: var(--gold);
     text-transform: uppercase;
     line-height: 1.2;
   }
   .logo-tagline {
     font-size: 8px;
     letter-spacing: 4px;
     color: var(--ivory-50);
     text-transform: uppercase;
     margin-top: 2px;
   }
   
   /* Nav links */
   .header-nav {
     display: flex;
     gap: 32px;
     align-items: center;
   }
   .nav-link {
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 3px;
     position: relative;
   }
   .nav-link-text {
     font-family: var(--font-title);
     font-size: 9.5px;
     letter-spacing: 3px;
     text-transform: uppercase;
     color: var(--ivory-50);
     transition: color var(--t-base);
     white-space: nowrap;
   }
   .nav-link-line {
     width: 0;
     height: 1px;
     background: var(--gold);
     transition: width var(--t-slow) var(--ease);
     align-self: flex-start;
   }
   .nav-link:hover .nav-link-text  { color: var(--gold); }
   .nav-link:hover .nav-link-line  { width: 100%; }
   
   /* Search */
   .header-search { flex: 1; max-width: 300px; }
   .search-wrap {
     position: relative;
     display: flex;
     align-items: center;
   }
   .search-icon {
     position: absolute;
     left: 14px;
     font-size: 12px;
     color: var(--ivory-30);
     pointer-events: none;
     transition: color var(--t-base);
   }
   .search-input {
     width: 100%;
     padding: 9px 40px 9px 36px;
     background: var(--ivory-05);
     border: 1px solid var(--glass-br);
     border-radius: var(--r-full);
     color: var(--ivory);
     font-size: 11px;
     letter-spacing: .5px;
     outline: none;
     transition: all var(--t-slow) var(--ease);
   }
   .search-input::placeholder { color: var(--ivory-30); }
   .search-input:focus {
     background: var(--gold-a6);
     border-color: var(--gold-a40);
     box-shadow: 0 0 0 4px var(--gold-a6);
   }
   .search-input:focus ~ .search-icon,
   .search-wrap:focus-within .search-icon { color: var(--gold); }
   .search-kbd {
     position: absolute;
     right: 12px;
     pointer-events: none;
   }
   .search-kbd kbd {
     font-size: 9px;
     padding: 2px 5px;
     background: var(--smoke);
     border: 1px solid var(--mist);
     border-radius: 3px;
     color: var(--ivory-30);
     font-family: var(--font-body);
   }
   
   /* Action buttons */
   .header-actions {
     display: flex;
     align-items: center;
     gap: 2px;
   }
   .action-btn {
     position: relative;
     width: 40px; height: 40px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 15px;
     color: var(--ivory-50);
     transition: all var(--t-base) var(--ease);
   }
   .action-btn:hover {
     color: var(--gold);
     background: var(--gold-a6);
   }
   .action-btn--wa:hover { color: var(--green-wa); }
   
   .action-badge {
     position: absolute;
     top: 4px; right: 4px;
     min-width: 17px; height: 17px;
     background: var(--gold);
     color: var(--void);
     border-radius: var(--r-full);
     font-family: var(--font-title);
     font-size: 8px;
     font-weight: 700;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 0 3px;
     opacity: 0;
     transform: scale(0);
     transition: all var(--t-base) var(--ease-bounce);
     pointer-events: none;
   }
   .action-badge.visible { opacity: 1; transform: scale(1); }
   
   /* Mobile menu button */
   .mobile-menu-btn {
     display: none;
     flex-direction: column;
     gap: 5px;
     padding: 8px;
   }
   .mobile-menu-btn span {
     display: block;
     width: 22px; height: 1.5px;
     background: var(--ivory-50);
     border-radius: 2px;
     transition: all var(--t-base);
   }
   .mobile-menu-btn.open span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
   .mobile-menu-btn.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
   .mobile-menu-btn.open span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }
   
   /* Mobile nav */
   .mobile-nav {
     display: none;
     flex-direction: column;
     background: var(--obsidian);
     border-top: 1px solid var(--glass-br);
     padding: 0;
     overflow: hidden;
     max-height: 0;
     transition: max-height var(--t-slow) var(--ease), padding var(--t-base);
   }
   .mobile-nav.open {
     max-height: 240px;
     padding: 12px 0;
   }
   .mobile-nav-link {
     display: block;
     padding: 14px 32px;
     font-family: var(--font-title);
     font-size: 10px;
     letter-spacing: 3px;
     text-transform: uppercase;
     color: var(--ivory-50);
     border-bottom: 1px solid var(--ivory-05);
     transition: all var(--t-base);
   }
   .mobile-nav-link:last-child { border-bottom: none; }
   .mobile-nav-link:hover { color: var(--gold); padding-left: 40px; }
   
   /* ── HERO ─────────────────────────────────────────────────────────── */
   .hero {
     min-height: 100svh;
     display: grid;
     grid-template-columns: 1fr 1fr;
     position: relative;
     overflow: hidden;
     padding-top: 108px;
   }
   
   /* Hero background */
   .hero-bg {
     position: absolute;
     inset: 0;
     pointer-events: none;
   }
   .hero-orb {
     position: absolute;
     border-radius: 50%;
     filter: blur(160px);
     animation: orbFloat 10s ease-in-out infinite;
     pointer-events: none;
   }
   .hero-orb--1 {
     width: 600px; height: 600px;
     background: radial-gradient(circle, rgba(201,168,76,.09) 0%, transparent 65%);
     top: -120px; right: -60px;
   }
   .hero-orb--2 {
     width: 400px; height: 400px;
     background: radial-gradient(circle, rgba(201,168,76,.05) 0%, transparent 65%);
     bottom: -60px; left: -80px;
     animation-delay: -5s;
   }
   .hero-orb--3 {
     width: 280px; height: 280px;
     background: radial-gradient(circle, rgba(201,168,76,.04) 0%, transparent 65%);
     top: 40%; left: 44%;
     animation-delay: -2.5s;
   }
   @keyframes orbFloat {
     0%, 100% { transform: translateY(0) scale(1); }
     50%       { transform: translateY(-28px) scale(1.04); }
   }
   
   .hero-grid-lines {
     position: absolute;
     inset: 0;
     background-image:
       linear-gradient(rgba(201,168,76,.018) 1px, transparent 1px),
       linear-gradient(90deg, rgba(201,168,76,.018) 1px, transparent 1px);
     background-size: 72px 72px;
   }
   .hero-vline {
     position: absolute;
     top: 0; bottom: 0;
     left: 50%;
     width: 1px;
     background: linear-gradient(
       180deg,
       transparent 0%,
       rgba(201,168,76,.18) 15%,
       rgba(201,168,76,.18) 85%,
       transparent 100%
     );
     z-index: 2;
   }
   
   /* Hero left */
   .hero-left {
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding: 80px 60px 80px 80px;
     position: relative;
     z-index: 3;
   }
   
   .hero-eyebrow {
     display: flex;
     align-items: center;
     gap: 14px;
     margin-bottom: 28px;
   }
   .eyebrow-line {
     display: block;
     width: 36px;
     height: 1px;
     background: linear-gradient(90deg, transparent, var(--gold));
   }
   .eyebrow-text {
     font-family: var(--font-title);
     font-size: 9.5px;
     letter-spacing: 5px;
     color: var(--gold);
     text-transform: uppercase;
   }
   .eyebrow-dot {
     width: 4px; height: 4px;
     border-radius: 50%;
     background: var(--gold);
     flex-shrink: 0;
   }
   
   .hero-title {
     font-family: var(--font-serif);
     font-size: clamp(46px, 5.5vw, 88px);
     font-weight: 600;
     line-height: .96;
     color: var(--ivory);
     letter-spacing: -.5px;
   }
   .hero-title-em {
     font-style: italic;
     font-weight: 400;
     color: var(--gold-bright);
     display: block;
     font-size: 1.12em;
     line-height: .98;
   }
   .hero-title-serif {
     display: block;
     font-family: var(--font-title);
     font-size: .36em;
     font-style: normal;
     font-weight: 400;
     letter-spacing: 7px;
     color: var(--ivory-50);
     margin-top: 18px;
     text-transform: uppercase;
     line-height: 1.4;
   }
   
   .hero-desc {
     font-size: 14px;
     font-weight: 300;
     color: var(--ivory-50);
     line-height: 1.9;
     margin-top: 24px;
     margin-bottom: 40px;
     max-width: 380px;
   }
   
   .hero-stats {
     display: flex;
     align-items: center;
     gap: 0;
     margin-bottom: 44px;
     padding-top: 28px;
     border-top: 1px solid var(--ivory-10);
   }
   .stat {
     flex: 1;
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
   }
   .stat-num {
     font-family: var(--font-serif);
     font-size: 40px;
     font-weight: 600;
     color: var(--gold-300);
     line-height: 1;
     letter-spacing: -1px;
   }
   .stat-plus {
     font-family: var(--font-serif);
     font-size: 20px;
     color: var(--gold);
     margin-left: 2px;
   }
   .stat-label {
     font-size: 9px;
     letter-spacing: 2.5px;
     color: var(--ivory-50);
     text-transform: uppercase;
     margin-top: 6px;
     font-family: var(--font-title);
   }
   .stat-divider {
     width: 1px;
     height: 44px;
     background: var(--ivory-10);
   }
   
   .hero-actions {
     display: flex;
     gap: 14px;
     flex-wrap: wrap;
   }
   
   .hero-trust {
     display: flex;
     gap: 24px;
     margin-top: 32px;
     flex-wrap: wrap;
   }
   .trust-item {
     display: flex;
     align-items: center;
     gap: 7px;
     font-size: 10.5px;
     letter-spacing: 1px;
     color: var(--ivory-30);
   }
   .trust-item i { color: var(--gold-dark); font-size: 11px; }
   
   /* Reveal items */
   .reveal-item {
     opacity: 0;
     transform: translateY(20px);
     animation: heroReveal .8s var(--delay, 0s) var(--ease) forwards;
   }
   @keyframes heroReveal {
     to { opacity: 1; transform: translateY(0); }
   }
   
   /* Hero right */
   .hero-right {
     position: relative;
     overflow: hidden;
     z-index: 3;
   }
   
   /* Frame corner decorations */
   .hero-frame-corner {
     position: absolute;
     z-index: 10;
     width: 20px;
     height: 20px;
     pointer-events: none;
   }
   .hero-frame-corner--tl {
     top: 20px; left: 20px;
     border-top: 1px solid var(--gold-a40);
     border-left: 1px solid var(--gold-a40);
   }
   .hero-frame-corner--tr {
     top: 20px; right: 20px;
     border-top: 1px solid var(--gold-a40);
     border-right: 1px solid var(--gold-a40);
   }
   .hero-frame-corner--bl {
     bottom: 80px; left: 20px;
     border-bottom: 1px solid var(--gold-a40);
     border-left: 1px solid var(--gold-a40);
   }
   .hero-frame-corner--br {
     bottom: 80px; right: 20px;
     border-bottom: 1px solid var(--gold-a40);
     border-right: 1px solid var(--gold-a40);
   }
   
   .hero-slider-wrap {
     width: 100%;
     height: 100%;
     position: relative;
   }
   .hero-slides {
     position: absolute;
     inset: 0;
   }
   
   /* Individual slide */
   .hero-slide {
     position: absolute;
     inset: 0;
     opacity: 0;
     transform: scale(1.06);
     transition: opacity 1.1s var(--ease), transform 1.1s var(--ease);
     pointer-events: none;
     overflow: hidden;
   }
   .hero-slide.active {
     opacity: 1;
     transform: scale(1);
     pointer-events: all;
   }
   .hero-slide img {
     width: 100%; height: 100%;
     object-fit: cover;
     object-position: center;
     transition: transform 8s linear;
   }
   .hero-slide.active img { transform: scale(1.04); }
   .hero-slide::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(
       160deg,
       rgba(1,1,1,.6) 0%,
       rgba(1,1,1,.2) 40%,
       rgba(1,1,1,.15) 60%,
       rgba(1,1,1,.55) 100%
     );
     pointer-events: none;
   }
   
   .hero-slide-placeholder {
     width: 100%; height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     background: radial-gradient(ellipse at center, var(--charcoal) 0%, var(--void) 100%);
   }
   .hero-slide-placeholder svg { opacity: .2; }
   
   /* Slide info overlay */
   .slide-info {
     position: absolute;
     bottom: 0; left: 0; right: 0;
     padding: 60px 36px 48px;
     background: linear-gradient(0deg, rgba(1,1,1,.96) 0%, rgba(1,1,1,.6) 45%, transparent 100%);
     z-index: 4;
     display: flex;
     align-items: flex-end;
     justify-content: space-between;
     gap: 20px;
   }
   .slide-badge {
     display: inline-block;
     background: var(--gold);
     color: var(--void);
     font-family: var(--font-title);
     font-size: 7.5px;
     letter-spacing: 2.5px;
     padding: 4px 12px;
     border-radius: var(--r-full);
     margin-bottom: 10px;
     text-transform: uppercase;
   }
   .slide-name {
     font-family: var(--font-serif);
     font-size: 28px;
     font-weight: 500;
     color: var(--ivory);
     line-height: 1.15;
   }
   .slide-category {
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 4px;
     color: var(--gold);
     text-transform: uppercase;
     margin-top: 5px;
   }
   .slide-price-box { text-align: right; flex-shrink: 0; }
   .slide-price {
     font-family: var(--font-serif);
     font-size: 34px;
     font-weight: 600;
     color: var(--gold-bright);
     line-height: 1;
     display: block;
   }
   .slide-price-orig {
     font-size: 13px;
     color: var(--ivory-30);
     text-decoration: line-through;
     display: block;
     margin-top: 4px;
   }
   
   /* Slider dots */
   .slider-dots {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     right: 20px;
     z-index: 6;
     display: flex;
     flex-direction: column;
     gap: 10px;
   }
   .slider-dot {
     width: 5px; height: 5px;
     border-radius: 50%;
     background: var(--gold-a24);
     border: 1px solid var(--gold-a40);
     transition: all .45s var(--ease);
   }
   .slider-dot.active {
     background: var(--gold);
     height: 24px;
     border-radius: 3px;
     box-shadow: 0 0 10px var(--gold);
   }
   
   /* Slider arrows */
   .slider-arrows {
     position: absolute;
     bottom: 56px;
     right: 36px;
     z-index: 6;
     display: flex;
     gap: 8px;
   }
   .slider-arrow {
     width: 40px; height: 40px;
     border-radius: 50%;
     border: 1px solid var(--glass-br-2);
     background: var(--glass-bg);
     backdrop-filter: blur(12px);
     color: var(--gold);
     font-size: 13px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-base) var(--ease);
   }
   .slider-arrow:hover {
     background: var(--gold-a16);
     border-color: var(--gold-a40);
     transform: scale(1.08);
   }
   
   /* Slider progress bar */
   .slider-progress {
     position: absolute;
     bottom: 0;
     left: 0; right: 0;
     height: 2px;
     background: var(--ivory-05);
     z-index: 6;
   }
   .slider-progress-fill {
     height: 100%;
     background: var(--gold);
     width: 0%;
     transition: width .1s linear;
   }
   
   /* ── MARQUEE ──────────────────────────────────────────────────────── */
   .marquee-strip {
     background: var(--gold);
     padding: 11px 0;
     overflow: hidden;
     position: relative;
     z-index: 4;
   }
   .marquee-track {
     display: flex;
     animation: marqueeScroll 32s linear infinite;
     white-space: nowrap;
     will-change: transform;
   }
   .marquee-item {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     padding: 0 28px;
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 3px;
     color: var(--void);
     text-transform: uppercase;
     flex-shrink: 0;
   }
   .marquee-item i { font-size: 9px; opacity: .65; }
   .m-sep { opacity: .35; font-size: 12px; margin-left: 10px; }
   @keyframes marqueeScroll {
     from { transform: translateX(0); }
     to   { transform: translateX(-50%); }
   }
   
   /* ── FILTERS SECTION ──────────────────────────────────────────────── */
   .filters-section {
     padding: 56px 80px 24px;
     position: relative;
   }
   .filters-inner {
     max-width: 1440px;
     margin: 0 auto;
     display: flex;
     flex-direction: column;
     gap: 20px;
   }
   .filters-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 16px;
     flex-wrap: wrap;
   }
   .filters-meta { display: flex; flex-direction: column; gap: 3px; }
   .filters-eyebrow {
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 5px;
     color: var(--gold);
     text-transform: uppercase;
   }
   .filters-count {
     font-size: 12px;
     color: var(--ivory-50);
   }
   #filter-count-num {
     color: var(--gold);
     font-family: var(--font-serif);
     font-size: 15px;
     font-weight: 600;
   }
   
   /* Sort select */
   .filters-sort { position: relative; }
   .sort-select {
     appearance: none;
     background: var(--ivory-05);
     border: 1px solid var(--glass-br);
     border-radius: var(--r-full);
     color: var(--ivory-50);
     font-size: 10px;
     letter-spacing: 1px;
     padding: 8px 34px 8px 16px;
     outline: none;
     transition: all var(--t-base);
     font-family: var(--font-title);
     text-transform: uppercase;
   }
   .sort-select:focus,
   .sort-select:hover {
     border-color: var(--gold-a40);
     color: var(--gold);
     background: var(--gold-a6);
   }
   .sort-icon {
     position: absolute;
     right: 12px;
     top: 50%;
     transform: translateY(-50%);
     font-size: 9px;
     color: var(--ivory-30);
     pointer-events: none;
   }
   
   /* Filter buttons */
   .filters-bar {
     display: flex;
     gap: 8px;
     flex-wrap: wrap;
   }
   .filter-btn {
     display: flex;
     align-items: center;
     gap: 8px;
     padding: 9px 22px;
     border-radius: var(--r-full);
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 2px;
     text-transform: uppercase;
     color: var(--ivory-50);
     border: 1px solid var(--ivory-10);
     background: transparent;
     transition: all .35s var(--ease);
     position: relative;
     overflow: hidden;
   }
   .filter-btn::before {
     content: '';
     position: absolute;
     inset: 0;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform .35s var(--ease);
     z-index: 0;
     border-radius: var(--r-full);
   }
   .filter-btn:hover {
     color: var(--gold);
     border-color: var(--gold-dark);
     background: var(--gold-a6);
   }
   .filter-btn.active {
     color: var(--void);
     border-color: var(--gold);
     background: var(--gold);
     box-shadow: 0 4px 20px rgba(201,168,76,.3);
   }
   .filter-btn-icon,
   .filter-btn span { position: relative; z-index: 1; }
   .filter-btn-icon { font-size: 10px; }
   
   /* ── CATALOG SECTION ──────────────────────────────────────────────── */
   .catalog-section {
     padding: 24px 80px 100px;
   }
   .catalog-inner {
     max-width: 1440px;
     margin: 0 auto;
   }
   
   /* Section header */
   .section-header {
     text-align: center;
     margin-bottom: 60px;
   }
   .section-eyebrow {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 20px;
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 6px;
     color: var(--gold);
     text-transform: uppercase;
     margin-bottom: 14px;
   }
   .eyebrow-line-h {
     display: block;
     width: 44px;
     height: 1px;
     background: linear-gradient(90deg, transparent, var(--gold));
   }
   .section-eyebrow span:last-child .eyebrow-line-h,
   .eyebrow-line-h:last-child {
     background: linear-gradient(90deg, var(--gold), transparent);
   }
   .section-title {
     font-family: var(--font-serif);
     font-size: clamp(34px, 4.5vw, 60px);
     font-weight: 500;
     color: var(--ivory);
     line-height: 1.05;
     letter-spacing: -.5px;
   }
   .section-title em {
     font-style: italic;
     font-weight: 300;
     color: var(--gold-bright);
   }
   .section-subtitle {
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 4px;
     color: var(--ivory-30);
     text-transform: uppercase;
     margin-top: 12px;
   }
   
   /* Products grid */
   .products-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 24px;
   }
   
   /* ── PRODUCT CARD ─────────────────────────────────────────────────── */
   .product-card {
     background: var(--onyx);
     border: 1px solid var(--smoke);
     border-radius: var(--r-lg);
     overflow: hidden;
     position: relative;
     transition: all .55s var(--ease);
     opacity: 0;
     transform: translateY(28px);
     animation: cardReveal .7s var(--card-delay, 0s) var(--ease) forwards;
     will-change: transform;
   }
   @keyframes cardReveal {
     to { opacity: 1; transform: translateY(0); }
   }
   .product-card:hover {
     border-color: var(--gold-a40);
     box-shadow: var(--sh-gold), var(--sh-deep);
     transform: translateY(-6px);
   }
   
   /* Card image area */
   .card-img-wrap {
     position: relative;
     aspect-ratio: 1 / 1;
     overflow: hidden;
     background: var(--charcoal);
   }
   .card-img-wrap > img {
     width: 100%; height: 100%;
     object-fit: cover;
     transition: transform .9s var(--ease);
     filter: brightness(.95) contrast(1.04);
   }
   .product-card:hover .card-img-wrap > img { transform: scale(1.07); }
   
   /* Img fallback */
   .img-fallback {
     width: 100%; height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     background: radial-gradient(ellipse at 50% 40%, var(--charcoal) 0%, var(--onyx) 100%);
   }
   
   /* Card badge */
   .card-badge {
     position: absolute;
     top: 14px; left: 14px;
     z-index: 3;
     background: rgba(6,6,6,.85);
     border: 1px solid var(--gold);
     color: var(--gold);
     font-family: var(--font-title);
     font-size: 7px;
     letter-spacing: 2.5px;
     padding: 5px 12px;
     border-radius: var(--r-full);
     text-transform: uppercase;
     backdrop-filter: blur(10px);
   }
   
   /* Wishlist btn */
   .card-wishlist {
     position: absolute;
     top: 13px; right: 13px;
     z-index: 3;
     width: 34px; height: 34px;
     border-radius: 50%;
     background: rgba(6,6,6,.75);
     border: 1px solid var(--smoke-2);
     backdrop-filter: blur(10px);
     color: var(--ivory-50);
     font-size: 13px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-base) var(--ease);
   }
   .card-wishlist:hover,
   .card-wishlist.active {
     color: #ff7070;
     border-color: rgba(255,112,112,.5);
     background: rgba(255,112,112,.1);
   }
   
   /* Card overlay on hover */
   .card-img-overlay {
     position: absolute;
     inset: 0;
     background: linear-gradient(180deg, transparent 30%, rgba(6,6,6,.85) 100%);
     opacity: 0;
     transition: opacity .5s var(--ease);
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 12px;
     z-index: 2;
   }
   .product-card:hover .card-img-overlay { opacity: 1; }
   
   .card-overlay-btn {
     width: 44px; height: 44px;
     border-radius: 50%;
     background: var(--glass-bg);
     backdrop-filter: blur(10px);
     border: 1px solid var(--glass-br-2);
     color: var(--gold);
     font-size: 14px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-base) var(--ease);
     transform: translateY(12px);
     opacity: 0;
   }
   .product-card:hover .card-overlay-btn {
     transform: translateY(0);
     opacity: 1;
   }
   .product-card:hover .card-overlay-btn:nth-child(1) { transition-delay: .04s; }
   .product-card:hover .card-overlay-btn:nth-child(2) { transition-delay: .08s; }
   .card-overlay-btn:hover {
     background: var(--gold-a16);
     border-color: var(--gold);
     transform: scale(1.1) translateY(0) !important;
   }
   
   /* Card body */
   .card-body { padding: 22px 22px 20px; }
   
   .card-cat {
     font-family: var(--font-title);
     font-size: 7.5px;
     letter-spacing: 4px;
     color: var(--gold-dark);
     text-transform: uppercase;
     margin-bottom: 6px;
   }
   .card-name {
     font-family: var(--font-serif);
     font-size: 21px;
     font-weight: 500;
     color: var(--ivory);
     line-height: 1.15;
     margin-bottom: 8px;
   }
   .card-rating {
     display: flex;
     align-items: center;
     gap: 7px;
     margin-bottom: 11px;
   }
   .stars { font-size: 11px; letter-spacing: 1px; }
   .rating-num {
     font-size: 11px;
     color: var(--ivory-50);
     letter-spacing: .3px;
   }
   .card-desc {
     font-size: 12.5px;
     font-weight: 300;
     color: var(--ivory-50);
     line-height: 1.75;
     margin-bottom: 15px;
     overflow: hidden;
     display: -webkit-box;
     -webkit-line-clamp: 2;
     line-clamp: 2;
     -webkit-box-orient: vertical;
   }
   
   /* Price */
   .card-price-row {
     display: flex;
     align-items: baseline;
     gap: 10px;
     margin-bottom: 16px;
   }
   .card-price {
     font-family: var(--font-serif);
     font-size: 27px;
     font-weight: 500;
     color: var(--gold);
     line-height: 1;
     letter-spacing: -.3px;
   }
   .card-price-orig {
     font-size: 13px;
     color: var(--ivory-30);
     text-decoration: line-through;
   }
   .card-discount {
     margin-left: auto;
     background: var(--red-sale-bg);
     border: 1px solid var(--red-sale-br);
     color: #e87575;
     font-family: var(--font-title);
     font-size: 8px;
     letter-spacing: 1px;
     padding: 3px 9px;
     border-radius: var(--r-xs);
   }
   
   /* Sizes */
   .card-sizes { margin-bottom: 14px; }
   .sizes-title {
     font-family: var(--font-title);
     font-size: 8px;
     letter-spacing: 3px;
     color: var(--ivory-30);
     text-transform: uppercase;
     margin-bottom: 8px;
   }
   .sizes-wrap { display: flex; gap: 5px; flex-wrap: wrap; }
   .size-chip {
     padding: 5px 11px;
     border-radius: var(--r-xs);
     border: 1px solid var(--smoke-2);
     background: transparent;
     color: var(--ivory-50);
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 1px;
     transition: all var(--t-base) var(--ease);
   }
   .size-chip:hover {
     border-color: var(--gold-a40);
     color: var(--gold);
     background: var(--gold-a6);
   }
   .size-chip.selected {
     border-color: var(--gold);
     background: var(--gold-a16);
     color: var(--gold);
     font-weight: 600;
   }
   
   /* Card actions */
   .card-actions { display: flex; gap: 8px; }
   .card-add-btn {
     flex: 1;
     padding: 11px 16px;
     border-radius: var(--r-sm);
     border: 1px solid var(--gold-dark);
     background: transparent;
     color: var(--gold);
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 2px;
     text-transform: uppercase;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     transition: all .35s var(--ease);
     position: relative;
     overflow: hidden;
   }
   .card-add-btn::before {
     content: '';
     position: absolute;
     inset: 0;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform .35s var(--ease);
     z-index: 0;
   }
   .card-add-btn:hover::before { transform: scaleX(1); }
   .card-add-btn:hover { color: var(--void); border-color: var(--gold); }
   .card-add-btn span,
   .card-add-btn i { position: relative; z-index: 1; }
   
   .card-quick-buy {
     width: 42px;
     border-radius: var(--r-sm);
     background: var(--gold);
     color: var(--void);
     font-size: 15px;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     transition: all var(--t-base) var(--ease);
   }
   .card-quick-buy:hover {
     background: var(--gold-bright);
     transform: translateY(-2px);
     box-shadow: 0 6px 20px rgba(201,168,76,.35);
   }
   
   /* No results */
   .no-results {
     text-align: center;
     padding: 100px 24px;
     display: none;
   }
   .no-results.visible { display: block; }
   .no-results-icon {
     font-size: 52px;
     color: var(--ivory-10);
     margin-bottom: 20px;
   }
   .no-results-title {
     font-family: var(--font-serif);
     font-size: 34px;
     font-weight: 400;
     color: var(--ivory-30);
     margin-bottom: 10px;
   }
   .no-results-text {
     font-size: 13px;
     color: var(--ivory-30);
     margin-bottom: 24px;
   }
   
   /* ── BUTTONS ──────────────────────────────────────────────────────── */
   .btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     padding: 14px 32px;
     border-radius: var(--r-full);
     font-family: var(--font-title);
     font-size: 9.5px;
     letter-spacing: 3px;
     text-transform: uppercase;
     transition: all .4s var(--ease);
     position: relative;
     overflow: hidden;
   }
   .btn--sm { padding: 10px 22px; font-size: 8.5px; }
   
   .btn-shine {
     position: absolute;
     top: 0; left: -120%;
     width: 50%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent);
     transform: skewX(-15deg);
     transition: left .7s ease;
     pointer-events: none;
   }
   .btn:hover .btn-shine { left: 160%; }
   
   .btn--gold {
     background: linear-gradient(135deg, var(--gold-dark) 0%, var(--gold) 50%, var(--gold-dark) 100%);
     background-size: 200% 200%;
     background-position: 0% 50%;
     color: var(--void);
     box-shadow: 0 4px 24px rgba(201,168,76,.28), inset 0 1px 0 rgba(255,255,255,.12);
     animation: goldShimmer 5s ease-in-out infinite;
   }
   @keyframes goldShimmer {
     0%, 100% { background-position: 0% 50%; }
     50%       { background-position: 100% 50%; }
   }
   .btn--gold:hover {
     transform: translateY(-3px);
     box-shadow: 0 12px 40px rgba(201,168,76,.4);
   }
   
   .btn--outline {
     background: transparent;
     color: var(--gold);
     border: 1px solid var(--gold-a40);
   }
   .btn--outline:hover {
     background: var(--gold-a10);
     border-color: var(--gold);
     transform: translateY(-3px);
   }
   
   .btn--wa {
     background: linear-gradient(135deg, var(--green-wa), var(--green-wa-2));
     color: white;
     box-shadow: 0 4px 20px rgba(37,211,102,.22);
   }
   .btn--wa:hover {
     transform: translateY(-2px);
     box-shadow: 0 10px 36px rgba(37,211,102,.4);
   }
   
   /* ── GUARANTEES ───────────────────────────────────────────────────── */
   .guarantees-section {
     background: var(--onyx);
     border-top: 1px solid var(--smoke);
     border-bottom: 1px solid var(--smoke);
     padding: 80px 80px;
     position: relative;
     overflow: hidden;
   }
   .guarantees-section::before {
     content: '';
     position: absolute;
     top: 50%; left: 50%;
     transform: translate(-50%, -50%);
     width: 800px; height: 800px;
     background: radial-gradient(circle, var(--gold-a6) 0%, transparent 65%);
     pointer-events: none;
   }
   .guarantees-inner {
     max-width: 1440px;
     margin: 0 auto;
   }
   .guarantees-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 1px;
     background: var(--smoke);
     border: 1px solid var(--smoke);
     border-radius: var(--r-md);
     overflow: hidden;
   }
   
   .guarantee-card {
     background: var(--onyx);
     padding: 40px 28px;
     text-align: center;
     position: relative;
     transition: background var(--t-base);
     overflow: hidden;
   }
   .guarantee-card:hover { background: var(--charcoal); }
   
   .guarantee-icon-wrap {
     position: relative;
     display: inline-block;
     margin-bottom: 20px;
   }
   .guarantee-icon {
     width: 56px; height: 56px;
     border: 1px solid var(--glass-br-2);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 20px;
     color: var(--gold);
     background: var(--gold-a6);
     transition: all var(--t-base);
     position: relative;
     z-index: 1;
   }
   .guarantee-icon-glow {
     position: absolute;
     top: 50%; left: 50%;
     transform: translate(-50%, -50%);
     width: 80px; height: 80px;
     background: radial-gradient(circle, var(--gold-a10) 0%, transparent 65%);
     border-radius: 50%;
     transition: all var(--t-base);
   }
   .guarantee-card:hover .guarantee-icon {
     background: var(--gold);
     color: var(--void);
     box-shadow: 0 0 28px rgba(201,168,76,.4);
   }
   .guarantee-card:hover .guarantee-icon-glow {
     width: 100px; height: 100px;
     background: radial-gradient(circle, var(--gold-a16) 0%, transparent 65%);
   }
   
   .guarantee-title {
     font-family: var(--font-title);
     font-size: 10px;
     letter-spacing: 2.5px;
     color: var(--ivory);
     text-transform: uppercase;
     margin-bottom: 10px;
   }
   .guarantee-desc {
     font-size: 12.5px;
     font-weight: 300;
     color: var(--ivory-50);
     line-height: 1.7;
   }
   .guarantee-line {
     position: absolute;
     bottom: 0; left: 50%;
     transform: translateX(-50%);
     width: 0; height: 1px;
     background: var(--gold);
     transition: width var(--t-slow) var(--ease);
   }
   .guarantee-card:hover .guarantee-line { width: 60%; }
   
   /* Scroll reveal */
   .scroll-reveal {
     opacity: 0;
     transform: translateY(24px);
     transition: opacity var(--t-xslow) var(--ease), transform var(--t-xslow) var(--ease);
     transition-delay: var(--reveal-delay, 0s);
   }
   .scroll-reveal.visible {
     opacity: 1;
     transform: translateY(0);
   }
   
   /* ── ABOUT SECTION ────────────────────────────────────────────────── */
   .about-section {
     padding: 100px 80px;
     position: relative;
     overflow: hidden;
   }
   .about-section::before {
     content: '';
     position: absolute;
     right: 0; top: 0;
     width: 40%;
     height: 100%;
     background: linear-gradient(90deg, transparent, var(--gold-a6));
     pointer-events: none;
   }
   .about-inner {
     max-width: 1440px;
     margin: 0 auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 80px;
     align-items: center;
   }
   .about-text {
     font-size: 14px;
     font-weight: 300;
     color: var(--ivory-50);
     line-height: 1.9;
     margin-bottom: 16px;
   }
   .about-cta { margin-top: 32px; }
   
   .about-stats-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 2px;
     background: var(--smoke);
     border: 1px solid var(--smoke);
     border-radius: var(--r-lg);
     overflow: hidden;
   }
   .about-stat {
     background: var(--onyx);
     padding: 36px 28px;
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     transition: background var(--t-base);
   }
   .about-stat:hover { background: var(--charcoal); }
   .about-stat-num {
     font-family: var(--font-serif);
     font-size: 48px;
     font-weight: 500;
     color: var(--gold);
     line-height: 1;
     letter-spacing: -1px;
   }
   .about-stat-num sup {
     font-size: .5em;
     color: var(--gold-300);
     vertical-align: super;
   }
   .about-stat-label {
     font-family: var(--font-title);
     font-size: 8px;
     letter-spacing: 2.5px;
     color: var(--ivory-30);
     text-transform: uppercase;
     margin-top: 8px;
   }
   
   /* ── FOOTER ───────────────────────────────────────────────────────── */
   .site-footer {
     background: var(--abyss);
     border-top: 1px solid var(--smoke);
     position: relative;
     overflow: hidden;
   }
   .footer-deco {
     position: absolute;
     top: 0; left: 50%;
     transform: translateX(-50%);
     width: 1px;
     height: 40px;
     background: linear-gradient(180deg, var(--gold-a40), transparent);
   }
   .footer-inner {
     max-width: 1440px;
     margin: 0 auto;
     padding: 80px 80px 0;
   }
   .footer-top {
     display: grid;
     grid-template-columns: 2fr 1fr 1fr 1fr;
     gap: 60px;
     padding-bottom: 64px;
     border-bottom: 1px solid var(--smoke);
   }
   
   .footer-logo {
     display: flex;
     align-items: center;
     gap: 12px;
     margin-bottom: 20px;
   }
   .footer-logo-emblem { width: 36px; height: 36px; flex-shrink: 0; }
   .footer-logo-emblem svg { width: 100%; height: 100%; }
   .footer-logo-name {
     font-family: var(--font-title);
     font-size: 14px;
     letter-spacing: 4px;
     color: var(--gold);
     text-transform: uppercase;
   }
   .footer-logo-sub {
     font-size: 8px;
     letter-spacing: 3px;
     color: var(--ivory-30);
     text-transform: uppercase;
     margin-top: 2px;
   }
   .footer-brand-desc {
     font-size: 12.5px;
     font-weight: 300;
     color: var(--ivory-50);
     line-height: 1.85;
     margin-bottom: 24px;
     max-width: 280px;
   }
   .footer-social {
     display: flex;
     gap: 8px;
   }
   .social-btn {
     width: 38px; height: 38px;
     border-radius: 50%;
     border: 1px solid var(--smoke-2);
     color: var(--ivory-30);
     font-size: 13px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-base) var(--ease);
   }
   .social-btn:hover {
     border-color: var(--gold);
     color: var(--gold);
     background: var(--gold-a6);
     transform: translateY(-2px);
   }
   
   .footer-col-title {
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 4.5px;
     color: var(--gold);
     text-transform: uppercase;
     margin-bottom: 22px;
     padding-bottom: 12px;
     border-bottom: 1px solid var(--smoke);
   }
   .footer-links {
     display: flex;
     flex-direction: column;
     gap: 0;
   }
   .footer-links li a,
   .footer-links li span,
   .footer-links li button {
     display: flex;
     align-items: center;
     gap: 9px;
     font-size: 12.5px;
     font-weight: 300;
     color: var(--ivory-50);
     padding: 8px 0;
     border-bottom: 1px solid var(--ivory-05);
     transition: all var(--t-base);
     width: 100%;
     text-align: left;
     background: none;
     border-left: none;
     border-right: none;
     border-top: none;
   }
   .footer-links li:last-child a,
   .footer-links li:last-child span,
   .footer-links li:last-child button { border-bottom: none; }
   .footer-links li a:hover,
   .footer-links li button:hover {
     color: var(--gold);
     padding-left: 5px;
   }
   .footer-links li a i,
   .footer-links li span i,
   .footer-links li button i {
     color: var(--gold-dark);
     font-size: 11px;
     width: 14px;
     flex-shrink: 0;
   }
   .footer-links--contact li a i,
   .footer-links--contact li span i { color: var(--gold); }
   
   .footer-wa-btn {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
     margin-top: 18px;
     padding: 10px 18px;
     background: rgba(37,211,102,.08);
     border: 1px solid rgba(37,211,102,.2);
     border-radius: var(--r-sm);
     color: var(--green-wa);
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 2px;
     text-transform: uppercase;
     transition: all var(--t-base);
   }
   .footer-wa-btn:hover {
     background: rgba(37,211,102,.14);
     border-color: rgba(37,211,102,.4);
     transform: translateY(-2px);
   }
   
   .footer-bottom {
     padding: 24px 0 32px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 16px;
     flex-wrap: wrap;
   }
   .footer-copy {
     font-size: 11px;
     color: var(--ivory-30);
     letter-spacing: .5px;
   }
   .gold-text { color: var(--gold); }
   .footer-badges { display: flex; gap: 8px; flex-wrap: wrap; }
   .footer-badge {
     display: flex;
     align-items: center;
     gap: 6px;
     font-family: var(--font-title);
     font-size: 8px;
     letter-spacing: 1.5px;
     text-transform: uppercase;
     color: var(--ivory-30);
     background: var(--charcoal);
     border: 1px solid var(--smoke-2);
     padding: 5px 12px;
     border-radius: var(--r-full);
   }
   .footer-badge i { color: var(--gold); font-size: 9px; }
   
   /* ── CART DRAWER ──────────────────────────────────────────────────── */
   .cart-overlay {
     position: fixed;
     inset: 0;
     background: rgba(0,0,0,.82);
     z-index: 5000;
     opacity: 0;
     pointer-events: none;
     transition: opacity .4s var(--ease);
     backdrop-filter: blur(6px);
     -webkit-backdrop-filter: blur(6px);
   }
   .cart-overlay.open {
     opacity: 1;
     pointer-events: all;
   }
   .cart-drawer {
     position: fixed;
     top: 0; right: 0;
     width: 100%;
     max-width: 460px;
     height: 100svh;
     background: var(--obsidian);
     border-left: 1px solid var(--glass-br);
     z-index: 5001;
     display: flex;
     flex-direction: column;
     transform: translateX(100%);
     transition: transform var(--t-slow) var(--ease);
     box-shadow: -24px 0 80px rgba(0,0,0,.9);
     will-change: transform;
   }
   .cart-overlay.open .cart-drawer { transform: translateX(0); }
   
   .cart-header {
     padding: 26px 28px;
     border-bottom: 1px solid var(--smoke);
     display: flex;
     align-items: center;
     justify-content: space-between;
     flex-shrink: 0;
   }
   .cart-header-info {
     display: flex;
     align-items: center;
     gap: 14px;
   }
   .cart-header-icon {
     width: 42px; height: 42px;
     border-radius: 50%;
     background: var(--gold-a10);
     border: 1px solid var(--glass-br-2);
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 16px;
     color: var(--gold);
   }
   .cart-title {
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 4px;
     color: var(--gold);
     text-transform: uppercase;
   }
   .cart-subtitle {
     font-family: var(--font-serif);
     font-size: 22px;
     font-weight: 500;
     color: var(--ivory);
     margin-top: 2px;
   }
   .cart-close {
     width: 38px; height: 38px;
     border-radius: 50%;
     border: 1px solid var(--smoke-2);
     color: var(--ivory-30);
     font-size: 15px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-base);
   }
   .cart-close:hover {
     border-color: var(--gold);
     color: var(--gold);
     background: var(--gold-a6);
   }
   
   /* Shipping progress */
   .cart-shipping-bar {
     padding: 14px 28px;
     background: var(--charcoal);
     border-bottom: 1px solid var(--smoke);
     flex-shrink: 0;
   }
   .cart-shipping-text {
     display: flex;
     align-items: center;
     gap: 8px;
     font-size: 11px;
     color: var(--ivory-50);
     margin-bottom: 8px;
   }
   .cart-shipping-text i { color: var(--gold); }
   .cart-shipping-progress {
     height: 2px;
     background: var(--smoke-2);
     border-radius: 2px;
     overflow: hidden;
   }
   .cart-shipping-fill {
     height: 100%;
     background: linear-gradient(90deg, var(--gold-dark), var(--gold));
     border-radius: 2px;
     transition: width .5s var(--ease);
     width: 0%;
   }
   
   /* Empty state */
   .cart-empty {
     flex: 1;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: 14px;
     padding: 48px 32px;
     text-align: center;
   }
   .cart-empty-icon {
     font-size: 56px;
     color: var(--ivory-10);
     margin-bottom: 4px;
   }
   .cart-empty-title {
     font-family: var(--font-serif);
     font-size: 22px;
     font-weight: 400;
     color: var(--ivory-50);
   }
   .cart-empty-desc {
     font-size: 12px;
     font-weight: 300;
     color: var(--ivory-30);
     line-height: 1.6;
     max-width: 220px;
   }
   
   /* Cart items scroll */
   .cart-items-scroll {
     flex: 1;
     overflow-y: auto;
     padding: 20px 28px;
     display: flex;
     flex-direction: column;
     gap: 12px;
   }
   .cart-items-scroll::-webkit-scrollbar { width: 2px; }
   .cart-items-scroll::-webkit-scrollbar-thumb { background: var(--gold-dark); }
   
   /* Cart item */
   .cart-item {
     display: flex;
     gap: 14px;
     padding: 14px;
     background: var(--charcoal);
     border: 1px solid var(--smoke-2);
     border-radius: var(--r-md);
     transition: all var(--t-base);
     animation: cartItemIn .35s var(--ease-bounce);
   }
   @keyframes cartItemIn {
     from { opacity: 0; transform: translateX(18px); }
     to   { opacity: 1; transform: translateX(0); }
   }
   .cart-item:hover { border-color: var(--glass-br-2); }
   
   .cart-item-img {
     width: 72px; height: 72px;
     border-radius: var(--r-sm);
     overflow: hidden;
     flex-shrink: 0;
     border: 1px solid var(--smoke-2);
     background: var(--smoke);
   }
   .cart-item-img img { width: 100%; height: 100%; object-fit: cover; }
   
   .cart-item-info { flex: 1; min-width: 0; }
   .cart-item-cat {
     font-family: var(--font-title);
     font-size: 7px;
     letter-spacing: 3px;
     color: var(--gold-dark);
     text-transform: uppercase;
     margin-bottom: 3px;
   }
   .cart-item-name {
     font-family: var(--font-serif);
     font-size: 15px;
     font-weight: 500;
     color: var(--ivory);
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
   }
   .cart-item-detail {
     font-size: 11px;
     color: var(--ivory-30);
     margin-top: 3px;
   }
   .cart-item-price {
     font-family: var(--font-serif);
     font-size: 17px;
     font-weight: 500;
     color: var(--gold);
     margin-top: 6px;
   }
   .cart-item-actions {
     display: flex;
     flex-direction: column;
     align-items: flex-end;
     justify-content: space-between;
   }
   .cart-remove {
     width: 26px; height: 26px;
     border-radius: 50%;
     border: 1px solid var(--smoke-2);
     color: var(--ivory-30);
     font-size: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: all var(--t-base);
   }
   .cart-remove:hover {
     border-color: rgba(255,112,112,.5);
     color: #ff7070;
     background: rgba(255,112,112,.08);
   }
   .qty-ctrl {
     display: flex;
     align-items: center;
     gap: 7px;
     background: var(--smoke);
     border-radius: var(--r-full);
     padding: 3px 10px;
     border: 1px solid var(--smoke-2);
   }
   .qty-btn {
     width: 20px; height: 20px;
     border-radius: 50%;
     color: var(--ivory-30);
     font-size: 15px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: color var(--t-fast);
     line-height: 1;
   }
   .qty-btn:hover { color: var(--gold); }
   .qty-num {
     font-family: var(--font-title);
     font-size: 12px;
     color: var(--ivory);
     min-width: 14px;
     text-align: center;
   }
   
   /* Cart footer */
   .cart-footer {
     padding: 20px 28px 28px;
     border-top: 1px solid var(--smoke);
     flex-shrink: 0;
   }
   .cart-summary { margin-bottom: 18px; }
   .cart-summary-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 7px 0;
   }
   .cart-summary-total {
     border-top: 1px solid var(--smoke-2);
     padding-top: 14px;
     margin-top: 6px;
   }
   .cart-sum-label {
     font-size: 12px;
     color: var(--ivory-50);
   }
   .cart-sum-val {
     font-size: 13px;
     color: var(--ivory);
   }
   .cart-total-label {
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 3px;
     color: var(--gold);
     text-transform: uppercase;
   }
   .cart-total-val {
     font-family: var(--font-serif);
     font-size: 28px;
     font-weight: 500;
     color: var(--gold-bright);
   }
   
   .cart-wa-btn {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 10px;
     width: 100%;
     padding: 16px;
     border-radius: var(--r-md);
     background: linear-gradient(135deg, var(--green-wa), var(--green-wa-2));
     color: white;
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 2.5px;
     text-transform: uppercase;
     transition: all .4s var(--ease);
     box-shadow: 0 4px 20px rgba(37,211,102,.2);
     margin-bottom: 10px;
     border: none;
   }
   .cart-wa-btn:hover {
     transform: translateY(-2px);
     box-shadow: 0 10px 36px rgba(37,211,102,.4);
   }
   .cart-wa-icon { font-size: 18px; }
   .cart-wa-arrow {
     margin-left: auto;
     font-size: 11px;
     opacity: .7;
   }
   .cart-clear-btn {
     width: 100%;
     padding: 10px;
     border-radius: var(--r-sm);
     border: 1px solid var(--smoke-2);
     background: transparent;
     color: var(--ivory-30);
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 2px;
     text-transform: uppercase;
     transition: all var(--t-base);
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 8px;
   }
   .cart-clear-btn:hover {
     border-color: rgba(255,112,112,.4);
     color: #ff7070;
   }
   
   /* ── MODAL ────────────────────────────────────────────────────────── */
   .modal-overlay {
     position: fixed;
     inset: 0;
     z-index: 4000;
     background: rgba(0,0,0,.92);
     backdrop-filter: blur(16px);
     -webkit-backdrop-filter: blur(16px);
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 20px;
     opacity: 0;
     pointer-events: none;
     transition: opacity .4s var(--ease);
   }
   .modal-overlay.open {
     opacity: 1;
     pointer-events: all;
   }
   .modal-container {
     background: var(--obsidian);
     border: 1px solid var(--glass-br-2);
     border-radius: var(--r-xl);
     max-width: 900px;
     width: 100%;
     max-height: 92vh;
     overflow-y: auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     position: relative;
     transform: scale(.9) translateY(24px);
     transition: transform var(--t-slow) var(--ease);
     box-shadow: var(--sh-modal);
     scrollbar-width: thin;
     scrollbar-color: var(--gold-dark) transparent;
   }
   .modal-overlay.open .modal-container {
     transform: scale(1) translateY(0);
   }
   .modal-container::-webkit-scrollbar { width: 2px; }
   .modal-container::-webkit-scrollbar-thumb { background: var(--gold-dark); }
   
   .modal-close {
     position: absolute;
     top: 18px; right: 18px;
     width: 38px; height: 38px;
     border-radius: 50%;
     border: 1px solid var(--smoke-2);
     color: var(--ivory-30);
     font-size: 15px;
     display: flex;
     align-items: center;
     justify-content: center;
     z-index: 10;
     transition: all var(--t-base);
     background: var(--obsidian);
   }
   .modal-close:hover {
     border-color: var(--gold);
     color: var(--gold);
     background: var(--gold-a6);
   }
   
   .modal-img-col {
     position: relative;
     min-height: 420px;
     overflow: hidden;
   }
   .modal-img-col img {
     width: 100%; height: 100%;
     object-fit: cover;
     border-radius: var(--r-xl) 0 0 var(--r-xl);
   }
   .modal-img-col::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(135deg, transparent 50%, rgba(6,6,6,.7) 100%);
     border-radius: var(--r-xl) 0 0 var(--r-xl);
     pointer-events: none;
   }
   
   .modal-info-col {
     padding: 40px 36px;
     display: flex;
     flex-direction: column;
   }
   .modal-cat {
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 5px;
     color: var(--gold);
     text-transform: uppercase;
     margin-bottom: 10px;
   }
   .modal-name {
     font-family: var(--font-serif);
     font-size: 32px;
     font-weight: 500;
     color: var(--ivory);
     line-height: 1.05;
     letter-spacing: -.3px;
     margin-bottom: 14px;
   }
   .modal-rating {
     display: flex;
     align-items: center;
     gap: 8px;
     margin-bottom: 20px;
   }
   .modal-rating-txt {
     font-size: 11px;
     color: var(--ivory-50);
     letter-spacing: .3px;
   }
   .modal-desc {
     font-size: 13px;
     font-weight: 300;
     color: var(--ivory-50);
     line-height: 1.85;
     margin-bottom: 20px;
     border-top: 1px solid var(--smoke);
     padding-top: 18px;
   }
   .modal-price-row {
     display: flex;
     align-items: baseline;
     gap: 12px;
     margin-bottom: 22px;
   }
   .modal-price {
     font-family: var(--font-serif);
     font-size: 38px;
     font-weight: 500;
     color: var(--gold);
     letter-spacing: -.5px;
   }
   .modal-price-orig {
     font-size: 15px;
     color: var(--ivory-30);
     text-decoration: line-through;
   }
   
   .modal-sizes { margin-bottom: 22px; }
   .modal-sizes-label {
     font-family: var(--font-title);
     font-size: 8px;
     letter-spacing: 3.5px;
     color: var(--ivory-50);
     text-transform: uppercase;
     margin-bottom: 10px;
   }
   .modal-sizes-wrap { display: flex; gap: 8px; flex-wrap: wrap; }
   .modal-size-btn {
     padding: 8px 16px;
     border-radius: var(--r-xs);
     border: 1px solid var(--smoke-2);
     background: transparent;
     color: var(--ivory-50);
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 1px;
     transition: all var(--t-base) var(--ease);
   }
   .modal-size-btn:hover {
     border-color: var(--gold-a40);
     color: var(--gold);
     background: var(--gold-a6);
   }
   .modal-size-btn.selected {
     border-color: var(--gold);
     background: var(--gold-a16);
     color: var(--gold);
   }
   
   .modal-actions {
     display: flex;
     flex-direction: column;
     gap: 10px;
     margin-top: auto;
     padding-top: 16px;
   }
   .modal-add-btn {
     padding: 14px 20px;
     border-radius: var(--r-sm);
     border: 1px solid var(--gold-dark);
     background: transparent;
     color: var(--gold);
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 2px;
     text-transform: uppercase;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 9px;
     transition: all .35s var(--ease);
     position: relative;
     overflow: hidden;
   }
   .modal-add-btn::before {
     content: '';
     position: absolute;
     inset: 0;
     background: var(--gold);
     transform: scaleX(0);
     transform-origin: left;
     transition: transform .35s var(--ease);
     z-index: 0;
   }
   .modal-add-btn:hover::before { transform: scaleX(1); }
   .modal-add-btn:hover { color: var(--void); border-color: var(--gold); }
   .modal-add-btn i,
   .modal-add-btn span { position: relative; z-index: 1; }
   
   .modal-wa-btn {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 9px;
     padding: 14px 20px;
     border-radius: var(--r-sm);
     background: linear-gradient(135deg, var(--green-wa), var(--green-wa-2));
     color: white;
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 2px;
     text-transform: uppercase;
     transition: all .3s var(--ease);
     box-shadow: 0 4px 18px rgba(37,211,102,.2);
   }
   .modal-wa-btn:hover {
     transform: translateY(-2px);
     box-shadow: 0 8px 32px rgba(37,211,102,.4);
   }
   
   /* ── WA FLOAT BUTTON ──────────────────────────────────────────────── */
   .wa-float {
     position: fixed;
     bottom: 32px; right: 32px;
     z-index: 3000;
     width: 58px; height: 58px;
     border-radius: 50%;
     background: linear-gradient(135deg, var(--green-wa), var(--green-wa-2));
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 4px 24px rgba(37,211,102,.4);
     transition: all .4s var(--ease);
     text-decoration: none;
   }
   .wa-float:hover {
     transform: scale(1.1) translateY(-4px);
     box-shadow: 0 12px 40px rgba(37,211,102,.55);
   }
   .wa-float-icon { font-size: 26px; color: white; position: relative; z-index: 1; }
   .wa-float-tooltip {
     position: absolute;
     right: calc(100% + 12px);
     top: 50%;
     transform: translateY(-50%);
     background: var(--charcoal);
     border: 1px solid var(--glass-br-2);
     color: var(--ivory);
     font-family: var(--font-title);
     font-size: 8.5px;
     letter-spacing: 1.5px;
     text-transform: uppercase;
     padding: 7px 14px;
     border-radius: var(--r-full);
     white-space: nowrap;
     opacity: 0;
     pointer-events: none;
     transition: opacity var(--t-base);
     backdrop-filter: blur(10px);
   }
   .wa-float-tooltip::after {
     content: '';
     position: absolute;
     right: -5px; top: 50%;
     transform: translateY(-50%);
     border: 5px solid transparent;
     border-right: none;
     border-left-color: var(--glass-br-2);
   }
   .wa-float:hover .wa-float-tooltip { opacity: 1; }
   
   .wa-float::before {
     content: '';
     position: absolute;
     inset: -7px;
     border-radius: 50%;
     border: 1.5px solid rgba(37,211,102,.28);
     animation: waPulse 2.4s ease-out infinite;
   }
   @keyframes waPulse {
     0%   { transform: scale(1); opacity: .6; }
     100% { transform: scale(1.5); opacity: 0; }
   }
   
   /* ── TOAST ────────────────────────────────────────────────────────── */
   .lyp-toast {
     position: fixed;
     bottom: 100px;
     left: 50%;
     transform: translateX(-50%) translateY(8px);
     background: var(--charcoal);
     border: 1px solid var(--gold-a40);
     color: var(--ivory);
     font-family: var(--font-title);
     font-size: 9px;
     letter-spacing: 2.5px;
     text-transform: uppercase;
     padding: 13px 26px;
     border-radius: var(--r-full);
     z-index: 9999;
     white-space: nowrap;
     opacity: 0;
     pointer-events: none;
     transition: all .4s var(--ease);
     box-shadow: 0 4px 24px rgba(0,0,0,.7), 0 0 20px rgba(201,168,76,.08);
     backdrop-filter: blur(12px);
     display: flex;
     align-items: center;
     gap: 10px;
   }
   .lyp-toast.show {
     opacity: 1;
     transform: translateX(-50%) translateY(0);
   }
   .toast-icon { color: var(--gold); font-size: 11px; }
   
   /* ── RESPONSIVE ───────────────────────────────────────────────────── */
   @media (max-width: 1200px) {
     .catalog-section,
     .filters-section,
     .guarantees-section,
     .about-section { padding-left: 48px; padding-right: 48px; }
     .products-grid { grid-template-columns: repeat(2, 1fr); }
     .footer-inner { padding-left: 48px; padding-right: 48px; }
     .footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }
   }
   
   @media (max-width: 1024px) {
     .hero { grid-template-columns: 1fr; padding-top: 116px; }
     .hero-right { height: 52svh; }
     .hero-vline { display: none; }
     .hero-left { padding: 56px 48px 60px; }
     .header-nav { display: none; }
     .mobile-menu-btn { display: flex; }
     .mobile-nav { display: flex; }
     .about-inner { grid-template-columns: 1fr; gap: 48px; }
     .guarantees-grid { grid-template-columns: repeat(2, 1fr); }
   }
   
   @media (max-width: 768px) {
     .header-inner { padding: 0 20px; height: 64px; }
     .header-search { display: none; }
     .catalog-section,
     .filters-section,
     .guarantees-section,
     .about-section { padding-left: 20px; padding-right: 20px; }
     .footer-inner { padding: 48px 20px 0; }
     .footer-top { grid-template-columns: 1fr; gap: 28px; }
     .products-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
     .hero-left { padding: 40px 20px; }
     .hero-stats { gap: 0; }
     .modal-container { grid-template-columns: 1fr; }
     .modal-img-col { min-height: 240px; aspect-ratio: 16 / 9; }
     .modal-img-col img,
     .modal-img-col::after { border-radius: var(--r-xl) var(--r-xl) 0 0; }
     .modal-info-col { padding: 24px 24px 32px; }
     .cart-drawer { max-width: 100%; }
     .topbar-item:not(:first-child) { display: none; }
     .topbar-divider { display: none; }
     .filters-header { flex-direction: column; align-items: flex-start; }
   }
   
   @media (max-width: 480px) {
     .products-grid { grid-template-columns: 1fr; }
     .hero-title { font-size: 40px; }
     .hero-stats .stat-num { font-size: 32px; }
     .hero-actions { flex-direction: column; }
     .hero-actions .btn { width: 100%; justify-content: center; }
     .hero-trust { gap: 14px; }
     .logo-tagline { display: none; }
     .about-stats-grid { grid-template-columns: 1fr 1fr; }
     .guarantees-grid { grid-template-columns: 1fr; }
     .cart-drawer { border-radius: 0; }
     .slider-arrows { bottom: 48px; right: 16px; }
   }