/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: Astra is fast, fully customizable &amp; beautiful WordPress theme suitable for blog, personal portfolio, business website and WooCommerce storefront. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with Schema.org code integrated and is Native AMP ready so search engines will love your site. It offers special features and templates so it works perfectly with all page builders like Elementor, Beaver Builder, Visual Composer, SiteOrigin, Divi, etc. Some of the other features: # WooCommerce Ready # Responsive # RTL &amp; Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained &amp; Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and WooCommerce ready theme that you can use for building any kind of website!
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.8.6.1732221992
Updated: 2024-11-21 20:46:32

*/

/* ============================================================
   GALLERY GRID (Photos page)
   Square Instagram-style tiles. Applies only to a Post Template
   block that has the Additional CSS class  instagram-grid
   - Photos: image only, nothing written on or under them
   - Articles: title fades in on hover (always shown on touch screens)
   To undo: delete everything from this comment to the END marker.
   ============================================================ */

ul.instagram-grid.wp-block-post-template {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Tablet and phone: same three columns, tighter gaps (like Instagram) */
@media (max-width: 781px) {
  ul.instagram-grid.wp-block-post-template { gap: 3px; }
}
@media (max-width: 480px) {
  ul.instagram-grid.wp-block-post-template { gap: 2px; }
}

/* WordPress itself collapses post grids to ONE column on phones (600px and
   narrower). This keeps the three-column Instagram look on every screen. */
ul.instagram-grid.wp-block-post-template.wp-block-post-template-is-layout-grid[class*="columns-"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* One square tile */
ul.instagram-grid > li.wp-block-post {
  position: relative;
  margin: 0;
  padding: 0;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: #111;
}

ul.instagram-grid > li .wp-block-post-featured-image,
ul.instagram-grid > li .wp-block-post-featured-image a {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
}

ul.instagram-grid > li .wp-block-post-featured-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.25s ease;
}

/* Dates are not shown in the grid */
ul.instagram-grid > li .wp-block-post-date {
  display: none;
}

/* Photos (Grid Shots): no title on the tile (kept for screen readers) */
ul.instagram-grid > li.type-grid_shot .wp-block-post-title {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Articles: title appears on hover / keyboard focus */
ul.instagram-grid > li.type-post .wp-block-post-title {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  margin: 0;
  padding: 12px;
  box-sizing: border-box;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 0.01em;
  text-align: left;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.78), rgba(0, 0, 0, 0) 65%);
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none; /* the click goes through to the image link */
}

ul.instagram-grid > li.type-post .wp-block-post-title a {
  color: #fff;
  text-decoration: none;
}

ul.instagram-grid > li.type-post:hover .wp-block-post-title,
ul.instagram-grid > li.type-post:focus-within .wp-block-post-title {
  opacity: 1;
}

/* Touch screens have no hover, so articles show their title all the time */
@media (hover: none) {
  ul.instagram-grid > li.type-post .wp-block-post-title {
    opacity: 1;
    font-size: 12px;
    padding: 8px;
  }
}

/* Small phones: smaller title text */
@media (max-width: 480px) {
  ul.instagram-grid > li.type-post .wp-block-post-title {
    font-size: 11px;
    padding: 6px;
  }
}

/* ============================================================
   END OF GALLERY GRID
   ============================================================ */

/* ============================================================
   GALLERY TABS + TAG CLOUD (Photos page)
   Tabs above the grid (All / My Boys / Bodies / Sex) and the tag
   cloud below it. Markup comes from functions.php section 10.
   To undo: delete everything from this comment to the END marker.
   ============================================================ */

.hb-grid-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 22px;
  margin: 0 0 14px;
  font-size: 13px;
  letter-spacing: 0.05em;
}

.hb-grid-nav a,
.hb-grid-tags a {
  color: inherit;
  text-decoration: none;
  opacity: 0.55;
  transition: opacity 0.15s ease;
}

.hb-grid-nav a {
  padding: 8px 0 6px;
  border-bottom: 1px solid transparent;
}

.hb-grid-nav a:hover,
.hb-grid-nav a:focus-visible,
.hb-grid-tags a:hover,
.hb-grid-tags a:focus-visible,
.hb-grid-nav a[aria-current="page"],
.hb-grid-tags a[aria-current="page"] {
  opacity: 1;
}

.hb-grid-nav a[aria-current="page"] {
  border-bottom-color: currentColor;
}

.hb-grid-tags {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 16px;
  margin: 36px 0 8px;
  line-height: 1.6;
}

.hb-grid-tags a[aria-current="page"] {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ============================================================
   END OF GALLERY TABS + TAG CLOUD
   ============================================================ */

/* ============================================================
   GUEST WORKS (submissions page)
   Three flexible-height columns. Markup comes from the shortcode
   [hb_guest_works] (functions.php section 11).
   To undo: delete everything from this comment to the END marker.
   ============================================================ */

.hb-gw {
  column-count: 3;
  column-gap: 32px;
  margin: 0 0 24px;
}

.hb-gw__card {
  display: block;
  break-inside: avoid;
  page-break-inside: avoid;
  margin: 0 0 44px;
  padding: 0;
}

/* Photos */
.hb-gw__photo,
.hb-gw__thumb {
  margin: 0;
  overflow: hidden;
  background: #111;
  cursor: zoom-in;
}

.hb-gw__photo img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 520px;
  object-fit: cover;
}

.hb-gw__thumbs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px;
  margin-top: 3px;
}

.hb-gw__thumb {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
}

.hb-gw__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hb-gw__thumb--more {
  cursor: pointer;
  color: #fff;
  text-decoration: none;
}

.hb-gw__thumb--more::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
}

.hb-gw__thumb--more span {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  letter-spacing: 0.04em;
}

.hb-gw__video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 520px;
  background: #000;
}

/* Words */
.hb-gw__title {
  margin: 14px 0 6px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: 0.01em;
}

.hb-gw__title a {
  color: inherit;
  text-decoration: none;
}

