{"product_id":"cool-harry-potter-theme-keycap-set","title":"Harry Potter Themed Cool Artisan Keycap Set","description":"\u003c!-- ================================================================= --\u003e\u003c!--  HARRY POTTER THEME KEYCAP SET — PREMIUM PRODUCT DESCRIPTION       --\u003e\u003c!--  ----------------------------------------------------------------- --\u003e\u003c!--  HOW TO USE:                                                       --\u003e\u003c!--  In the Shopify product editor, click the \"\u003c\u003e\" (Show HTML) icon    --\u003e\u003c!--  on the description box and paste this ENTIRE block.               --\u003e\u003c!--                                                                    --\u003e\u003c!--  • Fully responsive  ·  Mobile · Tablet · Desktop                  --\u003e\u003c!--  • All styles are scoped under .hpkc (won't break your theme)      --\u003e\u003c!--  • lang=\"en\" set on the wrapper so uppercase \"i\" renders as \"I\"    --\u003e\u003c!--    (not the Turkish dotted capital) on Turkish-locale browsers     --\u003e\u003c!--  • Detail images are stitched seamlessly (no gaps)                 --\u003e\u003c!--  • The closing seal is clickable and scrolls to Add to Cart        --\u003e\u003c!-- ================================================================= --\u003e\u003cstyle\u003e\/* ================================================================= *\/\/*  GOOGLE FONTS — distinctive serif display + elegant body          *\/\/* ================================================================= *\/@import url('https:\/\/fonts.googleapis.com\/css2?family=Cinzel:wght@400;500;600;700;800;900\u0026family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500\u0026display=swap');\/* ================================================================= *\/\/*  DESIGN TOKENS                                                    *\/\/* ================================================================= *\/.hpkc {  \/* --- Palette: antique grimoire (midnight · parchment · gold) --- *\/  --hpkc-ink:        #14110d;  --hpkc-night:      #1d1a14;  --hpkc-night-2:    #26221a;  --hpkc-parchment:  #f4ecd8;  --hpkc-parchment-2:#efe3c6;  --hpkc-cream:      #fbf6e9;  --hpkc-gold:       #c9a227;  --hpkc-gold-soft:  #e3c768;  --hpkc-gold-deep:  #8a6d18;  --hpkc-oxblood:    #6e1f24;  --hpkc-emerald:    #1e4435;  --hpkc-sapphire:   #1d3354;  --hpkc-amber:      #b5832b;  --hpkc-text:       #4b4334;  --hpkc-text-soft:  #6a604c;  --hpkc-line:       rgba(201,162,39,0.30);  --hpkc-line-soft:  rgba(201,162,39,0.16);  --hpkc-shadow:     0 18px 50px -20px rgba(0,0,0,0.55);  --hpkc-shadow-sm:  0 8px 24px -12px rgba(0,0,0,0.45);  --hpkc-glow:       0 0 28px rgba(201,162,39,0.32);  \/* --- Typography --- *\/  --hpkc-display: 'Cinzel', 'Trajan Pro', Georgia, 'Times New Roman', serif;  --hpkc-deco:    'Cinzel', 'Trajan Pro', Georgia, 'Times New Roman', serif;  --hpkc-body:    'EB Garamond', Georgia, 'Times New Roman', serif;  \/* --- Layout rhythm --- *\/  --hpkc-radius:    16px;  --hpkc-radius-lg: 22px;  --hpkc-maxw:      1200px;  --hpkc-gap:       clamp(14px, 2.2vw, 22px);  --hpkc-section:   clamp(44px, 7vw, 78px);  \/* --- Base --- *\/  font-family: var(--hpkc-body);  color: var(--hpkc-ink);  line-height: 1.7;  font-size: 18px;  max-width: var(--hpkc-maxw);  margin: 0 auto;  padding: 0 4px;  text-align: center;                 \/* default centered; cards opt out *\/  -webkit-font-smoothing: antialiased;  text-rendering: optimizeLegibility;  box-sizing: border-box;}.hpkc *,.hpkc *::before,.hpkc *::after { box-sizing: border-box; }.hpkc p {  margin: 0 0 1em;  font-size: clamp(16px, 1.6vw, 18.5px);  letter-spacing: 0.1px;}.hpkc p:last-child { margin-bottom: 0; }.hpkc strong { font-weight: 600; }.hpkc h1, .hpkc h2, .hpkc h3, .hpkc h4 {  margin: 0;  line-height: 1.15;}\/* ================================================================= *\/\/*  ATMOSPHERIC PAGE FRAME                                            *\/\/* ================================================================= *\/.hpkc__sheet {  position: relative;  background:    radial-gradient(120% 90% at 50% -10%, rgba(201,162,39,0.10), transparent 55%),    linear-gradient(180deg, #fbf6e9 0%, #f4ecd8 45%, #efe3c6 100%);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius-lg);  overflow: hidden;  box-shadow: var(--hpkc-shadow);}\/* faint parchment grain (pure CSS, no external image) *\/.hpkc__sheet::before {  content: \"\";  position: absolute;  inset: 0;  pointer-events: none;  opacity: 0.5;  background-image:    radial-gradient(rgba(120,96,28,0.06) 1px, transparent 1px),    radial-gradient(rgba(120,96,28,0.05) 1px, transparent 1px);  background-size: 22px 22px, 34px 34px;  background-position: 0 0, 11px 17px;  mix-blend-mode: multiply;}.hpkc__inner {  position: relative;  z-index: 1;  padding: clamp(22px, 5vw, 56px);}\/* ================================================================= *\/\/*  HERO                                                             *\/\/* ================================================================= *\/.hpkc__hero {  position: relative;  text-align: center;  padding: clamp(26px, 5vw, 52px) clamp(8px, 3vw, 32px) clamp(30px, 5vw, 56px);  border-radius: var(--hpkc-radius);  background:    radial-gradient(90% 120% at 50% 0%, rgba(201,162,39,0.16), transparent 60%),    linear-gradient(160deg, #1d1a14 0%, #14110d 60%, #1d1a14 100%);  color: var(--hpkc-parchment);  overflow: hidden;  border: 1px solid rgba(201,162,39,0.28);  box-shadow: inset 0 0 60px rgba(0,0,0,0.55), var(--hpkc-shadow);}\/* twinkling constellation *\/.hpkc__stars {  position: absolute;  inset: 0;  pointer-events: none;  background-image:    radial-gradient(1.4px 1.4px at 12% 22%, rgba(227,199,104,0.9), transparent),    radial-gradient(1.2px 1.2px at 78% 16%, rgba(227,199,104,0.7), transparent),    radial-gradient(1.6px 1.6px at 34% 70%, rgba(227,199,104,0.85), transparent),    radial-gradient(1.1px 1.1px at 64% 60%, rgba(227,199,104,0.6), transparent),    radial-gradient(1.3px 1.3px at 88% 78%, rgba(227,199,104,0.7), transparent),    radial-gradient(1.2px 1.2px at 22% 88%, rgba(227,199,104,0.6), transparent),    radial-gradient(1px 1px at 52% 34%, rgba(227,199,104,0.55), transparent);  animation: hpkc-twinkle 6s ease-in-out infinite alternate;}@keyframes hpkc-twinkle {  0%   { opacity: 0.55; }  100% { opacity: 1; }}\/* eyebrow badge \"Wizarding Collection\" *\/.hpkc__eyebrow {  position: relative;  z-index: 2;  display: inline-flex;  align-items: center;  gap: 10px;  font-family: var(--hpkc-display);  font-weight: 600;  letter-spacing: 0.38em;  text-transform: uppercase;  font-size: clamp(10px, 1.4vw, 12.5px);  color: var(--hpkc-gold-soft);  padding: 9px 18px;  border: 1px solid rgba(201,162,39,0.4);  border-radius: 999px;  background: rgba(201,162,39,0.08);  margin-bottom: 6px;  transition: transform 0.3s ease, background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__eyebrow::before,.hpkc__eyebrow::after { content: \"✦\"; font-size: 9px; opacity: 0.8; }.hpkc__eyebrow:hover {  transform: translateY(-2px) scale(1.03);  background: rgba(201,162,39,0.16);  border-color: var(--hpkc-gold);  box-shadow: var(--hpkc-glow);}\/* extra breathing room beneath the eyebrow box *\/.hpkc__title {  position: relative;  z-index: 2;  font-family: var(--hpkc-deco);  font-weight: 900;  line-height: 1.04;  margin: clamp(36px, 5.5vw, 54px) 0 0;  font-size: clamp(30px, 6vw, 58px);  color: var(--hpkc-cream);  text-shadow: 0 2px 0 rgba(0,0,0,0.4), 0 0 28px rgba(201,162,39,0.28);}.hpkc__title .hpkc__gold {  background: linear-gradient(180deg, #f2dd96 0%, #c9a227 55%, #8a6d18 100%);  -webkit-background-clip: text;  background-clip: text;  -webkit-text-fill-color: transparent;  color: transparent;}.hpkc__subtitle {  position: relative;  z-index: 2;  text-align: center;  font-style: italic;  font-size: clamp(16px, 2.2vw, 21px);  color: rgba(244,236,216,0.86);  max-width: 1200px;  margin: clamp(18px, 3vw, 24px) auto 0;}.hpkc__hero-rule {  position: relative;  z-index: 2;  display: flex;  align-items: center;  justify-content: center;  gap: 14px;  margin: clamp(22px, 4vw, 32px) auto 0;  max-width: 1200px;  color: var(--hpkc-gold);}.hpkc__hero-rule::before,.hpkc__hero-rule::after {  content: \"\";  height: 1px;  flex: 1;  background: linear-gradient(90deg, transparent, var(--hpkc-gold), transparent);}.hpkc__hero-rule span { font-size: 14px; letter-spacing: 0.2em; }\/* hero quick badges *\/.hpkc__badges {  position: relative;  z-index: 2;  display: flex;  flex-wrap: wrap;  justify-content: center;  gap: 10px;  margin-top: clamp(24px, 4vw, 32px);}.hpkc__badge {  display: inline-flex;  align-items: center;  gap: 7px;  font-family: var(--hpkc-display);  font-size: clamp(10px, 1.4vw, 12px);  letter-spacing: 0.12em;  text-transform: uppercase;  color: var(--hpkc-parchment);  padding: 10px 16px;  border-radius: 999px;  border: 1px solid rgba(201,162,39,0.32);  background: rgba(244,236,216,0.04);  transition: transform 0.3s ease, background 0.3s ease, border-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;}.hpkc__badge span:first-child { font-size: 15px; }.hpkc__badge:hover {  transform: translateY(-3px);  background: rgba(201,162,39,0.16);  border-color: var(--hpkc-gold);  color: var(--hpkc-cream);  box-shadow: var(--hpkc-glow);}\/* ================================================================= *\/\/*  SECTION SCAFFOLD — consistent vertical rhythm everywhere         *\/\/* ================================================================= *\/.hpkc__section { margin-top: var(--hpkc-section); }.hpkc__head { text-align: center; margin-bottom: clamp(28px, 4vw, 42px); }.hpkc__kicker {  display: flex;  align-items: center;  justify-content: center;  gap: 12px;  font-family: var(--hpkc-display);  letter-spacing: 0.32em;  text-transform: uppercase;  font-size: clamp(10px, 1.4vw, 12px);  color: var(--hpkc-gold-deep);  margin-bottom: 14px;}.hpkc__kicker::before,.hpkc__kicker::after {  content: \"✦\";  color: var(--hpkc-gold);  font-size: 10px;}.hpkc__h2 {  font-family: var(--hpkc-deco);  font-weight: 900;  text-align: center;  font-size: clamp(26px, 4.6vw, 42px);  line-height: 1.1;  margin: 0 auto 12px;  color: var(--hpkc-ink);  max-width: 1200px;  transition: text-shadow 0.4s ease, color 0.4s ease;}.hpkc__h2:hover { text-shadow: 0 0 22px rgba(201,162,39,0.35); }.hpkc__lead {  text-align: center;  max-width: 1200px;  margin: 0 auto;  color: var(--hpkc-text);  font-size: clamp(16px, 1.8vw, 19px);}.hpkc__divider {  display: flex;  align-items: center;  justify-content: center;  gap: 16px;  margin: clamp(18px, 3vw, 24px) auto 0;  max-width: 1200px;  color: var(--hpkc-gold);}.hpkc__divider::before,.hpkc__divider::after {  content: \"\";  height: 1px;  flex: 1;  background: linear-gradient(90deg, transparent, var(--hpkc-gold-deep), transparent);}.hpkc__diamond {  width: 9px; height: 9px;  transform: rotate(45deg);  background: var(--hpkc-gold);  box-shadow: 0 0 0 4px rgba(201,162,39,0.18);  transition: transform 0.4s ease, box-shadow 0.4s ease;}.hpkc__divider:hover .hpkc__diamond {  transform: rotate(225deg) scale(1.25);  box-shadow: 0 0 0 6px rgba(201,162,39,0.22);}\/* centered intro paragraphs (explicitly centered, theme-proof) *\/.hpkc__prose {  max-width: 1200px;  margin: 0 auto;  text-align: center;}.hpkc__prose p { color: var(--hpkc-text); margin: 0 auto 1.1em; }.hpkc__prose p:last-child { margin-bottom: 0; }\/* ================================================================= *\/\/*  FEATURE GRID                                                     *\/\/* ================================================================= *\/.hpkc__features {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));  gap: var(--hpkc-gap);}.hpkc__feature {  position: relative;  text-align: left;  background: linear-gradient(180deg, #fffaf0 0%, #f4ecd8 100%);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  padding: clamp(20px, 3vw, 28px);  overflow: hidden;  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;}.hpkc__feature::before {  content: \"\";  position: absolute;  inset: 0;  border-radius: inherit;  padding: 1px;  background: linear-gradient(140deg, rgba(201,162,39,0.55), transparent 45%);  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);  -webkit-mask-composite: xor;          mask-composite: exclude;  opacity: 0;  transition: opacity 0.35s ease;}.hpkc__feature:hover {  transform: translateY(-6px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__feature:hover::before { opacity: 1; }.hpkc__feature-icon {  display: inline-flex;  align-items: center;  justify-content: center;  width: 54px; height: 54px;  border-radius: 14px;  font-size: 26px;  margin-bottom: 16px;  background: radial-gradient(120% 120% at 30% 20%, #2a251b, #14110d);  color: var(--hpkc-gold-soft);  border: 1px solid rgba(201,162,39,0.4);  box-shadow: inset 0 0 18px rgba(201,162,39,0.18);  transition: transform 0.4s ease, box-shadow 0.4s ease;}.hpkc__feature:hover .hpkc__feature-icon {  transform: rotate(-6deg) scale(1.08);  box-shadow: inset 0 0 18px rgba(201,162,39,0.3), var(--hpkc-glow);}.hpkc__feature h3 {  font-family: var(--hpkc-display);  font-weight: 700;  font-size: clamp(17px, 2vw, 20px);  margin: 0 0 8px;  letter-spacing: 0.01em;  color: var(--hpkc-ink);}.hpkc__feature p {  margin: 0;  font-size: clamp(15px, 1.6vw, 16.5px);  color: #544b3a;  line-height: 1.65;}\/* ================================================================= *\/\/*  SPOTLIGHT (dark band)                                            *\/\/* ================================================================= *\/.hpkc__spotlight {  position: relative;  text-align: center;  border-radius: var(--hpkc-radius-lg);  overflow: hidden;  padding: clamp(28px, 5vw, 56px);  background:    radial-gradient(80% 120% at 100% 0%, rgba(201,162,39,0.14), transparent 55%),    linear-gradient(155deg, #1d1a14, #14110d);  color: var(--hpkc-parchment);  border: 1px solid rgba(201,162,39,0.28);  box-shadow: var(--hpkc-shadow);}.hpkc__spotlight .hpkc__kicker { color: var(--hpkc-gold-soft); justify-content: center; }.hpkc__spotlight h2 {  font-family: var(--hpkc-deco);  font-weight: 900;  text-align: center;  font-size: clamp(24px, 4vw, 38px);  margin: 0 auto 14px;  color: var(--hpkc-cream);  max-width: 1200px;}.hpkc__spotlight \u003e p {  max-width: 1200px;  color: rgba(244,236,216,0.82);  margin: 0 auto;}.hpkc__spec-grid {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));  gap: 14px;  margin-top: clamp(24px, 3vw, 34px);}.hpkc__spec {  border: 1px solid rgba(201,162,39,0.26);  border-radius: 14px;  padding: 18px 18px 16px;  background: rgba(244,236,216,0.035);  transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__spec:hover {  background: rgba(201,162,39,0.12);  transform: translateY(-4px);  border-color: var(--hpkc-gold);  box-shadow: var(--hpkc-glow);}.hpkc__spec-k {  font-family: var(--hpkc-display);  letter-spacing: 0.18em;  text-transform: uppercase;  font-size: 11px;  color: var(--hpkc-gold-soft);  margin-bottom: 6px;}.hpkc__spec-v {  font-size: clamp(16px, 2vw, 19px);  color: var(--hpkc-cream);  font-weight: 500;}\/* ================================================================= *\/\/*  SOUND \u0026 FEEL — split panel                                       *\/\/* ================================================================= *\/.hpkc__split {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));  gap: var(--hpkc-gap);  text-align: left;}.hpkc__panel {  position: relative;  background: linear-gradient(180deg, #fffaf0, #f1e7cf);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  padding: clamp(24px, 3.4vw, 34px);  overflow: hidden;  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;}.hpkc__panel:hover {  transform: translateY(-5px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__panel .hpkc__panel-ic {  font-size: 32px;  margin-bottom: 12px;  display: inline-block;  transition: transform 0.4s ease;}.hpkc__panel:hover .hpkc__panel-ic { transform: scale(1.12) rotate(-5deg); }.hpkc__panel h3 {  font-family: var(--hpkc-display);  font-weight: 700;  font-size: clamp(18px, 2.2vw, 22px);  margin: 0 0 10px;  color: var(--hpkc-ink);}.hpkc__panel p { margin: 0; color: #544b3a; font-size: 16px; line-height: 1.7; }\/* ================================================================= *\/\/*  PROFILE CARDS                                                    *\/\/* ================================================================= *\/.hpkc__profiles {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));  gap: var(--hpkc-gap);}.hpkc__profile {  position: relative;  background: linear-gradient(180deg, #fffaf0, #f1e7cf);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  padding: clamp(22px, 3vw, 30px) clamp(18px, 3vw, 26px);  text-align: center;  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;  overflow: hidden;}.hpkc__profile::after {  content: \"\";  position: absolute;  top: 0; left: 0; right: 0;  height: 4px;  background: linear-gradient(90deg, var(--hpkc-gold-deep), var(--hpkc-gold-soft), var(--hpkc-gold-deep));}.hpkc__profile:hover {  transform: translateY(-7px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__profile-glyph {  font-family: var(--hpkc-deco);  font-weight: 900;  font-size: 30px;  width: 64px; height: 64px;  margin: 0 auto 14px;  display: flex; align-items: center; justify-content: center;  border-radius: 50%;  color: var(--hpkc-gold);  border: 2px solid var(--hpkc-gold);  background: radial-gradient(circle at 50% 35%, rgba(201,162,39,0.14), transparent 70%);  transition: transform 0.4s ease, background 0.4s ease, box-shadow 0.4s ease;}.hpkc__profile:hover .hpkc__profile-glyph {  transform: scale(1.1);  background: radial-gradient(circle at 50% 35%, rgba(201,162,39,0.32), transparent 72%);  box-shadow: var(--hpkc-glow);}.hpkc__profile h3 {  font-family: var(--hpkc-display);  font-size: clamp(18px, 2.2vw, 22px);  font-weight: 700;  margin: 0 0 6px;  color: var(--hpkc-ink);}.hpkc__profile-tag {  display: inline-block;  font-family: var(--hpkc-display);  letter-spacing: 0.16em;  text-transform: uppercase;  font-size: 10.5px;  color: var(--hpkc-gold-deep);  margin-bottom: 12px;}.hpkc__profile p { font-size: 15.5px; color: #544b3a; margin: 0; line-height: 1.65; }\/* ================================================================= *\/\/*  HOUSE COLOURS                                                    *\/\/* ================================================================= *\/.hpkc__houses {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));  gap: var(--hpkc-gap);}.hpkc__house {  position: relative;  text-align: center;  border-radius: var(--hpkc-radius);  padding: clamp(24px, 3vw, 32px) 20px;  color: var(--hpkc-cream);  overflow: hidden;  border: 1px solid rgba(201,162,39,0.3);  transition: transform 0.4s ease, box-shadow 0.4s ease;}.hpkc__house::before {  content: \"\";  position: absolute;  inset: 0;  background: radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,0.12), transparent 60%);  pointer-events: none;}.hpkc__house:hover { transform: translateY(-6px) scale(1.015); box-shadow: var(--hpkc-shadow); }.hpkc__house--red    { background: linear-gradient(160deg, #7a2329, #3d1216); }.hpkc__house--green  { background: linear-gradient(160deg, #235140, #11271f); }.hpkc__house--blue   { background: linear-gradient(160deg, #234063, #101d30); }.hpkc__house--yellow { background: linear-gradient(160deg, #9c7320, #4f3a0f); }.hpkc__house-crest {  font-size: 30px;  margin-bottom: 12px;  position: relative;  z-index: 1;  transition: transform 0.4s ease;}.hpkc__house:hover .hpkc__house-crest { transform: scale(1.18) rotate(4deg); }.hpkc__house h3 {  position: relative;  z-index: 1;  font-family: var(--hpkc-display);  font-weight: 700;  font-size: clamp(16px, 2vw, 19px);  margin: 0 0 6px;  letter-spacing: 0.04em;}.hpkc__house p {  position: relative;  z-index: 1;  margin: 0;  font-size: 14.5px;  color: rgba(251,246,233,0.85);  font-style: italic;}\/* ================================================================= *\/\/*  COMPATIBILITY                                                    *\/\/* ================================================================= *\/.hpkc__compat {  background: linear-gradient(180deg, #fffaf0, #f4ecd8);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius-lg);  padding: clamp(26px, 4vw, 46px);}.hpkc__chips {  display: flex;  flex-wrap: wrap;  justify-content: center;  gap: 10px;  margin: 0 auto;  max-width: 1200px;}.hpkc__chip {  font-family: var(--hpkc-display);  font-weight: 600;  font-size: clamp(13px, 1.6vw, 15px);  letter-spacing: 0.04em;  color: var(--hpkc-ink);  padding: 10px 16px;  border-radius: 999px;  background: #fffdf6;  border: 1px solid var(--hpkc-line);  transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;}.hpkc__chip:hover {  transform: translateY(-4px) scale(1.04);  background: var(--hpkc-ink);  color: var(--hpkc-gold-soft);  border-color: var(--hpkc-ink);  box-shadow: var(--hpkc-shadow-sm);}.hpkc__chip small { font-size: 0.8em; opacity: 0.7; }.hpkc__notes {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));  gap: 14px;  margin-top: clamp(24px, 3vw, 32px);  text-align: left;}.hpkc__note {  display: flex;  gap: 14px;  align-items: flex-start;  padding: 20px 22px;  border-radius: 14px;  border: 1px solid var(--hpkc-line-soft);  background: #fffdf6;  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__note:hover {  transform: translateY(-4px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.45);}.hpkc__note-ic {  flex: none;  width: 40px; height: 40px;  border-radius: 10px;  display: flex; align-items: center; justify-content: center;  font-size: 18px;  transition: transform 0.3s ease;}.hpkc__note:hover .hpkc__note-ic { transform: scale(1.12); }.hpkc__note--ok  .hpkc__note-ic { background: rgba(30,68,53,0.12);  color: #1e4435; }.hpkc__note--no  .hpkc__note-ic { background: rgba(110,31,36,0.12); color: #6e1f24; }.hpkc__note--tip .hpkc__note-ic { background: rgba(201,162,39,0.16);color: #8a6d18; }.hpkc__note-text { line-height: 1.6; }.hpkc__note h4 {  font-family: var(--hpkc-display);  font-size: 15.5px;  margin: 3px 0 6px;          \/* proper spacing under the heading *\/  line-height: 1.4;  color: var(--hpkc-ink);}.hpkc__note p { margin: 0; font-size: 15px; color: #544b3a; line-height: 1.6; }\/* ================================================================= *\/\/*  SPECIFICATIONS TABLE                                             *\/\/* ================================================================= *\/.hpkc__table-wrap {  max-width: 1200px;  margin: 0 auto;  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  overflow: hidden;  background: #fffdf6;}.hpkc__table {  width: 100%;  border-collapse: collapse;  text-align: left;  font-size: clamp(15px, 1.7vw, 17px);}.hpkc__table tr { transition: background 0.25s ease; }.hpkc__table tr:hover { background: rgba(201,162,39,0.08); }.hpkc__table tr + tr { border-top: 1px solid var(--hpkc-line-soft); }.hpkc__table th,.hpkc__table td { padding: 15px 22px; vertical-align: top; }.hpkc__table th {  width: 42%;  font-family: var(--hpkc-display);  font-weight: 600;  letter-spacing: 0.08em;  text-transform: uppercase;  font-size: 0.82em;  color: var(--hpkc-gold-deep);}.hpkc__table td { color: var(--hpkc-ink); font-weight: 500; }\/* ================================================================= *\/\/*  GALLERY — slices stitched seamlessly (no gaps)                   *\/\/* ================================================================= *\/.hpkc__gallery {  display: flex;  flex-direction: column;  gap: 0;  border-radius: var(--hpkc-radius);  overflow: hidden;  border: 1px solid var(--hpkc-line);  background: #fffdf6;  box-shadow: var(--hpkc-shadow-sm);  transition: transform 0.4s ease, box-shadow 0.4s ease;}.hpkc__gallery:hover { transform: translateY(-4px); box-shadow: var(--hpkc-shadow); }.hpkc__frame {  position: relative;  display: block;  margin: 0;  padding: 0;}.hpkc__frame img {  width: 100%;  display: block;  height: auto;  margin: 0;  vertical-align: top;          \/* removes baseline hairline gap *\/}\/* ================================================================= *\/\/*  INSTALLATION STEPS                                               *\/\/* ================================================================= *\/.hpkc__steps {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));  gap: var(--hpkc-gap);  text-align: left;}.hpkc__step {  position: relative;  background: linear-gradient(180deg, #fffaf0, #f4ecd8);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  padding: clamp(22px, 3vw, 28px);  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__step:hover {  transform: translateY(-5px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__step-num {  font-family: var(--hpkc-deco);  font-weight: 900;  font-size: 30px;  color: var(--hpkc-gold);  line-height: 1;  margin-bottom: 12px;  transition: transform 0.35s ease;}.hpkc__step:hover .hpkc__step-num { transform: scale(1.12); }.hpkc__step h4 {  font-family: var(--hpkc-display);  font-size: 16.5px;  margin: 0 0 7px;  color: var(--hpkc-ink);}.hpkc__step p { margin: 0; font-size: 15px; color: #544b3a; line-height: 1.65; }\/* ================================================================= *\/\/*  CARE GUIDE                                                       *\/\/* ================================================================= *\/.hpkc__care {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));  gap: var(--hpkc-gap);  text-align: left;}.hpkc__care-card {  background: linear-gradient(180deg, #fffaf0, #f4ecd8);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  padding: clamp(20px, 3vw, 26px);  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__care-card:hover {  transform: translateY(-5px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__care-num {  font-family: var(--hpkc-deco);  font-weight: 900;  font-size: 28px;  color: var(--hpkc-gold);  line-height: 1;  margin-bottom: 10px;  transition: transform 0.35s ease;}.hpkc__care-card:hover .hpkc__care-num { transform: scale(1.12); }.hpkc__care-card h4 {  font-family: var(--hpkc-display);  font-size: 16.5px;  margin: 0 0 7px;  color: var(--hpkc-ink);}.hpkc__care-card p { margin: 0; font-size: 15px; color: #544b3a; line-height: 1.65; }\/* ================================================================= *\/\/*  WHY FANS LOVE IT — highlight strip                               *\/\/* ================================================================= *\/.hpkc__loves {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));  gap: var(--hpkc-gap);  text-align: center;}.hpkc__love {  padding: clamp(22px, 3vw, 30px) 18px;  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  background: #fffdf6;  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__love:hover {  transform: translateY(-5px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__love-num {  font-family: var(--hpkc-deco);  font-weight: 900;  font-size: clamp(30px, 4vw, 42px);  background: linear-gradient(180deg, #e3c768, #8a6d18);  -webkit-background-clip: text;  background-clip: text;  -webkit-text-fill-color: transparent;  color: transparent;  line-height: 1;  margin-bottom: 8px;}.hpkc__love-t {  font-family: var(--hpkc-display);  font-weight: 600;  font-size: 15px;  color: var(--hpkc-ink);}\/* ================================================================= *\/\/*  FAQ — CSS-only accordion (no JavaScript)                         *\/\/* ================================================================= *\/.hpkc__faq { max-width: 1200px; margin: 0 auto; text-align: left; }.hpkc__faq details {  border: 1px solid var(--hpkc-line);  border-radius: 14px;  background: #fffdf6;  margin-bottom: 12px;  overflow: hidden;  transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;}.hpkc__faq details:hover {  border-color: rgba(201,162,39,0.55);  box-shadow: var(--hpkc-shadow-sm);}.hpkc__faq details[open] {  border-color: rgba(201,162,39,0.55);  box-shadow: var(--hpkc-shadow-sm);}.hpkc__faq summary {  list-style: none;  cursor: pointer;  padding: 18px 22px;  font-family: var(--hpkc-display);  font-weight: 600;  font-size: clamp(15px, 1.8vw, 17px);  color: var(--hpkc-ink);  display: flex;  align-items: center;  justify-content: space-between;  gap: 14px;  transition: color 0.25s ease;}.hpkc__faq summary:hover { color: var(--hpkc-gold-deep); }.hpkc__faq summary::-webkit-details-marker { display: none; }.hpkc__faq summary::after {  content: \"+\";  font-family: var(--hpkc-display);  font-weight: 700;  font-size: 22px;  color: var(--hpkc-gold);  transition: transform 0.3s ease;  line-height: 1;}.hpkc__faq details[open] summary::after { transform: rotate(45deg); }.hpkc__faq-body {  padding: 0 22px 20px;  color: #544b3a;  font-size: 16px;  line-height: 1.7;}\/* ================================================================= *\/\/*  GIFT BANNER                                                      *\/\/* ================================================================= *\/.hpkc__gift {  position: relative;  text-align: center;  border-radius: var(--hpkc-radius-lg);  overflow: hidden;  padding: clamp(30px, 5vw, 52px) clamp(20px, 4vw, 40px);  background: linear-gradient(160deg, #fffaf0, #efe3c6);  border: 1px solid var(--hpkc-line);  box-shadow: var(--hpkc-shadow-sm);}.hpkc__gift-ic {  font-size: 38px;  margin-bottom: 12px;  display: inline-block;  transition: transform 0.4s ease;}.hpkc__gift:hover .hpkc__gift-ic { transform: scale(1.14) rotate(-6deg); }.hpkc__gift h2 {  font-family: var(--hpkc-deco);  font-weight: 900;  font-size: clamp(24px, 4vw, 36px);  color: var(--hpkc-ink);  margin: 0 0 12px;}.hpkc__gift p {  max-width: 1200px;  margin: 0 auto;  color: var(--hpkc-text);  font-size: clamp(16px, 1.8vw, 19px);}\/* ================================================================= *\/\/*  TRUST STRIP                                                      *\/\/* ================================================================= *\/.hpkc__trust {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));  gap: 14px;  text-align: center;}.hpkc__trust-item {  padding: 22px 14px;  border: 1px solid var(--hpkc-line);  border-radius: 14px;  background: #fffdf6;  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;}.hpkc__trust-item:hover {  transform: translateY(-5px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__trust-ic { font-size: 24px; transition: transform 0.35s ease; display: inline-block; }.hpkc__trust-item:hover .hpkc__trust-ic { transform: scale(1.18); }.hpkc__trust-t {  font-family: var(--hpkc-display);  font-weight: 600;  font-size: 14.5px;  margin: 8px 0 2px;  color: var(--hpkc-ink);}.hpkc__trust-s { font-size: 13px; color: var(--hpkc-text-soft); }\/* ================================================================= *\/\/*  CLOSING CTA                                                      *\/\/* ================================================================= *\/.hpkc__cta {  position: relative;  text-align: center;  border-radius: var(--hpkc-radius-lg);  overflow: hidden;  padding: clamp(36px, 6vw, 66px) clamp(20px, 4vw, 40px);  background:    radial-gradient(90% 120% at 50% 0%, rgba(201,162,39,0.18), transparent 60%),    linear-gradient(160deg, #1d1a14, #14110d);  color: var(--hpkc-parchment);  border: 1px solid rgba(201,162,39,0.3);  box-shadow: var(--hpkc-shadow);}.hpkc__cta .hpkc__stars { opacity: 0.7; }.hpkc__cta h2 {  position: relative;  z-index: 2;  font-family: var(--hpkc-deco);  font-weight: 900;  font-size: clamp(26px, 5vw, 46px);  margin: 0 0 14px;  color: var(--hpkc-cream);  text-shadow: 0 0 26px rgba(201,162,39,0.3);}.hpkc__cta p {  position: relative;  z-index: 2;  max-width: 1200px;  margin: 0 auto;  color: rgba(244,236,216,0.86);  font-style: italic;  font-size: clamp(16px, 2vw, 20px);}\/* clickable seal -\u003e scrolls to Add to Cart *\/.hpkc__cta-seal {  position: relative;  z-index: 2;  display: inline-flex;  align-items: center;  gap: 10px;  margin-top: clamp(22px, 3.5vw, 30px);  font-family: var(--hpkc-display);  letter-spacing: 0.2em;  text-transform: uppercase;  font-size: clamp(11px, 1.6vw, 13px);  color: var(--hpkc-gold-soft);  padding: 14px 26px;  border: 1px solid rgba(201,162,39,0.45);  border-radius: 999px;  background: rgba(201,162,39,0.08);  cursor: pointer;  text-decoration: none;  transition: background 0.3s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease, color 0.3s ease;}.hpkc__cta-seal:hover {  background: rgba(201,162,39,0.2);  border-color: var(--hpkc-gold);  transform: translateY(-3px) scale(1.02);  box-shadow: 0 12px 30px -12px rgba(201,162,39,0.65);  color: var(--hpkc-cream);}.hpkc__cta-seal:active { transform: translateY(-1px) scale(0.99); }\/* ================================================================= *\/\/*  OUR PROMISE — shipping \u0026 assurance band                          *\/\/* ================================================================= *\/.hpkc__promise {  display: grid;  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));  gap: var(--hpkc-gap);  text-align: left;}.hpkc__promise-card {  position: relative;  background: linear-gradient(180deg, #fffaf0, #f1e7cf);  border: 1px solid var(--hpkc-line);  border-radius: var(--hpkc-radius);  padding: clamp(22px, 3vw, 30px);  overflow: hidden;  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;}.hpkc__promise-card:hover {  transform: translateY(-5px);  box-shadow: var(--hpkc-shadow-sm);  border-color: rgba(201,162,39,0.55);}.hpkc__promise-ic {  font-size: 28px;  margin-bottom: 12px;  display: inline-block;  transition: transform 0.4s ease;}.hpkc__promise-card:hover .hpkc__promise-ic { transform: scale(1.14) rotate(-6deg); }.hpkc__promise-card h4 {  font-family: var(--hpkc-display);  font-weight: 700;  font-size: clamp(16px, 2vw, 19px);  margin: 0 0 8px;  color: var(--hpkc-ink);}.hpkc__promise-card p {  margin: 0;  font-size: 15px;  color: #544b3a;  line-height: 1.65;}\/* ================================================================= *\/\/*  RESPONSIVE — TABLET                                              *\/\/* ================================================================= *\/@media (max-width: 900px) {  .hpkc { font-size: 17px; }  .hpkc__spotlight h2 { max-width: 100%; }}\/* ================================================================= *\/\/*  RESPONSIVE — MOBILE                                              *\/\/* ================================================================= *\/@media (max-width: 600px) {  .hpkc { padding: 0; font-size: 16.5px; }  .hpkc__inner { padding: 18px 14px; }  .hpkc__features,  .hpkc__profiles,  .hpkc__houses,  .hpkc__split,  .hpkc__steps,  .hpkc__care,  .hpkc__loves,  .hpkc__promise,  .hpkc__notes,  .hpkc__spec-grid,  .hpkc__trust { grid-template-columns: 1fr; }  .hpkc__eyebrow { letter-spacing: 0.26em; }  .hpkc__title { font-size: clamp(26px, 9vw, 38px); }  .hpkc__spotlight,  .hpkc__spotlight h2,  .hpkc__spotlight \u003e p { text-align: center; }  .hpkc__spotlight .hpkc__kicker { justify-content: center; }  .hpkc__spotlight \u003e p { margin-left: auto; margin-right: auto; }  .hpkc__table th { width: 50%; }}\/* ================================================================= *\/\/*  REDUCED MOTION                                                   *\/\/* ================================================================= *\/@media (prefers-reduced-motion: reduce) {  .hpkc * { animation: none !important; transition: none !important; }}\u003c\/style\u003e\u003c!-- ================================================================= --\u003e\u003c!--  MARKUP                                                           --\u003e\u003c!--  lang=\"en\" =\u003e uppercase \"i\" renders as \"I\", not the Turkish form  --\u003e\u003c!-- ================================================================= --\u003e\u003cdiv class=\"hpkc\" lang=\"en\"\u003e  \u003cdiv class=\"hpkc__sheet\"\u003e    \u003cdiv class=\"hpkc__inner\"\u003e      \u003c!-- ======================= HERO ======================= --\u003e      \u003cheader class=\"hpkc__hero\"\u003e        \u003cdiv class=\"hpkc__stars\"\u003e\u003c\/div\u003e        \u003cspan class=\"hpkc__eyebrow\"\u003eWizarding Collection\u003c\/span\u003e        \u003ch1 class=\"hpkc__title\"\u003e          Harry Potter\u003cbr\u003e          \u003cspan class=\"hpkc__gold\"\u003eTheme Keycap Set\u003c\/span\u003e        \u003c\/h1\u003e        \u003cp class=\"hpkc__subtitle\"\u003e          Accio, magic. Summon the spellbound world of Hogwarts to your          fingertips and turn an ordinary keyboard into something          truly enchanted.        \u003c\/p\u003e        \u003cdiv class=\"hpkc__hero-rule\"\u003e\u003cspan\u003e✦   ⚡   ✦\u003c\/span\u003e\u003c\/div\u003e        \u003cdiv class=\"hpkc__badges\"\u003e          \u003cspan class=\"hpkc__badge\"\u003e\u003cspan\u003e🧙\u003c\/span\u003e\u003cspan\u003eWizarding Design\u003c\/span\u003e\u003c\/span\u003e          \u003cspan class=\"hpkc__badge\"\u003e\u003cspan\u003e🔮\u003c\/span\u003e\u003cspan\u003ePremium PBT\u003c\/span\u003e\u003c\/span\u003e          \u003cspan class=\"hpkc__badge\"\u003e\u003cspan\u003e✨\u003c\/span\u003e\u003cspan\u003eDye-Sub Legends\u003c\/span\u003e\u003c\/span\u003e          \u003cspan class=\"hpkc__badge\"\u003e\u003cspan\u003e⌨️\u003c\/span\u003e\u003cspan\u003eMX Compatible\u003c\/span\u003e\u003c\/span\u003e        \u003c\/div\u003e      \u003c\/header\u003e      \u003c!-- ======================= INTRO ======================= --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eThe Enchantment\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eA Keyboard Worthy of the Great Hall\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__prose\"\u003e          \u003cp\u003e            Transform your mechanical keyboard with a set inspired by the            legendary world of Hogwarts. Iconic symbols, storied spells and            subtle magical detailing bring a refined wizarding aesthetic to            your setup — equally at home during late-night study sessions,            marathon gaming raids, or everyday spellwork at your desk.          \u003c\/p\u003e          \u003cp\u003e            Crafted from durable \u003cstrong\u003ePBT material\u003c\/strong\u003e using a precise            \u003cstrong\u003edye-sublimation process\u003c\/strong\u003e, every legend stays sharp,            fade-resistant and beautiful for years. The lightly textured surface            resists shine and wear, so your keys feel as good on day one thousand            as they did on day one.          \u003c\/p\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== FEATURE GRID ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eWhy You'll Love It\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eKey Features\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__features\"\u003e          \u003carticle class=\"hpkc__feature\"\u003e            \u003cdiv class=\"hpkc__feature-icon\"\u003e🧙\u003c\/div\u003e            \u003ch3\u003eWizarding Design\u003c\/h3\u003e            \u003cp\u003eHouse crests, enchanted spells and magical detailing woven               across the set for true fans of the wizarding world.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__feature\"\u003e            \u003cdiv class=\"hpkc__feature-icon\"\u003e🔮\u003c\/div\u003e            \u003ch3\u003ePBT Construction\u003c\/h3\u003e            \u003cp\u003eThick, durable PBT that is oil-resistant and long-lasting —               built to survive years of casting.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__feature\"\u003e            \u003cdiv class=\"hpkc__feature-icon\"\u003e✨\u003c\/div\u003e            \u003ch3\u003eDye-Sub Legends\u003c\/h3\u003e            \u003cp\u003eClean, razor-sharp, fade-proof printing baked into the cap so               your spells never wash away.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__feature\"\u003e            \u003cdiv class=\"hpkc__feature-icon\"\u003e⌨️\u003c\/div\u003e            \u003ch3\u003eProfile Options\u003c\/h3\u003e            \u003cp\u003eChoose your typing feel — available in Cherry, MOA and SOA               profiles to match your preference.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__feature\"\u003e            \u003cdiv class=\"hpkc__feature-icon\"\u003e🔗\u003c\/div\u003e            \u003ch3\u003eMX-Style Compatible\u003c\/h3\u003e            \u003cp\u003eFits Cherry MX, Gateron, Kailh and most MX-style switches you               already love.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__feature\"\u003e            \u003cdiv class=\"hpkc__feature-icon\"\u003e🛡️\u003c\/div\u003e            \u003ch3\u003eShine Resistant\u003c\/h3\u003e            \u003cp\u003eA subtly textured finish keeps every keycap looking matte,               premium and glare-free.\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- =================== CRAFTSMANSHIP =================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__spotlight\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eCrafted to Endure\u003c\/div\u003e          \u003ch2\u003eForged in PBT, Sealed by Dye-Sublimation\u003c\/h2\u003e          \u003cp\u003e            Lesser keycaps rely on coatings and print-on-top legends that fade,            grease over and shine within months. This set is built differently.            Dense PBT plastic delivers a deep, deadened sound and a textured feel,            while dye-sublimated legends are infused into the surface itself —            never to peel, smudge or vanish.          \u003c\/p\u003e          \u003cdiv class=\"hpkc__spec-grid\"\u003e            \u003cdiv class=\"hpkc__spec\"\u003e              \u003cdiv class=\"hpkc__spec-k\"\u003eMaterial\u003c\/div\u003e              \u003cdiv class=\"hpkc__spec-v\"\u003ePremium PBT\u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__spec\"\u003e              \u003cdiv class=\"hpkc__spec-k\"\u003ePrinting\u003c\/div\u003e              \u003cdiv class=\"hpkc__spec-v\"\u003eDye-Sublimation\u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__spec\"\u003e              \u003cdiv class=\"hpkc__spec-k\"\u003eProfiles\u003c\/div\u003e              \u003cdiv class=\"hpkc__spec-v\"\u003eCherry · MOA · SOA\u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__spec\"\u003e              \u003cdiv class=\"hpkc__spec-k\"\u003eMount\u003c\/div\u003e              \u003cdiv class=\"hpkc__spec-v\"\u003eMX-Style Stem\u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__spec\"\u003e              \u003cdiv class=\"hpkc__spec-k\"\u003eFinish\u003c\/div\u003e              \u003cdiv class=\"hpkc__spec-v\"\u003eMatte · Anti-Shine\u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__spec\"\u003e              \u003cdiv class=\"hpkc__spec-k\"\u003eTheme\u003c\/div\u003e              \u003cdiv class=\"hpkc__spec-v\"\u003eWizarding World\u003c\/div\u003e            \u003c\/div\u003e          \u003c\/div\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- =================== SOUND \u0026 FEEL =================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eThe Experience\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eSound \u0026amp; Feel\u003c\/h2\u003e          \u003cp class=\"hpkc__lead\"\u003eMore than a look — these keycaps change how your            board sounds and feels under your fingers.\u003c\/p\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__split\"\u003e          \u003carticle class=\"hpkc__panel\"\u003e            \u003cspan class=\"hpkc__panel-ic\"\u003e🔊\u003c\/span\u003e            \u003ch3\u003eA Deeper, Richer Sound\u003c\/h3\u003e            \u003cp\u003eThick PBT walls dampen the high-pitched ping of thinner caps,               giving every keystroke a fuller, more grounded \"thock\" that feels               as premium as it sounds.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__panel\"\u003e            \u003cspan class=\"hpkc__panel-ic\"\u003e🤚\u003c\/span\u003e            \u003ch3\u003eA Textured, Grippy Touch\u003c\/h3\u003e            \u003cp\u003eThe fine matte texture adds confident grip and a tactile warmth,               while resisting the greasy shine that smooth ABS caps develop               over time.\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== PROFILES ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eChoose Your Feel\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eThree Profiles, One Spell\u003c\/h2\u003e          \u003cp class=\"hpkc__lead\"\u003eEach sculpt changes the height and curve of the            keys — pick the typing experience that suits your style.\u003c\/p\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__profiles\"\u003e          \u003carticle class=\"hpkc__profile\"\u003e            \u003cdiv class=\"hpkc__profile-glyph\"\u003eC\u003c\/div\u003e            \u003ch3\u003eCherry\u003c\/h3\u003e            \u003cspan class=\"hpkc__profile-tag\"\u003eLow · Classic\u003c\/span\u003e            \u003cp\u003eThe enthusiast favourite. A low, sculpted profile that feels               familiar, fast and refined for everyday typing.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__profile\"\u003e            \u003cdiv class=\"hpkc__profile-glyph\"\u003eM\u003c\/div\u003e            \u003ch3\u003eMOA\u003c\/h3\u003e            \u003cspan class=\"hpkc__profile-tag\"\u003eMedium · Sculpted\u003c\/span\u003e            \u003cp\u003eA comfortable medium-height sculpt with gently dished tops that               cradle your fingertips for relaxed sessions.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__profile\"\u003e            \u003cdiv class=\"hpkc__profile-glyph\"\u003eS\u003c\/div\u003e            \u003ch3\u003eSOA\u003c\/h3\u003e            \u003cspan class=\"hpkc__profile-tag\"\u003eTall · Spherical\u003c\/span\u003e            \u003cp\u003eA taller, spherical profile with a vintage feel and a deep,               satisfying landing on every keystroke.\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== HOUSE COLOURS ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eShow Your Colours\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eFour Houses of Magic\u003c\/h2\u003e          \u003cp class=\"hpkc__lead\"\u003eAccents inspired by the four legendary houses —            wear your allegiance on your desk.\u003c\/p\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__houses\"\u003e          \u003carticle class=\"hpkc__house hpkc__house--red\"\u003e            \u003cdiv class=\"hpkc__house-crest\"\u003e🦁\u003c\/div\u003e            \u003ch3\u003eThe Brave\u003c\/h3\u003e            \u003cp\u003eCourage \u0026amp; daring · crimson and gold\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__house hpkc__house--green\"\u003e            \u003cdiv class=\"hpkc__house-crest\"\u003e🐍\u003c\/div\u003e            \u003ch3\u003eThe Cunning\u003c\/h3\u003e            \u003cp\u003eAmbition \u0026amp; resolve · emerald and silver\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__house hpkc__house--blue\"\u003e            \u003cdiv class=\"hpkc__house-crest\"\u003e🦅\u003c\/div\u003e            \u003ch3\u003eThe Wise\u003c\/h3\u003e            \u003cp\u003eWit \u0026amp; learning · sapphire and bronze\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__house hpkc__house--yellow\"\u003e            \u003cdiv class=\"hpkc__house-crest\"\u003e🦡\u003c\/div\u003e            \u003ch3\u003eThe Loyal\u003c\/h3\u003e            \u003cp\u003ePatience \u0026amp; kindness · amber and black\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== COMPATIBILITY ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eWill It Fit?\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eCompatibility\u003c\/h2\u003e          \u003cp class=\"hpkc__lead\"\u003eDesigned to support the most popular mechanical            keyboard layouts on the market.\u003c\/p\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__compat\"\u003e          \u003cdiv class=\"hpkc__chips\"\u003e            \u003cspan class=\"hpkc__chip\"\u003e61\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e64\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e68\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e75\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e84\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e87\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e96\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e98\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e100\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e104\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e            \u003cspan class=\"hpkc__chip\"\u003e108\u003csmall\u003e key\u003c\/small\u003e\u003c\/span\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__notes\"\u003e            \u003cdiv class=\"hpkc__note hpkc__note--ok\"\u003e              \u003cdiv class=\"hpkc__note-ic\"\u003e✔\u003c\/div\u003e              \u003cdiv class=\"hpkc__note-text\"\u003e                \u003ch4\u003eMost Standard Layouts\u003c\/h4\u003e                \u003cp\u003eWorks beautifully with the popular layouts listed above.\u003c\/p\u003e              \u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__note hpkc__note--no\"\u003e              \u003cdiv class=\"hpkc__note-ic\"\u003e✕\u003c\/div\u003e              \u003cdiv class=\"hpkc__note-text\"\u003e                \u003ch4\u003eA Few Exceptions\u003c\/h4\u003e                \u003cp\u003eNot compatible with 6U or 6.5U spacebars or ultra-thin                   layouts.\u003c\/p\u003e              \u003c\/div\u003e            \u003c\/div\u003e            \u003cdiv class=\"hpkc__note hpkc__note--tip\"\u003e              \u003cdiv class=\"hpkc__note-ic\"\u003e💡\u003c\/div\u003e              \u003cdiv class=\"hpkc__note-text\"\u003e                \u003ch4\u003eNeed Help Choosing?\u003c\/h4\u003e                \u003cp\u003eUnsure about your board? Message us with your keyboard model                   and we'll happily confirm the fit before you buy.\u003c\/p\u003e              \u003c\/div\u003e            \u003c\/div\u003e          \u003c\/div\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== SPECIFICATIONS ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eThe Fine Print\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eSpecifications\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__table-wrap\"\u003e          \u003ctable class=\"hpkc__table\"\u003e            \u003ctbody\u003e              \u003ctr\u003e\n\u003cth\u003eMaterial\u003c\/th\u003e\n\u003ctd\u003ePremium PBT (thick-walled)\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eLegend Process\u003c\/th\u003e\n\u003ctd\u003eDye-Sublimation (fade-proof)\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eProfiles Available\u003c\/th\u003e\n\u003ctd\u003eCherry · MOA · SOA\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eFinish\u003c\/th\u003e\n\u003ctd\u003eTextured matte, anti-shine\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eStem Type\u003c\/th\u003e\n\u003ctd\u003eMX-Style (cross stem)\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eSwitch Compatibility\u003c\/th\u003e\n\u003ctd\u003eCherry MX, Gateron, Kailh \u0026amp; most MX clones\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eSupported Layouts\u003c\/th\u003e\n\u003ctd\u003e61 \/ 64 \/ 68 \/ 75 \/ 84 \/ 87 \/ 96 \/ 98 \/ 100 \/ 104 \/ 108-key\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eNot Compatible\u003c\/th\u003e\n\u003ctd\u003e6U \u0026amp; 6.5U spacebars, ultra-thin layouts\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eTheme\u003c\/th\u003e\n\u003ctd\u003eWizarding World\u003c\/td\u003e\n\u003c\/tr\u003e              \u003ctr\u003e\n\u003cth\u003eIn the Box\u003c\/th\u003e\n\u003ctd\u003eKeycap set + keycap puller\u003c\/td\u003e\n\u003c\/tr\u003e            \u003c\/tbody\u003e          \u003c\/table\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== GALLERY ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eA Closer Look\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eAbout the Keyboard\u003c\/h2\u003e          \u003cp class=\"hpkc__lead\"\u003eEvery detail, captured up close — scroll through            the full gallery below.\u003c\/p\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__gallery\"\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_1.jpg?v=1767963642\" alt=\"Harry Potter theme keycap set detail 1\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_2.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 2\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_3.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 3\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_4.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 4\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_5.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 5\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_6.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 6\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_7.jpg?v=1767963816\" alt=\"Harry Potter theme keycap set detail 7\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_8.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 8\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_9.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 9\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_10.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 10\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_11.jpg?v=1767963816\" alt=\"Harry Potter theme keycap set detail 11\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_12.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 12\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_13.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 13\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_14.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 14\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_15.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 15\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_16.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 16\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_17.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 17\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_18.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 18\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_19.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 19\" loading=\"lazy\"\u003e\u003c\/figure\u003e          \u003cfigure class=\"hpkc__frame\"\u003e\u003cimg src=\"https:\/\/cdn.shopify.com\/s\/files\/1\/0684\/6962\/0893\/files\/Detail_Images_20.jpg?v=1767963815\" alt=\"Harry Potter theme keycap set detail 20\" loading=\"lazy\"\u003e\u003c\/figure\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== INSTALLATION ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eEasy Setup\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eCasting the Spell — Installation\u003c\/h2\u003e          \u003cp class=\"hpkc__lead\"\u003eNo wand required. Swap your keycaps in minutes            with the included puller.\u003c\/p\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__steps\"\u003e          \u003carticle class=\"hpkc__step\"\u003e            \u003cdiv class=\"hpkc__step-num\"\u003e01\u003c\/div\u003e            \u003ch4\u003ePull the Old Caps\u003c\/h4\u003e            \u003cp\u003eSlide the wire keycap puller over each cap and lift straight up to               remove your existing keycaps.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__step\"\u003e            \u003cdiv class=\"hpkc__step-num\"\u003e02\u003c\/div\u003e            \u003ch4\u003eMatch the Layout\u003c\/h4\u003e            \u003cp\u003eLay out the new set to match your board, lining up modifiers and               the spacebar before mounting.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__step\"\u003e            \u003cdiv class=\"hpkc__step-num\"\u003e03\u003c\/div\u003e            \u003ch4\u003ePress Into Place\u003c\/h4\u003e            \u003cp\u003eAlign each cap over its switch stem and press down gently until it               clicks securely into position.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__step\"\u003e            \u003cdiv class=\"hpkc__step-num\"\u003e04\u003c\/div\u003e            \u003ch4\u003eCast Away\u003c\/h4\u003e            \u003cp\u003eGive your board a quick once-over, then enjoy a desk that looks               and feels truly magical.\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== CARE GUIDE ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eKeep the Magic Alive\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eCare \u0026amp; Keeping\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__care\"\u003e          \u003carticle class=\"hpkc__care-card\"\u003e            \u003cdiv class=\"hpkc__care-num\"\u003e01\u003c\/div\u003e            \u003ch4\u003eGentle Cleaning\u003c\/h4\u003e            \u003cp\u003eWipe keycaps with a soft, slightly damp cloth. For a deeper               clean, remove them and rinse in warm soapy water.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__care-card\"\u003e            \u003cdiv class=\"hpkc__care-num\"\u003e02\u003c\/div\u003e            \u003ch4\u003eDry Fully\u003c\/h4\u003e            \u003cp\u003eAlways let keycaps dry completely before remounting them on your               switches to protect your board.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__care-card\"\u003e            \u003cdiv class=\"hpkc__care-num\"\u003e03\u003c\/div\u003e            \u003ch4\u003eUse a Puller\u003c\/h4\u003e            \u003cp\u003eRemove caps with a wire keycap puller to avoid scratching the               legends or bending the stems.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__care-card\"\u003e            \u003cdiv class=\"hpkc__care-num\"\u003e04\u003c\/div\u003e            \u003ch4\u003eAvoid Harsh Chemicals\u003c\/h4\u003e            \u003cp\u003eSkip solvents and abrasive cleaners. PBT and dye-sub legends only               need water and a little care.\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== WHY FANS LOVE IT ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eAt a Glance\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eWhy Fans Love It\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__loves\"\u003e          \u003cdiv class=\"hpkc__love\"\u003e            \u003cdiv class=\"hpkc__love-num\"\u003e3\u003c\/div\u003e            \u003cdiv class=\"hpkc__love-t\"\u003eProfile Options\u003c\/div\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__love\"\u003e            \u003cdiv class=\"hpkc__love-num\"\u003e11+\u003c\/div\u003e            \u003cdiv class=\"hpkc__love-t\"\u003eLayouts Supported\u003c\/div\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__love\"\u003e            \u003cdiv class=\"hpkc__love-num\"\u003e100%\u003c\/div\u003e            \u003cdiv class=\"hpkc__love-t\"\u003ePBT Material\u003c\/div\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__love\"\u003e            \u003cdiv class=\"hpkc__love-num\"\u003e∞\u003c\/div\u003e            \u003cdiv class=\"hpkc__love-t\"\u003eFade-Proof Legends\u003c\/div\u003e          \u003c\/div\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== FAQ ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eAnswers\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eFrequently Asked Questions\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__faq\"\u003e          \u003cdetails open\u003e            \u003csummary\u003eWill this fit my keyboard?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              The set supports most standard layouts including 61, 64, 68, 75,              84, 87, 96, 98, 100, 104 and 108-key boards. It is not compatible              with 6U or 6.5U spacebars or ultra-thin layouts. If you're unsure,              send us your keyboard model and we'll confirm before you order.            \u003c\/div\u003e          \u003c\/details\u003e          \u003cdetails\u003e            \u003csummary\u003eWhat switches does it work with?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              The keycaps use a standard MX-style stem, so they're compatible              with Cherry MX, Gateron, Kailh and most other MX-style switches.            \u003c\/div\u003e          \u003c\/details\u003e          \u003cdetails\u003e            \u003csummary\u003eWhat's the difference between Cherry, MOA and SOA?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              They're different keycap profiles — essentially the height and              shape of the keys. Cherry is low and classic, MOA is a comfortable              medium-height sculpt, and SOA is a taller, spherical profile with a              vintage feel. Choose whichever typing experience you prefer.            \u003c\/div\u003e          \u003c\/details\u003e          \u003cdetails\u003e            \u003csummary\u003eWill the legends fade over time?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              No. The legends are dye-sublimated, meaning the design is infused              into the PBT surface rather than printed on top. They won't peel,              smudge or fade with everyday use.            \u003c\/div\u003e          \u003c\/details\u003e          \u003cdetails\u003e            \u003csummary\u003eHow do I install the keycaps?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              It's simple. Use a keycap puller to remove your old caps, line up              the new set with your layout, and press each cap onto its switch              stem until it clicks. The whole swap usually takes just a few              minutes.            \u003c\/div\u003e          \u003c\/details\u003e          \u003cdetails\u003e            \u003csummary\u003eHow should I clean them?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              Wipe with a soft, slightly damp cloth for everyday cleaning. For a              deeper clean, remove the caps and rinse them in warm soapy water,              then dry fully before remounting. Avoid harsh solvents.            \u003c\/div\u003e          \u003c\/details\u003e          \u003cdetails\u003e            \u003csummary\u003eDoes this include a keyboard?\u003c\/summary\u003e            \u003cdiv class=\"hpkc__faq-body\"\u003e              This listing is for the keycap set only. It's designed to dress up              a mechanical keyboard you already own.            \u003c\/div\u003e          \u003c\/details\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== OUR PROMISE ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__head\"\u003e          \u003cdiv class=\"hpkc__kicker\"\u003eShop With Confidence\u003c\/div\u003e          \u003ch2 class=\"hpkc__h2\"\u003eOur Promise to You\u003c\/h2\u003e          \u003cdiv class=\"hpkc__divider\"\u003e\u003cspan class=\"hpkc__diamond\"\u003e\u003c\/span\u003e\u003c\/div\u003e        \u003c\/div\u003e        \u003cdiv class=\"hpkc__promise\"\u003e          \u003carticle class=\"hpkc__promise-card\"\u003e            \u003cspan class=\"hpkc__promise-ic\"\u003e📦\u003c\/span\u003e            \u003ch4\u003eCarefully Packed\u003c\/h4\u003e            \u003cp\u003eEvery set is securely packaged so your keycaps arrive in perfect,               ready-to-cast condition.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__promise-card\"\u003e            \u003cspan class=\"hpkc__promise-ic\"\u003e🔍\u003c\/span\u003e            \u003ch4\u003eQuality Checked\u003c\/h4\u003e            \u003cp\u003eEach order is inspected for crisp, even legends and clean,               consistent moulding before it ships.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__promise-card\"\u003e            \u003cspan class=\"hpkc__promise-ic\"\u003e💬\u003c\/span\u003e            \u003ch4\u003eReal Human Support\u003c\/h4\u003e            \u003cp\u003eQuestions about fit or profiles? Reach out any time and a real               person will help you choose.\u003c\/p\u003e          \u003c\/article\u003e          \u003carticle class=\"hpkc__promise-card\"\u003e            \u003cspan class=\"hpkc__promise-ic\"\u003e🪄\u003c\/span\u003e            \u003ch4\u003eMade for Fans\u003c\/h4\u003e            \u003cp\u003eDesigned by people who love both mechanical keyboards and the               magic that inspired this set.\u003c\/p\u003e          \u003c\/article\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== GIFT BANNER ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__gift\"\u003e          \u003cspan class=\"hpkc__gift-ic\"\u003e🎁\u003c\/span\u003e          \u003ch2\u003eThe Perfect Gift for Any Wizard\u003c\/h2\u003e          \u003cp\u003eWhether for a birthday, the holidays, or a treat for yourself, this             set is a thoughtful surprise for fans, gamers and keyboard             enthusiasts alike.\u003c\/p\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== TRUST STRIP ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__trust\"\u003e          \u003cdiv class=\"hpkc__trust-item\"\u003e            \u003cdiv class=\"hpkc__trust-ic\"\u003e🛡️\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-t\"\u003eBuilt to Last\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-s\"\u003eDurable PBT material\u003c\/div\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__trust-item\"\u003e            \u003cdiv class=\"hpkc__trust-ic\"\u003e✨\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-t\"\u003eFade-Proof\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-s\"\u003eDye-sublimated legends\u003c\/div\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__trust-item\"\u003e            \u003cdiv class=\"hpkc__trust-ic\"\u003e💬\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-t\"\u003eFriendly Support\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-s\"\u003eHere to help you choose\u003c\/div\u003e          \u003c\/div\u003e          \u003cdiv class=\"hpkc__trust-item\"\u003e            \u003cdiv class=\"hpkc__trust-ic\"\u003e🪄\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-t\"\u003eFan-Crafted\u003c\/div\u003e            \u003cdiv class=\"hpkc__trust-s\"\u003eDesigned for true fans\u003c\/div\u003e          \u003c\/div\u003e        \u003c\/div\u003e      \u003c\/section\u003e      \u003c!-- ===================== CLOSING CTA ===================== --\u003e      \u003csection class=\"hpkc__section\"\u003e        \u003cdiv class=\"hpkc__cta\"\u003e          \u003cdiv class=\"hpkc__stars\"\u003e\u003c\/div\u003e          \u003ch2\u003eReady to Cast Your First Spell?\u003c\/h2\u003e          \u003cp\u003eA refined, magical keycap set designed for true fans of the             wizarding world. Mischief — and immaculate typing — managed.\u003c\/p\u003e                  \u003c\/div\u003e      \u003c\/section\u003e    \u003c\/div\u003e  \u003c\/div\u003e\n\u003c\/div\u003e\u003cnoscript\u003e\/* The closing seal scrolls the page to the store's Add to Cart button.   Works across most Shopify themes; falls back to the #AddToCart anchor   if a theme blocks inline scripts. *\/(function () {  function bind() {    var link = document.getElementById('hpkcCartLink');    if (!link) return;    link.addEventListener('click', function (e) {      var selectors = [        'button[name=\"add\"]',        '[name=\"add\"]',        '.product-form__submit',        '.product-form__cart-submit',        '#AddToCart',        '#AddToCart-product-template',        '.add-to-cart',        '[data-add-to-cart]',        'form[action*=\"\/cart\/add\"] [type=\"submit\"]',        'form[action*=\"\/cart\/add\"] button'      ];      var target = null;      for (var i = 0; i \u0026lt; selectors.length \u0026amp;\u0026amp; !target; i++) {        target = document.querySelector(selectors[i]);      }      if (target) {        e.preventDefault();        target.scrollIntoView({ behavior: 'smooth', block: 'center' });      }    });  }  if (document.readyState !== 'loading') { bind(); }  else { document.addEventListener('DOMContentLoaded', bind); }})();\u003c\/noscript\u003e\u003c!-- ================================================================= --\u003e\u003c!--  END HARRY POTTER THEME KEYCAP SET DESCRIPTION                    --\u003e\u003c!-- ================================================================= --\u003e","brand":"Rolipan","offers":[{"title":"• Cherry Profile","offer_id":49406822744279,"sku":null,"price":62.9,"currency_code":"USD","in_stock":true},{"title":"• MOA Profile","offer_id":49406822777047,"sku":null,"price":62.9,"currency_code":"USD","in_stock":true},{"title":"• SOA Profile","offer_id":49406822809815,"sku":null,"price":62.9,"currency_code":"USD","in_stock":true},{"title":"Reccazr R68","offer_id":49406822842583,"sku":null,"price":219.9,"currency_code":"USD","in_stock":true},{"title":"Reccazr R84","offer_id":49406822875351,"sku":null,"price":234.9,"currency_code":"USD","in_stock":true},{"title":"Reccazr R100","offer_id":49406822908119,"sku":null,"price":249.9,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0828\/3763\/5287\/files\/harry-potter-themed-cool-artisan-keycap-set-2315902.jpg?v=1783490092","url":"https:\/\/rolipan.com\/products\/cool-harry-potter-theme-keycap-set","provider":"rolipan","version":"1.0","type":"link"}