/* ManlyMovement site stylesheet */
:root{
  --navy:#1b2a4a;
  --navy-2:#243662;
  --red:#c0392b;
  --blue:#4472c4;
  --green:#2f7d43;
  --yellow:#d9a621;
  --yellow-bg:#fdf3d9;
  --ink:#22283a;
  --muted:#3a4258;
  --light-bg:#eef1f8;
  --border:#dde2ec;
  --white:#fff;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  line-height:1.5;
  background:var(--white);
}
a{color:var(--blue);text-decoration:none;}
a:hover{text-decoration:underline;}
img{max-width:100%;display:block;}
.wrap{max-width:1080px;margin:0 auto;padding:0 24px;}

/* Header / Nav */
header.site-header{
  background:var(--navy);
  color:var(--white);
  position:sticky;
  top:0;
  z-index:100;
  border-bottom:3px solid var(--red);
}
.nav-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 24px;
  max-width:1080px;
  margin:0 auto;
}
.brand{display:flex;flex-direction:column;line-height:1.15;}
.brand a{color:var(--white);text-decoration:none;}
.brand .name{font-size:17pt;font-weight:bold;letter-spacing:0.5px;}
.brand .tagline{font-size:8pt;letter-spacing:2px;color:#a9b6d6;margin-top:2px;}
nav.main-nav{display:flex;gap:22px;align-items:center;}
nav.main-nav a{
  color:#d7deee;
  font-size:9.6pt;
  letter-spacing:0.3px;
  text-decoration:none;
  padding:6px 0;
  border-bottom:2px solid transparent;
}
nav.main-nav a:hover, nav.main-nav a.active{
  color:var(--white);
  border-bottom:2px solid var(--red);
}
.nav-cta{
  background:var(--red);
  color:var(--white) !important;
  padding:8px 16px !important;
  border-radius:4px;
  border-bottom:none !important;
  font-weight:bold;
}
.nav-cta:hover{background:#a52f22;text-decoration:none !important;}
.menu-toggle{display:none;background:none;border:none;color:var(--white);font-size:22pt;cursor:pointer;}

@media (max-width:800px){
  nav.main-nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;right:0;
    background:var(--navy-2);
    flex-direction:column;
    gap:0;
    padding:8px 24px 14px 24px;
    border-bottom:3px solid var(--red);
  }
  nav.main-nav.open{display:flex;}
  nav.main-nav a{padding:10px 0;border-bottom:1px solid #33447a;width:100%;}
  .nav-cta{margin-top:8px;text-align:center;}
  .menu-toggle{display:block;}
}

/* Hero */
.hero{
  background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);
  color:var(--white);
  padding:64px 0 56px 0;
}
.hero .wrap{display:flex;align-items:center;gap:48px;}
.hero-text{flex:1.3;}
.hero-photo{flex:1;display:flex;justify-content:center;}
.hero-photo img{
  width:220px;height:220px;border-radius:50%;
  object-fit:cover;border:4px solid var(--blue);
}
.eyebrow{letter-spacing:2.5px;font-size:9.5pt;color:#a9b6d6;margin-bottom:10px;font-weight:bold;}
.hero h1{font-size:30pt;margin:0 0 14px 0;line-height:1.15;}
.redline{width:64px;height:3px;background:var(--red);margin:0 0 16px 0;}
.hero p.lead{font-size:12pt;color:#d7deee;margin:0 0 22px 0;max-width:560px;}
.btn-row{display:flex;gap:14px;flex-wrap:wrap;}
.btn{
  display:inline-block;
  padding:12px 22px;
  border-radius:5px;
  font-size:10pt;
  font-weight:bold;
  letter-spacing:0.3px;
  text-decoration:none !important;
  border:2px solid transparent;
}
.btn-primary{background:var(--red);color:var(--white) !important;}
.btn-primary:hover{background:#a52f22;}
.btn-outline{background:transparent;color:var(--white) !important;border:2px solid var(--white);}
.btn-outline:hover{background:rgba(255,255,255,0.12);}
.btn-navy{background:var(--navy);color:var(--white) !important;}
.btn-navy:hover{background:var(--navy-2);}

.membership-toggle{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px;}
.membership-toggle-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:12px 24px;
  border-radius:999px;
  font-size:10pt;
  font-weight:bold;
  letter-spacing:0.3px;
  border:2px solid var(--navy);
  background:transparent;
  color:var(--navy);
  cursor:pointer;
  font-family:inherit;
  transition:background 0.15s ease,color 0.15s ease;
}
.membership-toggle-btn:hover{background:var(--light-bg);}
.membership-toggle-btn.active{background:var(--navy);color:var(--white);}
.membership-tab{display:none;}
.membership-tab.active{display:block;}
@media (max-width:600px){
  .membership-toggle{flex-direction:column;}
  .membership-toggle-btn{justify-content:center;width:100%;}
}

/* Video carousel (About page "See It In Action") — arrows are overlaid on
   top of the video (absolutely positioned) rather than sitting in the flex
   row, so the video itself always gets the container's full width instead
   of competing with the arrows for space (this is what was getting cropped
   on mobile) and the whole component stays a single, compact, centered
   column instead of stretching across the full section width on desktop. */
.video-carousel-wrap{
  position:relative;
  max-width:400px;
  width:100%;
  margin:0 auto;
}
.video-carousel{
  display:flex;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
  width:100%;
}
.video-carousel::-webkit-scrollbar{display:none;}
.video-slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  display:flex;
  justify-content:center;
  scroll-snap-align:center;
}
.video-slide > blockquote{position:relative;z-index:1;margin:0 auto !important;}
/* Static placeholder card shown behind each TikTok embed while the
   embed.js script and iframe load (helps on slow connections so the
   carousel never looks like an empty gap). It sits at z-index:0, so the
   real embed (given z-index:1 above) simply covers it once it renders —
   no JS needed to hide it. */
.video-slide-poster{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  z-index:0;
  width:300px;
  max-width:92%;
  height:640px;
  max-height:100%;
  border-radius:12px;
  background:linear-gradient(160deg,var(--navy) 0%,var(--navy-2) 100%);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:rgba(255,255,255,0.85);
  font-size:8.5pt;
  letter-spacing:0.3px;
}
.video-carousel-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid var(--border);
  background:rgba(255,255,255,0.92);
  color:var(--navy);
  font-size:12pt;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 1px 4px rgba(27,42,74,0.18);
  z-index:5;
}
.video-carousel-arrow.prev{left:-6px;}
.video-carousel-arrow.next{right:-6px;}
.video-carousel-arrow:hover{background:var(--white);}
@media (max-width:480px){
  .video-carousel-arrow{width:30px;height:30px;font-size:10pt;}
  .video-carousel-arrow.prev{left:2px;}
  .video-carousel-arrow.next{right:2px;}
}
.video-carousel-dots{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:14px;
}
.video-carousel-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--border);
  border:none;
  padding:0;
  cursor:pointer;
}
.video-carousel-dot.active{background:var(--navy);}

@media (max-width:800px){
  .hero .wrap{flex-direction:column-reverse;text-align:center;}
  .hero p.lead{margin-left:auto;margin-right:auto;}
  .btn-row{justify-content:center;}
}

/* Sections */
section{padding:52px 0;}
section.alt{background:var(--light-bg);}
h2.section-title{
  font-size:20pt;
  color:var(--navy);
  margin:0 0 8px 0;
}
p.section-lead{font-size:10.3pt;color:var(--muted);max-width:680px;margin:0 0 32px 0;}

/* Pillar / service cards */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
@media (max-width:800px){.grid-3,.grid-2{grid-template-columns:1fr;}}

.card{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:8px;
  padding:24px;
  box-shadow:0 1px 3px rgba(27,42,74,0.06);
}
.card .tag{
  display:inline-block;
  font-size:7.6pt;
  letter-spacing:1px;
  font-weight:bold;
  color:var(--white);
  background:var(--blue);
  padding:3px 8px;
  border-radius:3px;
  text-transform:uppercase;
  margin-bottom:10px;
}
.card h3{font-size:13pt;color:var(--navy);margin:0 0 8px 0;}
.card p{font-size:9.6pt;color:var(--muted);margin:0 0 10px 0;}
.card .price{font-size:11pt;color:var(--red);font-weight:bold;}

/* Credential strip */
.cred-strip{
  display:flex;
  flex-wrap:wrap;
  gap:10px 28px;
  padding:20px 0;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  margin:36px 0;
}
.cred-strip .item{font-size:9pt;color:var(--muted);position:relative;padding-left:18px;}
.cred-strip .item:before{content:"\2726";position:absolute;left:0;color:var(--red);font-size:8.5pt;}

/* Lists */
ul.check-list{list-style:none;margin:0;padding:0;}
ul.check-list li{position:relative;padding:5px 0 5px 22px;font-size:9.8pt;color:var(--ink);}
ul.check-list li:before{content:"\2713";position:absolute;left:0;color:var(--green);font-weight:bold;}

/* Tables */
table.data-table{width:100%;border-collapse:collapse;font-size:9.2pt;margin:10px 0 20px 0;}
table.data-table th{background:var(--navy);color:var(--white);text-align:left;padding:9px 10px;font-size:8.6pt;}
table.data-table td{padding:8px 10px;border-bottom:1px solid var(--border);vertical-align:top;}
table.data-table tr:nth-child(even) td{background:var(--light-bg);}
.save-note{font-size:7.8pt;color:var(--green);font-weight:bold;}

/* Callouts */
.callout{padding:14px 18px;border-left:5px solid var(--blue);background:#e6ecf7;font-size:9.6pt;margin:16px 0;border-radius:0 6px 6px 0;}
.callout.yellow{border-left-color:var(--yellow);background:var(--yellow-bg);}
.callout b.tag-label{text-transform:uppercase;font-size:8pt;letter-spacing:0.5px;color:var(--navy);display:block;margin-bottom:4px;}

/* Diff blocks (Why Choose Me) */
.diff-block{margin-bottom:14px;}
.diff-block b{color:var(--navy);font-size:10.2pt;display:block;margin-bottom:2px;}
.diff-block span{font-size:9.3pt;color:var(--muted);}

/* Resource cards */
.resource-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:8px;
  padding:18px 22px;
  margin-bottom:12px;
}
.resource-card .rc-text h4{margin:0 0 4px 0;font-size:11pt;color:var(--navy);}
.resource-card .rc-text p{margin:0;font-size:8.8pt;color:var(--muted);}
@media (max-width:600px){
  .resource-card{flex-direction:column;align-items:flex-start;}
}

/* Locked / exclusive content teaser */
.locked-card{
  display:flex;
  align-items:center;
  gap:18px;
  background:var(--yellow-bg);
  border:1.5px dashed var(--yellow);
  border-radius:8px;
  padding:20px 22px;
  margin-bottom:12px;
}
.locked-card .locked-icon{font-size:22pt;flex-shrink:0;}
.locked-card .rc-text h4{margin:0 0 4px 0;font-size:11pt;color:var(--navy);}
.locked-card .rc-text p{margin:0;font-size:8.8pt;color:var(--muted);}
@media (max-width:600px){
  .locked-card{flex-direction:column;align-items:flex-start;}
}

/* Exclusive client-resources page */
.lock-screen{
  max-width:440px;
  margin:40px auto;
  background:var(--white);
  border:1px solid var(--border);
  border-radius:10px;
  padding:32px 28px;
  text-align:center;
  box-shadow:0 2px 8px rgba(27,42,74,0.08);
}
.lock-screen .locked-icon-lg{font-size:34pt;margin-bottom:10px;}
.lock-screen h2{color:var(--navy);font-size:15pt;margin:0 0 8px 0;}
.lock-screen p{font-size:9.4pt;color:var(--muted);margin:0 0 18px 0;}
.lock-screen input[type="text"]{
  width:100%;
  padding:11px 12px;
  border:1px solid var(--border);
  border-radius:5px;
  font-size:10pt;
  margin-bottom:12px;
  text-align:center;
  letter-spacing:1px;
  text-transform:uppercase;
}
.lock-screen .btn{width:100%;text-align:center;border:none;cursor:pointer;}
.lock-screen .error-msg{color:var(--red);font-size:8.6pt;margin-top:10px;display:none;}
.exclusive-badge{
  display:inline-block;
  background:var(--green);
  color:var(--white);
  font-size:7.6pt;
  letter-spacing:1px;
  text-transform:uppercase;
  font-weight:bold;
  padding:3px 9px;
  border-radius:3px;
  margin-bottom:10px;
}

