/* ===================================================
   WorkNest - Complete Base Design System
   Theme: Elegant Plum, Blush Pink & Dusty Rose
   =================================================== */

@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&family=Manrope:wght@700;800&family=Public+Sans:wght@400;500;600;700&display=swap');

:root {
  /* Brand Mockup Exact Colors */
  --color-plum-dark: #161a39;       /* Deep Plum for Headings, Buttons & Footer */
  --color-plum-medium: #1e2550;     /* Hover Plum */
  --color-rose-accent: #ea580c;     /* Dusty Rose / Accent */
  --color-blush-bg: #f5f7fa;        /* Soft Blush Pink Background */
  --color-blush-border: #dfe2ea;    /* Card and Section Borders */
  --color-card-bg: #f8f9fc;         /* Light Tint Cards */
  
  /* Text Colors */
  --text-main: #12152e;             /* Dark Readable Text */
  --text-muted: #596379;            /* Paragraph Muted Text */
  --bg-white: #ffffff;

  /* Typography */
  --font-heading: 'Manrope', sans-serif;
  --font-body: 'Public Sans', sans-serif;
  --font-cursive: 'Kalam', cursive;

  /* Transitions */
  --transition-smooth: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-fast: all 0.25s ease-in-out;
}

/* Global Reset */
html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-body);
  color: var(--text-main);
  background-color: var(--bg-white);
  line-height: 1.65;
  overflow-x: hidden;
  margin: 0;
  padding: 0;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--color-plum-dark);
  font-weight: 700;
  letter-spacing: -0.01em;
}

p {
  color: var(--text-muted);
  font-weight: 400;
}

a {
  text-decoration: none;
  transition: var(--transition-fast);
}

/* Cursive Accent Text (Like in Figma: 'Future', 'Together') */
.font-cursive-accent {
  font-family: var(--font-cursive) !important;
  color: var(--color-rose-accent) !important;
  font-size: 1.35em;
  font-weight: 700;
  display: inline-block;
  transform: rotate(-3deg);
  padding: 0 4px;
}

/* Buttons */
.btn-worknest-plum {
  background: var(--color-plum-dark);
  color: #ffffff !important;
  padding: 12px 28px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.95rem;
  border: 1px solid var(--color-plum-dark);
  transition: var(--transition-smooth);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.btn-worknest-plum:hover {
  background: var(--color-plum-medium);
  box-shadow: 0 8px 22px rgba(22, 26, 57, 0.25);
  transform: translateY(-2px);
}

.btn-worknest-outline {
  background: transparent;
  color: var(--color-plum-dark) !important;
  border: 1.5px solid var(--color-blush-border);
  padding: 11px 26px;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.95rem;
  transition: var(--transition-smooth);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.btn-worknest-outline:hover {
  background: var(--color-blush-bg);
  border-color: var(--color-rose-accent);
  color: var(--color-rose-accent) !important;
  transform: translateY(-2px);
}

/* Floating Screen WhatsApp (Bottom-Right) */
.floating-whatsapp {
  position: fixed;
  bottom: 28px;
  right: 28px;
  width: 58px;
  height: 58px;
  background: #25d366;
  color: #ffffff !important;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4);
  z-index: 9999;
  transition: var(--transition-smooth);
  text-decoration: none;
}

.floating-whatsapp:hover {
  transform: scale(1.1) translateY(-4px);
  box-shadow: 0 15px 30px rgba(37, 211, 102, 0.55);
}

/* ---------- Shared navy strip below hero (sab pages) ---------- */
.wn-marquee{display:block;width:100%;overflow:hidden;white-space:nowrap;background:#161a39;border-top:3px solid #ea580c;padding:13px 0;transform:none}
.wn-marquee-track{display:inline-flex;align-items:center;animation:wnDrift 40s linear infinite}
.wn-marquee-track span{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-heading);font-size:1rem;font-weight:800;color:#fff;letter-spacing:.5px;padding:0 26px;white-space:nowrap}
.wn-marquee-track span i{color:#ea580c;font-size:1.05rem}
@keyframes wnDrift{to{transform:translateX(-50%)}}
@media (max-width:991.98px){.wn-marquee{padding:11px 0}.wn-marquee-track span{font-size:.9rem;padding:0 18px}}
/* ---------- Shared Coming Soon badge (SEO + Local SEO) ---------- */
.cs-soon{display:inline-flex;align-items:center;gap:8px;background:#ea580c;color:#fff;font-weight:800;font-size:.85rem;letter-spacing:.5px;padding:8px 18px;border-radius:50px;margin-bottom:14px}
.cs-soon i{font-size:.9rem}
/* ---------- Shared custom cursor ring (home page jaisa) ---------- */
.fx-cursor{position:fixed;top:0;left:0;width:26px;height:26px;border:2px solid var(--color-rose-accent);border-radius:50%;pointer-events:none;z-index:10001;opacity:0;transition:width .25s,height .25s,background .25s}
.fx-cursor.fx-big{width:56px;height:56px;background:rgba(226,122,52,.15)}
