/* Dear Next marketing — v1.6.8-final */

/* ------------------------------
   ROOT COLORS / GLOBAL TOKENS
------------------------------ */
:root{
  --ink:#0B1220;
  --ink-soft:#6E7A91;
  --bg:#FFFFFF;
  --navy-900:#0F172A;
  --navy-800:#11153A;
  --indigo-700:#3730A3;
  --violet-600:#7C3AED;
  --violet-300:#C4B5FD;
  --brand: var(--violet-600);
  --grad-hero: radial-gradient(1200px 600px at 85% -10%, rgba(196,181,253,.35), transparent 60%),
               linear-gradient(135deg, #11153A 0%, #0F172A 55%, #1E1B4B 100%);
  --grad-btn: linear-gradient(135deg, #8B5CF6, #7C3AED);
  --maxw:1200px;
}

/* ------------------------------
   BASE
------------------------------ */
*{box-sizing:border-box;margin:0;padding:0}
html,body{
  height:100%;
  overflow-x:hidden; /* D2: prevent horizontal bounce on marketing */
}
body{
font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji",sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.6;
  padding-top:72px; /* D2.6: enough space for fixed header on mobile */
}

.mk-container{max-width:var(--maxw);margin:0 auto;padding:0 20px;}

/* ------------------------------
   HEADER
------------------------------ */
.mk-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:40;
  background:#FFFFFF; /* D2.7: solid so content doesn't show behind */
  backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid rgba(2,6,23,.08);
}

.mk-header-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 0;
}

/* Logo */
.mk-logo{
  font-weight:800;
  font-size:24px;
  letter-spacing:.1px;
  color:var(--navy-900);
  text-decoration:none;
  display:flex;align-items:center;gap:6px;
}

/* Purple dot — single, clean version */
.mk-logo span{
  display:inline-block;
  width:8px;height:8px;
  margin-left:-1px;
  background:var(--brand);
  border-radius:50%;
  transform:translateY(5px);
  font-size:0;line-height:0;color:transparent; /* hides '.' character */
}

