/* Bright & modern theme (design B) — layered on styles.css; <html data-variant="b"> enables it */
/* =====================================================================
   B — BRIGHT & MODERN  (white, orange gradients, rounded, sans, icon grid)
   ===================================================================== */
[data-variant="b"] {
  --serif: "Plus Jakarta Sans", Inter, system-ui, sans-serif;
  --sans: "Plus Jakarta Sans", Inter, system-ui, sans-serif;
  --radius: 20px;
  --grad: linear-gradient(135deg, #ff6a1a, #ffae3b);
}
:root[data-variant="b"] {
  --orange: #ff6a1a; --orange-deep: #e2540a; --orange-soft: #fff1e8;
  --ink: #16181d; --ink-2: #4b5160; --muted: #7a8191; --line: #eceef2; --tab: #f4f5f8;
  --bg: #ffffff; --bg-2: #fff8f3; --card: #ffffff;
  --shadow: 0 2px 6px rgba(0,0,0,.04), 0 14px 34px rgba(255,106,26,.09);
  color-scheme: light;
}
[data-variant="b"] h1, [data-variant="b"] h2, [data-variant="b"] h3 { font-weight: 800; letter-spacing: -.02em; }
[data-variant="b"] .brand-mark { border-radius: 12px; clip-path: none; background: var(--grad); }
[data-variant="b"] .brand-text strong { font-weight: 800; }
[data-variant="b"] .nav-links a { border-radius: 999px; padding: 8px 14px; }
[data-variant="b"] .icon-btn { border-radius: 12px; }
[data-variant="b"] .hero { background: var(--bg); color: var(--ink); }
[data-variant="b"] .hero-img { display: none; }
[data-variant="b"] .hero::after { background: radial-gradient(560px 420px at 88% 8%, rgba(255,174,59,.38), transparent 62%), radial-gradient(520px 420px at 66% 96%, rgba(255,106,26,.22), transparent 62%); }
[data-variant="b"] .eyebrow { background: var(--orange-soft); color: var(--orange-deep); padding: 6px 14px; border-radius: 999px; letter-spacing: 1.5px; }
[data-variant="b"] .hero h1 { color: var(--ink); font-size: clamp(36px, 6.4vw, 66px); line-height: 1.05; }
[data-variant="b"] .hero .sub { color: var(--ink-2); letter-spacing: 4px; font-weight: 600; font-size: 14px; }
[data-variant="b"] .hero .cities { color: var(--muted); }
[data-variant="b"] .hero .lede { color: var(--ink-2); }
[data-variant="b"] .btn { border-radius: 999px; }
[data-variant="b"] .btn-primary { background: var(--grad); box-shadow: 0 10px 24px rgba(255,106,26,.32); }
[data-variant="b"] .btn-ghost { color: var(--ink); border-color: var(--line); background: var(--card); }
[data-variant="b"] .hero-card { background: var(--card); color: var(--ink-2); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
[data-variant="b"] .hero-card h2 { color: var(--orange-deep); }
[data-variant="b"] .hero-card a { color: var(--orange-deep); }
[data-variant="b"] .hero-strip { display: none; }
[data-variant="b"] .stats { margin-top: 0; gap: 12px; background: none; border: 0; box-shadow: none; overflow: visible; }
[data-variant="b"] .stat { border-radius: 20px; background: var(--bg-2); border: 1px solid var(--line); }
[data-variant="b"] .stat b { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 800; }
[data-variant="b"] .tab-title { background: none; clip-path: none; padding: 0; font-size: clamp(30px, 4vw, 42px); }
[data-variant="b"] .tab-title::after { display: none; }
[data-variant="b"] .quote { border-left: 0; border-radius: 20px; font-style: normal; font-weight: 600; }
[data-variant="b"] .partner { border-radius: 24px; }
[data-variant="b"] .avatar { outline: 0; border: 0; box-shadow: 0 0 0 5px var(--orange-soft); }
[data-variant="b"] .quals li { border: 0; background: var(--orange-soft); font-weight: 600; }
[data-variant="b"] .highlight strong { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
[data-variant="b"] .service-nav { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; overflow: visible; }
[data-variant="b"] .service-nav button { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 16px; border-radius: 18px; white-space: normal; text-align: left; font-weight: 700; color: var(--ink); box-shadow: 0 1px 3px rgba(0,0,0,.04); }
[data-variant="b"] .service-nav button:hover { border-color: var(--orange); }
[data-variant="b"] .svc-ico { display: block; width: 30px; height: 30px; padding: 5px; border-radius: 10px; background: var(--orange-soft); fill: none; stroke: var(--orange-deep); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
[data-variant="b"] .service-nav button[aria-selected="true"] { background: var(--grad); border-color: transparent; color: #fff; box-shadow: 0 10px 24px rgba(255,106,26,.28); }
[data-variant="b"] .service-nav button[aria-selected="true"] .svc-ico { background: rgba(255,255,255,.22); stroke: #fff; }
[data-variant="b"] .service-panel { border-radius: 24px; }
[data-variant="b"] .service-panel img { border-radius: 16px; }
[data-variant="b"] .service-panel .tag { clip-path: none; border-radius: 999px; padding: 6px 16px; background: var(--orange-soft); color: var(--orange-deep); font-weight: 700; }
[data-variant="b"] .svc-group li::before { width: 6px; height: 6px; border-radius: 50%; top: 13px; }
[data-variant="b"] .table-wrap { border-radius: 18px; }
[data-variant="b"] th { background: var(--bg-2); }
[data-variant="b"] .keyinfo { gap: 12px; background: none; border: 0; overflow: visible; }
[data-variant="b"] .ki { border-radius: 18px; border: 1px solid var(--line); }
[data-variant="b"] .office { border-radius: 22px; }
[data-variant="b"] .office .badge { top: 16px; right: 16px; border-radius: 999px; padding: 4px 12px; background: var(--grad); }
[data-variant="b"] .direct { border-radius: 22px; }
[data-variant="b"] .site-footer { background: #16181d; }
[data-variant="b"] .foot-strip { background: var(--grad); }