@import url('/concierge/fonts/fonts.css');
:root { color:#302d28;background:#f8f6f1;font-family:'DM Sans',sans-serif;font-size:15px;--muted:#6b645b;--line:#ded9ce }
* { box-sizing:border-box }
body { margin:0 }
a { color:inherit;text-decoration:none }
button, input, select { font:inherit }
button, a, input, summary { touch-action:manipulation }
button, a:focus-visible, input:focus-visible, summary:focus-visible { outline-offset:5px }
button { cursor:pointer }
header, footer { display:flex;align-items:center;justify-content:space-between;max-width:1320px;margin:auto;padding:27px 5vw }
header { border-bottom:1px solid var(--line) }
header>span, footer { font-size:12px;color:var(--muted) }
.wordmark { font-family:'Newsreader',Georgia,serif;font-size:43px;letter-spacing:-2px;line-height:1 }
.wordmark sup { font:9px sans-serif;letter-spacing:0;vertical-align:top;position:relative;top:7px }
h1, h2, h3, p { margin:0 }
h1, h2, h3 { font-family:'Newsreader',Georgia,serif;font-weight:400 }
h1 { font-size:clamp(36px,4vw,52px);line-height:1.04;letter-spacing:-1.6px }
h2 { font-size:34px;line-height:1.1 }
p { line-height:1.65 }
.eyebrow { font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--muted);margin-bottom:22px }
.lead { color:var(--muted);font-size:16px;margin:22px 0 30px;max-width:370px }
.button { display:inline-flex;align-items:center;justify-content:center;gap:24px;background:#393d32;color:#fff;padding:16px 24px;border:0;border-radius:7px;min-height:52px;line-height:1.3 }
.button:hover { background:#24291f }
.secondary { background:transparent;color:#393d32;border:1px solid var(--line) }
.secondary:hover { background:#eeeae1 }
.text-link { display:inline-flex;align-items:center;font-size:13px;min-height:44px;text-decoration:underline;text-underline-offset:5px }
.landing { max-width:1220px;margin:0 auto;display:grid;grid-template-columns:1.1fr 1fr;gap:7vw;align-items:center;padding:54px 5vw 68px }
.landing-photo { margin:0;min-width:0 }
.landing-image { display:block;aspect-ratio:4/5;object-fit:cover;width:100%;height:auto;border-radius:3px }
.landing-photo figcaption { margin-top:9px;font-size:11px;color:var(--muted) }
.landing-photo figcaption a { text-decoration:underline;text-underline-offset:3px }
.fine { font-size:13px;color:var(--muted);line-height:1.6;margin-top:18px;max-width:380px }
.number { display:block;font-size:13px;margin-top:18px;letter-spacing:.5px }
.steps { border-top:1px solid var(--line);padding-top:26px;margin-top:34px;display:grid;gap:16px;font-size:13px;color:var(--muted) }
.steps b { font-weight:500;color:#302d28;margin-right:14px }
.hint { font-size:13px;color:var(--muted);text-align:center;margin-top:12px }
details { border-top:1px solid var(--line);margin-top:30px;padding:20px 0;color:var(--muted);font-size:13px }
summary { cursor:pointer;color:#302d28;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;list-style:none;font-size:15px }
summary::-webkit-details-marker { display:none }
summary:after { content:"+";font-size:20px }
details[open]>summary:after { content:"−" }
details p { margin-top:16px }
details img { width:100%;max-width:220px }
details video { width:100%;margin-top:18px;border-radius:4px }
.status { display:block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:16px }
.loading, .error { max-width:600px;margin:100px auto;padding:30px;text-align:center }
.loading { color:var(--muted) }
[hidden] { display:none!important }
.demo { max-width:1100px;margin:50px auto;padding:0 5vw;display:grid;grid-template-columns:1fr 1fr;gap:70px }
.demo-intro { padding-top:45px }
.phone { background:#fff;border:1px solid var(--line);border-radius:28px;padding:20px;box-shadow:0 18px 60px #43331d08;max-width:430px }
.phone-head { text-align:center;border-bottom:1px solid #eee;padding:8px 0 18px }
.phone-head b { font-family:'Newsreader',serif;font-size:28px;font-weight:400 }
.transcript { height:480px;overflow:auto;padding:20px 0;scroll-behavior:smooth }
.bubble { background:#f1f0eb;border-radius:17px 17px 17px 4px;max-width:92%;padding:13px 15px;margin-bottom:13px;font-size:13px;line-height:1.55;white-space:pre-line }
.bubble.user { background:#4d5846;color:#fff;margin-left:auto;border-radius:17px 17px 4px 17px;max-width:84% }
.card { width:100%;border-radius:9px;margin-bottom:12px }
.demo-suggestions { display:flex;flex-wrap:wrap;gap:7px;padding:12px 0 }
.chip { background:#fff;border:1px solid var(--line);border-radius:20px;padding:9px 13px;font-size:12px }
.composer { display:flex;gap:8px }
.composer input { min-width:0;flex:1;border:1px solid var(--line);border-radius:22px;padding:12px }
.composer button { border:0;border-radius:50%;width:42px;background:#3b4435;color:white }
.story { font-family:'Newsreader',serif;font-size:23px;line-height:1.35;margin-bottom:22px }
.screenreader { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%) }
@media(max-width:720px) {
  header, footer { padding:23px }
  header>span { font-size:11px }
  .wordmark { font-size:37px }
  .landing { grid-template-columns:1fr;gap:30px;padding:25px 22px 40px }
  .landing-image { aspect-ratio:5/4;object-position:50% 56% }
  .landing h1 { font-size:48px }
  .lead { margin:16px 0 23px }
  .eyebrow { margin-bottom:16px }
  .demo { grid-template-columns:1fr;gap:26px;margin:28px auto;padding:0 20px }
  .demo-intro { padding-top:0 }
  .demo-intro h1 { font-size:42px }
  .phone { width:100%;max-width:none }
  .transcript { height:420px }
  .steps { margin-top:25px }
  footer { gap:20px;font-size:11px }
  .fine { max-width:none }
}
@media(prefers-reduced-motion:reduce) {
  * { scroll-behavior:auto!important }
}
.collection-strip, .store-faq { max-width:1220px;margin:auto;padding:64px 5vw;border-top:1px solid var(--line) }
.section-heading { display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:30px }
.section-heading .eyebrow { margin-bottom:15px }
.collection-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:24px }
.collection-card img { width:100%;aspect-ratio:1;object-fit:contain;background:white;border-radius:3px }
.collection-card h3 { font-size:25px;margin-top:18px }
.collection-card p { color:var(--muted);font-size:12px;margin-top:7px }
.store-faq { display:grid;grid-template-columns:1fr 1fr;gap:7vw }
.store-faq details { margin-top:0;padding:23px 0 }
.store-faq details:first-child { border-top:0 }
.collection-strip>.fine { max-width:600px;margin-top:26px }
.button:disabled { opacity:.45;cursor:default }
@media(max-width:720px) {
  .collection-strip, .store-faq { padding:40px 22px }
  .collection-grid { gap:10px;grid-template-columns:1fr }
  .collection-card { display:grid;grid-template-columns:120px 1fr;column-gap:18px;align-items:center;border-bottom:1px solid var(--line);padding:15px 0 }
  .collection-card img { grid-row:span 2 }
  .collection-card h3 { font-size:25px;margin:0;align-self:end }
  .collection-card p { align-self:start;margin-top:9px }
  .section-heading { align-items:start;flex-direction:column }
  .store-faq { grid-template-columns:1fr;gap:20px }
}
.bubble.user { background:#0a84ff }
.suggestions-label { font-size:11px;color:var(--muted);margin-top:10px }
.preview-link { display:block;border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:15px;background:#faf9f5;max-width:92% }
.preview-link img { border-radius:0;margin:0;display:block }
.preview-link strong, .preview-link span { display:block;padding:0 13px;font-size:13px;font-weight:500 }
.preview-link strong { padding-top:12px }
.preview-link span { font-size:11px;color:var(--muted);padding-bottom:13px;padding-top:4px }
/* Customer flow: clear prices, one primary action and readable supporting text. */
:where(a, button, input, select, summary):focus-visible { outline:2px solid #59684d;outline-offset:4px }
