/* ============================================================
   BUDKA GROOMERA — style podstron cennika
   ============================================================ */

/* ---------- nagłówek podstrony ---------- */
.page-hero{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,var(--bg-pink) 0%,#fff 100%);
  padding:158px 0 54px;text-align:center;
}
.page-hero .crumbs{
  display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;
  font-size:.85rem;font-weight:600;color:var(--gray);margin-bottom:18px;
}
.page-hero .crumbs a{color:var(--paw);transition:color .2s}
.page-hero .crumbs a:hover{color:var(--violet)}
.page-hero .crumbs .sep{opacity:.45}
.page-hero h1{font-size:clamp(2.4rem,5.4vw,4rem);letter-spacing:.02em}
.page-hero .valid-from{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;
  background:#fff;border:1.5px solid rgba(192,64,90,.25);color:var(--paw);
  font-weight:700;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;
  padding:9px 20px;border-radius:var(--pill);box-shadow:var(--shadow-soft);
}
.page-hero .lead-sub{max-width:560px;margin:16px auto 0;color:var(--gray);font-size:1.05rem}
.page-hero .hero-paw{position:absolute;color:var(--paw);z-index:0}
.page-hero .hero-paw.a{top:110px;right:6%;width:88px;transform:rotate(18deg);opacity:.10}
.page-hero .hero-paw.b{bottom:-10px;left:4%;width:120px;transform:rotate(-16deg);opacity:.06;color:var(--navy)}

