@charset "UTF-8";
body{margin:0;overflow-x:hidden;font-family: 'Zoho_Puvi_Regular';}
/* ================================================================
   MCP Page — Design Tokens
   ================================================================ */
:root {
	--me-primary:       #0045D3;
	--me-primary-hover: #003BB4;
	--me-cta:           #DE002B;
	--me-cta-hover:     #C30024;
	--me-cta-press:     #A30018;

	--n-100:  #F5F5F5;
	--n-150:  #ECECEC;
	--n-300:  #E5E0EB;
	--n-500:  #ABA7AF;
	--n-700:  #404040;
	--n-900:  #242424;
	--n-1000: #1A141F;

	--border-soft: #ECECEC;
	--border-med:  #E5E0EB;

	--shadow-still: 0px 4px 10px 0px rgba(0,60,92,0.10);
	--shadow-lg:    0px 20px 44px 0px rgba(0,60,92,0.28);

	--font-sans: "Zoho_Puvi_Regular";
}
img {
	max-width: 100%;
}
.h2, h2{font-family:'Zoho_Puvi_Bold';}

/* ================================================================
   FLOAT-BASED 12-COLUMN GRID  (page-standards §1)
   ================================================================ */
.rows {
	margin-left: -15px;
	margin-right: -15px;
}

.rows:after,
.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

.cols-1, .cols-2, .cols-3, .cols-4, .cols-5, .cols-6,
.cols-7, .cols-8, .cols-9, .cols-10, .cols-11, .cols-12 {
	float: left;
	padding-left: 15px;
	padding-right: 15px;
	box-sizing: border-box;
}

.cols-1  { width: 8.3333%; }
.cols-2  { width: 16.6666%; }
.cols-3  { width: 25%; }
.cols-4  { width: 33.3333%; }
.cols-5  { width: 41.6666%; }
.cols-6  { width: 50%; }
.cols-7  { width: 58.3333%; }
.cols-8  { width: 66.6666%; }
.cols-9  { width: 75%; }
.cols-10 { width: 83.3333%; }
.cols-11 { width: 91.6666%; }
.cols-12 { width: 100%; }

/* Tablet overrides (≤992px) */
@media (max-width: 992px) {
	.cols-md-1  { width: 8.3333%; }
	.cols-md-2  { width: 16.6666%; }
	.cols-md-3  { width: 25%; }
	.cols-md-4  { width: 33.3333%; }
	.cols-md-5  { width: 41.6666%; }
	.cols-md-6  { width: 50%; }
	.cols-md-7  { width: 58.3333%; }
	.cols-md-8  { width: 66.6666%; }
	.cols-md-9  { width: 75%; }
	.cols-md-10 { width: 83.3333%; }
	.cols-md-11 { width: 91.6666%; }
	.cols-md-12 { width: 100%; }
}

/* Mobile overrides (≤650px) */
@media (max-width: 650px) {
	.cols-sd-1  { width: 8.3333%; }
	.cols-sd-2  { width: 16.6666%; }
	.cols-sd-3  { width: 25%; }
	.cols-sd-4  { width: 33.3333%; }
	.cols-sd-5  { width: 41.6666%; }
	.cols-sd-6  { width: 50%; }
	.cols-sd-7  { width: 58.3333%; }
	.cols-sd-8  { width: 66.6666%; }
	.cols-sd-9  { width: 75%; }
	.cols-sd-10 { width: 83.3333%; }
	.cols-sd-11 { width: 91.6666%; }
	.cols-sd-12 { width: 100% !important; float: none; clear: both; }
}
section{padding:100px 0;}

/* ================================================================
   Base
   ================================================================ */
.mcp-page {
	font-family: var(--font-sans);
	color: var(--n-1000);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}

.mcp-page * { box-sizing: border-box; }

.mcp-hidden { display: none !important; }

/* Centered max-width containers */
.container{ max-width: 1200px; margin: 0 auto; }

/* ================================================================
   BUTTONS — ME Design System
   ================================================================ */
.mcp-page .me-btn {
	font-family: 'Zoho_Puvi_Bold';
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border: 1.5px solid transparent;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	cursor: pointer;
	user-select: none;
	white-space: nowrap;
	text-decoration: none;
	transition: background 140ms ease, color 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.mcp-page .me-btn__icon {
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1),
	            background 140ms ease,
	            color 140ms ease;
}

.mcp-page .me-btn:hover .me-btn__icon {
	transform: translateX(5px);
}

/* XL */
.mcp-page .me-btn--xl { height: 56px; padding: 0 8px 0 32px; font-size: 16px; gap: 16px; }
.mcp-page .me-btn--xl .me-btn__icon { width: 40px; height: 40px; }

/* LG */
.mcp-page .me-btn--lg { height: 46px; padding: 0 7px 0 24px; font-size: 13px; gap: 12px; }
.mcp-page .me-btn--lg .me-btn__icon { width: 32px; height: 32px; }

