:root {
  --mcn-bg: #2f3134;
  --mcn-bg-deep: #242629;
  --mcn-bg-mid: #383b3f;
  --mcn-bg-soft: #44484c;
  --mcn-panel: #3a3d41;
  --mcn-light: #f2f2f0;
  --mcn-light-2: #e8e8e5;
  --mcn-light-3: #dcdedc;
  --mcn-text: #f7f7f5;
  --mcn-dark: #17191b;
  --mcn-muted: #b9bdc1;
  --mcn-muted-dark: #676c70;
  --mcn-line: rgba(255,255,255,.12);
  --mcn-line-strong: rgba(255,255,255,.18);
  --mcn-line-dark: rgba(20,21,22,.12);
  --mcn-radius: 18px;
  --mcn-radius-lg: 26px;
  --mcn-shadow: 0 28px 80px rgba(0,0,0,.18);
  --mcn-shadow-soft: 0 14px 44px rgba(16,18,20,.10);
  --mcn-max: 1260px;
  --mcn-header-top-h: 34px;
  --mcn-header-main-h: 68px;
  --mcn-header-h: calc(var(--mcn-header-top-h) + var(--mcn-header-main-h));
}

html { scroll-behavior:smooth; }
body.mcnkemda-canvas { margin:0; background:var(--mcn-bg); }
body.mcnkemda-canvas .elementor { overflow-x:clip; }
body.mcnkemda-canvas .elementor-section,
body.mcnkemda-canvas .elementor-column,
body.mcnkemda-canvas .elementor-widget-wrap,
body.mcnkemda-canvas .elementor-widget,
body.mcnkemda-canvas .elementor-widget-container { margin:0; padding:0; }
body.mcnkemda-canvas .elementor-section.elementor-section-boxed > .elementor-container { max-width:none; }

.mcn-site,
.mcn-site *,
[class*="elementor-widget-mcnkemda-"] .mcn-section,
[class*="elementor-widget-mcnkemda-"] .mcn-section * { box-sizing:border-box; }

