/* Final V2 polish: preserves the original MasterAI palette while fixing contrast and motion. */

/* High-contrast actions on gradient CTA surfaces. */
.portfolio-cta-btn,
.cta-strip .btn-primary-light,
.cta-strip .btn-primary,
.sidebar-card .btn-primary,
.sidebar-card .btn-full {
  background: linear-gradient(135deg, #060c1a, #172554) !important;
  border: 1px solid rgba(255, 255, 255, .24) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(6, 12, 26, .28) !important;
}
.portfolio-cta-btn:hover,
.cta-strip .btn-primary-light:hover,
.cta-strip .btn-primary:hover,
.sidebar-card .btn-primary:hover {
  color: #fff !important;
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 20px 46px rgba(6, 12, 26, .38) !important;
}
.cta-strip .btn-outline-light { color: #fff !important; border-color: rgba(255,255,255,.8) !important; background: rgba(255,255,255,.08) !important; }

/* Services mega panel is deliberately light, so every child uses dark readable ink. */
.mega-featured { border: 1px solid #dbe4ff !important; box-shadow: inset 0 1px #fff, 0 16px 36px rgba(79,70,229,.1) !important; }
.mega-featured h3 { color: #111827 !important; }
.mega-featured p { color: #374151 !important; opacity: 1 !important; }
.mega-featured .mega-feat-badge { color: #4f46e5 !important; background: #fff !important; border-color: #c7d2fe !important; }
.mega-featured .mega-feat-btn { color: #fff !important; background: linear-gradient(135deg,#4f46e5,#7c3aed) !important; border-color: transparent !important; }
.mega-featured .mega-feat-stats { border-color: #dbe4ff !important; }
.mega-featured .mega-feat-stats strong { color: #111827 !important; }
.mega-featured .mega-feat-stats span { color: #6b7280 !important; }

/* Footer GitHub pill. */
.footer .github-footer-btn { display: inline-flex !important; align-items: center; gap: 10px; width: auto !important; min-width: 142px; height: 54px; padding: 6px 20px 6px 8px; color: #fff !important; background: rgba(255,255,255,.06) !important; border: 1px solid rgba(255,255,255,.18) !important; }
.footer .github-footer-btn svg { width: 40px; height: 40px; flex: 0 0 40px; color: #fff !important; }
.footer .github-footer-btn span { position: relative; z-index: 3; color: #fff !important; font-weight: 800; letter-spacing: .01em; }

/* Preserve white copy inside the intentionally dark testimonial glass cards. */
.testi-section .tcard { background: linear-gradient(145deg,rgba(16,12,32,.96),rgba(8,8,20,.94)) !important; }
.tcard .tc-text { color: rgba(255, 255, 255, .86) !important; }
.tcard .tc-name { color: #fff !important; }
.tcard .tc-loc { color: rgba(255, 255, 255, .68) !important; }

/* Shared premium interaction system for tiles on every service/industry page. */
.premium-tile { isolation: isolate; position: relative; overflow: hidden; height: 100% !important; min-height: 0; align-self: stretch; transform-style: preserve-3d; transition: transform .42s cubic-bezier(.2,.8,.2,1), box-shadow .42s ease, border-color .3s ease !important; }
.premium-tile::after { content: ""; position: absolute; inset: -1px; z-index: 0; pointer-events: none; border-radius: inherit; padding: 1.5px; background: conic-gradient(from var(--tile-angle,0deg),transparent 10%,#4f46e5 28%,#0ea5e9 42%,transparent 60%); -webkit-mask: linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: .32; animation: tileBorderFlow 6s linear infinite; }
.premium-tile > * { position: relative; z-index: 1; }
.premium-tile:hover { transform: perspective(900px) translateY(-7px) rotateX(var(--tile-rx,0deg)) rotateY(var(--tile-ry,0deg)) !important; border-color: rgba(79,70,229,.38) !important; box-shadow: 0 24px 58px rgba(79,70,229,.16),0 0 34px rgba(14,165,233,.09) !important; }
.premium-tile:hover::after { opacity: .85; animation-duration: 2.4s; }
.premium-tile .scard-icon,.premium-tile .ind-icon,.premium-tile .wwd-icon { transition: transform .4s cubic-bezier(.2,.8,.2,1),filter .4s ease !important; }
.premium-tile:hover .scard-icon,.premium-tile:hover .ind-icon,.premium-tile:hover .wwd-icon { transform: translateY(-4px) scale(1.08) rotate(-2deg); filter: drop-shadow(0 10px 16px rgba(79,70,229,.24)); }
@property --tile-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes tileBorderFlow { to { --tile-angle: 360deg; } }

/* Keep all light-card titles and body copy legible, including page-specific tile variants. */
.scard h3,.scard h4,.ind-card .ind-name,.ind-full-card h3,.cat-card h3,.service-card h3,.wwd-item h4,
.dg-card h3,.dg-card h4,.project-card h3,.blog-card h3,.sidebar-card h3,.sidebar-card h4 { color: #111827 !important; }
.scard p,.ind-card p,.ind-full-card p,.cat-card p,.service-card p,.wwd-item p,
.dg-card p,.project-card p,.blog-card p,.sidebar-card p { color: #6b7280 !important; }

/* The shared runtime owns the compact five-stage journey. */
html,
body.home-page { overflow-x: clip !important; }
body.home-page #main-content { overflow: visible !important; }
.cinematic-v2:not([data-mode="fallback"]) { height: 200dvh !important; margin: 0 !important; }
.cinematic-v2:not([data-mode="fallback"]) .cinematic-sticky { height: 100dvh; min-height: 0; }
.cinematic-v2:not([data-mode="fallback"]) .cinematic-chapters { height: 390px; }
.cinematic-chapter:not(.is-active) { opacity: 0 !important; visibility: hidden !important; transition: none !important; }
.cinematic-chapter.is-active { opacity: 1 !important; visibility: visible !important; }

@media (max-width: 820px) {
  .cinematic-v2,
  .cinematic-v2:not([data-mode="fallback"]) { height: auto !important; }
  .cinematic-v2 .cinematic-sticky { position: relative; height: auto; min-height: 0; }
  .cinematic-v2 .cinematic-canvas { display: block !important; height: clamp(220px, 62vw, 300px); }
  .cinematic-v2 .cinematic-chapters { height: auto !important; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .cinematic-v2 .cinematic-chapter,
  .cinematic-v2 .cinematic-chapter:not(.is-active) { opacity: 1 !important; visibility: visible !important; scroll-snap-align: center; }
  .cinematic-v2[data-mode="fallback"] .cinematic-canvas { display: none !important; }
}

/* Balanced industry hero: headline and artwork never clip or collide. */
.page-hero .ph-content--image { display: grid !important; grid-template-columns: minmax(0,.92fr) minmax(400px,1.08fr); align-items: center !important; gap: clamp(34px,4vw,68px) !important; }
.page-hero .ph-content--image .ph-text-col { width: 100%; }
.page-hero .ph-content--image h1 { max-width: 100% !important; font-size: clamp(3rem,4.3vw,5rem) !important; line-height: .98 !important; overflow-wrap: break-word; }
.page-hero .ph-hero-img-wrap { width: 100% !important; max-width: 560px; margin: 0 auto !important; flex: none !important; }
.page-hero .ph-hero-img-inner { aspect-ratio: 16/10; box-shadow: 0 22px 65px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.08) inset; }
.page-hero .ph-hero-img { width: 100%; height: 100% !important; min-height: 0; object-fit: cover; }

/* Let the original Spline robot remain visible and responsive behind About hero copy. */
body.about-page .co-fixed-robot { display: block !important; visibility: visible !important; opacity: 1 !important; background: radial-gradient(circle at 68% 42%,rgba(79,70,229,.2),transparent 34%); }
body.about-page .co-fixed-robot-frame { display: block !important; visibility: visible !important; opacity: 1 !important; pointer-events: auto; }
body.about-page .co-hero-vignette { opacity: .82; }

/* A tighter homepage rhythm keeps the 3D journey and content sections connected. */
body.home-page .section { padding-block: clamp(56px, 7vw, 96px); }
body.home-page .section-hd { margin-bottom: clamp(28px, 4vw, 44px); }

@media (max-width: 1050px) {
  .page-hero .ph-content--image { grid-template-columns: 1fr !important; }
  .page-hero .ph-hero-img-wrap { max-width: 720px; margin-inline: auto !important; }
  .page-hero .ph-content--image h1 { font-size: clamp(2.75rem,8vw,4.8rem) !important; }
}
@media (max-width: 640px) {
  .portfolio-cta-btn { min-width: 210px; }
}
@media (prefers-reduced-motion: reduce) {
  .premium-tile,.premium-tile::after { animation: none !important; transition: none !important; transform: none !important; }
}

/* Cards share a row height inside comparable grids; editorial galleries remain content-sized. */
.services-grid,
.industries-grid,
.industries-full-grid,
.wwd-grid,
.ind-grid-home,
.portfolio-grid-final,
.blog-grid,
.feat-grid,
.use-grid { align-items: stretch !important; grid-auto-rows: 1fr !important; }
.dg-card,
.scard,
.ind-full-card,
.portfolio-card-final,
.blog-card { min-height: 0 !important; }
.dg-gallery { align-items: start !important; grid-auto-rows: auto !important; }
.dg-gallery .premium-tile { height: auto !important; align-self: start; }
.dg-card { padding-block: clamp(24px, 3vw, 34px) !important; }

/* Surface-aware contrast matrix. */
.scard h3,.ind-full-card h3,.blog-card h3,.portfolio-card-final h3,.dg-card-challenge h3,.dg-card-stats h3,
.sidebar-card h4,.eq-card h4,.feat-item,.use-item,.dg-usecase-item { color: #111827 !important; }
.scard p,.ind-full-card p,.blog-card p,.portfolio-card-final p,.dg-card-challenge p,.dg-card-stats p,
.sidebar-card p,.eq-card p,.dg-usecase-item,.dg-process-mini { color: #475569 !important; opacity: 1 !important; }
.dg-card-main h3,.dg-card-main h4 { color: #fff !important; }
.dg-card-main p { color: rgba(255,255,255,.82) !important; }
.dg-card-main .dg-chips span { color: #fff !important; background: rgba(255,255,255,.12) !important; }
.sidebar-cta h4 { color: #fff !important; }
.sidebar-cta p { color: rgba(255,255,255,.86) !important; }
.sidebar-cta .btn-primary { background: #060c1a !important; color: #fff !important; }
.sidebar-cta .btn-outline { border-color: rgba(255,255,255,.76) !important; color: #fff !important; }
.portfolio-tech-final span,.ttag,.cf-tag,.dg-tech-chips span { color: #3730a3 !important; }
.form-status,.fgroup small,.blog-meta { color: #475569 !important; }
button:disabled,.btn-primary:disabled { color: rgba(255,255,255,.8) !important; opacity: .68; }

/* Compact, balanced hero metrics. */
.page-hero .ph-content--image h1 { font-size: clamp(2.8rem, 4vw, 4.6rem) !important; }
.ph-stats,.ph-stats--inline { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)); width: min(100%, 590px) !important; padding: 12px !important; gap: 0 !important; }
.ph-stats .phstat { min-width: 0 !important; padding: 10px 18px !important; }
.ph-stats .phstat + .phstat { border-left: 1px solid rgba(255,255,255,.18) !important; }
.ph-stats .phnum { color: #fff !important; font-size: clamp(1.35rem,2vw,1.8rem) !important; }
.ph-stats .phlbl { color: #aeb9d6 !important; }

@media (max-width: 760px) {
  .ph-stats,.ph-stats--inline { grid-template-columns: 1fr !important; width: 100% !important; }
  .ph-stats .phstat + .phstat { border-left: 0 !important; border-top: 1px solid rgba(255,255,255,.18) !important; }
}

@media (max-width: 640px) {
  .premium-tile { height: auto !important; align-self: start; }
  body.home-page .section { padding-block: 56px; }
}

@media (hover: none), (pointer: coarse) {
  .premium-tile,.premium-tile:hover { transform: none !important; }
  .premium-tile::after { animation: none !important; opacity: .34; }
}
