/* ==============================================================
   Ablues Maine Coon Cattery - header + hero
   ============================================================== */
:root {
  --teal-dark: #17736a;      /* Available Kittens button */
  --teal-dark-hover: #115c55;
  --teal-drop: rgba(62, 140, 134, 0.92);   /* Buyer's Guide / Health & Care */
  --teal-drop-light: rgba(78, 154, 148, 0.82); /* About Maine Coons */
  --dark-drop: #2b3341;      /* About Us */
  --nav-text: #3b4757;
  --nav-active: #0d0f12;
  --nav-hover: #17736a;
  --title: #0b0b0b;
  --subtitle: #4e8784;
  --hero-bg: #f6f7fa;
  --chat: #5bbfbe;
  --header-h: 96px;
}

*,
*::before,
*::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
  background: #fff;
  color: var(--title);
  font-family: 'Exo 2', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }

/* ---------- Header ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: #fff;
  border-top: 3px solid #f1f1f1;
  transition: box-shadow .25s ease;
}
.site-header.is-scrolled { box-shadow: 0 2px 14px rgba(0, 0, 0, .07); }

.header-inner {
  max-width: 1240px;
  margin: 0 auto;
  height: var(--header-h);
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 32px;
}

.brand {
  font-family: 'Sorts Mill Goudy', Georgia, serif;
  font-size: 34px;
  line-height: 1;
  letter-spacing: -.3px;
  white-space: nowrap;
  color: var(--title);
  margin-right: auto;
}
.brand-accent { color: var(--teal-dark); }

.btn-kittens {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 20px;
  border-radius: 6px;
  background: var(--teal-dark);
  color: #fff;
  font-weight: 700;
  font-size: 19px;
  letter-spacing: .1px;
  white-space: nowrap;
  transition: background .2s ease, transform .2s ease;
}
.btn-kittens:hover { background: var(--teal-dark-hover); }
.btn-kittens--mobile { display: none; }

/* ---------- Menu ---------- */
.menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 23px;
}

.menu-item { position: relative; }

.menu-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: var(--header-h);
  font-size: 26px;
  font-weight: 500;
  color: var(--nav-text);
  white-space: nowrap;
  transition: color .2s ease;
}
.menu-item.is-active > .menu-link { color: var(--nav-active); font-weight: 600; }
.menu-item:hover > .menu-link,
.menu-item:focus-within > .menu-link { color: var(--nav-hover); }

.chev { width: 12px; height: 12px; margin-top: 3px; transition: transform .2s ease; }
.menu-item:hover .chev { transform: rotate(180deg); }

/* ---------- Dropdowns ---------- */
.dropdown {
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  top: calc(100% - 3px);
  left: -9px;
  min-width: 215px;
  background: var(--teal-drop);
  box-shadow: 0 6px 18px rgba(0, 0, 0, .08);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
  z-index: 50;
}
.menu-item:hover > .dropdown,
.menu-item:focus-within > .dropdown,
.menu-item.open > .dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.dropdown li + li { border-top: 1px solid rgba(255, 255, 255, .14); }

.dropdown a {
  display: block;
  padding: 18px 20px;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
  transition: background .15s ease, padding-left .15s ease;
}
.dropdown a:hover { background: rgba(0, 0, 0, .08); padding-left: 24px; }

.dropdown--teal  { width: 340px; }
.dropdown--light { background: var(--teal-drop-light); width: 270px; }
.dropdown--light a { padding: 16px 20px; font-size: 22px; }
.dropdown--dark  { background: var(--dark-drop); width: 330px; }
.dropdown--dark a { padding: 16px 20px; font-size: 22px; }

/* Buyer's Guide dropdown is a bit narrower in the original */
.menu-item:nth-child(2) .dropdown { width: 340px; }
.menu-item:nth-child(2) .dropdown a { padding: 16px 20px; font-size: 22px; }

