/* ZA Creative Portfolio v4 — main.css
   Exact match to zazeem.mizlet.com
   All sizing/color controlled via PHP dynamic CSS — values here are base fallbacks only */

*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{background:var(--ink);color:var(--paper);font-family:'Plus Jakarta Sans',sans-serif;font-weight:400;line-height:1.65;overflow-x:hidden;cursor:none;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;height:auto;}
button{cursor:pointer;font-family:inherit;border:none;background:none;}

/* ── Cursor ─────────────────────────────────────────── */
#cur-blob{position:fixed;width:14px;height:14px;background:var(--lime);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);mix-blend-mode:difference;transition:width .3s var(--ease),height .3s var(--ease);}
body.cx #cur-blob{width:68px;height:68px;}

/* ── Layout ─────────────────────────────────────────── */
.si{max-width:1280px;margin:0 auto;padding:0 5vw;}

/* ── Nav ────────────────────────────────────────────── */
#za-nav{position:fixed;top:0;left:0;right:0;z-index:200;transition:background .4s,border-color .4s;}
.nav-phone-bar{background:var(--lime);color:var(--ink);text-align:center;padding:.35rem 1rem;font-family:'Unbounded',sans-serif;font-size:.58rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;}
.nav-phone-bar a{color:var(--ink);display:block;}
.nav-main{height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;padding:0 5vw;transition:background .4s,border-color .4s;border-bottom:1px solid transparent;}
#za-nav.sc .nav-main{background:rgba(8,8,8,.93);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-color:var(--bdk);}
.nlogo{font-family:'Unbounded',sans-serif;font-size:1.1rem;font-weight:900;color:var(--paper);display:flex;align-items:center;gap:.4rem;}
.ndot{width:8px;height:8px;border-radius:50%;background:var(--lime);display:inline-block;animation:dp 2.5s ease infinite;}
@keyframes dp{0%,100%{box-shadow:0 0 0 0 rgba(200,255,0,.6);}50%{box-shadow:0 0 0 8px rgba(200,255,0,0);}}
.nlinks{display:flex;gap:2rem;list-style:none;align-items:center;}
.nlinks a{font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);transition:color .25s;}
.nlinks a:hover{color:var(--lime);}
.ncta{font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;padding:.55rem 1.3rem;border:1px solid var(--lime);color:var(--lime);border-radius:100px;transition:background .25s,color .25s;}
.ncta:hover{background:var(--lime);color:var(--ink);}
.nr{display:flex;align-items:center;gap:1rem;}
.ham{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.14);color:var(--paper);padding:0;transition:border-color .3s,background .3s;}
.ham:hover{border-color:var(--lime);background:rgba(200,255,0,.06);}
.ham-ico{width:20px;height:14px;display:block;transition:opacity .25s,transform .35s var(--ease);}
.ham-ico .hl1{transition:transform .35s var(--ease),opacity .3s;}
.ham-ico .hl2{transition:transform .35s var(--ease),x .35s var(--ease);}
.ham-ico .hl3{transition:transform .35s var(--ease),opacity .3s;}
.ham.open{border-color:var(--lime);background:rgba(200,255,0,.08);}
.ham.open .hl1{transform:translateY(8px) rotate(45deg);transform-origin:center;}
.ham.open .hl2{opacity:0;transform:scaleX(0);}
.ham.open .hl3{transform:translateY(-8px) rotate(-45deg);transform-origin:center;}
#mobnav{position:fixed;inset:0;z-index:190;background:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;}
#mobnav[hidden]{display:none;}
.mclose{position:absolute;top:1.5rem;right:5vw;color:var(--muted);font-size:1.5rem;transition:color .25s;}
.mclose:hover{color:var(--lime);}
.mlink{font-family:'Unbounded',sans-serif;font-size:2.2rem;font-weight:900;color:var(--paper);transition:color .2s;letter-spacing:-.03em;}
.mlink:hover{color:var(--lime);}

