/* ==========================================================================
   Tutor profile: booking card, bottom bar, tabs, FAQs, empty reviews
   (Redesign plan 2, Oct 2026). Loaded by tutor/show after nx-teaching.css.

   Colour roles (nx-roles.css): the booking card's "Book a free demo" is the
   page's one marigold action; WhatsApp is the green outline; Ask AI indigo;
   links sky; green tick only for "ID checked". Site tokens only.
   ========================================================================== */

/* ---- two columns: profile + sticky booking card ------------------------ */
body.page .nxpf{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}
body.page .nxpf__main{min-width:0}
body.page .nxpf__rail{position:sticky;top:var(--nx-book-top,96px);margin-top:18px}
@media (max-width:980px){
  body.page .nxpf{grid-template-columns:minmax(0,1fr)}
  /* the bottom bar replaces the card */
  body.page .nxpf__rail{display:none}
}

body.page .nxbook{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:var(--nxt-r-lg,22px);
  background:linear-gradient(180deg,var(--nxt-ink-700,#16223A),var(--nxt-ink-800,#101A2E));
  border:1px solid var(--nxt-line-strong);box-shadow:var(--nxt-e3)}
body.page .nxbook__kicker{margin:0;color:var(--nxt-text-dim);font-size:var(--nxt-t-micro);font-weight:800;letter-spacing:.07em;text-transform:uppercase}
body.page .nxbook__lead{margin:0;color:var(--nxt-text-dim);font-size:var(--nxt-t-sm);line-height:1.55}
body.page .nxbook__fee{margin:0;color:var(--nxt-text);line-height:1.2}
body.page .nxbook__fee b{font-family:var(--nxt-font-display);font-size:1.6rem;font-weight:800;letter-spacing:-.01em}
body.page .nxbook__fee span{color:var(--nxt-text-dim);font-size:var(--nxt-t-sm);font-weight:700;margin-left:4px}
body.page .nxbook__fee .nxbook__fee-none{display:block;margin:0;font-size:var(--nxt-t-sm);line-height:1.45}
body.page .nxbook__facts{display:grid;gap:6px;margin:2px 0 4px;padding:10px 0;border-block:1px solid var(--nxt-line)}
body.page .nxbook__facts > div{display:flex;justify-content:space-between;gap:10px;font-size:var(--nxt-t-sm)}
body.page .nxbook__facts dt{color:var(--nxt-text-dim);font-weight:700}
body.page .nxbook__facts dd{margin:0;color:var(--nxt-text);font-weight:800;text-align:right}
body.page .nxbook__facts dd a{color:var(--nxt-link);text-decoration:underline;text-decoration-color:var(--nxt-link-line);text-underline-offset:3px}
body.page .nxbook .nxbtn{width:100%;min-height:46px;gap:8px}
body.page .nxbook__cta{font-size:1rem}

/* WhatsApp: green outline, the second choice (only WhatsApp is green) */
body.page .nxbtn--wa{background:transparent;color:var(--nxt-whatsapp,#25D366);border:1px solid rgba(37,211,102,.55)}
body.page .nxbtn--wa:hover{background:rgba(37,211,102,.1);color:var(--nxt-whatsapp,#25D366);border-color:var(--nxt-whatsapp,#25D366)}

body.page .nxbook__ai{align-self:center;color:var(--nxt-ai);font-size:var(--nxt-t-sm);font-weight:800;text-decoration:underline;text-decoration-color:var(--nxt-ai-line);text-underline-offset:3px}
body.page .nxbook__promise{list-style:none;margin:4px 0 0;padding:10px 0 0;border-top:1px solid var(--nxt-line);display:grid;gap:6px}
body.page .nxbook__promise li{position:relative;padding-left:16px;color:var(--nxt-text-dim);font-size:var(--nxt-t-xs);line-height:1.45}
body.page .nxbook__promise li::before{content:"";position:absolute;left:2px;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--nxt-text-faint)}
body.page .nxbook__ok{display:flex;align-items:center;gap:6px;margin:0;color:var(--nxt-verify);font-size:var(--nxt-t-xs);font-weight:800}

/* The About tank keeps its buttons, but beside the booking card (and above
   the bottom bar) its demo button is a quiet outline: one marigold per screen. */
body.page .nxpf .nxtank__btn--act{background:transparent;color:var(--nxt-text);border-color:var(--nxt-line-strong)}
body.page .nxpf .nxtank__btn--act:hover{background:var(--nxt-surface-2)}

/* ---- bottom bar on phones and tablets ---------------------------------- */
body.page .nxbar-book{gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px))}
body.page .nxbar-book__fee{display:flex;flex-direction:column;flex:0 1 auto;min-width:0;color:var(--nxt-text-dim);font-size:var(--nxt-t-micro);line-height:1.25;white-space:nowrap}
body.page .nxbar-book__fee b{color:var(--nxt-text);font-size:var(--nxt-t-sm)}
body.page .nxbar-book .nxbtn{min-height:44px;padding-inline:14px;gap:6px}
body.page .nxbar-book .nxbtn--accent{flex:1 1 auto;max-width:260px}
body.page .nxbar-book .nxbtn--wa{flex:0 0 auto}
@media (max-width:380px){
  /* 360px: the WhatsApp button keeps its icon and drops the word */
  body.page .nxbar-book .nxbtn--wa span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  body.page .nxbar-book .nxbtn--wa{width:44px;padding:0}
}
/* room for the bar at the end of the page */
@media (max-width:980px){body.page:has(.nxbar-book) .shell{padding-bottom:96px}}

/* ---- tabs: links over sections that all stay on the page --------------- */
body.page .nxtabs a{position:relative}
body.page .nxtabs a[aria-current="true"]{background:var(--nxt-selected-bg);color:var(--nxt-selected-ink)}
body.page .nxtabs a.nxtabs__ai{margin-left:auto;color:var(--nxt-ai)}
body.page .nxtabs a.nxtabs__ai[aria-current="true"]{background:var(--nxt-ai-soft);color:var(--nxt-ai)}

/* ---- FAQs: open text ----------------------------------------------------- */
body.page .nxpfaq__list{padding:6px 18px}
body.page .nxpfaq__item{padding:14px 0;border-bottom:1px solid var(--nxt-line)}
body.page .nxpfaq__item:last-child{border-bottom:0}
body.page .nxpfaq__q{margin:0;color:var(--nxt-text);font-size:var(--nxt-t-h4);font-weight:800;line-height:1.35}
body.page .nxpfaq__a{margin:6px 0 0;color:var(--nxt-text-dim);font-size:var(--nxt-t-sm);line-height:1.65}
body.page .nxpfaq__a a{color:var(--nxt-link);text-decoration:underline;text-decoration-color:var(--nxt-link-line);text-underline-offset:3px;white-space:nowrap}

/* ---- empty reviews: "Be the first to review" ---------------------------- */
body.page .nxrv-empty__title{color:var(--nxt-text);font-family:var(--nxt-font-display);font-size:var(--nxt-t-h4);font-weight:800}
body.page .nxrv-empty .nxrv-empty__cta{display:inline-flex;margin-top:12px;background:transparent;color:var(--nxt-link);border:1px solid var(--nxt-link-line)}
body.page .nxrv-empty .nxrv-empty__cta:hover{background:rgba(108,176,255,.1)}

/* ---- 360px: nothing may push the page sideways -------------------------- */
@media (max-width:420px){
  body.page .nxpf__main .nxstat{gap:6px}
  body.page .nxpf__main .nxchip{white-space:normal}
}