/*
Theme Name: JazaTH
Theme URI: https://jazath.dev
Description: Standalone theme derived from JazaTH child — ready to install.
Author: JazaTH.dev
Version: 1.0
*/

/* Import parent's base styles (optional — we enqueue parent in functions.php) */

/* Add child theme custom styles below */

/* ------------------------------------------------------------------
   Global responsive safeguards
   - prevent unwanted horizontal scrolling on mobile/tablet
   - ensure media don't exceed their containers
   - box-sizing for predictable sizing
   ------------------------------------------------------------------ */
html, body {
  max-width: 100%;            /* don't allow viewport to grow */
  overflow-x: hidden;         /* hide stray scrollbars */
  box-sizing: border-box;
}
*, *::before, *::after {
  box-sizing: inherit;
}

img, picture, video, iframe, svg, table {
  max-width: 100%;            /* scale media elements */
  height: auto;
}

/* Tablet-specific reinforcement */
@media (max-width: 1024px) {
  body { overflow-x: hidden; }
}

body{ --jz-child:1; }

/* Sidebar styles moved to `assets/css/components/sidebar.css` */
/* (see `assets/css/components/sidebar.css`) */


/* Header / primary-menu styles moved to `assets/css/components/header.css` */
/* (see `assets/css/components/header.css`) */



/* Fix: remove leftover list markers/dots when menu items are output as bare <li> inside nav */
nav.primary li{
  list-style:none !important; /* remove default bullet */
  list-style-type:none !important;
  display:inline-block !important; /* keep items inline like chips */
  margin:0 6px !important;
  vertical-align:middle !important;
}
nav.primary li::marker{ content: none !important; }

/* Extra safety: remove pseudo separators that may be applied elsewhere */
nav.primary li::before, nav.primary li::after, nav.primary a::before, nav.primary a::after{ content:none !important; display:none !important; }

/* Chips styles moved to `assets/css/components/chips.css` */
/* (see `assets/css/components/chips.css`) */

/* 🔧 Fix: remove duplicated divider lines between stacked sections
   Several sections (e.g. .usp, .services, .testi) define both
   border-top and border-bottom which creates two thin lines
   between stacked sections. Keep only the top line by removing
   the bottom border on those sections. */
.usp,
.services,
.testi {
  border-bottom: none !important;
}

/* 🔧 Additional: prevent duplicate section separators
   - Remove border-top on specific sections that add extra lines
   - Collapse adjacent section top borders so only one separator remains */
.seo-content,
.contact,
.footGlass,
footer .footer-inner {
  border-top: none !important;
}

/* If two sections appear adjacent, remove the later one's top border so only one line stays */
section + section {
  border-top: none !important;
}

/* Optional aggressive rule: keep only the first section's top border (uncomment to enable)
section:not(:first-of-type) { border-top: none !important; }
*/

/* 🎯 Compact layout tweaks: reduce vertical padding for tighter sections
   - Make most sections more compact, keep hero slightly taller for visual emphasis
   - Reduce spacing for section titles and descriptions for a more 'fit' layout */
section {
  padding-top: clamp(20px, 3.5vw, 40px);
  padding-bottom: clamp(20px, 3.5vw, 40px);
}
.section-title { margin-bottom: 12px; }
.section-desc { margin-bottom: 12px; max-width: 56ch; color: var(--muted); }
.hero { padding-top: clamp(40px, 8vw, 88px); padding-bottom: clamp(32px, 6vw, 72px); }

/* Specific compact overrides for common large sections */
.usp, .services, .pricing, .testi, .faq, .templates, .templates-shop, .seo-content { padding: 16px 0 !important; }
.contact { padding: 40px 0 !important; }
.wrap.contact .contact-form-wrapper { padding: 24px !important; margin: 0; max-width: 720px; }
.wrap.contact .contact-form-wrapper .form-group { margin-bottom: 12px; }

