/* J Websites — site styles
   Brand: ink #14112B · cream #FFFBF3 · violet #5B3FFF · coral #FF5A36 · sun #FFC93C
   Fonts: Bricolage Grotesque (display), DM Sans (body) */

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#FFFBF3}
a{color:#14112B}a:hover{color:#4B32E6}
img,svg{max-width:100%}
:focus-visible{outline:3px solid #5B3FFF;outline-offset:3px}
input,select,textarea{max-width:100%}

/* Accessibility helpers */
.skip-link{position:absolute;left:-9999px;top:8px;background:#14112B;color:#fff;padding:10px 16px;border-radius:8px;z-index:100}
.skip-link:focus{left:8px;color:#fff}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}

/* Animations */
@keyframes jv-float{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-14px) rotate(var(--r,0deg))}}
@keyframes jv-words{0%,14%{transform:translateY(0)}17%,31%{transform:translateY(-1.15em)}34%,48%{transform:translateY(-2.3em)}51%,65%{transform:translateY(-3.45em)}68%,82%{transform:translateY(-4.6em)}85%,97%{transform:translateY(-5.75em)}100%{transform:translateY(-6.9em)}}
@keyframes jv-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes jv-spin{to{transform:rotate(360deg)}}
@keyframes jv-pop{0%,100%{transform:scale(1) rotate(-6deg)}50%{transform:scale(1.08) rotate(-2deg)}}
@keyframes jv-pulse{0%{box-shadow:0 0 0 0 rgba(255,90,54,.55)}70%{box-shadow:0 0 0 14px rgba(255,90,54,0)}100%{box-shadow:0 0 0 0 rgba(255,90,54,0)}}
@keyframes jv-rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.anim-on .jv-float{animation:jv-float 6s ease-in-out infinite}
.anim-on .jv-float-b{animation:jv-float 7s ease-in-out -2s infinite}
.anim-on .jv-float-c{animation:jv-float 5.5s ease-in-out -4s infinite}
.anim-on .jv-words{animation:jv-words 12s cubic-bezier(.7,0,.3,1) infinite}
.anim-on .jv-marquee{animation:jv-marquee 28s linear infinite}
.anim-on .jv-spin{animation:jv-spin 14s linear infinite}
.anim-on .jv-pop{animation:jv-pop 2.4s ease-in-out infinite}
.anim-on .jv-pulse{animation:jv-pulse 2s infinite}
.anim-on .jv-rise{animation:jv-rise .8s ease-out both}
.jv-card{transition:transform .25s ease, box-shadow .25s ease}
.jv-card:hover{transform:translateY(-6px);box-shadow:0 18px 0 #14112B}
.jv-btn{transition:transform .15s ease, box-shadow .15s ease}
.jv-btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 #14112B}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .anim-on *{animation:none !important}
  .jv-card,.jv-btn{transition:none}
}

/* Header + mobile menu */
.menu-toggle{display:none;width:48px;height:48px;border:2px solid #14112B;border-radius:50%;background:#fff;align-items:center;justify-content:center;cursor:pointer;padding:0}
@media (max-width: 860px){
  .menu-toggle{display:flex}
  .site-header{position:relative}
  .site-nav{display:none!important;width:100%;flex-direction:column;gap:0!important;border-top:2px solid #14112B;padding-top:8px}
  .site-nav.open{display:flex!important}
  .site-nav a{padding:14px 4px!important;border-bottom:1px solid #E4E0EE}
  .header-cta{display:none}
}

/* Tablet & phone layout tweaks (overrides inline sizes from the design) */
@media (max-width: 760px){
  h1{font-size:44px!important;letter-spacing:-1.5px!important}
  h2{font-size:34px!important;letter-spacing:-1px!important}
  section[id="top"]{padding-top:24px!important;padding-bottom:48px!important}
  .hero-art{height:400px!important;flex-basis:100%!important}
  [style*="padding: 56px"],[style*="padding: 52px"],[style*="padding: 48px"]{padding:28px 22px!important}
  [style*="padding: 110px 24px"],[style*="padding: 100px 24px"],[style*="padding: 96px 24px"]{padding-top:56px!important;padding-bottom:56px!important}
  [style*="minmax(330px"],[style*="minmax(320px"],[style*="minmax(300px"]{grid-template-columns:1fr!important}
  [style*="flex: 1 1 520px"],[style*="flex: 1 1 500px"],[style*="flex: 1 1 480px"]{flex-basis:100%!important}
  [style*="font-size: 56px; font-weight: 800; letter-spacing: -2px"]{font-size:46px!important}
  .work-tile span{font-size:48px!important}
  footer [style*="justify-content: space-between"]{flex-direction:column;align-items:flex-start!important}
}
@media (max-width: 420px){
  h1{font-size:38px!important}
  .hero-art{height:360px!important}
}

/* Legal + utility pages */
.page-shell{font-family:'DM Sans',system-ui,sans-serif;color:#14112B;background:#FFFBF3;min-height:100vh;display:flex;flex-direction:column}
.page-header{max-width:960px;width:100%;margin:0 auto;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#14112B}
.brand-name{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:24px;letter-spacing:-.8px;line-height:1}
.brand-sub{display:block;font-size:10px;letter-spacing:1px;font-weight:700}
.btn{display:inline-block;text-decoration:none;font-weight:700;font-size:16px;padding:13px 22px;border-radius:999px;background:#14112B;color:#fff;border:2px solid #14112B}
.btn:hover{color:#fff;transform:translate(-2px,-2px);box-shadow:5px 5px 0 #5B3FFF}
.legal{max-width:820px;width:100%;margin:0 auto;padding:24px 24px 80px;line-height:1.65;font-size:17px;flex:1}
.legal h1{font-family:'Bricolage Grotesque',sans-serif;font-size:48px;line-height:1.05;letter-spacing:-1.5px;margin:16px 0 8px}
.legal h2{font-family:'Bricolage Grotesque',sans-serif;font-size:26px;line-height:1.2;margin:40px 0 10px}
.legal .updated{color:#3D3A55;font-size:15px;margin:0 0 28px}
.legal .summary{background:#fff;border:2px solid #14112B;border-radius:18px;box-shadow:6px 6px 0 #14112B;padding:20px 24px;margin:0 0 12px}
.legal .summary ul{margin:8px 0 0;padding-left:20px}
.legal li{margin:6px 0}
.page-footer{background:#14112B;color:#C9C5E8;font-size:14px}
.page-footer div{max-width:960px;margin:0 auto;padding:28px 24px;display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between}
.page-footer a{color:#fff}
.notice{max-width:640px;margin:0 auto;padding:80px 24px;text-align:center;flex:1}
.notice h1{font-family:'Bricolage Grotesque',sans-serif;font-size:52px;line-height:1.05;letter-spacing:-1.5px;margin:0 0 16px}
.notice p{font-size:18px;line-height:1.6;color:#3D3A55}
@media (max-width:760px){.legal h1,.notice h1{font-size:36px!important}}

/* Fixes from responsive review */
.work-tile{padding:0 16px;overflow:hidden}
.work-tile span{font-size:clamp(30px,3.4vw,52px)!important;line-height:1;text-align:center;word-break:break-all}
@media (max-width: 860px){
  .site-header{padding:14px 16px!important;gap:12px!important}
  .site-header > a svg{width:46px;height:40px}
  .site-header > a [style*="font-size: 10px"]{font-size:8.5px!important;letter-spacing:.4px!important}
}
@media (max-width: 760px){
  /* decorative shapes collide with text on small screens */
  [aria-hidden="true"][style*="position: absolute"]{display:none!important}
  .work-tile span{font-size:40px!important}
}
.work-tile span.long{font-size:clamp(24px,2.4vw,36px)!important;word-break:normal}
@media (max-width: 760px){.work-tile span.long{font-size:30px!important}}