/* Modern 3D visual layer for RKSolutions */
:root{
  --shadow-3d: 0 26px 60px rgba(67,56,202,.16), 0 12px 22px rgba(15,23,42,.08);
  --shadow-3d-soft: 0 18px 42px rgba(15,23,42,.10), 0 6px 14px rgba(67,56,202,.08);
  --glass: rgba(255,255,255,.72);
}
body{background:
  radial-gradient(circle at 10% 0%, rgba(67,56,202,.08), transparent 22%),
  radial-gradient(circle at 100% 8%, rgba(20,184,166,.08), transparent 18%),
  linear-gradient(180deg,#f7f9ff 0%,#ffffff 30%,#f8fbff 100%);
}
main, section, .site-footer{position:relative;overflow:clip}
.hero::before,.future-hero::before,.sector-hero::before,.page-hero::before,.smart-ai-strip::before,.ai-page .ai-hero::before{
  content:"";position:absolute;inset:auto auto 10% -80px;width:240px;height:240px;border-radius:36% 64% 53% 47%/44% 38% 62% 56%;
  background:linear-gradient(135deg,rgba(67,56,202,.20),rgba(20,184,166,.16));filter:blur(18px);opacity:.65;pointer-events:none;transform:rotate(-14deg);
}
.hero::after,.future-hero::after,.sector-hero::after,.page-hero::after,.smart-ai-strip::after,.ai-page .ai-hero::after{
  content:"";position:absolute;inset:20px -70px auto auto;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.95), rgba(67,56,202,.1) 45%, rgba(20,184,166,.18) 75%, transparent 76%);filter:blur(2px);opacity:.9;pointer-events:none;
}
.btn{transform:translateZ(0);transition:transform .24s ease, box-shadow .24s ease, background .24s ease}
.btn:hover{transform:translateY(-2px) scale(1.01)}
.btn-primary{box-shadow:0 20px 40px rgba(67,56,202,.24), inset 0 1px 0 rgba(255,255,255,.22)}
.btn-secondary,.premium-lang-switch,.nav-toggle{box-shadow:0 14px 26px rgba(15,23,42,.08), inset 0 1px 0 rgba(255,255,255,.88)}
.card,.barq-card,.barq-illu-card,.ai-info-card,.smart-sector-card,.feature-item,.solution-card,.app-card,.overview-card,.process-step,.dual-card,.product-showcase-card,.form-card,.faq-item,.contact-info-card,.sector-image-card,.infographic-shell,.character-card,.character-copy .mini,.product-card,.detail-layout .feature-item,.hero-card,.barq-glass,.floating-card{
  box-shadow: var(--shadow-3d-soft);transform-style:preserve-3d;transition:transform .28s ease, box-shadow .28s ease, border-color .2s ease;
}
.card:hover,.barq-card:hover,.barq-illu-card:hover,.ai-info-card:hover,.smart-sector-card:hover,.feature-item:hover,.solution-card:hover,.app-card:hover,.overview-card:hover,.process-step:hover,.dual-card:hover,.product-showcase-card:hover,.character-copy .mini:hover,.contact-info-card:hover,.detail-layout .feature-item:hover,.hero-card:hover{
  transform:translateY(-8px) rotateX(3deg) rotateY(-2deg);
  box-shadow: var(--shadow-3d);
  border-color: rgba(67,56,202,.18);
}
.future-sector,.future-product,.future-window,.ai-diagram,.cta-mascot,.smart-core,.smart-float,.barq-glass,.sector-image-card,.character-card,.infographic-shell{transform-style:preserve-3d}
.future-sector,.future-product,.future-window,.ai-diagram,.smart-core,.smart-float,.barq-glass,.sector-image-card,.character-card,.infographic-shell{box-shadow: var(--shadow-3d)}
.future-window,.ai-diagram,.barq-glass,.sector-image-card,.infographic-shell,.smart-core{background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(247,250,255,.98) 100%);border:1px solid rgba(228,232,245,.9);backdrop-filter:blur(18px)}
.future-window{transform:perspective(1200px) rotateX(8deg) rotateY(-10deg);}
.future-window:hover{transform:perspective(1200px) rotateX(5deg) rotateY(-6deg) translateY(-6px)}
.float-tag,.graphic-floating,.sector-floating-card,.smart-mini{backdrop-filter:blur(16px);background:rgba(255,255,255,.84)!important;border:1px solid rgba(228,232,245,.9);box-shadow: var(--shadow-3d-soft)}
.product-ring,.art-chip,.brand-badge,.sector-illustration,.product-emblem,.mini-tile,.ai-node,.overview-card .icon,.process-step .num,.contact-info-card .icon{box-shadow:0 18px 34px rgba(67,56,202,.18), inset 0 1px 0 rgba(255,255,255,.24)}
.future-section-head h2 em,.future-gradient{background:linear-gradient(135deg,#3b36c9 0%,#10b8a0 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.future-product .product-graphic,.sector-art,.cta-mascot,.character-card{position:relative;isolation:isolate}
.future-product .product-graphic::before,.sector-art::before,.cta-mascot::before,.character-card::before{
  content:"";position:absolute;inset:8% 18% auto auto;width:120px;height:120px;border-radius:30px;background:linear-gradient(135deg,rgba(67,56,202,.22),rgba(20,184,166,.14));filter:blur(10px);z-index:-1;transform:rotate(18deg)
}
.product-showcase-card .illus,.future-product .product-graphic,.sector-art{background:
 linear-gradient(180deg,#f2f5ff 0%,#ffffff 100%),
 radial-gradient(circle at 12% 12%, rgba(67,56,202,.12), transparent 25%),
 radial-gradient(circle at 85% 20%, rgba(20,184,166,.12), transparent 25%);
}
.cta-panel,.premium-footer-cta,.smart-ai-strip,.ai-page .ai-hero,.barq-hero.retail,.barq-hero.edu{
 box-shadow:0 36px 72px rgba(15,23,42,.20), inset 0 1px 0 rgba(255,255,255,.08);
}
.breadcrumb-bar,.filter-bar{backdrop-filter:blur(18px);background:rgba(255,255,255,.82)}
.barq-main-nav,.site-header,.premium-lang-switch,.nav-toggle{backdrop-filter:blur(20px)}
.barq-main-nav{background:rgba(255,255,255,.78)}
.brand-badge{position:relative;overflow:hidden}
.brand-badge::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.26),transparent 46%);pointer-events:none}
/* stronger 3d look on product and sector visuals */
.sector-image-card img,.infographic-shell img{filter:drop-shadow(0 16px 34px rgba(67,56,202,.14))}
.cta-mascot{filter:drop-shadow(0 24px 44px rgba(67,56,202,.18))}
/* mobile soften transforms */
@media(max-width:860px){
  .future-window{transform:none}
  .card:hover,.barq-card:hover,.barq-illu-card:hover,.ai-info-card:hover,.smart-sector-card:hover,.feature-item:hover,.solution-card:hover,.app-card:hover,.overview-card:hover,.process-step:hover,.dual-card:hover,.product-showcase-card:hover,.character-copy .mini:hover,.contact-info-card:hover,.detail-layout .feature-item:hover,.hero-card:hover{transform:translateY(-4px)}
}
