/* ════════════════════════════════════════════════════
   VreauPretBun.ro — Design v6  (sidebar layout, modern)
   Sidebar + main content, tree-style nav, clean
════════════════════════════════════════════════════ */

/* ─── SIDEBAR LAYOUT ─── */
:root {
  --sidebar-w: 248px;
}

/* ══ CATEGORY FILTER PANEL ══════════════════════════════════════════════ */
.cat-layout{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:0;
  align-items:start;
}
.cat-filter-panel{
  position:sticky;
  top:var(--header-h,60px);
  max-height:calc(100vh - var(--header-h,60px) - 2rem);
  overflow-y:auto;
  border-right:1px solid #e2e8f0;
  padding:1rem .9rem 2rem;
  background:#fafbfd;
  scrollbar-width:thin;
  border-radius:0 0 0 8px;
}
.cat-filter-panel::-webkit-scrollbar{width:4px}
.cat-filter-panel::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:2px}
.cat-main{
  min-width:0;
  padding:0 0 0 1rem;
}
/* head row (title + reset btn) */
.cfp-head{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:.6rem;border-bottom:1px solid #e2e8f0;
  margin-bottom:.8rem;
}
.cfp-title{font-size:.9rem;font-weight:700;color:#0f172a}
.cfp-reset-btn{
  font-size:.75rem;color:#ef4444;background:none;border:none;
  cursor:pointer;font-family:inherit;padding:.15rem .4rem;border-radius:4px;
}
.cfp-reset-btn:hover{background:#fee2e2}
/* individual sections */
.cfp-section{margin-bottom:1.1rem}
.cfp-section-title{
  font-size:.64rem;font-weight:800;color:#64748b;
  text-transform:uppercase;letter-spacing:.1em;
  display:block;padding:.3rem 0 .5rem;
}
/* Checkbox options */
.cfp-opt-wrap{display:flex;flex-direction:column;gap:.25rem}
.cfp-opt-label{
  display:flex;align-items:center;gap:.45rem;
  font-size:.83rem;color:#334155;
  cursor:pointer;border-radius:6px;
  padding:.28rem .4rem;transition:background .1s;
  user-select:none;
}
.cfp-opt-label:hover{background:#f1f5f9}
.cfp-opt-label.selected{color:#1d4ed8;font-weight:600;background:#eff6ff}
.cfp-opt{accent-color:#1d4ed8;width:15px;height:15px;flex-shrink:0;cursor:pointer}
.cfp-count{margin-left:auto;font-size:.7rem;color:#94a3b8;font-weight:600}
/* Price range chips */
.cfp-price-chips{display:flex;flex-direction:column;gap:.28rem;margin-bottom:.6rem}
.cfp-price-chip{
  font-size:.82rem;color:#334155;background:none;
  border:1px solid #e2e8f0;border-radius:6px;
  padding:.32rem .6rem;cursor:pointer;text-align:left;
  font-family:inherit;transition:all .12s;
}
.cfp-price-chip:hover{background:#eff6ff;border-color:#bfdbfe}
.cfp-price-chip.active{background:#eff6ff;border-color:#1d4ed8;color:#1d4ed8;font-weight:600}
.cfp-price-custom{display:flex;gap:.4rem;align-items:center;margin-top:.4rem}
.cfp-price-input{
  width:62px;border:1px solid #e2e8f0;border-radius:5px;
  padding:.28rem .45rem;font-size:.8rem;font-family:inherit;color:#334155;
}
.cfp-price-input:focus{border-color:#1d4ed8;outline:none}
.cfp-price-sep{font-size:.76rem;color:#94a3b8}
/* "show more" toggle */
.cfp-show-more{
  font-size:.76rem;color:#1d4ed8;background:none;border:none;
  cursor:pointer;font-family:inherit;padding:.2rem 0;
}
.cfp-show-more:hover{text-decoration:underline}
/* Mobile toggle button */
.cfp-mobile-bar{display:none;padding:.4rem 0 .65rem}
.cfp-mobile-btn{
  display:flex;align-items:center;gap:.45rem;
  background:#fff;border:1px solid #e2e8f0;border-radius:8px;
  padding:.5rem .95rem;font-size:.87rem;font-weight:600;color:#334155;
  cursor:pointer;font-family:inherit;transition:all .13s;
}
.cfp-mobile-btn:hover{border-color:#1d4ed8;color:#1d4ed8}
.cfp-badge{
  background:#1d4ed8;color:#fff;border-radius:100px;
  padding:.08rem .4rem;font-size:.69rem;font-weight:700;
  margin-left:.1rem;
}
/* Mobile backdrop */
.cfp-backdrop{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.38);z-index:199;
}
.cfp-backdrop.open{display:block}
/* Mobile: full-screen slide-in panel */
@media(max-width:900px){
  .cat-layout{grid-template-columns:1fr}
  .cfp-mobile-bar{display:block}
  .cat-filter-panel{
    position:fixed;left:0;top:0;
    width:285px;height:100vh;max-height:100vh;
    z-index:200;border-right:1px solid #e2e8f0;
    box-shadow:4px 0 24px rgba(0,0,0,.15);
    border-radius:0;
    transform:translateX(-100%);
    transition:transform .24s ease;
    background:#fff;padding:1.4rem 1rem 2rem;
  }
  .cat-filter-panel.open{transform:translateX(0)}
  .cat-main{padding:0}
}
/* ══ END CATEGORY FILTER PANEL ══════════════════════════════════════════ */
.layout-wrap{
  display:grid;
  grid-template-columns: var(--sidebar-w) 1fr;
  gap:0;
  max-width:1480px;
  margin:0 auto;
  align-items:start;
  min-height:calc(100vh - var(--header-h));
}
.sidebar{
  position:sticky;
  top:var(--header-h);
  align-self:start;
  height:calc(100vh - var(--header-h));
  overflow-y:auto;
  background:#fff;
  border-right:1px solid #e2e8f0;
  padding:1.2rem 1rem 2rem;
  display:flex;flex-direction:column;gap:1.15rem;
  scrollbar-width:thin;
  /* Smooth collapse transition */
  transition:transform .32s cubic-bezier(.4,0,.2,1), box-shadow .32s ease;
  will-change:transform;
}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}
.sidebar-close{display:none}

/* ── Peek-tab: fixed pull-handle at left edge, visible when sidebar is peeked ── */
.sb-peek-tab{
  display:none; /* hidden by default; JS adds .visible */
  position:fixed;
  left:0; top:50%;
  transform:translateY(-50%);
  width:20px; height:52px;
  background:var(--navy3,#1e3a5f);
  color:#fff;
  border-radius:0 9px 9px 0;
  align-items:center; justify-content:center;
  cursor:pointer;
  z-index:203; /* above sidebar overlay */
  transition:background .15s, width .15s, opacity .2s;
  box-shadow:3px 0 12px rgba(0,0,0,.22);
  opacity:.85;
}
.sb-peek-tab.visible{display:flex}
.sb-peek-tab:hover{background:var(--navy2,#162d4a);width:26px;opacity:1}
.sb-peek-tab.pinned svg{transform:rotate(180deg)}
.sb-peek-tab svg{transition:transform .22s; pointer-events:none}

/* ── Layout-wrap: sidebar column stays in DOM but #main spans all cols ── */
.layout-wrap.sb-peek > #main{
  grid-column: 1 / -1;   /* span full width — no grid-template change needed */
}

/* ── Peeked sidebar: slide fully off-screen left ── */
.sidebar--peek{
  position:fixed !important;
  left:0;
  top:var(--header-h);
  width:var(--sidebar-w);        /* explicit width — fixed removes it from grid flow */
  height:calc(100vh - var(--header-h));
  z-index:202;
  overflow-y:hidden;
  overflow-x:hidden;
  transform:translateX(-100%);
  box-shadow:none;
  transition:transform .3s cubic-bezier(.4,0,.2,1), box-shadow .3s ease;
}
/* Expand: JS adds .sb-open class */
.sidebar--peek.sb-open{
  transform:translateX(0);
  overflow-y:auto;
  box-shadow:8px 0 44px rgba(0,0,0,.22);
}
/* Dedicated peek backdrop — dims product cards behind sidebar overlay */
.peek-backdrop{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.28);
  z-index:196; /* above content (0), below megamenu (198) and sidebar (202) */
  cursor:pointer; /* clicking closes the sidebar */
}
.peek-backdrop.active{ display:block; }

.sb-deals{
  background:#fef2f2;color:#b91c1c;
  border:1px solid #fecaca;border-radius:10px;
  padding:.7rem .95rem;font-size:.85rem;font-weight:700;
  cursor:pointer;text-align:left;font-family:inherit;
  transition:all .14s;letter-spacing:.005em;
}
.sb-deals:hover{background:#fee2e2;border-color:#fca5a5;color:#991b1b}
.sb-deals.active{background:#dc2626;color:#fff;border-color:#dc2626}

.sb-section-title{
  font-size:.62rem;font-weight:800;color:#94a3b8;
  text-transform:uppercase;letter-spacing:.13em;
  padding:.4rem 0 .1rem;
}

.sidebar-nav{display:flex;flex-direction:column;gap:.2rem}
.sb-skel span{display:block;height:30px;border-radius:8px;background:#f1f5f9;margin-bottom:.32rem;animation:shimmer 1.4s infinite;background-size:200% 100%;background-image:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9 50%,#e2e8f0 75%)}

/* Top-level parent */
.sb-parent{
  background:transparent;border:none;
  color:#334155;font-size:.86rem;font-weight:600;
  padding:.6rem .75rem;border-radius:8px;
  cursor:pointer;text-align:left;font-family:inherit;
  display:flex;align-items:center;gap:.6rem;
  transition:background .13s,color .13s;
  width:100%;
}
.sb-parent:hover{background:#f1f5fc;color:#0f172a}
.sb-parent.open{background:#eff6ff;color:#1d4ed8;font-weight:700}
.sb-parent-icon{flex-shrink:0;width:1.6rem;display:flex;align-items:center;justify-content:center}
.cat-svg-icon{display:flex;align-items:center;justify-content:center}
.cat-svg-icon svg{width:1.1rem;height:1.1rem;stroke:currentColor;display:block}
.sb-parent.open .cat-svg-icon svg,.sb-parent:hover .cat-svg-icon svg{stroke:#1d4ed8}
.mm-icon .cat-svg-icon svg{width:1.35rem;height:1.35rem}
.pill-svg-icon{display:inline-flex;align-items:center;margin-right:.3rem;vertical-align:middle}
.pill-svg-icon svg{width:.9rem;height:.9rem}
.sb-parent-chevron{margin-left:auto;font-size:.7rem;color:#cbd5e1;transition:transform .18s}
.sb-parent.open .sb-parent-chevron{transform:rotate(90deg);color:#1d4ed8}

/* Sub-items — INLINE only on mobile drawer (desktop uses megamenu) */
.sb-subs{
  display:none;flex-direction:column;gap:.1rem;
  padding:.15rem 0 .35rem 2rem;border-left:1.5px solid #e2e8f0;
  margin-left:1.2rem;
}
/* Mobile: inline accordion */
@media(max-width:768px){
  .sb-parent.open + .sb-subs{display:flex}
}
/* ══ PARENT VIEW — grid of sub-category cards (Cel.ro style) ══ */
.parent-view-head{
  display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap;
  padding-bottom:1rem;border-bottom:2px solid var(--border);
  margin-bottom:.5rem;
}
.parent-view-title{
  font-size:1.65rem;font-weight:800;color:var(--text);
  letter-spacing:-.025em;display:flex;align-items:center;gap:.6rem;
}
.parent-view-title-icon{font-size:1.8rem}
.parent-view-sub{font-size:.85rem;color:var(--muted);font-weight:600}

.parent-grid{
  display:block;
}
.parent-grid > .pg-card{
  /* Régi flat-card fallback (ha nincs csoport, akkor a JS direkt kártyákat tölt — már nem teszi, de védőháló) */
  display:inline-flex;
}
.pg-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  padding:1.4rem 1rem;
  display:flex;flex-direction:column;align-items:center;gap:.6rem;
  text-align:center;
  cursor:pointer;font-family:inherit;
  transition:all .15s;
  text-decoration:none;
  color:var(--text);
}
.pg-card:hover{
  border-color:#1e40af;
  box-shadow:0 6px 16px rgba(30,64,175,.12);
  transform:translateY(-2px);
}
.pg-card-img{
  width:120px;height:120px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  font-size:2.3rem;
  overflow:hidden;
  transition:transform .15s,border-color .15s;
}
.pg-card:hover .pg-card-img{
  border-color:#1e40af;
  transform:scale(1.04);
}
.pg-card-photo{
  max-width:100%;max-height:100%;
  width:auto;height:auto;
  object-fit:contain;
  padding:.55rem;
}
.pg-card-label{
  font-size:.92rem;font-weight:700;color:var(--text);
  line-height:1.3;letter-spacing:-.01em;
}
.pg-card-count{
  font-size:.72rem;color:var(--muted);font-weight:600;
  margin-top:-.15rem;
}

@media(max-width:768px){
  .parent-grid{grid-template-columns:repeat(2,1fr);gap:.6rem}
  .pg-card{padding:1rem .7rem}
  .pg-card-img{width:60px;height:60px;font-size:1.85rem}
  .pg-card-label{font-size:.82rem}
  .parent-view-title{font-size:1.25rem}
}

/* ══ MEGAMENU (desktop, jobbra ki) ══════════════════ */
.sb-megamenu{
  position:fixed;
  left:var(--sidebar-w);
  top:var(--header-h);
  width:min(780px, calc(100vw - var(--sidebar-w) - 20px));
  max-height:calc(100vh - var(--header-h) - 8px);
  background:#fff;
  border:1px solid var(--border);
  border-left:none;
  border-radius:0 0 12px 0;
  box-shadow:8px 8px 32px rgba(17,24,39,.12);
  padding:1.6rem 1.8rem 2rem;
  overflow-y:auto;
  overscroll-behavior:contain;
  z-index:198;
  opacity:0;
  pointer-events:none;
  transform:translateX(-8px);
  transition:opacity .15s,transform .15s;
}
.sb-megamenu.open{
  opacity:1;
  pointer-events:auto;
  transform:translateX(0);
}
.mm-header{
  display:flex;align-items:baseline;gap:.65rem;
  margin-bottom:1.2rem;padding-bottom:.95rem;
  border-bottom:1px solid var(--border);
}
.mm-icon{font-size:1.4rem}
.mm-title{font-size:1.15rem;font-weight:800;color:var(--text);letter-spacing:-.02em}
.mm-count{font-size:.72rem;color:var(--muted);font-weight:600;margin-left:auto}
.mm-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:.3rem 1.6rem;
}
/* Header-csoportos megamenu (Cel.ro stílus) */
.mm-groups{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.2rem 1.8rem;
}
.mm-group{display:flex;flex-direction:column;gap:.1rem}
.mm-group-header{
  font-size:.78rem;font-weight:800;text-transform:uppercase;
  color:#1e40af;letter-spacing:.04em;
  padding:.4rem .65rem .3rem;
  border-bottom:1px solid #e5e7eb;margin-bottom:.25rem;
}
.mm-group-items{display:flex;flex-direction:column;gap:.05rem}
@media (max-width:1100px){.mm-groups{grid-template-columns:repeat(2,1fr)}}
@media (max-width:768px){.mm-groups{grid-template-columns:1fr}}
/* Header-csoportos parent-view kártya grid */
.pg-group{margin-bottom:1.4rem}
.pg-group-header{
  font-size:1rem;font-weight:800;color:var(--text);
  margin:0 0 .75rem;padding-bottom:.4rem;
  border-bottom:2px solid #e5e7eb;
  letter-spacing:-.01em;
}
.pg-group:first-child .pg-group-header:empty{display:none}
.pg-group-cards{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:.8rem;
}
.mm-item{
  display:block;
  padding:.55rem .65rem;
  font-size:.88rem;
  color:var(--text2);
  font-weight:500;
  border-radius:6px;
  text-decoration:none;
  cursor:pointer;
  border:none;
  background:transparent;
  text-align:left;
  font-family:inherit;
  width:100%;
  transition:background .12s,color .12s,padding-left .12s;
  position:relative;
}
.mm-item:hover{
  background:#f3f4f6;
  color:#1e40af;
  padding-left:.95rem;
}
.mm-item::before{
  content:"→";
  position:absolute;left:.65rem;top:50%;
  transform:translateY(-50%);
  color:#1e40af;
  opacity:0;
  font-size:.78rem;
  transition:opacity .12s;
}
.mm-item:hover::before{opacity:1}
.mm-item.active{
  background:#eff6ff;
  color:#1d4ed8;
  font-weight:700;
}
.sb-parent.active{
  background:#eff6ff;
  color:#1d4ed8;
  font-weight:700;
}
.sb-parent.active .sb-parent-chevron{transform:rotate(90deg);color:#1d4ed8}
@media(max-width:768px){
  .sb-megamenu{display:none!important}
}
.sb-sub{
  background:transparent;border:none;
  color:#64748b;font-size:.81rem;font-weight:500;
  padding:.42rem .7rem;border-radius:7px;
  cursor:pointer;text-align:left;font-family:inherit;
  transition:all .12s;
}
.sb-sub:hover{background:#f1f5fc;color:#1e293b}
.sb-sub.active{background:#eff6ff;color:#1d4ed8;font-weight:700;box-shadow:inset 3px 0 0 #1d4ed8;border-radius:0 7px 7px 0;padding-left:.6rem}

/* Main becomes flex with side margin */
#main{margin:0;padding:1.5rem 1.75rem 2rem}

/* Mobile sidebar drawer */
.sidebar-backdrop{
  position:fixed;inset:0;z-index:198;
  background:rgba(13,31,76,.55);backdrop-filter:blur(3px);
  opacity:0;transition:opacity .25s;
}
.sidebar-backdrop:not(.hidden){opacity:1}
.sidebar-toggle{
  display:none;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.9);
  width:38px;height:38px;border-radius:9px;
  align-items:center;justify-content:center;cursor:pointer;
  flex-shrink:0;transition:background .14s;
}
.sidebar-toggle:hover{background:rgba(255,255,255,.18)}

@media(max-width:768px){
  .layout-wrap{grid-template-columns:1fr}
  /* On mobile: disable peek mode entirely */
  .layout-wrap.sb-peek > #main{grid-column:auto}
  .sb-peek-tab{display:none !important}
  .sidebar--peek{position:fixed !important;transform:translateX(-100%)}
  .sidebar--peek.sb-open{transform:translateX(0)}
  .sidebar{
    position:fixed;top:0;left:0;bottom:0;z-index:199;
    width:min(280px,82vw);height:100vh;
    transform:translateX(-100%);
    transition:transform .28s cubic-bezier(.4,0,.2,1);
    box-shadow:8px 0 32px rgba(0,0,0,.18);
  }
  .sidebar.open{transform:translateX(0)}
  .sidebar-close{
    display:flex;position:absolute;top:.65rem;right:.65rem;
    width:32px;height:32px;border-radius:8px;
    background:#f1f5f9;border:1px solid #e2e8f0;
    color:#64748b;font-size:.95rem;cursor:pointer;
    align-items:center;justify-content:center;
  }
  .sidebar-toggle{display:flex}
  #main{padding:1rem 1rem 2rem}
}

/* ════════════════════════════════════════════════════
   VreauPretBun.ro — Design v5  (modern premium)
   Brand: Navy #0d1f4c + Green #16a34a
════════════════════════════════════════════════════ */
:root {
  /* Design v7 — Professional, trust-focused (Compari/Idealo inspired) */
  --navy:     #111827;   /* deeper, more serious */
  --navy2:    #1f2937;
  --navy3:    #1e40af;
  --blue:     #2563eb;
  --blue-lt:  #3b82f6;
  --green:    #059669;   /* darker, more professional green */
  --green2:   #047857;
  --green-lt: #10b981;
  --bg:       #f9fafb;   /* near-white, clean */
  --bg2:      #f3f4f6;
  --surface:  #ffffff;
  --text:     #111827;   /* strong contrast */
  --text2:    #374151;
  --muted:    #6b7280;
  --muted2:   #9ca3af;
  --border:   #e5e7eb;
  --border2:  #d1d5db;
  --red:      #dc2626;
  --amber:    #d97706;
  --radius:   10px;        /* less rounded — more serious */
  --radius-sm:6px;
  --shadow:   0 1px 2px rgba(17,24,39,.04), 0 1px 3px rgba(17,24,39,.04);
  --shadow-md:0 4px 12px rgba(17,24,39,.06), 0 2px 4px rgba(17,24,39,.04);
  --shadow-lg:0 10px 25px rgba(17,24,39,.1), 0 4px 10px rgba(17,24,39,.05);
  --header-h: 64px;
  --catbar-h: 46px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scrollbar-gutter:stable}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--bg);color:var(--text);
  min-height:100vh;padding-bottom:140px;
  font-size:15px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}

/* ══ SITE HEADER ══════════════════════════════════ */
.site-header{
  position:sticky;top:0;z-index:200;
  background:rgba(17,24,39,0.75);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:none;
  border-bottom:1px solid rgba(255,255,255,0.06);
  transition:background .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.site-header.scrolled{
  background:#111827;
  box-shadow:0 1px 0 rgba(0,0,0,.15), 0 2px 12px rgba(0,0,0,.25);
  border-bottom:1px solid #1f2937;
}

/* ── Top row ── */
.header-top{
  height:var(--header-h);
  display:flex;align-items:center;gap:1.25rem;
  padding:0 1.75rem;
  max-width:1360px;margin:0 auto;
}

/* ── Brand ── */
.brand{display:flex;align-items:center;gap:.6rem;flex-shrink:0}
.brand-logo{
  height:38px;width:auto;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.3));
}
.brand-name{
  font-size:1.28rem;font-weight:900;letter-spacing:-.04em;
  color:#fff;white-space:nowrap;line-height:1;
}
.brand-name em{color:#4ade80;font-style:normal;text-shadow:0 0 20px rgba(74,222,128,.4)}
.brand-name small{font-size:.56em;color:rgba(255,255,255,.35);font-weight:600;letter-spacing:0}

/* ── Search ── */
.header-search-wrap{flex:1;max-width:680px;margin:0 auto}
.header-search-box{
  display:flex;align-items:center;gap:.6rem;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  padding:.6rem 1.15rem;
  transition:all .2s;
  backdrop-filter:blur(12px);
}
.header-search-box:hover{
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.18);
}
.header-search-box:focus-within{
  background:#fff;
  border-color:#fff;
  box-shadow:0 0 0 3px rgba(74,222,128,.3), 0 8px 24px rgba(0,0,0,.2);
}
.header-search-box:focus-within .hs-icon{color:var(--muted)}
.header-search-box:focus-within #search-input{color:var(--text)}
.header-search-box:focus-within #search-input::placeholder{color:var(--muted2)}
.hs-icon{width:17px;height:17px;flex-shrink:0;color:rgba(255,255,255,.5)}
.header-search-box:focus-within .hs-icon{color:rgba(255,255,255,.8)}
#search-input{
  flex:1;border:none;outline:none;background:transparent;
  font-family:inherit;font-size:.94rem;color:#fff;min-width:0;
  font-weight:500;
}
#search-input::placeholder{color:rgba(255,255,255,.4)}
.hs-spin{
  width:16px;height:16px;flex-shrink:0;
  border:2px solid rgba(255,255,255,.2);border-top-color:#4ade80;
  border-radius:50%;animation:spin .65s linear infinite;
}
.hs-clear{
  background:rgba(255,255,255,.12);border:none;color:rgba(255,255,255,.6);
  cursor:pointer;font-size:.72rem;width:20px;height:20px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  transition:all .15s;
}
.hs-clear:hover{background:rgba(255,255,255,.25);color:#fff}

/* ── Nav ── */
.header-nav{display:flex;align-items:center;gap:.5rem;flex-shrink:0}
.hnav-link{
  font-size:.76rem;font-weight:600;color:rgba(255,255,255,.5);
  white-space:nowrap;transition:color .15s;padding:.3rem .5rem;border-radius:6px;
}
.hnav-link:hover{color:rgba(255,255,255,.9)}
.hnav-admin{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  padding:.3rem .8rem;
}
.hnav-admin:hover{background:rgba(255,255,255,.16);color:#fff}
.hnav-offers{
  background:linear-gradient(135deg,#b91c1c,#dc2626,#ea580c);
  border:none;color:#fff;border-radius:999px;
  padding:.3rem .85rem;font-size:.76rem;font-weight:700;
  cursor:pointer;transition:opacity .15s,transform .13s,box-shadow .15s;
  box-shadow:0 2px 10px rgba(220,38,38,.4);white-space:nowrap;
  font-family:inherit;letter-spacing:.01em;
}
.hnav-offers:hover{opacity:.88;transform:translateY(-1px);box-shadow:0 3px 14px rgba(220,38,38,.5)}

/* ══ CATEGORY BAR ══════════════════════════════════ */
.cat-bar{
  height:var(--catbar-h);
  background:rgba(0,0,0,.25);
  border-top:1px solid rgba(255,255,255,.06);
  display:flex;align-items:stretch;
}
.cat-bar-scroll{
  flex:1;overflow-x:auto;scrollbar-width:none;
}
.cat-bar-scroll::-webkit-scrollbar{display:none}
.cat-bar-inner{
  display:flex;align-items:stretch;
  padding:0 1.75rem;
  min-width:max-content;
  height:100%;
}

/* skeleton */
.cat-bar-skel{display:flex;align-items:center;gap:.5rem;padding:0}
.cat-bar-skel span{
  display:inline-block;height:20px;width:80px;border-radius:999px;
  background:rgba(255,255,255,.07);
  animation:shimmer 1.4s infinite;
  background-size:200% 100%;
  background-image:linear-gradient(90deg,rgba(255,255,255,.04) 25%,rgba(255,255,255,.14) 50%,rgba(255,255,255,.04) 75%);
}

.cat-pill{
  display:inline-flex;align-items:center;gap:.38rem;
  background:none;border:none;
  padding:0 .95rem;
  font-size:.78rem;font-weight:600;
  color:rgba(255,255,255,.52);
  cursor:pointer;white-space:nowrap;
  height:100%;
  position:relative;
  transition:color .15s;
}
.cat-pill::after{
  content:'';position:absolute;bottom:0;left:.95rem;right:.95rem;height:2.5px;
  background:#4ade80;border-radius:2px 2px 0 0;
  transform:scaleX(0);transition:transform .18s cubic-bezier(.4,0,.2,1);
}
.cat-pill:hover{color:rgba(255,255,255,.88)}
.cat-pill.active{color:#4ade80}
.cat-pill.active::after{transform:scaleX(1)}
.cat-pill-icon{font-size:.88rem}

.cat-bar-end{
  display:flex;align-items:center;
  padding:0 1rem;
  border-left:1px solid rgba(255,255,255,.08);
  flex-shrink:0;
}
.deals-tab{
  background:linear-gradient(135deg,#b91c1c 0%,#dc2626 50%,#ea580c 100%);
  color:#fff;border:none;border-radius:999px;
  padding:.3rem .95rem;font-size:.75rem;font-weight:700;
  cursor:pointer;white-space:nowrap;letter-spacing:.01em;
  transition:opacity .15s,transform .12s,box-shadow .15s;
  box-shadow:0 2px 10px rgba(220,38,38,.35);
}
.deals-tab:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 4px 16px rgba(220,38,38,.45)}
.deals-tab.active{box-shadow:0 0 0 2px #fff, 0 0 0 4px rgba(220,38,38,.5)}

/* ══ SUBCATEGORY BAR ════════════════════════════════ */
.subcat-bar{
  background:linear-gradient(180deg,#edf2fb 0%,#e4ecf8 100%);
  border-bottom:2px solid #bfdbfe;
  display:flex;align-items:center;gap:.4rem;
  padding:.5rem 1.75rem;
  overflow-x:auto;scrollbar-width:none;
  animation:slideDown .16s cubic-bezier(.4,0,.2,1);
  min-height:46px;
}
.subcat-bar::-webkit-scrollbar{display:none}
@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

.subcat-pill{
  background:#fff;
  border:1.5px solid #c7d9f5;
  color:#1e40af;
  border-radius:999px;
  padding:.28rem .9rem;
  font-size:.74rem;font-weight:600;
  cursor:pointer;white-space:nowrap;flex-shrink:0;
  transition:all .14s;
  box-shadow:0 1px 3px rgba(30,58,138,.08);
}
.subcat-pill:hover{
  background:#dbeafe;border-color:#93c5fd;
  transform:translateY(-1px);box-shadow:0 2px 6px rgba(30,58,138,.14);
}
.subcat-pill.active{
  background:var(--navy3);border-color:var(--navy3);color:#fff;
  box-shadow:0 2px 10px rgba(30,58,138,.3);
}

/* ══ MAIN LAYOUT ════════════════════════════════════ */
#main{
  max-width:1180px;margin:0 auto;
  padding:1.75rem 2rem 3rem;
  display:flex;flex-direction:column;gap:1.5rem;
}
.content-block{display:flex;flex-direction:column;gap:1rem}

/* ══ BREADCRUMB ════════════════════════════════════ */
.breadcrumb{
  display:flex;align-items:center;flex-wrap:wrap;gap:.15rem;
  padding:.5rem .2rem;
  font-size:.78rem;color:#64748b;
  border-bottom:1px solid var(--border);
  margin-bottom:.25rem;
}
.breadcrumb.hidden{display:none}
.bc-part{color:#64748b;font-weight:500}
.bc-home{cursor:pointer;color:#3b82f6;font-weight:600;text-decoration:none}
.bc-home:hover{color:#1d4ed8;text-decoration:underline}
.bc-sep{color:#cbd5e1;font-size:.8rem;padding:0 .2rem;user-select:none}
.bc-current{color:#0f172a;font-weight:700}
@media(max-width:768px){
  .breadcrumb{font-size:.72rem;padding:.4rem .1rem}
}

/* ══ BANNER SLIDESHOW ══════════════════════════════ */
.banner-section{
  padding:.6rem 0 .4rem;
  overflow:hidden;
  position:relative;
}
.banner-track-wrap{
  overflow:hidden;
  border-radius:12px;
}
.banner-track{
  display:flex;
  gap:12px;
  transition:transform .45s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.banner-slide{
  flex:0 0 auto;
  border-radius:10px;
  overflow:hidden;
  cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
  border:1px solid #e2e8f0;
  background:#f8fafc;
  transition:box-shadow .18s,transform .18s;
  display:block;
  text-decoration:none;
}
.banner-slide:hover{
  box-shadow:0 6px 22px rgba(0,0,0,.14);
  transform:translateY(-2px);
}
.banner-slide img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.banner-dots{
  display:flex;justify-content:center;gap:6px;margin-top:.6rem;
}
.banner-dot{
  width:8px;height:8px;border-radius:50%;
  background:#cbd5e1;cursor:pointer;
  transition:background .2s,transform .2s;
  border:none;padding:0;
}
.banner-dot.active{background:#3b82f6;transform:scale(1.3)}
@media(max-width:768px){
  .banner-section{padding:.4rem 0 .2rem}
  .banner-slide{border-radius:8px}
}

/* ══ FILTER BAR ════════════════════════════════════ */
.filter-bar{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:.75rem 1rem;
  display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;
  box-shadow:none;
}
.fb-group{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.fb-label{font-size:.67rem;font-weight:700;color:var(--muted2);text-transform:uppercase;letter-spacing:.08em;white-space:nowrap}
.fb-sort-btns{display:flex;gap:.28rem;flex-wrap:wrap}
.fb-sort{
  background:var(--bg);border:1.5px solid var(--border2);
  color:var(--muted);border-radius:999px;
  padding:.22rem .72rem;font-size:.72rem;font-weight:600;
  cursor:pointer;transition:all .13s;white-space:nowrap;
}
.fb-sort:hover{border-color:var(--blue);color:var(--blue)}
.fb-sort.active{background:var(--blue);border-color:var(--blue);color:#fff}
.fb-price{display:flex;align-items:center;gap:.32rem}
.fb-price-inp{
  width:72px;background:var(--bg);border:1.5px solid var(--border2);
  border-radius:8px;padding:.25rem .5rem;font-size:.8rem;
  color:var(--text);font-family:inherit;transition:border-color .13s;
}
.fb-price-inp:focus{outline:none;border-color:var(--blue);background:#fff}
.fb-price-inp::-webkit-inner-spin-button{opacity:.4}
.fb-dash{color:var(--muted2);font-size:.75rem}
.fb-currency{font-size:.72rem;font-weight:700;color:var(--muted)}
.fb-store-chips{display:flex;gap:.28rem;flex-wrap:wrap}
.fb-store-chip{
  border:1.5px solid;border-radius:999px;
  padding:.2rem .62rem;font-size:.7rem;font-weight:700;
  cursor:pointer;transition:all .13s;white-space:nowrap;
  background:transparent;opacity:.45;
}
.fb-store-chip:hover{opacity:.85;transform:translateY(-1px)}
.fb-store-chip.active{opacity:1;color:#fff!important}
.fb-toggle{
  background:var(--bg);border:1.5px solid var(--border2);
  color:var(--muted);border-radius:999px;
  padding:.24rem .78rem;font-size:.72rem;font-weight:600;
  cursor:pointer;transition:all .13s;white-space:nowrap;
}
.fb-toggle:hover{border-color:var(--amber);color:var(--amber)}
.fb-toggle.active{background:#fef3c7;border-color:#fcd34d;color:var(--amber)}
.fb-reset{
  margin-left:auto;background:none;border:none;
  color:var(--muted2);font-size:.73rem;font-weight:600;
  cursor:pointer;padding:.22rem .5rem;border-radius:6px;transition:color .13s;
  display:flex;align-items:center;gap:.3rem;
}
.fb-reset:hover{color:var(--red)}
.filter-count-badge{
  background:var(--blue);color:#fff;border-radius:999px;
  padding:.05rem .42rem;font-size:.64rem;font-weight:800;
}

/* ══ HOMEPAGE DEALS ═════════════════════════════════ */
.home-deals-section{
  display:flex;flex-direction:column;gap:.85rem;
}
.hds-header{
  display:flex;align-items:center;justify-content:space-between;
}
.hds-title{font-size:1.15rem;font-weight:800;color:var(--text);letter-spacing:-.025em}
.hds-more{
  background:var(--bg);border:1.5px solid var(--border2);
  color:var(--blue);font-size:.76rem;font-weight:700;
  cursor:pointer;padding:.28rem .85rem;border-radius:999px;transition:all .13s;
}
.hds-more:hover{background:#eff6ff;border-color:#93c5fd;text-decoration:none}

.home-deals-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:1rem;
}

/* Skeleton placeholder */
.hd-skel{
  height:280px;border-radius:var(--radius);
  animation:shimmer 1.4s infinite;
  background-size:200% 100%;
  background-image:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9 50%,#e2e8f0 75%);
}

/* Deal card */
.hd-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden;
  display:flex;flex-direction:column;
  box-shadow:var(--shadow);
  cursor:pointer;
  transition:border-color .2s,box-shadow .2s,transform .2s;
  position:relative;
}
.hd-card:hover{
  border-color:#cbd5e1;
  box-shadow:0 12px 32px rgba(15,23,42,.1),0 2px 6px rgba(15,23,42,.04);
  transform:translateY(-2px);
}
.hd-badge{
  position:absolute;top:.6rem;left:.6rem;z-index:2;
  background:linear-gradient(135deg,#b91c1c,#ef4444);
  color:#fff;
  border-radius:999px;padding:.2rem .6rem;
  font-size:.7rem;font-weight:900;letter-spacing:.02em;
  box-shadow:0 2px 8px rgba(220,38,38,.45);
}
.hd-badge.big{font-size:.78rem;padding:.24rem .7rem}
.hd-img-wrap{
  height:160px;
  display:flex;align-items:center;justify-content:center;
  padding:.85rem;
  background:linear-gradient(145deg,#fafbff,#f4f7fc);
  border-bottom:1px solid var(--border);
  position:relative;
  overflow:hidden;
}
.hd-img-wrap::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 50% 110%,rgba(37,99,235,.04),transparent 70%);
  pointer-events:none;
}
.hd-img{max-width:100%;max-height:132px;object-fit:contain;position:relative;z-index:1}
.hd-img-ph{font-size:3.2rem;color:var(--muted2)}
.hd-body{padding:.7rem .82rem .82rem;flex:1;display:flex;flex-direction:column;gap:.38rem}
.hd-store{
  font-size:.64rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
}
.hd-name{
  font-size:.8rem;font-weight:600;color:var(--text);line-height:1.42;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  flex:1;
}
.hd-price-row{display:flex;align-items:baseline;gap:.4rem;flex-wrap:wrap;margin-top:.05rem}
.hd-price{font-size:1.18rem;font-weight:900;color:var(--text);letter-spacing:-.03em}
.hd-price-old{font-size:.72rem;color:var(--muted2);text-decoration:line-through}
.hd-footer{
  display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;margin-top:.1rem;
}
.hd-footer .hd-buy{flex:1;min-width:80px;margin-top:0}
.hd-footer .cpg-compare-chk{font-size:.65rem;padding:.25rem .4rem;flex-shrink:0}
.hd-buy{
  display:block;text-align:center;
  background:linear-gradient(135deg,var(--green) 0%,var(--green2) 100%);
  color:#fff;border-radius:8px;padding:.42rem .5rem;
  font-size:.74rem;font-weight:800;margin-top:.2rem;
  letter-spacing:.01em;
  transition:opacity .14s,transform .13s,box-shadow .14s;
  box-shadow:0 2px 10px rgba(22,163,74,.3);
}
.hd-buy:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 4px 16px rgba(22,163,74,.4)}

/* ══ STORE STRIP ════════════════════════════════════ */
.store-strip{
  display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius);padding:.7rem 1.25rem;
}
.ss-label{font-size:.68rem;font-weight:800;color:var(--muted2);text-transform:uppercase;letter-spacing:.09em;white-space:nowrap;flex-shrink:0}
.ss-logos{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;flex:1}
.ss-pill{
  font-size:.73rem;font-weight:800;
  background:var(--bg);border:1.5px solid var(--border2);
  border-radius:999px;padding:.22rem .72rem;
  white-space:nowrap;letter-spacing:.01em;
  transition:border-color .14s,transform .14s;
}
.ss-pill:hover{border-color:currentColor;transform:translateY(-1px)}
.ss-more{
  font-size:.7rem;font-weight:700;color:var(--muted);
  background:var(--bg2);border:1.5px solid var(--border2);
  border-radius:999px;padding:.22rem .72rem;white-space:nowrap;
}

/* ══ HERO SLIDESHOW (2P partner bannerek) ═══════════ */
.hero-slideshow{
  position:relative;
  width:100%;
  height:240px;
  border-radius:12px;
  overflow:hidden;
  background:#0f172a;
  box-shadow:0 4px 14px rgba(17,24,39,.12);
  border:1px solid #1e293b;
}
.hs-track-wrap{
  position:absolute;inset:0;
  overflow:hidden;
}
.hs-track{
  display:flex;
  height:100%;
  transition:transform .5s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.hs-slide{
  flex:0 0 100%;
  height:100%;
  display:flex;align-items:center;justify-content:center;
  background:#0f172a;
  position:relative;
  overflow:hidden;
}
/* Elmosott háttér — a teljes banner látszódjon */
.hs-blur-bg{
  position:absolute;inset:-30px;
  background-image:var(--hs-bg);
  background-size:cover;
  background-position:center;
  filter:blur(18px) brightness(0.35) saturate(1.2);
  z-index:0;
  pointer-events:none;
}
.hs-img-link{
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:center;
  width:100%;height:100%;
  text-decoration:none;
}
.hs-slide img{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  position:relative;z-index:1;
}
.hs-slide-store{
  position:absolute;
  bottom:.6rem;left:.8rem;
  background:rgba(0,0,0,.65);
  color:#fff;
  padding:.25rem .65rem;
  border-radius:6px;
  font-size:.7rem;font-weight:700;
  letter-spacing:.03em;text-transform:uppercase;
  pointer-events:none;
}
.hs-arrow{
  position:absolute;top:50%;
  transform:translateY(-50%);
  background:rgba(255,255,255,.92);
  border:none;
  width:38px;height:38px;
  border-radius:50%;
  font-size:1.4rem;font-weight:700;
  color:#111827;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
  z-index:5;
  transition:background .15s,transform .15s;
}
.hs-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
.hs-prev{left:.7rem}
.hs-next{right:.7rem}
.hs-dots{
  position:absolute;
  bottom:.55rem;left:50%;
  transform:translateX(-50%);
  display:flex;gap:.35rem;
  z-index:5;
}
.hs-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.45);
  border:none;cursor:pointer;
  padding:0;
  transition:background .15s,width .15s;
}
.hs-dot.active{background:#10b981;width:24px;border-radius:4px}
.hs-loading{
  display:flex;align-items:center;justify-content:center;
  height:100%;color:rgba(255,255,255,.5);
  font-size:.9rem;
}
@media (max-width:768px){
  .hero-slideshow{height:140px;border-radius:8px}
  .hs-arrow{width:28px;height:28px;font-size:1.1rem}
}

/* ══ HERO BANNER (régi, már nem használt) ═══════════ */
.hero-banner{
  background:#111827;
  border-radius:14px;
  padding:2.2rem 2.25rem;
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
  box-shadow:0 6px 20px rgba(17,24,39,.15);
  position:relative;overflow:hidden;
  border:1px solid #1f2937;
}
.hero-banner::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 100% 0%,rgba(5,150,105,.08) 0%,transparent 60%);
  pointer-events:none;
}
.hero-text{flex:1;min-width:0;position:relative;z-index:1}
.hero-title{
  font-size:1.75rem;font-weight:800;color:#fff;
  line-height:1.2;letter-spacing:-.03em;margin-bottom:.6rem;
}
.hero-title strong{color:#10b981;font-style:normal;font-weight:900}
.hero-sub{font-size:.92rem;color:rgba(255,255,255,.7);line-height:1.55;max-width:540px;font-weight:400}
.hero-trust{
  display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem;
}
.hero-trust-pill{
  background:rgba(16,185,129,.12);
  border:1px solid rgba(16,185,129,.3);
  color:#10b981;
  padding:.32rem .7rem;border-radius:6px;
  font-size:.72rem;font-weight:600;
  white-space:nowrap;
}

.hero-stats{
  display:flex;align-items:center;gap:0;flex-shrink:0;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  border-radius:10px;padding:.85rem 1.25rem;
  position:relative;z-index:1;
}
.hero-stat{display:flex;flex-direction:column;align-items:center;gap:.12rem;padding:0 1rem}
.hstat-n{font-size:1.35rem;font-weight:800;color:#fff;letter-spacing:-.03em}
.hstat-l{font-size:.64rem;font-weight:700;color:#9ca3af;text-transform:uppercase;letter-spacing:.08em;margin-top:.15rem}
.hero-stat-sep{width:1px;height:36px;background:rgba(255,255,255,.12)}

/* ══ USP BAR ════════════════════════════════════════ */
.usp-bar{
  display:flex;align-items:center;
  background:linear-gradient(135deg,#ffffff 0%,#f8faff 100%);
  border:1.5px solid var(--border);
  border-radius:var(--radius);padding:.75rem 1.5rem;
  overflow-x:auto;scrollbar-width:none;box-shadow:var(--shadow);
  gap:0;
}
.usp-bar::-webkit-scrollbar{display:none}
.usp-item{
  display:flex;align-items:center;gap:.5rem;flex:1;min-width:140px;
  font-size:.79rem;color:var(--muted);white-space:nowrap;
}
.usp-item strong{color:var(--text);font-weight:700}
.usp-ico{font-size:1.15rem}
.usp-sep{width:1px;height:22px;background:var(--border2);flex-shrink:0;margin:0 1rem}

/* ══ HOW IT WORKS ═══════════════════════════════════ */
.section{display:flex;flex-direction:column;gap:.8rem}
.section-title{
  font-size:1.25rem;font-weight:800;color:var(--text);
  letter-spacing:-.025em;
}
.view-title{font-size:1.35rem;font-weight:800;color:var(--text);letter-spacing:-.025em}
.hiw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:.7rem}
.hiw-step{
  display:flex;gap:.85rem;background:var(--surface);
  border:1.5px solid var(--border);border-radius:var(--radius);
  padding:.95rem 1.1rem;box-shadow:var(--shadow);
  transition:border-color .15s,transform .15s,box-shadow .15s;
}
.hiw-step:hover{border-color:#93c5fd;transform:translateY(-2px);box-shadow:var(--shadow-md)}
.hiw-num{
  width:2.2rem;height:2.2rem;flex-shrink:0;
  background:linear-gradient(135deg,var(--navy3),var(--navy2));
  color:#fff;border-radius:999px;
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;font-weight:900;
  box-shadow:0 2px 10px rgba(30,58,138,.28);
  flex-shrink:0;
}
.hiw-t{font-size:.84rem;font-weight:700;margin-bottom:.22rem;color:var(--text)}
.hiw-d{font-size:.73rem;color:var(--muted);line-height:1.5}

/* ══ DEALS ══════════════════════════════════════════ */
.deals-controls{
  display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;
  padding-bottom:.65rem;border-bottom:1.5px solid var(--border);
}
.filter-chips{display:flex;gap:.32rem;flex-wrap:wrap}
.chip{
  background:var(--surface);border:1.5px solid var(--border2);
  border-radius:999px;padding:.24rem .78rem;
  font-size:.73rem;font-weight:600;color:var(--muted);
  cursor:pointer;transition:all .13s;
}
.chip:hover{border-color:var(--blue);color:var(--blue)}
.chip.active{background:var(--blue);border-color:var(--blue);color:#fff}
.inline-spin{
  width:16px;height:16px;
  border:2px solid var(--border2);border-top-color:var(--green);
  border-radius:50%;animation:spin .65s linear infinite;
}

/* ══ RESULTS HEADER ═════════════════════════════════ */
.results-header{
  display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  font-size:.85rem;color:var(--muted);
}
.results-header strong{color:var(--text);font-size:1.1rem;font-weight:800;letter-spacing:-.015em}
.tag{
  background:#eff6ff;color:var(--navy3);
  border:1px solid #bfdbfe;border-radius:6px;
  padding:.18rem .65rem;font-size:.72rem;font-weight:700;
}

/* ══ PRODUCT LIST ════════════════════════════════════ */
.product-list{display:flex;flex-direction:column;gap:.65rem}

/* ── GRID layout (kategória nézet — Cel.ro/eMAG stílusú) ── */
.product-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:.75rem;
}
.product-grid .cpg-card{
  flex-direction:column;
  border-radius:10px;
}
.product-grid .cpg-main-row{flex-direction:column}
.product-grid .cpg-img-wrap{
  width:100%;height:200px;min-height:auto;
  padding:.8rem;
  border-right:none;border-bottom:1px solid var(--border);
  background:#fff;
  position:relative;
}
.product-grid .cpg-img{max-height:170px;width:auto}
.product-grid .cpg-body{padding:.85rem 1rem .9rem;gap:.55rem;display:flex;flex-direction:column;height:100%}
.product-grid .cpg-name{
  font-size:.86rem;-webkit-line-clamp:2;min-height:2.4em;
  font-weight:600;
  line-height:1.35;
  flex:1;min-width:0;
}
/* Top sor: név (flex:1) + Coș gomb jobbra */
.product-grid .cpg-top{
  display:flex;flex-direction:row;align-items:flex-start;
  gap:.5rem;
}
.product-grid .cpg-top-right{
  display:flex;flex-direction:column;align-items:flex-end;gap:.3rem;
  flex-shrink:0;
}
.product-grid .cpg-add-btn{
  font-size:.72rem;padding:.4rem .8rem;
  font-weight:800;letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:0 2px 8px rgba(22,163,74,.35);
}
.product-grid .cpg-add-btn:hover:not(.added){
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(22,163,74,.5);
}
.product-grid .cpg-multi-badge{font-size:.62rem;padding:.1rem .45rem;align-self:flex-start}
.product-grid .cpg-price-compare{gap:.3rem;margin-top:auto}
.product-grid .cpr-row{
  padding:.55rem .65rem;gap:.45rem;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto;
  grid-template-areas:
    "store store"
    "price buy";
  align-items:center;
}
.product-grid .cpr-store{
  grid-area:store;min-width:0;
  display:flex;align-items:center;gap:.35rem;
  font-size:.72rem;
}
.product-grid .cpr-sname{font-size:.74rem;font-weight:700}
.product-grid .cpr-label-best{
  font-size:.55rem;padding:.1rem .4rem;
  margin-left:auto;
}
.product-grid .cpr-prices{grid-area:price;display:flex;align-items:baseline;gap:.35rem}
.product-grid .cpr-price{font-size:1rem;font-weight:900}
.product-grid .cpr-disc{display:inline-flex;font-size:.6rem;padding:.05rem .35rem}
.product-grid .cpr-ship{display:none}
.product-grid .cpr-total-hint{display:none}
.product-grid .cpr-buy{
  grid-area:buy;
  font-size:.7rem;padding:.4rem .75rem;
  border-radius:6px;
}
.product-grid .cpg-expand-btn{
  font-size:.7rem;padding:.4rem .6rem;
  width:100%;text-align:center;
  margin-top:.3rem;
}

/* Pagination */
.cat-pagination{
  display:flex;justify-content:center;align-items:center;
  gap:.4rem;margin-top:2rem;padding-bottom:1rem;
  flex-wrap:wrap;
}
.cp-btn{
  background:#fff;border:1px solid var(--border);
  border-radius:8px;color:var(--text);
  min-width:38px;height:38px;padding:0 .75rem;
  font-size:.85rem;font-weight:600;
  cursor:pointer;font-family:inherit;
  transition:all .13s;
}
.cp-btn:hover:not(:disabled){border-color:#1e40af;color:#1e40af;background:#eff6ff}
.cp-btn.active{background:#1e40af;color:#fff;border-color:#1e40af}
.cp-btn:disabled{opacity:.4;cursor:not-allowed}
.cp-ellipsis{color:var(--muted);padding:0 .25rem;align-self:center}

@media(max-width:768px){
  .product-grid{grid-template-columns:repeat(2,1fr);gap:.55rem}
  .product-grid .cpg-img-wrap{height:140px;padding:.6rem}
  .product-grid .cpg-img{max-height:120px}
  .product-grid .cpg-body{padding:.65rem .75rem .75rem}
  .product-grid .cpg-name{font-size:.78rem;min-height:2.2em}
  .cp-btn{min-width:34px;height:34px;padding:0 .55rem;font-size:.78rem}
}

/* ── Skeleton placeholder cards ── */
.cpg-skel{cursor:default;pointer-events:none}
.cpg-skel:hover{transform:none;box-shadow:var(--shadow);border-color:var(--border)}
.skel-box{
  background:linear-gradient(90deg,#eef2f8 25%,#f5f7fb 50%,#eef2f8 75%);
  background-size:200% 100%;
  animation:skel-shimmer 1.4s linear infinite;
  border-radius:6px;
}
.skel-img{width:80%;height:80%;border-radius:8px}
.skel-line{height:14px;margin-bottom:.6rem}
.skel-line-1{width:75%}
.skel-line-2{width:50%;height:12px}
.skel-row{height:34px;border-radius:8px;margin-bottom:.35rem;background:#f1f5fc}
@keyframes skel-shimmer{
  from{background-position:200% 0}
  to{background-position:-200% 0}
}

/* ══ PRODUCT CARD ════════════════════════════════════ */
.cpg-card{
  background:var(--surface);
  border:1px solid var(--border);border-radius:10px;
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:none;
  transition:border-color .2s,box-shadow .2s;
}
.cpg-card:hover{
  border-color:#9ca3af;
  box-shadow:0 4px 12px rgba(17,24,39,.06);
}
.cpg-card.expanded{
  border-color:var(--blue);
  box-shadow:0 0 0 2px rgba(37,99,235,.12),0 6px 24px rgba(37,99,235,.1);
}
.cpg-main-row{display:flex;overflow:hidden}
.cpg-img-wrap{
  width:160px;min-height:160px;flex-shrink:0;
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  padding:1rem;
  border-right:1px solid var(--border);
  position:relative;
  flex-direction:column;gap:.4rem;
}
.cpg-badge-disc{
  position:absolute;top:.55rem;left:.55rem;
  background:#dc2626;color:#fff;
  border-radius:6px;padding:.15rem .5rem;
  font-size:.7rem;font-weight:800;letter-spacing:.01em;
  box-shadow:0 2px 8px rgba(220,38,38,.3);
}
.cpg-img{width:100%;max-height:100px;object-fit:contain}
.cpg-img-ph{font-size:2.6rem;color:var(--muted2)}
.cpg-body{flex:1;min-width:0;padding:1.2rem 1.4rem 1.1rem;display:flex;flex-direction:column;gap:.8rem}
.cpg-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.7rem}
.cpg-name{
  font-size:.98rem;font-weight:600;line-height:1.4;color:var(--text);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1;
  letter-spacing:-.01em;
}
.cpg-top-right{display:flex;flex-direction:column;align-items:flex-end;gap:.25rem;flex-shrink:0}
.cpg-price-from{font-size:1.05rem;font-weight:900;color:var(--text);white-space:nowrap;letter-spacing:-.02em}
.cpg-price-from strong{color:var(--green2)}
.cpg-price-from small{font-size:.7rem;font-weight:500;color:var(--muted)}
.cpg-top-badges{display:flex;align-items:center;gap:.4rem}
.cpg-multi-badge{
  font-size:.66rem;font-weight:700;
  background:#eff6ff;color:var(--navy3);
  border:1px solid #bfdbfe;border-radius:999px;
  padding:.18rem .65rem;white-space:nowrap;
  display:inline-flex;align-items:center;gap:.2rem;
}
.cpg-add-btn{
  background:#16a34a;
  color:#fff;border:none;
  border-radius:8px;padding:.4rem .95rem;
  font-size:.76rem;font-weight:700;cursor:pointer;
  transition:all .14s;white-space:nowrap;
  letter-spacing:.005em;
}
.cpg-add-btn:hover{background:#15803d;transform:translateY(-1px)}
.cpg-add-btn.added{background:#f0fdf4;color:var(--green2);border:1px solid #86efac}

/* ── Price comparison table ── */
.cpg-price-compare{display:flex;flex-direction:column;gap:.2rem}
.cpr-row{
  display:flex;align-items:center;gap:.6rem;
  padding:.5rem .75rem;border-radius:8px;
  border:1px solid transparent;
  background:#f8fafc;
  transition:border-color .13s,background .13s;
}
.cpr-row:hover{border-color:var(--border2);background:#f1f5fc}
.cpr-row.cpr-best{
  background:#f0fdf4;
  border-color:#86efac;
}
.cpr-store{display:flex;align-items:center;gap:.4rem;min-width:120px;flex-shrink:0}
.sl-img{border-radius:4px;object-fit:contain;flex-shrink:0}
.cpr-sname{font-size:.76rem;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cpr-label-best{
  font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
  background:#16a34a;color:#fff;border-radius:5px;
  padding:.12rem .5rem;white-space:nowrap;flex-shrink:0;
  box-shadow:0 1px 4px rgba(22,163,74,.3);
}
.cpr-prices{display:flex;align-items:center;gap:.5rem;flex:1;flex-wrap:wrap}
.cpr-price{font-size:1.02rem;font-weight:900;color:var(--text);white-space:nowrap;letter-spacing:-.02em}
.cpr-price small{font-size:.7rem;font-weight:600;color:var(--muted);margin-left:.1rem}
.cpr-price small{font-size:.68rem;font-weight:500;color:var(--muted)}
.cpr-price.best{color:var(--green)}
.cpr-ship{font-size:.65rem;color:var(--muted2);white-space:nowrap}
.cpr-ship.free{color:var(--green);font-weight:600}
.cpr-disc{
  font-size:.62rem;background:var(--red);color:#fff;
  border-radius:999px;padding:.05rem .38rem;font-weight:800;white-space:nowrap;flex-shrink:0;
}
.cpr-total-hint{
  font-size:.64rem;color:var(--muted2);white-space:nowrap;
  margin-left:auto;
}
.cpr-total-hint strong{color:var(--green2);font-weight:700}
.cpr-buy{
  flex-shrink:0;
  display:inline-flex;align-items:center;gap:.3rem;
  background:var(--store-color, var(--navy3));
  color:#fff;border-radius:6px;
  padding:.5rem 1rem;font-size:.78rem;font-weight:600;
  transition:filter .14s;white-space:nowrap;
  letter-spacing:.005em;
}
.cpr-buy:hover{filter:brightness(.92)}
.cpr-buy::after{content:"→";font-weight:700;margin-left:.15rem}

/* ══ PRODUCT DETAIL DRAWER (right slide-in) ═════════ */
.pd-backdrop{
  position:fixed;inset:0;z-index:400;
  background:rgba(13,31,76,.55);
  backdrop-filter:blur(3px);
  opacity:0;transition:opacity .28s cubic-bezier(.4,0,.2,1);
}
.pd-backdrop.open{opacity:1}
.pd-backdrop.hidden{display:none!important}

.pd-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:401;
  width:min(720px,100vw);
  max-width:100vw;
  background:#fff;
  box-shadow:-12px 0 48px rgba(0,0,0,.28);
  transform:translateX(100%);
  transition:transform .3s cubic-bezier(.4,0,.2,1);
  overflow-y:auto;
  overflow-x:hidden;
  display:flex;flex-direction:column;
}
.pd-drawer.open{transform:translateX(0)}
.pd-drawer.hidden{display:none!important}

.pd-close{
  position:absolute;top:.7rem;right:.7rem;z-index:5;
  background:rgba(15,23,42,.06);border:1.5px solid transparent;
  color:var(--muted);
  width:36px;height:36px;border-radius:10px;
  font-size:1.1rem;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .14s;
}
.pd-close:hover{background:var(--red);color:#fff;border-color:var(--red)}

#pd-content{padding:1.8rem 1.8rem 2.5rem;display:flex;flex-direction:column;gap:1.3rem}

.pd-header{display:flex;gap:1.4rem;align-items:flex-start;padding-right:2.5rem}
.pd-imgwrap{
  width:160px;height:160px;flex-shrink:0;
  background:linear-gradient(145deg,#fafbff,#f1f5fc);
  border:1.5px solid var(--border);border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;padding:.8rem;
  box-shadow:var(--shadow);
}
.pd-image{max-width:100%;max-height:144px;object-fit:contain}
.pd-image-ph{font-size:3.5rem;color:var(--muted2)}
.pd-title-block{flex:1;min-width:0;display:flex;flex-direction:column;gap:.6rem}
.pd-title{
  font-size:1.12rem;font-weight:800;color:var(--text);
  line-height:1.38;letter-spacing:-.015em;
}
.pd-meta{display:flex;gap:.35rem;flex-wrap:wrap}
.pd-meta-pill{
  background:var(--bg);border:1.5px solid var(--border2);border-radius:999px;
  padding:.18rem .58rem;font-size:.68rem;font-weight:700;color:var(--muted);
  white-space:nowrap;
}
.pd-meta-save{background:#fef3c7;border-color:#fcd34d;color:#92400e}
.pd-meta-save strong{color:#7c2d12;font-weight:800}

.pd-best-summary{
  background:linear-gradient(135deg,#f0fdf4,#ecfdf5);
  border:1.5px solid #86efac;border-radius:10px;
  padding:.7rem .9rem;
  display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap;
}
.pd-best-label{font-size:.62rem;font-weight:800;color:var(--green2);text-transform:uppercase;letter-spacing:.07em}
.pd-best-price{font-size:1.5rem;font-weight:900;color:var(--green2);letter-spacing:-.03em}
.pd-best-at{font-size:.82rem;color:var(--muted)}
.pd-best-at strong{font-weight:800}

.pd-action-row{
  display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:.5rem;
}
.pd-cart-btn{
  display:inline-flex;align-items:center;gap:.35rem;
  padding:.6rem 1.1rem;border-radius:10px;
  background:#1d4ed8;color:#fff;border:none;
  font-size:.88rem;font-weight:700;cursor:pointer;font-family:inherit;
  transition:background .14s,transform .1s;white-space:nowrap;
}
.pd-cart-btn:hover{background:#1e40af;transform:translateY(-1px)}
.pd-cart-btn.added{background:#16a34a}
.pd-buy-main{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.6rem 1.3rem;border-radius:10px;
  color:#fff;font-size:.88rem;font-weight:700;
  text-decoration:none;letter-spacing:.01em;
  transition:filter .15s,transform .1s;
  white-space:nowrap;
}
.pd-buy-main:hover{filter:brightness(1.1);transform:translateY(-1px)}
.pd-open-new{
  display:inline-flex;align-items:center;gap:.3rem;
  padding:.55rem .9rem;border-radius:10px;
  background:#f1f5f9;border:1.5px solid #cbd5e1;
  color:#475569;font-size:.82rem;font-weight:600;
  text-decoration:none;transition:all .15s;white-space:nowrap;
}
.pd-open-new:hover{background:#e2e8f0;color:#1e293b;border-color:#94a3b8}

.pd-section-title{
  font-size:.72rem;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:.08em;
  padding-top:.4rem;border-top:1.5px solid var(--border);
}

.pd-desc{
  background:#fafbff;border:1.5px solid var(--border);
  border-radius:10px;padding:.85rem 1rem;
  font-size:.85rem;color:var(--text2);line-height:1.6;
  display:flex;flex-direction:column;gap:.5rem;
}
.pd-desc-text{white-space:pre-wrap;word-break:break-word}
.pd-desc.open .pd-desc-text{max-height:none}
.pd-desc-more{
  background:none;border:none;color:var(--blue);
  font-size:.76rem;font-weight:700;cursor:pointer;
  align-self:flex-start;padding:.2rem 0;font-family:inherit;
}
.pd-desc-more:hover{text-decoration:underline}

.pd-rows{display:flex;flex-direction:column;gap:.55rem}
.pd-row{
  background:var(--surface);
  border:1.5px solid var(--border);border-radius:11px;
  padding:.85rem 1rem;
  display:grid;grid-template-columns:1fr auto auto;gap:.5rem .9rem;
  align-items:center;
  transition:border-color .14s,transform .12s,box-shadow .14s;
}
.pd-row:hover{border-color:var(--c,#cbd5e1);transform:translateY(-1px);box-shadow:var(--shadow)}
.pd-row-best{
  background:linear-gradient(135deg,#f0fdf4 0%,#ecfdf5 100%);
  border-color:#6ee7b7;box-shadow:0 2px 12px rgba(22,163,74,.12);
}
.pd-row-left{display:flex;align-items:center;gap:.6rem;min-width:0}
.pd-store-logo-wrap{width:36px;height:36px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;border:1px solid var(--border1);overflow:hidden;padding:3px}
.pd-store-logo-wrap .sl-img{width:28px;height:28px;object-fit:contain}
.pd-store-info{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.pd-store-name{font-size:.92rem;font-weight:800;display:flex;align-items:center;gap:.4rem}
.pd-store-badges{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.pd-instock{font-size:.65rem;color:#16a34a;font-weight:700}

/* Trustpilot bolt-rating pill */
.pd-review{
  display:inline-flex;align-items:center;gap:.25rem;
  background:#f0fdf4;border:1px solid #bbf7d0;
  padding:.12rem .45rem;border-radius:5px;
  font-size:.68rem;font-weight:700;
  color:#15803d;text-decoration:none;
  transition:background .12s,transform .1s;
  white-space:nowrap;
}
.pd-review:hover{background:#dcfce7;transform:translateY(-1px)}
.pd-review-ok{background:#fef3c7;border-color:#fcd34d;color:#a16207}
.pd-review-ok:hover{background:#fde68a}
.pd-review-bad{background:#fee2e2;border-color:#fca5a5;color:#b91c1c}
.pd-review-bad:hover{background:#fecaca}
.pd-rev-stars{
  font-size:.72rem;letter-spacing:.5px;
  color:#f59e0b;
}
.pd-review-bad .pd-rev-stars{color:#dc2626}
.pd-rev-num{font-weight:800}
.pd-rev-cnt{font-weight:500;opacity:.7;font-size:.62rem}

/* ══ TERMÉK-REVIEW KERESŐ LINKEK (drawer-ben) ══════ */
.pd-review-links{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:.55rem;
  margin-bottom:.6rem;
}
.rl-card{
  display:flex;align-items:center;gap:.65rem;
  padding:.65rem .85rem;
  background:#fff;
  border:1.5px solid var(--border);
  border-radius:10px;
  text-decoration:none;
  color:var(--text);
  transition:all .14s;
  position:relative;overflow:hidden;
}
.rl-card::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--accent-c, #6b7280);
  transition:width .14s;
}
.rl-card:hover{
  border-color:var(--accent-c, #6b7280);
  transform:translateY(-2px);
  box-shadow:0 5px 16px rgba(0,0,0,.12);
}
.rl-card:hover::before{width:6px}
.rl-icon{font-size:1.5rem;line-height:1;flex-shrink:0}
.rl-text{display:flex;flex-direction:column;gap:.1rem;min-width:0;flex:1}
.rl-label{font-size:.88rem;font-weight:700;color:var(--text);letter-spacing:-.01em}
.rl-sub{font-size:.7rem;color:var(--muted);font-weight:600;letter-spacing:.02em}
/* Brand színek a kártyákhoz */
.rl-yt{--accent-c:#ff0000}
.rl-yt .rl-sub{color:#ff0000}
.rl-gg{--accent-c:#1a73e8}
.rl-gg .rl-sub{color:#1a73e8}
.rl-rd{--accent-c:#ff4500}
.rl-rd .rl-sub{color:#ff4500}
.rl-cm{--accent-c:#0d9488}
.rl-cm .rl-sub{color:#0d9488}

.pd-review-hint{
  font-size:.78rem;color:var(--muted);
  background:#f9fafb;
  border-left:3px solid #93c5fd;
  padding:.55rem .8rem;border-radius:6px;
  margin:.3rem 0 1rem;line-height:1.4;
}
.pd-review-hint strong{color:var(--text);font-weight:700}

/* ══ TERMÉK SPECIFIKÁCIÓK (drawer leírás) ══════════ */
.pd-specs{
  background:#fafbfc;
  border:1px solid var(--border);
  border-radius:10px;
  padding:.4rem .85rem;
  margin-bottom:.6rem;
  overflow:hidden;
}
.pd-spec-row{
  display:grid;
  grid-template-columns:minmax(120px,40%) 1fr;
  gap:1rem;
  padding:.55rem 0;
  border-bottom:1px solid rgba(226,232,240,.6);
  font-size:.85rem;line-height:1.4;
}
.pd-spec-row:last-child{border-bottom:none}
.pd-spec-k{
  color:var(--muted);
  font-weight:600;
  text-transform:none;
  letter-spacing:0;
}
.pd-spec-v{
  color:var(--text);
  font-weight:600;
  word-break:break-word;
}
.pd-specs-more{
  margin-top:.4rem;margin-bottom:.6rem;
}
.pd-specs-more summary{
  cursor:pointer;
  padding:.55rem .85rem;
  background:#eff6ff;
  border:1px solid #bfdbfe;
  border-radius:8px;
  font-size:.83rem;font-weight:700;
  color:#1e40af;
  list-style:none;
  transition:background .12s;
}
.pd-specs-more summary::-webkit-details-marker{display:none}
.pd-specs-more summary:hover{background:#dbeafe}
.pd-specs-more[open] summary{
  background:#dbeafe;border-radius:8px 8px 0 0;
}
.pd-specs-more[open] .pd-specs{
  border-top-left-radius:0;
  border-top-right-radius:0;
  border-top:none;
  margin-bottom:0;
}

/* Marketing szöveg (Descriere produs paragrafusai) */
.pd-marketing{
  background:#fafbfc;
  border:1px solid var(--border);
  border-left:3px solid #93c5fd;
  border-radius:10px;
  padding:.85rem 1.1rem;
  margin-bottom:.8rem;
}
.pd-marketing p{
  font-size:.88rem;line-height:1.55;color:var(--text);
  margin:0 0 .65rem;
}
.pd-marketing p:last-child{margin-bottom:0}
.pd-marketing-more{
  margin-top:.4rem;
}
.pd-marketing-more summary{
  cursor:pointer;
  padding:.45rem .7rem;
  background:#eff6ff;
  border-radius:6px;
  font-size:.8rem;font-weight:700;color:#1e40af;
  list-style:none;
  transition:background .12s;
  display:inline-block;
}
.pd-marketing-more summary::-webkit-details-marker{display:none}
.pd-marketing-more summary:hover{background:#dbeafe}
.pd-marketing-more[open] summary{margin-bottom:.55rem}
.pd-marketing-more p{margin-top:.45rem}

/* ══ COMPARE button on cards ══════════════════════════ */
.cpg-card-footer{
  display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;
  margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--border1);
}
@media(max-width:480px){
  .cpg-card-footer{flex-direction:column;align-items:stretch;gap:.35rem}
  .cpg-expand-btn.cpg-expand-main{width:100%;justify-content:center}
  .cpg-compare-chk{justify-content:center}
}
/* ── Fő CTA: "Compară prețuri" ── */
.cpg-expand-btn.cpg-expand-main{
  flex:1;justify-content:center;
  background:var(--navy3);color:#fff;
  border:none;border-radius:7px;
  font-size:.77rem;font-weight:700;
  padding:.48rem .7rem;cursor:pointer;
  gap:.35rem;display:inline-flex;align-items:center;
  transition:background .14s,transform .1s;font-family:inherit;
  white-space:nowrap;
}
.cpg-expand-btn.cpg-expand-main:hover{background:var(--navy2);transform:translateY(-1px)}
.cpg-expand-btn.cpg-expand-main:active{transform:translateY(0)}
/* ── Secondary: spec-összehasonlítás checkbox ── */
.cpg-compare-chk{
  display:flex;align-items:center;gap:.35rem;
  cursor:pointer;padding:.3rem .45rem;border-radius:6px;
  transition:background .13s;user-select:none;
  border:1.5px solid #e2e8f0;flex-shrink:0;
}
.cpg-compare-chk:hover{background:#f0f4ff;border-color:#bfdbfe}
.cpg-compare-chk.active{background:#eff6ff;border-color:#93c5fd}
.cpg-chk-box{
  width:15px;height:15px;flex-shrink:0;
  border:2px solid #94a3b8;border-radius:3px;
  background:#fff;display:flex;align-items:center;justify-content:center;
  transition:all .13s;
}
.cpg-chk-box.checked{background:#3b82f6;border-color:#3b82f6}
.cpg-chk-label{font-size:.7rem;font-weight:600;color:#64748b;line-height:1;white-space:nowrap}
.cpg-compare-chk.active .cpg-chk-label{color:#1d4ed8}
.cpg-compare-btn.visually-hidden{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:0;
}
/* ── Fallback expand btn (non-main) ── */
.cpg-expand-btn:not(.cpg-expand-main){
  display:inline-flex;align-items:center;gap:.3rem;
  background:none;border:none;cursor:pointer;
  font-size:.72rem;color:var(--muted);font-weight:500;
  padding:.3rem .4rem;border-radius:6px;transition:background .13s;
  font-family:inherit;white-space:nowrap;flex-shrink:0;
}
.cpg-expand-btn:not(.cpg-expand-main):hover{background:var(--surface2);color:var(--text)}

/* ══ COMPARE BAR (floating bottom) ═══════════════════ */
.compare-bar{
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:550;
  background:linear-gradient(180deg,rgba(15,23,42,.97),rgba(15,23,42,1));
  border-top:2px solid #3b82f6;
  padding:.75rem 1.4rem;
  box-shadow:0 -8px 24px rgba(0,0,0,.3);
  display:flex;align-items:center;gap:1.2rem;
  animation:cbSlideUp .25s ease-out;
}
.compare-bar.hidden{display:none}
@keyframes cbSlideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.compare-bar .cb-left{display:flex;flex-direction:column;gap:.4rem;flex:1;min-width:0}
.cb-hint{font-size:.82rem;color:rgba(255,255,255,.75);font-weight:600}
.cb-hint strong{color:#60a5fa}
.cb-thumbs{display:flex;align-items:flex-end;gap:.6rem;flex-wrap:wrap}
.cb-thumb{
  width:52px;flex-shrink:0;
  display:flex;flex-direction:column;align-items:center;gap:.2rem;
  position:relative;
}
.cb-thumb img{
  width:48px;height:48px;border-radius:8px;
  background:#fff;border:2px solid #3b82f6;
  object-fit:contain;display:block;
}
.cb-name{
  font-size:.55rem;color:rgba(255,255,255,.6);
  text-align:center;line-height:1.2;
  max-width:52px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.cb-thumb.cb-empty{
  width:48px;height:48px;border-radius:8px;
  background:transparent;border:2px dashed rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.3);font-size:.9rem;font-weight:700;
}
.cb-thumb-x{
  position:absolute;top:-6px;right:-6px;
  background:#ef4444;color:#fff;border:2px solid #0f172a;
  width:18px;height:18px;border-radius:50%;
  font-size:.68rem;font-weight:800;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  padding:0;line-height:1;
}
.cb-thumb-x:hover{background:#dc2626;transform:scale(1.15)}
.cb-actions{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.cb-clear{
  background:transparent;color:rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.2);
  padding:.5rem .9rem;border-radius:7px;
  font-family:inherit;font-size:.8rem;font-weight:600;cursor:pointer;
  transition:all .12s;
}
.cb-clear:hover{background:rgba(255,255,255,.08);color:#fff}
.cb-go{
  background:linear-gradient(135deg,#3b82f6,#1e40af);
  color:#fff;border:none;
  padding:.65rem 1.6rem;border-radius:8px;
  font-family:inherit;font-size:.95rem;font-weight:800;cursor:pointer;
  box-shadow:0 3px 12px rgba(59,130,246,.5);
  transition:all .14s;white-space:nowrap;
}
.cb-go:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 18px rgba(59,130,246,.65)}
.cb-go:disabled{opacity:.4;cursor:not-allowed;background:#334155;box-shadow:none}

@media (max-width:600px){
  .compare-bar{padding:.65rem .8rem;gap:.6rem}
  .cb-thumb{width:42px;height:42px}
  .cb-count{display:none}
  .cb-clear{padding:.4rem .7rem;font-size:.74rem}
  .cb-go{padding:.5rem 1rem;font-size:.82rem}
}

/* ══ COMPARE MODAL ═══════════════════════════════════ */
.cmp-overlay{
  position:fixed;inset:0;z-index:700;
  background:rgba(15,23,42,.75);backdrop-filter:blur(5px);
  display:none;align-items:flex-start;justify-content:center;
  padding:2rem 1rem;overflow-y:auto;
}
.cmp-overlay.open{display:flex;animation:cmpFade .2s}
@keyframes cmpFade{from{opacity:0}to{opacity:1}}
.cmp-modal{
  background:#fff;border-radius:14px;
  max-width:1200px;width:100%;
  padding:1.8rem 1.6rem 1.3rem;
  box-shadow:0 25px 60px rgba(0,0,0,.4);
  position:relative;
  animation:cmpSlide .25s cubic-bezier(.4,0,.2,1);
}
@keyframes cmpSlide{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
.cmp-close{
  position:absolute;top:.85rem;right:.85rem;
  background:rgba(15,23,42,.06);border:none;
  width:36px;height:36px;border-radius:10px;
  font-size:1.1rem;color:var(--muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .12s;
}
.cmp-close:hover{background:#ef4444;color:#fff}
.cmp-h2{
  font-size:1.4rem;font-weight:800;color:var(--text);
  margin:0 0 1.2rem;letter-spacing:-.02em;
}
/* ── Gemini AI comparison box ─────────────────────────────────────────────── */
.cmp-ai-box{
  background:linear-gradient(135deg,#fdf4ff,#f3e8ff);
  border:1.5px solid #c084fc;
  border-radius:13px;
  padding:1rem 1.25rem;
  margin-bottom:1.2rem;
  transition:background .4s;
}
.cmp-ai-box--loading{background:linear-gradient(135deg,#faf5ff,#f0e6ff);opacity:.85}
.cmp-ai-content{width:100%}
.cmp-ai-label{
  font-size:.72rem;font-weight:800;color:#7c3aed;
  text-transform:uppercase;letter-spacing:.05em;
  margin-bottom:.45rem;display:flex;align-items:center;gap:.5rem;
}
.cmp-ai-badge{
  background:#7c3aed;color:#fff;
  font-size:.65rem;font-weight:700;
  padding:.15em .5em;border-radius:20px;
  text-transform:none;letter-spacing:0;
}
.cmp-ai-text{
  font-size:.93rem;line-height:1.58;color:#3b0764;
  white-space:pre-line;
}
.cmp-ai-spinner{
  display:inline-block;width:14px;height:14px;
  border:2.5px solid #c084fc;border-top-color:#7c3aed;
  border-radius:50%;animation:cmp-spin .7s linear infinite;
  vertical-align:middle;margin-right:.4rem;
}
@keyframes cmp-spin{to{transform:rotate(360deg)}}

.cmp-summary{
  background:linear-gradient(135deg,#eff6ff,#dbeafe);
  border:1px solid #93c5fd;
  border-radius:11px;
  padding:1rem 1.2rem;
  margin-bottom:1.3rem;
}
.cmp-summary-title{
  font-size:.78rem;font-weight:800;color:#1e40af;
  text-transform:uppercase;letter-spacing:.04em;
  margin-bottom:.55rem;
}
.cmp-summary-body p{
  font-size:.92rem;line-height:1.5;color:var(--text);
  margin:0 0 .4rem;
}
.cmp-summary-body p:last-child{margin-bottom:0}
.cmp-summary-body strong{color:#1e40af}

/* ── Smart summary sections ──────────────── */
.cmp-sum-price{
  font-size:.97rem;font-weight:600;color:var(--text);
  margin-bottom:.9rem;padding-bottom:.75rem;
  border-bottom:1px solid #bfdbfe;
}
.cmp-sum-price strong{color:#1e40af}
.cmp-sum-section{
  margin-bottom:.9rem;
}
.cmp-sum-section:last-child{margin-bottom:0}
.cmp-sum-section-title{
  font-size:.78rem;font-weight:800;color:#1e40af;
  text-transform:uppercase;letter-spacing:.04em;
  margin-bottom:.5rem;
}
.cmp-sum-list{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:.35rem;
}
.cmp-sum-list li{
  font-size:.88rem;line-height:1.45;color:var(--text);
  padding:.3rem .55rem;
  background:#f0f7ff;border-radius:7px;
}
.cmp-sum-list li strong{color:#1e40af}
.cmp-sum-winner-tag{
  display:inline-block;
  background:#1d4ed8;color:#fff;
  font-size:.72rem;font-weight:700;
  padding:.1em .45em;border-radius:4px;
  vertical-align:middle;margin-right:.15em;
  white-space:nowrap;
}
.cmp-sum-note{
  font-size:.85rem;color:#6b7280;font-style:italic;
  margin:.25rem 0 0;
}
/* Verdict boxes */
.cmp-sum-verdict{
  font-size:.9rem;line-height:1.5;
  border-radius:9px;padding:.65rem .9rem;
  margin-bottom:.9rem;
}
.cmp-sum-verdict strong{display:inline}
.cmp-sum-verdict--yes{
  background:#d1fae5;border:1px solid #6ee7b7;color:#065f46;
}
.cmp-sum-verdict--yes strong{color:#064e3b}
.cmp-sum-verdict--maybe{
  background:#fef9c3;border:1px solid #fde047;color:#713f12;
}
.cmp-sum-verdict--maybe strong{color:#78350f}
.cmp-sum-verdict--no{
  background:#fff7ed;border:1px solid #fdba74;color:#7c2d12;
}
.cmp-sum-verdict--no strong{color:#9a3412}
/* Persona cards */
.cmp-sum-personas{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:.6rem;
}
.cmp-sum-persona{
  background:#f8fafc;border:1px solid #e2e8f0;
  border-radius:9px;padding:.65rem .8rem;
  display:flex;flex-direction:column;gap:.3rem;
}
.cmp-sum-persona-name{
  font-size:.82rem;font-weight:700;color:var(--navy2);
  display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;
}
.cmp-sum-persona-price{
  font-size:.8rem;font-weight:600;color:#059669;
}
.cmp-sum-persona-text{
  font-size:.83rem;color:var(--text);line-height:1.4;
}
.cmp-sum-persona-wins{
  list-style:none;padding:0;margin:.15rem 0 0;
  display:flex;flex-direction:column;gap:.2rem;
}
.cmp-sum-persona-wins li{
  font-size:.78rem;color:#374151;
  padding:.18rem .35rem;background:#e0f2fe;
  border-radius:5px;
}
.cmp-sum-persona-wins li strong{color:#0369a1}
.cmp-sum-persona-no-wins{
  font-size:.78rem;color:#9ca3af;font-style:italic;margin:0;
}
.cmp-sum-badge{
  font-size:.65rem;font-weight:700;border-radius:4px;
  padding:.1em .4em;text-transform:uppercase;letter-spacing:.03em;
}
.cmp-sum-badge--power{background:#ddd6fe;color:#4c1d95}
.cmp-sum-badge--budget{background:#d1fae5;color:#064e3b}

/* Warning / suggestion blocks */
.cmp-sum-section--warn{margin-bottom:.9rem}
.cmp-sum-suggest{
  font-size:.88rem;line-height:1.5;
  padding:.6rem .85rem;border-radius:9px;
  margin-bottom:.4rem;
}
.cmp-sum-suggest:last-child{margin-bottom:0}
.cmp-sum-suggest--warn{
  background:#fff3cd;border:1px solid #ffc107;color:#664d03;
}
.cmp-sum-suggest--warn strong{color:#5c3d00}
.cmp-sum-suggest--info{
  background:#e0f2fe;border:1px solid #7dd3fc;color:#0c4a6e;
}
.cmp-sum-suggest--info strong{color:#0369a1}

/* Addon / accessories suggestions */
.cmp-sum-section--addons{
  border-top:1px solid #e2e8f0;padding-top:.75rem;margin-top:.3rem;
}
.cmp-sum-addons{
  display:flex;flex-direction:column;gap:.4rem;
}
.cmp-sum-addon{
  display:flex;align-items:flex-start;gap:.6rem;
  background:#f8fafc;border:1px solid #e2e8f0;
  border-radius:8px;padding:.5rem .7rem;
}
.cmp-sum-addon-icon{font-size:1.25rem;flex-shrink:0;margin-top:.05rem}
.cmp-sum-addon-body{flex:1;min-width:0}
.cmp-sum-addon-title{
  font-size:.82rem;font-weight:700;color:var(--navy2);
  display:flex;gap:.4rem;align-items:baseline;flex-wrap:wrap;
}
.cmp-sum-addon-est{
  font-size:.75rem;font-weight:600;color:#059669;
  background:#d1fae5;border-radius:4px;padding:.05em .35em;
}
.cmp-sum-addon-desc{font-size:.78rem;color:#64748b;line-height:1.4;margin-top:.1rem}
.cmp-sum-addon-link{
  flex-shrink:0;align-self:center;
  font-size:.76rem;font-weight:700;
  color:var(--navy3);
  background:#eff6ff;border:1px solid #bfdbfe;
  border-radius:6px;padding:.25rem .55rem;
  text-decoration:none;white-space:nowrap;
  transition:background .14s,color .14s;
}
.cmp-sum-addon-link:hover{background:var(--navy3);color:#fff}
.cmp-grid{
  display:grid;
  grid-template-columns:160px repeat(var(--cols,2),1fr);
  gap:.85rem;
  margin-bottom:1.3rem;
  padding-bottom:1.3rem;border-bottom:1px solid var(--border);
}
.cmp-col-spec-header{display:flex;align-items:center}
.cmp-spec-h{font-size:.85rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.cmp-col{
  display:flex;flex-direction:column;gap:.55rem;
  text-align:center;
}
.cmp-img{
  width:100%;height:160px;
  background:#f8fafc;
  border:1px solid var(--border);border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;font-size:2rem;
}
.cmp-img img{max-width:90%;max-height:90%;object-fit:contain}
.cmp-title{
  font-size:.85rem;font-weight:700;color:var(--text);
  line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden;
  min-height:3.4em;
}
.cmp-price-row{
  display:flex;flex-direction:column;align-items:center;gap:.1rem;
}
.cmp-price{font-size:1.15rem;font-weight:800;color:var(--green)}
.cmp-store{font-size:.72rem;font-weight:700;letter-spacing:.02em}
/* Spec source badge */
.cmp-spec-src{
  display:inline-block;font-size:.67rem;font-weight:700;
  border-radius:4px;padding:.12em .45em;text-align:center;
}
.cmp-spec-src--live{background:#d1fae5;color:#065f46}
.cmp-spec-src--local{background:#f1f5f9;color:#94a3b8}

.cmp-buy{
  background:linear-gradient(135deg,#16a34a,#15803d);
  color:#fff;text-decoration:none;
  padding:.55rem .9rem;border-radius:7px;
  font-size:.82rem;font-weight:700;
  transition:all .14s;display:inline-block;
}
.cmp-buy:hover{transform:translateY(-1px);box-shadow:0 3px 10px rgba(22,163,74,.4)}
.cmp-rm{
  background:transparent;color:var(--red);
  border:1px solid #fca5a5;border-radius:6px;
  font-family:inherit;font-size:.7rem;font-weight:600;
  padding:.32rem .65rem;cursor:pointer;
  transition:all .12s;
}
.cmp-rm:hover{background:#fee2e2}
.cmp-table{
  width:100%;border-collapse:collapse;font-size:.85rem;
}
.cmp-table th,.cmp-table td{
  padding:.55rem .75rem;text-align:left;
  border-bottom:1px solid var(--border);
  vertical-align:top;
}
.cmp-table thead th{
  background:#f8fafc;
  font-weight:800;color:var(--text);
  font-size:.78rem;
  position:sticky;top:0;
}
.cmp-table tbody th{
  font-weight:600;color:var(--muted);
  background:#fafbfc;
  width:160px;
}
.cmp-table tbody td{color:var(--text);font-weight:500}
.cmp-table tr.cmp-diff td{
  background:linear-gradient(90deg,rgba(254,243,199,.45),transparent);
  font-weight:600;
}
/* Key spec rows (RAM, GPU, OS) — visually emphasized */
.cmp-table tr.cmp-key-spec th{
  color:var(--navy2);font-weight:700;
  background:#eff6ff;
}
.cmp-table tr.cmp-key-spec.cmp-diff th{color:#1e40af}
.cmp-table tr.cmp-key-spec.cmp-diff td{
  background:linear-gradient(90deg,rgba(219,234,254,.6),transparent);
}
/* Warning row — Free DOS, no OS */
.cmp-table tr.cmp-warn-row td,
.cmp-table tr.cmp-warn-row th{
  background:#fffbeb;color:#92400e;
}
.cmp-table tr.cmp-warn-row th{font-weight:700}
.cmp-no-specs{
  padding:1rem 1.2rem;text-align:left;
  color:var(--muted);font-size:.84rem;line-height:1.6;
  background:#f9fafb;border-radius:8px;
  border-left:3px solid #cbd5e1;
  display:flex;flex-direction:column;gap:.3rem;
}
.cmp-no-specs-icon{font-size:1.1rem;margin-right:.3rem}
.cmp-footer{
  margin-top:1rem;text-align:center;
  color:var(--muted);font-size:.78rem;
}
@media (max-width:768px){
  .cmp-modal{padding:1.3rem 1rem;border-radius:10px}
  .cmp-h2{font-size:1.15rem}
  .cmp-grid{grid-template-columns:repeat(var(--cols,2),1fr);gap:.55rem}
  .cmp-col-spec-header{display:none}
  .cmp-img{height:120px}
  .cmp-title{font-size:.78rem;min-height:2.8em;-webkit-line-clamp:2}
  .cmp-price{font-size:.95rem}
  .cmp-table th,.cmp-table td{padding:.4rem .5rem;font-size:.78rem}
  .cmp-table tbody th{width:auto;font-size:.74rem}
}

@media (max-width:600px){
  .pd-review-links{grid-template-columns:1fr}
  .rl-card{padding:.55rem .7rem}
  .rl-icon{font-size:1.25rem}
  .rl-label{font-size:.82rem}
}
.pd-best-tag{
  font-size:.58rem;font-weight:900;letter-spacing:.06em;
  background:var(--green);color:#fff;border-radius:999px;padding:.1rem .45rem;
}
.pd-store-link{font-size:.7rem;color:var(--muted);text-decoration:none;font-weight:500}
.pd-store-link:hover{color:var(--blue);text-decoration:underline}

.pd-row-mid{grid-column:2;display:flex;align-items:baseline;gap:.55rem;flex-wrap:wrap;justify-content:flex-end}
.pd-row-price{font-size:1.18rem;font-weight:900;color:var(--text);letter-spacing:-.02em}
.pd-row-price small{font-size:.72rem;font-weight:600;color:var(--muted)}
.pd-row-best .pd-row-price{color:var(--green2)}
.pd-row-diff{font-size:.7rem;color:var(--amber);font-weight:600}
.pd-free-ship{font-size:.65rem;color:#16a34a;font-weight:700;white-space:nowrap}
.pd-ship-cost{font-size:.65rem;color:var(--muted);font-weight:500;white-space:nowrap}
.pd-row-disc{
  background:var(--red);color:#fff;border-radius:999px;
  padding:.1rem .45rem;font-size:.62rem;font-weight:800;
}
.pd-row-buy{
  grid-row:span 2;grid-column:3;align-self:center;
  color:#fff;border-radius:9px;padding:.6rem 1.1rem;
  font-size:.78rem;font-weight:800;white-space:nowrap;
  text-align:center;letter-spacing:.01em;
  box-shadow:0 2px 10px rgba(0,0,0,.2);
  transition:opacity .14s,transform .13s,box-shadow .14s;
}
.pd-row-buy:hover{opacity:.88;transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,.28)}

/* Selected card highlight */
.cpg-card.selected{
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(37,99,235,.15),0 6px 24px rgba(37,99,235,.15);
}

@media(max-width:600px){
  .pd-drawer{width:100vw}
  .pd-header{flex-direction:column;align-items:stretch}
  .pd-imgwrap{width:100%;height:200px}
  .pd-image{max-height:180px}
  .pd-row{grid-template-columns:1fr;gap:.5rem}
  .pd-row-buy{grid-row:auto;grid-column:auto;width:100%}
}

/* ══ SIMILAR PRODUCTS SECTION ════════════════════════ */
.similar-section{
  margin-top:1.5rem;padding-top:1.5rem;
  border-top:2px dashed var(--border2);
  display:flex;flex-direction:column;gap:1rem;
}
.similar-header{
  display:flex;align-items:baseline;gap:.85rem;flex-wrap:wrap;
}
.similar-title{
  font-size:1.05rem;font-weight:800;color:var(--text);
  letter-spacing:-.015em;
}
.similar-sub{font-size:.76rem;color:var(--muted);font-weight:500}
.similar-list{display:flex;flex-direction:column;gap:.55rem;opacity:.92}
.similar-list .cpg-card{border-style:dashed}

/* ══ DRAWER SIMILAR PRODUCTS (compari.ro style) ══ */
.pd-similar{
  border-top:2px dashed var(--border2);
  padding-top:1.2rem;
  margin-top:.4rem;
}
.pd-similar-header{
  display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;
  margin-bottom:.9rem;
}
.pd-similar-icon{font-size:1.1rem}
.pd-similar-title{font-size:.95rem;font-weight:800;color:var(--text);letter-spacing:-.01em}
.pd-similar-sub{font-size:.72rem;color:var(--muted);font-weight:500;margin-left:auto}
.pd-similar-list{display:flex;flex-direction:column;gap:.5rem}
/* Kompakt mini-kártyák a drawer-ben (cross-store hasonló termékek) */
.pd-sim-list{display:flex;flex-direction:column;gap:.5rem}
.pd-sim-card{
  display:flex;align-items:center;gap:.7rem;
  background:#fafbfc;
  border:1px solid var(--border);
  border-radius:9px;
  padding:.55rem .7rem;
  text-decoration:none;
  color:inherit;
  transition:background .12s,border-color .12s,transform .1s;
}
.pd-sim-card:hover{background:#f3f4f6;border-color:#9ca3af;transform:translateX(2px)}
.pd-sim-img{
  flex:0 0 56px;width:56px;height:56px;
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--border);border-radius:7px;
  overflow:hidden;font-size:1.4rem;
}
.pd-sim-img img{max-width:100%;max-height:100%;object-fit:contain}
.pd-sim-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.25rem}
.pd-sim-name{
  font-size:.82rem;font-weight:600;color:var(--text);
  line-height:1.3;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;text-overflow:ellipsis;
}
.pd-sim-meta{display:flex;align-items:center;justify-content:space-between;gap:.4rem}
.pd-sim-store{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.pd-sim-price{font-size:.92rem;font-weight:800;color:var(--green);white-space:nowrap}
.pd-similar-list .cpg-card{
  border-color:var(--border2);
  background:#fafbfc;
  opacity:.93;
  max-width:100%;
  overflow:hidden;
}
.pd-similar-list .cpg-card:hover{opacity:1}
/* Keep add-to-cart button inside drawer cards */
.pd-similar-list .cpg-add{
  min-width:0;
  flex-shrink:1;
  max-width:120px;
}
.pd-similar-list .cpg-footer{
  flex-wrap:wrap;
  gap:.4rem;
}
.pd-similar-list .cpg-body{
  max-width:100%;
  overflow:hidden;
}

/* ══ DETAILS BUTTON & EXPAND PANEL ══════════════════ */
.cpg-expand-btn{
  display:inline-flex;align-items:center;gap:.4rem;
  background:#f8fafc;border:1.5px solid #e2e8f0;color:#475569;
  font-size:.75rem;font-weight:600;cursor:pointer;
  padding:.38rem .85rem;border-radius:8px;
  margin-top:.35rem;font-family:inherit;
  transition:all .15s;width:fit-content;align-self:flex-start;
}
.cpg-expand-btn:hover{background:#eff6ff;border-color:#93c5fd;color:var(--navy3)}
.cpg-card.expanded .cpg-expand-btn{background:#eff6ff;border-color:#93c5fd;color:var(--navy3)}
.cpg-expand-chevron{transition:transform .22s cubic-bezier(.4,0,.2,1);flex-shrink:0}

/* ══ INLINE EXPAND PANEL ═════════════════════════════ */
.exp-panel{
  max-height:0;overflow:hidden;opacity:0;
  transition:max-height .38s cubic-bezier(.4,0,.2,1), opacity .25s ease;
  border-top:0 solid transparent;
}
.cpg-card.expanded .exp-panel{
  border-top:1.5px solid #e0e9f8;
}
.exp-inner{
  display:grid;grid-template-columns:220px 1fr;
  gap:0;background:linear-gradient(180deg,#f8faff 0%,#f1f5fb 100%);
}
.exp-header{
  grid-column:1/-1;
  display:flex;align-items:flex-start;gap:1.4rem;
  padding:1.2rem 1.4rem .9rem;
  border-bottom:1px solid #e2e9f4;
  background:#fff;
}
.exp-img{max-width:160px;max-height:160px;object-fit:contain;border-radius:6px;flex-shrink:0;border:1px solid #e2e9f4}
.exp-img-ph{width:100px;height:100px;display:flex;align-items:center;justify-content:center;background:#f8fafc;border:1px solid #e2e9f4;border-radius:8px;flex-shrink:0}
.exp-header-info{display:flex;flex-direction:column;gap:.55rem;min-width:0}
.exp-title{font-size:1.05rem;font-weight:700;color:var(--text);line-height:1.4;letter-spacing:-.01em}
.exp-save-badge{
  display:inline-flex;align-items:center;
  background:#f0fdf4;border:1.5px solid #86efac;color:#15803d;
  border-radius:8px;padding:.3rem .75rem;font-size:.76rem;font-weight:600;
  width:fit-content;
}
.exp-save-badge strong{font-weight:800;color:#15803d}
.exp-stores-label{font-size:.8rem;color:var(--muted);margin-top:.1rem}
.exp-best-price{font-size:1.08rem;font-weight:900;color:#0f172a;letter-spacing:-.02em}
.exp-best-at{font-size:.8rem;color:var(--muted);font-weight:500}

.exp-stores{
  grid-column:1/-1;padding:.9rem 1.2rem;
  display:flex;flex-direction:column;gap:.3rem;
}
.exp-store-row{
  display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  padding:.5rem .85rem;border-radius:9px;background:#fff;
  border:1.5px solid #e2e9f4;transition:border-color .12s,box-shadow .12s;
}
.exp-store-row:hover{border-color:#93c5fd;box-shadow:0 2px 8px rgba(37,99,235,.08)}
.exp-store-row.exp-best{border-color:#86efac;background:#f0fdf4}
.exp-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.exp-sname{font-size:.85rem;font-weight:700}
.exp-best-tag{
  background:#15803d;color:#fff;border-radius:999px;
  padding:.1rem .55rem;font-size:.62rem;font-weight:800;letter-spacing:.02em;
}
.exp-price{font-size:1.05rem;font-weight:900;color:#0f172a;letter-spacing:-.02em;margin-left:auto}
.exp-price small{font-size:.7rem;font-weight:600;color:var(--muted)}
.exp-disc{background:#dc2626;color:#fff;border-radius:999px;padding:.1rem .45rem;font-size:.65rem;font-weight:800}
.exp-ship{font-size:.72rem;color:var(--muted);white-space:nowrap}
.exp-ship.free{color:#15803d;font-weight:600}
.exp-diff{font-size:.72rem;color:#94a3b8;white-space:nowrap}
.exp-buy{
  background:var(--c,#16a34a);color:#fff;border-radius:8px;
  padding:.38rem .95rem;font-size:.78rem;font-weight:700;white-space:nowrap;
  text-decoration:none;margin-left:.3rem;
  transition:opacity .13s,transform .12s,box-shadow .12s;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
}
.exp-buy:hover{opacity:.88;transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.24)}

.exp-desc-wrap{
  grid-column:1/-1;padding:.9rem 1.2rem 1.2rem;
  border-top:1px solid #e2e9f4;
}
.exp-section-title{font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.55rem}
.exp-desc-text{font-size:.85rem;line-height:1.65;color:#374151;white-space:pre-wrap}
.exp-desc-more{
  display:inline-block;margin-top:.5rem;
  background:none;border:none;color:var(--blue);
  font-size:.8rem;font-weight:600;cursor:pointer;padding:0;font-family:inherit;
}
.exp-desc-more:hover{text-decoration:underline}
.exp-loading{
  display:flex;align-items:center;gap:.7rem;
  padding:1.2rem 1.4rem;font-size:.85rem;color:var(--muted);
}
.exp-spin{
  width:1.1rem;height:1.1rem;flex-shrink:0;
  border:2px solid #e2e8f0;border-top-color:var(--blue);
  border-radius:50%;animation:spin .7s linear infinite;
}

@media(max-width:700px){
  .exp-inner{grid-template-columns:1fr}
  .exp-header{flex-direction:column;gap:.8rem}
  .exp-img{max-width:100%;max-height:200px;align-self:center}
  .exp-store-row{flex-wrap:wrap;gap:.4rem}
  .exp-price{margin-left:0}
}

/* ══ LOADERS / EMPTY ════════════════════════════════ */
.page-loader{display:flex;justify-content:center;padding:4rem 0}
.pl-inner{
  display:flex;align-items:center;gap:.85rem;color:var(--text2);font-size:.92rem;
  background:var(--surface);border:1px solid var(--border);
  padding:.8rem 1.4rem;border-radius:999px;box-shadow:var(--shadow);
  font-weight:600;
}
.pl-spin{
  width:1.3rem;height:1.3rem;flex-shrink:0;
  border:2.5px solid var(--border2);border-top-color:var(--green);
  border-radius:50%;animation:spin .65s linear infinite;
}
.list-spinner{display:flex;align-items:center;gap:.65rem;color:var(--muted);font-size:.83rem;padding:1.1rem 0}
.list-spinner .pl-spin{width:1.1rem;height:1.1rem}
.empty-state{
  text-align:center;padding:4rem 1.5rem;color:var(--muted);font-size:.95rem;
  background:var(--surface);border:1px solid var(--border);border-radius:14px;
}
.empty-icon{font-size:3.5rem;margin-bottom:1rem;opacity:.6}
.empty-state > div:nth-child(2){font-size:1.05rem;font-weight:600;color:var(--text2);margin-bottom:.4rem}
.empty-sub{font-size:.82rem;color:var(--muted2);max-width:380px;margin:.4rem auto 0;line-height:1.55}

/* ══ OPTIMIZER RESULT ═══════════════════════════════ */
.result-card{
  background:var(--surface);border:1.5px solid var(--border);
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);
}
.result-header{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;padding:1.2rem 1.5rem;
  border-bottom:1px solid var(--border);
  background:linear-gradient(135deg,#f0fdf4,#ecfdf5);
}
.result-label{font-size:.7rem;color:var(--muted);margin-bottom:.28rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.result-total{font-size:2.1rem;font-weight:900;color:var(--green);letter-spacing:-.04em}
.result-total span{font-size:.88rem;font-weight:400;color:var(--muted)}
.savings-badge{
  background:#d1fae5;color:var(--green2);border:1.5px solid #6ee7b7;
  border-radius:999px;padding:.4rem 1.1rem;font-size:.84rem;font-weight:700;
}
.store-section{border-bottom:1px solid var(--border)}
.store-section:last-of-type{border-bottom:none}
.store-section-header{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding:.85rem 1.5rem;background:#fafbfd;
  border-left:3px solid;flex-wrap:wrap;
}
.ss-info{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap;flex:1;min-width:0}
.ss-store{font-weight:800;font-size:1rem;letter-spacing:-.01em}
.ss-count{
  background:rgba(99,102,241,.1);color:#4338ca;
  font-size:.72rem;font-weight:700;padding:.18rem .55rem;
  border-radius:6px;letter-spacing:.02em;
}
.ss-ship{font-size:.78rem;color:var(--muted)}
.buy-btn{
  color:#fff;padding:.35rem .95rem;border-radius:8px;
  font-size:.76rem;font-weight:700;transition:opacity .13s;white-space:nowrap;
}
.buy-btn:hover{opacity:.82}
/* "Deschide toate" boltszekció gomb */
.open-all-btn{
  color:#fff;border:none;
  padding:.5rem 1.05rem;border-radius:9px;
  font-size:.82rem;font-weight:700;cursor:pointer;
  transition:transform .12s,box-shadow .12s,filter .12s;
  white-space:nowrap;font-family:inherit;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  display:inline-flex;align-items:center;gap:.4rem;
}
.open-all-btn:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(0,0,0,.22);filter:brightness(1.08)}
.open-all-btn:active{transform:translateY(0)}

/* Checkout launcher (a result-card alján) */
.checkout-launcher{
  padding:1rem 1.5rem 1.25rem;
  background:linear-gradient(135deg,#f0fdf4,#dcfce7);
  border-top:1px solid #bbf7d0;
  display:flex;flex-direction:column;align-items:center;gap:.45rem;
}
.checkout-go-btn{
  background:linear-gradient(135deg,#16a34a,#15803d);
  color:#fff;border:none;
  padding:.85rem 1.8rem;border-radius:12px;
  font-size:1rem;font-weight:800;cursor:pointer;
  font-family:inherit;letter-spacing:.01em;
  box-shadow:0 4px 18px rgba(22,163,74,.4),inset 0 1px 0 rgba(255,255,255,.18);
  transition:all .15s;
}
.checkout-go-btn:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(22,163,74,.55)}
.checkout-hint{font-size:.78rem;color:#15803d;font-weight:500}

/* ══ CHECKOUT-ASSISTANT OVERLAY ══════════════════════ */
.co-overlay{
  position:fixed;inset:0;z-index:600;
  background:rgba(15,23,42,.7);
  backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  padding:1rem;
  animation:coFadeIn .2s ease-out;
}
.co-overlay.hidden{display:none}
@keyframes coFadeIn{from{opacity:0}to{opacity:1}}
.co-modal{
  background:#fff;border-radius:14px;
  width:min(680px,100%);max-height:90vh;overflow-y:auto;
  padding:1.5rem 1.4rem 1.1rem;
  box-shadow:0 25px 60px rgba(0,0,0,.4);
  position:relative;
  animation:coSlideUp .25s cubic-bezier(.4,0,.2,1);
}
@keyframes coSlideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}
.co-close{
  position:absolute;top:.75rem;right:.75rem;
  background:rgba(15,23,42,.06);border:none;
  width:34px;height:34px;border-radius:9px;
  font-size:1.05rem;color:var(--muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .12s;
}
.co-close:hover{background:var(--red);color:#fff}
.co-progress{
  display:flex;align-items:center;justify-content:center;gap:.4rem;
  margin:.6rem 0 1.1rem;
}
.co-step{
  width:30px;height:30px;border-radius:50%;
  background:#e5e7eb;color:#9ca3af;
  display:flex;align-items:center;justify-content:center;
  font-size:.82rem;font-weight:800;
  transition:all .2s;
}
.co-step.active{background:#16a34a;color:#fff;box-shadow:0 0 0 4px rgba(22,163,74,.25);transform:scale(1.08)}
.co-step.done{background:#16a34a;color:#fff}
.co-line{
  flex:0 0 24px;height:2px;background:#e5e7eb;
  transition:background .2s;
}
.co-line.done{background:#16a34a}
.co-title{
  font-size:1.2rem;font-weight:800;color:var(--text);
  text-align:center;margin:0 0 1.1rem;letter-spacing:-.01em;
}
.co-content{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.1rem}
.co-instructions{
  background:#f8fafc;
  border:1px solid var(--border);border-radius:10px;
  padding:1rem 1.1rem;
}
.co-steps-list{
  margin:0 0 .9rem 1.2rem;padding:0;
  display:flex;flex-direction:column;gap:.4rem;
  font-size:.88rem;color:var(--text);line-height:1.45;
}
.co-steps-list li::marker{font-weight:800;color:#16a34a}
.co-open-all{
  color:#fff;border:none;width:100%;
  padding:.85rem 1.1rem;border-radius:9px;
  font-size:.95rem;font-weight:800;cursor:pointer;
  font-family:inherit;
  transition:all .15s;
  box-shadow:0 3px 12px rgba(0,0,0,.18);
}
.co-open-all:hover{transform:translateY(-1px);filter:brightness(1.08)}
.co-open-all.opened{
  background:linear-gradient(135deg,#16a34a,#15803d)!important;
  cursor:default;
}
.co-summary{
  background:#fff;border:1px solid var(--border);border-radius:10px;
  padding:.85rem 1rem;
}
.co-sum-label{
  font-size:.74rem;color:var(--muted);font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:.55rem;
}
.co-sum-item{
  display:grid;grid-template-columns:1fr auto auto;gap:.65rem;
  padding:.45rem 0;font-size:.84rem;
  border-bottom:1px solid rgba(226,232,240,.6);
}
.co-sum-item:last-of-type{border-bottom:none}
.co-sum-name{color:var(--text);line-height:1.3;font-weight:500}
.co-sum-qty{color:var(--muted);font-weight:600;font-size:.78rem}
.co-sum-price{color:var(--text);font-weight:700;white-space:nowrap}
.co-sum-shipping{
  margin-top:.55rem;padding-top:.55rem;
  border-top:1px solid var(--border);
  font-size:.82rem;color:var(--muted);
}
.co-sum-total{
  margin-top:.4rem;font-size:.95rem;color:var(--green);text-align:right;
}
.co-actions{
  display:flex;gap:.65rem;justify-content:space-between;
  padding-top:.4rem;
}
.co-back-btn,.co-next-btn{
  padding:.65rem 1.4rem;border-radius:9px;
  font-size:.88rem;font-weight:700;cursor:pointer;
  font-family:inherit;transition:all .14s;
  border:none;
}
.co-back-btn{
  background:#f3f4f6;color:var(--text2);border:1px solid var(--border);
}
.co-back-btn:hover:not(:disabled){background:#e5e7eb}
.co-back-btn:disabled{opacity:.3;cursor:not-allowed}
.co-next-btn{
  background:linear-gradient(135deg,#16a34a,#15803d);color:#fff;
  box-shadow:0 3px 12px rgba(22,163,74,.35);
}
.co-next-btn:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(22,163,74,.45)}
.co-finish{text-align:center;padding:.6rem 0}
.co-finish-msg{font-size:1.05rem;color:var(--text);margin:0 0 1rem;font-weight:600}
.co-finish-total{
  font-size:1.05rem;color:var(--text);
  background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;
  padding:.85rem 1.1rem;margin-bottom:.85rem;
}
.co-finish-total strong{color:var(--green);font-size:1.4rem;display:inline-block;margin-left:.5rem}
.co-finish-savings{
  font-size:1rem;color:#fff;font-weight:700;
  background:linear-gradient(135deg,#f59e0b,#d97706);
  padding:.55rem 1rem;border-radius:8px;
  display:inline-block;margin-bottom:.85rem;
  box-shadow:0 3px 10px rgba(245,158,11,.4);
}
.co-finish-hint{font-size:.84rem;color:var(--muted);line-height:1.5;margin:0}

@media (max-width:600px){
  .co-modal{padding:1.2rem 1rem .9rem;border-radius:10px}
  .co-title{font-size:1.05rem}
  .co-step{width:26px;height:26px;font-size:.74rem}
  .co-line{flex:0 0 16px}
  .co-back-btn,.co-next-btn{padding:.55rem 1rem;font-size:.82rem}
  .co-open-all{font-size:.86rem;padding:.7rem .9rem}
}
.result-item{
  display:flex;align-items:flex-start;gap:.9rem;
  padding:.85rem 1.5rem;
  border-bottom:1px solid rgba(226,232,240,.7);
}
.result-item:last-of-type{border-bottom:none}
.ri-thumb{width:52px;height:52px;object-fit:contain;background:#f8fafc;border-radius:8px;padding:3px;flex-shrink:0}
.ri-thumb-ph{width:52px;height:52px;display:flex;align-items:center;justify-content:center;background:var(--bg);border-radius:8px;font-size:1.5rem;flex-shrink:0}
.ri-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:.26rem}
.ri-name{font-size:.83rem;color:var(--text);font-weight:600;line-height:1.38}
.ri-name:hover{color:var(--blue);text-decoration:underline}
.ri-qty-price{font-size:.73rem;color:var(--muted)}
.ri-total{font-size:.95rem;font-weight:700;color:var(--text);white-space:nowrap;flex-shrink:0}
.price-compare-row{display:flex;flex-wrap:wrap;gap:.24rem;margin-top:.12rem}
.pc-tag{font-size:.66rem;padding:.08rem .42rem;border-radius:999px}
.pc-tag.chosen{background:#d1fae5;color:var(--green2);border:1px solid #6ee7b7}
.pc-tag.other{background:var(--bg);color:var(--muted);border:1px solid var(--border)}
.pc-tag.cheaper{background:#fef3c7;color:var(--amber);border:1px solid #fcd34d}
.why-hint{font-size:.66rem;color:var(--amber);font-style:italic}
.store-subtotal{text-align:right;padding:.5rem 1.5rem;font-size:.76rem;color:var(--muted);background:#f8fafc}
.ai-tip{padding:.9rem 1.5rem;font-size:.8rem;color:var(--muted);background:#fffbeb;border-top:1px solid #fde68a;line-height:1.6}
.ai-tip strong{color:var(--navy3)}

/* ══ SHARE ══════════════════════════════════════════ */
.share-card{
  background:var(--surface);border:1.5px solid var(--border);
  border-radius:var(--radius);padding:1.15rem 1.35rem;box-shadow:var(--shadow);
}
.share-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.7rem}
.share-title{font-size:.9rem;font-weight:700;margin-bottom:.15rem;color:var(--text)}
.share-sub{font-size:.74rem;color:var(--muted)}
.share-actions{display:flex;flex-direction:column;gap:.4rem;align-items:flex-end}
.btn-share{background:var(--green);color:#fff;border:none;border-radius:8px;padding:.46rem 1.05rem;font-size:.82rem;font-weight:700;cursor:pointer;transition:all .13s;box-shadow:0 2px 10px rgba(22,163,74,.3)}
.btn-share:hover{opacity:.88;transform:translateY(-1px)}
.share-row{display:flex;gap:.4rem}
.share-row input{background:var(--bg);border:1.5px solid var(--border2);border-radius:8px;padding:.4rem .8rem;color:var(--muted);font-size:.72rem;font-family:monospace;width:250px}
.btn-copy{background:transparent;border:1.5px solid var(--border2);color:var(--text2);border-radius:8px;padding:.4rem .88rem;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .13s}
.btn-copy:hover{border-color:var(--blue);color:var(--blue)}
.zk-note{font-size:.73rem;color:var(--muted);padding:.55rem .9rem;background:#eff6ff;border-left:3px solid #93c5fd;border-radius:5px;line-height:1.5}
.zk-note code{background:rgba(0,0,0,.06);padding:.1rem .3rem;border-radius:3px;font-size:.85em}

/* ══ MISC ════════════════════════════════════════════ */
.notice-box{background:#ecfdf5;border:1.5px solid #6ee7b7;color:var(--green2);padding:.78rem 1.15rem;border-radius:var(--radius);font-size:.87rem}
.error-box{background:#fef2f2;border:1.5px solid #fca5a5;color:var(--red);padding:.9rem 1.15rem;border-radius:var(--radius)}

/* ══ FOOTER ══════════════════════════════════════════ */
.site-footer{
  background:#111827;
  margin-top:4rem;
  border-top:1px solid #1f2937;
}
.footer-inner{
  max-width:1280px;margin:0 auto;
  padding:3rem 2rem 1.5rem;
}
.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:2.5rem;
  margin-bottom:2.5rem;
}
.footer-brand-col{padding-right:2rem}
.footer-brand{
  display:flex;align-items:center;gap:.6rem;
  font-size:1.15rem;font-weight:800;color:#fff;
  margin-bottom:.85rem;letter-spacing:-.02em;
}
.footer-brand strong{color:#10b981;font-weight:900}
.footer-tagline{
  font-size:.85rem;color:#9ca3af;line-height:1.6;
  margin-bottom:1.1rem;max-width:340px;
}
.footer-badges{display:flex;gap:.45rem;flex-wrap:wrap}
.trust-badge{
  font-size:.7rem;font-weight:600;color:#9ca3af;
  background:#1f2937;border:1px solid #374151;
  padding:.32rem .7rem;border-radius:6px;
  white-space:nowrap;
}
.footer-col h4{
  font-size:.74rem;font-weight:800;color:#fff;
  text-transform:uppercase;letter-spacing:.08em;
  margin-bottom:.85rem;
}
.footer-col a{
  display:block;font-size:.82rem;color:#9ca3af;
  padding:.32rem 0;transition:color .13s;
  text-decoration:none;
}
.footer-col a:hover{color:#fff}

.footer-bottom{
  border-top:1px solid #1f2937;
  padding-top:1.5rem;
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.footer-copy{font-size:.75rem;color:#6b7280;font-weight:600}
.footer-disclaimer{
  font-size:.7rem;color:#6b7280;line-height:1.6;
  max-width:580px;text-align:right;
}
.footer-disclaimer a{color:#9ca3af;text-decoration:underline}
.footer-disclaimer a:hover{color:#10b981}

@media(max-width:768px){
  .footer-inner{padding:2rem 1rem 1.5rem}
  .footer-grid{grid-template-columns:1fr 1fr;gap:1.75rem;margin-bottom:1.75rem}
  .footer-brand-col{grid-column:1 / -1;padding-right:0}
  .footer-bottom{flex-direction:column;text-align:left}
  .footer-disclaimer{text-align:left}
}
@media(max-width:480px){
  .footer-grid{grid-template-columns:1fr}
}

/* ══ CART BAR ════════════════════════════════════════ */
.cart-bar{
  position:fixed;bottom:0;left:0;right:0;z-index:300;
  background:#0d1f4c;
  border-top:1px solid rgba(255,255,255,.08);
  box-shadow:0 -4px 24px rgba(0,0,0,.25);
}
.cart-bar-inner{
  max-width:1120px;margin:0 auto;
  padding:.82rem 1.75rem;
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;
}
.cb-left{display:flex;align-items:center;gap:.75rem}
.cb-icon{font-size:1.45rem}
.cb-count{font-size:.87rem;font-weight:700;color:#fff}
.cb-sub{font-size:.71rem;color:rgba(255,255,255,.48);margin-top:.04rem}
.cb-right{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.cb-expand{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.7);border-radius:8px;
  padding:.38rem .9rem;font-size:.74rem;font-weight:600;
  cursor:pointer;transition:all .14s;white-space:nowrap;
}
.cb-expand:hover{background:rgba(255,255,255,.16);color:#fff}
.cb-optimize{
  background:linear-gradient(135deg,#16a34a 0%,#15803d 100%);
  color:#fff;border:none;border-radius:11px;
  padding:.65rem 1.2rem .65rem 1.05rem;
  font-family:inherit;cursor:pointer;
  transition:all .18s;white-space:nowrap;
  display:flex;align-items:center;gap:.65rem;
  box-shadow:0 3px 14px rgba(22,163,74,.45),inset 0 1px 0 rgba(255,255,255,.18);
  position:relative;
  letter-spacing:.005em;
}
.cb-optimize:not(:disabled){
  animation:pulseGreen 2.4s ease-in-out infinite;
}
@keyframes pulseGreen{
  0%,100%{box-shadow:0 3px 14px rgba(22,163,74,.45),inset 0 1px 0 rgba(255,255,255,.18)}
  50%    {box-shadow:0 4px 22px rgba(22,163,74,.75),inset 0 1px 0 rgba(255,255,255,.18)}
}
.cb-optimize:hover:not(:disabled){
  background:linear-gradient(135deg,#15803d 0%,#166534 100%);
  transform:translateY(-2px);
  box-shadow:0 6px 22px rgba(22,163,74,.6);
  animation:none;
}
.cb-optimize:disabled{
  opacity:.4;cursor:not-allowed;
  background:rgba(255,255,255,.12);box-shadow:none;
  animation:none;
}
.cb-optimize:disabled .cbo-arrow{display:none}
.cbo-icon{font-size:1.35rem;line-height:1;flex-shrink:0}
.cbo-text{display:flex;flex-direction:column;text-align:left;line-height:1.15;gap:.05rem}
.cbo-title{font-size:.92rem;font-weight:800;letter-spacing:.005em}
.cbo-sub{font-size:.68rem;font-weight:500;opacity:.85;letter-spacing:.02em}
.cbo-arrow{
  font-size:1.05rem;font-weight:800;
  margin-left:.15rem;
  transition:transform .15s;
}
.cb-optimize:hover:not(:disabled) .cbo-arrow{transform:translateX(3px)}
/* Spinner az optimize gomb belsejében amíg számol */
.cb-optimize.loading{
  cursor:wait;
  background:linear-gradient(135deg,#3b82f6,#2563eb);
  animation:none;
}
.cbo-spinner{
  width:18px;height:18px;flex-shrink:0;
  border:2.5px solid rgba(255,255,255,.3);
  border-top-color:#fff;
  border-radius:50%;
  animation:cboSpin .65s linear infinite;
}
@keyframes cboSpin{to{transform:rotate(360deg)}}

/* "vs" összehasonlító ár */
.result-vs{
  font-size:.78rem;color:var(--muted);margin-top:.25rem;font-weight:500;
}
.result-vs s{font-weight:600;color:#9ca3af}

/* Magyarázó pirula a result-header alatt */
.result-explainer{
  display:flex;align-items:flex-start;gap:.7rem;
  padding:.8rem 1.5rem;background:#fffbeb;
  border-bottom:1px solid #fde68a;color:#92400e;
  font-size:.85rem;line-height:1.45;
}
.re-icon{font-size:1.2rem;flex-shrink:0}

/* Warning a checkout-asszisztens lépésekben */
.co-warning{
  background:#fef3c7;border:1px solid #fcd34d;border-radius:9px;
  padding:.8rem 1rem;
  display:flex;align-items:flex-start;gap:.7rem;
  font-size:.83rem;color:#78350f;line-height:1.45;
  margin-bottom:.4rem;
}
.co-warn-icon{font-size:1.3rem;flex-shrink:0}
.co-warning strong{color:#78350f}

/* Drawer "kereses folyamatban" jelzo */
.pd-fetching{
  display:flex;align-items:center;gap:.6rem;
  margin-top:.7rem;padding:.7rem 1rem;
  background:#eff6ff;border:1px solid #bfdbfe;border-radius:9px;
  color:#1e40af;font-size:.84rem;font-weight:600;
}
.pd-fetch-spin{
  width:16px;height:16px;
  border:2.5px solid rgba(30,64,175,.25);
  border-top-color:#1e40af;
  border-radius:50%;
  animation:cboSpin .65s linear infinite;
  flex-shrink:0;
}
.cart-panel{
  max-width:1120px;margin:0 auto;
  padding:0 1.75rem .9rem;
  border-top:1px solid rgba(255,255,255,.07);
}
#cart-list{list-style:none;display:flex;flex-direction:column;gap:.38rem;padding-top:.65rem}
.cart-item{
  display:flex;align-items:center;gap:.7rem;
  background:rgba(255,255,255,.07);border-radius:9px;padding:.52rem .9rem;
  transition:background .13s;
}
.cart-item:hover{background:rgba(255,255,255,.10)}
.cart-thumb{width:38px;height:38px;object-fit:contain;background:#fff;border-radius:6px;padding:2px;flex-shrink:0}
.cart-thumb-ph{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);border-radius:6px;font-size:1.15rem;flex-shrink:0}
.cart-info{flex:1;min-width:0}
.cart-name{font-size:.79rem;font-weight:500;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cart-meta{font-size:.69rem;color:rgba(255,255,255,.44);margin-top:.05rem}
.store-tag{font-weight:700}
.cart-right{display:flex;align-items:center;gap:.4rem;flex-shrink:0}
.qty-ctrl{display:flex;align-items:center;gap:.18rem;background:rgba(0,0,0,.25);border-radius:7px;padding:.12rem .22rem}
.qty-ctrl button{background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;font-size:1rem;width:1.6rem;height:1.6rem;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .12s}
.qty-ctrl button:hover{color:#fff;background:rgba(255,255,255,.12)}
.qty-ctrl span{font-size:.8rem;font-weight:700;color:#fff;min-width:1.5rem;text-align:center}
.remove-btn{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.5);cursor:pointer;
  font-size:.78rem;font-weight:700;
  width:28px;height:28px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  transition:all .13s;flex-shrink:0;
}
.remove-btn:hover{background:rgba(220,38,38,.35);border-color:rgba(220,38,38,.5);color:#fca5a5}
.cart-empty{color:rgba(255,255,255,.35);font-size:.82rem;text-align:center;padding:.8rem 0}

/* ══ ANIMATIONS ══════════════════════════════════════ */
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}

/* ══ RESPONSIVE ══════════════════════════════════════ */
/* ════════════════════════════════════════════════════
   MOBILE FIRST RESPONSIVE — telefon, tablet, kis screen
═══════════════════════════════════════════════════════ */
@media(max-width:1024px){
  /* Tablet: kissé csökkentett sidebar */
  :root { --sidebar-w: 220px; }
  #main { padding:1.25rem 1.25rem 2rem; }
}

@media(max-width:768px){
  /* TELEFON — sidebar drawerré válik (sidebar CSS már kezeli) */
  :root{ --header-h: 56px; }

  /* Header kompakt — hamburger láthatóvá */
  .header-top{padding:0 .85rem;gap:.6rem;height:56px}
  .brand-logo{height:30px;width:30px}
  .brand-name{font-size:1rem}
  .brand-name small{display:none}
  .header-search-wrap{margin:0;flex:1}
  .header-search-box{padding:.45rem .85rem}
  #search-input{font-size:.88rem}
  .hnav-link{display:none}
  .hnav-offers{display:none}
  .hnav-admin{display:none}

  /* Main full width, kevesebb padding */
  #main{padding:1rem .85rem 5rem;gap:1rem;max-width:100%}

  /* Hero banner kisebb */
  .hero-banner{padding:1.4rem 1.2rem;border-radius:14px}
  .hero-title{font-size:1.2rem;line-height:1.25}
  .hero-sub{font-size:.78rem}
  .hero-stats{display:none}

  /* Product cards stacked (image top, info below) */
  .cpg-card{flex-direction:column}
  .cpg-img-wrap{
    width:100%;min-height:auto;height:180px;
    border-right:none;border-bottom:1px solid var(--border);
    padding:.85rem;
  }
  .cpg-img{max-height:160px;width:auto}
  .cpg-body{padding:1rem 1.1rem;gap:.6rem}
  .cpg-name{font-size:.92rem;-webkit-line-clamp:3}

  /* Compare price rows — kompaktabb */
  .cpr-row{padding:.5rem .6rem;gap:.5rem;flex-wrap:wrap}
  .cpr-store{min-width:auto;flex:1}
  .cpr-sname{font-size:.78rem}
  .cpr-total-hint{display:none}
  .cpr-prices{gap:.35rem}
  .cpr-disc{display:none}
  .cpr-buy{padding:.4rem .75rem;font-size:.72rem}

  /* Filter bar — kompakt, scroll */
  .filter-bar{padding:.6rem .75rem;gap:.5rem}
  .fb-group{gap:.35rem}
  .fb-label{font-size:.62rem}
  .fb-sort-btns{gap:.2rem;flex-wrap:wrap}
  .fb-sort{padding:.18rem .55rem;font-size:.68rem}
  .fb-stores-group{order:99;width:100%}
  .fb-reset{margin-left:0}

  /* Home deals grid 2 oszlopos */
  .home-deals-grid{grid-template-columns:repeat(2,1fr);gap:.65rem}
  .hd-img-wrap{height:140px}
  .hd-name{font-size:.78rem}
  .hd-price{font-size:1rem}

  /* Drawer (termék részletes) full screen mobilon */
  .pd-drawer{width:100vw;max-width:100vw}
  .pd-header{flex-direction:column;align-items:stretch;padding-right:0}
  .pd-imgwrap{width:100%;height:200px}
  .pd-image{max-height:180px}
  .pd-row{grid-template-columns:1fr;gap:.5rem;text-align:center}
  .pd-row-left{justify-content:center}
  .pd-row-buy{grid-row:auto;grid-column:auto;width:100%}
  .pd-best-price{font-size:1.3rem}

  /* Cart bar — kompakt mobil */
  .cart-bar-inner{padding:.7rem .85rem;gap:.5rem;flex-wrap:nowrap}
  .cb-left{flex:0 1 auto;min-width:0}
  .cb-count{font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cb-sub{font-size:.66rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cb-icon{font-size:1.3rem}
  .cb-right{flex:1;justify-content:flex-end;min-width:0}
  .cb-expand{padding:.32rem .65rem;font-size:.7rem}
  .cb-optimize{padding:.5rem .85rem;flex:0 0 auto;gap:.45rem}
  .cb-optimize .cbo-icon{font-size:1.15rem}
  .cb-optimize .cbo-title{font-size:.78rem}
  .cb-optimize .cbo-sub{display:none}
  .cb-optimize .cbo-arrow{font-size:.9rem}
  .cart-panel{padding:0 .85rem .8rem;max-height:55vh;overflow-y:auto}

  /* Cart items — egysoros, kompakt */
  .cart-item{padding:.45rem .6rem;gap:.5rem}
  .cart-thumb,.cart-thumb-ph{width:32px;height:32px}
  .cart-name{font-size:.74rem}
  .cart-meta{font-size:.65rem}
  .qty-ctrl button{width:1.5rem;height:1.5rem;font-size:.92rem}
  .qty-ctrl span{font-size:.74rem;min-width:1.2rem}
  .remove-btn{width:26px;height:26px;font-size:.72rem}

  /* Optimizer result */
  .result-header{flex-direction:column;align-items:flex-start;padding:1rem}
  .result-total{font-size:1.7rem}
  .store-section-header{flex-direction:column;align-items:flex-start;padding:.7rem 1rem;gap:.55rem}
  .open-all-btn{width:100%;justify-content:center;font-size:.78rem}
  .result-item{padding:.7rem 1rem;gap:.65rem}
  .ri-thumb,.ri-thumb-ph{width:42px;height:42px}
  .ri-name{font-size:.78rem}

  /* Share */
  .share-card{padding:.95rem 1rem}
  .share-inner{flex-direction:column;align-items:stretch;gap:.6rem}
  .share-actions{align-items:stretch}
  .share-row input{width:auto;flex:1}

  /* USP / store strip — elrejtve mobilon (kevés hely) */
  .usp-bar{display:none}
  .store-strip{display:none}

  /* How it works — 1 oszlop */
  .hiw-grid{grid-template-columns:1fr;gap:.6rem}

  /* Sidebar opened state — fix container */
  .sidebar.open + .sidebar-backdrop:not(.hidden){display:block}

  /* Footer */
  .footer-inner{flex-direction:column;gap:.75rem;padding:1rem .85rem}
  .footer-copy{margin-left:0;text-align:left;font-size:.65rem}
  .footer-links{flex-wrap:wrap;gap:.6rem}
}

@media(max-width:480px){
  /* Kis telefon — még kompaktabb */
  .header-top{gap:.4rem}
  .brand-name{font-size:.92rem}
  .header-search-box{padding:.4rem .75rem}
  #search-input{font-size:.85rem}
  .home-deals-grid{grid-template-columns:1fr;gap:.7rem}
  .hd-img-wrap{height:180px}
  .cpr-ship{display:none}
  .cpg-img-wrap{height:160px}
  .cpg-img{max-height:140px}
  .hero-title{font-size:1.1rem}
  .hero-sub{font-size:.74rem}
  .pd-row-price{font-size:1.05rem}
  .cb-optimize{padding:.45rem .75rem;gap:.35rem}
  .cb-optimize .cbo-title{font-size:.72rem}
  .cb-expand{padding:.28rem .55rem;font-size:.66rem}
  .filter-bar{padding:.55rem}
  .fb-price-inp{width:60px}
}
.hidden{display:none!important}