/* The public tailor pages (built by scripts/build-tailor-pages.mjs), in the NebedaHub look */
:root { --navy: #0c1220; --gold: #c9a24a; --cream: #faf6ec; --line: #e7e0cf; --ink: #1c1811; --muted: #7a7262; }
* { box-sizing: border-box; }
body { margin: 0; font: 15px/1.5 Inter, Arial, sans-serif; background: var(--cream); color: var(--ink); }
.bar { background: var(--navy); display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; padding-top: max(12px, env(safe-area-inset-top)); flex-wrap: wrap; }
.brand { font: 700 26px/1 "Cormorant Garamond", Georgia, serif; letter-spacing: .06em; color: var(--gold); text-decoration: none; }
.bar-link { color: #f3ead1; text-decoration: none; border: 1px solid rgba(243,234,209,.4); border-radius: 999px; padding: 9px 14px; min-height: 44px; display: inline-flex; align-items: center; }
main { max-width: 860px; margin: 0 auto; padding: 18px 16px 40px; }
h1, h2 { font-family: "Cormorant Garamond", Georgia, serif; line-height: 1.15; }
h1 { font-size: 34px; margin: 6px 0 6px; }
h2 { font-size: 23px; margin: 26px 0 10px; }
h2 a { color: inherit; }
.crumbs { font-size: 13px; color: var(--muted); }
.crumbs a { color: var(--muted); }
.intro { color: var(--muted); margin: 0 0 12px; }
.gold { color: #8a6a1c; font-weight: 600; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.cta, .ghost { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 18px; border-radius: 10px; font-weight: 700; text-decoration: none; }
.cta { background: var(--gold); color: #1a1608; }
.ghost { border: 1px solid var(--navy); color: var(--navy); font-weight: 500; }
.cards { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.card a { display: grid; grid-template-columns: 56px 1fr; gap: 12px; align-items: center; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 12px; color: inherit; text-decoration: none; min-height: 72px; }
.card a:hover { border-color: var(--gold); }
.card img, .initials { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: var(--navy); color: var(--gold); display: grid; place-items: center; font: 700 20px Georgia, serif; }
.initials.big, .tailor .logo { width: 96px; height: 96px; font-size: 32px; border-radius: 50%; object-fit: cover; }
.card-text { display: flex; flex-direction: column; font-size: 13.5px; color: var(--muted); min-width: 0; }
.card-text b { color: var(--ink); font-size: 16px; }
.places { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; }
.places li { background: #fff; border: 1px solid var(--line); border-radius: 10px; display: flex; justify-content: space-between; align-items: center; }
.places a { flex: 1; padding: 12px; color: var(--ink); min-height: 44px; }
.places span { padding: 0 12px; color: var(--muted); font-size: 13px; }
.tailor { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: center; }
.tailor p { margin: 2px 0; }
.badges span, .tags span { display: inline-block; background: #f1ead6; color: #5a4712; border-radius: 999px; padding: 4px 10px; font-size: 12.5px; font-weight: 600; margin: 0 6px 6px 0; }
.about { white-space: pre-line; }
.portfolio { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.portfolio img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; display: block; }
.review { border-left: 3px solid var(--gold); padding: 4px 0 4px 10px; margin-bottom: 10px; }
.review small { color: var(--muted); display: block; }
.empty { color: var(--muted); font-style: italic; }
footer { text-align: center; color: var(--muted); font-size: 13px; padding: 20px 16px 40px; }
footer a { color: var(--muted); }
@media (max-width: 520px) { h1 { font-size: 28px; } .tailor { grid-template-columns: 72px 1fr; } .initials.big, .tailor .logo { width: 72px; height: 72px; } }
main a { color: var(--navy); }
.tailor .price { font-weight: 700; }
.tailor .price small { font-weight: 400; color: #8b8371; }
