/* ============================================================
   OhPet — Public site styles
   ============================================================ */

.display { font-family: 'Playfair Display', serif; }

/* ---- Hero ---- */
.hero-gradient {
  background: linear-gradient(135deg, #fff5e6 0%, #fffaf5 50%, #ffe8d1 100%);
}
@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }
.float { animation: float 4s ease-in-out infinite; }

/* ---- Slider ---- */
.hero-slide { display: none; }
.hero-slide.active { display: block; animation: fadeIn .6s ease; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.slider-dot { transition: .25s; cursor: pointer; }

/* ---- Card hover effects ---- */
.cat-card, .prod-card, .related-card, .value-card, .team-card, .info-card, .blog-card {
  transition: transform .4s, box-shadow .4s;
}
.cat-card:hover, .value-card:hover, .info-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,.08); }
.prod-card:hover, .related-card:hover, .blog-card:hover { transform: translateY(-6px); box-shadow: 0 15px 35px rgba(0,0,0,.1); }

.img-wrap { overflow: hidden; }
.img-wrap img { transition: transform .6s ease; }
.cat-card:hover img, .prod-card:hover img, .related-card:hover img,
.team-card:hover img, .blog-card:hover img { transform: scale(1.07); }

.prod-card:hover .enquire-btn { background: #f97316; color: #fff; }
.enquire-btn { transition: .25s; }

/* ---- Product badges ---- */
.badge {
  display: inline-flex; align-items: center; gap: .3rem;
  font-size: .68rem; font-weight: 700; padding: .25rem .6rem;
  border-radius: 9999px; color: #fff;
}
.badge-best  { background: #16a34a; }
.badge-trend { background: #2563eb; }
.badge-feat  { background: #f97316; }

/* ---- Product gallery thumbnails ---- */
.thumb { transition: .25s; cursor: pointer; border: 2px solid transparent; }
.thumb:hover, .thumb.active { border-color: #f97316; }

/* ---- Forms ---- */
.input-field { transition: .25s; }
.input-field:focus { border-color: #f97316; box-shadow: 0 0 0 3px rgba(249,115,22,.15); }

/* ---- Privacy / CMS table of contents ---- */
.toc-link { transition: .2s; }
.toc-link:hover, .toc-link.active { color: #f97316; padding-left: .4rem; }

/* ---- Rich content (CMS pages, blog) ---- */
.rich-content { color: #4b5563; line-height: 1.85; }
.rich-content h2 { font-family: 'Playfair Display', serif; font-size: 1.7rem; font-weight: 700; color: #111827; margin: 1.8rem 0 .8rem; }
.rich-content h3 { font-size: 1.25rem; font-weight: 700; color: #111827; margin: 1.4rem 0 .6rem; }
.rich-content p  { margin-bottom: 1rem; }
.rich-content ul, .rich-content ol { padding-left: 1.5rem; margin-bottom: 1rem; }
.rich-content ul { list-style: disc; }
.rich-content ol { list-style: decimal; }
.rich-content li { margin-bottom: .4rem; }
.rich-content a  { color: #f97316; text-decoration: underline; }
.rich-content strong { color: #111827; }
.rich-content blockquote {
  border-left: 3px solid #f97316; padding-left: 1rem; color: #6b7280; font-style: italic; margin: 1rem 0;
}
.rich-content .lead { font-size: 1.12rem; color: #374151; }

/* ---- Search results ---- */
.search-item { transition: background .15s; }
.search-item:hover { background: #fff7ed; }

/* ---- Filter chips ---- */
.filter-chip { transition: .2s; }

/* ---- Utility ---- */
.line-clamp-2 {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
img { background: #fff5e6; }
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }