:root{--men-max:1320px}
body.men-page{background:#050505}
.men-page .site-header{border-bottom-color:rgba(255,255,255,.08)}
.men-page .primary-nav a.is-active{color:#e31b23;position:relative}
.men-page .primary-nav a.is-active:after{content:"";position:absolute;left:0;right:0;bottom:-13px;height:2px;background:#e31b23}

.men-hero{position:relative;min-height:480px;overflow:hidden;border-bottom:1px solid var(--line);background:#050505}
.men-hero-media{position:absolute;inset:0;background-image:url('/assets/hero/mens-hero-image.png?v=20260816-0120');background-size:cover;background-position:center 42%;filter:none}
.men-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,5,5,.98) 0%,rgba(5,5,5,.92) 28%,rgba(5,5,5,.55) 49%,rgba(5,5,5,.16) 73%,rgba(5,5,5,.08) 100%)}
.men-hero-content{position:relative;z-index:2;width:min(calc(100% - 48px),var(--men-max));margin:0 auto;padding:54px 0 58px}
.men-hero h1{margin:0;font-family:'Oswald',sans-serif;font-size:clamp(64px,8vw,112px);font-weight:700;line-height:.84;letter-spacing:-.025em;text-transform:uppercase;text-shadow:0 3px 24px rgba(0,0,0,.7)}
.men-hero h1 span{display:block;color:#e31b23}
.men-tagline{margin:14px 0 0;font-family:'Oswald',sans-serif;font-size:clamp(20px,2vw,29px);font-weight:500;text-transform:uppercase;letter-spacing:.015em;color:#d8d8d8}
.men-tagline strong{color:#fff}
.men-intro{max-width:560px;margin:14px 0 24px;color:#d0d0d3;font-size:16px;line-height:1.58}
.men-hero .button{border-radius:5px;padding:13px 24px}

.men-section{width:min(calc(100% - 48px),var(--men-max));margin:0 auto;padding-top:28px}
.men-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:15px;padding-left:12px;border-left:3px solid var(--red)}
.men-section-heading h2{margin:0;font-family:'Oswald',sans-serif;font-size:31px;font-weight:500;line-height:1;text-transform:uppercase;letter-spacing:-.015em}
.men-section-heading p{margin:7px 0 0;color:#909095;font-size:13px}
.men-section-link{flex:none;color:var(--red);font-family:'Oswald',sans-serif;font-size:14px;text-decoration:none;text-transform:uppercase}
.men-section-link:hover{color:#fff}

.level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.level-card{position:relative;min-height:250px;display:grid;grid-template-columns:70px 1fr;gap:20px;padding:28px 30px 26px;border:1px solid rgba(255,255,255,.14);border-bottom:3px solid var(--red);border-radius:7px;background:linear-gradient(145deg,#111214,#090909);text-decoration:none;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.level-card:hover{transform:translateY(-3px);border-color:rgba(227,27,35,.5);background:linear-gradient(145deg,#151516,#0a0a0b)}
.level-shield{width:62px;height:74px;display:grid;place-items:center;clip-path:polygon(50% 0,92% 18%,88% 72%,50% 100%,12% 72%,8% 18%);background:var(--red)}
.level-shield span{width:56px;height:68px;display:grid;place-items:center;clip-path:inherit;background:#111;color:var(--red);font-family:'Oswald',sans-serif;font-size:25px;font-weight:700}
.level-copy{display:flex;min-width:0;flex-direction:column}
.level-label{margin:1px 0 5px;color:var(--red);font-family:'Oswald',sans-serif;font-size:15px;text-transform:uppercase}
.level-card h3{margin:0;font-family:'Oswald',sans-serif;font-size:25px;font-weight:500;line-height:1.03;text-transform:uppercase}
.level-card p{margin:17px 0 20px;color:#a9a9ad;font-size:14px;line-height:1.55}
.level-action{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding:10px 13px;border:1px solid rgba(255,255,255,.16);border-radius:5px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;text-transform:uppercase}
.level-action b{color:#fff;font-size:18px;font-weight:400}

.start-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.men-lesson-card{display:block;min-width:0;padding:0;border:0;background:transparent;color:#fff;text-align:left;cursor:pointer;transition:transform .25s ease}
.men-lesson-media{position:relative;display:block;width:100%;overflow:hidden;aspect-ratio:16/9;border:1px solid rgba(255,255,255,.14);border-radius:6px;background:#0b0b0c;transition:border-color .25s ease,box-shadow .25s ease}
.men-lesson-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .28s ease,filter .28s ease}
.men-lesson-media:before,.series-art:before{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 50% 50%,rgba(227,27,35,.18),transparent 34%),linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.52));opacity:0;transition:opacity .25s ease;pointer-events:none}
.men-lesson-media:after,.series-art:after{content:"▶";position:absolute;top:50%;left:50%;z-index:3;width:48px;height:48px;display:grid;place-items:center;padding-left:2px;border:1px solid rgba(255,255,255,.88);border-radius:50%;background:rgba(207,18,26,.92);box-shadow:0 0 0 0 rgba(227,27,35,.35),0 10px 28px rgba(0,0,0,.42);color:#fff;font-size:15px;line-height:1;opacity:0;transform:translate(-50%,-50%) scale(.72);transition:opacity .22s ease,transform .22s ease,box-shadow .25s ease;pointer-events:none}
.lesson-order{position:absolute;top:8px;left:8px;z-index:2;display:grid;place-items:center;width:31px;height:31px;background:rgba(0,0,0,.8);border-left:3px solid var(--red);color:var(--red);font-family:'Oswald',sans-serif;font-size:22px;font-weight:600}
.men-lesson-card h3{margin:10px 0 4px;font-family:'Oswald',sans-serif;font-size:17px;font-weight:500;line-height:1.15;transition:color .22s ease}
.men-lesson-card p{margin:0;color:#9a9a9f;font-size:12.5px;line-height:1.5}

.series-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;align-items:start}
.series-card{display:flex;min-width:0;flex-direction:column;padding:0;border:0;background:transparent;color:#fff;text-align:left;cursor:pointer;transition:transform .25s ease}
.series-art{position:relative;display:block;width:100%;overflow:hidden;aspect-ratio:16/9;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:#0b0b0c;transition:border-color .25s ease,box-shadow .25s ease}
.series-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .28s ease,filter .28s ease}
.series-card h3{margin:9px 0 1px;font-family:'Oswald',sans-serif;font-size:17px;font-weight:500;line-height:1.18;transition:color .22s ease}
.series-card small{color:#97979c;font-size:13px}

@media(hover:hover) and (pointer:fine){
  .men-lesson-card:hover,.series-card:hover{transform:translateY(-5px)}
  .men-lesson-card:hover .men-lesson-media,.series-card:hover .series-art{border-color:rgba(227,27,35,.82);box-shadow:0 14px 34px rgba(227,27,35,.18),0 0 0 1px rgba(227,27,35,.14)}
  .men-lesson-card:hover .men-lesson-media:before,.series-card:hover .series-art:before{opacity:1}
  .men-lesson-card:hover .men-lesson-media:after,.series-card:hover .series-art:after{opacity:1;transform:translate(-50%,-50%) scale(1);box-shadow:0 0 0 7px rgba(227,27,35,.12),0 12px 30px rgba(0,0,0,.48)}
  .men-lesson-card:hover img,.series-card:hover .series-art img{transform:scale(1.065);filter:brightness(.72) contrast(1.05)}
  .men-lesson-card:hover h3,.series-card:hover h3{color:#ef3b42}
}
.men-lesson-card:focus-visible,.series-card:focus-visible{outline:2px solid #ef3b42;outline-offset:5px;border-radius:6px}
.men-lesson-card:focus-visible .men-lesson-media:after,.series-card:focus-visible .series-art:after{opacity:1;transform:translate(-50%,-50%) scale(1)}

.men-callout{width:min(calc(100% - 48px),var(--men-max));margin:34px auto 44px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:30px;padding:26px 30px;border:1px solid rgba(255,255,255,.14);border-radius:8px;background:linear-gradient(90deg,#0d0d0e,#111 55%,#0b0b0c)}
.men-callout h2{margin:0;font-family:'Oswald',sans-serif;font-size:28px;font-weight:500;text-transform:uppercase}
.men-callout p{margin:4px 0 0;max-width:690px;color:#a9a9ad;font-size:14px}
.men-callout .button{border-radius:5px;padding:13px 28px;white-space:nowrap}

.men-page .video-modal.is-playlist-mode .video-modal-panel{width:min(100%,1240px)}
.men-page .video-modal.is-playlist-mode .video-modal-body{display:grid;grid-template-columns:minmax(0,1fr) 360px;align-items:start;background:#050505}
.men-page .video-playlist-panel{display:flex;min-width:0;max-height:min(66vh,620px);flex-direction:column;border-left:1px solid rgba(255,255,255,.12);background:#090909}
.men-page .video-playlist-panel[hidden]{display:none!important}
.men-page .video-playlist-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px;border-bottom:1px solid rgba(255,255,255,.1)}
.men-page .video-playlist-heading strong{font-family:'Oswald',sans-serif;font-size:18px;font-weight:500;text-transform:uppercase}
.men-page .video-playlist-heading span{color:#85858b;font-size:12px;text-transform:uppercase}
.men-page .video-playlist-status{margin:0;padding:16px;color:#aaaab0;font-size:13px}
.men-page .video-playlist-list{min-height:0;overflow-y:auto}
.men-page .video-playlist-item{display:grid;width:100%;grid-template-columns:38px minmax(0,1fr);gap:10px;align-items:start;padding:13px 14px;border:0;border-bottom:1px solid rgba(255,255,255,.075);background:transparent;color:#fff;text-align:left;cursor:pointer}
.men-page .video-playlist-item:hover{background:#111}
.men-page .video-playlist-item.is-active{background:#161616;box-shadow:inset 3px 0 0 var(--red)}
.men-page .video-playlist-number{padding-top:2px;color:#6f6f74;font-family:'Oswald',sans-serif;font-size:13px}
.men-page .video-playlist-item.is-active .video-playlist-number{color:var(--red)}
.men-page .video-playlist-item-copy{display:flex;min-width:0;flex-direction:column;gap:4px}
.men-page .video-playlist-item-copy strong{font-family:'Oswald',sans-serif;font-size:15px;font-weight:400;line-height:1.28}
.men-page .video-playlist-item-copy small{color:#85858b;font-size:11px;text-transform:uppercase;letter-spacing:.04em}

@media(max-width:1120px){
  .start-grid,.series-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .level-card{grid-template-columns:58px 1fr;padding:24px 22px}
  .level-shield{width:54px;height:65px}.level-shield span{width:48px;height:59px}
}
@media(max-width:900px){
  .men-hero{min-height:430px}.men-hero-media{background-position:60% center}.men-hero-shade{background:linear-gradient(90deg,rgba(5,5,5,.97),rgba(5,5,5,.68) 58%,rgba(5,5,5,.2))}
  .level-grid{grid-template-columns:1fr}
  .men-callout{grid-template-columns:1fr}.men-callout .button{justify-self:start}
}
@media(max-width:760px){
  .men-page .primary-nav a.is-active:after{display:none}
  .men-hero{min-height:420px}.men-hero-media{background-position:64% center}.men-hero-shade{background:linear-gradient(90deg,rgba(5,5,5,.96),rgba(5,5,5,.65) 70%,rgba(5,5,5,.28))}
  .men-hero-content,.men-section,.men-callout{width:min(calc(100% - 32px),var(--men-max))}
  .men-hero-content{padding:46px 0 50px}.men-hero h1{font-size:clamp(54px,18vw,78px)}.men-tagline{font-size:20px}.men-intro{font-size:14px;max-width:390px}
  .men-section{padding-top:24px}.men-section-heading{align-items:flex-start}.men-section-heading h2{font-size:26px}.men-section-link{display:none}
  .start-grid,.series-grid{display:flex;overflow-x:auto;gap:14px;padding-bottom:14px;scroll-snap-type:x proximity}.men-lesson-card,.series-card{min-width:250px;scroll-snap-align:start}
  .men-callout{grid-template-columns:1fr;gap:14px;padding:22px}.men-callout .button{grid-column:1}
  .men-page .video-modal.is-playlist-mode .video-modal-body{grid-template-columns:1fr}.men-page .video-playlist-panel{max-height:38vh;border-left:0;border-top:1px solid rgba(255,255,255,.12)}
}

@media(prefers-reduced-motion:reduce){.men-lesson-card,.series-card,.men-lesson-media,.series-art,.men-lesson-media img,.series-art img,.men-lesson-media:before,.series-art:before,.men-lesson-media:after,.series-art:after{transition:none!important}}