.hb-gw__title a:hover,
.hb-gw__title a:focus-visible {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.hb-gw__text {
  position: relative;
  max-height: 11.5em;
  overflow: hidden;
  font-size: 13.5px;
  line-height: 1.65;
  opacity: 0.85;
}

.hb-gw__text p {
  margin: 0 0 0.85em;
}

.hb-gw__text:not(.is-open):not(.is-short) {
  -webkit-mask-image: linear-gradient(#000 70%, transparent);
  mask-image: linear-gradient(#000 70%, transparent);
}

.hb-gw__text.is-open {
  max-height: none;
}

.hb-gw__more {
  margin: 4px 0 0;
  padding: 6px 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: inherit;
  font: inherit;
  font-size: 12px;
  letter-spacing: 0.05em;
  opacity: 0.6;
  cursor: pointer;
}

.hb-gw__more:hover,
.hb-gw__more:focus-visible {
  opacity: 1;
  background: none;
  color: inherit;
}

.hb-gw__more[hidden] {
  display: none;
}

.hb-gw__meta {
  margin-top: 10px;
  font-size: 11.5px;
  letter-spacing: 0.05em;
  opacity: 0.5;
}

.hb-gw__meta a {
  color: inherit;
  text-decoration: none;
}

.hb-gw__meta a:hover {
  text-decoration: underline;
}

/* "Read more" without JavaScript: a hidden checkbox + its label */
.hb-gw__body {
  position: relative;
}

.hb-gw__toggle {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}

.hb-gw__more {
  display: inline-block;
}

.hb-gw__more::before {
  content: "Read more";
}

.hb-gw__toggle:checked ~ .hb-gw__more::before {
  content: "Show less";
}

.hb-gw__toggle:checked ~ .hb-gw__text {
  max-height: none;
  -webkit-mask-image: none;
  mask-image: none;
}

.hb-gw__toggle:focus-visible ~ .hb-gw__more {
  outline: 1px solid currentColor;
  outline-offset: 2px;
}

.hb-gw__pin {
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Page links under the columns */
.hb-gw-nav {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
  margin: 8px 0 32px;
  font-size: 13px;
  letter-spacing: 0.05em;
}

.hb-gw-nav a {
  color: inherit;
  text-decoration: none;
  opacity: 0.7;
}

.hb-gw-nav a:hover {
  opacity: 1;
}

.hb-gw-nav span {
  opacity: 0.5;
}

/* Tablet: two columns. Phone: one. */
@media (max-width: 900px) {
  .hb-gw { column-count: 2; column-gap: 24px; }
}

@media (max-width: 560px) {
  .hb-gw { column-count: 1; }
  .hb-gw__card { margin-bottom: 40px; }
}

/* Photos inside a submission's own post: keep them tidy */
.hb-sub-gallery img {
  cursor: zoom-in;
}

/* ============================================================
   END OF GUEST WORKS
   ============================================================ */

/* ============================================================
   SUBMIT FORM  (page /be-featured/)
   Styles the intro, the steps and the Forminator form (id 3910).
   Delete this whole block to return to the plugin's default look.
   ============================================================ */
.hb-submit { max-width: 640px; margin: 0 0 3rem; }
.hb-submit__kicker { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; opacity: .55; margin: 0 0 .6rem; }
.hb-submit__title { font-size: 28px; font-weight: 400; line-height: 1.2; margin: 0 0 .8rem; }
.hb-submit__intro { font-size: 14px; line-height: 1.7; opacity: .8; margin: 0 0 1.4rem; }
.hb-submit__intro a { text-decoration: underline; text-underline-offset: 3px; }
.hb-submit ol.hb-submit__steps { list-style: none; counter-reset: hbs; margin: 0 0 2rem; padding: 0; font-size: 13px; line-height: 1.6; }
.hb-submit__steps li { counter-increment: hbs; position: relative; margin: 0; padding: .75rem 0 .75rem 2.2rem; border-top: 1px solid rgba(255,255,255,.12); opacity: .85; list-style: none; }
.hb-submit__steps li:last-child { border-bottom: 1px solid rgba(255,255,255,.12); }
.hb-submit__steps li::before { content: counter(hbs); position: absolute; left: 0; top: .8rem; width: 18px; height: 18px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; font-size: 10px; line-height: 1; display: flex; align-items: center; justify-content: center; opacity: .8; }
.hb-submit__fine { font-size: 11px; line-height: 1.6; opacity: .5; margin: 1.2rem 0 0; }

/* the form */
.hb-submit #forminator-module-3910 { margin: 0; padding: 0; }
.hb-submit #forminator-module-3910 .forminator-row { margin-bottom: 22px; }
.hb-submit #forminator-module-3910 .forminator-label { display: block; margin: 0 0 8px; font-size: 12px; font-weight: 600; letter-spacing: .04em; color: inherit; }
.hb-submit #forminator-module-3910 .forminator-description { display: block; margin: 8px 0 0; font-size: 12px; line-height: 1.5; color: inherit; opacity: .6; }
.hb-submit #forminator-module-3910 input.forminator-input,
.hb-submit #forminator-module-3910 textarea.wp-editor-area { width: 100%; box-sizing: border-box; background: transparent; color: inherit; border: 1px solid rgba(255,255,255,.22); border-radius: 2px; padding: 12px 14px; font-size: 14px; line-height: 1.6; box-shadow: none; }
.hb-submit #forminator-module-3910 textarea.wp-editor-area { height: 170px !important; min-height: 170px; resize: vertical; }
.hb-submit #forminator-module-3910 input.forminator-input:focus,
.hb-submit #forminator-module-3910 textarea.wp-editor-area:focus { border-color: rgba(255,255,255,.7); outline: none; }
.hb-submit #forminator-module-3910 ::placeholder { color: inherit; opacity: .4; }
.hb-submit #forminator-module-3910 .wp-editor-tabs,
.hb-submit #forminator-module-3910 .quicktags-toolbar { display: none; }
.hb-submit #forminator-module-3910 .wp-editor-container { border: 0; background: transparent; }
.hb-submit #forminator-module-3910 .forminator-multi-upload { border: 1px dashed rgba(255,255,255,.3); border-radius: 2px; background: transparent; padding: 28px 16px; text-align: center; cursor: pointer; }
.hb-submit #forminator-module-3910 .forminator-multi-upload:hover { border-color: rgba(255,255,255,.7); }
.hb-submit #forminator-module-3910 .forminator-multi-upload-message p { margin: 6px 0 0; font-size: 13px; color: inherit; }
.hb-submit #forminator-module-3910 .forminator-multi-upload-message span { color: inherit; opacity: .7; }
.hb-submit #forminator-module-3910 .forminator-uploaded-files { margin: 10px 0 0; padding: 0; list-style: none; font-size: 12px; }
.hb-submit #forminator-module-3910 .forminator-response-message { margin: 0 0 22px; padding: 12px 14px; border: 0; border-left: 2px solid rgba(255,255,255,.6); border-radius: 0; background: rgba(255,255,255,.06); color: inherit; font-size: 13px; line-height: 1.6; }
.hb-submit #forminator-module-3910 .forminator-response-message.forminator-error { border-left-color: #e5484d; }
.hb-submit #forminator-module-3910 .forminator-response-message:not(.forminator-show) { display: none; }

/* ============================================================
   GUEST SUBMISSION PAGE (a single reader submission)
   Markup: single-submission.php. Small, quiet, one column.
   Only used for Submissions-category posts; Himbodied's own
   posts keep their own templates and are not affected.
   To undo: delete everything from this comment to the END marker.
   ============================================================ */

.site-content .hb-sub.site-main {
  max-width: 640px !important;
  margin: 0 auto !important;
  padding: 72px 20px 80px !important;
}

.hb-sub__back {
  position: relative;
  z-index: 20;
  display: inline-block;
  margin: 0 0 24px;
  padding: 8px 0;
  color: #fff !important;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-decoration: none;
  opacity: 0.8;
  cursor: pointer;
  pointer-events: auto;
}

.hb-sub__back:hover,
.hb-sub__back:focus-visible {
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.hb-sub__title {
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 0.01em;
}

.hb-sub__date {
  margin: 0 0 26px;
  font-size: 11.5px;
  letter-spacing: 0.05em;
  opacity: 0.5;
}

.hb-sub__note {
  margin: 0 0 22px;
  padding: 8px 10px;
  border: 1px dashed currentColor;
  font-size: 11.5px;
  opacity: 0.6;
}

.hb-sub__photos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  margin: 0 0 26px;
}

.hb-sub__photo {
  margin: 0;
  overflow: hidden;
  background: #111;
  cursor: zoom-in;
}

.hb-sub__photo:first-child {
  grid-column: 1 / -1;
}

.hb-sub__photos.is-single .hb-sub__photo:first-child {
  grid-column: 1 / -1;
}

.hb-sub__photo img {
  display: block;
  width: 100%;
  height: auto;
}

.hb-sub__photo:not(:first-child) img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.hb-sub__video {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 26px;
  background: #000;
}

.hb-sub__text {
  font-size: 14px;
  line-height: 1.75;
  opacity: 0.88;
}

.hb-sub__text p {
  margin: 0 0 1em;
}

.hb-sub__credit {
  margin: 28px 0 0;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: 11.5px;
  letter-spacing: 0.05em;
  opacity: 0.6;
}

.hb-sub__credit a {
  color: inherit;
  text-decoration: none;
}

.hb-sub__credit a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (max-width: 600px) {
  .site-content .hb-sub.site-main {
    padding: 36px 16px 56px !important;
  }
}

/* ===== END GUEST SUBMISSION PAGE ===== */

/* ============================================================
   GALLERY PAGE SPACING (page /gallery/, gradient template)
   The gradient template resets all page spacing to zero, which pushed the
   grid to the screen edges. This puts the side margins back and keeps the
   grid centred on wide screens. To undo: delete from here to the END marker.
   ============================================================ */

.content-with-gradient {
  box-sizing: border-box;
  width: 100%;
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto; /* centres it even though the theme's page wrapper is a flex row */
}

.content-with-gradient .entry-content {
  box-sizing: border-box;
  padding: 24px clamp(20px, 4vw, 54px) 80px;
}

/* Desktop: the menu bar floats over the page and is 96px tall, so start the content below it */
@media (min-width: 922px) {
  .content-with-gradient .entry-content {
    padding-top: 124px;
  }
}

/* Tablet and phone: the photo grid goes almost edge to edge (4px);
   the tabs, tag cloud and page buttons keep a small side margin */
@media (max-width: 781px) {
  .content-with-gradient .entry-content {
    padding-left: 4px;
    padding-right: 4px;
  }
  .content-with-gradient .hb-grid-nav,
  .content-with-gradient .hb-grid-tags,
  .content-with-gradient .wp-block-query-pagination {
    box-sizing: border-box;
    padding-left: 14px;
    padding-right: 14px;
  }
}

/* ===== END GALLERY PAGE SPACING ===== */

/* ============================================================
   SITE FOOTER  (markup: functions.php, section 12)
   ============================================================ */
.site-footer.hb-footer {
	background: #000;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	color: #a0a0a0;
	font-size: 13px;
	line-height: 1.6;
	position: relative;
	z-index: 11;
}
.hb-footer .hb-footer__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 44px 32px 36px;
}
.hb-footer p { margin: 0; color: inherit; }
.hb-footer a { color: var(--hb-body); text-decoration: none; transition: color .15s; }
.hb-footer a:hover { color: #fff; }
.hb-footer strong { color: var(--hb-body); font-weight: 600; }

.hb-footer .hb-footer__top {
	display: flex; align-items: center; justify-content: space-between; gap: 20px;
	padding-bottom: 24px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.hb-footer .hb-footer__brand { display: flex; flex-direction: column; gap: 2px; }
.hb-footer .hb-footer__logo { display: inline-block; line-height: 0; }
.hb-footer .hb-footer__logo img { width: 105px; height: auto; display: block; }
.hb-footer .hb-footer__tag { color: #a0a0a0; font-size: 12px; letter-spacing: .04em; }
.hb-footer .hb-footer__social { display: flex; gap: 18px; align-items: center; }
.hb-footer .hb-footer__social a { display: inline-flex; padding: 6px; opacity: .8; }
.hb-footer .hb-footer__social a:hover { opacity: 1; }
.hb-footer .hb-footer__social img { width: 20px; height: 20px; display: block; }

.hb-footer .hb-footer__mid {
	display: flex; align-items: baseline; justify-content: space-between; gap: 24px;
	padding: 22px 0 6px;
}
.hb-footer .hb-footer__notice { color: #bdbdbd; font-size: 13px; max-width: 640px; }
.hb-footer .hb-footer__legal { display: flex; gap: 22px; flex-shrink: 0; font-size: 13px; }
.hb-footer .hb-footer__remove { padding: 0 0 22px; font-size: 13px; }

.hb-footer .hb-footer__small {
	column-count: 2; column-gap: 40px;
	padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, 0.08);
	font-size: 11.5px; line-height: 1.7; color: #7a7a7a;
}
.hb-footer .hb-footer__small p { break-inside: avoid; margin: 0 0 14px; }
.hb-footer .hb-footer__small strong { color: #9a9a9a; }
.hb-footer .hb-footer__small a { color: #9a9a9a; text-decoration: underline; text-underline-offset: 2px; }
.hb-footer .hb-footer__copy { margin-top: 28px; font-size: 12px; color: #6f6f6f; }

@media (max-width: 768px) {
	.hb-footer .hb-footer__inner { padding: 36px 20px 30px; text-align: center; }
	.hb-footer .hb-footer__top { flex-direction: column; gap: 14px; }
	.hb-footer .hb-footer__brand { align-items: center; }
	.hb-footer .hb-footer__mid { flex-direction: column; align-items: center; gap: 14px; }
	.hb-footer .hb-footer__legal { justify-content: center; }
	.hb-footer .hb-footer__small { column-count: 1; }
}
/* ============ END SITE FOOTER ============ */

/* ============================================================
   COOKIE BANNER  (markup + logic: functions.php, section 13)
   ============================================================ */
.hb-consent[hidden] { display: none !important; }
.hb-consent {
	position: fixed; left: 20px; bottom: 20px; z-index: 99990;
	max-width: 440px; box-sizing: border-box;
	padding: 16px 18px; background: #0b0b0b; color: #bdbdbd;
	border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 6px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.55);
	font-size: 13px; line-height: 1.55;
}
.hb-consent p { margin: 0 0 12px; color: inherit; }
.hb-consent a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.hb-consent__btns { display: flex; gap: 10px; }
.hb-consent .hb-consent__btn {
	flex: 1; padding: 9px 14px; cursor: pointer; border-radius: 3px;
	background: transparent; color: #f5f5f5; font-family: Lato, sans-serif; font-size: 13px; font-weight: 500; line-height: 1.2;
	border: 1px solid #f5f5f5; transition: all .2s linear;
}
.hb-consent .hb-consent__btn:hover { background: transparent; border-color: #d4af37; color: #d4af37; }
.hb-consent .hb-consent__btn--primary { background: #000; color: #d4af37; border-color: #d4af37; }
.hb-consent .hb-consent__btn--primary:hover { background: #d4af37; color: #fff; border-color: #d4af37; }
.hb-footer .hb-consent-open {
	background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
	font: inherit; color: var(--hb-body); text-decoration: none;
}
.hb-footer .hb-consent-open:hover { color: #fff; }
@media (max-width: 600px) {
	.hb-consent { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}
/* ============ END COOKIE BANNER ============ */

/* ===== CHECKOUT TICK BOX (functions.php, section 14) ===== */
.hb-pmpro-consent { margin: 18px 0 16px; font-size: 14px; line-height: 1.55; }
.hb-pmpro-consent label { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.hb-pmpro-consent input[type="checkbox"] { margin-top: 4px; flex-shrink: 0; width: 16px; height: 16px; }
/* ===== END CHECKOUT TICK BOX ===== */

/* ============================================================
   LEGAL PAGES (Terms of Use = page 2194, Privacy Policy = page 3)
   ============================================================ */
body.page-id-2194 .entry-title,
body.page-id-3 .entry-title { font-family: "Freight-big-pro", Helvetica, Arial, sans-serif; font-size: 28px; font-weight: 400; line-height: 1.2; margin: 0 0 6px; }
body.page-id-2194 .entry-content > p:first-child em,
body.page-id-3 .entry-content > p:first-child em { font-style: normal; color: #a0a0a0; font-size: 12px; }
body.page-id-2194 .entry-content h2,
body.page-id-3 .entry-content h2 { font-family: Lato, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.4; margin: 28px 0 6px; color: #f5f5f5; }
body.page-id-2194 .entry-content p,
body.page-id-2194 .entry-content li,
body.page-id-3 .entry-content p,
body.page-id-3 .entry-content li { font-size: 14px; line-height: 1.6; color: var(--hb-body); }
body.page-id-2194 .entry-content ul,
body.page-id-3 .entry-content ul { margin: 0 0 16px 1.2em; }
body.page-id-2194 .entry-content li,
body.page-id-3 .entry-content li { margin-bottom: 4px; }
body.page-id-2194 .entry-content a,
body.page-id-3 .entry-content a { text-decoration: underline; text-underline-offset: 2px; }
/* ===== END LEGAL PAGES ===== */

/* ===== HB ADVISORY (Membership Levels notice; remove with the .hb-advisory block on the page) ===== */
.hb-advisory { border-left: 2px solid #c8372d; padding: 4px 0 4px 16px; margin: 0 0 28px; }
.hb-advisory p { margin: 0; font-size: 14px; line-height: 1.7; color: var(--hb-body); }
/* ===== END HB ADVISORY ===== */

/* ===== MEMBERSHIP PAGES (Paid Memberships Pro) =====
   Login, levels, account, profile, orders, billing, cancel, confirmation, checkout.
   Flat and minimal to match the Be Featured form: no boxes, hairline dividers, small labels.
   All rules are scoped to .pmpro so they never touch other pages. */
body .pmpro { --hb-line: rgba(255,255,255,.14); --hb-field: rgba(255,255,255,.22); --hb-muted: #a0a0a0; --hb-gold: #bf9b30; font-size: 14px; line-height: 1.6; color: var(--hb-body); }
body:not(.pmpro-levels) .pmpro { max-width: 680px; margin-left: auto; margin-right: auto; }
body.pmpro-login .pmpro { max-width: 460px; }
body .pmpro, body .pmpro .pmpro_section { text-align: left; }

/* Headings: the serif at its normal weight (the old bold made it look smeared) */
/* Headings inside PMPro pages (type system: no serif under 28px)
   section titles = grey caps eyebrow; card and form titles = bold Lato */
body .pmpro .pmpro_section_title {
	font-family: Lato, sans-serif; font-size: 12px !important; font-weight: 700 !important; line-height: 1.4; letter-spacing: .14em; text-transform: uppercase; color: #bdbdbd;
	margin: 0 0 12px; padding: 0;
}
body .pmpro .pmpro_card_title,
body .pmpro .pmpro_form_heading,
body .pmpro .pmpro_form_legend {
	font-family: Lato, sans-serif; font-size: 15px !important; font-weight: 700 !important; line-height: 1.4; letter-spacing: 0; text-transform: none; color: #f5f5f5;
	margin: 0 0 10px; padding: 0;
}
body .pmpro .pmpro_heading-with-avatar { padding-left: 0; }
body .pmpro .pmpro_heading-with-avatar::before { display: none; }
body .pmpro .pmpro_section { margin: 0 0 8px; }

/* Cards and fieldsets: no box, just a hairline above each block */
body .pmpro .pmpro_card,
body .pmpro .pmpro_form_fieldset {
	background: transparent; border: 0; border-top: 1px solid var(--hb-line); border-radius: 0;
	box-shadow: none; padding: 22px 0 0; margin: 0 0 34px;
}
body .pmpro .pmpro_card_content { padding: 0; }
body .pmpro .pmpro_form_fieldset .pmpro_card,
body .pmpro .pmpro_card .pmpro_card { border: 0; padding: 0; margin: 0; }
body .pmpro .pmpro_form_legend { display: block; float: none; width: 100%; }
body .pmpro #pmpro_tos_fields { border-top: 0; padding-top: 0; margin: 0 0 14px; }
body .pmpro .pmpro_list { list-style: none; margin: 0; padding: 0; }
body .pmpro .pmpro_list_item { margin: 0 0 6px; }
body .pmpro .pmpro_card_actions { margin-top: 16px; font-size: 14px; color: var(--hb-muted); }
body .pmpro .pmpro_card_action_separator { margin: 0 6px; color: var(--hb-muted); }
body .pmpro a { text-decoration: underline; text-underline-offset: 2px; }

/* Labels, fields, hints */
body .pmpro .pmpro_form_field,
body .pmpro #loginform p { margin: 0 0 18px; }
body .pmpro .pmpro_form_label,
body .pmpro #loginform label { display: block; margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: .04em; color: #e0e0e0; }
body .pmpro input[type="text"], body .pmpro input[type="email"], body .pmpro input[type="password"],
body .pmpro input[type="tel"], body .pmpro input[type="url"], body .pmpro input[type="number"],
body .pmpro select, body .pmpro textarea, body .pmpro .pmpro_form_input:not([type="checkbox"]):not([type="radio"]) {
	display: block; width: 100%; box-sizing: border-box; height: auto;
	background: transparent; border: 1px solid var(--hb-field); border-radius: 2px;
	padding: 12px 14px; font: inherit; font-size: 16px; line-height: 1.4; color: #e0e0e0; box-shadow: none;
}
body .pmpro select option { background: #000; color: #e0e0e0; }
body .pmpro input:focus, body .pmpro select:focus, body .pmpro textarea:focus { border-color: rgba(255,255,255,.7); outline: none; box-shadow: none; }
body .pmpro .pmpro_form_hint, body .pmpro .description { margin: 6px 0 0; font-size: 13px; line-height: 1.5; color: var(--hb-muted); }
body .pmpro input[type="checkbox"], body .pmpro input[type="radio"] { width: 16px; height: 16px; min-width: 0; margin: 0 10px 0 0; vertical-align: middle; accent-color: #fff; }

/* The two tick boxes at checkout: same look, plain text, no box */
body .pmpro #pmpro_tos_fields .pmpro_form_label,
body .pmpro .hb-pmpro-consent label { display: block; margin: 0; font-size: 14px; font-weight: 400; letter-spacing: 0; line-height: 1.6; color: var(--hb-body); cursor: pointer; }
body .pmpro .hb-pmpro-consent { margin: 0 0 22px; }
body .pmpro .hb-pmpro-consent label { display: flex; gap: 0; align-items: flex-start; }
body .pmpro .hb-pmpro-consent input[type="checkbox"] { margin-top: 5px; flex-shrink: 0; }

/* Buttons. Two styles:
   Default (minimal): transparent, white outline, white text. Hover turns outline and text gold. No fill.
   Primary (the main action): black fill, gold outline, gold text. Hover fills gold with white text. */
body .pmpro .pmpro_btn:not(.pmpro_btn-submit-checkout-paypal),
body .pmpro input[type="submit"], body .pmpro button[type="submit"]:not(.pmpro_btn-submit-checkout-paypal),
body #basic-user-avatar-form input[type="submit"],
body.login #loginform input[type="submit"] {
	display: inline-block; width: auto; box-sizing: border-box; background: transparent; color: #f5f5f5; border: 1px solid #f5f5f5; border-radius: 3px;
	padding: 10px 20px; font-family: Lato, sans-serif; font-size: 15px; font-weight: 500; letter-spacing: normal; text-transform: capitalize; line-height: 1.4;
	text-decoration: none; cursor: pointer; box-shadow: none; transition: all .2s linear;
}
body .pmpro .pmpro_btn:not(.pmpro_btn-submit-checkout-paypal):hover, body .pmpro .pmpro_btn:not(.pmpro_btn-submit-checkout-paypal):focus,
body .pmpro input[type="submit"]:hover, body .pmpro button[type="submit"]:not(.pmpro_btn-submit-checkout-paypal):hover,
body #basic-user-avatar-form input[type="submit"]:hover { background: transparent !important; border-color: #d4af37 !important; color: #d4af37 !important; }
body .pmpro .pmpro_btn-submit:not(.pmpro_btn-submit-checkout-paypal), body .pmpro .pmpro_btn-submit-checkout:not(.pmpro_btn-submit-checkout-paypal),
body .pmpro input[type="submit"], body .pmpro button[type="submit"]:not(.pmpro_btn-submit-checkout-paypal),
body #basic-user-avatar-form input[type="submit"] { background: #000; border-color: #d4af37; color: #d4af37; }
body .pmpro .pmpro_btn-submit:not(.pmpro_btn-submit-checkout-paypal):hover, body .pmpro .pmpro_btn-submit-checkout:not(.pmpro_btn-submit-checkout-paypal):hover,
body .pmpro input[type="submit"]:hover, body .pmpro button[type="submit"]:not(.pmpro_btn-submit-checkout-paypal):hover,
body #basic-user-avatar-form input[type="submit"]:hover { background: #d4af37 !important; border-color: #d4af37 !important; color: #fff !important; }
body .pmpro .pmpro_form_submit, body .pmpro .pmpro_submit { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 8px; }
body .pmpro #pmpro_btn-submit-paypalexpress { background-color: #fff; color: #000; border: 1px solid #fff; border-radius: 3px; transition: border-color .2s linear; }
body .pmpro #pmpro_btn-submit-paypalexpress:hover { border-color: #d4af37; }

/* Messages */
body .pmpro .pmpro_message { background: transparent; border: 0; border-left: 2px solid var(--hb-gold); border-radius: 0; padding: 4px 0 4px 14px; margin: 0 0 22px; font-size: 14px; color: var(--hb-body); }
body .pmpro .pmpro_message.pmpro_error, body .pmpro .pmpro_error { border-left-color: #c8372d; }
body .pmpro .pmpro_message.pmpro_alert { border-left-color: var(--hb-gold); }
body .pmpro .pmpro_message.pmpro_success { border-left-color: #5a9a5a; }
body .pmpro .pmpro_message:empty { display: none; }

/* Tables (levels, orders, invoices): hairlines only, small grey headers */
body .pmpro table { width: 100%; border: 0; border-collapse: collapse; background: transparent; }
body .pmpro th, body .pmpro td { border: 0; border-bottom: 1px solid var(--hb-line); padding: 16px 12px 16px 0; text-align: left; vertical-align: middle; background: transparent; color: var(--hb-body); }
body .pmpro thead th { padding-top: 0; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #bdbdbd; }
body .pmpro tbody th { font-family: Lato, sans-serif; font-size: 16px; font-weight: 700; color: #f5f5f5; }
body .pmpro td p { margin: 0; }
body .pmpro td:last-child, body .pmpro thead th:last-child { text-align: right; padding-right: 0; }
body.pmpro-levels .pmpro .pmpro_card { border-top: 0; padding-top: 0; }
body .pmpro .pmpro_actions_nav { margin-top: 20px; font-size: 14px; color: var(--hb-muted); }

/* Login page */
body .pmpro #loginform .login-remember label { display: flex; align-items: center; margin: 0; font-weight: 400; font-size: 14px; letter-spacing: 0; }
body .pmpro #loginform #wp-submit { margin-top: 4px; }

/* Avatar upload under "Your Profile" (separate plugin, sits outside .pmpro) */
body #basic-user-avatar-form { max-width: 680px; margin-left: auto; margin-right: auto; margin-top: 36px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.14); font-size: 14px; color: var(--hb-body); }
body #basic-user-avatar-form p { margin: 0 0 14px; }
body #basic-user-avatar-form .description { font-size: 13px; color: #a0a0a0; }
body #basic-local-avatar { color: #a0a0a0; font-size: 14px; }
body #basic-local-avatar::file-selector-button { background: transparent; color: #f5f5f5; border: 1px solid #f5f5f5; border-radius: 3px; padding: 8px 16px; margin-right: 12px; font-family: Lato, sans-serif; font-size: 14px; font-weight: 500; cursor: pointer; transition: all .2s linear; }
body #basic-local-avatar::file-selector-button:hover { color: #d4af37; border-color: #d4af37; }

@media (max-width: 600px) {
	body .pmpro td:last-child, body .pmpro thead th:last-child { text-align: left; }
}
/* Levels page: the info columns under the table (billing, cancellation, refunds) */
body.pmpro-levels .entry-content .wp-block-columns { margin-top: 44px; gap: 56px; font-size: 14px; line-height: 1.6; color: var(--hb-body); }
body.pmpro-levels .entry-content .wp-block-columns h3 { margin: 0 0 14px; font-family: Lato, sans-serif; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em; text-transform: uppercase; color: #bdbdbd; }
body.pmpro-levels .entry-content .wp-block-columns h4 { margin: 0 0 6px; font-family: Lato, sans-serif; font-size: 15px !important; font-weight: 700 !important; line-height: 1.4; color: #f5f5f5; }
body.pmpro-levels .entry-content .wp-block-columns h4 strong { font-weight: 700; }
body.pmpro-levels .entry-content .wp-block-columns hr.wp-block-separator { width: 100%; max-width: none; height: 0; margin: 26px 0; border: 0; border-top: 1px solid rgba(255,255,255,.14); background: none; opacity: 1; }
body.pmpro-levels .entry-content .wp-block-columns ul { margin: 0 0 18px 1.1em; padding: 0; }
body.pmpro-levels .entry-content .wp-block-columns li { margin: 0 0 4px; }
body.pmpro-levels .entry-content .wp-block-columns li ul { margin: 4px 0 6px 1.1em; }
@media (max-width: 781px) { body.pmpro-levels .entry-content .wp-block-columns { gap: 0; } }
/* Login page: title in the same serif as the other pages, and "Show password" as a quiet text link */
body.pmpro-login .uagb-ifb-title-prefix { font-family: "Freight-big-pro", Helvetica, Arial, sans-serif; font-size: 28px; font-weight: 400; line-height: 1.2; text-transform: none; color: #f5f5f5; }
body .pmpro .pmpro_btn.pmpro_btn-plain, body .pmpro .pmpro_btn.pmpro_btn-plain:focus { display: inline-flex; align-items: center; gap: 6px; background: transparent !important; border: 0 !important; padding: 8px 0 0 !important; margin: 0; box-shadow: none; font-family: Lato, sans-serif; font-size: 13px; font-weight: 400; text-transform: none; letter-spacing: 0; color: #a0a0a0 !important; cursor: pointer; }
body .pmpro .pmpro_btn.pmpro_btn-plain:hover { color: #d4af37 !important; background: transparent !important; border: 0 !important; }
body .pmpro .pmpro_btn-plain svg { width: 16px; height: 16px; stroke: currentColor !important; }
body .pmpro .wp-pwd { margin-bottom: 6px; }
/* ===== END MEMBERSHIP PAGES ===== */

/* ===== SITE BUTTONS: Forminator submit (Be Featured, Contact) uses the primary (gold outline) style ===== */
body .forminator-ui .forminator-button.forminator-button-submit {
	background: #000 !important; color: #d4af37 !important; border: 1px solid #d4af37 !important; border-radius: 3px !important;
	padding: 10px 20px !important; font-family: Lato, sans-serif !important; font-size: 15px !important; font-weight: 500 !important;
	letter-spacing: normal !important; text-transform: capitalize !important; box-shadow: none !important; cursor: pointer; transition: all .2s linear;
}
body .forminator-ui .forminator-button.forminator-button-submit:hover { background: #d4af37 !important; color: #fff !important; border-color: #d4af37 !important; }
/* ===== END SITE BUTTONS ===== */

/* ===== TYPE SYSTEM =====
   Two fonts: the serif (Freight) for titles only, never below 28px; Lato for everything else.
   Roles: poster (post titles, own line height) / statement / section title 28px / eyebrow / body 16px or 14px compact / note 13px / fine print 12px.
   Eyebrows and small caps labels are Lato bold 12px, wide spacing, soft grey. Notes and fine print are light grey, 12px minimum.
   The tight 0.61 line height belongs to .post-title-block only. */
:root { --hb-eyebrow: #bdbdbd; --hb-note: #a0a0a0; --hb-body: #c4c4c4; }

/* Eyebrows: small caps labels that sit above titles (Spectra h6 headings and info-box titles) */
body h6.uagb-heading-text, body h6.uagb-ifb-title, body .hb-submit__kicker {
	font-family: Lato, sans-serif !important; font-size: 12px !important; font-weight: 700 !important; line-height: 1.4 !important;
	letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--hb-eyebrow) !important; opacity: 1 !important;
}

/* Post pages: small labels (the post title and its line height are not touched) */
body .post-navigation .nav-label { font-size: 12px; font-weight: 700; letter-spacing: .14em; color: var(--hb-eyebrow); }
body .related-posts-section h3, body.single h3.comment-reply-title {
	font-family: Lato, sans-serif; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--hb-eyebrow) !important;
}
body.single .required-field-message, body.single .comment-notes { color: var(--hb-note) !important; }
body.single .expandable-text .text-content > p { max-width: 680px; }

/* Be Featured form: fine print */
body .hb-submit__fine { font-size: 12px; color: var(--hb-note); opacity: 1; }

/* Submissions and gallery card meta lines */
body .hb-gw__pin { font-size: 12px; color: var(--hb-note); }
body .hb-gw__meta span, body .hb-gw__meta a { font-size: 12px; color: var(--hb-note); }

/* Footer small print: 12px minimum, light grey */
body .hb-footer .hb-footer__small, body .hb-footer .hb-footer__small p { font-size: 12px; line-height: 1.6; color: var(--hb-note); }
body .hb-footer .hb-footer__small strong { color: var(--hb-eyebrow); }
body .hb-footer .hb-footer__small a { color: var(--hb-eyebrow); }
body .hb-footer .hb-footer__remove { color: var(--hb-note); }
body .hb-footer .hb-footer__copy { font-size: 12px; color: var(--hb-note); }
/* ===== END TYPE SYSTEM ===== */


/* ==========================================================================
   BODY TEXT COLOUR  (change --hb-body in the :root line above to retune)
   Soft grey #c4c4c4 on black (about 12:1 contrast). Headings, titles, item
   titles and form labels stay brighter; notes and fine print stay darker.
   ========================================================================== */
html body { color: var(--hb-body); }
html body.single .text-content, html body.single .text-content p, html body.single .entry-content p,
html body.single .logged-in-as, html body.single .comment-content p { color: var(--hb-body); }


/* ==========================================================================
   FOOTER LAYOUT  (markup in functions.php section 12)
   Centred stack: logo, small social icons, legal links, then ONE full-width
   paragraph of notices separated by bullets, then the copyright line.
   No inner lines; only the footer's top border remains. Side padding is the
   same at both ends.
   ========================================================================== */
html body .hb-footer .hb-footer__inner { display: block; max-width: none; margin: 0; padding: 32px 32px 22px; text-align: center; }
html body .hb-footer .hb-footer__top { flex-direction: column; justify-content: center; align-items: center; gap: 16px; padding-bottom: 0; border-bottom: 0; }
html body .hb-footer .hb-footer__brand { align-items: center; }
html body .hb-footer .hb-footer__social { justify-content: center; gap: 6px; }
html body .hb-footer .hb-footer__social a { padding: 4px; }
html body .hb-footer .hb-footer__social img { width: 16px; height: 16px; }
html body .hb-footer .hb-footer__legal { display: flex; justify-content: center; flex-wrap: wrap; gap: 4px 24px; font-size: 13px; line-height: 1.4; padding: 4px 0 12px; }
html body .hb-footer .hb-footer__fine { margin: 0; padding: 0; font-size: 12px; line-height: 1.5; color: var(--hb-note); text-align: center; }
html body .hb-footer .hb-footer__fine span + span::before { content: "\2022"; margin: 0 .75em; color: #6f6f6f; }
html body .hb-footer .hb-footer__fine strong { color: var(--hb-eyebrow); }
html body .hb-footer .hb-footer__fine a { color: var(--hb-eyebrow); text-decoration: underline; text-underline-offset: 2px; }
html body .hb-footer .hb-footer__copy { margin: 10px 0 0; padding: 0; border: 0; text-align: center; font-size: 12px; line-height: 1.4; color: var(--hb-note); }
@media (max-width: 760px) {
	html body .hb-footer .hb-footer__inner { padding: 32px 24px 22px; }
}

/* ==========================================================================
   HOME GALLERY STRIP  (markup: functions.php section 15, shortcode [hb_gallery_strip])
   Full-bleed, drag/swipe strip. Left padding matches the section heading at each breakpoint (24 / 74 / 49px).
   ========================================================================== */
.hb-strip { --hb-strip-pad: 24px; display: flex; gap: 18px; width: 100%; max-width: 100%; margin-left: 0; box-sizing: border-box; padding: 0 var(--hb-strip-pad) 70px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-left: var(--hb-strip-pad); scrollbar-width: none; cursor: grab; -webkit-overflow-scrolling: touch; }
.hb-strip::-webkit-scrollbar { display: none; }
body.page-id-1008 { overflow-x: clip; }
.hb-strip.is-drag { cursor: grabbing; scroll-snap-type: none; }
.hb-strip__card { flex: 0 0 auto; width: clamp(210px, 23vw, 300px); display: block; scroll-snap-align: start; text-decoration: none; }
.hb-strip__card.is-low { margin-top: 44px; }
.hb-strip__img { display: block; aspect-ratio: 2 / 3; overflow: hidden; background: #111; }
.hb-strip__img img { display: block; width: 100%; height: 100%; object-fit: cover; filter: brightness(.92); transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .5s; }
.hb-strip__card:hover .hb-strip__img img { transform: scale(1.04); filter: brightness(1); }
.hb-strip__cap { display: block; padding-top: 12px; }
.hb-strip__title { display: block; font: 700 15px/1.35 Lato, sans-serif; color: #f5f5f5; }
.hb-strip__meta { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: 12px; line-height: 1.4; color: var(--hb-note); }
.hb-strip__lock { color: #bf9b30; flex: none; }
@media (max-width: 976px) { .hb-strip { --hb-strip-pad: 74px; flex: 0 0 auto !important; width: 100vw !important; max-width: 100vw !important; margin-left: calc(50% - 50vw) !important; } }
@media (max-width: 767px) { .hb-strip { --hb-strip-pad: 49px; } }
@media (max-width: 781px) { .hb-strip { gap: 14px; padding-bottom: 56px; } .hb-strip__card { width: 62vw; } }
@media (prefers-reduced-motion: reduce) { .hb-strip__img img { transition: none; } }

/* ==========================================================================
   HOMEPAGE SECTIONS  (page-id-1008)
   Numbered grey eyebrows (01, 02, 03), larger serif section titles for
   "Body of Work" and "him, embodied.", and the eyebrow style for .hb-eyebrow.
   ========================================================================== */
body .hb-eyebrow { font-family: Lato, sans-serif; font-size: 12px; font-weight: 700; line-height: 1.4; letter-spacing: .14em; text-transform: uppercase; color: var(--hb-eyebrow); margin: 0 0 14px; }
body.page-id-1008 .entry-content { counter-reset: hb-sec; }
body.page-id-1008 .entry-content h6.uagb-heading-text,
body.page-id-1008 .entry-content .hb-eyebrow { counter-increment: hb-sec; }
body.page-id-1008 .entry-content h6.uagb-heading-text::before,
body.page-id-1008 .entry-content .hb-eyebrow::before { content: counter(hb-sec, decimal-leading-zero); color: #bf9b30; margin-right: .9em; }
body.page-id-1008 .uagb-block-d6a5ce2c h2.uagb-heading-text,
body.page-id-1008 .uagb-block-ad98053f h2.uagb-heading-text { font-size: clamp(34px, 4vw, 52px) !important; line-height: 1.1 !important; }


/* ==========================================================================
   MOBILE + TABLET HEADER AND MENU DRAWER  (Astra break point, up to 921px)
   Header: logo left, account + menu icons right, on every page.
   Drawer: full-screen black. The logo/close row repeats at the top so the
   close icon sits exactly where the menu icon was. Left-aligned Lato links,
   gold for the current page and on hover (same as the desktop menu).
   ========================================================================== */
@media (max-width: 921px) {
	body.ast-header-break-point #masthead #ast-mobile-header .ast-primary-header-bar.main-header-bar { min-height: 64px; padding: 0 20px; background: transparent; }
	body #ast-mobile-header .ast-builder-grid-row { align-items: center; }
	body #ast-mobile-header .site-header-primary-section-right { display: flex; align-items: center; gap: 4px; }
	body.ast-header-break-point #masthead #ast-mobile-header .site-logo-img .custom-logo-link img { width: 100px; max-width: 100px; height: auto; margin-left: -41px; }
	body.ast-header-break-point #masthead #ast-mobile-header .site-logo-img .transparent-custom-logo { display: block; width: 27px; height: 16px; box-sizing: content-box; padding: 8px 18px 8px 0; overflow: hidden; line-height: 0; }
	body.ast-header-break-point #masthead #ast-mobile-header .site-logo-img { display: block; line-height: 0; }
	body #ast-mobile-header .ast-header-account-link { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: #f5f5f5; }
	body #ast-mobile-header .menu-toggle { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-right: -13px; padding: 0; color: #f5f5f5; background: transparent; border: 0; }

	body #ast-mobile-popup .ast-mobile-popup-overlay { display: none; }
	body #ast-mobile-popup .ast-mobile-popup-inner { background-color: #000; color: #f5f5f5; box-shadow: none; transform: none; }
	body #ast-mobile-popup .ast-mobile-popup-header { position: relative; height: 64px; min-height: 64px; padding: 0 20px; align-items: center; justify-content: flex-end; }
	body #ast-mobile-popup .ast-mobile-popup-header::before { content: ""; position: absolute; left: 20px; top: 50%; width: 27px; height: 16px; margin-top: -8px; background: url("https://himbodied.com/wp-content/uploads/2025/02/Small_Logo_Site-removebg-preview-300x48.png") -41px 0 / 100px 16px no-repeat; }
	body #ast-mobile-popup .menu-toggle-close { position: static !important; transform: none !important; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin: 0 -13px 0 0 !important; padding: 0; font-size: 20px; color: #f5f5f5 !important; }
	body #ast-mobile-popup .ast-mobile-popup-content { padding: 28px 20px 40px; }
	body #ast-mobile-popup .ast-main-header-bar-alignment { display: block; }
	body #ast-hf-mobile-menu { margin: 0; padding: 0; align-items: flex-start; background: transparent; }
	body #ast-hf-mobile-menu .menu-item { width: 100%; }
	body #ast-hf-mobile-menu .menu-link { position: relative; display: inline-block; width: auto; padding: 12px 0; font: 500 16px/1.2 Lato, sans-serif; letter-spacing: normal; text-transform: none; text-align: left; color: #f5f5f5; background: transparent; }
	body #ast-hf-mobile-menu .menu-link::after { content: ""; position: absolute; left: 0; bottom: 8px; width: 100%; height: 1px; background: #fff; transform: scaleX(0); transform-origin: bottom right; transition: transform .4s cubic-bezier(.65, 0, .35, 1); }
	body #ast-hf-mobile-menu .menu-link:hover::after,
	body #ast-hf-mobile-menu .menu-link:focus-visible::after { transform: scaleX(1); transform-origin: bottom left; }
	body #ast-hf-mobile-menu .current-menu-item > .menu-link { color: #bf9b30; }
	body #ast-hf-mobile-menu .menu-link:hover,
	body #ast-hf-mobile-menu .menu-link:focus-visible { color: #fff !important; background: transparent; }
}
@media (min-width: 768px) and (max-width: 921px) {
	body.ast-header-break-point #masthead #ast-mobile-header .ast-primary-header-bar.main-header-bar { padding: 0 32px; }
	body #ast-mobile-popup .ast-mobile-popup-header { padding: 0 32px; }
	body #ast-mobile-popup .ast-mobile-popup-header::before { left: 32px; }
	body #ast-mobile-popup .ast-mobile-popup-content { padding: 36px 32px 48px; }
}


/* ==========================================================================
   GALLERY GRID CAPTIONS: Lato, not serif (the serif is for large titles only)
   ========================================================================== */
ul.instagram-grid > li.type-post .wp-block-post-title { font-family: Lato, sans-serif; font-weight: 700; letter-spacing: 0; }
@media (max-width: 480px) { ul.instagram-grid > li.type-post .wp-block-post-title { font-size: 12px; } }

/* ==========================================================================
   HOME HERO POLISH  (page-id-1008)
   The "SAFE SPACE" line is white like the rest of the hero text: the one exception to the grey
   eyebrow style, because it sits on the colourful video.
   Layout and type only. The fade-in, word swap and parallax scripts are untouched.
   ========================================================================== */
body.page-id-1008 .uagb-block-250ead4a .uagb-desc-text { font: 700 12px/1.4 Lato, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #f5f5f5; margin-bottom: 14px; }
body.page-id-1008 .wp-block-uagb-container.uagb-block-b25b48c3 { padding: 20px clamp(20px, 4vw, 35px) 0; }
body.page-id-1008 .uagb-block-b25b48c3 > p { max-width: 920px; margin: 0 auto !important; padding: 0 0 22px !important; font-size: 10px; line-height: 1.55 !important; text-align: center; color: rgba(245, 245, 245, .72); }
@media (max-width: 767px) {
	body.page-id-1008 .wp-block-uagb-container.uagb-block-0853bbbc { padding-top: 72px; }
	body.page-id-1008 .wp-block-uagb-container.uagb-block-d03eff25 { flex: 1 1 auto !important; min-height: 120px !important; }
}

/* ==========================================================================
   HOME LAST SECTION ("Be the next muse")  (page-id-1008)
   Numbered like the other sections (04, via .hb-eyebrow). Text and photo both
   start at the same top edge; the form opens downward. Dark grey eyebrow because
   this section has a light background. Title size matches the other section titles.
   ========================================================================== */
body.page-id-1008 .uagb-block-4dc2e305 .wp-block-columns { align-items: flex-start; }
body.page-id-1008 .uagb-block-4dc2e305 .wp-block-column { align-self: flex-start; }
body.page-id-1008 .uagb-block-4dc2e305 .hb-eyebrow { color: #666; }
body.page-id-1008 .uagb-block-c8564e6d h2.uagb-heading-text { font-size: clamp(34px, 4vw, 52px) !important; line-height: 1.1 !important; }
@media (max-width: 781px) { body.page-id-1008 .uagb-block-4dc2e305 .wp-block-column { padding-left: 0 !important; padding-right: 0 !important; } }

/* ==========================================================================
   HOME GALLERY SECTION SPACING  (page-id-1008)
   Moves the "Body of Work" block down away from the hero and closer to the quote:
   more space above it, less below the strip. Phones are left as they were.
   ========================================================================== */
@media (min-width: 1025px) {
	body.page-id-1008 .wp-block-uagb-container.uagb-block-d6a5ce2c { padding-top: 56px; }
	body.page-id-1008 .hb-strip { padding-bottom: 14px; }
}
@media (min-width: 782px) and (max-width: 1024px) {
	body.page-id-1008 .wp-block-uagb-container.uagb-block-d6a5ce2c { padding-top: 78px; }
	body.page-id-1008 .hb-strip { padding-bottom: 42px; }
}

/* ==========================================================================
   GALLERY GRID ON TOUCH SCREENS (phones, tablets)
   Captions are always shown there, so keep them faint, lighter in weight and
   with a softer shade, and take some of the empty black space off the top.
   ========================================================================== */
@media (hover: none) {
	ul.instagram-grid > li.type-post .wp-block-post-title { opacity: .5; font-weight: 400; background: linear-gradient(to top, rgba(0, 0, 0, .4), rgba(0, 0, 0, 0) 55%); }
}
@media (max-width: 1024px) {
	body.page-id-2270 .entry-content { padding-top: 10px; }
}

/* ==========================================================================
   ABOUT PAGE  (class hb-about, built from normal blocks)
   Full width with the same 35px side gutters as the header logo. Two columns: numbered eyebrow + serif title on the left (sticky), body text on
   the right in compact 16px blocks. Stacks to one column on phones and small tablets.
   ========================================================================== */
.hb-about { counter-reset: hb-sec; }
.entry-content .hb-about.wp-block-group { max-width: none; margin: 0; padding: 0 max(35px, calc((100% - 1200px) / 2)) 0; }
.hb-about__row { display: grid; grid-template-columns: minmax(0, 55fr) minmax(0, 45fr); column-gap: clamp(32px, 6vw, 96px); padding-bottom: clamp(64px, 9vw, 120px); }
.hb-about__row:last-child { padding-bottom: 0; }
.hb-about__title { position: sticky; top: 110px; align-self: start; }
.hb-about .hb-eyebrow { counter-increment: hb-sec; }
.hb-about .hb-eyebrow::before { content: counter(hb-sec, decimal-leading-zero); color: #bf9b30; margin-right: .9em; }
.hb-about .hb-eyebrow.hb-eyebrow--plain { counter-increment: none; }
.hb-about .hb-eyebrow.hb-eyebrow--plain::before { content: none; }
.hb-about h1, .hb-about h2 { font-family: Freight-big-pro, Helvetica, Arial, sans-serif; font-weight: 400; color: #f5f5f5; margin: 0; }
.hb-about h1 { font-size: clamp(36px, 4.2vw, 56px); line-height: 1.08; }
.hb-about h2 { font-size: clamp(30px, 3.2vw, 44px); line-height: 1.15; }
.hb-about__body p { max-width: none; margin: 0 0 1.1em; font-size: 16px; line-height: 1.6; color: var(--hb-body); }
.hb-about__body p:last-child { margin-bottom: 0; }
@media (max-width: 921px) {
	.entry-content .hb-about.wp-block-group { padding: 0 24px 0; }
	.hb-about__row { display: block; }
	.hb-about__title { position: static; margin-bottom: 28px; }
}
@media (min-width: 768px) and (max-width: 921px) { .entry-content .hb-about.wp-block-group { padding-left: 32px; padding-right: 32px; } }

/* ABOUT PAGE: photo bands (same proportions on every device so the whole strip always shows) */
.hb-about { overflow-x: clip; }
.hb-about .hb-about__band { width: 100vw; max-width: 100vw; margin: 0 0 clamp(64px, 9vw, 120px) calc(50% - 50vw); padding: 0; aspect-ratio: 5 / 1; overflow: hidden; }
.hb-about .hb-about__band img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.hb-about .hb-about__band:last-child { margin-bottom: 0; }
body.page-id-4119 #primary { margin-bottom: 0; }
body.page-id-4119 #primary article.page { padding-bottom: 0; }

/* ============================================================
   PAGE HEADERS (Gallery, Guest Submissions, About, Contact)
   Same start on every menu page: eyebrow, serif title, optional intro line.
   Top offset (--hb-pagetop) is the gap from the top of the page to the eyebrow.
   ============================================================ */
:root { --hb-pagetop: 140px; }
body:is(.page-id-4119, .page-id-3922, .page-id-1004, .page-id-2270) .entry-content { padding-top: var(--hb-pagetop); }
.hb-pagehead h1, .hb-about h1 { font-family: Freight-big-pro, Helvetica, Arial, sans-serif; font-weight: 400; font-size: clamp(36px, 4.2vw, 56px); line-height: 1.08; color: #f5f5f5; margin: 0; }
.hb-pagehead .hb-eyebrow { margin: 0 0 14px; }
.hb-pagehead__lead { max-width: 560px; margin: 22px 0 0; font-size: 16px; line-height: 1.6; color: var(--hb-body); }
.hb-pagehead .wp-block-buttons { margin-top: 26px; }
/* neutralise the old per-page top spacing */
body.page-id-1004 .wp-block-uagb-container.uagb-block-a1c61af9 { margin-top: 0 !important; padding-top: 0 !important; }
body.page-id-3922 .wp-block-uagb-container.uagb-block-ec741e89 { margin-top: 0 !important; margin-left: 0 !important; margin-right: 0 !important; padding: 0 !important; }
/* the site adds 70px of space above page content at 1024px and below, so these are what is left to add */
@media (max-width: 1024px) { :root { --hb-pagetop: 70px; } }
@media (max-width: 921px) { :root { --hb-pagetop: 38px; } }
@media (max-width: 921px) { body.page-id-3922 .uagb-block-ec741e89 > .uagb-container-inner-blocks-wrap { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 32px !important; box-sizing: border-box; } }
@media (max-width: 767px) { body.page-id-3922 .uagb-block-ec741e89 > .uagb-container-inner-blocks-wrap { padding: 0 24px !important; } }

/* header block: no padding of its own, eyebrow colour held at the shared grey */
body .entry-content .hb-pagehead { padding: 0; margin: 0; }
body .entry-content .hb-pagehead .hb-eyebrow, body .entry-content .hb-about .hb-eyebrow { color: var(--hb-eyebrow); }
/* Gallery: same 1200px text width and side margins as the other pages */
.content-with-gradient { max-width: 1200px; }
@media (min-width: 1201px) { .content-with-gradient .entry-content { padding-left: 0; padding-right: 0; } }
@media (min-width: 782px) and (max-width: 1200px) { .content-with-gradient .entry-content { padding-left: 32px; padding-right: 32px; } }
@media (max-width: 781px) { body .content-with-gradient .entry-content .hb-pagehead { padding-left: 20px; padding-right: 20px; box-sizing: border-box; } }

body .content-with-gradient .entry-content .hb-pagehead .hb-eyebrow { color: var(--hb-eyebrow) !important; }
/* Contact: the form column starts level with the page title */
body.page-id-1004 .wp-block-uagb-container.uagb-block-29375e57 { padding-top: 0 !important; }
body.page-id-1004 .uagb-block-29375e57 .forminator-ui { margin-top: 0; }
@media (max-width: 781px) { body .content-with-gradient .entry-content .hb-grid-nav { padding-left: 20px; padding-right: 20px; } }

/* Phone and tablet logo on pages without the transparent header (single posts, Contact):
   the theme falls back to the full wordmark there, so show the short logo exactly as the other pages do */
@media (max-width: 921px) {
	body.ast-header-break-point:not(.ast-theme-transparent-header) #masthead #ast-mobile-header .site-logo-img .custom-logo-link {
		display: block; width: 27px; height: 16px; box-sizing: content-box; padding: 8px 18px 8px 0; overflow: hidden; line-height: 0;
		background: url("https://himbodied.com/wp-content/uploads/2025/02/Small_Logo_Site-removebg-preview-300x48.png") -41px 8px / 100px 16px no-repeat;
	}
	body.ast-header-break-point:not(.ast-theme-transparent-header) #masthead #ast-mobile-header .site-logo-img .custom-logo-link img { opacity: 0; }
}

/* Membership pages (login, checkout, account, profile, orders): the title lines up with the centred form */
body:not(.pmpro-levels) .entry-content .uagb-container-inner-blocks-wrap > .wp-block-uagb-advanced-heading,
body:not(.pmpro-levels) .entry-content .uagb-container-inner-blocks-wrap > .wp-block-uagb-info-box { width: 100%; max-width: 680px; margin-left: auto; margin-right: auto; }
body.pmpro-login .entry-content .uagb-container-inner-blocks-wrap > .wp-block-uagb-advanced-heading,
body.pmpro-login .entry-content .uagb-container-inner-blocks-wrap > .wp-block-uagb-info-box { max-width: 460px; }

/* Membership pages on tablet and phone: drop the extra inner margins so the form sits at the same side margin as the other pages */
@media (max-width: 921px) {
	body:has(.entry-content .pmpro) .entry-content > .wp-block-uagb-container { margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
	body:has(.entry-content .pmpro) .entry-content .uagb-container-inner-blocks-wrap { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; max-width: none !important; }
}
@media (min-width: 768px) and (max-width: 921px) { body:has(.entry-content .pmpro) .entry-content > .wp-block-uagb-container { margin-left: -22px !important; margin-right: -22px !important; } }

/* ADMIN BAR: keep the fixed header (and its menu toggle) clickable when logged in */
@media (min-width: 783px) { body.admin-bar .ast-primary-header-bar { top: 32px !important; } }
@media (max-width: 782px) {
  body.admin-bar #wpadminbar { position: fixed !important; height: 46px; overflow: hidden; }
  body.admin-bar .ast-primary-header-bar { top: 46px !important; }
}

/* ---------- Contact form: small privacy note under the message box ---------- */
body .hb-form-note { margin: 4px 0 0; font-size: 14px; line-height: 1.6; color: var(--hb-note, #a0a0a0); }
body .hb-form-note a { color: var(--hb-eyebrow, #bdbdbd); text-decoration: underline; text-underline-offset: 2px; }
body .hb-form-note a:hover { color: #bf9b30; }

/* ---------- Contact form: "Reason for writing" dropdown in the site style (dark, thin underline, gold on hover) ---------- */
body #forminator-module-4161 .forminator-field[data-field="html-1"] > .forminator-label { display: none; }
body #forminator-module-4161 .forminator-select .select2-selection--single { background: transparent !important; border: 0 !important; border-bottom: 1px solid #555 !important; border-radius: 0 !important; box-shadow: none !important; }
body #forminator-module-4161 .forminator-select .select2-selection__rendered { color: #fff !important; font: 400 16px/1.4 Lato, sans-serif !important; padding-left: 0 !important; }
body #forminator-module-4161 .forminator-select .select2-selection__placeholder { color: #c4c4c4 !important; opacity: .7; }
body #forminator-module-4161 .forminator-select.select2-container--open .select2-selection--single,
body #forminator-module-4161 .forminator-select.select2-container--focus .select2-selection--single { border-bottom-color: rgba(255,255,255,.7) !important; }
body #forminator-module-4161 .forminator-select .select2-selection__arrow,
body #forminator-module-4161 .forminator-select .select2-selection__arrow * { color: #c4c4c4 !important; }
body .forminator-custom-form-4161.forminator-select-dropdown { background: #0b0b0b !important; border: 1px solid rgba(255,255,255,.18) !important; border-radius: 0 !important; box-shadow: 0 10px 28px rgba(0,0,0,.65) !important; }
body .forminator-custom-form-4161.forminator-select-dropdown .select2-results__option { background: transparent !important; color: #c4c4c4 !important; font: 400 16px/1.4 Lato, sans-serif !important; padding: 12px 16px !important; }
body .forminator-custom-form-4161.forminator-select-dropdown .select2-results__option--highlighted,
body .forminator-custom-form-4161.forminator-select-dropdown .select2-results__option[aria-selected="true"] { background: rgba(255,255,255,.06) !important; color: #bf9b30 !important; }

/* Links inside the page intro lines are underlined so they read as links */
body .hb-pagehead__lead a { text-decoration: underline; text-underline-offset: 2px; }
body .hb-pagehead__lead a:hover { color: #bf9b30; }
body #forminator-module-4161 .forminator-select .select2-selection--single::before { background: transparent !important; }
