/* Junza layer over the Diego template: Junza colours, Poppins headlines, Syne body.
   Loaded after the template CSS and site.css. Colours come from junza-tokens.css. */
:root{
  --tp-ff-body:"Syne",system-ui,sans-serif;
  --tp-ff-p:"Syne",system-ui,sans-serif;
  --tp-ff-heading:"Poppins",system-ui,sans-serif;
  --tp-ff-poppins:"Poppins",system-ui,sans-serif;
  /* Every display face in the template becomes Poppins; every text face becomes Syne */
  --tp-ff-playfair:"Poppins",system-ui,sans-serif;
  --tp-ff-didone:"Poppins",system-ui,sans-serif;
  --tp-ff-didoneright:"Poppins",system-ui,sans-serif;
  --tp-ff-didoneWideMedium:"Poppins",system-ui,sans-serif;
  --tp-ff-didoneCompackDark:"Poppins",system-ui,sans-serif;
  --tp-ff-garamond:"Poppins",system-ui,sans-serif;
  --tp-ff-abril:"Poppins",system-ui,sans-serif;
  --tp-ff-kufam:"Syne",system-ui,sans-serif;
  --tp-ff-dmsans:"Syne",system-ui,sans-serif;
  --tp-ff-jost:"Syne",system-ui,sans-serif;
  --tp-ff-roboto:"Syne",system-ui,sans-serif;
  --tp-cream-1:var(--jz-linen);
  --tp-pink-3:var(--jz-volt);
  --tp-common-black-7:var(--jz-obsidian);
  --tp-text-body:rgba(245,245,242,.68);
  --tp-theme-primary:var(--jz-volt);
}
body{font-family:var(--tp-ff-body);background:var(--jz-obsidian);color:var(--jz-linen)}
.dg p{font-family:var(--tp-ff-p);color:rgba(245,245,242,.72);font-size:16px;line-height:1.7}
.dg h1,.dg h2,.dg h3,.dg h4,.dg h5{color:var(--jz-linen)}
.black-bg-5{background-color:var(--jz-obsidian)}
.black-bg-6{background:#131311}
::selection{background:var(--jz-volt);color:var(--jz-obsidian)}
:focus-visible{outline:3px solid var(--jz-volt);outline-offset:3px}

/* Header: text logo in place of the template image logo */
.jz-logo{font:800 30px/1 "Poppins",sans-serif;letter-spacing:-.04em;color:var(--jz-linen);display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.jz-logo i{width:9px;height:9px;border-radius:50%;background:var(--jz-volt);display:inline-block;transform:translateY(7px)}
.jz-logo:hover{color:var(--jz-linen)}
.tp-header-3__area .tp-btn-white{background:var(--jz-volt);color:var(--jz-obsidian);border-color:var(--jz-volt)}
.tp-header-3__area .tp-btn-white:hover{color:var(--jz-obsidian)}
.tp-header-3__area .tp-btn-white::after,.tp-header-3__area .tp-btn-white .text::after{background-color:var(--jz-volt)}

/* Hero: Junza volt accent on the highlighted phrase */
.tp-hero-4-title span{color:var(--jz-volt)}
.tp-hero-4-lead{max-width:640px;margin:28px auto 0;text-align:center}
.tp-hero-4-lead p{font-size:18px}
.tp-hero-4-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}

/* Buttons in the template style, Volt filled and outline */
.jz-tbtn{display:inline-flex;align-items:center;gap:10px;height:56px;padding:0 28px;border-radius:100px;font:600 15px/1 "Poppins",sans-serif;text-transform:uppercase;letter-spacing:.02em;background:var(--jz-volt);color:var(--jz-obsidian);border:1px solid var(--jz-volt);transition:background .3s,color .3s}
.jz-tbtn:hover{background:transparent;color:var(--jz-volt)}
.jz-tbtn.ol{background:transparent;color:var(--jz-linen);border-color:rgba(245,245,242,.35)}
.jz-tbtn.ol:hover{border-color:var(--jz-volt);color:var(--jz-volt)}
.jz-tbtn.wa:before{content:"";width:9px;height:9px;border-radius:50%;background:#25D366;box-shadow:0 0 0 4px rgba(37,211,102,.18)}

/* Hero art when no hero photo exists yet: Junza grid and Volt glow */
.jz-hero-art{position:relative;aspect-ratio:1020/950;max-height:86vh;margin:0 auto;overflow:hidden;background:
  radial-gradient(60% 55% at 70% 30%,rgba(var(--jz-volt-rgb),.28),transparent 70%),
  linear-gradient(rgba(245,245,242,.06) 1px,transparent 1px) 0 0/72px 72px,
  linear-gradient(90deg,rgba(245,245,242,.06) 1px,transparent 1px) 0 0/72px 72px,#151512}
.jz-hero-art span{position:absolute;right:28px;top:28px;font:500 12px/1.5 "Poppins",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,245,242,.55);text-align:right}
.jz-loc{aspect-ratio:3/4;display:flex;flex-direction:column;justify-content:space-between;padding:28px;background:var(--jz-volt);color:var(--jz-obsidian);text-align:left}
.jz-loc b{font:800 88px/1 "Poppins",sans-serif}
.jz-loc span{font:600 22px/1.25 "Poppins",sans-serif;text-transform:uppercase;letter-spacing:-.01em}

/* Solution cards (template project strip) without photos yet */
.tp-project-4-thumb>a{display:block;height:100%}
.tp-project-4-thumb .jz-ph{height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:28px;background:linear-gradient(160deg,#1a1b17,#0D0D0D);border:1px solid rgba(245,245,242,.12);color:var(--jz-linen);transition:background .4s}
.tp-project-4-thumb .jz-ph b{font:700 64px/1 "Poppins",sans-serif;color:var(--jz-volt)}
.tp-project-4-thumb .jz-ph span{font-size:15px;line-height:1.5;color:rgba(245,245,242,.72)}
.tp-project-4-item:hover .jz-ph{background:linear-gradient(160deg,#2a2b14,#0D0D0D)}

/* About: founder monogram when no photo exists */
.jz-mono{aspect-ratio:4/5;display:grid;place-items:center;background:#1a1b17;border:1px solid rgba(245,245,242,.12);font:800 96px/1 "Poppins",sans-serif;color:var(--jz-volt)}

/* Packages (template pricing cards) */
.tp-price-4-price.jz-from{font:600 15px/1.3 "Poppins",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--jz-volt);margin:6px 0 12px;display:block}
.tp-price-4-item.active .tp-price-4-price.jz-from{color:var(--jz-obsidian)}
.tp-price-4-item.active{background:var(--jz-volt)}
.tp-price-4-item.active *{color:var(--jz-obsidian)!important}
.tp-price-4-item.active .tp-btn-4-1-price{background:var(--jz-obsidian);color:var(--jz-volt)!important;border-color:var(--jz-obsidian)}

/* Footer CTA box in place of the template newsletter */
.jz-foot-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:28px 0 36px}
.tp-footer-5-text{color:var(--jz-linen)}
.tp-footer-5-text-wrap a{color:inherit}

/* Template magic cursor and accents in Volt */
#magic-cursor #ball{border-color:var(--jz-volt)}

/* Junza mobile action bar and consent sit outside the smooth-scroll wrapper */
.mbar{z-index:120}

/* Phones */
@media(max-width:767px){.tp-project-4-item{height:auto}.tp-project-4-thumb{height:340px;margin-bottom:16px}.tp-hero-4-lead p{font-size:16px}}
@media(max-width:860px){.back-to-top-wrapper{bottom:96px}}

/* About: button, then counters under a hairline (replaces the template's rotated line) */
.tp-about-4-content p{margin-bottom:32px}
.tp-about-4-content .tp-hero-4-cta{margin:0 0 48px}
.jz-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;border-top:1px solid rgba(245,245,242,.14);padding-top:28px}
.jz-stats b{display:block;font:600 clamp(48px,5vw,72px)/.9 "Poppins",sans-serif;letter-spacing:-.05em;color:var(--jz-volt)}
.jz-stats span{display:block;margin-top:12px;font:500 12px/1.3 "Poppins",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,245,242,.6)}
@media(max-width:991px){.tp-about-4-content-wrap{padding:40px 0}}

/* Hero video uploaded in Site media */
.jz-hero-video{display:block;width:100%;aspect-ratio:1020/950;max-height:86vh;object-fit:cover;margin:0 auto}

/* ===== Round 3: full-width hero, About, solution photos, case images ===== */
/* Hero: photo or video fills the full width and height, copy sits on top */
.jz-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;padding:120px 0 72px;isolation:isolate}
.jz-hero-media{position:absolute;inset:0;z-index:-1;overflow:hidden;background:#151512}
.jz-hero-media img,.jz-hero-media video{width:100%;height:100%;object-fit:cover;object-position:center}
.jz-hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,13,13,.55) 0%,rgba(13,13,13,.15) 30%,rgba(13,13,13,.45) 62%,#0D0D0D 100%)}
.jz-hero-media .jz-hero-art{position:absolute;inset:0;aspect-ratio:auto;max-height:none}
.jz-hero-copy{position:relative}
.jz-hero .tp-hero-4-title-box{margin-top:0}
.jz-hero .tp-hero-4-title{font-size:clamp(46px,6.4vw,120px);line-height:.92;text-shadow:0 4px 40px rgba(0,0,0,.35)}
.jz-hero .tp-hero-4-lead p{color:rgba(245,245,242,.86)}
@media(max-width:767px){.jz-hero{min-height:92svh;padding:110px 0 48px}}

/* About: uncropped portrait with caption, copy with three pillars, counters and button */
.jz-portrait{position:relative;margin:0;aspect-ratio:4/5;overflow:hidden;background:#1a1b17}
.jz-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.jz-portrait .jz-mono{position:absolute;inset:0;aspect-ratio:auto;border:0}
.jz-portrait figcaption{position:absolute;left:0;right:0;bottom:0;padding:48px 24px 22px;background:linear-gradient(transparent,rgba(13,13,13,.9));display:flex;flex-direction:column;gap:4px}
.jz-portrait figcaption b{font:600 22px/1.1 "Poppins",sans-serif;color:var(--jz-linen);letter-spacing:-.02em}
.jz-portrait figcaption span{font:500 11px/1.4 "Poppins",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,245,242,.7)}
.jz-about-copy{padding-left:clamp(0px,3vw,40px)}
/* Section labels: one rule site-wide. Label sits on top, left-aligned, 30px above its title.
   The bracket corners take the colour of the section behind them. */
.black-bg-5 .tp-section-subtitle-5:before,.black-bg-5 .tp-section-subtitle-5:after{background:var(--jz-obsidian)}
.black-bg-6 .tp-section-subtitle-5:before,.black-bg-6 .tp-section-subtitle-5:after{background:#131311}
.jz-head{display:flex;flex-direction:column;align-items:flex-start}
.jz-head .tp-section-subtitle-5,.jz-about-copy .tp-section-subtitle-5{margin-bottom:30px}
.jz-head .tp-about-4-title-box{padding-left:0}
.jz-head .tp-section-title-5{margin:0 0 20px}
@media(max-width:767px){.tp-section-subtitle-5{font-size:12px;padding:6px 16px}}
.jz-about-title{font:600 clamp(36px,4.6vw,68px)/.95 "Poppins",sans-serif;letter-spacing:-.045em;text-transform:uppercase;color:var(--jz-linen);margin:0 0 22px}
.jz-about-title span{color:var(--jz-volt)}
.dg p.jz-about-lead{font-size:17px;max-width:58ch;margin-bottom:30px}
.jz-pillars{list-style:none;padding:0;margin:0 0 36px;border-top:1px solid rgba(245,245,242,.14)}
.jz-pillars li{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:20px 0;border-bottom:1px solid rgba(245,245,242,.14)}
.jz-pillars li>b{font:500 13px/1.6 "Poppins",sans-serif;color:var(--jz-volt);letter-spacing:.06em}
.jz-pillars h3{font:600 20px/1.2 "Poppins",sans-serif;text-transform:uppercase;letter-spacing:-.01em;margin:0 0 6px;color:var(--jz-linen)}
.dg .jz-pillars p{margin:0;font-size:15px;line-height:1.6}
.jz-about-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;flex-wrap:wrap}
.jz-about-foot .jz-stats{border-top:0;padding-top:0;flex:1;min-width:260px;max-width:420px}

/* Solution cards: an uploaded photo sits behind the number and line */
.tp-project-4-thumb .jz-ph{position:relative;overflow:hidden;isolation:isolate}
.jz-ph.jz-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s cubic-bezier(.2,.7,.1,1)}
.jz-ph.jz-photo:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(13,13,13,.55) 0%,rgba(13,13,13,.05) 35%,rgba(13,13,13,.25) 60%,rgba(13,13,13,.92) 100%)}
.jz-ph.jz-photo span{color:var(--jz-linen)}
.tp-project-4-item:hover .jz-ph.jz-photo img{transform:scale(1.05)}

