/* Bushy Tail — фирменный стиль под утверждённый логотип:
   коричневый + оливково-зелёный + кремовый, медовый акцент.
   Имена переменных исторические (--pn-sea = основной цвет бренда). */
/* Цвета сняты пипеткой с дизайн-макета page_desigb.png */
:root {
  --pn-sea: #64783D;
  --pn-sea-dark: #576B31;
  --pn-sea-tint: #EFF2E6;
  --pn-sun: #D9A441;
  --pn-sand: #FDFCFA;
  --pn-ink: #352513;
  --pn-muted: #8C8578;
  --pn-line: #ECEAE2;
}

body, .ast-separate-container {
  background-color: var(--pn-sand) !important;
  color: var(--pn-ink);
}

/* Шапка */
.site-header, .main-header-bar, .ast-primary-header-bar {
  background: var(--pn-sand) !important;
  border-bottom: none;
}
.site-title a, .site-title a:hover, .site-title a:focus {
  color: var(--pn-ink) !important;
  font-weight: 900;
  letter-spacing: -0.02em;
}
/* «Tail» — оливковым, как в логотипе (обёртка добавляется скриптом в mu-плагине) */
.site-title .bt-accent { color: var(--pn-sea); }
/* Логотип-картинка содержит название — текстовый заголовок прячем (как в макете) */
.site-title, .site-description { display: none; }
.custom-logo { max-height: 120px; width: auto; }

/* Ссылки и навигация */
a { color: var(--pn-sea); }
a:hover, a:focus { color: var(--pn-sea-dark); }
.main-header-menu a { color: var(--pn-ink) !important; font-weight: 600; }
.main-header-menu a:hover { color: var(--pn-sea) !important; }

/* Карточки товаров */
.woocommerce ul.products li.product, ul.products li.product {
  background: #ffffff;
  border: 1px solid var(--pn-line);
  border-radius: 18px;
  padding: 14px 14px 18px !important;
  transition: border-color 0.15s ease;
}
ul.products li.product:hover { border-color: var(--pn-sea); }
ul.products li.product img { border-radius: 12px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--pn-ink);
  font-weight: 700;
}
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
  color: var(--pn-ink) !important;
  font-weight: 800;
}

/* Кнопки — бирюзовые «пилюли» */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce button[name="add-to-cart"],
.wp-block-button__link, button, input[type="submit"] {
  background: var(--pn-sea) !important;
  color: #ffffff !important;
  border-radius: 999px !important;
  border: none !important;
  font-weight: 700 !important;
  padding: 0.7em 1.6em !important;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
button:hover, input[type="submit"]:hover {
  background: var(--pn-sea-dark) !important;
  color: #ffffff !important;
}
.woocommerce a.added_to_cart { margin-left: 8px; font-weight: 700; }

/* Стандартный бейдж распродажи — солнечный */
.woocommerce span.onsale {
  background: var(--pn-sun) !important;
  color: #2B1D05 !important;
  border-radius: 999px !important;
  font-weight: 800;
}

/* Формы (оформление заказа) */
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  border: 1px solid var(--pn-line);
  border-radius: 10px;
  padding: 0.6em 0.9em;
}
.woocommerce form .form-row input.input-text:focus { border-color: var(--pn-sea); }

/* Хлебные крошки и мелочи */
.woocommerce .woocommerce-breadcrumb { color: var(--pn-muted); }
.woocommerce .woocommerce-ordering select { border-radius: 999px; border: 1px solid var(--pn-line); padding: 0.4em 1em; }

/* Сообщения */
.woocommerce-message, .woocommerce-info {
  border-top-color: var(--pn-sea) !important;
  background: var(--pn-sea-tint);
  color: var(--pn-ink);
  border-radius: 10px;
}

/* --- Главная страница по макету --- */
/* Контент главной: по центру, с боковыми отступами (шаблон «на всю ширину» у Astra их убирает) */
body.home .site-content .entry-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px 34px;
  box-sizing: border-box;
}
body.home .pn-hero h1 { text-wrap: balance; }

