/*!
Theme Name: Tiny Paws
Theme URI: https://tinypawsva.com/
Author: Cosmick Media
Author URI: https://cosmickmedia.com
Description: Standalone "Warm Boutique" theme for Tiny Paws VA — a Ruckersville, Virginia puppy boutique. Replaces the Elementor + Astra child setup; integrates WooCommerce + Unified KM. No page builder required.
Version: 2.2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tinypaws
Tags: woocommerce, custom-colors, custom-menu, featured-images, threaded-comments
*/

/* ==========================================================================
   Tiny Paws — "Warm Boutique" design system
   Signature: pet ID name-tag puppy cards · arched photo frames · restrained
   bone/paw motif. Palette: raspberry + espresso mocha on warm cream, sage foil.
   Bootstrap 5 is loaded first; we retint its CSS variables so ported
   WooCommerce/partial markup inherits the brand automatically.
   ========================================================================== */

:root {
  /* ==========================================================================
     Palette = the original warm Tiny Paws colors (raspberry + espresso mocha on
     warm cream, sage accent) — kept from the previous system. The LAYOUT + TYPE
     stay "Fresh Modern" (Bricolage/Jakarta, crisp square photos, no decoration).
     ========================================================================== */
  --tp-raspberry: #d6337f;        /* primary accent / CTA */
  --tp-raspberry-deep: #b02566;   /* hover */
  --tp-raspberry-soft: #f8e4ee;   /* soft accent wash */
  --tp-mocha: #5f5048;            /* headings / strong UI */
  --tp-mocha-deep: #3f342e;
  --tp-cream: #f7f1e9;            /* page background (warm cream) */
  --tp-cream-2: #fbf7f1;          /* alt section background */
  --tp-blush: #f8e4ee;            /* soft blush block */
  --tp-sage: #c9d8c5;             /* sage accent block */
  --tp-sage-deep: #7f9a7b;        /* sage-deep label */
  --tp-ink: #2a2320;             /* body text */
  --tp-muted: #8a7d74;
  --tp-line: #e7dccf;             /* hairline / photo keyline / borders */
  --tp-white: #ffffff;

  /* Type — Bricolage Grotesque display + Plus Jakarta Sans body. No serif/script. */
  --tp-display: "Bricolage Grotesque", "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --tp-body: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --tp-script: "Plus Jakarta Sans", system-ui, sans-serif;

  /* Crisp shapes; buttons stay pill. */
  --tp-r-sm: 4px;
  --tp-r-md: 6px;
  --tp-r-lg: 8px;
  --tp-r-pill: 999px;
  --tp-shadow: 0 6px 20px rgba(63, 52, 46, 0.08);
  --tp-shadow-lift: 0 14px 34px rgba(63, 52, 46, 0.14);
  --tp-ease: cubic-bezier(.34, 1.1, .5, 1);

  /* Retint Bootstrap. */
  --bs-primary: #d6337f;
  --bs-primary-rgb: 214, 51, 127;
  --bs-link-color: #b02566;
  --bs-link-color-rgb: 176, 37, 102;
  --bs-link-hover-color: #8f1c50;
  --bs-body-color: #2a2320;
  --bs-body-color-rgb: 42, 35, 32;
  --bs-body-bg: #f7f1e9;
  --bs-border-color: #e7dccf;
  --bs-body-font-family: var(--tp-body);
  --bs-border-radius: 6px;
  --bs-border-radius-lg: 8px;
  --bs-border-radius-xl: 10px;

  /* Rating stars keep a friendly gold. */
  --tp-honey: #e8a33d;
  --tp-honey-deep: #c98a2e;
  --tp-honey-soft: #fbefd6;
  --tp-honey-ink: #7a5a1e;

  /* Flat status tags. */
  --tp-ok: #7f9a7b;    --tp-ok-soft: #eef3ec;     /* available */
  --tp-new: #b02566;   --tp-new-soft: #f8e4ee;    /* just arrived / new */
  --tp-soon: #b7791f;  --tp-soon-soft: #fbefd6;   /* coming soon */
  --tp-sold: #5f5048;  --tp-sold-soft: #efe7dd;   /* adopted / sold */

  /* Kept for compatibility (subtle / inert — decoration removed). */
  --tp-grad-hero: linear-gradient(180deg, #f8e4ee 0%, #f7f1e9 55%);
  --tp-grad-band: #fbf7f1;
  --tp-grad-mocha: #fbf7f1;
  --tp-grad-honey: #f8e4ee;
  --tp-paw-tex: none;
  --tp-paw-size: 0;
  --tp-stitch: 1px solid var(--tp-line);
  --tp-stitch-rasp: 1px solid var(--tp-line);

  --tp-s-1: .25rem; --tp-s-2: .5rem; --tp-s-3: .75rem; --tp-s-4: 1rem;
  --tp-s-5: 1.5rem; --tp-s-6: 2rem; --tp-s-7: 3rem; --tp-s-8: 4rem; --tp-s-9: 6rem;

  --tp-fs-mega: clamp(3rem, 8vw, 6rem);
  --tp-fs-num: clamp(2.2rem, 5vw, 3.4rem);
  --tp-lh-tight: 1.02; --tp-lh-snug: 1.2;
  --tp-ls-tight: -0.03em; --tp-ls-wide: .14em; --tp-ls-caps: .08em;

  --tp-shadow-sm: 0 3px 10px rgba(63, 52, 46, .06);
  --tp-ease-out: cubic-bezier(.22, .61, .36, 1);
  --tp-dur: .6s;
  --tp-stagger: 80ms;

  --tp-z-sticky-cta: 1015;
  --tp-z-lightbox: 1090;
}

/* ---------- Base ---------- */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
/* Belt-and-suspenders against stray horizontal scroll on mobile. `clip` (not
   `hidden`) contains any element that slightly exceeds the viewport WITHOUT
   turning the root into a scroll container, so the sticky header keeps working. */
html, body { overflow-x: clip; max-width: 100%; }
body {
  margin: 0;
  font-family: var(--tp-body);
  font-size: 1.0625rem;
  line-height: 1.65;
  color: var(--tp-ink);
  background: var(--tp-cream);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; }
a { color: var(--tp-raspberry-deep); text-decoration: none; }
a:hover { color: var(--tp-raspberry); }

h1, h2, h3, h4, .tp-display {
  font-family: var(--tp-display);
  color: var(--tp-mocha);
  font-weight: 800;
  line-height: 1.03;
  letter-spacing: -0.025em;
}
h1 { font-size: clamp(2.6rem, 6vw, 4.75rem); }
h2 { font-size: clamp(2rem, 4vw, 3.1rem); }
h3 { font-size: clamp(1.3rem, 2.2vw, 1.7rem); }

/* Eyebrow is now a small uppercase coral kicker (was a script font). */
.tp-eyebrow {
  font-family: var(--tp-body);
  color: var(--tp-raspberry);
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--tp-ls-caps);
  line-height: 1;
  display: inline-block;
  margin-bottom: .6rem;
}
.tp-kicker {
  font-family: var(--tp-body);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-weight: 700;
  font-size: .78rem;
  color: var(--tp-sage-deep);
}
.tp-lede { font-size: 1.12rem; color: var(--tp-mocha); max-width: 62ch; }
.text-raspberry { color: var(--tp-raspberry) !important; }
.bg-cream { background: var(--tp-cream) !important; }
.bg-cream-2 { background: var(--tp-cream-2) !important; }
.bg-blush { background: var(--tp-blush) !important; }
.bg-sage { background: var(--tp-sage) !important; }
.bg-mocha { background: var(--tp-mocha) !important; color: #f3e8df; }

/* ---------- Buttons ---------- */
.btn { font-family: var(--tp-body); font-weight: 700; border-radius: var(--tp-r-pill); padding: .7rem 1.5rem; transition: transform .2s var(--tp-ease), box-shadow .2s ease, background-color .2s ease; }
.btn:active { transform: translateY(1px); }
.btn-primary, .btn-tp {
  --bs-btn-bg: var(--tp-raspberry); --bs-btn-border-color: var(--tp-raspberry);
  --bs-btn-hover-bg: var(--tp-raspberry-deep); --bs-btn-hover-border-color: var(--tp-raspberry-deep);
  --bs-btn-active-bg: var(--tp-raspberry-deep); --bs-btn-active-border-color: var(--tp-raspberry-deep);
  --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff;
  background: var(--tp-raspberry); border: 2px solid var(--tp-raspberry); color: #fff;
  box-shadow: 0 8px 20px rgba(214, 51, 127, .22);
}
.btn-primary:hover, .btn-tp:hover { background: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-deep); color: #fff; box-shadow: var(--tp-shadow-lift); }
.btn-outline-primary, .btn-tp-ghost {
  background: transparent; border: 2px solid var(--tp-mocha); color: var(--tp-mocha);
  --bs-btn-color: var(--tp-mocha); --bs-btn-border-color: var(--tp-mocha);
  --bs-btn-hover-bg: var(--tp-mocha); --bs-btn-hover-border-color: var(--tp-mocha); --bs-btn-hover-color: #fff;
}
.btn-outline-primary:hover, .btn-tp-ghost:hover { background: var(--tp-mocha); color: #fff; }
.btn-black, .btn-dark { background: var(--tp-mocha-deep); border-color: var(--tp-mocha-deep); color: #fff; }
.btn-lg { padding: .95rem 2rem; font-size: 1.05rem; }

/* ---------- Top utility bar (light) ---------- */
.tp-topbar { background: var(--tp-cream-2); color: var(--tp-muted); font-size: .86rem; border-bottom: 1px solid var(--tp-line); }
.tp-topbar a { color: var(--tp-ink); }
.tp-topbar a:hover { color: var(--tp-raspberry); }
.tp-topbar__inner { display: flex; flex-wrap: wrap; gap: .4rem 1.4rem; align-items: center; justify-content: space-between; padding: .5rem 0; }
.tp-topbar .tp-ico { color: var(--tp-raspberry); }

/* ---------- Header / nav ---------- */
.tp-header { position: sticky; top: 0; z-index: 1020; background: rgba(252, 251, 248, .9); backdrop-filter: saturate(1.2) blur(8px); border-bottom: 1px solid var(--tp-line); }
/* Desktop: burger + logo grouped left, actions pushed right (logo is now a
   direct child of __inner so it can be re-centered on mobile). */
.tp-header__inner { display: flex; align-items: center; gap: 1.1rem; padding: .6rem 0; }
.tp-logo { flex: 0 0 auto; line-height: 0; }
.tp-logo img { height: 52px; width: auto; max-width: none; }
.tp-logo .tp-wordmark { font-family: var(--tp-display); font-weight: 800; color: var(--tp-mocha); font-size: 1.6rem; letter-spacing: -.02em; }
.tp-header__lead { display: flex; align-items: center; gap: 1.1rem; }
.tp-header__actions { display: flex; align-items: center; gap: .6rem; margin-left: auto; }
/* Square icon-only hamburger (no "Menu" label). */
.tp-burger {
  flex: 0 0 auto; width: 46px; height: 46px; padding: 0;
  border: 1px solid var(--tp-line); background: #fff; color: var(--tp-mocha);
  border-radius: var(--tp-r-pill); display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.2rem; cursor: pointer;
  transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}
.tp-burger:hover { border-color: var(--tp-raspberry); color: var(--tp-raspberry); }
/* Cart + call are square, icon-centered buttons (override .btn padding so the
   glyph sits dead-center horizontally AND vertically) — matches the burger. */
.tp-header__call, .tp-cart-link {
  flex: 0 0 auto; width: 46px; height: 46px; min-width: 46px; padding: 0;
  display: inline-flex; align-items: center; justify-content: center; line-height: 1;
}
.tp-header__call > i, .tp-cart-link > i { line-height: 1; }
/* Call button lives in the masthead on mobile only — on desktop the phone
   number is shown in the top utility bar instead. (Rule comes AFTER the shared
   sizing rule so display:none wins on desktop.) */
.tp-header__call { display: none; }
/* Mobile/tablet (<992px): 3-zone masthead — burger left · logo centered · call+cart right.
   "Browse Puppies" moves into the offcanvas menu, keeping the bar clean. */
@media (max-width: 991.98px) {
  /* Equal side columns (minmax(0,1fr) — NOT 1fr, whose auto minimum would let the
     wider actions column push the logo off-center) keep the logo truly centered. */
  .tp-header__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .5rem; }
  .tp-header__lead { justify-self: start; }
  .tp-logo { justify-self: center; }
  .tp-header__actions { justify-self: end; margin-left: 0; gap: .4rem; }
  .tp-header__browse { display: none; }
  .tp-header__call { display: inline-flex; }
}
@media (max-width: 575px) { .tp-logo img { height: 42px; } }

/* ---------- Offcanvas menu (desktop + mobile) ---------- */
.tp-offcanvas { width: min(380px, 90vw) !important; background: var(--tp-cream); }
.tp-offcanvas .offcanvas-header { display: flex; align-items: center; justify-content: space-between; background: #fff; border-bottom: 1px solid var(--tp-line); padding: 1rem 1.4rem; }
.tp-offcanvas__close { flex: 0 0 auto; margin-left: auto; }
.tp-offcanvas__brand { line-height: 0; }
.tp-offcanvas__brand .tp-logo img { height: 44px; }
.tp-offcanvas__close { border: 1px solid var(--tp-line); background: #fff; color: var(--tp-mocha); width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: 1.05rem; }
.tp-offcanvas__close:hover { border-color: var(--tp-raspberry); color: var(--tp-raspberry); }
.tp-offcanvas .offcanvas-body { padding: 1.2rem 1.4rem 2rem; display: flex; flex-direction: column; }
.tp-offcanvas__nav ul { list-style: none; margin: 0; padding: 0; }
.tp-offcanvas__nav li { margin: 0; }
.tp-offcanvas__nav a { display: flex; align-items: center; justify-content: space-between; padding: .95rem .25rem; border-bottom: 1px solid var(--tp-line); color: var(--tp-mocha); font-family: var(--tp-display); font-weight: 700; font-size: 1.3rem; letter-spacing: -.01em; text-decoration: none; }
.tp-offcanvas__nav a:hover, .tp-offcanvas__nav .current-menu-item > a { color: var(--tp-raspberry); }
.tp-offcanvas__nav .sub-menu { padding-left: .8rem; }
.tp-offcanvas__nav .sub-menu a { font-family: var(--tp-body); font-size: 1rem; font-weight: 600; }
.tp-offcanvas__cta { margin-top: 1.5rem; }
.tp-offcanvas__meta { margin-top: 1.6rem; padding-top: 1.4rem; border-top: 1px solid var(--tp-line); display: grid; gap: .6rem; }
.tp-offcanvas__meta i { color: var(--tp-raspberry); width: 1.1rem; }
.tp-offcanvas__phone { font-family: var(--tp-display); font-weight: 800; font-size: 1.25rem; color: var(--tp-mocha); display: inline-flex; align-items: center; gap: .55rem; }
.tp-offcanvas__addr, .tp-offcanvas__hours { display: flex; align-items: flex-start; gap: .55rem; margin: 0; color: var(--tp-muted); font-size: .95rem; }
.tp-offcanvas__social { display: flex; gap: .5rem; margin-top: .4rem; }
.tp-offcanvas__social a { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--tp-line); background: #fff; color: var(--tp-mocha); display: inline-flex; align-items: center; justify-content: center; }
.tp-offcanvas__social a:hover { background: var(--tp-raspberry); color: #fff; border-color: var(--tp-raspberry); }

/* ---------- Layout helpers ---------- */
.tp-section { padding: clamp(3rem, 7vw, 6rem) 0; }
.tp-section--tight { padding: clamp(2rem, 4vw, 3.5rem) 0; }
.tp-container { width: min(1200px, 92%); margin-inline: auto; }
.tp-center { text-align: center; }
.tp-bone { display: inline-flex; align-items: center; gap: .6rem; color: var(--tp-sage-deep); }
.tp-bone::before, .tp-bone::after { content: ""; width: 46px; height: 1px; background: var(--tp-line); }

/* ---------- Photo frame (crisp square with a hairline keyline) ---------- */
.tp-arch { border-radius: var(--tp-r-sm); overflow: hidden; background: var(--tp-line); box-shadow: none; border: 1px solid var(--tp-line); }
.tp-arch--full { border-radius: var(--tp-r-sm); }
.tp-arch img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Hero ---------- */
.tp-hero { position: relative; background: var(--tp-grad-hero); overflow: hidden; }
.tp-hero__grid { display: grid; gap: 2rem; align-items: center; padding: clamp(2.5rem, 6vw, 5rem) 0; }
.tp-hero__title { margin: .2rem 0 1rem; }
.tp-hero__cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.4rem; }
.tp-hero__photo { position: relative; aspect-ratio: 4/5; max-width: 460px; margin-inline: auto; }
.tp-hero__tag { position: absolute; left: 50%; bottom: -18px; transform: translateX(-50%); }
@media (min-width: 992px) { .tp-hero__grid { grid-template-columns: 1.05fr .95fr; } }

/* ---------- Steps ---------- */
.tp-steps { display: grid; gap: 1.25rem; }
@media (min-width: 768px) { .tp-steps { grid-template-columns: repeat(4, 1fr); } }
.tp-step { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); padding: 2rem 1.4rem; text-align: center; box-shadow: var(--tp-shadow); }
.tp-step__ico { width: 64px; height: 64px; margin: 0 auto 1rem; color: var(--tp-raspberry); }
.tp-step__ico svg, .tp-step__ico i { width: 100%; height: 100%; font-size: 2.4rem; }
.tp-step h3 { color: var(--tp-mocha); }

/* ==========================================================================
   Puppy card — light, photo-led, crisp square photo
   ========================================================================== */
.tp-puppy-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.tp-tag { display: flex; flex-direction: column; background: var(--tp-surface, #fff); border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); overflow: hidden; transition: transform .2s var(--tp-ease), box-shadow .2s ease; }
.tp-tag:hover { transform: translateY(-3px); box-shadow: var(--tp-shadow-lift); }
.tp-tag__photo { position: relative; aspect-ratio: 1/1; overflow: hidden; background: var(--tp-line); border-bottom: 1px solid var(--tp-line); }
.tp-tag__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--tp-ease); }
.tp-tag:hover .tp-tag__photo img { transform: scale(1.04); }
/* legacy flag (kept minimal; the card renders .tp-badge now) */
.tp-tag__flag { position: absolute; top: .7rem; left: .7rem; background: #fff; color: var(--tp-ink); font-weight: 700; font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; padding: .28rem .6rem; border-radius: var(--tp-r-pill); box-shadow: var(--tp-shadow-sm); }
.tp-tag__flag--sold { background: var(--tp-ink); color: #fff; }
.tp-tag__panel { position: relative; background: transparent; color: var(--tp-ink); padding: 1.05rem 1.1rem 1.15rem; display: flex; flex-direction: column; }
.tp-tag__panel::before, .tp-tag__panel::after { content: none; }
.tp-tag__eyebrow { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--tp-muted); font-weight: 700; }
.tp-tag__meta { font-size: .9rem; color: var(--tp-muted); margin: .1rem 0 .35rem; }
.tp-tag__breed { font-family: var(--tp-display); font-weight: 800; font-size: 1.35rem; color: var(--tp-ink); line-height: 1.05; margin: 0 0 .3rem; letter-spacing: -.02em; }
.tp-tag__price { font-family: var(--tp-display); font-size: 1.4rem; color: var(--tp-ink); font-weight: 800; }
.tp-tag__price small { display: block; font-family: var(--tp-body); font-size: .72rem; letter-spacing: .02em; text-transform: none; color: var(--tp-muted); font-weight: 600; }
.tp-tag__actions { display: grid; gap: .5rem; margin-top: .9rem; }
.tp-tag__actions .btn { padding: .6rem 1rem; font-size: .92rem; }
.tp-tag__actions .btn-outline-light { border: 1.5px solid var(--tp-line); color: var(--tp-ink); }
.tp-tag__actions .btn-outline-light:hover { background: var(--tp-ink); color: #fff; border-color: var(--tp-ink); }

/* ---------- Shop / filter sidebar ---------- */
.tp-shop { display: grid; gap: 2rem; }
@media (min-width: 992px) { .tp-shop { grid-template-columns: 280px 1fr; } }
.tp-filters { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); padding: 1.4rem; align-self: start; position: sticky; top: 100px; }
.tp-filters h3, .tp-filters .widgettitle { font-size: 1rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tp-raspberry); margin: 1rem 0 .5rem; }
.tp-result-count { color: var(--tp-raspberry); font-weight: 700; }

/* ---------- Single puppy ---------- */
.tp-single { display: grid; gap: 2rem; }
@media (min-width: 992px) { .tp-single { grid-template-columns: 1.1fr .9fr; align-items: start; } }
.tp-pet-info { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); overflow: hidden; box-shadow: var(--tp-shadow); }
.tp-pet-info__head { background: var(--tp-blush); padding: .9rem 1.2rem; font-family: var(--tp-display); font-weight: 700; color: var(--tp-mocha); font-size: 1.2rem; }
.tp-pet-info table, .tp-pet-info dl { width: 100%; margin: 0; }
.tp-pet-info tr, .tp-pet-info .tp-row { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 1.2rem; border-top: 1px solid var(--tp-line); }
.tp-pet-info .tp-row dt, .tp-pet-info th { color: var(--tp-mocha); font-weight: 700; text-align: left; }
.tp-price-lg { font-family: var(--tp-display); font-size: clamp(2rem, 4vw, 2.8rem); color: var(--tp-raspberry); font-weight: 700; }

/* ---------- Reviews ---------- */
.tp-review { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); padding: 1.6rem; box-shadow: var(--tp-shadow); height: 100%; }
.tp-stars { color: var(--tp-honey-deep); letter-spacing: .1em; }
.tp-review__name { font-family: var(--tp-display); color: var(--tp-mocha); font-weight: 700; }

/* ---------- Forms (native + Gravity) ---------- */
.form-control, .form-select { border: 1px solid var(--tp-line); border-radius: 12px; padding: .7rem .9rem; background: #fff; }
.form-control:focus, .form-select:focus { border-color: var(--tp-raspberry); box-shadow: 0 0 0 .2rem rgba(214, 51, 127, .18); }
.form-label { font-weight: 700; color: var(--tp-mocha); }
.tp-form-card { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); padding: clamp(1.4rem, 3vw, 2rem); box-shadow: var(--tp-shadow); }
.gform_wrapper .gform_title { font-family: var(--tp-display); color: var(--tp-mocha); }

/* ---------- FAB help ---------- */
.fab-help { box-shadow: var(--tp-shadow-lift) !important; }

/* ---------- Footer (light) ---------- */
.tp-footer { background: var(--tp-cream-2); color: var(--tp-muted); padding-top: clamp(3rem, 6vw, 4.5rem); border-top: 1px solid var(--tp-line); }
.tp-footer a { color: var(--tp-ink); }
.tp-footer a:hover { color: var(--tp-raspberry); }
.tp-footer h4 { color: var(--tp-ink); font-family: var(--tp-display); font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em; margin-bottom: 1rem; }
.tp-footer__cols { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 576px) { .tp-footer__cols { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .tp-footer__cols { grid-template-columns: 1.4fr 1fr 1fr 1.2fr; } }
.tp-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.tp-hours { list-style: none; margin: 0; padding: 0; }
.tp-hours li { display: flex; justify-content: space-between; gap: 1rem; padding: .2rem 0; border-bottom: 1px solid var(--tp-line); }
.tp-hours .is-today { color: var(--tp-raspberry); font-weight: 700; }
.tp-social a { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: #fff; border: 1px solid var(--tp-line); margin-right: .5rem; color: var(--tp-ink); }
.tp-social a:hover { background: var(--tp-raspberry); color: #fff; border-color: var(--tp-raspberry); }
.tp-footer__bar { border-top: 1px solid var(--tp-line); margin-top: 2.5rem; padding: 1.2rem 0; font-size: .88rem; color: var(--tp-muted); }
.tp-footer__craft { text-align: center; padding: 0 0 1.6rem; font-size: .82rem; color: var(--tp-muted); }
.tp-footer__craft a { color: var(--tp-raspberry); font-weight: 700; }
.tp-footer__craft a:hover { color: var(--tp-raspberry-deep); }
.tp-footer__craft span[aria-hidden] { margin: 0 .1rem; }

/* ---------- Cross-page banner header ---------- */
.tp-page-head { background: var(--tp-cream-2); padding: clamp(2.4rem, 5vw, 3.8rem) 0; border-bottom: 1px solid var(--tp-line); }
.tp-breadcrumbs, .tp-breadcrumbs a { color: var(--tp-muted); font-size: .9rem; }

/* ---------- Gallery / cards generic ---------- */
.tp-card { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); overflow: hidden; box-shadow: var(--tp-shadow); transition: transform .25s var(--tp-ease), box-shadow .25s ease; }
.tp-card:hover { transform: translateY(-4px); box-shadow: var(--tp-shadow-lift); }

/* ---------- Motion / a11y ----------
   Reveal is progressive enhancement: content is visible by default and only
   hidden once JS confirms IntersectionObserver support (html.tp-js). If JS or
   IO is unavailable, nothing is ever stuck invisible. */
.tp-reveal { opacity: 1; transform: none; }
html.tp-js .tp-reveal { opacity: 0; transform: translateY(16px); transition: opacity .7s ease, transform .7s var(--tp-ease); }
html.tp-js .tp-reveal.is-in { opacity: 1; transform: none; }
:focus-visible { outline: 3px solid var(--tp-raspberry); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  html.tp-js .tp-reveal { opacity: 1; transform: none; }
  .tp-tag:hover { transform: none; }
}

/* ---------- WooCommerce notices (error / info / success) ----------
   The ported notice templates render: a FontAwesome icon + a flex body
   (`.d-flex.align-items-center.gap-3`). We give each type its own tone —
   error = warm red, info = brand raspberry, success = sage green — as a soft
   tinted card with a colored left rule and matching icon. */
.woocommerce-notices-wrapper:empty { display: none; margin: 0; }
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	display: flex; align-items: center; gap: .85rem;
	margin: 0 0 1.1rem; padding: .95rem 1.15rem;
	border: 1px solid var(--tp-line); border-left-width: 4px;
	border-radius: var(--tp-r-md); background: #fff; box-shadow: var(--tp-shadow-sm);
	font-family: var(--tp-body); font-size: 1rem; line-height: 1.45; color: var(--tp-ink); list-style: none;
}
.woocommerce-message > i, .woocommerce-info > i, .woocommerce-error > i { flex: 0 0 auto; font-size: 1.2rem; line-height: 1; }
.woocommerce-error ul, .woocommerce-error li, .woocommerce-message ul, .woocommerce-info ul { margin: 0; padding: 0; list-style: none; }
.woocommerce-message a, .woocommerce-info a, .woocommerce-error a { color: var(--tp-raspberry-deep); font-weight: 600; text-decoration: underline; }
.woocommerce-message a:hover, .woocommerce-info a:hover, .woocommerce-error a:hover { color: var(--tp-raspberry-deep); }
/* A trailing button (View cart / Continue) tucks to the right. */
.woocommerce-message .button, .woocommerce-info .button { margin-left: auto; flex: 0 0 auto; }
/* Error — warm red */
.woocommerce-error { border-left-color: #c0392b; background: #fdeceb; }
.woocommerce-error > i { color: #c0392b; }
/* Info — brand raspberry */
.woocommerce-info { border-left-color: var(--tp-raspberry); background: var(--tp-raspberry-soft); }
.woocommerce-info > i { color: var(--tp-raspberry); }
/* Success — sage green (icon darkened for AA contrast on the pale wash) */
.woocommerce-message { border-left-color: var(--tp-sage-deep); background: var(--tp-ok-soft); }
.woocommerce-message > i { color: #5c7357; }
/* Block-based notices (cart/checkout blocks), tinted to match. */
.wc-block-components-notice-banner { border-radius: var(--tp-r-md); font-family: var(--tp-body); }
.wc-block-components-notice-banner.is-error { border-color: #c0392b; background: #fdeceb; }
.wc-block-components-notice-banner.is-info { border-color: var(--tp-raspberry); background: var(--tp-raspberry-soft); }
.wc-block-components-notice-banner.is-success { border-color: var(--tp-sage-deep); background: var(--tp-ok-soft); }

.woocommerce ul.products { list-style: none; padding: 0; }
.star-rating { color: var(--tp-honey-deep); }
mark { background: var(--tp-raspberry-soft); color: var(--tp-mocha-deep); }

/* ==========================================================================
   Support for ported "Puppygram" engine markup (single product, gallery,
   partials) — custom utility classes the old theme's CSS provided, re-skinned
   in the Warm Boutique palette, plus polish for the wc-unified-km single page.
   ========================================================================== */

/* Object-fit + neutral fills used across galleries, cards, thumbnails. */
.of-cover { -o-object-fit: cover; object-fit: cover; object-position: 50% 50%; }
.of-contain { object-fit: contain; }
.bg-gray, .bg-grey { background: #efe7dd; }

/* Legacy Bootstrap-4-style contextual classes still used by ported markup. */
.text-bg-black { background: var(--tp-mocha-deep) !important; color: #fff !important; }
.btn-black { background: var(--tp-mocha-deep); border: 2px solid var(--tp-mocha-deep); color: #fff; }
.btn-black:hover { background: #2c2420; border-color: #2c2420; color: #fff; }
.btn-outline-black { background: transparent; border: 2px solid var(--tp-mocha-deep); color: var(--tp-mocha-deep); }
.btn-outline-black:hover { background: var(--tp-mocha-deep); color: #fff; }
.border-black { border-color: var(--tp-line) !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* ---------- Single product (wc-unified-km engine) ---------- */
.single-product .container.py-5 { width: min(1200px, 92%); }
/* Remove the redundant default WooCommerce add-to-cart; the real CTA is the
   styled "Adopt / Reserve Me" button that opens the #puppy-checkout offcanvas. */
.single-product .summary form.cart,
.single-product .entry-summary > form.cart { display: none; }

/* Gallery (Bootstrap carousel) — rounded, soft frame, branded controls. */
.single-product #gallery,
.single-product .main-img { border-radius: var(--tp-r-lg); overflow: hidden; }
.single-product .border.rounded-1.overflow-hidden { border: 1px solid var(--tp-line) !important; border-radius: var(--tp-r-lg) !important; box-shadow: var(--tp-shadow); }
.single-product .carousel-item img { width: 100%; height: 100%; object-fit: cover; }
.carousel-indicators [data-bs-target] { width: 10px; height: 10px; border-radius: 50%; border: 0; background: #fff; opacity: .6; }
.carousel-indicators .active { background: var(--tp-raspberry); opacity: 1; }
.carousel-control-prev-icon, .carousel-control-next-icon { background-color: rgba(63,52,46,.55); border-radius: 50%; background-size: 55%; padding: 1.2rem; }

/* Engine title block (woo-product/title.php). */
.single-product .summary { color: var(--tp-ink); }

/* Pet Information table (tabs-pet.php) — align with the Warm Boutique card. */
.single-product .table, .single-product table.pet-info { border-radius: var(--tp-r-md); overflow: hidden; border: 1px solid var(--tp-line); }

/* Breed-info + related sections below the fold. */
.product-content-bottom { background: var(--tp-cream); }
.product-content-bottom h2, .product-content-bottom h3 { color: var(--tp-mocha); }

/* ---------- Gravity Forms (Pet Inquiry / Contact) ---------- */
.gform_wrapper .gform_title { font-family: var(--tp-display); color: var(--tp-mocha); }
.gform_wrapper .gfield_label { font-weight: 700; color: var(--tp-mocha); }
.gform_wrapper input[type=text], .gform_wrapper input[type=email], .gform_wrapper input[type=tel],
.gform_wrapper input[type=url], .gform_wrapper input[type=number], .gform_wrapper textarea,
.gform_wrapper select, .gform-theme--framework input, .gform-theme--framework select, .gform-theme--framework textarea {
  border: 1px solid var(--tp-line) !important; border-radius: 12px !important; padding: .7rem .9rem !important; background: #fff !important; font-family: var(--tp-body) !important;
}
.gform_wrapper input:focus, .gform_wrapper textarea:focus, .gform_wrapper select:focus {
  border-color: var(--tp-raspberry) !important; box-shadow: 0 0 0 .2rem rgba(214,51,127,.18) !important; outline: 0;
}
.gform_wrapper .gform_footer .gform_button, .gform_wrapper .gform_button {
  background: var(--tp-raspberry) !important; border: 2px solid var(--tp-raspberry) !important; color: #fff !important;
  border-radius: var(--tp-r-pill) !important; padding: .8rem 2rem !important; font-weight: 700 !important;
}
.gform_wrapper .gform_footer .gform_button:hover { background: var(--tp-raspberry-deep) !important; border-color: var(--tp-raspberry-deep) !important; }
.gform_required_legend { color: var(--tp-muted); }
.no_gform_border .gform_wrapper, .no_gform_border form { padding: 0; border: 0; margin-bottom: 0; }

/* The "Click here for more information" inquiry banner sits flush on the form card. */
.single-product .col-lg > *:first-child img { border-radius: var(--tp-r-lg) var(--tp-r-lg) 0 0; }

/* ---------- Bootstrap nav-pills / tabs (My Account nav, deposit Full/Finance tabs) ---------- */
/* Bootstrap compiles the active-pill colour to #0d6efd, not the runtime --bs-primary. */
.nav-pills { --bs-nav-pills-link-active-bg: var(--tp-raspberry); --bs-nav-pills-link-active-color: #fff; }
.nav-pills .nav-link { color: var(--tp-mocha); font-weight: 600; border-radius: var(--tp-r-pill); }
.nav-pills .nav-link.active { background-color: var(--tp-raspberry) !important; color: #fff !important; }
.nav-tabs { --bs-nav-tabs-link-active-color: var(--tp-raspberry); border-bottom-color: var(--tp-line); }
.nav-tabs .nav-link.active { color: var(--tp-raspberry); border-color: var(--tp-line) var(--tp-line) #fff; }
/* Selected btn-check pills (shipping method, deposit toggle, filters) — Bootstrap
   compiles the outline active-bg to a literal #0d6efd, so force it back to brand. */
.btn-check:checked + .btn-outline-primary,
.btn-check:checked + .btn-tp-ghost,
.btn-check:active + .btn-outline-primary { background-color: var(--tp-raspberry); border-color: var(--tp-raspberry); color: #fff; }

/* WooCommerce My Account niceties. */
.woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; }
.woocommerce-MyAccount-content { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); padding: clamp(1.2rem, 3vw, 2rem); box-shadow: var(--tp-shadow); }
.woocommerce table.shop_table { border-radius: var(--tp-r-md); overflow: hidden; border-color: var(--tp-line); }
.woocommerce .button, .woocommerce a.button, .woocommerce button.button { background: var(--tp-raspberry); color: #fff; border-radius: var(--tp-r-pill); font-weight: 700; border: 2px solid var(--tp-raspberry); }
.woocommerce .button:hover, .woocommerce a.button:hover, .woocommerce button.button:hover { background: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-deep); color: #fff; }

/* ==========================================================================
   Gravity Forms — "Fresh Modern" skin (GF 2.7 gravity-theme / no-framework)
   ========================================================================== */
.gform_wrapper .gform_validation_container,
.gform_wrapper .gfield--type-honeypot { position: absolute !important; left: -9999px !important; height: 1px !important; overflow: hidden !important; }
.gform_wrapper form { margin: 0; }
.gform_wrapper .gform_fields { display: grid; grid-template-columns: 1fr; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.gform_wrapper .gfield { margin: 0; }
.gform_wrapper .gfield_label, .gform_wrapper .gform-field-label { display: block; font-family: var(--tp-body); font-weight: 700; color: var(--tp-mocha); font-size: .95rem; margin: 0 0 .35rem; }
.gform_wrapper .gform-field-label--type-sub { font-weight: 500; color: var(--tp-muted); font-size: .8rem; margin: .3rem 0 0; }
.gform_wrapper .gfield_required, .gform_wrapper .gfield_required_text { color: var(--tp-raspberry); font-weight: 600; margin-left: .15rem; }
.gform_wrapper input[type=text],
.gform_wrapper input[type=email],
.gform_wrapper input[type=tel],
.gform_wrapper input[type=url],
.gform_wrapper input[type=number],
.gform_wrapper input[type=password],
.gform_wrapper textarea,
.gform_wrapper select {
	width: 100% !important; box-sizing: border-box;
	border: 1px solid var(--tp-line) !important; border-radius: var(--tp-r-md) !important;
	padding: .7rem .9rem !important; background: #fff !important;
	font-family: var(--tp-body) !important; font-size: 1rem !important; color: var(--tp-ink) !important; line-height: 1.4 !important;
}
.gform_wrapper input:focus, .gform_wrapper textarea:focus, .gform_wrapper select:focus {
	border-color: var(--tp-raspberry) !important; box-shadow: 0 0 0 .2rem rgba(214, 51, 127, .15) !important; outline: 0 !important;
}
.gform_wrapper textarea { min-height: 120px; }
.gform_wrapper .ginput_container { margin-top: 0; }
.gform_wrapper .ginput_container--name { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.gform_wrapper .ginput_container--name > span { display: block; }
@media (max-width: 480px) { .gform_wrapper .ginput_container--name { grid-template-columns: 1fr; } }
.gform_wrapper .gform_footer, .gform_wrapper .gform-footer { margin: 1.2rem 0 0; padding: 0; }
.gform_wrapper .gform_footer .gform_button,
.gform_wrapper .gform-footer button,
.gform_wrapper .gform_button {
	background: var(--tp-raspberry) !important; border: 2px solid var(--tp-raspberry) !important; color: #fff !important;
	border-radius: var(--tp-r-pill) !important; padding: .85rem 2.2rem !important; font-family: var(--tp-body) !important; font-weight: 700 !important;
	font-size: 1rem !important; cursor: pointer; box-shadow: 0 8px 20px rgba(214, 51, 127, .22); width: auto;
}
.gform_wrapper .gform_footer .gform_button:hover, .gform_wrapper .gform-footer button:hover, .gform_wrapper .gform_button:hover { background: var(--tp-raspberry-deep) !important; border-color: var(--tp-raspberry-deep) !important; }
.gform_wrapper .gfield_error input, .gform_wrapper .gfield_error textarea, .gform_wrapper .gfield_error select { border-color: #c0392b !important; }
.gform_wrapper .gfield_validation_message, .gform_wrapper .validation_message, .gform_wrapper .gform_validation_errors { color: #c0392b; font-size: .85rem; margin-top: .3rem; }

/* ---------- WooCommerce add-to-cart form (single puppy reserve) ---------- */
.tp-addtocart form.cart { margin: 0; }
.tp-addtocart .quantity { display: inline-flex; margin: 0 0 .8rem; }
.tp-addtocart .quantity input.qty { width: 84px; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); padding: .6rem; text-align: center; font-weight: 700; }
.tp-addtocart .variations select, .tp-addtocart select { width: 100%; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); padding: .7rem .9rem; background: #fff; margin-bottom: .6rem; }
.tp-addtocart .single_add_to_cart_button, .tp-addtocart button[type="submit"] {
	display: block; width: 100%; background: var(--tp-raspberry); border: 2px solid var(--tp-raspberry); color: #fff;
	border-radius: var(--tp-r-pill); padding: .95rem 2rem; font-family: var(--tp-body); font-weight: 700; font-size: 1.05rem;
	cursor: pointer; box-shadow: 0 8px 20px rgba(214, 51, 127, .22); text-align: center;
}
.tp-addtocart .single_add_to_cart_button:hover, .tp-addtocart button[type="submit"]:hover { background: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-deep); color: #fff; }
.tp-reserve-card__finance { display: flex; align-items: center; gap: .5rem; margin: .9rem 0 0; color: var(--tp-muted); font-weight: 600; font-size: .92rem; }
.tp-reserve-card__finance i { color: var(--tp-raspberry); }
.tp-pet-rail__finance { margin-top: .5rem; font-weight: 600; }
.tp-pet-rail__finance .tp-finance-line { color: var(--tp-muted); }
.tp-pet-rail__finance .tp-finance-line strong { color: var(--tp-ink); }
.tp-pet-rail__finance .tp-finance-line i { color: var(--tp-raspberry); }

/* ==========================================================================
   Checkout — "Puppy Reservation" (Fresh Modern warm skin over the ported
   Bootstrap checkout markup: order summary rail + billing/shipping + payment).
   Everything is scoped to `.woocommerce-checkout` so it never leaks elsewhere.
   ========================================================================== */

/* Give the reservation room to breathe (the page template constrains to 820px). */
.woocommerce-checkout .tp-content { max-width: 1140px !important; }

/* Intro */
.woocommerce-checkout .tp-content > h2 { font-family: var(--tp-display); font-weight: 700; font-size: clamp(1.9rem, 4vw, 2.6rem); text-align: center; margin: 0 0 .4rem; }
.woocommerce-checkout .tp-content > h2 + p { text-align: center; color: var(--tp-muted); max-width: 48ch; margin: 0 auto 2.2rem; }

/* Two-column shell — order summary (left) sticks while the form scrolls. */
.woocommerce-checkout #customer_details { row-gap: 1.5rem; }
@media (min-width: 992px) { .woocommerce-checkout #order_review { position: sticky; top: 1.5rem; } }

/* Soften every bootstrap-bordered box into a warm card. */
.woocommerce-checkout .border-gray,
.woocommerce-checkout .border-black { border-color: var(--tp-line) !important; border-radius: var(--tp-r-lg); box-shadow: var(--tp-shadow-sm); }

/* Section headings (Billing Details / Payment carry `.text-primary`; Summary doesn't). */
.woocommerce-checkout h3.text-primary { font-family: var(--tp-display); font-weight: 700; font-size: 1.3rem; margin: 0 0 1.1rem; }
.woocommerce-checkout #order_review_heading:not(.text-primary) { font-family: var(--tp-display); font-weight: 700; font-size: 1.4rem; color: var(--tp-mocha); margin: .3rem 0 1rem; }

/* --- Order summary card --- */
.woocommerce-checkout .woocommerce-checkout-review-order-table { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); box-shadow: var(--tp-shadow-sm); padding: clamp(1.1rem, 2.5vw, 1.5rem); }
.woocommerce-checkout .woocommerce-checkout-review-order-table .card { border-radius: var(--tp-r-md); overflow: hidden; }
.woocommerce-checkout .shop_table { width: 100%; border-collapse: collapse; font-size: .95rem; margin: 0; }
.woocommerce-checkout .shop_table th, .woocommerce-checkout .shop_table td { padding: .6rem 0; border-bottom: 1px solid var(--tp-line); vertical-align: top; text-align: left; }
.woocommerce-checkout .shop_table td { text-align: right; white-space: nowrap; }
.woocommerce-checkout .shop_table thead th { text-transform: uppercase; letter-spacing: .05em; font-size: .7rem; font-weight: 700; color: var(--tp-mocha); }
.woocommerce-checkout .shop_table .remove { color: var(--tp-muted); }
.woocommerce-checkout .shop_table .remove:hover { color: #c0392b; }
.woocommerce-checkout .shop_table .order-total th, .woocommerce-checkout .shop_table .order-total td { font-family: var(--tp-display); font-size: 1.2rem; border-bottom: 0; padding-top: .8rem; }
/* Pay-today (reservation fee) pops; balance-due reads quiet. */
.woocommerce-checkout .shop_table .order-paid th, .woocommerce-checkout .shop_table .order-paid td { color: var(--tp-raspberry-deep); font-weight: 700; border-bottom: 0; }
.woocommerce-checkout .shop_table .order-remaining th, .woocommerce-checkout .shop_table .order-remaining td { color: var(--tp-mocha); border-bottom: 0; }
.woocommerce-checkout .shop_table .deposit-buttons th { padding: .4rem 0 0; border-bottom: 0; }
.woocommerce-checkout .btn-group[role="group"] { display: flex; gap: .5rem; }
.woocommerce-checkout #basic-wc-deposits-options-form .pt-3 p { font-size: .8rem; line-height: 1.55; color: var(--tp-muted); }

/* --- Billing / shipping fields --- */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.woocommerce-checkout .form-row-wide, .woocommerce-checkout .form-row-full { grid-column: 1 / -1; }
.woocommerce-checkout .form-row-first { grid-column: 1; }
.woocommerce-checkout .form-row-last { grid-column: 2; }
.woocommerce-checkout .form-row { margin-bottom: .95rem; }
.woocommerce-checkout .form-label { font-weight: 600; font-size: .9rem; color: var(--tp-ink); margin-bottom: .3rem; }
.woocommerce-checkout .required { color: var(--tp-raspberry); border: 0; }
.woocommerce-checkout .optional { color: var(--tp-muted); }
.woocommerce-checkout .form-control:focus { border-color: var(--tp-raspberry); box-shadow: 0 0 0 .2rem rgba(214, 51, 127, .15); }
.woocommerce-checkout #ship-to-different-address { display: flex; align-items: center; gap: .5rem; margin: 0; font-weight: 700; }
@media (max-width: 575px) {
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
	.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }
	.woocommerce-checkout .form-row-first, .woocommerce-checkout .form-row-last { grid-column: 1 / -1; }
}

/* --- Coupon + digital wallet --- */
.woocommerce-checkout .checkout_coupon { background: var(--tp-cream-2); }
.woocommerce-checkout #wc-square-wallet-divider { text-align: center; color: var(--tp-muted); font-weight: 700; letter-spacing: .12em; margin: 1.1rem 0; }

/* --- Payment --- */
.woocommerce-checkout .wc_payment_methods { list-style: none; margin: 0 0 1rem; padding: 0; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); overflow: hidden; }
.woocommerce-checkout .wc_payment_methods > li { padding: 1rem; margin: 0; }
.woocommerce-checkout .wc_payment_methods > li + li { border-top: 1px solid var(--tp-line); }
.woocommerce-checkout .wc_payment_methods label { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .4rem; font-weight: 700; margin: 0; }
.woocommerce-checkout .payment_box { background: var(--tp-cream-2); border-radius: var(--tp-r-md); padding: 1rem; margin-top: .85rem; font-size: .92rem; }
.woocommerce-checkout .payment_box p:last-child { margin-bottom: 0; }
.woocommerce-checkout #wc-square-credit-card-container { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); padding: .55rem .8rem; }
.woocommerce-checkout .woocommerce-privacy-policy-text p { font-size: .82rem; color: var(--tp-mocha); }
.woocommerce-checkout .place-order { margin-top: 1.1rem; }
.woocommerce-checkout #place_order { border-radius: var(--tp-r-pill); padding: 1rem 2rem; font-weight: 800; font-size: 1.1rem; box-shadow: 0 10px 24px rgba(214, 51, 127, .25); }
.woocommerce-checkout #place_order:hover { box-shadow: 0 12px 28px rgba(214, 51, 127, .32); }

/* ==========================================================================
   Cart — Fresh Modern warm skin over the ported WooCommerce cart markup
   (items table + sticky totals card). Scoped to `.woocommerce-cart`; commerce
   bits are further scoped under `.woocommerce` so they never touch the
   site-wide Gravity Form submit button (which also carries `.button`).
   ========================================================================== */
.woocommerce-cart .tp-content { max-width: 1140px !important; }
.woocommerce-cart .tp-content > p:empty { display: none; margin: 0; }

/* Two-column shell at desktop: items (left) + sticky totals (right). The
   `:has(.cart-collaterals)` guard keeps the empty-cart state ("Your cart is
   empty" + Return to shop) in normal block flow instead of splitting columns. */
@media (min-width: 992px) {
	.woocommerce-cart .woocommerce:has(.cart-collaterals) { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 2rem; align-items: start; }
	.woocommerce-cart .woocommerce:has(.cart-collaterals) > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
	.woocommerce-cart .woocommerce-cart-form { grid-column: 1; min-width: 0; margin: 0; }
	.woocommerce-cart .cart-collaterals { grid-column: 2; position: sticky; top: 1.5rem; }
}
.woocommerce-cart .cart-collaterals { width: auto; }

/* Items table */
.woocommerce-cart .woocommerce-cart-form__contents { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); overflow: hidden; box-shadow: var(--tp-shadow-sm); }
.woocommerce-cart .woocommerce-cart-form__contents thead th { text-align: left; text-transform: uppercase; letter-spacing: .05em; font-size: .7rem; font-weight: 700; color: var(--tp-mocha); padding: .9rem 1rem; background: var(--tp-cream-2); border-bottom: 1px solid var(--tp-line); }
.woocommerce-cart .woocommerce-cart-form__contents td { padding: 1rem; border-bottom: 1px solid var(--tp-line); vertical-align: middle; }
.woocommerce-cart .product-thumbnail img { width: 84px; height: 84px; object-fit: cover; border-radius: var(--tp-r-md); border: 1px solid var(--tp-line); }
.woocommerce-cart td.product-name { font-weight: 700; color: var(--tp-ink); }
.woocommerce-cart td.product-name a { color: var(--tp-ink); text-decoration: none; }
.woocommerce-cart td.product-name a:hover { color: var(--tp-raspberry); }
.woocommerce-cart td.product-price, .woocommerce-cart td.product-subtotal { font-weight: 700; color: var(--tp-ink); white-space: nowrap; }
.woocommerce-cart td.product-remove { text-align: center; }
.woocommerce-cart td.product-remove .remove { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 999px; background: var(--tp-cream-2); color: var(--tp-muted); font-size: 1.15rem; line-height: 1; text-decoration: none; transition: background .15s ease, color .15s ease; }
.woocommerce-cart td.product-remove .remove:hover { background: #fdeceb; color: #c0392b; }
.woocommerce-cart .quantity input.qty { width: 72px; text-align: center; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); padding: .5rem; font-weight: 700; }

/* Actions row (coupon + update cart) */
.woocommerce-cart td.actions { padding: 1rem; background: var(--tp-cream-2); }
.woocommerce-cart td.actions .coupon { display: inline-flex; flex-wrap: wrap; gap: .5rem; }
.woocommerce-cart td.actions #coupon_code { border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); padding: .55rem .8rem; min-width: 160px; }
.woocommerce-cart td.actions [name="update_cart"] { float: right; }

/* WooCommerce `.button` (not a Bootstrap class) — scoped to the cart wrapper. */
.woocommerce-cart .woocommerce .button { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; background: #fff; color: var(--tp-raspberry-deep); border: 2px solid var(--tp-raspberry-deep); border-radius: var(--tp-r-pill); padding: .6rem 1.3rem; font-family: var(--tp-body); font-weight: 700; text-decoration: none; cursor: pointer; transition: background .15s ease, color .15s ease; }
.woocommerce-cart .woocommerce .button:hover { background: var(--tp-raspberry); color: #fff; }

/* Totals card */
.woocommerce-cart .cart_totals { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); box-shadow: var(--tp-shadow-sm); padding: clamp(1.2rem, 2.5vw, 1.6rem); }
.woocommerce-cart .cart_totals > h2 { font-family: var(--tp-display); font-weight: 700; font-size: 1.4rem; margin: 0 0 1rem; }
.woocommerce-cart .cart_totals .shop_table { width: 100%; border-collapse: collapse; margin: 0 0 1rem; }
.woocommerce-cart .cart_totals .shop_table th, .woocommerce-cart .cart_totals .shop_table td { padding: .6rem 0; border-bottom: 1px solid var(--tp-line); text-align: left; }
.woocommerce-cart .cart_totals .shop_table td { text-align: right; }
.woocommerce-cart .cart_totals .order-total th, .woocommerce-cart .cart_totals .order-total td { font-family: var(--tp-display); font-size: 1.25rem; border-bottom: 0; padding-top: .8rem; }

/* Shipping method inside totals */
.woocommerce-cart .woocommerce-shipping-methods { list-style: none; margin: 0 0 .8rem; padding: 0; }
.woocommerce-cart .woocommerce-shipping-totals .border-black { border-color: var(--tp-line) !important; border-radius: var(--tp-r-md); }
.woocommerce-cart .woocommerce-shipping-totals .ratio.bg-gray { --bs-aspect-ratio: 8rem !important; }

/* Proceed to checkout — primary CTA */
.woocommerce-cart .wc-proceed-to-checkout { margin: 0; }
.woocommerce-cart .woocommerce .checkout-button { display: block; width: 100%; background: var(--tp-raspberry); color: #fff; border: 2px solid var(--tp-raspberry); border-radius: var(--tp-r-pill); padding: 1rem 1.5rem; font-size: 1.1rem; font-weight: 800; text-align: center; text-decoration: none; box-shadow: 0 10px 24px rgba(214, 51, 127, .25); }
.woocommerce-cart .woocommerce .checkout-button:hover { background: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-deep); color: #fff; }

/* Reservation-fee note under the cart */
.woocommerce-cart .tp-content > p:has(> b) { max-width: none; margin-top: 1.5rem; padding: 1rem 1.2rem; background: var(--tp-raspberry-soft); border: 1px solid var(--tp-line); border-left: 4px solid var(--tp-raspberry); border-radius: var(--tp-r-md); color: var(--tp-ink); }
.woocommerce-cart .tp-content > p:has(> b) b { font-weight: 600; }

/* Responsive: stack the items table into rows on mobile + tablet (up to the
   992px grid breakpoint, so the wide 6-col table never crowds the narrow container). */
@media (max-width: 991px) {
	.woocommerce-cart .woocommerce-cart-form__contents thead { display: none; }
	.woocommerce-cart .cart_item td.product-quantity:has(input[type="hidden"]) { display: none; }
	.woocommerce-cart .woocommerce-cart-form__contents,
	.woocommerce-cart .woocommerce-cart-form__contents tbody,
	.woocommerce-cart .woocommerce-cart-form__contents tr,
	.woocommerce-cart .woocommerce-cart-form__contents td { display: block; width: 100%; }
	.woocommerce-cart .cart_item { position: relative; padding: .5rem 0; border-bottom: 1px solid var(--tp-line); }
	.woocommerce-cart .cart_item td { border-bottom: 0; padding: .35rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
	.woocommerce-cart .cart_item td.product-thumbnail { justify-content: flex-start; }
	.woocommerce-cart .cart_item td[data-title]::before { content: attr(data-title); font-weight: 700; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--tp-muted); }
	.woocommerce-cart .cart_item td.product-remove { position: absolute; top: .5rem; right: .5rem; padding: 0; }
	.woocommerce-cart td.actions { display: block; }
	.woocommerce-cart td.actions .coupon { display: flex; width: 100%; margin-bottom: .6rem; }
	.woocommerce-cart td.actions #coupon_code { flex: 1; min-width: 0; }
	.woocommerce-cart td.actions [name="update_cart"] { float: none; width: 100%; }
}

/* ==========================================================================
   Plugin brand integration — Cosmick "Areas We Serve", WC Puppy Breeds, and
   WC Pet Gallery each ship a self-contained CSS-variable design system with an
   off-brand default accent (grey / orange / tan). Rather than fight their
   layout, we remap THEIR OWN tokens to the Tiny Paws palette so their output
   renders on-brand. Selectors use order-independent specificity (html:root beats
   the plugins' :root defaults; doubled classes beat their single-class defaults)
   so this works no matter which stylesheet loads last.
   ========================================================================== */

/* --- Areas We Serve (cosmick-areas-served, .aws-* / .cas-*, var prefix --cas-) --- */
html:root {
	--cas-primary: var(--tp-raspberry);
	--cas-primary-dark: var(--tp-raspberry-deep);
	--cas-primary-light: var(--tp-raspberry-soft);
	--cas-text: var(--tp-ink);
	/* --- WC Puppy Breeds (.pb-*, var prefix --pb-; default #CF5B1F orange) --- */
	--pb-primary: var(--tp-raspberry);
	--pb-primary-dark: var(--tp-raspberry-deep);
	--pb-primary-light: var(--tp-raspberry-soft);
	--pb-primary-rgb: 214, 51, 127;
}
.aws-page-title, .aws-section-title, .aws-cta-title, .aws-features-title, .aws-hero__heading, .aws-hero-subtitle + *, .aws-breeds-strip-title { font-family: var(--tp-display); }
.aws-cta-button, .aws-breed-chip, .aws-read-more-btn { font-family: var(--tp-body); }

/* Breeds: doubled-class wins if the plugin scopes --pb-* to its own wrappers. */
.pb-breeds-listing.pb-breeds-listing, .pb-single-breed.pb-single-breed {
	--pb-primary: var(--tp-raspberry); --pb-primary-dark: var(--tp-raspberry-deep);
	--pb-primary-light: var(--tp-raspberry-soft); --pb-primary-rgb: 214, 51, 127;
	font-family: var(--tp-body); color: var(--tp-ink);
}
.pb-breed-card__title, .pb-breed-hero__title, .pb-single-breed h1, .pb-single-breed h2, .pb-single-breed h3 { font-family: var(--tp-display); }
.pb-search-input:focus { border-color: var(--tp-raspberry); box-shadow: 0 0 0 3px var(--tp-raspberry-soft); outline: 0; }

/* --- WC Pet Gallery (.wcpk-gallery, var prefix --wcpk-; primary already inherits
   --bs-primary = raspberry; recolor the tan accent + align radius/fonts). --- */
.wcpk-gallery.wcpk-gallery {
	--wcpk-accent: var(--tp-raspberry);
	--wcpk-primary-soft: var(--tp-raspberry-soft);
	--wcpk-ink: var(--tp-ink); --wcpk-muted: var(--tp-muted); --wcpk-line: var(--tp-line);
	--wcpk-radius: var(--tp-r-lg); --wcpk-radius-lg: var(--tp-r-lg); --wcpk-radius-sm: var(--tp-r-md);
	--wcpk-font-body: var(--tp-body); --wcpk-font-display: var(--tp-display);
}
.wcpk-hero__heading, .wcpk-card__title { font-family: var(--tp-display); }

/* ==========================================================================
   Blog & editorial — index cards, single post, archives, search, comments.
   Article typography is scoped to editorial contexts (.tp-article on single
   posts, non-Woo .page) so it never restyles the cart/checkout .tp-content.
   ========================================================================== */

/* --- Article body typography --- */
.tp-article .tp-content,
.page:not(.woocommerce-page) .tp-content { font-size: 1.075rem; line-height: 1.75; color: var(--tp-ink); }
.tp-article .tp-content > *:first-child { margin-top: 0; }
.tp-article .tp-content p, .page:not(.woocommerce-page) .tp-content p { margin: 0 0 1.3rem; }
.tp-article .tp-content h2, .page:not(.woocommerce-page) .tp-content h2 { font-family: var(--tp-display); font-weight: 700; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.2; margin: 2.4rem 0 .9rem; }
.tp-article .tp-content h3, .page:not(.woocommerce-page) .tp-content h3 { font-family: var(--tp-display); font-weight: 700; font-size: clamp(1.25rem, 2.4vw, 1.5rem); line-height: 1.25; margin: 2rem 0 .7rem; }
.tp-article .tp-content h4, .page:not(.woocommerce-page) .tp-content h4 { font-family: var(--tp-display); font-weight: 700; font-size: 1.15rem; margin: 1.6rem 0 .6rem; }
.tp-article .tp-content a, .page:not(.woocommerce-page) .tp-content a { color: var(--tp-raspberry-deep); text-decoration: underline; text-underline-offset: 2px; }
.tp-article .tp-content a:hover, .page:not(.woocommerce-page) .tp-content a:hover { color: var(--tp-raspberry); }
.tp-article .tp-content ul, .tp-article .tp-content ol, .page:not(.woocommerce-page) .tp-content ul, .page:not(.woocommerce-page) .tp-content ol { margin: 0 0 1.3rem; padding-left: 1.35rem; }
.tp-article .tp-content li, .page:not(.woocommerce-page) .tp-content li { margin: .4rem 0; }
.tp-article .tp-content ul li::marker, .page:not(.woocommerce-page) .tp-content ul li::marker { color: var(--tp-raspberry); }
.tp-article .tp-content blockquote, .page:not(.woocommerce-page) .tp-content blockquote { margin: 1.8rem 0; padding: 1rem 1.4rem; border-left: 4px solid var(--tp-raspberry); background: var(--tp-cream-2); border-radius: 0 var(--tp-r-md) var(--tp-r-md) 0; font-size: 1.15rem; font-style: italic; color: var(--tp-mocha); }
.tp-article .tp-content blockquote p:last-child, .page:not(.woocommerce-page) .tp-content blockquote p:last-child { margin-bottom: 0; }
.tp-article .tp-content img, .page:not(.woocommerce-page) .tp-content img { max-width: 100%; height: auto; border-radius: var(--tp-r-md); }
.tp-article .tp-content figure, .page:not(.woocommerce-page) .tp-content figure { margin: 1.8rem 0; }
.tp-article .tp-content figcaption, .page:not(.woocommerce-page) .tp-content figcaption { font-size: .85rem; color: var(--tp-muted); text-align: center; margin-top: .5rem; }
.tp-article .tp-content hr, .page:not(.woocommerce-page) .tp-content hr { border: 0; border-top: 1px solid var(--tp-line); margin: 2.4rem 0; }
.tp-article .tp-content pre, .page:not(.woocommerce-page) .tp-content pre { background: var(--tp-mocha-deep); color: #fff; padding: 1rem 1.2rem; border-radius: var(--tp-r-md); overflow-x: auto; font-size: .9rem; margin: 0 0 1.3rem; }
.tp-article .tp-content code, .page:not(.woocommerce-page) .tp-content code { background: var(--tp-cream-2); border: 1px solid var(--tp-line); border-radius: 4px; padding: .1rem .35rem; font-size: .9em; }
.tp-article .tp-content pre code, .page:not(.woocommerce-page) .tp-content pre code { background: none; border: 0; padding: 0; color: inherit; }
.tp-article .tp-content table, .page:not(.woocommerce-page) .tp-content table { width: 100%; border-collapse: collapse; margin: 0 0 1.3rem; }
.tp-article .tp-content th, .tp-article .tp-content td, .page:not(.woocommerce-page) .tp-content th, .page:not(.woocommerce-page) .tp-content td { border: 1px solid var(--tp-line); padding: .6rem .8rem; text-align: left; }
.tp-article .tp-content th, .page:not(.woocommerce-page) .tp-content th { background: var(--tp-cream-2); }

/* --- Post meta row --- */
.tp-post-meta { display: flex; flex-wrap: wrap; gap: .3rem 1rem; color: var(--tp-mocha); font-size: .85rem; }
.tp-page-head .tp-post-meta { margin-top: .7rem; }
.tp-post-meta__item { display: inline-flex; align-items: center; gap: .35rem; }
.tp-post-meta__item i { color: var(--tp-raspberry); font-size: .85em; }

/* --- Blog / archive / search grid + card --- */
.tp-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.8rem; }
.tp-blog-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); overflow: hidden; box-shadow: var(--tp-shadow-sm); transition: transform .25s var(--tp-ease), box-shadow .25s var(--tp-ease); }
.tp-blog-card:hover { transform: translateY(-4px); box-shadow: var(--tp-shadow-lift); }
.tp-blog-card__media { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--tp-sage); }
.tp-blog-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--tp-ease); }
.tp-blog-card:hover .tp-blog-card__img { transform: scale(1.05); }
.tp-blog-card__ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; font-size: 2.4rem; opacity: .55; }
.tp-blog-card__chip { position: absolute; top: .8rem; left: .8rem; background: rgba(255, 255, 255, .93); color: var(--tp-raspberry-deep); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .3rem .7rem; border-radius: var(--tp-r-pill); }
.tp-blog-card__body { display: flex; flex-direction: column; flex: 1; padding: 1.3rem; }
.tp-blog-card__title { font-family: var(--tp-display); font-weight: 700; font-size: 1.3rem; line-height: 1.25; margin: 0 0 .5rem; }
.tp-blog-card__title a { color: var(--tp-ink); text-decoration: none; }
.tp-blog-card__title a:hover { color: var(--tp-raspberry); }
.tp-blog-card__excerpt { color: var(--tp-muted); margin: 0 0 1.1rem; }
.tp-blog-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: auto; }
.tp-blog-card__foot .tp-post-meta { font-size: .8rem; }
.tp-blog-card__more { color: var(--tp-raspberry-deep); font-weight: 700; font-size: .9rem; white-space: nowrap; }
.tp-blog-card__more i { transition: transform .2s ease; }
.tp-blog-card:hover .tp-blog-card__more i { transform: translateX(3px); }

/* --- Pagination --- */
.tp-pagination { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin-top: 3rem; }
.tp-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 .8rem; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); background: #fff; color: var(--tp-ink); font-weight: 700; text-decoration: none; transition: all .15s ease; }
.tp-pagination a.page-numbers:hover { border-color: var(--tp-raspberry); color: var(--tp-raspberry); }
.tp-pagination .page-numbers.current { background: var(--tp-raspberry); border-color: var(--tp-raspberry); color: #fff; }
.tp-pagination .page-numbers.dots { border-color: transparent; background: none; }

/* --- Single article --- */
.tp-article { max-width: 760px; margin-inline: auto; }
.tp-article__hero { margin: 0 0 2rem; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); overflow: hidden; }
.tp-article__hero img { display: block; width: 100%; height: auto; }
.tp-linkpages { margin-top: 1.5rem; font-weight: 700; }
.tp-article__tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; }
.tp-tag-pill { background: var(--tp-cream-2); border: 1px solid var(--tp-line); color: var(--tp-mocha); font-size: .85rem; font-weight: 600; padding: .35rem .8rem; border-radius: var(--tp-r-pill); text-decoration: none; }
.tp-tag-pill:hover { background: var(--tp-raspberry-soft); color: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-soft); }

/* --- Share --- */
.tp-share { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--tp-line); }
.tp-share__label { font-weight: 700; color: var(--tp-mocha); font-size: .9rem; margin-right: .2rem; }
.tp-share__btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 999px; background: var(--tp-cream-2); color: var(--tp-mocha); text-decoration: none; transition: background .15s ease, color .15s ease; }
.tp-share__btn:hover { background: var(--tp-raspberry); color: #fff; }

/* --- Author bio --- */
.tp-author-bio { display: flex; gap: 1.2rem; align-items: flex-start; margin-top: 2.5rem; padding: 1.5rem; background: var(--tp-cream-2); border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); }
.tp-author-bio__avatar { border-radius: 999px; flex: 0 0 auto; }
.tp-author-bio__eyebrow { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--tp-raspberry); font-weight: 700; }
.tp-author-bio__name { font-family: var(--tp-display); font-size: 1.25rem; margin: .1rem 0 .4rem; }
.tp-author-bio__text { color: var(--tp-muted); margin: 0; font-size: .95rem; line-height: 1.6; }

/* --- Prev / next post nav --- */
.tp-post-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; max-width: 760px; margin: 2.5rem auto 0; }
.tp-post-nav__link { display: flex; flex-direction: column; gap: .3rem; padding: 1rem 1.2rem; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); background: #fff; text-decoration: none; transition: border-color .15s ease, box-shadow .15s ease; }
.tp-post-nav__link:hover { border-color: var(--tp-raspberry); box-shadow: var(--tp-shadow-sm); }
.tp-post-nav__link span { font-size: .8rem; color: var(--tp-raspberry-deep); font-weight: 700; }
.tp-post-nav__link strong { color: var(--tp-ink); font-weight: 700; line-height: 1.3; }
.tp-post-nav__link--next { text-align: right; }
@media (max-width: 575px) { .tp-post-nav { grid-template-columns: 1fr; } .tp-post-nav__link--next { text-align: left; } }

/* --- Empty state + search form --- */
.tp-blog-empty { text-align: center; padding: 3rem 1rem; color: var(--tp-muted); }
.tp-blog-empty i { font-size: 2.4rem; color: var(--tp-sage-deep); margin-bottom: 1rem; }
.tp-blog-empty p { margin: 0; font-size: 1.05rem; }
.tp-search-form-wrap { max-width: 560px; margin: 0 0 2.5rem; }
.tp-search-form-wrap form { display: flex; gap: .5rem; }
.tp-search-form-wrap input[type="search"], .tp-search-form-wrap .search-field { flex: 1; min-width: 0; border: 1px solid var(--tp-line); border-radius: var(--tp-r-pill); padding: .7rem 1.1rem; font-family: var(--tp-body); }
.tp-search-form-wrap input[type="search"]:focus, .tp-search-form-wrap .search-field:focus { border-color: var(--tp-raspberry); box-shadow: 0 0 0 3px var(--tp-raspberry-soft); outline: 0; }
.tp-search-form-wrap button, .tp-search-form-wrap .search-submit { border-radius: var(--tp-r-pill); background: var(--tp-raspberry); border: 2px solid var(--tp-raspberry); color: #fff; font-weight: 700; padding: .6rem 1.4rem; cursor: pointer; }
.tp-search-form-wrap button:hover, .tp-search-form-wrap .search-submit:hover { background: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-deep); }

/* --- Comments --- */
.tp-container--narrow { max-width: 760px; }
.tp-comments__title { font-family: var(--tp-display); font-weight: 700; font-size: 1.6rem; margin: 0 0 1.5rem; }
.tp-comment-list { list-style: none; margin: 0 0 2rem; padding: 0; }
.tp-comment-list ol.children { list-style: none; padding-left: 1.5rem; }
.tp-comment-list .comment-body { background: #fff; border: 1px solid var(--tp-line); border-radius: var(--tp-r-lg); padding: 1.2rem; margin-bottom: 1rem; box-shadow: var(--tp-shadow-sm); }
.tp-comment-list .comment-author { display: flex; align-items: center; gap: .6rem; margin-bottom: .5rem; }
.tp-comment-list .comment-author img { border-radius: 999px; }
.tp-comment-list .fn { font-weight: 700; font-style: normal; color: var(--tp-ink); }
.tp-comment-list .comment-metadata, .tp-comment-list .comment-meta { font-size: .8rem; color: var(--tp-muted); }
.tp-comment-list .comment-metadata a, .tp-comment-list .comment-meta a { color: var(--tp-muted); text-decoration: none; }
.tp-comment-list .reply a { display: inline-block; margin-top: .4rem; font-weight: 700; font-size: .85rem; color: var(--tp-raspberry-deep); text-decoration: none; }
.tp-comments__reply-title { font-family: var(--tp-display); font-weight: 700; font-size: 1.35rem; margin: 0 0 1rem; }
.tp-comment-form { margin-top: 1rem; }
.tp-comment-form input[type="text"], .tp-comment-form input[type="email"], .tp-comment-form input[type="url"], .tp-comment-form textarea { width: 100%; border: 1px solid var(--tp-line); border-radius: var(--tp-r-md); padding: .7rem .9rem; font-family: var(--tp-body); margin-bottom: 1rem; }
.tp-comment-form input:focus, .tp-comment-form textarea:focus { border-color: var(--tp-raspberry); box-shadow: 0 0 0 3px var(--tp-raspberry-soft); outline: 0; }
.tp-comment-form .form-submit .submit { background: var(--tp-raspberry); border: 2px solid var(--tp-raspberry); color: #fff; border-radius: var(--tp-r-pill); padding: .8rem 2rem; font-weight: 800; cursor: pointer; }
.tp-comment-form .form-submit .submit:hover { background: var(--tp-raspberry-deep); border-color: var(--tp-raspberry-deep); }
.tp-comments__closed { color: var(--tp-muted); }