/* ── Hero ───────────────────────────────────────────── */
#za-hero{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;padding:0 5vw calc(6vh + var(--nav-h));position:relative;overflow:hidden;}
.hvid-wrap{position:absolute;inset:0;z-index:0;background:var(--ink);overflow:hidden;}
#yt-wrap{position:absolute;top:50%;left:50%;width:177.78vh;height:100vh;min-width:100%;min-height:56.25vw;transform:translate(-50%,-50%);pointer-events:none;}
#yt-player{width:100%;height:100%;}
#yt-wrap iframe{width:100%;height:100%;filter:grayscale(100%) brightness(.35);opacity:.18;}
.hvid-over{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(8,8,8,.25) 0%,rgba(8,8,8,.05) 35%,rgba(8,8,8,.55) 75%,rgba(8,8,8,.97) 100%);}
.hnoise{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");}
.hgrid{position:absolute;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(rgba(200,255,0,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(200,255,0,.022) 1px,transparent 1px);background-size:65px 65px;}
.hcontent{position:relative;z-index:2;}
.havail{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:2.8rem;opacity:0;animation:sup .8s .1s var(--ease) forwards;}
.adot{width:7px;height:7px;border-radius:50%;background:var(--lime);animation:dp 2s infinite;}
.havail span{font-family:'Unbounded',sans-serif;font-size:.58rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--lime);}
.hhl{font-family:'Unbounded',sans-serif;font-size:90px;font-weight:900;line-height:.9;letter-spacing:-.04em;color:var(--paper);opacity:0;animation:sup .9s .2s var(--ease) forwards;}
.hhl .ghost{display:block;-webkit-text-stroke:1.5px rgba(240,237,230,.18);color:transparent;}
.hhl .solid{display:block;}
.hhl .ital{display:block;font-family:'DM Serif Display',serif;font-style:italic;font-weight:400;font-size:.88em;letter-spacing:-.02em;color:var(--lime);}
.hbot{display:flex;align-items:flex-end;justify-content:space-between;margin-top:3.5rem;flex-wrap:wrap;gap:2rem;opacity:0;animation:sup .9s .45s var(--ease) forwards;}
.hdesc{max-width:360px;font-size:16px;color:var(--muted);line-height:1.78;}
.hdesc strong{color:var(--paper);font-weight:500;}
.hacts{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;}
.scue{display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--muted);}
.sline{width:1px;height:52px;background:linear-gradient(var(--lime),transparent);animation:sp 2s ease infinite;}
.slbl{font-family:'Unbounded',sans-serif;font-size:.52rem;letter-spacing:.2em;text-transform:uppercase;}
@keyframes sp{0%,100%{opacity:.3;}50%{opacity:1;}}
@keyframes sup{from{opacity:0;transform:translateY(52px);}to{opacity:1;transform:none;}}

/* ── Buttons ────────────────────────────────────────── */
.btn-p{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.2rem;background:var(--lime);color:var(--ink);font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;border-radius:100px;border:none;transition:transform .3s,box-shadow .3s;}
.btn-p:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(200,255,0,.3);}
.btn-g{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 2.2rem;background:transparent;color:var(--paper);font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;border:1px solid rgba(240,237,230,.18);border-radius:100px;transition:border-color .3s,color .3s;}
.btn-g:hover{border-color:var(--lime);color:var(--lime);}

/* ── Marquee ────────────────────────────────────────── */
.mstrip{overflow:hidden;border-top:1px solid #111;border-bottom:1px solid #111;background:var(--lime);padding:.45rem 0;}
.mstrip.dk{background:transparent;border-color:rgba(255,255,255,.06);}
.mtrack{display:flex;white-space:nowrap;animation:mq 26s linear infinite;}
.mitem{font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);padding:0 2.2rem;display:flex;align-items:center;gap:2rem;}
.mitem::after{content:'★';font-size:.4rem;}
.mstrip.dk .mitem{color:rgba(240,237,230,.22);}
.mstrip.dk .mitem::after{color:var(--lime);}
@keyframes mq{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ── Section common ─────────────────────────────────── */
.eyb{font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--lime-dim);display:flex;align-items:center;gap:.8rem;margin-bottom:1.4rem;}
.eyb::before{content:'';width:28px;height:1.5px;background:var(--lime-dim);flex-shrink:0;}
.eyb-lt{font-family:'Unbounded',sans-serif;font-size:.6rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase;color:var(--lime);display:flex;align-items:center;gap:.8rem;margin-bottom:1.4rem;}
.eyb-lt::before{content:'';width:28px;height:1.5px;background:var(--lime);flex-shrink:0;}
.sh{font-family:'Unbounded',sans-serif;font-size:64px;font-weight:900;line-height:.95;letter-spacing:-.04em;color:var(--ink);}
.sh em{font-family:'DM Serif Display',serif;font-style:italic;font-weight:400;color:var(--lime-dim);}
.sh-lt{font-family:'Unbounded',sans-serif;font-size:64px;font-weight:900;line-height:.95;letter-spacing:-.04em;color:var(--paper);}
.sh-lt em{font-family:'DM Serif Display',serif;font-style:italic;font-weight:400;color:var(--lime);}
.shd{margin-bottom:3.5rem;}

