/* ===== Vibrant light theme ===== */
::selection{background:var(--pink);color:#fff}
header.site.stuck{background:rgba(255,255,255,.84)}
.nav-links a:hover{background:rgba(20,16,70,.06)}
.nav-links a.active{background:rgba(108,59,255,.12);color:var(--violet)}
.burger span,.burger span::before,.burger span::after{background:var(--text)}
@media (max-width:1180px){.nav-links{background:rgba(255,255,255,.98)}.nav-links a.active{color:var(--orange);background:none!important}}
.btn.primary{background:linear-gradient(120deg,var(--orange),var(--pink));border-color:transparent}
.btn.primary:hover{background:linear-gradient(120deg,var(--orange-2),#ff4fa8);border-color:transparent}
.kicker::before{background:linear-gradient(90deg,var(--orange),var(--pink))}
.hero::before{background:radial-gradient(closest-side,rgba(255,46,147,.4),rgba(154,69,224,.2) 55%,rgba(99,19,171,0))}
.hero::after{background:radial-gradient(closest-side,rgba(108,59,255,.3),rgba(31,107,255,0))}
.hero-bg{opacity:.65}
.hero-bg::after{background:linear-gradient(90deg,#fff 6%,rgba(255,255,255,.72) 48%,rgba(255,255,255,0))}
.hero h1 .line:nth-child(3)>span{background:linear-gradient(90deg,var(--orange),var(--pink) 55%,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}
.reel{box-shadow:0 30px 70px -20px rgba(70,20,160,.5);border-color:rgba(255,255,255,.8)}
.reel .meta span{color:#fff}
.live{box-shadow:0 20px 50px -15px rgba(70,20,160,.4)}
.live b{color:var(--pink)}
.stats{border:0;border-radius:28px;background:linear-gradient(120deg,#6313ab,#ff2e93 55%,#6313ab);color:#fff;overflow:hidden;box-shadow:0 30px 70px -30px rgba(255,46,147,.65)}
.stat{border-color:rgba(255,255,255,.25)}
.stat b em{color:#ffe14d}
.stat span{color:rgba(255,255,255,.9)}
@media (max-width:820px){.stat:nth-child(-n+2){border-color:rgba(255,255,255,.25)}}
.client{color:#a3a9c9}
.client:hover{color:var(--text)}
.pillar,.card,.itile,.showreel{border-color:transparent;box-shadow:0 22px 44px -26px rgba(70,30,160,.55)}
.pillar:hover,.card:hover,.itile:hover{border-color:var(--orange)}
.pillar h3,.card .info h4,.itile h4,.showreel .txt h3{color:#fff}
.pillar .chips .chip{border-color:rgba(255,255,255,.3);color:#fff;background:rgba(255,255,255,.14)}
.card .tag{color:#fff}
.pillar::after{background:linear-gradient(180deg,rgba(30,10,90,0) 20%,rgba(30,10,90,.88) 95%)}
.card::after{background:linear-gradient(180deg,rgba(30,10,90,.02) 40%,rgba(30,10,90,.85))}
.itile::after{background:linear-gradient(180deg,transparent 45%,rgba(30,10,90,.9))}
.showreel::after{background:linear-gradient(90deg,rgba(30,10,90,.85),rgba(30,10,90,.05) 70%)}
.page-head::before{background:radial-gradient(closest-side,rgba(255,46,147,.25),rgba(99,19,171,0))}
.fbtn[aria-pressed="true"]{background:var(--text);color:#fff}
.svc-icon{background:linear-gradient(135deg,var(--orange),var(--pink))}
.svc-item{background:var(--surface);box-shadow:0 14px 34px -24px rgba(70,30,160,.45)}
.kpi{background:#fff}
.kpi b{color:var(--pink)}
.mock{background:#fff;box-shadow:0 20px 44px -28px rgba(70,30,160,.5)}
.mock-h .up{color:#0f9f5e}
.kw i{color:#0f9f5e}
.studio div{color:#fff;border:0;box-shadow:0 24px 50px -28px rgba(70,30,160,.6)}
.studio div:nth-child(1){background:linear-gradient(135deg,#6313ab,#1f6bff)}
.studio div:nth-child(2){background:linear-gradient(135deg,#6313ab,#ff2e93)}
.studio div:nth-child(3){background:linear-gradient(135deg,#ff2e93,#6313ab)}
.studio div .muted{color:rgba(255,255,255,.9)}
.case{background:#fff;box-shadow:0 30px 70px -44px rgba(70,30,160,.6)}
.case-vis{color:#fff;background:linear-gradient(135deg,#6313ab,#ff2e93)}
.case:nth-child(2) .case-vis{background:linear-gradient(135deg,#6313ab,#ff2e93)}
.case:nth-child(3) .case-vis{background:linear-gradient(135deg,#1f6bff,#6313ab)}
.case:nth-child(4) .case-vis{background:linear-gradient(135deg,#00b894,#1f6bff)}
.case-vis::after{background:linear-gradient(180deg,rgba(30,10,90,.12),rgba(30,10,90,.65))}
.case-vis .big{color:#ffe14d}
.case-vis .bigl{color:rgba(255,255,255,.92)}
.bars i{background:linear-gradient(180deg,#ffe14d,#ff9a3d)}
.bars i:nth-child(1),.bars i:nth-child(2){background:rgba(255,255,255,.4)}
.bar-labels{color:rgba(255,255,255,.85)}
.tslider{background:linear-gradient(135deg,#6313ab,#ff2e93 60%,#6313ab);border:0;color:#fff;box-shadow:0 40px 80px -44px rgba(255,46,147,.8)}
.tslide blockquote{color:#fff}
.tslider .who span{color:rgba(255,255,255,.85)}
.tslider .avatar{border:2px solid #fff}
.tslider .dot{background:rgba(255,255,255,.4)}
.tslider .dot[aria-current="true"]{background:#fff}
.tslider .circle{border-color:rgba(255,255,255,.6)}
.tslider .circle:hover{background:rgba(255,255,255,.2);border-color:#fff}
.tcard{background:#fff;box-shadow:0 18px 40px -28px rgba(70,30,160,.5)}
.mission .dim{color:#b9b1e6}
.value{background:#fff;border-top:4px solid var(--orange);box-shadow:0 18px 40px -28px rgba(70,30,160,.45)}
.value:nth-child(2){border-top-color:var(--pink)}
.value:nth-child(3){border-top-color:var(--violet)}
.value:nth-child(4){border-top-color:var(--blue)}
.member{background:#fff;box-shadow:0 18px 40px -28px rgba(70,30,160,.45)}
.member .role{color:var(--pink)}
.post-feature,.post{background:#fff;box-shadow:0 18px 40px -28px rgba(70,30,160,.45)}
.pmeta .cat{color:var(--pink)}
.gtile{background:#fff;box-shadow:0 18px 40px -28px rgba(70,30,160,.45)}
.form{background:#fff;box-shadow:0 30px 70px -44px rgba(70,30,160,.55)}
input,select,textarea{background:#faf8ff}
input::placeholder,textarea::placeholder{color:#a0a5c6}
.err{color:#e0245e}
.field.bad input,.field.bad select,.field.bad textarea{border-color:#e0245e}
.side-card{background:linear-gradient(135deg,#6313ab,#ff2e93 60%,#6313ab);border:0;color:#fff;box-shadow:0 30px 70px -36px rgba(255,46,147,.8)}
.side-card h3{color:#fff}
.side-card li{color:#fff}
.side-card .muted{color:rgba(255,255,255,.92)!important}
.side-card .btn.primary{background:#fff;color:#e0245e;border-color:#fff;box-shadow:0 12px 30px -10px rgba(0,0,0,.3)}
.direct{background:#fff}
.direct a{color:var(--orange)}
.cta-band{background:linear-gradient(135deg,#1f6bff,#6313ab 50%,#ff2e93);border:0;color:#fff;box-shadow:0 40px 80px -44px rgba(108,59,255,.8)}
.cta-band p{color:rgba(255,255,255,.92)}
.cta-band .btn.primary{background:#fff;color:#6313ab}
#homeContact{background:linear-gradient(180deg,#fff,#f2edff 40%,#ffeaf4);padding-top:clamp(72px,10vw,140px)!important}
footer{--text:#fff;--muted:#a9b3d6;--line:rgba(255,255,255,.14);background:#120d3a;color:#fff;border-top:0}
.foot a{color:#a9b3d6}
.foot a:hover{color:#ffb36b}
.modal{background:rgba(25,12,80,.55)}
.sheet{background:#fff;box-shadow:0 40px 100px -30px rgba(40,20,120,.6)}
.stage .scrub{color:#fff}
.takeaways{color:#3d4470}
.m-metric{color:#d9400a;background:rgba(99,19,171,.1)}
.x{background:rgba(18,13,58,.75)}
.chip{background:rgba(108,59,255,.08);color:var(--violet);border-color:rgba(108,59,255,.18)}
.hero-note i{box-shadow:0 0 0 4px rgba(61,220,132,.22)}


/* ===== Primary colour #6313ab ===== */
.btn.primary{background:linear-gradient(120deg,#6313ab,#8a2fd1);border-color:transparent;box-shadow:0 10px 40px -10px rgba(99,19,171,.6)}
.btn.primary:hover{background:linear-gradient(120deg,#7a22c9,#a243e6);border-color:transparent;box-shadow:0 14px 50px -8px rgba(99,19,171,.6)}
.kicker::before{background:linear-gradient(90deg,#6313ab,var(--pink))}
.nav-links a.active{background:rgba(99,19,171,.1);color:#6313ab}
.hero::before{background:radial-gradient(closest-side,rgba(255,46,147,.3),rgba(99,19,171,.2) 55%,rgba(99,19,171,0))}
.hero::after{background:radial-gradient(closest-side,rgba(31,107,255,.2),rgba(31,107,255,0))}
.hero h1 .line:nth-child(3)>span{background:linear-gradient(90deg,#6313ab,#c22fd0 55%,var(--pink));-webkit-background-clip:text;background-clip:text;color:transparent}
.live b{color:#6313ab}
.stats{background:linear-gradient(120deg,#6313ab,#a62fd8 55%,#ff2e93);box-shadow:0 30px 70px -30px rgba(99,19,171,.65)}
.svc-icon{background:linear-gradient(135deg,#6313ab,#a62fd8);box-shadow:0 14px 40px -10px rgba(99,19,171,.5)}
.studio div:nth-child(1){background:linear-gradient(135deg,#6313ab,#1f6bff)}
.studio div:nth-child(2){background:linear-gradient(135deg,#a62fd8,#ff2e93)}
.studio div:nth-child(3){background:linear-gradient(135deg,#1f6bff,#6313ab)}
.case-vis{background:linear-gradient(135deg,#6313ab,#ff2e93)}
.case:nth-child(2) .case-vis{background:linear-gradient(135deg,#8a2fd1,#ff5ec4)}
.case:nth-child(3) .case-vis{background:linear-gradient(135deg,#1f6bff,#6313ab)}
.case:nth-child(4) .case-vis{background:linear-gradient(135deg,#00a98f,#6313ab)}
.tslider{background:linear-gradient(135deg,#6313ab,#a62fd8 55%,#ff2e93);box-shadow:0 40px 80px -44px rgba(99,19,171,.8)}
.side-card{background:linear-gradient(135deg,#6313ab,#a62fd8 60%,#ff2e93);box-shadow:0 30px 70px -36px rgba(99,19,171,.8)}
.side-card .btn.primary{background:#fff;color:#6313ab}
.cta-band{background:linear-gradient(135deg,#4b0f94,#6313ab 50%,#c22fd0);box-shadow:0 40px 80px -44px rgba(99,19,171,.8)}
.cta-band .btn.primary{background:#fff;color:#6313ab}
.chip{background:rgba(99,19,171,.08);color:#6313ab;border-color:rgba(99,19,171,.2)}
.m-metric{color:#6313ab;background:rgba(99,19,171,.1);border-color:rgba(99,19,171,.3)}
.pillar:hover,.card:hover,.itile:hover{border-color:#6313ab}
.value{border-top-color:#6313ab}
.value:nth-child(2){border-top-color:var(--pink)}
.value:nth-child(3){border-top-color:#a62fd8}
.value:nth-child(4){border-top-color:var(--blue)}
#homeContact{background:linear-gradient(180deg,#fff,#f5ecff 40%,#ffeaf6)}


/* Bento pillars: uneven sizes, aligned edges */
.pillars{grid-auto-rows:minmax(260px,auto);grid-template-areas:"a a a a a a a b b b b b" "a a a a a a a c c c c c" "d d d d d d d d d d d d"}
.p-a{grid-area:a}.p-b{grid-area:b}.p-c{grid-area:c}.p-d{grid-area:d}
.pillar{min-height:0}
.p-a{padding:clamp(28px,4vw,48px)}
.p-a h3{font-size:clamp(2rem,3.4vw,2.8rem)}
.p-a p{font-size:1.05rem;max-width:46ch}
.p-d{background:linear-gradient(110deg,#2a0a5e,#6313ab 60%,#a62fd8)}
.p-d::after{background:linear-gradient(90deg,rgba(30,10,90,.55),rgba(30,10,90,0) 65%)}
.p-d .bgart svg [stroke="#120d3a"],.p-d .bgart svg [stroke="#6313ab"]{stroke:#fff}
@media (max-width:860px){
  .pillars{grid-template-areas:none;grid-auto-rows:auto}
  .p-a,.p-b,.p-c,.p-d{grid-area:auto;grid-column:span 12;min-height:300px}
  .p-d .bgart{opacity:.35}
}

.pillar p{color:rgba(255,255,255,.95)}
.pillar::after{background:linear-gradient(180deg,rgba(30,10,90,0) 10%,rgba(30,10,90,.9) 92%)}
.p-d::after{background:linear-gradient(90deg,rgba(30,10,90,.55),rgba(30,10,90,0) 65%)}
@media (max-width:860px){.p-d::after{background:linear-gradient(180deg,rgba(30,10,90,0) 10%,rgba(30,10,90,.7))}}