/* Pet Store Life: shared colors and layouts for the static pages. */
:root {
  --global-palette1: #b64d2e;
  --global-palette2: #73937a;
  --global-palette3: #33251f;
  --global-palette6: #e9d9c6;
  --global-palette7: #382720;
  --global-palette8: #30221d;
  --wp--preset--color--theme-palette-1: #b64d2e;
  --wp--preset--color--theme-palette-2: #73937a;
  --wp--preset--color--theme-palette-3: #33251f;
  --wp--preset--color--theme-palette-7: #382720;
  --wp--preset--color--theme-palette-8: #30221d;
}

.site-branding a.brand img.svg-logo-image { width: auto; max-width: 166px; height: auto; }
.site-footer .wp-block-image img { object-fit: contain !important; width: 188px !important; height: auto !important; }
#colophon { background: #382720; }
#colophon a:hover { color: #ffcf91; }
.site-footer-middle-section-3 .widget-icon-3 a { display: inline-flex; align-items: center; gap: 10px; overflow-wrap: anywhere; }
.site-footer-middle-section-3 .widget-icon-3 a::before { flex: 0 0 30px; float: none; margin: 0; }

/* Legal page banners need a dark scrim over the bright game artwork. */
.legal-hero .page-hero-section .hero-section-overlay { background: rgba(32, 22, 18, .7); }
.legal-hero .page-hero-section .entry-title,
.legal-hero .page-hero-section .thewebs-breadcrumbs,
.legal-hero .page-hero-section .thewebs-breadcrumbs a { color: #fff; text-shadow: 0 2px 8px rgba(0, 0, 0, .8); }
.legal-hero .page-hero-section .thewebs-breadcrumbs a:hover { color: #ffcf91; }

/* A fixed, consistent header keeps the navigation readable while scrolling. */
#masthead .site-main-header-wrap > .site-header-row-container-inner,
#masthead .thewebs-sticky-header.item-is-fixed:not(.item-at-start) > .site-header-row-container-inner { background: #30221d; }
#masthead .site-main-header-inner-wrap { height: 70px !important; min-height: 70px !important; max-height: 70px !important; }
@media (min-width: 1025px) {
  .transparent-header #masthead .site-main-header-wrap > .site-header-row-container-inner,
  .transparent-header #masthead .site-main-header-wrap.item-is-fixed:not(.item-at-start) > .site-header-row-container-inner { background: #30221d; }
}

.psl-page { color: #34251f; background: #fff8ef; font-size: 17px; line-height: 1.7; }
.psl-page *, .psl-page *::before, .psl-page *::after { box-sizing: border-box; }
.psl-page h1, .psl-page h2, .psl-page h3, .psl-page p { margin-top: 0; }
.psl-page h1, .psl-page h2, .psl-page h3 { color: #34251f; line-height: 1.16; }
.psl-page h1 { font-size: clamp(2.7rem, 6vw, 5.5rem); letter-spacing: -.035em; }
.psl-page h2 { font-size: clamp(2rem, 4vw, 3.6rem); letter-spacing: -.03em; }
.psl-page h3 { font-size: 1.35rem; }
.psl-page p { max-width: 68ch; }
.psl-page a { color: #a83f23; }
.psl-container { width: min(1140px, calc(100% - 44px)); margin-inline: auto; }
.psl-section { padding: clamp(65px, 9vw, 110px) 0; }
.psl-kicker { color: #a83f23; font-size: .85rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 16px; }
.psl-lede { font-size: clamp(1.05rem, 2vw, 1.25rem); line-height: 1.7; }
.psl-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.psl-button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 12px 25px; border: 2px solid #a83f23; border-radius: 999px; background: #a83f23; color: #fff !important; font-weight: 700; text-decoration: none; line-height: 1.25; transition: transform .2s ease, background-color .2s ease; }
.psl-button:hover, .psl-button:focus-visible { background: #813019; transform: translateY(-2px); }
.psl-button--secondary { background: transparent; color: #813019 !important; }
.psl-button--secondary:hover, .psl-button--secondary:focus-visible { background: #f6e5d6; }
.psl-hero { padding: clamp(65px, 8vw, 120px) 0; background: #f8e6d1; }
.psl-hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 6vw, 90px); align-items: center; }
.psl-hero .psl-lede { max-width: 550px; }
.psl-hero-art { padding: 16px; border-radius: 30px; background: #fff9f0; box-shadow: 0 24px 70px #70392024; }
.psl-hero-art img { width: 100%; display: block; border-radius: 20px; }
.psl-hero-art .psl-app-icon { position: absolute; width: clamp(74px, 10vw, 116px); height: auto; left: 20px; bottom: 20px; border: 4px solid #fff9f0; border-radius: 22px; box-shadow: 0 8px 24px #38272050; }
.psl-hero-banner { position: relative; padding: 0; overflow: hidden; }
.psl-hero-banner img { border-radius: 0; }
.psl-label { display: inline-block; margin-top: 15px; padding: 7px 16px; border-radius: 30px; background: #e1edda; color: #365841; font-size: .9rem; font-weight: 700; }
.psl-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin-top: 42px; }
.psl-card { overflow: hidden; border-radius: 22px; background: #fff; box-shadow: 0 10px 32px #70392012; }
.psl-card img { display: block; width: 100%; height: auto; }
.psl-card-body { padding: 25px; }
.psl-card p { margin-bottom: 0; }
.psl-tinted { background: #edf3e7; }
.psl-duo { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(35px, 7vw, 90px); align-items: center; }
.psl-duo img { display: block; width: 100%; border-radius: 26px; box-shadow: 0 16px 40px #5c38201f; }
.psl-bullets { list-style: none; padding: 0; margin: 26px 0 0; }
.psl-bullets li { padding: 12px 0 12px 32px; position: relative; }
.psl-bullets li::before { content: '✦'; position: absolute; left: 2px; color: #a83f23; }
.psl-center { text-align: center; }
.psl-center p { margin-inline: auto; }
.psl-center .psl-actions { justify-content: center; }
.psl-callout { background: #f8e6d1; }
.psl-contact-link { font-size: clamp(1.1rem, 2.5vw, 1.6rem); font-weight: 700; overflow-wrap: anywhere; }
.psl-note { font-size: .9rem; color: #645146; }

@media (max-width: 800px) {
  .psl-hero-grid, .psl-duo { grid-template-columns: 1fr; }
  .psl-grid { grid-template-columns: 1fr; max-width: 550px; margin-inline: auto; }
  .psl-hero-art { max-width: 650px; }
  .psl-section { padding: 65px 0; }
}
@media (max-width: 480px) {
  .psl-container { width: min(100% - 32px, 1140px); }
  .psl-actions { flex-direction: column; }
  .psl-button { width: 100%; }
  .psl-hero { padding: 55px 0; }
}