/* The service pages added on 25 Oct 2026 (/website-chat/, /owner-hq/), on
   top of site.css: the hero's picture, the "what you get" list and the
   Owner HQ screens. Ink on white or shell; text keeps 4.5:1. */
.svc-visual { min-height: 0; }
.svc-chat { width: min(100%, 380px); margin: 0; border-radius: 18px; overflow: hidden; background: #fff; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .55), 0 0 0 1px rgba(8, 36, 50, .06); }
.svc-chat .widget-body { gap: 8px; }
.svc-row { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: #FBF8F2; color: #14201F; border-top: 1px solid #E2D9C8; font-size: 13.5px; }
.svc-row .icon { width: 18px; height: 18px; color: #136B80; flex: none; stroke-width: 2; }
.svc-row b { font-weight: 600; margin-right: 4px; }
.svc-note { margin: 0; padding: 10px 14px; background: #FBF8F2; color: #4F5A57; font-size: 12.5px; border-top: 1px solid #E2D9C8; }
.svc-shot { margin: 0; width: 100%; display: grid; gap: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 30px 60px -24px rgba(0, 0, 0, .6); }
.svc-shot img { display: block; width: 100%; height: auto; }
.svc-try { margin-top: 22px; color: var(--muted); }
.svc-try .text-link { padding: 0; }
.svc-rolling { background: rgba(184, 137, 58, .16); color: #6B4D17; box-shadow: inset 0 0 0 1px rgba(150, 112, 47, .35); }

/* What you get: icon, a short heading, one line. */
.svc-gets { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
@media (min-width: 720px) { .svc-gets { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .svc-gets { grid-template-columns: repeat(3, 1fr); gap: 22px; } }
.svc-get { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 14px; align-items: start; padding: 22px; border-radius: 18px; background: #fff; color: #14201F; border: 1px solid #E2D9C8; }
.svc-get .icon { width: 22px; height: 22px; color: #136B80; margin-top: 2px; stroke-width: 1.9; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.svc-get h3 { margin: 0 0 6px; font-size: 1.125rem; font-weight: 600; line-height: 1.3; }
.svc-get p { margin: 0; color: #4F5A57; font-size: 1rem; line-height: 1.5; }

/* Owner HQ's screens, one per thing it shows. */
.svc-shots { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
@media (min-width: 820px) { .svc-shots { grid-template-columns: repeat(3, 1fr); } }
.svc-shots figure { margin: 0; display: grid; gap: 14px; align-content: start; }
.svc-shots img { display: block; width: 100%; height: auto; border-radius: 16px; box-shadow: 0 0 0 1px var(--line), 0 24px 48px -28px rgba(0, 0, 0, .6); }
.svc-shots h3 { margin: 0 0 6px; font-size: 1.1875rem; font-weight: 600; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.svc-shots p { margin: 0; color: var(--muted); }
.svc-shots .soon { font-size: .75rem; }