/* old site-header CSS removed — using ph-* header */
header .hd, header.old { display: none; }

/* ===== SCROLL ANIMATIONS ===== */
@media (prefers-reduced-motion: no-preference) {
  .section-head {
    opacity: 0;
    transform: translateY(28px);
    animation: ph-reveal linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 28%;
  }
  .trust-grid > div {
    opacity: 0;
    transform: translateY(20px);
    animation: ph-reveal linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 40%;
  }
  .case, .more-card {
    opacity: 0;
    transform: translateY(28px);
    animation: ph-reveal linear both;
    animation-timeline: view();
    animation-range: entry 0% entry 35%;
  }
  @keyframes ph-reveal {
    to { opacity: 1; transform: translateY(0) scale(1); }
  }
}
.js-anim .section-head,
.js-anim .feature,
.js-anim .price-card,
.js-anim .dog-card,
.js-anim .car-card,
.js-anim .case,
.js-anim .more-card,
.js-anim .trust-grid > div {
  animation: none !important;
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .section-head, .feature, .price-card, .dog-card,
  .case, .more-card, .trust-grid > div {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}


/* ===== CAR GALLERY (как у собак) ===== */
.car-section { overflow: hidden; }
.car-gallery-wrap { position: relative; margin-bottom: 28px; }

.car-grid-gallery {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 16px;
  padding: 4px 16px 12px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
.car-grid-gallery::-webkit-scrollbar { display: none; }

.car-card {
  flex: 0 0 min(78vw, 290px);
  height: 320px;
  scroll-snap-align: center;
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: #1a120e;
  cursor: pointer;
  isolation: isolate;
  border: none;
  padding: 0;
  margin: 0;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  appearance: none;
  -webkit-appearance: none;
  display: block;
}
.car-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}
.car-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(18,10,6,.82) 0%, rgba(18,10,6,.12) 48%, transparent 70%);
  pointer-events: none;
  z-index: 1;
}
.car-txt {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 16px 18px 18px;
  z-index: 2;
  color: #fff;
}
.car-txt h3 {
  margin: 0 0 2px;
  font-size: 1.15rem;
  font-weight: 600;
  color: #fff;
  letter-spacing: -0.02em;
}
.car-txt small {
  display: block;
  font-size: 0.8rem;
  opacity: 0.82;
  color: #f0e6dc;
}
.car-card .tap-hint {
  position: absolute;
  top: 12px; right: 12px;
  z-index: 2;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  pointer-events: none;
}

.car-dots {
  display: flex;
  justify-content: center;
  gap: 7px;
  padding: 6px 16px 4px;
}
.car-dots span {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: rgba(0,0,0,0.16);
  transition: background 0.2s, transform 0.2s;
}
.car-dots span.active {
  background: var(--orange, #e88c3c);
  transform: scale(1.2);
}

.car-features-row {
  display: grid;
  gap: 4px;
}
.car-features-row .feature {
  display: flex;
  gap: 13px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(43,24,16,.1);
}
.car-features-row .feature:last-child { border-bottom: 0; }

@media (min-width: 640px) {
  .car-grid-gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    overflow: visible;
    padding: 0;
    scroll-snap-type: none;
  }
  .car-card {
    flex: none;
    width: 100%;
    height: 0;
    padding-bottom: 72%;
    scroll-snap-align: none;
  }
  .car-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .car-card .tap-hint { display: none; }
  .car-dots { display: none; }
  .car-features-row {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px 20px;
  }
}
@media (min-width: 960px) {
  .car-grid-gallery {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  .car-card {
    padding-bottom: 68%;
    border-radius: 20px;
  }
  .car-card:hover img { transform: scale(1.06); }
  .car-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 20px;
    border: 1.5px solid transparent;
    transition: border-color 0.3s;
    z-index: 3;
    pointer-events: none;
  }
  .car-card:hover::before {
    border-color: rgba(232, 140, 60, 0.5);
  }
  .car-features-row {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* ===== DOG GALLERY — FIXED ===== */

.dogs { overflow: hidden; }
.dog-gallery-wrap { position: relative; }

/* Mobile: horizontal snap */
.dog-grid {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 16px;
  padding: 4px 16px 12px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}
.dog-grid::-webkit-scrollbar { display: none; }

.dog-card {
  flex: 0 0 min(78vw, 290px);
  height: 360px;
  scroll-snap-align: center;
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: #1a120e;
  cursor: pointer;
  isolation: isolate;
  border: none;
  padding: 0;
  margin: 0;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  appearance: none;
  -webkit-appearance: none;
  display: block;
}

.dog-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

.dog-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(18, 10, 6, 0.8) 0%,
    rgba(18, 10, 6, 0.15) 45%,
    transparent 68%
  );
  pointer-events: none;
  z-index: 1;
}

