{"id":16,"date":"2026-10-19T15:54:23","date_gmt":"2026-10-19T15:54:23","guid":{"rendered":"https:\/\/knockoutbelts.com\/?page_id=16"},"modified":"2026-10-19T16:00:27","modified_gmt":"2026-10-19T16:00:27","slug":"home","status":"publish","type":"page","link":"https:\/\/knockoutbelts.com\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"16\" class=\"elementor elementor-16\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9e432f6 e-con-full wd-section-stretch-content e-flex e-con e-parent\" data-id=\"9e432f6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-0f42ff4 elementor-widget elementor-widget-html\" data-id=\"0f42ff4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\n     KNOCKOUT BELTS \u2014 HOMEPAGE CONTENT\n     Sections 1-10. No header, no footer: those stay in your theme.\n\n     Where to put this:\n       - Elementor      : add an \"HTML\" widget to the page and paste all of it\n       - Block editor   : add a \"Custom HTML\" block and paste all of it\n       - Page template  : paste inside your template, between get_header()\n                          and get_footer()\n\n     Fonts: this loads Barlow Condensed + Inter from Google Fonts.\n     Remove that <link> if your theme already loads them.\n     ============================================================ -->\n\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Barlow+Condensed:wght@600;700;800&family=Inter:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\n\n<style>\n\/* Knockout Belts \u2014 homepage sections. Header & footer come from your theme. *\/\n:root{\n  --black:#080808; --black-2:#121212; --card:#1B1B1B;\n  --gold:#D4AF37; --gold-hi:#F4D675;\n  --white:#FFFFFF; --muted:#B8B8B8; --border:#303030;\n  --head:\"Barlow Condensed\",system-ui,sans-serif;\n  --body:\"Inter\",system-ui,-apple-system,sans-serif;\n  --maxw:1400px; --gut:24px;\n  --r:4px;\n}\n*{box-sizing:border-box}\nhtml,body{margin:0;padding:0;overflow-x:hidden}\nbody{background:var(--black);color:var(--white);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}\nimg{max-width:100%;display:block}\na{color:inherit;text-decoration:none}\n.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}\n.kb-home h1,.kb-home h2,.kb-home h3,.kb-home h4{font-family:var(--head);font-weight:800;letter-spacing:.01em;line-height:1.02;margin:0;text-transform:uppercase}\n.eyebrow{font-family:var(--body);font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 14px}\n.sec{padding:96px 0}\n.sec-head{margin-bottom:44px}\n.sec-head h2{font-size:clamp(34px,4.6vw,58px)}\n.sec-head p{color:var(--muted);margin:14px 0 0;max-width:60ch;font-size:17px}\n.sec-head.center{text-align:center}\n.sec-head.center p{margin-left:auto;margin-right:auto}\n.rule{height:1px;background:var(--border)}\n\n\/* buttons *\/\n.kb-home .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--body);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;padding:16px 30px;border-radius:var(--r);border:1px solid transparent;cursor:pointer;transition:.18s ease;white-space:nowrap}\n.btn-gold{background:var(--gold);color:#0A0A0A}\n.btn-gold:hover{background:var(--gold-hi)}\n.btn-ghost{background:transparent;color:var(--white);border-color:var(--border)}\n.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}\n.btn-sm{padding:12px 20px;font-size:12px}\n.btn-full{width:100%}\n.link-gold{color:var(--gold);font-weight:600;font-size:13px;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;gap:8px;transition:gap .18s}\n.link-gold:hover{gap:14px;color:var(--gold-hi)}\n\n\/* ---------- placeholder art ---------- *\/\n.ph{position:relative;background:#141414;overflow:hidden;display:flex;align-items:center;justify-content:center}\n.ph.noimg{background:radial-gradient(ellipse at 50% 42%,rgba(212,175,55,.22),#141414 68%)}\n.ph.noimg::after{content:\"\";position:absolute;left:12%;right:12%;top:50%;transform:translateY(-50%);height:34%;border-radius:8px;background:conic-gradient(from 210deg,#8a6c22,#F4D675 18%,#D4AF37 34%,#7a5e1d 52%,#F4D675 70%,#C9A233 86%,#8a6c22);opacity:.55;z-index:1}\n.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}\n.ph::before{content:\"\";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,8,.15),rgba(8,8,8,.55));z-index:2;pointer-events:none}\n.pmedia::before{background:linear-gradient(180deg,rgba(8,8,8,0),rgba(8,8,8,.3))}\n.belt{width:88%;max-width:560px;position:relative;filter:drop-shadow(0 30px 50px rgba(0,0,0,.8))}\n.belt .strap{height:54px;border-radius:6px;background:linear-gradient(180deg,#2a2018,#120d08 55%,#241a12);border:1px solid #3a2c1d;position:relative}\n.belt .strap::before,.belt .strap::after{content:\"\";position:absolute;left:4%;right:4%;height:1px;background:rgba(212,175,55,.18)}\n.belt .strap::before{top:9px}.belt .strap::after{bottom:9px}\n.belt .plate{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46%;aspect-ratio:1.28\/1;border-radius:50% 50% 46% 46%\/58% 58% 42% 42%;\n  background:conic-gradient(from 210deg,#8a6c22,#F4D675 18%,#D4AF37 34%,#7a5e1d 52%,#F4D675 70%,#C9A233 86%,#8a6c22);\n  border:2px solid rgba(255,255,255,.14);box-shadow:0 0 40px rgba(212,175,55,.22), inset 0 0 26px rgba(0,0,0,.35)}\n.belt .plate::after{content:\"\";position:absolute;inset:14%;border-radius:inherit;border:1px solid rgba(0,0,0,.3);background:radial-gradient(ellipse at 35% 28%,rgba(255,255,255,.3),transparent 55%)}\n.belt .side{position:absolute;top:50%;transform:translateY(-50%);width:15%;aspect-ratio:1\/1.1;border-radius:50%;\n  background:conic-gradient(from 160deg,#7a5e1d,#D4AF37 30%,#F4D675 50%,#9a7a28 72%,#7a5e1d);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 0 14px rgba(0,0,0,.4)}\n.belt .side.l{left:10%}.belt .side.r{right:10%}\n.belt.sm .strap{height:34px}\n.belt.sm .plate{width:44%}\n\n\/* ---------- hero ---------- *\/\n.hero{position:relative;min-height:min(86vh,760px);display:flex;align-items:center;background:var(--black);overflow:hidden}\n.hero-bg{position:absolute;inset:0;z-index:0}\n.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 42%}\n.hero-bg.noimg{background:radial-gradient(ellipse at 50% 45%,rgba(212,175,55,.2),#0d0d0d 70%)}\n.hero-ov{position:absolute;inset:0;z-index:1;background:\n  linear-gradient(180deg,rgba(8,8,8,.72) 0%,rgba(8,8,8,.5) 42%,rgba(8,8,8,.92) 100%),\n  radial-gradient(ellipse 70% 60% at 50% 50%,rgba(0,0,0,.18),rgba(8,8,8,.7))}\n.hero-in{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:110px var(--gut);text-align:center;width:100%}\n.hero h1{font-size:clamp(54px,9.5vw,124px);letter-spacing:.005em;text-shadow:0 6px 40px rgba(0,0,0,.6)}\n.hero h1 em{font-style:normal;color:var(--gold)}\n.hero p{color:#D6D6D6;font-size:clamp(16px,1.6vw,19px);max-width:60ch;margin:22px auto 0;text-shadow:0 2px 18px rgba(0,0,0,.7)}\n.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:38px}\n\n\/* ---------- category cards ---------- *\/\n.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}\n.cat{position:relative;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--card);transition:.22s;display:flex;flex-direction:column}\n.cat:hover{border-color:var(--gold);transform:translateY(-4px)}\n.cat-img{aspect-ratio:4\/5;background:linear-gradient(180deg,#171717,#0d0d0d)}\n.cat-img .belt{width:92%;transform:rotate(-8deg)}\n.cat-body{padding:22px 20px 24px;border-top:1px solid var(--border);display:flex;flex-direction:column;flex:1}\n.cat-body h3{font-size:21px}\n.cat-body p{color:var(--muted);font-size:13.5px;margin:8px 0 18px}\n.cat-body .link-gold{margin-top:auto}\n\n\/* ---------- product cards ---------- *\/\n.grid-p{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}\n.pcard{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.2s}\n.pcard:hover{border-color:#4a4a4a;transform:translateY(-3px)}\n.pmedia{position:relative;aspect-ratio:1\/1;background:linear-gradient(180deg,#1f1f1f,#141414)}\n.pmedia .belt{width:90%}\n.ptags{position:absolute;top:12px;left:12px;display:flex;flex-direction:column;gap:6px;z-index:3}\n.tag{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:5px 9px;border-radius:3px}\n.tag-sale{background:var(--gold);color:#0A0A0A}\n.tag-new{background:#1f1f1f;color:var(--gold);border:1px solid var(--gold)}\n.wish{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;background:rgba(10,10,10,.75);border:1px solid var(--border);display:grid;place-items:center;cursor:pointer;z-index:3;transition:.16s}\n.wish:hover{border-color:var(--gold);color:var(--gold)}\n.wish svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}\n.pbody{padding:18px 18px 20px;display:flex;flex-direction:column;gap:9px;flex:1}\n.pcat{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#7d7d7d}\n.pname{font-family:var(--head);font-size:19px;line-height:1.14;text-transform:uppercase}\n.prate{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}\n.stars{color:var(--gold);letter-spacing:2px;font-size:12px}\n.pprice{display:flex;align-items:baseline;gap:10px;margin-top:2px}\n.pnow{font-family:var(--head);font-size:24px;color:var(--gold)}\n.pwas{font-size:14px;color:#7d7d7d;text-decoration:line-through}\n.pvar{display:flex;gap:6px;flex-wrap:wrap}\n.chip{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);border-radius:3px;padding:4px 8px}\n.pbody .btn{margin-top:auto}\n.cta-row{text-align:center;margin-top:46px}\n\n\/* ---------- featured ---------- *\/\n.feat{background:var(--black-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}\n.feat-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}\n.feat-media{aspect-ratio:1\/1;border:1px solid var(--border);border-radius:var(--r);background:radial-gradient(ellipse at 50% 45%,#242424,#0e0e0e 72%)}\n.feat-media .belt{width:92%}\n.feat h2{font-size:clamp(32px,4vw,52px);margin-bottom:18px}\n.feat .pname-lg{font-family:var(--head);font-size:30px;text-transform:uppercase;margin:0 0 10px}\n.feat p.desc{color:var(--muted);margin:0 0 22px}\n.spec{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:22px 0;padding:22px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}\n.spec div{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:#7d7d7d}\n.spec b{display:block;color:var(--white);font-size:14px;letter-spacing:.02em;text-transform:none;font-weight:600;margin-top:4px}\n.stock{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);margin-bottom:18px}\n.dot{width:8px;height:8px;border-radius:50%;background:#4ade80}\n.feat-cta{display:flex;gap:12px;flex-wrap:wrap}\n\n\/* ---------- sport panels ---------- *\/\n.panels{display:flex;flex-direction:column;gap:18px}\n.panel{position:relative;min-height:260px;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;display:grid;grid-template-columns:1fr 1fr;align-items:center;background:var(--card);transition:.22s}\n.panel:hover{border-color:var(--gold)}\n.panel .pn-art{height:100%;min-height:260px;background:linear-gradient(120deg,#191919,#0c0c0c)}\n.panel .pn-art .belt{width:78%}\n.panel .pn-txt{padding:40px}\n.panel h3{font-size:clamp(30px,3.6vw,46px)}\n.panel p{color:var(--muted);margin:12px 0 22px;max-width:46ch}\n.panel:nth-child(even) .pn-art{order:2}\n\n\/* ---------- benefits ---------- *\/\n.ben{background:var(--card);border:1px solid var(--border);border-radius:var(--r);padding:32px 26px;transition:.2s}\n.ben:hover{border-color:var(--gold)}\n.ben svg{width:28px;height:28px;stroke:var(--gold);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;margin-bottom:18px}\n.ben h3{font-size:19px;margin-bottom:9px}\n.ben p{color:var(--muted);font-size:14px;margin:0}\n\n\/* ---------- promo ---------- *\/\n.promo{position:relative;background:var(--black);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:110px 0;text-align:center;overflow:hidden}\n.promo::before{content:\"\";position:absolute;inset:0;background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(212,175,55,.1),transparent 70%)}\n.promo-in{position:relative;z-index:2}\n.promo .belt{margin:0 auto 40px;width:min(62%,520px)}\n.promo h2{font-size:clamp(34px,5.2vw,66px)}\n.promo p{color:var(--muted);font-size:18px;margin:18px auto 34px;max-width:52ch}\n\n\/* ---------- reviews empty ---------- *\/\n.rev-empty{border:1px dashed var(--border);border-radius:var(--r);background:var(--card);padding:64px 32px;text-align:center}\n.rev-empty svg{width:40px;height:40px;stroke:var(--gold);fill:none;stroke-width:1.4;margin-bottom:20px}\n.rev-empty h3{font-size:24px;margin-bottom:10px}\n.rev-empty p{color:var(--muted);max-width:50ch;margin:0 auto 24px}\n\n\/* ---------- newsletter ---------- *\/\n.news{background:var(--black-2);border-top:1px solid var(--border)}\n.news-in{text-align:center;max-width:620px;margin:0 auto}\n.nform{display:flex;gap:10px;margin:30px 0 14px}\n.nform input{flex:1;background:var(--black);border:1px solid var(--border);border-radius:var(--r);color:var(--white);padding:16px 18px;font-family:var(--body);font-size:15px;outline:none}\n.nform input:focus{border-color:var(--gold)}\n.nform input::placeholder{color:#6f6f6f}\n.consent{font-size:12px;color:#7d7d7d;margin:0}\n.consent a{color:var(--muted);text-decoration:underline}\n\n\/* ---------- responsive ---------- *\/\n@media (max-width:1080px){\n  .feat-grid{grid-template-columns:1fr;gap:38px}\n  .grid4{grid-template-columns:repeat(2,1fr)}\n  .grid-p{grid-template-columns:repeat(3,1fr)}\n}\n@media (max-width:760px){\n  :root{--gut:18px}\n  .sec{padding:64px 0}\n  .grid-p{grid-template-columns:repeat(2,1fr);gap:14px}\n  .grid4{gap:14px}\n  .panel{grid-template-columns:1fr}\n  .panel .pn-art{order:-1 !important;min-height:190px}\n  .panel .pn-txt{padding:28px 22px 32px}\n  .hero{min-height:auto}\n  .hero-in{padding:86px var(--gut) 92px}\n  .pname{font-size:16px}\n  .pnow{font-size:20px}\n  .pbody{padding:14px 13px 16px;gap:7px}\n  .ptags{top:9px;left:9px}\n  .wish{width:32px;height:32px;top:9px;right:9px}\n  .nform{flex-direction:column}\n  .promo{padding:76px 0}\n}\n\n\/* ============================================================\n   THEME OVERRIDES \u2014 Woodmart (and other themes) set global\n   heading\/link colors that win over ours. These rules take\n   those back inside .kb-home only; nothing outside is touched.\n   ============================================================ *\/\n.kb-home{color:var(--white) !important;background:var(--black)}\n.kb-home h1,.kb-home h2,.kb-home h3,.kb-home h4,.kb-home h5,.kb-home h6,\n.kb-home .pname,.kb-home .pname-lg,.kb-home .cat-body h3,\n.kb-home .panel h3,.kb-home .ben h3,.kb-home .rev-empty h3,\n.kb-home .dr-head h3,.kb-home .ctot{color:var(--white) !important}\n\n.kb-home h1 em,.kb-home .eyebrow,.kb-home .pnow,.kb-home .link-gold,\n.kb-home .ft-col h4{color:var(--gold) !important}\n\n.kb-home p,.kb-home li,.kb-home span{color:inherit}\n.kb-home .sec-head p,.kb-home .cat-body p,.kb-home .panel p,\n.kb-home .ben p,.kb-home .rev-empty p,.kb-home .hero p{color:var(--muted) !important}\n.kb-home .pcat,.kb-home .pwas,.kb-home .consent{color:#7d7d7d !important}\n\n\/* Links inside the sections must not take the theme's link color *\/\n.kb-home a{color:inherit !important;text-decoration:none !important;box-shadow:none !important}\n.kb-home a:hover{text-decoration:none !important}\n.kb-home .link-gold:hover{color:var(--gold-hi) !important}\n.kb-home .pname a,.kb-home .cat-body h3{color:var(--white) !important}\n.kb-home .pcard:hover .pname a{color:var(--gold) !important}\n\n\/* Buttons: beat the theme's button styling *\/\n.kb-home .btn{text-transform:uppercase !important;line-height:1 !important;text-shadow:none !important}\n.kb-home .btn-gold,.kb-home .btn-gold:hover,.kb-home .btn-gold:focus{\n  background:var(--gold) !important;color:#0A0A0A !important;border-color:var(--gold) !important}\n.kb-home .btn-gold:hover{background:var(--gold-hi) !important;border-color:var(--gold-hi) !important}\n.kb-home .btn-ghost,.kb-home .btn-ghost:focus{\n  background:transparent !important;color:var(--white) !important;border-color:var(--border) !important}\n.kb-home .btn-ghost:hover{color:var(--gold) !important;border-color:var(--gold) !important}\n\n\/* WooCommerce's own loop button, when the PHP shortcode renders it *\/\n.kb-home .pbody .button,.kb-home .pbody .added_to_cart{\n  display:flex !important;align-items:center;justify-content:center;width:100%;\n  background:var(--gold) !important;color:#0A0A0A !important;\n  font-family:var(--body) !important;font-weight:700 !important;font-size:12px !important;\n  letter-spacing:.14em !important;text-transform:uppercase !important;\n  padding:12px 20px !important;border-radius:var(--r) !important;margin:auto 0 0 !important}\n.kb-home .pbody .button:hover{background:var(--gold-hi) !important}\n\n\/* Woodmart wraps images in its own markup \u2014 keep ours filling the frame *\/\n.kb-home .ph img{width:100% !important;height:100% !important;object-fit:cover !important;\n  max-width:none !important;border-radius:0 !important}\n.kb-home .ph a{display:block;position:absolute;inset:0}\n\n\/* Theme resets that can break the grid *\/\n.kb-home *,.kb-home *::before,.kb-home *::after{box-sizing:border-box}\n.kb-home .grid-p,.kb-home .grid4{margin:0 !important}\n.kb-home ul{list-style:none;margin:0;padding:0}\n<\/style>\n\n<div class=\"kb-home\">\n\n<!-- ===== S1: Hero ===== -->\n<section class=\"hero\">\n  <div class=\"ph hero-bg\">\n    <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1787543164040-e7d87b16fec0?auto=format&fit=crop&w=2000&q=80\" alt=\"Championship belt with boxing gloves and trophies\" loading=\"eager\">\n  <\/div>\n  <div class=\"hero-ov\"><\/div>\n  <div class=\"hero-in\">\n    <h1>Built for <em>Champions.<\/em><\/h1>\n    <p>Step into championship style with belts inspired by wrestling, boxing, MMA, and the world of combat sports.<\/p>\n    <div class=\"hero-cta\">\n      <a href=\"#\" class=\"btn btn-gold\">Shop All Belts<\/a>\n      <a href=\"#\" class=\"btn btn-ghost\" style=\"background:rgba(8,8,8,.4);backdrop-filter:blur(4px)\">Explore Best Sellers<\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S2: Shop by Category ===== -->\n<section class=\"sec\">\n  <div class=\"wrap\">\n    <div class=\"sec-head center\">\n      <p class=\"eyebrow\">Browse the collection<\/p>\n      <h2>Find Your Championship Belt<\/h2>\n    <\/div>\n    <div class=\"grid4\">\n      <a class=\"cat\" href=\"#\">\n        <div class=\"ph cat-img\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1656653121475-e33829581294?auto=format&fit=crop&w=700&q=80\" alt=\"Championship belt category\" loading=\"lazy\"><\/div>\n        <div class=\"cat-body\">\n          <h3>Wrestling Belts<\/h3>\n          <p>Championship-inspired designs for wrestling fans and collectors.<\/p>\n          <span class=\"link-gold\">Shop Now \u2192<\/span>\n        <\/div>\n      <\/a>\n      <a class=\"cat\" href=\"#\">\n        <div class=\"ph cat-img\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1549719386-74dfcbf7dbed?auto=format&fit=crop&w=700&q=80\" alt=\"Championship belt category\" loading=\"lazy\"><\/div>\n        <div class=\"cat-body\">\n          <h3>Boxing Belts<\/h3>\n          <p>Belts inspired by the sweet science and its biggest nights.<\/p>\n          <span class=\"link-gold\">Shop Now \u2192<\/span>\n        <\/div>\n      <\/a>\n      <a class=\"cat\" href=\"#\">\n        <div class=\"ph cat-img\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1606059100110-4230429584fe?auto=format&fit=crop&w=700&q=80\" alt=\"Championship belt category\" loading=\"lazy\"><\/div>\n        <div class=\"cat-body\">\n          <h3>MMA Belts<\/h3>\n          <p>Championship style for mixed martial arts fans.<\/p>\n          <span class=\"link-gold\">Shop Now \u2192<\/span>\n        <\/div>\n      <\/a>\n      <a class=\"cat\" href=\"#\">\n        <div class=\"ph cat-img\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1667967699372-1c26d40dec46?auto=format&fit=crop&w=700&q=80\" alt=\"Championship belt category\" loading=\"lazy\"><\/div>\n        <div class=\"cat-body\">\n          <h3>Replica &amp; Collectible<\/h3>\n          <p>Display-ready belts for collectors and serious fans.<\/p>\n          <span class=\"link-gold\">Shop Now \u2192<\/span>\n        <\/div>\n      <\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S3: Best Sellers ===== -->\n<section class=\"sec\" style=\"padding-top:0\">\n  <div class=\"wrap\">\n    <div class=\"sec-head center\">\n      <p class=\"eyebrow\">Best sellers<\/p>\n      <h2>The Champions' Favorites<\/h2>\n      <p>Explore the belts that deserve the spotlight.<\/p>\n    <\/div>\n    <div class=\"grid-p\" id=\"bestGrid\"><\/div>\n    <div class=\"cta-row\"><a href=\"#\" class=\"btn btn-ghost\">View All Best Sellers<\/a><\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S4: Featured Belt ===== -->\n<section class=\"sec feat\">\n  <div class=\"wrap\">\n    <div class=\"feat-grid\">\n      <div class=\"ph feat-media\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1509563268479-0f004cf3f58b?auto=format&fit=crop&w=1100&q=80\" alt=\"Featured championship belt\"><\/div>\n      <div>\n        <p class=\"eyebrow\">Featured belt<\/p>\n        <h2>A Title Worth Showing Off.<\/h2>\n        <p class=\"pname-lg\">[ Product name from WooCommerce ]<\/p>\n        <p class=\"desc\">Short product description pulled from the product's short description field. Replace this with your own copy in the WooCommerce product editor.<\/p>\n        <div class=\"pprice\" style=\"margin-bottom:4px\">\n          <span class=\"pnow\">$\u2014<\/span>\n          <span class=\"pwas\">$\u2014<\/span>\n          <span class=\"tag tag-sale\">Sale<\/span>\n        <\/div>\n        <div class=\"spec\">\n          <div>Variations<b>Size \/ Plate finish<\/b><\/div>\n          <div>Category<b>Wrestling Belts<\/b><\/div>\n        <\/div>\n        <div class=\"stock\"><span class=\"dot\"><\/span> Stock status shown from WooCommerce inventory<\/div>\n        <div class=\"feat-cta\">\n          <a href=\"#\" class=\"btn btn-gold\">Add to Cart<\/a>\n          <a href=\"#\" class=\"btn btn-ghost\">View Product<\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S5: Shop by Sport ===== -->\n<section class=\"sec\">\n  <div class=\"wrap\">\n    <div class=\"sec-head center\">\n      <p class=\"eyebrow\">Shop by sport<\/p>\n      <h2>Choose Your Arena<\/h2>\n    <\/div>\n    <div class=\"panels\">\n      <a class=\"panel\" href=\"#\">\n        <div class=\"ph pn-art\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1514050566906-8d077bae7046?auto=format&fit=crop&w=1000&q=80\" alt=\"Combat sports collection\" loading=\"lazy\"><\/div>\n        <div class=\"pn-txt\"><h3>Wrestling<\/h3><p>Championship-inspired designs built for fans of the squared circle.<\/p><span class=\"link-gold\">Shop Collection \u2192<\/span><\/div>\n      <\/a>\n      <a class=\"panel\" href=\"#\">\n        <div class=\"ph pn-art\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1564097147829-44f8c74a8549?auto=format&fit=crop&w=1000&q=80\" alt=\"Combat sports collection\" loading=\"lazy\"><\/div>\n        <div class=\"pn-txt\"><h3>Boxing<\/h3><p>Belts inspired by the sweet science \u2014 clean lines, bold plates.<\/p><span class=\"link-gold\">Shop Collection \u2192<\/span><\/div>\n      <\/a>\n      <a class=\"panel\" href=\"#\">\n        <div class=\"ph pn-art\"><img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1565852841746-79286ef8fa0a?auto=format&fit=crop&w=1000&q=80\" alt=\"Combat sports collection\" loading=\"lazy\"><\/div>\n        <div class=\"pn-txt\"><h3>MMA<\/h3><p>Championship style for mixed martial arts fans and collectors.<\/p><span class=\"link-gold\">Shop Collection \u2192<\/span><\/div>\n      <\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S6: Why Knockout Belts ===== -->\n<section class=\"sec\" style=\"background:var(--black-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border)\">\n  <div class=\"wrap\">\n    <div class=\"sec-head center\">\n      <p class=\"eyebrow\">Why Knockout Belts<\/p>\n      <h2>Your Passion. Your Championship.<\/h2>\n    <\/div>\n    <div class=\"grid4\">\n      <div class=\"ben\">\n        <svg viewBox=\"0 0 24 24\"><path d=\"M12 3l2.6 5.3 5.9.9-4.3 4.1 1 5.8-5.2-2.7-5.2 2.7 1-5.8L3.5 9.2l5.9-.9z\"\/><\/svg>\n        <h3>Standout Designs<\/h3><p>Belts chosen for bold plate work and finishes that look the part on display.<\/p>\n      <\/div>\n      <div class=\"ben\">\n        <svg viewBox=\"0 0 24 24\"><path d=\"M14 3H7a2 2 0 00-2 2v14a2 2 0 002 2h10a2 2 0 002-2V8z\"\/><path d=\"M14 3v5h5M9 13h6M9 17h4\"\/><\/svg>\n        <h3>Detailed Product Info<\/h3><p>Clear photos, variations and specifications on every product page before you buy.<\/p>\n      <\/div>\n      <div class=\"ben\">\n        <svg viewBox=\"0 0 24 24\"><rect x=\"4\" y=\"10\" width=\"16\" height=\"11\" rx=\"2\"\/><path d=\"M8 10V7a4 4 0 018 0v3\"\/><\/svg>\n        <h3>Secure Shopping<\/h3><p>Checkout runs on WooCommerce with your configured, encrypted payment gateways.<\/p>\n      <\/div>\n      <div class=\"ben\">\n        <svg viewBox=\"0 0 24 24\"><path d=\"M21 12a9 9 0 10-3.4 7\"\/><path d=\"M21 12v5a2 2 0 01-2 2h-5\"\/><\/svg>\n        <h3>Customer Support<\/h3><p>Questions about sizing, orders or delivery \u2014 reach us before and after you order.<\/p>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S7: Promo banner ===== -->\n<section class=\"promo\">\n  <div class=\"wrap promo-in\">\n    <div class=\"ph\" style=\"max-width:900px;margin:0 auto 44px;aspect-ratio:16\/7;border:1px solid var(--border);border-radius:var(--r)\">\n      <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581971193272-c0035bcdd31f?auto=format&fit=crop&w=1600&q=80\" alt=\"Fighters in a boxing ring\" loading=\"lazy\">\n    <\/div>\n    <h2>Every Champion Has a Story.<\/h2>\n    <p>Find the belt that celebrates your passion for the fight.<\/p>\n    <a href=\"#\" class=\"btn btn-gold\">Explore the Collection<\/a>\n  <\/div>\n<\/section>\n\n<!-- ===== S8: New Arrivals ===== -->\n<section class=\"sec\">\n  <div class=\"wrap\">\n    <div class=\"sec-head center\">\n      <p class=\"eyebrow\">Just landed<\/p>\n      <h2>Fresh Into the Ring<\/h2>\n    <\/div>\n    <div class=\"grid-p\" id=\"newGrid\"><\/div>\n    <div class=\"cta-row\"><a href=\"#\" class=\"btn btn-ghost\">View All New Arrivals<\/a><\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S9: Reviews (empty state) ===== -->\n<section class=\"sec\" style=\"padding-top:0\">\n  <div class=\"wrap\">\n    <div class=\"sec-head center\">\n      <p class=\"eyebrow\">Customer reviews<\/p>\n      <h2>Real Words From Our Customers<\/h2>\n    <\/div>\n    <div class=\"rev-empty\">\n      <svg viewBox=\"0 0 24 24\"><path d=\"M21 12a8 8 0 01-8 8H7l-4 3V12a8 8 0 018-8h2a8 8 0 018 8z\"\/><\/svg>\n      <h3>Be the first to review<\/h3>\n      <p>Verified customer reviews will appear here automatically as soon as buyers leave them on your product pages. Nothing is shown until it's real.<\/p>\n      <a href=\"#\" class=\"btn btn-ghost btn-sm\">Browse Belts<\/a>\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- ===== S10: Newsletter ===== -->\n<section class=\"sec news\">\n  <div class=\"wrap news-in\">\n    <p class=\"eyebrow\">Newsletter<\/p>\n    <h2 style=\"font-size:clamp(30px,4vw,48px)\">Join the Champions' Corner<\/h2>\n    <p style=\"color:var(--muted);margin-top:14px\">Get updates on new arrivals, product launches, and special offers.<\/p>\n    <form class=\"nform\" onsubmit=\"return false\">\n      <label class=\"sr\" for=\"nemail\">Email address<\/label>\n      <input id=\"nemail\" type=\"email\" placeholder=\"Your email address\" required>\n      <button class=\"btn btn-gold\" type=\"submit\">Subscribe<\/button>\n    <\/form>\n    <p class=\"consent\">By subscribing you agree to our <a href=\"#\">Privacy Policy<\/a>. Unsubscribe anytime. <br><span style=\"color:var(--gold)\">Connect this form to your email service before going live.<\/span><\/p>\n  <\/div>\n<\/section>\n\n<\/div>\n\n<script>\n\/* =====================================================================\n   PRODUCTS \u2014 pulled live from WooCommerce.\n   Set WC_BASE to your store URL (leave \"\" when this page IS the store,\n   e.g. once it runs inside WordPress on the same domain).\n   The Store API is public and needs no API key.\n   ===================================================================== *\/\nvar WC_BASE = \"\";                       \/\/ e.g. \"https:\/\/knockoutbelts.com\"\nvar API = (WC_BASE || \"\") + \"\/wp-json\/wc\/store\/v1\/products\";\n\nfunction beltArt(src){\n  return src ? '<img decoding=\"async\" src=\"'+src+'\" alt=\"\" loading=\"lazy\">' : '';\n}\nfunction money(html){ return html || \"\"; }\n\n\/* Build a card from a WooCommerce Store API product object. *\/\nfunction card(p){\n  var tags = \"\";\n  if (p.on_sale) tags += '<span class=\"tag tag-sale\">Sale<\/span>';\n  if (p.is_new)  tags += '<span class=\"tag tag-new\">New<\/span>';\n\n  var chips = (p.variations_labels || []).map(function(v){\n    return '<span class=\"chip\">'+v+'<\/span>';\n  }).join(\"\");\n\n  var rating = (p.review_count > 0)\n    ? '<div class=\"prate\"><span class=\"stars\">'+\"\u2605\".repeat(Math.round(p.average_rating))+'<\/span><span>'+p.average_rating+' ('+p.review_count+')<\/span><\/div>'\n    : '<div class=\"prate\" style=\"color:#6f6f6f\">No reviews yet<\/div>';\n\n  var price = '<div class=\"pprice\"><span class=\"pnow\">'+p.price+'<\/span>'\n            + (p.regular_price_display ? '<span class=\"pwas\">'+p.regular_price_display+'<\/span>' : '')\n            + '<\/div>';\n\n  return '<article class=\"pcard\">'\n    + '<div class=\"ph pmedia\">'\n      + (tags ? '<div class=\"ptags\">'+tags+'<\/div>' : '')\n      + '<button class=\"wish\" aria-label=\"Add to wishlist\"><svg viewBox=\"0 0 24 24\"><path d=\"M12 20.5l-7.3-7.1a4.6 4.6 0 017.3-5.5 4.6 4.6 0 017.3 5.5z\"\/><\/svg><\/button>'\n      + '<a href=\"'+(p.permalink||'#')+'\">'+beltArt(p.img)+'<\/a>'\n    + '<\/div>'\n    + '<div class=\"pbody\">'\n      + (p.cat ? '<span class=\"pcat\">'+p.cat+'<\/span>' : '')\n      + '<h3 class=\"pname\"><a href=\"'+(p.permalink||'#')+'\">'+p.name+'<\/a><\/h3>'\n      + rating + price\n      + (chips ? '<div class=\"pvar\">'+chips+'<\/div>' : '')\n      + '<a href=\"'+(p.permalink||'#')+'\" class=\"btn btn-gold btn-sm btn-full addBtn\">'+(p.is_variable ? 'Select Options' : 'Add to Cart')+'<\/a>'\n    + '<\/div><\/article>';\n}\n\n\/* Normalise a Store API product into what card() expects. *\/\nfunction normalise(raw){\n  var prices = raw.prices || {};\n  var dec    = prices.currency_minor_unit != null ? prices.currency_minor_unit : 2;\n  var sym    = prices.currency_prefix || prices.currency_symbol || \"\";\n  var fmt = function(v){\n    if (v == null || v === \"\") return \"\";\n    return sym + (parseInt(v,10) \/ Math.pow(10,dec)).toFixed(dec);\n  };\n  var onSale = prices.sale_price && prices.regular_price && prices.sale_price !== prices.regular_price;\n  var created = raw.date_created ? new Date(raw.date_created) : null;\n\n  return {\n    name: raw.name,\n    permalink: raw.permalink,\n    img: (raw.images && raw.images[0]) ? raw.images[0].src : \"\",\n    cat: (raw.categories && raw.categories[0]) ? raw.categories[0].name : \"\",\n    price: fmt(prices.price),\n    regular_price_display: onSale ? fmt(prices.regular_price) : \"\",\n    on_sale: !!onSale,\n    is_new: created ? ((Date.now() - created.getTime()) < 30*24*60*60*1000) : false,\n    is_variable: raw.type === \"variable\",\n    variations_labels: (raw.attributes || []).filter(function(a){return a.has_variations;}).map(function(a){return a.name;}),\n    average_rating: parseFloat(raw.average_rating || 0).toFixed(1),\n    review_count: raw.review_count || 0\n  };\n}\n\nfunction skeletons(n){\n  var one = '<article class=\"pcard\"><div class=\"ph pmedia\"><\/div><div class=\"pbody\">'\n          + '<span class=\"pcat\" style=\"opacity:.35\">&nbsp;<\/span>'\n          + '<h3 class=\"pname\" style=\"opacity:.35\">&nbsp;<\/h3>'\n          + '<div class=\"pprice\" style=\"opacity:.35\">&nbsp;<\/div><\/div><\/article>';\n  return new Array(n).fill(one).join(\"\");\n}\n\nfunction emptyState(msg){\n  return '<div style=\"grid-column:1\/-1;border:1px dashed var(--border);border-radius:var(--r);background:var(--card);padding:48px 24px;text-align:center\">'\n       + '<p style=\"color:var(--muted);margin:0\">'+msg+'<\/p><\/div>';\n}\n\nfunction loadGrid(elId, query, emptyMsg){\n  var el = document.getElementById(elId);\n  if (!el) return;\n  el.innerHTML = skeletons(4);\n\n  fetch(API + \"?\" + query, { headers: { \"Accept\": \"application\/json\" } })\n    .then(function(r){ if(!r.ok) throw new Error(r.status); return r.json(); })\n    .then(function(list){\n      if (!list || !list.length) { el.innerHTML = emptyState(emptyMsg); return; }\n      el.innerHTML = list.map(function(raw){ return card(normalise(raw)); }).join(\"\");\n    })\n    .catch(function(){\n      el.innerHTML = emptyState(\"Products load automatically from WooCommerce. Connect this page to your store to see them here.\");\n    });\n}\n\nloadGrid(\"bestGrid\", \"orderby=popularity&per_page=4&status=publish\",\n         \"No best sellers yet \u2014 this fills in once orders start coming through.\");\nloadGrid(\"newGrid\",  \"orderby=date&order=desc&per_page=4&status=publish\",\n         \"No new arrivals right now.\");\n\n\/* If an image fails to load, show a gold fallback instead of an empty box *\/\ndocument.querySelectorAll('.kb-home .ph img').forEach(function(im){\n  im.addEventListener('error', function(){ im.style.display='none'; im.parentNode.classList.add('noimg'); });\n  if(im.complete && im.naturalWidth===0){ im.style.display='none'; im.parentNode.classList.add('noimg'); }\n});\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Built for Champions. Step into championship style with belts inspired by wrestling, boxing, MMA, and the world of combat sports.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-16","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=\/wp\/v2\/pages\/16","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16"}],"version-history":[{"count":7,"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions"}],"predecessor-version":[{"id":34,"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=\/wp\/v2\/pages\/16\/revisions\/34"}],"wp:attachment":[{"href":"https:\/\/knockoutbelts.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}