/* from page-tablet-monitoring.php */
/* ── Light theme overrides (nav, footer, exit-cta) ── */
:root {
  --bg:#ffffff; --bg2:#f0f9ff; --bg3:#e0f2fe;
  --surf:#ffffff; --surf2:#e0f2ff;
  --bdr:rgba(8,145,178,.14); --bdr2:rgba(13,31,48,.08);
  --acc:#0891b2; --acc2:#0e7490;
  --txt:#0d1f30; --txt2:#1a2e3d; --txt3:#456070;
  --white:#0d1f30; color-scheme:light;
}
.tos-header,body.fp-light .tos-header {
  background:rgba(255,255,255,.97) !important;
  border-bottom:1px solid rgba(8,145,178,.1) !important;
  box-shadow:0 1px 24px rgba(13,31,48,.06) !important;
}
.tos-mega { background:rgba(255,255,255,.98) !important; }
.tos-mob-nav { background:#ffffff !important; }
.tos-logo img { height:32px !important; filter:none !important; }
.tos-btt { background:#0891b2 !important; }
.tos-ftr-bottom { justify-content:center !important; text-align:center !important; }
/* ── Tablet page accent overrides ── */
.tm-acc  { color:#0891b2; }
/* Platform badge: iOS Limited */
.tm-ios-badge {
  display:inline-flex; align-items:center; gap:6px;
  font-size:.72rem; font-weight:700; letter-spacing:.5px;
  padding:3px 12px; border-radius:50px;
  background:rgba(124,58,237,.08); color:#7c3aed;
  border:1px solid rgba(124,58,237,.2);
}
/* ── Eyebrow pill badge — all sections ── */
.sec-eyebrow {
  display:inline-block !important;
  font-family:'Bricolage Grotesque',sans-serif;
  font-size:.72rem; font-weight:700;
  letter-spacing:2px; text-transform:uppercase;
  padding:5px 16px; border-radius:50px;
  border:1px solid currentColor;
  background:rgba(8,145,178,.08);
  margin-bottom:14px;
}

/* Platform comparison tabs — styled for light (#f0f9ff) bg */
.tm-plat-tabs { display:flex; gap:10px; justify-content:center; margin-bottom:32px; flex-wrap:wrap; }
.tm-plat-tab {
  display:flex; align-items:center; gap:8px;
  padding:10px 22px; border-radius:50px;
  font-family:'Bricolage Grotesque',sans-serif;
  font-size:.9rem; font-weight:700;
  border:2px solid #d1e8f0; color:#64748b;
  background:#fff; cursor:pointer; transition:all .2s;
  box-shadow:0 1px 4px rgba(8,145,178,.08);
}
.tm-plat-tab:hover { border-color:#0891b2; color:#0891b2; background:#f0f9ff; }
.tm-plat-tab.active { background:#0891b2; border-color:#0891b2; color:#fff; box-shadow:0 4px 16px rgba(8,145,178,.3); }
.tm-plat-tab[data-plat="ios"].active { background:#7c3aed; border-color:#7c3aed; box-shadow:0 4px 16px rgba(124,58,237,.3); }
.tm-plat-panel { display:none; animation:fadeUp .3s ease; }
.tm-plat-panel.active { display:block; }
@keyframes fadeUp { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
/* Device feature grid — light bg cards */
.tm-device-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
  max-width:980px; margin:0 auto;
}
.tm-device-card {
  background:#fff; border:1px solid rgba(8,145,178,.18);
  border-radius:16px; padding:22px 20px;
  transition:box-shadow .2s, border-color .2s;
  box-shadow:0 2px 10px rgba(8,145,178,.06);
}
.tm-device-card:hover { box-shadow:0 6px 24px rgba(8,145,178,.14); border-color:rgba(8,145,178,.35); }
.tm-device-card h4 { font-family:'Bricolage Grotesque',sans-serif; font-size:.9rem; font-weight:800; color:#0d1f30; margin-bottom:6px; }
.tm-device-card p  { font-size:.82rem; color:#475569; line-height:1.6; margin:0; }
.tm-device-card .tm-avail {
  display:inline-flex; align-items:center; gap:5px;
  font-size:.72rem; font-weight:700; padding:2px 9px; border-radius:50px; margin-bottom:10px;
}
.tm-avail-yes  { background:rgba(34,197,94,.1);  color:#16a34a; border:1px solid rgba(34,197,94,.25); }
.tm-avail-no   { background:rgba(148,163,184,.1); color:#94a3b8; border:1px solid rgba(148,163,184,.2); }
.tm-avail-lim  { background:rgba(124,58,237,.08); color:#7c3aed; border:1px solid rgba(124,58,237,.2); }
/* Compatibility note */
.tm-compat-note {
  max-width:680px; margin:28px auto 0; text-align:center;
  font-size:.83rem; color:#64748b; line-height:1.7;
}
/* Use-case rows */
.tm-usecase-row {
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
  padding:52px 0; border-bottom:1px solid #f1f5f9;
}
.tm-usecase-row:last-child { border-bottom:none; }
.tm-usecase-row.reverse { direction:rtl; }
.tm-usecase-row.reverse > * { direction:ltr; }
.tm-uc-visual {
  background:#f0f9ff; border:1px solid rgba(8,145,178,.12);
  border-radius:24px; padding:36px; display:flex; align-items:center; justify-content:center;
  min-height:280px;
}
.tm-uc-content {}
.tm-uc-content .sec-eyebrow { margin-bottom:12px; }
.tm-uc-content h3 { font-family:'Bricolage Grotesque',sans-serif; font-size:clamp(1.4rem,2.5vw,1.9rem); font-weight:800; color:#0d1f30; margin-bottom:14px; line-height:1.2; }
.tm-uc-content p  { font-size:.96rem; color:#475569; line-height:1.85; margin-bottom:20px; }
.tm-uc-list { list-style:none; padding:0; margin:0 0 24px; display:flex; flex-direction:column; gap:8px; }
.tm-uc-list li { display:flex; align-items:flex-start; gap:10px; font-size:.88rem; color:#334155; line-height:1.5; }
.tm-uc-list li::before { content:''; width:6px; height:6px; border-radius:50%; background:#0891b2; flex-shrink:0; margin-top:6px; }
/* How it works steps — polished white cards on light bg */
.tm-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:0; position:relative; }
.tm-step {
  background:#fff; border:1.5px solid rgba(8,145,178,.15);
  border-radius:20px; padding:32px 22px 28px; margin:0 8px;
  text-align:center; position:relative; overflow:hidden;
  box-shadow:0 4px 20px rgba(8,145,178,.07);
  transition:box-shadow .2s, transform .2s;
}
.tm-step::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,#0891b2,rgba(8,145,178,.1));
  border-radius:20px 20px 0 0;
}
.tm-step:hover { box-shadow:0 8px 32px rgba(8,145,178,.14); transform:translateY(-3px); }
.tm-step-num {
  display:inline-block; font-family:'Bricolage Grotesque',sans-serif;
  font-size:.68rem; font-weight:800; letter-spacing:3px; text-transform:uppercase;
  color:#0891b2; background:rgba(8,145,178,.08); border:1px solid rgba(8,145,178,.18);
  padding:3px 12px; border-radius:50px; margin-bottom:18px;
}
.tm-step-icon {
  width:64px; height:64px; border-radius:18px;
  background:rgba(8,145,178,.07); border:1.5px solid rgba(8,145,178,.18);
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
  box-shadow:0 2px 8px rgba(8,145,178,.1);
}
.tm-step h3 { font-family:'Bricolage Grotesque',sans-serif; font-size:1rem; font-weight:800; color:#0d1f30; margin-bottom:10px; }
.tm-step p  { font-size:.86rem; color:#475569; line-height:1.7; margin:0; }
.tm-step-connector {
  position:absolute; top:50%; right:-24px; transform:translateY(-50%); z-index:2; pointer-events:none;
}
.tm-step:last-child .tm-step-connector { display:none; }
/* Responsive */
/* ── Ghost button (dark CTA sections) ── */
.uc-btn-ghost {
  display: inline-flex;
  align-items: center;
  font-family: 'Bricolage Grotesque',sans-serif;
  font-size: .96rem;
  font-weight: 700;
  color: rgba(255,255,255,.7);
  text-decoration: none;
  padding: 13px 24px;
  border-radius: 50px;
  border: 1.5px solid rgba(255,255,255,.2);
  transition: color .2s,border-color .2s;
}
.uc-btn-ghost:hover { color:#fff; border-color:rgba(255,255,255,.5); }
/* ── Compliance mini notice ── */
.uc-legal-mini {
  margin-top: 14px;
  font-size: .82rem;
  line-height: 1.6;
  color: #cbd5e1;
  max-width: 680px;
}\n}
@media(max-width:960px) {
  .tm-device-grid { grid-template-columns:repeat(2,1fr); }
  .tm-steps { grid-template-columns:repeat(2,1fr); gap:16px; }
  .tm-step { margin:0; }
  .tm-step-connector { display:none; }
  .tm-usecase-row { grid-template-columns:1fr; gap:32px; }
  .tm-usecase-row.reverse { direction:ltr; }
}
@media(max-width:640px) {
  .tm-device-grid { grid-template-columns:1fr; }
  .tm-steps { grid-template-columns:1fr; }
  .tm-uc-visual { min-height:200px; padding:24px; }
}