/* Main (red fill) */
.mcp-page .me-btn--main { background: var(--me-cta); color: #fff; }
.mcp-page .me-btn--main .me-btn__icon { background: #fff; color: var(--me-cta); }
.mcp-page .me-btn--main:hover { background: var(--me-cta-hover); box-shadow: 0 6px 18px rgba(222,0,43,0.32); text-decoration: none; }

/* Secondary (blue outline) */
.mcp-page .me-btn--secondary { background: transparent; color: var(--me-primary); border-color: var(--me-primary); }
.mcp-page .me-btn--secondary .me-btn__icon { background: var(--me-primary); color: #fff; }
.mcp-page .me-btn--secondary:hover { background: var(--me-cta); color: #fff; border-color: var(--me-cta); text-decoration: none; }
.mcp-page .me-btn--secondary:hover .me-btn__icon { background: #fff; color: var(--me-cta); }

/* on-dark modifier */
.mcp-page .me-btn--secondary.on-dark { color: #fff; border-color: #fff; }
.mcp-page .me-btn--secondary.on-dark .me-btn__icon { background: #fff; color: var(--me-primary); }
.mcp-page .me-btn--secondary.on-dark:hover { background: var(--me-cta); border-color: var(--me-cta); }
.mcp-page .me-btn--secondary.on-dark:hover .me-btn__icon { color: var(--me-cta); }

/* ================================================================
   ANIMATIONS
   ================================================================ */
@keyframes mcpPulse {
	0%,100% { opacity: 1; }
	50%      { opacity: .3; }
}
@keyframes mcpMarquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}
@keyframes heroSlideLeft {
	from { opacity: 0; transform: translateX(-48px); }
	to   { opacity: 1; transform: none; }
}
@keyframes heroSlideRight {
	from { opacity: 0; transform: translateX(48px); }
	to   { opacity: 1; transform: none; }
}

/* ================================================================
   HERO
   ================================================================ */
.mcp-hero {
	position: relative;
	overflow: hidden;
	background: linear-gradient(135deg, #0045D3 0%, #00246E 100%);
	color: #fff;
}

.mcp-hero__glow {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
}

.mcp-hero__glow--tr {
	right: -160px;
	top: -160px;
	width: 460px;
	height: 460px;
	background: radial-gradient(closest-side, rgba(255,255,255,0.16), transparent 70%);
}

.mcp-hero__glow--bl {
	left: -120px;
	bottom: -180px;
	width: 420px;
	height: 420px;
	background: radial-gradient(closest-side, rgba(0,160,90,0.22), transparent 70%);
}

/* Hero reveal: CSS keyframes fire on load — no IntersectionObserver needed.
   Extra .mcp-hero ancestor bumps specificity to (0,3,0) so these win over
   the generic .mcp-reveal rules at (0,2,0). */
.mcp-hero .mcp-reveal {
	opacity: 1;
	transform: none;
	transition: none;
}
.mcp-hero .mcp-reveal.mcp-reveal--left {
	animation: heroSlideLeft 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.mcp-hero .mcp-reveal.mcp-reveal--right {
	animation: heroSlideRight 700ms cubic-bezier(0.22, 1, 0.36, 1) 150ms both;
}

.mcp-hero__widget-wrap {
	text-align: center;
	padding-top: 20px;
}

.mcp-hero__h1 {
	margin: 0 0 22px;
	font-size: 56px;
	line-height: 1.06;
	letter-spacing: -0.03em;
	color: #fff;
	font-family: 'Zoho_Puvi_Bold';
}

.mcp-hero__sub {
	margin: 0 0 36px;
	font-size: 19px;
	line-height: 1.55;
	color: rgba(255,255,255,0.86);
	max-width: 52ch;
	font-family: 'Zoho_Puvi_Regular';
}

.mcp-hero__cta {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
}

/* Hero widget */
.mcp-hero__widget {
	background: rgba(255,255,255,0.09);
	backdrop-filter: blur(18px);
	-webkit-backdrop-filter: blur(18px);
	border: 1px solid rgba(255,255,255,0.2);
	border-radius: 16px;
	padding: 22px;
	box-shadow: 0 24px 60px rgba(0,20,60,0.4);
}

.mcp-hero__chat-bubble {
	background: rgba(255,255,255,0.16);
	border-radius: 14px 14px 4px 14px;
	padding: 10px 16px;
	font-size: 14px;
	max-width: 75%;
	margin-left: auto;
	margin-bottom: 16px;
}

.mcp-hero__tool-label {
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
	font-family: 'Zoho_Puvi_Bold';
	margin: 0 0 12px 2px;
}

.mcp-hero__tools {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mcp-tool-row {
	display: flex;
	align-items: center;
	gap: 12px;
	background: rgba(255,255,255,0.07);
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: 10px;
	padding: 12px 14px;
}

.mcp-tool-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex: none;
}

.mcp-tool-dot--done    { background: #4ADE80; }
.mcp-tool-dot--running { background: #FAAA1E; animation: mcpPulse 1.4s ease-in-out infinite; }

.mcp-tool-text {
	flex: 1;
	font-size: 13px;
}

.mcp-tool-status {
	font-family: var(--font-sans);
	font-size: 11px;
	color: rgba(255,255,255,0.6);
}

.mcp-hero__widget-caption {
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px solid rgba(255,255,255,0.12);
	font-size: 12px;
	color: rgba(255,255,255,0.6);
}

/* ================================================================
   WIDGET ANIMATION
   ================================================================ */
.mcp-hero__chat-bubble,
.mcp-hero__tool-label,
.mcp-tool-row,
.mcp-hero__widget-caption {
	transition: opacity 450ms ease, transform 450ms ease;
}

.mcp-tool-dot { transition: background 350ms ease; }

.mcp-w-hidden {
	opacity: 0 !important;
	transform: translateY(12px) !important;
}

/* ================================================================
   SCROLL REVEAL — base + directional variants
   ================================================================ */

/* All reveal elements start invisible */
.mcp-reveal,
.mcp-reveal.mcp-reveal--left,
.mcp-reveal.mcp-reveal--right,
.mcp-reveal.mcp-reveal--scale {
	opacity: 0;
	transition: opacity 640ms cubic-bezier(0.22, 1, 0.36, 1),
	            transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Default: slide up */
.mcp-reveal                { transform: translateY(32px); }
/* Directional overrides — applied in addition to .mcp-reveal */
.mcp-reveal.mcp-reveal--left  { transform: translateX(-48px); }
.mcp-reveal.mcp-reveal--right { transform: translateX(48px); }
.mcp-reveal.mcp-reveal--scale {
	transform: scale(0.93) translateY(22px);
	transform-origin: center bottom;
}

/* Visible state resets everything */
.mcp-reveal.is-visible {
	opacity: 1;
	transform: none !important;
}

/* Stagger delays for sibling groups */
.mcp-reveal:nth-child(2) { transition-delay: 80ms; }
.mcp-reveal:nth-child(3) { transition-delay: 160ms; }
.mcp-reveal:nth-child(4) { transition-delay: 240ms; }
.mcp-reveal:nth-child(5) { transition-delay: 320ms; }
.mcp-reveal:nth-child(6) { transition-delay: 400ms; }
.mcp-reveal:nth-child(7) { transition-delay: 480ms; }

@media (prefers-reduced-motion: reduce) {
	.mcp-hero__chat-bubble,
	.mcp-hero__tool-label,
	.mcp-tool-row,
	.mcp-hero__widget-caption,
	.mcp-tool-dot  { transition: none !important; }
	.mcp-w-hidden  { opacity: 1 !important; transform: none !important; }
	.mcp-reveal,
	.mcp-reveal.mcp-reveal--left,
	.mcp-reveal.mcp-reveal--right,
	.mcp-reveal.mcp-reveal--scale { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ================================================================
   USE CASES
   ================================================================ */
.mcp-use-cases {
	background: #fff;
}

.mcp-uc__header {
	padding-bottom: 48px;
	border-bottom: 1px solid var(--border-soft);
	margin-bottom: 64px;
}

.mcp-uc__h2 {
	margin: 0;
	font-size: 38px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.2;
	letter-spacing: -0.02em;
	color: #000;
	padding: 0 45px 0 0;
}

.mcp-uc__header-right {
	padding-top: 4px;
}

.mcp-uc__header-right p {
	margin: 0 0 14px;
	font-size: 18px;
	line-height: 1.6;
	color: #000;
}

.mcp-uc__header-right p:last-child { margin-bottom: 0; }

.mcp-uc__demo-title {
	max-width: 720px;
	margin: 0 auto 24px;
	text-align: center;
}

.mcp-uc__demo-title h3 {
	margin: 0 0 10px;
	font-size: 24px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.3;
	color: #000;
	font-family: 'Zoho_Puvi_SemiBold';
}

.mcp-uc__demo-title p {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	color: #000;
	padding-bottom: 13px;
}

.mcp-uc__demo-desc {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
	font-size: 16px;
	line-height: 1.6;
	color: #000;
	padding-bottom: 35px;
	padding-top: 30px;
}

.mcp-uc__video-wrap {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	line-height: 0;
	box-shadow: var(--shadow-lg);
}

.mcp-uc__video-wrap img {
	display: block;
	width: 100%;
	height: auto;
}

.mcp-uc__video-wrap iframe {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border: none;
}

.mcp-uc__play-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 72px;
	height: 72px;
	border-radius: 50%;
	border: none;
	background: rgba(255,255,255,0.95);
	color: #0045D3;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 8px 32px rgba(0,0,0,0.32);
	transition: transform 180ms ease, box-shadow 180ms ease;
}

.mcp-uc__play-btn svg { margin-left: 4px; }

.mcp-uc__play-btn:hover {
	transform: translate(-50%, -50%) scale(1.1);
	box-shadow: 0 12px 44px rgba(0,0,0,0.44);
}

.mcp-uc__sep {
	border-bottom: 1px solid var(--border-soft);
}
.mcp-page .access-btn{text-transform: none;}

/* ================================================================
   TERMINAL FRAME  (shared by use-cases & coverage)
   ================================================================ */
.mcp-terminal-frame {
	position: relative;
	border-radius: 14px;
	overflow: hidden;
	border: 1px solid rgba(255,255,255,0.12);
	box-shadow: none;
	background: #141b23;
}

.mcp-terminal-frame__bar {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 16px;
	background: rgba(255,255,255,0.02);
	border-bottom: 1px solid rgba(255,255,255,0.08);
}

.mcp-dot {
	width: 11px;
	height: 11px;
	border-radius: 50%;
	flex: none;
}

.mcp-dot--red    { background: #FF5F57; }
.mcp-dot--yellow { background: #FEBC2E; }
.mcp-dot--green  { background: #28C840; }

.mcp-terminal-frame__label {
	display: block;
    margin-left: 12px;
    color: rgba(255, 255, 255, 0.5);
    letter-spacing: 0.04em;
}

.mcp-frame-wrap {
	position: relative;
}

.mcp-terminal-frame__expand {
	position: absolute;
    top: 12px;
    right: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	border: none;
	background: #fff;
	color: #1a1a2e;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0,0,0,0.18), 0 1px 4px rgba(0,0,0,0.08);
	transition: box-shadow 150ms ease, transform 150ms ease;
	z-index: 2;
}

.mcp-terminal-frame__expand svg {
	width: 18px;
	height: 18px;
}

.mcp-terminal-frame__expand:hover {
	box-shadow: 0 6px 22px rgba(0,0,0,0.22), 0 2px 6px rgba(0,0,0,0.1);
	transform: scale(1.06);
}

.mcp-terminal-frame__body {
	display: flex;
	justify-content: center;
	align-items: flex-start;
	padding:30px 0;
}

.mcp-terminal-frame__body img {
	display: block;
	width: 100%;
	height: auto;
}
.mcp-coverage .mcp-terminal-frame__body img{
	width:70%;
	margin:0 auto;
}

.mcp-terminal-frame__body--video img {
	background: #0f0f14;
}


.mcp-slide img {
	display: block;
	width: 100%;
	height: auto;
}

.mcp-terminal-frame__dots {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 18px;
}

.mcp-slide-dot {
	width: 10px;
	height: 10px;
	padding: 0;
	border-radius: 999px;
	border: none;
	background: rgba(255,255,255,0.3);
	cursor: pointer;
	transition: background 180ms ease, width 220ms ease;
}

.mcp-slide-dot.active {
	width: 34px;
	background: #FAAA1E;
}

/* ================================================================
   LIGHTBOX
   ================================================================ */
.mcp-lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.mcp-lightbox.mcp-hidden { display: none !important; }

.mcp-lightbox__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.86);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.mcp-lightbox__stage {
	position: relative;
	z-index: 1;
	max-width: min(1200px, 100%);
	max-height: calc(100dvh - 96px);
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 32px 80px rgba(0,0,0,0.7);
}

.mcp-lightbox__img {
	display: block;
	width: 100%;
	height: auto;
	max-height: calc(100dvh - 96px);
	object-fit: contain;
}

.mcp-lightbox__iframe {
    display: block;
    width: 900px;
    height: 506px;
    border: none;
}

.mcp-lightbox__close {
	position: fixed;
	top: 20px;
	right: 20px;
	z-index: 9100;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	border: none;
	background: #fff;
	color: #1a1a2e;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0,0,0,0.22), 0 1px 4px rgba(0,0,0,0.1);
	transition: box-shadow 150ms ease, transform 150ms ease;
}

.mcp-lightbox__close svg {
	width: 20px;
	height: 20px;
}

.mcp-lightbox__close:hover {
	box-shadow: 0 6px 22px rgba(0,0,0,0.28), 0 2px 6px rgba(0,0,0,0.12);
	transform: scale(1.06);
}

/* ================================================================
   COVERAGE
   ================================================================ */
.mcp-coverage {
	background: #0B0B0F;
	border-top: 1px solid var(--border-soft);
}

.mcp-cov__intro {
	max-width: 760px;
	margin-bottom: 44px;
}

.mcp-cov__h2 {
	margin: 0 0 20px;
	font-size: 42px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: #fff;
}

.mcp-cov__sub {
	margin: 0;
	font-size: 18px;
	line-height: 1.6;
	color: rgba(255,255,255,0.72);
}

.mcp-cov__grid {
	margin-left: -15px;
	margin-right: -15px;
}

.mcp-cov__viewer { min-width: 0; }

/* Left nav */
.mcp-cov__nav {
	display: flex;
	flex-direction: column;
	gap: 2px;
	background: #1b2230;
	border-radius: 14px;
	box-shadow: 0 18px 40px rgba(0,0,0,0.45);
	padding: 8px;
	position: sticky;
	top: 24px;
}

.mcp-cov__nav-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border-radius: 10px;
	cursor: pointer;
	color: rgba(255,255,255,0.72);
	font-size: 16px;
	font-family: 'Zoho_Puvi_SemiBold';
	transition: background 140ms ease, color 140ms ease;
	border: none;
	background: transparent;
	text-align: left;
	width: 100%;
}

.mcp-cov__nav-item:hover {
	background: rgba(255,255,255,0.06);
	color: #fff;
}

.mcp-cov__nav-item.active {
    color: #fff;
    font-family: 'Zoho_Puvi_Bold';
    background: var(--me-primary);
}

.mcp-cov__nav-label { flex: 1; }

.mcp-cov__nav-count {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	border-radius: 999px;
	background: rgba(255,255,255,0.14);
	font-size: 11px;
	font-family: 'Zoho_Puvi_Bold';
	color: rgba(255,255,255,0.8);
}

.mcp-cov__nav-arrow { flex: none; opacity: 0.5; }
.mcp-cov__nav-item.active .mcp-cov__nav-arrow { opacity: 1; }

.mcp-cov__grid {
	display: flex;
	align-items: flex-start;
	margin-left: -15px;
	margin-right: -15px;
}

.mcp-cov__viewer {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	flex: 1 1 auto;
}

.mcp-cov__panel {
	min-width: 0;
	max-width: 100%;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 18px;
	padding: 18px 18px 16px;
	box-shadow: none;
}

.mcp-cov__client-label {
	font-size: 12px;
	font-family: 'Zoho_Puvi_Bold';
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #6AA3FF;
	margin: 0 0 16px;
}

.mcp-cov__panel-h3 {
	margin: 0 0 14px;
	font-size: 26px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.2;
	letter-spacing: -0.04em;
	color: #fff;
	max-width: 100%;
}

.mcp-cov__panel-desc {
	margin: 0 0 18px;
	font-size: 16px;
	line-height: 1.55;
	color: rgba(255,255,255,0.72);
	max-width: 100%;
}

.mcp-cov__chain {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
}

.mcp-cov__chain-label {
	font-size: 11px;
	font-family: 'Zoho_Puvi_Bold';
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.45);
}

.mcp-cov__badge {
	display: inline-block;
	background: rgba(255,255,255,0.08);
	border: 1px solid rgba(255,255,255,0.16);
	border-radius: 8px;
	padding: 6px 11px;
	font-size: 13px;
	font-family: 'Zoho_Puvi_SemiBold';
	color: #fff;
	white-space: nowrap;
}

.mcp-cov__arrow {
	color: #6AA3FF;
	font-size: 15px;
}

/* ================================================================
   COVERAGE ACCORDION  (built by JS when viewport ≤800px)
   ================================================================ */
.mcp-cov__accordion {
	display: none;
}
@media (min-width: 1800px) {
	.mcp-marquee-mask{
		max-width: 1800px;
    	margin: 52px auto auto;
	}
}
@media (min-width: 801px) {
	.mcp-cov__accordion {
		display: none !important;
	}
}

@media (max-width: 800px) {
	.mcp-cov__accordion {
		display: flex;
		flex-direction: column;
		margin-top: 12px;
		gap: 8px;
		border: 0;
	}

	.mcp-cov__acc-item {
		border: 0;
		border-radius: 18px;
		background: #fff;
		overflow: hidden;
		box-shadow: 0 8px 18px rgba(0,0,0,0.08);
	}

	.mcp-cov__acc-header {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 18px 18px 16px;
		background: #0c5ed5;
		color: #fff;
		font-size: 18px;
		font-family: 'Zoho_Puvi_Bold';
		letter-spacing: -0.04em;
		border-radius: 0;
	}

	.mcp-cov__acc-item:not(.is-open) .mcp-cov__acc-header {
		border-radius: 0;
	}

	.mcp-cov__acc-label {
		flex: 1;
		color: #fff;
		font-size: 20px;
		line-height: 1.2;
	}

	.mcp-cov__acc-chevron {
		flex: none;
		opacity: 1;
		transform: rotate(180deg);
		color: #fff;
	}

	.mcp-cov__acc-item.is-open .mcp-cov__acc-chevron {
		transform: rotate(0deg);
	}

	.mcp-cov__acc-body {
		display: none;
		padding: 0;
		background: #dfeefb;
	}

	.mcp-cov__acc-item.is-open .mcp-cov__acc-body {
		display: block;
	}

	.mcp-cov__acc-body .mcp-cov__panel {
		padding: 22px 20px 18px;
		background: #dfeefb;
	}

	.mcp-cov__acc-body .mcp-cov__panel-h3 {
		margin: 0 0 18px;
		font-size: 30px;
		line-height: 1.12;
		letter-spacing: -0.05em;
		color: #1b2735;
	}

	.mcp-cov__acc-body .mcp-cov__panel-desc {
		margin: 0 0 18px;
		font-size: 17px;
		line-height: 1.55;
		color: #233548;
	}

	.mcp-cov__acc-body .mcp-cov__chain {
		margin: 0 0 18px;
		gap: 8px 10px;
	}

	.mcp-cov__acc-body .mcp-cov__chain-label {
		font-size: 10px;
		letter-spacing: 0.14em;
		color: rgba(18, 33, 46, 0.7);
	}

	.mcp-cov__acc-body .mcp-cov__badge {
		background: rgba(12, 21, 31, 0.05);
		border-color: rgba(18, 33, 46, 0.2);
		color: #1d2c3a;
		padding: 7px 11px;
	}

	.mcp-cov__acc-body .mcp-cov__arrow {
		color: #1d2c3a;
	}
}

/* ================================================================
   API BANNER
   ================================================================ */
.mcp-api-banner {
	background: rgb(244, 244, 244);
	padding: 0 0 100px;
}

.mcp-api-card {
	position: relative;
	overflow: hidden;
	border-radius: 18px;
	background: linear-gradient(118deg, #00246E 0%, #0045D3 58%, #0B62E8 100%);
	box-shadow: 0 20px 44px rgba(0,20,60,0.24);
	padding: 38px 44px;
	color: #fff;
}

.mcp-api-card__glow {
	position: absolute;
	right: -90px;
	top: -120px;
	width: 340px;
	height: 340px;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgba(255,255,255,0.14), transparent 70%);
	pointer-events: none;
}

.mcp-api-card__inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-wrap: wrap;
	gap: 24px 44px;
	align-items: center;
	justify-content: space-between;
}

.mcp-api-card__h3 {
	margin: 0;
	flex: 1 1 460px;
	min-width: 0;
	font-size: 28px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.2;
	letter-spacing: -0.015em;
	font-family: 'Zoho_Puvi_Bold';
}

/* ================================================================
   CREATE MCP SERVERS
   ================================================================ */
.mcp-create {
	background: rgb(244, 244, 244);
}

.mcp-create__head {
	text-align: center;
	margin-bottom: 40px;
}

.mcp-create__h2 {
	margin: 0 0 20px;
	font-size: 42px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: var(--n-900);
}

.mcp-create__sub {
	margin: 0 auto 40px;
	font-size: 18px;
	line-height: 1.6;
	color:#000;
	max-width: 64ch;
}

.mcp-create__overline {
	font-size: 13px;
	font-family: 'Zoho_Puvi_Bold';
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #000;
	margin: 0;
}

.mcp-products-grid {
	margin: 22px -15px 44px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.mcp-product-card {
	margin-bottom: 16px;
	background: #fff;
	border: 1px solid var(--border-med);
	border-radius: 12px;
	box-shadow: var(--shadow-still);
	height: 104px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 4px;
	padding: 16px 18px;
	text-align: center;
}

.mcp-product-card img {
	display: block;
	width:38px;
}

.mcp-product-card__name {
	font-size: 16px;
	font-family: 'Zoho_Puvi_Bold';
	letter-spacing: -0.01em;
	color: #000;
	line-height: 1.25;
	padding: 0 0 0 10px;
	font-family: 'Zoho_Puvi_Bold';
}

.mcp-create__cta {
	display: flex;
	justify-content: center;
}

/* ================================================================
   SUPPORTED CLIENTS (marquee)
   ================================================================ */
.mcp-clients {
background: #fff;
}

.mcp-clients__h2 {
	margin: 0 0 20px;
	font-size: 42px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: var(--n-900);
	text-align: center;
}

.mcp-clients__sub {
	margin: 0 auto;
	font-size: 18px;
	line-height: 1.6;
	color: var(--n-700);
	max-width: 60ch;
	text-align: center;
}

.mcp-marquee-mask {
	margin-top: 52px;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.mcp-marquee-track {
	display: flex;
	width: max-content;
	gap: 20px;
	animation: mcpMarquee 34s linear infinite;
}

.mcp-marquee-track:hover { animation-play-state: paused; }

.mcp-client-chip {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	flex: none;
	background: var(--n-100);
	border: 1px solid var(--border-soft);
	border-radius: 14px;
	padding: 20px 30px;
	box-shadow: var(--shadow-still);
}

.mcp-client-chip img {
	display: block;
	width:40px;
}

.mcp-client-chip span {
	font-size: 18px;
	font-family: 'Zoho_Puvi_SemiBold';
	color: var(--n-900);
	white-space: nowrap;
}

/* ================================================================
   AI CAPABILITIES
   ================================================================ */
.mcp-ai-caps {
	background: #fff;
}

.mcp-ai-caps__h2 {
	margin: 0 0 44px;
	font-size: 42px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: #000;
	text-align: center;
}

.mcp-ai-caps__grid {
	margin-left: -15px;
	margin-right: -15px;
}

.mcp-ai-card {
	height: 100%;
	background: #fff;
	border: 1px solid var(--border-soft);
	border-radius: 16px;
	padding: 40px;
	display: flex;
	flex-direction: column;
	box-shadow: var(--shadow-still);
}

.mcp-ai-card__h3 {
	margin: 0 0 28px;
	font-size: 24px;
	line-height: 1.25;
	color: #000;
	font-family: 'Zoho_Puvi_Bold';
}

.mcp-ai-card__p {
	margin: 0 0 28px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--n-700);
	flex: 1;
}

/* ================================================================
   FAQ
   ================================================================ */
.mcp-faq {
	background: #0B0B0F;
}

.mcp-faq__h2 {
	margin: 0 0 48px;
	font-size: 42px;
	font-family: 'Zoho_Puvi_Bold';
	line-height: 1.12;
	letter-spacing: -0.02em;
	color: #fff;
	text-align: center;
}

.mcp-faq__list {
	display: block;
	width: 70%;
	margin: 0 auto;
}

.mcp-faq__item + .mcp-faq__item {
	margin-top: 12px;
}

.mcp-faq__item--hidden { display: none; }

.mcp-faq__more-wrap {
	text-align: center;
	margin-top: 32px;
}

.mcp-faq__more-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #fff;
	font-family: 'Zoho_Puvi_SemiBold';
	font-size: 15px;
	text-decoration: underline;
	transition: opacity 140ms ease;
}

.mcp-faq__more-link:hover {text-decoration: none; }

.mcp-faq__item {
	border-radius: 14px;
	border: 1px solid rgba(255,255,255,0.10);
	background: rgba(255,255,255,0.04);
	overflow: hidden;
	transition: border-color 140ms ease;
}

.mcp-faq__item.is-open {
    border-color: rgb(106, 163, 255, .8);
}

.mcp-faq__q {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 20px 24px;
	background: transparent;
	border: 0;
	cursor: pointer;
	text-align: left;
	font-family: var(--font-sans);
	font-size: 17px;
	font-family: 'Zoho_Puvi_SemiBold';
	color: #fff;
	transition: color 140ms ease;
}

.mcp-faq__q:hover { color: rgba(255,255,255,0.85); }

.mcp-faq__sign {
	font-size: 22px;
	font-family: 'Zoho_Puvi_Regular';
	color: rgba(255,255,255,0.4);
	flex: none;
	line-height: 1;
	transition: transform 200ms ease, color 140ms ease;
	width: 28px;
    height: 28px;
	border-radius: 50%;
	background: transparent;
    text-align: center;
    line-height: 26px;
}

.mcp-faq__item.is-open .mcp-faq__sign {
    transform: rotate(180deg);
    background: rgb(106, 163, 255);
    color: rgb(11, 11, 15);
    text-align: center;
    line-height: 26px;
}

.mcp-faq__a {
	padding: 0 24px 24px;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(255,255,255,0.68);
}

.mcp-faq__a p { margin: 0 0 1em; }
.mcp-faq__a p:last-child { margin-bottom: 0; }

.mcp-faq__note {
	text-align: center;
	margin: 32px 0 0;
	font-size: 13px;
	color: rgba(255,255,255,0.4);
}

/* ================================================================
   RESPONSIVE — Small desktop / iPad Pro landscape  ≤ 1100px
   ================================================================ */
@media (max-width: 1200px) {

.container{max-width: 90%;}
}
@media (max-width: 1100px) {

	/* Hero: tighten without collapsing */

	/* Coverage */
	.mcp-cov__panel-h3 { font-size: 30px; }

	/* Products: cols-md-4 handles 3 per row */

	/* AI caps: keep 2 col but tighter cards */
	.mcp-ai-card { padding: 32px; }
}
@media (max-width: 1025px) {
#commonHeader{
	height: 58px;
    min-height: 58px;
}
}

/* ================================================================
   RESPONSIVE — iPad landscape / large tablet  ≤ 992px
   ================================================================ */
@media (max-width: 992px) {

	/* Hero */
	.mcp-hero__widget-wrap { padding-top: 40px; }
	/* Use cases */
	.mcp-uc__header-right{padding-top: 20px;}
	.mcp-uc__h2{padding: 0;}

	/* Coverage: still 2-col, nav narrower */
	.mcp-cov__nav-item { padding: 12px 14px; }
	.mcp-cov__panel-h3 { font-size: 26px; }
	.mcp-cov__panel-desc { font-size: 16px; }
	

	/* API banner */
	.mcp-api-card { padding: 34px 36px; }
	.mcp-api-card__h3{margin-bottom: 25px;}


	/* Clients */

	/* AI caps */
	.mcp-ai-card__h3 { font-size: 22px; }
	.mcp-ai-card{margin:20px auto auto;text-align:center;}
	.mcp-api-card__inner{display:block;text-align:center;}
	.mcp-coverage .mcp-terminal-frame__body img{width:100%;}

}
@media (max-width: 850px) {
	.mcp-lightbox__iframe {
    width: 600px;
    height: 337px;
    }
}
/* ================================================================
   RESPONSIVE — iPad portrait / large phone  ≤ 768px
   ================================================================ */
@media (max-width: 768px) {
	section{padding:80px 0;}
	br{display:none;}
	h2, .mcp-faq__h2, .mcp-ai-caps__h2, .mcp-cov__h2, .mcp-create__h2, .mcp-clients__h2{font-size: 30px;}
	/* Hero */
	.mcp-hero{padding: 80px 0;}
	.mcp-hero__widget-wrap { padding-top: 40px; }
	.mcp-hero__h1{font-size: 40px;text-align: center;}
	.mcp-hero__h1 br { display: none; }
	.mcp-hero__sub{text-align: center;}
	.mcp-page .me-btn{text-align: center;margin:auto;}

	/* Use cases: collapse header to 1 col */
	.mcp-uc__header { margin-bottom: 40px; padding-bottom: 32px; }
	.mcp-uc__h2 { font-size: 30px;line-height: 1.4;}
	.mcp-uc__demo-title { max-width: 100%; }
	.mcp-use-cases{text-align:center;}

	/* Coverage: collapse to 1 col, nav → horizontal scroll tabs */
	.mcp-cov__nav {
		position: static;
		flex-direction: row;
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		border-radius: 12px;
		padding: 6px;
		gap: 4px;
		display: flex;
	}
	.mcp-cov__nav::-webkit-scrollbar { display: none; }
	.mcp-cov__nav-item {
		flex: 0 0 auto;
		width: auto;
		white-space: nowrap;
		padding: 10px 16px;
	}
	.mcp-cov__nav-arrow { display: none; }
	.mcp-cov__panel-h3 { font-size: 24px; max-width: none; }
	.mcp-cov__panel-desc { font-size: 15px; max-width: none; }

	/* API banner */
	.mcp-api-card__h3 { flex: 1 1 100%; margin-bottom: 25px; text-align: center;font-size: 24px; }

	/* Create servers: cols-sd-6 handles 2 per row */
   .mcp-cov__h2, .mcp-cov__sub{text-align:center;}
   

	/* Clients */
	.mcp-client-chip { padding: 16px 22px; }
	.mcp-client-chip span { font-size: 16px; }

	/* AI caps: collapse to 1 col handled by cols-sd-12 */
	.mcp-ai-card { padding: 28px; text-align: center; border-color: #C4C4C4; }
	.mcp-ai-card .me-btn { width: 100%; justify-content: center; }
	.mcp-ai-caps__grid .cols-sd-12{padding:0;}

	/* FAQ */
	.mcp-faq__list{width:100%;}
	.mcp-lightbox__stage,.mcp-lightbox__iframe{width: 100%;}
}

/* ================================================================
   RESPONSIVE — Small phone  ≤ 480px
   ================================================================ */
@media (max-width: 480px) {

	/* Hero */
	.mcp-hero__copy { text-align: center; }
	.mcp-hero__sub { max-width: none; }
	.mcp-hero__cta { flex-direction: column; align-items: center; gap: 12px; }
	.mcp-hero__widget-wrap { max-width: 100%; }
	.mcp-hero__widget { padding: 16px; }
	.mcp-hero__chat-bubble { max-width: 88%; font-size: 13px; }
	.mcp-tool-row { padding: 10px 12px; }
	.mcp-tool-text { font-size: 12px; }
	.mcp-page .me-btn--xl{padding: 0 8px 0 14px;}

	/* Coverage */
	.mcp-cov__panel-h3 { font-size: 20px; }
	.mcp-cov__panel-desc { font-size: 14px; }
	.mcp-cov__chain { gap: 6px; }
	.mcp-cov__badge { font-size: 12px; padding: 5px 9px; }
	.mcp-cov__nav-item { padding: 9px 13px;}

	/* API banner */

	/* Create servers */
	.mcp-product-card { height: 80px; gap: 3px; padding: 12px; }

	/* Clients */
	.mcp-client-chip { padding: 12px 18px; gap: 10px; }
	.mcp-client-chip img { width: 24px; height: 24px; }
	.mcp-client-chip span { font-size: 14px; }

	/* AI caps */
	.mcp-ai-card { padding: 22px; text-align: center; border-color: #C4C4C4; }
	.mcp-ai-card .me-btn { width: 100%; justify-content: center; }
	.mcp-ai-card__p { font-size: 14px; }
    .mcp-ai-card .me-btn__icon{display:none;}
	.mcp-page .me-btn--lg{padding: 0 8px 0 12px;}
	.mcp-lightbox__iframe{height: 400px;}
}