/* ==========================================================================
   TABLE OF CONTENTS
   01. Global Layout & Utilities
   02. Header & Navigation
   03. Lightbox & Popouts
   04. Home Page Components
   05. Video Components
   06. Shop & WooCommerce
       6.1 Shop Layout & Search
       6.2 Shop Product Grid
       6.3 Single Product Page
       6.4 Product Reviews
       6.5 Shop More / Related
   07. Resume Page
   08. Footer
   09. Footer Low Mobile Nav
   ========================================================================== */


/* ==========================================================================
   01. GLOBAL LAYOUT & Utilities
   ========================================================================== */

html, body {
  background-color: #ffffff !important;
}

/* --- GLOBAL RECAPTCHA HIDE --- */
.grecaptcha-badge {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

.fullwidth {
  width: 100%;
}

.light {
  background-image: none !important;
  background-color: #E9E9E9 !important;
}

.section {
  padding-left: 15px;
  padding-right: 15px;
}

.section-title-container {
  padding-left: 10px;
  padding-right: 10px;
}

.justify {
  text-align: justify;
}


/* ==========================================================================
   02. HEADER & NAVIGATION
   ========================================================================== */

.nav > li > a,
.nav > li > a:hover {
  color: hsl(0, 0%, 50%);
}

.mobileicons .col {
  padding-left: 3px !important;
  padding-right: 3px !important;
}


/* ==========================================================================
   03. LIGHTBOX & POPOUTS
   ========================================================================== */

.mfp-arrow {
  top: 45% !important;
}

.mfp-arrow-left {
  left: -17px !important;
}

.mfp-arrow-right {
  right: -12px !important;
}

.mfp-ready .mfp-close {
  opacity: 1.0;
}

.mfp-close {
  background: rgba(0, 0, 0, 0.9);
  border-radius: 100%;
  padding: 0;
}

.mfp-close svg {
  filter: drop-shadow(0 0 0 black);
}

.off-canvas-left .mfp-content,
.off-canvas-right .mfp-content {
  background-color: hsla(0, 0%, 100%, 1.0);
}

.searchgallery {
  background-color: #fff;
  border-radius: 90px;
}

.searchgallery input,
.poppoutsearch input {
  height: 50px;
  line-height: 50px;
  padding: 0 25px;
}


/* ==========================================================================
   04. HOME PAGE COMPONENTS
   ========================================================================== */

.homehero .section-bg :is(img, picture, video) {
  min-height: 347px;
}

.secscroll {
  padding-left: 0; 
  padding-right: 0;
}

.secscroll .section-title-container {
  max-width: 91%;
}

.flickslide .row {
  margin-left: 5px !important;
  margin-right: 5px !important;
}

/* Smooth transition to all slider images */
.flickslide .flickity-slider > div img {
  transition: filter 0.6s ease;
}

/* Grayscale inactive slides */
.flickslide .flickity-slider > div:not(.is-selected) img {
  filter: grayscale(100%);
}

.homephoto > .gallery-col:nth-child(n+15) {
  display: none;
}

.eapps-instagram-feed-header-follow-button-wrapper {
  display: none;
}


/* ==========================================================================
   05. VIDEO COMPONENTS
   ========================================================================== */

.videowrap .itemtitle,
.vidtitle {
  color: #000;
  font-weight: 700;
  text-decoration: none;
  line-height: 1.0;
  display: block;
  font-family: Montserrat, 'Montserrat Fallback', sans-serif;
  font-size: 1.0em;
  text-align: center;
}

.videowrap .itemtitle p {
  font-weight: 700;
}

.videowrap .itemsubtitle,
.vidsubtitle {
  text-transform: uppercase;
  display: block;
  text-decoration: none;
  color: #7E7E7E;
  font-size: 0.6em;
  text-align: center;
}

/* --- VIDEO ASPECT RATIO FIX (HOMEPAGE & ARCHIVE PROPORTIONS SYNCHRONIZED) --- */
/* Hardware-locks container scaling to a perfect 5:3 ratio (60% padding model) across all engines */
.video-hover-wrap {
  position: relative !important;
  overflow: hidden !important;
  width: 100% !important;
  aspect-ratio: 5 / 3 !important; 
  display: block !important;
}

.video-hover-wrap .static-thumb {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.video-hover-wrap .hover-video {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: 0;
  transition: opacity 0.3s ease-in-out !important;
  z-index: 2;
  pointer-events: none;
}

.roundvid img {
  border-radius: 6%;
}


/* ==========================================================================
   06. SHOP & WOOCOMMERCE
   ========================================================================== */

/* --------------------------------------------------------------------------
   6.1 Shop Layout & Search
   -------------------------------------------------------------------------- */

/* Layout & Search - Isolated strictly to shop pages so loop elements never bleed */
.post-type-archive-product .row-solid .col-inner, 
.tax-product_cat .row-solid .col-inner, 
.nopad .row-solid .col-inner {
  padding: 6px 15px 23px 15px;
}

.nopad .row .row:not(.row-collapse) {
  margin-left: -5px;
  margin-right: -5px;
  padding-left: 5px;
  padding-right: 5px;
  width: auto;
}

.form-flat .flex-row .flex-col {
  padding-right: 0;
  margin-right: 2px;
}

.form-flat input:not([type="submit"]),
.form-flat select,
.form-flat textarea {
  background-color: rgba(0, 0, 0, 0.03);
  border-color: #b9b9b9;
  border-radius: 99px;
  box-shadow: none;
  color: #000 !important;
  text-transform: uppercase;
  font-size: 0.95em;
  letter-spacing: 0;
}

.autocomplete-suggestion img {
  border-radius: 0;
  display: inline-block;
  height: 40px;
  margin-right: 10px;
  width: 40px;
}

/* --------------------------------------------------------------------------
   6.2 Shop Product Grid
   -------------------------------------------------------------------------- */

.woocommerce-loop-product__title a,
.prodwrap .col-inner .box .title-wrapper a {
  color: #000 !important;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 0.85em !important;
  line-height: 1.0em;
}

.prodwide .col-inner .box .title-wrapper {
  margin-top: -13px;
  margin-bottom: 0;
}

.prodwrap .col-inner .box-text.text-center {
  padding: 0;
}

.prodwrap .col-inner .box .box-excerpt {
  color: #777;
  text-transform: uppercase;
  font-weight: 400;
  font-style: normal;
  font-size: 0.8em;
  line-height: 1.3em !important;
  margin-bottom: 15px;
  margin-top: -0.2em !important;
}

.text-center > div {
  margin-left: unset;
  margin-right: unset;
}

/* --------------------------------------------------------------------------
   6.3 Single Product Page
   -------------------------------------------------------------------------- */

/* Force main product image to break out of the column padding */
.product-gallery-slider,
.woocommerce-product-gallery__wrapper {
  margin-left: -15px !important;
  margin-right: -15px !important;
  width: calc(100% + 30px) !important;
  max-width: none !important;
}

/* Keep thumbnails edge-to-edge */
.productgallerytemp .galwrap .row .gallery,
.galwrap .row .gallery,
.row .row:not(.row-collapse) {
  margin-left: -15px;
  margin-right: -15px;
  padding-left: 0px;
  padding-right: 0px;
  width: auto;
}

.productgallerytemp .mb-half,
.ThisIsTheGapUnderMainShopPhoto {
  margin-bottom: 0;
}

.productgallerytemp .row-small > .flickity-viewport > .flickity-slider > .col {
  margin-bottom: 0;
  padding: 0;
}

.woocommerce-variation-add-to-cart :where(.ux-quantity, .single_add_to_cart_button, .ux-buy-now-button),
form.cart :where(.ux-quantity, .single_add_to_cart_button, .ux-buy-now-button) {
  flex: none;
}

.shopaddtocartmob .woocommerce-variation-add-to-cart button {
  width: 100%;
}

/* --------------------------------------------------------------------------
   6.4 Product Reviews
   -------------------------------------------------------------------------- */

/* Mobile Grid Layout Spacing Rule (1 Stacked Columns) */
.reviewslide .row-small > .col, 
.reviewslide .row-small > .flickity-viewport > .flickity-slider > .col,
.reviewslide.row-small > .col,
.reviewslide.row-small > .flickity-viewport > .flickity-slider > .col {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 19.6px !important; /* Preserves uniform vertical gap between cards */
  margin-bottom: 0;
}

/* Mobile Split Layout Meta Adjustment (Distributes buyer and item info to the left/right edges) */
.rev-card-inner-layout {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.rev-meta-left-col {
  flex: 0 0 55% !important;
  max-width: 55% !important;
}
.rev-meta-right-col {
  flex: 0 0 45% !important;
  max-width: 45% !important;
}
.rev-link-alignment-wrapper {
  text-align: right !important;
}

/* Mobile Sizing Sync */
.rev-card-buyer-location,
.rev-card-product-link {
  font-size: 11px !important;
}

/* --------------------------------------------------------------------------
   6.5 Shop More / Related
   -------------------------------------------------------------------------- */

.shopmore .fullwidthshop {
  width: 80%;
}

.shopmore .row-solid .col-inner {
  padding: 0px 0px 0px 0px;
}

:is(.shopmore .archive, .shopmore .tax-product_cat, .shopmore .single-product) .shopmore .prodwrap .col-inner .box-text.text-center {
    padding-left: 33px;
    padding-right: 33px;
    padding-bottom: 30px;
}


/* ==========================================================================
   07. RESUME PAGE
   ========================================================================== */

.header-bottom {
  display: none;
}

.page-id-1882 .header-bottom {
  display: block;
}

.page-id-1882 .header-bottom a {
  margin-left: -3px; 
  margin-right: 8px; 
  font-size: 0.85em;
}

/* Section Headers */
.secheadlarge {
  display: inline-block;
  color: #fff;
  font-weight: bolder;
  font-size: 1.6rem;
  line-height: 1.0;
}

.secheadsmall {
  display: inline-block;
  font-size: 0.9em;
  color: #fff;
  padding: 0 !important;
  margin: 0 0 14px 0 !important;
  line-height: 1.0;
}

.dateid {
  width: unset;
  font-size: 0.8em;
  color: #fff;
  background-color: transparent;
  padding: 7px 10px;
  text-transform: uppercase;
  font-weight: 700;
  border-radius: 90px;
  border: 2px solid #fff;
  text-align: center;
  float: left;
  line-height: 1.0;
  margin: 0;
}

/* Sub Headers */
.subdeskwrap {
  border-width: 0 0 3px 0;
  border-style: solid;
  border-color: #CBCBCB;
  padding-bottom: 5px;
  margin-bottom: 20px;
}

.subheadlarge {
  display: inline !important;
  color: #000;
  font-weight: 900;
  font-size: 2.0em;
  line-height: 1.0;
  padding: 0 0 10px 0 !important;
  margin: 0 !important;
}

.subheadsmall {
  display: inline;
  font-size: 1.2em;
  color: #747474;
  padding: 0 0 10px 0 !important;
  margin: 0 !important;
  line-height: 1.0;
}

.resumebreadcrumb {
  display: inline-block;
  font-size: 1.4em;
  font-weight: 200;
  color: #747474;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1.0;
}

/* Photo Grid */
.row-small > .colxxxxxxxxVOID,
.row-small > .flickity-viewport > .flickity-slider > .colxxxxxxxxxVOID {
  margin-bottom: 0;
  padding: 0 6px 12px;
}

/* Section Padding Utility Classes */
.resumeabout,
.resumefreelancetext,
.ignitebody {
  padding-left: 11px;
  padding-right: 11px;
}

.vallelybody,
.bankruptbody {
  padding-left: 25px;
  padding-right: 25px;
}

.resumesechead {
  padding-left: 10px;
  padding-right: 10px;
}

.ignitepad {
  padding-left: 14px;
  padding-right: 14px;
}


/* ==========================================================================
   08. FOOTER
   ========================================================================== */

#footer {
  /* Forces the black footer to stretch down and swallow the white body gap */
  padding-bottom: calc(75px + env(safe-area-inset-bottom, 12px)) !important;
}

.mobsubfoot {
  text-align: center;
}

.mobfooter {
  padding-top: 10px !important;
  padding-right: 26px !important;
  padding-bottom: 26px !important;
  padding-left: 26px !important;
}

.mobfooter p .wpcf7-submit {
  min-width: 100% !important;
  width: 100% !important;
  margin-bottom: 10px !important;
}


/* ==========================================================================
   09. FOOTER LOW MOBILE NAV
   ========================================================================== */

/* --- PORTFOLIO & WEBSITE GRAPHICS DIRECTIVE --- */
/* Removes structural baseline layout voids across all mobile rendering engines */
.prodwrap .col-inner,
.prodwrap .box,
.prodwrap .box-image,
.prodwrap .box-image-inner {
  padding-top: 0 !important;
  margin-top: 1px !important;
}

.top .image-cover img {
  object-position: 50% 0% !important;
}

.web .bar img {
  border-radius: 10px 10px 0px 0px !important; 
  margin-bottom: 0px !important;
  display: block !important;
  width: 100% !important;
}

.web .top img {
  border-radius: 0px 0px 10px 10px !important; 
  margin-top: 0px !important;
  display: block !important;
  width: 100% !important;
  object-position: center top !important;
  object-fit: cover !important;
}

/* --- BOTTOM MOBILE DOCK LAYOUT SYSTEM --- */
#robx-hybrid-nav-wrapper {
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 2147483647 !important;
}

#robx-hybrid-nav-wrapper .fb-glass-bottom-nav {
  position: fixed !important; 
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2147483647 !important; 
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
  
  -webkit-transform: translate3d(0, 0, 0) !important;
  transform: translate3d(0, 0, 0) !important;
  -webkit-backface-visibility: hidden !important;
  backface-visibility: hidden !important;
  will-change: transform !important;
  
  /* Solid layout background gradient */
  background: linear-gradient(to bottom, #ffffff 0%, #ededed 100%) !important; 
  border-top: 1px solid rgba(0, 0, 0, 0.15) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  
  /* Native notch spacing for safe UI padding across all mobile engines */
  height: calc(61px + env(safe-area-inset-bottom, 0px)) !important;
  padding: 0 10px calc(5px + env(safe-area-inset-bottom, 0px)) 10px !important;
  
  transition: height 0.2s ease-in-out !important;
}

/* THE SLIDING MAGIC LINE */
#robx-hybrid-nav-wrapper .nav-active-indicator {
  position: absolute;
  top: -1px; 
  left: 0;
  height: 3px;
  background-color: #ab0001;
  z-index: 10;
  opacity: 0; 
  border-radius: 0 0 3px 3px; 
  
  transition: transform 0.25s cubic-bezier(0.25, 1, 0.5, 1), 
              width 0.25s cubic-bezier(0.25, 1, 0.5, 1), 
              opacity 0.15s ease;
}