.dog-txt {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 16px 18px 18px;
  z-index: 2;
  color: #fff;
}
.dog-txt h3 {
  margin: 0 0 2px;
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  letter-spacing: -0.02em;
}
.dog-txt small {
  display: block;
  font-size: 0.8rem;
  opacity: 0.82;
  color: #f0e6dc;
}

.dog-card .tap-hint {
  position: absolute;
  top: 12px; right: 12px;
  z-index: 2;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 14px;
  pointer-events: none;
}

/* Tablet: 2 columns, equal cards */
@media (min-width: 640px) {
  .dog-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
    overflow: visible;
    padding: 0;
    scroll-snap-type: none;
  }
  .dog-card {
    flex: none;
    width: 100%;
    height: 0;
    padding-bottom: 115%; /* aspect ratio */
    scroll-snap-align: none;
    position: relative;
  }
  .dog-card img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .dog-card .tap-hint { display: none; }
}

/* Desktop: 3 equal columns — clean, no broken spans */
@media (min-width: 960px) {
  .dog-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
  .dog-card {
    padding-bottom: 105%;
    border-radius: 20px;
  }
  .dog-card:hover img {
    transform: scale(1.06);
  }
  .dog-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 20px;
    border: 1.5px solid transparent;
    transition: border-color 0.3s;
    z-index: 3;
    pointer-events: none;
  }
  .dog-card:hover::before {
    border-color: rgba(232, 140, 60, 0.5);
  }
}

.dog-dots {
  display: flex;
  justify-content: center;
  gap: 7px;
  padding: 6px 16px 4px;
}
.dog-dots span {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: rgba(0,0,0,0.16);
  transition: background 0.2s, transform 0.2s;
}
.dog-dots span.active {
  background: var(--orange, #e88c3c);
  transform: scale(1.2);
}
@media (min-width: 640px) {
  .dog-dots { display: none; }
}

/* ===== LIGHTBOX ===== */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(12, 8, 5, 0.92);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  padding: env(safe-area-inset-top) 12px env(safe-area-inset-bottom);
}
.lightbox.is-open {
  opacity: 1;
  visibility: visible;
}
.lightbox-inner {
  width: min(100%, 520px);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  transform: scale(0.95) translateY(10px);
  transition: transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}
.lightbox.is-open .lightbox-inner {
  transform: scale(1) translateY(0);
}
.lightbox-img-wrap {
  width: 100%;
  border-radius: 16px;
  overflow: hidden;
  background: #1a120e;
  max-height: 68vh;
}
.lightbox-img-wrap img {
  width: 100%;
  height: auto;
  max-height: 68vh;
  object-fit: contain;
  display: block;
}
.lightbox-caption {
  margin-top: 12px;
  text-align: center;
  color: #fff;
}
.lightbox-caption h3 {
  margin: 0 0 4px;
  font-size: 1.3rem;
  color: #fff;
}
.lightbox-caption p {
  margin: 0;
  font-size: 0.9rem;
  opacity: 0.75;
  color: #f0e6dc;
}
.lightbox-close {
  position: absolute;
  top: max(12px, env(safe-area-inset-top));
  right: max(12px, env(safe-area-inset-right));
  width: 44px; height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.14);
  color: #fff;
  font-size: 24px;
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px; height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.14);
  color: #fff;
  font-size: 26px;
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox-prev { left: 8px; }
.lightbox-next { right: 8px; }
@media (min-width: 768px) {
  .lightbox-inner { width: min(90vw, 700px); }
  .lightbox-prev { left: 20px; }
  .lightbox-next { right: 20px; }
}
body.lightbox-open {
  overflow: hidden;
  touch-action: none;
}

