/* WorluxFit Catalog — front-end styles (no WooCommerce) */
.wlf-wrap{max-width:1240px;margin:0 auto;padding:0 24px}
.wlf-pdp{display:grid;grid-template-columns:1.06fr .94fr;gap:56px;padding:40px 0 64px;align-items:start}
.wlf-gallery{display:grid;grid-template-columns:76px 1fr;gap:14px;align-items:start}
.wlf-thumbs{display:grid;gap:10px}
.wlf-thumbs img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;cursor:pointer;border:1px solid transparent;transition:.2s}
.wlf-thumbs img.on{border-color:#111110}
.wlf-main{border-radius:16px;overflow:hidden;background:#eeebe6;aspect-ratio:3/4}
.wlf-main img{width:100%;height:100%;object-fit:cover;display:block}
.wlf-eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#7b7873;font-weight:600;margin-bottom:8px}
.wlf-info h1.wlf-title{font-size:34px;line-height:1.15;letter-spacing:-.02em;margin:0 0 8px;font-weight:650}
.wlf-sku{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;color:#7b7873;letter-spacing:.04em}
.wlf-lede{color:#3a3936;margin:18px 0 6px;max-width:52ch}
.wlf-spec{width:100%;border-collapse:collapse;font-size:13.5px;margin:16px 0 22px}
.wlf-spec th{text-align:left;color:#7b7873;font-weight:500;padding:10px 0;width:38%;border-bottom:1px solid #e7e2da}
.wlf-spec td{padding:10px 0;border-bottom:1px solid #e7e2da}
.wlf-swatches,.wlf-sizes{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 20px}
.wlf-swatches span{display:inline-flex;align-items:center;gap:8px;border:1px solid #e7e2da;border-radius:999px;padding:7px 13px;font-size:13px;background:#fff}
.wlf-swatches i{width:14px;height:14px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.12)}
.wlf-sizes span{border:1px solid #e7e2da;background:#fff;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:600}
.wlf-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.wlf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 26px;border-radius:999px;font-weight:600;font-size:14px;text-decoration:none;border:1px solid transparent;transition:.18s}
.wlf-btn-dark{background:#111110;color:#fff}.wlf-btn-dark:hover{background:#000;color:#fff}
.wlf-btn-ghost{background:transparent;color:#111110;border-color:#111110}.wlf-btn-ghost:hover{background:#111110;color:#fff}
.wlf-note{font-size:12.5px;color:#7b7873;margin-top:14px}
.wlf-blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:8px 0 64px}
.wlf-block{background:#fff;border:1px solid #e7e2da;border-radius:16px;padding:26px}
.wlf-block h3{margin:0 0 10px;font-size:16px;font-weight:650}
.wlf-block p,.wlf-block li{font-size:14px;color:#3a3936;line-height:1.55}
.wlf-block ul{margin:0;padding-left:18px}
.wlf-filters{display:flex;gap:10px;flex-wrap:wrap;padding:20px 0 26px}
.wlf-filters button{border:1px solid #e7e2da;background:#fff;border-radius:999px;padding:9px 16px;font:inherit;font-size:13px;cursor:pointer}
.wlf-filters button.on{background:#111110;color:#fff;border-color:#111110}
.wlf-grid{display:grid;gap:26px 20px;grid-template-columns:repeat(4,minmax(0,1fr))}
.wlf-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wlf-card{display:flex;flex-direction:column;gap:9px;text-decoration:none;color:inherit}
.wlf-card .m{position:relative;overflow:hidden;border-radius:14px;background:#eeebe6;aspect-ratio:3/4}
.wlf-card .m img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.wlf-card:hover .m img{transform:scale(1.04)}
.wlf-card .t{position:absolute;left:12px;top:12px;background:rgba(255,255,255,.94);border-radius:999px;padding:5px 11px;font-size:11px;font-weight:600;letter-spacing:.04em}
.wlf-card h3{font-size:15px;font-weight:600;margin:0;letter-spacing:-.01em;line-height:1.3}
.wlf-card .r{display:flex;justify-content:space-between;font-size:12px;color:#7b7873}
.wlf-card .cta{font-size:13px;font-weight:600;color:#b4623f;margin-top:2px}
.wlf-dots{display:flex;gap:5px;align-items:center}
.wlf-dots i{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.12);display:inline-block}
.wlf-dots em{font-style:normal;font-size:11px;color:#7b7873;margin-left:4px}
@media(max-width:1024px){.wlf-pdp{grid-template-columns:1fr;gap:28px}.wlf-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.wlf-blocks{grid-template-columns:1fr}}
@media(max-width:680px){.wlf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.wlf-gallery{grid-template-columns:1fr}.wlf-thumbs{grid-template-columns:repeat(3,1fr);grid-auto-flow:column}.wlf-info h1.wlf-title{font-size:26px}}


/* ---------------------------------------------------------------
   Brand header (Hello Elementor dynamic header)
   --------------------------------------------------------------- */
.site-header{background:#faf8f5;border-bottom:1px solid #e7e2da}
.site-header .site-title a{color:#111110;font-weight:800;letter-spacing:.2em;text-transform:uppercase;font-size:16px}
.site-header .site-title a:hover{color:#b4623f}
.site-header .site-description{color:#7b7873;font-size:12px;letter-spacing:.02em}
.site-navigation ul.menu{display:flex;gap:26px;flex-wrap:wrap}
.site-navigation ul.menu a{color:#3a3936;font-size:14px;font-weight:500;letter-spacing:0}
.site-navigation ul.menu a:hover{color:#b4623f}
.elementor-template-full-width .site-content{width:100%;max-width:100%}

/* ---------------------------------------------------------------
   Compatibility shim: Elementor 4.x no longer ships the legacy
   column-width rules that section/column templates rely on.
   --------------------------------------------------------------- */
.elementor-column.elementor-col-10{width:10%}
.elementor-column.elementor-col-11{width:11.111%}
.elementor-column.elementor-col-12{width:12.5%}
.elementor-column.elementor-col-14{width:14.285%}
.elementor-column.elementor-col-16{width:16.666%}
.elementor-column.elementor-col-20{width:20%}
.elementor-column.elementor-col-25{width:25%}
.elementor-column.elementor-col-33{width:33.333%}
.elementor-column.elementor-col-34{width:33.333%}
.elementor-column.elementor-col-40{width:40%}
.elementor-column.elementor-col-45{width:45%}
.elementor-column.elementor-col-46{width:46%}
.elementor-column.elementor-col-48{width:48%}
.elementor-column.elementor-col-50{width:50%}
.elementor-column.elementor-col-52{width:52%}
.elementor-column.elementor-col-54{width:54%}
.elementor-column.elementor-col-55{width:55%}
.elementor-column.elementor-col-60{width:60%}
.elementor-column.elementor-col-66{width:66.666%}
.elementor-column.elementor-col-75{width:75%}
.elementor-column.elementor-col-80{width:80%}
.elementor-column.elementor-col-100{width:100%}
@media(max-width:1024px){
  .elementor-column.elementor-col-20,
  .elementor-column.elementor-col-25,
  .elementor-column.elementor-col-33,
  .elementor-column.elementor-col-34{width:50%}
}
@media(max-width:767px){
  .elementor-column[class*="elementor-col-"]{width:100% !important}
}


/* category tiles: equal height regardless of source aspect ratio */
.wf-cat-img img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;display:block}
@media(max-width:767px){ .wf-cat-img img{aspect-ratio:4/3} }


/* ---------------------------------------------------------------
   Mobile: keep Elementor headings and buttons inside the viewport
   --------------------------------------------------------------- */
body{overflow-x:hidden}
@media(max-width:767px){
  .elementor-widget-heading .elementor-heading-title{font-size:32px !important;line-height:1.15 !important;letter-spacing:-.02em}
  .elementor-widget-heading h2.elementor-heading-title{font-size:26px !important}
  .elementor-widget-heading h3.elementor-heading-title{font-size:19px !important}
  .elementor-button{padding:13px 22px !important;font-size:13px !important}
  .elementor-widget-button{max-width:100%}
  .elementor-section .elementor-container{padding-left:18px;padding-right:18px;width:100% !important}
  .elementor-container,.elementor-column,.elementor-widget-wrap{max-width:100%}
  .wlf-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .wlf-pdp{grid-template-columns:1fr !important;gap:24px}
  .wlf-blocks{grid-template-columns:1fr !important}
  .wlf-info h1.wlf-title{font-size:26px}
}
@media(max-width:480px){
  .elementor-widget-heading .elementor-heading-title{font-size:27px !important}
}


/* Mobile hard-overflow guard (Elementor 4 legacy sections) */
@media(max-width:767px){
  html,body{overflow-x:hidden !important;max-width:100% !important}
  body .elementor-section,
  body .elementor-container,
  body .elementor-column,
  body .elementor-widget-wrap,
  body .elementor-widget,
  body .elementor-widget-container{width:100% !important;max-width:100% !important;box-sizing:border-box !important}
  body .elementor-section > .elementor-container{display:flex !important;flex-wrap:wrap !important}
  body .elementor-widget-heading .elementor-heading-title,
  body .elementor-widget-text-editor{overflow-wrap:anywhere;word-break:break-word}
  body .elementor-widget-button{display:block !important;width:100% !important}
  body .elementor-widget-button + .elementor-widget-button{margin-top:10px}
}


/* Mobile hard guard v2 */
@media(max-width:767px){
  html,body{width:100%;overflow-x:hidden}
  .elementor-page .elementor-section,
  .elementor-page .elementor-section > .elementor-container,
  .elementor-page .elementor-column,
  .elementor-page .elementor-widget-wrap,
  .elementor-page .elementor-widget,
  .elementor-page .elementor-widget-container,
  .elementor-page .elementor-heading-title{
    width:auto !important; max-width:100vw !important; min-width:0 !important; box-sizing:border-box !important;
  }
  .elementor-page .elementor-widget-heading .elementor-heading-title{font-size:28px !important;line-height:1.2 !important}
  .elementor-page .elementor-widget-text-editor p{font-size:15px !important}
}


/* ---------------------------------------------------------------
   Brand footer (rendered by includes/brand-footer.php)
   --------------------------------------------------------------- */
.wlf-footer{background:#111110;color:#cfcbc3;padding:56px 0 22px;font-size:14px;margin-top:0}
.wlf-footer-inner{max-width:1240px;margin:0 auto;padding:0 28px;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px}
.wlf-f-logo{font-weight:800;letter-spacing:.22em;font-size:15px;color:#fff;margin-bottom:14px}
.wlf-f-logo span{color:#c07a55}
.wlf-f-col p{color:#a5a19a;line-height:1.6;margin:0 0 10px}
.wlf-f-col h5{color:#fff;font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin:0 0 14px;font-weight:600}
.wlf-f-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.wlf-f-col a{color:#cfcbc3;text-decoration:none}
.wlf-f-col a:hover{color:#fff}
.wlf-f-mail a{color:#e8b8a2 !important}
.wlf-f-bottom{max-width:1240px;margin:40px auto 0;padding:18px 28px 0;border-top:1px solid #2a2a28;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12px;color:#8d8983}
@media(max-width:900px){ .wlf-footer-inner{grid-template-columns:1fr 1fr} }
@media(max-width:600px){ .wlf-footer-inner{grid-template-columns:1fr} }

/* homepage CTA spacing */
.wlf-home-cta-gap{height:26px}


/* spacing: buttons that follow a product grid */
.elementor-widget-shortcode + .elementor-widget-button{margin-top:24px !important}
.elementor-widget-shortcode + .elementor-widget-button .elementor-button{padding:13px 26px !important}
.elementor-icon-box-wrapper{padding:4px 0}
.elementor-widget-icon-box .elementor-icon-box-title{margin-bottom:6px}
