/* Inner pages in the new (v2) design: services hub, service pages, portfolio, pricing, 404.
   Builds on css/home.css (tokens, header, footer, buttons, labels, FAQ, CTA). */
.v2 .xcrumbs ol{list-style:none;display:flex;justify-content:center;gap:6px;margin:0 0 22px;padding:0;font:500 13px/1 var(--x-body);color:var(--x-mute)}
.v2 .xcrumbs li+li::before{content:"/";margin-right:6px;opacity:.6}
.v2 .xcrumbs a:hover{color:var(--x-ink)}

/* Hero */
.v2 .xp-hero{padding:calc(140px + var(--promo-h,0px)) 60px 56px;text-align:center}
.v2 .xp-h1{margin:24px 0 0;font:700 57px/57px var(--x-display);letter-spacing:-2.28px;color:var(--x-ink)}
.v2 .xp-sub{max-width:640px;margin:20px auto 0;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:var(--x-mute)}
.v2 .xp-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:32px}
.v2 .xp-trust{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:28px 0 0;padding:0}
.v2 .xp-trust li{display:inline-flex;align-items:center;gap:6px;height:40px;padding:8px 14px;border-radius:24px;background:#fff;box-shadow:var(--x-sh-pill);font:700 15px/24px var(--x-body);color:#4a4a4a}
.v2 .xp-trust li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--x-grad)}
.v2 .xbtn-ghost{background:transparent;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}

/* Sections */
.v2 .xp-sec{padding:40px 60px 72px}
.v2 .xp-sec[hidden]{display:none}
.v2 .xp-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.v2 .xp-h2{margin:0;font:700 40px/44px var(--x-display);letter-spacing:-1.6px;color:inherit}
.v2 .xp-head p{margin:0;max-width:440px;font:500 16px/24px var(--x-body);color:var(--x-mute)}
.v2 .xp-note{margin:20px 0 0;text-align:center;font:400 14px/1.5 var(--x-body);color:var(--x-mute)}

