/* ============================================================
   SMARTNPRO — WORK PAGE
   Scoped, Themify-safe portfolio system.
   No relational selectors; no Builder row/column geometry overrides.
============================================================ */

body.snp-work-page{
  margin:0;
  overflow-x:hidden;
  background:#10182f;
  color:#fff;
}

body.snp-work-page #headerwrap,
body.snp-work-page #footerwrap,
body.snp-work-page .page-title,
body.snp-work-page .post-title{
  display:none!important;
}

body.snp-work-page #pagewrap,
body.snp-work-page #body,
body.snp-work-page #layout,
body.snp-work-page #content{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

body.snp-work-page .type-page,
body.snp-work-page .themify_builder_content{
  margin:0!important;
  padding:0!important;
}

/* Shared page spacing: native Themify owns row/column geometry. */
.snp-work-header,
.snp-work-hero,
.snp-work-project,
.snp-work-cta,
.snp-work-footer{
  position:relative;
  min-height:0!important;
  height:auto!important;
  box-sizing:border-box;
  overflow:visible!important;
}

/* ---------- HEADER ---------- */

.snp-work-header{
  padding:34px clamp(22px,5vw,76px) 24px!important;
  background:#10182f;
}

.snp-work-header-col{
  min-width:0;
}

.snp-work-topbar{
  width:100%;
  max-width:none!important;
  padding:0!important;
}

.snp-work-topbar-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.snp-work-page .snp-wordmark{
  text-decoration:none!important;
}

.snp-work-nav-current{
  color:#63ddd3!important;
}

/* ---------- HERO ---------- */

.snp-work-hero{
  padding:clamp(72px,8vw,116px) clamp(22px,6vw,92px) clamp(84px,9vw,132px)!important;
  background:
    radial-gradient(720px circle at 8% 18%,rgba(40,84,217,.25),transparent 66%),
    radial-gradient(640px circle at 88% 72%,rgba(53,198,189,.10),transparent 66%),
    #10182f;
}

.snp-work-eyebrow,
.snp-project-no{
  margin:0!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-weight:760!important;
  letter-spacing:.20em!important;
  text-transform:uppercase;
}

.snp-work-eyebrow{
  color:#63ddd3!important;
  font-size:11px!important;
  line-height:1.4!important;
}

.snp-work-hero-title{
  width:min(900px,100%);
  margin:18px 0 0!important;
  color:#fff!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:clamp(58px,6.5vw,104px)!important;
  font-weight:720!important;
  line-height:.94!important;
  letter-spacing:-.058em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}

.snp-work-hero-copy{
  width:min(660px,100%);
  margin:30px 0 0!important;
  color:rgba(255,255,255,.76)!important;
  font:400 clamp(18px,1.4vw,22px)/1.58 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

.snp-work-hero-link{
  margin:30px 0 0!important;
}

.snp-work-hero-link a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#ffd064!important;
  font:750 14px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  text-decoration:none!important;
}

/* ---------- PROJECTS ---------- */

.snp-work-project{
  padding:clamp(86px,8vw,124px) clamp(24px,5vw,78px)!important;
}

.snp-work-project-dark{
  color:#fff;
  background:
    radial-gradient(720px circle at 12% 30%,rgba(40,84,217,.14),transparent 68%),
    radial-gradient(620px circle at 78% 86%,rgba(53,198,189,.08),transparent 70%),
    #10182f;
}

.snp-work-project-light{
  color:#121a2c;
  background:
    radial-gradient(700px circle at 88% 18%,rgba(53,198,189,.10),transparent 68%),
    radial-gradient(660px circle at 10% 82%,rgba(40,84,217,.06),transparent 68%),
    #f7f9fc;
}

.snp-work-visual,
.snp-work-copy{
  min-width:0!important;
  overflow:visible!important;
}

.snp-work-visual{
  padding-right:clamp(26px,3.3vw,54px)!important;
}

.snp-work-copy{
  padding-left:clamp(26px,3.3vw,54px)!important;
}

/* Browser frame is the only deliberate crop area. */
.snp-browser{
  width:100%;
  max-width:100%;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:#0b1224;
  box-shadow:0 26px 68px rgba(3,8,25,.24);
  transform:translate3d(0,0,0);
}