.mcn-site,
[class*="elementor-widget-mcnkemda-"] {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  color:var(--mcn-text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.mcn-site { background:var(--mcn-bg); min-height:100vh; overflow:hidden; }
.mcn-container { width:min(calc(100% - 52px), var(--mcn-max)); margin:0 auto; }
.mcn-section { position:relative; padding:100px 0; background:var(--mcn-bg); }
.mcn-section.mcn-light { background:var(--mcn-light); color:var(--mcn-dark); }
.mcn-section h1,.mcn-section h2,.mcn-section h3,.mcn-section p { margin-top:0; }
.mcn-section h2 {
  margin-bottom:16px;
  font-size:clamp(36px,4vw,60px);
  line-height:.98;
  letter-spacing:-.048em;
  font-weight:800;
}
.mcn-kicker {
  display:block;
  margin-bottom:13px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.22em;
  text-transform:uppercase;
  opacity:.66;
}
.mcn-section-head { max-width:780px; margin:0 auto 44px; text-align:center; }
.mcn-section-head p { margin:0 auto; max-width:650px; font-size:15px; line-height:1.75; color:#606469; }
.mcn-section-head-light p { color:#c1c4c7; }
.mcn-center { display:flex; justify-content:center; margin-top:34px; }

/* Header */
.mcn-header {
  position:fixed; z-index:9990; top:0; left:0; right:0;
  background:rgba(36,38,41,.94);
  border-bottom:1px solid var(--mcn-line);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 10px 34px rgba(0,0,0,.10);
}
.mcn-header-top { height:var(--mcn-header-top-h); border-bottom:1px solid rgba(255,255,255,.075); background:rgba(19,20,22,.26); }
.mcn-header-top-inner { height:100%; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:22px; }
.mcn-header-identity { display:flex; align-items:center; gap:12px; min-width:0; }
.mcn-header-identity strong { font-size:11px; letter-spacing:.05em; font-weight:760; }
.mcn-header-identity span { font-size:8px; letter-spacing:.24em; color:#aeb2b6; white-space:nowrap; }
.mcn-header-contact { display:flex; align-items:center; gap:18px; }
.mcn-header-contact a { display:flex; align-items:center; gap:7px; color:#d7d9db; text-decoration:none; font-size:9px; letter-spacing:.02em; transition:.2s ease; }
.mcn-header-contact a:hover { color:#fff; }
.mcn-header-contact svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.7; }
.mcn-header-main { height:var(--mcn-header-main-h); display:grid; grid-template-columns:230px 1fr 46px; align-items:center; gap:24px; }
.mcn-brand { color:#fff; text-decoration:none; line-height:1; }
.mcn-brand strong { display:block; font-size:17px; letter-spacing:.055em; font-weight:820; }
.mcn-brand span { display:block; margin-top:7px; font-size:7px; letter-spacing:.31em; opacity:.62; }
.mcn-nav { display:flex; align-items:center; justify-content:flex-end; gap:26px; }
.mcn-nav a { position:relative; color:#fff; text-decoration:none; font-size:11px; font-weight:650; opacity:.72; transition:.2s ease; }
.mcn-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-9px; height:1px; background:#fff; transition:right .25s ease; }
.mcn-nav a:hover { opacity:1; }
.mcn-nav a:hover::after { right:0; }
.mcn-socials { display:flex; align-items:center; gap:8px; }
.mcn-header-top .mcn-socials a { width:23px; height:23px; border:0; opacity:.72; }
.mcn-socials a { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--mcn-line); border-radius:50%; color:inherit; text-decoration:none; font-size:9px; font-weight:800; transition:.22s ease; }
.mcn-socials a:hover { background:#fff; color:#222; transform:translateY(-2px); }
.mcn-socials svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mcn-socials svg .fill, .mcn-socials .fill { fill:currentColor; stroke:none; }
.mcn-socials a[aria-label="YouTube"] svg path { fill:currentColor; stroke:none; }
.mcn-socials a[aria-label="LinkedIn"] svg rect,
.mcn-socials a[aria-label="LinkedIn"] svg path { fill:currentColor; stroke:none; }
.mcn-menu-toggle { display:none; width:42px; height:42px; border:1px solid var(--mcn-line); border-radius:50%; color:#fff; background:transparent; padding:10px; }
.mcn-menu-toggle svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }

/* Exact client banner hero */
.mcn-hero {
  padding:calc(var(--mcn-header-h) + 36px) 0 48px;
  background:
    radial-gradient(circle at 15% 15%, rgba(255,255,255,.06), transparent 34%),
    linear-gradient(145deg,#3d4044 0%,#313438 48%,#292b2e 100%);
}
.mcn-hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent); }
.mcn-hero-frame {
  position:relative;
  overflow:hidden;
  border-radius:var(--mcn-radius-lg);
  background:#1f2022;
  box-shadow:0 38px 110px rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.11);
  isolation:isolate;
}
.mcn-hero-frame::before { content:""; position:absolute; z-index:2; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(255,255,255,.04); pointer-events:none; }
.mcn-hero-frame img { position:relative; z-index:1; display:block; width:100%; height:auto; object-fit:contain; }
.mcn-hero-glow { position:absolute; z-index:0; width:34%; aspect-ratio:1; border-radius:50%; filter:blur(70px); opacity:.14; background:#fff; animation:mcnDrift 9s ease-in-out infinite alternate; }
.mcn-hero-glow-a { top:-18%; left:-8%; }
.mcn-hero-glow-b { right:-10%; bottom:-24%; animation-delay:-3s; }
@keyframes mcnDrift { from{ transform:translate3d(0,0,0) scale(.92); } to{ transform:translate3d(18px,12px,0) scale(1.08); } }

/* Stats */
.mcn-stats-section { padding:0 0 70px; background:var(--mcn-bg); }
.mcn-stats { display:grid; grid-template-columns:repeat(5,1fr); overflow:hidden; border-radius:18px; border:1px solid rgba(255,255,255,.12); background:linear-gradient(180deg,#45484c,#35383b); box-shadow:0 22px 70px rgba(0,0,0,.16); }
.mcn-stat { position:relative; min-height:118px; padding:26px 24px; display:flex; flex-direction:column; justify-content:center; border-right:1px solid var(--mcn-line); }
.mcn-stat:last-child { border-right:0; }
.mcn-stat::after { content:""; position:absolute; left:24px; bottom:18px; width:28px; height:1px; background:rgba(255,255,255,.25); }
.mcn-stat strong { font-size:clamp(23px,2.6vw,37px); line-height:1; letter-spacing:-.045em; font-weight:780; }
.mcn-stat span { margin-top:9px; padding-right:24px; font-size:9px; line-height:1.45; letter-spacing:.10em; text-transform:uppercase; color:#d2d4d5; }

/* Buttons */
.mcn-btn { min-height:45px; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:0 24px; border-radius:999px; border:1px solid transparent; font:inherit; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; cursor:pointer; text-decoration:none; transition:.24s ease; }
.mcn-btn svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; }
.mcn-btn-outline { background:transparent; color:#1b1d1e; border-color:#1b1d1e; }
.mcn-btn-outline:hover { background:#1b1d1e; color:#fff; transform:translateY(-2px); }
.mcn-btn-light { background:#f3f3f1; color:#202223; }
.mcn-btn-light:hover { background:#fff; transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.16); }

/* Video portfolio - J5-inspired clean project grid, without invented titles */
.mcn-videos-section { padding-top:96px; padding-bottom:58px; }
.mcn-video-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.mcn-video-card { position:relative; aspect-ratio:16/9; overflow:hidden; border:1px solid rgba(0,0,0,.08); border-radius:12px; padding:0; cursor:pointer; background:#242629; box-shadow:var(--mcn-shadow-soft); }
.mcn-video-card img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s cubic-bezier(.2,.7,.2,1), filter .5s ease; }
.mcn-video-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(20,20,20,.02),rgba(12,12,12,.42)); opacity:.56; transition:.25s ease; }
.mcn-video-sheen { position:absolute; z-index:2; top:-120%; left:-60%; width:45%; height:320%; transform:rotate(25deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent); opacity:0; transition:transform .7s ease, opacity .35s ease; }
.mcn-video-card:hover img { transform:scale(1.045); filter:contrast(1.05) saturate(.9); }
.mcn-video-card:hover::after { opacity:.78; }
.mcn-video-card:hover .mcn-video-sheen { opacity:.55; transform:translateX(360%) rotate(25deg); }
.mcn-play { position:absolute; z-index:3; top:50%; left:50%; width:48px; height:48px; transform:translate(-50%,-50%); display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.94); color:#222426; box-shadow:0 8px 24px rgba(0,0,0,.22); transition:.24s ease; }
.mcn-video-card:hover .mcn-play { transform:translate(-50%,-50%) scale(1.08); }
.mcn-play svg { width:23px; height:23px; fill:currentColor; stroke:none; }
.mcn-video-title { position:absolute; z-index:3; left:14px; right:14px; bottom:12px; color:#fff; font-size:10px; text-align:left; font-weight:750; }
.mcn-video-extra { display:none; }
.mcn-video-grid.mcn-expanded .mcn-video-extra { display:block; }

/* Modal */
.mcn-video-modal { position:fixed; z-index:99999; inset:0; display:none; align-items:center; justify-content:center; padding:28px; }
.mcn-video-modal.is-open { display:flex; }
.mcn-video-modal-backdrop { position:absolute; inset:0; background:rgba(10,10,10,.84); backdrop-filter:blur(8px); }
.mcn-video-dialog { position:relative; z-index:1; width:min(100%,1080px); }
.mcn-video-embed { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:16px; background:#000; box-shadow:0 30px 90px rgba(0,0,0,.55); }
.mcn-video-embed iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.mcn-video-close { position:absolute; right:-10px; top:-52px; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; border:1px solid rgba(255,255,255,.35); color:#fff; background:#303235; cursor:pointer; }
.mcn-video-close svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:2; }

/* Audio */
.mcn-audio-section { padding-top:54px; padding-bottom:96px; }
.mcn-audio-section::before { content:""; display:block; position:absolute; top:0; left:50%; width:min(calc(100% - 52px),var(--mcn-max)); transform:translateX(-50%); height:1px; background:rgba(20,21,22,.10); }
.mcn-audio-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.mcn-audio-card { min-width:0; padding:20px; border:1px solid rgba(255,255,255,.09); border-radius:14px; background:linear-gradient(145deg,#303235,#242628); color:#fff; box-shadow:0 12px 30px rgba(0,0,0,.12); transition:.25s ease; }
.mcn-audio-card:hover { transform:translateY(-4px); box-shadow:0 20px 40px rgba(0,0,0,.18); }
.mcn-audio-top { display:flex; align-items:center; gap:12px; }
.mcn-audio-index { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:50%; background:#f1f1ef; color:#222; }
.mcn-audio-index svg { width:18px; height:18px; fill:currentColor; stroke:none; }
.mcn-audio-card h3 { margin:0 0 5px; font-size:14px; line-height:1.25; }
.mcn-audio-card p { margin:0; font-size:10px; color:#bbb; }
.mcn-audio-card audio { display:block; width:100%; height:37px; margin-top:15px; filter:grayscale(1) contrast(.92); }

/* About */
.mcn-about-section { background:linear-gradient(145deg,#33363a,#2d3033); }
.mcn-about-section::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 85% 15%,rgba(255,255,255,.055),transparent 30%); }
.mcn-about-grid { position:relative; display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:76px; align-items:center; }
.mcn-about-image { position:relative; min-height:560px; border-radius:22px; overflow:hidden; background:#222; box-shadow:0 30px 80px rgba(0,0,0,.22); border:1px solid rgba(255,255,255,.10); }
.mcn-about-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 60%,rgba(20,22,24,.25)); pointer-events:none; }
.mcn-about-image img { width:100%; height:100%; min-height:560px; object-fit:cover; object-position:center; filter:grayscale(1); transition:transform .65s ease; }
.mcn-about-image:hover img { transform:scale(1.018); }
.mcn-about-copy h2 { color:#fff; }
.mcn-richtext { color:#d0d2d3; font-size:15px; line-height:1.88; }
.mcn-richtext p:last-child { margin-bottom:0; }

/* Accents + Services */
.mcn-capabilities-section { background:var(--mcn-light); color:var(--mcn-dark); padding-top:78px; padding-bottom:84px; }
.mcn-capabilities-grid { display:grid; grid-template-columns:.78fr 1.22fr; gap:18px; }
.mcn-capability-card { position:relative; padding:42px; border:1px solid var(--mcn-line-dark); border-radius:18px; background:rgba(255,255,255,.72); box-shadow:0 10px 30px rgba(0,0,0,.035); overflow:hidden; }
.mcn-capability-card::before { content:""; position:absolute; right:-80px; bottom:-80px; width:190px; height:190px; border-radius:50%; background:radial-gradient(circle,rgba(0,0,0,.045),transparent 70%); }
.mcn-capability-card h2 { position:relative; font-size:34px; }
.mcn-check-list { position:relative; list-style:none; margin:24px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:12px 18px; }
.mcn-service-list { grid-template-columns:1fr; }
.mcn-check-list li { display:flex; gap:10px; align-items:flex-start; font-size:13px; line-height:1.5; color:#333638; }
.mcn-check-list li > span { width:20px; height:20px; flex:0 0 20px; display:grid; place-items:center; border-radius:50%; border:1px solid #c6c8c8; background:#f4f4f2; }
.mcn-check-list svg { width:11px; height:11px; fill:none; stroke:#1b1d1e; stroke-width:2.2; }

/* Why work with me */
.mcn-why-section { background:linear-gradient(145deg,#3b3e42,#303337); }
.mcn-benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.mcn-benefit { min-height:148px; padding:24px; display:flex; gap:15px; align-items:flex-start; border:1px solid var(--mcn-line); border-radius:14px; background:rgba(255,255,255,.035); transition:.24s ease; }
.mcn-benefit:hover { transform:translateY(-4px); background:rgba(255,255,255,.055); border-color:var(--mcn-line-strong); }
.mcn-benefit-icon { flex:0 0 28px; width:28px; height:28px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.28); border-radius:50%; }
.mcn-benefit svg { width:14px; height:14px; fill:none; stroke:#fff; stroke-width:2; }
.mcn-benefit p { margin:0; font-size:12px; line-height:1.7; color:#d6d8da; }

/* Premium client wall inspired by Toby reference - real supplied logos only */
.mcn-clients-section { padding-top:96px; padding-bottom:102px; }
.mcn-logo-stage { position:relative; padding:36px 30px; border-top:1px solid rgba(20,21,22,.12); border-bottom:1px solid rgba(20,21,22,.12); }
.mcn-logo-stage::before,
.mcn-logo-stage::after { content:""; position:absolute; top:0; bottom:0; width:110px; z-index:2; pointer-events:none; }
.mcn-logo-stage::before { left:0; background:linear-gradient(90deg,var(--mcn-light),transparent); }
.mcn-logo-stage::after { right:0; background:linear-gradient(-90deg,var(--mcn-light),transparent); }
.mcn-logo-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(9,1fr); align-items:center; gap:26px 24px; }
.mcn-logo { min-height:72px; display:flex; align-items:center; justify-content:center; padding:3px; background:transparent; opacity:.76; transition:transform .28s ease, opacity .28s ease; }
.mcn-logo img { display:block; max-width:100%; max-height:58px; width:auto; height:auto; object-fit:contain; filter:grayscale(1) saturate(0) contrast(.92); transition:filter .28s ease, transform .28s ease; }
.mcn-logo:hover { opacity:1; transform:translateY(-3px); }
.mcn-logo:hover img { filter:grayscale(0) saturate(.82); transform:scale(1.05); }

/* Reviews carousel */
.mcn-testimonials-section { background:linear-gradient(150deg,#3b3e42,#2e3134); }
.mcn-testimonial-shell { position:relative; padding:0 52px; }
.mcn-testimonial-track { display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 28px)/3); gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; scroll-behavior:smooth; }
.mcn-testimonial-track::-webkit-scrollbar { display:none; }
.mcn-testimonial { scroll-snap-align:start; position:relative; margin:0; min-height:270px; padding:30px; display:flex; flex-direction:column; border:1px solid var(--mcn-line); border-radius:16px; background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.035)); box-shadow:0 18px 48px rgba(0,0,0,.10); }
.mcn-quote { width:34px; height:34px; display:grid; place-items:center; color:#f0f1f2; opacity:.65; }
.mcn-quote svg { width:28px; height:28px; fill:currentColor; }
.mcn-testimonial p { margin:18px 0 28px; font-size:14px; line-height:1.75; color:#eef0f1; }
.mcn-testimonial footer { margin-top:auto; display:flex; flex-direction:column; gap:5px; }
.mcn-testimonial footer strong { font-size:12px; line-height:1.45; color:#fff; }
.mcn-testimonial footer span { font-size:10px; color:#bfc2c4; }
.mcn-slider-arrow { position:absolute; z-index:3; top:50%; width:38px; height:38px; margin-top:-19px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--mcn-line-strong); background:#303337; color:#fff; cursor:pointer; transition:.22s ease; }
.mcn-slider-arrow:hover { background:#fff; color:#222; }
.mcn-slider-prev { left:0; }
.mcn-slider-next { right:0; }
.mcn-slider-arrow svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; }

/* Awards */
.mcn-awards-section { background:#33363a; padding-top:84px; padding-bottom:92px; }
.mcn-awards-grid { max-width:1020px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.mcn-award-card { overflow:hidden; display:grid; grid-template-columns:190px 1fr; min-height:235px; border:1px solid var(--mcn-line); border-radius:16px; background:rgba(255,255,255,.04); box-shadow:0 15px 40px rgba(0,0,0,.10); transition:.24s ease; }
.mcn-award-card:hover { transform:translateY(-4px); border-color:var(--mcn-line-strong); }
.mcn-award-image { background:#25272a; display:flex; align-items:center; justify-content:center; padding:16px; }
.mcn-award-image img { max-width:100%; max-height:205px; object-fit:contain; display:block; }
.mcn-award-copy { padding:30px; display:flex; flex-direction:column; justify-content:center; }
.mcn-award-copy h3 { margin:0 0 12px; font-size:24px; }
.mcn-award-copy p { margin:0; color:#c9cbcd; font-size:12px; line-height:1.7; }

/* Direct contact - no web form, exactly as confirmed in meeting */
.mcn-contact-section { padding-top:82px; padding-bottom:78px; background:linear-gradient(145deg,#46494d 0%,#313438 72%); }
.mcn-contact-grid { overflow:hidden; display:grid; grid-template-columns:1.12fr .88fr; min-height:540px; border:1px solid var(--mcn-line); border-radius:22px; background:#34373a; box-shadow:var(--mcn-shadow); }
.mcn-contact-copy { padding:58px; display:flex; flex-direction:column; justify-content:center; }
.mcn-contact-copy h2 { margin-bottom:22px; }
.mcn-contact-copy > p { max-width:720px; margin-bottom:13px; color:#d5d7d9; font-size:13px; line-height:1.75; }
.mcn-contact-note { font-size:11px !important; color:#bfc2c4 !important; }
.mcn-contact-actions { margin:18px 0; display:grid; gap:10px; }
.mcn-contact-row { width:max-content; max-width:100%; display:flex; gap:12px; align-items:center; color:#fff; text-decoration:none; font-size:12px; }
.mcn-contact-row span { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--mcn-line); border-radius:50%; }
.mcn-contact-row svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.8; }
.mcn-contact-socials { margin:5px 0 26px; }
.mcn-contact-image { min-height:540px; background:#232527; overflow:hidden; }
.mcn-contact-image img { width:100%; height:100%; object-fit:cover; object-position:center; filter:grayscale(1); transition:transform .7s ease; }
.mcn-contact-grid:hover .mcn-contact-image img { transform:scale(1.018); }
.mcn-contact-copy .mcn-btn { align-self:flex-start; }

/* Footer */
.mcn-footer { background:#202225; color:#bfc2c4; border-top:1px solid var(--mcn-line); }
.mcn-footer-inner { min-height:88px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.mcn-footer p { margin:0; font-size:10px; }

/* Section reveal and stagger */
.mcn-reveal { opacity:0; transform:translateY(26px); transition:opacity .72s ease, transform .72s cubic-bezier(.2,.7,.2,1); }
.mcn-reveal.mcn-visible { opacity:1; transform:none; }
.mcn-logo.mcn-stagger { opacity:0; transform:translateY(10px); }
.mcn-logo.mcn-stagger.mcn-stagger-in { opacity:.76; transform:none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .mcn-reveal { opacity:1; transform:none; transition:none; }
  .mcn-video-card img,.mcn-btn,.mcn-logo,.mcn-logo img,.mcn-benefit,.mcn-award-card,.mcn-contact-image img,.mcn-audio-card { transition:none; }
  .mcn-hero-glow { animation:none; }
}

/* Laptop / tablet */
@media (max-width: 1180px) {
  .mcn-header-top-inner { grid-template-columns:1fr auto; }
  .mcn-header-identity { display:none; }
  .mcn-header-main { grid-template-columns:210px 1fr 46px; }
  .mcn-nav { gap:16px; }
  .mcn-nav a { font-size:10px; }
  .mcn-video-grid { grid-template-columns:repeat(3,1fr); }
  .mcn-audio-grid { grid-template-columns:repeat(2,1fr); }
  .mcn-stats { grid-template-columns:repeat(3,1fr); }
  .mcn-stat:nth-child(3) { border-right:0; }
  .mcn-stat:nth-child(-n+3) { border-bottom:1px solid var(--mcn-line); }
  .mcn-about-grid { gap:44px; }
  .mcn-benefit-grid { grid-template-columns:repeat(2,1fr); }
  .mcn-logo-grid { grid-template-columns:repeat(6,1fr); }
  .mcn-testimonial-track { grid-auto-columns:calc((100% - 14px)/2); }
  .mcn-award-card { grid-template-columns:155px 1fr; }
}

@media (max-width: 900px) {
  :root { --mcn-header-top-h:0px; --mcn-header-main-h:72px; }
  .mcn-header-top { display:none; }
  .mcn-container { width:min(calc(100% - 32px), var(--mcn-max)); }
  .mcn-section { padding:76px 0; }
  .mcn-header-main { grid-template-columns:1fr auto; }
  .mcn-menu-toggle { display:grid; place-items:center; }
  .mcn-nav { position:fixed; top:var(--mcn-header-h); left:16px; right:16px; display:none; padding:18px; flex-direction:column; align-items:stretch; border:1px solid var(--mcn-line); border-radius:15px; background:#303337; box-shadow:0 28px 70px rgba(0,0,0,.34); }
  .mcn-nav.is-open { display:flex; }
  .mcn-nav a { padding:10px 4px; font-size:12px; }
  .mcn-nav a::after { display:none; }
  .mcn-hero { padding-top:calc(var(--mcn-header-h) + 24px); }
  .mcn-hero-frame { border-radius:18px; }
  .mcn-video-grid { grid-template-columns:repeat(2,1fr); }
  .mcn-about-grid { grid-template-columns:1fr; }
  .mcn-about-image { min-height:0; max-height:650px; }
  .mcn-about-image img { min-height:0; aspect-ratio:1/1; }
  .mcn-capabilities-grid { grid-template-columns:1fr; }
  .mcn-check-list { grid-template-columns:1fr 1fr; }
  .mcn-service-list { grid-template-columns:1fr; }
  .mcn-logo-grid { grid-template-columns:repeat(4,1fr); }
  .mcn-logo-stage { padding-inline:12px; }
  .mcn-logo-stage::before,.mcn-logo-stage::after { width:45px; }
  .mcn-awards-grid { grid-template-columns:1fr; }
  .mcn-contact-grid { grid-template-columns:1fr; }
  .mcn-contact-image { min-height:410px; order:-1; }
}

@media (max-width: 640px) {
  :root { --mcn-header-main-h:68px; }
  .mcn-container { width:min(calc(100% - 24px), var(--mcn-max)); }
  .mcn-section { padding:60px 0; }
  .mcn-section h2 { font-size:36px; }
  .mcn-brand strong { font-size:14px; }
  .mcn-brand span { font-size:6px; }
  .mcn-hero { padding-top:calc(var(--mcn-header-h) + 14px); padding-bottom:28px; }
  .mcn-hero-container { width:100%; }
  .mcn-hero-frame { border-radius:0; border-left:0; border-right:0; }
  .mcn-stats-section { padding:0 0 46px; }
  .mcn-stats { grid-template-columns:repeat(2,1fr); border-radius:12px; }
  .mcn-stat { min-height:102px; padding:20px 16px; border-bottom:1px solid var(--mcn-line); }
  .mcn-stat:nth-child(odd) { border-right:1px solid var(--mcn-line); }
  .mcn-stat:nth-child(even) { border-right:0; }
  .mcn-stat:last-child { grid-column:1/-1; border-bottom:0; }
  .mcn-stat strong { font-size:24px; }
  .mcn-video-grid { grid-template-columns:1fr; gap:12px; }
  .mcn-video-card { border-radius:10px; }
  .mcn-audio-grid { grid-template-columns:1fr; }
  .mcn-audio-card { padding:18px; }
  .mcn-about-grid { gap:28px; }
  .mcn-about-image { border-radius:15px; }
  .mcn-richtext { font-size:14px; line-height:1.78; }
  .mcn-capability-card { padding:27px 21px; }
  .mcn-capability-card h2 { font-size:30px; }
  .mcn-check-list { grid-template-columns:1fr; }
  .mcn-benefit-grid { grid-template-columns:1fr; }
  .mcn-benefit { min-height:0; }
  .mcn-logo-grid { grid-template-columns:repeat(3,1fr); gap:20px 15px; }
  .mcn-logo { min-height:58px; }
  .mcn-logo img { max-height:46px; }
  .mcn-testimonial-shell { padding:0 38px; }
  .mcn-testimonial-track { grid-auto-columns:100%; }
  .mcn-testimonial { min-height:0; padding:24px; }
  .mcn-slider-arrow { width:32px; height:32px; margin-top:-16px; }
  .mcn-award-card { grid-template-columns:1fr; }
  .mcn-award-image { min-height:220px; }
  .mcn-contact-grid { border-radius:15px; }
  .mcn-contact-copy { padding:34px 22px; }
  .mcn-contact-image { min-height:335px; }
  .mcn-contact-row { font-size:11px; }
  .mcn-footer-inner { padding:24px 0; min-height:0; flex-direction:column; text-align:center; }
  .mcn-video-modal { padding:14px; }
  .mcn-video-close { right:0; top:-48px; }
}

/* Elementor editor: always show a full live preview and never let reveal JS hide widgets. */
.elementor-editor-active .mcn-header { position:relative; top:auto; }
.elementor-editor-active .mcn-header-top { display:block; }
.elementor-editor-active .mcn-hero { padding-top:36px; }
.elementor-editor-active .mcn-reveal { opacity:1 !important; transform:none !important; }
.elementor-editor-active .mcn-video-extra { display:block; }
.elementor-editor-active .mcn-logo { opacity:.76; transform:none; }

/* =========================================================
   v2.0.3 UI hardening
   - Neutral monochrome controls only (no red/pink theme bleed)
   - Header links/brand stay visually stable on hover/visited/focus
   - Keeps accessible neutral focus states
   ========================================================= */
.mcn-site,
[class*="elementor-widget-mcnkemda-"] {
  --mcn-interactive-bg: #303337;
  --mcn-interactive-bg-hover: #f3f3f1;
  --mcn-interactive-fg: #ffffff;
  --mcn-interactive-fg-hover: #202223;
  --mcn-focus: #c8cbcd;
  accent-color: #6f7478;
}

/* Prevent WordPress/theme global link colors (visited/hover/accent) from
   turning the Macdonald Nkemda header blue, purple, red or pink. */
.mcn-header .mcn-brand,
.mcn-header .mcn-brand:link,
.mcn-header .mcn-brand:visited,
.mcn-header .mcn-brand:hover,
.mcn-header .mcn-brand:focus,
.mcn-header .mcn-brand:active,
[class*="elementor-widget-mcnkemda-"] .mcn-header .mcn-brand,
[class*="elementor-widget-mcnkemda-"] .mcn-header .mcn-brand:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.mcn-header .mcn-brand strong,
.mcn-header .mcn-brand span,
.mcn-header .mcn-brand:hover strong,
.mcn-header .mcn-brand:hover span,
.mcn-header .mcn-brand:visited strong,
.mcn-header .mcn-brand:visited span {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

.mcn-header .mcn-nav a,
.mcn-header .mcn-nav a:link,
.mcn-header .mcn-nav a:visited,
.mcn-header .mcn-nav a:hover,
.mcn-header .mcn-nav a:focus,
.mcn-header .mcn-nav a:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
.mcn-header .mcn-nav a::before { background: transparent !important; }
.mcn-header .mcn-nav a::after { background: #ffffff !important; }

.mcn-header .mcn-header-contact a,
.mcn-header .mcn-header-contact a:visited,
.mcn-header .mcn-header-contact a:hover,
.mcn-header .mcn-header-contact a:focus,
.mcn-header .mcn-header-contact a:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: transparent !important;
  text-decoration: none !important;
}

/* Social buttons remain monochrome across hover/visited/focus. */
.mcn-site .mcn-socials a,
.mcn-site .mcn-socials a:link,
.mcn-site .mcn-socials a:visited,
.mcn-site .mcn-socials a:active,
[class*="elementor-widget-mcnkemda-"] .mcn-socials a {
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  background-color: transparent !important;
  border-color: var(--mcn-line) !important;
}
.mcn-site .mcn-socials a:hover,
.mcn-site .mcn-socials a:focus,
[class*="elementor-widget-mcnkemda-"] .mcn-socials a:hover {
  color: #202223 !important;
  -webkit-text-fill-color: #202223 !important;
  background-color: #f3f3f1 !important;
  border-color: #f3f3f1 !important;
}

/* Explicitly neutralize theme button/accent styles on modal and carousel UI. */
.mcn-site .mcn-video-close,
.mcn-site .mcn-slider-arrow,
.mcn-site .mcn-menu-toggle,
[class*="elementor-widget-mcnkemda-"] .mcn-video-close,
[class*="elementor-widget-mcnkemda-"] .mcn-slider-arrow,
[class*="elementor-widget-mcnkemda-"] .mcn-menu-toggle {
  -webkit-appearance: none !important;
  appearance: none !important;
  background: var(--mcn-interactive-bg) !important;
  background-color: var(--mcn-interactive-bg) !important;
  color: var(--mcn-interactive-fg) !important;
  -webkit-text-fill-color: var(--mcn-interactive-fg) !important;
  border-color: rgba(255,255,255,.30) !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
.mcn-site .mcn-video-close:hover,
.mcn-site .mcn-video-close:focus,
.mcn-site .mcn-video-close:active,
.mcn-site .mcn-slider-arrow:hover,
.mcn-site .mcn-slider-arrow:focus,
.mcn-site .mcn-slider-arrow:active,
.mcn-site .mcn-menu-toggle:hover,
.mcn-site .mcn-menu-toggle:focus,
.mcn-site .mcn-menu-toggle:active,
[class*="elementor-widget-mcnkemda-"] .mcn-video-close:hover,
[class*="elementor-widget-mcnkemda-"] .mcn-slider-arrow:hover,
[class*="elementor-widget-mcnkemda-"] .mcn-menu-toggle:hover {
  background: var(--mcn-interactive-bg-hover) !important;
  background-color: var(--mcn-interactive-bg-hover) !important;
  color: var(--mcn-interactive-fg-hover) !important;
  -webkit-text-fill-color: var(--mcn-interactive-fg-hover) !important;
  border-color: #f3f3f1 !important;
  box-shadow: none !important;
}

/* Theme-safe neutral button states for portfolio controls. */
.mcn-site .mcn-btn,
.mcn-site .mcn-video-toggle,
.mcn-site button.mcn-video-card,
[class*="elementor-widget-mcnkemda-"] .mcn-btn,
[class*="elementor-widget-mcnkemda-"] .mcn-video-toggle,
[class*="elementor-widget-mcnkemda-"] button.mcn-video-card {
  outline-color: var(--mcn-focus) !important;
}
.mcn-site .mcn-btn:focus-visible,
.mcn-site .mcn-video-toggle:focus-visible,
.mcn-site .mcn-video-card:focus-visible,
.mcn-site .mcn-video-close:focus-visible,
.mcn-site .mcn-slider-arrow:focus-visible,
.mcn-site .mcn-menu-toggle:focus-visible,
.mcn-site .mcn-socials a:focus-visible,
.mcn-header a:focus-visible {
  outline: 2px solid var(--mcn-focus) !important;
  outline-offset: 3px !important;
  box-shadow: none !important;
}

/* Native media controls: request neutral browser accent where supported. */
.mcn-site audio,
.mcn-site video,
[class*="elementor-widget-mcnkemda-"] audio,
[class*="elementor-widget-mcnkemda-"] video {
  accent-color: #6f7478 !important;
}

/* Final neutral interaction guard: no theme red/pink/accent can leak into plugin UI. */
.mcn-site a:not(.mcn-btn):hover,
.mcn-site a:not(.mcn-btn):focus,
.mcn-site a:not(.mcn-btn):active,
[class*="elementor-widget-mcnkemda-"] a:not(.mcn-btn):hover,
[class*="elementor-widget-mcnkemda-"] a:not(.mcn-btn):focus,
[class*="elementor-widget-mcnkemda-"] a:not(.mcn-btn):active {
  text-decoration-color: currentColor !important;
}
.mcn-site .mcn-btn-outline,
[class*="elementor-widget-mcnkemda-"] .mcn-btn-outline {
  background: transparent !important;
  background-color: transparent !important;
  color: #1b1d1e !important;
  -webkit-text-fill-color: #1b1d1e !important;
  border-color: #1b1d1e !important;
}
.mcn-site .mcn-btn-outline:hover,
.mcn-site .mcn-btn-outline:focus,
.mcn-site .mcn-btn-outline:active,
[class*="elementor-widget-mcnkemda-"] .mcn-btn-outline:hover {
  background: #1b1d1e !important;
  background-color: #1b1d1e !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #1b1d1e !important;
}
.mcn-site .mcn-btn-light,
[class*="elementor-widget-mcnkemda-"] .mcn-btn-light {
  background: #f3f3f1 !important;
  background-color: #f3f3f1 !important;
  color: #202223 !important;
  -webkit-text-fill-color: #202223 !important;
  border-color: #f3f3f1 !important;
}
.mcn-site .mcn-btn-light:hover,
.mcn-site .mcn-btn-light:focus,
.mcn-site .mcn-btn-light:active,
[class*="elementor-widget-mcnkemda-"] .mcn-btn-light:hover {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #202223 !important;
  -webkit-text-fill-color: #202223 !important;
  border-color: #ffffff !important;
}
.mcn-site button.mcn-video-card,
.mcn-site button.mcn-video-card:hover,
.mcn-site button.mcn-video-card:focus,
.mcn-site button.mcn-video-card:active,
[class*="elementor-widget-mcnkemda-"] button.mcn-video-card,
[class*="elementor-widget-mcnkemda-"] button.mcn-video-card:hover {
  background-color: #242629 !important;
  border-color: rgba(0,0,0,.08) !important;
  color: #ffffff !important;
  box-shadow: var(--mcn-shadow-soft) !important;
}


/* =========================================================
   v2.0.5 restrained two-colour caption treatment
   Client request: keep the approved premium grey/white site,
   but introduce a subtle Chilu Lemba-inspired warm accent in
   headings/captions only. No layout/content/function changes.
   ========================================================= */
.mcn-site,
[class*="elementor-widget-mcnkemda-"] {
  --mcn-accent: #e28738;
  --mcn-accent-soft: #f0b56f;
  --mcn-accent-deep: #a85e22;
}

/* Small caption labels carry the second colour, while main headings
   remain white/dark exactly as before. */
.mcn-site .mcn-kicker,
[class*="elementor-widget-mcnkemda-"] .mcn-kicker {
  color: var(--mcn-accent) !important;
  opacity: 1;
}

/* Premium short accent rule under major section headings. */
.mcn-site .mcn-section-head h2::after,
.mcn-site .mcn-about-copy h2::after,
.mcn-site .mcn-contact-copy h2::after,
[class*="elementor-widget-mcnkemda-"] .mcn-section-head h2::after,
[class*="elementor-widget-mcnkemda-"] .mcn-about-copy h2::after,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-copy h2::after {
  content: "";
  display: block;
  width: 36px;
  height: 2px;
  margin: 14px auto 0;
  border-radius: 999px;
  background: var(--mcn-accent);
}
.mcn-site .mcn-about-copy h2::after,
.mcn-site .mcn-contact-copy h2::after,
[class*="elementor-widget-mcnkemda-"] .mcn-about-copy h2::after,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-copy h2::after {
  margin-left: 0;
  margin-right: 0;
}

/* Keep light-section typography restrained; use the accent as a detail. */
.mcn-site .mcn-light .mcn-section-head h2::after,
[class*="elementor-widget-mcnkemda-"] .mcn-light .mcn-section-head h2::after {
  background: var(--mcn-accent-deep);
}

/* Video captions get a very small accent edge, not a coloured card. */
.mcn-site .mcn-video-title,
[class*="elementor-widget-mcnkemda-"] .mcn-video-title {
  border-left: 2px solid var(--mcn-accent);
  padding-left: 8px;
}

/* Subtle accent in proof points and player controls. */
.mcn-site .mcn-stat strong,
[class*="elementor-widget-mcnkemda-"] .mcn-stat strong {
  color: var(--mcn-accent-soft);
}
.mcn-site .mcn-audio-index,
[class*="elementor-widget-mcnkemda-"] .mcn-audio-index {
  background: var(--mcn-accent) !important;
  color: #1e2022 !important;
}

/* Accent only the small capability/check details, never whole panels. */
.mcn-site .mcn-check-list li > span,
[class*="elementor-widget-mcnkemda-"] .mcn-check-list li > span {
  border-color: rgba(226,135,56,.42);
  background: rgba(226,135,56,.08);
}
.mcn-site .mcn-check-list svg,
[class*="elementor-widget-mcnkemda-"] .mcn-check-list svg {
  stroke: var(--mcn-accent-deep);
}
.mcn-site .mcn-benefit-icon,
[class*="elementor-widget-mcnkemda-"] .mcn-benefit-icon {
  border-color: rgba(226,135,56,.55);
}
.mcn-site .mcn-benefit-icon svg,
[class*="elementor-widget-mcnkemda-"] .mcn-benefit-icon svg,
.mcn-site .mcn-quote,
[class*="elementor-widget-mcnkemda-"] .mcn-quote {
  color: var(--mcn-accent-soft);
  stroke: var(--mcn-accent-soft);
}

/* Reviews/modal controls remain neutral on hover as previously approved;
   only a thin idle border gets the warm accent so no red/pink can leak in. */
.mcn-site .mcn-slider-arrow,
.mcn-site .mcn-video-close,
[class*="elementor-widget-mcnkemda-"] .mcn-slider-arrow,
[class*="elementor-widget-mcnkemda-"] .mcn-video-close {
  border-color: rgba(226,135,56,.55) !important;
}

/* Header stays stable; only the underline uses the second colour. */
.mcn-header .mcn-nav a::after {
  background: var(--mcn-accent) !important;
}

/* Contact links get a restrained accent on their icon ring only. */
.mcn-site .mcn-contact-row span,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row span {
  border-color: rgba(226,135,56,.55);
  color: var(--mcn-accent-soft);
}

/* Accessibility focus uses a warm-neutral outline, never red/pink. */
.mcn-site,
[class*="elementor-widget-mcnkemda-"] {
  --mcn-focus: #d7a36b;
}


/* =========================================================
   v2.0.6 client feedback refinement
   1) Make the headings themselves visibly two-tone (neutral + warm accent),
      not merely an underline.
   2) Lock Contact email/phone text to readable white on every interaction
      state so theme hover colours cannot make the text disappear.
   ========================================================= */
.mcn-site .mcn-title-accent,
[class*="elementor-widget-mcnkemda-"] .mcn-title-accent {
  color: var(--mcn-accent) !important;
  -webkit-text-fill-color: var(--mcn-accent) !important;
}
.mcn-site .mcn-light .mcn-title-accent,
.mcn-site .mcn-capabilities-section .mcn-title-accent,
[class*="elementor-widget-mcnkemda-"] .mcn-light .mcn-title-accent,
[class*="elementor-widget-mcnkemda-"] .mcn-capabilities-section .mcn-title-accent {
  color: var(--mcn-accent-deep) !important;
  -webkit-text-fill-color: var(--mcn-accent-deep) !important;
}

/* Contact links must stay readable on hover/focus/visited/active regardless
   of the active WordPress theme's global link colour rules. */
.mcn-site .mcn-contact-row,
.mcn-site .mcn-contact-row:link,
.mcn-site .mcn-contact-row:visited,
.mcn-site .mcn-contact-row:hover,
.mcn-site .mcn-contact-row:focus,
.mcn-site .mcn-contact-row:active,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:link,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:visited,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:hover,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:focus,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:active {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-decoration: none !important;
  background: transparent !important;
  box-shadow: none !important;
}
.mcn-site .mcn-contact-row strong,
.mcn-site .mcn-contact-row:hover strong,
.mcn-site .mcn-contact-row:focus strong,
.mcn-site .mcn-contact-row:visited strong,
.mcn-site .mcn-contact-row:active strong,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row strong,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:hover strong,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:focus strong,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:visited strong,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:active strong {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.mcn-site .mcn-contact-row:hover span,
.mcn-site .mcn-contact-row:focus span,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:hover span,
[class*="elementor-widget-mcnkemda-"] .mcn-contact-row:focus span {
  color: var(--mcn-accent-soft) !important;
  -webkit-text-fill-color: var(--mcn-accent-soft) !important;
  background: rgba(226,135,56,.08) !important;
  border-color: rgba(226,135,56,.72) !important;
}