/* Mobile adjustments */
@media (max-width:900px){
  .section-title{margin-bottom:10px}
  .section-desc{margin-bottom:10px}
  .wrap.contact .contact-form-wrapper{padding:20px}
  section{padding-top:20px;padding-bottom:20px}
}

/* Heading gradient: standardized, override-safe, and reusable 🌈 */
:root{ --heading-grad: linear-gradient(90deg,#62d3ff 0%, #9fe3ff 35%, #ffd34d 100%); }

/* Footer layout helpers (1–5 columns). Each child gets a flex‑basis calculated to
   account for gaps; we subtract half the gap on either side. A larger gap is used
   when five columns are selected so the items don't look too cramped. */
.footer-layout.layout-1col > * { flex: 1 0 100%; }
.footer-layout.layout-2col > * { flex: 1 0 calc(50% - 20px); }
.footer-layout.layout-3col > * { flex: 1 0 calc(33.333% - 26.666px); }
.footer-layout.layout-4col > * { flex: 1 0 calc(25% - 30px); }
.footer-layout.layout-5col {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 80px;
}
.footer-layout.layout-5col > * {
  /* grid items auto-size, use padding to keep inner content away from neighbors */
  padding:0 16px;
  min-width:0; /* allow shrinkage if necessary */
}

/* copyright / credit row: always full‑width and centered text */
.footer-credit {
  width: 100%;
  text-align: center;
  padding-top: 30px;
  border-top: 1px solid rgba(255,255,255,.08);
}

/* if the credit appears after .wrap, ensure it isn’t picked up by the 5col grid */
.footer-layout.layout-5col ~ .footer-credit {
  grid-column: 1 / -1;
}

/* ------------------------------------------------------------------
   mobile-friendly stacking for footer columns
   ------------------------------------------------------------------ */
@media (max-width: 900px) {
  /* add layout-specific selector to outrank the earlier grid rule */
  footer .footer-layout,
  footer .footer-layout.layout-5col {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0 !important;
    grid-template-columns: none !important;
  }
  footer .footer-layout > * {
    flex: 1 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    padding: 12px 0 !important;
  }
  /* center headings & description when stacked */
  .footer-brand,
  .footer-links,
  .footer-services,
  .footer-blog,
  .footer-help {
    text-align: center;
  }
  .footer-brand p {
    margin-left: auto;
    margin-right: auto;
    max-width: 60ch;
  }
  /* logo + name centering */
  .footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .footer-brand > div {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .footer-brand span {
    display: block;
    text-align: center;
  }
  /* mobile-friendly credit row: stack and wrap lines cleanly */
  .footer-credit {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 16px 8px;
  }
  .footer-credit small {
    display: block;
    line-height: 1.4;
    max-width: 90%;
    white-space: normal;
    word-break: break-word;
    font-size: 0.85rem;
  }
}

/* move the blog & help columns a little further right using explicit classes */
.footer-layout.layout-5col .footer-blog,
.footer-layout.layout-5col .footer-help {
  margin-left: 40px !important;
}

/* extra push specifically for each column */
.footer-layout.layout-5col .footer-blog {
  margin-left: 80px !important;
}
.footer-layout.layout-5col .footer-help {
  margin-left: 120px !important;
}

/* ensure grid prevails over parent flex rules (mega‑footer) on desktop only */
@media (min-width: 901px) {
  footer .footer-layout.layout-5col {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 80px !important;
  }
  footer .footer-layout.layout-5col > * {
    padding:0 16px !important;
    min-width:0 !important;
  }
}

/* Apply to common headings and provide a utility class `.gradient-heading` */
.section-title,
.seo-content h2,
.seo-content h3,
.hero .title,
.card h2,
.template-benefits h2,
.template-info-grid .template-guarantee h2,
.gradient-heading {
  background: var(--heading-grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-weight: 900;
}

/* Tier heading — blue gradient pill (high contrast, override‑resistant) */
.paket-tier-group .tier-heading,
h2.tier-heading {
  display: inline-flex !important;
  align-items: center;
  gap: .6rem;
  padding: .36rem .8rem;
  border-radius: 999px;
  /* blue-only gradient for maximum legibility */
  background: linear-gradient(90deg,#60a5fa 0%, #3b82f6 100%) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background-clip: padding-box !important;
  font-weight: 900;
  font-size: 1.28rem;
  box-shadow: 0 10px 30px rgba(6,40,80,0.55);
  border: 1px solid rgba(255,255,255,0.07);
  z-index: 2;
}

/* Force white text for tier heading and all child nodes (override any gradient/text-clip rules) */
h2.tier-heading,
.paket-tier-group .tier-heading,
h2.tier-heading *,
.paket-tier-group .tier-heading * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  -webkit-text-stroke-color: transparent !important;
  text-shadow: 0 2px 6px rgba(2,6,23,0.35) !important;
}

.paket-tier-group .tier-heading .ti-count,
h2.tier-heading .ti-count {
  display: inline-block;
  background: rgba(255,255,255,0.06);
  color: #f8fbff;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: .9rem;
  font-weight: 700;
  border: 1px solid rgba(255,255,255,0.06);
  margin-left: .6rem;
}  

/* Provide a subtle accent variant for small badges/titles */
.section-header h2, .shop-seo .section-header h2 { background: linear-gradient(90deg,#1ec5ff,#62d3ff 45%,#ffd86a); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent }

/* ------------------------------------------------------------------
   Dark-mode texture / hairline reduction (override)
   - Reduce repeating-gradient alpha and overlay opacity to avoid
     visible hairlines on very dark backgrounds.
   - Soften common 1px white borders used across cards/sections.
   - Non-destructive: reduces visibility rather than removing texture.
   ------------------------------------------------------------------ */
@media (prefers-color-scheme: dark) {
  /* make the subtle overlay nearly invisible on very dark canvases */
  .jzth-content::after,
  .panel-jazath::after,
  .jzth-content .overlay,
  .hero-overlay {
    background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.003) 0 1px, transparent 1px 48px), radial-gradient(circle at 90% 70%, rgba(255,255,255,0.004), transparent 20%) !important;
    opacity: 0.08 !important;
    mix-blend-mode: overlay !important;
  }

  /* soften hairline borders so they don't appear as distinct lines */
  .jz-paket-card,
  .jz-card,
  .tier-heading,
  .paket-hero--modern,
  section,
  .jzth-card { border-color: rgba(255,255,255,0.01) !important; }

  /* specific defensive rule for repeating-patterns used by shop/sections */
  .shop-taxonomy .some-overlay,
  .jzth-content::after { background-image: repeating-linear-gradient(135deg, rgba(255,255,255,0.002) 0 1px, transparent 1px 60px) !important; opacity: 0.08 !important; }

  /* specifically reduce the grid overlay on template hero cards (vertical/horizontal hairlines) */
  .tpl-hero::before {
    background-image: linear-gradient(90deg, rgba(255,255,255,0.01) 1px, transparent 1px), linear-gradient(rgba(255,255,255,0.01) 1px, transparent 1px) !important;
    background-size: 60px 60px !important;
    opacity: 0.06 !important;
  }
}

/* hide tpl hero grid on small screens to avoid visible seams */
@media (max-width:720px) {
  .tpl-hero::before { display: none !important; }
}


/* footer copyright background */
.footer-credit {
  background: linear-gradient(180deg, #0a122a 0%, #05091f 100%);
  color: #eef2ff;
}

/* Page-specific styles moved to `assets/css/page.css` to keep template CSS separate */
/* See: jazaTH-child/assets/css/page.css */

/* Paket — horizontal, single-row tier menu (no vertical wrap) */
.paket-filters .tier-grid{display:flex;gap:12px;align-items:stretch;margin:12px 0;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;padding:6px 0}
.paket-filters .tier-grid::-webkit-scrollbar{height:9px}
.paket-filters .tier-grid::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.03);border-radius:999px}
.paket-filters .tier-card{display:inline-flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,0.01),rgba(255,255,255,0));border:1px solid rgba(255,255,255,0.04);color:var(--text);cursor:pointer;transition:transform .12s ease,box-shadow .12s ease,background .12s ease;min-height:56px;justify-content:flex-start;flex:0 0 160px;min-width:140px;scroll-snap-align:center;white-space:nowrap;position:relative}
.paket-filters .tier-card:focus{outline:2px solid rgba(99,102,241,0.14);outline-offset:3px;box-shadow:0 8px 30px rgba(2,6,23,0.36);transform:translateY(-2px)}
.paket-filters .tier-card__icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;background:rgba(255,255,255,0.02);color:inherit;flex:0 0 36px}
.paket-filters .tier-card__label{font-weight:800;font-size:.95rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.paket-filters .tier-card.is-active,.paket-filters .tier-card[aria-pressed="true"]{background:linear-gradient(90deg,#60a5fa,#3b82f6);color:#fff;box-shadow:0 10px 30px rgba(17,66,153,0.34);border-color:rgba(255,255,255,0.04);transform:translateY(-3px)}
.paket-filters .tier-card.is-active .tier-card__icon,.paket-filters .tier-card[aria-pressed="true"] .tier-card__icon{background:rgba(255,255,255,0.08);color:#fff}

/* Force header filters horizontal on small screens (override theme's mobile column) */
@media (max-width:768px){
  .paket-archive-header .paket-filters{flex-direction:row !important;padding:10px 6px;align-items:center;overflow-x:auto;flex-wrap:nowrap !important}
  .paket-archive-header .paket-filters .tier-grid{display:flex;gap:10px;flex-wrap:nowrap;overflow-x:auto}
  .paket-archive-header .paket-filters .tier-card{flex:0 0 140px;min-width:120px;scroll-snap-align:center}
}

/* Strong override for archive header: card-style tier filters (icon + title + short description) */
.paket-archive-header .paket-filters .tier-card{display:flex;flex-direction:column;align-items:flex-start;gap:10px;flex:0 0 260px;min-width:200px;padding:20px;border-radius:14px;background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(255,255,255,0.00));border:1px solid rgba(255,255,255,0.03);box-shadow:0 18px 40px rgba(2,6,23,0.6);transition:transform .18s ease,box-shadow .18s ease}
.paket-archive-header .paket-filters .tier-card__icon{width:48px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));box-shadow:inset 0 2px 6px rgba(255,255,255,0.02), 0 6px 20px rgba(2,6,23,0.6);flex:0 0 48px}
.paket-archive-header .paket-filters .tier-card__body{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.paket-archive-header .paket-filters .tier-card__label{font-weight:900;font-size:1.05rem;color:#e6edf3}

.paket-archive-header .paket-filters .tier-card:hover{transform:translateY(-6px);box-shadow:0 28px 60px rgba(2,6,23,0.7)}

/* Mini (compact) horizontal card variant */
.paket-archive-header .paket-filters .tier-grid--mini{display:flex !important;flex-wrap:nowrap !important;gap:12px;align-items:center;overflow-x:auto;padding:6px 0}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card{display:inline-flex !important;flex-direction:row !important;align-items:center !important;gap:12px;flex:0 0 auto;min-width:120px;padding:8px 12px;height:48px;border-radius:12px;background:transparent;border:1px solid rgba(255,255,255,0.03);box-shadow:none;white-space:nowrap;scroll-snap-align:center}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card--mini{padding:8px 12px;height:48px}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card__icon{width:36px;height:36px;border-radius:10px;flex:0 0 36px}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card__body{display:flex;flex-direction:row;gap:8px;align-items:center}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card__label{font-size:.95rem;font-weight:800}

/* Per-tier card backgrounds — stronger tint per card */
.paket-archive-header .paket-filters .tier-card[data-slug="all"]{background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(6,10,21,0.55));border-color:rgba(255,255,255,0.03);color:rgba(230,237,243,0.95)}
.paket-archive-header .paket-filters .tier-card[data-slug="all"] .tier-card__icon{background:rgba(255,255,255,0.02);color:rgba(158,163,175,0.9)}

.paket-archive-header .paket-filters .tier-card[data-slug="silver"]{position:relative;background:linear-gradient(90deg, rgba(96,165,250,0.14) 0%, rgba(99,102,241,0.10) 100%) !important;border-color:rgba(96,165,250,0.12) !important;color:#e6edf3}
.paket-archive-header .paket-filters .tier-card[data-slug="silver"]::before{content:"";position:absolute;left:12px;top:10px;bottom:10px;width:4px;border-radius:4px;background:#60a5fa;opacity:0.95}
.paket-archive-header .paket-filters .tier-card[data-slug="silver"] .tier-card__icon{background:rgba(96,165,250,0.12);color:#93c5fd}
.paket-archive-header .paket-filters .tier-card[data-slug="silver"].is-active, .paket-archive-header .paket-filters .tier-card[data-slug="silver"][aria-pressed="true"]{background:linear-gradient(90deg,#93c5fd,#60a5fa) !important;color:#04263b;box-shadow:0 20px 48px rgba(59,130,246,0.18);border-color:transparent}

.paket-archive-header .paket-filters .tier-card[data-slug="gold"]{position:relative;background:linear-gradient(90deg, rgba(245,158,11,0.12) 0%, rgba(250,204,21,0.08) 100%) !important;border-color:rgba(245,158,11,0.12) !important;color:#fff}
.paket-archive-header .paket-filters .tier-card[data-slug="gold"]::before{content:"";position:absolute;left:12px;top:10px;bottom:10px;width:4px;border-radius:4px;background:#f59e0b;opacity:0.95}
.paket-archive-header .paket-filters .tier-card[data-slug="gold"] .tier-card__icon{background:rgba(245,158,11,0.12);color:#f59e0b}
.paket-archive-header .paket-filters .tier-card[data-slug="gold"].is-active, .paket-archive-header .paket-filters .tier-card[data-slug="gold"][aria-pressed="true"]{background:linear-gradient(90deg,#fbbf24,#f59e0b) !important;color:#041124;box-shadow:0 20px 48px rgba(245,158,11,0.18);border-color:transparent}

.paket-archive-header .paket-filters .tier-card[data-slug="platinum"]{position:relative;background:linear-gradient(90deg, rgba(167,139,250,0.12) 0%, rgba(199,210,254,0.06) 100%) !important;border-color:rgba(167,139,250,0.12) !important;color:#fff}
.paket-archive-header .paket-filters .tier-card[data-slug="platinum"]::before{content:"";position:absolute;left:12px;top:10px;bottom:10px;width:4px;border-radius:4px;background:#a78bfa;opacity:0.95}
.paket-archive-header .paket-filters .tier-card[data-slug="platinum"] .tier-card__icon{background:rgba(167,139,250,0.12);color:#a78bfa}
.paket-archive-header .paket-filters .tier-card[data-slug="platinum"].is-active, .paket-archive-header .paket-filters .tier-card[data-slug="platinum"][aria-pressed="true"]{background:linear-gradient(90deg,#a78bfa,#7c3aed) !important;color:#041124;box-shadow:0 20px 48px rgba(124,58,237,0.18);border-color:transparent}

.paket-archive-header .paket-filters .tier-card[data-slug="diamond"]{position:relative;background:linear-gradient(90deg, rgba(59,130,246,0.12) 0%, rgba(99,102,241,0.06) 100%) !important;border-color:rgba(96,165,250,0.12) !important;color:#fff}
.paket-archive-header .paket-filters .tier-card[data-slug="diamond"]::before{content:"";position:absolute;left:12px;top:10px;bottom:10px;width:4px;border-radius:4px;background:#60a5fa;opacity:0.95}
.paket-archive-header .paket-filters .tier-card[data-slug="diamond"] .tier-card__icon{background:rgba(96,165,250,0.12);color:#60a5fa}
.paket-archive-header .paket-filters .tier-card[data-slug="diamond"].is-active, .paket-archive-header .paket-filters .tier-card[data-slug="diamond"][aria-pressed="true"]{background:linear-gradient(90deg,#60a5fa,#7dd3fc) !important;color:#041124;box-shadow:0 20px 48px rgba(96,165,250,0.18);border-color:transparent}

/* Stronger, modern hover effects for mini cards (scale, glow, icon motion) */
.paket-archive-header .paket-filters .tier-grid--mini .tier-card--mini:hover,
.paket-archive-header .paket-filters .tier-grid--mini .tier-card--mini:focus-visible{transform:translateY(-8px) scale(1.04);box-shadow:0 30px 70px rgba(2,6,23,0.65), 0 8px 28px rgba(59,130,246,0.06);z-index:60;filter:brightness(1.03);border-color:rgba(255,255,255,0.06)}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card--mini:hover .tier-card__icon{transform:translateY(-2px) rotate(-6deg) scale(1.08);box-shadow:0 10px 30px rgba(2,6,23,0.32)}

/* Per‑tier hover intensify (non-active) */
.paket-archive-header .paket-filters .tier-card[data-slug="silver"]:not(.is-active):hover{background:linear-gradient(90deg,#1e3a8a22,#60a5fa11);color:#e6edf3}
.paket-archive-header .paket-filters .tier-card[data-slug="gold"]:not(.is-active):hover{background:linear-gradient(90deg,#7c2d1222,#f59e0b11);color:#fff}
.paket-archive-header .paket-filters .tier-card[data-slug="platinum"]:not(.is-active):hover{background:linear-gradient(90deg,#4c1d9522,#a78bfa11);color:#fff}
.paket-archive-header .paket-filters .tier-card[data-slug="diamond"]:not(.is-active):hover{background:linear-gradient(90deg,#08335822,#60a5fa11);color:#fff}

@media (prefers-reduced-motion:reduce){
  .paket-archive-header .paket-filters .tier-grid--mini .tier-card--mini,
  .paket-archive-header .paket-filters .tier-grid--mini .tier-card--mini .tier-card__icon{transition:none!important;transform:none!important}
}

/* Rounded contact-style for mini header cards */
.paket-archive-header .paket-filters .tier-card--mini{border-radius:12px;box-shadow:0 6px 18px rgba(2,6,23,0.28);background:linear-gradient(180deg, rgba(255,255,255,0.006), rgba(255,255,255,0.003));transition:box-shadow .18s ease,transform .12s ease}
.paket-archive-header .paket-filters .tier-grid--mini .tier-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(2,6,23,0.38)}
.paket-archive-header .paket-filters .tier-card--mini.is-active{box-shadow:0 16px 36px rgba(2,6,23,0.46);transform:translateY(-3px)}

/* stronger enforcement to avoid vertical stacking from other styles */
.paket-archive-header .paket-filters .tier-grid--mini .tier-card, .paket-archive-header .paket-filters .tier-grid--mini{display:flex !important}
@media (max-width:720px){ .paket-archive-header .paket-filters .tier-grid--mini .tier-card{min-width:120px;flex:0 0 120px;padding:8px} }

@media (max-width:980px){ .paket-archive-header .paket-filters .tier-card{flex:0 0 220px;min-width:180px;padding:16px} }
@media (max-width:720px){ .paket-archive-header .paket-filters .tier-card{flex:0 0 180px;min-width:160px;padding:12px} }

@media (min-width:980px){ .paket-filters .tier-grid{justify-content:flex-start} }
@media (max-width:720px){ .paket-filters .tier-card{padding:10px;min-height:56px;gap:10px;flex:0 0 140px} }