.snp-work-project-light .snp-browser{
  border-color:rgba(18,26,44,.15);
  box-shadow:0 26px 64px rgba(18,26,44,.13);
}

.snp-browser-bar{
  display:flex;
  align-items:center;
  gap:8px;
  height:42px;
  padding:0 16px;
  box-sizing:border-box;
  background:#11182a;
}

.snp-browser-bar>span{
  display:block;
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:rgba(255,255,255,.34);
}

.snp-browser-bar small{
  min-width:0;
  margin-left:10px;
  overflow:hidden;
  color:rgba(255,255,255,.50);
  font:650 10.5px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.snp-work-shot{
  position:relative;
  width:100%;
  aspect-ratio:16/10;
  overflow:hidden;
  background:#e9eef3;
}

.snp-work-shot img{
  display:block;
  width:100%;
  height:100%;
  max-width:none!important;
  object-fit:cover;
  object-position:top center;
}

.snp-shot-houston img{object-position:top center}
.snp-shot-jost img{object-position:top center}

.snp-project-no{
  margin-bottom:26px!important;
  color:rgba(255,255,255,.73)!important;
  font-size:clamp(11px,.95vw,14px)!important;
  line-height:1.45!important;
}

.snp-work-project-light .snp-project-no{
  color:rgba(18,26,44,.52)!important;
}

.snp-work-project .snp-project-title{
  width:min(560px,100%);
  max-width:11ch;
  margin:0!important;
  color:#fff!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:clamp(48px,4.6vw,74px)!important;
  font-weight:760!important;
  line-height:.96!important;
  letter-spacing:-.052em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}

.snp-work-project-light .snp-project-title{
  color:#121a2c!important;
}

.snp-project-summary{
  width:min(600px,100%);
  max-width:39ch;
  margin:30px 0 0!important;
  color:rgba(255,255,255,.76)!important;
  font:400 clamp(17px,1.25vw,20px)/1.62 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

.snp-work-project-light .snp-project-summary{
  color:#4e5a70!important;
}

.snp-project-tags{
  width:min(620px,100%);
  max-width:50ch;
  margin:40px 0 0!important;
  color:rgba(255,255,255,.55)!important;
  font:650 12.5px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

.snp-work-project-light .snp-project-tags{
  color:rgba(18,26,44,.54)!important;
}

.snp-project-action{
  margin:24px 0 0!important;
}

.snp-project-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#56d8cf!important;
  font:760 14px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  text-decoration:none!important;
}

.snp-work-project-light .snp-project-link{
  color:#147f79!important;
}

/* ---------- CTA ---------- */

.snp-work-cta{
  padding:clamp(86px,8vw,122px) clamp(24px,6vw,92px)!important;
  text-align:center;
  background:
    radial-gradient(600px circle at 50% 10%,rgba(53,198,189,.18),transparent 70%),
    #2854d9;
}

.snp-work-cta-eyebrow{
  color:#ffe08c!important;
}

.snp-work-cta-title{
  width:min(940px,100%);
  margin:18px auto 0!important;
  color:#fff!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  font-size:clamp(50px,5.5vw,86px)!important;
  font-weight:740!important;
  line-height:.96!important;
  letter-spacing:-.055em!important;
}

.snp-work-cta-copy{
  width:min(600px,100%);
  margin:24px auto 0!important;
  color:rgba(255,255,255,.78)!important;
  font:400 clamp(17px,1.3vw,20px)/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}

.snp-work-cta-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:16px 22px;
  margin-top:32px;
}

.snp-work-cta-primary,
.snp-work-cta-phone{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  box-sizing:border-box;
  font:760 13.5px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  text-decoration:none!important;
}

.snp-work-cta-primary{
  gap:18px;
  padding:0 20px;
  border-radius:14px;
  color:#10182f!important;
  background:#ffd064;
  box-shadow:0 18px 42px rgba(8,18,65,.23);
}

.snp-work-cta-phone{
  padding:0 4px;
  color:#fff!important;
  border-bottom:1px solid rgba(255,255,255,.34);
}

/* ---------- FOOTER ---------- */

.snp-work-footer{
  padding:34px clamp(22px,5vw,76px)!important;
  background:#0a1020;
}

.snp-work-footer-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px 34px;
  flex-wrap:wrap;
  color:rgba(255,255,255,.58);
  font:600 12px/1.5 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.snp-work-footer-inner>div{
  display:flex;
  align-items:baseline;
  gap:12px;
  flex-wrap:wrap;
}

.snp-work-footer-inner strong{
  color:#fff;
  font-size:16px;
}

.snp-work-footer-inner nav{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}

.snp-work-footer-inner a{
  color:rgba(255,255,255,.75)!important;
  text-decoration:none!important;
}

.snp-work-footer-inner p{
  margin:0!important;
}

/* ---------- HOVER ---------- */

@media(hover:hover) and (pointer:fine){
  .snp-browser{
    transition:transform .24s cubic-bezier(.2,.7,.2,1),box-shadow .24s ease;
  }

  .snp-browser:hover{
    transform:translate3d(0,-4px,0);
    box-shadow:0 34px 78px rgba(3,8,25,.31);
  }

  .snp-project-link,
  .snp-project-link span,
  .snp-work-hero-link a,
  .snp-work-hero-link a span{
    transition:color .2s ease,transform .2s ease;
  }

  .snp-project-link:hover span,
  .snp-work-hero-link a:hover span{
    transform:translate3d(3px,-3px,0);
  }

  .snp-work-cta-primary{
    transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease;
  }

  .snp-work-cta-primary:hover{
    transform:translateY(-2px);
    background:#ffda7e;
    box-shadow:0 22px 48px rgba(8,18,65,.28);
  }
}

/* ---------- RESPONSIVE ---------- */

@media(max-width:1100px){
  .snp-work-project{
    padding-left:42px!important;
    padding-right:42px!important;
  }

  .snp-work-visual{padding-right:28px!important}
  .snp-work-copy{padding-left:28px!important}

  .snp-work-project .snp-project-title{
    font-size:clamp(44px,4.8vw,60px)!important;
  }

  .snp-project-summary{
    font-size:16.5px!important;
  }
}

@media(max-width:900px){
  .snp-work-header{
    padding-top:26px!important;
  }

  .snp-work-nav>a:not(.snp-mini-contact):not(.snp-work-nav-current){
    display:none;
  }

  .snp-work-hero{
    padding-top:68px!important;
    padding-bottom:86px!important;
  }

  .snp-work-hero-title{
    font-size:clamp(52px,9vw,76px)!important;
  }

  .snp-work-project{
    padding-top:72px!important;
    padding-bottom:76px!important;
  }

  .snp-work-visual{padding-right:22px!important}
  .snp-work-copy{padding-left:22px!important}
}

/* Themify native tablet portrait should stack columns at this breakpoint. */
@media(max-width:768px){
  .snp-work-project{
    padding-left:28px!important;
    padding-right:28px!important;
  }

  .snp-work-visual,
  .snp-work-copy{
    padding-left:0!important;
    padding-right:0!important;
  }

  .snp-work-copy{
    margin-top:38px!important;
  }

  .snp-project-no{
    margin-bottom:17px!important;
  }

  .snp-work-project .snp-project-title{
    width:100%;
    max-width:13ch;
    font-size:clamp(42px,8.2vw,58px)!important;
  }

  .snp-project-summary{
    max-width:46ch;
    margin-top:22px!important;
    font-size:16.5px!important;
  }

  .snp-project-tags{
    max-width:54ch;
    margin-top:28px!important;
  }

  .snp-work-shot{
    aspect-ratio:16/9;
  }

  .snp-work-cta-title{
    font-size:clamp(44px,8vw,64px)!important;
  }

  .snp-work-footer-inner{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:540px){
  .snp-work-header{
    padding:20px 22px 18px!important;
  }

  .snp-work-page .snp-wordmark>span,
  .snp-work-page .snp-wordmark>strong{
    font-size:29px!important;
  }

  .snp-work-nav-current{
    display:none!important;
  }

  .snp-work-hero{
    padding:52px 22px 64px!important;
  }

  .snp-work-eyebrow{
    font-size:9px!important;
    letter-spacing:.17em!important;
  }

  .snp-work-hero-title{
    margin-top:14px!important;
    font-size:clamp(43px,12.5vw,56px)!important;
    line-height:.97!important;
  }

  .snp-work-hero-copy{
    margin-top:22px!important;
    font-size:15.5px!important;
    line-height:1.52!important;
  }

  .snp-work-project{
    padding:54px 22px 58px!important;
  }

  .snp-browser{
    border-radius:14px;
  }

  .snp-browser-bar{
    height:36px;
    padding:0 12px;
  }

  .snp-browser-bar>span{
    width:7px;
    height:7px;
    flex-basis:7px;
  }

  .snp-browser-bar small{
    margin-left:7px;
    font-size:9px;
  }

  .snp-work-copy{
    margin-top:30px!important;
  }

  .snp-project-no{
    margin-bottom:14px!important;
    font-size:9.5px!important;
    letter-spacing:.15em!important;
  }

  .snp-work-project .snp-project-title{
    max-width:100%;
    font-size:38px!important;
    line-height:.99!important;
  }

  .snp-project-summary{
    margin-top:18px!important;
    font-size:15.5px!important;
    line-height:1.55!important;
  }

  .snp-project-tags{
    margin-top:22px!important;
    font-size:11.5px!important;
  }

  .snp-project-action{
    margin-top:18px!important;
  }

  .snp-project-link{
    font-size:13.5px!important;
  }

  .snp-work-cta{
    padding:58px 22px 62px!important;
  }

  .snp-work-cta-title{
    margin-top:14px!important;
    font-size:40px!important;
    line-height:.99!important;
  }

  .snp-work-cta-copy{
    margin-top:20px!important;
    font-size:15.5px!important;
  }

  .snp-work-cta-actions{
    align-items:stretch;
    flex-direction:column;
    margin-top:26px;
  }

  .snp-work-cta-primary,
  .snp-work-cta-phone{
    width:100%;
  }

  .snp-work-cta-phone{
    min-height:44px;
    border:1px solid rgba(255,255,255,.25);
    border-radius:12px;
  }

  .snp-work-footer{
    padding:30px 22px!important;
  }

  .snp-work-footer-inner nav{
    gap:12px 16px;
  }
}

@media(max-width:360px){
  .snp-work-hero-title{font-size:40px!important}
  .snp-work-project .snp-project-title{font-size:35px!important}
  .snp-work-cta-title{font-size:36px!important}
  .snp-work-project{padding-left:18px!important;padding-right:18px!important}
  .snp-work-header,.snp-work-hero,.snp-work-cta,.snp-work-footer{padding-left:18px!important;padding-right:18px!important}
}

/* ---------- BUILDER SAFETY ---------- */

.themify_builder_active .snp-work-header,
.themify_builder_active .snp-work-hero,
.themify_builder_active .snp-work-project,
.themify_builder_active .snp-work-cta,
.themify_builder_active .snp-work-footer,
.tb_editor_on .snp-work-header,
.tb_editor_on .snp-work-hero,
.tb_editor_on .snp-work-project,
.tb_editor_on .snp-work-cta,
.tb_editor_on .snp-work-footer,
.themify_builder_active .snp-work-visual,
.themify_builder_active .snp-work-copy,
.tb_editor_on .snp-work-visual,
.tb_editor_on .snp-work-copy{
  overflow:visible!important;
}

.themify_builder_active .snp-work-page .snp-reveal,
.tb_editor_on .snp-work-page .snp-reveal,
.themify_builder_active .snp-browser,
.tb_editor_on .snp-browser{
  opacity:1!important;
  transform:none!important;
  transition:none!important;
  will-change:auto!important;
}

/* ---------- ACCESSIBILITY ---------- */

.snp-work-page a:focus-visible{
  outline:3px solid #ffd064;
  outline-offset:4px;
  border-radius:4px;
}

@media(prefers-reduced-motion:reduce){
  .snp-browser,
  .snp-project-link,
  .snp-project-link span,
  .snp-work-hero-link a,
  .snp-work-hero-link a span,
  .snp-work-cta-primary{
    transform:none!important;
    transition:none!important;
  }
}