/*
Theme Name: Blocksy Child — Minotaur
Description: Minotaur Fight Store child theme. Design tokens + refinements layered on Blocksy via CSS variables. Similar to legacy site, improved where sensible.
Template: blocksy
Version: 1.1.0
Author: Minotaur
*/

/* ---------- Design tokens ---------- */
:root {
  /* palette: fight-store identity — near-black, white, red accent */
  --theme-palette-color-1: #d92b2b;   /* accent / CTAs hover, sale */
  --theme-palette-color-2: #b71f1f;   /* accent dark */
  --theme-palette-color-3: #111214;   /* primary ink / buttons */
  --theme-palette-color-4: #2c2d30;   /* ink soft */
  --theme-palette-color-5: #6b6e73;   /* muted text */
  --theme-palette-color-6: #e9eaec;   /* borders */
  --theme-palette-color-7: #f6f7f8;   /* surface */
  --theme-palette-color-8: #ffffff;

  --theme-font-family: Roboto, system-ui, -apple-system, "Segoe UI", sans-serif;
  --theme-text-color: #2c2d30;
  --theme-headings-color: #111214;
  --theme-link-initial-color: #111214;
  --theme-link-hover-color: #d92b2b;

  --theme-button-background-initial-color: #111214;
  --theme-button-background-hover-color: #d92b2b;
  --theme-button-text-initial-color: #ffffff;
  --theme-button-text-hover-color: #ffffff;
  --theme-border-radius: 6px;
}

h1,h2,h3,h4 { font-family: "Roboto Slab", Roboto, system-ui, serif; letter-spacing: -.01em; }

/* ---------- Buttons: confident, consistent ---------- */
button, .button, [type=submit], .single_add_to_cart_button {
  border-radius: 6px; font-weight: 600; letter-spacing: .02em;
  transition: background-color .15s ease, transform .1s ease;
}
.single_add_to_cart_button { padding-block: 14px; text-transform: uppercase; }
button:active, .button:active { transform: scale(.98); }

/* ---------- Mobile CTA polish (≤600px) — 70% of traffic is mobile ----------
   Primary actions become full-width + ~48-50px tall (taller = easier thumb tap, clearer hierarchy).
   Mobile-scoped only, so desktop layout is unchanged. */
@media (max-width:600px){
  /* taller primary buttons (padding-based so label stays vertically centred) */
  .single_add_to_cart_button,
  .wc-proceed-to-checkout a.checkout-button, #place_order,
  .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
    padding-top:16px !important; padding-bottom:16px !important;
  }
  /* product add-to-cart: Blocksy lays qty + button in a flex row (.ct-cart-actions);
     wrap it so the quantity keeps its natural width on its own line and the button goes full-width beneath. */
  .woocommerce div.product .ct-cart-actions { flex-wrap:wrap; gap:12px; align-items:center; }
  .woocommerce div.product .ct-cart-actions .quantity { flex:0 0 auto; margin:0; }
  .woocommerce div.product .ct-cart-actions .single_add_to_cart_button { flex:1 1 100%; width:100% !important; }
  /* cart "proceed to checkout" + checkout "place order" go full-width */
  .wc-proceed-to-checkout a.checkout-button { display:block; width:100%; box-sizing:border-box; text-align:center; }
  #place_order { width:100%; }
}

/* ---------- Product cards: cleaner grid ---------- */
[data-products] .product {
  border: 1px solid var(--theme-palette-color-6);
  border-radius: 10px; overflow: hidden; background: #fff;
  transition: box-shadow .18s ease, transform .18s ease;
}
[data-products] .product:hover { box-shadow: 0 8px 28px rgba(17,18,20,.10); transform: translateY(-2px); }
.woocommerce-loop-product__title { font-weight: 600; }

