/* Restructure mock additions (Designer layout, Oct 28 2026). Service colors only as bars, chips, icon backgrounds, card top borders. */
:root{--fd:#00A39B;--st:#FF6B4A;--so:#FFD23F}
.nav-links a[aria-current=page]{color:#fff;text-decoration:underline;text-decoration-color:var(--aqua);text-decoration-thickness:3px;text-underline-offset:8px}
.tabbar{position:sticky;top:68px;z-index:49;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 2px 8px rgba(7,59,76,.06)}
.tabbar ul{display:flex;gap:4px;margin:0;padding:0 12px;list-style:none;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabbar ul::-webkit-scrollbar{display:none}
.tabbar a{display:flex;align-items:center;min-height:48px;padding:0 14px;white-space:nowrap;font-weight:650;color:var(--deep);text-decoration:none;border-bottom:3px solid transparent}
.tabbar a[aria-current=page]{border-bottom-color:var(--teal-dark);color:var(--deep)}
@media (min-width:960px){.tabbar{display:none}}
.svc-hero{border-top:6px solid var(--svc,var(--teal))}
.chip{display:inline-block;font-size:.85rem;font-weight:700;letter-spacing:.04em;padding:5px 12px;border-radius:999px;background:var(--svc,var(--teal));color:var(--deep);margin-bottom:16px}
.chip.coral{background:var(--st);color:#fff;font-size:1.17rem}
.svc3{display:grid;gap:20px}
@media (min-width:900px){.svc3{grid-template-columns:repeat(3,1fr)}}
.svc-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-top:6px solid var(--svc);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.svc-card .from{font-weight:700;color:var(--deep);margin:auto 0 12px;font-size:1.1rem}
.svc-card .go{font-weight:700}
.ico{width:46px;height:46px;border-radius:12px;background:var(--svc);display:grid;place-items:center;margin-bottom:14px;color:var(--deep);font-weight:800}
.fd{--svc:var(--fd)}.st{--svc:var(--st)}.so{--svc:var(--so)}
.steps3{display:grid;gap:18px;counter-reset:s;list-style:none;padding:0;margin:0}
@media (min-width:768px){.steps3{grid-template-columns:repeat(3,1fr)}}
.steps4{display:grid;gap:18px;list-style:none;padding:0;margin:0}
@media (min-width:900px){.steps4{grid-template-columns:repeat(4,1fr)}}
.steps3 li,.steps4 li{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:22px;counter-increment:s}
.steps3 li::before,.steps4 li::before{content:counter(s);display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--deep);color:#fff;font-weight:700;margin-bottom:10px}
.pgrid{display:grid;gap:20px}
@media (min-width:768px){.pgrid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.pgrid.four{grid-template-columns:repeat(4,1fr)}.pgrid.three{grid-template-columns:repeat(3,1fr)}}
.pcard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-top:6px solid var(--svc,var(--teal));border-radius:18px;padding:24px;box-shadow:var(--shadow)}
.pcard .amt{font-size:2.2rem;font-weight:800;color:var(--deep);line-height:1}
.pcard .per{color:var(--muted);font-weight:500;margin-left:4px}
.pcard ul{margin:14px 0 0;padding-left:18px}
.pcard li{margin:4px 0}
.price-line{font-size:.95rem;color:var(--muted);margin-top:18px}
.price-off{font-weight:700;color:var(--deep);font-size:1.15rem}
.notes{background:var(--bg-soft);border-radius:var(--radius);padding:22px 24px}
.notes ul{margin:8px 0 0;padding-left:18px}
.samples{display:grid;gap:18px}
@media (min-width:768px){.samples{grid-template-columns:repeat(3,1fr)}}
.samples figure{margin:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.samples img{border-radius:10px;width:100%;height:220px;object-fit:contain;background:#F7FAFA}
.samples figcaption{font-size:.9rem;color:var(--muted);margin-top:8px}
.bundles{display:grid;gap:18px}
@media (min-width:900px){.bundles{grid-template-columns:repeat(3,1fr)}}
.bcard{background:var(--deep);color:#fff;border-radius:18px;padding:26px}
.bcard h3{color:#fff;font-size:1.1rem}
.bcard .amt{font-size:2rem;font-weight:800;color:var(--yellow)}
.bcard .per{color:#BFDDE2}
.teaser{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;background:var(--bg-soft);border-radius:20px;padding:28px}
.other{display:grid;gap:16px}
@media (min-width:768px){.other{grid-template-columns:repeat(2,1fr)}}
.slogan-line{color:var(--yellow);font-weight:700;font-size:1.2rem;margin:-6px 0 14px}
.mock-flag{position:absolute;top:4px;left:50%;transform:translateX(-50%);z-index:60;background:#FF6B4A;color:#fff;font:700 11px Outfit,sans-serif;padding:3px 8px;border-radius:6px}
/* tier cards reuse the live .plans/.plan component; these only add layout + service color */
.plans.two{max-width:860px}
@media (min-width:960px){.plans.two{grid-template-columns:repeat(2,1fr)}}
.plans.small .plan{padding:22px}.plans.small .plan .amt{font-size:2rem}
.tier-h{margin:28px 0 14px;font-size:1.25rem}
.plan.fd,.plan.st,.plan.so{border-top-width:6px;border-top-style:solid}
.plan.st{border-top-color:var(--st)}.plan.so{border-top-color:var(--so)}.plan.fd{border-top-color:var(--fd)}
.plan .price .price-off{display:block;font-weight:700;color:var(--deep);font-size:1.05rem;padding:6px 0}
.addon{margin-top:16px;font-weight:600;max-width:860px}
.bnotes{margin-top:18px;padding-left:20px}
table.disc{margin-top:18px;border-collapse:collapse;max-width:860px;width:100%;background:#fff}
table.disc th,table.disc td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.svc-note{background:#FFF8DA;border:1px solid #F3DE8A;border-radius:12px;padding:12px 14px;margin:0 0 18px;color:var(--deep);font-weight:500}
.ai-line{font-size:.88rem;color:var(--muted);margin:0 0 16px;font-style:italic}.svc-card .ai-line{margin:8px 0 0}
/* EXAMPLE layout mock only (--compare-example); never in a site build */
.cmp-example{position:relative;overflow:hidden}
.cmp-watermark{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:5;font:800 clamp(48px,9vw,120px)/1 Outfit,sans-serif;color:rgba(255,107,74,.22);transform:rotate(-14deg);letter-spacing:.06em}
/* ---- Designer FIX-LIST 3:01 + addendum 3:15 PM CT Oct 28 (overrides live here, never in styles.css) ---- */
/* fix 5a: hyphenated word never splits; H1 size at 380px and below */
.nb{white-space:nowrap}
@media (max-width:380px){.hero h1{font-size:2rem}}
/* fix 7: contrast (WCAG AA) */
.chip,.chip.coral,.ico,.svc-card .ico{color:#052B38}
.btn-teal,.plan.featured .ribbon{background:#007F79;color:#fff}
.btn-teal:hover,.btn-teal:focus-visible{background:#006B66}
.cc-tag{color:#006B66}
/* fix 8 / G1: no non-legal text under 14px */
.kicker,.eyebrow .eb-line,.chip,.chip.coral,.site-footer h3,.foot-social-label,.plan .ribbon,.cc-tag{font-size:.875rem}
/* fix 9 / G2: 44px tap targets */
.nav .brand,.svc-card .go{display:inline-flex;align-items:center;min-height:44px}
.demo-note a{display:inline-block;padding:12px 0}
/* setup S1-S4 */
.setup-form .row2{row-gap:18px;margin-bottom:18px}
.setup-form .row2 .field{margin-bottom:0}
.setup-form input,.setup-form select,.setup-form textarea{border-color:#6B8790}
.setup-form ::placeholder{color:#5F7A83}
.setup-form .step{background:#007F79}
/* Designer r2 (3:42 PM CT Oct 28) */
/* R4: text-like inputs need the 3:1 border too (styles.css .setup-form input[type="text"] is 0,2,1, so match it) */
.setup-form input[type=text],.setup-form input[type=email],.setup-form input[type=tel],.setup-form input[type=url],.setup-form input[type=date]{border-color:#6B8790}
/* R5: .nb{white-space:nowrap} already defined above; .nowrap kept for the live About markup */
.nowrap{white-space:nowrap}
/* Jarvis 3:42: setup-thanks body text at least 14px (wizard labels 11.52px, verse tag 11.52px) */
.thanks-steps li span.lbl,.thanks-card .verse-tag{font-size:14px}
@media (max-width:479px){.thanks-steps li span.lbl{font-size:14px}}   /* overrides styles.css L442 (.72rem = 11.52px) */
/* Oct 31: Designer fix 1, setup-thanks steps at 360 (replaces the 14px-only spacing) */
@media (max-width:479px){.thanks-steps{grid-template-columns:repeat(3,1fr);column-gap:12px;row-gap:16px}.thanks-steps li:nth-child(4)::before{display:none}}
/* Oct 31: room for a 4th spotlight (WEB_SPOTLIGHT, off by default) */
@media (min-width:900px){.svc3.svc4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1200px){.svc3.svc4{grid-template-columns:repeat(4,1fr)}}
/* Oct 31: price-builder slot (mock-only placeholder until Designer's drop-in lands) */
.builder-slot{border:2px dashed #6B8790;border-radius:12px;padding:24px;color:var(--deep);font-weight:600;text-align:center}
@media (max-width:479px){.tabbar.tabs5 ul{gap:0;padding:0 6px}.tabbar.tabs5 a{padding:0 7px;font-size:.95rem}}   /* 5 tabs fit at 360 when WEB_SPOTLIGHT is on */
/* Designer visual pass Oct 31 (V1-V8, V12-V20) */
.thanks-card .lede a{color:#FFFFFF;text-decoration-color:#5CE1E6}                                  /* V1 */
.setup-form input:focus-visible,.setup-form select:focus-visible,.setup-form textarea:focus-visible{outline:3px solid #007F79;outline-offset:2px;border-color:#007F79}   /* V2 (after R4) */
.site-footer ul{gap:0}.site-footer ul a{display:inline-flex;align-items:center;min-height:44px}   /* V3 */
.svc-card .ai-line{margin:8px 0 12px;text-wrap:balance}                                          /* V4 (works with either Studio line) */
.call-card .cc-top{flex-wrap:wrap;row-gap:6px}.cc-tag,.cc-time{white-space:nowrap}               /* V5 */
body .post-date{font-size:.875rem}                                                                /* V6 */
#builder{padding-top:40px;padding-bottom:8px}                                                     /* V8: include.html brings no section padding (Designer to check) */
h1,h2,h3,summary,.btn,figcaption,.plan .for,.svc-card .from{text-wrap:balance}p,li,dd,td{text-wrap:pretty}   /* V13 (+V15) */
@media (max-width:479px){#mission-title{font-size:1.5rem;text-wrap:balance}}                     /* V14 */
.eyebrow .sep{color:#5CE1E6}                                                                      /* V18 */
