/* The TransVare Suite — creative card system. Design only; wording untouched. */
html body #homepage-suite{position:relative;overflow:hidden}
html body #homepage-suite::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(67,56,202,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(67,56,202,.05) 1px,transparent 1px);
  background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 60%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse 80% 70% at 50% 60%,#000 30%,transparent 80%)}
html body #homepage-suite .wrap{position:relative;z-index:1}
html body #homepage-suite .suite-pair-divider{display:none!important}

html body #homepage-suite .suite-discipline-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:18px!important;counter-reset:suite;margin-top:28px!important;border:0!important;background:none!important}
@media(max-width:1020px){html body #homepage-suite .suite-discipline-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){html body #homepage-suite .suite-discipline-grid{grid-template-columns:1fr!important}}

html body #homepage-suite .product-card{--a:#e71467;--b:#4338ca;counter-increment:suite;position:relative!important;isolation:isolate;display:flex!important;flex-direction:column!important;gap:12px;
  padding:26px 24px 22px!important;border-radius:22px!important;border:1px solid rgba(15,27,61,.08)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.78))!important;backdrop-filter:blur(8px);
  box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 18px 40px -28px rgba(15,27,61,.35)!important;overflow:hidden!important;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s!important;
  opacity:0;transform:translateY(24px);animation:suiteIn .8s cubic-bezier(.2,.8,.2,1) forwards}
html body #homepage-suite .product-card::before{content:counter(suite,decimal-leading-zero);position:absolute;right:18px;top:8px;z-index:-1;
  font:700 72px/1 "Space Grotesk",system-ui,sans-serif;letter-spacing:-.04em;
  background:linear-gradient(160deg,color-mix(in oklab,var(--a) 22%,transparent),transparent 75%);-webkit-background-clip:text;background-clip:text;color:transparent}
html body #homepage-suite .product-card::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;z-index:-1;pointer-events:none;
  background:conic-gradient(from var(--ang,0deg),transparent 0 60%,var(--a) 75%,var(--b) 90%,transparent);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .4s}
html body #homepage-suite .product-card:hover{transform:translateY(-6px)!important;box-shadow:0 30px 60px -30px color-mix(in oklab,var(--a) 60%,transparent)!important}
html body #homepage-suite .product-card:hover::after{opacity:1;animation:suiteSpin 3s linear infinite}

/* glow orb + top accent bar */
html body #homepage-suite .suite-discipline-brand{position:relative;display:flex!important;flex-direction:column;align-items:flex-start;gap:10px}
html body #homepage-suite .suite-discipline-brand::before{content:"";position:absolute;left:-60px;top:-80px;width:220px;height:220px;border-radius:50%;z-index:-1;
  background:radial-gradient(circle,color-mix(in oklab,var(--a) 22%,transparent),transparent 70%);transition:transform .6s}
html body #homepage-suite .product-card:hover .suite-discipline-brand::before{transform:scale(1.25)}
html body #homepage-suite .product-card .tv-logo-mini{height:26px!important;width:auto!important;max-width:190px}
html body #homepage-suite .product-card .tag{display:inline-flex!important;align-items:center;gap:7px;padding:5px 12px!important;border-radius:999px!important;
  font-size:13px!important;font-weight:600!important;color:color-mix(in oklab,var(--a) 70%,#0b1430)!important;
  background:color-mix(in oklab,var(--a) 10%,#fff)!important;border:1px solid color-mix(in oklab,var(--a) 25%,transparent)!important}
html body #homepage-suite .product-card .tag::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--a);box-shadow:0 0 0 0 var(--a);animation:suitePulse 2.4s infinite}
html body #homepage-suite .product-card>p{margin:2px 0 0!important;font-size:15.5px!important;line-height:1.55!important;color:#3a4566!important}

html body #homepage-suite .product-card ul{display:flex!important;flex-wrap:wrap;gap:6px!important;margin:4px 0 0!important;padding:0!important;list-style:none!important;columns:auto!important}
html body #homepage-suite .product-card li{margin:0!important;padding:4px 10px!important;border-radius:8px;font-size:12.5px!important;color:#2a3557!important;
  background:rgba(15,27,61,.04);border:1px solid rgba(15,27,61,.06);transition:background .3s,border-color .3s}
html body #homepage-suite .product-card li::before,html body #homepage-suite .product-card li::marker{display:none!important;content:none!important}
html body #homepage-suite .product-card:hover li{background:color-mix(in oklab,var(--a) 7%,#fff);border-color:color-mix(in oklab,var(--a) 20%,transparent)}

html body #homepage-suite .product-card .text-link{position:static!important;margin-top:auto!important;padding-top:10px;display:inline-flex!important;align-items:center;gap:8px;
  font-weight:600!important;font-size:14px!important;color:color-mix(in oklab,var(--a) 75%,#0b1430)!important;border-top:1px dashed rgba(15,27,61,.12);width:100%}
html body #homepage-suite .product-card .text-link::after{content:"→";margin-left:auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:linear-gradient(135deg,var(--a),var(--b));color:#fff;transition:transform .35s}
html body #homepage-suite .product-card:hover .text-link::after{transform:translateX(4px) rotate(-45deg)}

/* product colours (card order: ERM, Audit, Compliance, Governance, Cyber, Inci) */
html body #homepage-suite .product-card[href*="ermvare"]{--a:#1f9d55;--b:#0f6b3a}
html body #homepage-suite .product-card[href*="auditvare"]{--a:#c9a227;--b:#6b3fa0}
html body #homepage-suite .product-card[href*="compliancevare"]{--a:#2f6fd1;--b:#173f80}
html body #homepage-suite .product-card[href*="governancevare"]{--a:#1d4ed8;--b:#0f2a6b}
html body #homepage-suite .product-card[href*="cybervare"]{--a:#c2185b;--b:#6a1b9a}
html body #homepage-suite .product-card[href*="incivare"]{--a:#f26b5b;--b:#b23a2e}
html body #homepage-suite .product-card:nth-of-type(2){animation-delay:.08s}
html body #homepage-suite .product-card:nth-of-type(3){animation-delay:.16s}
html body #homepage-suite .product-card:nth-of-type(4){animation-delay:.24s}
html body #homepage-suite .product-card:nth-of-type(5){animation-delay:.32s}
html body #homepage-suite .product-card:nth-of-type(6){animation-delay:.40s}

@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes suiteSpin{to{--ang:360deg}}
@keyframes suiteIn{to{opacity:1;transform:none}}
@keyframes suitePulse{0%{box-shadow:0 0 0 0 color-mix(in oklab,var(--a) 50%,transparent)}70%,100%{box-shadow:0 0 0 7px transparent}}
@media(prefers-reduced-motion:reduce){html body #homepage-suite .product-card{animation:none;opacity:1;transform:none}html body #homepage-suite .product-card *,html body #homepage-suite .product-card::after{animation:none!important}}
html body #homepage-suite .suite-discipline-grid::before{display:none!important}