#robx-hybrid-nav-wrapper .nav-active-indicator.instant-load {
  transition: none !important; 
}

/* NAVIGATION LINKS & ICONS */
#robx-hybrid-nav-wrapper .fb-glass-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1; 
  height: 56px; 
  text-decoration: none !important; 
  
  color: #111111 !important; 
  opacity: 0.6 !important;   
  
  -webkit-tap-highlight-color: transparent !important; 
  outline: none !important;
  user-select: none;
  
  box-sizing: border-box; 
  transition: height 0.2s ease-in-out, color 0.15s ease, opacity 0.15s ease;
  cursor: pointer;
}

#robx-hybrid-nav-wrapper .fb-glass-nav-item svg {
  width: 24px !important; 
  height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
  transition: width 0.2s ease-in-out, height 0.2s ease-in-out;
}

#robx-hybrid-nav-wrapper .fb-glass-nav-item .fb-icon-outline { display: block; }
#robx-hybrid-nav-wrapper .fb-glass-nav-item .fb-icon-solid { display: none; }

@media (hover: hover) {
  #robx-hybrid-nav-wrapper .fb-glass-nav-item:hover .fb-icon-outline { display: none; }
  #robx-hybrid-nav-wrapper .fb-glass-nav-item:hover .fb-icon-solid { display: block; }
  #robx-hybrid-nav-wrapper .fb-glass-nav-item:hover { color: #ab0001 !important; opacity: 1 !important; }
}

