.dog-story-section { padding:32px 0 0; }
.hero-banner { display:grid; grid-template-columns:minmax(0,53fr) minmax(0,47fr); overflow:hidden; min-height:500px; border-radius:26px; background:#171210; color:var(--cream-2); }
.hero-banner-photo { position:relative; width:100%; min-width:0; min-height:0; align-self:stretch; overflow:hidden; isolation:isolate; }
/* Show only the photo area of the supplied reference; all copy below is live HTML. */
.hero-banner-photo img { position:absolute; display:block; width:auto; max-width:none; height:129.5%; top:-3.7%; left:0; transform:translateX(-4.85%); }
.hero-banner-photo::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent 77%,#171210 100%); pointer-events:none; }
.hero-banner-copy { position:relative; z-index:1; min-width:0; align-self:center; padding:46px 44px 46px 26px; }
.hero-banner-copy .eyebrow { color:#e49b85; font-size:11px; letter-spacing:2.3px; margin-bottom:20px; }
.hero-banner-copy h2 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(34px,3.6vw,52px); font-weight:400; letter-spacing:-1.3px; line-height:1.1; }
.hero-banner-copy p { max-width:370px; margin:24px 0 28px; font-size:16px; line-height:1.65; color:#e4ddd6; }
.hero-banner-copy .btn { min-height:48px; padding:0 22px; font-size:14px; }
.hero-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); padding:34px 0; border-bottom:1px solid var(--line); }
.hero-benefit { padding:0 28px; border-left:1px solid var(--line); }
.hero-benefit:first-child { padding-left:20px; border-left:0; }
.hero-benefit h2 { font-family:var(--body); font-size:16px; line-height:1.4; font-weight:700; letter-spacing:0; margin-bottom:8px; }
.hero-benefit p { font-size:13px; color:var(--muted); line-height:1.6; }
@media(max-width:900px) { .hero-banner { min-height:420px; } .hero-banner-copy { padding:34px 28px 34px 20px; } .hero-banner-copy h2 { font-size:34px; } .hero-banner-copy p { font-size:14px; } .hero-benefit { padding:0 18px; } }
@media(max-width:600px) { .dog-story-section { padding-top:18px; } .hero-banner { grid-template-columns:1fr; min-height:0; border-radius:20px; } .hero-banner-photo { min-height:0; aspect-ratio:1.2; } .hero-banner-photo::after { background:linear-gradient(180deg,transparent 83%,#171210 100%); } .hero-banner-copy { padding:28px 24px 32px; } .hero-banner-copy h2 { font-size:34px; letter-spacing:-1px; } .hero-banner-copy .eyebrow { margin-bottom:16px; } .hero-banner-copy p { margin:20px 0 24px; } .hero-benefits { grid-template-columns:1fr; padding:8px 0; } .hero-benefit,.hero-benefit:first-child { border-left:0; padding:20px 0; } .hero-benefit + .hero-benefit { border-top:1px solid var(--line); } }