/* Graze & Grace homepage-only spacing and hero image cleanup.
   Keeps the site-wide styles, navigation, service cards and quote form untouched. */
.page-home .hero { padding: 32px 0 26px; }
.page-home .hero-grid {
  grid-template-columns: minmax(0,1.07fr) minmax(0,.93fr);
  align-items: center;
  gap: 34px;
}
.page-home .hero h1 {
  font-size: clamp(2.25rem, 3.6vw, 3.55rem);
  line-height: 1.07;
  margin: 4px 0 20px;
}
.page-home .hero-copy p { margin-bottom: 12px; }
.page-home .hero-copy p + p { margin-top: 0; }
.page-home .hero-actions { margin-top: 20px; }
.page-home .area { margin-top: 16px; }
.page-home .collage {
  position: relative;
  top: auto;
  min-width: 0;
  grid-template-columns: minmax(0,1fr);
  grid-template-rows: 245px 165px;
  gap: 12px;
}
.page-home .collage .tile { grid-column: 1; min-width:0; border-radius: 18px; }
.page-home .collage .tile.one { grid-row: 1; }
.page-home .collage .tile.feature { grid-row: 2; }
.page-home .collage .tile img { width: 100%; height: 100%; object-fit: cover; object-position:center; }
.page-home .collage .tile.one img { object-position: center 51%; }
.page-home .collage .collage-badge {
  top: auto;
  right: 14px;
  bottom: 16px;
  width: 123px;
  height: 123px;
  font-size: .68rem;
  transform: rotate(4deg);
}
.page-home .occasions { padding: 42px 0 52px; }
.page-home .services, .page-home .welcome, .page-home .path { padding: 52px 0; }
.page-home .occasion-grid { margin-top: 26px; }
.page-home .service-grid, .page-home .path-grid { margin-top: 24px; }
.page-home .service { padding: 20px; }
.page-home .welcome-photo { height: 360px; }
.page-home .welcome-photo img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 980px) {
  .page-home .hero-grid { grid-template-columns: minmax(0,1fr); gap: 26px; }
  .page-home .collage { max-width: 700px; width: 100%; margin: 0 auto; }
}
@media (max-width: 650px) {
  .page-home .hero { padding: 22px 0 28px; }
  .page-home .hero h1 { font-size: clamp(2rem, 8vw, 2.6rem); }
  .page-home .collage { grid-template-rows: 195px 142px; gap: 9px; }
  .page-home .collage .collage-badge { width: 105px; height: 105px; font-size: .57rem; right: 10px; bottom: 10px; padding: 12px; }
  .page-home .occasions, .page-home .services, .page-home .welcome, .page-home .path { padding: 36px 0; }
  .page-home .occasion-grid, .page-home .service-grid, .page-home .path-grid { margin-top: 20px; }
  .page-home .welcome-photo { height: 290px; }
}