/* ---------- pigułki kategorii (poziomy pasek) ---------- */
.cat-pills-wrap{position:relative;margin:0 0 8px}
.cat-pills{
  display:flex;gap:10px;justify-content:flex-start;
  overflow-x:auto;padding:6px 2px 14px;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.cat-pills::-webkit-scrollbar{display:none}
.cat-pills a{
  flex:none;display:inline-flex;align-items:center;gap:8px;
  font-weight:700;font-size:.86rem;white-space:nowrap;
  padding:11px 20px;border-radius:var(--pill);
  background:#fff;border:1.5px solid var(--line);color:var(--navy-soft);
  transition:border-color .25s,color .25s,transform .25s,box-shadow .25s;
}
.cat-pills a:hover{border-color:var(--paw);color:var(--paw);transform:translateY(-2px);box-shadow:var(--shadow-soft)}
.cat-pills a.active{background:var(--navy);border-color:var(--navy);color:#fff}

/* ---------- notka informacyjna cennika ---------- */
.cennik-note{
  background:#fff;border:1.5px solid var(--line);border-radius:24px;
  padding:30px 34px;box-shadow:var(--shadow-soft);
  display:flex;gap:20px;align-items:flex-start;
}
.cennik-note .ni{
  flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;
  background:linear-gradient(135deg,#8B6DFF,#6C47FF);color:#fff;
}
.cennik-note p{color:var(--navy-soft);font-size:.99rem;margin:0 0 10px}
.cennik-note p:last-child{margin-bottom:0}
.cennik-note b{color:var(--navy)}

/* ---------- boxy dopłat (pogotowie / pieski problemowe) ---------- */
.surcharge-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.surcharge{
  position:relative;background:#fff;border:1.5px solid var(--line);border-radius:24px;
  padding:28px 28px 26px;text-align:center;overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.7,.3,1),box-shadow .35s,border-color .35s;
}
.surcharge:hover{transform:translateY(-6px);box-shadow:var(--shadow-card);border-color:transparent}
.surcharge::before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:linear-gradient(90deg,var(--violet),var(--paw))}
.surcharge h3{font-size:1.14rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}
.surcharge p{color:var(--gray);font-size:.93rem;margin-bottom:14px;min-height:44px}
.surcharge .tag{
  display:inline-block;font-family:'Fraunces',serif;font-weight:700;font-size:1.3rem;
  color:var(--paw);background:rgba(192,64,90,.08);padding:8px 22px;border-radius:var(--pill);
}

/* ---------- siatka kategorii (hub cennika) ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cat-card{
  position:relative;display:flex;flex-direction:column;gap:12px;
  background:#fff;border:1.5px solid var(--line);border-radius:26px;padding:32px 28px 26px;
  overflow:hidden;transition:transform .4s cubic-bezier(.2,.7,.3,1),box-shadow .4s,border-color .4s;
}
.cat-card::before{content:"";position:absolute;top:0;left:0;right:0;height:0;background:linear-gradient(90deg,var(--violet),var(--paw));transition:height .35s}
.cat-card:hover{transform:translateY(-9px);box-shadow:var(--shadow-card);border-color:transparent}
.cat-card:hover::before{height:5px}
.cat-card h3{font-size:1.3rem;line-height:1.2}
.cat-card .cc-sub{color:var(--gray);font-size:.92rem;flex:1}
.cat-card .cc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.cat-card .cc-from{font-family:'Fraunces',serif;font-weight:700;font-size:1.08rem;color:var(--violet)}
.cat-card .cc-arrow{
  width:38px;height:38px;border-radius:50%;background:var(--bg-pink);display:grid;place-items:center;
  color:var(--paw);transition:transform .3s,background .3s,color .3s;
}
.cat-card:hover .cc-arrow{transform:rotate(45deg);background:var(--paw);color:#fff}

/* ---------- lista ras z cenami ---------- */
.breed-panel{
  background:#fff;border:1.5px solid var(--line);border-radius:28px;
  padding:14px 34px;box-shadow:var(--shadow-soft);
}
.breed-search-wrap{position:relative;margin:26px 0 6px}
.breed-search-wrap svg{position:absolute;left:18px;top:50%;transform:translateY(-50%);color:var(--gray-light);pointer-events:none}
#breedSearch{
  width:100%;border:1.5px solid var(--line);border-radius:var(--pill);
  padding:15px 20px 15px 50px;font-family:'Inter',sans-serif;font-size:.98rem;color:var(--navy);
  background:#FCFBFE;transition:border-color .25s,box-shadow .25s;
}
#breedSearch:focus{outline:none;border-color:var(--violet);box-shadow:0 0 0 4px rgba(108,71,255,.10)}
.breed-list{list-style:none;margin:0;padding:0}
.breed-row{
  display:flex;align-items:baseline;gap:14px;
  padding:17px 4px;border-bottom:1px dashed var(--line);
}
.breed-list .breed-row:last-child{border-bottom:none}
.breed-row .bname{font-weight:600;font-size:1.01rem;color:var(--navy)}
.breed-row .bname small{display:block;color:var(--gray-light);font-size:.82rem;font-weight:500;margin-top:1px}
.breed-row .dots{flex:1;border-bottom:2px dotted var(--line);transform:translateY(-5px)}
.breed-row .bprice{
  font-family:'Fraunces',serif;font-weight:700;font-size:1.14rem;color:var(--navy);white-space:nowrap;
}
.breed-row .bprice .plus{color:var(--paw);margin-left:1px}
#breedEmpty{display:none;text-align:center;color:var(--gray);padding:34px 0;font-weight:600}

/* legenda plusów */
.plus-note{
  display:flex;align-items:center;gap:10px;margin-top:18px;
  color:var(--gray);font-size:.88rem;
}
.plus-note .plus-badge{
  flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:rgba(192,64,90,.10);color:var(--paw);font-weight:800;font-size:1rem;
}

