/* home.css — Homepage-specific styles (extracted from inline) */

/* mobile heading shrink */
@media (max-width: 767px) { h3, .h3 { font-size: 1rem !important; } }

/* ── Hero section ── */
.hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(5,9,20,.95) 0%, rgba(15,20,45,.90) 50%, rgba(5,9,20,.95) 100%);
  border-radius: 24px;
}
[data-theme="day"] .hero {
  background: linear-gradient(135deg, #e8ecff 0%, #f4f6ff 40%, #e0e7ff 100%);
}

/* animated canvas behind hero */
.hero-canvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 1; opacity: .7;
}
[data-theme="day"] .hero-canvas { opacity: .45; }

/* heading — extra bottom padding to prevent descender clipping */
.hero-heading {
  background: linear-gradient(135deg, #fff 0%, #36d1ff 45%, #14b8a6 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
  padding-bottom: .15em;
  line-height: 1.15;
}
[data-theme="day"] .hero-heading {
  background: linear-gradient(135deg, #1a1a2e 0%, #0891b2 45%, #0d9488 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* lead text */
.hero-lead { color: rgba(255,255,255,.8); font-size: 1.05rem; line-height: 1.7; max-width: 620px; margin: 0 auto; }
[data-theme="day"] .hero-lead { color: #475569; }

/* stat highlights — large, no underline */
.hero-stat {
  font-weight: 800; color: var(--tp-accent);
  font-size: 1.3em;
  letter-spacing: -.02em;
}

/* buttons — unified dark glass style */
.hero-btn {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .65rem 1.4rem; border-radius: 8px;
  font-weight: 600; font-size: .92rem;
  text-decoration: none !important;
  color: #fff !important;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  position: relative; overflow: hidden;
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
[data-theme="day"] .hero-btn {
  background: rgba(0,0,0,.05);
  border-color: rgba(0,0,0,.12);
  color: #1a1a2e !important;
}
.hero-btn:hover {
  transform: scale(1.02);
  box-shadow: 0 4px 14px rgba(54,209,255,.10), 0 2px 8px rgba(20,184,166,.10);
  border-color: rgba(20,184,166,.3);
}
[data-theme="day"] .hero-btn:hover {
  box-shadow: 0 4px 14px rgba(8,145,178,.08), 0 2px 8px rgba(13,148,136,.08);
  border-color: rgba(13,148,136,.25);
}

/* shine sweep on hover */
.hero-btn::after {
  content: ''; position: absolute; top: 0; left: -100%; width: 60%; height: 100%;
  background: linear-gradient(105deg, transparent 30%, rgba(255,255,255,.25) 50%, transparent 70%);
  transition: left .5s ease;
}
.hero-btn:hover::after { left: 120%; }

/* coloured icons */
.hero-icon { font-size: 1.2rem; }
.hero-icon-android { color: #3ddc84; }

/* multi-browser icon row */
.hero-browsers {
  display: inline-flex; align-items: center; gap: 3px;
}
.hero-bico {
  width: 20px; height: 20px; flex-shrink: 0;
  vertical-align: middle; object-fit: contain;
}

/* hide buttons on mobile */
@media (max-width: 767px) {
  .hero-buttons { display: none !important; }
  .hero-heading { font-size: 1.4rem !important; }
  .hero-lead { font-size: .92rem; }
}

/* ── Home product cards — reuse tp-pcard design ── */
.home-pcard {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--tp-border2, rgba(0,0,0,.08));
  border-radius: var(--tp-radius2, 16px);
  text-decoration: none !important;
  color: inherit !important;
  background: rgba(255,255,255,.03);
  flex: 0 0 calc((100% - 4rem)/5);
  height: auto;
  transition: transform .32s cubic-bezier(.4,0,.2,1), box-shadow .32s cubic-bezier(.4,0,.2,1), border-color .32s ease;
}
.home-pcard:visited, .home-pcard:hover, .home-pcard:active { color: inherit !important; text-decoration: none !important; }
[data-theme="day"] .home-pcard { background: #fff; border-color: rgba(0,0,0,.08); }

.home-pcard:hover {
  transform: translateY(-6px);
  border-color: rgba(54,209,255,.18);
  box-shadow: 0 16px 48px rgba(0,0,0,.35), 0 0 0 1px rgba(54,209,255,.08);
}
[data-theme="day"] .home-pcard:hover {
  box-shadow: 0 12px 40px rgba(0,0,0,.12), 0 0 0 1px rgba(13,110,253,.12);
  border-color: rgba(13,110,253,.18);
}

/* discount badge (reduceri section) */
.home-pcard .drop-badge2 {
  position: absolute; top: 0; right: 12px;
  background: #0e7490;
  color: #fff; font-weight: 700; font-size: 0.75rem;
  padding: 4px 8px 5px; border-radius: 0 0 6px 6px;
  z-index: 5; letter-spacing: 0.02em;
  box-shadow: 0 1px 4px rgba(0,0,0,0.18); line-height: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,0.25);
}
[data-theme="night"] .home-pcard .drop-badge2 { background: #0e7490; color: #fff; box-shadow: 0 1px 4px rgba(0,0,0,0.3); text-shadow: 0 1px 2px rgba(0,0,0,0.3); }
[data-theme="day"] .home-pcard .drop-badge2 { background: #0e7490; color: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.12); text-shadow: 0 1px 1px rgba(0,0,0,0.15); }

/* image area */
.home-pcard-img-wrap {
  position: relative; width: 100%; aspect-ratio: 4/3;
  overflow: hidden; background: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.home-pcard-img {
  width: 100%; height: 100%; object-fit: contain;
  padding: 10px; background: #fff;
  transition: transform .25s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
  backface-visibility: hidden;
}
.home-pcard:hover .home-pcard-img { transform: scale(1.06); }
.home-pcard-img.home-pcard-noimg { width: 40%; height: auto; opacity: .4; padding: 20px; }

/* text body */
.home-pcard-body {
  flex: 1; display: flex; flex-direction: column;
  padding: .5rem .6rem .6rem; min-width: 0;
}
[data-theme="day"] .home-pcard-body { background: #f4f5f7; }

.home-pcard-title {
  font-size: .8rem; font-weight: 600; line-height: 1.25;
  margin-bottom: .25rem; color: inherit;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.home-pcard-merchant {
  font-size: .72rem; color: var(--tp-muted);
  margin-top: auto; padding-top: .3rem;
  display: flex; align-items: center; gap: .3rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.home-pcard-footer { padding-top: .25rem; }
.home-price-primary { font-weight: 700; font-size: .85rem; color: var(--tp-good); }
.home-pcard.placeholder {
  background: rgba(255,255,255,.02); border: 1px solid var(--tp-border2);
  border-radius: var(--tp-radius2); flex: 0 0 calc((100% - 4rem)/5); min-height: 200px;
}

/* responsive: 5→3→2 columns */
@media(max-width:991px) { .home-pcard, .home-pcard.placeholder { flex: 0 0 calc((100% - 2rem)/3); } }
@media(max-width:767px) { .home-pcard, .home-pcard.placeholder { flex: 0 0 calc((100% - 1rem)/2); } }

/* mobile: horizontal scroll */
@media(max-width:575px) {
  .home-pcard, .home-pcard.placeholder { flex: 0 0 46%; scroll-snap-align: start; }
  .home-pcard .drop-badge2 { font-size: .65rem; padding: 3px 6px 4px; right: 8px; }
  .home-pcard-title { font-size: .72rem !important; }
  .home-pcard-merchant { font-size: .65rem !important; }
  .home-price-primary { font-size: .78rem !important; }
  .home-pcard-body { padding: .4rem .5rem !important; }
}

.how-it-works .col-md-3{transition:transform .2s,color .2s;cursor:pointer;padding:1rem;}
.how-it-works .col-md-3:hover{animation:pulse .6s infinite alternate;}
.how-it-works .col-md-3:hover i.bi-search{color:#00ffff !important;}
.how-it-works .col-md-3:hover i.bi-clock-history{color:#7CFC00 !important;}
.how-it-works .col-md-3:hover i.bi-heart{color:#ff4b4b !important;}
.how-it-works .col-md-3:hover i.bi-bell{color:#ffd700 !important;}
@keyframes pulse{to{transform:scale(1.1);}}
.merchant-logo.grayscale{filter:grayscale(100%);transition:filter .2s;}
.merchant-logo:hover{filter:none;}
.sort-btn.active{background:#0891b2;color:#fff;}

/* marquee logos – fixed size, white bg, seamless infinite */
.tp-marquee-logos{overflow:hidden;position:relative;}
.tp-marquee-logos::before,.tp-marquee-logos::after{content:'';position:absolute;top:0;bottom:0;width:40px;z-index:2;pointer-events:none;}
.tp-marquee-logos::before{left:0;background:linear-gradient(90deg,var(--tp-bg0,#050914),transparent);}
.tp-marquee-logos::after{right:0;background:linear-gradient(270deg,var(--tp-bg0,#050914),transparent);}
[data-theme="day"] .tp-marquee-logos::before{background:linear-gradient(90deg,var(--tp-bg0,#f4f6ff),transparent);}
[data-theme="day"] .tp-marquee-logos::after{background:linear-gradient(270deg,var(--tp-bg0,#f4f6ff),transparent);}
.tp-marquee-logos-track{display:flex;gap:20px;align-items:center;width:max-content;animation:tpLogoScroll 80s linear infinite;}
.tp-marquee-logos:hover .tp-marquee-logos-track{animation-play-state:paused;}
@keyframes tpLogoScroll{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}
.tp-mlogo-box{flex:0 0 auto;width:140px;height:60px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:10px;border:1px solid rgba(0,0,0,.06);padding:8px 14px;cursor:pointer;transition:transform .2s,box-shadow .2s;}
.tp-mlogo-box img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(100%) opacity(.55);transition:filter .3s ease;}
.tp-mlogo-box:hover img{filter:grayscale(0%) opacity(1);}
.tp-mlogo-box:hover{transform:scale(1.06);box-shadow:0 4px 16px rgba(0,0,0,.1);}

/* promo card */
.tp-promo-card{background:linear-gradient(135deg,#0b1020 0%,#1a1f3e 100%);border-radius:var(--tp-radius2,16px);border:1px solid rgba(54,209,255,.15);overflow:hidden;color:#fff;}
.tp-promo-card .tp-promo-inner{display:flex;flex-direction:row;align-items:stretch;min-height:200px;}
.tp-promo-card .tp-promo-img{flex:0 0 280px;background:#fff;display:flex;align-items:center;justify-content:center;padding:1.5rem;}
.tp-promo-card .tp-promo-img img{max-width:100%;max-height:200px;object-fit:cover;border-radius:4px;}
.tp-promo-card .tp-promo-body{flex:1;padding:1.5rem 2rem;display:flex;flex-direction:column;justify-content:center;}
.tp-promo-card .tp-promo-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(8,145,178,.12);color:var(--tp-accent,#0891b2);font-weight:700;font-size:.78rem;padding:4px 12px;border-radius:20px;margin-bottom:.75rem;width:fit-content;}
.tp-promo-card .tp-promo-title{font-size:1.1rem;font-weight:700;margin-bottom:.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.tp-promo-card .tp-promo-merchant{font-size:.85rem;color:rgba(255,255,255,.7);margin-bottom:.5rem;}
.tp-promo-card .tp-promo-desc{font-size:.88rem;color:rgba(255,255,255,.65);margin-bottom:.75rem;line-height:1.5;}
.tp-promo-card .tp-promo-meta{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;font-size:.82rem;color:rgba(255,255,255,.5);}
.tp-promo-card .tp-promo-prices{display:flex;align-items:baseline;gap:.75rem;margin-bottom:1rem;}
.tp-promo-card .tp-promo-current{font-size:1.5rem;font-weight:800;color:var(--tp-accent,#36d1ff);}
.tp-promo-card .tp-promo-old{font-size:1rem;color:rgba(255,255,255,.45);text-decoration:line-through;}
.tp-promo-card .tp-promo-btn{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg, #0891b2, #0ea5e9);color:#fff;font-weight:700;font-size:.88rem;padding:10px 24px;border-radius:8px;text-decoration:none;transition:all .2s;width:fit-content;border:none;box-shadow:0 2px 6px rgba(8,145,178,0.15);}
.tp-promo-card .tp-promo-btn:hover{transform:scale(1.02);box-shadow:0 3px 10px rgba(8,145,178,.20);}
[data-theme="day"] .tp-promo-card{background:linear-gradient(135deg,#f8f9fc 0%,#eef2ff 100%);border-color:rgba(0,0,0,.08);color:var(--tp-fg);}
[data-theme="day"] .tp-promo-card .tp-promo-merchant{color:#666;}
[data-theme="day"] .tp-promo-card .tp-promo-desc{color:#555;}
[data-theme="day"] .tp-promo-card .tp-promo-meta{color:#888;}
[data-theme="day"] .tp-promo-card .tp-promo-old{color:#999;}
[data-theme="day"] .tp-promo-card .tp-promo-btn{background:linear-gradient(135deg, #0891b2, #0ea5e9);color:#fff;}
@media(max-width:767px){
  .tp-promo-card .tp-promo-inner{flex-direction:column;}
  .tp-promo-card .tp-promo-img{flex:0 0 auto;height:180px;padding:1rem;}
  .tp-promo-card .tp-promo-body{padding:1rem 1.25rem;}
  .tp-promo-card .tp-promo-current{font-size:1.25rem;}
  .tp-promo-card .tp-promo-btn{width:100%;justify-content:center;}
}

/* home-section/card style */
.home-section{margin-bottom:2rem;}
.home-section-header{margin-bottom:1rem;}
.home-section-title{font-size:1.25rem;font-weight:600;display:flex;align-items:center;gap:.5rem;}
.home-grid{display:flex;flex-wrap:wrap;gap:1rem;}
@media(max-width:575px){
  .home-grid{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;padding-bottom:.75rem;gap:.75rem;}
  .home-grid::-webkit-scrollbar{height:4px;}
  .home-grid::-webkit-scrollbar-thumb{background:rgba(128,128,128,.3);border-radius:3px;}
}

/* top merchants card tweaks */
#topMerchants .tp-card { display:flex; flex-direction:column; justify-content:flex-start; }
#topMerchants .merchant-thumb{width:120px;height:60px;object-fit:contain;background:#fff;padding:4px;border-radius:4px;margin:0 auto .5rem;}
#topMerchants .merchant-name, #topMerchants .tp-rating, #topMerchants .tp-muted { text-align:center; }
#topMerchants .merchant-name{color:#111;font-weight:600;}
#topMerchants .tp-rating{margin:0 auto .5rem;}
/* rank label for merchant cards */
#topMerchants .tp-rank-label{position:absolute;top:8px;left:8px;z-index:3;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:6px;background:var(--tp-card-bg,#f8f9fa);color:var(--tp-text,#333);border:1px solid var(--tp-border,#e5e7eb);line-height:1.3;}
#topMerchants .tp-rank-label.top-3{background:linear-gradient(135deg,#ffd700,#ffb347);color:#1a1a1a;border:none;box-shadow:0 1px 4px rgba(255,183,71,.3);}
/* keep merchant cards glass with readable text */
#topMerchants .tp-card{background:rgba(255,255,255,.65) !important;border:1px solid rgba(0,0,0,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
#topMerchants .merchant-name{color:#111 !important;}
#topMerchants .merchant-thumb{background:#fff;}
#topMerchants .tp-muted{color:#666 !important;}
#topMerchants .tp-rating i{color:#ffc107;}
[data-theme="night"] #topMerchants .tp-card{background:rgba(26,31,46,.55) !important;border-color:rgba(255,255,255,.08) !important;}
[data-theme="night"] #topMerchants .merchant-name{color:#e5e7eb !important;}
[data-theme="night"] #topMerchants .tp-muted{color:#94a3b8 !important;}
[data-theme="night"] #topMerchants .tp-rank-label{background:#f0f0f0;color:#333;border-color:#ddd;}
[data-theme="night"] #topMerchants .tp-rank-label.top-3{background:linear-gradient(135deg,#ffd700,#ffb347);color:#1a1a1a;border:none;}
/* responsive adjustments */
@media(max-width:767px){
  #topMerchants { grid-template-columns:repeat(auto-fit,minmax(120px,1fr)) !important; }
  #topMerchants .merchant-thumb{width:100px;height:50px;}
  #topMerchants .tp-rank-label{font-size:.6rem;padding:2px 6px;}
}