:root{
  --background:240 9% 4%;
  --foreground:240 9% 92%;
  --muted:240 5% 58%;
  --primary:240 6% 86%;
  --secondary:240 5% 52%;
  --card:240 8% 9%;
  --border:240 7% 18%;
  --success:142 50% 50%;
  --ink:240 12% 2%;
  --ease:cubic-bezier(0.22,1,0.36,1);
  --maxw:1220px;
}

/* ===== Base ===== */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body.xivoz{
  margin:0;
  background:hsl(var(--background));
  color:hsl(var(--foreground));
  font-family:"Inter",system-ui,-apple-system,Segoe UI,sans-serif;
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
body.xivoz h1,body.xivoz h2,body.xivoz h3,body.xivoz h4,body.xivoz .font-display{
  font-family:"Outfit","Inter",system-ui,sans-serif;
  font-weight:700;
  letter-spacing:-0.02em;
  margin:0;
}
body.xivoz a{color:inherit;text-decoration:none}
body.xivoz img{max-width:100%;display:block}
body.xivoz p{margin:0}
.xz-container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 24px}
.xz-accent{
  background:linear-gradient(to left,#6366f1,#a855f7,#fcd34d);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.xz-eyebrow{
  font-family:"Geist",sans-serif;font-weight:500;letter-spacing:.18em;text-transform:uppercase;
  font-size:12px;color:hsl(var(--primary));margin-bottom:18px;display:inline-block;
}
.xz-section{position:relative;padding:120px 0}
.xz-section-head{max-width:680px;margin:0 auto 64px;text-align:center}
.xz-section-head h2{font-size:clamp(34px,5vw,58px);line-height:1.05;margin-bottom:18px}
.xz-section-head p{color:hsl(var(--muted));font-size:18px;opacity:.85}

/* ===== Liquid glass ===== */
.liquid-glass{
  background:rgba(255,255,255,0.01);
  background-blend-mode:luminosity;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  border:none;
  box-shadow:inset 0 1px 1px rgba(255,255,255,0.1);
  position:relative;overflow:hidden;
}
.liquid-glass::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px;
  background:linear-gradient(180deg,rgba(255,255,255,0.45) 0%,rgba(255,255,255,0.15) 20%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(255,255,255,0.15) 80%,rgba(255,255,255,0.45) 100%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;
}

/* ===== Buttons ===== */
.xz-btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:"Geist",sans-serif;font-weight:600;font-size:15px;
  padding:14px 28px;border-radius:999px;cursor:pointer;color:hsl(var(--foreground));
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease);
  border:none;will-change:transform;
}
.xz-btn.is-primary{
  background:linear-gradient(135deg,hsl(var(--primary)),#a855f7);
  box-shadow:0 8px 30px -8px hsl(var(--primary)/.6);
}
.xz-btn.is-primary:hover{box-shadow:0 14px 40px -8px hsl(var(--primary)/.8);transform:translateY(-2px)}
.xz-btn.is-ghost{color:hsl(var(--foreground))}
.xz-btn.is-ghost::before{border-radius:999px}
.xz-btn.is-ghost:hover{transform:translateY(-2px)}
.xz-btn svg{width:16px;height:16px}

/* ===== Navbar ===== */
.xz-nav-wrap{position:sticky;top:0;z-index:60;width:100%}
.xz-nav{display:flex;justify-content:space-between;align-items:center;padding:20px 32px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:hsl(var(--background)/.35)}
.xz-logo{display:flex;align-items:center;gap:10px;font-family:"General Sans",sans-serif;font-weight:600;font-size:22px;height:32px}
.xz-logo .dot{width:22px;height:22px;border-radius:7px;background:linear-gradient(135deg,hsl(var(--primary)),hsl(var(--secondary)))}
.xz-navlinks{display:flex;gap:36px;align-items:center}
.xz-navlinks a{color:hsl(var(--foreground)/.9);font-size:15px;position:relative;transition:color .3s var(--ease)}
.xz-navlinks a::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:0;background:hsl(var(--primary));transition:width .3s var(--ease)}
.xz-navlinks a:hover{color:hsl(var(--foreground))}
.xz-navlinks a:hover::after,.xz-navlinks a.active::after{width:100%}
.xz-nav .xz-btn{padding:11px 22px;font-size:14px}
.xz-nav-divider{height:1px;margin-top:3px;background:linear-gradient(to right,transparent,hsl(var(--foreground)/.2),transparent)}
.xz-burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.xz-burger span{width:24px;height:2px;background:hsl(var(--foreground));border-radius:2px;transition:.3s var(--ease)}

/* ===== Hero ===== */
.xz-hero{position:relative;min-height:100vh;display:flex;flex-direction:column;overflow:hidden}
.xz-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;z-index:0}
.xz-hero-fallback{position:absolute;inset:0;z-index:0;background:radial-gradient(120% 90% at 50% 0%,hsl(262 83% 12%) 0%,hsl(var(--background)) 60%)}
.xz-hero-inner{position:relative;z-index:10;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:80px 24px 40px;overflow:visible}
.xz-blur-shape{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:984px;height:527px;max-width:95vw;opacity:.9;background:#030712;filter:blur(82px);pointer-events:none;z-index:1}
.xz-hero-content{position:relative;z-index:10;max-width:1100px}
.xz-hero h1{font-family:"General Sans",sans-serif;font-weight:400;font-size:clamp(58px,12.5vw,170px);line-height:1.02;letter-spacing:-0.03em}
.xz-hero h1 span{display:block}
.xz-hero-sub{font-size:clamp(16px,1.3vw,19px);line-height:1.7;max-width:640px;margin:24px auto 0;opacity:.8;color:hsl(var(--muted))}
.xz-hero-cta{display:flex;gap:24px;justify-content:center;margin-top:40px;flex-wrap:wrap}

/* Trusted by */
.xz-trusted{position:relative;z-index:10;max-width:1152px;margin:0 auto;width:100%;padding:0 24px 48px;display:flex;align-items:center;gap:40px}
.xz-trusted-label{color:hsl(var(--foreground)/.5);font-size:14px;flex-shrink:0;max-width:180px}
.xz-marquee{position:relative;overflow:hidden;flex:1;-webkit-mask:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);mask:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent)}
.xz-marquee-track{display:flex;gap:56px;width:max-content;animation:xz-marquee 20s linear infinite}
.xz-marquee:hover .xz-marquee-track{animation-play-state:paused}
.xz-marquee-item{color:hsl(var(--foreground)/.55);font-family:"General Sans",sans-serif;font-weight:600;font-size:20px;white-space:nowrap;letter-spacing:.02em}
@keyframes xz-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ===== Cards grid (services) ===== */
.xz-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.xz-card{border-radius:20px;padding:34px;background:hsl(var(--card)/.6);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.xz-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px -25px hsl(var(--primary)/.45)}
.xz-card-icon{width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:22px;background:linear-gradient(135deg,hsl(var(--primary)/.25),hsl(var(--secondary)/.15));transition:transform .45s var(--ease)}
.xz-card:hover .xz-card-icon{transform:translateY(-3px) scale(1.06)}
.xz-card-icon svg{width:26px;height:26px;stroke:hsl(var(--foreground))}
.xz-card h3{font-size:21px;margin-bottom:10px}
.xz-card p{color:hsl(var(--muted));font-size:15px;opacity:.85}

/* ===== Portfolio ===== */
.xz-portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.xz-pcard{border-radius:20px;overflow:hidden;background:hsl(var(--card));position:relative;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.xz-pcard:hover{transform:scale(1.04);box-shadow:0 40px 70px -30px rgba(0,0,0,.8);z-index:2}
.xz-pcard-img{aspect-ratio:4/3;position:relative;overflow:hidden}
.xz-pcard-img>div{position:absolute;inset:0;transition:transform .6s var(--ease)}
.xz-pcard:hover .xz-pcard-img>div{transform:scale(1.08)}
.xz-pcard-body{padding:24px}
.xz-pcard-ind{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:hsl(var(--primary));font-weight:600}
.xz-pcard-body h3{font-size:20px;margin:8px 0 8px}
.xz-pcard-body p{color:hsl(var(--muted));font-size:14px;opacity:.8;margin-bottom:16px}
.xz-metric{display:inline-flex;align-items:center;gap:8px;font-family:"General Sans",sans-serif;font-weight:600;font-size:18px}
.xz-metric .xz-accent{font-size:22px}

/* ===== Process ===== */
.xz-process{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;position:relative}
.xz-step{padding:32px 28px;border-radius:20px;background:hsl(var(--card)/.5);position:relative}
.xz-step-num{font-family:"General Sans",sans-serif;font-weight:600;font-size:48px;line-height:1;margin-bottom:18px;background:linear-gradient(135deg,hsl(var(--primary)),hsl(var(--secondary)));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.xz-step h3{font-size:20px;margin-bottom:10px}
.xz-step p{color:hsl(var(--muted));font-size:15px;opacity:.85}

/* ===== Testimonials ===== */
.xz-tslider{overflow:hidden;-webkit-mask:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
.xz-ttrack{display:flex;gap:24px;width:max-content;animation:xz-marquee 46s linear infinite}
.xz-tslider:hover .xz-ttrack{animation-play-state:paused}
.xz-tcard{width:420px;max-width:88vw;border-radius:20px;padding:32px;background:hsl(var(--card)/.6);flex-shrink:0}
.xz-tcard p.quote{font-size:17px;line-height:1.6;margin-bottom:24px}
.xz-tperson{display:flex;align-items:center;gap:14px}
.xz-tavatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,hsl(var(--primary)),hsl(var(--secondary)));flex-shrink:0;display:flex;align-items:center;justify-content:center;font-family:"General Sans",sans-serif;font-weight:600;color:#fff}
.xz-tperson b{display:block;font-size:15px}
.xz-tperson span{font-size:13px;color:hsl(var(--muted));opacity:.8}

/* ===== Final CTA ===== */
.xz-finalcta{text-align:center;border-radius:32px;padding:80px 40px;position:relative;overflow:hidden;background:radial-gradient(120% 140% at 50% 0%,hsl(262 60% 14%),hsl(var(--card)))}
.xz-finalcta h2{font-size:clamp(34px,5vw,60px);line-height:1.05;margin-bottom:18px}
.xz-finalcta p{color:hsl(var(--muted));font-size:18px;max-width:560px;margin:0 auto 36px;opacity:.9}
.xz-finalcta .xz-hero-cta{margin-top:0}

/* ===== Contact ===== */
.xz-contact-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:48px;align-items:start}
.xz-contact-info h2{font-size:clamp(30px,4vw,46px);margin-bottom:20px;line-height:1.05}
.xz-contact-info .lead{color:hsl(var(--muted));margin-bottom:32px;opacity:.9}
.xz-cinfo-row{display:flex;gap:14px;align-items:flex-start;margin-bottom:22px}
.xz-cinfo-row .ic{width:42px;height:42px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:hsl(var(--primary)/.15)}
.xz-cinfo-row .ic svg{width:20px;height:20px;stroke:hsl(var(--primary))}
.xz-cinfo-row b{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:hsl(var(--foreground)/.55);font-weight:600;display:block;margin-bottom:3px}
.xz-cinfo-row span{color:hsl(var(--foreground))}
.xz-socials{display:flex;gap:12px;margin-top:8px}
.xz-socials a{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;transition:transform .3s var(--ease)}
.xz-socials a:hover{transform:translateY(-3px)}
.xz-socials svg{width:18px;height:18px;fill:hsl(var(--foreground))}
.xz-form{border-radius:24px;padding:36px}
.xz-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.xz-field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.xz-field.full{grid-column:1/-1}
.xz-field label{font-size:13px;color:hsl(var(--foreground)/.7);font-weight:500}
.xz-field input,.xz-field select,.xz-field textarea{
  background:hsl(var(--background)/.6);border:1px solid hsl(var(--border));border-radius:12px;
  padding:13px 15px;color:hsl(var(--foreground));font-family:inherit;font-size:15px;outline:none;
  transition:border-color .3s var(--ease),box-shadow .3s var(--ease);
}
.xz-field input:focus,.xz-field select:focus,.xz-field textarea:focus{border-color:hsl(var(--primary));box-shadow:0 0 0 3px hsl(var(--primary)/.18)}
.xz-field textarea{resize:vertical;min-height:120px}
.xz-field select{appearance:none}
.xz-form .xz-btn{width:100%;justify-content:center;margin-top:6px}
.xz-form-success{display:none;text-align:center;padding:40px 10px}
.xz-form-success.show{display:block}
.xz-form-success .ck{width:64px;height:64px;border-radius:50%;background:hsl(var(--success)/.15);display:flex;align-items:center;justify-content:center;margin:0 auto 20px}
.xz-form-success .ck svg{width:30px;height:30px;stroke:hsl(var(--success))}
.xz-form-success h3{font-size:24px;margin-bottom:10px}
.xz-form-success p{color:hsl(var(--muted))}

/* ===== Footer ===== */
.xz-footer{padding:80px 0 32px;background:hsl(var(--card)/.4);margin-top:40px}
.xz-footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;margin-bottom:56px}
.xz-footer-col h4{font-size:14px;text-transform:uppercase;letter-spacing:.12em;color:hsl(var(--foreground)/.55);margin-bottom:20px;font-weight:600}
.xz-footer-col .xz-logo{margin-bottom:18px}
.xz-footer-col p{color:hsl(var(--muted));font-size:15px;opacity:.85;max-width:300px}
.xz-footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.xz-footer-col ul a{color:hsl(var(--muted));font-size:15px;transition:color .3s var(--ease)}
.xz-footer-col ul a:hover{color:hsl(var(--foreground))}
.xz-footer-bottom{border-top:1px solid transparent;border-image:linear-gradient(to right,transparent,hsl(var(--foreground)/.2),transparent) 1;padding-top:28px;text-align:center;color:hsl(var(--foreground)/.5);font-size:14px}

/* ===== Reveal motion ===== */
.xz-reveal{opacity:0;transform:translateY(100%);transition:opacity .5s,transform .5s}
.xz-reveal.in{opacity:1;transform:translateY(0)}
.xz-reveal[data-d="1"]{transition-delay:.08s}
.xz-reveal[data-d="2"]{transition-delay:.16s}
.xz-reveal[data-d="3"]{transition-delay:.24s}
.xz-reveal[data-d="4"]{transition-delay:.32s}
.xz-reveal[data-d="5"]{transition-delay:.40s}

/* ===== Page hero (inner pages) ===== */
.xz-pagehero{position:relative;padding:160px 0 90px;text-align:center;overflow:hidden}
.xz-pagehero::after{content:"";position:absolute;top:-30%;left:50%;transform:translateX(-50%);width:900px;height:500px;max-width:95vw;background:hsl(var(--primary)/.18);filter:blur(120px);pointer-events:none;z-index:0}
.xz-pagehero>*{position:relative;z-index:1}
.xz-pagehero h1{font-size:clamp(46px,8vw,96px);line-height:1.02;letter-spacing:-0.03em;font-weight:400}
.xz-pagehero p{color:hsl(var(--muted));font-size:19px;max-width:620px;margin:22px auto 0;opacity:.85}

/* ===== Responsive ===== */
@media(max-width:1024px){
  .xz-grid-3,.xz-portfolio-grid{grid-template-columns:repeat(2,1fr)}
  .xz-process{grid-template-columns:repeat(2,1fr)}
  .xz-contact-grid{grid-template-columns:1fr;gap:40px}
  .xz-footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .xz-navlinks{display:none}
  .xz-nav .xz-btn{display:none}
  .xz-burger{display:flex}
  .xz-section{padding:80px 0}
  .xz-grid-3,.xz-portfolio-grid,.xz-process{grid-template-columns:1fr}
  .xz-trusted{flex-direction:column;align-items:flex-start;gap:18px}
  .xz-form-grid{grid-template-columns:1fr}
  .xz-footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .xz-mobile-menu.open{display:flex}
}
@media(max-width:560px){
  .xz-footer-grid{grid-template-columns:1fr}
  .xz-hero-cta .xz-btn{width:100%;justify-content:center}
}

/* ===== Inner-page building blocks ===== */
.xz-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.xz-chip{font-size:13px;padding:7px 14px;border-radius:999px;background:hsl(var(--primary)/.12);color:hsl(var(--foreground)/.85);border:1px solid hsl(var(--border))}
.xz-cols-2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.xz-srow{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:48px;border-radius:24px;background:hsl(var(--card));border:1px solid hsl(var(--border));overflow:hidden;position:sticky;top:96px;margin-bottom:0}
/* UI/UX media: show full image, centered, no crop */
.xz-srow-media{background-size:contain;background-position:center;background-repeat:no-repeat}
.xz-srow:nth-child(even) .xz-srow-media{order:-1}
.xz-srow-media{border-radius:24px;aspect-ratio:5/4;background:linear-gradient(135deg,hsl(var(--card)),hsl(262 40% 12%));position:relative;overflow:hidden}
.xz-srow-media .glow{position:absolute;inset:0;background:radial-gradient(60% 60% at 30% 20%,hsl(var(--primary)/.4),transparent 70%)}
.xz-srow h3{font-size:clamp(26px,3vw,38px);margin-bottom:14px}
.xz-srow p{color:hsl(var(--muted));opacity:.9;margin-bottom:18px}
.xz-blist{list-style:none;padding:0;margin:0 0 18px;display:flex;flex-direction:column;gap:10px}
.xz-blist li{display:flex;gap:10px;align-items:flex-start;color:hsl(var(--foreground)/.9);font-size:15px}
.xz-blist li::before{content:'';width:18px;height:18px;border-radius:50%;flex-shrink:0;margin-top:2px;background:hsl(var(--success)/.2);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322c55e' stroke-width='3'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E");background-size:12px;background-repeat:no-repeat;background-position:center}
.xz-filters{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-bottom:48px}
.xz-filter{font-family:'Geist',sans-serif;font-size:14px;padding:10px 20px;border-radius:999px;background:transparent;color:hsl(var(--foreground)/.7);border:1px solid hsl(var(--border));cursor:pointer;transition:all .3s var(--ease)}
.xz-filter:hover{color:hsl(var(--foreground))}
.xz-filter.active{background:hsl(var(--primary));border-color:hsl(var(--primary));color:#fff}
.xz-pcard.hide{display:none}
.xz-values{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.xz-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.xz-stat .num{font-family:'General Sans',sans-serif;font-weight:600;font-size:clamp(40px,5vw,60px);line-height:1;background:linear-gradient(135deg,hsl(var(--primary)),hsl(var(--secondary)));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.xz-stat span{color:hsl(var(--muted));font-size:15px;display:block;margin-top:8px}
.xz-team{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.xz-member{text-align:center}
.xz-member .ph{aspect-ratio:1;border-radius:20px;margin-bottom:16px;background:linear-gradient(135deg,hsl(262 40% 16%),hsl(var(--card)));position:relative;overflow:hidden}
.xz-member .ph::after{content:'';position:absolute;inset:0;background:radial-gradient(70% 70% at 50% 20%,hsl(var(--primary)/.35),transparent)}
.xz-member b{display:block;font-size:17px}
.xz-member span{color:hsl(var(--muted));font-size:14px}
.xz-faq{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.xz-faq details{border-radius:16px;padding:20px 24px;background:hsl(var(--card)/.6)}
.xz-faq summary{cursor:pointer;font-family:'General Sans',sans-serif;font-weight:600;font-size:18px;list-style:none;display:flex;justify-content:space-between;align-items:center}
.xz-faq summary::-webkit-details-marker{display:none}
.xz-faq summary::after{content:'+';font-size:24px;color:hsl(var(--primary));transition:transform .3s var(--ease)}
.xz-faq details[open] summary::after{transform:rotate(45deg)}
.xz-faq p{color:hsl(var(--muted));margin-top:14px;line-height:1.6}
.xz-map{border-radius:24px;height:340px;background:linear-gradient(135deg,hsl(var(--card)),hsl(262 40% 10%));position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;color:hsl(var(--foreground)/.5)}
.xz-map::before{content:'';position:absolute;inset:0;background-image:linear-gradient(hsl(var(--border)) 1px,transparent 1px),linear-gradient(90deg,hsl(var(--border)) 1px,transparent 1px);background-size:40px 40px;opacity:.4}
.xz-calendly{border-radius:24px;padding:48px;text-align:center;border:1px dashed hsl(var(--border))}
@media(max-width:992px){
  .xz-srow{grid-template-columns:1fr;gap:32px}
  .xz-srow:nth-child(even) .xz-srow-media{order:0}
}
@media(max-width:1024px){
  .xz-srow{gap:24px}
  .xz-values,.xz-team{grid-template-columns:repeat(2,1fr)}
  .xz-stats{grid-template-columns:repeat(2,1fr)}
  .xz-cols-2{grid-template-columns:1fr}
}
@media(max-width:560px){
  .xz-values,.xz-team,.xz-stats{grid-template-columns:1fr}
}

/* Mobile menu */
.xz-mobile-menu{display:none;position:fixed;inset:0;z-index:80;flex-direction:column;padding:28px 32px;gap:8px;background:hsl(var(--background)/.97);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.xz-mobile-menu .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}
.xz-mobile-menu a.ml{font-family:"General Sans",sans-serif;font-size:30px;padding:14px 0;border-bottom:1px solid hsl(var(--border))}
.xz-mobile-menu .xz-btn{margin-top:24px;justify-content:center}
.xz-close{background:none;border:none;color:hsl(var(--foreground));font-size:30px;cursor:pointer;line-height:1}

/* ===== Animations: text, entrance, background movement ===== */
@keyframes xz-rise{from{opacity:0;transform:translateY(30px);filter:blur(10px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes xz-fade{from{opacity:0}to{opacity:1}}
@keyframes xz-shimmer{0%{background-position:0% center}100%{background-position:-200% center}}
@keyframes xz-blur-pulse{0%,100%{opacity:.9;transform:translate(-50%,-50%) scale(1)}50%{opacity:.7;transform:translate(-50%,-50%) scale(1.1)}}
@keyframes xz-float-y{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* Accent text shimmer (site-wide) */
.xz-accent{background-size:200% auto;animation:xz-shimmer 8s linear infinite}

/* Home hero entrance (masked line reveal, Floka-style) */
.xz-hero-top{display:flex;align-items:center;gap:18px;justify-content:center;flex-wrap:wrap;margin-bottom:30px;animation:xz-fade 1s var(--ease) .1s both}
.xz-status{display:inline-flex;align-items:center;gap:9px;font-size:13.5px;color:hsl(var(--foreground)/.82);padding:8px 16px;border-radius:999px;background:hsl(var(--card)/.6);border:1px solid hsl(var(--border))}
.xz-status i{width:8px;height:8px;border-radius:50%;background:hsl(var(--success));animation:xz-pulse 2.4s ease-out infinite}
.xz-hero-studio{font-size:13.5px;letter-spacing:.04em;color:hsl(var(--foreground)/.55)}
@keyframes xz-pulse{0%{box-shadow:0 0 0 0 hsl(var(--success)/.55)}70%{box-shadow:0 0 0 9px hsl(var(--success)/0)}100%{box-shadow:0 0 0 0 hsl(var(--success)/0)}}
.xz-hero h1.xz-hero-h{font-family:"General Sans",sans-serif;font-weight:500;font-size:clamp(38px,7.4vw,98px);line-height:1.05;letter-spacing:-0.03em}
.xz-hero-h .ln{display:block;overflow:hidden;padding-bottom:.05em}
.xz-hero-h .ln>span{display:block;transform:translateY(115%);animation:xz-line-up 1.05s var(--ease) both}
.xz-hero-h .ln:nth-child(1)>span{animation-delay:.18s}
.xz-hero-h .ln:nth-child(2)>span{animation-delay:.32s}
.xz-hero-h .ln:nth-child(3)>span{animation-delay:.46s}
.xz-hero-h em{font-style:normal}
@keyframes xz-line-up{from{transform:translateY(115%)}to{transform:translateY(0)}}
.xz-hero-sub{animation:xz-rise .95s var(--ease) .72s both}
.xz-hero-cta{animation:xz-rise .95s var(--ease) .86s both}
.xz-trusted{animation:xz-fade 1.1s var(--ease) 1.05s both}
.xz-nav-wrap{animation:xz-fade .8s var(--ease) both}

/* Animated background movement */
.xz-blur-shape{animation:xz-blur-pulse 9s ease-in-out infinite}
.xz-pagehero::after{animation:xz-blur-pulse 11s ease-in-out infinite}

/* Inner page hero text entrance */
.xz-pagehero h1{animation:xz-rise 1s var(--ease) .1s both}
.xz-pagehero p{animation:xz-rise 1s var(--ease) .28s both}
.xz-pagehero .xz-eyebrow{animation:xz-fade .8s var(--ease) both}

/* Will-change hints for smooth scroll parallax */
.xz-hero-video,.xz-hero-content{will-change:transform}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .xz-reveal{opacity:1!important;transform:none!important}
  .xz-bg .blob{animation:none!important}
}

/* ===== Global animated background (all pages) ===== */
html{background:hsl(var(--background))}
body.xivoz{background:transparent}
.xz-bg{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(120% 90% at 50% -10%,hsl(262 60% 9%) 0%,hsl(var(--background)) 55%)}
.xz-bg .blob{position:absolute;border-radius:50%;filter:blur(110px);will-change:transform}
.xz-bg .b1{width:620px;height:620px;background:hsl(262 83% 42%);opacity:.40;top:-12%;left:-8%;animation:xz-drift1 28s ease-in-out infinite}
.xz-bg .b2{width:540px;height:540px;background:hsl(45 96% 48%);opacity:.18;bottom:-14%;right:-6%;animation:xz-drift2 34s ease-in-out infinite}
.xz-bg .b3{width:700px;height:700px;background:hsl(280 70% 40%);opacity:.30;top:38%;left:52%;animation:xz-drift3 40s ease-in-out infinite}
.xz-bg .b4{width:460px;height:460px;background:hsl(220 80% 45%);opacity:.22;top:62%;left:-6%;animation:xz-drift2 30s ease-in-out infinite reverse}
@keyframes xz-drift1{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(140px,90px) scale(1.1)}66%{transform:translate(50px,200px) scale(1)}}
@keyframes xz-drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-150px,-100px) scale(1.12)}}
@keyframes xz-drift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-100px,-70px) scale(1.18)}}
@media(max-width:768px){.xz-bg .blob{filter:blur(80px)}}

/* ===== Services page sticky-stack scroll animation ===== */
@supports (animation-timeline: view()){
  .xz-srow:not(:last-child){
    view-timeline-name:--srow;
    view-timeline-axis:block;
    animation-name:none;
  }
}
@keyframes xz-in-n-out{0%,75%{scale:100%}100%{scale:85%}}

/* ===== Scroll-driven condensing navbar ===== */
.xz-nav{transition:padding .35s var(--ease),background .35s var(--ease),box-shadow .35s var(--ease)}
.xz-logo .dot{transition:rotate .4s var(--ease)}
@keyframes xz-nav-condense{to{padding-top:11px;padding-bottom:11px;background:hsl(var(--background)/.85);box-shadow:0 14px 36px -18px rgba(0,0,0,.75)}}
@keyframes xz-nav-screw{to{rotate:180deg}}
@supports (animation-timeline: scroll()){
  .xz-nav{animation:xz-nav-condense linear both;animation-timeline:scroll(root block);animation-range:0 200px}
  .xz-logo .dot{animation:xz-nav-screw linear both;animation-timeline:scroll(root block);animation-range:0 340px}
}
.xz-nav.is-scrolled{padding-top:11px;padding-bottom:11px;background:hsl(var(--background)/.85);box-shadow:0 14px 36px -18px rgba(0,0,0,.75)}
.xz-nav.is-scrolled .xz-logo .dot{rotate:180deg}

/* ===== Animated popup modals ===== */
body.xz-modal-open{overflow:hidden}
.xz-modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:24px}
.xz-modal.open{display:flex}
.xz-modal__backdrop{position:absolute;inset:0;background:hsl(var(--background)/.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transition:opacity .45s var(--ease)}
.xz-modal.open .xz-modal__backdrop{opacity:1}
.xz-modal__panel{position:relative;z-index:1;width:min(720px,100%);max-height:86vh;overflow:auto;border-radius:26px;padding:42px;background:hsl(var(--card));border:1px solid hsl(var(--border));box-shadow:0 50px 100px -35px rgba(0,0,0,.85);opacity:0;transform:translateY(28px) scale(.93);filter:blur(12px);transition:opacity .5s var(--ease),transform .55s var(--ease),filter .5s var(--ease)}
.xz-modal.open .xz-modal__panel{opacity:1;transform:none;filter:blur(0)}
.xz-modal__close{position:absolute;top:18px;right:20px;width:38px;height:38px;border-radius:50%;border:1px solid hsl(var(--border));background:hsl(var(--background)/.5);color:hsl(var(--foreground));font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .35s var(--ease),background .35s var(--ease)}
.xz-modal__close:hover{transform:rotate(90deg);background:hsl(var(--primary)/.2)}
.xz-modal__title{font-size:clamp(28px,4vw,40px);margin:8px 0 12px;line-height:1.05}
.xz-modal__lead{color:hsl(var(--muted));margin-bottom:26px;opacity:.9}
.xz-modal__grid{display:grid;gap:12px;margin-bottom:30px}
.xz-modal__row{display:flex;gap:14px;align-items:center;padding:16px 18px;border-radius:14px;background:hsl(var(--background)/.4);border:1px solid hsl(var(--border));opacity:0;transform:translateY(14px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.xz-modal.open .xz-modal__row{opacity:1;transform:none}
.xz-modal.open .xz-modal__row:nth-child(1){transition-delay:.16s}
.xz-modal.open .xz-modal__row:nth-child(2){transition-delay:.22s}
.xz-modal.open .xz-modal__row:nth-child(3){transition-delay:.28s}
.xz-modal.open .xz-modal__row:nth-child(4){transition-delay:.34s}
.xz-modal.open .xz-modal__row:nth-child(5){transition-delay:.40s}
.xz-modal.open .xz-modal__row:nth-child(6){transition-delay:.46s}
.xz-modal__row b{display:block;font-size:16px;font-family:'General Sans',sans-serif;font-weight:600}
.xz-modal__row span{color:hsl(var(--muted));font-size:14px}
.xz-modal__row .m{margin-left:auto;font-family:'General Sans',sans-serif;font-weight:600;font-size:16px;white-space:nowrap}
.xz-modal__panel .xz-btn{width:100%;justify-content:center}
@media(max-width:560px){.xz-modal__panel{padding:30px 22px}}

/* ===== Full-page popup overlay (iframe) ===== */
.xz-pop{position:fixed;inset:0;z-index:300;display:none;align-items:flex-start;justify-content:center;padding:clamp(16px,5vh,64px) clamp(14px,4vw,48px)}
.xz-pop.open{display:flex}
.xz-pop__backdrop{position:absolute;inset:0;background:hsl(var(--background)/.62);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);opacity:0;transition:opacity .5s var(--ease);cursor:pointer}
.xz-pop.visible .xz-pop__backdrop{opacity:1}
.xz-pop__window{position:relative;z-index:1;width:min(1140px,100%);height:min(86vh,940px);display:flex;flex-direction:column;background:hsl(var(--background));border:1px solid hsl(var(--border));border-radius:24px;overflow:hidden;box-shadow:0 60px 120px -40px rgba(0,0,0,.85);opacity:0;transform:translateY(-34px) scale(.95);filter:blur(8px);transition:opacity .5s var(--ease),transform .55s var(--ease),filter .5s var(--ease)}
.xz-pop.visible .xz-pop__window{opacity:1;transform:none;filter:blur(0)}
.xz-pop__bar{display:flex;align-items:center;justify-content:space-between;padding:13px 24px;border-bottom:1px solid hsl(var(--border));background:hsl(var(--background)/.85);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:relative;z-index:2;flex-shrink:0}
.xz-pop__brand{display:flex;align-items:center;gap:10px;font-family:'General Sans',sans-serif;font-weight:600;font-size:18px}
.xz-pop__brand .dot{width:20px;height:20px;border-radius:6px;background:linear-gradient(135deg,hsl(var(--primary)),hsl(var(--secondary)))}
.xz-pop__close{display:inline-flex;align-items:center;gap:8px;font-family:'Geist',sans-serif;font-size:14px;font-weight:600;color:hsl(var(--foreground));background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:999px;padding:9px 16px;cursor:pointer;transition:background .3s var(--ease),transform .3s var(--ease)}
.xz-pop__close:hover{background:hsl(var(--primary)/.2);transform:translateY(-1px)}
.xz-pop__stage{position:relative;flex:1;min-height:0}
.xz-pop__frame{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent}
.xz-pop__loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:none;gap:8px;z-index:1}
.xz-pop__stage.loading .xz-pop__loader{display:flex}
.xz-pop__loader span{width:11px;height:11px;border-radius:50%;background:hsl(var(--primary));animation:xz-bounce 1s var(--ease) infinite}
.xz-pop__loader span:nth-child(2){animation-delay:.15s;background:hsl(280 70% 60%)}
.xz-pop__loader span:nth-child(3){animation-delay:.3s;background:hsl(var(--secondary))}
@keyframes xz-bounce{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-10px);opacity:1}}
@media(max-width:560px){.xz-pop__close span{display:none}.xz-pop__bar{padding:11px 18px}}