/* ── About ──────────────────────────────────────────── */
#about{background:var(--paper);color:var(--ink);padding:130px 0;position:relative;overflow:hidden;}
#about::before{content:'ABOUT';position:absolute;right:-2rem;top:50%;transform:translateY(-50%);font-family:'Unbounded',sans-serif;font-size:18vw;font-weight:900;color:rgba(10,10,10,.04);letter-spacing:-.06em;pointer-events:none;white-space:nowrap;}
.agrid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;}
.abody{font-size:16px;color:#4a4640;line-height:1.85;}
.abody+.abody{margin-top:1rem;}
.chips{margin-top:2.5rem;display:flex;flex-wrap:wrap;gap:.45rem;}
.chip{font-family:'Unbounded',sans-serif;font-size:.5rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.42rem 1.1rem;border:1.5px solid var(--ink);border-radius:100px;color:var(--ink);transition:background .25s,color .25s;}
.chip:hover{background:var(--ink);color:var(--lime);}
.ar{position:relative;}
.ftag{position:absolute;top:-14px;right:-14px;background:var(--lime);color:var(--ink);font-family:'Unbounded',sans-serif;font-size:.52rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.42rem .9rem;border-radius:100px;transform:rotate(5deg);z-index:1;}
.acard{background:var(--ink);color:var(--paper);padding:3rem 2.5rem;border-radius:8px;position:relative;overflow:hidden;}
.acard::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 90% 0%,rgba(200,255,0,.12),transparent);pointer-events:none;}
.cini{font-family:'Unbounded',sans-serif;font-size:5.5rem;font-weight:900;color:var(--lime);line-height:1;letter-spacing:-.05em;margin-bottom:.3rem;}
.csub{font-family:'Unbounded',sans-serif;font-size:.56rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}
.acard .custom-logo-link,.acard .wp-custom-logo{display:block;margin:.8rem 0 .4rem;}
.acard .custom-logo-link img,.acard .wp-custom-logo img{max-height:60px;width:auto;border-radius:50%;object-fit:cover;display:block;}
.cloc{font-family:'DM Serif Display',serif;font-style:italic;font-size:1.3rem;color:var(--paper);margin-top:.4rem;}
.cloc img{max-height:50px;margin-bottom:.4rem;border-radius:4px;}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:2.2rem;background:rgba(255,255,255,.07);}
.sbox{background:rgba(255,255,255,.03);padding:1.2rem;}
.sn{font-family:'Unbounded',sans-serif;font-size:2rem;font-weight:900;color:var(--lime);letter-spacing:-.04em;line-height:1;}
.sl{font-family:'Unbounded',sans-serif;font-size:.53rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:.3rem;}

/* ── Services ───────────────────────────────────────── */
#services{background:var(--ink);padding:130px 0;}
.svcs{display:flex;flex-direction:column;border-top:1px solid var(--bdk);}
.srow{display:flex;align-items:center;gap:2.5rem;padding:1.8rem 0;border-bottom:1px solid var(--bdk);position:relative;overflow:hidden;transition:padding-left .4s var(--ease);}
.srow::before{content:'';position:absolute;left:0;top:0;bottom:0;width:0;background:var(--lime);transition:width .4s var(--ease);z-index:0;}
.srow:hover{padding-left:1.5rem;}
.srow:hover::before{width:3px;}
.srow:hover .snm{color:var(--lime);}
.srow:hover .sic{transform:scale(1.1) rotate(-5deg);}
.six{font-family:'Unbounded',sans-serif;font-size:.58rem;font-weight:700;color:rgba(240,237,230,.2);letter-spacing:.1em;width:34px;flex-shrink:0;position:relative;z-index:1;}
.sic{font-size:1.8rem;transition:transform .35s var(--ease);position:relative;z-index:1;flex-shrink:0;}
.snm{font-family:'Unbounded',sans-serif;font-size:37px;font-weight:900;letter-spacing:-.03em;color:var(--paper);flex:1;transition:color .35s;position:relative;z-index:1;}
.sds{max-width:300px;font-size:.83rem;color:var(--muted);line-height:1.6;position:relative;z-index:1;}
.sar{font-family:'Unbounded',sans-serif;font-size:.75rem;font-weight:700;color:rgba(240,237,230,.15);transition:color .3s,transform .3s;position:relative;z-index:1;}
.srow:hover .sar{color:var(--lime);transform:translateX(6px);}