/* Home: proof strip under the hero (client logos, numbers, one client quote) */
.jz-proof{padding:56px 0 72px;border-bottom:1px solid rgba(245,245,242,.1)}
.jz-proof-k{margin:0 0 22px;font:500 12px/1.4 "Poppins",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,245,242,.55);text-align:center}
.jz-proof-logos ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px 48px}
.jz-proof-logos li{flex:0 0 auto}
.jz-proof-logos img{display:block;width:auto;height:44px;max-width:150px;object-fit:contain;filter:grayscale(1) brightness(1.6);opacity:.7;transition:opacity .3s,filter .3s}
.jz-proof-logos li:hover img{filter:none;opacity:1}
.jz-proof-logos+.jz-proof-row{margin-top:52px}
.jz-proof-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:48px;align-items:center;border-top:1px solid rgba(245,245,242,.14);padding-top:40px}
.jz-proof-row.one{grid-template-columns:1fr}
.jz-proof-nums{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:24px}
.jz-proof-nums b{display:block;font:600 clamp(40px,4.4vw,64px)/.95 "Poppins",sans-serif;letter-spacing:-.04em;color:var(--jz-volt)}
.jz-proof-nums span{display:block;margin-top:12px;font:500 12px/1.35 "Poppins",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,245,242,.6)}
.jz-proof-quote{margin:0;padding-left:28px;border-left:2px solid var(--jz-volt)}
.jz-proof-quote blockquote{margin:0 0 16px;font:500 clamp(18px,1.6vw,22px)/1.45 "Syne",sans-serif;color:var(--jz-linen)}
.jz-proof-quote figcaption b{display:block;font:600 15px/1.3 "Poppins",sans-serif;color:var(--jz-linen)}
.jz-proof-quote figcaption span{display:block;margin-top:4px;font:500 12px/1.4 "Poppins",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:rgba(245,245,242,.6)}
.jz-proof-row.one .jz-proof-quote{max-width:760px;margin:0 auto}
@media(max-width:991px){.jz-proof-row{grid-template-columns:1fr;gap:36px}}
@media(max-width:767px){.jz-proof{padding:40px 0 52px}.jz-proof-logos ul{gap:18px 32px}.jz-proof-logos img{height:34px;max-width:120px}.jz-proof-nums{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.jz-proof-nums b{font-size:34px}.jz-proof-nums span{font-size:10px;letter-spacing:.08em}.jz-proof-quote{padding-left:18px}}

/* Home: questions people ask (answer-first, also marked up as FAQ data) */
.jz-faq{border-top:1px solid rgba(245,245,242,.14)}
.jz-faq details{border-bottom:1px solid rgba(245,245,242,.14)}
.jz-faq summary{list-style:none;cursor:pointer;display:flex;gap:22px;align-items:baseline;padding:26px 44px 26px 0;position:relative;font:600 clamp(19px,2vw,26px)/1.25 "Poppins",sans-serif;letter-spacing:-.02em;color:#F5F5F2}
.jz-faq summary::-webkit-details-marker{display:none}
.jz-faq summary span{font:500 13px/1 "Syne",sans-serif;color:var(--jz-volt,#E4E531);min-width:26px}
.jz-faq summary:after{content:"+";position:absolute;right:4px;top:22px;font:400 30px/1 "Poppins",sans-serif;color:var(--jz-volt,#E4E531);transition:transform .25s}
.jz-faq details[open] summary:after{transform:rotate(45deg)}
.jz-faq summary:hover{color:var(--jz-volt,#E4E531)}
.jz-faq p{margin:0 0 28px 48px;max-width:760px;color:rgba(245,245,242,.78);font-size:17px;line-height:1.7}
@media(max-width:600px){.jz-faq p{margin-left:0}.jz-faq summary{gap:12px}}