/* Real messenger icons */
.ph-icon-btn{
  width:32px;height:32px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;transition:transform .15s,opacity .15s;
  flex-shrink:0;
}
.ph-icon-btn:hover{transform:scale(1.08);opacity:.92}
.ph-icon-btn svg{display:block}
.ph-viber{background:#7360f2;color:#fff}
.ph-whatsapp{background:#25d366;color:#fff}
.ph-msg-text{color:inherit;text-decoration:none;font-weight:600;font-size:13px}
.ph-msg-text:hover{color:#B86F33}
.ph-m-msg a svg{flex-shrink:0}
.ph-m-msg a span{line-height:1}

.ph-nav a[aria-current="page"],.ph-mobile-nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:#B86F33;text-decoration-thickness:2px;text-underline-offset:8px}
.sub-hero{background:#f6eee4;padding:clamp(44px,7vw,72px) 0 clamp(28px,4vw,44px);border-bottom:1px solid rgba(26,18,14,.1);color:#1a120e}
.sub-hero h1{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(34px,5vw,54px);line-height:1.12;margin:10px 0 12px}
.sub-hero p{max-width:40rem;font-size:18px;line-height:1.65;color:#5e4a3e}
.crumbs{font-size:14px;color:#5e4a3e}.crumbs a{color:#A9622B;text-decoration:none;font-weight:700}
.sv-grid,.ct-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:clamp(32px,5vw,56px) 0}
.ct-grid{grid-template-columns:repeat(2,1fr)}
.sv-card,.ct-card{display:block;background:#fff;border:1px solid rgba(26,18,14,.12);border-radius:22px;padding:26px;text-decoration:none;color:#1a120e;box-shadow:0 8px 26px rgba(26,18,14,.06)}
.sv-card h3,.ct-card b{font-family:"Cormorant Garamond",Georgia,serif;font-size:24px;display:block;margin-bottom:8px}
.sv-card p,.ct-card small{color:#5e4a3e;font-size:16px;line-height:1.6}
.sv-card a{color:#A9622B;font-weight:700;text-decoration:none;display:inline-block;margin-top:12px}
.ct-card:hover,.sv-card:hover{border-color:#B86F33}
.faq{max-width:820px;padding:clamp(32px,5vw,56px) 0}
.faq details{background:#fff;border:1px solid rgba(26,18,14,.12);border-radius:18px;padding:18px 22px;margin-bottom:12px}
.faq summary{font:600 20px "Cormorant Garamond",Georgia,serif;cursor:pointer}.faq p{margin-top:10px;color:#5e4a3e;line-height:1.65}.faq a{color:#A9622B;font-weight:700}
.calc{background:#fff;border:1px solid rgba(26,18,14,.12);border-radius:26px;padding:30px;max-width:640px;margin:clamp(32px,5vw,56px) auto;color:#1a120e}
.calc h3{font:600 26px "Cormorant Garamond",Georgia,serif;margin-bottom:14px}.calc input{width:100%;accent-color:#B86F33;margin:14px 0}
.calc .seg{display:flex;gap:8px}.calc .seg button{flex:1;height:44px;border-radius:99px;border:1px solid rgba(26,18,14,.2);background:none;font-weight:700;cursor:pointer}
.calc .seg button.on{background:#B86F33;color:#fff;border-color:#B86F33}.calc .res{font:600 44px "Cormorant Garamond",Georgia,serif;color:#A9622B}
.rel{display:flex;flex-wrap:wrap;gap:12px;padding:8px 0 clamp(40px,6vw,64px)}
.rel a{border:1.5px solid #B86F33;color:#A9622B;padding:12px 22px;border-radius:99px;font-weight:700;text-decoration:none}.rel a:hover{background:#B86F33;color:#fff}
@media(max-width:820px){.sv-grid,.ct-grid{grid-template-columns:1fr}}
