/* === 3DAKVARIA / Homepage CSS v1.1 FULL (stable pack) === */

:root {
  --c-text: #0f172a;      /* hlavní text */
  --c-muted: #64748b;     /* sekundární text */
  --c-border: #e5e7eb;    /* jemné linky, karty */
  --c-bg: #ffffff;       /* základ */
  --c-bg2: #f8fafc;      /* alternující sekce */
  --c-accent: #2fa4a9;   /* akcent (jemně!) */
}


/* základní čitelnost */
.hp-container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.hp-muted { color: var(--c-muted); }
.hp-h2 { font-size: 1.75rem; line-height: 1.2; margin: 0 0 10px; font-weight: 600; }

/* rytmus sekcí */
.hp-hero { padding: 40px 0 28px; }
.hp-section { padding: 40px 0; }
.hp-section--alt { background: var(--c-bg2); }

/* HERO */
.hp-hero h1 {
  font-size: 2.35rem;
  line-height: 1.08;
  margin: 0 0 12px;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: var(--c-text);
}
.hp-hero p {
  color: var(--c-muted);
  margin: 0 0 18px;
  max-width: 62ch;
  font-size: 1rem;
  line-height: 1.5;
}

/* CTA */
.hp-cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}

/* Tlačítka */
.hp-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:14px;
  font-weight:650;
  border:1px solid var(--c-text);
  text-decoration:none !important;
  line-height:1.1;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, color .12s ease, border-color .12s ease;
  color: var(--c-text);
  background: #fff;
}
.hp-btn:active { transform: translateY(1px); }

.hp-btn--primary{
  background: var(--c-text);
  color:#fff !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.08);
}
.hp-btn--primary:hover{
  background:#111827;
  color:#fff !important;
  box-shadow: 0 10px 18px rgba(0,0,0,0.12);
}
.hp-btn--secondary{
  background:#fff;
  color: var(--c-text) !important;
}
.hp-btn--secondary:hover{
  background: var(--c-bg2);
  box-shadow: 0 10px 18px rgba(0,0,0,0.06);
}

/* TOP KATEGORIE – dlaždice */
.hp-cats{
  margin-top: 10px;
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  gap:14px;
}
.hp-cat{
  border:1px solid var(--c-border);
  border-radius:18px;
  padding:16px;
  background:#fff;
  display:block;
  min-height:86px;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  text-decoration:none !important;
  color: var(--c-text) !important;
}
.hp-cat:hover{
  transform: translateY(-1px);
  border-color: rgba(47,164,169,0.35);
  box-shadow: 0 10px 18px rgba(0,0,0,0.06);
}
.hp-cat span{
  display:block;
  font-weight:650;
  line-height:1.2;
  text-decoration:none !important;
}
.hp-cat-sub{
  display:block;
  margin-top:6px;
  color: var(--c-muted) !important;
  font-size:0.875rem;
  line-height:1.25;
  text-decoration:none !important;
}
.hp-cat *{ text-decoration:none !important; } /* Shoptet rád podtrhává odkazy */

/* PROČ 3DAKVARIA – podpora obou variant HTML */

/* Varianta A: když je tam UL/LI */
.hp-section--alt ul{
  list-style:none;
  padding-left:0;
  margin:18px 0 0;
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:14px;
}
.hp-section--alt ul > li{
  border:1px solid var(--c-border);
  border-radius:18px;
  background:#fff;
  padding:16px;
  margin:0 !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  line-height:1.35;
}

/* Varianta B: když používáte z packu .hp-grid-4 a .hp-card */
.hp-grid-4{
  margin-top:16px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:14px;
}
.hp-card{
  border:1px solid var(--c-border);
  border-radius:18px;
  background:#fff;
  padding:16px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}
.hp-card-title{
  font-weight:650;
  margin-bottom:6px;
}
.hp-card-text{
  color: var(--c-muted);
  line-height:1.35;
}

/* Akvárium na klíč – split layout z packu */
.hp-split{
  display:grid;
  grid-template-columns: 1.3fr 1fr;
  gap:18px;
  align-items:stretch;
}
.hp-image{
  border:1px solid var(--c-border);
  border-radius:18px;
  background: linear-gradient(180deg, rgba(245,247,250,1), rgba(255,255,255,1));
  min-height: 180px;
}

/* Kontakty z packu */
.hp-contact{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:14px;
}
.hp-contact-item{
  border:1px solid var(--c-border);
  border-radius:18px;
  background:#fff;
  padding:14px 16px;
  text-decoration:none !important;
  color: var(--c-text) !important;
  display:block;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.hp-contact-item:hover{
  transform: translateY(-1px);
  border-color: rgba(47,164,169,0.35);
  box-shadow: 0 10px 18px rgba(0,0,0,0.06);
}
.hp-contact-title{
  display:block;
  font-weight:650;
  margin-bottom:4px;
}
.hp-contact-value{
  display:block;
  color: var(--c-muted);
}

/* Responsive */
@media (max-width: 1024px){
  .hp-cats{ grid-template-columns: repeat(3, 1fr); }
  .hp-grid-4{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hp-split{ grid-template-columns: 1fr; }
  .hp-contact{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .hp-hero{ padding:28px 0 18px; }
  .hp-section{ padding:28px 0; }
  .hp-hero h1{ font-size:1.9rem; }
  .hp-cats{ grid-template-columns: repeat(2, 1fr); gap:12px; }
  .hp-cat{ padding:14px; min-height:78px; }
  .hp-section--alt ul{ grid-template-columns: 1fr; }
}
/* SPLIT SEKCE */
.hp-split {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 32px;
  align-items: center;
}

.hp-split-media {
  background: linear-gradient(135deg, #e6f4f5, #ffffff);
  border-radius: 20px;
  min-height: 240px;
}

/* responsive */
@media (max-width: 768px) {
  .hp-split {
    grid-template-columns: 1fr;
  }
  .hp-split-media {
    min-height: 180px;
  }
}
/* === CATEGORY INTEGRATION === */

.hp-category .hp-section {
  padding-bottom: 24px;
}

.hp-category h1,
.hp-category .hp-h1 {
  font-size: 2rem;
  line-height: 1.15;
  margin-bottom: 10px;
}

@media (max-width: 640px) {
  .hp-category h1,
  .hp-category .hp-h1 {
    font-size: 1.6rem;
  }
}


/* === HP CATEGORY: remove "Nejprodávanější" promo block === */

html.hp-cat .products-top-wrapper {
  display: none !important;
}

.hp-rowhead{
  display:flex;align-items:baseline;justify-content:space-between;
  gap:16px;margin-bottom:14px;
}
.hp-link{color:var(--c-muted);text-decoration:none;font-weight:650}
.hp-link:hover{color:var(--c-text)}

.hp-products{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.hp-prod{
  border:1px solid var(--c-border);
  border-radius:18px;
  background:#fff;
  overflow:hidden;
  text-decoration:none;
  display:block;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.hp-prod:hover{
  transform:translateY(-1px);
  border-color:rgba(47,164,169,0.35);
  box-shadow:0 10px 18px rgba(0,0,0,0.06);
}
.hp-prod-img{
  aspect-ratio:4/3;
  background:var(--c-bg2);
}
.hp-prod-img img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.hp-prod-body{padding:12px 12px 14px}
.hp-prod-title{
  margin:0 0 8px;
  font-weight:650;
  line-height:1.25;
  color:var(--c-text);
}
.hp-prod-meta{
  color:var(--c-muted);
  font-size:.95rem;
  line-height:1.35;
}

@media (max-width: 1024px){
  .hp-products{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 640px){
  .hp-products{grid-template-columns:1fr}
}