/* SJ SMALLPAGE V35 — MOBILE + EVENT VALUE PASS */

/* TRUE SEAMLESS TICKER */
.v35-ticker{overflow:hidden!important}
.v35-ticker-track{
  display:flex;
  width:max-content;
  will-change:transform;
  animation:v35Ticker 38s linear infinite;
}
.v35-ticker-group{
  display:flex;
  flex:none;
  align-items:baseline;
  gap:26px;
  padding-right:26px;
}
.v35-ticker-group span{
  display:flex;
  align-items:baseline;
  gap:9px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  white-space:nowrap;
}
.v35-ticker-group b{
  font:800 31px/1 'Space Grotesk';
  letter-spacing:-.05em;
  color:var(--fest-blue);
}
.v35-ticker-group span:nth-of-type(2n) b{color:var(--fest-pink)}
.v35-ticker-group span:nth-of-type(3n) b{color:#087f7a}
.v35-ticker-group i{font-style:normal;font-size:18px;color:var(--fest-pink)}
@keyframes v35Ticker{to{transform:translateX(-50%)}}
.v35-ticker:hover .v35-ticker-track{animation-play-state:paused}

/* FESTIVAL / EVENT VALUE WITHOUT SALES-PAGE FEEL */
.v35-why-sj{
  background:#111522;
  color:#fff;
  padding:110px 0;
  position:relative;
  overflow:hidden;
}
.v35-why-sj:before{
  content:"EVENTS / PEOPLE / CONTENT / IMPACT";
  position:absolute;
  left:-1vw;
  top:18px;
  font:800 clamp(42px,8vw,115px)/.8 'Space Grotesk';
  letter-spacing:-.07em;
  color:#ffffff04;
  white-space:nowrap;
}
.v35-why-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:100px;
  position:relative;
  z-index:2;
}
.v35-why-intro>span{
  font-size:9px;
  font-weight:900;
  letter-spacing:.17em;
  color:var(--fest-yellow);
}
.v35-why-intro h2{
  font:750 clamp(49px,6vw,82px)/.86 'Space Grotesk';
  letter-spacing:-.06em;
  color:#fff;
  margin:14px 0 25px;
}
.v35-why-intro p{
  color:#bbc2d0;
  font-size:17px;
  line-height:1.7;
  max-width:530px;
}
.v35-why-intro button{
  margin-top:24px;
  appearance:none;
  border:0!important;
  border-bottom:2px solid var(--fest-pink)!important;
  padding:0 0 6px!important;
  background:none!important;
  color:#fff!important;
  border-radius:0!important;
  box-shadow:none!important;
  font:800 11px 'DM Sans'!important;
  cursor:pointer;
}
.v35-service-flow{display:grid}
.v35-service-flow article{
  display:grid;
  grid-template-columns:60px 1fr;
  gap:18px;
  padding:24px 0;
  border-top:1px solid #343a4c;
  position:relative;
}
.v35-service-flow article:last-child{border-bottom:1px solid #343a4c}
.v35-service-flow article:after{
  content:"";
  position:absolute;
  left:0;
  bottom:-1px;
  width:0;
  height:3px;
  background:linear-gradient(90deg,var(--fest-pink),var(--fest-blue),var(--fest-teal));
  transition:width .25s ease;
}
.v35-service-flow article:hover:after{width:100%}
.v35-service-flow>article>span{
  font:700 13px 'Space Grotesk';
  color:var(--fest-pink);
  padding-top:3px;
}
.v35-service-flow article:nth-child(2)>span{color:var(--fest-blue)}
.v35-service-flow article:nth-child(3)>span{color:var(--fest-yellow)}
.v35-service-flow article:nth-child(4)>span{color:var(--fest-teal)}
.v35-service-flow b{
  display:block;
  font:650 24px/1 'Space Grotesk';
  color:#fff;
  letter-spacing:-.03em;
  margin-bottom:8px;
}
.v35-service-flow p{
  margin:0;
  color:#939bad;
  font-size:13px;
  line-height:1.6;
  max-width:560px;
}

/* Slightly more useful hero language visually */
.v30-hero-copy>p{max-width:600px!important}
.v30-hero-actions{margin-top:34px!important}

/* MOBILE IS A DESIGNED EXPERIENCE, NOT STACKED DESKTOP */
@media(max-width:800px){
  html,body{overflow-x:hidden}
  .v30-public .wrap{width:calc(100% - 30px)!important}

  /* header */
  .v30-head .nav{min-height:64px!important}
  .v30-brand span{font-size:29px!important}
  .v30-head .nav-toggle{
    display:block!important;
    margin-left:auto!important;
    border:2px solid var(--fest-ink)!important;
    border-radius:999px!important;
    padding:8px 12px!important;
  }
  .v30-head nav{
    position:absolute!important;
    top:64px!important;
    left:0!important;
    right:0!important;
    margin:0!important;
    padding:18px 15px 22px!important;
    background:var(--fest-cream)!important;
    border-bottom:3px solid var(--fest-ink)!important;
    display:none!important;
    grid-template-columns:1fr 1fr!important;
    gap:0!important;
  }
  .v30-head nav.open{display:grid!important}
  .v30-head nav a{
    padding:13px 7px!important;
    border-bottom:1px solid #ded7ca!important;
    font-size:11px!important;
  }
  .v30-head .nav-work{
    grid-column:1/-1;
    margin-top:14px!important;
    width:100%;
    min-height:46px;
  }

  /* hero */
  .v30-hero{padding:38px 0 53px!important}
  .v30-hero-grid{display:flex!important;flex-direction:column!important;gap:28px!important}
  .v30-hero-copy{padding:0!important}
  .v30-overline{margin-bottom:16px!important}
  .v30-hero h1{
    font-size:clamp(62px,20vw,92px)!important;
    line-height:.78!important;
    letter-spacing:-.085em!important;
  }
  .v30-hero-copy>p{
    font-size:16px!important;
    line-height:1.55!important;
    margin-top:25px!important;
  }
  .v30-hero-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
  }
  .v30-btn{width:100%!important;min-height:44px}
  .v30-hero-image{
    margin:8px 7px 0 0!important;
    transform:rotate(.4deg)!important;
    box-shadow:9px 10px 0 var(--fest-blue)!important;
  }
  .v30-hero-image img{height:min(62vh,520px)!important}
  .v30-hero-image:after{
    right:-5px!important;
    top:20px!important;
    font-size:7px!important;
    padding:7px 9px!important;
  }
  .v32-hero-motion{width:125px!important;height:125px!important;right:-10px!important;top:-54px!important}

  /* ticker */
  .v34-numbers{padding:14px 0!important}
  .v35-ticker-track{animation-duration:27s}
  .v35-ticker-group{gap:18px;padding-right:18px}
  .v35-ticker-group b{font-size:25px}
  .v35-ticker-group span{font-size:8px}

  /* current/live */
  .v34-takeover-grid{padding:34px 0!important;gap:24px!important}
  .v34-live-title h2{font-size:48px!important}
  .v34-live-status{grid-template-columns:1fr 1fr!important}
  .v34-enter-live{width:110px!important;height:110px!important}

  /* generic sections */
  .v30-section{padding-top:65px!important;padding-bottom:65px!important}
  .v30-section-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    align-items:start!important;
    gap:12px!important;
    margin-bottom:27px!important;
  }
  .v30-section-head h2{
    font-size:clamp(39px,12vw,58px)!important;
  }
  .v30-section-head>a{width:max-content!important}

  /* featured */
  .v30-featured{padding-top:65px!important}
  .v30-featured-grid>img{height:390px!important}
  .v30-featured-grid h2{font-size:43px!important}
  .v30-featured-grid p{font-size:15px!important}

  /* diary becomes horizontally scannable */
  .v30-event-list{
    display:flex!important;
    gap:12px!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    padding-bottom:10px!important;
    scrollbar-width:none;
  }
  .v30-event-list::-webkit-scrollbar{display:none}
  .v30-event-row{
    flex:0 0 78vw!important;
    scroll-snap-align:start!important;
    display:grid!important;
    grid-template-columns:62px 1fr!important;
    background:#fff!important;
    border:2px solid var(--fest-ink)!important;
    padding:18px!important;
    min-height:145px;
  }
  .v30-event-row .v30-arrow{display:none}
  .v30-event-row h3{font-size:27px!important}
  .v30-event-row time b{font-size:31px!important}

  /* stories */
  .v30-story-grid{grid-template-columns:1fr!important;gap:42px!important}
  .v30-story-card:nth-child(n){margin-top:0!important}
  .v30-story-card img{aspect-ratio:4/3!important}
  .v30-story-card h3{font-size:31px!important}

  /* facts */
  .v32-facts{padding:68px 0!important}
  .v32-facts-heading h2{font-size:47px!important}
  .v32-facts-svg{width:170px!important}

  /* event-value section */
  .v35-why-sj{padding:72px 0!important}
  .v35-why-grid{grid-template-columns:1fr!important;gap:46px!important}
  .v35-why-intro h2{font-size:52px!important}
  .v35-why-intro p{font-size:16px!important}
  .v35-service-flow article{
    grid-template-columns:38px 1fr!important;
    gap:10px!important;
    padding:19px 0!important;
  }
  .v35-service-flow b{font-size:21px!important}

  /* about */
  .v30-about-grid{grid-template-columns:1fr!important;gap:34px!important;padding-top:72px!important;padding-bottom:72px!important}
  .v30-about h2{font-size:52px!important}
  .v30-about-copy>p{font-size:16px!important}
  .v30-stats{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
  }
  .v30-stats>div:last-child{grid-column:1/-1}

  /* people */
  .v34-people-run{
    margin-right:-15px!important;
    padding-right:40px!important;
  }
  .v34-person{flex-basis:72vw!important}
  .v34-person:nth-child(n){margin-top:0!important}
  .v34-person figure{height:390px!important}

  /* photography */
  .v30-photo-grid{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:10px!important;
    grid-auto-rows:auto!important;
    scrollbar-width:none;
  }
  .v30-photo-grid::-webkit-scrollbar{display:none}
  .v30-photo-item{
    flex:0 0 82vw!important;
    height:500px!important;
    scroll-snap-align:center!important;
    transform:none!important;
  }

  /* interlude */
  .v34-interlude{padding:64px 0 55px!important}
  .v34-interlude h2{font-size:58px!important}
  .v34-interlude svg{height:100px!important}

  /* social */
  .v30-social-grid{
    display:flex!important;
    overflow-x:auto!important;
    scroll-snap-type:x mandatory!important;
    gap:16px!important;
    padding-bottom:18px!important;
    scrollbar-width:none;
  }
  .v30-social-grid::-webkit-scrollbar{display:none}
  .v30-social-grid a{
    flex:0 0 76vw!important;
    scroll-snap-align:center!important;
    transform:none!important;
  }

  /* work CTA */
  .v30-work{padding:72px 0!important}
  .v30-work h2{font-size:62px!important}
  .v30-work p{font-size:16px!important}
  .v30-work button{min-height:45px!important;width:100%!important}

  /* contact */
  .v30-contact-launch{
    right:12px!important;
    bottom:12px!important;
    min-height:42px!important;
    padding:10px 14px!important;
  }
  .contact-sj-panel{
    width:100%!important;
    max-width:none!important;
    border-left:0!important;
    border-top:8px solid var(--fest-blue)!important;
  }
  .contact-sj-row{grid-template-columns:1fr!important}

  /* footer */
  .v30-footer{padding-top:54px!important}
  .v30-footer-grid{grid-template-columns:1fr!important;gap:30px!important}
  .v30-footer-grid:before{font-size:58px!important}
  .v30-footer-links{grid-template-columns:1fr 1fr!important}
}

@media(max-width:420px){
  .v30-hero h1{font-size:61px!important}
  .v30-hero-actions{grid-template-columns:1fr!important}
  .v30-hero-image img{height:430px!important}
  .v30-event-row{flex-basis:86vw!important}
  .v34-person{flex-basis:82vw!important}
  .v30-photo-item{flex-basis:88vw!important;height:430px!important}
  .v30-social-grid a{flex-basis:82vw!important}
  .v30-stats{grid-template-columns:1fr!important}
  .v30-stats>div:last-child{grid-column:auto}
}

@media(prefers-reduced-motion:reduce){
  .v35-ticker-track{animation:none!important}
}