/* ---------- duże rasy: rozliczenie godzinowe ---------- */
.hour-hero{
  background:linear-gradient(160deg,var(--navy),#1C1C3A);color:#fff;border-radius:28px;
  padding:44px 42px;position:relative;overflow:hidden;text-align:center;
}
.hour-hero .paw-bg{position:absolute;bottom:-40px;right:-30px;width:220px;color:#fff;opacity:.06}
.hour-hero .hh-price{font-family:'Fraunces',serif;font-weight:700;font-size:clamp(2.6rem,6vw,3.8rem);line-height:1;color:#fff}
.hour-hero .hh-price small{font-size:.35em;font-weight:600;color:var(--blob);letter-spacing:.05em}
.hour-hero p{color:rgba(255,255,255,.78);max-width:520px;margin:16px auto 0;font-size:1.02rem;position:relative;z-index:1}
.hour-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:26px}
.hour-step{
  background:#fff;border:1.5px solid var(--line);border-radius:22px;padding:24px 22px;text-align:center;
  transition:transform .35s,box-shadow .35s;
}
.hour-step:hover{transform:translateY(-5px);box-shadow:var(--shadow-soft)}
.hour-step .hs-num{font-family:'Fraunces',serif;font-weight:700;font-size:1.5rem;color:var(--violet)}
.hour-step p{color:var(--gray);font-size:.9rem;margin-top:6px}

/* chipy ras (duże rasy) */
.breed-chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:8px}
.breed-chips span{
  background:#fff;border:1.5px solid var(--line);border-radius:var(--pill);
  padding:10px 20px;font-weight:600;font-size:.92rem;color:var(--navy-soft);
  transition:border-color .25s,transform .25s;
}
.breed-chips span:hover{border-color:var(--paw);transform:translateY(-2px)}

/* ---------- nawigacja poprzednia/następna kategoria ---------- */
.pn-nav{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px}
.pn-nav a{
  display:flex;flex-direction:column;gap:5px;background:#fff;border:1.5px solid var(--line);
  border-radius:20px;padding:20px 24px;transition:border-color .25s,transform .25s,box-shadow .25s;
}
.pn-nav a:hover{border-color:var(--paw);transform:translateY(-3px);box-shadow:var(--shadow-soft)}
.pn-nav a.next{text-align:right;align-items:flex-end}
.pn-nav small{color:var(--gray-light);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.pn-nav b{font-family:'Fraunces',serif;font-size:1.06rem;color:var(--navy)}
.pn-nav a:hover b{color:var(--paw)}
.pn-nav .pn-empty{visibility:hidden}

/* ---------- CTA na dole podstron ---------- */
.cennik-cta{
  margin-top:44px;text-align:center;background:var(--bg-pink);border-radius:28px;padding:44px 30px;
  position:relative;overflow:hidden;
}
.cennik-cta h3{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:8px}
.cennik-cta p{color:var(--gray);margin-bottom:22px}
.cennik-cta .cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---------- mobilny pasek akcji (przenośnik) ---------- */
.sticky-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:600;
  display:none;grid-template-columns:1fr 1fr 1fr;
  background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);box-shadow:0 -10px 30px -12px rgba(13,13,43,.18);
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
}
.sticky-bar a{
  display:flex;flex-direction:column;align-items:center;gap:3px;
  font-size:.72rem;font-weight:700;color:var(--navy-soft);padding:6px 0;border-radius:14px;
  transition:background .2s,color .2s;
}
.sticky-bar a:hover{background:var(--bg-pink);color:var(--paw)}
.sticky-bar svg{width:21px;height:21px}
.sticky-bar .sb-main{color:var(--paw)}

/* ---------- responsive ---------- */
@media(max-width:1080px){
  .cat-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .surcharge-grid{grid-template-columns:1fr}
  .hour-steps{grid-template-columns:1fr}
  .sticky-bar{display:grid}
  footer{padding-bottom:96px}
}
@media(max-width:640px){
  .cat-grid{grid-template-columns:1fr}
  .page-hero{padding:138px 0 40px}
  .breed-panel{padding:8px 20px}
  .cennik-note{flex-direction:column;padding:24px 22px}
  .breed-row{gap:10px}
  .breed-row .bprice{font-size:1.05rem}
  .pn-nav{grid-template-columns:1fr}
  .pn-nav a.next{text-align:left;align-items:flex-start}
}