/* Pay tables (per-track pricing + payment links) */
.pay-track-block{margin-bottom:34px;}
.pay-track-block h3{
  font-size:13pt;color:var(--navy);margin:0 0 4px 0;
}
.pay-track-block .track-note{font-size:8.6pt;color:var(--muted);margin:0 0 10px 0;}
table.pay-table{width:100%;border-collapse:collapse;font-size:9pt;margin-bottom:6px;}
table.pay-table th{background:var(--navy);color:var(--white);text-align:center;padding:8px 6px;font-size:8.2pt;}
table.pay-table th:first-child{text-align:left;}
table.pay-table td{padding:8px 6px;border-bottom:1px solid var(--border);text-align:center;vertical-align:middle;}
table.pay-table td:first-child{text-align:left;font-weight:bold;color:var(--navy);}
table.pay-table tr:nth-child(even) td{background:var(--light-bg);}
table.pay-table td.na{color:#b7bfd1;}
a.pay-link{
  display:inline-block;
  background:var(--navy);
  color:var(--white) !important;
  font-size:8.6pt;
  font-weight:bold;
  padding:5px 10px;
  border-radius:4px;
  text-decoration:none !important;
  white-space:nowrap;
}
a.pay-link:hover{background:var(--red);}
@media (max-width:800px){
  table.pay-table{font-size:7.8pt;}
  a.pay-link{padding:4px 6px;font-size:7.6pt;}
}

/* Pay cards */
.pay-card{
  background:var(--white);border:1px solid var(--border);border-radius:8px;
  padding:20px;display:flex;flex-direction:column;gap:10px;
}
.pay-card .track{font-size:8pt;letter-spacing:0.8px;text-transform:uppercase;color:var(--blue);font-weight:bold;}
.pay-card h3{margin:0;font-size:12.5pt;color:var(--navy);}
.pay-card .amount{font-size:16pt;color:var(--red);font-weight:bold;}
.pay-card .dur{font-size:8.6pt;color:var(--muted);}

/* Footer */
footer.site-footer{
  background:var(--navy);
  color:#d7deee;
  padding:40px 0 18px 0;
  margin-top:40px;
}
footer.site-footer .foot-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:28px;margin-bottom:24px;}
footer.site-footer h4{color:var(--white);font-size:10.5pt;margin:0 0 10px 0;}
footer.site-footer a{color:#d7deee;font-size:9pt;}
footer.site-footer .foot-col p, footer.site-footer .foot-col a{display:block;margin:0 0 6px 0;font-size:9pt;}
.social-icon{vertical-align:-2px;margin-right:4px;}
footer.site-footer a.social-link{display:flex;align-items:center;gap:6px;}
footer.site-footer .social-icon{flex:none;color:#d7deee;margin-right:0;}
.about-social-line .social-icon{color:var(--navy);}
footer.site-footer .legal{
  border-top:1px solid #33447a;
  padding-top:14px;
  font-size:7.6pt;
  color:#8a93a6;
  text-align:center;
  line-height:1.5;
}

/* Page header (non-home pages) */
.page-header{background:var(--navy);color:var(--white);padding:40px 0 34px 0;}
.page-header .eyebrow{color:#a9b6d6;}
.page-header h1{font-size:24pt;margin:0 0 8px 0;}
.page-header p{color:#d7deee;font-size:10pt;max-width:640px;margin:0;}

.two-col{display:flex;gap:40px;}
.two-col > div{flex:1;}
@media (max-width:800px){.two-col{flex-direction:column;}}

.small-note{font-size:8pt;color:#8a93a6;margin-top:6px;}

/* Client self-log forms (nutrition / workout / retest) */
.log-form{
  background:var(--white);
  border:1px solid var(--border);
  border-radius:8px;
  padding:16px 18px;
  max-width:640px;
}
.log-form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:10px 14px;
  margin-bottom:10px;
}
.log-form label{
  display:block;
  font-size:8.4pt;
  font-weight:bold;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:0.3px;
  margin-bottom:12px;
}
.log-form-grid label{margin-bottom:0;}
.log-form input[type="text"],
.log-form input[type="date"],
.log-form input[type="number"],
.log-form textarea{
  display:block;
  width:100%;
  margin-top:5px;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:5px;
  font-size:9.5pt;
  font-family:inherit;
  font-weight:normal;
  text-transform:none;
  letter-spacing:normal;
  color:var(--ink);
}
.log-form textarea{resize:vertical;}
.log-form-checkbox{
  display:flex !important;
  align-items:center;
  gap:6px;
  font-size:9pt !important;
  text-transform:none !important;
  font-weight:normal !important;
}
.log-form-checkbox input{margin:0;}
.log-form .btn{margin-top:4px;}
.log-list-item{
  border:1px solid var(--border);
  border-radius:6px;
  padding:10px 12px;
  margin-bottom:8px;
  font-size:9pt;
}
.log-list-item .lli-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;font-weight:bold;color:var(--navy);}
.log-list-item .lli-meta{color:var(--muted);margin-top:3px;}
.log-list-item .lli-notes{color:#5a6178;margin-top:3px;font-style:italic;}

/* Nutrition log: macro/micronutrient section headers + vitamin/mineral checklist */
.log-form-subhead{
  font-size:9.5pt;font-weight:bold;color:var(--navy);
  text-transform:uppercase;letter-spacing:0.4px;
  margin:16px 0 8px 0;padding-top:12px;border-top:1px solid var(--border);
}
.log-form-subhead-2{
  font-size:8.6pt;font-weight:bold;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.3px;margin:8px 0 6px 0;
}
.micro-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:8px 12px;
  margin-bottom:10px;
}
.micro-item{display:flex;align-items:center;gap:6px;}
.micro-item .micro-check{
  display:flex !important;align-items:center;gap:5px;
  font-size:8.8pt !important;text-transform:none !important;
  font-weight:normal !important;margin:0 !important;flex:1;min-width:0;
}
.micro-item .micro-check input{margin:0;}
.micro-item .micro-amt{
  width:90px !important;flex-shrink:0;padding:5px 7px !important;margin-top:0 !important;
  border:1px solid var(--border);border-radius:5px;font-size:8.6pt;
}
.accordion-toggle{cursor:pointer;user-select:none;display:flex;align-items:center;gap:6px;}
.accordion-toggle:hover{color:var(--blue);}
.accordion-caret{display:inline-block;transition:transform 0.15s;font-size:8pt;}
.accordion-caret.open{transform:rotate(90deg);}
.micro-subgroup{margin-left:4px;padding-left:10px;border-left:2px solid var(--border);margin-bottom:10px;}