/* Audience section: three clear customer groups, without recycled flyer crops. */
.page-home .audience-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 26px;
}
.page-home .audience-card {
  padding: 26px 25px 28px;
  background: #fffdf9;
  border: 1px solid rgba(96,55,19,.15);
  border-top: 4px solid var(--teal);
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(73,48,27,.05);
}
.page-home .audience-label {
  color: var(--teal);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.page-home .audience-card h3 {
  color: var(--brown);
  font: 500 clamp(1.4rem,2vw,1.65rem) Georgia, serif;
  line-height: 1.18;
  margin: 12px 0;
}
.page-home .audience-card p {margin: 0;line-height: 1.55;color: var(--muted);}
@media (max-width: 980px) {
  .page-home .audience-grid {grid-template-columns: 1fr;gap: 12px;}
  .page-home .audience-card {padding: 22px 22px 23px;}
}

/* Graze & Grace color refinement: navy navigation + eight service cards.
   The hero retains its original cream layout, spacing and restored photography.
   Scoped to the homepage; other page styles remain unchanged. */
.page-home {
  --cream: #FAF3E9;
  --paper: #FFF9F1;
  --teal: #173A57;
  --teal-dark: #102C43;
  --teal-soft: #F4E7DB;
  --brown: #51372D;
  --brown-soft: #82634F;
  --ink: #352B26;
  --muted: #625348;
  --line: #E8D8C9;
  --peach: #ECA787;
}

/* Navigation: midnight blue, with a white CTA and subtle peach border. */
.page-home .site-header {
  background: #173A57;
  border-bottom: 1px solid rgba(236,167,135,.40);
  backdrop-filter: none;
}
.page-home .site-header .nav-links { color: #FFF9F1; }
.page-home .site-header .nav-links a:hover,
.page-home .site-header .nav-links a[aria-current="page"] {
  color: #ECA787;
  border-bottom-color: #ECA787;
}
.page-home .site-header .nav-actions .btn.primary {
  background: #FFFFFF;
  border: 2px solid #ECA787;
  color: #173A57;
}
.page-home .site-header .nav-actions .btn.primary:hover,
.page-home .site-header .nav-actions .btn.primary:focus-visible {
  background: #ECA787;
  border-color: #ECA787;
  color: #173A57;
}
.page-home .site-header .nav-toggle {
  background: transparent;
  color: #FFF9F1;
  border-color: rgba(255,249,241,.60);
}
/* Tint only the *display* of the existing logo so it remains readable on navy.
   Original logo image file is unchanged; remove this when a peach logo is supplied. */
.page-home .site-header .nav-logo img {
  filter: brightness(0) saturate(100%) invert(76%) sepia(22%) saturate(834%) hue-rotate(325deg) brightness(99%) contrast(92%);
}

/* Keep the original warm, unboxed hero and existing welcome photography. */
.page-home .hero { background: var(--paper); }
.page-home .hero h1 { color: #173A57; }
.page-home .hero-actions .btn.primary,
.page-home .hero-actions .btn.secondary {
  background: #173A57;
  border: 2px solid #173A57;
  color: #FFFFFF;
}
.page-home .hero-actions .btn.primary:hover,
.page-home .hero-actions .btn.secondary:hover,
.page-home .hero-actions .btn.primary:focus-visible,
.page-home .hero-actions .btn.secondary:focus-visible {
  background: #ECA787;
  border-color: #ECA787;
  color: #173A57;
}
.page-home .collage .collage-badge {
  background: #173A57;
  color: #FFFFFF;
  border: 4px solid #ECA787;
}

/* Solid navy on exactly the eight existing What We Create cards. */
.page-home .service-grid .service {
  background: #173A57;
  border: 1px solid rgba(236,167,135,.48);
  box-shadow: 0 7px 20px rgba(23,58,87,.10);
}
.page-home .service-grid .service h3,
.page-home .service-grid .service .icon { color: #ECA787; }
.page-home .service-grid .service p { color: #FFF9F1; }

/* Existing cream/chocolate section design elsewhere remains light. */
.page-home .services {background:var(--cream);}
.page-home .occasions, .page-home .welcome {background:var(--paper);}
.page-home .path {background:var(--teal-soft);}
.page-home a:focus-visible,
.page-home button:focus-visible { outline-color:#ECA787; }

@media (max-width: 920px) {
  .page-home .site-header .nav-menu {
    background: #173A57;
    border-bottom: 1px solid rgba(236,167,135,.40);
    box-shadow: 0 14px 30px rgba(23,58,87,.20);
  }
}


/* HOME SALES COPY PASS — property welcome and compact orders / quotes. */
.page-home .welcome { padding: 34px 0 38px; }
.page-home .welcome-grid { grid-template-columns: minmax(0,1fr) minmax(0,.92fr); gap: 32px; }
.page-home .welcome-photo { height: auto; aspect-ratio: 753 / 325; border-radius: 22px; }
.page-home .welcome-photo img { display:block; width: 100%; height: 100%; object-fit: cover; object-position:center top; }
.page-home .welcome h2 { font-size: clamp(1.85rem, 3vw, 3rem); line-height: 1.07; margin: 8px 0 12px; }
.page-home .welcome p { margin: 0; font-size: .97rem; line-height: 1.58; }
.page-home .welcome-links { display:flex; flex-wrap:wrap; gap: 6px 22px; margin-top: 17px; }
.page-home .welcome-links a { color:#173A57; font-size:.88rem; font-weight:800; text-underline-offset:4px; }
.page-home .welcome-links a:hover, .page-home .welcome-links a:focus-visible { text-decoration:underline; }

.page-home .path { padding: 38px 0 42px; }
.page-home .path .section-title { margin: 4px 0 8px; }
.page-home .path .section-sub { max-width: 690px; line-height: 1.5; }
.page-home .path-grid { margin-top: 20px; gap: 18px; align-items: stretch; }
.page-home .path-card { padding: 23px 26px 24px; display:flex; flex-direction:column; gap: 10px; }
.page-home .path-card h3 { font-size:clamp(1.55rem,2.1vw,1.8rem); line-height:1.18; margin:0; }
.page-home .path-card p { margin:0; font-size:.93rem; line-height:1.55; }
.page-home .path-card .eyebrow { font-size:.72rem; }
.page-home .path-card .btn { margin-top:auto; align-self:flex-start; background:#173A57; color:#FFFFFF; border:2px solid #173A57; }
.page-home .path-card .btn:hover, .page-home .path-card .btn:focus-visible { background:#ECA787; color:#173A57; border-color:#ECA787; }
.page-home .path-card .sampler-offer { font-size:.83rem; border-left:3px solid #ECA787; padding:5px 0 5px 13px; margin: 0 0 2px; }
.page-home .path-card .sampler-offer strong { color:#173A57; }
@media (max-width: 980px) {
  .page-home .welcome-grid { grid-template-columns: minmax(0,1fr); gap:22px; }
  .page-home .welcome-photo { max-width:740px; }
}
@media (max-width: 650px) {
  .page-home .welcome { padding: 30px 0 32px; }
  .page-home .welcome-photo { height:auto; aspect-ratio:753/325; }
  .page-home .welcome h2 { font-size:clamp(1.8rem,7vw,2.45rem); }
  .page-home .path { padding:32px 0 34px; }
  .page-home .path-card { padding:21px; }
  .page-home .path-card .btn { width:100%; }
}


/* OCT 21: focused final homepage sales-language and spacing pass.
   Preserve existing cream hero, original images, navy navigation, 8 navy cards,
   the chocolate footer, and all shared site styles on the other pages. */
.page-home .hero h1 {
  font-size: clamp(1.95rem, 2.9vw, 3.03rem);
  line-height: 1.09;
  margin-bottom: 15px;
}
.page-home .section-title {
  font-size: clamp(1.9rem, 2.65vw, 2.65rem);
  line-height: 1.12;
  margin: 0 0 10px;
}
.page-home .section-sub {
  line-height: 1.55;
  max-width: 770px;
}
.page-home .occasions { padding: 38px 0 42px; }
.page-home .audience-grid { margin-top: 22px; }
.page-home .audience-card { padding: 21px 23px 23px; }
.page-home .audience-card h3 { margin: 0 0 9px; font-size: clamp(1.34rem, 1.85vw, 1.54rem); }
.page-home .audience-card p { font-size: .93rem; }
.page-home .services { padding: 40px 0 44px; }
.page-home .service-grid { margin-top: 20px; }
.page-home .service { padding: 18px 18px 20px; }
.page-home .service h3 { font-size: 1.24rem; }
.page-home .service p { font-size: .86rem; }
.page-home .path .section-title { margin: 0 0 9px; }
.page-home .path-grid { margin-top: 17px; }
.page-home .path-card { padding: 21px 23px; }
.page-home .sampler-promo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  margin-top: 16px;
  padding: 17px 23px;
  background: #FFF9F1;
  border-left: 4px solid #ECA787;
  border-radius: 15px;
  box-shadow: 0 8px 20px rgba(73,48,27,.06);
}
.page-home .sampler-promo-copy { flex: 1; min-width: 0; }
.page-home .sampler-promo h3 {
  font: 500 1.36rem Georgia, serif;
  color: #51372D;
  margin: 0 0 4px;
}
.page-home .sampler-promo p { font-size: .88rem; color: #625348; line-height: 1.5; margin: 0; }
.page-home .sampler-promo .btn {
  flex: 0 0 auto;
  background: #173A57;
  color: #FFFFFF;
  border: 2px solid #173A57;
  white-space: nowrap;
}
.page-home .sampler-promo .btn:hover,
.page-home .sampler-promo .btn:focus-visible {
  background: #ECA787;
  border-color: #ECA787;
  color: #173A57;
}
/* Footer contents reorganized only on homepage; retain chocolate background. */
.page-home .footer-nav-groups {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 22px;
}
.page-home .footer-nav .footer-nav-links {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 9px;
}
.page-home .footer-nav-group { min-width: 0; }
.page-home .footer-nav .footer-nav-links a { line-height: 1.4; }
@media(max-width: 920px) {
  .page-home .hero h1 { font-size: clamp(2rem, 4vw, 2.9rem); }
  .page-home .sampler-promo { align-items: flex-start; }
}
@media(max-width: 680px) {
  .page-home .hero h1 { font-size: clamp(1.82rem, 7vw, 2.26rem); }
  .page-home .section-title { font-size: clamp(1.8rem, 7vw, 2.2rem); }
  .page-home .occasions, .page-home .services { padding: 30px 0 34px; }
  .page-home .audience-grid { margin-top: 18px; }
  .page-home .audience-card { padding: 20px; }
  .page-home .sampler-promo { flex-direction: column; align-items: stretch; padding: 19px; gap: 14px; }
  .page-home .sampler-promo .btn { width: 100%; white-space: normal; text-align: center; }
  .page-home .footer-nav .footer-nav-links { align-items: center; }
}
@media(max-width: 440px) {
  .page-home .footer-nav-groups { grid-template-columns: 1fr; gap: 20px; }
}
/* Very small phones: avoid forcing the long contact email beside the logo. */
@media(max-width:370px){
  .page-home .footer-grid {grid-template-columns:1fr;gap:20px;}
  .page-home .footer-brand,.page-home .footer-contact {min-width:0;text-align:center;}
  .page-home .footer-logo img {margin-left:auto!important;margin-right:auto!important;}
  .page-home .footer-tagline {margin-left:auto;margin-right:auto;}
  .page-home .footer-contact address {justify-items:center;}
  .page-home .footer-contact address a {width:auto;}
}

/* Compact closing banner: let the headline use the available desktop width.
   Keep the original chocolate photographic background and approved wording. */
.page-home .endcap {
  padding: 36px 24px 35px;
  text-align: center;
}
.page-home .endcap h2 {
  max-width: 1480px;
  margin: 0 auto 12px;
  font-size: clamp(1.9rem, 2.45vw, 2.55rem);
  line-height: 1.12;
}
.page-home .endcap p {
  max-width: 780px;
  margin: 0 auto;
  font-size: clamp(.95rem, 1.18vw, 1.07rem);
  line-height: 1.52;
}
.page-home .endcap .endcap-signoff {
  margin-top: 14px;
}
.page-home .endcap .endcap-signoff strong {
  font-family: Georgia, serif;
  font-size: clamp(1rem, 1.5vw, 1.16rem);
  font-weight: 600;
  line-height: 1.45;
}
@media (max-width: 680px) {
  .page-home .endcap {padding: 29px 18px 30px;}
  .page-home .endcap h2 {font-size: clamp(1.42rem, 6vw, 1.8rem);}
  .page-home .endcap .endcap-signoff {margin-top: 13px;}
}