/* ---------- Hamburger ---------- */
.nav-toggle {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 10px;
}
.nav-toggle span {
  display: block;
  height: 2px;
  background: var(--nav-text);
  margin: 5px 0;
  border-radius: 2px;
  transition: transform .25s ease, opacity .25s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Page / hero ---------- */
.page {
  max-width: 800px;
  margin: 0 auto;
  padding: 24px 24px 60px;
}
.entry { padding: 18px 34px 0; }

.entry-title {
  font-family: 'Sorts Mill Goudy', Georgia, serif;
  font-weight: 400;
  font-size: 69px;
  line-height: 1.32;
  letter-spacing: -1.2px;
  color: var(--title);
  margin: 0 0 22px;
}

.entry-meta {
  font-family: 'Fira Sans Condensed', sans-serif;
  font-size: 19px;
  color: #2b2b2b;
  margin: 0 0 32px;
}

.hero-box {
  background: var(--hero-bg);
  padding: 50px 30px 60px;
  text-align: center;
}
.hero-title {
  font-family: 'Sorts Mill Goudy', Georgia, serif;
  font-weight: 400;
  font-size: 52px;
  line-height: 1.3;
  letter-spacing: -.6px;
  color: var(--subtitle);
  max-width: 480px;
  margin: 0 auto;
}

/* ---------- Intro section (rating + banner + text) ---------- */
.intro-section {
  margin-top: 48px;
  font-family: 'Fira Sans Condensed', sans-serif;
  font-weight: 300;
  color: #2f3238;
}

.rating-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0 0 6px;
  font-size: 24px;
  line-height: 1.3;
}
.rating-line strong { font-weight: 600; color: #1f2733; }

.stars {
  position: relative;
  display: inline-block;
  line-height: 0;
}
.stars svg { width: 20px; height: 20px; margin-right: 1px; }
.stars-base svg { fill: #e4e4e4; }
.stars-fill {
  position: absolute;
  inset: 0 auto 0 0;
  overflow: hidden;
  white-space: nowrap;
}
.stars-fill svg { fill: #f5b400; }

.intro-banner { margin: 0 0 44px; }
.intro-banner img {
  display: block;
  width: 100%;
  height: auto;
}
.banner-placeholder {
  aspect-ratio: 730 / 122;
  background: #4f7f7a;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px;
}
.banner-script {
  font-family: 'Great Vibes', cursive;
  font-size: clamp(24px, 5vw, 44px);
  line-height: 1.1;
  text-shadow: 0 0 8px rgba(255, 255, 255, .7);
}
.banner-placeholder small { font-size: 15px; opacity: .75; margin-top: 4px; }

.intro-text p {
  font-size: 24px;
  line-height: 1.52;
  margin: 0 0 32px;
}
.intro-links {
  margin: 0 0 32px;
  padding-left: 40px;
  font-size: 24px;
  line-height: 1.52;
}
.intro-links a {
  color: #17736a;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.intro-links a:hover { color: #0f4f49; }

@media (max-width: 560px) {
  .rating-line,
  .intro-text p,
  .intro-links { font-size: 20px; }
  .intro-links { padding-left: 24px; }
  .intro-banner { margin-bottom: 30px; }
}

/* ---------- Reviews ---------- */
.reviews {
  scroll-margin-top: calc(var(--header-h) + 20px);
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.reviews-empty {
  font-family: 'Fira Sans Condensed', sans-serif;
  font-size: 21px;
  color: #6b7380;
  text-align: center;
}

.review-card {
  border: 1px solid #e3e3e3;
  background: #fff;
  padding: 18px 21px 22px;
  margin: 0 -22px;          /* card is a little wider than the text, like the original */
  font-family: 'Fira Sans Condensed', sans-serif;
  font-weight: 300;
  color: #2f3238;
}
.review-title {
  font-family: 'Sorts Mill Goudy', Georgia, serif;
  font-weight: 700;
  font-size: 34px;
  line-height: 1.25;
  letter-spacing: -.3px;
  color: #0b0b0b;
  margin: 0 0 10px;
}

.review-body { font-size: 24px; line-height: 1.52; }
.review-body::after { content: ''; display: block; clear: both; }
.review-body p { margin: 0 0 14px; }
.review-body p:last-child { margin-bottom: 0; }

.review-img {
  float: left;
  width: 222px;
  max-width: 42%;
  height: auto;
  margin: 2px 22px 8px 0;
  padding: 6px;
  border: 1px solid #e3e3e3;
  background: #fff;
}

.review-author {
  text-align: right;
  font-size: 24px;
  margin: 18px 0 6px;
}
.review-rating {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 2px;
  font-size: 24px;
  margin: 0;
}
.review-rating .stars svg { width: 20px; height: 20px; }

/* Pagination */
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
  font-family: 'Exo 2', sans-serif;
}
.page-btn {
  min-width: 44px;
  height: 44px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d9dfe2;
  border-radius: 6px;
  background: #fff;
  color: #3b4757;
  font-size: 18px;
  font-weight: 600;
  transition: background .15s, color .15s, border-color .15s;
}
a.page-btn:hover { border-color: var(--teal-dark); color: var(--teal-dark); }
.page-btn.is-current { background: var(--teal-dark); border-color: var(--teal-dark); color: #fff; }
.page-gap { color: #8a929c; padding: 0 2px; }
.pagination-info {
  text-align: center;
  font-family: 'Fira Sans Condensed', sans-serif;
  font-size: 17px;
  color: #8a929c;
  margin: 4px 0 0;
}

@media (max-width: 1024px) {
  .review-card { margin: 0; }
}
@media (max-width: 560px) {
  .review-card { padding: 16px; }
  .review-title { font-size: 28px; }
  .review-body,
  .review-author,
  .review-rating { font-size: 20px; }
  .review-img { width: 150px; margin-right: 14px; padding: 4px; }
  .page-btn { min-width: 40px; height: 40px; padding: 0 11px; }
}

/* ---------- Photo under the reviews ---------- */
.gallery-section { margin-top: 22px; }
.gallery-figure { margin: 0 -22px; }
.gallery-figure img { display: block; width: 100%; height: auto; }
.gallery-figure figcaption {
  text-align: center;
  font-family: 'Fira Sans Condensed', sans-serif;
  font-size: 17px;
  color: #555;
  padding: 10px 0 0;
}
.gallery-link {
  margin: 26px -22px 0;
  font-family: 'Fira Sans Condensed', sans-serif;
  font-weight: 300;
  font-size: 24px;
}
.gallery-link a {
  color: #17736a;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.gallery-link a:hover { color: #0f4f49; }

/* ---------- Footer ---------- */
.site-footer {
  background: #03020b;
  color: #fff;
  font-family: 'Fira Sans Condensed', sans-serif;
  font-weight: 300;
  padding: 52px 0 40px;
}
.footer-inner {
  max-width: 1170px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 30px;
}
.footer-col { display: flex; flex-direction: column; }
.footer-col--center { align-items: center; text-align: center; }
.site-footer a { color: #fff; transition: color .15s ease; }
.site-footer a:hover { color: #7fd3c9; }

.footer-payment {
  font-weight: 600;
  font-size: 25px;
  line-height: 1.45;
  margin: 15px 0 26px;
  max-width: 340px;
}
.footer-quick {
  font-size: 25px;
  line-height: 1.45;
  margin: 0 0 30px;
  max-width: 340px;
}
.footer-quick .sep { color: #c94f6d; }

.footer-search {
  background: #fff;
  padding: 17px 25px 38px;
  max-width: 347px;
  margin-bottom: 64px;
}
.search-field {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 82px;
  align-items: flex-start;
  padding: 22px 18px 0;
  border: 1px solid #d6d6d6;
  border-radius: 4px;
  color: #444;
  cursor: text;
}
.search-field svg { width: 20px; height: 20px; flex-shrink: 0; margin-top: 3px; }
.search-field input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: none;
  font: 17px 'Exo 2', sans-serif;
  color: #222;
  background: transparent;
  padding: 2px 0;
}
.search-field:focus-within { border-color: #17736a; box-shadow: 0 0 0 3px rgba(23,115,106,.15); }

.footer-phone { font-size: 25px; margin: auto 0 0; }

.footer-review { font-size: 25px; margin: 15px 0 28px; }
.footer-social { display: flex; justify-content: center; gap: 18px; }
.social {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition: transform .2s ease, filter .2s ease;
}
.social svg { width: 30px; height: 30px; }
.social:hover { transform: translateY(-2px); filter: brightness(1.12); }
.social--tiktok    { background: #000; }
.social--youtube   { background: #e60000; }
.social--youtube svg { width: 34px; height: 34px; }
.social--facebook  { background: #1877f2; }
.social--instagram { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }

.footer-links { list-style: none; margin: 0 0 40px; padding: 0; }
.footer-links li { font-size: 25px; line-height: 1.82; }
.google-badge {
  margin-top: auto;
  background: #fff;
  color: #1f2733;
  border-radius: 6px;
  padding: 10px 16px 12px;
  max-width: 347px;
  font-size: 22px;
  line-height: 1.6;
}
.google-badge strong { font-weight: 600; }
.google-badge .g-stars { letter-spacing: 1px; }
.site-footer .google-badge a { color: #1f2733; text-decoration: underline; }
.site-footer .google-badge a:hover { color: #17736a; }

.footer-bottom {
  max-width: 1170px;
  margin: 60px auto 0;
  padding: 0 24px;
  text-align: center;
  color: #4c4c55;
  font-size: 19px;
  line-height: 1.6;
}
.footer-copy { margin: 0 0 14px; }
.footer-about { margin: 0 auto; max-width: 1060px; }
.site-footer .footer-about a { color: #17a397; text-decoration: underline; }

@media (max-width: 1024px) {
  .gallery-figure, .gallery-link { margin-left: 0; margin-right: 0; }
  .footer-inner { grid-template-columns: 1fr 1fr; }
  .footer-col--links { grid-column: 1 / -1; }
  .google-badge { margin-top: 0; }
}
@media (max-width: 680px) {
  .site-footer { padding: 40px 0 30px; }
  .footer-inner { grid-template-columns: 1fr; gap: 34px; padding: 0 16px; }
  .footer-col--links { grid-column: auto; }
  .footer-payment, .footer-quick, .footer-phone, .footer-review, .footer-links li { font-size: 21px; }
  .footer-payment { margin-top: 0; }
  .footer-search { margin-bottom: 28px; max-width: none; }
  .footer-phone { margin-top: 0; }
  .footer-bottom { margin-top: 40px; padding: 0 16px; font-size: 17px; }
  .gallery-link { font-size: 20px; }
}

/* ---------- Chat widget ---------- */
.chat-widget {
  position: fixed;
  right: 22px;
  bottom: 10px;
  display: flex;
  align-items: center;
  gap: 20px;
  z-index: 200;
}
.chat-bubble {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
  padding: 9px 30px 10px 15px;
  font-family: system-ui, sans-serif;
  display: flex;
  flex-direction: column;
  gap: 4px;
  transition: opacity .3s ease, transform .3s ease;
}
.chat-bubble strong { font-weight: 400; font-size: 17px; color: #222; }
.chat-bubble span   { font-size: 15px; color: #777; }
.chat-bubble.hidden { opacity: 0; transform: translateX(10px); pointer-events: none; }
.chat-btn {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 0;
  background: var(--chat);
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
}
.chat-btn svg { width: 26px; height: 26px; }

/* ---------- Responsive ---------- */
/* Dropdowns of the last items open to the left so they stay on screen */
.menu > .menu-item:nth-last-child(-n+2) > .dropdown { left: auto; right: -9px; }

/* Laptops: the menu moves to its own row under the logo so the text can stay big */
@media (max-width: 2600px) and (min-width: 1025px) {
  .header-inner { flex-wrap: wrap; height: auto; padding-top: 14px; row-gap: 0; }
  .main-nav { order: 3; flex-basis: 100%; }
  .menu { justify-content: center; gap: 34px; }
  .menu-link { height: 58px; }
}
@media (max-width: 1200px) and (min-width: 1025px) {
  .menu { gap: 22px; }
  .menu-link { font-size: 24px; }
}

@media (max-width: 1024px) {
  :root { --header-h: 76px; }
  /* the Available Kittens button stays in the header, smaller, next to the menu button */
  .header-inner { gap: 10px; }
  .header-inner > .btn-kittens { height: 42px; padding: 0 16px; font-size: 17px; margin-left: auto; }
  .brand { margin-right: 0; }
  .nav-toggle { display: block; }

  .main-nav {
    position: fixed;
    top: var(--header-h);
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    overflow-y: auto;
    padding: 8px 20px 30px;
    transform: translateX(100%);
    transition: transform .3s ease;
  }
  .main-nav.open { transform: translateX(0); }

  .menu { flex-direction: column; align-items: stretch; gap: 0; }
  .menu-item { border-bottom: 1px solid #eee; }
  .menu-link { height: 60px; width: 100%; justify-content: space-between; font-size: 25px; }

  .dropdown,
  .dropdown--teal,
  .dropdown--light,
  .dropdown--dark,
  .menu-item:nth-child(2) .dropdown {
    position: static;
    width: 100%;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    display: none;
    margin-bottom: 10px;
  }
  .menu-item:hover > .dropdown,
  .menu-item:focus-within > .dropdown { display: none; }
  .menu-item.open > .dropdown { display: block; }
  .menu-item:hover .chev { transform: none; }
  .menu-item.open .chev { transform: rotate(180deg); }

  .btn-kittens--mobile { display: flex; margin-top: 20px; }

  .entry { padding: 10px 0 0; }
  .entry-title { font-size: 49px; }
  .hero-title { font-size: 40px; }
}

@media (max-width: 560px) {
  .header-inner { padding: 0 16px; }
  .brand { font-size: 27px; }
  .page { padding: 16px 16px 90px; }
  .entry-title { font-size: 38px; letter-spacing: -.6px; }
  .hero-title { font-size: 31px; }
  .hero-box { padding: 34px 18px 40px; }
  .chat-bubble { display: none; }
}

/* ---------- Logo picture (uploaded in admin) ---------- */
.brand--img img { display: block; height: 52px; width: auto; max-width: 180px; object-fit: contain; }

/* ---------- Dark header (home page) ---------- */
.site-header--dark { background: #03020b; border-top-color: #03020b; }
.site-header--dark.is-scrolled { box-shadow: 0 2px 14px rgba(0, 0, 0, .4); }
.site-header--dark .brand { color: #fff; }
.site-header--dark .brand-accent { color: #6fc7bd; }
.site-header--dark .btn-kittens { box-shadow: 3px 3px 0 rgba(111, 199, 189, .35); }
.site-header--dark .menu-link { color: #fff; font-weight: 600; }
.site-header--dark .menu-item.is-active > .menu-link { color: #fff; }
.site-header--dark .menu-item:hover > .menu-link,
.site-header--dark .menu-item:focus-within > .menu-link { color: #6fc7bd; }
.site-header--dark .nav-toggle span { background: #fff; }
@media (max-width: 1024px) {
  .site-header--dark .main-nav { background: #03020b; }
  .site-header--dark .menu-item { border-bottom-color: #1f1f2a; }
}

/* ---------- Contact bar (above the menu) ---------- */
.contact-bar { background: #1a6c66; color: #fff; font: 500 17px 'Exo 2', sans-serif; }
.contact-bar-inner { max-width: 1400px; margin: 0 auto; padding: 7px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cbar-links { display: flex; align-items: center; gap: 22px; margin-left: auto; flex-wrap: wrap; }
.contact-bar a, .cbar-hours { display: inline-flex; align-items: center; gap: 7px; color: #fff; }
.contact-bar a:hover span { text-decoration: underline; }
.contact-bar svg { width: 17px; height: 17px; flex: 0 0 auto; }
.cbar-hours { opacity: .85; }
@media (max-width: 760px) {
  .contact-bar-inner { padding: 6px 14px; justify-content: center; }
  .cbar-hours { display: none; }
  .cbar-links { margin: 0; gap: 18px; justify-content: center; }
  .cbar-links a span { font-size: 16px; }
  .cbar-links a[href^="mailto"] span { display: none; }
}

/* ---------- Footer contact lines ---------- */
.footer-contact { margin-top: 6px; }
.footer-address { color: #cfd3d8; font-size: 19px; line-height: 1.5; }

/* ---------- Contact page cards ---------- */
.contact-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; margin: 10px 0 26px; }
.ccard { display: flex; gap: 14px; align-items: flex-start; background: #f5f8f8; border: 1px solid #dbe4e4; border-radius: 10px; padding: 18px; }
.ccard-icon { flex: 0 0 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: #17736a; color: #fff; }
.ccard-icon svg { width: 24px; height: 24px; }
.ccard-icon--wa { background: #25a35a; }
.ccard-body { min-width: 0; }
.ccard h3 { margin: 0 0 4px; font: 600 20px 'Exo 2', sans-serif; color: #1f2326; }
.ccard p { margin: 0 0 10px !important; font-size: 20px; word-break: break-word; }
.ccard-btn { display: inline-block; font: 600 17px 'Exo 2', sans-serif; color: #17736a; text-decoration: underline; }

/* ---------- Chat button panel ---------- */
.chat-bubble { cursor: pointer; }
.chat-panel {
  position: absolute; right: 0; bottom: 70px; width: 300px; max-width: calc(100vw - 30px);
  background: #fff; border-radius: 12px; box-shadow: 0 10px 34px rgba(0, 0, 0, .2); padding: 14px; font-family: 'Exo 2', sans-serif;
}
.chat-panel[hidden] { display: none; }
.chat-panel-title { margin: 2px 4px 10px; font-weight: 600; font-size: 18px; color: #222; }
.chat-opt { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 8px; color: #222; }
.chat-opt:hover { background: #f1f6f5; }
.chat-opt strong { display: block; font-size: 18px; font-weight: 600; }
.chat-opt small { display: block; font-size: 15px; color: #777; word-break: break-word; }
.chat-opt-icon { flex: 0 0 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #17736a; color: #fff; }
.chat-opt-icon svg { width: 21px; height: 21px; }
.chat-opt--wa .chat-opt-icon { background: #25a35a; }
.chat-btn .chat-ico-close { display: none; }
.chat-btn.is-open .chat-ico-open { display: none; }
.chat-btn.is-open .chat-ico-close { display: block; }
.post-body .ccard h3 { margin: 8px 0 4px; font: 600 21px 'Exo 2', sans-serif; color: #1f2326; }
.post-body .ccard p { margin: 0 0 8px !important; }

/* ---------- Live chat window ---------- */
.chat-btn { position: relative; }
.chat-badge { position: absolute; top: -3px; right: -3px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: #e53935; color: #fff; font: 700 13px/22px 'Exo 2', sans-serif; text-align: center; }
.chat-win {
  position: absolute; right: 0; bottom: 70px; width: 370px; max-width: calc(100vw - 24px); height: 540px; max-height: calc(100vh - 110px);
  display: flex; flex-direction: column; background: #fff; border-radius: 14px; overflow: hidden;
  box-shadow: 0 14px 44px rgba(0, 0, 0, .25); font-family: 'Exo 2', sans-serif;
}
.chat-win[hidden] { display: none; }
.chat-head { display: flex; align-items: center; gap: 10px; padding: 12px 12px 12px 14px; background: #1a6c66; color: #fff; }
.chat-avatar { flex: 0 0 40px; height: 40px; border-radius: 50%; background: #fff; color: #1a6c66; display: grid; place-items: center; font: 700 15px 'Exo 2', sans-serif; overflow: hidden; }
.chat-avatar img { width: 100%; height: 100%; object-fit: contain; }
.chat-head-text { flex: 1; min-width: 0; }
.chat-head-text strong { display: block; font-size: 18px; font-weight: 700; }
.chat-head-text span { display: flex; align-items: center; gap: 6px; font-size: 14px; opacity: .9; }
.chat-dot { width: 8px; height: 8px; border-radius: 50%; background: #69f0ae; box-shadow: 0 0 0 2px rgba(105, 240, 174, .3); flex: 0 0 auto; }
.chat-head-btn { width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .14); color: #fff; display: grid; place-items: center; cursor: pointer; flex: 0 0 auto; }
.chat-head-btn:hover { background: rgba(255, 255, 255, .26); }
.chat-head-btn svg { width: 18px; height: 18px; }
.chat-body { flex: 1; overflow-y: auto; padding: 14px 12px; background: #f3f6f6; display: flex; flex-direction: column; gap: 8px; }
.chat-msg { max-width: 84%; display: flex; flex-direction: column; }
.chat-msg--visitor { align-self: flex-end; align-items: flex-end; }
.chat-text { padding: 9px 12px; border-radius: 14px; font-size: 17px; line-height: 1.45; word-wrap: break-word; overflow-wrap: anywhere; }
.chat-msg--bot .chat-text, .chat-msg--admin .chat-text { background: #fff; color: #222; border-bottom-left-radius: 4px; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.chat-msg--admin .chat-text { background: #e3f3f1; }
.chat-msg--visitor .chat-text { background: #17736a; color: #fff; border-bottom-right-radius: 4px; }
.chat-msg.is-failed .chat-text { background: #c0392b; }
.chat-text a { color: #17736a; font-weight: 600; text-decoration: underline; }
.chat-msg--visitor .chat-text a { color: #fff; }
.chat-who { font-size: 13px; font-weight: 700; color: #1a6c66; margin: 0 0 2px 4px; }
.chat-time { font-size: 12px; color: #8a9595; margin: 2px 6px 0; }
.chat-typing .chat-text { display: inline-flex; gap: 4px; padding: 12px 14px; }
.chat-typing i { width: 7px; height: 7px; border-radius: 50%; background: #9db0ae; animation: chatDot 1s infinite ease-in-out; }
.chat-typing i:nth-child(2) { animation-delay: .15s; }
.chat-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes chatDot { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-4px); opacity: 1; } }
.chat-quick { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px; background: #f3f6f6; border-top: 1px solid #e3e9e9; }
.chat-quick[hidden] { display: none; }
.chat-quick button { border: 1px solid #17736a; background: #fff; color: #17736a; border-radius: 16px; padding: 6px 12px; font: 600 15px 'Exo 2', sans-serif; cursor: pointer; }
.chat-quick button:hover { background: #17736a; color: #fff; }
.chat-contact { padding: 12px; border-top: 1px solid #e3e9e9; background: #fff; display: flex; flex-direction: column; gap: 7px; }
.chat-contact[hidden] { display: none; }
.chat-contact p { margin: 0; font-size: 16px; font-weight: 600; color: #333; }
.chat-contact input { height: 40px; border: 1px solid #cdd6d6; border-radius: 8px; padding: 0 11px; font: 17px 'Fira Sans Condensed', sans-serif; }
.chat-contact input:focus { outline: 0; border-color: #17736a; box-shadow: 0 0 0 3px rgba(23,115,106,.15); }
.chat-contact-row { display: flex; align-items: center; gap: 10px; }
.chat-contact-row button[type=submit] { flex: 1; height: 40px; border: 0; border-radius: 8px; background: #17736a; color: #fff; font: 700 17px 'Exo 2', sans-serif; cursor: pointer; }
.chat-link { border: 0; background: none; color: #667; font: 600 15px 'Exo 2', sans-serif; cursor: pointer; text-decoration: underline; }
.chat-error { color: #c0392b !important; font-weight: 500 !important; }
.chat-input { display: flex; align-items: flex-end; gap: 8px; padding: 10px; border-top: 1px solid #e3e9e9; background: #fff; }
.chat-input textarea { flex: 1; resize: none; border: 1px solid #cdd6d6; border-radius: 20px; padding: 10px 14px; font: 17px/1.35 'Fira Sans Condensed', sans-serif; max-height: 110px; }
.chat-input textarea:focus { outline: 0; border-color: #17736a; }
.chat-input button { flex: 0 0 42px; height: 42px; border: 0; border-radius: 50%; background: #17736a; color: #fff; display: grid; place-items: center; cursor: pointer; }
.chat-input button svg { width: 20px; height: 20px; }
.chat-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
@media (max-width: 520px) {
  .chat-widget.is-open { left: 0; right: 0; bottom: 0; top: 0; }
  .chat-widget.is-open .chat-win { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; border-radius: 0; }
  .chat-widget.is-open .chat-btn, .chat-widget.is-open .chat-bubble { display: none; }
  .chat-input textarea { font-size: 18px; }
}
@media (max-width: 760px) {
  .contact-bar { font-size: 15px; }
  .cbar-links { flex-wrap: nowrap; gap: 14px; }
  .cbar-links a span { font-size: 15px; white-space: nowrap; }
}
@media (max-width: 380px) {
  .cbar-links a[href^="tel"] span { font-size: 14px; }
}

/* Small phones: keep logo, Available Kittens and menu button on one line */
@media (max-width: 480px) {
  .header-inner { gap: 8px; }
  .brand { font-size: 24px; }
  .header-inner > .btn-kittens { height: 38px; padding: 0 12px; font-size: 15px; }
  .nav-toggle { width: 40px; padding: 8px; }
  .brand--img img { height: 40px; max-width: 130px; }
}
@media (max-width: 370px) {
  .brand { font-size: 22px; }
  .header-inner > .btn-kittens .bk-word { display: none; }
}

.btn-kittens .bk-word { margin-right: .3em; }
.cbar-lbl { font-style: normal; }
@media (max-width: 420px) { .cbar-lbl { display: none; } }
@media (max-width: 600px) {
  .footer-inner { grid-template-columns: minmax(0, 1fr); }
  .footer-col { min-width: 0; overflow-wrap: anywhere; }
  .footer-search, .footer-search form { max-width: 100%; }
}
@media (max-width: 360px) {
  .footer-payment, .footer-quick, .footer-phone, .footer-review, .footer-links li { font-size: 19px; }
}

/* ---------- Text logo: "Ablues Maine Coon Cattery" ---------- */
.brand-mark { font-weight: 600; }
@media (max-width: 1024px) {
  .brand:not(.brand--img) { display: flex; flex-direction: column; line-height: 1.05; white-space: normal; }
  .brand:not(.brand--img) .brand-mark { font-size: 1.05em; }
  .brand:not(.brand--img) .brand-accent { font-size: .62em; letter-spacing: .2px; }
}