/* sale badge — brand red */
.onsale, .ct-woo-card-extra .onsale { background: #d92b2b; color: #fff; font-weight: 700; }

/* price emphasis */
.price { color: #111214; }
.price ins { text-decoration: none; color: #d92b2b; }

/* ---------- Swatches polish (mfs-variations) ---------- */
.mfs-swatch-color.mfs-selected { border-color: #d92b2b; box-shadow: 0 0 0 2px rgba(217,43,43,.25); }
.mfs-swatch-button.mfs-selected { background: #111214; border-color: #111214; }

/* ---------- Header: dark bar, tighter alignment ---------- */
header [data-row*="middle"] { --headerRowBackground: #111214; background: #111214; }
header [data-row*="middle"] .ct-menu-link, header .ct-header-cart, header [data-id="search"] .ct-label { color:#fff; }
header .ct-menu-link { font-weight:600; font-size:14px; text-transform:uppercase; letter-spacing:.04em; }
header .ct-menu-link:hover { color:#d92b2b; }
.custom-logo, .ct-header [data-id="logo"] img { max-height:54px; width:auto; }
header [data-row*="middle"] > div { align-items:center; }
[data-id="cart"] .ct-icon, [data-id="search"] .ct-icon { fill:#fff; width:22px; height:22px; }

/* fix: menu row lives in bottom row — darken it too so white links are visible */
header [data-row*="bottom"] { --headerRowBackground:#111214; background:#111214; }
header [data-row*="bottom"] .ct-menu-link { color:#fff; }
header [data-row*="top"] .ct-menu-link { color:inherit; }

/* ---------- Footer: dark, on-brand ---------- */
.ct-footer { background:#111214; color:#c9cbd0; }
.ct-footer a { color:#fff; } .ct-footer a:hover { color:#d92b2b; }
.ct-footer .ct-footer-copyright { color:#8a8d93; font-size:13px; }

/* fix: drive Blocksy's own header link variables (wins over var-based theming) */
header [data-row] {
  --color:#ffffff; --linkInitialColor:#ffffff; --linkHoverColor:#d92b2b;
  --menu-link-color:#ffffff; --theme-link-initial-color:#ffffff; --theme-link-hover-color:#d92b2b;
}
header [data-row] .ct-menu-link { color:#fff !important; }
header [data-row] [data-id="menu"] > ul > li > a { color:#fff !important; }

/* DEFINITIVE header bg fix: Blocksy paints rows via inline <style> using
   background-color: var(--theme-palette-color-8). Override the var scoped to
   header rows AND hard-set the colour so no injected rule can repaint it. */
header [data-row] {
  --theme-palette-color-8: #111214;
  background-color: #111214 !important;
}

/* logo: render white on the dark header bar */
header [data-id="logo"] img, header .custom-logo { filter: brightness(0) invert(1); }


/* ================= STREETWEAR / FIGHTWEAR DESIGN LANGUAGE =================
   Direction (2026-06-12): clean, modern, sleek streetwear-MMA. High contrast,
   condensed uppercase display type, sharp edges, generous whitespace. */
:root {
  --theme-font-family: Inter, system-ui, -apple-system, sans-serif;
  --theme-border-radius: 3px;
}
h1,h2,h3,h4 { font-family: Oswald, Inter, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .01em; font-weight: 600; }
h1 { letter-spacing: .02em; }
.woocommerce-loop-product__title { font-family: Inter; text-transform: none; font-weight: 600; font-size: 15px; }
button, .button, [type=submit], .single_add_to_cart_button { border-radius: 3px; font-family: Oswald, Inter, sans-serif; font-weight: 600; letter-spacing: .06em; }
[data-products] .product { border-radius: 4px; }
.mfs-swatch-button { border-radius: 3px; font-weight: 600; }
/* price: bold, athletic */
.price { font-family: Oswald, Inter, sans-serif; font-weight: 600; letter-spacing: .02em; }
/* section headings on archive/category */
.woocommerce-products-header__title { font-size: clamp(26px, 4vw, 40px); }


/* ============ V2 DESIGN LANGUAGE: FIGHT-POSTER STREETWEAR ============
   Anton display + Archivo body. Asymmetry, marquee, grain, red slashes,
   staggered reveals. Per frontend-design skill: bold, committed, atmospheric. */
:root {
  --theme-font-family: Archivo, system-ui, sans-serif;
  --mfs-red: #e3262f;
}
h1,h2,h3,h4, .price, button, .button, [type=submit], .single_add_to_cart_button {
  font-family: Anton, Archivo, sans-serif; font-weight: 400; letter-spacing: .02em;
}
h2.wp-block-heading { font-size: clamp(30px,4.5vw,52px); position: relative; padding-left: 18px; }
h2.wp-block-heading::before { content:''; position:absolute; left:0; top:8%; bottom:8%; width:6px;
  background: var(--mfs-red); transform: skewY(-12deg); }
h2.has-text-align-center { padding-left:0; } h2.has-text-align-center::before { display:none; }

/* hero: left-aligned, oversized, grain atmosphere */
.wp-block-cover.alignfull .wp-block-cover__inner-container { width: min(1280px,92vw); }
.wp-block-cover.alignfull h1 { text-align:left !important; font-size:clamp(56px,11vw,150px) !important;
  line-height:.92 !important; text-transform:uppercase; }
.wp-block-cover.alignfull h1 + .wp-block-buttons,
.wp-block-cover.alignfull p { text-align:left !important; justify-content:flex-start !important; }
.wp-block-cover.alignfull::after { content:''; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.16'/%3E%3C/svg%3E"); }

/* marquee strip */
.mfs-marquee { overflow:hidden; background:var(--mfs-red); padding:12px 0; white-space:nowrap; }
.mfs-marquee span { display:inline-block; font-family:Anton,sans-serif; font-size:22px; letter-spacing:.12em;
  color:#fff; text-transform:uppercase; animation:mfs-scroll 28s linear infinite; }
@keyframes mfs-scroll { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* category tiles: zoom + lift */
.mfs-tile { overflow:hidden; }
.mfs-tile img.wp-block-cover__image-background { transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.mfs-tile:hover img.wp-block-cover__image-background { transform:scale(1.07); }
.mfs-tile h3 a { font-size:clamp(20px,2.4vw,30px); }

/* staggered page-load reveal (CSS only) */
@keyframes mfs-rise { from{opacity:0; transform:translateY(22px)} to{opacity:1; transform:none} }
.wp-block-cover.alignfull p, .wp-block-cover.alignfull h1, .wp-block-cover.alignfull .wp-block-buttons
  { animation:mfs-rise .7s cubic-bezier(.2,.7,.2,1) backwards; }
.wp-block-cover.alignfull h1 { animation-delay:.12s } .wp-block-cover.alignfull .wp-block-buttons { animation-delay:.26s }

/* buttons: sharp, fight-poster */
.wp-block-button__link, .single_add_to_cart_button { border-radius:0 !important; font-size:17px;
  letter-spacing:.06em; padding:13px 30px; }
.wp-block-button__link:hover { background-color:var(--mfs-red) !important; color:#fff !important; }

/* product cards: shadow drama, red price */
[data-products] .product { border-radius:0; border-color:#dadde2; }
[data-products] .product:hover { box-shadow:10px 10px 0 rgba(17,18,20,.92); transform:translate(-2px,-2px); border-color:#111214; }
.price ins, .price bdi { color:#111214; } .onsale { background:var(--mfs-red) !important; border-radius:0; }


/* ============ LIVE-MATCH LAYER: white header + topbar + brand grid ============ */
header [data-row] { --theme-palette-color-8:#ffffff; background-color:#ffffff !important;
  --color:#111214; --linkInitialColor:#111214; --linkHoverColor:#e3262f; }
header [data-row] .ct-menu-link { color:#111214 !important; }
header [data-row] [data-id="menu"] > ul > li > a { color:#111214 !important; }
[data-id="cart"] .ct-icon, [data-id="search"] .ct-icon { fill:#111214; }
header [data-id="logo"] img, header .custom-logo { filter:none; }
/* (top announcement bar styles now live in inc/topbar.php) */
/* hero matches live: title-case, not poster caps */
.mfs-hero-title { text-transform:none !important; font-family:Archivo,sans-serif !important;
  font-weight:700 !important; font-size:clamp(34px,4.6vw,56px) !important; line-height:1.12 !important; }
/* brand collections grid like live */
.mfs-brand-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:14px; align-items:center;
  width:min(1280px,94vw); margin:0 auto; }
.mfs-brand-grid .mfs-brand-cell { display:flex; align-items:center; justify-content:center;
  border:1px solid #e9eaec; padding:14px; background:#fff; transition:box-shadow .15s, transform .15s; }
.mfs-brand-grid .mfs-brand-cell:hover { box-shadow:0 6px 18px rgba(17,18,20,.12); transform:translateY(-2px); }
.mfs-brand-grid img { max-height:64px; width:auto; object-fit:contain; }
@media (max-width:900px){ .mfs-brand-grid { grid-template-columns:repeat(3,1fr);} }


/* live-match fixes: kill site-title text, kill page-title band, correct hero size */
header .site-title, header [data-id="logo"] .ct-site-title-container span { display:none !important; }
.page .hero-section, .page [data-prefix="single_page"] .entry-header, .ct-page-title { display:none !important; }
.wp-block-cover.alignfull h1.mfs-hero-title { text-transform:none !important; font-family:Archivo,sans-serif !important;
  font-weight:700 !important; font-size:clamp(34px,4.6vw,54px) !important; line-height:1.12 !important; }

/* ============ PRODUCT CARD CLEANUP (homepage grids / category / search) ============ */
/* kill category-list clutter Blocksy prints on cards */
li.product ul.entry-meta, .product ul.entry-meta { display:none !important; }
/* loop add-to-cart / select-options button -> brand style (was default blue) */
li.product .ct-woo-card-actions a.button,
li.product a.add_to_cart_button,
li.product a.button.product_type_variable,
.products a.add_to_cart_button {
  background:#111214 !important; color:#fff !important; border:0 !important; border-radius:0 !important;
  font-family:Archivo,sans-serif !important; font-weight:600 !important; text-transform:uppercase;
  letter-spacing:.04em; font-size:13px; padding:11px 16px !important;
}
li.product .ct-woo-card-actions a.button:hover,
li.product a.add_to_cart_button:hover,
.products a.add_to_cart_button:hover { background:var(--mfs-red) !important; color:#fff !important; }
/* card: title + price tighter, athletic */
.woocommerce-loop-product__title { font-family:Archivo,sans-serif !important; text-transform:none !important; font-weight:600 !important; font-size:15px !important; }
li.product .price { font-family:Archivo,sans-serif !important; font-weight:700 !important; color:#111214 !important; }

/* ============ category / brand archive content blocks ============ */
.mfs-related-links { display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 4px; }
.mfs-related-link {
	display:inline-block; padding:8px 16px; border:1px solid #d0d2d6; border-radius:3px;
	font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.03em;
	text-decoration:none; color:#111214; background:#fff; transition:background .15s,color .15s,border-color .15s;
}
.mfs-related-link:hover { background:#111214; color:#fff; border-color:#111214; }

.mfs-tax-extra-desc { margin:30px 0 10px; color:#444; line-height:1.6; font-size:15px; }

.mfs-faq { margin:34px 0 10px; border-top:1px solid #e4e5e8; padding-top:24px; }
.mfs-faq-title { font-family:Anton,sans-serif !important; text-transform:uppercase; letter-spacing:.02em; font-size:26px; margin:0 0 16px; }
.mfs-faq-item { border-bottom:1px solid #e4e5e8; }
.mfs-faq-item summary {
	cursor:pointer; list-style:none; padding:15px 36px 15px 0; position:relative;
	font-weight:600; font-size:16px; color:#111214;
}
.mfs-faq-item summary::-webkit-details-marker { display:none; }
.mfs-faq-item summary::after {
	content:'+'; position:absolute; right:6px; top:50%; transform:translateY(-50%);
	font-size:22px; font-weight:400; color:#d92b2b; transition:transform .15s;
}
.mfs-faq-item[open] summary::after { content:'\2212'; }
.mfs-faq-answer { padding:0 0 16px; color:#555; line-height:1.6; font-size:15px; }

/* ============ custom site footer (mirrors live) ============ */
.ct-footer{display:none !important;} /* hide Blocksy default footer/copyright row */
.mfs-footer{background:#111214;color:#cfd0d2;font-family:Archivo,sans-serif;margin-top:40px}
.mfs-footer-inner{max-width:1240px;margin:0 auto;padding:52px 24px 30px;display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:40px}
.mfs-footer-col h4.mfs-footer-head{font-family:Anton,sans-serif;font-weight:400;letter-spacing:.06em;text-transform:uppercase;font-size:16px;color:#fff;margin:0 0 18px}
.mfs-footer-col ul{list-style:none;margin:0;padding:0}
.mfs-footer-col li{margin:0 0 10px}
.mfs-footer-col a{color:#cfd0d2;text-decoration:none;font-size:14px;transition:color .15s}
.mfs-footer-col a:hover{color:#fff}
.mfs-footer-logo{max-width:190px;height:auto;filter:brightness(0) invert(1);margin-bottom:16px}
.mfs-footer-name{display:block;font-family:Anton,sans-serif;font-size:24px;color:#fff;letter-spacing:.04em;margin-bottom:14px}
.mfs-footer-blurb{font-size:13.5px;line-height:1.6;color:#9a9b9e;margin:0 0 20px;max-width:340px}
.mfs-newsletter-title{display:block;font-weight:700;color:#fff;font-size:14px;margin-bottom:10px;text-transform:uppercase;letter-spacing:.03em}
.mfs-newsletter-row{display:flex;align-items:stretch;gap:8px;max-width:360px}
.mfs-newsletter-row input{flex:1;padding:11px 13px;border:1px solid #333;background:#1b1c1e;color:#fff;border-radius:3px;font-size:16px} /* >=16px stops iOS zoom-on-focus */
.mfs-newsletter-row input::placeholder{color:#777}
.mfs-newsletter-row button{padding:0 20px;min-height:0;line-height:1;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:3px;background:#d92b2b;color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:13px;cursor:pointer;transition:background .15s}
.mfs-newsletter-row button:hover{background:#fff;color:#111214}
.mfs-newsletter-row button[disabled]{opacity:.55;cursor:not-allowed}
.mfs-newsletter-msg{font-size:13px;color:#7ad17a;margin-top:8px}
.mfs-footer-social{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.mfs-footer-social a{font-size:12px;text-transform:uppercase;letter-spacing:.04em;padding:6px 12px;border:1px solid #333;border-radius:3px}
.mfs-footer-social a:hover{border-color:#fff;background:#fff;color:#111214}
.mfs-footer-bottom{border-top:1px solid #2a2b2d;max-width:1240px;margin:0 auto;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.mfs-footer-copy{font-size:12.5px;color:#7c7d80}
.mfs-footer-legal{list-style:none;display:flex;flex-wrap:wrap;gap:18px;margin:0;padding:0}
.mfs-footer-legal a{font-size:12.5px;color:#9a9b9e;text-decoration:none}
.mfs-footer-legal a:hover{color:#fff}
@media(max-width:900px){.mfs-footer-inner{grid-template-columns:1fr 1fr;gap:30px}.mfs-footer-brand{grid-column:1/-1}}
@media(max-width:560px){.mfs-footer-inner{grid-template-columns:1fr}.mfs-footer-bottom{flex-direction:column;align-items:flex-start}}

/* ============ custom category / brand archive hero (matches live two-column) ============ */
.archive .hero-section, .tax-product_cat .hero-section, .tax-brand .hero-section { display:none !important; }

/* EXCEPTION: blog topic archives (/topics/…) keep Blocksy's hero H1 — the .archive rule
   above is meant for WooCommerce cat/brand archives, which render .mfs-cat-hero instead.
   Styled to match .mfs-cat-title + the blog-listing H1 (red slash accent). */
.category .hero-section { display:block !important; }
.category .hero-section .page-title { font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase; letter-spacing:.01em; font-size:40px; line-height:1.05; color:#111214; margin:0 0 6px; }
.category .hero-section .page-title .ct-title-label { display:none; }
.category .hero-section .page-title::after { content:""; display:block; width:52px; height:5px; background:#d92b2b; transform:skewX(-18deg); margin-top:12px; }
@media(max-width:900px){ .category .hero-section .page-title { font-size:30px; } }

.mfs-cat-hero { display:grid !important; grid-template-columns: 1fr 40%; gap:44px; align-items:start; margin:34px auto 6px; }
@media(max-width:900px){ .mfs-cat-hero { grid-template-columns:1fr; gap:22px; } .mfs-cat-hero-img{order:-1;} }
.mfs-cat-title { font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase; letter-spacing:.01em; font-size:40px; line-height:1.05; color:#111214; margin:0 0 16px; }
@media(max-width:900px){ .mfs-cat-title{font-size:30px;} }
.mfs-cat-desc { color:#444; line-height:1.65; font-size:15px; }
.mfs-cat-desc h1, .mfs-cat-desc h2, .mfs-cat-desc h3 { font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase; color:#111214; font-size:20px; line-height:1.15; margin:18px 0 10px; }
.mfs-cat-desc p { margin:0 0 12px; }
.mfs-cat-desc ul, .mfs-cat-desc ol { margin:0 0 12px 18px; }
.mfs-cat-desc img { display:none !important; }            /* descriptions are text-only; guard against stray imgs */
.mfs-cat-desc .lower { display:none; }
.mfs-cat-desc.mfs-expanded .lower { display:block; }
.mfs-cat-readmore { background:none; border:0; color:#d92b2b; font-weight:700; cursor:pointer; padding:6px 0 0; font-size:14px; text-decoration:underline; }
.mfs-cat-hero-img img { width:100%; height:auto; max-height:430px; object-fit:cover; border-radius:4px; display:block; }
.mfs-cat-related { display:flex; flex-wrap:wrap; gap:10px; margin:22px 0 0; }
.mfs-cat-related a { display:inline-block; padding:9px 16px; border:1px solid #d0d2d6; border-radius:3px; font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; text-decoration:none; color:#111214; transition:background .15s,color .15s,border-color .15s; }
.mfs-cat-related a:hover { background:#111214; color:#fff; border-color:#111214; }

/* ============ mega menu (matches live ElementsKit layout) ============ */
/* top item static so the panel anchors to the full-width header row */
.header-menu-1 .menu > li.mfs-mega { position:static !important; }

/* the mega panel = level-2 sub-menu: centered, container-width, below header */
.header-menu-1 li.mfs-mega > .sub-menu {
  position:absolute !important; top:100% !important; left:50% !important; right:auto !important;
  transform:translateX(-50%) !important;
  width:min(1257px,96vw) !important; max-width:96vw !important;
  display:flex !important; gap:0 !important; align-items:stretch !important;
  padding:26px 30px 30px !important;
  background:#fff !important; border:1px solid #e4e4e4 !important;
  box-shadow:0 14px 32px rgba(0,0,0,.10) !important; border-radius:6px !important;
}
/* titled columns — Option B: divider between columns */
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-col { position:static !important; flex:1 1 0 !important; min-width:0 !important; display:block !important; padding:2px 26px !important; }
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-col:first-child { padding-left:0 !important; }
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-col:last-child { padding-right:0 !important; }
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-col + li.mfs-mega-col { border-left:1px solid #eee !important; }
/* hide Blocksy dropdown-arrow toggles inside the mega panel */
.header-menu-1 li.mfs-mega .sub-menu button[class*="toggle-dropdown"],
.header-menu-1 li.mfs-mega .sub-menu .ct-toggle-dropdown-desktop { display:none !important; }
.header-menu-1 li.mfs-mega-col > a {
  font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase;
  letter-spacing:.03em; font-size:15px; color:#111214 !important; pointer-events:none;
  display:inline-block !important; width:auto !important; padding:0 0 6px !important; margin:0 0 14px !important; border-bottom:3px solid #e3262f !important;
}
/* level-3 link list: always visible & static inside the open panel */
.header-menu-1 li.mfs-mega-col > .sub-menu {
  position:static !important; display:block !important; opacity:1 !important; visibility:visible !important;
  transform:none !important; box-shadow:none !important; border:0 !important; padding:0 !important;
  margin:0 !important; background:transparent !important; width:auto !important; min-width:0 !important;
  columns:185px auto; column-gap:32px;   /* single narrow column = 1; a lone wide column spreads its links */
}
.header-menu-1 li.mfs-mega-col > .sub-menu > li { display:block !important; }
.header-menu-1 li.mfs-mega-col .sub-menu a,
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-loose > a {
  font-family:Archivo,sans-serif !important; font-size:13.5px; font-weight:400; color:#555 !important;
  text-transform:none !important; letter-spacing:0 !important; line-height:1.35;
  padding:5px 0 !important; display:block;
}
.header-menu-1 li.mfs-mega-col .sub-menu a:hover,
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-loose > a:hover { color:#d92b2b !important; }
/* loose items (no heading) -> 5 columns, flowing DOWN each column then across (alphabetical per column) */
.header-menu-1 li.mfs-mega > .sub-menu:has(> li.mfs-mega-loose) { display:block !important; columns:5 !important; column-gap:34px !important; }
.header-menu-1 li.mfs-mega > .sub-menu > li.mfs-mega-loose { position:static !important; display:block !important; width:auto !important; break-inside:avoid !important; padding:1px 0 !important; }

/* ============ inline header search — custom mfs-search engine relocated into header ============ */
.mfs-search-wrap.mfs-in-header { position:relative !important; width:clamp(135px,11vw,180px); margin:0 4px; left:auto !important; top:auto !important; overflow:visible !important; }

/* header account + cart icons (top-right, matches live) */
.mfs-header-icons { display:flex; align-items:center; gap:18px; margin:0 2px 0 16px; }
.mfs-hicon { position:relative; display:flex; align-items:center; color:#111214; }
.mfs-hicon svg { width:23px; height:23px; }
.mfs-hicon:hover { color:#d92b2b; }
/* Mobile menu hamburger: Blocksy's default icon rendered small & low-contrast ("barely visible").
   Make the 3 bars solid dark, bigger and a touch thicker so the menu affordance is obvious. */
header.ct-header .ct-header-trigger .ct-icon { width:28px !important; height:22px !important; color:#111214 !important; }
header.ct-header .ct-header-trigger .ct-icon rect { fill:currentColor !important; height:2.4px !important; }
.mfs-cart-count { position:absolute; top:-7px; right:-9px; min-width:17px; height:17px; padding:0 4px; box-sizing:border-box; background:#d92b2b; color:#fff; border-radius:9px; font-size:11px; font-weight:700; line-height:17px; text-align:center; font-family:Archivo,sans-serif; }
.mfs-cart-count[data-count="0"] { display:none; }
.mfs-search-wrap.mfs-in-header .mfs-search-input-wrap { position:relative; }
.mfs-search-wrap.mfs-in-header .mfs-search-input {
  width:100% !important; height:42px !important; box-sizing:border-box !important; border:1px solid #e0e0e2 !important;
  background:#f3f3f4 !important; border-radius:4px !important; padding:0 44px 0 16px !important;
  font-family:Archivo,sans-serif !important; font-size:14px !important; color:#111214 !important; outline:none !important;
}
.mfs-search-wrap.mfs-in-header .mfs-search-input::placeholder { color:#8a8a8d !important; }
.mfs-search-wrap.mfs-in-header .mfs-search-input:focus { background:#fff !important; border-color:#111214 !important; }
.mfs-search-wrap.mfs-in-header .mfs-search-btn {
  position:absolute !important; right:3px !important; top:50% !important; transform:translateY(-50%) !important;
  width:38px !important; height:36px !important; border:0 !important; background:none !important; cursor:pointer;
  display:flex !important; align-items:center; justify-content:center; color:#111214 !important; padding:0 !important;
}
.mfs-search-wrap.mfs-in-header .mfs-search-btn:hover { color:#d92b2b !important; }
.mfs-search-wrap.mfs-in-header .mfs-search-dropdown { z-index:60; }

/* ============ homepage Rashtag promo banner — match live (clean image, no dim, no duplicate heading) ============ */
.wp-block-cover:has(img[src*="rashtag-browse-full-range"]) .wp-block-cover__background { opacity:0 !important; }
.wp-block-cover:has(img[src*="rashtag-browse-full-range"]) :is(h1,h2,h3,h4) { opacity:0 !important; } /* image already carries the text; keep element so the banner stays clickable */

/* ============ modern header: smaller left logo, larger cleaner nav ============ */
header .site-logo-container img.default-logo,
header img.default-logo { max-width:144px !important; width:auto !important; height:auto !important; }
.header-menu-1 .menu > li > a {
  font-family:Archivo,sans-serif !important; font-size:16px !important; font-weight:600 !important;
  letter-spacing:.01em !important; padding-left:8px !important; padding-right:8px !important;
}
/* tighten header into one clean compact row (everything vertically centered) */
header.ct-header [data-row], header.ct-header [data-column] { min-height:74px !important; }
/* vertically center the logo so its top/bottom align with nav, search & icons */
header .site-branding, header .site-logo-container { display:flex !important; align-items:center !important; height:100% !important; }
header .site-branding img.default-logo, header .site-logo-container img.default-logo { margin-top:0 !important; margin-bottom:0 !important; }

/* full-width header: span the viewport, push logo hard-left & icons hard-right */
header.ct-header .ct-container { max-width:100% !important; padding-left:38px !important; padding-right:38px !important; }
/* bigger nav text */
.header-menu-1 .menu > li > a { font-size:18px !important; }

/* FORCE full-width header container + free nav space so 18px nav fits edge-to-edge */
header.ct-header .ct-container { max-width:100% !important; width:100% !important; padding-left:34px !important; padding-right:34px !important; }
.header-menu-1 .menu > li > a { padding-left:6px !important; padding-right:6px !important; }
.mfs-search-wrap.mfs-in-header { width:clamp(120px,9vw,150px) !important; }

/* unify header element heights — logo & search box exact same height + aligned, bigger icons */
header img.default-logo { height:40px !important; max-width:none !important; width:auto !important; }
.mfs-search-wrap.mfs-in-header .mfs-search-input { height:40px !important; }
.mfs-hicon svg { width:27px !important; height:27px !important; }
.header-menu-1 .menu > li > a { font-size:19px !important; }

/* logo: force exact 40px height to match the search box (beats the earlier max-width rule) */
header .site-logo-container img.default-logo { height:40px !important; width:auto !important; max-width:none !important; }

/* ===== Option A header tidy: logo left · centered refined nav · search+icons right ===== */
header.ct-header .header-menu-1 { flex:1 1 auto !important; }
.header-menu-1 .menu { justify-content:center !important; }
.header-menu-1 .menu > li > a { font-size:14px !important; font-weight:600 !important; padding-left:13px !important; padding-right:13px !important; }
.mfs-search-wrap.mfs-in-header { width:clamp(150px,12vw,195px) !important; flex:0 0 auto !important; }
.mfs-header-icons { flex:0 0 auto !important; }
.mfs-hicon svg { width:23px !important; height:23px !important; }

/* remove dropdown chevron arrows from top nav items (hover still opens the menu) */
.header-menu-1 .menu > li > a .ct-toggle-dropdown-desktop,
.header-menu-1 .menu > li > .ct-toggle-dropdown-desktop-ghost { display:none !important; }

/* nav: uniform, slightly airier spacing between items (kept adjacent so hover doesn't flicker) */
.header-menu-1 .menu > li > a { padding-left:15px !important; padding-right:15px !important; }

/* tighten header vertical space — minimal padding above/below for a clean modern bar */
header.ct-header [data-row], header.ct-header [data-column] { min-height:56px !important; }

/* homepage: hero flush under the header (remove Blocksy's 60px content top-padding gap) */
body.home #main-container .ct-container-full,
body.home .ct-container-full:first-child { padding-top:0 !important; }
body.home .wp-block-cover.alignfull:first-child { margin-top:-64px !important; }

/* tighten header further */
header.ct-header [data-row], header.ct-header [data-column] { min-height:50px !important; }

/* the actual height driver: Blocksy's min-height:120px on the header .ct-container */
header.ct-header .ct-container { min-height:50px !important; }

/* header: a little more breathing room (50px was too squashed) */
header.ct-header .ct-container, header.ct-header [data-row], header.ct-header [data-column] { min-height:64px !important; }

/* taller hero */
.wp-block-cover.alignfull:first-child { min-height:clamp(560px,72vh,740px) !important; }
/* hero CTA buttons: identical — both red filled, equal width/height */
.wp-block-cover.alignfull .wp-block-button__link {
  background:#e3262f !important; color:#fff !important; border:0 !important;
  padding:16px 30px !important; min-width:230px !important; text-align:center !important;
  border-radius:3px !important;
}
.wp-block-cover.alignfull .wp-block-button__link:hover { background:#111214 !important; }

/* sticky header (matches live) — main header pins to top; announcement (on hero) scrolls away */
header.ct-header { position:sticky !important; top:0 !important; z-index:100 !important; }
body.admin-bar header.ct-header { top:32px !important; }
@media screen and (max-width:782px){ body.admin-bar header.ct-header { top:46px !important; } }

/* hero subtext: slightly thicker + easy to read over the image */
.wp-block-cover.alignfull p {
  font-family:Archivo,sans-serif !important; font-weight:500 !important; font-size:17px !important;
  line-height:1.6 !important; color:#f3f3f4 !important; text-shadow:0 1px 8px rgba(0,0,0,.45); max-width:560px;
}
/* hero CTA buttons: match LIVE — small two-tone (white MEN / dark WOMEN), not big red */
.wp-block-cover.alignfull .wp-block-button__link {
  font-family:Archivo,sans-serif !important; font-size:14px !important; font-weight:500 !important;
  letter-spacing:.01em !important; text-transform:none !important; padding:12px 26px !important;
  border-radius:3px !important; min-width:0 !important; border:0 !important;
}
.wp-block-cover.alignfull .wp-block-button:not(.is-style-outline) .wp-block-button__link { background:#fff !important; color:#111214 !important; }
.wp-block-cover.alignfull .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background:#e3262f !important; color:#fff !important; }
.wp-block-cover.alignfull .wp-block-button.is-style-outline .wp-block-button__link { background:#1f1f1f !important; color:#fff !important; }
.wp-block-cover.alignfull .wp-block-button.is-style-outline .wp-block-button__link:hover { background:#e3262f !important; color:#fff !important; }

/* hero fills the screen on landing — viewport height minus the sticky header (no bottom gap) */
.wp-block-cover.alignfull:first-child { min-height: calc(100vh - 64px) !important; }
body.admin-bar .wp-block-cover.alignfull:first-child { min-height: calc(100vh - 96px) !important; }
@supports (min-height: 100dvh) {
  .wp-block-cover.alignfull:first-child { min-height: calc(100dvh - 64px) !important; }
  body.admin-bar .wp-block-cover.alignfull:first-child { min-height: calc(100dvh - 96px) !important; }
}

/* homepage section headings: smaller (match live ~24-28px, was 52px Anton) */
.home h2.wp-block-heading { font-size:clamp(23px,2.6vw,30px) !important; }
.home h2.wp-block-heading::before { width:5px; }
/* New Arrivals: 5 products per row (was 4 fixed columns) */
body.home .woocommerce ul.products.columns-4 { grid-template-columns:repeat(5,1fr) !important; gap:20px !important; }
body.home .woocommerce ul.products.columns-4 li.product { width:auto !important; margin:0 !important; float:none !important; }

/* New Arrivals card cleanup + colour swatches */
body.home .woocommerce ul.products li.product .entry-meta { display:none !important; } /* hide category list clutter */
.woocommerce ul.products li.product .mfs-pc-badge { top:10px !important; left:10px !important; right:auto !important; bottom:auto !important; }
/* "Customize" badge base style — restated from the mfs-product-customizer plugin so it also
   styles standalone [products] pages (e.g. /new-arrivals/), where the plugin gates its own
   inline CSS to product/shop/archive contexts only. Verbatim match to the plugin so the badge
   looks identical on the New Arrivals page as on shop/category; final position is the top-left
   override above. */
.mfs-pc-badge { position:absolute; bottom:15px; left:-16px; background:#000; color:#fff; font-size:12px; font-weight:600; letter-spacing:.3px; padding:6px 14px; border-radius:0 4px 4px 0; text-transform:none; z-index:3; line-height:1.2; margin:0; display:block; }
.mfs-pc-badge::before { content:''; position:absolute; left:0; bottom:-6px; width:0; height:0; border-top:6px solid #222; border-left:6px solid transparent; }
@media(max-width:600px){ .woocommerce ul.products li.product .mfs-pc-badge { font-size:11px !important; padding:5px 12px !important; } }
.mfs-loop-swatches { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:9px 0 2px; }
/* 28px (was 22px) for a comfortable mobile tap target — 70% of traffic is mobile. */
.mfs-loop-swatch { width:28px; height:28px; border-radius:50%; border:1px solid rgba(0,0,0,.2); box-sizing:border-box; display:inline-block; }
.mfs-loop-swatch-more { font-size:11px; color:#777; font-family:Archivo,sans-serif; }

/* New Arrivals: no Select Options button + exactly 5 (one row) */
body.home .woocommerce ul.products li.product .ct-woo-card-actions { display:none !important; }
body.home .woocommerce ul.products.columns-4 li.product:nth-child(n+6) { display:none !important; }

/* homepage section headings — all left-aligned + smaller (Gymshark-style) */
.home h2.wp-block-heading { font-size:clamp(20px,2.1vw,25px) !important; text-align:left !important; padding-left:16px !important; }
.home h2.wp-block-heading::before { display:block !important; width:5px !important; }

/* New Arrivals: true full-width row + heading (34px gutters, matching the header) + consistent card alignment */
body.home .entry-content h2.wp-block-heading { max-width:none !important; width:auto !important; padding-left:34px !important; }
body.home .entry-content .woocommerce.columns-4 { max-width:none !important; width:100% !important; }
body.home ul.products.columns-4 { padding:0 34px !important; box-sizing:border-box !important; }
body.home .woocommerce ul.products li.product .woocommerce-loop-product__title { min-height:2.7em !important; line-height:1.35 !important; margin:0 0 7px !important; display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } /* min == exactly the 2 clamped lines; 3em let a sliver of line 3 paint */
body.home .woocommerce ul.products li.product .mfs-loop-swatches { min-height:28px !important; margin:0 0 9px !important; }
.mfs-loop-swatch { text-decoration:none !important; transition:transform .12s ease, box-shadow .12s ease; cursor:pointer; }
.mfs-loop-swatch:hover { transform:scale(1.18); }
.mfs-loop-swatch.is-active { box-shadow:0 0 0 2px #fff, 0 0 0 4px #111; transform:scale(1.1); }
/* whole card reads as clickable (single click opens product) */
body.home .woocommerce ul.products li.product { cursor:pointer; }

/* New Arrivals cards — IDENTICAL treatment to the rest of the site. These mirror the canonical
   body.mfs-cards rules in inc/loop-swatches.php (bordered white tile, flat media container, image
   contain 4:5, bottom-pinned price + colour count). KEEP IN SYNC with that file. The only homepage
   difference is the deliberate 5-up single row on desktop (grid rule above). */
body.home .woocommerce ul.products li.product { cursor:pointer; background:#fff !important; border:1px solid #e6e6ea !important; border-radius:12px !important; padding:14px 14px 16px !important; box-shadow:0 1px 2px rgba(0,0,0,.04) !important; transition:transform .3s cubic-bezier(.2,.6,.2,1),box-shadow .3s ease,border-color .3s ease !important; display:flex !important; flex-direction:column !important; }
body.home .woocommerce ul.products li.product:hover { transform:translateY(-6px); border-color:#d4d4da !important; box-shadow:0 16px 34px -12px rgba(0,0,0,.2) !important; }
body.home .woocommerce ul.products li.product .ct-media-container { background:#fff; border-radius:8px; box-shadow:none; overflow:hidden; }
body.home .woocommerce ul.products li.product img.wp-post-image { object-fit:contain !important; aspect-ratio:4/5 !important; width:100% !important; transition:transform .55s cubic-bezier(.2,.6,.2,1) !important; }
body.home .woocommerce ul.products li.product:hover img.wp-post-image { transform:scale(1.05); }
/* keep the title brand-navy (match archive cards) */
body.home .woocommerce ul.products li.product .woocommerce-loop-product__title,
body.home .woocommerce ul.products li.product .woocommerce-loop-product__title a { color:#192a3d !important; }
/* pin "Available in N colours" + price to the bottom so cards align (same as archives) */
body.home .woocommerce ul.products li.product .mfs-colour-count { order:9 !important; margin-top:auto !important; }
body.home .woocommerce ul.products li.product .price { order:10 !important; margin-bottom:0 !important; }
/* match the rest of the site's responsive columns (desktop stays 5-up single row) */
@media(max-width:1024px){ body.home .woocommerce ul.products.columns-4 { grid-template-columns:repeat(3,1fr) !important; gap:14px !important; } }
@media(max-width:600px){ body.home .woocommerce ul.products.columns-4 { grid-template-columns:1fr !important; gap:14px !important; } }

/* === EXPERIMENT: homepage header overlaid on hero (transparent at top → solid on scroll) === */
body.home .wp-block-cover.alignfull:first-child { margin-top:-64px !important; min-height:100vh !important; }
body.home.admin-bar .wp-block-cover.alignfull:first-child { min-height:calc(100vh - 32px) !important; }
body.home header.ct-header, body.home header.ct-header [data-row] { background:transparent !important; box-shadow:none !important; transition:background .25s ease; }
/* transparent state: invert logo + white nav/search/icons so they show on the dark hero */
body.home.mfs-hdr-over header .site-logo-container img.default-logo { filter:brightness(0) invert(1) !important; }
body.home.mfs-hdr-over .header-menu-1 .menu > li > a { color:#fff !important; }
body.home.mfs-hdr-over .mfs-hicon { color:#fff !important; }
body.home.mfs-hdr-over header.ct-header .ct-header-trigger .ct-icon { color:#fff !important; }
body.home.mfs-hdr-over .mfs-search-wrap.mfs-in-header .mfs-search-input { background:rgba(255,255,255,.14) !important; border-color:rgba(255,255,255,.45) !important; color:#fff !important; }
body.home.mfs-hdr-over .mfs-search-wrap.mfs-in-header .mfs-search-input::placeholder { color:rgba(255,255,255,.85) !important; }
body.home.mfs-hdr-over .mfs-search-wrap.mfs-in-header .mfs-search-btn { color:#fff !important; }
/* solid (scrolled) state: white header, default dark content */
body.home.mfs-hdr-scrolled header.ct-header, body.home.mfs-hdr-scrolled header.ct-header [data-row] { background:#fff !important; }
body.home.mfs-hdr-scrolled header.ct-header { box-shadow:0 2px 14px rgba(0,0,0,.09) !important; }
/* announcement bar drops just below the overlaid header */
body.home .mfs-announce--on-hero { top:64px !important; }

/* === Rashtag "Exclusive to Minotaur" bento collage === */
.mfs-rt-collage {
	display:grid;
	grid-template-columns:1.6fr 1fr 1fr;
	grid-auto-rows:1fr;
	gap:14px;
	margin:22px 0 0;
	/* full-width with 34px gutters (match New Arrivals + header) */
	width:calc(100vw - 68px); max-width:calc(100vw - 68px);
	margin-left:calc(50% - 50vw + 34px); margin-right:calc(50% - 50vw + 34px);
}
.mfs-rt-tile { position:relative; display:block; overflow:hidden; border-radius:12px; min-height:235px; background:#111; text-decoration:none; }
.mfs-rt-feature { grid-column:1 / 2; grid-row:1 / 3; }
.mfs-rt-tile img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.mfs-rt-tile:hover img { transform:scale(1.06); }
.mfs-rt-ov { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; padding:20px 22px;
	background:linear-gradient(to top, rgba(0,0,0,.74) 0%, rgba(0,0,0,.18) 46%, rgba(0,0,0,0) 76%); color:#fff; }
.mfs-rt-ov h4 { font-family:Anton,sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:.03em; font-size:23px; line-height:1.02; margin:0; color:#fff; }
.mfs-rt-feature .mfs-rt-ov h3 { font-family:Anton,sans-serif; font-weight:400; text-transform:uppercase; font-size:clamp(30px,3.4vw,44px); line-height:.98; margin:5px 0 8px; color:#fff; }
.mfs-rt-eyebrow { font-family:Archivo,sans-serif; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:#e3262f; font-weight:700; }
.mfs-rt-cta { font-family:Archivo,sans-serif; font-size:13px; font-weight:600; letter-spacing:.03em; margin-top:7px; opacity:0; transform:translateY(6px); transition:opacity .3s ease, transform .3s ease; }
.mfs-rt-tile:hover .mfs-rt-cta { opacity:1; transform:none; }
.mfs-rt-feature .mfs-rt-cta { opacity:1; transform:none; font-size:15px; }
@media(max-width:900px){
	.mfs-rt-collage { grid-template-columns:1fr 1fr; }
	.mfs-rt-feature { grid-column:1 / -1; grid-row:auto; min-height:300px; }
	.mfs-rt-tile { min-height:200px; }
}
@media(max-width:520px){
	.mfs-rt-collage { width:calc(100vw - 32px); margin-left:calc(50% - 50vw + 16px); margin-right:calc(50% - 50vw + 16px); gap:10px; }
	.mfs-rt-tile { min-height:170px; }
	/* stop "STREETWEAR" breaking mid-word on the narrow 2-col tiles */
	.mfs-rt-ov h4 { font-size:18px; overflow-wrap:normal; word-break:keep-all; hyphens:none; }
}

/* "MORE THAN JUST AN ONLINE STORE" cover: slightly lighter overlay + centered heading */
.home .wp-block-cover__background.has-background-dim-55 { opacity:.4 !important; }
.home .wp-block-cover h2.wp-block-heading { text-align:center !important; padding-left:0 !important; }
.home .wp-block-cover h2.wp-block-heading::before { display:none !important; }

/* === Shop-by-category tiles: Men's / Women's / Kids === */
.mfs-cat-tiles {
	display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:22px 0 0;
	width:calc(100vw - 68px); max-width:calc(100vw - 68px);
	margin-left:calc(50% - 50vw + 34px); margin-right:calc(50% - 50vw + 34px);
}
.mfs-cat-tile { position:relative; display:block; overflow:hidden; border-radius:12px; aspect-ratio:4/5; background:#111; text-decoration:none; }
.mfs-cat-tile img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.mfs-cat-tile:hover img { transform:scale(1.06); }
.mfs-cat-ov { position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center;
	background:linear-gradient(to top, rgba(0,0,0,.38) 0%, rgba(0,0,0,.1) 45%, rgba(0,0,0,.32) 100%); transition:background .3s ease; }
.mfs-cat-tile:hover .mfs-cat-ov { background:linear-gradient(to top, rgba(0,0,0,.5) 0%, rgba(0,0,0,.2) 45%, rgba(0,0,0,.45) 100%); }
.mfs-cat-label { font-family:Anton,sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:.02em;
	font-size:clamp(28px,3.4vw,46px); color:#fff; text-shadow:0 2px 20px rgba(0,0,0,.55); }
@media(max-width:680px){
	/* Better mobile display: SPLIT CARD — photo on top, a dark info panel underneath holding the
	   gender name + its sub-categories as chips (no more text crammed over the image). Desktop
	   keeps its hover-reveal overlay; this only restyles the small-screen layout. */
	.mfs-cat-tiles { grid-template-columns:1fr; gap:14px; }
	.mfs-cat-tiles .mfs-cat-tile,
	.mfs-cat-tiles .mfs-cat-tile:last-child {
		grid-column:auto; aspect-ratio:auto; min-height:0; display:flex; flex-direction:column;
		background:#15151b; border:1px solid #24242c;
	}
	.mfs-cat-tile img { position:relative; inset:auto; width:100%; height:148px; object-fit:cover; }
	.mfs-cat-ov { position:relative; inset:auto; flex-direction:column; align-items:flex-start !important;
		justify-content:flex-start; background:none !important; padding:15px 16px 17px; }
	.mfs-cat-label { font-size:21px !important; margin:0 0 12px !important; transform:none !important; }
	/* chips row. position:relative + z-index keeps them above the label's full-tile ::after link
	   so each sub-category stays tappable. */
	.mfs-cat-links { position:relative; z-index:3; display:flex !important; flex-direction:row !important; flex-wrap:wrap !important; gap:8px !important;
		margin:0 !important; align-items:flex-start !important; justify-content:flex-start !important;
		opacity:1 !important; transform:none !important; pointer-events:auto !important; }
	.mfs-cat-links a {
		font-size:12.5px !important; line-height:1; color:#e8e8ea !important; white-space:nowrap;
		background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.17); border-radius:8px; padding:8px 12px;
	}
	.mfs-cat-links a:hover { background:var(--mfs-red); border-color:var(--mfs-red); color:#fff !important; }
}

/* category tiles: hover reveals sub-category links */
.mfs-cat-ov { flex-direction:column; }
.mfs-cat-label { display:inline-block; text-decoration:none; transition:transform .35s ease; }
.mfs-cat-label::after { content:""; position:absolute; inset:0; z-index:1; }        /* whole tile -> main category */
.mfs-cat-tile:hover .mfs-cat-label { transform:translateY(-6px); }
.mfs-cat-links { position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap:9px; margin-top:16px;
	opacity:0; transform:translateY(12px); transition:opacity .35s ease, transform .35s ease; pointer-events:none; }
.mfs-cat-tile:hover .mfs-cat-links { opacity:1; transform:none; pointer-events:auto; }
.mfs-cat-links a { color:#fff; font-family:Archivo,sans-serif; font-weight:600; font-size:clamp(14px,1.05vw,17px); letter-spacing:.01em;
	text-decoration:none; text-shadow:0 1px 10px rgba(0,0,0,.75); transition:color .15s ease; }
.mfs-cat-links a:hover { color:#e3262f; }
.mfs-cat-tile:hover .mfs-cat-ov { background:linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,.42) 50%, rgba(0,0,0,.5) 100%); }

/* keep category label white in all states (it's a link, was going blue on hover) */
.mfs-cat-label, .mfs-cat-label:link, .mfs-cat-label:visited, .mfs-cat-label:hover, .mfs-cat-label:focus { color:#fff !important; }

/* === Custom Fightwear: vertical process collage (Printed -> Cut -> Stitched -> Finished) === */
.mfs-cf-process { display:flex; flex-direction:column; gap:12px; margin:22px 0 0;
	width:calc(100vw - 68px); max-width:calc(100vw - 68px);
	margin-left:calc(50% - 50vw + 34px); margin-right:calc(50% - 50vw + 34px); }
.mfs-cf-step { position:relative; min-height:210px; border-radius:12px; overflow:hidden; display:flex; }
.mfs-cf-step img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.mfs-cf-step:hover img { transform:scale(1.04); }
.mfs-cf-ov { position:relative; z-index:2; display:flex; align-items:center; gap:24px; padding:0 40px; width:100%;
	background:linear-gradient(90deg, rgba(0,0,0,.8) 0%, rgba(0,0,0,.52) 45%, rgba(0,0,0,.12) 100%); }
.mfs-cf-num { font-family:Anton,sans-serif; font-size:clamp(40px,5vw,70px); line-height:1; color:var(--mfs-red); flex:none; }
.mfs-cf-txt h3 { font-family:Anton,sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(22px,2.4vw,32px); color:#fff; margin:0 0 4px; }
.mfs-cf-txt p { font-family:Archivo,sans-serif; font-size:15px; line-height:1.45; color:#dcdcdc; margin:0; max-width:520px; }
@media(max-width:600px){
	.mfs-cf-step { min-height:165px; }
	.mfs-cf-ov { padding:0 20px; gap:14px; background:linear-gradient(90deg, rgba(0,0,0,.84), rgba(0,0,0,.42)); }
	.mfs-cf-txt p { font-size:13px; }
}

/* === Custom Fightwear: horizontal 2-up buy tiles (Personalised / Custom rashguards) === */
.mfs-cf-options { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:22px 0 0;
	width:calc(100vw - 68px); max-width:calc(100vw - 68px);
	margin-left:calc(50% - 50vw + 34px); margin-right:calc(50% - 50vw + 34px); }
.mfs-cf-opt { position:relative; display:block; overflow:hidden; border-radius:14px; aspect-ratio:16/10; background:#111; text-decoration:none; }
.mfs-cf-opt img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.6,.2,1); }
.mfs-cf-opt:hover img { transform:scale(1.05); }
.mfs-cf-opt-ov { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; padding:34px 36px;
	background:linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.35) 48%, rgba(0,0,0,0) 82%); }
.mfs-cf-h { display:block; font-family:Anton,sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:.02em; font-size:clamp(26px,2.8vw,40px); line-height:1; color:#fff; margin:0 0 7px; }
.mfs-cf-p { display:block; font-family:Archivo,sans-serif; font-size:15px; line-height:1.45; color:#e4e4e4; margin:0 0 16px; max-width:380px; }
.mfs-cf-btn { display:inline-block; background:var(--mfs-red); color:#fff; font-family:Anton,sans-serif; font-weight:400; letter-spacing:.04em; text-transform:uppercase; font-size:15px; padding:11px 22px; border-radius:4px; transition:background .2s ease,color .2s ease; }
.mfs-cf-opt:hover .mfs-cf-btn { background:#fff; color:#111; }
@media(max-width:700px){
	.mfs-cf-options { grid-template-columns:1fr; }
	/* 16/9 was only 181px tall — too short for heading+text+button, so the heading clipped off
	   the top. Let the tile grow to fit, with a sensible minimum; tighten padding for mobile. */
	.mfs-cf-opt { aspect-ratio:auto; min-height:235px; }
	.mfs-cf-opt-ov { padding:24px 24px; }
	.mfs-cf-p { font-size:13px; }
	/* equal-width CTAs (were 184px vs 148px) */
	.mfs-cf-btn { min-width:190px; text-align:center; }
}

/* === Customer Feedback: testimonial carousel === */
.mfs-fb-track { display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:22px 2px 16px; -webkit-overflow-scrolling:touch;
	width:calc(100vw - 68px); max-width:calc(100vw - 68px); margin-left:calc(50% - 50vw + 34px); margin-right:calc(50% - 50vw + 34px); }
.mfs-fb-card { scroll-snap-align:start; flex:0 0 clamp(280px,31%,380px); background:#fff; border:1px solid #ececec; border-radius:14px; padding:26px; box-shadow:0 2px 12px rgba(0,0,0,.06); display:flex; flex-direction:column; }
.mfs-fb-stars { color:#f5a623; font-size:17px; letter-spacing:3px; margin-bottom:12px; }
.mfs-fb-card h4 { font-family:Anton,sans-serif; font-weight:400; text-transform:uppercase; letter-spacing:.02em; font-size:19px; color:#111; margin:0 0 10px; line-height:1.12; }
.mfs-fb-card p { font-family:Archivo,sans-serif; font-size:15px; line-height:1.55; color:#454545; margin:0 0 16px; flex:1; }
.mfs-fb-author { font-family:Archivo,sans-serif; font-weight:700; font-size:14px; color:#111; }
.mfs-fb-track::-webkit-scrollbar { height:7px; }
.mfs-fb-track::-webkit-scrollbar-thumb { background:#cfcfcf; border-radius:4px; }

/* Customer Feedback: video testimonial thumbnails (YouTube facade) */
.mfs-fb-video { position:relative; display:block; width:100%; aspect-ratio:16/9; border:0; padding:0; margin:0 0 14px; border-radius:10px; overflow:hidden; cursor:pointer; background:#000; }
.mfs-fb-video img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.mfs-fb-video:hover img { transform:scale(1.05); }
.mfs-fb-play { position:absolute; inset:0; margin:auto; width:58px; height:58px; border-radius:50%; background:rgba(227,38,47,.92); display:flex; align-items:center; justify-content:center; transition:transform .2s ease, background .2s ease; }
.mfs-fb-play::after { content:""; border-style:solid; border-width:10px 0 10px 17px; border-color:transparent transparent transparent #fff; margin-left:4px; }
.mfs-fb-video:hover .mfs-fb-play { transform:scale(1.08); background:#e3262f; }
.mfs-fb-card iframe { width:100%; aspect-ratio:16/9; border:0; border-radius:10px; margin:0 0 14px; display:block; }

/* Customer Feedback carousel — arrow nav + hidden scrollbar (replaces the raw scrollbar) */
.mfs-fb-carousel { position:relative; margin:22px 0 0; width:calc(100vw - 68px); max-width:calc(100vw - 68px); margin-left:calc(50% - 50vw + 34px); margin-right:calc(50% - 50vw + 34px); }
.mfs-fb-carousel .mfs-fb-track { width:auto; max-width:none; margin:0; padding:4px 2px; scrollbar-width:none; }
.mfs-fb-carousel .mfs-fb-track::-webkit-scrollbar { display:none; }
.mfs-fb-arrow { position:absolute; top:38%; transform:translateY(-50%); z-index:6; width:48px; height:48px; border-radius:50%; background:#111; border:0; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(0,0,0,.22); transition:background .2s ease, opacity .2s ease, transform .15s ease; }
.mfs-fb-arrow::before { content:""; width:11px; height:11px; border-top:2.5px solid #fff; border-right:2.5px solid #fff; display:block; }
.mfs-fb-prev { left:4px; } .mfs-fb-prev::before { transform:rotate(-135deg); margin-left:4px; }
.mfs-fb-next { right:4px; } .mfs-fb-next::before { transform:rotate(45deg); margin-right:4px; }
.mfs-fb-arrow:hover { background:#e3262f; }
.mfs-fb-arrow:active { transform:translateY(-50%) scale(.93); }
.mfs-fb-carousel.at-start .mfs-fb-prev { opacity:0; pointer-events:none; }
.mfs-fb-carousel.at-end .mfs-fb-next { opacity:0; pointer-events:none; }
@media(max-width:700px){ .mfs-fb-arrow { display:none; } }

/* === Two-column brand-story / SEO band (More Than Just A Combat Store) === */
.mfs-seo { width:100vw; margin-left:calc(50% - 50vw); margin-right:calc(50% - 50vw); margin-top:56px; background:#f4f3ea; padding:58px 0; }
.mfs-seo-cols { display:grid; grid-template-columns:1fr 1fr; gap:56px; max-width:1240px; margin:0 auto; padding:0 34px; }
.mfs-seo-col .mfs-seo-h { font-family:Archivo,sans-serif !important; font-weight:700; text-transform:uppercase; letter-spacing:.005em; font-size:clamp(21px,1.9vw,27px); line-height:1.15; color:#15161a; margin:0 0 18px; padding:0; }
.mfs-seo-col .mfs-seo-h::before { display:none !important; }
.mfs-seo-sub { font-family:Archivo,sans-serif; font-weight:700; font-size:17px; line-height:1.45; color:#15161a; margin:0 0 18px; }
.mfs-seo-body { font-family:Archivo,sans-serif; font-size:15.5px; line-height:1.78; color:#3c3c3c; margin:0; }
.mfs-seo-body strong { font-weight:700; color:#15161a; }
.mfs-seo-body em { font-style:italic; }
@media(max-width:820px){ .mfs-seo-cols { grid-template-columns:1fr; gap:34px; } .mfs-seo { padding:42px 0; } }

/* SEO band inline links (the bold gear/brand/discipline terms) */
.mfs-seo-body .mfs-seo-link { font-weight:700; color:#15161a; text-decoration:none; transition:color .15s ease; }
.mfs-seo-body .mfs-seo-link:hover { color:#e3262f; text-decoration:underline; }

/* ============================================================================
   UNIFIED CONTENT BUTTONS — single source of truth for every Gutenberg button
   (hero CTAs, promo "Browse the full range / Personalise Yours", "See more …").
   Earlier rules drifted: 14px-weight500 vs 14px-weight600, padding 26 vs 28,
   hero buttons left-aligned at unequal widths. This normalises size/weight/
   alignment everywhere (colours are left to the per-block rules above).
   Appended last so it wins by source order over the equal-specificity !important
   rules earlier in this file. ============================================== */
/* High specificity (body + .is-style-outline) so this beats the injected
   `.wp-block-button.is-style-outline .wp-block-button__link{font-size:14px;padding:12px 28px}`
   rule that was making outline buttons (See more…, Shop for Women) 1px bigger than filled ones. */
body .wp-block-button .wp-block-button__link,
body .wp-block-button.is-style-outline .wp-block-button__link,
body .wp-block-cover .wp-block-button .wp-block-button__link,
body .wp-block-cover.alignfull .wp-block-button.is-style-outline .wp-block-button__link {
  font-family:Archivo,sans-serif !important;
  font-size:13px !important; font-weight:600 !important; letter-spacing:.05em !important;
  text-transform:uppercase !important; line-height:1.1 !important;
  padding:12px 24px !important; min-height:46px !important; border-radius:3px !important;
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
}
/* Hero CTAs (Shop for Men / Women): equal, full-width stacked pair so they line up on mobile */
@media (max-width:781px){
  .wp-block-cover.alignfull .wp-block-buttons{ width:100%; max-width:300px; }
  .wp-block-cover.alignfull .wp-block-button{ width:100%; }
  .wp-block-cover.alignfull .wp-block-button__link{ width:100% !important; }
  /* The 300px cap left-pins the container; when the block asked for centred content
     (e.g. the "WANT TO SEE OUR RETAIL STORE?" band), re-centre the capped container.
     The homepage hero pair has no justification class, so it stays left-aligned. */
  .wp-block-cover.alignfull .wp-block-buttons.is-content-justification-center{ margin-left:auto; margin-right:auto; }
}

/* Policy / long-form text pages (privacy, cookie, returns, T&Cs, terms of use, payment info,
   shipping FAQ, FAQ, our story): the same readable treatment as the category About sections —
   Anton page title, red-bar section headings, comfortable reading measure. */
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content h1{
  font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase;
  font-size:clamp(30px,4vw,44px) !important; line-height:1.05 !important; color:#111214 !important;
  margin-top:0 !important; margin-bottom:8px !important; /* top/bottom only — the old `margin:0 0 8px` shorthand
  zeroed the side margins Blocksy's constrained layout uses to centre each block, pinning headings to the viewport edge */
}
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content h1::after{
  content:""; display:block; width:58px; height:5px; background:#e3262f; margin:12px 0 6px; border-radius:2px;
}
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content h2{
  font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase;
  font-size:clamp(19px,2.2vw,24px) !important; line-height:1.2 !important; color:#111214 !important;
  margin-top:38px !important; margin-bottom:14px !important; position:relative; padding-left:15px;
}
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content h2::before{
  content:""; position:absolute; left:0; top:2px; bottom:3px; width:4px; background:#e3262f;
}
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content h3{
  font-family:Archivo,sans-serif !important; font-weight:700 !important; text-transform:none !important;
  font-size:16.5px !important; color:#1b1b20 !important; margin-top:26px !important; margin-bottom:8px !important; line-height:1.3;
}
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content p,
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content li{
  font-family:Archivo,sans-serif; color:#45454c; font-size:15.5px; line-height:1.85; max-width:72ch;
}
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content p{ margin:0 0 16px; }
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content li{ margin:0 0 9px; }
body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content p strong{ color:#111214; }
/* Same is-layout-constrained trap as the product accordion (see the .mfs-acc-panel fix below):
   Gutenberg margin:auto-centres the 72ch-capped paragraphs while every uncapped block sits at
   Blocksy's gutter. Pin paragraphs to that gutter by mirroring the constrained child geometry
   exactly: width = min(var(--theme-block-width), content-size), auto margin = (100% - that)/2.
   Must use the theme vars, not 5% — the gutter is vw-based, so a %-approximation drifts by the
   scrollbar width. Desktop-scoped: below 690px the 72ch cap exceeds the viewport anyway. */
@media (min-width:690px){
  body:is(.page-id-824261,.page-id-824262,.page-id-824263,.page-id-824264,.page-id-824265,.page-id-824266,.page-id-824267,.page-id-824268,.page-id-824269) .entry-content > p{
    margin-left:calc((100% - min(var(--theme-block-width,100%), var(--wp--style--global--content-size,1290px))) / 2) !important;
    margin-right:auto !important;
  }
}

/* Default-blue WP/Woo buttons that escaped the brand pass (empty-cart "Return to shop",
   My Account "Log in"/"Register", MFS form "Submit") -> black/red like every other CTA. */
.woocommerce .return-to-shop .button,
.woocommerce-form-login button.woocommerce-form-login__submit,
.woocommerce-form-register button.woocommerce-form-register__submit,
.mfs-form .mfs-form-submit{
  background:#111214 !important; color:#fff !important;
  font-family:Archivo,sans-serif !important; font-weight:700 !important;
  text-transform:uppercase; letter-spacing:.05em;
  border:0 !important; border-radius:3px !important; padding:13px 30px !important;
}
.woocommerce .return-to-shop .button:hover,
.woocommerce-form-login button.woocommerce-form-login__submit:hover,
.woocommerce-form-register button.woocommerce-form-register__submit:hover,
.mfs-form .mfs-form-submit:hover{ background:#e3262f !important; color:#fff !important; }

/* ============================================================================
   MOBILE ISSUES round (user doc 2026-07-04). Appended last so it wins ties.
   ========================================================================= */

/* -- #1/#3: homepage header on phones. The transparent-over-hero treatment assumes the hero sits
      under the header, but on mobile the hero starts BELOW the search bar — so the white logo,
      white icons and white "Search" placeholder rendered on the white page background (invisible).
      Phones get a solid white header + dark logo/icons at all times; desktop keeps the overlay. */
@media (max-width:781px){
  body.home .entry-content > .wp-block-cover.alignfull:first-child:first-of-type{ margin-top:0 !important; }
  body.home header.ct-header, body.home header.ct-header [data-row]{ background:#fff !important; }
  body.home header.ct-header{ box-shadow:0 1px 0 rgba(0,0,0,.05) !important; }
  body.home.mfs-hdr-over header .site-logo-container img.default-logo{ filter:none !important; }
  body.home.mfs-hdr-over .mfs-hicon{ color:#111214 !important; }
  body.home.mfs-hdr-over header.ct-header .ct-header-trigger .ct-icon{ color:#111214 !important; }
  /* 3 icons (search/bag/burger) + full-size logo collide at 390px — trim the logo */
  /* 126px (was 140): the right-anchored icon row's hit-boxes end 2px from a 140px logo —
     the icons can't move (flex-end packing), so the logo yields the breathing room */
  header.ct-header .site-logo-container{ max-width:126px !important; }
  header.ct-header .site-logo-container img{ max-width:126px !important; width:auto !important; height:auto !important; }
}

/* -- #2: product grids 2-per-row on phones (homepage New Arrivals was one huge column) */
@media (max-width:600px){
  body.home .woocommerce ul.products.columns-4{ grid-template-columns:repeat(2,1fr) !important; gap:12px !important; }
  body.home .woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:13px !important; }
}

/* -- #6: hero title, intro and CTAs centred on phones */
@media (max-width:781px){
  body.home .entry-content > .wp-block-cover.alignfull:first-child .wp-block-cover__inner-container{ text-align:center; }
  body.home .entry-content > .wp-block-cover.alignfull:first-child .wp-block-buttons{ margin-left:auto !important; margin-right:auto !important; justify-content:center; }
  body.home .entry-content > .wp-block-cover.alignfull:first-child .wp-block-button{ margin-left:auto; margin-right:auto; }
}

/* -- #10: long-form content headings. The global 35px/30px Anton headings overwhelm running copy
      (product descriptions, blog posts) — reuse the approved policy-page treatment: compact red-bar
      Anton h2, Archivo-bold h3, readable Archivo body. Brand/hero/section headings untouched. */
.single-product .mfs-acc-panel h2,
body.single-post .entry-content h2{
  font-family:Anton,sans-serif !important; font-weight:400 !important; text-transform:uppercase;
  font-size:clamp(19px,2.2vw,24px) !important; line-height:1.2 !important; color:#111214 !important;
  margin:32px 0 13px !important; position:relative; padding-left:15px;
}
.single-product .mfs-acc-panel h2::before,
body.single-post .entry-content h2::before{
  content:""; position:absolute; left:0; top:2px; bottom:3px; width:4px; background:#e3262f;
}
.single-product .mfs-acc-panel h2:first-child{ margin-top:8px !important; }
.single-product .mfs-acc-panel h3,
.single-product .mfs-acc-panel h4,
body.single-post .entry-content h3{
  font-family:Archivo,sans-serif !important; font-weight:700 !important; text-transform:none !important;
  font-size:17px !important; line-height:1.35 !important; color:#1b1b20 !important; margin:24px 0 9px !important;
}
.single-product .mfs-acc-panel h3:first-child{ margin-top:8px !important; }
.single-product .mfs-acc-panel p,
.single-product .mfs-acc-panel li{
  font-family:Archivo,sans-serif; color:#45454c; font-size:15.5px; line-height:1.8; max-width:72ch;
}
.single-product .mfs-acc-panel p{ margin:0 0 15px; }
.single-product .mfs-acc-panel li{ margin:0 0 9px; }
.single-product .mfs-acc-panel p strong,
.single-product .mfs-acc-panel li strong{ color:#111214; }
/* the panel carries Gutenberg's is-layout-constrained: its global rule margin:auto-centers any
   width-capped child (our 72ch p) on desktop while heading-led sections stay left — kill the
   centering, keep the readable measure left-aligned like everything else */
.single-product .mfs-acc-panel > *{ margin-left:0 !important; margin-right:0 !important; }

/* -- #2 (cont.): related/upsell product grids on product pages were also a single column */
@media (max-width:600px){
  body.single-product ul.products,
  body.single-product ul.products[data-products],
  body.single-product section.related ul.products.columns-4,
  body.single-product section.up-sells ul.products{
    --shop-columns:repeat(2, minmax(0,1fr));
    grid-template-columns:repeat(2,1fr) !important; gap:12px !important;
  }
}

/* -- #3: iOS toolbar-collapse can briefly detach the sticky header from the viewport top,
      showing page content in the gap above it. Paint a white cap extending above the header so
      any transient gap shows header-white instead of the page. The announce bar (z-index above
      the header) still paints over the cap at the top of the page. */
@media (max-width:781px){
  /* (header is position:sticky — already a positioning context for the cap) */
  header.ct-header::before{ content:""; position:absolute; left:0; right:0; bottom:100%; height:64px; background:#fff; }
}

/* -- #4: Rashtag collage tiles read cramped on phones — taller tiles, tighter label, more gap */
@media (max-width:600px){
  .mfs-rt-collage{ gap:12px; }
  .mfs-rt-tile{ min-height:186px; }
  .mfs-rt-ov{ padding:14px 16px; }
  .mfs-rt-ov h4{ font-size:15.5px; line-height:1.12; }
}

/* -- #12: cart payment buttons uniform (red Proceed was 62px vs 48px express buttons) */
.woocommerce .wc-proceed-to-checkout a.checkout-button{
  /* .woocommerce prefix outguns the (0,3,1) `.woocommerce a.button.alt` padding rule above */
  min-height:48px !important; padding-top:0 !important; padding-bottom:0 !important;
  font-size:16.5px !important; border-radius:4px !important;
}
.wc-proceed-to-checkout .btn-clearpay_express{ height:48px !important; min-height:48px !important; border-radius:4px !important; }

/* ============================================================================
   MOBILE ISSUES round 2 (doc update 2026-07-04).
   ========================================================================= */

/* -- R1: EVERY product grid 2-per-row on phones (category/brand/search/shop archives were
      still 1 col — Blocksy drives these via --shop-columns on [data-products]) */
@media (max-width:600px){
  .woocommerce ul.products,
  ul.products[data-products]{
    --shop-columns:repeat(2, minmax(0,1fr));
    grid-template-columns:repeat(2,1fr) !important;
    gap:12px !important;
  }
}

/* -- R3: hero H1 + intro paragraph centred on phones too (the base cover rules force
      text-align:left !important, so the container-level centring never reached them) */
@media (max-width:781px){
  body.home .entry-content > .wp-block-cover.alignfull:first-child h1,
  body.home .entry-content > .wp-block-cover.alignfull:first-child p{
    text-align:center !important; justify-content:center !important;
  }
}

/* ============================================================================
   MOBILE ISSUES round 3 (doc update 2026-07-04 pm).
   ========================================================================= */

/* -- D7: homepage New Arrivals = 6 on phones (3 rows of 2). Desktop keeps its deliberate single
      row of 5 (the unscoped :nth-child(n+6) cap further up) — here we re-show card 6 and hide 7+
      for mobile. Scoped to .entry-content: the cart-drawer recommendations grid is also .columns-4. */
@media (max-width:600px){
  body.home .entry-content ul.products.columns-4 li.product:nth-child(-n+6){ display:flex !important; }
  body.home .entry-content ul.products.columns-4 li.product:nth-child(n+7){ display:none !important; }
}

/* -- D8: card internals align per row on every 2-up mobile grid.
      Titles wrapped 2-4 lines (the 2-line clamp was homepage-only) and swatch strips wrapped to a
      second row on colour-heavy products, so rows never lined up. Fixed title box, single-row
      swatch strip, one-line colour count — price rows were already bottom-pinned. */
@media (max-width:600px){
  ul.products li.product .woocommerce-loop-product__title{
    display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    overflow:hidden; line-height:1.35 !important;
    /* min AND max pin the box to exactly 2 lines — other rules' min-height:3em let a clipped
       sliver of line 3 paint below the ellipsis */
    min-height:2.7em !important; max-height:2.7em !important;
  }
  /* (swatch strip left as-is per user preference — dots wrap naturally like before) */
  ul.products li.product .mfs-colour-count{
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;
  }
}

/* -- Bigger product cards on phones: page-level card grids go near-full-bleed (12px gutters,
      10px gap) instead of sitting inside the wide container padding. Cards grow ~165->178px.
      Scoped to page contexts only — cart-drawer/off-canvas lists keep their own layout. */
@media (max-width:600px){
  body.mfs-cards ul.products,
  body.home .entry-content ul.products.columns-4,
  body.single-product section.related ul.products,
  body.single-product section.up-sells ul.products,
  .woocommerce-cart .cross-sells ul.products{
    width:calc(100vw - 24px) !important;
    max-width:none !important;
    margin-left:calc(50% - 50vw + 12px) !important;
    margin-right:calc(50% - 50vw + 12px) !important;
    padding-left:0 !important;  /* the home grid carried 34px side padding (old gutters) */
    padding-right:0 !important;
    gap:10px !important;
  }
}

/* -- Breadcrumbs (product pages / Blocksy .ct-breadcrumbs): brand colours — links rendered
      default blue, everything else on the site is navy/red. */
.ct-breadcrumbs{ font-family:Archivo,sans-serif !important; }
.ct-breadcrumbs a, .ct-breadcrumbs a span{ color:#3a4f66 !important; text-decoration:none; }
.ct-breadcrumbs a:hover, .ct-breadcrumbs a:hover span{ color:#e3262f !important; }
.ct-breadcrumbs .ct-separator{ color:#b9bec6; }
.ct-breadcrumbs > span:last-child{ color:#192a3d; }

/* -- Phones: drop the trail's last item (the product name — it's the H1 right below anyway) so
      the breadcrumb sits on ONE line. Each Blocksy item carries its own trailing separator, so
      the second-to-last item's chevron goes too. Desktop keeps the full trail. */
@media (max-width:781px){
  body.single-product .ct-breadcrumbs > span:last-child{ display:none; }
  body.single-product .ct-breadcrumbs > span:nth-last-child(2) .ct-separator{ display:none; }
}

/* -- Header icons (phones): magnifier + bag matched to the hamburger's visual size
      (burger = 28x22 solid bars; these were 22-23px thin-stroke outlines and looked smaller) */
@media (max-width:781px){
  .mfs-m-searchbtn svg,
  .mfs-m-cart svg{ width:26px !important; height:26px !important; stroke-width:2; }
}