/* ReplyInn v4: multi-property, analytics, review funnel, plans */

/* Sidebar sections + property switcher */
.side-sec{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:700;margin:16px 12px 6px}
.side-sec:first-child{margin-top:4px}
.switcher{margin:0 10px 8px}
.switcher select{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);padding:8px 30px 8px 10px;font:600 13px var(--font);color:var(--ink);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364767b' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;cursor:pointer}
.pill.grey{background:var(--line-2);color:var(--ink-2)}

/* Analytics */
.an-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.an-grid .card{margin:0}
@media(max-width:1100px){.an-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.an-grid{grid-template-columns:1fr}}
.chart{width:100%;height:auto;display:block;font-family:var(--font)}
.chart .grid{stroke:var(--line-2);stroke-width:1}
.chart .tick{font-size:10px;fill:var(--muted)}
.chart .bar{fill:var(--brand);opacity:.85;transition:opacity .15s}
.chart .bar:hover{opacity:1}
.chart .line{fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart .dot-pt{fill:#fff;stroke:var(--accent);stroke-width:2.5}
.lg{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-2px;margin-right:4px;background:var(--brand)}
.lg-line{background:var(--accent);height:3px;border-radius:2px;vertical-align:2px;width:16px}
.donut-wrap{display:flex;align-items:center;gap:18px}
.donut{width:150px;height:150px;flex:none}
.donut-label{font-size:26px;font-weight:800;fill:var(--ink);font-family:var(--font)}
.legend{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:13.5px}
.legend li{display:flex;align-items:center;gap:8px}
.legend i{width:10px;height:10px;border-radius:50%;display:inline-block}
.legend b{margin-left:auto;font-variant-numeric:tabular-nums}
.hbars{display:grid;gap:9px}
.hbar{display:grid;grid-template-columns:92px 1fr 36px;align-items:center;gap:10px;font-size:13px}
.hbar span{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hbar i{display:block;height:10px;background:var(--line-2);border-radius:99px;overflow:hidden}
.hbar b{display:block;height:100%;border-radius:99px;min-width:3px}
.hbar em{font-style:normal;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.kv{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--line-2);font-size:14px}
.kv:last-child{border-bottom:0}
.kv b{font-size:17px;font-variant-numeric:tabular-nums}

/* Feedback list */
.who{font-weight:700;margin-right:8px}

/* Plans (3 tiers) */
.plans3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.plans3{grid-template-columns:1fr}}
.plans3 .plan{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px 24px;display:flex;flex-direction:column;box-shadow:var(--sh-1)}
.plans3 .plan.featured{background:var(--night);color:#fff;border-color:transparent;box-shadow:0 30px 60px -20px rgba(6,23,26,.5)}
.plans3 .plan.featured h3{color:#fff}
.plans3 .ribbon{position:absolute;top:-11px;left:24px;background:var(--accent);color:var(--ink);font-size:10.5px;font-weight:800;letter-spacing:.1em;padding:4px 10px;border-radius:99px}
.plans3 h3{margin:0 0 2px;font-size:19px}
.plans3 .price{font-size:38px;font-weight:800;letter-spacing:-.03em;margin:14px 0 10px}
.plans3 .price span{font-size:14px;font-weight:500;color:var(--muted);letter-spacing:0}
.plans3 .checks{flex:1;margin:0 0 20px}
.plans3 .btn{width:100%;justify-content:center}

/* Public review funnel */
body.pub{background:radial-gradient(1200px 500px at 50% -10%,var(--brand-50),transparent 60%),var(--bg);min-height:100vh;margin:0;display:flex;flex-direction:column;font-family:var(--font);color:var(--ink)}
.pub-main{flex:1;display:flex;align-items:center;justify-content:center;padding:28px 16px}
.pub-foot{text-align:center;padding:18px;font-size:12.5px;color:var(--muted)}
.pub-foot a{color:var(--muted);font-weight:600;text-decoration:none}
.fun-card{width:100%;max-width:460px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);padding:36px 30px;box-shadow:var(--sh-3);text-align:center}
.fun-logo{width:60px;height:60px;border-radius:18px;margin:0 auto 16px;background:linear-gradient(135deg,var(--brand),var(--brand-700));color:#fff;font-weight:800;font-size:22px;display:flex;align-items:center;justify-content:center;letter-spacing:.02em}
.fun-card h1{font-size:24px;margin:0 0 6px;letter-spacing:-.02em}
.fun-card h2{font-size:19px;margin:0 0 6px;letter-spacing:-.01em}
.fun-sub{color:var(--muted);margin:0 0 20px;font-size:15px}
.fun-stars{display:flex;justify-content:center;gap:6px;margin:6px 0 10px}
.fun-star{background:none;border:0;padding:6px;cursor:pointer;border-radius:12px;transition:transform .12s}
.fun-star svg{width:44px;height:44px;fill:var(--line);stroke:none;transition:fill .12s,transform .12s}
.fun-star:hover{transform:scale(1.08)}
.fun-star.on svg,.fun-star:hover svg,.fun-star:has(~ .fun-star:hover) svg{fill:var(--accent)}
.fun-stars:hover .fun-star:hover ~ .fun-star svg{fill:var(--line)}
.fun-star:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.fun-step{margin-top:22px;padding-top:22px;border-top:1px solid var(--line-2);text-align:left;animation:funin .35s ease}
.fun-step h2,.fun-step .fun-sub{text-align:center}
@keyframes funin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.fun-links{display:grid;gap:10px}
.fun-links .btn{justify-content:center;width:100%}
.fun-card .row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:480px){.fun-card{padding:28px 20px}.fun-card .row{grid-template-columns:1fr}.fun-star svg{width:38px;height:38px}}
.fun-card .field{margin-bottom:10px}
.fun-card textarea,.fun-card input[type=text],.fun-card input[type=email]{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px;font:inherit;font-size:14.5px;box-sizing:border-box}
.fun-card textarea:focus,.fun-card input:focus{outline:2px solid var(--brand-100);border-color:var(--brand)}

/* Printable QR cards */
body.pub.print{background:#fff;display:block}
body.pub.print .pub-main{display:block;padding:0}
.print-bar{display:flex;gap:10px;justify-content:center;padding:18px;background:var(--bg);border-bottom:1px solid var(--line)}
.card-sheet{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:32px;max-width:900px;margin:0 auto}
.pcard{border:1.5px dashed var(--line);border-radius:18px;padding:34px 26px;text-align:center;break-inside:avoid;page-break-inside:avoid}
.pcard h1{font-size:22px;margin:0 0 6px;letter-spacing:-.02em}
.pcard p{color:var(--ink-2);margin:0 0 18px;font-size:15px}
.pcard img{width:220px;height:220px;display:block;margin:0 auto 14px}
.pcard-link{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:var(--ink-2);word-break:break-all}
.pcard-stars{color:var(--accent);font-size:22px;letter-spacing:4px;margin-top:10px}
@media print{.print-bar,.pub-foot{display:none!important}.card-sheet{padding:0;gap:16px}.pcard{border-color:#bbb}@page{margin:12mm}}
@media(max-width:700px){.card-sheet{grid-template-columns:1fr;padding:18px}}

/* Landing additions */
.v4-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center}
@media(max-width:860px){.v4-grid{grid-template-columns:1fr;gap:28px}}
.v4-grid.rev>:first-child{order:2}
@media(max-width:860px){.v4-grid.rev>:first-child{order:0}}
.phone{width:280px;margin:0 auto;background:var(--ink);border-radius:36px;padding:12px;box-shadow:var(--sh-3)}
.phone .scr{background:var(--bg);border-radius:26px;padding:26px 18px;text-align:center;min-height:420px}
.phone .fun-logo{width:46px;height:46px;font-size:17px;border-radius:14px}
.phone h4{margin:0 0 4px;font-size:16px}
.phone .fun-star svg{width:30px;height:30px}
.phone .fun-star:nth-child(-n+5) svg{fill:var(--accent)}
.phone .mini-btn{background:var(--brand);color:#fff;border-radius:9px;padding:9px;font-size:12.5px;font-weight:700;margin-top:10px}
.phone .mini-btn.g{background:var(--surface);color:var(--ink);border:1px solid var(--line)}
.an-demo{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px;box-shadow:var(--sh-2)}
.an-demo .chart{height:190px}
.an-demo .an-row{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted);margin-bottom:8px;font-weight:600}
.trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:900px){.trust-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.trust-grid{grid-template-columns:1fr}}
.trust{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.trust .ico{width:36px;height:36px;border-radius:10px;background:var(--brand-50);color:var(--brand);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.trust h4{margin:0 0 6px;font-size:15px}
.trust p{margin:0;font-size:13.5px;color:var(--muted);line-height:1.5}
.pricing .plans3 .plan{text-align:left}
.pricing .plans3 .ribbon{left:50%;transform:translateX(-50%)}
.num-strip{display:flex;flex-wrap:wrap;gap:12px 36px;justify-content:center;margin-top:28px}
.num-strip div{text-align:center}
.num-strip b{display:block;font-size:30px;font-weight:800;letter-spacing:-.03em;color:var(--brand)}
.num-strip span{font-size:13px;color:var(--muted)}
.seg{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:860px){.seg{grid-template-columns:1fr}}
.seg .card h4{margin:10px 0 6px;font-size:16px}
.seg .card p{font-size:14px;color:var(--ink-2);margin:0 0 10px;line-height:1.55}
.seg .tag{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--brand);background:var(--brand-50);padding:4px 9px;border-radius:99px}
.pricing:has(.plans3){display:block;max-width:1040px}
/* sidebar: scroll the nav, keep footer visible */
.side{overflow:hidden}
.side-nav{flex:1;overflow-y:auto;min-height:0;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent;margin:0 -4px;padding:0 4px}
.side-foot{flex:none}
@media(max-height:900px){.side-nav a{padding:7px 10px;font-size:13.5px}.side-sec{margin:10px 12px 4px}.plan-box{padding:9px 12px;margin-bottom:6px}}