.pn-topbar { background: var(--pn-sand); color: var(--pn-muted); font-size: 0.85rem; border-bottom: 1px solid var(--pn-line); }
.pn-topbar-in { max-width: 1200px; margin: 0 auto; padding: 7px 20px; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.pn-langs { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; }
.pn-langs li { margin: 0; list-style: none; }
.pn-langs a { color: var(--pn-muted) !important; padding: 2px 10px; border-radius: 999px; text-decoration: none; font-weight: 600; }
.pn-langs li.current-lang a { background: var(--pn-sea); color: #fff !important; }

.pn-hero { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 36px; align-items: center; padding: 26px 0 6px; }
.pn-eyebrow { text-transform: uppercase; letter-spacing: 0.16em; font-size: 0.75rem; font-weight: 700; color: var(--pn-sun); margin: 0 0 10px; }
.pn-hero h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 14px; color: var(--pn-ink); }
.pn-sub { color: var(--pn-muted); max-width: 46ch; }
.pn-cta {
  display: inline-block; background: var(--pn-sun) !important; color: #2B1D05 !important;
  font-weight: 800; padding: 12px 28px; border-radius: 999px; text-decoration: none; margin-top: 10px;
}
.pn-cta:hover { filter: brightness(1.06); }
.pn-hero-art { text-align: center; }
.pn-hero-art img { max-width: 100%; height: auto; }

.pn-h2 { margin-top: 34px; }

.pn-cats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.pn-cat {
  background: #fff; border: 1px solid var(--pn-line); border-radius: 18px;
  padding: 18px 10px 15px; text-align: center; text-decoration: none;
  color: var(--pn-ink) !important; font-weight: 700;
}
.pn-cat:hover { border-color: var(--pn-sea); }
.pn-cat-ico {
  display: flex; width: 54px; height: 54px; margin: 0 auto 10px; border-radius: 50%;
  background: var(--pn-sea-tint); align-items: center; justify-content: center; font-size: 1.6rem;
}
.pn-cat span:last-child { display: block; }

.pn-trust {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px;
  background: #fff; border: 1px solid var(--pn-line); border-radius: 18px;
  padding: 26px; margin: 38px 0 12px;
}
.pn-trust-item { display: flex; gap: 14px; align-items: flex-start; }
.pn-tico {
  flex: none; width: 46px; height: 46px; border-radius: 14px; background: var(--pn-sea-tint);
  display: flex; align-items: center; justify-content: center; font-size: 1.35rem;
}
.pn-trust-item h3 { margin: 0 0 3px; font-size: 1rem; }
.pn-trust-item p { margin: 0; color: var(--pn-muted); font-size: 0.87rem; }

/* --- Секции по дизайн-макету page_desigb.png --- */
.pn-topbar-right { display: flex; align-items: center; gap: 14px; }
.pn-search { display: inline-flex; align-items: center; background: #fff; border: 1px solid var(--pn-line); border-radius: 999px; padding: 2px 4px 2px 12px; }
.pn-search input[type="search"] { border: none; background: transparent; font-size: 0.85rem; width: 150px; outline: none; color: var(--pn-ink); padding: 4px 0; }
.pn-search button { background: transparent !important; border: none !important; color: var(--pn-sea) !important; padding: 4px !important; display: inline-flex; cursor: pointer; border-radius: 999px !important; }
.pn-search svg { width: 17px; height: 17px; }
@media (max-width: 820px) { .pn-search input[type="search"] { width: 100px; } }
.pn-cart-link { display: inline-flex; align-items: center; gap: 6px; color: var(--pn-sea) !important; text-decoration: none; font-weight: 700; }
.pn-cart-link svg { width: 24px; height: 24px; }
.pn-cart-count {
  background: var(--pn-sea); color: #fff; border-radius: 999px;
  min-width: 19px; height: 19px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.72rem; font-weight: 700; padding: 0 5px;
}

.pn-h1-accent { color: var(--pn-sea); }
.pn-cta { background: var(--pn-sea) !important; color: #fff !important; }
.pn-cta:hover { background: var(--pn-sea-dark) !important; filter: none; }

.pn-benefits { display: grid; grid-template-columns: repeat(4, 1fr); margin: 30px 0 6px; }
.pn-benefit { text-align: center; padding: 22px 18px; position: relative; }
.pn-benefit + .pn-benefit::before {
  content: ''; position: absolute; left: 0; top: 22%; height: 56%; width: 1px; background: var(--pn-line);
}
.pn-benefit .pn-bico { width: 46px; height: 46px; margin: 0 auto; color: var(--pn-sea); }
.pn-benefit .pn-bico svg { width: 100%; height: 100%; }
.pn-benefit h3 { font-size: 0.98rem; margin: 12px 0 6px; }
.pn-benefit p { color: var(--pn-muted); font-size: 0.85rem; margin: 0; }

.pn-h2c { text-align: center; margin: 34px 0 4px; }
.pn-paw-divider { text-align: center; color: var(--pn-sea); margin: 0 0 22px; }
.pn-paw-divider svg { width: 26px; height: 26px; }

.pn-cat {
  background: #F9F5EE; border: 1px solid #EFE7DA; border-radius: 16px;
  width: 100%; aspect-ratio: 1 / 1; box-sizing: border-box; padding: 10px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
}
.pn-cat:hover { border-color: var(--pn-sea); }
.pn-cat-ico { background: transparent; width: auto; height: 72px; color: #4A3018; display: flex; align-items: center; justify-content: center; }
.pn-cat-ico svg { width: 60px; height: 60px; }

.pn-center { text-align: center; margin: 22px 0 6px; }
.pn-btn-outline {
  display: inline-block; border: 1.5px solid var(--pn-sea); color: var(--pn-sea) !important;
  border-radius: 999px; padding: 10px 28px; font-weight: 700; text-decoration: none; background: transparent;
}
.pn-btn-outline:hover { background: var(--pn-sea); color: #fff !important; }

.pn-promo {
  display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 28px; align-items: center;
  background: #F5F4EB; border-radius: 24px; padding: 28px 34px; margin: 42px 0 10px;
}
.pn-promo img { max-width: 100%; height: auto; display: block; }
.pn-promo h3 { margin: 0 0 2px; font-size: 1.25rem; }
.pn-promo-accent { color: var(--pn-sea); font-weight: 800; font-size: 1.35rem; margin: 0 0 10px; }
.pn-promo p { color: var(--pn-muted); margin: 0 0 14px; }
.pn-code {
  display: inline-block; background: #fff; border: 1.5px dashed var(--pn-sea);
  color: var(--pn-ink); border-radius: 12px; padding: 8px 20px; font-weight: 800; letter-spacing: 0.08em;
}
.pn-promo-form { display: flex; gap: 10px; flex-wrap: wrap; }
.pn-promo-form input {
  flex: 1; min-width: 180px; border: 1px solid var(--pn-line); border-radius: 12px;
  padding: 11px 16px; background: #fff; font: inherit; color: var(--pn-ink);
}
.pn-promo-form input:focus { border-color: var(--pn-sea); outline: none; }
.pn-promo-form button { border-radius: 12px !important; padding: 11px 22px !important; }

/* Футер по макету; стандартный футер Astra скрываем */
footer.site-footer { display: none; }
.pn-footer { border-top: 1px solid var(--pn-line); margin-top: 46px; padding: 36px 0 28px; background: var(--pn-sand); }
.pn-footer-in { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 26px; }
.pn-footer h4 { margin: 0 0 12px; font-size: 0.95rem; }
.pn-footer ul { list-style: none; margin: 0; padding: 0; }
.pn-footer li { margin: 7px 0; }
.pn-footer a { color: var(--pn-muted); text-decoration: none; }
.pn-footer a:hover { color: var(--pn-sea); }
.pn-footer-brand img { border-radius: 16px; }
.pn-copy { color: var(--pn-muted); font-size: 0.8rem; margin-top: 10px; }

@media (max-width: 820px) {
  .pn-hero { grid-template-columns: 1fr; }
  .pn-hero-art { order: -1; }
  .pn-cats { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); }
  .pn-trust { grid-template-columns: 1fr; }
  .pn-benefits { grid-template-columns: 1fr 1fr; }
  .pn-benefit + .pn-benefit::before { display: none; }
  .pn-promo { grid-template-columns: 1fr; }
  .pn-footer-in { grid-template-columns: 1fr 1fr; }
}