/* ======================================================================
   SOSYALJET V9 — POLISHED UI FIXES
   Readability, stable mega menu, stronger CTA buttons, refined 3D cards.
   Loaded after style.css + v8.css.
   ====================================================================== */

.v9-public{
  --v9-ink:#14131d;
  --v9-muted:#6f7381;
  --v9-purple:#6952e8;
  --v9-purple-2:#8d61f3;
  --v9-line:rgba(27,22,58,.095);
  --v9-shadow:0 26px 75px rgba(39,30,88,.12),0 8px 24px rgba(50,37,116,.055);
  --v9-shadow-hover:0 38px 105px rgba(38,28,88,.17),0 14px 38px rgba(76,55,170,.09);
}

/* ----------------------------------------------------------------------
   Global readability — remove the "tiny template" feeling
   ---------------------------------------------------------------------- */
.v9-public .v6-main-nav>a,
.v9-public .nav-dropdown-trigger{font-size:13px;line-height:1.2;font-weight:700}
.v9-public .v6-login-link{font-size:12px}
.v9-public .v6-cart-button{font-size:12px;font-weight:800;min-height:48px;padding:0 20px;border-radius:15px}
.v9-public .v6-utility a{font-size:11px}
.v9-public .v6-top-promo{font-size:12px}
.v9-public .v6-top-promo a{font-size:11px}
.v9-public .brand-copy{font-size:19px}.v9-public .brand-copy small{font-size:9px}

/* ----------------------------------------------------------------------
   Mega menu — larger typography + no disappearing while crossing the gap
   ---------------------------------------------------------------------- */