/* ZERO-LAG INSTANT TOUCH FEEDBACK & ACTIVE STATE */
#robx-hybrid-nav-wrapper .fb-glass-nav-item:active .fb-icon-outline,
#robx-hybrid-nav-wrapper .fb-glass-nav-item.active .fb-icon-outline { 
  display: none !important; 
}

#robx-hybrid-nav-wrapper .fb-glass-nav-item:active .fb-icon-solid,
#robx-hybrid-nav-wrapper .fb-glass-nav-item.active .fb-icon-solid { 
  display: block !important; 
}

#robx-hybrid-nav-wrapper .fb-glass-nav-item:active,
#robx-hybrid-nav-wrapper .fb-glass-nav-item.active {
  color: #ab0001 !important; 
  opacity: 1 !important; 
}

/* TYPOGRAPHY */
#robx-hybrid-nav-wrapper .fb-glass-nav-label {
  text-transform: uppercase;
  font-size: 9.5px; 
  font-weight: 700; 
  letter-spacing: 0.5px; 
  font-family: Montserrat, 'Montserrat Fallback', -apple-system, sans-serif !important;
  
  margin-top: 4px; 
  opacity: 1;
  max-height: 15px; 
  overflow: hidden;
  transition: opacity 0.15s ease, max-height 0.2s ease-in-out, margin-top 0.2s ease-in-out;
}

