/* =====================================================================
   Train Unique California: shared layer (redesign staging, Oct 10 2026)
   Loaded on every page after the page's own <style> and assets/fab.css.
   - official Oct 4 logo sizing in the header
   - phone menu arrows sized (the menu was ~4 screens tall without this)
   - anchors and form errors land below the sticky header
   - one footer for the whole site, with the California social accounts
   - calmer motion for visitors who ask for reduced motion
   ===================================================================== */
html{scroll-padding-top:calc(var(--tu-head,72px) + 14px)}
.vh{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gold,#FFC81E);color:#0D0D0D;font-family:PP,sans-serif;font-weight:700;padding:12px 18px;text-decoration:none}
.skip:focus{left:0}
:focus-visible{outline-color:var(--gold,#FFC81E)}

/* header logo: official mark is 2.09:1 (the retired one was 2.38:1) */
.nav>a:first-child img{width:clamp(112px,9.6vw,150px);height:auto}
@media(max-width:400px){.nav>a:first-child img{width:98px}}

/* phone menu */
.tu-menu a svg{width:16px;height:16px;flex:none;display:block}
.tu-menu a{min-height:48px}
.tu-menu .tu-social{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.tu-menu .tu-social a{border:1px solid #333;padding:10px 12px;font-size:15px;min-height:44px;justify-content:center}

/* form result messages: readable links, announced errors */
.done a,.err a{color:var(--gold,#FFC81E);text-decoration:underline;font-weight:700}
.err:focus,.done:focus{outline:3px solid var(--gold,#FFC81E);outline-offset:4px}

/* shared footer */
.tu-foot{background:#0D0D0D;color:#BDBDBD;padding:clamp(36px,5vw,64px) var(--g,24px) 28px;border-top:1px solid #222;font-family:PP,sans-serif;font-size:15px;line-height:1.6}
.tu-foot .ft{display:grid;grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,64px)}
.tu-foot img{width:150px;height:auto;margin-bottom:14px}
.tu-foot h2{font-family:PP,sans-serif;font-weight:700;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold,#FFC81E);margin:0 0 10px}
.tu-foot ul{list-style:none;margin:0;padding:0}
.tu-foot li{margin:0}
.tu-foot li a{display:inline-flex;align-items:center;min-height:36px}
.tu-foot a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,200,30,.45)}
.tu-foot a:hover{color:var(--gold,#FFC81E)}
.tu-foot .sm{margin-top:18px;font-size:13px;color:#9A9A9A}
.tu-foot .legal{margin-top:clamp(28px,4vw,48px);padding-top:18px;border-top:1px solid #222;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:12.5px;color:#8A8A8A}
@media(max-width:800px){.tu-foot .ft{grid-template-columns:1fr}}

/* reduced motion: content is all there, nothing slides in */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important;scroll-behavior:auto!important}
  .rise{opacity:1!important;transform:none!important}
}

/* photo-led openings on program pages (real Train Unique photos, labeled by place) */
.tu-cap{position:absolute;left:0;bottom:0;margin:0;background:rgba(13,13,13,.86);color:#fff;font-family:PP,sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.06em;padding:7px 11px;line-height:1.3}
.tu-cap span{color:#CFCFCF;font-weight:400}
.open.has-photo{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);padding:0!important;align-items:stretch}
.open.has-photo .op-text{padding:clamp(26px,3.5vw,52px) var(--g) clamp(30px,4vw,56px)}
.open.has-photo .op-photo{margin:0;position:relative;line-height:0;min-height:340px;background:#151515}
.open.has-photo .op-photo img{width:100%;height:100%;object-fit:cover}
.open.has-photo h1{font-size:clamp(40px,5.6vw,92px)}
@media(max-width:1000px){
  .open.has-photo{grid-template-columns:1fr}
  .open.has-photo .op-photo{order:-1;min-height:0}
  .open.has-photo .op-photo img{height:auto;aspect-ratio:3/2}
}
/* social icons (Simple Icons, one color): footer list, phone menu, and the interest page's follow block */
.tu-ico{width:22px;height:22px;fill:currentColor;flex:none}
.tu-foot .tu-soc{gap:10px}
.tu-menu .tu-social a{display:inline-flex;align-items:center;gap:8px}
.tu-menu .tu-social .tu-ico{width:20px;height:20px}
.tu-follow{background:#0D0D0D;color:#fff;padding:clamp(36px,6vw,80px) var(--g,24px) clamp(8px,2vw,20px);max-width:1100px}
.tu-follow h2{font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;line-height:.9;font-size:clamp(34px,6vw,84px);margin:0 0 20px;color:#fff}
.tu-follow h2 em{font-style:normal;color:var(--gold,#FFC81E)}
.tu-follow ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:10px}
@media(min-width:760px){.tu-follow ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
.tu-follow a{display:flex;align-items:center;gap:14px;min-height:68px;padding:12px 16px;border:1px solid #3A3A3A;background:#161616;color:#fff;text-decoration:none}
.tu-follow a:hover,.tu-follow a:focus-visible{border-color:var(--gold,#FFC81E)}
.tu-follow .tu-ico{width:32px;height:32px;fill:#fff}
.tu-follow .t{display:flex;flex-direction:column;min-width:0}
.tu-follow .n{font-family:BC,Impact,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:21px;line-height:1}
.tu-follow .h{font-size:14px;color:#C9C9C9;margin-top:5px;overflow-wrap:anywhere}
.tu-follow+.hd{padding-top:clamp(28px,4vw,56px)}
/* mid-size screens: keep the menu on one line now that "Interest list" is back (it already wrapped at 1021-1090px before; the Menu button covers 1020 and below) */
@media(min-width:1021px) and (max-width:1279px){.nav>div{gap:2px clamp(8px,.95vw,12px)}.nav a{font-size:13px;letter-spacing:.05em}.nav img{width:clamp(96px,8.4vw,112px)}}
@media(min-width:1021px) and (max-width:1099px){.nav>div{gap:2px 7px}.nav a{font-size:12.5px;letter-spacing:.03em}.nav .tu-cta{padding-left:10px;padding-right:10px}.nav img{width:92px}}

/* California intro on the homepage (Oct 12, rev 4h) */
.ca-intro{display:grid;grid-template-columns:minmax(160px,280px) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:clamp(18px,3vw,40px);margin-top:clamp(32px,4vw,56px);border-top:5px solid var(--gold);padding-top:clamp(20px,2.5vw,32px);max-width:1000px}
.ca-intro figure{margin:0;line-height:0;grid-row:1/3}
.ca-intro img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%}
.ca-intro h3{font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(34px,3.6vw,52px);line-height:.9;color:#fff;margin-top:8px}
.ca-intro .role{margin-top:8px;font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.ca-intro .ca-body p.k{margin-top:14px}
.ca-intro .tu-btns{margin-top:20px}
@media(max-width:700px){.ca-intro{grid-template-columns:116px minmax(0,1fr);grid-template-rows:auto auto;column-gap:16px}.ca-intro figure{grid-row:1}.ca-intro .ca-head{align-self:center}.ca-intro .ca-body{grid-column:1/-1}.ca-intro h3{font-size:34px}}

.ca-intro.no-photo{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto}.ca-intro.no-photo .ca-head,.ca-intro.no-photo .ca-body{grid-column:1/-1}

/* blocks moved off the homepage (Oct 12, rev 4h): Our Story, Structured Sessions, Personal Training */
.tu-mv .mv-mosaic{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(120px,13vw,190px);gap:10px;margin-top:clamp(28px,3.5vw,48px)}
.tu-mv .mv-mosaic figure{margin:0;overflow:hidden;background:#151515}
.tu-mv .mv-mosaic img{width:100%;height:100%;object-fit:cover}
.tu-mv .m1{grid-column:1/6;grid-row:span 3}.tu-mv .m2{grid-column:6/9;grid-row:span 2}.tu-mv .m3{grid-column:9/13;grid-row:span 2}
.tu-mv .m4{grid-column:6/10;grid-row:span 2}.tu-mv .m5{grid-column:10/13;grid-row:span 2}.tu-mv .m6{grid-column:1/6;grid-row:span 1}
.tu-mv .mv-origin{margin-top:14px;font-weight:700;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#A8A8A8;max-width:none}
.tu-mv .mv-origin b{color:var(--gold)}
.tu-mv .mv-fam{display:grid;grid-template-columns:minmax(150px,280px) minmax(0,1fr);gap:clamp(14px,2vw,26px);align-items:start;border-top:5px solid var(--gold);padding-top:20px;margin-top:clamp(24px,3vw,40px);max-width:900px}
.tu-mv .mv-fam video{width:100%;height:auto;background:#000;display:block}
.tu-mv .mv-fam h3{font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(28px,3vw,44px);line-height:.9;color:#fff}
.tu-mv .mv-fam h3 em{font-style:normal;color:var(--gold)}
.tu-mv .mv-fam p{margin-top:12px;color:#CFCFCF;font-size:15.5px}
.tu-mv .mv-fam details{margin-top:14px}
.tu-mv .mv-fam summary{cursor:pointer;color:var(--gold);font-weight:700;font-size:15px;min-height:44px;display:flex;align-items:center}
.tu-mv .mv-row{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,22px);margin-top:clamp(24px,3vw,40px);align-items:start}
.tu-mv figure{margin:0}
.tu-mv video.mv-tall{width:100%;height:auto;background:#000;display:block;aspect-ratio:9/16;object-fit:cover}
.tu-mv figcaption{margin-top:10px;font-size:14px;color:#BDBDBD}
.tu-mv figcaption b{color:#fff}
.tu-mv .mv-one{max-width:340px;margin-top:clamp(24px,3vw,40px)}
.mv-hj{max-width:340px;margin-top:clamp(22px,3vw,36px)}
.mv-hj video{width:100%;height:auto;background:#000;display:block}
.tu-mv .mv-news{display:grid;grid-template-columns:minmax(220px,.6fr) minmax(0,1fr);gap:clamp(18px,3vw,40px);margin-top:clamp(26px,3vw,40px);align-items:start}
.tu-mv .mv-news video{width:100%;height:auto;background:#000;border-top:5px solid var(--gold);display:block}
.tu-mv .mv-news p{color:#CFCFCF;font-size:15px}
.tu-mv .mv-press{list-style:none;margin:0;padding:0}
.tu-mv .mv-press li{padding:14px 0;border-top:1px solid #262626;font-size:15.5px;color:#CFCFCF}
.tu-mv .mv-press li a{font-weight:700;color:var(--gold)}
@media(max-width:700px){.tu-mv .mv-mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;gap:6px}.tu-mv .mv-mosaic figure{grid-column:auto!important;grid-row:span 1!important}.tu-mv .mv-mosaic .m1{grid-column:1/-1!important;grid-row:span 2!important}.tu-mv .mv-fam,.tu-mv .mv-news{grid-template-columns:1fr}.tu-mv .mv-fam video{max-width:280px}.tu-mv .mv-row{grid-template-columns:1fr 1fr}}

/* "Before your first visit" block, shared by Long Beach and the Corona page (Oct 12) */
.tu-practical{margin-top:clamp(26px,3vw,40px);border-top:1px solid #2A2A2A;padding-top:20px;max-width:760px}
.tu-practical h2{font-family:BC,Impact,sans-serif;font-weight:800;text-transform:uppercase;font-size:clamp(22px,2.2vw,30px);color:#fff;line-height:1}
.tu-practical ul{list-style:none;margin-top:10px}
.tu-practical li{padding:8px 0;color:#CFCFCF;font-size:15.5px;border-bottom:1px solid #222}
.tu-practical b{color:#fff}
.tu-practical a{color:var(--gold)}
