/* ═══════════════════════════════════════════════════════════
   Knovit Landing · v9 — "Apple-calm" design pass
   Pure design layer. No copy is changed.
   Goal: more restraint, fewer decorative gradients, one calm
   temperature, flatter cards, quieter motion. Loaded LAST, so a
   few rules use !important to out-rank the in-head <style> block.
   ═══════════════════════════════════════════════════════════ */

/* ── 1 · One temperature ────────────────────────────────────
   The page mixed a cool page-white (#F8F8FB) with warm cream
   sections. Commit to a single warm paper everywhere, and let the
   few pure-#fff sections read as a deliberate, brighter step. */
:root {
  --surface-page: #FBFAF7;
  --bg-page:      #FBFAF7;
}
html, body { background: #FBFAF7 !important; }
html { scroll-behavior: smooth; }

.kn-problem,
.kn-voice { background: #FBFAF7 !important; }

/* ── 2 · Calm the atmosphere ────────────────────────────────
   Decorative radial "glow / wash / atmosphere" blobs sat in almost
   every light section. Apple lets light surfaces breathe — keep a
   whisper of brand light, drop the haze. (Dark-section glows kept.) */
.kn-hero__glow       { opacity: 0.40 !important; }
.kn-problem__wash    { opacity: 0.28 !important; }
.kn-voice__atmosphere{ opacity: 0.32 !important; }
.kn-briefing__halo   { opacity: 0.50 !important; }

/* ── 3 · Quieter motion ─────────────────────────────────────
   Stop the pulsing/blinking accent dots. Movement should feel
   intentional (scroll reveals), not ambient blinking. */
.kn-eyebrow-dot,
.kn-hero__chip-dot,
.kn-problem__eyebrow .kn-eyebrow-dot { animation: none !important; }

/* Phone editorial tilt → near-flat, confident presentation */
.kn-briefing__phone-tilt,
.kn-briefing__phone-tilt--subtle { transform: rotate(-1deg) !important; }
.kn-briefing__phone-tilt:hover,
.kn-briefing__phone-tilt--subtle:hover { transform: rotate(0deg) !important; }

/* ── 4 · Flatter cards (Apple = hairline, not colored top-bars) ─ */
.kn-act__container::before,
.kn-act-v2__container::before { display: none !important; }

.kn-act__step,
.kn-act-v2__step,
.kn-act__container,
.kn-act-v2__container {
  border-radius: 18px;
  box-shadow: none;
}
.kn-act__step:hover,
.kn-act-v2__step:hover,
.kn-act__container:hover,
.kn-act-v2__container:hover {
  box-shadow: 0 18px 44px -30px rgba(15,18,38,0.18) !important;
}

/* Use-case cards — soften the heavy drop shadow into Apple depth */
.kn-case2,
.kn-case2--v2 {
  box-shadow: 0 24px 60px -40px rgba(15,18,38,0.22) !important;
  border-radius: 24px;
}

/* The "with Knovit" video frame & ACT shell — calmer corners */
.kn-act-v2__arch-shell { border-radius: 24px; }

/* ── 5 · Buttons — tighter, more product-like radii ────────── */
.kn-btn--lg,
.kn-btn--primary { border-radius: 12px; }
.kn-btn--sm      { border-radius: 11px; }
.kn-cta__submit  { border-radius: 11px; }

/* ── 6 · Eyebrows — uniform, restrained tracking ───────────── */
.kn-eyebrow,
.kn-problem__eyebrow,
.kn-voice__side-label,
.kn-voice__eyebrow,
.kn-briefing__chrono,
.kn-act__block-label,
.kn-sol__eyebrow { letter-spacing: 0.16em; }

/* ── 7 · Hairline section seams ─────────────────────────────
   A 1px top rule on the white sections makes the white↔paper steps
   feel composed rather than accidental. */
.kn-briefing,
.kn-cases { box-shadow: inset 0 1px 0 rgba(15,18,38,0.05); }

/* ── 9 · Drop redundant category-label eyebrows (content pass) ─
   "The integrated promise", "How it works", "Use cases" were
   labels that just announced the paragraph. The headlines carry
   the meaning on their own. Kept: "Voice Commander" (feature name)
   and "Privacy by design" (a positioning claim, not a label). */
.kn-integrations-v2 .kn-eyebrow--light,   /* The integrated promise */
.kn-act4__head .kn-eyebrow,               /* How it works           */
.kn-uc__eyebrow {                         /* Use cases              */
  display: none !important;
}

/* ── 10 · Reduced motion already handled globally upstream ──── */
@media (prefers-reduced-motion: reduce) {
  .kn-briefing__phone-tilt,
  .kn-briefing__phone-tilt--subtle { transform: rotate(0deg) !important; }
}