/* Consolidated page-family corrections; formerly assets/css/page-families.css. */
/* Shared layout corrections for common Green Dog components.
   Durable rules live here only when they are used across multiple pages. */

/* Events and Guides archives: one card, not two stacked.
   The heading half carries no shadow and no seam padding; the content half
   carries the only shadow, offset so it never falls across the join. */
html body.gd-site-style-guide .content-container:has(.gd-events-page-header),
html body.gd-site-style-guide .gd-guide-hero-frame {
  padding-bottom:0;
  box-shadow:none;
}
html body.gd-site-style-guide.post-type-archive-tribe_events #primary > .content-container,
html body.gd-site-style-guide.category:has(.gd-guide-hero-frame) #primary > .content-container,
html body.gd-site-style-guide.single-post:has(.gd-guide-hero-frame) #primary > .content-container {
  box-shadow:0 18px 48px -12px rgba(var(--gd-content-navy-rgb),.12);
}
html body.gd-site-style-guide.post-type-archive-tribe_events .tribe-events-view {
  box-shadow:none;
}

/* Shared information and policy content.
   Pages opt in with content classes, so the same rules serve every policy
   without page IDs or category-specific styles. */
html body.gd-site-style-guide .gd-info-content > h2 {
  width:100%;
  max-width:820px;
  margin:30px auto 10px !important;
}
html body.gd-site-style-guide .gd-info-content > h3 {
  width:100%;
  max-width:820px;
  margin:22px auto 8px !important;
}
html body.gd-site-style-guide .gd-info-content > :is(p,ul,ol) {
  width:100%;
  max-width:820px;
  margin:0 auto 18px;
}
html body.gd-site-style-guide .gd-info-content > :is(ul,ol) > li { margin:0 0 6px !important; }
html body.gd-site-style-guide .gd-info-content > :last-child { margin-bottom:0; }
html body.gd-site-style-guide .gd-info-content .gd-media--portrait:has(img.gd-dog-photo) {
  width:min(100%,520px);
  margin-inline:auto;
  aspect-ratio:auto;
}
html body.gd-site-style-guide .gd-info-content .gd-media--portrait img.gd-dog-photo {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:auto;
  object-fit:contain;
}
html body.gd-site-style-guide .gd-policy-section {
  width:100%;
  margin:0;
  padding:0;
}
html body.gd-site-style-guide .gd-policy-section .gd-section-head {
  max-width:820px;
  margin:0 auto 18px;
}
html body.gd-site-style-guide .gd-policy-list {
  width:100%;
  max-width:820px;
  margin-inline:auto;
  border-top:1px solid var(--gd-border);
}
html body.gd-site-style-guide .gd-policy-item {
  position:relative;
  min-width:0;
  padding:22px 0 22px 54px;
  border-bottom:1px solid var(--gd-border);
  background:transparent;
  box-shadow:none;
}
html body.gd-site-style-guide .gd-policy-item > :last-child { margin-bottom:0; }
html body.gd-site-style-guide .gd-policy-item .gd-num {
  position:absolute;
  top:22px;
  left:0;
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border-radius:50%;
  background:var(--gd-surface-tint);
  color:var(--gd-brand-navy);
  font-weight:800;
}
html body.gd-site-style-guide .gd-policy-item h3 { margin:0 0 8px; }

/* Shared booking entrance: one compact heading and one clear ZIP control. */
html body.gd-site-style-guide .gd-booking-step-header { display:flex; flex-direction:column; gap:0; }
html body.gd-site-style-guide .gd-booking-step-header > .gd-kicker { order:1; margin:0 0 8px; }
html body.gd-site-style-guide .gd-booking-step-header > h1 { order:2; margin:0 0 8px; }
html body.gd-site-style-guide .gd-booking-step-header > .gd-booking-step-kicker { order:3; margin:0 0 14px; }
html body.gd-site-style-guide .gd-booking-step-header > p:not(.gd-kicker):not(.gd-booking-step-kicker) {
  order:4;
  max-width:none;
  margin:0;
}




@media (max-width:600px) {
  html body.gd-site-style-guide .gd-policy-item { padding-left:46px; }
}