/* Monthly plans band */
.v2 .xp-monthly{background:var(--x-dark2);color:#fff;padding:72px 60px}
.v2 .xp-monthly-in{display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap}
.v2 .xp-monthly .xp-h2{margin:20px 0 12px}
.v2 .xp-monthly p{margin:0;max-width:600px;font:500 18px/25.2px var(--x-body);color:#cfcfcf}

/* Closing CTA */
.v2 .xp-cta{padding-bottom:96px}
.v2 .xp-cta-sub{max-width:520px;margin:-8px auto 0;font:500 18px/25.2px var(--x-body);color:#cfcfcf}
.v2 .xp-btns-c{margin-top:32px}


.v2 .xp-btns-l{justify-content:flex-start}
.v2 .xbtn-sm{height:40px;padding:8px 16px;font-size:14.5px}
.v2 .xlink{display:inline-flex;align-items:center;gap:6px;font:600 15px/1 var(--x-body);color:var(--x-ink);text-decoration:underline;text-underline-offset:4px}
.v2 .xcrumbs-l ol{justify-content:flex-start}

/* Service cards (hub + related) */
.v2 .xhub{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.v2 .xhub-card{display:flex;flex-direction:column;gap:12px;padding:28px;border-radius:32px;background:#fff;box-shadow:var(--x-sh-card);color:var(--x-ink);transition:transform .45s var(--x-ease)}
.v2 .xhub-card:hover{transform:translateY(-4px)}
.v2 .xhub-k{align-self:flex-start;padding:5px 11px;border-radius:100px;background:var(--x-bg);font:600 12px/16px var(--x-body);color:var(--x-mute)}
.v2 .xhub-card h3{margin:4px 0 0;font:800 26px/1.1 var(--x-display);letter-spacing:-.8px;color:var(--x-ink)}
.v2 .xhub-card h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.v2 .xhub-card p{margin:0;font:400 16px/1.55 var(--x-body);color:#4a4a4a}
.v2 .xhub-tags{display:flex;flex-wrap:wrap;gap:6px}
.v2 .xhub-tags span{padding:5px 10px;border-radius:100px;border:1px solid #e6e6e6;font:500 12.5px/1.2 var(--x-body);color:var(--x-mute)}
.v2 .xhub-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:auto;padding-top:8px}
.v2 .xhub-actions .xbtn-white{box-shadow:inset 0 0 0 1px #e3e3e3}
.v2 .xhub-link .xlink{margin-top:auto;padding-top:8px}

/* Service page */
.v2 .xs-hero{padding:calc(130px + var(--promo-h,0px)) 60px 72px}
.v2 .xs-hero-in{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:56px;align-items:center}
.v2 .xs-h1{margin:24px 0 0;font:700 57px/57px var(--x-display);letter-spacing:-2.28px;color:var(--x-ink);max-width:14ch}
.v2 .xs-sub{max-width:600px;margin:20px 0 0;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:var(--x-mute)}
.v2 .xs-billing{display:flex;align-items:center;gap:10px;margin:24px 0 0;font:600 14px/1.3 var(--x-body);color:#4a4a4a}
.v2 .xs-dot{width:8px;height:8px;border-radius:50%;background:var(--x-grad)}
.v2 .xs-hero-card{padding:30px;border-radius:32px;background:#fff;box-shadow:var(--x-sh-card)}
.v2 .xs-card-k{margin:0 0 16px;font:600 12px/16px var(--x-body);text-transform:uppercase;letter-spacing:.04em;color:var(--x-mute)}
.v2 .xs-card-more{display:inline-block;margin-top:18px;font:600 14.5px/1 var(--x-body);color:var(--x-violet-ink)}
.v2 .xticks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.v2 .xticks li{position:relative;padding-left:32px;font:500 16px/1.45 var(--x-body);color:#2e2e2e}
.v2 .xticks li::before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;
  background:var(--x-grad) center/100% no-repeat}
.v2 .xticks li::after{content:"";position:absolute;left:7px;top:6px;width:8px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)}
.v2 .xticks-2{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px}
.v2 .xticks-dark li{color:#e9e9e9}
.v2 .xs-sec{padding:40px 60px 64px}
.v2 .xs-two{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:40px;align-items:start}
.v2 .xs-h2{margin:18px 0 16px;font:700 40px/44px var(--x-display);letter-spacing:-1.6px;color:var(--x-ink)}
.v2 .xs-h3{margin:0 0 10px;font:700 22px/1.25 var(--x-display);letter-spacing:-.4px;color:inherit}
.v2 .xs-p{margin:0;font:400 17px/1.65 var(--x-body);color:#3d3d3d}
.v2 .xs-card{padding:30px;border-radius:32px;background:#fff;box-shadow:var(--x-sh-card)}
.v2 .xs-head{margin-bottom:24px}
.v2 .xs-head-c{text-align:center}
.v2 .xs-tiers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.v2 .xs-dark{background:var(--x-dark2);color:#fff;padding:72px 60px}
.v2 .xs-dark .xsec-h{margin:20px auto 0;max-width:none}
.v2 .xs-ben{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:40px}
.v2 .xs-ben .xstep p{margin-top:-16px}
.v2 .xs-deliv{margin-top:16px;padding:30px;border-radius:32px;background:var(--x-card)}
.v2 .xs-deliv .xs-h3{color:#fff;margin-bottom:18px}

/* Portfolio page */
.v2 .xpf-hero{padding-bottom:32px}
.v2 .pf-bar{position:sticky;top:calc(84px + var(--promo-h,0px));z-index:40;padding:10px 60px 0;pointer-events:none}
.v2 .pf-bar .pills{margin:0;justify-content:center;pointer-events:auto}
.v2 .pills{display:flex;flex-wrap:wrap;gap:8px}
.v2 .pill-btn{display:inline-flex;align-items:center;gap:7px;height:42px;padding:8px 16px;border-radius:100px;border:0;cursor:pointer;
  background:#fff;color:var(--x-ink);box-shadow:var(--x-sh-pill);font:600 14.5px/1 var(--x-body);transition:background .25s,color .25s}
.v2 .pill-btn small{font:600 12px/1 var(--x-body);color:var(--x-mute)}
.v2 .pill-btn:hover{background:#efefef}
.v2 .pill-btn[aria-pressed="true"]{background:var(--x-ink);color:#fff}
.v2 .pill-btn[aria-pressed="true"] small{color:rgba(255,255,255,.6)}
.v2 .pf-bar .pill-btn{backdrop-filter:none}
.v2 #pf-sections{padding-bottom:80px}
.v2 .pf-loading{padding:60px 0;text-align:center;color:var(--x-mute)}
.v2 .pf-sec{padding:48px 60px 0}
.v2 .pf-sec .wrap{max-width:1200px;margin:0 auto;padding:0}
.v2 .pf-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid #e3e3e3}
.v2 .pf-head h2.sec{margin:0;font:700 34px/1.1 var(--x-display);letter-spacing:-1.2px;text-transform:none;color:var(--x-ink)}
.v2 .pf-count{font:600 14px/1 var(--x-body);color:var(--x-mute)}
.v2 .pf-desc{margin:-8px 0 20px;color:var(--x-mute)}
.v2 .pf-sec .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.v2 .pf-sec .xv{height:460px;border-radius:28px}
.v2 .grid-empty{grid-column:1/-1;padding:40px 20px;border-radius:28px;border:1.5px dashed #d9d9d9;text-align:center;color:var(--x-mute)}
.v2 .grid-empty p{margin:0 0 16px}

/* 404 */
.v2 .xnf{min-height:72svh;display:flex;align-items:center}
.v2 .xnf .xc{width:100%}
.v2 .xnf-code{margin:0;font:800 140px/1 var(--x-display);letter-spacing:-6px}
.v2 .xnf-links{list-style:none;display:flex;justify-content:center;flex-wrap:wrap;gap:8px 24px;margin:28px 0 0;padding:0;font:600 15px/1 var(--x-body)}
.v2 .xnf-links a{text-decoration:underline;text-underline-offset:4px;color:var(--x-ink)}

@media (max-width:1199px){
  .v2 .xp-hero,.v2 .xp-sec,.v2 .xp-monthly,.v2 .xs-sec,.v2 .xs-dark,.v2 .pf-sec,.v2 .pf-bar{padding-left:32px;padding-right:32px}
  .v2 .xs-hero{padding-left:32px;padding-right:32px}
  .v2 .xs-hero-in{grid-template-columns:minmax(0,1fr) 360px;gap:32px}
  .v2 .xhub,.v2 .xs-ben{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v2 .pf-sec .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:809px){
  .v2 .xp-hero{padding:calc(96px + var(--promo-h,0px)) 16px 40px}
  .v2 .xp-h1,.v2 .xs-h1{font-size:34px;line-height:36px;letter-spacing:-1.36px}
  .v2 .xp-sub,.v2 .xs-sub{font-size:16px;line-height:23px}
  .v2 .xp-sec,.v2 .xs-sec{padding:24px 16px 44px}
  .v2 .xp-h2,.v2 .xs-h2{font-size:30px;line-height:33px;letter-spacing:-1.1px}
  .v2 .xp-monthly,.v2 .xs-dark{padding:56px 16px}
  .v2 .xp-monthly p{font-size:16px;line-height:23px}
  .v2 .xp-cta-sub{font-size:16px}
  .v2 .xs-hero{padding:calc(96px + var(--promo-h,0px)) 16px 40px}
  .v2 .xs-hero-in,.v2 .xs-two,.v2 .xs-tiers,.v2 .xhub,.v2 .xs-ben,.v2 .xticks-2{grid-template-columns:minmax(0,1fr)}
  .v2 .xs-hero-card,.v2 .xs-card,.v2 .xs-deliv,.v2 .xhub-card{padding:22px;border-radius:26px}
  .v2 .pf-bar{top:calc(72px + var(--promo-h,0px));padding:8px 0 0}
  .v2 .pf-bar .pills{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;padding:2px 16px 8px;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent);mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent)}
  .v2 .pf-bar .pills::-webkit-scrollbar{display:none}
  .v2 .pill-btn{flex:none}
  .v2 .pf-sec{padding:32px 16px 0}
  .v2 .pf-head h2.sec{font-size:26px}
  .v2 .pf-sec .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .v2 .pf-sec .xv{height:300px;border-radius:20px}
  .v2 .pf-sec .xv-top{left:12px;top:12px;font-size:13px}
  .v2 .pf-sec .xv-top .xava{width:24px;height:24px;font-size:9px}
  .v2 .pf-sec .xv-bar{left:10px;right:10px;bottom:16px}
  .v2 .pf-sec .xv-bar svg:not(:first-child){display:none}
  .v2 .pf-sec .xv-prog{left:10px;right:10px;bottom:8px}
  .v2 .xnf-code{font-size:96px}
}

/* Results graphic (service pages): full image, no crop, no overlays; click/tap opens the preview */
.v2 .xr{padding:24px 24px 80px}
.v2 .xr-in{max-width:1400px;margin:0 auto}
.v2 .xr-fig{margin:0}
.v2 .xr-zoom{display:block;width:100%;padding:0;border:0;background:#d8f400;cursor:zoom-in;border-radius:16px;overflow:hidden;box-shadow:var(--x-sh-card);transition:transform .45s var(--x-ease)}
.v2 .xr-zoom:hover{transform:translateY(-3px)}
.v2 .xr-zoom picture,.v2 .xr-zoom img{display:block;width:100%;height:auto}
.v2 .xr-zoom img{aspect-ratio:1672/941}
.v2 .xr-cap{display:flex;justify-content:space-between;align-items:center;gap:8px 20px;flex-wrap:wrap;margin-top:14px;font:500 13.5px/1.4 var(--x-body);color:var(--x-mute)}
.v2 .xr-hint{display:inline-flex;align-items:center;gap:6px;color:#4a4a4a}
.v2 .xr-hint svg{width:16px;height:16px}
.v2 .xr-hint-m{display:none}
.v2 .xr-cta{max-width:680px;margin:64px auto 0;text-align:center}
.v2 .xr-cta-h{margin:0;font:700 40px/44px var(--x-display);letter-spacing:-1.6px;color:var(--x-ink)}
.v2 .xr-cta p{margin:16px auto 28px;max-width:560px;font:500 18px/25.2px var(--x-body);letter-spacing:-.36px;color:var(--x-mute)}

/* Full-screen image preview */
.xlb{padding:0;background:rgba(8,8,10,.94);align-items:stretch;justify-content:stretch}
.xlb-bar{position:absolute;top:0;left:0;right:0;z-index:2;height:64px;display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:0 16px}
.xlb-btn{height:42px;padding:0 18px;border-radius:100px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.08);color:#fff;font:600 14.5px/1 "Space Grotesk",system-ui,sans-serif;cursor:pointer}
.xlb-btn:hover{background:#fff;color:#111}
.xlb-close{width:42px;padding:0;font-size:24px;line-height:1}
.xlb-scroll{position:absolute;inset:64px 0 0;overflow:auto;display:grid;place-items:center;padding:16px;touch-action:pan-x pan-y pinch-zoom;overscroll-behavior:contain}
.xlb-scroll picture{display:contents}
.xlb-scroll img{display:block;max-width:100%;max-height:calc(100svh - 96px);width:auto;height:auto;border-radius:12px;cursor:zoom-in}
.xlb.is-zoomed .xlb-scroll{place-items:start}
.xlb.is-zoomed .xlb-scroll img{max-width:none;max-height:none;width:max(1672px,150%);border-radius:0;cursor:zoom-out}

@media (max-width:809px){
  .v2 .xr{padding:16px 16px 56px}
  .v2 .xr-zoom{border-radius:12px}
  .v2 .xr-hint-d{display:none}.v2 .xr-hint-m{display:inline}
  .v2 .xr-cta{margin-top:44px}
  .v2 .xr-cta-h{font-size:30px;line-height:33px;letter-spacing:-1.1px}
  .v2 .xr-cta p{font-size:16px;line-height:23px}
}
@media (prefers-reduced-motion:reduce){.v2 .xr-zoom{transition:none}.v2 .xr-zoom:hover{transform:none}}