/* Nav links */
.mk-nav{
  display:flex;gap:12px;align-items:center;
}
.mk-nav a{
  color:var(--navy-900);
  opacity:.85;
  text-decoration:none;
  font-weight:600;
  font-size:14px;
  position:relative;
  transition:color .25s ease, transform .25s ease;
}
.mk-nav a:hover{
  color:var(--brand);
  transform:translateY(-2px);
}
/* underline accent */
.mk-nav a::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-3px;
  width:0%;
  height:2px;
  background:var(--brand);
  transition:width .25s ease;
}
.mk-nav a:hover::after{
  width:100%;
}
.mk-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:9px 14px;
  border-radius:9999px;
  font-weight:800;
  font-size:14px;
  border:0;
  background:var(--grad-btn);
  color:#fff;
  box-shadow:0 16px 40px -16px rgba(124,58,237,.6), 0 3px 12px rgba(15,23,42,.25);
  cursor:pointer;
  transition:transform .25s cubic-bezier(.25,1,.5,1), box-shadow .25s cubic-bezier(.25,1,.5,1);
}
.mk-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 22px 48px -16px rgba(124,58,237,.65),0 6px 16px rgba(17,24,39,.25);
}
.mk-btn-ghost{
  background:#fff;color:var(--navy-900);
  border:1px solid rgba(2,6,23,.08);
  box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.mk-btn-ghost:hover{background:#F1EFFA}

/* ------------------------------
   HERO
------------------------------ */
.hero-aurora{
  position:relative;overflow:hidden;
  background:var(--grad-hero);color:#E8ECFF;
}
.hero-aurora::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(800px 400px at 15% -10%, rgba(124,58,237,.35), transparent 60%);
  pointer-events:none;
}
.hero-inner{padding:80px 0 120px}
.hero-title{
  font-size:clamp(40px,6vw,64px);
  line-height:1.08;font-weight:800;margin-bottom:12px;
}
.hero-sub{
  font-size:clamp(18px,2.2vw,22px);
  opacity:.94;
  max-width:56ch;
}
.mk-cta-row{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}

/* ------------------------------
   SECTIONS
------------------------------ */
.mk-section{padding:40px 0;background:#F6F7FB}

/* Center headings */
.mk-section h2{
  text-align:center;
  margin-bottom:24px;
}

/* Story */
.mk-learn .lead{max-width:860px;margin:0 auto;text-align:left}
.mk-learn h2{text-align:center;margin-bottom:12px;font-size:clamp(28px,4vw,40px)}
.mk-learn p{color:#475569;line-height:1.75;margin:10px 0}

/* Cards / Different */
.mk-different{background:#F6F7FB}
.mk-different .mk-container{max-width:1100px}
.mk-different .grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:22px;
}
.mk-card{
  background:#fff;
  border-radius:18px;
  padding:22px;
  border:1px solid rgba(2,6,23,.08);
  box-shadow:0 20px 40px -20px rgba(124,58,237,.25),0 4px 16px rgba(15,23,42,.08);
  transition:transform .25s cubic-bezier(.25,1,.5,1), box-shadow .25s cubic-bezier(.25,1,.5,1);
  will-change:transform;
}
.mk-card:hover{
  transform:translateY(-4px);
  box-shadow:0 26px 52px -22px rgba(124,58,237,.30),0 10px 24px rgba(15,23,42,.14);
}
.mk-card h4{margin-bottom:6px}

/* CTA band */
.mk-cta{
  background:#1A2133;
  color:#E8EBF7;
  text-align:center;
}
.mk-cta h3,
.mk-cta h2{
  font-size:clamp(24px,3.4vw,34px);
  margin-bottom:8px;
}
.mk-cta p{opacity:.9;margin-bottom:16px}

/* ------------------------------
   FOOTER
------------------------------ */
.mk-footer{
  border-top:1px solid rgba(2,6,23,.08);
  padding:26px 0;
  text-align:center;
  color:var(--ink-soft);
  font-size:.95rem;
}
.mk-footer a{
  color:var(--brand);
  text-decoration:none;
}
.mk-footer a:hover{text-decoration:underline}

/* ------------------------------
   REVEAL ANIMATIONS
------------------------------ */
.reveal{
  opacity:0;
  transform:translateY(6px);
  transition:opacity .45s cubic-bezier(.25,1,.5,1), transform .45s cubic-bezier(.25,1,.5,1);
}
.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

/* ------------------------------
   RESPONSIVE
------------------------------ */
@media(max-width:640px){
  .hero-inner{padding:68px 16px 96px;text-align:left;}
  .mk-nav{gap:14px}
}
/* --- Pricing page (namespaced) --- */
.mk-theme { color: #111; background:#fff; }
.mk-wrap { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
.mk-row { display:flex; align-items:center; justify-content:space-between; gap:16px; }

.mk-brand { font-weight:800; font-size:1.25rem; text-decoration:none; color:#111; display:inline-flex; gap:2px; }
.mk-brand .mk-dot { color:#6b4de6; }
.mk-nav a { margin-left:16px; text-decoration:none; color:#333; }
.mk-nav a.active { color:#6b4de6; font-weight:600; }

.mk-hero { text-align:center; padding:54px 0 22px; }
.mk-hero h1 { font-size:clamp(28px, 4vw, 44px); margin:0 0 8px; }
.mk-sub { color:#555; margin:0; }

/* Pricing: ensure CTA band text is readable on dark background */
.mk-cta .mk-sub{
  color: rgba(232,235,247,.86);
}

/* Pricing footer: keep links grouped instead of spaced across full width */
.mk-footer .mk-row{
  justify-content: flex-start;
  gap: 28px;
  flex-wrap: wrap;
}
.mk-footer .mk-row > span{
  margin-right: auto; /* pushes the links cluster to the right */
}

/* Mobile footer: center everything */
@media (max-width: 640px){
  .mk-footer .mk-row{
    justify-content: center;
  }
  .mk-footer .mk-row > span{
    margin-right: 0;
    width: 100%;
    text-align: center;
  }
}

/* Center text inside pricing guarantee section */
.mk-cta{
  text-align: center;
}

/* Guarantee section: true visual centering */
.mk-cta .mk-sub{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
}

.mk-cta .mk-cta-row{
  justify-content: center;
}

.mk-plans { padding:20px 0 10px; }
.mk-grid-3 { display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
@media (max-width:900px){ .mk-grid-3 { grid-template-columns:1fr; } }

.mk-plan { border:1px solid #eee; border-radius:16px; padding:18px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.03); }
.mk-plan-featured { border-color:#6b4de6; box-shadow:0 6px 24px rgba(107,77,230,.15); position:relative; }
.mk-plan-badge { position:absolute; top:-10px; right:16px; background:#6b4de6; color:#fff; padding:6px 10px; border-radius:999px; font-size:.8rem; }
.mk-plan-head h3 { margin:0 0 6px; font-size:1.25rem; }
.mk-price { display:flex; align-items:baseline; gap:6px; margin:2px 0 8px; }
.mk-amt { font-size:2rem; font-weight:800; }
.mk-cycle { color:#666; }
.mk-plan-note { margin:0; color:#444; }
.mk-features { margin:14px 0 18px; padding:0; list-style:none; }
.mk-features li { margin:6px 0; position:relative; padding-left:22px; }
.mk-features li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color: var(--violet-600);
  font-weight:800;
}
.mk-features .mk-dim { opacity:.55; }

.mk-btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:12px; text-decoration:none; border:1px solid transparent; cursor:pointer; font-weight:600; }
.mk-primary { background:#6b4de6; color:#fff; }
.mk-secondary { background:#fff; border-color:#ccc; color:#111; }
.mk-ghost { background:transparent; border-color:#ddd; }
.mk-why { color:#555; font-size:.9rem; margin:10px 0 0; }

.mk-compare { padding:28px 0 10px; }
.mk-compare h2 { text-align:center; margin:0 0 14px; }
.mk-table { border:1px solid #eee; border-radius:12px; overflow:hidden; }
.mk-tr { display:grid; grid-template-columns:2.2fr .8fr .8fr .8fr; padding:10px 12px; border-top:1px solid #eee; }
.mk-th { background:#faf9ff; font-weight:700; }
.mk-tr div { display:flex; align-items:center; }
/* Pricing table: make plan-column checks & text purple */
.mk-table .mk-tr div:nth-child(n+2){
  justify-content:center;
  color: var(--violet-600);
}

/* Keep the header row labels neutral/dark */
.mk-table .mk-th div:nth-child(n+2){
  color:#111;
}

/* Accent plan columns (checks, dashes, text) with brand purple */
.mk-table .mk-tr div:nth-child(n+2){
  justify-content:center;
  color: var(--violet-600);
}

/* Keep header plan labels neutral/dark */
.mk-table .mk-th div:nth-child(n+2){
  color:#111;
}

@media (max-width:900px){
  .mk-tr { grid-template-columns:1.5fr 1fr 1fr 1fr; font-size:.95rem; }
}

.mk-cta { text-align:center; padding:30px 0 50px; }
.mk-cta-row { display:flex; gap:12px; justify-content:center; margin:12px 0; flex-wrap:wrap; }
.mk-hint { color:#555; }

.mk-footer { border-top:1px solid #eee; padding:16px 0; color:#444; }
.mk-footer a { color:inherit; text-decoration:underline; }
/* Improve legibility of hint/sign-in link on dark background */
.mk-cta .mk-hint { color:#ddd; }
.mk-cta .mk-hint a { color:#fff; font-weight:600; text-decoration:underline; }
.mk-cta .mk-hint a:hover { color:#cfc4ff; }
/* Align plan buttons across pricing cards */
.mk-plan {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.mk-plan ul.mk-features {
  flex-grow: 1;
}
.mk-plan .mk-btn {
  align-self: center;
  margin-top: 12px;
}
/* v1.7 landing spacing tighten (desktop/tablet only) */
@media (min-width: 641px){
  .hero-inner{ padding:68px 0 96px !important; }  /* was 80/120 */
  .mk-section{ padding:40px 0 !important; }       /* was 72 */
  .mk-section h2{ margin-bottom:16px !important; }/* was 24 */

  /* Optional small tighten for cards/grid */
  .mk-different .grid{ gap:18px !important; }     /* was 22 */
  .mk-card{ padding:18px !important; }            /* was 22 */
}
/* Footer link hover match header style */
.mk-footer a {
  position: relative;
  color: #333;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: all 0.2s ease;
}

.mk-footer a:hover {
  color: #6b4de6;           /* same purple as header hover */
  top: -1px;                /* subtle lift */
  text-decoration-color: #6b4de6;
}
/* === Adjust login layout spacing (11/2025 update) === */
body.login .layout.content {
  margin-top: 4px !important;
}
@media (min-width: 640px) {
  body.login .layout.content {
    margin-top: 24px !important;
  }
}
/* -------------------------------------
   Storybook Mode highlight
-------------------------------------- */
.mk-story{
  background:#F7F5FF;
}

.mk-story-inner{
  display:flex;
  gap:32px;
  align-items:stretch;
  padding:8px 0;
}

.mk-story-copy{
  flex:1.4;
}

.mk-story-copy h2{
  display:flex;
  align-items:center;
  justify-content:center;  /* NEW: center the heading text */
  gap:10px;
  margin:0 0 10px;
}


.mk-story-copy p{
  margin:6px 0 10px;
}

.mk-story-list{
  margin:8px 0 10px;
  padding-left:20px;
  color:var(--ink-soft);
  font-size:.95rem;
}

.mk-story-list li{
  margin:4px 0;
}

.mk-story-note{
  font-size:.9rem;
  color:var(--ink-soft);
  margin-top:8px;
}

.mk-story-card{
  flex:1;
  display:flex;
  justify-content:flex-end;
  align-items:stretch;
}

.mk-story-page{
  max-width:360px;
  background:#FFFFFF;
  border-radius:18px;
  padding:18px 20px 20px;
  box-shadow:0 18px 45px rgba(15,23,42,.16);
  border:1px solid rgba(148,163,184,.35);
  font-family:"Georgia","Times New Roman",serif;
}

.mk-story-tag{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--ink-soft);
  margin:0 0 8px;
}

.mk-story-page h3{
  margin:0 0 10px;
  font-size:1.2rem;
}

.mk-story-page p{
  margin:0 0 8px;
  font-size:.95rem;
  line-height:1.5;
}

.mk-story-signoff{
  margin-top:14px;
  font-style:italic;
}

/* Premium pill badge */
.mk-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 9px;
  border-radius:999px;
  font-size:.7rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  border:1px solid rgba(148,163,184,.55);
  color:var(--ink-soft);
}

.mk-pill-premium{
  border-color:rgba(124,58,237,.65);
  color:var(--violet-600);
  background:rgba(124,58,237,.06);
}

/* Story section responsive tweaks */
@media (max-width: 900px){
  .mk-story-inner{
    flex-direction:column;
  }
  .mk-story-card{
    justify-content:flex-start;
  }
  .mk-story-page{
    max-width:100%;
  }
}

/* D2: Storybook cards – comfortable width on mobile */
@media (max-width: 640px){
  .mk-story-inner{
    padding:8px 16px 24px;
  }

  /* Keep Storybook copy comfortably narrow on phones */
  .mk-story-copy{
    max-width:320px;
    margin:0 auto 16px;
  }

  .mk-story-grid{
    align-items:stretch;
  }

  .mk-story-mini{
    max-width:320px;
    margin:0 auto;  /* center cards so they don’t feel edge-to-edge */
  }
}

/* -------------------------------------
   Product overview band
-------------------------------------- */
.mk-overview{
  background:#F9FAFB;
}

.mk-overview-inner{
  text-align:center;
}

.mk-overview-inner h2{
  margin-bottom:8px;
}

.mk-overview-sub{
  max-width:640px;
  margin:0 auto 18px;
  color:var(--ink-soft);
}

.mk-overview-grid{
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  justify-content:center;
  text-align:left;
}

.mk-overview-grid > div{
  flex:1 1 220px;
  max-width:320px;
}

.mk-overview-grid h4{
  margin-bottom:4px;
}

.mk-overview-grid p{
  font-size:.95rem;
  color:var(--ink-soft);
}

/* Mini-hero band for the two-pillars section */
.mk-overview.mini-hero {
  background: linear-gradient(to bottom, #FFFFFF 0%, #F5F4FF 85%);
  padding: 84px 0 72px;
}

.mk-overview.mini-hero h2 {
  font-size: clamp(32px, 4.2vw, 46px);
  margin-bottom: 12px;
}

.mk-overview.mini-hero .mk-overview-sub {
  font-size: 1.15rem;
  margin-bottom: 36px;
  opacity: .85;
}

/* Mini-hero cards with full card lift */
.mk-overview.mini-hero .mk-overview-grid > div {
  background: #FFFFFF;
  border-radius: 18px;
  padding: 22px 24px;
  border: 1px solid rgba(2,6,23,.08);
  box-shadow:
    0 20px 40px -20px rgba(124,58,237,.25),
    0 4px 16px rgba(15,23,42,.08);
  transition: transform .25s cubic-bezier(.25,1,.5,1),
              box-shadow .25s cubic-bezier(.25,1,.5,1);
}

/* Hover lift to match other cards */
.mk-overview.mini-hero .mk-overview-grid > div:hover {
  transform: translateY(-4px);
  box-shadow:
    0 26px 52px -22px rgba(124,58,237,.30),
    0 10px 24px rgba(15,23,42,.14);
}

@media (max-width: 700px){
  .mk-overview-inner{
    text-align:left;
  }
  .mk-overview-sub{
    margin-left:0;
    margin-right:0;
  }
  .mk-overview-grid{
    justify-content:flex-start;
  }
}

/* Mini-hero band for the two-pillars section */
.mk-overview.mini-hero {
  background: linear-gradient(to bottom, #FFFFFF 0%, #F5F4FF 85%);
  padding: 84px 0 72px;
}

.mk-overview.mini-hero h2 {
  font-size: clamp(32px, 4.2vw, 46px);
  margin-bottom: 12px;
}

.mk-overview.mini-hero .mk-overview-sub {
  font-size: 1.15rem;
  margin-bottom: 36px;
  opacity: .85;
}

.mk-overview.mini-hero .mk-overview-grid {
  gap: 48px;
  justify-content: center;
}

/* Mini-hero card styling for Playbook / Legacy Book */
.mk-overview.mini-hero .mk-overview-grid > div{
  background:#FFFFFF;
  border-radius:18px;
  padding:18px 20px;
  box-shadow:0 18px 40px -24px rgba(15,23,42,.28);
  border:1px solid rgba(148,163,184,.35);
}

/* Keep headings strong, body text soft */
.mk-overview.mini-hero .mk-overview-grid h4{
  margin-bottom:6px;
}

.mk-overview.mini-hero .mk-overview-grid p{
  font-size:.95rem;
  color:var(--ink-soft);
}

/* -------------------------------------
   How Dear Next works – layout polish
-------------------------------------- */
.mk-different h2{
  text-align:center;
  margin-bottom:8px;
}

.mk-different .lead{
  max-width:720px;
  margin:0 auto 20px;
  text-align:center;
  color:var(--ink-soft);
}
/* -------------------------------------
   Storybook sample modal
-------------------------------------- */
.mk-modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:50;
}

.mk-modal.open{
  display:flex;
}

.mk-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.45);
}

.mk-modal-dialog{
  position:relative;
  max-width:640px;
  max-height:80vh;
  margin:16px;
  z-index:1;
}

.mk-modal-story{
  max-height:80vh;
  overflow:auto;
}

.mk-modal-close{
  position:absolute;
  top:10px;
  right:12px;
  border:none;
  background:transparent;
  font-size:1.4rem;
  line-height:1;
  cursor:pointer;
  color:rgba(15,23,42,.65);
}

/* Story actions row under copy */
.mk-story-actions{
  margin-top:16px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  justify-content:center; /* center the button under the cards */
}

.mk-story-note{
  margin:0;
}
/* Storybook feature cards */
.mk-story-grid{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin:14px 0 8px;
}

.mk-story-mini{
  flex:1 1 220px;
}

@media (max-width: 700px){
  .mk-story-grid{
    flex-direction:column;
  }
}
/* Not just a story – 2x2 grid */
.mk-different .grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(260px, 1fr));
  gap:20px;
}

@media (max-width: 700px){
  .mk-different .grid{
    grid-template-columns:1fr;
  }
}

/* D2-final: Simple landing header on small screens – refined */
@media (max-width: 768px){
  body.landing .mk-header-inner{
    padding:10px 16px;
    column-gap:12px;   /* small gap between logo and button */
    /* no flex-wrap so header stays on one line */
  }

  body.landing .mk-logo{
    font-size:22px;
  }

  /* Purple dot aligned a bit more naturally on small screens */
  body.landing .mk-logo span{
    width:8px;
    height:8px;
    margin-left:2px;
    transform:translateY(6px);
  }

  /* Header nav on landing: only show the Sign in button */
  body.landing .mk-nav{
    flex:0 0 auto;
    justify-content:flex-end;
    gap:8px;
  }

  body.landing .mk-nav a{
    font-size:14px;
    margin-left:0; /* override pricing margin */
  }

  /* Hide text links (Features, Pricing, Help/FAQ),
     keep only the Sign in button (mk-btn) */
  body.landing .mk-nav a:not(.mk-btn){
    display:none;
  }

  body.landing .mk-nav .mk-btn{
    padding:8px 14px;
  }
}
/* === Pricing mobile polish (<=640px) === */
@media (max-width: 640px){
  /* Slightly narrower padding on phones for all marketing pages */
  .mk-wrap{
    padding: 0 16px;
  }

  /* Plans: comfy single-column cards */
  .mk-plans{
    padding-top: 16px;
  }

  .mk-grid-3{
    grid-template-columns: 1fr;  /* force single-column even on small tablets */
  }

  .mk-plan{
    max-width: 420px;
    margin: 0 auto 14px;
  }

  /* Comparison table: allow horizontal scroll instead of microscopic columns */
  .mk-table{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .mk-table .mk-tr{
    min-width: 520px;  /* keeps columns readable */
  }

  /* Center the checkmarks / availability text in plan columns */
  .mk-tr div:nth-child(n+2){
    justify-content: center;
  }
}
/* D2-pricing: compact header on small screens so Sign in stays visible */
@media (max-width: 700px){
  body.mk-theme .mk-header .mk-wrap{
    padding:10px 16px;
  }

  body.mk-theme .mk-header .mk-row{
    gap:8px;
  }

  body.mk-theme .mk-header .mk-nav{
    flex:0 0 auto;
    justify-content:flex-end;
    gap:8px;
  }

  body.mk-theme .mk-header .mk-nav a{
    margin-left:0;
    font-size:14px;
  }

  /* Hide text links, keep only the Sign in button on pricing mobile */
  body.mk-theme .mk-header .mk-nav a:not(.mk-btn){
    display:none;
  }
}