/* Shared responsive photo grid for information pages. */
html body.gd-site-style-guide .gd-info-content .gd-grid--photos {
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:start;
}
html body.gd-site-style-guide .gd-info-content .gd-grid--photos img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
}
@media (max-width:900px) {
  html body.gd-site-style-guide .gd-info-content .gd-grid--photos {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:600px) {
  html body.gd-site-style-guide .gd-info-content .gd-grid--photos {
    grid-template-columns:minmax(0,1fr);
    width:min(100%,360px);
    margin-inline:auto;
  }
}


/* Shared document structure: short introduction followed by linear sections. */
html body.gd-site-style-guide .gd-info-intro {
  width:100%;
  max-width:820px;
  margin:0 auto 8px;
  color:var(--gd-content-navy);
  font-size:1.06rem;
}
html body.gd-site-style-guide .gd-info-intro > :last-child { margin-bottom:0; }
html body.gd-site-style-guide .gd-info-sections {
  width:100%;
  max-width:900px;
  margin-inline:auto;
}
html body.gd-site-style-guide .gd-info-section {
  width:100%;
  max-width:900px;
  margin-inline:auto;
  padding:26px 0;
  border-top:1px solid var(--gd-border);
  background:transparent;
  box-shadow:none;
}
html body.gd-site-style-guide .gd-info-section--first,
html body.gd-site-style-guide .gd-info-sections > .gd-info-section:first-child {
  padding-top:0;
  border-top:0;
}
html body.gd-site-style-guide .gd-info-section > h2 {
  max-width:820px;
  margin:0 auto 10px;
}
html body.gd-site-style-guide .gd-info-section > :is(p,ul,ol) {
  max-width:820px;
  margin-inline:auto;
}
html body.gd-site-style-guide .gd-info-section > :last-child { margin-bottom:0; }

/* Reading pages: the page header shares the 820px reading column. */
html body.gd-site-style-guide .gd-universal-page-flow > .gd-universal-page-header:has(+ .gd-info-content) {
  max-width:820px;
  margin-inline:auto;
}

/* Photos inside page content stay a moderate size: at most 360px tall
 * (cropped to fit, never stretched), and the single injected page photo
 * at most 480px wide. Icons and emoji are left alone. */
html body.gd-site-style-guide .gd-universal-page-flow > :not(.gd-universal-page-header) img:not(.emoji):not([class*="icon"]) {
  max-height:360px;
  object-fit:cover;
  object-position:center 35%;
}
html body.gd-site-style-guide .gd-page-dog-photo {
  max-width:480px;
  margin-inline:auto;
}

/* Service-detail dog photos: keep the full dog visible without allowing the
   photo to dominate the page. Desktop overview copy stays left; photo stays right. */
html body.gd-site-style-guide .gd-service-overview {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,420px);
  gap:var(--gd-space-gap);
  align-items:start;
}
html body.gd-site-style-guide .gd-service-overview > .gd-service-photo {
  grid-column:2;
  grid-row:1;
}
html body.gd-site-style-guide .gd-service-overview > :not(.gd-service-photo) {
  grid-column:1;
  grid-row:1;
}
html body.gd-site-style-guide .gd-universal-page-flow .gd-service-photo {
  width:100%;
  max-width:420px;
  align-self:start;
  justify-self:end;
  margin:0;
}
html body.gd-site-style-guide .gd-universal-page-flow .gd-service-photo img:not(.emoji):not([class*="icon"]) {
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:420px;
  margin-inline:auto;
  object-fit:contain;
  object-position:center;
}
html body.gd-site-style-guide .gd-service-client-photos .gd-service-photo {
  max-width:360px;
  justify-self:center;
}
html body.gd-site-style-guide .gd-service-client-photos .gd-service-photo img:not(.emoji):not([class*="icon"]) {
  max-height:360px;
}

/* Service pricing overview: pricing/details stay left and a moderate,
   uncropped service photo stays right. */
html body.gd-site-style-guide .gd-price-overview {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,380px);
  gap:var(--gd-space-gap);
  align-items:start;
}
html body.gd-site-style-guide .gd-price-overview > .gd-media {
  width:100%;
  max-width:380px;
  grid-column:2;
  grid-row:1;
  justify-self:end;
  margin:0;
}
html body.gd-site-style-guide .gd-price-overview > :not(.gd-media) {
  grid-column:1;
  grid-row:1;
}
html body.gd-site-style-guide .gd-universal-page-flow .gd-price-overview > .gd-media img:not(.emoji):not([class*="icon"]) {
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:360px;
  margin-inline:auto;
  object-fit:contain;
  object-position:center;
}

@media (max-width:760px) {
  html body.gd-site-style-guide .gd-service-overview,
  html body.gd-site-style-guide .gd-price-overview {
    grid-template-columns:minmax(0,1fr);
  }
  html body.gd-site-style-guide .gd-service-overview > :not(.gd-service-photo),
  html body.gd-site-style-guide .gd-price-overview > :not(.gd-media) {
    grid-column:1;
    grid-row:1;
  }
  html body.gd-site-style-guide .gd-service-overview > .gd-service-photo,
  html body.gd-site-style-guide .gd-price-overview > .gd-media {
    grid-column:1;
    grid-row:2;
    justify-self:center;
  }
}