@media (min-width:1081px){
  .v9-public .nav-dropdown{isolation:isolate}
  .v9-public .v6-mega-menu{
    top:calc(100% + 13px);
    left:50%;
    width:min(1120px,calc(100vw - 54px));
    padding:24px;
    border-radius:24px;
    border:1px solid rgba(31,25,67,.09);
    background:rgba(255,255,255,.985);
    box-shadow:0 35px 95px rgba(26,21,59,.17),0 10px 28px rgba(40,31,92,.07),inset 0 1px 0 #fff;
    backdrop-filter:blur(24px) saturate(150%);
    transform:translate(-45%,12px);
    transition:opacity .19s ease,visibility .19s ease,transform .22s cubic-bezier(.2,.8,.2,1);
    overflow:visible;
  }
  /* invisible hover bridge between the trigger and the menu */
  .v9-public .v6-mega-menu::before{
    content:'';position:absolute;left:0;right:0;top:-18px;height:20px;background:transparent;
  }
  .v9-public .nav-dropdown:hover>.v6-mega-menu,
  .v9-public .nav-dropdown:focus-within>.v6-mega-menu,
  .v9-public .nav-dropdown.v9-menu-open>.v6-mega-menu{
    opacity:1;visibility:visible;pointer-events:auto;transform:translate(-45%,0);
  }
  .v9-public .v6-mega-menu .mega-menu-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
  .v9-public .v6-mega-menu .mega-col{
    position:relative;padding:15px 14px 13px;border-radius:18px;
    background:linear-gradient(145deg,#fbfbfe 0%,#f8f8fc 100%);
    border:1px solid rgba(31,25,67,.055);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.92);
    min-height:194px;
  }
  .v9-public .v6-mega-menu .mega-platform{
    gap:11px;padding:2px 2px 12px;margin-bottom:7px;border-bottom:1px solid #ececf3;
    color:#4c4f5c!important;opacity:1!important;
  }
  .v9-public .v6-mega-menu .mega-platform strong{
    font-family:'Sora','Inter',sans-serif;font-size:14px;line-height:1.25;font-weight:700;color:#5b5e69;
  }
  .v9-public .v6-mega-menu .mega-platform .platform-logo{width:38px;height:38px;border-radius:12px;background:#fff;box-shadow:0 5px 14px rgba(30,25,61,.05)}
  .v9-public .v6-mega-menu .mega-platform .platform-logo img{width:20px;height:20px}
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform){
    display:flex;align-items:center;min-height:29px;padding:5px 8px;margin:1px 0;border-radius:9px;
    font-family:'Inter',sans-serif;font-size:12px!important;line-height:1.35;font-weight:600!important;
    color:#676b77!important;opacity:1!important;visibility:visible!important;
    transition:background .15s ease,color .15s ease,transform .15s ease,box-shadow .15s ease;
  }
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform)::before{
    content:'';width:5px;height:5px;border-radius:50%;background:#d9d6ea;margin-right:8px;flex:0 0 auto;transition:.15s ease;
  }
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform):hover,
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform):focus-visible{
    color:#2c273f!important;background:#fff!important;opacity:1!important;
    transform:translateX(3px);box-shadow:0 6px 18px rgba(43,34,91,.055);
    outline:none;
  }
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform):hover::before{background:#7159eb;box-shadow:0 0 0 4px rgba(113,89,235,.09)}
  .v9-public .v6-mega-menu .mega-menu-footer{
    padding:18px 7px 2px;margin-top:15px;font-size:11px;color:#858996;align-items:center
  }
  .v9-public .v6-mega-menu .mega-menu-footer a{font-size:12px;color:#634be0;font-weight:800}
}

@media (min-width:861px) and (max-width:1080px){
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform){font-size:11.5px!important;line-height:1.4;padding:6px 5px;color:#666b78!important;opacity:1!important}
  .v9-public .v6-mega-menu .mega-platform strong{font-size:13px}
  .v9-public .v6-mega-menu .mega-menu-footer{font-size:10px}
}

/* Mobile mega menu should be readable too. */
@media (max-width:860px){
  .v9-public .v6-mega-menu .mega-col{padding:12px;border:1px solid #eeeef4;background:#fafafd}
  .v9-public .v6-mega-menu .mega-platform strong{font-size:13px}
  .v9-public .v6-mega-menu .mega-col>a:not(.mega-platform){font-size:12px!important;line-height:1.4;padding:7px 4px;color:#646976!important;opacity:1!important}
}

/* ----------------------------------------------------------------------
   Custom select — keep browser native popup hidden, increase legibility
   ---------------------------------------------------------------------- */
.v9-public .v8-select-trigger{
  min-height:60px;padding:9px 13px;border-radius:16px;border-color:#dfdde9;
  background:linear-gradient(180deg,#fff,#fafafe);
  box-shadow:inset 0 1px 0 #fff,0 7px 22px rgba(44,35,92,.045);
}
.v9-public .v8-select-leading{width:39px;height:39px;flex-basis:39px;border-radius:12px}
.v9-public .v8-select-leading img{width:21px;height:21px}
.v9-public .v8-select-copy{gap:3px}
.v9-public .v8-select-copy small{font-size:10px!important;line-height:1.2!important;color:#9297a3!important}
.v9-public .v8-select-copy strong{font-size:13px!important;line-height:1.3!important;color:#292c37!important;font-weight:700!important}
.v9-public .v8-select-chevron{width:34px;height:34px;border-radius:11px;font-size:14px}
.v9-public .v8-select-portal{padding:9px;border-radius:20px;box-shadow:0 34px 95px rgba(30,24,70,.22),0 10px 30px rgba(40,31,92,.10)}
.v9-public .v8-select-portal-header{padding:9px 11px 10px}
.v9-public .v8-select-portal-header strong{font-size:11px;letter-spacing:.08em}.v9-public .v8-select-portal-header span{font-size:10px}
.v9-public .v8-select-option{min-height:61px;padding:9px 11px;border-radius:14px;gap:11px}
.v9-public .v8-select-option .opt-icon{width:40px;height:40px;flex-basis:40px;border-radius:12px}
.v9-public .v8-select-option .opt-icon img{width:21px;height:21px}
.v9-public .v8-select-option .opt-copy{gap:3px}
.v9-public .v8-select-option .opt-copy strong{font-size:12.5px;line-height:1.3;font-weight:700}
.v9-public .v8-select-option .opt-copy small{font-size:10px;line-height:1.25;color:#8f95a1}
.v9-public .v8-select-option .opt-side{font-size:11px;font-weight:800;color:#6450dc}
.v9-public .v8-select-option .opt-check{width:25px;height:25px;border-radius:8px;font-size:10px}
.v9-public .v8-select-option:hover,.v9-public .v8-select-option.is-active{background:linear-gradient(90deg,#f0edff,#f9f8ff);color:#1c1b24}

/* ----------------------------------------------------------------------
   Product cards — richer depth without hurting readability
   ---------------------------------------------------------------------- */
.v9-public .v6-product-grid{gap:22px;perspective:1500px}
.v9-public .v6-product-card{
  min-height:410px;padding:27px;border-radius:28px;overflow:hidden;
  border:1px solid rgba(39,31,82,.09);
  background:linear-gradient(148deg,#fff 0%,#fdfdff 53%,#f7f5ff 100%);
  box-shadow:0 16px 46px rgba(37,29,82,.07),inset 0 1px 0 rgba(255,255,255,.95);
}
.v9-public .v6-product-card::before{
  background:radial-gradient(300px circle at var(--card-x,80%) var(--card-y,4%),rgba(112,85,244,.17),transparent 61%);
}
.v9-public .v6-product-card::after{
  width:180px;height:180px;right:-82px;bottom:-92px;background:linear-gradient(145deg,rgba(111,84,242,.14),rgba(61,133,255,.04));filter:blur(1px)
}
.v9-public .v6-product-card:hover{border-color:rgba(103,80,226,.25);box-shadow:var(--v9-shadow-hover)}
.v9-public .v6-product-card.popular{border-color:rgba(106,82,232,.32);box-shadow:0 26px 72px rgba(86,64,194,.14),inset 0 1px 0 #fff}
.v9-public .v6-product-brand>span{width:52px;height:52px;border-radius:17px;background:linear-gradient(145deg,#fff,#f5f4fa);box-shadow:0 11px 27px rgba(39,31,84,.09),inset 0 1px 0 #fff}
.v9-public .v6-product-brand img{width:25px;height:25px}
.v9-public .v6-product-brand small{font-size:11px!important;color:#7b808d;font-weight:800}
.v9-public .v6-product-card h3{font-size:18px!important;line-height:1.38;margin:17px 0 13px;letter-spacing:-.035em}
.v9-public .v6-product-qty strong{font-size:35px}.v9-public .v6-product-qty span{font-size:11px;color:#8c919e;font-weight:650}
.v9-public .v6-product-card ul{gap:9px;margin:18px 0 20px}
.v9-public .v6-product-card li{font-size:12px!important;line-height:1.55;color:#686d79}.v9-public .v6-product-card li::before{font-size:11px;margin-right:7px}
.v9-public .v6-popular-badge{font-size:10px!important;padding:8px 11px;top:18px;right:18px}
.v9-public .v6-product-bottom{position:relative;z-index:4;gap:14px;padding-top:20px;transform:translateZ(28px)}
.v9-public .v6-product-bottom div small{font-size:10px!important;letter-spacing:.06em;color:#8e929e}.v9-public .v6-product-bottom div strong{font-size:25px!important;letter-spacing:-.035em}

/* Main buy CTA: real button, not a tiny purple label. */
.v9-public .v6-product-bottom>a{
  position:relative;isolation:isolate;overflow:hidden;
  min-width:124px;min-height:49px;padding:0 16px;border-radius:15px;
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:'Sora','Inter',sans-serif;font-size:12px!important;font-weight:700!important;line-height:1;
  color:#fff!important;background:linear-gradient(135deg,#191625 0%,#604bdc 58%,#8b5cf0 100%);
  border:1px solid rgba(83,62,196,.16);
  box-shadow:0 13px 29px rgba(88,66,208,.24),inset 0 1px 0 rgba(255,255,255,.22);
  transform:translateZ(30px);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}
.v9-public .v6-product-bottom>a::before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 22%,rgba(255,255,255,.30) 47%,transparent 70%);transform:translateX(-130%);transition:transform .55s ease;z-index:-1}
.v9-public .v6-product-bottom>a::after{content:'↗';width:25px;height:25px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.14);font-size:13px;transition:transform .2s ease,background .2s ease}
.v9-public .v6-product-bottom>a:hover{color:#fff!important;transform:translateZ(32px) translateY(-2px);box-shadow:0 18px 35px rgba(88,66,208,.31);filter:saturate(108%)}
.v9-public .v6-product-bottom>a:hover::before{transform:translateX(130%)}
.v9-public .v6-product-bottom>a:hover::after{transform:translate(2px,-2px);background:rgba(255,255,255,.21)}
.v9-public .v6-product-bottom>a:active{transform:translateZ(30px) translateY(0) scale(.985)}
.v9-public .v6-product-bottom>a:focus-visible{outline:3px solid rgba(109,82,232,.23);outline-offset:3px}

/* Quick-order main button */
.v9-public .v7-buy-button{
  min-height:62px;border-radius:18px;padding:0 18px 0 21px;font-size:13px;font-weight:750;
  background:linear-gradient(135deg,#171420 0%,#5b47da 55%,#8c5df0 100%);
  box-shadow:0 18px 39px rgba(83,62,202,.28),inset 0 1px 0 rgba(255,255,255,.2);
}
.v9-public .v7-buy-button b{width:35px;height:35px;border-radius:11px;font-size:14px}
.v9-public .v7-buy-button:hover{box-shadow:0 23px 48px rgba(83,62,202,.34);filter:saturate(108%)}

/* Generic purple buttons */
.v9-public .btn-primary{
  min-height:49px;border-radius:15px;padding-inline:20px;font-size:12px!important;font-weight:750!important;
  background:linear-gradient(135deg,#1a1725,#604bdc 62%,#8d5ff1);
  box-shadow:0 13px 29px rgba(87,65,206,.23),inset 0 1px 0 rgba(255,255,255,.18);
}
.v9-public .btn-primary:hover{color:#fff;background:linear-gradient(135deg,#14111d,#5741d5 58%,#8658ed);box-shadow:0 17px 35px rgba(87,65,206,.30)}

/* ----------------------------------------------------------------------
   Services page cards + CTA
   ---------------------------------------------------------------------- */
.v9-public .v6-service-list-grid{gap:14px}
.v9-public .v6-service-list-card{padding:18px;border-radius:18px;gap:16px;box-shadow:0 7px 22px rgba(32,27,65,.035)}
.v9-public .v6-service-list-card:hover{border-color:rgba(112,88,232,.23);box-shadow:0 18px 43px rgba(40,31,87,.085);background:linear-gradient(145deg,#fff,#fbfaff)}
.v9-public .v6-service-list-logo{width:54px;height:54px;border-radius:16px}.v9-public .v6-service-list-logo img{width:27px;height:27px}
.v9-public .v6-service-list-copy small{font-size:10px!important}.v9-public .v6-service-list-copy h3{font-size:15px!important;margin:4px 0 6px}.v9-public .v6-service-list-copy p{font-size:11.5px!important;line-height:1.5;margin-bottom:7px}.v9-public .v6-service-list-copy>span{font-size:10px!important}
.v9-public .v6-service-list-price{min-width:128px;padding-left:18px}.v9-public .v6-service-list-price small{font-size:9px!important}.v9-public .v6-service-list-price strong{font-size:20px;margin:4px 0 9px}
.v9-public .v6-service-list-price b{
  display:inline-flex!important;align-items:center;justify-content:center;min-height:36px;padding:0 12px;border-radius:11px;
  font-size:10px!important;color:#fff!important;background:linear-gradient(135deg,#6550dd,#835aed);box-shadow:0 8px 19px rgba(94,70,213,.18)
}

/* Platform cards feel less flat. */
.v9-public .v6-platform-card{border-radius:26px;padding:22px;box-shadow:0 14px 38px rgba(35,29,79,.065),inset 0 1px 0 #fff}
.v9-public .v6-platform-card::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.75),transparent 38%);pointer-events:none;opacity:.55}
.v9-public .v6-platform-icon{width:62px;height:62px;border-radius:20px}.v9-public .v6-platform-icon img{width:29px;height:29px}
.v9-public .v6-platform-card h3{font-size:15px!important}.v9-public .v6-platform-card p{font-size:11px!important}

/* Prevent overlay layers from ever swallowing text or clicks. */
.v9-public .v6-product-card::before,.v9-public .v6-product-card::after,
.v9-public .v6-platform-card::before,.v9-public .v6-platform-card::after,
.v9-public .v7-widget-shine{pointer-events:none!important}
.v9-public .v6-product-card>*{position:relative;z-index:2}

/* ----------------------------------------------------------------------
   Responsive adjustments
   ---------------------------------------------------------------------- */
@media(max-width:1080px){
  .v9-public .v6-main-nav{gap:15px}.v9-public .v6-main-nav>a,.v9-public .nav-dropdown-trigger{font-size:11.5px}
  .v9-public .v6-product-bottom>a{min-width:112px;padding:0 13px}
}
@media(max-width:720px){
  .v9-public .v8-select-copy strong{font-size:12.5px!important}.v9-public .v8-select-copy small{font-size:9.5px!important}
  .v9-public .v6-product-card{padding:23px;border-radius:24px}
  .v9-public .v6-product-card h3{font-size:17px!important}.v9-public .v6-product-card li{font-size:11.5px!important}
  .v9-public .v6-product-bottom>a{min-width:118px;min-height:47px;font-size:11.5px!important}
}
@media(max-width:520px){
  .v9-public .v6-product-bottom{align-items:flex-end}.v9-public .v6-product-bottom>a{min-width:114px}
  .v9-public .v6-service-list-price{min-width:0}.v9-public .v6-service-list-price b{margin-left:auto}
}