{"title":"Custom Greek Apparel-Coming Soon","description":"\u003clink href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400\u0026amp;family=Jost:wght@300;400;500;600\u0026amp;display=swap\" rel=\"stylesheet\"\u003e\n\n\u003cstyle\u003e\n.mp-crest {\n  --bg:#0a3848;\n  --bg-deep:#071e2e;\n  --shield:#0f4a60;\n  --shield-mid:#1a607a;\n  --shield-dk:#0a3250;\n  --teal:#1a8099;\n  --teal-bright:#22c4d8;\n  --teal-border:rgba(34,196,216,0.6);\n  --magenta:#0d5548;\n  --magenta-lt:#1a7a6a;\n  --gold:#c8a030;\n  --gold-bright:#ddb840;\n  --gold-light:#f0d070;\n  --gold-dim:rgba(200,160,48,0.4);\n  --gold-glow:rgba(200,160,48,0.18);\n  --text:#f5f0e8;\n  --text-mid:#d0e8e4;\n  --text-muted:#7ab8ae;\n  --border:rgba(200,160,48,0.42);\n  --border-teal:rgba(34,196,216,0.35);\n  --r:2px;\n  --t:0.22s ease;\n  font-family:'Jost',\nsans-serif;\n  background:linear-gradient(160deg, #1a6880 0%, #0d4258 30%, #0a2e48 60%, #071828 100%);\n  color:var(--text);\n  padding:0 0 80px;\n  line-height:1.6;\n}\n.mp-crest *,\n.mp-crest *::before,\n.mp-crest *::after {\n  box-sizing:border-box;\n  margin:0;\n  padding:0;\n}\n.mp-crest .crest-hero {\n  position:relative;\n  overflow:hidden;\n  text-align:center;\n  background:linear-gradient(170deg, #1a7090 0%, #0f5070 35%, #0a3858 65%, #071828 100%);\n}\n.mp-crest .crest-hero::before {\n  content:'';\n  position:absolute;\n  inset:0;\n  background:radial-gradient(ellipse 65% 55% at 18% -5%, rgba(200,160,48,0.2) 0%, transparent 55%),\nradial-gradient(ellipse 55% 65% at 82% 105%, rgba(34,196,216,0.28) 0%, transparent 50%),\nradial-gradient(ellipse 50% 45% at 50% 50%, rgba(34,196,216,0.12) 0%, transparent 65%);\n  pointer-events:none;\n}\n.mp-crest .crest-hero::after {\n  content:'';\n  position:absolute;\n  inset:12px;\n  border:1px solid rgba(34,196,216,0.35);\n  pointer-events:none;\n}\n.mp-crest .hero-inner {\n  position:relative;\n  z-index:1;\n  padding:68px 32px 60px;\n  max-width:700px;\n  margin:0 auto;\n}\n\n.mp-crest .hero-title {\n  font-family:'Playfair Display',\nserif;\n  font-size:clamp(2.8rem,7vw,4.4rem);\n  font-weight:700;\n  background:linear-gradient(160deg, var(--gold-light) 0%, var(--gold-bright) 45%, var(--gold-light) 100%);\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  background-clip:text;\n  letter-spacing:0.08em;\n  line-height:1.08;\n  margin-bottom:10px;\n}\n.mp-crest .hero-subtitle {\n  font-family:'Playfair Display',\nserif;\n  font-style:italic;\n  font-size:clamp(1rem,2.5vw,1.25rem);\n  color:rgba(200,168,144,0.85);\n  margin-bottom:28px;\n}\n.mp-crest .hero-divider {\n  width:80px;\n  height:1px;\n  margin:0 auto 26px;\n  background:linear-gradient(90deg, transparent, var(--gold), transparent);\n}\n.mp-crest .hero-body {\n  font-size:1.5rem;\n  color:rgba(240,224,200,0.7);\n  line-height:1.85;\n  max-width:520px;\n  margin:0 auto 28px;\n}\n.mp-crest .hero-note {\n  display:inline-block;\n  font-size:1.15rem;\n  letter-spacing:0.18em;\n  color:var(--gold);\n  border:1px solid var(--gold-dim);\n  padding:8px 24px;\n  text-transform:uppercase;\n  font-weight:500;\n}\n.mp-crest .crest-body {\n  max-width:820px;\n  margin:0 auto;\n  padding:0 20px;\n}\n.mp-crest .step-section {\n  margin-top:36px;\n  background:var(--shield);\n  border:1px solid var(--border);\n  padding:30px 28px 28px;\n  position:relative;\n  box-shadow:inset 0 0 0 4px rgba(26,140,170,0.12);\n}\n.mp-crest .step-section::before {\n  content:'';\n  position:absolute;\n  top:0;\n  left:0;\n  right:0;\n  height:2px;\n  background:linear-gradient(90deg, var(--teal), var(--gold), var(--magenta-lt), var(--gold), var(--teal));\n}\n.mp-crest .step-section::after {\n  content:'';\n  position:absolute;\n  inset:6px;\n  border:1px solid rgba(26,140,170,0.18);\n  pointer-events:none;\n}\n.mp-crest .step-header {\n  position:relative;\n  z-index:1;\n  display:flex;\n  align-items:baseline;\n  gap:14px;\n  margin-bottom:22px;\n  padding-bottom:15px;\n  border-bottom:1px solid rgba(196,156,72,0.22);\n}\n.mp-crest .step-numeral {\n  font-family:'Playfair Display',\nserif;\n  font-size:1.4rem;\n  color:var(--teal-bright);\n  letter-spacing:0.22em;\n  min-width:24px;\n}\n.mp-crest .step-title {\n  font-family:'Playfair Display',\nserif;\n  font-size:1.5rem;\n  font-weight:600;\n  color:var(--gold-light);\n  letter-spacing:0.04em;\n}\n.mp-crest .step-subtitle {\n  font-size:1.5rem;\n  color:var(--text-muted);\n  margin-top:4px;\n}\n.mp-crest label {\n  position:relative;\n  z-index:1;\n  display:block;\n  font-size:1.5rem;\n  font-weight:600;\n  letter-spacing:0.14em;\n  text-transform:uppercase;\n  color:var(--gold);\n  margin-bottom:8px;\n}\n.mp-crest input[type=\"text\"],\n.mp-crest input[type=\"email\"],\n.mp-crest input[type=\"tel\"],\n.mp-crest input[type=\"number\"],\n.mp-crest select,\n.mp-crest textarea {\n  position:relative;\n  z-index:1;\n  width:100%;\n  background:rgba(5,20,35,0.65);\n  border:1px solid var(--border);\n  color:var(--text);\n  font-family:'Jost',\nsans-serif;\n  font-size:1.15rem;\n  padding:13px 16px;\n  border-radius:var(--r);\n  outline:none;\n  -webkit-appearance:none;\n  transition:border-color var(--t),\nbox-shadow var(--t);\n}\n.mp-crest input::placeholder,\n.mp-crest textarea::placeholder {\n  color:var(--text-muted);\n  font-style:italic;\n}\n.mp-crest input:focus,\n.mp-crest select:focus,\n.mp-crest textarea:focus {\n  border-color:var(--gold-bright);\n  box-shadow:0 0 0 3px rgba(196,156,72,0.12);\n}\n.mp-crest select {\n  cursor:pointer;\n  background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c49c48' stroke-width='1.5' fill='none'\/%3E%3C\/svg%3E\");\n  background-repeat:no-repeat;\n  background-position:right 14px center;\n  background-color:rgba(5,20,35,0.65);\n  padding-right:40px;\n}\n.mp-crest select option {\n  background:#0a3250;\n  color:var(--text);\n}\n.mp-crest textarea {\n  resize:vertical;\n  min-height:100px;\n}\n.mp-crest .field-group {\n  position:relative;\n  z-index:1;\n  margin-bottom:20px;\n}\n.mp-crest .field-row {\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:18px;\n}\n@media (max-width:560px) {\n  .mp-crest .field-row {\n  grid-template-columns:1fr;\n}\n\n}\n.mp-crest .option-grid {\n  position:relative;\n  z-index:1;\n  display:grid;\n  gap:8px;\n}\n.mp-crest .option-grid.cols-4 {\n  grid-template-columns:repeat(4,1fr);\n}\n.mp-crest .option-grid.cols-6 {\n  grid-template-columns:repeat(6,1fr);\n}\n@media (max-width:560px) {\n  .mp-crest .option-grid.cols-4 {\n  grid-template-columns:repeat(2,1fr);\n}\n.mp-crest .option-grid.cols-6 {\n  grid-template-columns:repeat(3,1fr);\n}\n\n}\n.mp-crest .option-card {\n  position:relative;\n}\n.mp-crest .option-card input {\n  position:absolute;\n  opacity:0;\n  width:0;\n  height:0;\n}\n.mp-crest .option-card label {\n  display:flex;\n  flex-direction:column;\n  align-items:center;\n  justify-content:center;\n  text-align:center;\n  padding:13px 8px;\n  border:1px solid rgba(196,156,72,0.28);\n  background:rgba(7,30,45,0.5);\n  cursor:pointer;\n  transition:all var(--t);\n  font-size:1.5rem;\n  letter-spacing:0.06em;\n  text-transform:uppercase;\n  color:var(--text-mid);\n  min-height:64px;\n  font-weight:500;\n  border-radius:var(--r);\n}\n.mp-crest .option-card label:hover {\n  border-color:var(--gold);\n  color:var(--text);\n  background:rgba(196,156,72,0.1);\n}\n.mp-crest .option-card input:checked+label {\n  border-color:var(--gold-bright);\n  background:rgba(196,156,72,0.16);\n  color:var(--gold-light);\n  font-weight:600;\n  box-shadow:0 0 14px rgba(196,156,72,0.2),\ninset 0 0 0 1px var(--gold);\n}\n.mp-crest .option-price {\n  font-size:1.15rem;\n  color:#4de8c0;\n  margin-top:5px;\n  font-style:normal;\n  font-family:'Jost',\nsans-serif;\n  text-transform:none;\n  letter-spacing:0.02em;\n  font-weight:500;\n}\n.mp-crest .swatch-grid {\n  position:relative;\n  z-index:1;\n  display:flex;\n  flex-wrap:wrap;\n  gap:12px;\n}\n.mp-crest .swatch-option {\n  position:relative;\n}\n.mp-crest .swatch-option input {\n  position:absolute;\n  opacity:0;\n  width:0;\n  height:0;\n}\n.mp-crest .swatch-option label {\n  display:flex;\n  flex-direction:column;\n  align-items:center;\n  gap:7px;\n  cursor:pointer;\n  font-size:0.9rem;\n  letter-spacing:0.06em;\n  text-transform:uppercase;\n  color:var(--text-muted);\n  width:60px;\n}\n.mp-crest .swatch-dot {\n  width:34px;\n  height:34px;\n  border-radius:50%;\n  border:2px solid rgba(196,156,72,0.2);\n  transition:all var(--t);\n  box-shadow:0 2px 6px rgba(0,0,0,0.5);\n}\n.mp-crest .swatch-option input:checked+label .swatch-dot {\n  border-color:var(--gold-bright);\n  box-shadow:0 0 0 3px rgba(196,156,72,0.45),0 0 14px rgba(196,156,72,0.3);\n  transform:scale(1.12);\n}\n.mp-crest .swatch-option input:checked+label {\n  color:var(--gold-light);\n  font-weight:600;\n}\n\n@media (max-width:560px) {\n  .mp-crest .greek-grid:not(.greek-grid-lg) {\n  grid-template-columns:repeat(2,1fr);\n}\n\n}\n\n.mp-crest .greek-card input:checked+label {\n  border-color:var(--teal-bright);\n  background:rgba(26,140,170,0.3);\n  color:#a8f0d8;\n  font-weight:600;\n  box-shadow:0 0 14px rgba(26,140,170,0.3),\ninset 0 0 0 1px var(--teal);\n}\n\n@media (max-width:480px) {\n  \n\n}\n\n.mp-crest .addon-card input:checked+label {\n  border-color:var(--magenta-lt);\n  background:rgba(21,122,110,0.32);\n  color:#a8f0e8;\n  font-weight:600;\n  box-shadow:0 0 12px rgba(21,122,110,0.28),\ninset 0 0 0 1px var(--magenta);\n}\n\n.mp-crest .order-summary {\n  margin-top:40px;\n  background:linear-gradient(150deg, #0a3250 0%, #071828 50%, #050f1e 100%);\n  border:1px solid var(--border);\n  padding:28px;\n  position:relative;\n  box-shadow:0 0 40px rgba(196,156,72,0.08),\ninset 0 0 0 5px rgba(26,140,170,0.1);\n}\n.mp-crest .order-summary::before {\n  content:'';\n  position:absolute;\n  top:0;\n  left:0;\n  right:0;\n  height:2px;\n  background:linear-gradient(90deg, var(--teal), var(--gold), var(--magenta-lt), var(--gold), var(--teal));\n}\n.mp-crest .order-summary::after {\n  content:'';\n  position:absolute;\n  inset:6px;\n  border:1px solid rgba(26,140,170,0.2);\n  pointer-events:none;\n}\n.mp-crest .summary-title {\n  position:relative;\n  z-index:1;\n  font-family:'Playfair Display',\nserif;\n  font-size:1.5rem;\n  letter-spacing:0.12em;\n  text-transform:uppercase;\n  color:var(--gold-bright);\n  margin-bottom:18px;\n  padding-bottom:14px;\n  border-bottom:1px solid rgba(196,156,72,0.2);\n}\n.mp-crest .summary-line {\n  position:relative;\n  z-index:1;\n  display:flex;\n  justify-content:space-between;\n  align-items:baseline;\n  padding:9px 0;\n  border-bottom:1px solid rgba(196,156,72,0.1);\n  font-size:1.4rem;\n}\n.mp-crest .summary-key {\n  color:var(--text-muted);\n  letter-spacing:0.07em;\n  text-transform:uppercase;\n  font-size:1.5rem;\n  font-weight:600;\n}\n.mp-crest .summary-val {\n  color:var(--text);\n  font-weight:500;\n  text-align:right;\n  max-width:60%;\n  font-size:1.5rem;\n}\n.mp-crest .summary-val .empty {\n  color:rgba(138,104,88,0.5);\n  font-style:italic;\n  font-size:1.15rem;\n  font-weight:400;\n}\n.mp-crest .submit-section {\n  margin-top:36px;\n  text-align:center;\n}\n.mp-crest .submit-note {\n  font-size:1.15rem;\n  color:var(--text-muted);\n  margin-bottom:22px;\n  line-height:1.75;\n  font-style:italic;\n}\n.mp-crest .btn-submit {\n  display:inline-block;\n  background:linear-gradient(145deg, var(--shield-dk) 0%, var(--shield) 50%, var(--shield-dk) 100%);\n  border:1px solid var(--gold);\n  color:var(--gold-light);\n  font-family:'Jost',\nsans-serif;\n  font-size:1.15rem;\n  font-weight:700;\n  letter-spacing:0.28em;\n  text-transform:uppercase;\n  padding:18px 56px;\n  cursor:pointer;\n  border-radius:var(--r);\n  transition:all var(--t);\n}\n.mp-crest .btn-submit:hover {\n  background:linear-gradient(145deg, var(--shield) 0%, var(--shield-mid) 50%, var(--shield) 100%);\n  box-shadow:0 0 30px rgba(196,156,72,0.2),0 0 14px rgba(26,140,170,0.15);\n  transform:translateY(-1px);\n  color:#fff;\n}\n.mp-crest .btn-submit:disabled {\n  opacity:0.6;\n  cursor:not-allowed;\n  transform:none;\n}\n.mp-crest .success-message {\n  display:none;\n  text-align:center;\n  padding:64px 32px;\n  background:linear-gradient(135deg, var(--shield) 0%, var(--shield-dk) 100%);\n  border:1px solid var(--border);\n  margin-top:48px;\n}\n.mp-crest .success-message.visible {\n  display:block;\n}\n.mp-crest .success-icon {\n  font-size:2.6rem;\n  margin-bottom:18px;\n}\n.mp-crest .success-title {\n  font-family:'Playfair Display',\nserif;\n  font-size:2.4rem;\n  background:linear-gradient(135deg, var(--gold-light), var(--gold-bright));\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  background-clip:text;\n  margin-bottom:14px;\n}\n.mp-crest .success-body {\n  color:var(--text-mid);\n  font-size:1.4rem;\n  line-height:1.8;\n  max-width:480px;\n  margin:0 auto;\n}\n.mp-crest .form-error {\n  display:none;\n  background:rgba(21,122,110,0.2);\n  border:1px solid var(--magenta);\n  color:var(--text);\n  padding:14px 18px;\n  font-size:1.5rem;\n  margin-top:16px;\n  border-radius:var(--r);\n}\n.mp-crest .form-error.visible {\n  display:block;\n}\n.mp-crest .crest-footer {\n  margin-top:60px;\n  text-align:center;\n  border-top:1px solid var(--gold-dim);\n  padding-top:28px;\n}\n.mp-crest .footer-text {\n  font-size:1.15rem;\n  letter-spacing:0.14em;\n  color:var(--text-muted);\n  text-transform:uppercase;\n  line-height:2.2;\n}\n.mp-crest .hero-logo-wrap {\n  margin-bottom:24px;\n}\n.mp-crest .hero-logo {\n  width:220px;\n  max-width:65%;\n  display:block;\n  margin:0 auto;\n  filter:drop-shadow(0 8px 28px rgba(196,156,72,0.22)) drop-shadow(0 2px 10px rgba(0,0,0,0.65));\n}\n\n.mp-crest .hero-body strong {\n  color:var(--gold-light);\n  font-weight:600;\n}\n\n@media (max-width:700px) {\n  \n\n}\n@media (max-width:540px) {\n  \n\n}\n@media (max-width:380px) {\n  \n\n}\n.mp-crest .section-note {\n  position:relative;\n  z-index:1;\n  font-size:1.15rem;\n  color:var(--text-muted);\n  font-style:italic;\n  margin-bottom:16px;\n  letter-spacing:0.04em;\n}\n\n.mp-crest .greek-card input[type=\"checkbox\"]:checked+label {\n  border-color:var(--teal-bright);\n  background:rgba(26,140,170,0.3);\n  color:#a8f0d8;\n  font-weight:600;\n  box-shadow:0 0 14px rgba(26,140,170,0.3),\ninset 0 0 0 1px var(--teal);\n}\n.mp-crest .greek-card input[type=\"checkbox\"]+label:hover {\n  border-color:var(--teal);\n  background:rgba(26,140,170,0.2);\n  color:var(--text);\n}\n.mp-crest .processing-banner {\n  position:relative;\n  z-index:1;\n  background:rgba(34,196,216,0.1);\n  border:1px solid rgba(34,196,216,0.4);\n  border-left:3px solid var(--teal-bright);\n  padding:13px 18px;\n  margin-bottom:22px;\n  font-size:1.15rem;\n  color:var(--text-mid);\n  letter-spacing:0.03em;\n  line-height:1.5;\n}\n.mp-crest .processing-banner strong {\n  color:var(--teal-bright);\n  font-weight:700;\n}\n.mp-crest .item-card {\n  margin-top:36px;\n  background:var(--shield);\n  border:1px solid var(--border);\n  position:relative;\n  box-shadow:inset 0 0 0 4px rgba(34,196,216,0.1);\n}\n.mp-crest .item-card::before {\n  content:'';\n  position:absolute;\n  top:0;\n  left:0;\n  right:0;\n  height:2px;\n  background:linear-gradient(90deg, var(--teal), var(--gold), var(--magenta-lt), var(--gold), var(--teal));\n}\n.mp-crest .item-header {\n  display:flex;\n  justify-content:space-between;\n  align-items:center;\n  padding:18px 28px 0;\n  margin-bottom:0;\n}\n.mp-crest .item-label {\n  font-family:'Playfair Display',\nserif;\n  font-size:1.15rem;\n  color:var(--gold-light);\n  letter-spacing:0.1em;\n  text-transform:uppercase;\n}\n.mp-crest .btn-remove-item {\n  background:rgba(21,122,110,0.2);\n  border:1px solid rgba(21,122,110,0.4);\n  color:var(--magenta-lt);\n  font-size:1.5rem;\n  letter-spacing:0.12em;\n  text-transform:uppercase;\n  padding:5px 14px;\n  cursor:pointer;\n  border-radius:var(--r);\n  transition:all var(--t);\n  font-family:'Jost',\nsans-serif;\n}\n.mp-crest .btn-remove-item:hover {\n  background:rgba(21,122,110,0.4);\n  color:#a8f0e8;\n}\n.mp-crest .item-body {\n  padding:20px 28px 28px;\n}\n.mp-crest .item-divider {\n  border:none;\n  border-top:1px solid rgba(196,156,72,0.15);\n  margin:20px 0;\n}\n.mp-crest .btn-add-item {\n  background:rgba(26,140,170,0.15);\n  border:1px solid rgba(34,196,216,0.4);\n  color:var(--teal-bright);\n  font-family:'Jost',\nsans-serif;\n  font-size:1.5rem;\n  font-weight:600;\n  letter-spacing:0.18em;\n  text-transform:uppercase;\n  padding:14px 36px;\n  cursor:pointer;\n  border-radius:var(--r);\n  transition:all var(--t);\n}\n.mp-crest .btn-add-item:hover {\n  background:rgba(26,140,170,0.3);\n  box-shadow:0 0 16px rgba(26,140,170,0.25);\n  color:#a0f0d8;\n}\n.mp-crest .item-summary-block {\n  padding:10px 0;\n  border-bottom:1px solid rgba(196,156,72,0.12);\n}\n.mp-crest .item-summary-label {\n  font-size:1.4rem;\n  font-weight:700;\n  color:var(--teal-bright);\n  letter-spacing:0.12em;\n  text-transform:uppercase;\n  margin-bottom:6px;\n}\n.mp-crest .item-summary-line {\n  display:flex;\n  justify-content:space-between;\n  font-size:1.5rem;\n  color:var(--text-mid);\n  padding:3px 0;\n}\n.mp-crest .item-summary-line span {\n  color:var(--text);\n  font-weight:500;\n}\n.mp-crest .addon-card-with-input {\n  flex-direction:column;\n  align-items:flex-start;\n}\n.mp-crest .addon-card-with-input label {\n  width:100%;\n  justify-content:space-between;\n  display:flex;\n  align-items:center;\n  margin-bottom:0;\n}\n.mp-crest .addon-inline-input {\n  width:100% !important;\n  background:rgba(0,0,0,0.2) !important;\n  border:1px solid rgba(196,156,72,0.2) !important;\n  border-top:none !important;\n  color:var(--text) !important;\n  font-family:'Jost',\nsans-serif !important;\n  font-size:1rem !important;\n  padding:8px 12px !important;\n  border-radius:0 0 var(--r) var(--r) !important;\n  outline:none;\n  display:none;\n}\n.mp-crest .addon-card input:checked~.addon-inline-input {\n  display:block;\n}\n.mp-crest .item-estimated-total {\n  position:relative;\n  z-index:1;\n  display:flex;\n  flex-direction:column;\n  align-items:center;\n  background:linear-gradient(135deg, rgba(26,140,170,0.2), rgba(196,156,72,0.12));\n  border:1px solid var(--border);\n  padding:18px 20px;\n  margin-top:20px;\n  text-align:center;\n  border-radius:var(--r);\n}\n.mp-crest .iet-label {\n  font-size:1.5rem;\n  font-weight:600;\n  letter-spacing:0.18em;\n  text-transform:uppercase;\n  color:var(--gold);\n  margin-bottom:6px;\n}\n.mp-crest .iet-amount {\n  font-family:'Playfair Display',\nserif;\n  font-size:2.4rem;\n  font-weight:700;\n  background:linear-gradient(135deg, var(--gold-light), var(--gold-bright));\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  background-clip:text;\n  line-height:1.1;\n  margin-bottom:6px;\n}\n.mp-crest .iet-note {\n  font-size:1.5rem;\n  color:var(--text-muted);\n  font-style:italic;\n}\n@media (max-width:600px) {\n  .mp-crest .crest-body {\n  padding:0 10px;\n}\n.mp-crest .item-body {\n  padding:16px 14px 20px;\n}\n.mp-crest .item-header {\n  padding:14px 14px 0;\n}\n.mp-crest .step-section {\n  padding:20px 14px 20px;\n}\n\n.mp-crest {\n  overflow-x:hidden;\n}\n.mp-crest .item-card {\n  overflow:hidden;\n}\n\n}\n.mp-crest input[type=\"date\"] {\n  width:100%;\n  background:rgba(0,0,0,0.3);\n  border:1px solid rgba(196,156,72,0.4);\n  color:var(--text);\n  font-family:'Jost',\nsans-serif;\n  font-size:1.15rem;\n  padding:13px 16px;\n  border-radius:var(--r);\n  outline:none;\n  -webkit-appearance:none;\n  color-scheme:dark;\n}\n.mp-crest input[type=\"date\"]:focus {\n  border-color:var(--gold-bright);\n  box-shadow:0 0 0 3px rgba(196,156,72,0.12);\n}\n.mp-crest .rush-warning {\n  display:none;\n  margin-top:10px;\n  background:rgba(196,156,72,0.15);\n  border:1px solid rgba(196,156,72,0.5);\n  border-left:3px solid var(--gold-bright);\n  padding:12px 16px;\n  font-size:1.4rem;\n  color:var(--gold-light);\n  line-height:1.6;\n  border-radius:var(--r);\n}\n.mp-crest .rush-warning strong {\n  color:var(--gold-bright);\n}\n.mp-crest .rush-warning.visible {\n  display:block;\n}\n.mp-crest .letter-slot-grid {\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:10px;\n  margin-bottom:12px;\n}\n@media (max-width:560px) {\n  .mp-crest .letter-slot-grid {\n  grid-template-columns:repeat(2,1fr);\n}\n\n}\n.mp-crest .letter-slot {\n  display:flex;\n  flex-direction:column;\n  gap:6px;\n}\n.mp-crest .slot-label {\n  font-size:0.9rem !important;\n  font-weight:600 !important;\n  letter-spacing:0.14em !important;\n  text-transform:uppercase !important;\n  color:var(--teal-bright) !important;\n  margin-bottom:0 !important;\n}\n.mp-crest .letter-slot-select {\n  background:rgba(0,0,0,0.3);\n  border:1px solid rgba(196,156,72,0.4);\n  color:var(--text);\n  font-family:'Playfair Display',\nserif;\n  font-size:1.5rem;\n  padding:10px 12px;\n  border-radius:var(--r);\n  outline:none;\n  width:100%;\n  cursor:pointer;\n  -webkit-appearance:none;\n  background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='10' height='7'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23c49c48' stroke-width='1.5' fill='none'\/%3E%3C\/svg%3E\");\n  background-repeat:no-repeat;\n  background-position:right 10px center;\n  padding-right:28px;\n}\n.mp-crest .letter-slot-select:focus {\n  border-color:var(--gold-bright);\n  box-shadow:0 0 0 3px rgba(196,156,72,0.12);\n}\n.mp-crest .letter-slot-select option {\n  background:#0a3250;\n  color:var(--text);\n}\n.mp-crest .package-grid {\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n  margin-bottom:10px;\n}\n@media (max-width:560px) {\n  .mp-crest .package-grid {\n  grid-template-columns:1fr;\n}\n\n}\n.mp-crest .package-grid .option-card label {\n  flex-direction:row;\n  justify-content:space-between;\n  align-items:center;\n  text-align:left;\n  min-height:48px;\n  padding:11px 14px;\n}\n.mp-crest .package-grid .option-price {\n  margin-top:0;\n  margin-left:10px;\n  flex-shrink:0;\n}\n.mp-crest .customization-details {\n  margin-top:16px;\n  padding-top:16px;\n  border-top:1px solid rgba(196,156,72,0.15);\n}\n.mp-crest .summary-total-row {\n  display:flex;\n  justify-content:space-between;\n  align-items:center;\n  padding:16px 0 8px;\n  margin-top:8px;\n  border-top:1px solid rgba(196,156,72,0.4);\n}\n.mp-crest .summary-total-label {\n  font-size:1.5rem;\n  font-weight:700;\n  letter-spacing:0.1em;\n  text-transform:uppercase;\n  color:var(--gold-bright);\n}\n.mp-crest .summary-total-amount {\n  font-family:'Playfair Display',\nserif;\n  font-size:2.4rem;\n  font-weight:700;\n  background:linear-gradient(135deg, var(--gold-light), var(--gold-bright));\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  background-clip:text;\n}\n.mp-crest .summary-total-note {\n  font-size:1.5rem;\n  color:var(--text-muted);\n  font-style:italic;\n  text-align:right;\n  padding-bottom:4px;\n}\n.mp-crest .req {\n  color:var(--teal-bright);\n  font-size:1.4rem;\n  margin-left:3px;\n  font-style:normal;\n}\n.mp-crest .required-note {\n  font-size:1.5rem;\n  color:var(--text-muted);\n  font-style:italic;\n  margin-bottom:16px;\n}\n\n.mp-crest .dd-text-logo {\n  display:inline-block;\n  text-align:center;\n  margin-bottom:4px;\n  filter:drop-shadow(0 6px 24px rgba(200,160,48,0.22)) drop-shadow(0 2px 8px rgba(0,0,0,0.65));\n}\n.mp-crest .dd-logo-main {\n  display:block;\n  font-family:'Playfair Display',serif;\n  font-size:clamp(2.2rem,8vw,3.8rem);\n  font-weight:700;\n  letter-spacing:0.18em;\n  line-height:1;\n  background:linear-gradient(160deg, #f0d070 0%, #ddb840 45%, #f0d070 100%);\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  background-clip:text;\n}\n.mp-crest .dd-logo-by {\n  font-family:'Playfair Display',serif;\n  font-style:italic;\n  font-size:clamp(0.9rem,3vw,1.3rem);\n  color:var(--teal-bright);\n  letter-spacing:0.12em;\n  font-weight:400;\n}\n.mp-crest .dd-logo-dani {\n  background:linear-gradient(160deg, var(--teal-bright) 0%, #22e0c8 60%, var(--teal-bright) 100%);\n  -webkit-background-clip:text;\n  -webkit-text-fill-color:transparent;\n  background-clip:text;\n}\n.mp-crest .dd-logo-sub {\n  font-size:1.4rem;\n  font-weight:700;\n  letter-spacing:0.4em;\n  text-transform:uppercase;\n  color:rgba(200,160,48,0.7);\n  margin-top:6px;\n}\n.mp-crest .package-grid {\n  display:grid;\n  grid-template-columns:repeat(3,1fr);\n  gap:8px;\n}\n@media (max-width:600px){\n  .mp-crest .package-grid { grid-template-columns:1fr 1fr; }\n}\n\n.mp-crest .greek-grid-lg {\n  display:grid;\n  grid-template-columns:repeat(5,1fr);\n  gap:6px;\n}\n@media (max-width:700px) { .mp-crest .greek-grid-lg { grid-template-columns:repeat(4,1fr); gap:5px; } }\n@media (max-width:480px) { .mp-crest .greek-grid-lg { grid-template-columns:repeat(3,1fr); gap:4px; } }\n.mp-crest .greek-btn {\n  display:flex;\n  flex-direction:column;\n  align-items:center;\n  justify-content:center;\n  gap:4px;\n  padding:10px 6px;\n  border:1px solid rgba(200,160,48,0.25);\n  background:rgba(7,30,45,0.5);\n  cursor:pointer;\n  transition:all var(--t);\n  font-size:0.82rem;\n  letter-spacing:0.04em;\n  color:var(--text-mid);\n  text-transform:uppercase;\n  border-radius:var(--r);\n  min-height:58px;\n  font-weight:500;\n  line-height:1.2;\n  width:100%;\n  font-family:'Jost',sans-serif;\n  text-align:center;\n  word-break:break-word;\n  overflow:visible;\n}\n.mp-crest .greek-btn:hover { border-color:var(--teal); background:rgba(26,140,170,0.2); color:var(--text); }\n.mp-crest .greek-btn.selected { border-color:var(--teal-bright); background:rgba(34,196,216,0.22); color:#a8f0d8; font-weight:600; box-shadow:0 0 12px rgba(34,196,216,0.2),inset 0 0 0 1px var(--teal); }\n.mp-crest .greek-sym { font-family:'Playfair Display',serif; font-size:1.3rem; color:var(--gold); line-height:1; display:block; }\n.mp-crest .greek-btn.selected .greek-sym { color:var(--gold-bright); }\n.mp-crest .greek-btn span:not(.greek-sym) { font-size:0.72rem; letter-spacing:0.05em; line-height:1.2; }\n@media (max-width:480px) {\n  .mp-crest .greek-btn { font-size:0.7rem; padding:8px 4px; min-height:52px; }\n  .mp-crest .greek-sym { font-size:1.1rem; }\n  .mp-crest .greek-btn span:not(.greek-sym) { font-size:0.62rem; }\n}\n\n.mp-crest .letter-pills {\n  display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; min-height:36px;\n}\n.mp-crest .letter-pill {\n  display:inline-flex; align-items:center; gap:6px;\n  background:rgba(34,196,216,0.18); border:1px solid var(--teal-bright);\n  color:#a8f0d8; font-family:'Playfair Display',serif;\n  font-size:1rem; padding:5px 10px; border-radius:2px; letter-spacing:0.06em;\n}\n.mp-crest .letter-pill .pill-remove {\n  background:none; border:none; color:rgba(168,240,216,0.6);\n  cursor:pointer; font-size:0.9rem; line-height:1; padding:0 2px;\n  font-family:'Jost',sans-serif;\n}\n.mp-crest .letter-pill .pill-remove:hover { color:#fff; }\n.mp-crest .letter-pill-empty {\n  font-size:0.84rem; color:var(--text-muted); font-style:italic; align-self:center;\n}\n\n\u003c\/style\u003e\n\n\u003cdiv class=\"mp-crest\"\u003e\n  \u003cdiv class=\"crest-hero\"\u003e\n    \u003cdiv class=\"hero-inner\"\u003e\n      \u003cdiv class=\"hero-logo-wrap\"\u003e\n      \u003cdiv class=\"dd-text-logo\"\u003e\n        \u003cspan class=\"dd-logo-main\"\u003eDD\u003cspan class=\"dd-logo-by\"\u003e by \u003c\/span\u003e\u003cspan class=\"dd-logo-dani\"\u003eDani\u003c\/span\u003e\u003c\/span\u003e\n        \n      \u003c\/div\u003e\n    \u003c\/div\u003e\n      \u003ch1 class=\"hero-title\"\u003eCustom Order\u003c\/h1\u003e\n      \u003cp class=\"hero-subtitle\"\u003eCustom Greek Letter Apparel — Appliqué, Embroidery \u0026amp; Direct Print\u003c\/p\u003e\n      \u003cdiv class=\"hero-divider\"\u003e\u003c\/div\u003e\n      \u003cp class=\"hero-body\"\u003eEvery thread tells a story. Every stitch carries your legacy forward.\u003cbr\u003eFill out your custom order below — we'll review your request and send a personalized invoice directly to you.\u003cbr\u003e\u003cbr\u003e\u003cstrong\u003eGreek letters applied via appliqué\u003c\/strong\u003e with optional printed or embroidered add-ons — names, numbers, sleeves, ship name, and pictures.\u003c\/p\u003e\n      \u003cspan class=\"hero-note\"\u003e✦ Stitched with care · Built to represent\u003c\/span\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\n  \u003cdiv class=\"crest-body\"\u003e\n    \u003cform id=\"mpCrestForm\"\u003e\n\n      \u003cdiv id=\"itemsContainer\"\u003e\u003c\/div\u003e\n\n      \u003cdiv style=\"text-align:center; margin-top:28px; position:relative; z-index:1;\"\u003e\n        \u003cbutton type=\"button\" id=\"addItemBtn\" class=\"btn-add-item\"\u003e+ Add Another Item\u003c\/button\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"step-section\" style=\"margin-top:40px;\"\u003e\n        \u003cdiv class=\"step-header\"\u003e\n\u003cspan class=\"step-numeral\"\u003e✦\u003c\/span\u003e\u003cdiv\u003e\n\u003cdiv class=\"step-title\"\u003eYour Information\u003c\/div\u003e\n\u003cdiv class=\"step-subtitle\"\u003eWe'll send your invoice here\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n        \u003cp class=\"required-note\" style=\"position:relative;z-index:1;\"\u003e\u003cspan class=\"req\"\u003e*\u003c\/span\u003e Required fields\u003c\/p\u003e\n        \u003cdiv class=\"field-row\"\u003e\n          \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"customer_name\"\u003eFull Name \u003cspan class=\"req\"\u003e*\u003c\/span\u003e\u003c\/label\u003e\u003cinput type=\"text\" name=\"customer_name\" id=\"customer_name\" placeholder=\"First Last\" required\u003e\n\u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"customer_email\"\u003eEmail Address \u003cspan class=\"req\"\u003e*\u003c\/span\u003e\u003c\/label\u003e\u003cinput type=\"email\" name=\"customer_email\" id=\"customer_email\" placeholder=\"you@example.com\" required\u003e\n\u003c\/div\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"field-group\" style=\"max-width:280px;\"\u003e\n\u003clabel for=\"customer_phone\"\u003ePhone (optional)\u003c\/label\u003e\u003cinput type=\"tel\" name=\"customer_phone\" id=\"customer_phone\" placeholder=\"(555) 000-0000\"\u003e\n\u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"step-section\"\u003e\n        \u003cdiv class=\"step-header\"\u003e\n\u003cspan class=\"step-numeral\"\u003e✦\u003c\/span\u003e\u003cdiv\u003e\n\u003cdiv class=\"step-title\"\u003eShipping Information\u003c\/div\u003e\n\u003cdiv class=\"step-subtitle\"\u003eWhere should we ship your order?\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"processing-banner\"\u003e🧵  Processing time: \u003cstrong\u003e6–8 business days\u003c\/strong\u003e for printed orders · \u003cstrong\u003e2–4 weeks\u003c\/strong\u003e for picture embroidery · Rush available — inquire in notes\u003c\/div\u003e\n        \u003cdiv class=\"field-group\" style=\"position:relative;z-index:1;max-width:320px;\"\u003e\n          \u003clabel for=\"needed_by\"\u003eWhen do you need your order? \u003cspan style=\"font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0;font-size:1.15rem;\"\u003e(optional)\u003c\/span\u003e\u003c\/label\u003e\n          \u003cinput type=\"date\" name=\"needed_by\" id=\"needed_by\" min=\"\"\u003e\n          \u003cdiv class=\"rush-warning\" id=\"rushWarning\"\u003e\n            ⚡ Your date is within 7 business days — a \u003cstrong\u003eRush Fee of $25\u003c\/strong\u003e will be added to your invoice.\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"ship_name\"\u003eShip To (Full Name)\u003c\/label\u003e\u003cinput type=\"text\" name=\"ship_name\" id=\"ship_name\" placeholder=\"Full name on package\" required\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"ship_address\"\u003eStreet Address\u003c\/label\u003e\u003cinput type=\"text\" name=\"ship_address\" id=\"ship_address\" placeholder=\"123 Main Street, Apt 4B\" required\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"field-row\"\u003e\n          \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"ship_city\"\u003eCity\u003c\/label\u003e\u003cinput type=\"text\" name=\"ship_city\" id=\"ship_city\" placeholder=\"City\" required\u003e\n\u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"ship_state\"\u003eState\u003c\/label\u003e\u003cinput type=\"text\" name=\"ship_state\" id=\"ship_state\" placeholder=\"State\" required\u003e\n\u003c\/div\u003e\n        \u003c\/div\u003e\n        \u003cdiv class=\"field-row\"\u003e\n          \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"ship_zip\"\u003eZIP Code\u003c\/label\u003e\u003cinput type=\"text\" name=\"ship_zip\" id=\"ship_zip\" placeholder=\"00000\" required\u003e\n\u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"ship_country\"\u003eCountry\u003c\/label\u003e\u003cselect name=\"ship_country\" id=\"ship_country\"\u003e\u003coption value=\"United States\" selected\u003eUnited States\u003c\/option\u003e\n\u003coption\u003eCanada\u003c\/option\u003e\n\u003coption\u003eUnited Kingdom\u003c\/option\u003e\n\u003coption\u003eOther (note in comments)\u003c\/option\u003e\u003c\/select\u003e\n\u003c\/div\u003e\n        \u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"step-section\"\u003e\n        \u003cdiv class=\"step-header\"\u003e\n\u003cspan class=\"step-numeral\"\u003e✦\u003c\/span\u003e\u003cdiv\u003e\n\u003cdiv class=\"step-title\"\u003eAdditional Notes\u003c\/div\u003e\n\u003cdiv class=\"step-subtitle\"\u003eAnything else we should know?\u003c\/div\u003e\n\u003c\/div\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"field-group\"\u003e\n\u003clabel for=\"notes\"\u003eNotes\u003c\/label\u003e\u003ctextarea name=\"notes\" id=\"notes\" placeholder=\"Special instructions, design references, any questions...\"\u003e\u003c\/textarea\u003e\n\u003c\/div\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"order-summary\" id=\"orderSummary\"\u003e\n        \u003cdiv class=\"summary-title\"\u003e🪶 Order Summary\u003c\/div\u003e\n        \u003cdiv id=\"itemsSummary\"\u003e\u003c\/div\u003e\n        \u003cdiv class=\"summary-line\"\u003e\n\u003cspan class=\"summary-key\"\u003eYour Name\u003c\/span\u003e\u003cspan class=\"summary-val\" id=\"sum-name\"\u003e\u003cem class=\"empty\"\u003e—\u003c\/em\u003e\u003c\/span\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"summary-line\"\u003e\n\u003cspan class=\"summary-key\"\u003eNeeded By\u003c\/span\u003e\u003cspan class=\"summary-val\" id=\"sum-needed\"\u003e\u003cem class=\"empty\"\u003e—\u003c\/em\u003e\u003c\/span\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"summary-line\"\u003e\n\u003cspan class=\"summary-key\"\u003eShip To Name\u003c\/span\u003e\u003cspan class=\"summary-val\" id=\"sum-ship-name\"\u003e\u003cem class=\"empty\"\u003e—\u003c\/em\u003e\u003c\/span\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"summary-line\"\u003e\n\u003cspan class=\"summary-key\"\u003eAddress\u003c\/span\u003e\u003cspan class=\"summary-val\" id=\"sum-ship\"\u003e\u003cem class=\"empty\"\u003e—\u003c\/em\u003e\u003c\/span\u003e\n\u003c\/div\u003e\n        \u003cdiv class=\"summary-total-row\"\u003e\n          \u003cspan class=\"summary-total-label\"\u003eEstimated Order Total\u003c\/span\u003e\n          \u003cspan class=\"summary-total-amount\" id=\"sum-grand-total\"\u003e—\u003c\/span\u003e\n        \u003c\/div\u003e\n        \u003cp class=\"summary-total-note\"\u003e* Estimate only. Final price confirmed on invoice. Shipping calculated separately.\u003c\/p\u003e\n      \u003c\/div\u003e\n\n      \u003cdiv class=\"submit-section\"\u003e\n        \u003cp class=\"submit-note\"\u003eSubmitting this form does not charge you. No payment is collected here. DD by Dani will review your request and send a custom invoice within 1–2 business days.\u003cbr\u003e\u003cspan style=\"color:var(--teal-bright);font-style:normal;font-weight:600;\"\u003e⏱ Processing begins after invoice is paid — allow 6–8 business days for your order.\u003c\/span\u003e\u003cbr\u003e\u003cspan style=\"color:var(--text-muted);\"\u003eShipping fees will be calculated and added to your invoice.\u003c\/span\u003e\u003c\/p\u003e\n        \u003cbutton type=\"submit\" class=\"btn-submit\" id=\"submitBtn\"\u003eSubmit Your Custom Order\u003c\/button\u003e\n        \u003cdiv class=\"form-error\" id=\"formError\"\u003eSomething went wrong — please try again or email distinctivedesignsbydani@gmail.com directly.\u003c\/div\u003e\n      \u003c\/div\u003e\n\n    \u003c\/form\u003e\n\n    \u003cdiv class=\"success-message\" id=\"mpSuccess\"\u003e\n      \u003cdiv class=\"success-icon\"\u003e🧵\u003c\/div\u003e\n      \u003cdiv class=\"success-title\"\u003eOrder Request Received!\u003c\/div\u003e\n      \u003cp class=\"success-body\"\u003eThank you! We've received your custom order request and will review it within 1–2 business days. Your personalized invoice will arrive at the email you provided.\u003cbr\u003e\u003cbr\u003eEvery stitch carries your story — we're honored to bring it to life for you.\u003c\/p\u003e\n    \u003c\/div\u003e\n\n    \u003cdiv class=\"crest-footer\"\u003e\n      \u003cp class=\"footer-text\"\u003eDD by Dani · Custom Greek Letter Apparel\u003cbr\u003eQuestions? Email us at distinctivedesignsbydani@gmail.com\u003c\/p\u003e\n    \u003c\/div\u003e\n  \u003c\/div\u003e\n\u003c\/div\u003e\n\n\u003cscript\u003e\n(function(){\n  const WEBHOOK_URL = 'https:\/\/flairdynamiq.app.n8n.cloud\/webhook\/ddbydani-order';\n\n  const GREEK = [\n    ['Α','Alpha'],['Β','Beta'],['Γ','Gamma'],['Δ','Delta'],['Ε','Epsilon'],\n    ['Ζ','Zeta'],['Η','Eta'],['Θ','Theta'],['Ι','Iota'],['Κ','Kappa'],\n    ['Λ','Lambda'],['Μ','Mu'],['Ν','Nu'],['Ξ','Xi'],['Ο','Omicron'],\n    ['Π','Pi'],['Ρ','Rho'],['Σ','Sigma'],['Τ','Tau'],['Υ','Upsilon'],\n    ['Φ','Phi'],['Χ','Chi'],['Ψ','Psi'],['Ω','Omega']\n  ];\n\n  const BASE_PRICES = { 'Classic Tee': 27.99, 'Long Sleeve': 30.99, 'Sweatshirt': 33.99, 'Hoodie': 37.99 };\n  const PRINT_PRICES = {\n    'None': 0, 'Add Name': 10, 'Add Number': 10, 'Add Sleeves': 10,\n    'Add Name \u0026 Number': 15, 'Add Name, Number \u0026 Sleeves': 20,\n    'Add Name, Number, Sleeves \u0026 Ship': 25\n  };\n  const EMB_PRICES = {\n    'None': 0, 'Add Name': 35, 'Add Number': 35, 'Add One Sleeve': 25,\n    'Add Both Sleeves': 45, 'Add Ship': 35, 'Add Name \u0026 Number': 70,\n    'Add Name, Number \u0026 Sleeves': 110, 'Line Name, Number, Sleeves \u0026 Ship': 135,\n  };\n\n  let itemCount = 0;\n\n  function buildItemCard(idx) {\n    const n = idx;\n    return `\n    \u003cdiv class=\"item-card\" id=\"item-card-${n}\"\u003e\n      \u003cdiv class=\"item-header\"\u003e\n        \u003cspan class=\"item-label\"\u003eItem ${n}\u003c\/span\u003e\n        ${n \u003e 1 ? `\u003cbutton type=\"button\" class=\"btn-remove-item\" onclick=\"removeItem(${n})\"\u003e✕ Remove\u003c\/button\u003e` : ''}\n      \u003c\/div\u003e\n      \u003cdiv class=\"item-body\"\u003e\n\n        \u003cdiv style=\"margin-bottom:20px;\"\u003e\n          \u003clabel style=\"display:block;font-size:1.5rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:8px;\"\u003eApparel Type \u003cspan class=\"req\"\u003e*\u003c\/span\u003e\u003c\/label\u003e\n          \u003cdiv class=\"option-grid cols-4\"\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_type\" id=\"it${n}_tee\" value=\"Classic Tee\" required checked\u003e\u003clabel for=\"it${n}_tee\"\u003eClassic Tee\u003cspan class=\"option-price\"\u003e$27.99\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_type\" id=\"it${n}_ls\" value=\"Long Sleeve\"\u003e\u003clabel for=\"it${n}_ls\"\u003eLong Sleeve\u003cspan class=\"option-price\"\u003e$30.99\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_type\" id=\"it${n}_sw\" value=\"Sweatshirt\"\u003e\u003clabel for=\"it${n}_sw\"\u003eSweatshirt\u003cspan class=\"option-price\"\u003e$33.99\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_type\" id=\"it${n}_hd\" value=\"Hoodie\"\u003e\u003clabel for=\"it${n}_hd\"\u003eHoodie\u003cspan class=\"option-price\"\u003e$37.99\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003chr class=\"item-divider\"\u003e\n\n        \u003cdiv class=\"field-row\" style=\"margin-bottom:14px;\"\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_apparel_color\"\u003eApparel Color\u003c\/label\u003e\n            \u003cselect name=\"item${n}_apparel_color\" id=\"item${n}_apparel_color\"\u003e\n              \u003coption value=\"\" disabled selected\u003e— Select color —\u003c\/option\u003e\n              \u003coption\u003eBlack\u003c\/option\u003e\u003coption\u003eWhite\u003c\/option\u003e\u003coption\u003eCream\u003c\/option\u003e\u003coption\u003eRoyal Blue\u003c\/option\u003e\u003coption\u003eRed\u003c\/option\u003e\n              \u003coption\u003ePink\u003c\/option\u003e\u003coption\u003eHot Pink\u003c\/option\u003e\n              \u003coption\u003eForest Green\u003c\/option\u003e\u003coption\u003eLight Green\u003c\/option\u003e\u003coption\u003ePurple\u003c\/option\u003e\u003coption\u003eGold\u003c\/option\u003e\n              \u003coption\u003eGray\u003c\/option\u003e\u003coption\u003eMaroon\u003c\/option\u003e\u003coption\u003eCharcoal\u003c\/option\u003e\n            \u003c\/select\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_letter_color\"\u003eLetters\/Number Color\u003c\/label\u003e\n            \u003cselect name=\"item${n}_letter_color\" id=\"item${n}_letter_color\"\u003e\n              \u003coption value=\"\" disabled selected\u003e— Select color —\u003c\/option\u003e\n              \u003coption\u003eWhite\u003c\/option\u003e\u003coption\u003eBlack\u003c\/option\u003e\u003coption\u003eGold\u003c\/option\u003e\u003coption\u003eGray\u003c\/option\u003e\n              \u003coption\u003eRed\u003c\/option\u003e\u003coption\u003eCrimson\u003c\/option\u003e\u003coption\u003eMaroon\u003c\/option\u003e\u003coption\u003eRoyal Blue\u003c\/option\u003e\n              \u003coption\u003ePink\u003c\/option\u003e\u003coption\u003eHot Pink\u003c\/option\u003e\u003coption\u003eForest Green\u003c\/option\u003e\u003coption\u003eLight Green\u003c\/option\u003e\n              \u003coption\u003ePurple\u003c\/option\u003e\u003coption\u003eTeal\u003c\/option\u003e\u003coption\u003eBurgundy\u003c\/option\u003e\u003coption\u003eOrange\u003c\/option\u003e\n              \u003coption\u003eTwo-color combo (describe in notes)\u003c\/option\u003e\u003coption\u003eOther (describe in notes)\u003c\/option\u003e\n            \u003c\/select\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003cdiv class=\"field-row\" style=\"margin-bottom:20px;\"\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_outline_color\"\u003eOutline Color of Letters\/Numbers\u003c\/label\u003e\n            \u003cselect name=\"item${n}_outline_color\" id=\"item${n}_outline_color\"\u003e\n              \u003coption value=\"\"\u003e— No outline —\u003c\/option\u003e\n              \u003coption\u003eWhite\u003c\/option\u003e\u003coption\u003eBlack\u003c\/option\u003e\u003coption\u003eGold\u003c\/option\u003e\u003coption\u003eGray\u003c\/option\u003e\n              \u003coption\u003eRed\u003c\/option\u003e\u003coption\u003eCrimson\u003c\/option\u003e\u003coption\u003eMaroon\u003c\/option\u003e\u003coption\u003eRoyal Blue\u003c\/option\u003e\n              \u003coption\u003ePink\u003c\/option\u003e\u003coption\u003eHot Pink\u003c\/option\u003e\u003coption\u003eForest Green\u003c\/option\u003e\u003coption\u003eLight Green\u003c\/option\u003e\n              \u003coption\u003ePurple\u003c\/option\u003e\u003coption\u003eTeal\u003c\/option\u003e\u003coption\u003eBurgundy\u003c\/option\u003e\u003coption\u003eOrange\u003c\/option\u003e\n              \u003coption\u003eOther (describe in notes)\u003c\/option\u003e\n            \u003c\/select\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003chr class=\"item-divider\"\u003e\n\n                \u003cdiv style=\"margin-bottom:20px;\"\u003e\n          \u003clabel style=\"display:block;font-size:0.92rem;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;\"\u003eSelect Your Letters \u003cspan style=\"font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0;font-size:0.84rem;\"\u003e(tap to add — up to 3, duplicates allowed)\u003c\/span\u003e\u003c\/label\u003e\n          \u003cp class=\"section-note\"\u003eTap each letter to add it to your selection. Tap again to add a duplicate (e.g. Alpha Alpha Alpha). Tap a selected letter to remove it.\u003c\/p\u003e\n          \u003cdiv class=\"greek-grid-lg\" id=\"lg-${n}\"\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Α (Alpha)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΑ\u003c\/span\u003e\u003cspan\u003eAlpha\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Β (Beta)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΒ\u003c\/span\u003e\u003cspan\u003eBeta\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Γ (Gamma)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΓ\u003c\/span\u003e\u003cspan\u003eGamma\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Δ (Delta)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΔ\u003c\/span\u003e\u003cspan\u003eDelta\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ε (Epsilon)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΕ\u003c\/span\u003e\u003cspan\u003eEpsilon\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ζ (Zeta)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΖ\u003c\/span\u003e\u003cspan\u003eZeta\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Η (Eta)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΗ\u003c\/span\u003e\u003cspan\u003eEta\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Θ (Theta)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΘ\u003c\/span\u003e\u003cspan\u003eTheta\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ι (Iota)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΙ\u003c\/span\u003e\u003cspan\u003eIota\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Κ (Kappa)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΚ\u003c\/span\u003e\u003cspan\u003eKappa\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Λ (Lambda)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΛ\u003c\/span\u003e\u003cspan\u003eLambda\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Μ (Mu)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΜ\u003c\/span\u003e\u003cspan\u003eMu\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ν (Nu)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΝ\u003c\/span\u003e\u003cspan\u003eNu\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ξ (Xi)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΞ\u003c\/span\u003e\u003cspan\u003eXi\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ο (Omicron)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΟ\u003c\/span\u003e\u003cspan\u003eOmicron\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Π (Pi)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΠ\u003c\/span\u003e\u003cspan\u003ePi\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ρ (Rho)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΡ\u003c\/span\u003e\u003cspan\u003eRho\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Σ (Sigma)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΣ\u003c\/span\u003e\u003cspan\u003eSigma\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Τ (Tau)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΤ\u003c\/span\u003e\u003cspan\u003eTau\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Υ (Upsilon)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΥ\u003c\/span\u003e\u003cspan\u003eUpsilon\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Φ (Phi)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΦ\u003c\/span\u003e\u003cspan\u003ePhi\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Χ (Chi)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΧ\u003c\/span\u003e\u003cspan\u003eChi\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ψ (Psi)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΨ\u003c\/span\u003e\u003cspan\u003ePsi\u003c\/span\u003e\u003c\/button\u003e\n            \u003cbutton type=\"button\" class=\"greek-btn\" data-letter=\"Ω (Omega)\" onclick=\"addLetter(${n},this)\"\u003e\u003cspan class=\"greek-sym\"\u003eΩ\u003c\/span\u003e\u003cspan\u003eOmega\u003c\/span\u003e\u003c\/button\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"letter-pills\" id=\"letter-pills-${n}\"\u003e\n            \u003cspan class=\"letter-pill-empty\"\u003eNo letters selected yet — tap to add\u003c\/span\u003e\n          \u003c\/div\u003e\n          \u003cinput type=\"hidden\" name=\"item${n}_letters\" id=\"item${n}_letters\" value=\"\"\u003e\n        \u003c\/div\u003e\u003c\/p\u003e\n        \u003c\/div\u003e\n\n        \u003chr class=\"item-divider\"\u003e\n\n        \u003cdiv style=\"margin-bottom:16px;\"\u003e\n          \u003clabel style=\"display:block;font-size:1.5rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;\"\u003eGreek Letter Application\u003c\/label\u003e\n          \u003cp class=\"section-note\"\u003eYour Greek letters are applied via \u003cstrong style=\"color:var(--gold-light);font-style:normal;\"\u003eappliqué\u003c\/strong\u003e — heat-applied for a clean, structured finish.\u003c\/p\u003e\n          \u003cdiv class=\"option-grid cols-4\" style=\"max-width:240px;\"\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_front_style\" id=\"fs${n}_app\" value=\"Center Front Appliqué\" checked\u003e\u003clabel for=\"fs${n}_app\"\u003eCenter Front\u003cspan class=\"option-price\"\u003eAppliqué\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003chr class=\"item-divider\"\u003e\n\n        \u003cdiv style=\"margin-bottom:20px;\"\u003e\n          \u003clabel style=\"display:block;font-size:1.5rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;\"\u003ePrinted Customization \u003cspan style=\"font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0;font-size:1.5rem;\"\u003e(choose one)\u003c\/span\u003e\u003c\/label\u003e\n          \u003cp class=\"section-note\"\u003eDirect print, heat applied — for names, numbers, sleeves, and ship name.\u003c\/p\u003e\n          \u003cdiv class=\"package-grid\"\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_none\" value=\"None\" checked\u003e\u003clabel for=\"pr${n}_none\"\u003eNone\u003cspan class=\"option-price\"\u003e+$0\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_name\" value=\"Add Name\"\u003e\u003clabel for=\"pr${n}_name\"\u003eAdd Name\u003cspan class=\"option-price\"\u003e+$10\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_num\" value=\"Add Number\"\u003e\u003clabel for=\"pr${n}_num\"\u003eAdd Number\u003cspan class=\"option-price\"\u003e+$10\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_slv\" value=\"Add Sleeves\"\u003e\u003clabel for=\"pr${n}_slv\"\u003eAdd Sleeves\u003cspan class=\"option-price\"\u003e+$10\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_nn\" value=\"Add Name \u0026 Number\"\u003e\u003clabel for=\"pr${n}_nn\"\u003eName \u0026amp; Number\u003cspan class=\"option-price\"\u003e+$15\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_nns\" value=\"Add Name, Number \u0026 Sleeves\"\u003e\u003clabel for=\"pr${n}_nns\"\u003eName, Number \u0026amp; Sleeves\u003cspan class=\"option-price\"\u003e+$20\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_printed\" id=\"pr${n}_full\" value=\"Add Name, Number, Sleeves \u0026 Ship\"\u003e\u003clabel for=\"pr${n}_full\"\u003eName, Number, Sleeves \u0026amp; Ship\u003cspan class=\"option-price\"\u003e+$25\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003cdiv style=\"margin-bottom:12px;\"\u003e\n          \u003clabel style=\"display:block;font-size:1.5rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin-bottom:6px;\"\u003eEmbroidery Customization \u003cspan style=\"font-weight:400;color:var(--text-muted);text-transform:none;letter-spacing:0;font-size:1.5rem;\"\u003e(choose one)\u003c\/span\u003e\u003c\/label\u003e\n          \u003cp class=\"section-note\"\u003eStitched embroidery — for names, numbers, sleeves, ship, and pictures.\u003c\/p\u003e\n          \u003cdiv class=\"package-grid\"\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_none\" value=\"None\" checked\u003e\u003clabel for=\"em${n}_none\"\u003eNone\u003cspan class=\"option-price\"\u003e+$0\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_name\" value=\"Add Name\"\u003e\u003clabel for=\"em${n}_name\"\u003eAdd Name\u003cspan class=\"option-price\"\u003e+$35\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_num\" value=\"Add Number\"\u003e\u003clabel for=\"em${n}_num\"\u003eAdd Number\u003cspan class=\"option-price\"\u003e+$35\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_onesleeve\" value=\"Add One Sleeve\"\u003e\u003clabel for=\"em${n}_onesleeve\"\u003eAdd One Sleeve\u003cspan class=\"option-price\"\u003e+$25\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_bothsleeves\" value=\"Add Both Sleeves\"\u003e\u003clabel for=\"em${n}_bothsleeves\"\u003eAdd Both Sleeves\u003cspan class=\"option-price\"\u003e+$45\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_ship\" value=\"Add Ship\"\u003e\u003clabel for=\"em${n}_ship\"\u003eAdd Ship\u003cspan class=\"option-price\"\u003e+$35\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_nn\" value=\"Add Name \u0026 Number\"\u003e\u003clabel for=\"em${n}_nn\"\u003eName \u0026amp; Number\u003cspan class=\"option-price\"\u003e+$70\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_nns\" value=\"Add Name, Number \u0026 Sleeves\"\u003e\u003clabel for=\"em${n}_nns\"\u003eName, Number \u0026amp; Sleeves\u003cspan class=\"option-price\"\u003e+$110\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n            \u003cdiv class=\"option-card\"\u003e\u003cinput type=\"radio\" name=\"item${n}_embroidery\" id=\"em${n}_full\" value=\"Line Name, Number, Sleeves \u0026 Ship\"\u003e\u003clabel for=\"em${n}_full\"\u003eName, Number, Sleeves \u0026amp; Ship\u003cspan class=\"option-price\"\u003e+$135\u003c\/span\u003e\u003c\/label\u003e\u003c\/div\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003chr class=\"item-divider\"\u003e\n\n        \u003cdiv class=\"field-row\" style=\"margin-bottom:14px;\"\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_size\"\u003eSize\u003c\/label\u003e\n            \u003cselect name=\"item${n}_size\" id=\"item${n}_size\"\u003e\n              \u003coption value=\"\" disabled selected\u003e— Select size —\u003c\/option\u003e\n              \u003coption\u003eS\u003c\/option\u003e\u003coption\u003eM\u003c\/option\u003e\u003coption\u003eL\u003c\/option\u003e\n              \u003coption\u003eXL\u003c\/option\u003e\u003coption\u003e2XL\u003c\/option\u003e\u003coption\u003e3XL\u003c\/option\u003e\n            \u003c\/select\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_qty\"\u003eQuantity\u003c\/label\u003e\n            \u003cinput type=\"number\" name=\"item${n}_qty\" id=\"item${n}_qty\" min=\"1\" max=\"50\" value=\"1\"\u003e\n          \u003c\/div\u003e\n        \u003c\/div\u003e\n\n        \u003chr class=\"item-divider\"\u003e\n\n        \u003cdiv class=\"customization-details\"\u003e\n          \u003cp class=\"section-note\"\u003eFill in only the fields that apply to your printed or embroidery selections.\u003c\/p\u003e\n          \u003cdiv class=\"field-row\"\u003e\n            \u003cdiv class=\"field-group\"\u003e\n              \u003clabel for=\"item${n}_line_name\"\u003eName\u003c\/label\u003e\n              \u003cinput type=\"text\" name=\"item${n}_line_name\" id=\"item${n}_line_name\" placeholder=\"e.g. Pearl #7\"\u003e\n            \u003c\/div\u003e\n            \u003cdiv class=\"field-group\"\u003e\n              \u003clabel for=\"item${n}_line_number\"\u003eNumber\u003c\/label\u003e\n              \u003cinput type=\"text\" name=\"item${n}_line_number\" id=\"item${n}_line_number\" placeholder=\"e.g. #4\"\u003e\n            \u003c\/div\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"field-row\"\u003e\n            \u003cdiv class=\"field-group\"\u003e\n              \u003clabel for=\"item${n}_left_sleeve\"\u003eLeft Sleeve Text\u003c\/label\u003e\n              \u003cinput type=\"text\" name=\"item${n}_left_sleeve\" id=\"item${n}_left_sleeve\" placeholder=\"e.g. Spring '25\"\u003e\n            \u003c\/div\u003e\n            \u003cdiv class=\"field-group\"\u003e\n              \u003clabel for=\"item${n}_right_sleeve\"\u003eRight Sleeve Text\u003c\/label\u003e\n              \u003cinput type=\"text\" name=\"item${n}_right_sleeve\" id=\"item${n}_right_sleeve\" placeholder=\"e.g. Delta Chapter\"\u003e\n            \u003c\/div\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_ship_name\"\u003eShip Name\u003c\/label\u003e\n            \u003cinput type=\"text\" name=\"item${n}_ship_name\" id=\"item${n}_ship_name\" placeholder=\"e.g. The Phoenixes\"\u003e\n          \u003c\/div\u003e\n          \u003cdiv class=\"field-group\"\u003e\n            \u003clabel for=\"item${n}_more_info\"\u003eAdditional Details\u003c\/label\u003e\n            \u003ctextarea name=\"item${n}_more_info\" id=\"item${n}_more_info\" placeholder=\"Any special instructions, font preferences, placement notes, or other details for this item...\"\u003e\u003c\/textarea\u003e\n          \u003c\/div\u003e\n        \u003cdiv class=\"item-estimated-total\" id=\"item-total-${n}\"\u003e\n          \u003cspan class=\"iet-label\"\u003e✦ Estimated Item Total\u003c\/span\u003e\n          \u003cspan class=\"iet-amount\" id=\"iet-amount-${n}\"\u003e—\u003c\/span\u003e\n          \u003cspan class=\"iet-note\"\u003eFinal price confirmed on invoice · Shipping calculated separately\u003c\/span\u003e\n        \u003c\/div\u003e\n\n      \u003c\/div\u003e\n    \u003c\/div\u003e`;\n  }\n\n  function addItem() {\n    itemCount++;\n    const container = document.getElementById('itemsContainer');\n    const div = document.createElement('div');\n    div.innerHTML = buildItemCard(itemCount);\n    container.appendChild(div.firstElementChild);\n    wireItemListeners(itemCount);\n    updateSummary();\n  }\n\n  window.removeItem = function(n) {\n    const card = document.getElementById('item-card-' + n);\n    if (card) card.remove();\n    updateSummary();\n  };\n\n  function renderPills(n, sel) {\n    const container = document.getElementById('letter-pills-' + n);\n    if (!container) return;\n    if (!sel.length) {\n      container.innerHTML = '\u003cspan class=\"letter-pill-empty\"\u003eNo letters selected yet — tap to add\u003c\/span\u003e';\n      return;\n    }\n    container.innerHTML = sel.map((letter, i) =\u003e\n      `\u003cspan class=\"letter-pill\"\u003e${letter} \u003cbutton type=\"button\" class=\"pill-remove\" onclick=\"removeLetter(${n},${i})\" title=\"Remove\"\u003e✕\u003c\/button\u003e\u003c\/span\u003e`\n    ).join('');\n    \/\/ Update button selected state\n    const card = document.getElementById('item-card-' + n);\n    if (card) card.querySelectorAll('.greek-btn').forEach(b =\u003e {\n      b.classList.toggle('selected', sel.includes(b.dataset.letter));\n    });\n  }\n\n  window.addLetter = function(n, btn) {\n    const card = document.getElementById('item-card-' + n);\n    if (!card) return;\n    let sel = card.dataset.letters ? card.dataset.letters.split('||').filter(Boolean) : [];\n    if (sel.length \u003e= 3) return; \/\/ max 3\n    sel.push(btn.dataset.letter);\n    card.dataset.letters = sel.join('||');\n    const inp = document.getElementById('item' + n + '_letters');\n    if (inp) inp.value = sel.join(', ');\n    renderPills(n, sel);\n    updateSummary();\n  };\n\n  window.removeLetter = function(n, idx) {\n    const card = document.getElementById('item-card-' + n);\n    if (!card) return;\n    let sel = card.dataset.letters ? card.dataset.letters.split('||').filter(Boolean) : [];\n    sel.splice(idx, 1);\n    card.dataset.letters = sel.join('||');\n    const inp = document.getElementById('item' + n + '_letters');\n    if (inp) inp.value = sel.join(', ');\n    renderPills(n, sel);\n    updateSummary();\n  };\n\n  function wireItemListeners(n) {\n\n    document.querySelectorAll(`#item-card-${n} input:not([type=\"file\"]), #item-card-${n} select, #item-card-${n} textarea`)\n      .forEach(el =\u003e {\n        el.addEventListener('change', updateSummary);\n        if (['text','email','tel','number'].includes(el.type)) el.addEventListener('input', updateSummary);\n      });\n  }\n\n  function updateSummary() {\n    const getVal = id =\u003e { const el = document.getElementById(id); return el ? el.value.trim() : ''; };\n    const set = (id, val) =\u003e {\n      const el = document.getElementById(id);\n      if (!el) return;\n      el.innerHTML = val ? `\u003cspan\u003e${val}\u003c\/span\u003e` : '\u003cem class=\"empty\"\u003e—\u003c\/em\u003e';\n    };\n\n    const summaryEl = document.getElementById('itemsSummary');\n    if (summaryEl) {\n      const cards = document.querySelectorAll('.item-card');\n      let grandTotal = 0;\n      summaryEl.innerHTML = [...cards].map(card =\u003e {\n        const id = card.id.replace('item-card-', '');\n        const typeEl = card.querySelector(`[name=\"item${id}_type\"]:checked`);\n        const type = typeEl?.value || '—';\n        const lettersRaw = card.dataset.letters || '';\n        const letters = lettersRaw ? lettersRaw.split('||').join(' · ') : '—';\n        const appColor = card.querySelector(`[name=\"item${id}_apparel_color\"]`)?.value || '—';\n        const letColor = card.querySelector(`[name=\"item${id}_letter_color\"]`)?.value || '—';\n        const outColor = card.querySelector(`[name=\"item${id}_outline_color\"]`)?.value || 'None';\n        const size = card.querySelector(`[name=\"item${id}_size\"]`)?.value || '—';\n        const qty = card.querySelector(`[name=\"item${id}_qty\"]`)?.value || '1';\n        const printedSel = card.querySelector(`[name=\"item${id}_printed\"]:checked`)?.value || 'None';\n        const embroiderySel = card.querySelector(`[name=\"item${id}_embroidery\"]:checked`)?.value || 'None';\n\n        let itemTotal = BASE_PRICES[type] || 0;\n        itemTotal += PRINT_PRICES[printedSel] || 0;\n        itemTotal += EMB_PRICES[embroiderySel] || 0;\n        const itemEst = itemTotal * parseInt(qty);\n        grandTotal += itemEst;\n        const amtEl = document.getElementById('iet-amount-' + id);\n        if (amtEl) amtEl.textContent = itemEst \u003e 0 ? '$' + itemEst.toFixed(2) : '—';\n\n        return `\u003cdiv class=\"item-summary-block\"\u003e\n          \u003cdiv class=\"item-summary-label\"\u003eItem ${id}\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eType\u003c\/span\u003e\u003cspan\u003e${type}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eLetters\u003c\/span\u003e\u003cspan style=\"font-family:'Playfair Display',serif;\"\u003e${letters}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eApparel Color\u003c\/span\u003e\u003cspan\u003e${appColor}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eLetters\/Number Color\u003c\/span\u003e\u003cspan\u003e${letColor}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eOutline Color\u003c\/span\u003e\u003cspan\u003e${outColor}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eSize · Qty\u003c\/span\u003e\u003cspan\u003e${size} · ${qty}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003ePrinted\u003c\/span\u003e\u003cspan\u003e${printedSel}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eEmbroidery\u003c\/span\u003e\u003cspan\u003e${embroiderySel}\u003c\/span\u003e\u003c\/div\u003e\n          \u003cdiv class=\"item-summary-line\"\u003e\u003cspan style=\"color:var(--text-muted);font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;\"\u003eItem Est.\u003c\/span\u003e\u003cspan\u003e$${itemEst.toFixed(2)}\u003c\/span\u003e\u003c\/div\u003e\n        \u003c\/div\u003e`;\n      }).join('');\n\n      const grandEl = document.getElementById('sum-grand-total');\n      if (grandEl) grandEl.textContent = grandTotal \u003e 0 ? '$' + grandTotal.toFixed(2) : '—';\n    }\n\n    set('sum-name', getVal('customer_name'));\n    const neededByVal = getVal('needed_by');\n    set('sum-needed', neededByVal ? new Date(neededByVal + 'T00:00:00').toLocaleDateString('en-US', {weekday:'short',year:'numeric',month:'short',day:'numeric'}) : null);\n    const shipEl = document.getElementById('sum-ship');\n    if (shipEl) {\n      const street = getVal('ship_address');\n      const city = getVal('ship_city'), state = getVal('ship_state'), zip = getVal('ship_zip');\n      const line2 = [city, state, zip, getVal('ship_country')].filter(Boolean).join(', ');\n      const full = [street, line2].filter(Boolean).join('\u003cbr\u003e');\n      shipEl.innerHTML = full ? `\u003cspan style=\"text-align:right;display:inline-block;line-height:1.6;\"\u003e${full}\u003c\/span\u003e` : '\u003cem class=\"empty\"\u003e—\u003c\/em\u003e';\n    }\n  }\n\n  function wireSharedListeners() {\n    document.querySelectorAll('#customer_name,#customer_email,#customer_phone,#ship_name,#ship_address,#ship_city,#ship_state,#ship_zip,#ship_country,#notes')\n      .forEach(el =\u003e { el.addEventListener('change', updateSummary); el.addEventListener('input', updateSummary); });\n    const neededBy = document.getElementById('needed_by');\n    const rushWarning = document.getElementById('rushWarning');\n    if (neededBy) {\n      neededBy.min = new Date().toISOString().split('T')[0];\n      neededBy.addEventListener('change', function() {\n        if (!this.value) { rushWarning.classList.remove('visible'); return; }\n        const selected = new Date(this.value + 'T00:00:00');\n        const now = new Date(); now.setHours(0,0,0,0);\n        let bizDays = 0, d = new Date(now);\n        while (d \u003c selected) {\n          d.setDate(d.getDate() + 1);\n          if (d.getDay() !== 0 \u0026\u0026 d.getDay() !== 6) bizDays++;\n        }\n        bizDays \u003c 7 ? rushWarning.classList.add('visible') : rushWarning.classList.remove('visible');\n        updateSummary();\n      });\n    }\n  }\n\n  const form = document.getElementById('mpCrestForm');\n  const btn = document.getElementById('submitBtn');\n  const err = document.getElementById('formError');\n  const suc = document.getElementById('mpSuccess');\n\n  form.addEventListener('submit', async function(e) {\n    e.preventDefault();\n    err.classList.remove('visible');\n    btn.disabled = true;\n    btn.textContent = 'Submitting…';\n\n    const items = [];\n    document.querySelectorAll('.item-card').forEach(card =\u003e {\n      const id = card.id.replace('item-card-', '');\n      items.push({\n        item: id,\n        apparel_type: card.querySelector(`[name=\"item${id}_type\"]:checked`)?.value || '',\n        apparel_color: card.querySelector(`[name=\"item${id}_apparel_color\"]`)?.value || '',\n        letter_color: card.querySelector(`[name=\"item${id}_letter_color\"]`)?.value || '',\n        outline_color: card.querySelector(`[name=\"item${id}_outline_color\"]`)?.value || 'None',\n        letters: (card.dataset.letters || '').split('||').filter(Boolean).join(', ') || 'None',\n        size: card.querySelector(`[name=\"item${id}_size\"]`)?.value || '',\n        quantity: card.querySelector(`[name=\"item${id}_qty\"]`)?.value || '1',\n        printed_customization: card.querySelector(`[name=\"item${id}_printed\"]:checked`)?.value || 'None',\n        embroidery_customization: card.querySelector(`[name=\"item${id}_embroidery\"]:checked`)?.value || 'None',\n        name_text: card.querySelector(`[name=\"item${id}_line_name\"]`)?.value || '',\n        number_text: card.querySelector(`[name=\"item${id}_line_number\"]`)?.value || '',\n        left_sleeve: card.querySelector(`[name=\"item${id}_left_sleeve\"]`)?.value || '',\n        right_sleeve: card.querySelector(`[name=\"item${id}_right_sleeve\"]`)?.value || '',\n        ship_name_text: card.querySelector(`[name=\"item${id}_ship_name\"]`)?.value || '',\n        picture_details: card.querySelector(`[name=\"item${id}_more_info\"]`)?.value || ''\n      });\n    });\n\n    const payload = {\n      customer_name: document.getElementById('customer_name')?.value || '',\n      customer_email: document.getElementById('customer_email')?.value || '',\n      customer_phone: document.getElementById('customer_phone')?.value || '',\n      needed_by: document.getElementById('needed_by')?.value || '',\n      ship_to_name: document.getElementById('ship_name')?.value || '',\n      ship_address: document.getElementById('ship_address')?.value || '',\n      ship_city: document.getElementById('ship_city')?.value || '',\n      ship_state: document.getElementById('ship_state')?.value || '',\n      ship_zip: document.getElementById('ship_zip')?.value || '',\n      ship_country: document.getElementById('ship_country')?.value || 'United States',\n      notes: document.getElementById('notes')?.value || '',\n      items\n    };\n\n    try {\n      const res = await fetch(WEBHOOK_URL, {\n        method: 'POST',\n        headers: { 'Content-Type': 'application\/json', 'Accept': 'application\/json' },\n        body: JSON.stringify(payload)\n      });\n      if (res.ok) {\n        form.style.display = 'none';\n        suc.classList.add('visible');\n        window.scrollTo({ top: 0, behavior: 'smooth' });\n      } else {\n        const data = await res.json();\n        throw new Error(data?.errors?.map(e =\u003e e.message).join(', ') || 'Submission failed');\n      }\n    } catch(e) {\n      btn.disabled = false;\n      btn.textContent = 'Submit Your Custom Order';\n      err.textContent = 'Something went wrong. Please email distinctivedesignsbydani@gmail.com directly.';\n      err.classList.add('visible');\n    }\n  });\n\n  document.getElementById('addItemBtn').addEventListener('click', addItem);\n  wireSharedListeners();\n  addItem();\n\n})();\n\u003c\/script\u003e","products":[],"url":"https:\/\/ddbydani.com\/collections\/custom-greek-apparel.oembed","provider":"Distinctive Designs by Dani","version":"1.0","type":"link"}