/* Information pages stay flat inside the global page header/content shell.
   This removes the duplicate outer drop shadow without page-specific IDs. */
html body.gd-site-style-guide:has(.gd-info-content) #primary > .content-container,
html body.gd-site-style-guide:has(.gd-info-content) #primary > .site-container {
  box-shadow:none;
}
/* Pages: the global page shell is the only card; Kadence's boxed article inside it stays flat on every page. */
body.gd-site-style-guide.page #main article.single-entry {
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

/* A single, standardized booking action closes information pages. */
html body.gd-site-style-guide .gd-info-content > .gd-booking-action,
html body.gd-site-style-guide .gd-grooming-page > .gd-booking-action {
  display:flex;
  width:100%;
  max-width:900px;
  margin:0 auto;
  padding:26px 0 0;
  justify-content:center;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
html body.gd-site-style-guide .gd-info-content > .gd-booking-action > .gd-btn,
html body.gd-site-style-guide .gd-grooming-page > .gd-booking-action > .gd-btn {
  margin:0;
}
@media (max-width:600px) {
  html body.gd-site-style-guide .gd-info-content > .gd-booking-action > .gd-btn,
  html body.gd-site-style-guide .gd-grooming-page > .gd-booking-action > .gd-btn {
    width:100%;
    justify-content:center;
  }
}



/* Universal headers may consume an original hero and leave its wrapper empty. */
html body.gd-site-style-guide .gd-universal-page-flow > .gd-layout:empty {
  display:none !important;
}


/* Header artwork and Community header stacking (moved from inline <style id="green-dog-header-background">). */
body.gd-site-style-guide #masthead .site-main-header-wrap {
  height:96px;
  min-height:96px;
  background-color:var(--gd-brand-navy);
  background-image:var(--gd-content-bluebar-image);
  background-position:center center;
  background-repeat:no-repeat;
  background-size:2000px 96px;
}
/* Community: header dropdowns open above FluentCommunity sticky bars (z-index 90-101); dialogs (2001+) and the full-screen editor stay on top. */
body.gd-community-shell #masthead { z-index:1000; }
body.gd-community-shell .fcom_full_editor { z-index:1002; }

/* WordPress block groups: Kadence restores an inner wrapper div inside every group,
   which would break the Green Dog grid and card layouts. Make that wrapper transparent
   and drop the block-editor margins inside grids. */
body.gd-site-style-guide .wp-block-group > .wp-block-group__inner-container { display:contents; }
body.gd-site-style-guide .gd-grid .wp-block-group { margin-block:0; }

/* When a shared hero has no lead, actions, or other copy after its title,
   do not reserve paragraph-style space beneath the heading. */
html body.gd-site-style-guide .gd-hero > h1:last-child,
html body.gd-site-style-guide .gd-hero-copy > h1:last-child,
html body.gd-site-style-guide .gd-universal-page-header > h1:last-child {
  margin-bottom:0;
}

/* Shared service-area map: booking ZIP lookup and authored public page. */
html body.gd-site-style-guide :is(.gd-booking-service-map,.gd-service-area-map) {
  margin-top:var(--gd-component-space-lg);
}
html body.gd-site-style-guide :is(.gd-booking-service-map,.gd-service-area-map) > h2 {
  margin:0 0 var(--gd-component-space-sm);
}
html body.gd-site-style-guide :is(.gd-booking-service-map,.gd-service-area-map) > iframe {
  display:block;
  box-sizing:border-box;
  width:100%;
  aspect-ratio:16 / 9;
  height:auto;
  border:1px solid var(--gd-border);
  border-radius:var(--gd-control-radius);
  background:var(--gd-surface);
}
html body.gd-site-style-guide :is(.gd-booking-service-map,.gd-service-area-map) > p {
  margin:var(--gd-component-space-sm) 0 0;
}
@media (max-width:760px) {
  html body.gd-site-style-guide :is(.gd-booking-service-map,.gd-service-area-map) > iframe {
    aspect-ratio:1 / 1;
  }
}


/* Inline links in the shared page closing paragraph remain recognizable
   without relying on color; button components retain their own styling. */
html body.gd-site-style-guide .gd-universal-page-flow > p a:not(.gd-btn) {
  text-decoration:underline;
  text-underline-offset:.15em;
}