/* ── Portfolio ──────────────────────────────────────── */
#portfolio{background:var(--paper);color:var(--ink);padding:130px 0 100px;}
.frow{display:flex;flex-wrap:wrap;gap:.45rem;padding-top:2.5rem;border-top:1.5px solid var(--blt);margin-bottom:3rem;}
.fb{font-family:'Unbounded',sans-serif;font-size:.56rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.52rem 1.1rem;border-radius:100px;border:1.5px solid var(--blt);color:var(--muted);background:transparent;transition:all .25s;}
.fb:hover{border-color:var(--ink);color:var(--ink);}
.fb.active{background:var(--ink);border-color:var(--ink);color:var(--lime);}
/* Grid */
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.pi{position:relative;background:var(--ink);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;transition:transform .4s var(--ease),box-shadow .4s var(--ease);}
.pi:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(0,0,0,.18);}
.pi.hidden{display:none;}
.plink{display:flex;flex-direction:column;height:100%;color:inherit;}
.pthumb{position:relative;overflow:hidden;aspect-ratio:16/10;flex-shrink:0;background:var(--ink3);}
.pthumb img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease);}
.pi:hover .pthumb img{transform:scale(1.06);}
/* category colour placeholders */
.pph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;}
.pc-videoshoots{background:linear-gradient(135deg,#110f00,#2e2400);}
.pc-photoshoots{background:linear-gradient(135deg,#050a12,#091626);}
.pc-ai-videos{background:linear-gradient(135deg,#021008,#041e10);}
.pc-vr-tour{background:linear-gradient(135deg,#080510,#130528);}
.pc-graphic-design{background:linear-gradient(135deg,#0c0209,#200520);}
.pph-i{font-size:3.5rem;opacity:.1;}
.pov{position:absolute;inset:0;background:linear-gradient(to top,rgba(8,8,8,.6) 0%,transparent 60%);opacity:0;transition:opacity .35s;}
.p-zoom-btn{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;background:rgba(8,8,8,.7);border:1px solid rgba(255,255,255,.15);color:var(--paper);display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.8);transition:opacity .3s,transform .3s,background .25s;cursor:pointer;z-index:3;backdrop-filter:blur(4px);}
.pi:hover .p-zoom-btn{opacity:1;transform:scale(1);}
.p-zoom-btn:hover{background:var(--lime);color:var(--ink);border-color:var(--lime);}

.pcta-row{display:flex;align-items:center;justify-content:space-between;}
.pi:hover .pov{opacity:1;}
/* info */
.pinfo{padding:1.2rem 1.4rem 1.4rem;display:flex;flex-direction:column;gap:.3rem;flex:1;background:var(--ink);border-top:1px solid rgba(255,255,255,.05);}
.pmeta{display:flex;align-items:center;gap:.6rem;margin-bottom:.15rem;}
.pcat{font-family:'Unbounded',sans-serif;font-size:.53rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--lime);}
.pyr{font-family:'Unbounded',sans-serif;font-size:.5rem;letter-spacing:.1em;color:rgba(255,255,255,.2);}
.ptit{font-family:'Unbounded',sans-serif;font-size:15px;font-weight:700;letter-spacing:-.02em;color:var(--paper);line-height:1.3;}
.pcli{font-size:.78rem;color:var(--muted);}
.pcta{display:inline-block;margin-top:auto;padding-top:.75rem;font-family:'Unbounded',sans-serif;font-size:.56rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(200,255,0,.38);transition:color .3s;}
.pi:hover .pcta{color:var(--lime);}
.no-items{grid-column:1/-1;text-align:center;padding:4rem;color:var(--muted);font-size:.95rem;line-height:1.7;}
.spinner{display:inline-block;width:28px;height:28px;border:2px solid rgba(200,255,0,.2);border-top-color:var(--lime);border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── Contact ────────────────────────────────────────── */
#contact{background:var(--ink);padding:130px 0;position:relative;overflow:hidden;}
.cglow{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(200,255,0,.07),transparent 70%);right:-200px;bottom:-200px;pointer-events:none;}
.cgrid{display:grid;grid-template-columns:1fr 1.2fr;gap:6rem;align-items:start;}
.cl h2{margin-bottom:1.4rem;}
.socsw{margin-top:3rem;display:flex;flex-direction:column;}
.soc{display:flex;align-items:center;gap:1.2rem;padding:1rem 0;border-bottom:1px solid var(--bdk);color:var(--muted);transition:color .25s,padding-left .3s;}
.soc:hover{color:var(--lime);padding-left:.5rem;}
.soc:hover .sarrr{opacity:1;transform:translateX(0);}
.sic{width:34px;height:34px;border-radius:7px;background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;font-size:.95rem;flex-shrink:0;transition:background .25s;}
.soc:hover .sic{background:rgba(200,255,0,.1);}
.snml{font-family:'Unbounded',sans-serif;font-size:.7rem;font-weight:600;flex:1;}
.shdl{font-size:.72rem;color:rgba(200,255,0,.4);}
.sarrr{font-size:.9rem;opacity:0;transform:translateX(-8px);transition:opacity .25s,transform .25s;color:var(--lime);}
/* form */
.cform{display:flex;flex-direction:column;gap:1.2rem;}
.frow2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
.fg{display:flex;flex-direction:column;gap:.45rem;}
.fl{font-family:'Unbounded',sans-serif;font-size:.56rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--lime);}
.fi,.ft{background:rgba(255,255,255,.04);border:1px solid var(--bdk);color:var(--paper);padding:.95rem 1.2rem;font-family:'Plus Jakarta Sans',sans-serif;font-size:.9rem;outline:none;resize:none;border-radius:6px;transition:border-color .25s,background .25s;-webkit-appearance:none;}
.fi:focus,.ft:focus{border-color:var(--lime);background:rgba(200,255,0,.04);}
.fi::placeholder,.ft::placeholder{color:rgba(255,255,255,.15);}
.ft{min-height:140px;}
.ferr{padding:.8rem 1rem;background:rgba(255,80,80,.1);border:1px solid rgba(255,80,80,.3);border-radius:6px;font-size:.84rem;color:#ff8888;display:none;}
.fsub{display:flex;align-items:center;justify-content:center;gap:.7rem;width:100%;padding:1.1rem;border-radius:100px;background:var(--lime);font-family:'Unbounded',sans-serif;font-size:.63rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);transition:transform .3s,box-shadow .3s;}
.fsub:hover{transform:translateY(-3px);box-shadow:0 16px 50px rgba(200,255,0,.3);}
.fsub:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none;}
.fsucc{padding:3rem 2rem;text-align:center;border:1px solid rgba(200,255,0,.2);border-radius:6px;background:rgba(200,255,0,.04);}
.fsucc[hidden]{display:none;}
.fsi{font-size:2.2rem;margin-bottom:.8rem;}
.fst{font-family:'DM Serif Display',serif;font-style:italic;font-size:1.3rem;color:var(--lime);}
.fss{font-size:.84rem;color:var(--muted);margin-top:.5rem;}

/* ── Single portfolio ───────────────────────────────── */
.port-hero{width:100%;max-height:none;overflow:hidden;background:var(--ink);}
.port-video-wrap{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;}
.port-video-wrap iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;display:block;}
.port-feat-img{width:100%;max-height:none;}
.port-feat-img img{width:100%;height:auto;max-height:85vh;object-fit:cover;display:block;}
.back-link{font-family:'Unbounded',sans-serif;font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);transition:color .25s;display:inline-flex;align-items:center;gap:.5rem;}
.back-link:hover{color:var(--lime);}

/* ── Footer ─────────────────────────────────────────── */
#za-footer{background:var(--ink2);border-top:1px solid var(--bdk);padding:2rem 0;}
.fi2{max-width:1280px;margin:0 auto;padding:0 5vw;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;}
.flog{font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:900;color:var(--paper);}
.fcp{font-size:.7rem;color:rgba(255,255,255,.2);letter-spacing:.06em;}
.btt{font-family:'Unbounded',sans-serif;font-size:.58rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.22);transition:color .25s;}
.btt:hover{color:var(--lime);}

/* ── Scroll reveal ──────────────────────────────────── */
.rv{opacity:0;transform:translateY(38px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.rv.in{opacity:1;transform:none;}
.d1{transition-delay:.1s;}.d2{transition-delay:.2s;}.d3{transition-delay:.3s;}.d4{transition-delay:.4s;}.d5{transition-delay:.5s;}

/* ── Responsive ─────────────────────────────────────── */
@media(max-width:1100px){.pgrid{grid-template-columns:repeat(2,1fr)!important;}}
@media(max-width:900px){.agrid{grid-template-columns:1fr;gap:3rem;}.cgrid{grid-template-columns:1fr;gap:3.5rem;}.sds{display:none;}}
@media(max-width:768px){body{cursor:auto;}#cur-blob{display:none;}.nlinks,.ncta{display:none;}.ham{display:flex;}.scue{display:none;}.frow2{grid-template-columns:1fr;}}
@media(max-width:480px){.pgrid{grid-template-columns:1fr!important;}.hhl{font-size:42px!important;}}

/* ── Voices (Testimonials) ──────────────────────────────────── */
#voices{background:var(--ink2);padding:120px 0 100px;position:relative;overflow:hidden;}

/* Heading */
.v-head{margin-bottom:4rem;}
.v-title{font-family:'Unbounded',sans-serif;font-size:clamp(2rem,4.5vw,3.5rem);font-weight:900;line-height:1.1;letter-spacing:-.04em;color:var(--paper);margin-top:.8rem;}
.v-lime{color:var(--lime);}

/* Carousel wrapper */
.v-carousel-wrap{position:relative;}
.v-track{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}

/* Card */
.v-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:2.2rem 2.2rem 2rem;position:relative;display:flex;flex-direction:column;gap:1.4rem;transition:background .3s,border-color .3s,transform .4s var(--ease);}
.v-card:hover{background:rgba(255,255,255,.065);border-color:rgba(200,255,0,.18);transform:translateY(-4px);}
.v-qmark{font-family:'DM Serif Display',serif;font-size:2.6rem;line-height:1;color:rgba(200,255,0,.25);position:absolute;top:1.4rem;left:1.8rem;user-select:none;}

/* Author row */
.v-author-row{display:flex;align-items:center;gap:1rem;padding-top:.6rem;}
.v-avatar{width:64px;height:64px;border-radius:50%;background:#111;border:2px solid rgba(255,255,255,.08);overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.v-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.v-init{font-family:'Unbounded',sans-serif;font-size:1.3rem;font-weight:900;color:rgba(255,255,255,.2);}
.v-author-info{display:flex;flex-direction:column;gap:.25rem;}
.v-name{font-family:'Unbounded',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.04em;color:var(--paper);line-height:1.3;}
.v-sub{font-size:.76rem;color:var(--muted);line-height:1.4;}

/* Quote text */
.v-quote{font-family:'Plus Jakarta Sans',sans-serif;font-style:italic;font-size:.95rem;color:rgba(240,237,230,.65);line-height:1.8;quotes:none;flex:1;}

/* Stars */
.v-stars{display:flex;gap:2px;}
.vs-on{color:var(--lime);font-size:.75rem;}
.vs-off{color:rgba(255,255,255,.12);font-size:.75rem;}

/* Dots nav */
.v-dots{display:flex;align-items:center;gap:8px;margin-top:2.5rem;}
.v-dot{width:8px;height:8px;border-radius:100px;background:rgba(255,255,255,.18);border:none;cursor:pointer;padding:0;transition:width .3s var(--ease),background .3s;}
.v-dot.active{width:28px;background:var(--lime);}
.v-dot:hover:not(.active){background:rgba(255,255,255,.35);}

/* Empty state */
.v-empty{text-align:center;color:var(--muted);padding:3rem;font-size:.9rem;line-height:1.8;}
.v-empty strong{color:var(--paper);}

/* ── Blog (Journal) ─────────────────────────────────────────── */
#blog-hero{padding:calc(var(--nav-h) + 80px) 0 70px;background:var(--ink);position:relative;overflow:hidden;}
#blog-hero::before{content:'BLOG';position:absolute;right:-2rem;top:50%;transform:translateY(-50%);font-family:'Unbounded',sans-serif;font-size:18vw;font-weight:900;color:rgba(200,255,0,.03);letter-spacing:-.06em;pointer-events:none;white-space:nowrap;}
#blog-main{background:var(--paper);color:var(--ink);padding:80px 0 120px;}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.bcard{background:var(--ink);border-radius:8px;overflow:hidden;transition:transform .4s var(--ease),box-shadow .4s var(--ease);}
.bcard:hover{transform:translateY(-5px);box-shadow:0 20px 55px rgba(0,0,0,.15);}
.bcard a{display:block;color:inherit;}
.bthumb{aspect-ratio:16/9;overflow:hidden;background:var(--ink3);}
.bthumb img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease);}
.bcard:hover .bthumb img{transform:scale(1.06);}
.bthumb-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0d0d00,#1a1a00);}
.bthumb-ph span{font-size:2.5rem;opacity:.15;}
.binfo{padding:1.4rem 1.6rem 1.6rem;}
.bmeta{display:flex;align-items:center;gap:.8rem;margin-bottom:.7rem;}
.bcat{font-family:'Unbounded',sans-serif;font-size:.52rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lime);}
.bdate{font-family:'Unbounded',sans-serif;font-size:.5rem;color:rgba(255,255,255,.2);letter-spacing:.08em;}
.btitle{font-family:'Unbounded',sans-serif;font-size:15px;font-weight:700;letter-spacing:-.02em;color:var(--paper);line-height:1.35;margin-bottom:.6rem;}
.bexcerpt{font-size:.82rem;color:var(--muted);line-height:1.7;}
.bread{display:inline-block;margin-top:.9rem;font-family:'Unbounded',sans-serif;font-size:.54rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(200,255,0,.4);transition:color .3s;}
.bcard:hover .bread{color:var(--lime);}
.blog-empty{grid-column:1/-1;text-align:center;padding:5rem 2rem;color:var(--muted);}
.blog-empty strong{color:var(--paper);}
/* Single post */
#post-hero{background:var(--ink);padding:calc(var(--nav-h) + 60px) 0 50px;}
#post-body{background:var(--paper);color:var(--ink);padding:70px 0 110px;}
.post-wrap{max-width:780px;margin:0 auto;}
.post-content{font-size:1.05rem;line-height:1.85;color:#3a3530;}
.post-content h2,.post-content h3{font-family:'Unbounded',sans-serif;font-weight:900;letter-spacing:-.03em;color:var(--ink);margin:2.5rem 0 1rem;}
.post-content h2{font-size:2rem;}
.post-content h3{font-size:1.4rem;}
.post-content p{margin-bottom:1.4rem;}
.post-content a{color:var(--lime-dim);border-bottom:1px solid;transition:color .2s;}
.post-content img{border-radius:8px;margin:2rem 0;}
.post-content blockquote{border-left:3px solid var(--lime);padding:1rem 1.5rem;margin:2rem 0;font-style:italic;color:#666;}

/* ── Responsive additions ───────────────────────────────────── */
@media(max-width:1100px){.v-track{grid-template-columns:repeat(2,1fr)!important;}.blog-grid{grid-template-columns:repeat(2,1fr)!important;}}
@media(max-width:900px){.vfeat{padding:2.5rem 2rem;}.vfq-mark{font-size:6rem;}}
@media(max-width:768px){.v-track{grid-template-columns:1fr!important;}.blog-grid{grid-template-columns:1fr!important;}}

/* ── Blog pagination ────────────────────────────────────────── */
.nav-links{display:flex;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;}
.nav-links .page-numbers{font-family:'Unbounded',sans-serif;font-size:.58rem;font-weight:700;letter-spacing:.1em;padding:.6rem 1.1rem;border:1.5px solid var(--blt);border-radius:100px;color:var(--muted);transition:all .25s;}
.nav-links .page-numbers:hover{border-color:var(--ink);color:var(--ink);}
.nav-links .page-numbers.current{background:var(--ink);border-color:var(--ink);color:var(--lime);}
.nav-links .prev,.nav-links .next{color:var(--ink);border-color:var(--blt);}

/* ── Sub-category filter ────────────────────────────────────── */
.subfrow{display:flex;flex-wrap:wrap;gap:.4rem;padding:.9rem 0 1.5rem;border-bottom:1px solid var(--blt);margin-bottom:1.8rem;animation:sfin .3s var(--ease);}
@keyframes sfin{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:none;}}
.sfb{font-family:'Unbounded',sans-serif;font-size:.52rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.42rem 1rem;border-radius:100px;border:1.5px solid var(--blt);color:var(--muted);background:transparent;transition:all .22s;cursor:pointer;}
.sfb:hover{border-color:var(--blt);color:var(--ink);}
.sfb.active{background:var(--lime);border-color:var(--lime);color:var(--ink);}

/* ── All Work slider ────────────────────────────────────────── */
.aw-wrap{position:relative;}
.aw-overflow{overflow:hidden;}
.aw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;transition:transform .55s var(--ease);will-change:transform;}
.aw-dots{display:flex;align-items:center;gap:8px;padding-top:2.2rem;}
.aw-dot{width:8px;height:8px;border-radius:100px;background:rgba(10,10,10,.18);border:none;cursor:pointer;padding:0;transition:width .32s var(--ease),background .25s;}
.aw-dot.active{width:28px;background:var(--ink);}
.aw-dot:hover:not(.active){background:rgba(10,10,10,.35);}

/* ── Lightbox ───────────────────────────────────────────────── */
.za-lb{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:2rem;}
.za-lb[hidden]{display:none;}
.za-lb-bg{position:absolute;inset:0;background:rgba(5,5,5,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.za-lb-inner{position:relative;z-index:2;max-width:1100px;width:100%;display:flex;flex-direction:column;align-items:center;gap:1.2rem;}
.za-lb-img{max-height:80vh;max-width:100%;object-fit:contain;border-radius:6px;display:block;animation:lbin .35s var(--ease);}
@keyframes lbin{from{opacity:0;transform:scale(.95);}to{opacity:1;transform:scale(1);}}
.za-lb-caption{text-align:center;}
.za-lb-title{font-family:'Unbounded',sans-serif;font-size:.8rem;font-weight:700;color:var(--paper);letter-spacing:.04em;}
.za-lb-meta{font-size:.75rem;color:var(--muted);margin-top:.3rem;}
.za-lb-close{position:fixed;top:1.5rem;right:2rem;z-index:3;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:var(--paper);font-size:1.4rem;cursor:pointer;transition:background .25s,color .25s;display:flex;align-items:center;justify-content:center;}
.za-lb-close:hover{background:var(--lime);color:var(--ink);}
.za-lb-prev,.za-lb-next{position:fixed;top:50%;transform:translateY(-50%);z-index:3;width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:var(--paper);font-size:1.2rem;cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;}
.za-lb-prev{left:1.5rem;}.za-lb-next{right:1.5rem;}
.za-lb-prev:hover,.za-lb-next:hover{background:var(--lime);color:var(--ink);border-color:var(--lime);}

/* ── Testimonial popup ──────────────────────────────────────── */
.za-popup{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:1.5rem;}
.za-popup[hidden]{display:none;}
.za-popup-bg{position:absolute;inset:0;background:rgba(5,5,5,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);}
.za-popup-box{position:relative;z-index:2;background:rgba(20,20,20,.98);border:1px solid rgba(200,255,0,.18);border-radius:18px;padding:3.5rem 4rem;max-width:700px;width:100%;animation:lbin .35s var(--ease);}
.za-popup-close{position:absolute;top:1.2rem;right:1.4rem;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--muted);font-size:1.2rem;cursor:pointer;transition:all .25s;display:flex;align-items:center;justify-content:center;}
.za-popup-close:hover{background:var(--lime);color:var(--ink);border-color:var(--lime);}
.za-popup-qmark{font-family:'DM Serif Display',serif;font-size:5rem;line-height:.7;color:rgba(200,255,0,.25);margin-bottom:.5rem;user-select:none;}
.za-popup-quote{font-family:'DM Serif Display',serif;font-style:italic;font-size:clamp(1.1rem,2vw,1.4rem);color:var(--paper);line-height:1.72;quotes:none;margin-bottom:2rem;}
.za-popup-author{display:flex;align-items:center;gap:1.1rem;padding:1.5rem 0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:1.2rem;}
.za-popup-avatar{width:58px;height:58px;border-radius:50%;background:#111;border:2px solid rgba(200,255,0,.2);overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:'Unbounded',sans-serif;font-size:1.3rem;font-weight:900;color:rgba(255,255,255,.15);}
.za-popup-avatar img{width:100%;height:100%;object-fit:cover;}
.za-popup-name{font-family:'Unbounded',sans-serif;font-size:.72rem;font-weight:700;color:var(--paper);}
.za-popup-sub{font-size:.76rem;color:var(--muted);margin-top:.2rem;}
.za-popup-stars{color:var(--lime);font-size:.9rem;letter-spacing:.1em;}

/* ── VR popup ───────────────────────────────────────────────── */
.za-vr-popup{}
.za-vr-box{position:relative;z-index:2;background:#0a0a0a;border:1px solid rgba(200,255,0,.15);border-radius:14px;width:min(92vw,1100px);animation:lbin .35s var(--ease);overflow:hidden;}
.za-vr-top{display:flex;align-items:center;justify-content:space-between;padding:1.2rem 1.8rem;border-bottom:1px solid rgba(255,255,255,.07);}
.za-vr-title{font-family:'Unbounded',sans-serif;font-size:.75rem;font-weight:700;color:var(--paper);}
.za-vr-ext{font-family:'Unbounded',sans-serif;font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--lime);border:1px solid rgba(200,255,0,.3);padding:.38rem .9rem;border-radius:100px;transition:background .25s,color .25s;}
.za-vr-ext:hover{background:var(--lime);color:var(--ink);}
.za-vr-close{position:absolute;top:1rem;right:1rem;z-index:5;}
.za-vr-frame-wrap{position:relative;width:100%;padding-bottom:56.25%;height:0;overflow:hidden;}
.za-vr-frame{position:absolute;inset:0;width:100%;height:100%;border:none;}

/* ── Portfolio card — pi-inner cursor fix ───────────────────── */
.pi{cursor:default;}
.pi-inner{display:flex;flex-direction:column;height:100%;}

/* ── Responsive additions ───────────────────────────────────── */
@media(max-width:900px){.za-popup-box{padding:2.5rem 2rem;}.za-lb-prev,.za-lb-next{display:none;}}
@media(max-width:768px){.aw-grid{grid-template-columns:repeat(3,1fr)!important;}.za-vr-box{width:96vw;}}



/* ZA-CUSTOM-VOICES */
/* === Carousel track: flex row, equal-height cards === */
#voices .v-carousel-wrap { overflow: hidden !important; }
#voices #vTrack {
  display: flex !important;
  flex-wrap: nowrap !important;
  grid-template-columns: unset !important;
  align-items: stretch !important;
  gap: 0 !important;
  transition: transform 0.55s cubic-bezier(.16,1,.3,1);
}
#voices .v-card {
  flex: 0 0 calc(33.333% - 16px) !important;
  min-width: calc(33.333% - 16px) !important;
  margin: 0 8px !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
  height: auto !important;
}
#voices .v-card .v-quote {
  flex: 1 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 7 !important;
  -webkit-box-orient: vertical !important;
}
#voices .v-card .v-stars {
  margin-top: auto !important;
  padding-top: 1rem !important;
}
#voices .v-dots { display: flex !important; justify-content: center; gap: 8px; margin-top: 32px; }
#voices .v-dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.25); cursor: pointer; transition: background .3s; }
#voices .v-dot.act { background: #c6f135; }

/* === Popup font consistency fix === */
#za-tpopup .za-popup-quote {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-style: italic !important;
  font-size: clamp(1rem, 1.8vw, 1.2rem) !important;
  line-height: 1.82 !important;
  color: rgba(255,255,255,.88) !important;
}
#za-tpopup .za-popup-name {
  font-family: 'Unbounded', sans-serif !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  letter-spacing: .03em !important;
  color: #fff !important;
}
#za-tpopup .za-popup-sub {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  font-size: .8rem !important;
  color: rgba(255,255,255,.5) !important;
}