/* ============================================================
   FLOKA-STYLE ADDITIONS (intro, services accordion, marquee, cursor)
   ============================================================ */

/* ----- Intro / value statement ----- */
.xz-intro{padding-top:130px;padding-bottom:70px}
.xz-intro-statement{font-family:"General Sans",sans-serif;font-weight:500;font-size:clamp(24px,3.4vw,46px);line-height:1.26;letter-spacing:-0.02em;max-width:1000px;margin-top:20px}
.xz-intro-stats{margin-top:66px}

/* ----- Services accordion list ----- */
.xz-svc-list{border-top:1px solid hsl(var(--border))}
.xz-svc-row{position:relative;display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:28px;padding:30px 10px;border-bottom:1px solid hsl(var(--border));cursor:pointer}
.xz-svc-row::before{content:'';position:absolute;left:0;top:0;height:100%;width:0;background:linear-gradient(90deg,hsl(var(--primary)/.12),transparent);transition:width .55s var(--ease);z-index:0;pointer-events:none}
.xz-svc-row:hover::before{width:100%}
.xz-svc-row>*{position:relative;z-index:1}
.xz-svc-num{font-family:"General Sans",sans-serif;font-weight:500;font-size:15px;color:hsl(var(--foreground)/.4);font-variant-numeric:tabular-nums}
.xz-svc-main h3{font-family:"General Sans",sans-serif;font-weight:500;font-size:clamp(24px,3.2vw,40px);line-height:1.1;letter-spacing:-0.02em;transition:transform .45s var(--ease),color .45s var(--ease)}
.xz-svc-row:hover .xz-svc-main h3{transform:translateX(14px);color:hsl(var(--foreground))}
.xz-svc-desc{max-height:0;overflow:hidden;opacity:0;transition:max-height .55s var(--ease),opacity .45s var(--ease),margin .45s var(--ease)}
.xz-svc-row:hover .xz-svc-desc{max-height:90px;opacity:1;margin-top:10px}
.xz-svc-desc p{color:hsl(var(--muted));font-size:15.5px;max-width:540px;transition:transform .45s var(--ease)}
.xz-svc-row:hover .xz-svc-desc p{transform:translateX(14px)}
.xz-svc-tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;max-width:280px}
.xz-svc-tags span{font-size:12.5px;padding:6px 12px;border-radius:999px;border:1px solid hsl(var(--border));color:hsl(var(--foreground)/.7);background:hsl(var(--card)/.4)}
.xz-svc-arrow{width:46px;height:46px;border-radius:50%;border:1px solid hsl(var(--border));display:flex;align-items:center;justify-content:center;color:hsl(var(--foreground)/.7);transition:transform .45s var(--ease),background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease);flex-shrink:0}
.xz-svc-arrow svg{width:20px;height:20px}
.xz-svc-row:hover .xz-svc-arrow{background:hsl(var(--primary));border-color:hsl(var(--primary));color:#fff;transform:scale(1.08)}
.xz-svc-preview{position:fixed;top:0;left:0;width:300px;height:225px;border-radius:18px;overflow:hidden;pointer-events:none;z-index:40;opacity:0;transform:translate(-50%,-50%) scale(.82);transition:opacity .4s var(--ease),transform .4s var(--ease);box-shadow:0 30px 60px -25px rgba(0,0,0,.7)}
.xz-svc-preview.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.xz-svc-preview .im{position:absolute;inset:0;opacity:0;transition:opacity .35s var(--ease);background-size:cover;background-position:center}
.xz-svc-preview .im.on{opacity:1}
@media(max-width:900px){
  .xz-svc-row{grid-template-columns:auto 1fr;gap:6px 16px;padding:24px 4px}
  .xz-svc-tags{grid-column:2;justify-content:flex-start;margin-top:12px}
  .xz-svc-arrow{display:none}
  .xz-svc-desc{max-height:none;opacity:1;margin-top:10px}
  .xz-svc-row:hover .xz-svc-main h3,.xz-svc-row:hover .xz-svc-desc p{transform:none}
  .xz-svc-preview{display:none}
}

/* ----- Oversized marquee band ----- */
.xz-bigmarquee{overflow:hidden;padding:34px 0;border-top:1px solid hsl(var(--border));border-bottom:1px solid hsl(var(--border));-webkit-mask:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent)}
.xz-bm-track{display:flex;align-items:center;gap:44px;width:max-content;animation:xz-marquee 30s linear infinite}
.xz-bm-track span{font-family:"General Sans",sans-serif;font-weight:600;font-size:clamp(40px,8vw,116px);line-height:1;letter-spacing:-0.02em;white-space:nowrap;color:hsl(var(--foreground))}
.xz-bm-track span.o{color:transparent;-webkit-text-stroke:1.4px hsl(var(--foreground)/.45)}
.xz-bm-track i{font-style:normal;color:hsl(var(--primary));font-size:clamp(20px,3vw,40px)}

