/* Project-specific additions. Keep this small. */
/* Pricing cards: one column on phone, two on tablet */
@media (max-width: 900px) { .plans.grid.cols-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .plans.grid.cols-3 { grid-template-columns: 1fr; } }
/* Fairview pages: doc kind with a full-width site layout and a green accent */
body.k-doc:has(.fv) main.doc { max-width: none; padding: 0; gap: 0; }
.fv { --primary: #0f7a4a; --primary-fg: #ffffff; }
.fv .site-head { border-bottom: 1px solid var(--border); background: var(--bg); }
.fv .site-head .container { display: flex; align-items: center; gap: 28px; height: 68px; }
.fv .site-logo { display: flex; align-items: center; gap: 10px; font-weight: 600; color: var(--fg); text-decoration: none; }
.fv .site-nav { display: flex; gap: 20px; font-size: 14px; color: var(--muted-fg); }
.fv .sp { flex: 1; }
.fv .site-foot { border-top: 1px solid var(--border); padding: 32px 0 40px; background: var(--surface); color: var(--muted-fg); font-size: 13.5px; }
.score { width: 72px; height: 72px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: 24px; color: #fff; background: conic-gradient(var(--primary) calc(var(--v) * 1%), var(--border) 0); position: relative; }
.score::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: var(--bg); }
.score span { position: relative; z-index: 1; color: var(--fg); }
.fv .proof { border-left: 3px solid var(--primary); padding-left: 12px; }
@media (max-width: 767px) { .fv .site-head .container { height: 58px; gap: 12px; } .fv .site-nav { display: none; } }

/* mix slider (WA02) */
.mix{display:flex;flex-direction:column;gap:6px}
.mix .track{position:relative;height:6px;border-radius:3px;background:var(--line,#e6e3dc)}
.mix .track i{position:absolute;left:0;top:0;height:100%;border-radius:3px;background:var(--primary)}
.mix .track b{position:absolute;top:50%;width:18px;height:18px;border-radius:50%;background:#fff;border:2px solid var(--primary);transform:translate(-50%,-50%);box-shadow:0 1px 3px rgba(0,0,0,.2)}
.mix .track b.ghost{border-style:dashed;background:transparent}
.usebar{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--line,#e6e3dc)}
.usebar i{display:block;height:100%}
.fv .site-head .search{flex:0 1 420px;margin-left:8px}

/* review round: phone rules */
@media (max-width: 600px) {
  .page-head { flex-wrap: wrap; } .page-head > .row { width: 100%; flex-wrap: wrap; } .page-head .btn { flex: 1 1 100%; }
  .table.stack tr { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; padding: 10px 0; border-bottom: 1px solid var(--border); }
  .table.stack th { display: none; } .table.stack td { border: 0; padding: 0; } .table.stack td:first-child { grid-column: 1 / -1; }
  .table.stack td .btn { width: 100%; margin-top: 6px; }
  .tabs { mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .sticky-bar { position: sticky; bottom: 64px; background: var(--bg); border-top: 1px solid var(--border); padding: 12px 16px; }
}

/* builder E */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal .dh{font-size:12px;color:var(--muted-fg);padding:0 4px 4px}
.cal .d{min-height:92px;border:1px solid var(--border);border-radius:8px;padding:6px;display:flex;flex-direction:column;gap:4px;background:var(--bg)}
.cal .d.off{background:var(--surface);opacity:.55}
.cal .d.today{border-color:var(--primary);box-shadow:inset 0 0 0 1px var(--primary)}
.cal .dn{font-size:12px;color:var(--muted-fg)}
.cal .it{font-size:12px;line-height:1.25;padding:3px 6px;border-radius:6px;background:var(--surface);border:1px solid var(--border)}
.cal .it.done{background:var(--surface);color:var(--muted-fg);text-decoration:line-through}
.cal .it.next{border-color:var(--primary);background:var(--bg)}
@media (max-width:600px){.cal{grid-template-columns:repeat(2,1fr)}.cal .dh{display:none}.cal .d.off{display:none}}

/* builder C */
.table-wrap.swipe .table { min-width: 640px; }
.table-wrap.swipe th:first-child, .table-wrap.swipe td:first-child { position: sticky; left: 0; z-index: 1; background: var(--bg); box-shadow: 1px 0 0 var(--border); }
@media (max-width: 600px) { body.k-doc .sticky-bar { bottom: 0; } }
@media (max-width: 600px) { .table.stack tr:has(th) { display: none; } }