/* COMPACT MODE (SCROLL SHRINKING) */
#robx-hybrid-nav-wrapper.compact-mode .fb-glass-bottom-nav {
  height: calc(53px + env(safe-area-inset-bottom, 0px)) !important;
  padding-bottom: calc(2px + env(safe-area-inset-bottom, 0px)) !important;
}

#robx-hybrid-nav-wrapper.compact-mode .fb-glass-nav-item {
  height: 48px;
}

#robx-hybrid-nav-wrapper.compact-mode .fb-glass-nav-item svg {
  width: 22px !important;
  height: 22px !important;
  max-width: 22px !important;
  max-height: 22px !important;
}

#robx-hybrid-nav-wrapper.compact-mode .fb-glass-nav-label {
  opacity: 0 !important;
  max-height: 0;
  margin-top: 0; 
}




/* ==========================================================================
   08. HOME
   ========================================================================== */
.row.prp-card-container {
    border-radius: 20px !important;
}

/* Mobile Padding: 0px top (flush beneath square photo), 40px right/bottom/left */
.prp-text-box {
    padding: 0px 40px 40px 40px !important;
}

.prp-text-box h2.prp-main-title {
    font-size: 1.7em !important;
}

/* Mobile Only: Guaranteed 100% Full-Width Button */
.prp-btn-wrapper {
    width: 100% !important;
    display: block !important;
}

.prp-text-box a.prp-btn-view {
    display: flex !important;
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    white-space: normal !important;
    font-size: 0.82em !important;
    padding: 14px 20px !important;
    box-sizing: border-box !important;
}