/* =====================================================================
   Vyroweb inner-page skin
   Restyles the existing vyroweb-pages components to match the new
   homepage. Loaded only on pages that carry body.vyro-skin.
   ===================================================================== */
.vyro-skin{
  --v950:#14042E;--v900:#1F0742;--deep:#380D6F;--v800:#5B21B6;--v700:#6D28D9;--v600:#7C3AED;
  --v500:#9169E4;--v400:#A78BFA;--v300:#C4B5FD;--v200:#DDD6FE;--v100:#EDE9FE;--v50:#F5F3FF;
  --mint:#34D399;--sk-grad:linear-gradient(135deg,#6D28D9 0%,#7C3AED 50%,#9169E4 100%);
  --sk-grad-text:linear-gradient(100deg,#E9D5FF 0%,#C4B5FD 35%,#A78BFA 70%,#F0ABFC 100%);
  --sk-shadow:0 14px 34px -14px rgba(56,13,111,.28);
  --sk-shadow-lg:0 40px 80px -28px rgba(31,7,66,.45);
  --header-h:92px;
}
.vyro-skin h1,.vyro-skin h2,.vyro-skin h3,.vyro-skin h4{letter-spacing:-.03em}

/* ---------- Header: dark strip with floating glass nav ---------- */
.vyro-skin .site-header{background:var(--v950);border:0;padding:12px 0;backdrop-filter:none}
.vyro-skin .site-header.scrolled{box-shadow:0 20px 40px -24px rgba(0,0,0,.6);border:0}
.vyro-skin .site-header .nav{height:68px;padding:0 10px 0 22px;border-radius:18px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);max-width:1240px}
.vyro-skin .site-header .brand-logo{height:32px}
.vyro-skin .nav-menu>li>a,.vyro-skin .nav-trigger{color:rgba(255,255,255,.82);font-weight:500;border-radius:10px}
.vyro-skin .nav-menu>li>a:hover,.vyro-skin .nav-trigger:hover,.vyro-skin .nav-menu a.active,.vyro-skin .nav-trigger.active{color:#fff;background:rgba(255,255,255,.08)}
.vyro-skin .dropdown{border-radius:20px;border:0;box-shadow:var(--sk-shadow-lg);padding:10px;top:calc(100% + 16px)}
.vyro-skin .dropdown a:hover{background:var(--v50)}
.vyro-skin .dropdown a:hover strong{color:var(--v700)}
.vyro-skin .nav-cta .btn{padding:11px 18px;font-size:14px;border-radius:11px}
.vyro-skin .nav-toggle{border:1px solid rgba(255,255,255,.2);border-radius:12px}
.vyro-skin .nav-toggle span{background:#fff}

/* ---------- Buttons ---------- */
.vyro-skin .btn{border-radius:14px;padding:15px 26px}
.vyro-skin .btn-lg{padding:17px 30px}
.vyro-skin .btn-primary{background:var(--sk-grad);box-shadow:0 14px 30px -10px rgba(124,58,237,.75),inset 0 1px 0 rgba(255,255,255,.25)}
.vyro-skin .btn-primary:hover{background:var(--sk-grad);box-shadow:0 22px 40px -12px rgba(124,58,237,.9),inset 0 1px 0 rgba(255,255,255,.25)}
.vyro-skin .btn-secondary{background:var(--deep)}
.vyro-skin .btn-ghost{border-color:var(--v200);color:var(--v700)}
.vyro-skin .btn-ghost:hover{border-color:var(--v600);background:var(--v50)}
.vyro-skin .btn-outline-light{backdrop-filter:blur(8px)}

/* ---------- Hero ---------- */
.vyro-skin .hero{background:var(--v950);padding:90px 0 120px;isolation:isolate}
.vyro-skin .hero:before{z-index:-1;filter:blur(10px);background:
  radial-gradient(520px 420px at 82% 18%,rgba(124,58,237,.75),transparent 70%),
  radial-gradient(420px 360px at 98% 70%,rgba(192,38,211,.35),transparent 70%),
  radial-gradient(520px 460px at 6% 100%,rgba(76,29,149,.9),transparent 70%),
  radial-gradient(300px 260px at 40% 25%,rgba(145,105,228,.25),transparent 70%);
  animation:vyroDrift 18s ease-in-out infinite alternate}
.vyro-skin .hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 30%,transparent 75%)}
@keyframes vyroDrift{to{transform:translate(30px,-20px) scale(1.06)}}
.vyro-skin .hero h1{font-weight:900;letter-spacing:-.045em;line-height:1.03;font-size:clamp(38px,5.4vw,66px)}
.vyro-skin .hero h1 .hl{background:var(--sk-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.vyro-skin .hero-sub{color:rgba(255,255,255,.72)}
.vyro-skin .hero-tag{color:var(--v200);background:rgba(196,181,253,.1);border-color:rgba(196,181,253,.25);letter-spacing:.14em;font-size:12.5px}
.vyro-skin .hero-badge{color:rgba(255,255,255,.75);font-weight:500}
.vyro-skin .hero-badge svg{color:var(--mint)}
.vyro-skin .hero-card{position:relative;background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14);border-radius:24px;box-shadow:0 50px 100px -30px rgba(0,0,0,.7);transform:perspective(1400px) rotateY(-8deg) rotateX(3deg);transition:transform .6s}
.vyro-skin .hero-card:hover{transform:perspective(1400px) rotateY(-3deg) rotateX(1deg)}
.vyro-skin .hero-card:before{content:"";position:absolute;width:520px;height:520px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;border:1px dashed rgba(196,181,253,.22);z-index:-1;pointer-events:none}
.vyro-skin .hero-card:after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:#F0ABFC;box-shadow:0 0 0 8px rgba(240,171,252,.18);right:-18px;top:-18px}
.vyro-skin .hero-card-head .dot{background:var(--mint);box-shadow:0 0 0 4px rgba(52,211,153,.22)}
.vyro-skin .hero-metric{background:rgba(255,255,255,.06);border-radius:14px}
.vyro-skin .hero-metric .v.up{background:var(--sk-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
.vyro-skin .hero-bars i{background:linear-gradient(180deg,#C4B5FD,#7C3AED);border-radius:7px 7px 2px 2px}

/* ---------- Sections & headings ---------- */
.vyro-skin .section{padding:110px 0;position:relative}
.vyro-skin .section-tint{background:var(--v50);overflow:hidden}
.vyro-skin .section-tint:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(196,181,253,.55),transparent 70%);top:-180px;right:-180px;pointer-events:none}
.vyro-skin .section-tint>.container{position:relative}
.vyro-skin .section-navy{background:var(--v950)}
.vyro-skin .section-head h2,.vyro-skin .split h2{font-weight:900;letter-spacing:-.035em;font-size:clamp(32px,4.4vw,50px);line-height:1.08}
.vyro-skin .section-head h2 span,.vyro-skin .split h2 span,.vyro-skin .text-emerald,.vyro-skin .text-blue{background:linear-gradient(100deg,#6D28D9,#9169E4 60%,#C026D3);-webkit-background-clip:text;background-clip:text;color:transparent}
.vyro-skin .eyebrow{color:var(--v700);background:var(--v100);border:1px solid var(--v200);letter-spacing:.14em;font-size:12.5px;padding:8px 15px}
.vyro-skin .eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(52,211,153,.2)}
.vyro-skin .section-navy .eyebrow{color:var(--v200);background:rgba(196,181,253,.1);border-color:rgba(196,181,253,.25)}

/* ---------- Cards ---------- */
.vyro-skin .card,.vyro-skin .deliverable,.vyro-skin .industry-pill,.vyro-skin .t-card,.vyro-skin .case-card{border-radius:24px;border-color:var(--v100);transition:transform .3s,box-shadow .3s,border-color .3s}
.vyro-skin .card{padding:32px}
.vyro-skin .card:hover,.vyro-skin .deliverable:hover,.vyro-skin .case-card:hover{transform:translateY(-6px);box-shadow:var(--sk-shadow-lg);border-color:var(--v200)}
.vyro-skin .card h3{font-size:20px;font-weight:800}
.vyro-skin .card-icon,.vyro-skin .deliverable .ic,.vyro-skin .industry-pill .ic{position:relative;width:54px;height:54px;border-radius:16px;color:#fff;background:linear-gradient(135deg,#9169E4,#5B21B6);box-shadow:6px 8px 0 -2px var(--v200),0 12px 24px -10px rgba(91,33,182,.6)}
.vyro-skin .card-icon.emerald,.vyro-skin .deliverable .ic{background:linear-gradient(135deg,#C026D3,#6D28D9);box-shadow:6px 8px 0 -2px #F5D0FE,0 12px 24px -10px rgba(192,38,211,.5)}
.vyro-skin .card-icon:after,.vyro-skin .deliverable .ic:after,.vyro-skin .industry-pill .ic:after{content:"";position:absolute;left:6px;right:6px;top:4px;height:40%;border-radius:12px;background:rgba(255,255,255,.18)}
.vyro-skin .deliverable{padding:24px;gap:18px;background:#fff}
.vyro-skin .deliverable .ic{width:46px;height:46px;border-radius:14px}
.vyro-skin .industry-pill{border-radius:18px;padding:16px 18px}
.vyro-skin .industry-pill:hover{border-color:var(--v400);box-shadow:var(--sk-shadow)}
.vyro-skin .industry-pill .ic{width:42px;height:42px;border-radius:12px}
.vyro-skin .service-card .arrow{color:var(--v600)}
.vyro-skin .media-card{border-radius:28px;background:linear-gradient(160deg,#FBFAFF,#EDE9FE);border-color:var(--v100);box-shadow:var(--sk-shadow)}
.vyro-skin .check-list li svg{color:var(--v600)}
.vyro-skin .metric{background:var(--v50);border:1px solid var(--v100);border-radius:14px}
.vyro-skin .metric .v{color:var(--deep)}
.vyro-skin .case-tag{color:var(--v700);background:var(--v100)}

/* ---------- Process ---------- */
.vyro-skin .process:before{top:34px;height:2px;opacity:1;background:repeating-linear-gradient(90deg,var(--v300) 0 8px,transparent 8px 16px)}
.vyro-skin .step-num{width:68px;height:68px;border-radius:20px;font-size:22px;font-weight:900;background:linear-gradient(135deg,#A78BFA,#5B21B6);box-shadow:8px 10px 0 -2px var(--v200),0 16px 30px -12px rgba(91,33,182,.6)}
.vyro-skin .step-num:after{content:"";position:absolute;left:8px;right:8px;top:5px;height:38%;border-radius:12px;background:rgba(255,255,255,.18)}
.vyro-skin .step h3{font-size:20px;font-weight:800}

/* ---------- FAQ ---------- */
.vyro-skin .faq-item{border-radius:18px;margin-bottom:12px;transition:border-color .2s,box-shadow .2s}
.vyro-skin .faq-item.open{border-color:var(--v200);box-shadow:var(--sk-shadow);background:linear-gradient(180deg,#fff,#FBFAFF)}
.vyro-skin .faq-q{padding:22px 26px;font-size:17px;letter-spacing:-.01em}
.vyro-skin .faq-q .pm{width:32px;height:32px;background:var(--v100);color:var(--v600)}
.vyro-skin .faq-item.open .pm{background:var(--v600)}
.vyro-skin .faq-a p{padding:0 26px 24px}

/* ---------- CTA band ---------- */
.vyro-skin .cta-band{background:var(--v950);border-radius:32px;padding:80px 56px;isolation:isolate}
.vyro-skin .cta-band:before{z-index:-1;filter:blur(20px);background:
  radial-gradient(420px 300px at 85% 0%,rgba(124,58,237,.8),transparent 70%),
  radial-gradient(380px 300px at 0% 100%,rgba(192,38,211,.45),transparent 70%),
  radial-gradient(300px 240px at 50% 120%,rgba(145,105,228,.5),transparent 70%)}
.vyro-skin .cta-band:after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;right:7%;top:-40px;z-index:-1;
  background:radial-gradient(circle at 30% 30%,#fff 0%,#C4B5FD 18%,#7C3AED 55%,#2E0A5E 100%);box-shadow:0 30px 60px -20px rgba(0,0,0,.6)}
.vyro-skin .cta-band h2{font-weight:900;letter-spacing:-.035em;font-size:clamp(30px,4.2vw,48px)}
.vyro-skin .cta-band p{color:rgba(255,255,255,.75)}

/* ---------- Forms ---------- */
.vyro-skin .form-card{border-radius:26px;border-color:var(--v100);box-shadow:var(--sk-shadow-lg);padding:40px}
.vyro-skin .field input,.vyro-skin .field select,.vyro-skin .field textarea{border-radius:12px;background:#fff;border-color:var(--line,#E2E8F0)}
.vyro-skin .field input:focus,.vyro-skin .field select:focus,.vyro-skin .field textarea:focus{border-color:var(--v600);box-shadow:0 0 0 4px rgba(124,58,237,.12)}
.vyro-skin .form-success .ok{background:var(--v100);color:var(--v600)}

/* ---------- Prose ---------- */
.vyro-skin .prose h2{font-weight:900;letter-spacing:-.03em}
.vyro-skin .prose ul li:before{background:var(--v600);box-shadow:0 0 0 4px var(--v100)}
.vyro-skin .prose a{color:var(--v600);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* ---------- Trust strip ---------- */
.vyro-skin .trust-item svg{color:var(--v600)}

/* ---------- Footer ---------- */
.vyro-skin .site-footer{background:var(--v950);color:rgba(255,255,255,.66);padding:90px 0 30px;position:relative;overflow:hidden}
.vyro-skin .site-footer:after{content:"VYROWEB";display:block;text-align:center;font-weight:900;letter-spacing:-.06em;line-height:.8;font-size:clamp(64px,14.5vw,212px);margin:60px auto -10px;background:linear-gradient(180deg,rgba(196,181,253,.22),rgba(196,181,253,0));-webkit-background-clip:text;background-clip:text;color:transparent;user-select:none;pointer-events:none}
.vyro-skin .footer-col h4{font-size:12.5px;letter-spacing:.14em}
.vyro-skin .footer-col a{color:rgba(255,255,255,.66)}
.vyro-skin .footer-grid{border-color:rgba(255,255,255,.1)}
.vyro-skin .footer-contact svg{color:var(--v300)}
.vyro-skin .socials a:hover{background:var(--v600)}
.vyro-skin .footer-bottom{position:relative;z-index:1}
.vyro-skin .site-footer .footer-bottom{order:2}

/* ---------- Mobile ---------- */
.vyro-skin .mobile-cta{background:rgba(20,4,46,.92);border-top:1px solid rgba(255,255,255,.1)}
@media (max-width:980px){
  .vyro-skin .hero-card{transform:none}
  .vyro-skin .hero-card:hover{transform:none}
  .vyro-skin .hero-card:before{width:380px;height:380px}
}
@media (max-width:760px){
  .vyro-skin{--header-h:86px}
  .vyro-skin .site-header .nav{height:62px;padding:0 8px 0 16px}
  .vyro-skin .hero{padding:64px 0 90px}
  .vyro-skin .section{padding:76px 0}
  .vyro-skin .cta-band{padding:52px 22px;border-radius:26px}
  .vyro-skin .cta-band:after{width:70px;height:70px;top:-24px}
  .vyro-skin .hero-card:after{right:-6px;top:-10px}
  .vyro-skin .mobile-panel{background:var(--v900)}
  .vyro-skin .mobile-panel a:not(.btn){color:#fff;border-color:rgba(255,255,255,.08)}
  .vyro-skin .mobile-panel .sub a{color:rgba(255,255,255,.7)}
  .vyro-skin .mobile-panel .m-label{color:var(--v300)}
}
@media (prefers-reduced-motion:reduce){.vyro-skin .hero:before{animation:none}}

/* ---------- Responsive hardening (QA) ---------- */
.vyro-skin .grid>*,.vyro-skin .split>*,.vyro-skin .hero-grid>*,.vyro-skin [style*="display:grid"]>*,.vyro-skin .field-row>*{min-width:0}
.vyro-skin input,.vyro-skin select,.vyro-skin textarea{max-width:100%;min-width:0}
@media (max-width:760px){
  .vyro-skin [style*="grid-template-columns:1fr 1fr"],.vyro-skin [style*="grid-template-columns: 1fr 1fr"],.vyro-skin [style*="grid-template-columns:repeat(2"],.vyro-skin [style*="grid-template-columns:repeat(3"]{grid-template-columns:1fr!important}
  .vyro-skin .form-card{padding:28px 22px}
  .vyro-skin .hero h1{font-size:clamp(32px,8.6vw,42px)}
  .vyro-skin .section-head h2,.vyro-skin .split h2{font-size:clamp(28px,7.4vw,36px)}
  .vyro-skin .hero-cta .btn{flex:1 1 auto;justify-content:center}
}
@media (max-width:400px){
  .vyro-skin .container{padding:0 16px}
  .vyro-skin .form-card{padding:22px 16px}
  .vyro-skin .card{padding:24px}
  .vyro-skin .site-header .nav{padding:0 6px 0 14px}
  .vyro-skin .site-header .brand-logo{height:28px}
  .vyro-skin .btn-lg{padding:15px 22px}
}

/* Tablet: switch to the mobile menu below 1080px so the nav never squeezes */
@media (max-width:1080px){
  .vyro-skin .nav-menu,.vyro-skin .nav-cta .btn{display:none}
  .vyro-skin .nav-toggle{display:block}
  .vyro-skin .mobile-panel{display:block;position:fixed;inset:var(--header-h) 0 0;z-index:99;background:var(--v900);padding:24px;transform:translateX(100%);transition:transform .3s ease;overflow-y:auto}
  .vyro-skin .mobile-panel.open{transform:none}
  .vyro-skin .mobile-panel a:not(.btn){display:block;padding:14px 12px;font-weight:600;font-size:17px;color:#fff;border-bottom:1px solid rgba(255,255,255,.08)}
  .vyro-skin .mobile-panel .sub a{padding-left:24px;font-size:15px;color:rgba(255,255,255,.7);font-weight:500}
  .vyro-skin .mobile-panel .m-label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--v300);padding:18px 12px 6px;font-weight:700}
  .vyro-skin .mobile-panel .btn{width:100%;margin-top:20px;color:#fff;border-bottom:none}
}

/* ---------- Unified header (1.5.0): fixed floating header sits over the hero ---------- */
.vyro-unified .hero{padding-top:180px}
.vyro-unified main>section.section:first-child:not(.hero){padding-top:170px;background:linear-gradient(#14042E 0,#14042E 110px,transparent 110px)}
@media (max-width:640px){
  .vyro-unified .hero{padding-top:130px}
  .vyro-unified main>section.section:first-child:not(.hero){padding-top:130px;background:linear-gradient(#14042E 0,#14042E 92px,transparent 92px)}
}
/* Blog card thumbnails (1.6.0) */
.vyro-skin .card.vyro-has-thumb{overflow:hidden}
.vyro-skin .vyro-card-img{display:block;position:relative;margin:0 0 18px;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#14042E}
.vyro-skin .vyro-card-img img{position:absolute!important;inset:0;width:100%!important;height:100%!important;object-fit:cover;transition:transform .5s;margin:0;max-width:none}
.vyro-skin .card.vyro-has-thumb:hover .vyro-card-img img{transform:scale(1.05)}