/* Homepage composition and image-specific crops only. */
.hero { position: relative; isolation: isolate; min-height: calc(100svh - var(--header-height)); display: grid; align-items: center; overflow: hidden; }
.hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 58%; z-index: -2; }
.hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, var(--cream) 0%, #fff8effc 25%, #fff8efd9 35%, #fff8ef55 48%, #fff8ef00 62%); }
.hero-copy { max-width: 540px; padding-block: var(--space-8); }
.hero h1 { max-width: 530px; }
.hero .intro { font-size: 22px; line-height: 1.5; max-width: 440px; margin-block: var(--space-3); }
.trust-grid { display: grid; grid-template-columns: 1.35fr repeat(3,1fr); align-items: center; gap: var(--space-5); padding-block: var(--space-4); }
.trust-grid h2 { font-size: 38px; }
.trust-item { border-left: 1px solid var(--line); padding-left: var(--space-5); }
.trust-item p { margin-top: var(--space-1); font-size: 17px; }
.services-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: var(--space-4); margin-top: var(--space-3); }
.crop-coffee img { width: 220%; max-width: none; height: 220%; object-position: 43% 62%; transform: translate(-23%,-36%); }
.crop-cake img { width: 250%; max-width: none; height: 250%; transform: translate(-56%,-23%); }
.crop-brunch img { width: 170%; max-width: none; height: 170%; transform: translate(-18%,-30%); }
.crop-terrace img { object-position: left center; }
.pricing-grid { display: grid; grid-template-columns: 1.65fr repeat(3,1fr); gap: var(--space-4); }
.pricing-intro { padding-right: var(--space-3); }
.pricing-intro p { margin-top: var(--space-3); }
.reviews-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); margin-top: var(--space-4); }
.cta { background: var(--accent); color: var(--white); }
.cta-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); }
.cta p { margin-top: var(--space-2); }
.cta .button { flex-shrink: 0; background: var(--cream); color: var(--accent); }
.cta .button:hover { color: var(--white); background: var(--ink); }
@media(min-width: 1600px) {
.hero-photo { object-position: center 60%; }
}
@media(max-width: 1200px) {
.hero-copy { max-width: 460px; }
.hero .intro { font-size: 20px; max-width: 380px; }
.services-grid { gap: 24px; }
.trust-grid { gap: 24px; }
.trust-item { padding-left: 24px; }
.trust-grid h2 { font-size: 32px; }
.pricing-grid { grid-template-columns: repeat(3,1fr); }
.pricing-intro { grid-column: 1/-1; }
.pricing-intro p { margin-top: 16px; }
}
@media(max-width: 900px) {
.hero-copy { max-width: 420px; }
.hero::before { background: linear-gradient(90deg,#fff8efff 0%,#fff8eff2 30%,#fff8efb8 48%,#fff8ef00 85%); }
.hero-photo { object-position: 60% center; }
.trust-grid { grid-template-columns: repeat(3,1fr); }
.trust-grid > h2 { grid-column: 1/-1; }
.trust-grid h2::after { margin-top: 16px; }
.trust-item { padding-left: 16px; }
.services-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px 24px; }
.cta-inner { align-items: flex-start; flex-direction: column; gap: 24px; }
}
@media(max-width: 600px) {
.hero { align-items: start; }
.hero-copy { padding-block: 48px 300px; }
.hero .intro { font-size: 18px; max-width: 32ch; }
.hero-photo { object-position: 63% bottom; }
.hero::before { background: linear-gradient(180deg,#fff8efff 0%,#fff8eff5 28%,#fff8efdd 44%,#fff8ef00 72%); }
.trust-grid { grid-template-columns: 1fr; gap: 24px; padding-block: 32px; }
.trust-item { padding-left: 24px; }
.services-grid { grid-template-columns: 1fr 1fr; gap: 32px 16px; }
.pricing-grid { grid-template-columns: 1fr; gap: 32px; }
.reviews-grid { grid-template-columns: 1fr; gap: 32px; }
}