/* Happy Paws Grooming — reusable showroom example theme */
:root{
  --brand:#1E9E9E;--brand-dark:#126363;--brand-wash:#E1F4F2;
  --action:#F4B740;--action-dark:#D69419;--action-ink:#3A2A08;
  --cream:#FFF8EB;--ink:#183536;--gold:#FFD978;--scrim:rgba(14, 85, 85, 0.64);
}
.brand img{height:46px;width:46px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.08))}
.hero--showroom{min-height:680px}
.hero--showroom .hero__overlay{background:linear-gradient(90deg,color-mix(in srgb,var(--brand-dark) 96%,transparent) 0%,color-mix(in srgb,var(--brand-dark) 78%,transparent) 43%,color-mix(in srgb,var(--brand-dark) 30%,transparent) 76%,color-mix(in srgb,var(--brand-dark) 14%,transparent) 100%),linear-gradient(0deg,color-mix(in srgb,var(--brand-dark) 46%,transparent),transparent 48%)}
.hero--showroom .hero__in{max-width:760px;padding-top:88px;padding-bottom:132px}
.hero-note{display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding:10px 14px;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:rgba(255,255,255,.1);color:#fff;font-size:13px;font-weight:700;backdrop-filter:blur(8px)}
.hero-note::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 5px color-mix(in srgb,var(--gold) 18%,transparent)}
.card{position:relative;overflow:hidden}.card::after{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,var(--brand),var(--action));opacity:0;transition:opacity .25s ease}.card:hover::after{opacity:1}
.surface-story{padding:112px 0;background:#fff}.surface-story__head{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.75fr);gap:56px;align-items:end;margin-bottom:44px}.surface-story__head .section-title,.surface-story__head .section-sub{margin-left:0;margin-right:0;text-align:left}.surface-story__head .section-sub{margin-bottom:5px}.surface-story__grid{display:grid;grid-template-columns:1.15fr .85fr;gap:24px}.surface-panel{position:relative;min-height:430px;border-radius:30px;overflow:hidden;isolation:isolate;box-shadow:0 24px 60px -34px color-mix(in srgb,var(--brand) 55%,transparent)}.surface-panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}.surface-panel:hover img{transform:scale(1.035)}.surface-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,color-mix(in srgb,var(--brand-dark) 92%,transparent),transparent 68%);z-index:1}.surface-panel__copy{position:absolute;z-index:2;left:30px;right:30px;bottom:28px;color:#fff}.surface-panel__tag{display:inline-flex;padding:6px 10px;border-radius:999px;background:var(--gold);color:#332708;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px}.surface-panel h3{font-size:clamp(23px,3vw,31px);margin-bottom:8px;color:#fff}.surface-panel p{max-width:510px;color:rgba(255,255,255,.88);font-size:15px}
.finish{padding:104px 0;background:linear-gradient(135deg,var(--brand-dark),color-mix(in srgb,var(--brand-dark) 70%,#101820));color:#fff}.finish .section-title{color:#fff}.finish .section-sub{color:rgba(255,255,255,.75)}.finish__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}.finish__item{padding:30px;border:1px solid rgba(255,255,255,.14);border-radius:24px;background:rgba(255,255,255,.075);box-shadow:inset 0 1px rgba(255,255,255,.08)}.finish__icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:18px;border-radius:15px;background:var(--gold);color:#302405;font-size:22px;font-weight:900}.finish__item h3{color:#fff;font-size:20px;margin-bottom:9px}.finish__item p{color:rgba(255,255,255,.76);font-size:14.5px;line-height:1.7}
.steps-section{background:var(--cream)}.steps-section .step{background:#fff}
.faq{padding:108px 0;background:#fff}.faq__layout{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);gap:64px;align-items:start}.faq__intro .section-title,.faq__intro .section-sub{text-align:left;margin-left:0;margin-right:0}.faq__list{display:grid;gap:13px}.faq details{border:1px solid color-mix(in srgb,var(--brand) 16%,transparent);border-radius:18px;background:var(--cream);padding:0 22px}.faq summary{cursor:pointer;list-style:none;padding:20px 34px 20px 0;color:var(--brand-dark);font-family:'Plus Jakarta Sans','Inter',sans-serif;font-weight:800;position:relative}.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";position:absolute;right:0;top:17px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--brand-wash);color:var(--brand);font-size:19px}.faq details[open] summary::after{content:"–"}.faq details p{padding:0 34px 20px 0;color:#5d6870;font-size:14.5px;line-height:1.7}
.contact__panel{border:1px solid color-mix(in srgb,var(--brand) 13%,transparent)}.footer{background:var(--brand-dark)}
@media(max-width:900px){.surface-story__head,.faq__layout{grid-template-columns:1fr;gap:18px}.surface-story__grid{grid-template-columns:1fr}.surface-panel{min-height:390px}.finish__grid{grid-template-columns:1fr}}
@media(max-width:640px){.brand img{height:42px;width:42px}.hero--showroom{min-height:640px}.hero--showroom .hero__overlay{background:linear-gradient(90deg,color-mix(in srgb,var(--brand-dark) 92%,transparent),color-mix(in srgb,var(--brand-dark) 58%,transparent)),linear-gradient(0deg,color-mix(in srgb,var(--brand-dark) 54%,transparent),transparent 50%)}.hero--showroom .hero__in{padding-top:56px;padding-bottom:112px}.hero-note{font-size:11.5px;margin-top:22px}.surface-story,.faq{padding:82px 0}.surface-panel{min-height:350px;border-radius:24px}.surface-panel__copy{left:22px;right:22px;bottom:22px}.finish{padding:82px 0}.finish__item{padding:25px}}
