:root{
  --bg:#f4f3f1; --ink:#141414; --muted:#8c8c87; --line:#e3e1dd;
  --gold:#b08d57; --gold-soft:#f4eede; --paper:#ffffff;
  --green:#1f7a3d; --green-bg:#e6f4ea; --amber:#9a6b1e; --amber-bg:#f4eede;
  --shadow:0 1px 3px rgba(0,0,0,.06),0 8px 30px rgba(0,0,0,.05);
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Inter",-apple-system,sans-serif;
  --r:14px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.container{max-width:1200px;margin:0 auto;padding:0 22px}
.muted{color:var(--muted)}
.loading{text-align:center;padding:80px 0;color:var(--muted)}
img{max-width:100%;display:block}

/* Fixed background logo — position:fixed => nešokinėja mobile scrollinant (#6) */
.bg-logo{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--serif);font-weight:700;font-size:22vw;color:#000;opacity:.025;
  letter-spacing:-.04em;white-space:nowrap;user-select:none;
}
.bg-logo span{color:var(--gold)}
.site-header,main,.site-footer{position:relative;z-index:1}

/* Header */
.site-header{position:sticky;top:0;background:rgba(244,243,241,.82);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);z-index:50}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px;gap:16px}
.brand{font-family:var(--serif);font-size:26px;font-weight:700;letter-spacing:-.02em}
.brand span{color:var(--ink)} .brand i{color:var(--gold);font-style:normal}
.main-nav{display:flex;gap:26px;font-size:14px;font-weight:500}
.main-nav a{color:var(--ink);opacity:.75;transition:.15s} .main-nav a:hover{opacity:1}
.header-actions{display:flex;align-items:center;gap:8px}
.icon-btn{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--paper);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink);transition:.15s}
.icon-btn:hover{border-color:var(--ink)}
.cart-count{position:absolute;top:-4px;right:-4px;background:var(--gold);color:#fff;font-size:10px;font-weight:700;min-width:17px;height:17px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:#fff;border:0;padding:13px 26px;border-radius:99px;font-family:var(--sans);font-size:14px;font-weight:600;cursor:pointer;transition:.18s}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn.gold{background:var(--gold)}
.btn.block{width:100%}
.btn.sm{padding:9px 16px;font-size:13px}

/* Hero scroller (#12) */
.hero{padding:34px 0 8px}
.hero h1{font-family:var(--serif);font-size:clamp(34px,6vw,64px);font-weight:700;letter-spacing:-.02em;line-height:1.05}
.hero p{color:var(--muted);max-width:520px;margin-top:12px}
.scroller{display:flex;gap:18px;overflow-x:auto;padding:26px 22px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.scroller::-webkit-scrollbar{height:6px}
.scroller::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px}
.scroll-card{scroll-snap-align:start;flex:0 0 230px}

/* Nav tiles (4 photos: women/men/sets/build) (#12) */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:30px 0 10px}
.tile{position:relative;aspect-ratio:3/4;border-radius:var(--r);overflow:hidden;background:#ddd9d4;box-shadow:var(--shadow);display:flex;align-items:flex-end;color:#fff}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.4s}
.tile:hover img{transform:scale(1.05)}
.tile .tile-label{position:relative;z-index:2;padding:16px 18px;font-family:var(--serif);font-size:22px;font-weight:600;text-shadow:0 1px 12px rgba(0,0,0,.5)}
.tile::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(transparent 40%,rgba(0,0,0,.55))}
.tile.placeholder{background:linear-gradient(135deg,#2a2a2a,#4a4138)}

/* Section heads */
.section{padding:44px 0}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:22px;gap:12px}
.section-head h2{font-family:var(--serif);font-size:32px;font-weight:600;letter-spacing:-.01em}

/* Catalog grid */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

/* Product card */
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.2s}
.card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.card .ph{aspect-ratio:1;background:#efece8 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60"><text x="50%" y="55%" font-size="34" text-anchor="middle" fill="%23cfc9c1">✿</text></svg>') center/40px no-repeat;position:relative}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card-body{padding:14px 15px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .brand-name{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.card .p-name{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.15}
.card .price{font-weight:600;margin-top:auto}
.card .price small{color:var(--muted);font-weight:400}
.card-actions{padding:0 15px 15px}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:3px 9px;border-radius:99px}
.badge.stock{background:var(--green-bg);color:var(--green)}      /* 1/3 day */
.badge.preorder{background:var(--amber-bg);color:var(--amber)}   /* 3/10 day */
.badge.out{background:#f6e6e6;color:#a3252b}
.badge.float{position:absolute;top:10px;left:10px;z-index:2;box-shadow:0 1px 6px rgba(0,0,0,.12)}

/* Set card — vizualiai išskirtas (#2) */
.card.set-card{border:1.5px solid var(--gold);background:linear-gradient(180deg,var(--gold-soft),var(--paper) 60%);position:relative}
.card.set-card::before{content:"RINKINYS";position:absolute;top:0;left:0;z-index:3;background:var(--gold);color:#fff;font-size:10px;font-weight:700;letter-spacing:.1em;padding:4px 12px;border-bottom-right-radius:10px}
.card.set-card .p-name{font-size:21px}
.set-badge{position:absolute;top:10px;right:10px;z-index:3;background:var(--ink);color:#fff;font-size:11px;font-weight:700;padding:3px 9px;border-radius:99px}

/* Product detail */
.pd{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:34px 0}
.pd .pd-img{aspect-ratio:1;background:#efece8;border-radius:var(--r);overflow:hidden}
.pd h1{font-family:var(--serif);font-size:40px;font-weight:700;line-height:1.05}
.pd .brand-name{text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-size:13px;margin-bottom:6px}
.vol-opts{display:flex;gap:10px;margin:18px 0}
.vol-opt{flex:1;border:1.5px solid var(--line);border-radius:12px;padding:12px;text-align:center;cursor:pointer;transition:.15s;background:var(--paper)}
.vol-opt:hover{border-color:var(--ink)}
.vol-opt.active{border-color:var(--gold);background:var(--gold-soft)}
.vol-opt.disabled{opacity:.4;cursor:not-allowed}
.vol-opt .v{font-weight:600} .vol-opt .pr{color:var(--muted);font-size:13px}
.notes{margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}

/* Cart */
.cart-wrap{display:grid;grid-template-columns:1fr 360px;gap:32px;padding:30px 0}
.cart-line{display:grid;grid-template-columns:72px 1fr auto;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.cart-line .thumb{width:72px;height:72px;border-radius:10px;background:#efece8;overflow:hidden}
.summary{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px;align-self:start;position:sticky;top:84px}
.summary .row{display:flex;justify-content:space-between;margin:8px 0}
.summary .total{font-size:20px;font-weight:700;border-top:1px solid var(--line);padding-top:14px;margin-top:14px}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:99px;overflow:hidden}
.qty button{width:30px;height:30px;border:0;background:transparent;cursor:pointer;font-size:16px}
.qty span{min-width:26px;text-align:center;font-weight:600}
.link-btn{background:none;border:0;color:var(--muted);cursor:pointer;text-decoration:underline;font-size:13px}

/* Checkout steps (#4) */
.steps{display:flex;gap:10px;justify-content:center;margin:24px 0 30px}
.step-dot{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;font-weight:600}
.step-dot .n{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px}
.step-dot.active{color:var(--ink)} .step-dot.active .n{border-color:var(--gold);background:var(--gold);color:#fff}
.step-dot.done .n{background:var(--ink);border-color:var(--ink);color:#fff}
.checkout-wrap{display:grid;grid-template-columns:1fr 360px;gap:32px;padding:10px 0 40px;max-width:980px;margin:0 auto}
.form-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:24px}
label.fl{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:14px 0 5px}
.inp{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;background:var(--paper)}
.inp:focus{outline:none;border-color:var(--gold)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.choice{border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;margin-top:10px;transition:.15s}
.choice:hover{border-color:var(--ink)} .choice.active{border-color:var(--gold);background:var(--gold-soft)}

/* Overlays (search + quiz) */
.overlay{position:fixed;inset:0;z-index:100;background:rgba(20,20,20,.45);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center;padding:8vh 16px}
.overlay.open{display:flex}
.search-panel,.quiz-panel{background:var(--paper);border-radius:18px;width:100%;max-width:560px;padding:22px;position:relative;box-shadow:var(--shadow)}
.search-panel input{width:100%;font-size:18px;padding:14px 16px;border:1px solid var(--line);border-radius:12px}
.overlay-close{position:absolute;top:14px;right:16px;background:none;border:0;font-size:26px;cursor:pointer;color:var(--muted)}
.search-results{margin-top:14px;max-height:50vh;overflow:auto}
.sr-item{display:flex;gap:12px;align-items:center;padding:10px;border-radius:10px;cursor:pointer}
.sr-item:hover{background:var(--bg)}
.sr-item .thumb{width:46px;height:46px;border-radius:8px;background:#efece8;overflow:hidden}

/* Quiz */
.quiz-panel h3{font-family:var(--serif);font-size:26px;margin-bottom:4px}
.quiz-q{margin-top:18px}
.quiz-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.quiz-opt{border:1.5px solid var(--line);border-radius:12px;padding:14px;cursor:pointer;text-align:center;transition:.15s}
.quiz-opt:hover{border-color:var(--ink)} .quiz-opt.active{border-color:var(--gold);background:var(--gold-soft)}
.quiz-progress{height:4px;background:var(--line);border-radius:99px;margin-top:14px;overflow:hidden}
.quiz-progress i{display:block;height:100%;background:var(--gold);transition:.3s}

/* Notices */
.notice{background:var(--amber-bg);color:var(--amber);border-radius:10px;padding:12px 14px;font-size:13px;margin:14px 0;display:flex;gap:8px}
.empty{text-align:center;padding:70px 20px;color:var(--muted)}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:12px 22px;border-radius:99px;opacity:0;transition:.25s;z-index:200;font-size:14px}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* Footer */
.site-footer{border-top:1px solid var(--line);margin-top:50px;background:rgba(255,255,255,.5)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px;padding:44px 0 24px}
.footer-brand{font-size:24px}
.footer-links{display:flex;flex-direction:column;gap:8px;font-size:14px}
.footer-links a{color:var(--muted)} .footer-links a:hover{color:var(--ink)}
.social-row{display:flex;gap:10px;margin-top:12px}
.social{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:16px;background:var(--paper);transition:.15s}
.social:hover{border-color:var(--ink)} .social-yt:hover{color:#ff0000;border-color:#ff0000}
.copyright{padding:18px 0 30px;font-size:13px;border-top:1px solid var(--line)}

/* Responsive */
@media(max-width:900px){
  .grid,.tiles{grid-template-columns:repeat(2,1fr)}
  .pd,.cart-wrap,.checkout-wrap{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .main-nav{display:none}
  .summary{position:static}
  .bg-logo{font-size:40vw}
}
@media(max-width:520px){
  .grid,.tiles{grid-template-columns:1fr 1fr}
  .quiz-opts{grid-template-columns:1fr}
  .scroll-card{flex-basis:200px}
}