/* =========================================================
   ATLAS PREMIUM SITE SYSTEM
   AI Shopping is the visual reference for all public pages.
   Loaded last to replace legacy dark-page presentation.
   ========================================================= */

html { scroll-behavior: smooth; }

body.atlas-premium-page {
  margin: 0 !important;
  background: #f8fbff !important;
  color: #071a3d !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body.atlas-premium-page main {
  background: #f8fbff !important;
  color: #071a3d !important;
}

/* ---------- Universal premium header ---------- */
body.atlas-premium-page > header.atlas-premium-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  width: 100% !important;
  background: #ffffff !important;
  border-bottom: 1px solid #dfe7f1 !important;
  color: #071a3d !important;
  box-shadow: 0 1px 8px rgba(15,23,42,.035) !important;
}

body.atlas-premium-page .atlas-premium-header-inner {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: min(calc(100% - 40px), 1280px) !important;
  min-height: 74px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body.atlas-premium-page .atlas-premium-brand {
  display: flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  color: #071a3d !important;
  text-decoration: none !important;
}

body.atlas-premium-page .atlas-premium-brand .atlas-brand-lockup {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #071a3d !important;
}

body.atlas-premium-page .atlas-premium-brand .atlas-brand-mark {
  display: block !important;
  width: 38px !important;
  height: 44px !important;
  flex: 0 0 38px !important;
  color: #1674dd !important;
}

body.atlas-premium-page .atlas-premium-brand .atlas-brand-copy {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  line-height: 1 !important;
}

body.atlas-premium-page .atlas-premium-brand .atlas-brand-copy strong {
  color: #071a3d !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: .025em !important;
}

body.atlas-premium-page .atlas-premium-brand .atlas-brand-copy span {
  margin-top: 5px !important;
  color: #263d5e !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: .22em !important;
}

body.atlas-premium-page .atlas-premium-nav {
  align-items: center !important;
  gap: 28px !important;
}

@media (min-width:768px) {
  body.atlas-premium-page .atlas-premium-nav {
    display: flex !important;
  }
}

body.atlas-premium-page .atlas-premium-nav > a {
  color: #071a3d !important;
  background: transparent !important;
  border: 0 !important;
  padding: 9px 0 !important;
  font-size: 14px !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}

body.atlas-premium-page .atlas-premium-nav > a:hover {
  color: #0b67d8 !important;
}

body.atlas-premium-page .atlas-premium-nav > a.atlas-premium-free {
  padding: 11px 18px !important;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg,#1d4ed8,#4f46e5) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 10px 26px rgba(29,78,216,.26) !important;
}

body.atlas-premium-page .atlas-premium-nav > a.atlas-premium-free:hover {
  background: linear-gradient(135deg,#1a45c0,#4338ca) !important;
  border-color: transparent !important;
  color: #ffffff !important;
}

body.atlas-premium-page .atlas-premium-nav-toggle {
  display: none !important;
  padding: 9px 12px !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: #071a3d !important;
  font-weight: 800 !important;
}

/* ---------- Generic page canvas ---------- */
body.atlas-premium-page main > section,
body.atlas-premium-page main > article,
body.atlas-premium-page main.mx-auto,
body.atlas-premium-page main > div {
  color: #071a3d;
}

body.atlas-premium-page main h1,
body.atlas-premium-page main h2,
body.atlas-premium-page main h3,
body.atlas-premium-page main h4 {
  color: #071a3d !important;
  text-wrap: balance;
}

body.atlas-premium-page main h1 {
  letter-spacing: -.035em;
}

body.atlas-premium-page main p,
body.atlas-premium-page main li,
body.atlas-premium-page main dd {
  color: #526681 !important;
}

body.atlas-premium-page main strong,
body.atlas-premium-page main b,
body.atlas-premium-page main dt {
  color: #071a3d;
}

/* Convert legacy cyan labels into premium blue */
body.atlas-premium-page main .text-cyan-300,
body.atlas-premium-page main [class*="text-cyan-"] {
  color: #0b67d8 !important;
}

/* Legacy dark page sections become light premium surfaces */
body.atlas-premium-page main [class*="bg-[#061426]"],
body.atlas-premium-page main [class*="bg-[#04101e]"],
body.atlas-premium-page main [class*="bg-[#081a30]"],
body.atlas-premium-page main [class*="bg-[#08182b]"],
body.atlas-premium-page main [class*="bg-slate-950"] {
  background: #ffffff !important;
  color: #071a3d !important;
}

body.atlas-premium-page main [class*="border-white/10"],
body.atlas-premium-page main [class*="border-white/15"],
body.atlas-premium-page main [class*="border-white/20"] {
  border-color: #dbe5f0 !important;
}

body.atlas-premium-page main [class*="bg-white/[.03"],
body.atlas-premium-page main [class*="bg-white/[.04"],
body.atlas-premium-page main [class*="bg-white/[.05"],
body.atlas-premium-page main [class*="bg-white/[.06"] {
  background: #ffffff !important;
  border-color: #dbe5f0 !important;
  box-shadow: 0 12px 38px rgba(15,23,42,.055) !important;
}

/* Common cards */
body.atlas-premium-page main .rounded-3xl,
body.atlas-premium-page main .rounded-2xl {
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

@media (hover:hover) and (pointer:fine) {
  body.atlas-premium-page main article.rounded-3xl:hover,
  body.atlas-premium-page main article.rounded-2xl:hover {
    border-color: #bed7ef !important;
    box-shadow: 0 15px 42px rgba(15,23,42,.065) !important;
    transform: translateY(-1px);
  }
}

/* Primary content CTA language */
body.atlas-premium-page main a[href*="gratis-check"],
body.atlas-premium-page main a[href*="free-check"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body.atlas-premium-page main a.bg-cyan-300[href*="gratis-check"],
body.atlas-premium-page main a.bg-cyan-300[href*="free-check"] {
  background: linear-gradient(135deg,#1d4ed8,#4f46e5) !important;
  border-color: transparent !important;
}

body.atlas-premium-page main a.bg-cyan-300:not([href*="gratis-check"]):not([href*="free-check"]) {
  background: #0b3b82 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Pricing */
body.atlas-premium-page .pricing-plan-card {
  background: #ffffff !important;
  border-color: #cddbea !important;
  color: #071a3d !important;
  box-shadow: 0 10px 32px rgba(15,23,42,.055) !important;
}

body.atlas-premium-page .pricing-plan-card p,
body.atlas-premium-page .pricing-plan-card li,
body.atlas-premium-page .pricing-plan-card span {
  color: #263d5e !important;
}

body.atlas-premium-page .pricing-plan-card h3,
body.atlas-premium-page .pricing-plan-card .pricing-plan-price,
body.atlas-premium-page .pricing-plan-card .pricing-plan-price span:first-child {
  color: #0a3f88 !important;
}

body.atlas-premium-page .pricing-plan-pro > div.absolute {
  background: #2563eb !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}

body.atlas-premium-page .pricing-plan-pro > div.absolute * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Tables */
body.atlas-premium-page main table {
  background: #fff !important;
  color: #263d5e !important;
}
body.atlas-premium-page main table thead {
  background: #edf5fd !important;
}
body.atlas-premium-page main table th {
  color: #071a3d !important;
}
body.atlas-premium-page main table td {
  color: #425771 !important;
  border-color: #e2e8f0 !important;
}

/* Details / FAQ */
body.atlas-premium-page main details {
  background: #fff !important;
  border-color: #dbe5f0 !important;
  box-shadow: 0 8px 25px rgba(15,23,42,.035);
}
body.atlas-premium-page main summary {
  color: #071a3d !important;
}

/* Forms on free-check/contact pages */
body.atlas-premium-page main input,
body.atlas-premium-page main select,
body.atlas-premium-page main textarea {
  background: #fff !important;
  color: #071a3d !important;
  border-color: #cbd5e1 !important;
}
body.atlas-premium-page main input::placeholder,
body.atlas-premium-page main textarea::placeholder {
  color: #8291a7 !important;
}

/* Footer follows AI Shopping page */
body.atlas-premium-page > footer {
  background: #ffffff !important;
  color: #526681 !important;
  border-color: #dfe7f1 !important;
}
body.atlas-premium-page > footer b,
body.atlas-premium-page > footer strong,
body.atlas-premium-page > footer .text-white,
body.atlas-premium-page > footer .text-lg {
  color: #071a3d !important;
}
body.atlas-premium-page > footer a {
  color: #526681 !important;
}
body.atlas-premium-page > footer a:hover {
  color: #0b67d8 !important;
}

/* Homepage: preserve sophisticated report hero while using light premium shell */
body.atlas-home-page .atlas-soft-section {
  background: #f5f9fd !important;
}
body.atlas-home-page #waarom-ai-visibility-report-group .atlas-card {
  background: #fff !important;
  border-color: #dbe5f0 !important;
  box-shadow: 0 12px 35px rgba(15,23,42,.045);
}

/* Responsive nav */
@media (max-width:767px) {
  body.atlas-premium-page .atlas-premium-header-inner {
    position: relative !important;
    width: min(calc(100% - 28px),1280px) !important;
    min-height: 66px !important;
  }

  body.atlas-premium-page .atlas-premium-brand .atlas-brand-mark {
    width: 34px !important;
    height: 40px !important;
    flex-basis: 34px !important;
  }

  body.atlas-premium-page .atlas-premium-nav-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.atlas-premium-page .atlas-premium-nav {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 3px !important;
    padding: 12px !important;
    background: #fff !important;
    border: 1px solid #dfe7f1 !important;
    border-top: 0 !important;
    border-radius: 0 0 14px 14px !important;
    box-shadow: 0 16px 34px rgba(15,23,42,.10) !important;
  }

  body.atlas-premium-page .atlas-premium-nav.flex {
    display: flex !important;
  }

  body.atlas-premium-page .atlas-premium-nav > a {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 11px 12px !important;
    border-radius: 8px !important;
  }

  body.atlas-premium-page .atlas-premium-nav > a.atlas-premium-free {
    margin-top: 4px !important;
    text-align: center !important;
  }
}

/* =========================================================
   FINAL MOBILE MENU BUTTON — UNIFORM OP ALLE PUBLIEKE PAGINA'S
   Zelfde uiterlijk als Rapporten / Services
   ========================================================= */

@media (max-width: 767px) {
  html body.atlas-premium-page > header.atlas-premium-header button#nav-toggle,
  html body.atlas-premium-page > header.atlas-premium-header .atlas-premium-nav-toggle,
  html body.visual-v2 > header button#nav-toggle,
  html body > header button#nav-toggle {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 86px !important;
    min-height: 52px !important;

    margin: 0 !important;
    padding: 10px 16px !important;

    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;

    color: #071a3d !important;
    -webkit-text-fill-color: #071a3d !important;

    border: 1px solid #cbd5e1 !important;
    border-radius: 14px !important;

    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    box-shadow: 0 1px 4px rgba(15,23,42,.04) !important;
    opacity: 1 !important;
  }

  html body.atlas-premium-page > header.atlas-premium-header button#nav-toggle:hover,
  html body.atlas-premium-page > header.atlas-premium-header button#nav-toggle:focus-visible,
  html body.visual-v2 > header button#nav-toggle:hover,
  html body.visual-v2 > header button#nav-toggle:focus-visible {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
    color: #071a3d !important;
    outline: none !important;
  }
}



/* =========================================================
   HEADER ONAFHANKELIJK VAN TAILWIND
   De navigatie gebruikte de Tailwind-klassen "hidden" en "md:flex" om zich te
   gedragen. Op een pagina zonder de Tailwind-CDN — of voordat die is geladen —
   staan alle menu-items daardoor aan elkaar geplakt linksboven, met de
   Menu-knop zichtbaar ernaast. Deze regels leggen hetzelfde gedrag vast in
   gewone CSS, zodat de header overal klopt.
   ========================================================= */
.atlas-premium-header-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;
  max-width:1200px;margin:0 auto;padding:14px 24px}
.atlas-premium-nav{display:flex;align-items:center;gap:26px}
.atlas-premium-nav a{white-space:nowrap;text-decoration:none}
.atlas-premium-nav-toggle{display:none}

@media (max-width:900px){
  .atlas-premium-nav-toggle{display:inline-flex;align-items:center;gap:8px;
    padding:9px 14px;border-radius:10px;font-weight:700;cursor:pointer}
  /* Dicht: het menu is verborgen. site.js zet .hidden/.flex om bij het openen. */
  .atlas-premium-nav{display:none}
  .atlas-premium-nav.flex,.atlas-premium-nav:not(.hidden){display:flex}
  .atlas-premium-nav:not(.hidden){position:absolute;right:20px;top:64px;flex-direction:column;
    align-items:flex-start;gap:14px;padding:20px;border-radius:16px;
    background:#fff;border:1px solid #e2e8f2;box-shadow:0 18px 40px rgba(15,35,65,.12);z-index:60}
  .atlas-premium-header-inner{position:relative}
}