/*
Theme Name: Boardent
Description: Minimal marketing theme for Boardent.
Version: 1.0.0
Text Domain: boardent
*/

html { scroll-behavior: smooth; }
		body { font-family: Geist, system-ui, sans-serif; color: #101214; -webkit-font-smoothing: antialiased; }

		.eyebrow { letter-spacing: .14em; }
		.h-display { font-family: Geist, system-ui, sans-serif; letter-spacing: -0.02em; line-height: 1.05; }
		.hero-grad { background: radial-gradient(120% 80% at 50% -10%, #DFF2FE 0%, #EAF6FF 35%, #F4FAFF 60%, #FFFFFF 100%); }
		.sky-grad { background: linear-gradient(180deg, #8FD3F6 0%, #BFE6FB 40%, #E7F5FE 100%); }
		.card { border: 1px solid #E7EBF1; border-radius: 16px; background: #fff; }
		.soft-shadow { box-shadow: 0 24px 60px -28px rgba(16, 18, 20, .28); }
		.tab-pill { border: 1px solid #E7EBF1; }
		.faq-item[open] .faq-plus { transform: rotate(45deg); }
		.faq-plus { transition: transform .2s ease; }
		summary::-webkit-details-marker { display: none; }
		.wordmark { font-family: Geist, system-ui, sans-serif; font-weight: 800; letter-spacing: -0.04em; background: linear-gradient(180deg, #3A3D42 0%, #101214 70%); -webkit-background-clip: text; background-clip: text; color: transparent; }
		.mock-row { border-bottom: 1px solid #EEF1F5; }
		.hero-tag { background: rgba(240, 241, 242, 0.2); border: 1px solid rgba(211, 216, 221, 0.2); }
		.hero-tabs { backdrop-filter: blur(4px); background: rgba(255, 255, 255, 0.4); border: 1px solid rgba(255, 255, 255, 0.6); }
		.hero-tab-active { backdrop-filter: blur(2px); background: #fff; }
		.btn-outline { border: 0.75px solid #101214; }
		.dash-frame { background-image: linear-gradient(151.66deg, rgba(255, 255, 255, 0.24) 44.6%, rgba(255, 255, 255, 0) 97.8%); border: 1px solid rgba(255, 255, 255, 0.6); }
		.dash-fade { background: linear-gradient(to top, #fff 0%, rgba(255, 255, 255, 0) 10%); }
		.no-scrollbar::-webkit-scrollbar { display: none; }
		.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

		/* mobile nav dropdown */
		@media (max-width: 1023px) {
			#primaryNav.nav-open {
				display: flex; flex-direction: column; align-items: flex-start; gap: 16px;
				position: absolute; top: calc(100% + 12px); left: 0; right: 0;
				background: #fff; border: 1px solid #E7EBF1; border-radius: 14px;
				padding: 18px 20px; box-shadow: 0 24px 60px -28px rgba(16, 18, 20, .28); z-index: 50;
			}
		}

		/* tab bar */
		.hero-tabs { background: rgba(255, 255, 255, 0.45); border: 1px solid rgba(255, 255, 255, 0.65); backdrop-filter: blur(10px); box-shadow: 0 16px 44px -20px rgba(16, 18, 20, .22); }
		.hero-tab-active { background: #fff; backdrop-filter: none; box-shadow: 0 2px 8px rgba(16, 18, 20, .14), 0 0 0 1px rgba(16, 18, 20, .05); }

		/* features mega menu */
		#navbarArea { position: relative; z-index: 50; }
		#featuresDropdown {
			position: fixed; left: 0; right: 0; /* top set by JS → spans full viewport */
			backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
			background: rgba(255,255,255,0.9);
			border-bottom: 1px solid #e7ebf1;
			opacity: 0; transform: translateY(-8px);
			transition: opacity 0.18s ease, transform 0.18s ease;
			pointer-events: none; z-index: 999;
		}
		#navbarArea.features-open #featuresDropdown { opacity: 1; transform: translateY(0); pointer-events: auto; }
		.nav-features-active { font-weight: 600; color: #101214; text-decoration: underline; }
		.feature-menu-thumb { background: #b8d9f0; border-radius: 2.56px; overflow: hidden; position: relative; width: 409px; height: 273px; flex-shrink: 0; }
		.feature-menu-dash-frame { background: linear-gradient(151.66deg, rgba(255,255,255,0.24) 44.6%, rgba(255,255,255,0) 97.8%); border: 0.32px solid rgba(255,255,255,0.6); border-radius: 12.8px 12.8px 0 0; padding: 7.68px; position: absolute; left: 13.44px; top: 13.44px; right: 0; }

		/* sticky nav mega menu */
		#stickyFeaturesDropdown {
			position: absolute; left: 0; right: 0; top: 100%;
			backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
			background: rgba(255,255,255,0.96);
			border-bottom: 1px solid #e7ebf1;
			opacity: 0; transform: translateY(-8px);
			transition: opacity 0.18s ease, transform 0.18s ease;
			pointer-events: none; z-index: 999;
		}
		#sticky-nav.features-open #stickyFeaturesDropdown { opacity: 1; transform: translateY(0); pointer-events: auto; }

		/* mega menu item hover transitions */
		.mega-menu-item { transition: background 0.15s ease; }
		.mega-menu-item:hover { background: #f0f1f2; }
		.mega-title { transition: color 0.15s ease; }
		.mega-menu-item:hover .mega-title { color: #0f60e4; }

		/* marquee */
		@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
		.marquee-track { animation: marquee 24s linear infinite; display: flex; width: max-content; }
		.marquee-track:hover { animation-play-state: paused; }
		/* each set is a flex row; padding-right = gap so the loop boundary is seamless */
		.marquee-set { display: flex; align-items: center; gap: 88px; padding-right: 88px; }

		/* Cards */
		.why-card, .feat-overview-card { background: #fff; position: relative; overflow: hidden; transition: box-shadow 0.25s ease, transform 0.25s ease; }
		.why-card::before, .feat-overview-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, #f4fcff, #fff); opacity: 0; transition: opacity 0.25s ease; pointer-events: none; border-radius: inherit; z-index: 0; }
		.why-card:hover::before, .feat-overview-card:hover::before { opacity: 1; }
		.why-card:hover, .feat-overview-card:hover { box-shadow: 0 4px 20px -4px rgba(15,96,228,0.1); transform: translateY(-2px); }
		.why-card > *, .feat-overview-card > * { position: relative; z-index: 1; }
		.exp-card-wrap { transition: box-shadow 0.25s ease, transform 0.25s ease; }
		.exp-card-wrap:hover { box-shadow: 0 8px 32px -8px rgba(16,18,20,0.16); transform: translateY(-3px); }
		.feat-img-panel { transition: box-shadow 0.3s ease; }
		.feat-img-panel:hover { box-shadow: 0 24px 64px -12px rgba(16,18,20,0.18); }
		.feat-dash-img { transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); }
		.feat-img-panel:hover .feat-dash-img { transform: translateY(-8px) scale(1.015); }
		.feat-pill { transition: background 0.15s ease, border-color 0.15s ease; }
		.feat-pill:hover { background: #f0f1f2; border-color: #b8bfc7; }
		.integ-card { transition: transform 0.2s ease, box-shadow 0.2s ease; }
		.integ-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px -4px rgba(15,96,228,0.12), 0 1px 1.5px rgba(0,0,0,0.05) !important; }
		.btn-explore { transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease; }
		.btn-explore:hover { background: #0c4fbe !important; transform: translateY(-1px); box-shadow: 0 4px 16px -4px rgba(15,96,228,0.4); }

		/* Sticky nav */
		#sticky-nav {
			position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
			background: rgba(255,255,255,0.96); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
			border-bottom: 1px solid #e7ebf1;
			transform: translateY(-100%);
			transition: transform 0.32s cubic-bezier(0.4,0,0.2,1), box-shadow 0.32s ease;
		}
		#sticky-nav.is-visible { transform: translateY(0); box-shadow: 0 4px 24px -8px rgba(16,18,20,0.10); }

		/* Button hovers */
		.btn-outline { transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.15s ease, box-shadow 0.18s ease; }
		.btn-outline:hover { background: #0f60e4 !important; color: #fff !important; border-color: #0f60e4 !important; transform: translateY(-1px); box-shadow: 0 4px 14px -4px rgba(15,96,228,0.35); }
		.btn-ghost { transition: background 0.15s ease, transform 0.15s ease; }
		.btn-ghost:hover { background: #f5f6f7; transform: translateY(-1px); }
		#cta a[style*="border"] { transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease; }
		#cta a[style*="border"]:hover { background: #f5f6f7 !important; transform: translateY(-1px); }
		nav a, #sticky-nav a { transition: color 0.15s ease; }
		.why-card { transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; }
		.why-card:hover { border-color: #b0bbc6; box-shadow: 0 6px 24px -8px rgba(16,18,20,0.12); transform: translateY(-2px); }
		.feat-overview-card { transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; }
		.feat-overview-card:hover { border-color: #b0bbc6; box-shadow: 0 6px 24px -8px rgba(16,18,20,0.10); transform: translateY(-2px); }
		#site-footer a { transition: color 0.15s ease, opacity 0.15s ease; }

		/* Custom cursor */
		@media (hover: hover) and (pointer: fine) {
			#cursor-dot { position: fixed; z-index: 100000; pointer-events: none; width: 6px; height: 6px; border-radius: 50%; background: #fff; top: 0; left: 0; mix-blend-mode: difference; transition: opacity .18s ease; will-change: transform; opacity: 0; }
			#cursor-ring { position: fixed; z-index: 99999; pointer-events: none; width: 34px; height: 34px; border-radius: 50%; border: 1px solid #fff; top: 0; left: 0; mix-blend-mode: difference; transition: width .25s ease, height .25s ease, opacity .2s ease; will-change: transform; opacity: 0; }
			body.cur-link #cursor-ring { width: 50px; height: 50px; }
		}

/* FAQ */
.faq-item { transition: border-color 0.2s ease; }
	.faq-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.35s ease; }
	.faq-body > div { overflow: hidden; }
	.faq-body.open { grid-template-rows: 1fr; }
	.faq-icon { transition: background 0.2s ease, border-color 0.2s ease; }
	.faq-icon svg path { transition: d 0.2s ease; }

/* Logos */
.logo-brand {
			display: inline-flex;
			align-items: center;
			gap: 9px;
			font-family: Geist, system-ui, sans-serif;
			font-size: 19px;
			font-weight: 600;
			letter-spacing: -0.5px;
			white-space: nowrap;
			flex-shrink: 0;
			color: #1e293b;
		}
		.logo-brand svg { flex-shrink: 0; }

/* Blog prose */
.prose-boardent { color: #2d3139; font-size: 17px; line-height: 1.75; letter-spacing: -0.01em; }
.prose-boardent p { margin-bottom: 1.5em; }
.prose-boardent p.lead { font-size: 19px; line-height: 1.65; color: #101214; font-weight: 450; margin-bottom: 2em; }
.prose-boardent h2 { font-size: 22px; font-weight: 700; letter-spacing: -0.4px; color: #101214; margin-top: 2.5em; margin-bottom: 0.75em; line-height: 1.25; }
.prose-boardent h3 { font-size: 18px; font-weight: 600; letter-spacing: -0.3px; color: #101214; margin-top: 2em; margin-bottom: 0.6em; }
.prose-boardent ul { list-style: none; padding: 0; margin-bottom: 1.5em; display: flex; flex-direction: column; gap: 10px; }
.prose-boardent ul li { display: flex; gap: 10px; align-items: flex-start; }
.prose-boardent ul li::before { content: ''; display: block; width: 6px; height: 6px; border-radius: 50%; background: #0F60E4; margin-top: 0.68em; flex-shrink: 0; }
.prose-boardent strong { color: #101214; font-weight: 600; }
.prose-boardent a { color: #0F60E4; text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 1024px) {
  .prose-boardent { font-size: 18px; }
  .prose-boardent p.lead { font-size: 20px; }
  .prose-boardent h2 { font-size: 26px; }
}