/* ----- Scroll cue ----- */
.xz-scrollcue{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:10;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:hsl(var(--foreground)/.45);display:flex;flex-direction:column;align-items:center;gap:8px;animation:xz-fade 1s var(--ease) 1.4s both}
.xz-scrollcue::after{content:'';width:1px;height:34px;background:linear-gradient(hsl(var(--foreground)/.5),transparent);animation:xz-cue 1.8s var(--ease) infinite}
@keyframes xz-cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ----- Custom cursor (Floka-style) ----- */
.xz-cursor,.xz-cursor-ring{position:fixed;top:0;left:0;pointer-events:none;z-index:9999;border-radius:50%;will-change:transform}
.xz-cursor{width:9px;height:9px;background:hsl(var(--primary));transform:translate(-50%,-50%);box-shadow:0 0 0 1.5px hsl(240 12% 3%/.55),0 0 14px hsl(var(--primary)/.5)}
.xz-cursor-ring{width:42px;height:42px;border:1.6px solid hsl(var(--primary)/.6);transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;transition:width .3s var(--ease),height .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease)}
.xz-cursor-ring.grow{width:62px;height:62px;background:hsl(var(--primary)/.16);border-color:transparent}
.xz-cursor-ring.view{width:86px;height:86px;background:hsl(var(--primary));border-color:transparent}
.xz-cursor-ring .lbl{opacity:0;font-family:"Geist",sans-serif;font-size:12px;font-weight:600;color:#fff;letter-spacing:.04em;transition:opacity .25s var(--ease)}
.xz-cursor-ring.view .lbl{opacity:1}
.xz-cursor-hidden{opacity:0!important}
@media(pointer:fine){
  body.xz-has-cursor,body.xz-has-cursor a,body.xz-has-cursor button,body.xz-has-cursor [data-magnetic],body.xz-has-cursor .xz-svc-row,body.xz-has-cursor summary{cursor:none}
  body.xz-has-cursor input,body.xz-has-cursor textarea,body.xz-has-cursor select{cursor:auto}
}
@media(max-width:900px){.xz-cursor,.xz-cursor-ring{display:none}}
@media(prefers-reduced-motion:reduce){.xz-svc-preview,.xz-scrollcue{display:none!important}.xz-hero-h .ln>span{transform:none!important}}

/* ============================================================
   FLOKA LIGHT THEME — global re-skin (cyan on white)
   ============================================================ */
html{background:#fff}
body.xivoz{background:#fff;color:hsl(var(--foreground))}

/* Display font -> Roboto */
body.xivoz .xz-hero h1.xz-hero-h,body.xivoz .xz-logo,body.xivoz .xz-marquee-item,body.xivoz .xz-step-num,body.xivoz .xz-tavatar,body.xivoz .xz-metric,body.xivoz .xz-stat .num,body.xivoz .xz-faq summary,body.xivoz .xz-svc-num,body.xivoz .xz-svc-main h3,body.xivoz .xz-bm-track span,body.xivoz .xz-pop__brand,body.xivoz .xz-mobile-menu a.ml,body.xivoz .xz-intro-statement{font-family:"Roboto","Open Sans",sans-serif}

/* Accent + eyebrow */
body.xivoz .xz-accent{background:linear-gradient(90deg,#22b8d1,#1f93a8,#22b8d1);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
body.xivoz .xz-eyebrow{color:hsl(var(--secondary))}

/* Liquid glass -> clean light card */
body.xivoz .liquid-glass{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none;border:1px solid hsl(var(--border));box-shadow:0 18px 50px -30px rgba(13,40,50,.35)}
body.xivoz .liquid-glass::before{display:none}

/* Buttons */
body.xivoz .xz-btn{font-family:"Open Sans",sans-serif;font-weight:700}
body.xivoz .xz-btn.is-primary{background:hsl(var(--primary));color:#fff;box-shadow:0 12px 30px -10px hsl(var(--primary)/.7)}
body.xivoz .xz-btn.is-primary:hover{background:hsl(var(--secondary));box-shadow:0 18px 40px -10px hsl(var(--primary)/.8)}
body.xivoz .xz-btn.is-ghost{background:#fff;color:hsl(var(--foreground));border:1.5px solid hsl(var(--foreground)/.18)}
body.xivoz .xz-btn.is-ghost:hover{border-color:hsl(var(--primary));color:hsl(var(--primary))}

/* Navbar */
body.xivoz .xz-nav{background:hsl(0 0% 100%/.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
body.xivoz .xz-navlinks a{color:hsl(var(--foreground)/.78)}
body.xivoz .xz-navlinks a:hover,body.xivoz .xz-navlinks a.active{color:hsl(var(--foreground))}
body.xivoz .xz-navlinks a::after{background:hsl(var(--primary))}
body.xivoz .xz-logo{color:hsl(var(--foreground))}
body.xivoz .xz-logo .dot{background:hsl(var(--primary))}
body.xivoz .xz-burger span{background:hsl(var(--foreground))}
body.xivoz .xz-nav .xz-btn{background:hsl(var(--primary));color:#fff;border:none;box-shadow:0 8px 22px -10px hsl(var(--primary)/.7)}
body.xivoz .xz-nav .xz-btn::before{display:none}
body.xivoz .xz-nav .xz-btn:hover{background:hsl(var(--secondary))}
body.xivoz .xz-nav-divider{background:linear-gradient(to right,transparent,hsl(var(--foreground)/.12),transparent)}

/* Hero (light) */
body.xivoz .xz-hero-video{display:none}
body.xivoz .xz-hero-fallback{background:radial-gradient(120% 90% at 50% -5%,#e3f6fb 0%,#ffffff 60%)}
body.xivoz .xz-blur-shape{background:radial-gradient(circle,#b9ecf5,transparent 70%);filter:blur(70px);opacity:.7;width:780px;height:520px}
body.xivoz .xz-hero h1.xz-hero-h{font-weight:900;color:hsl(var(--foreground))}
body.xivoz .xz-hero-sub{color:hsl(var(--muted))}
body.xivoz .xz-status{background:#fff;border:1px solid hsl(var(--border));color:hsl(var(--foreground)/.85)}
body.xivoz .xz-hero-studio{color:hsl(var(--muted))}
body.xivoz .xz-trusted-label{color:hsl(var(--foreground)/.5)}
body.xivoz .xz-marquee-item{color:hsl(var(--foreground)/.42)}
body.xivoz .xz-scrollcue{color:hsl(var(--foreground)/.45)}
body.xivoz .xz-scrollcue::after{background:linear-gradient(hsl(var(--foreground)/.5),transparent)}

/* Animated background (subtle cyan on white) */
body.xivoz .xz-bg{background:radial-gradient(120% 90% at 50% -10%,#eaf8fb 0%,#ffffff 55%)}
body.xivoz .xz-bg .b1{background:#7fd9e8;opacity:.20}
body.xivoz .xz-bg .b2{background:#bfeef6;opacity:.30}
body.xivoz .xz-bg .b3{background:#9ee3ef;opacity:.18}
body.xivoz .xz-bg .b4{background:#cdeaf2;opacity:.24}

/* Section heads + generic cards */
body.xivoz .xz-section-head p{color:hsl(var(--muted));opacity:1}
body.xivoz .xz-card{background:#fff;border:1px solid hsl(var(--border));box-shadow:0 14px 40px -28px rgba(13,40,50,.4)}
body.xivoz .xz-card:hover{box-shadow:0 30px 60px -28px hsl(var(--primary)/.45);border-color:hsl(var(--primary)/.4)}
body.xivoz .xz-card-icon{background:linear-gradient(135deg,hsl(var(--primary)/.18),hsl(var(--primary)/.06))}
body.xivoz .xz-card-icon svg{stroke:hsl(var(--secondary))}
body.xivoz .xz-card p{color:hsl(var(--muted))}

/* Portfolio */
body.xivoz .xz-pcard{background:#fff;border:1px solid hsl(var(--border));box-shadow:0 16px 44px -30px rgba(13,40,50,.45)}
body.xivoz .xz-pcard:hover{box-shadow:0 40px 70px -34px rgba(13,40,50,.5)}
body.xivoz .xz-pcard-ind{color:hsl(var(--secondary))}
body.xivoz .xz-pcard-body p{color:hsl(var(--muted))}

/* Process */
body.xivoz .xz-step{background:#fff;border:1px solid hsl(var(--border))}
body.xivoz .xz-step p{color:hsl(var(--muted))}

/* Testimonials */
body.xivoz .xz-tcard{background:#fff;border:1px solid hsl(var(--border));box-shadow:0 18px 50px -32px rgba(13,40,50,.4)}
body.xivoz .xz-tcard p.quote{color:hsl(var(--foreground))}
body.xivoz .xz-tperson span{color:hsl(var(--muted))}

/* Services accordion */
body.xivoz .xz-svc-list{border-top-color:hsl(var(--foreground)/.16)}
body.xivoz .xz-svc-row{border-bottom-color:hsl(var(--foreground)/.12)}
body.xivoz .xz-svc-row::before{background:linear-gradient(90deg,hsl(var(--primary)/.10),transparent)}
body.xivoz .xz-svc-num{color:hsl(var(--foreground)/.4)}
body.xivoz .xz-svc-main h3{color:hsl(var(--foreground))}
body.xivoz .xz-svc-row:hover .xz-svc-main h3{color:hsl(var(--secondary))}
body.xivoz .xz-svc-desc p{color:hsl(var(--muted))}
body.xivoz .xz-svc-tags span{background:#fff;border:1px solid hsl(var(--border));color:hsl(var(--foreground)/.7)}
body.xivoz .xz-svc-arrow{border-color:hsl(var(--border));color:hsl(var(--foreground)/.6)}

/* Big marquee band */
body.xivoz .xz-bigmarquee{border-top:1px solid hsl(var(--border));border-bottom:1px solid hsl(var(--border));background:hsl(var(--card)/.5)}
body.xivoz .xz-bm-track span{color:hsl(var(--foreground))}
body.xivoz .xz-bm-track span.o{color:transparent;-webkit-text-stroke:1.5px hsl(var(--foreground)/.32)}
body.xivoz .xz-bm-track i{color:hsl(var(--primary))}

/* Intro + stats */
body.xivoz .xz-intro-statement{color:hsl(var(--foreground))}
body.xivoz .xz-stat span{color:hsl(var(--muted))}

/* FAQ */
body.xivoz .xz-faq details{background:#fff;border:1px solid hsl(var(--border))}
body.xivoz .xz-faq summary::after{color:hsl(var(--primary))}
body.xivoz .xz-faq p{color:hsl(var(--muted))}

/* Final CTA -> dark contrast block */
body.xivoz .xz-finalcta{background:radial-gradient(120% 140% at 50% 0%,hsl(202 39% 16%),hsl(var(--ink)));border:1px solid hsl(202 30% 20%);color:#fff}
body.xivoz .xz-finalcta h2{color:#fff}
body.xivoz .xz-finalcta p{color:hsl(0 0% 100%/.82)}
body.xivoz .xz-finalcta .xz-btn.is-ghost{background:transparent;color:#fff;border-color:hsl(0 0% 100%/.3)}
body.xivoz .xz-finalcta .xz-btn.is-ghost:hover{border-color:#fff;color:#fff}

/* Contact */
body.xivoz .xz-contact-info .lead{color:hsl(var(--muted))}
body.xivoz .xz-cinfo-row b{color:hsl(var(--foreground)/.55)}
body.xivoz .xz-cinfo-row span{color:hsl(var(--foreground))}
body.xivoz .xz-cinfo-row .ic{background:hsl(var(--primary)/.12)}
body.xivoz .xz-cinfo-row .ic svg{stroke:hsl(var(--secondary))}
body.xivoz .xz-field label{color:hsl(var(--foreground)/.7)}
body.xivoz .xz-field input,body.xivoz .xz-field select,body.xivoz .xz-field textarea{background:#fff;border:1px solid hsl(var(--border));color:hsl(var(--foreground))}
body.xivoz .xz-socials a{background:#fff;border:1px solid hsl(var(--border))}
body.xivoz .xz-socials svg{fill:hsl(var(--secondary))}

/* Footer -> dark */
body.xivoz .xz-footer{background:hsl(var(--ink));margin-top:0}
body.xivoz .xz-footer .xz-logo{color:#fff}
body.xivoz .xz-footer-col p,body.xivoz .xz-footer-col ul a{color:hsl(0 0% 100%/.62)}
body.xivoz .xz-footer-col ul a:hover{color:#fff}
body.xivoz .xz-footer-col h4{color:hsl(0 0% 100%/.55)}
body.xivoz .xz-footer-bottom{color:hsl(0 0% 100%/.5)}

/* Mobile menu (light) */
body.xivoz .xz-mobile-menu{background:hsl(0 0% 100%/.98)}
body.xivoz .xz-mobile-menu a.ml{border-bottom-color:hsl(var(--border));color:hsl(var(--foreground))}
body.xivoz .xz-close{color:hsl(var(--foreground))}

/* Popup window (light) */
body.xivoz .xz-pop__window{background:#fff;border:1px solid hsl(var(--border))}
body.xivoz .xz-pop__bar{background:hsl(0 0% 100%/.9)}
body.xivoz .xz-pop__close{background:#fff;border:1px solid hsl(var(--border))}

/* Inner-page blocks (keep usable on light) */
body.xivoz .xz-srow{background:#fff;border-color:hsl(var(--border))}
body.xivoz .xz-srow-media{background:linear-gradient(135deg,#eaf8fb,#cdeaf2)}
body.xivoz .xz-srow p{color:hsl(var(--muted))}
body.xivoz .xz-srow-media .glow{background:radial-gradient(60% 60% at 30% 20%,hsl(var(--primary)/.4),transparent 70%)}
body.xivoz .xz-member .ph{background:linear-gradient(135deg,#eaf8fb,#cdeaf2)}
body.xivoz .xz-member .ph::after{background:radial-gradient(70% 70% at 50% 20%,hsl(var(--primary)/.3),transparent)}
body.xivoz .xz-member span{color:hsl(var(--muted))}
body.xivoz .xz-map{background:linear-gradient(135deg,#eaf8fb,#cdeaf2);color:hsl(var(--foreground)/.5)}
body.xivoz .xz-chip{background:hsl(var(--primary)/.1);border-color:hsl(var(--border));color:hsl(var(--foreground)/.85)}
body.xivoz .xz-filter{border-color:hsl(var(--border));color:hsl(var(--foreground)/.7)}
body.xivoz .xz-filter.active{background:hsl(var(--primary));border-color:hsl(var(--primary));color:#fff}
body.xivoz .xz-pagehero::after{background:hsl(var(--primary)/.15)}
body.xivoz .xz-pagehero p{color:hsl(var(--muted))}
body.xivoz .xz-calendly{border-color:hsl(var(--border))}

/* ============================================================
   Floating toggle menu (logo + chat pill + Menu/Close + reveal panel)
   ============================================================ */
.xz-hdr{position:fixed;inset:0 0 auto 0;z-index:200;display:flex;align-items:flex-start;justify-content:space-between;padding:24px clamp(16px,4vw,48px);pointer-events:none;animation:xz-fade .8s var(--ease) both}
.xz-hdr>*{pointer-events:auto}
.xz-hdr-logo{display:flex;align-items:center;gap:10px;font-family:"Roboto",sans-serif;font-weight:700;font-size:25px;color:hsl(var(--foreground));letter-spacing:-.01em;height:40px}
.xz-hdr-logo .dot{width:22px;height:22px;border-radius:7px;background:hsl(var(--primary))}
.xz-hdr-right{display:flex;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none}
.xz-hdr-actions{display:flex;align-items:center;gap:12px;pointer-events:auto}
.xz-spring{transition:transform .5s cubic-bezier(.22,.68,0,1)}
.xz-spring:hover{transform:scale(1.07)}

/* Chat pill */
.xz-chip-btn{display:inline-flex;align-items:center;padding:5px 5px 5px 22px;border-radius:999px;background:hsl(var(--card));color:hsl(var(--foreground));font-family:"Open Sans",sans-serif;font-weight:600;font-size:15px;border:1px solid hsl(var(--border))}
.xz-chip-btn .lbl{padding-right:14px;white-space:nowrap}
.xz-chip-btn .ico{position:relative;overflow:hidden;width:40px;height:40px;border-radius:50%;background:#fff;flex-shrink:0}
.xz-chip-btn .ico svg{position:absolute;top:50%;left:50%;width:17px;height:17px;margin:-8.5px 0 0 -8.5px;stroke:hsl(var(--foreground));transition:transform .55s cubic-bezier(.22,.68,0,1.5)}
.xz-chip-btn .ico .i2{transform:translateX(-260%)}
.xz-chip-btn:hover .ico .i1{transform:translateX(260%)}
.xz-chip-btn:hover .ico .i2{transform:translateX(0)}

/* Menu / Close toggle */
.xz-menu-toggle{display:inline-flex;align-items:center;padding:5px 5px 5px 22px;border-radius:999px;background:hsl(var(--ink));color:#fff;cursor:pointer;border:none;font-family:"Open Sans",sans-serif}
.xz-menu-toggle .lbl{position:relative;display:inline-block;overflow:hidden;height:1.25em;min-width:50px;text-align:left;padding-right:14px;font-weight:600;font-size:15px;text-transform:uppercase;letter-spacing:.03em}
.xz-menu-toggle .lbl span{display:block;transition:transform .55s cubic-bezier(.22,.68,0,1.2)}
.xz-menu-toggle .t-close{position:absolute;left:0;top:0;transform:translateY(115%)}
#xz-hdr.menu-open .xz-menu-toggle .t-open{transform:translateY(-115%)}
#xz-hdr.menu-open .xz-menu-toggle .t-close{transform:translateY(0)}
.xz-menu-toggle .ico{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:hsl(202 22% 18%);flex-shrink:0}
.xz-menu-toggle .ico svg{width:17px;height:8px;fill:#fff;transition:transform .55s cubic-bezier(.22,.68,0,1.5)}
.xz-menu-toggle:hover .ico svg,#xz-hdr.menu-open .xz-menu-toggle .ico svg{transform:rotate(90deg)}

/* Reveal panel */
.xz-menu-panel{pointer-events:none;width:min(430px,calc(100vw - 32px))}
.xz-menu-card{transform-origin:top right;opacity:0;transform:translateY(-12px) scale(.96);visibility:hidden;pointer-events:none;background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:26px;padding:14px;display:flex;flex-direction:column;gap:2px;box-shadow:0 44px 100px -45px rgba(13,40,50,.55);transition:opacity .55s var(--ease),transform .6s cubic-bezier(.22,.68,0,1),visibility 0s linear .6s}
#xz-hdr.menu-open .xz-menu-card{opacity:1;transform:none;visibility:visible;pointer-events:auto;transition:opacity .55s var(--ease),transform .6s cubic-bezier(.22,.68,0,1),visibility 0s}
.xz-menu-link{display:flex;align-items:center;gap:2px;padding:9px 20px;border-radius:18px;font-family:"Roboto",sans-serif;font-weight:600;font-size:clamp(30px,3.4vw,44px);line-height:1.18;letter-spacing:-.02em;color:hsl(var(--foreground));opacity:0;transform:translateY(16px);transition:opacity .5s var(--ease),transform .5s var(--ease),background-color .25s ease,color .25s ease}
#xz-hdr.menu-open .xz-menu-link{opacity:1;transform:none}
#xz-hdr.menu-open .xz-menu-link:nth-child(1){transition-delay:.12s,.12s,0s,0s}
#xz-hdr.menu-open .xz-menu-link:nth-child(2){transition-delay:.17s,.17s,0s,0s}
#xz-hdr.menu-open .xz-menu-link:nth-child(3){transition-delay:.22s,.22s,0s,0s}
#xz-hdr.menu-open .xz-menu-link:nth-child(4){transition-delay:.27s,.27s,0s,0s}
#xz-hdr.menu-open .xz-menu-link:nth-child(5){transition-delay:.32s,.32s,0s,0s}
.xz-menu-link .arr{width:0;overflow:hidden;display:flex;align-items:center;color:hsl(var(--primary));transition:width .35s var(--ease)}
.xz-menu-link .arr svg{width:32px;height:26px;flex-shrink:0}
.xz-menu-link .t{display:block}
.xz-menu-link:hover{background:#fff;color:hsl(var(--secondary))}
.xz-menu-link:hover .arr{width:40px}
.xz-menu-link.active{color:hsl(var(--primary))}
.xz-menu-link.active .arr{width:40px}

@media(max-width:900px){
  .xz-hdr{padding:18px 16px}
  .xz-chip-btn{display:none}
  .xz-menu-panel{position:fixed;top:78px;right:16px;left:16px;width:auto}
  .xz-menu-card{transform-origin:top center}
  .xz-hdr-logo{font-size:22px}
}
@media(prefers-reduced-motion:reduce){
  .xz-menu-card,.xz-menu-link,.xz-menu-toggle .lbl span,.xz-chip-btn .ico svg{transition-duration:.001ms!important}
}

/* ===== Page-transition curtain (real-nav, SOHub-style) ===== */
#xz-curtain{position:fixed;inset:0;z-index:9000;background:hsl(var(--ink));display:flex;align-items:center;justify-content:center;transform:translateY(-100%);pointer-events:none;will-change:transform;animation:xz-cv-intro .9s cubic-bezier(.76,0,.24,1) both}
@keyframes xz-cv-intro{0%{transform:translateY(0)}46%{transform:translateY(0)}100%{transform:translateY(-100%)}}
.xz-curtain-logo{display:flex;align-items:center;gap:.32em;font-family:"Roboto",sans-serif;font-weight:700;font-size:clamp(34px,6vw,64px);color:#fff;letter-spacing:-.02em;opacity:0;transform:scale(.86);animation:xz-cv-logo .9s cubic-bezier(.22,.68,0,1) both}
@keyframes xz-cv-logo{0%{opacity:0;transform:scale(.86)}26%{opacity:1;transform:scale(1)}46%{opacity:1;transform:scale(1)}64%{opacity:0;transform:scale(1.04)}100%{opacity:0}}
.xz-curtain-logo .dot{width:.8em;height:.8em;border-radius:.26em;background:hsl(var(--primary));animation:xz-cv-dot .9s cubic-bezier(.22,.68,0,1) both}
@keyframes xz-cv-dot{0%{transform:rotate(-130deg) scale(.35)}30%{transform:rotate(0) scale(1)}100%{transform:rotate(0) scale(1)}}
#xz-curtain.cover-prep{animation:none;transition:none;transform:translateY(100%)}
#xz-curtain.cover-prep .xz-curtain-logo{animation:none;opacity:0;transform:scale(.86)}
#xz-curtain.cover-prep .xz-curtain-logo .dot{animation:none}
#xz-curtain.cover-go{animation:none;transform:translateY(0);transition:transform .5s cubic-bezier(.76,0,.24,1)}
#xz-curtain.cover-go .xz-curtain-logo{animation:none;opacity:1;transform:scale(1);transition:opacity .4s ease .04s,transform .55s cubic-bezier(.22,.68,0,1)}
#xz-curtain.cover-go .xz-curtain-logo .dot{animation:none;transform:rotate(0) scale(1)}
#xz-curtain.is-revealed{animation:none;transform:translateY(-100%)}
@media(prefers-reduced-motion:reduce){#xz-curtain,.xz-curtain-logo,.xz-curtain-logo .dot{animation-duration:.001ms!important}#xz-curtain.cover-go{transition-duration:.001ms}}

/* ============================================================
   XIVOZ DARK — logo vibe (glossy monochrome on near-black)
   ============================================================ */
html{background:hsl(var(--background))}
body.xivoz{background:hsl(var(--background));color:hsl(var(--foreground))}
body.xivoz .xz-hero h1.xz-hero-h,body.xivoz .xz-logo,body.xivoz .xz-hdr-logo,body.xivoz .xz-marquee-item,body.xivoz .xz-step-num,body.xivoz .xz-tavatar,body.xivoz .xz-metric,body.xivoz .xz-stat .num,body.xivoz .xz-faq summary,body.xivoz .xz-svc-num,body.xivoz .xz-svc-main h3,body.xivoz .xz-bm-track span,body.xivoz .xz-menu-link,body.xivoz .xz-curtain-logo,body.xivoz .xz-hero2-h,body.xivoz .xz-intro-statement{font-family:"Outfit","Inter",sans-serif}
body.xivoz .xz-btn,body.xivoz .xz-chip-btn,body.xivoz .xz-menu-toggle{font-family:"Inter",sans-serif}
body.xivoz .xz-accent,body.xivoz .xz-hero2-h .b{background:linear-gradient(180deg,#ffffff 0%,#e7e7ea 38%,#9b9ba2 56%,#f3f3f5 100%);background-size:auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:none}
body.xivoz .xz-eyebrow{color:hsl(var(--muted));letter-spacing:.2em}
body.xivoz .liquid-glass{background:linear-gradient(180deg,hsl(0 0% 100%/.05),hsl(0 0% 100%/.02));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid hsl(0 0% 100%/.09);box-shadow:inset 0 1px 0 hsl(0 0% 100%/.10),0 24px 60px -34px rgba(0,0,0,.8)}
body.xivoz .liquid-glass::before{display:none}
body.xivoz .xz-btn.is-primary{background:linear-gradient(180deg,#fafafa,#c4c4ca);color:#0a0a0c;box-shadow:0 10px 30px -12px rgba(0,0,0,.8),inset 0 1px 0 #fff}
body.xivoz .xz-btn.is-primary:hover{background:linear-gradient(180deg,#fff,#d6d6db);transform:translateY(-2px)}
body.xivoz .xz-btn.is-ghost{background:hsl(0 0% 100%/.04);color:hsl(var(--foreground));border:1px solid hsl(0 0% 100%/.16)}
body.xivoz .xz-btn.is-ghost:hover{border-color:hsl(0 0% 100%/.4);color:#fff}
body.xivoz .xz-hdr-logo{color:hsl(var(--foreground))}
body.xivoz .xz-hdr-logo .dot,body.xivoz .xz-footer .xz-logo .dot{background:linear-gradient(150deg,#fff,#86868c);box-shadow:inset 0 1px 0 #fff}
body.xivoz .xz-chip-btn{background:hsl(0 0% 100%/.05);color:hsl(var(--foreground));border:1px solid hsl(0 0% 100%/.10)}
body.xivoz .xz-chip-btn .ico{background:linear-gradient(180deg,#fafafa,#c4c4ca)}
body.xivoz .xz-chip-btn .ico svg{stroke:#0a0a0c}
body.xivoz .xz-menu-toggle{background:hsl(240 8% 13%);color:#fff;border:1px solid hsl(0 0% 100%/.10)}
body.xivoz .xz-menu-toggle .ico{background:linear-gradient(180deg,#fafafa,#c4c4ca)}
body.xivoz .xz-menu-toggle .ico svg{fill:#0a0a0c}
body.xivoz .xz-menu-card{background:linear-gradient(180deg,hsl(240 8% 10%/.97),hsl(240 9% 7%/.97));-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid hsl(0 0% 100%/.10);box-shadow:0 50px 110px -40px rgba(0,0,0,.9)}
body.xivoz .xz-menu-link{color:hsl(var(--foreground))}
body.xivoz .xz-menu-link:hover{background:hsl(0 0% 100%/.06);color:#fff}
body.xivoz .xz-menu-link .arr{color:hsl(var(--foreground))}
body.xivoz .xz-menu-link.active{color:#fff}
body.xivoz .xz-bg{background:radial-gradient(120% 90% at 50% -10%,hsl(240 10% 9%) 0%,hsl(var(--background)) 55%)}
body.xivoz .xz-bg .b1{background:#3a3a42;opacity:.5}
body.xivoz .xz-bg .b2{background:#26262c;opacity:.6}
body.xivoz .xz-bg .b3{background:#4a4a55;opacity:.4}
body.xivoz .xz-bg .b4{background:#2e2e36;opacity:.5}
body.xivoz .xz-section-head p{color:hsl(var(--muted))}
body.xivoz .xz-card{background:linear-gradient(180deg,hsl(0 0% 100%/.045),hsl(0 0% 100%/.015));border:1px solid hsl(0 0% 100%/.08);box-shadow:inset 0 1px 0 hsl(0 0% 100%/.08),0 24px 60px -36px rgba(0,0,0,.8)}
body.xivoz .xz-card:hover{border-color:hsl(0 0% 100%/.2);box-shadow:inset 0 1px 0 hsl(0 0% 100%/.12),0 40px 80px -36px rgba(0,0,0,.9)}
body.xivoz .xz-card-icon{background:linear-gradient(150deg,hsl(0 0% 100%/.14),hsl(0 0% 100%/.04));border:1px solid hsl(0 0% 100%/.08)}
body.xivoz .xz-card-icon svg{stroke:hsl(var(--foreground))}
body.xivoz .xz-card p,body.xivoz .xz-pcard-body p,body.xivoz .xz-step p,body.xivoz .xz-svc-desc p{color:hsl(var(--muted))}
body.xivoz .xz-pcard{background:hsl(240 8% 8%);border:1px solid hsl(0 0% 100%/.08)}
body.xivoz .xz-pcard-ind{color:hsl(var(--muted))}
body.xivoz .xz-step{background:linear-gradient(180deg,hsl(0 0% 100%/.045),hsl(0 0% 100%/.015));border:1px solid hsl(0 0% 100%/.08)}
body.xivoz .xz-step-num,body.xivoz .xz-stat .num{background:linear-gradient(180deg,#ffffff,#9a9aa2);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.xivoz .xz-tcard{background:linear-gradient(180deg,hsl(0 0% 100%/.045),hsl(0 0% 100%/.015));border:1px solid hsl(0 0% 100%/.08)}
body.xivoz .xz-tcard p.quote{color:hsl(var(--foreground))}
body.xivoz .xz-tperson span{color:hsl(var(--muted))}
body.xivoz .xz-tavatar{background:linear-gradient(150deg,#e9e9ec,#86868c);color:#0a0a0c}
body.xivoz .xz-svc-list{border-top-color:hsl(0 0% 100%/.12)}
body.xivoz .xz-svc-row{border-bottom-color:hsl(0 0% 100%/.10)}
body.xivoz .xz-svc-row::before{background:linear-gradient(90deg,hsl(0 0% 100%/.06),transparent)}
body.xivoz .xz-svc-num{color:hsl(var(--muted))}
body.xivoz .xz-svc-main h3{color:hsl(var(--foreground))}
body.xivoz .xz-svc-row:hover .xz-svc-main h3{color:#fff}
body.xivoz .xz-svc-tags span{background:hsl(0 0% 100%/.04);border:1px solid hsl(0 0% 100%/.10);color:hsl(var(--muted))}
body.xivoz .xz-svc-arrow{border-color:hsl(0 0% 100%/.16);color:hsl(var(--foreground))}
body.xivoz .xz-svc-row:hover .xz-svc-arrow{background:linear-gradient(180deg,#fafafa,#c4c4ca);border-color:transparent;color:#0a0a0c}
body.xivoz .xz-bigmarquee{border-top:1px solid hsl(0 0% 100%/.10);border-bottom:1px solid hsl(0 0% 100%/.10);background:hsl(0 0% 100%/.02)}
body.xivoz .xz-bm-track span{color:hsl(var(--foreground))}
body.xivoz .xz-bm-track span.o{color:transparent;-webkit-text-stroke:1.5px hsl(0 0% 100%/.28)}
body.xivoz .xz-bm-track i{color:hsl(var(--muted))}
body.xivoz .xz-intro-statement{color:hsl(var(--foreground))}
body.xivoz .xz-stat span{color:hsl(var(--muted))}
body.xivoz .xz-faq details{background:linear-gradient(180deg,hsl(0 0% 100%/.04),hsl(0 0% 100%/.015));border:1px solid hsl(0 0% 100%/.08)}
body.xivoz .xz-faq summary::after{color:hsl(var(--foreground))}
body.xivoz .xz-faq p{color:hsl(var(--muted))}
body.xivoz .xz-finalcta{background:radial-gradient(120% 140% at 50% 0%,hsl(240 8% 13%),hsl(var(--ink)));border:1px solid hsl(0 0% 100%/.10);color:#fff}
body.xivoz .xz-finalcta h2{color:#fff}
body.xivoz .xz-finalcta p{color:hsl(0 0% 100%/.78)}
body.xivoz .xz-contact-info .lead{color:hsl(var(--muted))}
body.xivoz .xz-cinfo-row b{color:hsl(var(--muted))}
body.xivoz .xz-cinfo-row span{color:hsl(var(--foreground))}
body.xivoz .xz-cinfo-row .ic{background:hsl(0 0% 100%/.06);border:1px solid hsl(0 0% 100%/.08)}
body.xivoz .xz-cinfo-row .ic svg{stroke:hsl(var(--foreground))}
body.xivoz .xz-field label{color:hsl(var(--muted))}
body.xivoz .xz-field input,body.xivoz .xz-field select,body.xivoz .xz-field textarea{background:hsl(0 0% 100%/.04);border:1px solid hsl(0 0% 100%/.12);color:hsl(var(--foreground))}
body.xivoz .xz-field input:focus,body.xivoz .xz-field select:focus,body.xivoz .xz-field textarea:focus{border-color:hsl(0 0% 100%/.4);box-shadow:0 0 0 3px hsl(0 0% 100%/.06)}
body.xivoz .xz-socials a{background:hsl(0 0% 100%/.05);border:1px solid hsl(0 0% 100%/.10)}
body.xivoz .xz-socials svg{fill:hsl(var(--foreground))}
body.xivoz .xz-form-success .ck{background:hsl(0 0% 100%/.08)}
body.xivoz .xz-form-success .ck svg{stroke:hsl(var(--foreground))}
body.xivoz .xz-footer{background:hsl(var(--ink))}
body.xivoz .xz-footer .xz-logo{color:#fff}
body.xivoz .xz-footer-col p,body.xivoz .xz-footer-col ul a{color:hsl(0 0% 100%/.6)}
body.xivoz .xz-footer-col ul a:hover{color:#fff}
body.xivoz .xz-footer-col h4{color:hsl(0 0% 100%/.5)}
body.xivoz .xz-footer-bottom{color:hsl(0 0% 100%/.45)}
body.xivoz .xz-cursor-ring{border-color:hsl(0 0% 100%/.5)}
body.xivoz .xz-srow{background:hsl(240 8% 8%);border-color:hsl(0 0% 100%/.08)}
body.xivoz .xz-srow-media,body.xivoz .xz-member .ph,body.xivoz .xz-map{background:linear-gradient(135deg,hsl(240 8% 12%),hsl(240 9% 6%))}
body.xivoz .xz-pagehero p,body.xivoz .xz-srow p,body.xivoz .xz-member span{color:hsl(var(--muted))}
body.xivoz .xz-chip{background:hsl(0 0% 100%/.05);border-color:hsl(0 0% 100%/.10);color:hsl(var(--foreground))}
body.xivoz .xz-filter{border-color:hsl(0 0% 100%/.14);color:hsl(var(--muted))}
body.xivoz .xz-filter.active{background:linear-gradient(180deg,#fafafa,#c4c4ca);border-color:transparent;color:#0a0a0c}

/* ===== NEW HERO (prompt structure, Xivoz, dark) ===== */
.xz-hero2{position:relative;min-height:52vh;width:100%;display:flex;flex-direction:column;align-items:center;overflow:hidden;background:hsl(var(--background))}
.xz-hero2::before{content:"";position:absolute;top:0;left:0;width:100%;height:64vh;z-index:5;pointer-events:none;background:linear-gradient(to bottom,hsl(var(--background)) 16%,hsl(var(--background)/.55) 42%,transparent)}
.xz-hero2-video{position:absolute;top:15vh;left:0;width:100%;height:95vh;z-index:0;pointer-events:none}
.xz-hero2-video video{width:100%;height:100%;object-fit:cover;display:block}
.xz-hero2-mask{position:absolute;top:0;left:0;width:100%;height:8rem;background:linear-gradient(to bottom,hsl(var(--background)),transparent)}
.xz-hero2-fade-b{position:absolute;left:0;bottom:0;width:100%;height:24vh;background:linear-gradient(to top,hsl(var(--background)),transparent);z-index:1;pointer-events:none}
.xz-hero2-content{position:relative;z-index:10;width:100%;max-width:var(--maxw);margin:0 auto;padding:clamp(28px,4vh,55px) clamp(24px,5vw,80px) 0}
.xz-hero2-h{font-family:"Outfit","Inter",sans-serif;font-weight:600;font-size:clamp(33px,5.4vw,80px);line-height:1.08;letter-spacing:-.02em;max-width:17ch;animation:xz-rise .85s var(--ease) both}
.xz-hero2-h .b{font-weight:700}
.xz-hero2-h .m{color:hsl(var(--muted))}
.xz-eye{display:inline-flex;align-items:center;justify-content:center;width:clamp(34px,5vw,64px);height:clamp(20px,2.7vw,34px);border:2px solid hsl(var(--foreground));border-radius:999px;vertical-align:middle;margin:0 .14em;box-shadow:inset 0 0 12px hsl(0 0% 100%/.14)}
.xz-eye .pupil{width:.42em;height:.42em;border-radius:50%;background:hsl(var(--foreground))}
.xz-hero2-search{display:flex;align-items:center;gap:8px;margin-top:clamp(28px,4vh,48px);max-width:520px;background:linear-gradient(180deg,hsl(0 0% 100%/.07),hsl(0 0% 100%/.03));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid hsl(0 0% 100%/.12);border-radius:8px;padding:6px 6px 6px 18px;box-shadow:inset 0 1px 0 hsl(0 0% 100%/.1),0 24px 60px -28px rgba(0,0,0,.85);animation:xz-rise .85s var(--ease) .15s both}
.xz-hero2-search input{flex:1;min-width:0;background:transparent;border:none;outline:none;color:hsl(var(--foreground));font-family:"Inter",sans-serif;font-size:15px;padding:9px 0}
.xz-hero2-search input::placeholder{color:hsl(var(--muted))}
.xz-hero2-go{flex-shrink:0;width:38px;height:38px;border-radius:50%;background:linear-gradient(180deg,#fafafa,#c4c4ca);color:#0a0a0c;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .4s var(--ease);box-shadow:inset 0 1px 0 #fff}
.xz-hero2-go:hover{transform:scale(1.08)}
.xz-hero2-go svg{width:16px;height:16px}
.xz-hero2-lang{position:absolute;right:clamp(14px,2.2vw,30px);top:42%;transform:translateY(-50%);z-index:10;display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;font-size:13px;color:hsl(var(--foreground));background:linear-gradient(180deg,hsl(0 0% 100%/.07),hsl(0 0% 100%/.03));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid hsl(0 0% 100%/.12);animation:xz-fade 1s var(--ease) .5s both}
.xz-hero2-lang span{color:hsl(var(--muted))}
.xz-hero2-year{position:absolute;left:clamp(16px,3vw,40px);bottom:26px;z-index:10;font-size:13px;letter-spacing:.04em;color:hsl(var(--muted))}
.xz-hero2-tag{position:absolute;right:clamp(16px,3vw,40px);bottom:26px;z-index:10;font-size:13px;letter-spacing:.04em;color:hsl(var(--muted))}
@media(min-width:640px){.xz-hero2{min-height:118vh}.xz-hero2-video{top:20vh;height:120vh}}
@media(max-width:560px){.xz-hero2-lang{display:none}}

/* ============================================================
   XIVOZ PREMIUM POLISH (depth, 3D tilt, scroll reveals, grain)
   ============================================================ */
/* Let the animated backdrop + grain show through (was hidden by solid body) */
body.xivoz{background:transparent}
body.xivoz .xz-bg::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.06;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* Refined scroll reveal (classy fade-up, not a full-height jump) */
body.xivoz .xz-reveal{opacity:0;transform:translateY(32px);transition:opacity .8s var(--ease),transform .8s var(--ease);will-change:opacity,transform}
body.xivoz .xz-reveal.in{opacity:1;transform:none}
/* 3D card reveal — cards rotate up into place on scroll */
body.xivoz .xz-portfolio-grid .xz-reveal,body.xivoz .xz-process .xz-reveal,body.xivoz .xz-grid-3 .xz-reveal,body.xivoz .xz-values .xz-reveal{transform:perspective(1300px) rotateX(10deg) translateY(50px);transform-origin:50% 100%}
body.xivoz .xz-portfolio-grid .xz-reveal.in,body.xivoz .xz-process .xz-reveal.in,body.xivoz .xz-grid-3 .xz-reveal.in,body.xivoz .xz-values .xz-reveal.in{transform:none}

/* Editorial section index + hairline (de-generic) */
body.xivoz{counter-reset:xzsec}
body.xivoz .xz-section{counter-increment:xzsec}
body.xivoz .xz-section-head{position:relative;padding-top:34px}
body.xivoz .xz-section-head::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:70px;height:1px;background:linear-gradient(90deg,transparent,hsl(0 0% 100%/.45),transparent)}
body.xivoz .xz-section .xz-section-head .xz-eyebrow::before{content:counter(xzsec,decimal-leading-zero) "  \2014  ";color:hsl(var(--foreground)/.45)}

/* 3D tilt cards + chrome glare */
body.xivoz .xz-tilt{position:relative;transition:transform .25s var(--ease),box-shadow .4s var(--ease);transform-style:preserve-3d}
body.xivoz .xz-tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s var(--ease);background:radial-gradient(240px circle at var(--mx,50%) var(--my,0%),hsl(0 0% 100%/.18),transparent 60%);z-index:4}
body.xivoz .xz-tilt:hover::after{opacity:1}

/* Scroll progress bar (chrome) */
#xz-progress{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,hsl(240 5% 45%),#ffffff,hsl(240 5% 45%));z-index:600;pointer-events:none}
@supports (animation-timeline: scroll()){#xz-progress{animation:xz-prog linear both;animation-timeline:scroll(root block)}}
@keyframes xz-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Generous, confident rhythm */
body.xivoz .xz-section{padding:clamp(96px,12vh,158px) 0}
body.xivoz .xz-section-head{margin-bottom:72px}

/* ===== Floka-style section heading reveal (mask wipe + stagger) ===== */
body.xivoz .xz-section-head.xz-reveal{opacity:1;transform:none}
body.xivoz .xz-section-head .xz-eyebrow{display:inline-block;opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
body.xivoz .xz-section-head.in .xz-eyebrow{opacity:1;transform:none}
body.xivoz .xz-section-head h2{clip-path:inset(0 0 110% 0);transform:translateY(40%);transition:clip-path .95s var(--ease) .08s,transform .95s var(--ease) .08s}
body.xivoz .xz-section-head.in h2{clip-path:inset(-18% 0 -18% 0);transform:none}
body.xivoz .xz-section-head p{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease) .26s,transform .7s var(--ease) .26s}
body.xivoz .xz-section-head.in p{opacity:1;transform:none}
body.xivoz .xz-section-head::before{width:0;transition:width .9s var(--ease) .1s}
body.xivoz .xz-section-head.in::before{width:70px}
@media(prefers-reduced-motion:reduce){body.xivoz .xz-section-head .xz-eyebrow,body.xivoz .xz-section-head h2,body.xivoz .xz-section-head p{opacity:1!important;transform:none!important;clip-path:none!important}body.xivoz .xz-section-head::before{width:70px!important}}

/* ===== Motion audit fixes (design-motion-principles) ===== */
/* 1) Kill looped pulse/glow attention animations (AI-slop tell) */
body.xivoz .xz-pagehero::after,body.xivoz .xz-blur-shape{animation:none}
body.xivoz .xz-status i{animation:none}
/* 3) De-bounce utility menu / chip micro-interactions (strong ease-out, no overshoot) */
body.xivoz .xz-menu-toggle .lbl span,body.xivoz .xz-menu-toggle .ico svg,body.xivoz .xz-chip-btn .ico svg{transition-timing-function:cubic-bezier(.22,1,.36,1)}
/* 4) Tactile press feedback */
body.xivoz .xz-spring:active{transform:scale(.96)}
body.xivoz .xz-hero2-go:active{transform:scale(.93)}
body.xivoz .xz-menu-link:active{transform:scale(.985)}

/* ===== Impeccable audit fixes: keyboard focus + touch targets ===== */
body.xivoz a:focus-visible,body.xivoz button:focus-visible,body.xivoz input:focus-visible,body.xivoz select:focus-visible,body.xivoz textarea:focus-visible,body.xivoz summary:focus-visible{outline:2px solid hsl(var(--foreground)/.85);outline-offset:3px}
body.xivoz .xz-menu-toggle:focus-visible,body.xivoz .xz-chip-btn:focus-visible,body.xivoz .xz-hero2-go:focus-visible{outline:2px solid hsl(var(--foreground)/.9);outline-offset:4px}
@media(pointer:coarse){body.xivoz .xz-hero2-go{width:46px;height:46px}}

/* ============================================================
   XIVOZ DESIGN REFINEMENT v2 (editorial, de-genericized)
   ============================================================ */
/* Editorial section headers: title left / description right, full-width rule */
body.xivoz .xz-section-head{display:grid;grid-template-columns:1.15fr .85fr;gap:12px 56px;text-align:left;max-width:none;margin:0 0 clamp(48px,7vh,84px);padding-top:30px;align-items:end}
body.xivoz .xz-section-head .xz-eyebrow{grid-column:1/-1;margin:0 0 2px}
body.xivoz .xz-section-head h2{grid-column:1;font-size:clamp(38px,5.4vw,74px);line-height:1.02;letter-spacing:-.03em;margin:0;max-width:15ch}
body.xivoz .xz-section-head p{grid-column:2;align-self:end;max-width:40ch;text-align:left;margin:0;padding-bottom:8px;font-size:16px;opacity:.85}
body.xivoz .xz-section-head::before{left:0;transform:none;height:1px;width:0;background:linear-gradient(90deg,hsl(0 0% 100%/.24),hsl(0 0% 100%/.03))}
body.xivoz .xz-section-head.in::before{width:100%}
@media(max-width:820px){body.xivoz .xz-section-head{grid-template-columns:1fr;gap:14px}body.xivoz .xz-section-head h2{max-width:none}body.xivoz .xz-section-head p{grid-column:1;align-self:start;padding-bottom:0}}
/* Fun-facts / stats: editorial number row, solid numerals */
body.xivoz .xz-stats{gap:0;text-align:left}
body.xivoz .xz-stat{text-align:left;padding:4px 0}
body.xivoz .xz-stat .num{font-size:clamp(46px,5.6vw,76px);letter-spacing:-.03em;background:none!important;-webkit-text-fill-color:hsl(var(--foreground))!important;color:hsl(var(--foreground))!important}
body.xivoz .xz-stat span{margin-top:8px;font-size:14px}
@media(min-width:1025px){body.xivoz .xz-stat{padding-left:36px;border-left:1px solid hsl(0 0% 100%/.1)}body.xivoz .xz-stat:first-child{padding-left:0;border-left:none}}
/* Process: flat editorial numbered steps (no glass cards) */
body.xivoz .xz-step{background:none!important;border:none;border-top:1px solid hsl(0 0% 100%/.13);border-radius:0;padding:30px 24px 8px 0;box-shadow:none!important;transform:none!important}
body.xivoz .xz-step::after{display:none!important}
body.xivoz .xz-step-num{font-size:38px;margin-bottom:26px;background:none!important;-webkit-text-fill-color:hsl(var(--foreground)/.32)!important;color:hsl(var(--foreground)/.32)!important}
body.xivoz .xz-step h3{font-size:19px;margin-bottom:8px}
/* Portfolio: project indices */
body.xivoz .xz-portfolio-grid{counter-reset:pf}
body.xivoz .xz-pcard{counter-increment:pf}
body.xivoz .xz-pcard-ind{display:inline-flex;align-items:center;gap:9px}
body.xivoz .xz-pcard-ind::before{content:counter(pf,decimal-leading-zero);font-family:"Outfit",sans-serif;font-weight:600;color:hsl(var(--foreground)/.4)}
/* Intro statement + rhythm */
body.xivoz .xz-intro-statement{font-size:clamp(27px,3.7vw,50px);line-height:1.2;letter-spacing:-.02em}
body.xivoz .xz-section{padding:clamp(100px,13vh,168px) 0}

/* ============================================================
   XIVOZ ELEVATION (cinematic hero, scrubbed statement, featured work)
   ============================================================ */
body.xivoz .xz-hero2-h{font-size:clamp(40px,8.2vw,116px);line-height:1.02;letter-spacing:-.035em}
body.xivoz .xz-hero2-video::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 220px 60px rgba(0,0,0,.55);background:radial-gradient(120% 80% at 50% 28%,transparent 52%,rgba(0,0,0,.5))}
body.xivoz .xz-hero2-content{will-change:transform,opacity}
body.xivoz .xz-hero2-video{will-change:transform}
/* Scroll-scrubbed statement reveal (signature) */
body.xivoz .xz-intro-statement .w{opacity:.16;transition:opacity .45s var(--ease)}
body.xivoz .xz-intro-statement .w.lit{opacity:1}
body.xivoz .xz-intro{padding-top:clamp(120px,17vh,210px);padding-bottom:clamp(80px,11vh,150px)}
/* Featured portfolio: first project = wide showcase card */
@media(min-width:820px){
  body.xivoz .xz-portfolio-grid{grid-template-columns:1fr 1fr}
  body.xivoz .xz-portfolio-grid .xz-pcard:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.7fr 1fr;align-items:stretch}
  body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-img{aspect-ratio:auto;min-height:400px;height:100%}
  body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-body{display:flex;flex-direction:column;justify-content:center;padding:clamp(34px,4vw,64px)}
  body.xivoz .xz-portfolio-grid .xz-pcard:first-child h3{font-size:clamp(30px,3.4vw,54px);line-height:1.03;margin:12px 0 14px}
  body.xivoz .xz-portfolio-grid .xz-pcard:first-child p{font-size:17px;max-width:44ch}
}
/* Bigger, bolder marquee */
body.xivoz .xz-bm-track span{font-size:clamp(52px,10vw,152px)}
body.xivoz .xz-bigmarquee{padding:46px 0}
body.xivoz .xz-section-head h2{font-weight:700}

/* ===== Hero: video to the right, headline left over dark base (readability) ===== */
@media(min-width:1000px){
  body.xivoz .xz-hero2-video{left:auto;right:0;width:60%}
  body.xivoz .xz-hero2-video::before{content:"";position:absolute;left:0;top:0;bottom:0;width:46%;z-index:2;pointer-events:none;background:linear-gradient(to right,hsl(var(--background)),hsl(var(--background)/.55) 55%,transparent)}
  body.xivoz .xz-hero2-content{padding-right:0}
  body.xivoz .xz-hero2-h{max-width:min(580px,47vw);font-size:clamp(46px,5vw,84px)}
  body.xivoz .xz-hero2-search{max-width:min(420px,42vw)}
}
@media(min-width:1400px){
  body.xivoz .xz-hero2-video{width:56%}
}

/* ============================================================
   XIVOZ LIGHT STUDIO — soft grey gradient background, dark-on-light
   (overrides the dark theme; appended last so it wins)
   ============================================================ */
:root{--background:220 16% 90%;--foreground:220 14% 12%;--muted:220 8% 40%;--primary:220 10% 26%;--secondary:220 9% 40%;--card:0 0% 100%;--border:220 14% 80%;--ink:220 16% 10%}
html{background:#e1e4e9}
body.xivoz{background:transparent;color:hsl(var(--foreground))}
body.xivoz .xz-bg{background:radial-gradient(125% 100% at 50% 4%,#eff1f4 0%,#e3e6eb 46%,#cfd3da 100%)}
body.xivoz .xz-bg .blob{display:none}
body.xivoz .xz-bg::after{opacity:.045;mix-blend-mode:multiply}
body.xivoz .xz-hero2,body.xivoz .xz-hero2-fallback{background:transparent}

/* Accents: metallic on light (graphite chrome) */
body.xivoz .xz-accent,body.xivoz .xz-hero2-h .b{background:linear-gradient(180deg,#4a4e56 0%,#101216 52%,#3a3e46 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
body.xivoz .xz-eyebrow{color:hsl(var(--muted))}

/* Glass + cards: white frosted with soft shadows (no harsh borders) */
body.xivoz .liquid-glass{background:rgba(255,255,255,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(22,26,32,.07);box-shadow:0 24px 60px -34px rgba(25,35,55,.35),inset 0 1px 0 rgba(255,255,255,.6)}
body.xivoz .xz-card,body.xivoz .xz-tcard,body.xivoz .xz-faq details,body.xivoz .xz-pcard{background:rgba(255,255,255,.62);border:1px solid rgba(22,26,32,.08);box-shadow:0 22px 54px -34px rgba(25,35,55,.32)}
body.xivoz .xz-card:hover,body.xivoz .xz-pcard:hover{border-color:rgba(22,26,32,.18);box-shadow:0 40px 80px -38px rgba(25,35,55,.4)}
body.xivoz .xz-card p,body.xivoz .xz-pcard-body p,body.xivoz .xz-step p,body.xivoz .xz-svc-desc p,body.xivoz .xz-tperson span{color:hsl(var(--muted))}
body.xivoz .xz-pcard-ind{color:hsl(var(--muted))}
body.xivoz .xz-tcard p.quote{color:hsl(var(--foreground))}
body.xivoz .xz-tavatar{background:linear-gradient(150deg,#2a2d33,#0d0f12);color:#fff}
body.xivoz .xz-card-icon{background:linear-gradient(150deg,rgba(22,26,32,.1),rgba(22,26,32,.03));border:1px solid rgba(22,26,32,.08)}
body.xivoz .xz-card-icon svg{stroke:hsl(var(--foreground))}

/* Buttons */
body.xivoz .xz-btn.is-primary{background:linear-gradient(180deg,#26292f,#0d0f13);color:#fff;box-shadow:0 14px 32px -14px rgba(25,35,55,.6)}
body.xivoz .xz-btn.is-primary:hover{background:linear-gradient(180deg,#34373e,#17191e)}
body.xivoz .xz-btn.is-ghost{background:rgba(255,255,255,.5);color:hsl(var(--foreground));border:1.5px solid rgba(20,24,30,.22)}
body.xivoz .xz-btn.is-ghost:hover{border-color:rgba(20,24,30,.5);color:#000}

/* Header / menu */
body.xivoz .xz-hdr-logo{color:hsl(var(--foreground))}
body.xivoz .xz-hdr-logo .dot,body.xivoz .xz-footer .xz-logo .dot{background:linear-gradient(150deg,#34373e,#0d0f12)}
body.xivoz .xz-chip-btn{background:rgba(255,255,255,.6);color:hsl(var(--foreground));border:1px solid rgba(22,26,32,.1)}
body.xivoz .xz-chip-btn .ico{background:linear-gradient(180deg,#26292f,#0d0f13)}
body.xivoz .xz-chip-btn .ico svg{stroke:#fff}
body.xivoz .xz-menu-toggle{background:linear-gradient(180deg,#26292f,#0d0f13);color:#fff;border:1px solid rgba(255,255,255,.08)}
body.xivoz .xz-menu-toggle .ico{background:rgba(255,255,255,.16)}
body.xivoz .xz-menu-toggle .ico svg{fill:#fff}
body.xivoz .xz-menu-card{background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(22,26,32,.1);box-shadow:0 50px 110px -42px rgba(25,35,55,.5)}
body.xivoz .xz-menu-link{color:hsl(var(--foreground))}
body.xivoz .xz-menu-link:hover{background:rgba(22,26,32,.05);color:#000}
body.xivoz .xz-menu-link .arr{color:hsl(var(--foreground))}

/* Sectioning lines / structure */
body.xivoz .xz-section-head::before{background:linear-gradient(90deg,rgba(20,24,30,.28),rgba(20,24,30,.04))}
body.xivoz .xz-section-head p{color:hsl(var(--muted))}
body.xivoz .xz-svc-list{border-top-color:rgba(22,26,32,.16)}
body.xivoz .xz-svc-row{border-bottom-color:rgba(22,26,32,.12)}
body.xivoz .xz-svc-row::before{background:linear-gradient(90deg,rgba(22,26,32,.06),transparent)}
body.xivoz .xz-svc-num{color:hsl(var(--muted))}
body.xivoz .xz-svc-main h3{color:hsl(var(--foreground))}
body.xivoz .xz-svc-row:hover .xz-svc-main h3{color:#000}
body.xivoz .xz-svc-tags span{background:rgba(255,255,255,.6);border:1px solid rgba(22,26,32,.12);color:hsl(var(--muted))}
body.xivoz .xz-svc-arrow{border-color:rgba(22,26,32,.2);color:hsl(var(--foreground))}
body.xivoz .xz-svc-row:hover .xz-svc-arrow{background:linear-gradient(180deg,#26292f,#0d0f13);border-color:transparent;color:#fff}
body.xivoz .xz-step{border-top-color:rgba(22,26,32,.16)}
body.xivoz .xz-step-num{-webkit-text-fill-color:rgba(22,26,32,.34)!important;color:rgba(22,26,32,.34)!important}
body.xivoz .xz-stat .num{-webkit-text-fill-color:hsl(var(--foreground))!important;color:hsl(var(--foreground))!important}
@media(min-width:1025px){body.xivoz .xz-stat{border-left-color:rgba(22,26,32,.14)}}

/* Marquee */
body.xivoz .xz-bigmarquee{border-color:rgba(22,26,32,.12);background:rgba(255,255,255,.18)}
body.xivoz .xz-bm-track span{color:hsl(var(--foreground))}
body.xivoz .xz-bm-track span.o{color:transparent;-webkit-text-stroke:1.5px rgba(22,26,32,.3)}
body.xivoz .xz-bm-track i{color:hsl(var(--muted))}

/* FAQ + contact form */
body.xivoz .xz-faq summary::after{color:hsl(var(--foreground))}
body.xivoz .xz-faq p{color:hsl(var(--muted))}
body.xivoz .xz-contact-info .lead,body.xivoz .xz-cinfo-row b,body.xivoz .xz-field label{color:hsl(var(--muted))}
body.xivoz .xz-cinfo-row span{color:hsl(var(--foreground))}
body.xivoz .xz-cinfo-row .ic{background:rgba(22,26,32,.06);border:1px solid rgba(22,26,32,.08)}
body.xivoz .xz-cinfo-row .ic svg{stroke:hsl(var(--foreground))}
body.xivoz .xz-field input,body.xivoz .xz-field select,body.xivoz .xz-field textarea{background:#fff;border:1px solid rgba(22,26,32,.16);color:hsl(var(--foreground))}
body.xivoz .xz-field input:focus,body.xivoz .xz-field select:focus,body.xivoz .xz-field textarea:focus{border-color:rgba(22,26,32,.5);box-shadow:0 0 0 3px rgba(22,26,32,.08)}
body.xivoz .xz-socials a{background:rgba(255,255,255,.6);border:1px solid rgba(22,26,32,.1)}
body.xivoz .xz-socials svg{fill:hsl(var(--foreground))}
body.xivoz .xz-form-success .ck{background:rgba(22,26,32,.08)}
body.xivoz .xz-form-success .ck svg{stroke:hsl(var(--foreground))}

/* Dark blocks kept for contrast: footer, final CTA, curtain — fix their accents/dots to light */
body.xivoz .xz-finalcta .xz-accent{background:linear-gradient(180deg,#ffffff,#c4c4ca);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
body.xivoz .xz-curtain-logo .dot{background:linear-gradient(150deg,#fff,#9a9aa2)}

/* Cursor visible on light (graphite via --primary) */
body.xivoz .xz-cursor{box-shadow:0 0 0 1.5px rgba(255,255,255,.6),0 0 14px rgba(22,26,32,.25)}
body.xivoz .xz-cursor-ring{border-color:rgba(22,26,32,.5)}

/* Inner-page blocks */
body.xivoz .xz-srow{background:rgba(255,255,255,.62);border-color:rgba(22,26,32,.08)}
body.xivoz .xz-srow-media,body.xivoz .xz-member .ph,body.xivoz .xz-map{background:linear-gradient(135deg,#dfe3e9,#c9cdd5)}
body.xivoz .xz-pagehero p,body.xivoz .xz-srow p,body.xivoz .xz-member span{color:hsl(var(--muted))}
body.xivoz .xz-chip{background:rgba(255,255,255,.6);border-color:rgba(22,26,32,.1);color:hsl(var(--foreground))}
body.xivoz .xz-filter{border-color:rgba(22,26,32,.16);color:hsl(var(--muted))}
body.xivoz .xz-filter.active{background:linear-gradient(180deg,#26292f,#0d0f13);border-color:transparent;color:#fff}

/* ===== Hero: kill the centre seam, unify one continuous studio-light bg ===== */
:root{--background:220 16% 93%}
body.xivoz .xz-bg{background:radial-gradient(140% 120% at 68% 4%,#f4f5f7 0%,#E7E9F1 50%,#e3e6ea 100%)}
body.xivoz .xz-hero2::before{display:none!important}
body.xivoz .xz-hero2-video::before{display:none!important}
body.xivoz .xz-hero2-video::after{display:none!important}
/* Fade the video's LEFT edge to transparent so the page bg shows through (no painted seam) */
body.xivoz .xz-hero2-video video{-webkit-mask-image:linear-gradient(to right,transparent 0,transparent 4%,#000 19%);mask-image:linear-gradient(to right,transparent 0,transparent 4%,#000 19%);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
/* Soften the video top so its upper edge melts into the same light */
body.xivoz .xz-hero2-mask{height:14rem;background:linear-gradient(to bottom,#E7E9F1,transparent)}
body.xivoz .xz-hero2-fade-b{background:linear-gradient(to top,#E7E9F1,transparent)}

/* ===== Fix menu link visibility on light theme + larger menu box ===== */
body.xivoz .xz-menu-link,body.xivoz .xz-menu-link:hover,body.xivoz .xz-menu-link.active{color:#0d0f13}
body.xivoz .xz-menu-link .arr,body.xivoz .xz-menu-link.active .arr{color:#0d0f13}
body.xivoz .xz-menu-link:hover{background:rgba(20,24,30,.05)}
body.xivoz .xz-menu-panel{width:min(500px,calc(100vw - 28px))}
body.xivoz .xz-menu-card{padding:22px;border-radius:30px;gap:4px}
body.xivoz .xz-menu-link{padding:13px 26px;font-size:clamp(32px,3.7vw,50px);border-radius:20px}
@media(max-width:900px){body.xivoz .xz-menu-panel{width:auto}}

/* ===== Scroll-through reveal: each section transitions in/out as it crosses the viewport ===== */
body.xz-scrollfx .xz-section > .xz-container{opacity:0;transform:translateY(64px) scale(.992);transition:opacity .9s var(--ease),transform 1s var(--ease);will-change:opacity,transform}
body.xz-scrollfx .xz-section.inView > .xz-container{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){body.xz-scrollfx .xz-section > .xz-container{opacity:1!important;transform:none!important}}

/* ===== Cinematic pinned scroll hero (step sequence) ===== */
.xz-cine{position:relative;height:330vh;background:transparent}
.xz-cine-stage{position:sticky;top:0;height:100vh;overflow:hidden}
.xz-cine-bg{position:absolute;inset:0;z-index:0}
.xz-cine-bg video{width:100%;height:100%;object-fit:cover;object-position:center}
.xz-cine-veil{position:absolute;inset:0;z-index:1;background:linear-gradient(to right,#E7E9F1 0%,#E7E9F1 20%,rgba(236,237,240,0) 58%)}
.xz-cine-wash{position:absolute;inset:0;z-index:2;background:#eceef1;opacity:0;transition:opacity 1s var(--ease)}
.xz-cine-layer{position:absolute;inset:0;z-index:10;display:flex;align-items:center;padding:0 clamp(24px,6vw,96px);pointer-events:none}
.xz-cine-headline .xz-hero2-h{font-size:clamp(38px,6vw,94px);line-height:1.04;letter-spacing:-.03em;max-width:min(700px,53vw);transform-origin:left center;transition:transform 1s var(--ease),opacity .85s var(--ease)}
.xz-cine-box{max-width:600px;opacity:0;transform:scale(1.5);transform-origin:left center;transition:transform 1s var(--ease),opacity .85s var(--ease);pointer-events:none}
.xz-cine-box p{font-family:"Outfit",sans-serif;font-weight:500;font-size:clamp(24px,3vw,42px);line-height:1.24;letter-spacing:-.02em;color:hsl(var(--foreground));margin:0 0 30px}
.xz-cine-meta{align-items:flex-end;padding-bottom:13vh}
.xz-cine-meta ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:30px;width:100%;max-width:1120px;opacity:0;transform:translateY(46px);transition:transform 1s var(--ease),opacity .85s var(--ease)}
.xz-cine-meta li{border-top:1px solid rgba(22,26,32,.2);padding-top:18px}
.xz-cine-meta .n{font-family:"Outfit",sans-serif;color:hsl(var(--muted));font-size:14px;font-weight:600}
.xz-cine-meta h3{font-family:"Outfit",sans-serif;font-weight:600;font-size:clamp(22px,2.4vw,34px);margin:10px 0 8px;letter-spacing:-.02em}
.xz-cine-meta p{color:hsl(var(--muted));font-size:15px;margin:0}
.xz-cine-cue{position:absolute;left:clamp(24px,6vw,96px);bottom:30px;z-index:11;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:hsl(var(--muted));transition:opacity .6s var(--ease)}
.xz-cine-stage.step-2 .xz-cine-headline .xz-hero2-h{transform:scale(.6);opacity:.1}
.xz-cine-stage.step-2 .xz-cine-box{opacity:1;transform:scale(1);pointer-events:auto}
.xz-cine-stage.step-3 .xz-cine-headline .xz-hero2-h{opacity:0;transform:scale(.42)}
.xz-cine-stage.step-3 .xz-cine-box{opacity:0;transform:scale(.72)}
.xz-cine-stage.step-3 .xz-cine-wash{opacity:.9}
.xz-cine-stage.step-3 .xz-cine-meta ul{opacity:1;transform:none}
.xz-cine-stage.step-3 .xz-cine-cue{opacity:0}
@media(max-width:900px){.xz-cine-headline .xz-hero2-h,.xz-cine-box{max-width:none}.xz-cine-veil{background:linear-gradient(to bottom,#E7E9F1 0%,rgba(236,237,240,.15) 55%)}.xz-cine-meta{padding-bottom:9vh}.xz-cine-meta ul{grid-template-columns:1fr;gap:14px}}
@media(prefers-reduced-motion:reduce){.xz-cine{height:auto}.xz-cine-stage{position:static;height:auto;display:block;overflow:visible;padding:130px 24px 70px}.xz-cine-bg{position:relative;height:58vh}.xz-cine-wash{display:none}.xz-cine-layer{position:relative;inset:auto;display:block;padding:46px 24px 0}.xz-cine-headline .xz-hero2-h,.xz-cine-box,.xz-cine-meta ul{opacity:1!important;transform:none!important}}

/* ===== Restore clean hero + strengthen the per-section scroll transition ===== */
body.xivoz .xz-hero2-actions{margin-top:clamp(30px,4.5vh,52px)}
/* neutralise the dead cinematic layers if any cache lingers */
body.xivoz .xz-cine{height:auto}
body.xivoz .xz-cine-stage{position:static;height:auto}
/* Reversible in/out reveal for EVERY section as it scrolls through */
body.xz-scrollfx .xz-section > .xz-container{opacity:0;transform:translateY(78px) scale(.984);transition:opacity .8s var(--ease),transform .95s var(--ease);will-change:opacity,transform}
body.xz-scrollfx .xz-section.inView > .xz-container{opacity:1;transform:none}
body.xz-scrollfx .xz-bigmarquee{opacity:0;transform:translateY(40px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
body.xz-scrollfx .xz-bigmarquee.inView{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){body.xz-scrollfx .xz-section > .xz-container,body.xz-scrollfx .xz-bigmarquee{opacity:1!important;transform:none!important}}

/* ===== Pure-CSS scrubbed scroll animation for EVERY section (reversible, no JS) ===== */
/* Neutralise the JS-class version so nothing can be left hidden */
body.xivoz.xz-scrollfx .xz-section > .xz-container,body.xivoz.xz-scrollfx .xz-bigmarquee{opacity:1;transform:none;transition:none}
@keyframes xz-secflow{0%{opacity:0;transform:translateY(90px) scale(.94)}22%{opacity:1;transform:translateY(0) scale(1)}80%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-46px) scale(.98)}}
@supports (animation-timeline: view()){
  body.xivoz .xz-section > .xz-container,body.xivoz .xz-bigmarquee{animation:xz-secflow linear both;animation-timeline:view();animation-range:entry 0% exit 100%;will-change:opacity,transform}
}
@media(prefers-reduced-motion:reduce){body.xivoz .xz-section > .xz-container,body.xivoz .xz-bigmarquee{animation:none!important;opacity:1!important;transform:none!important}}

/* ===== Curtain logo fix (show the xiVoz mark on every transition) 2026-06-18 ===== */
.xz-curtain-logo{font-size:0!important;color:transparent}
.xz-curtain-logo .xz-cv{display:block;width:clamp(180px,34vw,360px);height:auto;filter:drop-shadow(0 18px 60px rgba(120,130,145,.28))}
/* keep logo visible the whole time the curtain covers, both on click-nav and page-load */
#xz-curtain.cover-go .xz-curtain-logo,#xz-curtain.cover-go .xz-curtain-logo .xz-cv{opacity:1!important;transform:scale(1)!important}
@keyframes xz-cv-logo{0%{opacity:0;transform:scale(.9)}22%{opacity:1;transform:scale(1)}70%{opacity:1;transform:scale(1)}88%{opacity:0;transform:scale(1.03)}100%{opacity:0}}
@keyframes xz-cv-intro{0%{transform:translateY(0)}55%{transform:translateY(0)}100%{transform:translateY(-100%)}}


/* ===== Curtain timing v2 — faster + smoother (SOHub feel) 2026-06-18 ===== */
#xz-curtain{animation-duration:.72s!important;animation-timing-function:cubic-bezier(.85,0,.15,1)!important}
.xz-curtain-logo{animation-duration:.72s!important}
.xz-curtain-logo .dot{animation-duration:.72s!important}
#xz-curtain.cover-go{transition:transform .42s cubic-bezier(.85,0,.15,1)!important}
#xz-curtain.cover-go .xz-curtain-logo{transition:opacity .28s ease,transform .42s cubic-bezier(.22,.7,0,1)!important}
@keyframes xz-cv-intro{0%{transform:translateY(0)}40%{transform:translateY(0)}100%{transform:translateY(-100%)}}
@keyframes xz-cv-logo{0%{opacity:0;transform:scale(.92)}24%{opacity:1;transform:scale(1)}58%{opacity:1;transform:scale(1)}82%{opacity:0;transform:scale(1.02)}100%{opacity:0}}


/* ===== Curtain motion v3 — curved sweeping edge (premium) 2026-06-18 ===== */
#xz-curtain{will-change:transform,border-radius;border-radius:0}
/* CLICK → cover: panel arcs up from the bottom, dome top flattens as it lands */
#xz-curtain.cover-prep{transform:translateY(101%);border-radius:50% 50% 0 0/16% 16% 0 0}
#xz-curtain.cover-go{transform:translateY(0);border-radius:0;transition:transform .62s cubic-bezier(.7,0,.2,1),border-radius .62s cubic-bezier(.7,0,.2,1)!important}
#xz-curtain.cover-go .xz-curtain-logo{transition:opacity .34s ease .06s,transform .55s cubic-bezier(.22,.7,0,1)!important}
/* PAGE LOAD → reveal: panel lifts away, bottom edge arcs out like a wave */
#xz-curtain{animation:xz-cv-intro .85s cubic-bezier(.7,0,.2,1) both!important}
@keyframes xz-cv-intro{0%{transform:translateY(0);border-radius:0}38%{transform:translateY(0);border-radius:0}100%{transform:translateY(-101%);border-radius:0 0 50% 50%/0 0 16% 16%}}
@keyframes xz-cv-logo{0%{opacity:0;transform:scale(.92) translateY(10px)}26%{opacity:1;transform:scale(1) translateY(0)}56%{opacity:1;transform:scale(1) translateY(0)}82%{opacity:0;transform:scale(1.02) translateY(-8px)}100%{opacity:0}}
.xz-curtain-logo{animation-duration:.85s!important}
.xz-curtain-logo .dot{animation-duration:.85s!important}


/* ===== Seamless sections — no band borders / tint on marquee 2026-06-18 ===== */
body.xivoz .xz-bigmarquee{border-top:0!important;border-bottom:0!important;background:transparent!important}


/* ===== Hero seamless fix — kill full-width fade bands, fade the video itself 2026-06-18 ===== */
body.xivoz .xz-hero2-fade-b{display:none!important}
body.xivoz .xz-hero2-mask{display:none!important}
body.xivoz .xz-hero2-video video{-webkit-mask-image:linear-gradient(to right,transparent 0,transparent 4%,#000 19%),linear-gradient(to bottom,#000 0,#000 70%,transparent 97%);mask-image:linear-gradient(to right,transparent 0,transparent 4%,#000 19%),linear-gradient(to bottom,#000 0,#000 70%,transparent 97%);-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}


/* ===== Hero video blend — merge its white backdrop into the page 2026-06-18 ===== */
body.xivoz .xz-hero2,body.xivoz .xz-hero2-video,body.xivoz .xz-hero2-video video{background:transparent!important}
body.xivoz .xz-hero2-video video{mix-blend-mode:multiply}
body.xivoz .xz-hero2-video::after{display:none!important}


/* ===== Flat uniform background to match hero video backdrop 2026-06-18 ===== */
:root{--xz-flat:#F1F3F6}
html,body.xivoz{background:var(--xz-flat)!important}
body.xivoz .xz-bg{background:var(--xz-flat)!important}
body.xivoz .xz-bg .blob{display:none!important}
body.xivoz .xz-bg::after{display:none!important}
body.xivoz .xz-hero2,body.xivoz .xz-hero2-video,body.xivoz .xz-hero2-video video{background:transparent!important}
body.xivoz .xz-hero2-video video{mix-blend-mode:normal!important}


/* ===== Hero seam removal v2 — lighter flat + wide soft video fade 2026-06-18 ===== */
:root{--xz-flat:#F4F6F8}
body.xivoz .xz-hero2-video video{-webkit-mask-image:linear-gradient(to right,transparent 0,transparent 8%,#000 62%),linear-gradient(to bottom,#000 0,#000 66%,transparent 97%)!important;mask-image:linear-gradient(to right,transparent 0,transparent 8%,#000 62%),linear-gradient(to bottom,#000 0,#000 66%,transparent 97%)!important;-webkit-mask-composite:source-in!important;mask-composite:intersect!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important}


/* ===== Fixed lavender-grey background (user-chosen) 2026-06-18 ===== */
:root{--xz-flat:#E7E9F1}
html,body.xivoz,body.xivoz .xz-bg{background:#E7E9F1!important}
body.xivoz .xz-pagehero::after{display:none!important}
body.xivoz .xz-bg::after{display:none!important}
body.xivoz .xz-pagehero{text-align:center!important}
body.xivoz .xz-pagehero p{max-width:620px!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child,body.xivoz .xz-portfolio-grid .xz-pcard:first-child.xz-reveal{opacity:1!important;transform:none!important}


/* ===== Header logo: chrome V mark in box + lowercase xivoz wordmark 2026-06-18 ===== */
body.xivoz .xz-hdr-logo{gap:11px}
body.xivoz .xz-hdr-logo .dot{width:38px;height:38px;border-radius:10px;background:linear-gradient(160deg,#1b1d22,#060708)!important;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 0 hsl(0 0% 100%/.12),0 6px 16px -8px rgba(0,0,0,.6)}
body.xivoz .xz-hdr-logo .xz-vmark{width:22px;height:22px;display:block;filter:drop-shadow(0 1px 2px rgba(0,0,0,.5))}
body.xivoz .xz-hdr-word{font-family:"Outfit","Inter",sans-serif;font-weight:600;font-size:21px;text-transform:lowercase;letter-spacing:.30em;padding-left:.06em;background:linear-gradient(180deg,#4a4e56 0%,#101216 52%,#3a3e46 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;line-height:1}


/* ===== Hero tweaks: text further left + animation higher 2026-06-18 ===== */
body.xivoz .xz-hero2-content{max-width:none!important;margin:0!important;padding-left:clamp(16px,4vw,48px)!important;padding-top:clamp(96px,13vh,170px)!important}
body.xivoz .xz-hero2-video{top:3vh!important}
@media(min-width:640px){body.xivoz .xz-hero2-video{top:5vh!important}}


/* ===== Hero level-align: text a bit down, animation higher 2026-06-18 ===== */
body.xivoz .xz-hero2-content{padding-top:clamp(150px,19vh,250px)!important}
body.xivoz .xz-hero2-video{top:-2vh!important}
@media(min-width:640px){body.xivoz .xz-hero2-video{top:-2vh!important}}


/* ===== Hero: text closer to animation + a little lower 2026-06-18 ===== */
body.xivoz .xz-hero2-content{padding-left:clamp(40px,9vw,180px)!important;padding-top:clamp(180px,22vh,290px)!important}


/* ===== Hero: animation even higher 2026-06-18 ===== */
body.xivoz .xz-hero2-video{top:-10vh!important}
@media(min-width:640px){body.xivoz .xz-hero2-video{top:-10vh!important}}


/* Portfolio card photo slideshow (cross-fade) */
.xz-pcard-img .xz-pslideshow{position:absolute;inset:0}
.xz-pcard-img .xz-pslide{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:0;animation:xz-pfade 12s infinite}
.xz-pcard-img .xz-pslide:nth-child(1){animation-delay:0s}
.xz-pcard-img .xz-pslide:nth-child(2){animation-delay:4s}
.xz-pcard-img .xz-pslide:nth-child(3){animation-delay:8s}
@keyframes xz-pfade{0%{opacity:0}3%{opacity:1}36%{opacity:1}40%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.xz-pcard-img .xz-pslide{animation:none;opacity:0}.xz-pcard-img .xz-pslide:nth-child(1){opacity:1}}

/* ===== MOBILE HERO FIX 2026-06-23 — stack text above a contained video so the headline is readable (was: muted text overlapping the busy full-bleed video) ===== */
@media(max-width:760px){
  body.xivoz .xz-hero2{display:flex!important;flex-direction:column!important;min-height:auto!important;overflow:visible!important;padding-bottom:34px}
  body.xivoz .xz-hero2::before{display:none!important}
  body.xivoz .xz-hero2-content{order:1!important;max-width:none!important;margin:0!important;padding:clamp(94px,14vh,140px) 22px 0!important;transform:none!important;opacity:1!important}
  body.xivoz .xz-hero2-h{font-size:clamp(33px,8.4vw,46px)!important;line-height:1.08!important;letter-spacing:-.02em!important;max-width:18ch!important}
  body.xivoz .xz-hero2-actions{margin-top:26px!important}
  body.xivoz .xz-hero2-video{order:2!important;position:relative!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;width:100%!important;height:auto!important;aspect-ratio:1.15/1;margin:30px 0 0!important;border-radius:20px;overflow:hidden}
  body.xivoz .xz-hero2-video video{position:absolute!important;inset:0;width:100%!important;height:100%!important;object-fit:cover!important;mix-blend-mode:normal!important;-webkit-mask-image:none!important;mask-image:none!important}
}


/* Feature card image ratio fit */
body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-img{aspect-ratio:2.01/1;min-height:0;height:100%}
@media(max-width:760px){body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-img{align-self:auto}}


/* Feature cards (real projects) */
body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature{grid-column:1/-1;display:grid;grid-template-columns:1.7fr 1fr;align-items:stretch}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature .xz-pcard-img{aspect-ratio:2.01/1;min-height:0;height:100%}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature .xz-pcard-body{display:flex;flex-direction:column;justify-content:center;padding:clamp(34px,4vw,64px)}
@media(max-width:760px){body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature{grid-template-columns:1fr}}


/* ===== FLOKA-STYLE PORTFOLIO GRID (2026-06-19) ===== */
body.xivoz .xz-portfolio-grid{grid-template-columns:repeat(2,1fr);gap:clamp(20px,2.4vw,34px)}
body.xivoz .xz-portfolio-grid .xz-pcard{background:transparent;overflow:visible;border-radius:0}
body.xivoz .xz-portfolio-grid .xz-pcard:hover{transform:translateY(-6px);box-shadow:none}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature{grid-column:auto;display:block}
body.xivoz .xz-portfolio-grid .xz-pcard .xz-pcard-img,
body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-img,
body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature .xz-pcard-img{aspect-ratio:2/1;height:auto;min-height:0;border-radius:18px;overflow:hidden}
body.xivoz .xz-portfolio-grid .xz-pcard .xz-pcard-img>div{transition:transform .7s var(--ease)}
body.xivoz .xz-portfolio-grid .xz-pcard:hover .xz-pcard-img>div{transform:scale(1.05)}
body.xivoz .xz-pcard-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:0;padding:22px 26px;background:#fff;border-radius:14px;box-shadow:0 20px 44px -30px rgba(0,0,0,.6)}
body.xivoz .xz-pcard-foot h3{margin:0;font-family:'Outfit',sans-serif;font-size:clamp(15px,1.05vw,18px);font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#15161a;line-height:1.2}
body.xivoz .xz-pcard-foot .xz-pyear{font-size:14px;font-weight:500;color:#9aa0aa;letter-spacing:.04em;flex:none}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide{grid-column:1/-1!important;display:block!important}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide .xz-pcard-img{aspect-ratio:2/1!important;height:auto!important;min-height:0!important}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide h3{font-size:clamp(20px,2vw,30px)!important}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide .xz-pslide{animation:xz-pfade4 16s infinite}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide .xz-pslide:nth-child(1){animation-delay:0s}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide .xz-pslide:nth-child(2){animation-delay:4s}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide .xz-pslide:nth-child(3){animation-delay:8s}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-dmwide .xz-pslide:nth-child(4){animation-delay:12s}
@keyframes xz-pfade4{0%{opacity:0}2%{opacity:1}23%{opacity:1}26%{opacity:0}100%{opacity:0}}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-drn .xz-pslide{animation:xz-pfade2 12s infinite}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-drn .xz-pslide:nth-child(1){animation-delay:0s}
body.xivoz .xz-portfolio-grid .xz-pcard.xz-drn .xz-pslide:nth-child(2){animation-delay:6s}
@keyframes xz-pfade2{0%{opacity:0}3%{opacity:1}47%{opacity:1}50%{opacity:0}100%{opacity:0}}
body.xivoz .xz-portfolio-grid .xz-pcard .xz-pcard-img,body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature .xz-pcard-img,body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-img{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}
body.xivoz .xz-pcard-foot{border-top-left-radius:0!important;border-top-right-radius:0!important}
@media(max-width:760px){body.xivoz .xz-portfolio-grid{grid-template-columns:1fr}}

/* ===== FLOKA UNIFORM TILES — whole photos, never cropped (2026-06-19) ===== */
body.xivoz .xz-portfolio-grid{grid-template-columns:repeat(2,1fr);gap:clamp(20px,2.4vw,34px)}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child{grid-column:auto!important;display:block!important}
body.xivoz .xz-portfolio-grid .xz-pcard .xz-pcard-img,
body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-img,
body.xivoz .xz-portfolio-grid .xz-pcard.xz-feature .xz-pcard-img{aspect-ratio:2/1!important;height:auto!important;min-height:0!important;border-radius:16px;overflow:hidden}
body.xivoz .xz-portfolio-grid .xz-pcard .xz-pslide{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
@media(max-width:760px){body.xivoz .xz-portfolio-grid{grid-template-columns:1fr}}

/* normalize first tile to uniform floka card */
body.xivoz .xz-portfolio-grid .xz-pcard:first-child{display:block!important;grid-column:auto!important}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child h3{font-size:clamp(15px,1.05vw,18px)!important;line-height:1.2!important;margin:0!important;max-width:none!important}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child p{display:none!important}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-body{display:none!important}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child .xz-pcard-foot{display:flex!important}

/* ===== FLOKA-EXACT CARD OVERLAYS (2026-06-19) ===== */
body.xivoz .xz-portfolio-grid .xz-pcard-img{position:relative}
body.xivoz .xz-portfolio-grid .xz-pcard-img::before{content:'';position:absolute;left:20px;bottom:18px;z-index:4;color:#fff;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 1px 10px rgba(0,0,0,.55);pointer-events:none}
body.xivoz .xz-portfolio-grid .xz-pcard[data-cat='web'] .xz-pcard-img::before{content:'WEB DESIGN'}
body.xivoz .xz-portfolio-grid .xz-pcard[data-cat='dev'] .xz-pcard-img::before{content:'DEVELOPMENT'}
body.xivoz .xz-portfolio-grid .xz-pcard[data-cat='brand'] .xz-pcard-img::before{content:'BRANDING'}
body.xivoz .xz-portfolio-grid .xz-pcard[data-cat='auto'] .xz-pcard-img::before{content:'AUTOMATION'}
body.xivoz .xz-portfolio-grid .xz-pcard-img::after{content:'\2197';position:absolute;top:16px;right:16px;z-index:4;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.92);color:#111;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:600;opacity:0;transform:scale(.8);transition:opacity .3s,transform .3s;pointer-events:none}
body.xivoz .xz-portfolio-grid .xz-pcard:hover .xz-pcard-img::after{opacity:1;transform:scale(1)}

/* ===== FLOKA VARIED TILE SIZES (2026-06-19) ===== */
body.xivoz .xz-portfolio-grid{align-items:start}
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(1),
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(6){grid-column:1/-1!important;display:block!important}
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(1) .xz-pcard-img,
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(6) .xz-pcard-img{aspect-ratio:2/1!important}
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(1) h3,
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(6) h3{font-size:clamp(20px,2vw,30px)!important}
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(1) .xz-pcard-img::before,
body.xivoz .xz-portfolio-grid .xz-pcard:nth-child(6) .xz-pcard-img::before{font-size:13px}

body.xivoz .xz-vmark-chip{display:flex;align-items:center}
body.xivoz .xz-hdr-logo .xz-vmark{width:34px;height:auto;filter:drop-shadow(0 2px 5px rgba(0,0,0,.6))}


/* === XIVOZ LOGO LOCKUP (xi + V + oz) === */
body.xivoz .xz-hdr-logo{gap:0}
body.xivoz .xz-hdr-logo .xz-vmark{width:30px;height:34px;margin:0 -.04em;position:relative;top:.01em}
body.xivoz .xz-hdr-word.xz-hw-l{letter-spacing:.18em;padding-right:.06em}
body.xivoz .xz-hdr-word.xz-hw-r{letter-spacing:.18em;padding-left:.10em}


/* Final CTA box → shining black */
body.xivoz .xz-finalcta{background:linear-gradient(155deg,#26282e 0%,#121317 42%,#050608 100%)!important;border:1px solid hsl(0 0% 100%/.12)!important;color:#fff!important;box-shadow:0 40px 90px -40px rgba(0,0,0,.8),inset 0 1px 0 hsl(0 0% 100%/.14)!important;overflow:hidden}
body.xivoz .xz-finalcta::before{content:'';position:absolute;top:-40%;left:-10%;width:70%;height:140%;background:radial-gradient(60% 50% at 50% 0%,hsl(0 0% 100%/.16),transparent 70%);transform:rotate(-12deg);pointer-events:none;z-index:0}
body.xivoz .xz-finalcta>*{position:relative;z-index:1}
body.xivoz .xz-finalcta h2,body.xivoz .xz-finalcta h2 .xz-accent{color:#fff!important;-webkit-text-fill-color:#fff!important;background:none!important}
body.xivoz .xz-finalcta p{color:hsl(0 0% 100%/.78)!important}
/* Buttons on black */
body.xivoz .xz-finalcta .xz-btn.is-primary{background:linear-gradient(180deg,#ffffff,#d4d4da)!important;color:#0a0a0c!important;border:none!important;box-shadow:0 14px 34px -14px rgba(0,0,0,.7),inset 0 1px 0 #fff!important}
body.xivoz .xz-finalcta .xz-btn.is-primary:hover{background:linear-gradient(180deg,#fff,#e6e6ea)!important;transform:translateY(-2px)}
body.xivoz .xz-finalcta .xz-btn.is-ghost{background:hsl(0 0% 100%/.04)!important;color:#fff!important;border:1px solid hsl(0 0% 100%/.32)!important}
body.xivoz .xz-finalcta .xz-btn.is-ghost:hover{background:hsl(0 0% 100%/.10)!important;border-color:#fff!important;color:#fff!important}


/* Curtain -> pure black + horizontal xi V oz lockup */
#xz-curtain{background:#000!important}
.xz-curtain-logo{display:flex!important;align-items:center;justify-content:center;gap:.04em;font-size:0!important}
.xz-curtain-logo .xz-cv-l,.xz-curtain-logo .xz-cv-r{font-family:'Outfit','Inter',sans-serif;font-weight:600;font-size:clamp(44px,9vw,104px)!important;line-height:1;letter-spacing:.06em;background:linear-gradient(180deg,#8b9099 0%,#e2e4e8 48%,#787d85 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.xz-curtain-logo .xz-cv-l{padding-right:.02em}
.xz-curtain-logo .xz-cv-r{padding-left:.02em}
.xz-curtain-logo .xz-cv-mark{display:block;width:clamp(58px,12vw,132px);height:auto;filter:drop-shadow(0 14px 44px rgba(150,160,175,.28))}
#xz-curtain.cover-go .xz-curtain-logo .xz-cv-l,#xz-curtain.cover-go .xz-curtain-logo .xz-cv-r,#xz-curtain.cover-go .xz-curtain-logo .xz-cv-mark{opacity:1!important}


/* Curtain uses exact uploaded logo image */
.xz-curtain-logo .xz-curtain-img{display:block;width:clamp(400px,68vw,860px);height:auto}
#xz-curtain.cover-go .xz-curtain-logo .xz-curtain-img{opacity:1!important}


/* Header logo: XV image tile + xivoz wordmark */
body.xivoz .xz-hdr-logo{gap:10px!important;align-items:center}
body.xivoz .xz-hdr-xv{width:40px;height:40px;display:block;object-fit:contain;background:#000;border-radius:10px;box-shadow:0 4px 14px -6px rgba(0,0,0,.55)}
body.xivoz .xz-hdr-name{font-family:'Outfit','Inter',sans-serif;font-weight:600;font-size:20px;text-transform:lowercase;letter-spacing:.26em;line-height:1;padding-left:.04em;background:linear-gradient(180deg,#4a4e56 0%,#101216 52%,#3a3e46 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}


/* Header scrolls away (not fixed) */
body.xivoz .xz-hdr{position:absolute!important}

/* ===== Portfolio scroll-scrubbed fade (2026-06-23) ===== */
body.xivoz .xz-portfolio-grid .xz-pcard:not(:first-child){opacity:0;transform:translateY(44px);transition:none!important;will-change:opacity,transform}
body.xivoz .xz-portfolio-grid .xz-pcard:first-child{opacity:1!important;transform:none!important}
@media(prefers-reduced-motion:reduce){body.xivoz .xz-portfolio-grid .xz-pcard:not(:first-child){opacity:1!important;transform:none!important}}

/* LM Flowers Cakes card: never fades (2026-06-23) */
body.xivoz .xz-portfolio-grid .xz-pcard[href*='lmflowerscakes']{opacity:1!important;transform:none!important;transition:none!important}

/* First service card: never fade/scale (stacking effect starts from 2nd) */
body.xivoz .xz-section .xz-container>.xz-srow:first-child{opacity:1!important;transform:none!important}

/* Remove all section-enter scroll fading */
body.xivoz .xz-section>.xz-container,body.xivoz.xz-scrollfx .xz-section>.xz-container,body.xivoz .xz-bigmarquee{animation:none!important;opacity:1!important;transform:none!important}


/* ===== FLOKA MASONRY PORTFOLIO (remodel 2026-06-23) ===== */
body.xivoz .xz-masonry{display:grid;grid-template-columns:repeat(12,1fr);column-gap:clamp(36px,3.5vw,64px);align-items:start;margin-top:40px}
body.xivoz .xz-mcard{display:block;margin:0 0 clamp(40px,4.5vw,80px);text-decoration:none;color:inherit}
body.xivoz .xz-mcard-img{position:relative;width:100%;aspect-ratio:3/2;border-radius:20px;overflow:hidden;box-shadow:0 22px 54px -36px rgba(20,28,45,.5);transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
body.xivoz .xz-mcard-photo{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat;transform:scale(1.001);transition:transform .9s var(--ease)}
body.xivoz .xz-mcard:hover .xz-mcard-img{transform:translateY(-5px);box-shadow:0 40px 80px -40px rgba(20,28,45,.55)}
body.xivoz .xz-mcard:hover .xz-mcard-photo{transform:scale(1.055)}
/* Floka rhythm: big left + lower-offset right, then a centered single */
body.xivoz .xz-mcard:nth-child(3n+2){grid-column:1/6;margin-top:0}
body.xivoz .xz-mcard:nth-child(3n+3){grid-column:8/13;margin-top:0}
body.xivoz .xz-mcard:nth-child(3n+1){grid-column:2/12;margin-bottom:clamp(40px,4.5vw,80px)}
body.xivoz .xz-mcard:nth-child(3n+2) .xz-mcard-img{aspect-ratio:16/10}
body.xivoz .xz-mcard:nth-child(3n+3) .xz-mcard-img{aspect-ratio:4/3}
body.xivoz .xz-mcard:nth-child(3n+1) .xz-mcard-img{aspect-ratio:2/1}
/* Cosa Nostra full-width hero (top single big box, 2026-06-25) */
body.xivoz .xz-mcard.xz-mcard-hero{grid-column:1/-1!important;margin-top:0!important;margin-bottom:clamp(40px,4.5vw,80px)!important}
body.xivoz .xz-mcard.xz-mcard-hero .xz-mcard-img{aspect-ratio:5/2!important}
body.xivoz .xz-mcard-meta{padding:34px 4px 0}
body.xivoz .xz-mcard-meta h3{font-family:'Outfit',sans-serif;font-size:clamp(17px,1.35vw,21px);font-weight:600;letter-spacing:.005em;line-height:1.25;color:#16171c;margin:0 0 8px;transition:color .3s var(--ease)}
body.xivoz .xz-mcard:hover .xz-mcard-meta h3{color:hsl(var(--secondary))}
body.xivoz .xz-mcard-tags{display:flex;flex-wrap:wrap;gap:7px 14px}
body.xivoz .xz-mcard-tags span{font-size:13px;color:#8a909c;letter-spacing:.01em;text-transform:lowercase;position:relative}
body.xivoz .xz-mcard-tags span+span::before{content:'';position:absolute;left:-8px;top:50%;width:3px;height:3px;margin-top:-1px;border-radius:50%;background:#c7ccd4}
@media(max-width:900px){body.xivoz .xz-masonry{grid-template-columns:1fr}body.xivoz .xz-mcard{grid-column:1/-1!important;margin-top:0!important}body.xivoz .xz-mcard .xz-mcard-img{aspect-ratio:3/2!important}}
@media(prefers-reduced-motion:reduce){body.xivoz .xz-mcard-photo,body.xivoz .xz-mcard-img{transition:none}}

/* ============================================================
   XIVOZ MOBILE FIXES 2026-06-24
   ============================================================ */

/* (3) SERVICES black boxes edge-to-edge on mobile — wider, not longer */
@media(max-width:768px){
  body.xivoz .xz-section > .xz-container{max-width:100%!important}
  body.xivoz .xz-srow{
    margin-left:-24px!important; margin-right:-24px!important; width:auto!important;
    border-radius:0!important; border-left:0!important; border-right:0!important;
    padding:30px 22px!important;
  }
}

/* (2) HERO video color seam on mobile — feather edges into the lavender bg */
@media(max-width:760px){
  body.xivoz .xz-hero2-video{border-radius:0!important; aspect-ratio:1.3/1}
  body.xivoz .xz-hero2-video video{
    -webkit-mask-image:radial-gradient(125% 115% at 50% 42%,#000 52%,transparent 100%)!important;
    mask-image:radial-gradient(125% 115% at 50% 42%,#000 52%,transparent 100%)!important;
    -webkit-mask-repeat:no-repeat!important; mask-repeat:no-repeat!important;
  }
}

/* (1) Section scroll reveal on iOS Safari (no animation-timeline support) */
@supports not (animation-timeline: view()){
  body.xivoz .xz-section > .xz-container,
  body.xivoz .xz-bigmarquee{
    opacity:0; transform:translateY(60px) scale(.985);
    transition:opacity .8s var(--ease),transform .9s var(--ease); will-change:opacity,transform;
  }
  body.xivoz .xz-section.inView > .xz-container,
  body.xivoz .xz-bigmarquee.inView{opacity:1; transform:none}
}
@media(prefers-reduced-motion:reduce){
  body.xivoz .xz-section > .xz-container,
  body.xivoz .xz-bigmarquee{opacity:1!important; transform:none!important}
}

/* (4) SERVICES — sticky-stack: each box pins to top, next stacks over it (mobile) */
@media(max-width:768px){
  body.xivoz .xz-section > .xz-container{overflow:visible!important}
  body.xivoz .xz-section > .xz-container > .xz-srow{
    position:sticky!important; top:0!important;
    margin-bottom:0!important;
    box-shadow:0 -18px 40px rgba(0,0,0,.55)!important;
  }
  body.xivoz .xz-section > .xz-container > .xz-srow:last-child{margin-bottom:0!important}
}

/* HERO VIDEO BG MATCH 2026-06-24 v2: tight feathered mask -> only head shows, page bg everywhere else (no tint) */
body.xivoz .xz-hero2-video video{mix-blend-mode:normal!important}
@media(max-width:760px){
  body.xivoz .xz-hero2-video video{
    mix-blend-mode:normal!important;
    -webkit-mask-image:radial-gradient(68% 80% at 50% 46%,#000 34%,rgba(0,0,0,.6) 56%,transparent 74%)!important;
    mask-image:radial-gradient(68% 80% at 50% 46%,#000 34%,rgba(0,0,0,.6) 56%,transparent 74%)!important;
    -webkit-mask-repeat:no-repeat!important; mask-repeat:no-repeat!important;
    -webkit-mask-position:center!important; mask-position:center!important;
  }
}


/* HERO VIDEO BIGGER 2026-06-24: enlarge the masked head animation on mobile */
@media(max-width:760px){
  body.xivoz .xz-hero2-video{aspect-ratio:1/1.05!important; margin-left:-24px!important; margin-right:-24px!important; width:calc(100% + 48px)!important;}
}


/* HERO TEXT-VIDEO GAP 2026-06-24: tighten space between hero text and animation on mobile */
@media(max-width:760px){
  body.xivoz .xz-hero2-video{margin-top:-88px!important;}
}

/* ===== PORTFOLIO NATIVE-ELEMENTOR REBUILD (2026-06-24) ===== */
body.xivoz .xz-mcard{position:relative}
body.xivoz img.xz-mcard-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
body.xivoz .xz-mcard-link{position:absolute;inset:0;z-index:6;display:block;font-size:0;color:transparent}

/* ===== SERVICES first-box cinematic entrance (2026-06-24) ===== */
@media(prefers-reduced-motion:no-preference){
  body.page-id-30 .xz-section>.xz-container>.xz-srow:first-child{opacity:0!important;transform:translateY(64px) scale(.93)!important;filter:blur(16px);transition:opacity 1.05s cubic-bezier(.16,1,.3,1),transform 1.15s cubic-bezier(.16,1,.3,1),filter .9s ease}
  body.page-id-30 .xz-section>.xz-container>.xz-srow:first-child.xz-firstin{opacity:1!important;transform:none!important;filter:blur(0)}
  body.page-id-30 .xz-srow:first-child>div:first-child>*{opacity:0;transform:translateY(26px);transition:opacity .85s ease,transform .95s cubic-bezier(.16,1,.3,1)}
  body.page-id-30 .xz-srow:first-child.xz-firstin>div:first-child>*{opacity:1;transform:none}
  body.page-id-30 .xz-srow:first-child.xz-firstin>div:first-child>*:nth-child(1){transition-delay:.18s}
  body.page-id-30 .xz-srow:first-child.xz-firstin>div:first-child>*:nth-child(2){transition-delay:.27s}
  body.page-id-30 .xz-srow:first-child.xz-firstin>div:first-child>*:nth-child(3){transition-delay:.36s}
  body.page-id-30 .xz-srow:first-child.xz-firstin>div:first-child>*:nth-child(4){transition-delay:.45s}
  body.page-id-30 .xz-srow:first-child.xz-firstin>div:first-child>*:nth-child(5){transition-delay:.54s}
  body.page-id-30 .xz-srow:first-child .xz-srow-media{clip-path:inset(0 0 100% 0);transition:clip-path 1.15s cubic-bezier(.16,1,.3,1) .25s}
  body.page-id-30 .xz-srow:first-child.xz-firstin .xz-srow-media{clip-path:inset(0 0 0 0)}
}


/* ===== SERVICES "How we work" — connected process timeline (2026-06-24) ===== */
body.page-id-30 .xz-process, body.page-id-13 .xz-process{position:relative;padding-top:44px;gap:22px}
body.page-id-30 .xz-process::before, body.page-id-13 .xz-process::before{content:'';position:absolute;left:12.5%;right:12.5%;top:17px;height:2px;border-radius:2px;background:hsl(var(--foreground)/.14);z-index:1}
body.page-id-30 .xz-process::after, body.page-id-13 .xz-process::after{content:'';position:absolute;left:12.5%;right:12.5%;top:17px;height:2px;border-radius:2px;background:linear-gradient(90deg,hsl(var(--foreground)),hsl(var(--foreground)/.25));z-index:2;clip-path:inset(0 100% 0 0)}
@supports (animation-timeline:view()){body.page-id-30 .xz-process::after, body.page-id-13 .xz-process::after{animation:xz-proc-draw linear both;animation-timeline:view();animation-range:entry 20% cover 45%}}
@supports not (animation-timeline:view()){body.page-id-30 .xz-process:has(.xz-reveal.in)::after, body.page-id-13 .xz-process:has(.xz-reveal.in)::after{clip-path:inset(0 0 0 0);transition:clip-path 1.6s cubic-bezier(.16,1,.3,1)}}
@keyframes xz-proc-draw{to{clip-path:inset(0 0 0 0)}}
@keyframes xz-proc-draw-v{to{clip-path:inset(0 0 0 0)}}
body.page-id-30 .xz-step, body.page-id-13 .xz-step{position:relative;z-index:3;background:linear-gradient(180deg,#ffffff,#f3f4f8)!important;border:1px solid hsl(var(--foreground)/.10)!important;border-top:1px solid hsl(var(--foreground)/.10)!important;border-radius:18px!important;padding:30px 24px 26px!important;transition:transform .55s cubic-bezier(.16,1,.3,1),box-shadow .55s,border-color .4s}
body.page-id-30 .xz-step::after, body.page-id-13 .xz-step::after{display:none!important}
body.page-id-30 .xz-step::before, body.page-id-13 .xz-step::before{content:'';position:absolute;top:-34px;left:calc(50% - 8px);width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid hsl(var(--foreground)/.30);box-shadow:0 0 0 5px #E7E9F1;z-index:4;transition:border-color .4s,background .4s,transform .4s}
body.page-id-30 .xz-step-num, body.page-id-13 .xz-step-num{font-size:46px!important;line-height:1;margin-bottom:16px!important;background:linear-gradient(180deg,hsl(var(--foreground)/.55),hsl(var(--foreground)/.18))!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;transition:filter .4s}
body.page-id-30 .xz-step h3, body.page-id-13 .xz-step h3{font-size:20px!important;margin-bottom:8px}
@media(hover:hover){
  body.page-id-30 .xz-step:hover, body.page-id-13 .xz-step:hover{transform:translateY(-10px);border-color:hsl(var(--foreground)/.35)!important;box-shadow:0 24px 50px -22px rgba(10,10,14,.45)}
  body.page-id-30 .xz-step:hover::before, body.page-id-13 .xz-step:hover::before{background:hsl(var(--foreground));border-color:hsl(var(--foreground));transform:scale(1.18)}
  body.page-id-30 .xz-step:hover .xz-step-num, body.page-id-13 .xz-step:hover .xz-step-num{background:linear-gradient(180deg,hsl(var(--foreground)),hsl(var(--foreground)/.5))!important;-webkit-background-clip:text!important;background-clip:text!important}
}
body.page-id-30 .xz-process .xz-reveal, body.page-id-13 .xz-process .xz-reveal{transform:translateY(38px)!important;opacity:0;transition:opacity .8s ease,transform .9s cubic-bezier(.16,1,.3,1)}
body.page-id-30 .xz-process .xz-reveal.in, body.page-id-13 .xz-process .xz-reveal.in{transform:none!important;opacity:1}
body.page-id-30 .xz-process .xz-step:nth-child(1), body.page-id-13 .xz-process .xz-step:nth-child(1){transition-delay:.05s}
body.page-id-30 .xz-process .xz-step:nth-child(2), body.page-id-13 .xz-process .xz-step:nth-child(2){transition-delay:.15s}
body.page-id-30 .xz-process .xz-step:nth-child(3), body.page-id-13 .xz-process .xz-step:nth-child(3){transition-delay:.25s}
body.page-id-30 .xz-process .xz-step:nth-child(4), body.page-id-13 .xz-process .xz-step:nth-child(4){transition-delay:.35s}
@media(max-width:768px){
  body.page-id-30 .xz-process, body.page-id-13 .xz-process{grid-template-columns:1fr!important;padding-top:0;padding-left:36px;gap:16px}
  body.page-id-30 .xz-process::before, body.page-id-13 .xz-process::before{left:9px;right:auto;top:12px;bottom:12px;width:2px;height:auto}
  body.page-id-30 .xz-process::after, body.page-id-13 .xz-process::after{left:9px;right:auto;top:12px;bottom:12px;width:2px;height:auto;background:linear-gradient(180deg,hsl(var(--foreground)),hsl(var(--foreground)/.25));clip-path:inset(0 0 100% 0)}
  @supports (animation-timeline:view()){body.page-id-30 .xz-process::after, body.page-id-13 .xz-process::after{animation:xz-proc-draw-v linear both;animation-timeline:view();animation-range:entry 10% cover 65%}}
  @supports not (animation-timeline:view()){body.page-id-30 .xz-process:has(.xz-reveal.in)::after, body.page-id-13 .xz-process:has(.xz-reveal.in)::after{clip-path:inset(0 0 0 0)}}
  body.page-id-30 .xz-step, body.page-id-13 .xz-step{padding:22px 20px!important}
  body.page-id-30 .xz-step::before, body.page-id-13 .xz-step::before{top:24px;left:-34px}
  body.page-id-30 .xz-step-num, body.page-id-13 .xz-step-num{font-size:38px!important;margin-bottom:10px!important}
}

/* ===== SERVICES srow: wider + breathing space before stacking (2026-06-24) ===== */
@media(min-width:769px){
  body.page-id-30 .xz-section > .xz-container:has(> .xz-srow){max-width:1500px}
  body.page-id-30 .xz-section > .xz-container > .xz-srow{margin-bottom:34px}
  body.page-id-30 .xz-section > .xz-container > .xz-srow:last-child{margin-bottom:0}
}

/* ===== SERVICES How-we-work: match srow width (2026-06-24) ===== */
@media(min-width:769px){
  body.page-id-30 .xz-section > .xz-container:has(> .xz-process){max-width:1500px}
}


/* Final CTA: re-center paragraph (global body.xivoz p{margin:0} had killed the auto-centering) */
body.xivoz .xz-finalcta p{max-width:560px;margin:0 auto 36px;text-align:center}


/* pin-fix: keep header fixed -- a transform/filter on html/body (from theme/Elementor) silently breaks position:fixed, so force them off on the header's ancestors */
html{transform:none!important;filter:none!important;perspective:none!important}
body.xivoz{transform:none!important;filter:none!important;perspective:none!important}


/* open menu scrolls away with the page: panel moved to <body> by JS, positioned absolute in document flow; only the MENU button stays pinned */
.xz-menu-panel{position:absolute!important;top:64px;right:clamp(16px,4vw,40px);left:auto;z-index:190}
@media(max-width:900px){.xz-menu-panel{right:16px;left:16px;width:auto}}
.xz-menu-panel.is-open .xz-menu-card{opacity:1;transform:none;visibility:visible;pointer-events:auto}
.xz-menu-panel.is-open .xz-menu-link{opacity:1;transform:none}
.xz-menu-panel.is-open .xz-menu-link:nth-child(1){transition-delay:.08s,.08s,0s,0s}
.xz-menu-panel.is-open .xz-menu-link:nth-child(2){transition-delay:.13s,.13s,0s,0s}
.xz-menu-panel.is-open .xz-menu-link:nth-child(3){transition-delay:.18s,.18s,0s,0s}
.xz-menu-panel.is-open .xz-menu-link:nth-child(4){transition-delay:.23s,.23s,0s,0s}


/* faster menu open + snappy pop */
.xz-menu-card{transition:opacity .18s ease,transform .28s cubic-bezier(.34,1.56,.64,1),visibility 0s .28s}
.xz-menu-panel.is-open .xz-menu-card{transition:opacity .16s ease,transform .3s cubic-bezier(.34,1.56,.64,1),visibility 0s 0s}
.xz-menu-link{transition:opacity .22s ease,transform .3s cubic-bezier(.34,1.56,.64,1),background-color .2s ease,color .2s ease}
.xz-menu-panel.is-open .xz-menu-link:nth-child(1){transition-delay:.05s,.05s,0s,0s}
.xz-menu-panel.is-open .xz-menu-link:nth-child(2){transition-delay:.09s,.09s,0s,0s}
.xz-menu-panel.is-open .xz-menu-link:nth-child(3){transition-delay:.13s,.13s,0s,0s}
.xz-menu-panel.is-open .xz-menu-link:nth-child(4){transition-delay:.17s,.17s,0s,0s}


/* ===== Floka-style Let's talk now CTA ===== */
.xz-finalcta.xz-lt{padding:clamp(48px,6vw,96px) 16px;overflow:hidden}
.xz-lt-link{position:relative;display:block;text-decoration:none}
.xz-lt-h{margin:0;text-align:center;font-family:'Outfit','Roboto',sans-serif;font-weight:700;line-height:.9;letter-spacing:-.035em;font-size:clamp(58px,14.5vw,210px)}
.xz-lt-h span{display:block;background:linear-gradient(180deg,#eef0f3 0%,#bcbec5 30%,#74767d 52%,rgba(120,122,130,.22) 80%,transparent 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.xz-lt-badge{position:absolute;left:50%;top:60%;transform:translate(-50%,-50%);width:clamp(116px,11vw,166px);height:clamp(116px,11vw,166px);display:flex;align-items:center;justify-content:center;pointer-events:none}
.xz-lt-ring{position:absolute;inset:0;width:100%;height:100%;animation:xz-lt-spin 18s linear infinite}
.xz-lt-ring text{font-family:'Inter',sans-serif;font-size:14px;font-weight:600;letter-spacing:.2em;fill:rgba(255,255,255,.82)}
.xz-lt-arrow{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;width:52px;height:52px;color:#fff;transition:transform .45s cubic-bezier(.22,1,.36,1)}
.xz-lt-arrow svg{width:32px;height:32px}
.xz-lt-link:hover .xz-lt-arrow{transform:translateX(6px)}
.xz-lt-link:hover .xz-lt-ring{animation-duration:7s}
@keyframes xz-lt-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.xz-lt-ring{animation:none}}
@media(max-width:760px){.xz-lt-h{font-size:clamp(54px,17vw,92px)}.xz-lt-badge{top:62%;width:104px;height:104px}.xz-lt-arrow{width:44px;height:44px}.xz-lt-arrow svg{width:26px;height:26px}}

/* xz-lt near-black bg to match Floka (text fades into it) */
body.xivoz .xz-finalcta.xz-lt{background:#0a0a0c!important;border:1px solid hsl(0 0% 100%/.06)!important}


/* ===== FLOKA-STYLE "LET'S TALK" CTA BAND (2026-06-25) ===== */
.xz-letstalk{position:relative;background:hsl(var(--ink));padding:130px 0;overflow:hidden;border-top:1px solid hsl(0 0% 100%/.06)}
.xz-letstalk::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 130% at 50% 0%,hsl(240 8% 11%),hsl(var(--ink)));pointer-events:none}
.xz-lt-inner{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:48px;flex-wrap:wrap}
.xz-lt-title{margin:0;font-family:"Outfit",sans-serif;font-weight:700;line-height:.92;letter-spacing:-.02em;font-size:clamp(54px,10vw,150px)}
.xz-lt-badge{position:relative;flex:0 0 auto;width:172px;height:172px;display:grid;place-items:center;border-radius:50%;text-decoration:none;transition:transform .55s var(--ease)}
.xz-lt-badge:hover{transform:scale(1.06)}
.xz-lt-spin{position:absolute;inset:0;display:block;animation:xz-lt-rotate 18s linear infinite;transform-origin:50% 50%}
.xz-lt-spin img{width:100%;height:100%;display:block}
.xz-lt-arrow{position:relative;z-index:1;display:grid;place-items:center;transition:transform .45s var(--ease)}
.xz-lt-arrow svg{width:46px;height:auto;display:block}
.xz-lt-arrow svg path{fill:#fff}
.xz-lt-badge:hover .xz-lt-arrow{transform:translateX(5px)}
@keyframes xz-lt-rotate{to{transform:rotate(360deg)}}
@media(max-width:760px){.xz-letstalk{padding:88px 0}.xz-lt-inner{flex-direction:column;text-align:center;gap:34px}.xz-lt-title{font-size:clamp(46px,15vw,86px)}.xz-lt-badge{width:148px;height:148px}}
@media(prefers-reduced-motion:reduce){.xz-lt-spin{animation:none}.xz-lt-badge,.xz-lt-arrow{transition:none}}

/* ===== Boxed contact form inside the "Let's talk" band (2026-06-25) ===== */
.xz-letstalk .xz-lt-box{background:hsl(220 16% 96%);border:1px solid hsl(220 14% 88%);border-radius:32px;padding:clamp(28px,3.5vw,56px);margin-bottom:clamp(48px,6vw,72px);box-shadow:0 36px 90px rgba(0,0,0,.28);color:hsl(var(--foreground))}
.xz-letstalk .xz-lt-box .xz-contact-info h2,.xz-letstalk .xz-lt-box .xz-cinfo-row b,.xz-letstalk .xz-lt-box .xz-field label{color:hsl(var(--foreground))}
.xz-letstalk .xz-lt-inner{margin-top:0}
/* Dedupe: hide each page's own inline contact-form section — the band now carries the single form. */
body.xivoz #contact{display:none!important}
body.xivoz .xz-section:has(.xz-form){display:none!important}
@media(max-width:760px){.xz-letstalk .xz-lt-box{padding:22px;border-radius:24px}}

/* ===== Hero headline size bump (2026-06-25) ===== */
@media(min-width:761px){body.xivoz .xz-hero2-h{font-size:clamp(54px,7.4vw,134px)!important;line-height:1.01!important;letter-spacing:-.035em!important;max-width:min(840px,60vw)!important}}
@media(max-width:760px){body.xivoz .xz-hero2-h{font-size:clamp(40px,10.5vw,62px)!important;line-height:1.05!important;max-width:16ch!important}}

/* ===== Expertise rows + adaptive cursor (2026-06-25) ===== */
/* a) slightly larger expertise row titles (overrides the section inline <style>) */
body.xivoz .xz-xpsec .xz-xp-t{font-size:clamp(18px,1.7vw,23px)!important}
/* b) centre the row text on mobile */
@media(max-width:760px){
  body.xivoz .xz-xpsec .xz-xp-q{justify-content:center!important;text-align:center}
  body.xivoz .xz-xpsec .xz-xp-t{font-size:clamp(17px,5vw,22px)!important;text-align:center}
}
/* c) custom cursor inverts against whatever is behind it */
@media(pointer:fine){
  body.xz-has-cursor .xz-cursor{background:#fff!important;box-shadow:none!important;mix-blend-mode:difference}
  body.xz-has-cursor .xz-cursor-ring{border-color:#fff!important;mix-blend-mode:difference}
  body.xz-has-cursor .xz-cursor-ring.grow{background:rgba(255,255,255,.22)!important;border-color:transparent!important}
  body.xz-has-cursor .xz-cursor-ring.view{mix-blend-mode:normal;background:hsl(var(--primary))!important;border-color:transparent!important}
}

/* ===== Expertise mobile: centre plus + title + expanded panel (2026-06-25) ===== */
@media(max-width:760px){
  body.xivoz .xz-xpsec .xz-xp-q{justify-content:center!important;gap:18px!important;text-align:center!important}
  body.xivoz .xz-xpsec .xz-xp-a-grid{grid-template-columns:1fr!important;padding:4px 16px 30px!important;gap:22px!important;justify-items:center!important;text-align:center!important}
  body.xivoz .xz-xpsec .xz-xp-txt{text-align:center!important}
  body.xivoz .xz-xpsec .xz-xp-desc{margin-left:auto!important;margin-right:auto!important;max-width:44ch!important}
  body.xivoz .xz-xpsec .xz-xp-tags{justify-content:center!important}
}

/* ===== Expertise mobile: align all pluses to a fixed left, keep text centred (2026-06-25) ===== */
@media(max-width:760px){
  body.xivoz .xz-xpsec .xz-xp-q{position:relative!important;justify-content:center!important;gap:0!important;padding-left:10px!important;padding-right:10px!important}
  body.xivoz .xz-xpsec .xz-xp-btn{position:absolute!important;left:10px!important;top:50%!important;transform:translateY(-50%)!important;margin:0!important}
  body.xivoz .xz-xpsec .xz-xp-t{text-align:center!important;padding:0 58px!important;width:100%!important}
}


/* ===== Mobile: unify hero text + head animation into one section (2026-06-25) ===== */
@media(max-width:760px){
  body.xivoz .xz-hero2{padding-bottom:0!important}
  body.xivoz .xz-hero2-content{position:relative!important;z-index:2!important;padding-bottom:0!important}
  body.xivoz .xz-hero2-actions{margin-top:22px!important}
  body.xivoz .xz-hero2-video{z-index:1!important;margin-top:-15vh!important;aspect-ratio:1/1.08!important}
  body.xivoz .xz-hero2-video video{
    -webkit-mask-image:radial-gradient(84% 98% at 50% 38%,#000 46%,rgba(0,0,0,.55) 66%,transparent 84%)!important;
    mask-image:radial-gradient(84% 98% at 50% 38%,#000 46%,rgba(0,0,0,.55) 66%,transparent 84%)!important;
    -webkit-mask-repeat:no-repeat!important; mask-repeat:no-repeat!important;
    -webkit-mask-position:center!important; mask-position:center!important;
  }
}

/* ===== Mobile: centre the expertise separator lines (2026-06-25) ===== */
@media(max-width:760px){
  body.xivoz .xz-xpsec .xz-xp-acc{border-top:0!important;position:relative}
  body.xivoz .xz-xpsec .xz-xp-item{border-bottom:0!important;position:relative}
  body.xivoz .xz-xpsec .xz-xp-acc::before,
  body.xivoz .xz-xpsec .xz-xp-item::after{
    content:"";position:absolute;left:50%;transform:translateX(-50%);
    width:80%;height:1px;background:rgba(255,255,255,.12);pointer-events:none;
  }
  body.xivoz .xz-xpsec .xz-xp-acc::before{top:0}
  body.xivoz .xz-xpsec .xz-xp-item::after{bottom:0}
}

/* ===== Mobile: extend separator lines, space headers, shrink section padding (2026-06-25) ===== */
@media(max-width:760px){
  body.xivoz .xz-xpsec .xz-xp-acc::before,
  body.xivoz .xz-xpsec .xz-xp-item::after{width:95%!important}
  body.xivoz .xz-xpsec .xz-xp-item{margin-bottom:12px!important}
  body.xivoz .xz-xpsec{padding-top:42px!important;padding-bottom:40px!important}
}

/* ===== Process section: follow standard page width (2026-06-25) ===== */
body.xivoz #process > .xz-container{max-width:1440px!important;margin-left:auto!important;margin-right:auto!important;padding-left:24px!important;padding-right:24px!important;}

/* ===== "Let's talk" band redesigned as image-2 contact section (2026-06-25) ===== */
body.xivoz .xz-letstalk{padding:clamp(70px,9vw,128px) 0!important}
body.xivoz .xz-letstalk > .xz-container{max-width:1500px!important}
body.xivoz .xz-letstalk .xz-lt-inner{display:none!important}
body.xivoz .xz-letstalk .xz-lt-box{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important}
body.xivoz .xz-letstalk .xz-contact-grid{grid-template-columns:0.9fr 1.1fr!important;gap:clamp(36px,5vw,80px)!important;align-items:center!important}
/* left column on dark */
body.xivoz .xz-letstalk .xz-contact-info h2{color:#fff!important;font-size:clamp(34px,4.4vw,56px)!important}
body.xivoz .xz-letstalk .xz-contact-info .lead{color:hsl(0 0% 100%/.6)!important}
body.xivoz .xz-letstalk .xz-cinfo-row b{color:hsl(0 0% 100%/.5)!important}
body.xivoz .xz-letstalk .xz-cinfo-row span{color:hsl(0 0% 100%/.92)!important}
body.xivoz .xz-letstalk .xz-cinfo-row .ic{background:hsl(0 0% 100%/.08)!important}
body.xivoz .xz-letstalk .xz-cinfo-row .ic svg{stroke:#fff!important}
body.xivoz .xz-letstalk .xz-socials a{background:hsl(0 0% 100%/.08)!important;border:1px solid hsl(0 0% 100%/.14)!important}
body.xivoz .xz-letstalk .xz-socials svg{fill:#fff!important}
/* white form card */
body.xivoz .xz-letstalk .xz-form{background:#fff!important;border:1px solid rgba(0,0,0,.06)!important;box-shadow:0 50px 110px -30px rgba(0,0,0,.7)!important;border-radius:26px!important;padding:clamp(26px,2.4vw,42px)!important}
body.xivoz .xz-letstalk .xz-form .xz-form-inner::before{content:"Have a project in mind?";display:block;font-family:"Outfit",sans-serif;font-weight:600;font-size:clamp(20px,2vw,24px);color:#15171c;margin-bottom:22px}
body.xivoz .xz-letstalk .xz-field label{color:#5b606b!important}
body.xivoz .xz-letstalk .xz-field input,body.xivoz .xz-letstalk .xz-field select,body.xivoz .xz-letstalk .xz-field textarea{background:#f3f4f7!important;border:1px solid rgba(0,0,0,.10)!important;color:#15171c!important}
body.xivoz .xz-letstalk .xz-field input::placeholder,body.xivoz .xz-letstalk .xz-field textarea::placeholder{color:#9aa0ab!important}
body.xivoz .xz-letstalk .xz-form .xz-btn{background:#111!important;color:#fff!important;border:0!important}
body.xivoz .xz-letstalk .xz-form-success h3{color:#15171c!important}
body.xivoz .xz-letstalk .xz-form-success p{color:#5b606b!important}
@media(max-width:860px){
  body.xivoz .xz-letstalk .xz-contact-grid{grid-template-columns:1fr!important;align-items:stretch!important}
}
/* ===== Portfolio: disable scroll reveal (2026-06-25) ===== */
body.xivoz .xz-masonry .xz-mcard.xz-reveal,body.xivoz .xz-masonry .xz-mcard.xz-reveal.in{opacity:1!important;transform:none!important;transition:none!important}

/* ===== Portfolio: tighten hero->grid gap (2026-06-25) ===== */
body.page-id-31 .xz-pagehero{padding-bottom:20px}
body.page-id-31 .xz-section{padding-top:24px}
body.page-id-31 .xz-masonry{margin-top:8px}

/* ===== Portfolio: slightly more gap between L/R cards only (2026-06-25) ===== */
body.page-id-31 .xz-mcard:nth-child(3n+1){margin-right:48px}
body.page-id-31 .xz-mcard:nth-child(3n+2){margin-left:48px}
@media(max-width:900px){body.page-id-31 .xz-mcard{margin-left:0!important;margin-right:0!important}}

/* ===== Portfolio: nudge right cards lower (2026-06-25) ===== */
body.page-id-31 .xz-mcard:nth-child(3n+2){margin-top:clamp(120px,12vw,280px)}
@media(max-width:900px){body.page-id-31 .xz-mcard:nth-child(3n+2){margin-top:0!important}}

/* Footer solid black to match logo box */
body.xivoz .xz-footer{background:#000!important}


/* ===== PORTFOLIO RESULT METRIC (how we helped, 2026-06-25) ===== */
body.xivoz .xz-mcard-metric{display:flex;align-items:baseline;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid rgba(20,28,45,.12)}
body.xivoz .xz-mcard-metric-num{font-family:'Outfit',sans-serif;font-weight:700;font-size:clamp(22px,2.1vw,30px);line-height:1;letter-spacing:-.01em;background:linear-gradient(92deg,hsl(var(--foreground)),hsl(var(--primary)));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.xivoz .xz-mcard-metric-lbl{font-family:'Open Sans',sans-serif;font-size:clamp(12px,1vw,13.5px);font-weight:500;color:hsl(220 10% 42%);letter-spacing:.01em}

/* ===== Home selected work: rounded editorial showcase (2026-06-25) ===== */
body.xivoz #work{background:#e6e9f2!important;margin:0!important;padding:0!important;box-shadow:none!important;overflow:hidden}
body.xivoz #work>.xz-container{max-width:none!important;width:100%!important;background:#E7E9F1!important;border-radius:0!important;padding:clamp(52px,5.8vw,108px) clamp(18px,2vw,38px) clamp(62px,5.6vw,104px)!important;box-shadow:none!important;overflow:hidden}
body.xivoz #work .xz-section-head{display:block!important;position:relative!important;max-width:none!important;margin:0 auto clamp(42px,5vw,82px)!important;padding:0!important;text-align:center!important;min-height:clamp(230px,27vw,420px)!important;counter-reset:none!important}
body.xivoz #work .xz-section-head::before{display:none!important;content:none!important}
body.xivoz #work .xz-section-head .xz-eyebrow,body.xivoz #work .xz-section-head p{display:none!important}
body.xivoz #work .xz-section-head h2{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;margin:0!important;max-width:none!important;width:100%!important;font-family:'Outfit','Inter',sans-serif!important;font-weight:500!important;line-height:.86!important;letter-spacing:-.055em!important;color:transparent!important;font-size:0!important;clip-path:none!important;text-align:center!important}
body.xivoz #work .xz-section-head h2::before{content:"Selected";display:block;color:#050505;font-size:clamp(88px,10vw,182px);letter-spacing:-.055em}
body.xivoz #work .xz-section-head h2::after{content:"creative works";display:block;margin-top:.18em;color:rgba(0,0,0,.10);font-size:clamp(72px,8.4vw,150px);letter-spacing:-.06em}
@media(max-width:520px){body.xivoz #work .xz-section-head{min-height:150px!important;margin-bottom:18px!important}body.xivoz #work .xz-section-head h2::before{font-size:76px!important}body.xivoz #work .xz-section-head h2::after{font-size:54px!important;margin-top:.08em!important}}
body.xivoz #work .xz-portfolio-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:clamp(22px,2.6vw,52px) clamp(18px,1.2vw,28px)!important;counter-reset:none!important;align-items:start!important}
body.xivoz #work .xz-pcard{position:relative!important;display:block!important;overflow:hidden!important;border:0!important;border-radius:22px!important;background:#ddd!important;box-shadow:none!important;transform:none!important;min-height:0!important;isolation:isolate!important;counter-increment:none!important}
body.xivoz #work .xz-pcard:first-child{grid-column:1/-1!important;display:block!important}
body.xivoz #work .xz-pcard:hover{transform:none!important;box-shadow:none!important;border-color:transparent!important;z-index:1!important}
body.xivoz #work .xz-pcard-img{position:relative!important;width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:2.03/1!important;overflow:hidden!important;border-radius:22px!important;background:#d9d9d9!important}
body.xivoz #work .xz-pcard:not(:first-child) .xz-pcard-img{aspect-ratio:1.42/1!important}
body.xivoz #work .xz-pcard-img>div{position:absolute!important;inset:0!important;background-size:cover!important;background-position:center!important;transition:transform .9s cubic-bezier(.22,1,.36,1),filter .9s cubic-bezier(.22,1,.36,1)!important}
body.xivoz #work .xz-pcard:hover .xz-pcard-img>div{transform:scale(1.035)!important;filter:saturate(.96) contrast(.98)}
body.xivoz #work .xz-pcard-body{position:absolute!important;left:clamp(12px,1.2vw,24px)!important;right:clamp(12px,1.2vw,24px)!important;bottom:clamp(12px,1.2vw,24px)!important;z-index:2!important;display:grid!important;grid-template-columns:1fr auto!important;gap:14px 18px!important;align-items:center!important;padding:clamp(16px,1.35vw,24px)!important;background:rgba(255,255,255,.88)!important;border:1px solid rgba(255,255,255,.72)!important;border-radius:18px!important;-webkit-backdrop-filter:blur(18px)!important;backdrop-filter:blur(18px)!important;color:#050505!important;opacity:0!important;transform:translateY(26px)!important;transition:opacity .45s ease,transform .55s cubic-bezier(.22,1,.36,1)!important;box-shadow:0 22px 70px rgba(0,0,0,.16)!important}
body.xivoz #work .xz-pcard:hover .xz-pcard-body,body.xivoz #work .xz-pcard:focus-visible .xz-pcard-body{opacity:1!important;transform:translateY(0)!important}
body.xivoz #work .xz-pcard-body h3{grid-column:1!important;margin:0!important;font-family:'Outfit','Inter',sans-serif!important;font-size:clamp(22px,1.8vw,31px)!important;font-weight:500!important;line-height:1.08!important;letter-spacing:-.035em!important;color:#050505!important}
body.xivoz #work .xz-pcard-body p,body.xivoz #work .xz-metric{display:none!important}
body.xivoz #work .xz-pcard-ind{grid-column:1!important;display:flex!important;gap:10px!important;flex-wrap:wrap!important;margin:0!important;color:transparent!important;font-size:0!important;letter-spacing:0!important;text-transform:none!important}
body.xivoz #work .xz-pcard-ind::before,body.xivoz #work .xz-pcard-ind::after{display:inline-flex!important;align-items:center!important;height:34px!important;padding:0 18px!important;border:1px solid rgba(0,0,0,.12)!important;border-radius:999px!important;background:rgba(255,255,255,.35)!important;font-family:'Inter',sans-serif!important;font-size:13px!important;font-weight:500!important;letter-spacing:.02em!important;text-transform:uppercase!important;color:#080808!important}
body.xivoz #work .xz-pcard-ind::before{content:attr(data-label)}
body.xivoz #work .xz-pcard:nth-child(1) .xz-pcard-ind::before{content:'BRANDING'}
body.xivoz #work .xz-pcard:nth-child(1) .xz-pcard-ind::after{content:'PRODUCT'}
body.xivoz #work .xz-pcard:nth-child(2) .xz-pcard-ind::before{content:'WEB'}
body.xivoz #work .xz-pcard:nth-child(2) .xz-pcard-ind::after{content:'REAL ESTATE'}
body.xivoz #work .xz-pcard:nth-child(3) .xz-pcard-ind::before{content:'HOSPITALITY'}
body.xivoz #work .xz-pcard:nth-child(3) .xz-pcard-ind::after{content:'BOOKING'}
body.xivoz #work .xz-pcard-body::after{content:'\2192';grid-column:2;grid-row:1/3;display:flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:#050505;color:#fff;font-family:'Inter',sans-serif;font-size:22px;line-height:1;align-self:center;justify-self:end}
body.xivoz #work .xz-portfolio-grid::after{display:none!important;content:none!important}
body.xivoz #work .xz-work-more-wrap{grid-column:1 / -1;width:100%;margin:clamp(34px,4vw,74px) auto 0;display:flex;justify-content:center;text-align:center;overflow:visible}
body.xivoz #work .xz-work-more{--btn-size:78px;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:var(--btn-size);padding:0 36px 0 0;border-radius:999px;color:#050505;text-decoration:none;font-family:'Inter',sans-serif;font-size:clamp(18px,1.45vw,24px);font-weight:800;letter-spacing:.02em;line-height:1;overflow:hidden;isolation:isolate;transition:color .45s cubic-bezier(.22,1,.36,1),transform .45s cubic-bezier(.22,1,.36,1)}
body.xivoz #work .xz-work-more::before{content:"";position:absolute;left:0;top:50%;width:var(--btn-size);height:var(--btn-size);border-radius:999px;background:#050505;transform:translateY(-50%) scale(1);transform-origin:left center;z-index:-1;transition:width .6s cubic-bezier(.22,1,.36,1),transform .6s cubic-bezier(.22,1,.36,1),box-shadow .6s cubic-bezier(.22,1,.36,1);box-shadow:0 18px 46px rgba(0,0,0,.22)}
body.xivoz #work .xz-work-more-icon{width:var(--btn-size);height:var(--btn-size);display:grid;place-items:center;flex:0 0 var(--btn-size);border-radius:50%;color:#fff;font-size:32px;line-height:1;transition:transform .6s cubic-bezier(.22,1,.36,1)}
body.xivoz #work .xz-work-more-text{position:relative;z-index:1;white-space:nowrap;transition:transform .6s cubic-bezier(.22,1,.36,1)}
body.xivoz #work .xz-work-more:hover,body.xivoz #work .xz-work-more:focus-visible{color:#fff;transform:translateY(-3px)}
body.xivoz #work .xz-work-more:hover::before,body.xivoz #work .xz-work-more:focus-visible::before{width:100%;transform:translateY(-50%) scale(1.02);box-shadow:0 24px 70px rgba(0,0,0,.28)}
body.xivoz #work .xz-work-more:hover .xz-work-more-icon,body.xivoz #work .xz-work-more:focus-visible .xz-work-more-icon{transform:translateX(8px)}
body.xivoz #work .xz-work-more:hover .xz-work-more-text,body.xivoz #work .xz-work-more:focus-visible .xz-work-more-text{transform:translateX(4px)}
@media(max-width:560px){body.xivoz #work .xz-work-more-wrap{margin-top:30px}body.xivoz #work .xz-work-more{--btn-size:64px;gap:16px;padding-right:24px;font-size:17px}body.xivoz #work .xz-work-more-icon{font-size:26px}}
@media(max-width:900px){body.xivoz #work{padding:0!important}body.xivoz #work>.xz-container{border-radius:0!important;padding:48px 16px 62px!important}body.xivoz #work .xz-section-head{min-height:250px!important;margin-bottom:34px!important}body.xivoz #work .xz-section-head::before{left:22px!important}body.xivoz #work .xz-portfolio-grid{grid-template-columns:1fr!important;gap:22px!important}body.xivoz #work .xz-pcard{grid-column:1!important}body.xivoz #work .xz-pcard-img,body.xivoz #work .xz-pcard:not(:first-child) .xz-pcard-img{aspect-ratio:1.22/1!important}body.xivoz #work .xz-pcard-body{opacity:1!important;transform:none!important;left:12px!important;right:12px!important;bottom:12px!important;padding:18px!important}body.xivoz #work .xz-pcard-body::after{width:46px;height:46px}}
@media(max-width:560px){body.xivoz #work .xz-section-head h2::before{font-size:clamp(58px,18vw,88px)}body.xivoz #work .xz-section-head h2::after{font-size:clamp(48px,15vw,72px)}body.xivoz #work .xz-section-head{min-height:260px!important}body.xivoz #work .xz-pcard-body{grid-template-columns:1fr 36px!important;gap:7px 10px!important;padding:11px 13px!important;left:10px!important;right:10px!important;bottom:10px!important;border-radius:14px!important}body.xivoz #work .xz-pcard-body h3{font-size:20px!important;line-height:1.02!important;padding-left:3px!important}body.xivoz #work .xz-pcard-ind{gap:6px!important}body.xivoz #work .xz-pcard-ind::before,body.xivoz #work .xz-pcard-ind::after{height:26px!important;padding:0 11px!important;font-size:11px!important}body.xivoz #work .xz-pcard-body::after{grid-column:2!important;grid-row:1/3!important;justify-self:end!important;width:36px!important;height:36px!important;font-size:16px!important}}
body.xivoz #work .xz-software-showcase{grid-column:1/-1!important;position:relative;overflow:hidden;border-radius:22px;background:#050505;color:#fff;min-height:clamp(430px,38vw,620px);padding:clamp(28px,3.2vw,58px);display:grid;grid-template-columns:minmax(280px,.86fr) 1.14fr;gap:clamp(26px,4vw,76px);align-items:center;isolation:isolate}
body.xivoz #work .xz-software-showcase::before{content:"";position:absolute;inset:0;background:#000;z-index:-2}
body.xivoz #work .xz-software-showcase::after{content:"";position:absolute;right:-10%;bottom:-32%;width:54%;aspect-ratio:1;border-radius:50%;background:rgba(230,233,242,.11);filter:blur(4px);z-index:-1}
body.xivoz #work .xz-software-copy span{display:inline-flex;margin-bottom:18px;padding:8px 15px;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:rgba(255,255,255,.72);font-family:'Inter',sans-serif;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}
body.xivoz #work .xz-software-copy span::before{content:none!important;display:none!important}
body.xivoz #work .xz-software-copy h3{max-width:12ch;margin:0 0 22px;font-family:'Outfit','Inter',sans-serif;font-size:clamp(46px,5.6vw,96px);font-weight:500;line-height:.9;letter-spacing:-.06em;color:#fff}
body.xivoz #work .xz-software-copy p{max-width:42ch;margin:0;color:rgba(255,255,255,.64);font-family:'Inter',sans-serif;font-size:clamp(15px,1.15vw,18px);line-height:1.55}
body.xivoz #work .xz-software-copy::after{content:none!important;display:none!important}
body.xivoz #work .xz-mobile-stack{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.1vw,18px);align-items:stretch}
body.xivoz #work .xz-mobile-card{--xzm-img-top:28px;--xzm-img-h:clamp(200px,16vw,260px);--xzm-img-gap:28px;position:relative;min-height:clamp(360px,30vw,500px);border-radius:22px;padding:calc(var(--xzm-img-top) + var(--xzm-img-h) + var(--xzm-img-gap)) 28px 34px;overflow:hidden;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(230,233,242,.9));color:#090909;box-shadow:0 30px 80px rgba(0,0,0,.26);display:flex;flex-direction:column;justify-content:flex-start;transform:translateY(0);transition:transform .55s cubic-bezier(.22,1,.36,1),box-shadow .55s cubic-bezier(.22,1,.36,1)}
body.xivoz #work .xz-mobile-card:nth-child(2){transform:translateY(0)}
body.xivoz #work .xz-mobile-card:hover{transform:translateY(-12px);box-shadow:0 42px 100px rgba(0,0,0,.34)}
body.xivoz #work .xz-mobile-card:nth-child(2):hover{transform:translateY(-12px)}
body.xivoz #work .xz-mobile-card::before{display:none!important;content:none!important}
body.xivoz #work .xz-mobile-card.is-analytics{background:linear-gradient(180deg,#f9fbff 0%,#d8dfed 100%)}
body.xivoz #work .xz-mobile-card.is-ai{background:linear-gradient(180deg,#f8f8f8 0%,#cfd6e5 100%)}
body.xivoz #work .xz-mobile-card::after{content:"";position:absolute;left:18px;right:18px;top:var(--xzm-img-top);height:var(--xzm-img-h);border-radius:16px;border:1px solid rgba(5,5,5,.08);background:linear-gradient(135deg,rgba(5,5,5,.08),rgba(5,5,5,.02))}
body.xivoz #work .xz-mobile-card.is-analytics::after{background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.20)),url(https://www.xivoz.com/wp-content/uploads/xivoz/services/software.webp) center/cover no-repeat;box-shadow:inset 0 -74px 70px rgba(0,0,0,.28)}
body.xivoz #work .xz-mobile-card.is-app::after{background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.16)),url(https://www.xivoz.com/wp-content/uploads/xivoz/portfolio/cosanostra-tile-v4.webp?v=1) center/cover no-repeat;box-shadow:inset 0 -70px 60px rgba(0,0,0,.34)}
body.xivoz #work .xz-mobile-card.is-ai::after{background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.22)),url(https://www.xivoz.com/wp-content/uploads/xivoz/services/ai.webp) center/cover no-repeat;box-shadow:inset 0 -74px 70px rgba(0,0,0,.30)}
body.xivoz #work .xz-mobile-card span{position:absolute;top:34px;left:30px;z-index:3;font-family:'Inter',sans-serif;font-size:15px;font-weight:800;color:rgba(0,0,0,.36)}
body.xivoz #work .xz-mobile-card strong{position:relative;z-index:1;margin-top:0;margin-bottom:12px;font-family:'Outfit','Inter',sans-serif;font-size:clamp(28px,2.45vw,42px);font-weight:500;line-height:1;letter-spacing:-.04em;color:#050505}
body.xivoz #work .xz-mobile-card em{position:relative;z-index:1;font-style:normal;font-family:'Inter',sans-serif;font-size:15px;line-height:1.42;color:rgba(0,0,0,.55)}
body.xivoz #work .xz-mobile-card strong,body.xivoz #work .xz-mobile-card em{font-size:0!important;color:transparent!important}
body.xivoz #work .xz-mobile-card strong::before,body.xivoz #work .xz-mobile-card em::before{display:block;color:#050505!important}
body.xivoz #work .xz-mobile-card em::before{color:rgba(0,0,0,.55)!important}
body.xivoz #work .xz-mobile-card.is-analytics strong::before{content:'Operations';font-family:'Outfit','Inter',sans-serif;font-size:clamp(28px,2.45vw,42px);font-weight:500;line-height:1;letter-spacing:-.04em}
body.xivoz #work .xz-mobile-card.is-app strong::before{content:'Mobile Apps';font-family:'Outfit','Inter',sans-serif;font-size:clamp(28px,2.45vw,42px);font-weight:500;line-height:1;letter-spacing:-.04em}
body.xivoz #work .xz-mobile-card.is-ai strong::before{content:'Automation';font-family:'Outfit','Inter',sans-serif;font-size:clamp(28px,2.45vw,42px);font-weight:500;line-height:1;letter-spacing:-.04em}
body.xivoz #work .xz-mobile-card.is-analytics em::before{content:'Live dashboards, workflows, approvals';font-family:'Inter',sans-serif;font-size:15px;line-height:1.42}
body.xivoz #work .xz-mobile-card.is-app em::before{content:'iOS, Android, customer portals';font-family:'Inter',sans-serif;font-size:15px;line-height:1.42}
body.xivoz #work .xz-mobile-card.is-ai em::before{content:'AI agents, APIs, integrations';font-family:'Inter',sans-serif;font-size:15px;line-height:1.42}
body.xivoz #work .xz-mobile-card.is-app{background:linear-gradient(180deg,#ffffff 0%,#dfe5f2 100%)}
@media(max-width:900px){body.xivoz #work .xz-software-showcase{grid-template-columns:1fr;min-height:0;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border-radius:0;background:#000!important;padding:28px 18px}body.xivoz #work .xz-software-copy h3{max-width:13ch}body.xivoz #work .xz-mobile-stack{grid-template-columns:1fr!important;gap:18px!important;width:min(100%,calc(100vw - 44px));max-width:390px;margin-left:auto;margin-right:auto}body.xivoz #work .xz-mobile-card,body.xivoz #work .xz-mobile-card:nth-child(2){--xzm-img-top:24px;--xzm-img-h:250px;--xzm-img-gap:30px;min-height:420px!important;border-radius:22px!important;transform:none!important}body.xivoz #work .xz-mobile-card:hover,body.xivoz #work .xz-mobile-card:nth-child(2):hover{transform:none!important}body.xivoz #work .xz-mobile-card::after{top:var(--xzm-img-top);height:var(--xzm-img-h);left:16px;right:16px;border-radius:16px!important}body.xivoz #work .xz-mobile-card{padding-top:calc(var(--xzm-img-top) + var(--xzm-img-h) + var(--xzm-img-gap))!important}body.xivoz #work .xz-mobile-card strong{margin-top:0}body.xivoz #work .xz-mobile-card.is-analytics strong::before,body.xivoz #work .xz-mobile-card.is-app strong::before,body.xivoz #work .xz-mobile-card.is-ai strong::before{font-size:34px}}
@media(max-width:520px){body.xivoz #work .xz-software-showcase{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border-radius:0;background:#000!important;padding:22px 12px}body.xivoz #work .xz-software-copy{padding:0 12px}body.xivoz #work .xz-mobile-stack{width:min(100%,calc(100vw - 32px));max-width:390px;margin-left:auto;margin-right:auto}body.xivoz #work .xz-mobile-card,body.xivoz #work .xz-mobile-card:nth-child(2){--xzm-img-top:22px;--xzm-img-h:255px;--xzm-img-gap:28px;min-height:410px!important;border-radius:20px!important;padding:calc(var(--xzm-img-top) + var(--xzm-img-h) + var(--xzm-img-gap)) 22px 28px!important;transform:none!important}body.xivoz #work .xz-mobile-card::before{display:none!important;content:none!important}body.xivoz #work .xz-mobile-card::after{top:var(--xzm-img-top);height:var(--xzm-img-h);left:16px;right:16px;border-radius:16px}body.xivoz #work .xz-mobile-card span{top:30px;left:28px;font-size:13px}body.xivoz #work .xz-mobile-card strong{margin-top:0}body.xivoz #work .xz-mobile-card.is-analytics strong::before,body.xivoz #work .xz-mobile-card.is-app strong::before,body.xivoz #work .xz-mobile-card.is-ai strong::before{font-size:30px}body.xivoz #work .xz-mobile-card.is-analytics em::before,body.xivoz #work .xz-mobile-card.is-app em::before,body.xivoz #work .xz-mobile-card.is-ai em::before{font-size:14px}}

/* ===== MCARD ALIGN FIX (2026-06-25): force cards to fill their grid columns so left/right cards hug the borders symmetrically ===== */
body.xivoz .xz-masonry{justify-items:stretch!important}
body.xivoz .xz-mcard{justify-self:stretch!important}


/* ===== PROJECT CARD BOXES (2026-06-25) ===== */
body.xivoz .xz-mcard{background:#ffffff;border:1px solid hsl(220 14% 88%);border-radius:26px;padding:16px 16px 8px;box-shadow:0 26px 60px -34px rgba(20,28,45,.28);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
body.xivoz .xz-mcard:hover{transform:translateY(-6px);box-shadow:0 44px 90px -40px rgba(20,28,45,.34)}
body.xivoz .xz-mcard-img{border-radius:16px;box-shadow:none}
body.xivoz .xz-mcard:hover .xz-mcard-img{transform:none;box-shadow:none}
body.xivoz .xz-mcard-meta{padding:20px 8px 10px}


/* ===== PROJECT CARD BOXES — BLACK (2026-06-25) ===== */
body.xivoz .xz-mcard{background:#0c0d11!important;border:1px solid rgba(255,255,255,.09)!important;box-shadow:0 30px 70px -34px rgba(0,0,0,.6)!important}
body.xivoz .xz-mcard:hover{box-shadow:0 48px 100px -40px rgba(0,0,0,.7)!important}
body.xivoz .xz-mcard-meta h3{color:#ffffff!important}
body.xivoz .xz-mcard-tags span{color:rgba(255,255,255,.55)!important}
body.xivoz .xz-mcard-metric{border-top-color:rgba(255,255,255,.14)!important}
body.xivoz .xz-mcard-metric-num{background:linear-gradient(92deg,#ffffff,#c4c4ca)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important}
body.xivoz .xz-mcard-metric-lbl{color:rgba(255,255,255,.55)!important}


/* ===== MCARD SOLO (last lone card centered, 2026-06-25) ===== */
body.xivoz .xz-mcard.xz-mcard-solo{grid-column:2/12!important;margin-top:0!important}
body.xivoz .xz-mcard.xz-mcard-solo .xz-mcard-img{aspect-ratio:2/1!important}


/* ===== MCARD MANUAL PAIR (Dr Shopnikolova + Galatech, 2026-06-25) ===== */
body.xivoz .xz-mcard.xz-mcard-pl{grid-column:1/6!important;margin-top:clamp(70px,9vw,200px)!important}
body.xivoz .xz-mcard.xz-mcard-pl .xz-mcard-img{aspect-ratio:16/10!important}
body.xivoz .xz-mcard.xz-mcard-pr{grid-column:8/13!important;margin-top:0!important}
body.xivoz .xz-mcard.xz-mcard-pr .xz-mcard-img{aspect-ratio:4/3!important}


/* ===== MCARD MOBILE STACK (2026-06-25) ===== */
@media(max-width:900px){
 body.xivoz .xz-masonry{grid-template-columns:1fr!important;column-gap:0!important}
 body.xivoz .xz-mcard,
 body.xivoz .xz-mcard.xz-mcard-pl,
 body.xivoz .xz-mcard.xz-mcard-pr,
 body.xivoz .xz-mcard.xz-mcard-hero,
 body.xivoz .xz-mcard.xz-mcard-solo{grid-column:1/-1!important;margin-top:0!important;margin-bottom:clamp(28px,7vw,48px)!important}
 body.xivoz .xz-mcard .xz-mcard-img,
 body.xivoz .xz-mcard.xz-mcard-pl .xz-mcard-img,
 body.xivoz .xz-mcard.xz-mcard-pr .xz-mcard-img,
 body.xivoz .xz-mcard.xz-mcard-hero .xz-mcard-img,
 body.xivoz .xz-mcard.xz-mcard-solo .xz-mcard-img{aspect-ratio:3/2!important}
}

/* ===== Software showcase reveal matches project cards (2026-06-26) ===== */
body.xivoz #work .xz-portfolio-grid .xz-software-showcase.xz-reveal{opacity:0;transform:none!important;transform-origin:50% 100%;transition:opacity .5s var(--ease);will-change:opacity}
body.xivoz #work .xz-portfolio-grid .xz-software-showcase.xz-reveal.in{opacity:1;transform:none!important}
@media(prefers-reduced-motion:reduce){body.xivoz #work .xz-portfolio-grid .xz-software-showcase.xz-reveal{opacity:1!important;transform:none!important;transition:none!important}}
/* process: remove section index (03 —) from eyebrow (2026-06-25) */
body.xivoz #process .xz-section-head .xz-eyebrow::before{content:none!important}

/* ===== FAQ redesign 2026-06-25 ===== */
body.xivoz .xz-faq2 .xz-faq2-head{margin-bottom:clamp(38px,5vw,70px)}
body.xivoz .xz-faq2-head h2{margin:0;font-size:clamp(34px,4.6vw,64px);line-height:1.06;letter-spacing:-.02em;font-weight:700;color:hsl(var(--foreground))}
body.xivoz .xz-faq2-grid{display:grid;grid-template-columns:.78fr 1.55fr;gap:clamp(28px,4vw,72px);align-items:start}
body.xivoz .xz-faq2-help{margin:0 0 26px;font-size:18px;line-height:1.55;color:hsl(var(--foreground)/.6);max-width:330px}
body.xivoz .xz-faq2-help a{color:hsl(var(--foreground));text-decoration:underline;text-underline-offset:3px;font-weight:600}
body.xivoz .xz-faq2-img{border-radius:22px;overflow:hidden;aspect-ratio:4/5;background:#e3e3e6}
body.xivoz .xz-faq2-img img{width:100%;height:100%;object-fit:cover;display:block}
body.xivoz .xz-faq2-list{display:flex;flex-direction:column;gap:16px}
body.xivoz .xz-faq2-item{background:#fff;border-radius:22px;box-shadow:0 14px 40px rgba(15,18,25,.06);overflow:hidden}
body.xivoz .xz-faq2-item>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(22px,2vw,30px) clamp(22px,2.2vw,34px);font-size:clamp(17px,1.45vw,22px);font-weight:600;color:hsl(var(--foreground))}
body.xivoz .xz-faq2-item>summary::-webkit-details-marker{display:none}
body.xivoz .xz-faq2-ico{flex:none;width:42px;height:42px;border-radius:50%;background:#0b0b0c;position:relative}
body.xivoz .xz-faq2-ico::before,body.xivoz .xz-faq2-ico::after{content:'';position:absolute;left:50%;top:50%;background:#fff;border-radius:2px;transition:transform .3s var(--ease)}
body.xivoz .xz-faq2-ico::before{width:15px;height:2px;transform:translate(-50%,-50%)}
body.xivoz .xz-faq2-ico::after{width:2px;height:15px;transform:translate(-50%,-50%)}
body.xivoz .xz-faq2-item[open] .xz-faq2-ico::after{transform:translate(-50%,-50%) scaleY(0)}
body.xivoz .xz-faq2-body{padding:0 clamp(22px,2.2vw,34px) clamp(26px,2.4vw,36px);max-width:760px}
body.xivoz .xz-faq2-body-img{border-radius:16px;overflow:hidden;aspect-ratio:1/1;background:#e3e3e6}
body.xivoz .xz-faq2-body-img img{width:100%;height:100%;object-fit:cover;display:block}
body.xivoz .xz-faq2-body-text p{margin:0 0 24px;font-size:17px;line-height:1.65;color:hsl(var(--foreground)/.62)}
body.xivoz .xz-faq2-cta{display:inline-flex;align-items:center;gap:16px;text-decoration:none;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:hsl(var(--foreground))}
body.xivoz .xz-faq2-cta .ic{flex:none;width:48px;height:48px;border-radius:50%;background:#0b0b0c;color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;line-height:0;transition:transform .35s var(--ease)}
body.xivoz .xz-faq2-cta:hover .ic{transform:rotate(90deg)}
@media(max-width:900px){body.xivoz .xz-faq2-grid{grid-template-columns:1fr;gap:32px}body.xivoz .xz-faq2-aside{display:flex;flex-direction:column-reverse;gap:22px}body.xivoz .xz-faq2-img{aspect-ratio:16/10;max-height:340px}}
@media(max-width:560px){body.xivoz .xz-faq2-body{grid-template-columns:1fr}body.xivoz .xz-faq2-body-img{aspect-ratio:16/10;max-width:260px}}
/* prevent horizontal scroll / left-right drag (2026-06-25) */
html{overflow-x:clip}
body.xivoz{overflow-x:clip;max-width:100%}

/* process: tighter top spacing (2026-06-25) */
body.xivoz #process{padding-top:clamp(34px,5vh,68px)}

/* faq2 eyebrow + hairline (2026-06-25) */
body.xivoz .xz-faq2-eyebrow{display:block;color:hsl(var(--foreground)/.55);margin:0 0 30px;padding-bottom:22px;border-bottom:1px solid hsl(var(--foreground)/.12)}

/* faq2: smaller image + compact accordion (2026-06-25) */
body.xivoz .xz-faq2-img{max-width:280px;aspect-ratio:4/5;margin-right:auto}
body.xivoz .xz-faq2-grid{grid-template-columns:.7fr 1.6fr;gap:clamp(24px,3vw,56px)}
body.xivoz .xz-faq2-list{gap:12px}
body.xivoz .xz-faq2-item{border-radius:16px}
body.xivoz .xz-faq2-item>summary{padding:13px 24px;font-size:clamp(15px,1.05vw,17px);gap:16px}
body.xivoz .xz-faq2-ico{width:32px;height:32px}
body.xivoz .xz-faq2-ico::before{width:11px;height:2px}
body.xivoz .xz-faq2-ico::after{width:2px;height:11px}
body.xivoz .xz-faq2-body{padding:0 24px 24px;max-width:660px}
body.xivoz .xz-faq2-body-text p{font-size:15.5px;line-height:1.6;margin:0 0 18px}
body.xivoz .xz-faq2-cta{font-size:12px}
body.xivoz .xz-faq2-cta .ic{width:42px;height:42px;font-size:22px}
@media(max-width:900px){body.xivoz .xz-faq2-img{max-width:240px}}
/* faq width = process; process eyebrow above line (2026-06-25) */
body.xivoz #faq > .xz-container{max-width:1440px!important;margin-left:auto!important;margin-right:auto!important;padding-left:24px!important;padding-right:24px!important}
body.xivoz #process .xz-section-head::before{display:none!important}
body.xivoz #process .xz-section-head .xz-eyebrow{display:block;margin:0 0 26px;padding-bottom:20px;border-bottom:1px solid hsl(var(--foreground)/.12)}
/* faq2 mobile stacking fix (2026-06-25) */
@media(max-width:820px){
  body.xivoz .xz-faq2-grid{grid-template-columns:1fr!important;gap:30px}
  body.xivoz .xz-faq2-aside{display:flex;flex-direction:column;gap:20px}
  body.xivoz .xz-faq2-help{max-width:none}
  body.xivoz .xz-faq2-img{max-width:340px;aspect-ratio:4/5}
  body.xivoz .xz-faq2-item>summary{font-size:16px}
}

/* faq: tighter top on mobile (2026-06-25) */
@media(max-width:820px){body.xivoz #faq{padding-top:clamp(16px,3vh,34px)}}

/* remove whitish circle on dark cards bg (2026-06-25) */
body.xivoz #work .xz-software-showcase::after{display:none!important}

/* contact form panel top margin (2026-06-25) */
body.page-id-33 .elementor-element-contact-form{margin-top:clamp(24px,4vw,52px)}

/* contact form panel top margin mobile (2026-06-25) */
@media(max-width:820px){body.page-id-33 .elementor-element-contact-form{margin-top:48px}}

/* FIX: force service media images to fill & center (override FLOKA background shorthand) */
.xz-srow-media{background-size:cover !important;background-position:center center !important;background-repeat:no-repeat !important;}

/* === Menu panel clears header buttons (2026-06-27) === */
body.xivoz .xz-menu-panel{top:92px!important}
@media(max-width:900px){body.xivoz .xz-menu-panel{top:82px!important}}

/* === Automation tile zoom-out (desktop only, 2026-06-27) === */
@media(min-width:901px){body.xivoz #work .xz-mobile-card.is-ai::after{background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.22)),url(https://www.xivoz.com/wp-content/uploads/xivoz/services/ai.webp) center/auto 88% no-repeat,#0a0f1e}}

/* === Remove section number from Services "How We Work" (2026-06-27) === */
body.xivoz.page-id-30 .xz-section-head .xz-eyebrow::before{content:none!important}

/* ===== 404 page (2026-06-27) ===== */
body.xivoz .xz-404{min-height:82vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:150px 20px 100px;position:relative;z-index:2}
body.xivoz .xz-404-inner{max-width:780px;margin:0 auto}
body.xivoz .xz-404-eyebrow{display:inline-block;font-family:"Outfit","Inter",sans-serif;font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:hsl(var(--foreground)/.6);border:1px solid hsl(var(--foreground)/.16);border-radius:999px;padding:8px 16px;margin-bottom:24px}
body.xivoz .xz-404-code{font-family:"Outfit","Inter",sans-serif;font-weight:800;line-height:.86;font-size:clamp(120px,25vw,280px);letter-spacing:-.05em;margin:0 0 4px}
body.xivoz .xz-404-title{font-family:"Outfit","Inter",sans-serif;font-weight:600;font-size:clamp(26px,4vw,46px);letter-spacing:-.02em;color:hsl(var(--foreground));margin:0 0 16px}
body.xivoz .xz-404-text{font-size:clamp(15px,1.6vw,18px);line-height:1.65;color:hsl(var(--foreground)/.62);max-width:540px;margin:0 auto 36px}
body.xivoz .xz-404-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:42px}
body.xivoz .xz-404-links{display:flex;gap:10px 20px;justify-content:center;align-items:center;flex-wrap:wrap;font-size:14px}
body.xivoz .xz-404-links span{color:hsl(var(--foreground)/.5);letter-spacing:.03em}
body.xivoz .xz-404-links a{color:hsl(var(--foreground));text-decoration:none;border-bottom:1px solid hsl(var(--foreground)/.28);padding-bottom:2px;transition:opacity .25s,border-color .25s}
body.xivoz .xz-404-links a:hover{opacity:.65}
@keyframes xz404up{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
body.xivoz .xz-404-inner>*{animation:xz404up .7s cubic-bezier(.22,.68,0,1) both}
body.xivoz .xz-404-eyebrow{animation-delay:.02s}body.xivoz .xz-404-code{animation-delay:.06s}body.xivoz .xz-404-title{animation-delay:.14s}body.xivoz .xz-404-text{animation-delay:.2s}body.xivoz .xz-404-cta{animation-delay:.26s}body.xivoz .xz-404-links{animation-delay:.32s}
@media(prefers-reduced-motion:reduce){body.xivoz .xz-404-inner>*{animation:none}}
@media(max-width:600px){body.xivoz .xz-404{padding:120px 18px 70px;min-height:74vh}}


/* ===== Language slider (EN/BG) — 2026-06-29 ===== */
.xz-lang{position:relative;display:inline-flex;align-items:center;width:64px;height:30px;padding:3px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(18,18,20,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent;flex:none;font-family:'Outfit','Inter',sans-serif;}
.xz-lang-knob{position:absolute;top:3px;left:3px;width:29px;height:24px;border-radius:999px;background:#fafafa;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .34s cubic-bezier(.22,1,.36,1);}
.xz-lang.is-bg .xz-lang-knob{transform:translateX(29px);}
.xz-lang-t{position:relative;z-index:1;flex:1 1 0;text-align:center;font-size:11px;font-weight:700;letter-spacing:.04em;line-height:24px;color:rgba(255,255,255,.62);transition:color .3s ease;-webkit-user-select:none;user-select:none;}
.xz-lang .xz-lang-t.en{color:#0a0a0a;}
.xz-lang.is-bg .xz-lang-t.en{color:rgba(255,255,255,.62);}
.xz-lang.is-bg .xz-lang-t.bg{color:#0a0a0a;}
.xz-lang:hover{border-color:rgba(255,255,255,.34);}
.xz-lang:focus-visible{box-shadow:0 0 0 3px rgba(255,255,255,.28);}
@media (max-width:560px){.xz-lang{width:60px;height:28px}.xz-lang-knob{height:22px;width:27px}.xz-lang.is-bg .xz-lang-knob{transform:translateX(27px)}.xz-lang-t{line-height:22px}}
@media (prefers-reduced-motion:reduce){.xz-lang-knob{transition:none}}


/* BG override for #work CSS pseudo-heading (Selected / creative works) */
html[lang="bg"] body.xivoz #work .xz-section-head h2::before{content:"Част от"}
html[lang="bg"] body.xivoz #work .xz-section-head h2::after{content:"нашите проекти"}

/* BG: room for Cyrillic descenders in expertise heading */
html[lang="bg"] body.xivoz .xz-xpsec .xz-xp-title .ln{padding-bottom:.2em}

/* Keep EN/BG slider dark in all states (theme paints buttons pink on focus/active) */
.xz-lang,.xz-lang:hover,.xz-lang:focus,.xz-lang:focus-visible,.xz-lang:active{background:rgba(18,18,20,.55)!important;-webkit-appearance:none!important;appearance:none!important;color:inherit!important;box-shadow:none!important;outline:none!important}
.xz-lang:focus-visible{box-shadow:0 0 0 3px rgba(255,255,255,.28)!important}

/* BG: hide portfolio final-CTA subtitle */
html[lang="bg"] body.page-id-31 .xz-finalcta > p{display:none}

/* ===== Privacy / legal page ===== */
body.xivoz .xz-legal-sec{padding:clamp(120px,16vh,190px) 20px 96px;background:#f4f5f8;min-height:88vh}
body.xivoz .xz-legal{max-width:840px;margin:0 auto;color:#2b2f38;font-family:'Inter',-apple-system,sans-serif}
body.xivoz .xz-legal-head{margin-bottom:34px;padding-bottom:26px;border-bottom:1px solid rgba(0,0,0,.1)}
body.xivoz .xz-legal .xz-eyebrow{display:inline-block;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:#727784;margin-bottom:14px}
body.xivoz .xz-legal h1{font-family:'Outfit',sans-serif;font-weight:700;font-size:clamp(34px,6vw,56px);line-height:1.04;letter-spacing:-.02em;margin:0 0 12px;color:#0c0d10}
body.xivoz .xz-legal-upd{margin:0;color:#727784;font-size:15px}
body.xivoz .xz-legal-block{margin-top:34px}
body.xivoz .xz-legal-block h2{font-family:'Outfit',sans-serif;font-weight:600;font-size:clamp(20px,3vw,25px);line-height:1.25;margin:0 0 12px;color:#12131a;letter-spacing:-.01em}
body.xivoz .xz-legal-block p{margin:0 0 14px;font-size:16.5px;line-height:1.72;color:#3d434e}
body.xivoz .xz-legal a{color:#0c66e4;text-decoration:underline;text-underline-offset:2px;word-break:break-word}
body.xivoz .xz-legal a:hover{color:#0a4fb0}
body.xivoz .xz-legal-bg{display:none}
html[lang="bg"] body.xivoz .xz-legal-en{display:none}
html[lang="bg"] body.xivoz .xz-legal-bg{display:block}
/* footer legal link */
.xivoz-footer__copyright .xivoz-footer__sep{opacity:.5;margin:0 4px}
.xivoz-footer__copyright .xivoz-footer__legal{color:#8a8a8a;text-decoration:none;transition:color .2s ease}
.xivoz-footer__copyright .xivoz-footer__legal:hover{color:#f4f4f4;text-decoration:underline;text-underline-offset:2px}

/* BG: gap between portfolio final-CTA heading and button (subtitle hidden) */
html[lang="bg"] body.page-id-31 .xz-finalcta .xz-hero-cta{margin-top:24px}